/* ============================================================
   AI1DESIGN — FULL NON-HOMEPAGE CSS
   ------------------------------------------------------------
   Combined CSS for recreated pages.

   Includes:
   - Contact / FAQ / Privacy / Terms where available
   - Thank You
   - Web Design
   - Business Branding
   - Logo Design
   - Digital Design
   - Social Media
   - SEO Management
   - Website Maintenance & Management
   - Joomla Websites
   - AI1Host Service Page

   Notes:
   - Homepage CSS should stay separate.
   - Each page uses its own namespace/prefix to avoid conflicts.
   - Load this stylesheet on non-homepage pages only.
============================================================ */



/* ============================================================
   IMPORTED: inner-pages-with-terms.css
============================================================ */


.ai1terms-hero{
  position:relative;
  min-height:70vh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:linear-gradient(135deg,#07111f,#102b4d,#111827);
}

.ai1terms-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.25), transparent 30%),
    radial-gradient(circle at bottom right, rgba(0,183,255,.25), transparent 30%);
}

.ai1terms-inner{
  position:relative;
  z-index:2;
  width:min(1100px, calc(100% - 40px));
}

.ai1terms-card{
  padding:4rem;
  border-radius:30px;
  color:#fff;
  text-align:center;
  backdrop-filter:blur(14px);
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
}

.ai1terms-kicker{
  display:inline-block;
  padding:.7rem 1.2rem;
  border-radius:999px;
  font-weight:800;
  background:linear-gradient(90deg,#39ff14,#00cfff,#ff7b00);
  color:#07111f;
}

.ai1terms-content{
  padding:5rem 1.5rem;
  background:#0d1625;
}

.ai1terms-sheet{
  width:min(1000px,100%);
  margin:auto;
  padding:3rem;
  border-radius:30px;
  color:#fff;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}

.ai1terms-sheet h2{
  margin-top:2rem;
}



/* ============================================================
   IMPORTED: thank-you-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — THANK YOU PAGE
   Page-specific classes: ai1thanks-*
============================================================ */

.ai1thanks-hero,
.ai1thanks-hero *,
.ai1thanks-hero *::before,
.ai1thanks-hero *::after,
.ai1thanks-next,
.ai1thanks-next *,
.ai1thanks-next *::before,
.ai1thanks-next *::after{
  box-sizing: border-box;
}

.ai1thanks-hero{
  position: relative;
  width: 100%;
  min-height: 86vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1thanks-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1thanks-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.24), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.22), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.86));
}

.ai1thanks-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 86vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7rem 1.5rem 5rem;
}

.ai1thanks-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(980px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1thanks-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1thanks-kicker,
.ai1thanks-next-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 auto 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1thanksGradient 8s linear infinite;
}

.ai1thanks-hero-card h1{
  max-width: 850px;
  margin: 0 auto 1rem;
  font-size: clamp(2.5rem, 6vw, 5rem);
  line-height: 1.04;
  font-weight: 850;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1thanksGradient 8s linear infinite, ai1thanksGlow 4s ease-in-out infinite;
}

.ai1thanks-lead{
  max-width: 760px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1thanks-hero-card p:not(.ai1thanks-kicker):not(.ai1thanks-lead){
  max-width: 760px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1thanks-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1thanks-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1thanks-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1thanks-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1thanksGradient 7s linear infinite;
}

.ai1thanks-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1thanks-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1thanks-next{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1thanks-next::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1thanks-next-wrap{
  position: relative;
  z-index: 2;
  width: min(1180px, calc(100% - 60px));
  margin: 0 auto;
}

.ai1thanks-next-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  padding: clamp(2rem, 4vw, 3.5rem);
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  text-align: center;
}

.ai1thanks-next-card h2{
  margin: 0 0 2rem;
  font-size: clamp(2.15rem, 4vw, 3.7rem);
  line-height: 1.03;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1thanksGradientWide 10s linear infinite;
}

.ai1thanks-steps{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.2rem;
}

.ai1thanks-step{
  position: relative;
  overflow: hidden;
  min-height: 220px;
  padding: 1.45rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1thanks-step:hover{
  transform: translateY(-9px) scale(1.025);
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.48);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1thanks-step span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 auto 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1thanks-step h3{
  margin: 0 0 .7rem;
  color: #fff;
  font-size: 1.22rem;
  line-height: 1.15;
}

.ai1thanks-step p{
  margin: 0;
  color: rgba(255,255,255,.90);
  line-height: 1.6;
}

@keyframes ai1thanksGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1thanksGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1thanksGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.20))
      drop-shadow(0 0 18px rgba(0,183,255,.12))
      drop-shadow(0 0 28px rgba(255,123,0,.10));
  }
  50%{
    filter:
      drop-shadow(0 0 14px rgba(57,255,20,.38))
      drop-shadow(0 0 30px rgba(0,183,255,.24))
      drop-shadow(0 0 40px rgba(255,123,0,.20));
  }
}

@media (max-width: 900px){
  .ai1thanks-steps{
    grid-template-columns: 1fr;
  }

  .ai1thanks-next-wrap{
    width: calc(100% - 28px);
  }
}

@media (max-width: 768px){
  .ai1thanks-hero{
    min-height: auto;
  }

  .ai1thanks-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1thanks-hero-card{
    border-radius: 22px;
  }

  .ai1thanks-actions{
    flex-direction: column;
  }

  .ai1thanks-btn{
    width: 100%;
  }
}

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



/* ============================================================
   IMPORTED: web-design-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — WEB DESIGN SERVICE PAGE
   Page-specific classes: ai1webdesign-*
============================================================ */

.ai1webdesign-hero,
.ai1webdesign-hero *,
.ai1webdesign-hero *::before,
.ai1webdesign-hero *::after,
.ai1webdesign-details,
.ai1webdesign-details *,
.ai1webdesign-details *::before,
.ai1webdesign-details *::after{
  box-sizing: border-box;
}

.ai1webdesign-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1webdesign-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1webdesign-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1webdesign-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1webdesign-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1webdesign-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1webdesign-kicker,
.ai1webdesign-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1webdesignGradient 8s linear infinite;
}

.ai1webdesign-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1webdesign-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1webdesignGradient 8s linear infinite, ai1webdesignGlow 4s ease-in-out infinite;
}

.ai1webdesign-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1webdesign-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1webdesign-hero-card p:not(.ai1webdesign-kicker):not(.ai1webdesign-lead):not(.ai1webdesign-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1webdesign-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1webdesign-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1webdesign-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1webdesign-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1webdesign-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1webdesignGradient 7s linear infinite;
}

.ai1webdesign-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1webdesign-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1webdesign-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1webdesign-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1webdesign-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1webdesignOrb 14s linear infinite;
}

.ai1webdesign-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1webdesign-main-card,
.ai1webdesign-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1webdesign-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1webdesign-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1webdesign-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1webdesign-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1webdesign-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1webdesign-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1webdesign-main-card h2,
.ai1webdesign-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1webdesignGradientWide 10s linear infinite, ai1webdesignGlow 5s ease-in-out infinite;
}

.ai1webdesign-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1webdesign-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1webdesign-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1webdesign-main-card a,
.ai1webdesign-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1webdesign-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1webdesign-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1webdesign-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1webdesign-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1webdesign-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1webdesign-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1webdesign-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1webdesign-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1webdesignGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1webdesignGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1webdesignGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1webdesignOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1webdesign-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1webdesign-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1webdesign-hero{
    min-height: auto;
  }

  .ai1webdesign-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1webdesign-hero-card{
    border-radius: 22px;
  }

  .ai1webdesign-actions{
    flex-direction: column;
  }

  .ai1webdesign-btn{
    width: 100%;
  }

  .ai1webdesign-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1webdesign-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: business-branding-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — BUSINESS BRANDING SERVICE PAGE
   Page-specific classes: ai1branding-*
============================================================ */

.ai1branding-hero,
.ai1branding-hero *,
.ai1branding-hero *::before,
.ai1branding-hero *::after,
.ai1branding-details,
.ai1branding-details *,
.ai1branding-details *::before,
.ai1branding-details *::after{
  box-sizing: border-box;
}

.ai1branding-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1branding-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1branding-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1branding-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1branding-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1branding-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1branding-kicker,
.ai1branding-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1brandingGradient 8s linear infinite;
}

.ai1branding-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1branding-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1brandingGradient 8s linear infinite, ai1brandingGlow 4s ease-in-out infinite;
}

.ai1branding-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1branding-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1branding-hero-card p:not(.ai1branding-kicker):not(.ai1branding-lead):not(.ai1branding-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1branding-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1branding-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1branding-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1branding-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1branding-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1brandingGradient 7s linear infinite;
}

.ai1branding-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1branding-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1branding-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1branding-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1branding-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1brandingOrb 14s linear infinite;
}

.ai1branding-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1branding-main-card,
.ai1branding-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1branding-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1branding-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1branding-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1branding-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1branding-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1branding-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1branding-main-card h2,
.ai1branding-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1brandingGradientWide 10s linear infinite, ai1brandingGlow 5s ease-in-out infinite;
}

