/* ==========================================================================
   AI1GROUP REUSABLE COMPONENT SYSTEM
   Shared foundations for experience pages

   OWNERSHIP
   - template.css: global header, navigation, footer and site chrome
   - home.css: homepage only
   - pages.css: standard inner pages, Contact, FAQ and Thank You
   - solutions.css: Solutions only
   - teams.css: Meet the Team only
   - policies.css / policy-print.css: policy pages

   This file contains only reusable ai1x foundations/components.
========================================================================== */

/* 01. TOKENS AND JOOMLA RESET -------------------------------------------- */
:root {
    --ai1x-bg:#020504;
    --ai1x-bg-soft:#07110b;
    --ai1x-panel:#0a1710;
    --ai1x-panel-2:#0f2117;
    --ai1x-green:#91ff19;
    --ai1x-green-deep:#5db400;
    --ai1x-gold:#f0d59a;
    --ai1x-blue:#4fa4ff;
    --ai1x-white:#f7faf7;
    --ai1x-text:#d7e3da;
    --ai1x-muted:#94a79b;
    --ai1x-line:rgba(145,255,25,.16);
    --ai1x-line-strong:rgba(145,255,25,.34);
    --ai1x-shadow:0 32px 90px rgba(0,0,0,.42);
    --ai1x-radius:28px;
}