.ai1branding-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1branding-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1branding-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1branding-main-card a,
.ai1branding-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1branding-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1branding-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1branding-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1branding-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1branding-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1branding-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1branding-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1branding-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1brandingGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1brandingGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1brandingGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1brandingOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1branding-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1branding-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1branding-hero{
    min-height: auto;
  }

  .ai1branding-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1branding-hero-card{
    border-radius: 22px;
  }

  .ai1branding-actions{
    flex-direction: column;
  }

  .ai1branding-btn{
    width: 100%;
  }

  .ai1branding-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1branding-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: logo-design-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — LOGO DESIGN SERVICE PAGE
   Page-specific classes: ai1logo-*
============================================================ */

.ai1logo-hero,
.ai1logo-hero *,
.ai1logo-hero *::before,
.ai1logo-hero *::after,
.ai1logo-details,
.ai1logo-details *,
.ai1logo-details *::before,
.ai1logo-details *::after{
  box-sizing: border-box;
}

.ai1logo-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1logo-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1logo-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1logo-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1logo-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1logo-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1logo-kicker,
.ai1logo-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1logoGradient 8s linear infinite;
}

.ai1logo-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1logo-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1logoGradient 8s linear infinite, ai1logoGlow 4s ease-in-out infinite;
}

.ai1logo-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1logo-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1logo-hero-card p:not(.ai1logo-kicker):not(.ai1logo-lead):not(.ai1logo-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1logo-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1logo-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1logo-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1logo-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1logo-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1logoGradient 7s linear infinite;
}

.ai1logo-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1logo-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1logo-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1logo-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1logo-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1logoOrb 14s linear infinite;
}

.ai1logo-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1logo-main-card,
.ai1logo-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1logo-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1logo-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1logo-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1logo-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1logo-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1logo-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1logo-main-card h2,
.ai1logo-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1logoGradientWide 10s linear infinite, ai1logoGlow 5s ease-in-out infinite;
}

.ai1logo-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1logo-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1logo-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1logo-main-card a,
.ai1logo-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1logo-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1logo-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1logo-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1logo-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1logo-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1logo-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1logo-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1logo-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1logoGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1logoGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1logoGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1logoOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1logo-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1logo-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1logo-hero{
    min-height: auto;
  }

  .ai1logo-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1logo-hero-card{
    border-radius: 22px;
  }

  .ai1logo-actions{
    flex-direction: column;
  }

  .ai1logo-btn{
    width: 100%;
  }

  .ai1logo-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1logo-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: digital-design-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — DIGITAL DESIGN SERVICE PAGE
   Page-specific classes: ai1digital-*
============================================================ */

.ai1digital-hero,
.ai1digital-hero *,
.ai1digital-hero *::before,
.ai1digital-hero *::after,
.ai1digital-details,
.ai1digital-details *,
.ai1digital-details *::before,
.ai1digital-details *::after{
  box-sizing: border-box;
}

.ai1digital-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1digital-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1digital-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1digital-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1digital-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1digital-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1digital-kicker,
.ai1digital-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1digitalGradient 8s linear infinite;
}

.ai1digital-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1digital-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1digitalGradient 8s linear infinite, ai1digitalGlow 4s ease-in-out infinite;
}

.ai1digital-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1digital-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1digital-hero-card p:not(.ai1digital-kicker):not(.ai1digital-lead):not(.ai1digital-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1digital-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1digital-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1digital-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1digital-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1digital-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1digitalGradient 7s linear infinite;
}

.ai1digital-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1digital-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1digital-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1digital-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1digital-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1digitalOrb 14s linear infinite;
}

.ai1digital-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1digital-main-card,
.ai1digital-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1digital-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1digital-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1digital-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1digital-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1digital-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1digital-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1digital-main-card h2,
.ai1digital-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1digitalGradientWide 10s linear infinite, ai1digitalGlow 5s ease-in-out infinite;
}

.ai1digital-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1digital-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1digital-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1digital-main-card a,
.ai1digital-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1digital-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1digital-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1digital-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1digital-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1digital-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1digital-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1digital-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1digital-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1digitalGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1digitalGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1digitalGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1digitalOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1digital-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1digital-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1digital-hero{
    min-height: auto;
  }

  .ai1digital-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1digital-hero-card{
    border-radius: 22px;
  }

  .ai1digital-actions{
    flex-direction: column;
  }

  .ai1digital-btn{
    width: 100%;
  }

  .ai1digital-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1digital-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: social-media-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — SOCIAL MEDIA SERVICE PAGE
   Page-specific classes: ai1social-*
============================================================ */

.ai1social-hero,
.ai1social-hero *,
.ai1social-hero *::before,
.ai1social-hero *::after,
.ai1social-details,
.ai1social-details *,
.ai1social-details *::before,
.ai1social-details *::after{
  box-sizing: border-box;
}

.ai1social-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1social-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1social-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1social-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1social-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1social-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1social-kicker,
.ai1social-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1socialGradient 8s linear infinite;
}

.ai1social-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1social-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1socialGradient 8s linear infinite, ai1socialGlow 4s ease-in-out infinite;
}

.ai1social-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1social-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1social-hero-card p:not(.ai1social-kicker):not(.ai1social-lead):not(.ai1social-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1social-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1social-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1social-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1social-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1social-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1socialGradient 7s linear infinite;
}

.ai1social-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1social-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1social-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1social-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1social-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1socialOrb 14s linear infinite;
}

.ai1social-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1social-main-card,
.ai1social-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1social-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1social-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1social-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1social-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1social-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1social-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1social-main-card h2,
.ai1social-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1socialGradientWide 10s linear infinite, ai1socialGlow 5s ease-in-out infinite;
}

.ai1social-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1social-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1social-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1social-main-card a,
.ai1social-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1social-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1social-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1social-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1social-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1social-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1social-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1social-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1social-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1socialGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1socialGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1socialGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1socialOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1social-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1social-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1social-hero{
    min-height: auto;
  }

  .ai1social-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1social-hero-card{
    border-radius: 22px;
  }

  .ai1social-actions{
    flex-direction: column;
  }

  .ai1social-btn{
    width: 100%;
  }

  .ai1social-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1social-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: seo-management-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — SEO MANAGEMENT SERVICE PAGE
   Page-specific classes: ai1seo-*
============================================================ */

.ai1seo-hero,
.ai1seo-hero *,
.ai1seo-hero *::before,
.ai1seo-hero *::after,
.ai1seo-details,
.ai1seo-details *,
.ai1seo-details *::before,
.ai1seo-details *::after{
  box-sizing: border-box;
}

.ai1seo-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1seo-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1seo-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1seo-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1seo-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1seo-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1seo-kicker,
.ai1seo-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1seoGradient 8s linear infinite;
}

.ai1seo-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1seo-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1seoGradient 8s linear infinite, ai1seoGlow 4s ease-in-out infinite;
}

.ai1seo-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 820px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1seo-lead{
  max-width: 800px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1seo-hero-card p:not(.ai1seo-kicker):not(.ai1seo-lead):not(.ai1seo-signoff){
  max-width: 820px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1seo-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1seo-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1seo-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1seo-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1seo-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1seoGradient 7s linear infinite;
}

.ai1seo-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1seo-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1seo-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1seo-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1seo-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1seoOrb 14s linear infinite;
}

.ai1seo-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1seo-main-card,
.ai1seo-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1seo-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1seo-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1seo-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1seo-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1seo-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1seo-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1seo-main-card h2,
.ai1seo-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1seoGradientWide 10s linear infinite, ai1seoGlow 5s ease-in-out infinite;
}

.ai1seo-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1seo-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1seo-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1seo-main-card a,
.ai1seo-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1seo-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1seo-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1seo-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1seo-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1seo-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1seo-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1seo-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1seo-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1seoGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1seoGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1seoGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1seoOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1seo-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1seo-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1seo-hero{
    min-height: auto;
  }

  .ai1seo-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1seo-hero-card{
    border-radius: 22px;
  }

  .ai1seo-actions{
    flex-direction: column;
  }

  .ai1seo-btn{
    width: 100%;
  }

  .ai1seo-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1seo-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: website-maintenance-management-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — WEBSITE MAINTENANCE & MANAGEMENT SERVICE PAGE
   Page-specific classes: ai1maintenance-*
============================================================ */

.ai1maintenance-hero,
.ai1maintenance-hero *,
.ai1maintenance-hero *::before,
.ai1maintenance-hero *::after,
.ai1maintenance-details,
.ai1maintenance-details *,
.ai1maintenance-details *::before,
.ai1maintenance-details *::after{
  box-sizing: border-box;
}

.ai1maintenance-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1maintenance-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1maintenance-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1maintenance-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1maintenance-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1maintenance-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1maintenance-kicker,
.ai1maintenance-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1maintenanceGradient 8s linear infinite;
}

.ai1maintenance-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1maintenance-hero-card h1{
  max-width: 980px;
  margin: 0 auto .85rem;
  font-size: clamp(2.45rem, 6vw, 5.1rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1maintenanceGradient 8s linear infinite, ai1maintenanceGlow 4s ease-in-out infinite;
}

.ai1maintenance-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 860px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.35rem, 3vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1maintenance-lead{
  max-width: 820px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1maintenance-hero-card p:not(.ai1maintenance-kicker):not(.ai1maintenance-lead):not(.ai1maintenance-signoff){
  max-width: 840px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1maintenance-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1maintenance-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1maintenance-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1maintenance-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1maintenance-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1maintenanceGradient 7s linear infinite;
}

.ai1maintenance-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1maintenance-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1maintenance-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1maintenance-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1maintenance-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1maintenanceOrb 14s linear infinite;
}

.ai1maintenance-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1maintenance-main-card,
.ai1maintenance-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1maintenance-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1maintenance-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1maintenance-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1maintenance-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1maintenance-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1maintenance-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1maintenance-main-card h2,
.ai1maintenance-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1maintenanceGradientWide 10s linear infinite, ai1maintenanceGlow 5s ease-in-out infinite;
}

.ai1maintenance-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1maintenance-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1maintenance-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1maintenance-main-card a,
.ai1maintenance-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1maintenance-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1maintenance-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1maintenance-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1maintenance-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1maintenance-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1maintenance-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1maintenance-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1maintenance-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1maintenanceGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1maintenanceGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1maintenanceGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1maintenanceOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1maintenance-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1maintenance-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1maintenance-hero{
    min-height: auto;
  }

  .ai1maintenance-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1maintenance-hero-card{
    border-radius: 22px;
  }

  .ai1maintenance-actions{
    flex-direction: column;
  }

  .ai1maintenance-btn{
    width: 100%;
  }

  .ai1maintenance-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1maintenance-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: joomla-websites-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — JOOMLA WEBSITES SERVICE PAGE
   Page-specific classes: ai1joomla-*
============================================================ */

.ai1joomla-hero,
.ai1joomla-hero *,
.ai1joomla-hero *::before,
.ai1joomla-hero *::after,
.ai1joomla-details,
.ai1joomla-details *,
.ai1joomla-details *::before,
.ai1joomla-details *::after{
  box-sizing: border-box;
}

.ai1joomla-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1joomla-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1joomla-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1joomla-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1joomla-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1joomla-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1joomla-kicker,
.ai1joomla-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1joomlaGradient 8s linear infinite;
}

.ai1joomla-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1joomla-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1joomlaGradient 8s linear infinite, ai1joomlaGlow 4s ease-in-out infinite;
}

.ai1joomla-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 860px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.35rem, 3vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1joomla-lead{
  max-width: 820px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1joomla-hero-card p:not(.ai1joomla-kicker):not(.ai1joomla-lead):not(.ai1joomla-signoff){
  max-width: 840px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1joomla-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1joomla-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1joomla-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1joomla-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1joomla-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1joomlaGradient 7s linear infinite;
}

.ai1joomla-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1joomla-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1joomla-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1joomla-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1joomla-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1joomlaOrb 14s linear infinite;
}

.ai1joomla-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1joomla-main-card,
.ai1joomla-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1joomla-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1joomla-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1joomla-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1joomla-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1joomla-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1joomla-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1joomla-main-card h2,
.ai1joomla-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1joomlaGradientWide 10s linear infinite, ai1joomlaGlow 5s ease-in-out infinite;
}

.ai1joomla-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1joomla-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1joomla-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1joomla-main-card a,
.ai1joomla-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1joomla-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1joomla-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1joomla-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1joomla-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1joomla-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1joomla-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1joomla-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1joomla-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1joomlaGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1joomlaGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1joomlaGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1joomlaOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1joomla-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1joomla-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1joomla-hero{
    min-height: auto;
  }

  .ai1joomla-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1joomla-hero-card{
    border-radius: 22px;
  }

  .ai1joomla-actions{
    flex-direction: column;
  }

  .ai1joomla-btn{
    width: 100%;
  }

  .ai1joomla-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1joomla-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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



/* ============================================================
   IMPORTED: ai1host-service-page.css
============================================================ */

/* ============================================================
   AI1DESIGN — AI1HOST SERVICE PAGE
   Page-specific classes: ai1hostsvc-*
============================================================ */

.ai1hostsvc-hero,
.ai1hostsvc-hero *,
.ai1hostsvc-hero *::before,
.ai1hostsvc-hero *::after,
.ai1hostsvc-details,
.ai1hostsvc-details *,
.ai1hostsvc-details *::before,
.ai1hostsvc-details *::after{
  box-sizing: border-box;
}

.ai1hostsvc-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1hostsvc-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1hostsvc-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1hostsvc-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1hostsvc-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1hostsvc-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1hostsvc-kicker,
.ai1hostsvc-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1hostsvcGradient 8s linear infinite;
}

.ai1hostsvc-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1hostsvc-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1hostsvcGradient 8s linear infinite, ai1hostsvcGlow 4s ease-in-out infinite;
}

.ai1hostsvc-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 860px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.35rem, 3vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1hostsvc-lead{
  max-width: 820px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1hostsvc-hero-card p:not(.ai1hostsvc-kicker):not(.ai1hostsvc-lead):not(.ai1hostsvc-signoff){
  max-width: 840px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1hostsvc-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1hostsvc-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1hostsvc-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1hostsvc-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1hostsvc-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1hostsvcGradient 7s linear infinite;
}

.ai1hostsvc-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1hostsvc-btn-secondary:hover{
  background: rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

.ai1hostsvc-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1hostsvc-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1hostsvc-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1hostsvcOrb 14s linear infinite;
}

.ai1hostsvc-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1hostsvc-main-card,
.ai1hostsvc-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1hostsvc-main-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1hostsvc-side-card{
  padding: clamp(1.6rem, 3vw, 2.4rem);
}

.ai1hostsvc-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1hostsvc-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1hostsvc-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1hostsvc-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
  filter:
    drop-shadow(0 6px 0 rgba(0,0,0,.15))
    drop-shadow(0 14px 12px rgba(0,0,0,.34));
}

.ai1hostsvc-main-card h2,
.ai1hostsvc-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1hostsvcGradientWide 10s linear infinite, ai1hostsvcGlow 5s ease-in-out infinite;
}

.ai1hostsvc-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
  line-height: 1.15;
}

.ai1hostsvc-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1hostsvc-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1hostsvc-main-card a,
.ai1hostsvc-article-cta a{
  color: #39ff14;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1hostsvc-mini-grid{
  display: grid;
  gap: 1.2rem;
}

.ai1hostsvc-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1hostsvc-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1hostsvc-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1hostsvc-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1hostsvc-mini-grid ul{
  list-style: none;
  display: grid;
  gap: .65rem;
  margin: 0;
  padding: 0;
}

.ai1hostsvc-mini-grid li{
  position: relative;
  padding-left: 1.8rem;
  color: rgba(255,255,255,.92);
  line-height: 1.45;
}

.ai1hostsvc-mini-grid li::before{
  content: "✓";
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.25rem;
  height: 1.25rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(57,255,20,.20);
  color: #39ff14;
  font-weight: 950;
  box-shadow: 0 0 18px rgba(57,255,20,.18);
}

@keyframes ai1hostsvcGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1hostsvcGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1hostsvcGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1hostsvcOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1hostsvc-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }

  .ai1hostsvc-side-card{
    order: 2;
  }
}

@media (max-width: 768px){
  .ai1hostsvc-hero{
    min-height: auto;
  }

  .ai1hostsvc-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1hostsvc-hero-card{
    border-radius: 22px;
  }

  .ai1hostsvc-actions{
    flex-direction: column;
  }

  .ai1hostsvc-btn{
    width: 100%;
  }

  .ai1hostsvc-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1hostsvc-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }
}

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


/* ============================================================
   AI1DESIGN — SERVICES OVERVIEW PAGE
   Page-specific classes: ai1services-*
============================================================ */

.ai1services-hero,
.ai1services-hero *,
.ai1services-hero *::before,
.ai1services-hero *::after,
.ai1services-details,
.ai1services-details *,
.ai1services-details *::before,
.ai1services-details *::after{
  box-sizing: border-box;
}

.ai1services-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1services-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1services-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1services-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1services-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1services-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1services-kicker,
.ai1services-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1servicesGradient 8s linear infinite;
}

.ai1services-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1services-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1servicesGradient 8s linear infinite, ai1servicesGlow 4s ease-in-out infinite;
}

.ai1services-hero-card h2{
  margin: 0 auto 1.3rem;
  max-width: 860px;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.35rem, 3vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -.025em;
}

.ai1services-lead{
  max-width: 820px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1services-hero-card p:not(.ai1services-kicker):not(.ai1services-lead):not(.ai1services-signoff){
  max-width: 840px;
  margin: 0 auto 1.4rem;
  color: rgba(255,255,255,.84);
  font-size: 1.05rem;
  line-height: 1.7;
}

.ai1services-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1services-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1services-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1services-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1services-btn-primary{
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1servicesGradient 7s linear infinite;
}

.ai1services-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1services-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1services-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1services-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background:
    conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1servicesOrb 14s linear infinite;
}