body.experience-page .ai1-main,
body.experience-page .ai1-main--experience,
body.experience-page .item-page,
body.experience-page .com-content-article,
body.experience-page .com-content-article__body,
body.experience-page .article-details,
body.experience-page .article-details>div {
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

body.experience-page .page-header,
body.experience-page .article-info,
body.experience-page .icons,
body.experience-page .pager,
body.experience-page .pagenavigation {display:none!important}

/* 02. PAGE SHELL AND TYPOGRAPHY ------------------------------------------ */
.ai1x-page,.ai1x-page *,.ai1x-page *::before,.ai1x-page *::after{box-sizing:border-box}
.ai1x-page{overflow:clip;background:var(--ai1x-bg);color:var(--ai1x-text)}
.ai1x-page img,.ai1x-page video,.ai1x-page svg{display:block;max-width:100%}
.ai1x-page h1,.ai1x-page h2,.ai1x-page h3,.ai1x-page h4{color:var(--ai1x-white);text-wrap:balance}
.ai1x-page p,.ai1x-page li{line-height:1.8}
.ai1x-page a{color:inherit}
.ai1x-shell{width:min(1380px,calc(100% - 48px));margin-inline:auto}
.ai1x-section{position:relative;padding:clamp(82px,9vw,138px) 0}
.ai1x-section--soft{background:radial-gradient(circle at 15% 10%,rgba(145,255,25,.08),transparent 28rem),linear-gradient(180deg,#07110b,#030806)}
.ai1x-section--light{background:#eef3ef;color:#17271d}
.ai1x-section--light h2,.ai1x-section--light h3{color:#0f2016}
.ai1x-section--light p{color:#5d7064}
.ai1x-heading{max-width:900px;margin-bottom:clamp(42px,6vw,76px)}
.ai1x-heading--centre{margin-inline:auto;text-align:center}
.ai1x-heading h2{margin:0;font-size:clamp(2.5rem,5vw,5.3rem);font-weight:500;line-height:1;letter-spacing:-.055em}
.ai1x-heading>p:last-child{max-width:760px;color:var(--ai1x-muted);font-size:1.08rem}
.ai1x-heading--centre>p:last-child{margin-inline:auto}
.ai1x-kicker{display:inline-flex;align-items:center;gap:14px;margin:0 0 18px;color:#a7b7ac;font-size:.77rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}
.ai1x-kicker::before{content:"";width:46px;height:3px;border-radius:99px;background:linear-gradient(90deg,var(--ai1x-green),transparent);box-shadow:0 0 16px rgba(145,255,25,.42)}
.ai1x-lead{color:#c5d1c8;font-size:clamp(1.05rem,1.5vw,1.28rem)}
.ai1x-muted{color:var(--ai1x-muted)}

/* 03. CINEMATIC HERO ----------------------------------------------------- */
.ai1x-hero{position:relative;isolation:isolate;display:grid;align-items:center;min-height:clamp(650px,82vh,920px);padding:clamp(110px,13vw,180px) 0 clamp(95px,11vw,150px);overflow:hidden;background:#010302}
.ai1x-hero::before{content:"";position:absolute;z-index:5;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,#ff505b 14%,#ffc42e 38%,#a9ff23 64%,#73e900 88%,transparent)}
.ai1x-hero__video{position:absolute!important;inset:0!important;z-index:-5!important;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover!important;filter:brightness(.4) saturate(.9) contrast(1.08)}
.ai1x-hero__veil{position:absolute;inset:0;z-index:-4;background:linear-gradient(90deg,rgba(0,4,2,.97),rgba(0,5,3,.85) 48%,rgba(0,4,2,.45) 78%,rgba(0,4,2,.84)),linear-gradient(180deg,transparent,rgba(0,5,2,.92))}
.ai1x-hero__mesh{position:absolute;inset:0;z-index:-3;opacity:.2;background-image:radial-gradient(circle,rgba(145,255,25,.35) 1px,transparent 1.6px);background-size:34px 34px;mask-image:linear-gradient(90deg,#000,transparent 74%)}
.ai1x-hero__inner{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(360px,.72fr);gap:clamp(48px,8vw,110px);align-items:center}
.ai1x-hero__copy{max-width:840px}
.ai1x-hero h1{margin:0;font-size:clamp(3.6rem,7.2vw,7.5rem);font-weight:500;line-height:.93;letter-spacing:-.065em}
.ai1x-hero h1 span{color:var(--ai1x-green)}
.ai1x-hero__lead{max-width:720px;margin:26px 0 0;color:#bdcbc1;font-size:clamp(1.05rem,1.45vw,1.27rem)}
.ai1x-hero__meta{display:flex;flex-wrap:wrap;gap:14px 24px;margin-top:30px;color:#98aa9e;font-size:.73rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.ai1x-hero__meta span{display:inline-flex;align-items:center;gap:8px}.ai1x-hero__meta i{width:7px;height:7px;border-radius:50%;background:var(--ai1x-green);box-shadow:0 0 14px rgba(145,255,25,.7)}
.ai1x-hero-card{position:relative;overflow:hidden;border:1px solid var(--ai1x-line-strong);border-radius:32px;background:linear-gradient(150deg,rgba(10,27,16,.95),rgba(2,9,5,.98));box-shadow:var(--ai1x-shadow),0 0 60px rgba(145,255,25,.08);backdrop-filter:blur(20px)}
.ai1x-hero-card__head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid rgba(255,255,255,.07);color:var(--ai1x-muted);font-size:.66rem;font-weight:800;letter-spacing:.14em}.ai1x-hero-card__head b{color:var(--ai1x-green)}
.ai1x-hero-card__body{position:relative;min-height:280px;padding:clamp(34px,5vw,58px);display:flex;flex-direction:column;justify-content:center}
.ai1x-hero-card__body strong{font-size:clamp(2rem,3vw,3.3rem);font-weight:500;line-height:1.05}.ai1x-hero-card__body p{margin:12px 0 0;color:var(--ai1x-gold);font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.ai1x-hero-card__signal{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:28px}.ai1x-hero-card__signal i{height:46px;border-radius:10px;background:linear-gradient(180deg,var(--ai1x-green),rgba(145,255,25,.06));transform-origin:bottom;animation:ai1xSignal 1.8s ease-in-out infinite}.ai1x-hero-card__signal i:nth-child(2){animation-delay:.2s}.ai1x-hero-card__signal i:nth-child(3){animation-delay:.4s}.ai1x-hero-card__signal i:nth-child(4){animation-delay:.6s}.ai1x-hero-card__signal i:nth-child(5){animation-delay:.8s}
@keyframes ai1xSignal{0%,100%{transform:scaleY(.35);opacity:.45}50%{transform:scaleY(1);opacity:1}}
.ai1x-scroll{position:absolute;right:4vw;bottom:28px;display:flex;align-items:center;gap:12px;color:#9aaa9f!important;font-size:.68rem;font-weight:800;letter-spacing:.13em;text-decoration:none;text-transform:uppercase}.ai1x-scroll i{width:2px;height:44px;background:linear-gradient(var(--ai1x-green),transparent);animation:ai1xScroll 1.7s ease-in-out infinite}@keyframes ai1xScroll{0%,100%{transform:scaleY(.35);transform-origin:top}50%{transform:scaleY(1)}}

/* 04. BUTTONS AND CHIPS -------------------------------------------------- */
.ai1x-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.ai1x-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 24px;border:1px solid transparent;border-radius:999px;font-weight:800;text-decoration:none;cursor:pointer;transition:.25s ease}
.ai1x-button--primary{background:linear-gradient(135deg,var(--ai1x-green),var(--ai1x-green-deep));color:#061006!important;box-shadow:0 14px 34px rgba(115,214,0,.24)}
.ai1x-button--ghost{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.045);color:#fff!important}
.ai1x-button:hover,.ai1x-button:focus-visible{transform:translateY(-3px)}
.ai1x-chips{display:flex;flex-wrap:wrap;gap:9px}.ai1x-chip{padding:8px 11px;border:1px solid var(--ai1x-line);border-radius:999px;background:rgba(145,255,25,.05);color:#cfe0d4;font-size:.72rem;font-weight:700}
.ai1x-status{display:inline-flex;align-items:center;gap:8px;color:var(--ai1x-green);font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.ai1x-status::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 13px currentColor}

/* 05. CARDS AND GRIDS ---------------------------------------------------- */
.ai1x-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ai1x-card{position:relative;overflow:hidden;padding:clamp(26px,3vw,38px);border:1px solid var(--ai1x-line);border-radius:var(--ai1x-radius);background:linear-gradient(150deg,rgba(13,31,20,.96),rgba(4,12,7,.98));box-shadow:0 24px 66px rgba(0,0,0,.28);transition:.3s ease}
.ai1x-card:hover{transform:translateY(-8px);border-color:var(--ai1x-line-strong);box-shadow:0 34px 84px rgba(0,0,0,.38),0 0 38px rgba(145,255,25,.07)}
.ai1x-card__number{display:inline-flex;margin-bottom:28px;color:var(--ai1x-green);font-size:.73rem;font-weight:800;letter-spacing:.15em}.ai1x-card h3{margin:0 0 12px;font-size:clamp(1.35rem,2vw,2rem);font-weight:500}.ai1x-card p{color:var(--ai1x-muted)}
.ai1x-card ul{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none}.ai1x-card li{position:relative;padding-left:25px;color:#b8c7bd;font-size:.92rem}.ai1x-card li::before{content:"✓";position:absolute;left:0;color:var(--ai1x-green)}
.ai1x-card--light{border-color:rgba(16,35,24,.1);background:#fff;box-shadow:0 22px 60px rgba(14,35,21,.1)}.ai1x-card--light h3{color:#102318}.ai1x-card--light p,.ai1x-card--light li{color:#5f7165}

/* 06. SOLUTION FINDER ---------------------------------------------------- */
.ai1x-finder{display:grid;grid-template-columns:minmax(260px,.62fr) minmax(0,1.38fr);gap:28px}
.ai1x-finder__choices{display:grid;gap:10px}.ai1x-finder__choice{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:20px;border:1px solid var(--ai1x-line);border-radius:18px;background:rgba(255,255,255,.025);color:#d9e5dc;font:inherit;font-weight:700;text-align:left;cursor:pointer;transition:.24s}.ai1x-finder__choice:hover,.ai1x-finder__choice.is-active{border-color:var(--ai1x-line-strong);background:rgba(145,255,25,.08);color:#fff}.ai1x-finder__choice span:last-child{color:var(--ai1x-green)}
.ai1x-finder__result{min-height:470px;padding:clamp(30px,5vw,60px);border:1px solid var(--ai1x-line-strong);border-radius:32px;background:radial-gradient(circle at 90% 10%,rgba(145,255,25,.12),transparent 28rem),linear-gradient(145deg,#0b1b11,#030906);box-shadow:var(--ai1x-shadow)}
.ai1x-finder__result[hidden]{display:none}.ai1x-finder__result h3{font-size:clamp(2rem,4vw,4rem);font-weight:500}.ai1x-finder__result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}.ai1x-finder__result-grid span{padding:16px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:rgba(255,255,255,.025);color:#c6d3ca}

/* 07. METRICS, TIMELINE AND PROCESS ------------------------------------- */
.ai1x-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.ai1x-metric{padding:30px 24px;border:1px solid var(--ai1x-line);border-radius:22px;background:rgba(255,255,255,.025);text-align:center}.ai1x-metric strong{display:block;color:var(--ai1x-green);font-size:clamp(2.2rem,4vw,4rem);line-height:1}.ai1x-metric span{display:block;margin-top:10px;color:var(--ai1x-muted);font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.ai1x-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:steps}.ai1x-step{position:relative;padding:30px 24px;border-top:2px solid var(--ai1x-line-strong);background:linear-gradient(180deg,rgba(145,255,25,.045),transparent)}.ai1x-step::before{counter-increment:steps;content:"0" counter(steps);display:block;margin-bottom:22px;color:var(--ai1x-green);font-size:.74rem;font-weight:800;letter-spacing:.14em}.ai1x-step h3{font-size:1.35rem}.ai1x-step p{color:var(--ai1x-muted)}
.ai1x-timeline{position:relative;display:grid;gap:18px}.ai1x-timeline::before{content:"";position:absolute;left:22px;top:18px;bottom:18px;width:2px;background:linear-gradient(var(--ai1x-green),transparent)}.ai1x-timeline__item{position:relative;padding:24px 24px 24px 72px;border:1px solid var(--ai1x-line);border-radius:20px;background:rgba(255,255,255,.025)}.ai1x-timeline__item::before{content:"";position:absolute;left:15px;top:28px;width:16px;height:16px;border:3px solid #07110b;border-radius:50%;background:var(--ai1x-green);box-shadow:0 0 18px rgba(145,255,25,.55)}

/* 08. CONCEPT SHOWCASE --------------------------------------------------- */
.ai1x-concepts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.ai1x-concept{overflow:hidden;border:1px solid rgba(16,35,24,.12);border-radius:28px;background:#fff;box-shadow:0 26px 70px rgba(15,38,23,.12);transition:.3s}.ai1x-concept:hover{transform:translateY(-8px);box-shadow:0 34px 88px rgba(15,38,23,.18)}
.ai1x-browser{background:#15211a}.ai1x-browser__bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:#0b110d}.ai1x-browser__bar i{width:9px;height:9px;border-radius:50%;background:#ff5d5d}.ai1x-browser__bar i:nth-child(2){background:#ffc64a}.ai1x-browser__bar i:nth-child(3){background:#8aff43}.ai1x-browser__screen{position:relative;display:grid;min-height:320px;place-items:center;overflow:hidden;background:var(--concept-bg,linear-gradient(135deg,#203a2a,#08100b))}.ai1x-browser__screen::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.22),transparent 30%)}.ai1x-browser__screen strong{position:relative;color:#fff;font-size:clamp(2rem,4vw,4rem);text-align:center;line-height:1.02}.ai1x-concept__body{padding:28px}.ai1x-concept__body h3{margin:0;color:#102318;font-size:1.7rem}.ai1x-concept__body p{color:#5f7165}

/* 09. PAGE ACCENTS AND HOST COMPONENTS ---------------------------------- */
.ai1x-page--host{--ai1x-green:#8be817;--ai1x-green-deep:#4b9800}
.ai1x-page--design{--ai1x-green:#79e100;--ai1x-green-deep:#54a700;--ai1x-gold:#ffcf6d}
.ai1x-server-rack{display:grid;gap:10px;margin-top:28px}.ai1x-server{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:14px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#040b06}.ai1x-server__lights{display:flex;gap:5px}.ai1x-server__lights i{width:8px;height:8px;border-radius:50%;background:var(--ai1x-green);box-shadow:0 0 10px currentColor}.ai1x-server__bar{height:6px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}.ai1x-server__bar::before{content:"";display:block;width:72%;height:100%;background:linear-gradient(90deg,var(--ai1x-green),transparent);animation:ai1xLoad 2.4s ease-in-out infinite}@keyframes ai1xLoad{0%,100%{width:28%}50%{width:86%}}

/* 10. RESPONSIVE AND REDUCED MOTION ------------------------------------- */
@media(max-width:1040px){.ai1x-hero__inner{grid-template-columns:1fr}.ai1x-hero-card{max-width:720px}.ai1x-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ai1x-finder{grid-template-columns:1fr}.ai1x-metrics,.ai1x-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.ai1x-shell{width:min(100% - 24px,1380px)}.ai1x-hero{min-height:auto;padding:100px 0 86px}.ai1x-hero h1{font-size:clamp(3rem,14vw,5rem)}.ai1x-hero-card__details{grid-template-columns:1fr}.ai1x-grid,.ai1x-concepts,.ai1x-metrics,.ai1x-steps,.ai1x-finder__result-grid{grid-template-columns:1fr}.ai1x-scroll{display:none}}
@media(prefers-reduced-motion:reduce){.ai1x-page *,.ai1x-page *::before,.ai1x-page *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}