.ai1services-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1services-main-card,
.ai1services-side-card{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1services-main-card,
.ai1services-side-card{
  padding: clamp(2rem, 4vw, 3.5rem);
}

.ai1services-heading{
  display: flex;
  align-items: center;
  gap: 1.3rem;
  margin-bottom: 1.5rem;
}

.ai1services-icon{
  position: relative;
  overflow: visible;
  width: 96px;
  height: 96px;
  flex: 0 0 96px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 26px;
  background: linear-gradient(145deg, #fff 0%, #f1f1f1 50%, #c9c9c9 100%);
  box-shadow:
    0 12px 0 rgba(0,0,0,.19),
    0 22px 40px rgba(0,0,0,.40),
    inset 0 3px 2px rgba(255,255,255,.96),
    inset 0 -9px 16px rgba(0,0,0,.18);
}

.ai1services-icon::before{
  content: "";
  position: absolute;
  inset: -8px;
  z-index: -1;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(57,255,20,.65), rgba(0,183,255,.55), rgba(255,123,0,.50), rgba(255,230,0,.45));
  filter: blur(16px);
  opacity: .55;
}

.ai1services-icon img{
  display: block;
  width: 68px;
  max-width: 70%;
  height: auto;
}

.ai1services-main-card h2,
.ai1services-side-card h2{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1servicesGradientWide 10s linear infinite, ai1servicesGlow 5s ease-in-out infinite;
}

.ai1services-main-card h3{
  margin: 2rem 0 .7rem;
  color: #fff;
  font-size: clamp(1.35rem, 2.2vw, 1.8rem);
}

.ai1services-main-card p{
  margin: 0 0 1.1rem;
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1services-article-cta{
  margin-top: 2rem !important;
  padding: 1.4rem;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.20);
  color: #fff !important;
  font-weight: 800;
}

.ai1services-main-card a,
.ai1services-article-cta a,
.ai1services-mini-grid a{
  color: #39ff14;
  font-weight: 850;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.ai1services-mini-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2rem;
}

.ai1services-mini-grid article{
  position: relative;
  overflow: hidden;
  padding: 1.35rem;
  border-radius: 24px;
  color: #fff;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1services-mini-grid article:hover{
  transform: translateY(-8px) scale(1.02);
  background: rgba(255,255,255,.20);
  border-color: rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1services-mini-grid span{
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin: 0 0 1.15rem;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color: #ff6a00;
  font-weight: 950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1services-mini-grid h3{
  margin: 0 0 .8rem;
  font-size: 1.2rem;
  line-height: 1.15;
}

.ai1services-mini-grid p{
  margin: 0 0 1rem;
  color: rgba(255,255,255,.92);
  line-height: 1.55;
}

@keyframes ai1servicesGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1servicesGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1servicesGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1servicesOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1100px){
  .ai1services-wrap{
    grid-template-columns: 1fr;
    width: calc(100% - 28px);
  }
}

@media (max-width: 768px){
  .ai1services-hero{
    min-height: auto;
  }

  .ai1services-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1services-hero-card{
    border-radius: 22px;
  }

  .ai1services-actions{
    flex-direction: column;
  }

  .ai1services-btn{
    width: 100%;
  }

  .ai1services-heading{
    flex-direction: column;
    text-align: center;
  }

  .ai1services-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }

  .ai1services-mini-grid{
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce){
  .ai1services-hero *,
  .ai1services-hero *::before,
  .ai1services-hero *::after,
  .ai1services-details *,
  .ai1services-details *::before,
  .ai1services-details *::after{
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}/* ============================================================
   AI1DESIGN — CONTACT + FAQ PAGE STYLING
   Add this to the bottom of pages.css
   Page-specific classes: ai1contact-* / ai1faq-*
============================================================ */

.ai1contact-hero,
.ai1contact-hero *,
.ai1contact-hero *::before,
.ai1contact-hero *::after,
.ai1contact-details,
.ai1contact-details *,
.ai1contact-details *::before,
.ai1contact-details *::after,
.ai1faq-hero,
.ai1faq-hero *,
.ai1faq-hero *::before,
.ai1faq-hero *::after,
.ai1faq-details,
.ai1faq-details *,
.ai1faq-details *::before,
.ai1faq-details *::after{
  box-sizing: border-box;
}

.ai1contact-hero,
.ai1faq-hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #050505;
  isolation: isolate;
}

.ai1contact-hero-video,
.ai1faq-hero-video{
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  opacity: .72;
  pointer-events: none;
}

.ai1contact-hero-overlay,
.ai1faq-hero-overlay{
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1contact-hero-inner,
.ai1faq-hero-inner{
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6rem 1.5rem 4rem;
}

.ai1contact-hero-card,
.ai1faq-hero-card{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: min(1040px, 100%);
  padding: clamp(2rem, 5vw, 4rem);
  color: #fff;
  text-align: center;
  border-radius: 30px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1contact-hero-card::before,
.ai1faq-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}

.ai1contact-kicker,
.ai1contact-section-kicker,
.ai1faq-kicker,
.ai1faq-section-kicker{
  position: relative;
  display: inline-flex;
  width: fit-content;
  margin: 0 0 1.2rem;
  padding: .72rem 1.15rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #39ff14, #00b7ff, #ff7b00, #ffe600, #ff4fd8, #39ff14);
  background-size: 400% 100%;
  color: #06160a;
  font-size: .82rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation: ai1contactFaqGradient 8s linear infinite;
}

.ai1contact-kicker,
.ai1faq-kicker{
  margin-left: auto;
  margin-right: auto;
}

.ai1contact-hero-card h1,
.ai1faq-hero-card h1{
  max-width: 900px;
  margin: 0 auto .85rem;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: 1.02;
  font-weight: 850;
  letter-spacing: -.05em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ffffff);
  background-size: 400% 100%;
  background-position: 0% 50%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1contactFaqGradient 8s linear infinite, ai1contactFaqGlow 4s ease-in-out infinite;
}

.ai1contact-lead,
.ai1faq-lead{
  max-width: 820px;
  margin: 0 auto 1.2rem;
  color: rgba(255,255,255,.96);
  font-size: clamp(1.15rem, 2vw, 1.42rem);
  line-height: 1.5;
  font-weight: 750;
}

.ai1contact-signoff,
.ai1faq-signoff{
  margin: 1.2rem 0 0;
  color: #d7ffd7;
  font-weight: 850;
}

.ai1contact-actions,
.ai1faq-actions{
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.ai1contact-btn,
.ai1faq-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: .85rem 1.35rem;
  border-radius: 999px;
  font-weight: 850;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1contact-btn:hover,
.ai1faq-btn:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1contact-btn-primary,
.ai1faq-btn-primary,
.ai1contact-submit{
  border: 0;
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00, #39ff14);
  background-size: 300% 100%;
  color: #041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation: ai1contactFaqGradient 7s linear infinite;
}

.ai1contact-btn-secondary,
.ai1faq-btn-secondary{
  color: #fff;
  border: 1px solid rgba(0,183,255,.34);
  background: rgba(0,183,255,.09);
}

.ai1contact-details,
.ai1faq-details{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(5rem, 8vw, 7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg, #07111f 0%, #10365c 48%, #111827 100%);
}

.ai1contact-details::before,
.ai1faq-details::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size: 46px 46px;
  opacity: .54;
  -webkit-mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image: radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1contact-details::after,
.ai1faq-details::after{
  content: "";
  position: absolute;
  top: -18%;
  right: -12%;
  z-index: -1;
  width: min(780px, 78vw);
  height: min(780px, 78vw);
  border-radius: 50%;
  pointer-events: none;
  background: conic-gradient(from 120deg, rgba(57,255,20,.36), rgba(0,183,255,.38), rgba(255,123,0,.34), rgba(255,230,0,.28), rgba(57,255,20,.36));
  filter: blur(22px);
  opacity: .76;
  animation: ai1contactFaqOrb 14s linear infinite;
}

.ai1contact-wrap,
.ai1faq-wrap{
  position: relative;
  z-index: 2;
  width: min(1400px, calc(100% - 60px));
  margin: 0 auto;
}

.ai1contact-wrap{
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(420px, 1.12fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
}

.ai1contact-main-card,
.ai1contact-side-card,
.ai1faq-main-card,
.ai1faq-layout{
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border: 1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.ai1contact-main-card,
.ai1contact-side-card,
.ai1faq-main-card,
.ai1faq-layout{
  padding: clamp(1.6rem, 3vw, 2.6rem);
}

.ai1contact-main-card h2,
.ai1contact-side-card h2,
.ai1faq-main-card h2,
.ai1faq-panel h3{
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  background-image: linear-gradient(90deg, #ffffff, #39ff14, #00cfff, #ff7b00, #ffe600, #ff4fd8, #ffffff);
  background-size: 500% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation: ai1contactFaqGradientWide 10s linear infinite, ai1contactFaqGlow 5s ease-in-out infinite;
}

.ai1contact-main-card p,
.ai1contact-side-card p,
.ai1faq-main-card p,
.ai1faq-panel p{
  color: rgba(255,255,255,.90);
  font-size: 1.02rem;
  line-height: 1.72;
}

.ai1contact-detail-grid{
  display: grid;
  gap: 1rem;
  margin-top: 1.6rem;
}

.ai1contact-detail-card{
  padding: 1.15rem;
  border-radius: 22px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14);
}

.ai1contact-detail-card span{
  display: block;
  margin-bottom: .35rem;
  color: #39ff14;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .78rem;
}

.ai1contact-detail-card a{
  color: #fff;
  font-weight: 850;
  text-decoration: none;
}

.ai1contact-detail-card a:hover{
  color: #39ff14;
}

.ai1contact-address-card p{
  margin: 0;
}

.ai1contact-form{
  display: grid;
  gap: 1rem;
}

.ai1contact-form-row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.ai1contact-field{
  display: grid;
  gap: .45rem;
  color: rgba(255,255,255,.95);
  font-weight: 850;
}

.ai1contact-field em{
  color: #39ff14;
  font-style: normal;
}

.ai1contact-field input,
.ai1contact-field select,
.ai1contact-field textarea{
  width: 100%;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  padding: .95rem 1rem;
  color: #fff;
  background: rgba(255,255,255,.10);
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

.ai1contact-field input:focus,
.ai1contact-field select:focus,
.ai1contact-field textarea:focus{
  border-color: rgba(57,255,20,.60);
  box-shadow: 0 0 0 4px rgba(57,255,20,.13);
}

.ai1contact-field option{
  color: #07111f;
}

.ai1contact-field small{
  color: rgba(255,255,255,.72);
  font-weight: 600;
  line-height: 1.45;
}

.ai1contact-hp{
  position: absolute !important;
  left: -9999px !important;
  opacity: 0 !important;
}

.ai1contact-submit{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  width: fit-content;
  padding: .95rem 1.55rem;
  border-radius: 999px;
  font-weight: 950;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}

.ai1contact-submit:hover{
  transform: translateY(-2px) scale(1.03);
}

.ai1faq-intro-card{
  margin-bottom: 1.5rem;
  text-align: center;
}

.ai1faq-layout{
  display: grid;
  grid-template-columns: minmax(220px, .35fr) minmax(0, 1fr);
  gap: clamp(1rem, 2vw, 1.5rem);
}

.ai1faq-nav{
  display: grid;
  gap: .7rem;
  align-content: start;
}

.ai1faq-nav button{
  width: 100%;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 999px;
  padding: .85rem 1rem;
  color: #fff;
  background: rgba(255,255,255,.10);
  font-weight: 900;
  text-align: left;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.ai1faq-nav button:hover,
.ai1faq-nav button.is-active{
  transform: translateY(-2px);
  color: #06160a;
  background: linear-gradient(90deg, #39ff14, #00cfff, #ff7b00);
  border-color: rgba(255,255,255,.45);
}

.ai1faq-panel{
  display: none;
}

.ai1faq-panel.is-active{
  display: block;
}

.ai1faq-item{
  overflow: hidden;
  margin-bottom: .9rem;
  border-radius: 22px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.22);
}

.ai1faq-item summary{
  position: relative;
  list-style: none;
  padding: 1.15rem 3rem 1.15rem 1.15rem;
  color: #fff;
  font-weight: 950;
  cursor: pointer;
}

.ai1faq-item summary::-webkit-details-marker{
  display: none;
}

.ai1faq-item summary::after{
  content: "+";
  position: absolute;
  right: 1.1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.55rem;
  height: 1.55rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #06160a;
  background: #39ff14;
  font-weight: 950;
}

.ai1faq-item[open] summary::after{
  content: "−";
}

.ai1faq-item div{
  padding: 0 1.15rem 1.15rem;
}

.ai1faq-item p{
  margin: 0;
}

@keyframes ai1contactFaqGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

@keyframes ai1contactFaqGradientWide{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 500% 50%; }
}

@keyframes ai1contactFaqGlow{
  0%, 100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@keyframes ai1contactFaqOrb{
  0%{ transform: rotate(0deg) scale(1); }
  50%{ transform: rotate(180deg) scale(1.08); }
  100%{ transform: rotate(360deg) scale(1); }
}

@media (max-width: 1000px){
  .ai1contact-wrap,
  .ai1faq-wrap{
    width: calc(100% - 28px);
  }

  .ai1contact-wrap,
  .ai1faq-layout{
    grid-template-columns: 1fr;
  }

  .ai1faq-nav{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px){
  .ai1contact-hero,
  .ai1faq-hero{
    min-height: auto;
  }

  .ai1contact-hero-inner,
  .ai1faq-hero-inner{
    min-height: 100svh;
    padding: 5rem 1rem 3rem;
  }

  .ai1contact-hero-card,
  .ai1faq-hero-card{
    border-radius: 22px;
  }

  .ai1contact-actions,
  .ai1faq-actions,
  .ai1contact-form-row,
  .ai1faq-nav{
    grid-template-columns: 1fr;
    flex-direction: column;
  }

  .ai1contact-btn,
  .ai1faq-btn,
  .ai1contact-submit{
    width: 100%;
  }

  .ai1contact-section-kicker,
  .ai1faq-section-kicker{
    margin-left: auto;
    margin-right: auto;
  }

  .ai1contact-main-card,
  .ai1contact-side-card,
  .ai1faq-main-card,
  .ai1faq-layout{
    border-radius: 24px;
  }
}

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



/* ============================================================
   AI1DESIGN — GENERIC SALES / INFO PAGES
   Used by:
   - Why Choose Us
   - Our Process
   - Grow Your Business Online
   Classes: ai1page-*
============================================================ */

.ai1page-hero,
.ai1page-hero *,
.ai1page-section,
.ai1page-section *,
.ai1page-cta,
.ai1page-cta *{
  box-sizing:border-box;
}

.ai1page-hero{
  position:relative;
  width:100%;
  min-height:100vh;
  overflow:hidden;
  background:#050505;
  isolation:isolate;
}

.ai1page-hero-video{
  position:fixed;
  inset:0;
  z-index:-1;
  width:100vw;
  height:100vh;
  object-fit:cover;
  opacity:.72;
  pointer-events:none;
}

.ai1page-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at top left, rgba(57,255,20,.22), transparent 28%),
    radial-gradient(circle at top right, rgba(0,153,255,.20), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,230,0,.18), transparent 24%),
    radial-gradient(circle at bottom left, rgba(255,85,0,.18), transparent 24%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.84));
}

.ai1page-hero-inner{
  position:relative;
  z-index:2;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6rem 1.5rem 4rem;
}

.ai1page-hero-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:min(1040px,100%);
  padding:clamp(2rem,5vw,4rem);
  color:#fff;
  text-align:center;
  border-radius:30px;
  background:linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.ai1page-hero-card-wide{
  width:min(1180px,100%);
}

.ai1page-hero-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, rgba(57,255,20,.75), rgba(0,183,255,.48), rgba(255,123,0,.42), rgba(255,230,0,.34));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}

.ai1page-kicker{
  display:inline-flex;
  width:fit-content;
  margin:0 auto 1.2rem;
  padding:.72rem 1.15rem;
  border-radius:999px;
  background:linear-gradient(90deg,#39ff14,#00b7ff,#ff7b00,#ffe600,#ff4fd8,#39ff14);
  background-size:400% 100%;
  color:#06160a;
  font-size:.82rem;
  font-weight:950;
  letter-spacing:.055em;
  text-transform:uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation:ai1pageGradient 8s linear infinite;
}

.ai1page-hero-card h1{
  max-width:940px;
  margin:0 auto .85rem;
  font-size:clamp(2.65rem,6.5vw,5.35rem);
  line-height:1.02;
  font-weight:850;
  letter-spacing:-.05em;
  background-image:linear-gradient(90deg,#fff,#39ff14,#00cfff,#ff7b00,#ffe600,#fff);
  background-size:400% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1pageGradient 8s linear infinite, ai1pageGlow 4s ease-in-out infinite;
}

.ai1page-lead{
  max-width:840px;
  margin:0 auto 1.3rem;
  color:rgba(255,255,255,.96);
  font-size:clamp(1.15rem,2vw,1.42rem);
  line-height:1.5;
  font-weight:750;
}

.ai1page-actions{
  display:flex;
  justify-content:center;
  gap:1rem;
  flex-wrap:wrap;
  margin-top:2rem;
}

.ai1page-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.85rem 1.35rem;
  border-radius:999px;
  font-weight:850;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1page-btn:hover{
  transform:translateY(-2px) scale(1.03);
}

.ai1page-btn-primary{
  background:linear-gradient(90deg,#39ff14,#00cfff,#ff7b00,#39ff14);
  background-size:300% 100%;
  color:#041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation:ai1pageGradient 7s linear infinite;
}

.ai1page-btn-secondary{
  color:#fff;
  border:1px solid rgba(0,183,255,.34);
  background:rgba(0,183,255,.09);
}

.ai1page-section,
.ai1page-cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(5rem,8vw,7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.34), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.36), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.34), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.24), transparent 30%),
    linear-gradient(135deg,#07111f 0%,#10365c 48%,#111827 100%);
}

.ai1page-section-alt{
  background:
    radial-gradient(circle at 15% 18%, rgba(0,183,255,.34), transparent 30%),
    radial-gradient(circle at 86% 22%, rgba(57,255,20,.30), transparent 28%),
    radial-gradient(circle at 75% 84%, rgba(255,123,0,.30), transparent 34%),
    linear-gradient(135deg,#08101d 0%,#102f52 50%,#101827 100%);
}

.ai1page-section::before,
.ai1page-cta::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px);
  background-size:46px 46px;
  opacity:.54;
  -webkit-mask-image:radial-gradient(circle at center, black 32%, transparent 100%);
          mask-image:radial-gradient(circle at center, black 32%, transparent 100%);
}

.ai1page-wrap{
  position:relative;
  z-index:2;
  width:min(1400px, calc(100% - 60px));
  margin:0 auto;
}

.ai1page-intro-card,
.ai1page-content-card,
.ai1page-highlight-card,
.ai1page-sales-card,
.ai1page-cta-card{
  position:relative;
  overflow:hidden;
  border-radius:32px;
  padding:clamp(2rem,4vw,3.5rem);
  color:#fff;
  background:
    radial-gradient(circle at 10% 8%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(0,183,255,.22), transparent 32%),
    linear-gradient(145deg, rgba(7,23,47,.94), rgba(10,38,72,.90));
  border:1px solid rgba(255,255,255,.20);
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 52px rgba(0,183,255,.13),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.ai1page-intro-card{
  max-width:1050px;
  margin:0 auto 2rem;
  text-align:center;
}

.ai1page-intro-card h2,
.ai1page-content-card h2,
.ai1page-sales-card h2,
.ai1page-cta-card h2{
  margin:0 0 1rem;
  font-size:clamp(2rem,4vw,3.5rem);
  line-height:1.04;
  letter-spacing:-.045em;
  background-image:linear-gradient(90deg,#fff,#39ff14,#00cfff,#ff7b00,#ffe600,#ff4fd8,#fff);
  background-size:500% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1pageGradientWide 10s linear infinite, ai1pageGlow 5s ease-in-out infinite;
}

.ai1page-intro-card p,
.ai1page-content-card p,
.ai1page-sales-card p,
.ai1page-cta-card p{
  margin:0 0 1.1rem;
  color:rgba(255,255,255,.90);
  font-size:1.04rem;
  line-height:1.72;
}

.ai1page-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.2rem;
}

.ai1page-card,
.ai1page-process-card{
  position:relative;
  overflow:hidden;
  padding:1.45rem;
  border-radius:24px;
  color:#fff;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.24);
  box-shadow:
    0 18px 45px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.ai1page-card:hover,
.ai1page-process-card:hover{
  transform:translateY(-8px) scale(1.02);
  background:rgba(255,255,255,.20);
  border-color:rgba(255,255,255,.45);
  box-shadow:
    0 24px 60px rgba(0,0,0,.30),
    0 0 32px rgba(255,255,255,.18);
}

.ai1page-card h3,
.ai1page-highlight-card h3,
.ai1page-process-card h3{
  margin:0 0 .8rem;
  color:#fff;
  font-size:1.25rem;
  line-height:1.15;
}

.ai1page-card p,
.ai1page-process-card p{
  margin:0;
  color:rgba(255,255,255,.90);
  line-height:1.6;
}

.ai1page-split{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:clamp(1.5rem,3vw,3rem);
  align-items:stretch;
}

.ai1page-check-list{
  list-style:none;
  display:grid;
  gap:.8rem;
  margin:1rem 0 0;
  padding:0;
}

.ai1page-check-list li{
  position:relative;
  padding-left:1.9rem;
  color:rgba(255,255,255,.92);
  line-height:1.45;
}

.ai1page-check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:.05rem;
  width:1.25rem;
  height:1.25rem;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:rgba(57,255,20,.20);
  color:#39ff14;
  font-weight:950;
  box-shadow:0 0 18px rgba(57,255,20,.18);
}

.ai1page-process-list{
  display:grid;
  gap:1.2rem;
}

.ai1page-process-card{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1.2rem;
  align-items:start;
}

.ai1page-process-number{
  display:grid;
  place-items:center;
  width:64px;
  height:64px;
  border-radius:999px;
  background:radial-gradient(circle at 30% 25%, #fff 0%, #fff 38%, #f2f2f2 62%, #dcdcdc 100%);
  color:#ff6a00;
  font-weight:950;
  box-shadow:
    0 8px 0 rgba(0,0,0,.18),
    0 18px 30px rgba(0,0,0,.28),
    0 0 22px rgba(255,255,255,.28),
    inset 0 2px 2px rgba(255,255,255,.95),
    inset 0 -6px 10px rgba(0,0,0,.12);
}

.ai1page-cta-card{
  max-width:1050px;
  margin:0 auto;
  text-align:center;
}

.ai1page-cta-card .ai1page-btn{
  margin-top:1rem;
}

@keyframes ai1pageGradient{
  0%{background-position:0% 50%;}
  100%{background-position:400% 50%;}
}

@keyframes ai1pageGradientWide{
  0%{background-position:0% 50%;}
  100%{background-position:500% 50%;}
}

@keyframes ai1pageGlow{
  0%,100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}

@media (max-width:1100px){
  .ai1page-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .ai1page-split{
    grid-template-columns:1fr;
  }
}

@media (max-width:768px){
  .ai1page-hero{
    min-height:auto;
  }

  .ai1page-hero-inner{
    min-height:100svh;
    padding:5rem 1rem 3rem;
  }

  .ai1page-wrap{
    width:calc(100% - 28px);
  }

  .ai1page-hero-card,
  .ai1page-intro-card,
  .ai1page-content-card,
  .ai1page-highlight-card,
  .ai1page-sales-card,
  .ai1page-cta-card{
    border-radius:22px;
  }

  .ai1page-actions{
    flex-direction:column;
  }

  .ai1page-btn{
    width:100%;
  }

  .ai1page-card-grid{
    grid-template-columns:1fr;
  }

  .ai1page-process-card{
    grid-template-columns:1fr;
  }
}

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


/* ============================================================
   AI1DESIGN — SHARED INNER-PAGE MOTION
   Controlled by /js/pages.js
============================================================ */

:root{
  --ai1page-reveal-distance: 72px;
  --ai1page-reveal-duration: 820ms;
  --ai1page-reveal-ease: cubic-bezier(.22, 1, .36, 1);
}

/* Only hide elements after pages.js has successfully initialised. */
.ai1-pages-js-active .ai1page-reveal{
  opacity: 0;
  transition:
    opacity var(--ai1page-reveal-duration) var(--ai1page-reveal-ease),
    transform var(--ai1page-reveal-duration) var(--ai1page-reveal-ease);
  transition-delay: var(--ai1page-reveal-delay, 0ms);
  will-change: opacity, transform;
}

.ai1-pages-js-active .ai1page-reveal.is-inview{
  opacity: 1;
  transform: translate3d(0,0,0) scale(1) !important;
}

.ai1-pages-js-active .ai1page-reveal-zoom{
  transform: translate3d(0, 28px, 0) scale(.965);
}

.ai1-pages-js-active .ai1page-reveal-left{
  transform: translate3d(calc(var(--ai1page-reveal-distance) * -1), 18px, 0);
}

.ai1-pages-js-active .ai1page-reveal-right{
  transform: translate3d(var(--ai1page-reveal-distance), 18px, 0);
}

.ai1-pages-js-active .ai1page-reveal-left-soft{
  transform: translate3d(-38px, 14px, 0);
}

.ai1-pages-js-active .ai1page-reveal-right-soft{
  transform: translate3d(38px, 14px, 0);
}

.ai1-pages-js-active .ai1page-reveal-up{
  transform: translate3d(0, 42px, 0);
}

body.ai1-scroll-up .ai1page-reveal-up:not(.is-inview){
  transform: translate3d(0, -42px, 0);
}

body.ai1-scroll-up .ai1page-reveal-left:not(.is-inview){
  transform: translate3d(calc(var(--ai1page-reveal-distance) * -1), -18px, 0);
}

body.ai1-scroll-up .ai1page-reveal-right:not(.is-inview){
  transform: translate3d(var(--ai1page-reveal-distance), -18px, 0);
}

/* ============================================================
   INNER PAGE BYTE DIVIDER
============================================================ */

.ai1-page-divider{
  position: relative;
  z-index: 30;
  height: 104px;
  margin: -52px 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  isolation: isolate;
}

.ai1-page-divider-line{
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: calc(100vw - 32px);
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    #ffe600,
    #39ff14,
    #00cfff,
    #ff4fd8,
    #ffe600
  );
  background-size: 400% 100%;
  box-shadow:
    0 0 22px rgba(57,255,20,.36),
    0 0 36px rgba(0,183,255,.26),
    0 10px 26px rgba(0,0,0,.28);

  transform: translate(-50%, -50%) scaleX(1);
  transform-origin: center;
  opacity: 1;
  transition:
    transform 900ms cubic-bezier(.22,1,.36,1),
    opacity 500ms ease;
  animation: ai1PageDividerGradient 8s linear infinite;
}

.ai1-pages-js-active .ai1-page-divider-line{
  transform: translate(-50%, -50%) scaleX(0);
  opacity: .5;
}

.ai1-page-divider.is-inview .ai1-page-divider-line{
  transform: translate(-50%, -50%) scaleX(1);
  opacity: 1;
}

.ai1-page-divider-video{
  position: relative;
  z-index: 2;
  width: 112px;
  height: 112px;
  overflow: hidden;
  border-radius: 50%;
  background: radial-gradient(circle at center, #ffffff 0%, #dfefff 100%);
  border: 5px solid #ffffff;
  box-shadow:
    0 0 0 5px rgba(57,255,20,.26),
    0 0 28px rgba(57,255,20,.52),
    0 0 54px rgba(0,183,255,.30),
    0 18px 42px rgba(0,0,0,.34);

  opacity: 1;
  transform: none !important;
  filter: none !important;
  transition: opacity 620ms ease 130ms;
}

.ai1-pages-js-active .ai1-page-divider-video{
  opacity: 0;
}

.ai1-page-divider.is-inview .ai1-page-divider-video{
  opacity: 1;
}

.ai1-page-divider-video video{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  transform: scale(1.12) !important;
  filter: none !important;
  will-change: auto;
  backface-visibility: visible;
  -webkit-backface-visibility: visible;
}

/* ============================================================
   RESPONSIVE MOTION
============================================================ */

@media (max-width: 900px){
  :root{
    --ai1page-reveal-distance: 38px;
    --ai1page-reveal-duration: 720ms;
  }

  .ai1-page-divider{
    height: 92px;
    margin: -46px 0;
  }

  .ai1-page-divider-video{
    width: 100px;
    height: 100px;
  }

  .ai1-page-divider-line{
    width: calc(100vw - 20px);
    height: 8px;
  }
}

@media (max-width: 560px){
  :root{
    --ai1page-reveal-distance: 24px;
  }

  .ai1-page-divider{
    height: 82px;
    margin: -41px 0;
  }

  .ai1-page-divider-video{
    width: 88px;
    height: 88px;
    border-width: 4px;
  }

  .ai1-page-divider-line{
    height: 7px;
  }
}

/* ============================================================
   REDUCED MOTION
============================================================ */

@media (prefers-reduced-motion: reduce){
  .ai1page-reveal,
  .ai1-page-divider-line,
  .ai1-page-divider-video{
    opacity: 1 !important;
    transition: none !important;
    animation: none !important;
  }

  .ai1page-reveal{
    transform: none !important;
  }

  .ai1-page-divider-line{
    transform: translate(-50%, -50%) scaleX(1) !important;
  }

  .ai1-page-divider-video{
    transform: none !important;
  }

  .ai1-page-divider-video video{
    transform: scale(1.12) !important;
  }
}

@keyframes ai1PageDividerGradient{
  0%{ background-position: 0% 50%; }
  100%{ background-position: 400% 50%; }
}

/* ============================================================
   AI1DESIGN — AI1P CONTACT + FAQ CORRECTIVE STYLES
   ------------------------------------------------------------
   IMPORTANT:
   The Contact and FAQ PHP markup uses ai1p-* classes.
   Older CSS in this file targets ai1contact-* / ai1faq-* instead.
   This block deliberately targets the REAL markup and restores
   the premium layout without changing the page HTML.
============================================================ */

.ai1p-hero,
.ai1p-hero *,
.ai1p-hero *::before,
.ai1p-hero *::after,
.ai1p-section,
.ai1p-section *,
.ai1p-section *::before,
.ai1p-section *::after{
  box-sizing:border-box;
}

.ai1p-hero{
  position:relative;
  width:100%;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
  background:#050505;
}

.ai1p-hero-video{
  position:fixed;
  inset:0;
  z-index:-1;
  width:100vw;
  height:100vh;
  object-fit:cover;
  opacity:.72;
  pointer-events:none;
}

.ai1p-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 8% 10%, rgba(57,255,20,.24), transparent 30%),
    radial-gradient(circle at 92% 14%, rgba(0,183,255,.24), transparent 31%),
    radial-gradient(circle at 82% 88%, rgba(255,123,0,.22), transparent 30%),
    radial-gradient(circle at 14% 90%, rgba(255,230,0,.16), transparent 28%),
    linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.86));
}

.ai1p-hero-inner{
  position:relative;
  z-index:2;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6rem 1.5rem 4rem;
}

.ai1p-hero-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:min(1040px,100%);
  padding:clamp(2rem,5vw,4rem);
  border:1px solid rgba(255,255,255,.17);
  border-radius:30px;
  background:
    radial-gradient(circle at 10% 10%, rgba(57,255,20,.12), transparent 28%),
    radial-gradient(circle at 90% 12%, rgba(0,183,255,.13), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
  box-shadow:
    0 30px 100px rgba(0,0,0,.62),
    0 0 45px rgba(57,255,20,.10),
    0 0 55px rgba(0,153,255,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  color:#fff;
  text-align:center;
}

.ai1p-hero-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(
    135deg,
    rgba(57,255,20,.78),
    rgba(0,183,255,.52),
    rgba(255,123,0,.46),
    rgba(255,230,0,.38)
  );
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}

.ai1p-kicker{
  display:inline-flex;
  width:fit-content;
  margin:0 0 1.2rem;
  padding:.72rem 1.15rem;
  border-radius:999px;
  background:linear-gradient(90deg,#39ff14,#00b7ff,#ff7b00,#ffe600,#ff4fd8,#39ff14);
  background-size:400% 100%;
  color:#06160a;
  font-size:.82rem;
  font-weight:950;
  letter-spacing:.055em;
  text-transform:uppercase;
  box-shadow:
    0 12px 30px rgba(57,255,20,.22),
    0 12px 36px rgba(0,183,255,.15),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation:ai1pGradient 8s linear infinite;
}

.ai1p-hero-card .ai1p-kicker{
  margin-left:auto;
  margin-right:auto;
}

.ai1p-hero-card h1{
  max-width:930px;
  margin:0 auto 1rem;
  font-size:clamp(2.6rem,6.5vw,5.2rem);
  line-height:1.03;
  font-weight:850;
  letter-spacing:-.045em;
  background-image:linear-gradient(90deg,#fff,#39ff14,#00cfff,#ff7b00,#ffe600,#fff);
  background-size:400% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1pGradient 8s linear infinite, ai1pGlow 4s ease-in-out infinite;
}

.ai1p-hero-lead{
  max-width:820px;
  margin:0 auto 1.25rem;
  color:rgba(255,255,255,.94);
  font-size:clamp(1.08rem,2vw,1.4rem);
  line-height:1.65;
  font-weight:700;
}

.ai1p-hero-signoff{
  margin:1.2rem 0 0;
  color:#d7ffd7;
  font-weight:850;
}

.ai1p-hero-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:2rem;
}

.ai1p-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.9rem 1.4rem;
  border-radius:999px;
  font-weight:850;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1p-btn:hover{
  transform:translateY(-2px) scale(1.03);
}

.ai1p-btn-primary{
  background:linear-gradient(90deg,#39ff14,#00cfff,#ff7b00,#39ff14);
  background-size:300% 100%;
  color:#041b08;
  box-shadow:
    0 14px 35px rgba(57,255,20,.28),
    0 0 30px rgba(0,207,255,.22);
  animation:ai1pGradient 7s linear infinite;
}

.ai1p-btn-secondary{
  color:#fff;
  border:1px solid rgba(0,183,255,.34);
  background:rgba(0,183,255,.09);
}

.ai1p-btn-secondary:hover{
  background:rgba(0,183,255,.16);
  box-shadow:
    0 0 25px rgba(0,183,255,.20),
    0 0 35px rgba(255,123,0,.10);
}

/* ------------------------------------------------------------
   Shared inner content area
------------------------------------------------------------ */

.ai1p-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(5.5rem,8vw,7rem) 0;
  background:
    radial-gradient(circle at 10% 12%, rgba(57,255,20,.30), transparent 28%),
    radial-gradient(circle at 92% 18%, rgba(0,183,255,.32), transparent 30%),
    radial-gradient(circle at 82% 86%, rgba(255,123,0,.30), transparent 34%),
    radial-gradient(circle at 16% 92%, rgba(255,230,0,.20), transparent 30%),
    linear-gradient(135deg,#07111f 0%,#10365c 48%,#111827 100%);
}

.ai1p-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:46px 46px;
  opacity:.5;
  -webkit-mask-image:radial-gradient(circle at center,black 30%,transparent 100%);
          mask-image:radial-gradient(circle at center,black 30%,transparent 100%);
}

.ai1p-wrap{
  position:relative;
  z-index:2;
  width:min(1400px,calc(100% - 60px));
  margin:0 auto;
}

.ai1p-panel,
.ai1p-section-header,
.ai1p-faq-nav,
.ai1p-faq-panels{
  border:1px solid rgba(255,255,255,.18);
  background:
    radial-gradient(circle at 8% 8%, rgba(57,255,20,.17), transparent 28%),
    radial-gradient(circle at 92% 14%, rgba(0,183,255,.16), transparent 30%),
    linear-gradient(145deg,rgba(7,23,47,.94),rgba(10,38,72,.90));
  box-shadow:
    0 28px 80px rgba(0,0,0,.34),
    0 0 50px rgba(0,183,255,.12),
    inset 0 1px 0 rgba(255,255,255,.15);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  color:#fff;
}

/* ------------------------------------------------------------
   Contact
------------------------------------------------------------ */

.ai1p-contact-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:clamp(1.5rem,3vw,3rem);
  align-items:start;
}

.ai1p-panel{
  overflow:hidden;
  padding:clamp(2rem,4vw,3.2rem);
  border-radius:30px;
}

.ai1p-panel h2,
.ai1p-section-header h2{
  margin:0 0 1rem;
  font-size:clamp(2rem,4vw,3.45rem);
  line-height:1.06;
  letter-spacing:-.04em;
  background-image:linear-gradient(90deg,#fff,#39ff14,#00cfff,#ff7b00,#ffe600,#fff);
  background-size:500% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1pGradientWide 10s linear infinite;
}

.ai1p-panel p,
.ai1p-section-header p{
  color:rgba(255,255,255,.88);
}

.ai1p-lead{
  font-size:1.08rem;
  line-height:1.7;
}

.ai1p-detail-list{
  display:grid;
  gap:1rem;
  margin-top:2rem;
}

.ai1p-detail-card{
  padding:1.2rem 1.3rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:20px;
  background:rgba(255,255,255,.09);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
}

.ai1p-detail-card span{
  display:block;
  margin-bottom:.35rem;
  color:#39ff14;
  font-size:.76rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ai1p-detail-card a{
  color:#fff;
  font-weight:750;
}

.ai1p-detail-card p{
  margin:0;
}

.ai1p-form-heading{
  margin-bottom:1.6rem;
}

.ai1p-form{
  display:grid;
  gap:1rem;
}

.ai1p-form-row{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
}

.ai1p-field{
  display:grid;
  gap:.5rem;
  color:rgba(255,255,255,.92);
  font-size:.93rem;
  font-weight:750;
}

.ai1p-field em{
  color:#ff8a00;
}

.ai1p-field input,
.ai1p-field select,
.ai1p-field textarea{
  width:100%;
  min-height:48px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:14px;
  outline:0;
  padding:.8rem .95rem;
  background:rgba(3,12,28,.72);
  color:#fff;
  font:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.ai1p-field textarea{
  min-height:150px;
  resize:vertical;
}

.ai1p-field input:focus,
.ai1p-field select:focus,
.ai1p-field textarea:focus{
  border-color:#00cfff;
  background:rgba(3,12,28,.88);
  box-shadow:0 0 0 3px rgba(0,207,255,.13), 0 0 24px rgba(0,207,255,.13);
}

.ai1p-field select option{
  color:#111;
  background:#fff;
}

.ai1p-field small{
  color:rgba(255,255,255,.66);
  font-weight:500;
}

.ai1p-submit{
  justify-self:start;
  min-height:48px;
  padding:.9rem 1.5rem;
  border:0;
  border-radius:999px;
  background:linear-gradient(90deg,#39ff14,#00cfff,#ff7b00,#39ff14);
  background-size:300% 100%;
  color:#041b08;
  font-weight:900;
  cursor:pointer;
  box-shadow:
    0 14px 35px rgba(57,255,20,.24),
    0 0 30px rgba(0,207,255,.18);
  animation:ai1pGradient 7s linear infinite;
  transition:transform .2s ease, box-shadow .2s ease;
}

.ai1p-submit:hover{
  transform:translateY(-2px);
  box-shadow:
    0 18px 42px rgba(57,255,20,.28),
    0 0 34px rgba(0,207,255,.22);
}

.ai1p-hp{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* ------------------------------------------------------------
   FAQ
------------------------------------------------------------ */

.ai1p-section-header{
  margin-bottom:1.5rem;
  padding:clamp(1.7rem,3vw,2.5rem);
  border-radius:28px;
  text-align:center;
}

.ai1p-section-header .ai1p-kicker{
  margin-left:auto;
  margin-right:auto;
}

.ai1p-faq-layout{
  display:grid;
  grid-template-columns:minmax(220px,.28fr) minmax(0,.72fr);
  gap:1.5rem;
  align-items:start;
}

.ai1p-faq-nav{
  position:sticky;
  top:1.5rem;
  display:grid;
  gap:.7rem;
  padding:1.2rem;
  border-radius:24px;
}

.ai1p-faq-nav button{
  width:100%;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  padding:.9rem 1rem;
  background:rgba(255,255,255,.07);
  color:rgba(255,255,255,.88);
  font:inherit;
  font-weight:800;
  text-align:left;
  cursor:pointer;
  transition:transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.ai1p-faq-nav button:hover,
.ai1p-faq-nav button.is-active{
  transform:translateX(4px);
  color:#061126;
  background:linear-gradient(135deg,#fff,#bffcff);
  box-shadow:0 0 20px rgba(0,210,255,.35);
}

.ai1p-faq-panels{
  padding:clamp(1.5rem,3vw,2.4rem);
  border-radius:28px;
  min-width:0;
}

.ai1p-faq-panel{
  display:none;
}

.ai1p-faq-panel.is-active{
  display:block;
}

.ai1p-faq-panel > h3{
  margin:0 0 1rem;
  color:#fff;
  font-size:clamp(1.6rem,3vw,2.3rem);
}

.ai1p-faq-item{
  overflow:hidden;
  margin:0 0:.85rem;
  border:1px solid rgba(255,255,255,.16);
  border-radius:18px;
  background:rgba(255,255,255,.08);
  color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.ai1p-faq-item summary{
  position:relative;
  padding:1rem 3.2rem 1rem 1.15rem;
  color:#fff;
  font-weight:800;
  line-height:1.45;
  cursor:pointer;
  list-style:none;
}

.ai1p-faq-item summary::-webkit-details-marker{
  display:none;
}

.ai1p-faq-item summary::after{
  content:"+";
  position:absolute;
  right:1.1rem;
  top:50%;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:rgba(57,255,20,.14);
  color:#39ff14;
  font-size:1.2rem;
  font-weight:900;
  transition:transform .2s ease, background .2s ease;
}

.ai1p-faq-item[open] summary::after{
  content:"−";
  background:rgba(0,207,255,.15);
  color:#00cfff;
}

.ai1p-faq-item > div{
  padding:0 1.15rem 1.1rem;
}

.ai1p-faq-item p{
  margin:0;
  color:rgba(255,255,255,.82);
}

/* ------------------------------------------------------------
   Divider z-index + spacing correction for ai1p pages
------------------------------------------------------------ */

.ai1p-hero + .ai1-page-divider{
  z-index:40;
}

.ai1p-hero + .ai1-page-divider + .ai1p-section{
  padding-top:clamp(6.5rem,9vw,8rem);
}

/* ------------------------------------------------------------
   Responsive
------------------------------------------------------------ */

@media (max-width:980px){
  .ai1p-contact-grid,
  .ai1p-faq-layout{
    grid-template-columns:1fr;
  }

  .ai1p-faq-nav{
    position:relative;
    top:auto;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:768px){
  .ai1p-hero{
    min-height:auto;
  }

  .ai1p-hero-inner{
    min-height:100svh;
    padding:5rem 1rem 3rem;
  }

  .ai1p-hero-card{
    border-radius:22px;
  }

  .ai1p-hero-actions{
    flex-direction:column;
  }

  .ai1p-btn{
    width:100%;
  }

  .ai1p-wrap{
    width:calc(100% - 28px);
  }

  .ai1p-panel,
  .ai1p-section-header,
  .ai1p-faq-panels{
    border-radius:22px;
  }
}

@media (max-width:600px){
  .ai1p-form-row,
  .ai1p-faq-nav{
    grid-template-columns:1fr;
  }

  .ai1p-submit{
    width:100%;
    justify-self:stretch;
  }

  .ai1p-faq-nav button{
    text-align:center;
  }
}

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

@keyframes ai1pGradient{
  0%{background-position:0% 50%;}
  100%{background-position:400% 50%;}
}

@keyframes ai1pGradientWide{
  0%{background-position:0% 50%;}
  100%{background-position:500% 50%;}
}

@keyframes ai1pGlow{
  0%,100%{
    filter:
      drop-shadow(0 0 8px rgba(57,255,20,.16))
      drop-shadow(0 0 16px rgba(0,183,255,.11));
  }
  50%{
    filter:
      drop-shadow(0 0 16px rgba(57,255,20,.28))
      drop-shadow(0 0 28px rgba(0,183,255,.20))
      drop-shadow(0 0 38px rgba(255,123,0,.15));
  }
}