/* ============================================================
   AI1DESIGN — POLICY.CSS
   Dedicated legal / policy page styling
   ------------------------------------------------------------
   Covers:
   - Privacy Policy
   - Terms & Conditions
   - Future Cookie / Accessibility / Complaints pages
   - Sticky policy navigator
   - Reading progress
   - Scroll reveal hooks for policy.js
============================================================ */

:root{
  --ai1policy-bg:#06101d;
  --ai1policy-panel:#0a1b30;
  --ai1policy-panel-2:#102b49;
  --ai1policy-green:#39ff14;
  --ai1policy-cyan:#00cfff;
  --ai1policy-orange:#ff7b00;
  --ai1policy-yellow:#ffe600;
  --ai1policy-pink:#ff4fd8;
  --ai1policy-white:#fff;
  --ai1policy-muted:rgba(255,255,255,.76);
  --ai1policy-radius:32px;
  --ai1policy-ease:cubic-bezier(.22,1,.36,1);
  --ai1policy-progress:0;
}

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

/* ============================================================
   1) HERO
============================================================ */

.ai1policy-hero{
  position:relative;
  min-height:86vh;
  overflow:hidden;
  isolation:isolate;
  background:#04080f;
}

.ai1policy-hero-video{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.68;
  pointer-events:none;
}

.ai1policy-hero-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 8% 10%,rgba(57,255,20,.22),transparent 30%),
    radial-gradient(circle at 92% 14%,rgba(0,207,255,.24),transparent 31%),
    radial-gradient(circle at 82% 88%,rgba(255,123,0,.20),transparent 30%),
    radial-gradient(circle at 14% 90%,rgba(255,230,0,.12),transparent 28%),
    linear-gradient(to bottom,rgba(0,0,0,.38),rgba(0,0,0,.88));
}

.ai1policy-hero-inner{
  position:relative;
  z-index:2;
  min-height:86vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(5rem,8vw,7rem) 1.5rem clamp(5rem,8vw,7rem);
}

.ai1policy-hero-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:min(1080px,100%);
  padding:clamp(2.2rem,5vw,4.4rem);
  border:1px solid rgba(255,255,255,.17);
  border-radius:34px;
  background:
    radial-gradient(circle at 10% 10%,rgba(57,255,20,.11),transparent 28%),
    radial-gradient(circle at 90% 12%,rgba(0,207,255,.12),transparent 28%),
    linear-gradient(135deg,rgba(4,10,18,.84),rgba(8,25,42,.76));
  box-shadow:
    0 34px 110px rgba(0,0,0,.58),
    0 0 52px rgba(57,255,20,.09),
    0 0 64px rgba(0,207,255,.08),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  color:#fff;
  text-align:center;
}

.ai1policy-hero-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(125deg,
    rgba(57,255,20,.82),
    rgba(0,207,255,.68),
    rgba(255,123,0,.54),
    rgba(255,79,216,.48),
    rgba(255,230,0,.52)
  );
  background-size:300% 300%;
  animation:ai1policyBorder 10s linear infinite;
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
}

.ai1policy-hero-card::after{
  content:"";
  position:absolute;
  inset:-50% auto -50% -65%;
  z-index:0;
  width:42%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,.08),transparent);
  transform:rotate(12deg);
  animation:ai1policySweep 9s ease-in-out infinite;
  pointer-events:none;
}

.ai1policy-hero-content{
  position:relative;
  z-index:2;
}

.ai1policy-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:fit-content;
  margin:0 0 1.15rem;
  padding:.7rem 1.1rem;
  border-radius:999px;
  background:linear-gradient(90deg,
    var(--ai1policy-green),
    var(--ai1policy-cyan),
    var(--ai1policy-orange),
    var(--ai1policy-yellow),
    var(--ai1policy-pink),
    var(--ai1policy-green)
  );
  background-size:400% 100%;
  color:#06160a;
  font-size:.78rem;
  font-weight:950;
  letter-spacing:.07em;
  text-transform:uppercase;
  box-shadow:
    0 12px 28px rgba(57,255,20,.18),
    0 12px 32px rgba(0,207,255,.12),
    inset 0 1px 0 rgba(255,255,255,.35);
  animation:ai1policyGradient 8s linear infinite;
}

.ai1policy-hero-card .ai1policy-kicker{
  margin-left:auto;
  margin-right:auto;
}

.ai1policy-hero-card h1{
  max-width:920px;
  margin:0 auto 1rem;
  font-size:clamp(2.8rem,6.6vw,5.4rem);
  line-height:1.02;
  font-weight:850;
  letter-spacing:-.05em;
  background-image:linear-gradient(90deg,
    #fff,
    var(--ai1policy-green),
    var(--ai1policy-cyan),
    var(--ai1policy-orange),
    var(--ai1policy-yellow),
    #fff
  );
  background-size:420% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1policyGradient 9s linear infinite,ai1policyGlow 4s ease-in-out infinite;
}

.ai1policy-hero-lead{
  max-width:820px;
  margin:0 auto 1.3rem;
  color:rgba(255,255,255,.94);
  font-size:clamp(1.08rem,1.8vw,1.35rem);
  line-height:1.7;
  font-weight:650;
}

.ai1policy-hero-signoff{
  margin:1.2rem 0 0;
  color:#d9ffe2;
  font-weight:800;
}

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

.ai1policy-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:.9rem 1.4rem;
  border-radius:999px;
  font-weight:900;
  text-decoration:none;
  transition:transform .22s ease,box-shadow .22s ease,background .22s ease;
}

.ai1policy-btn:hover{ transform:translateY(-3px) scale(1.025); }

.ai1policy-btn-primary{
  background:linear-gradient(90deg,var(--ai1policy-green),var(--ai1policy-cyan),var(--ai1policy-orange),var(--ai1policy-green));
  background-size:300% 100%;
  color:#041b08;
  box-shadow:0 14px 34px rgba(57,255,20,.25),0 0 28px rgba(0,207,255,.18);
  animation:ai1policyGradient300 7s linear infinite;
}

.ai1policy-btn-secondary{
  color:#fff;
  border:1px solid rgba(255,255,255,.20);
  background:rgba(255,255,255,.08);
}

.ai1policy-btn-secondary:hover{
  background:rgba(255,255,255,.14);
  box-shadow:0 0 28px rgba(0,207,255,.16);
}

/* ============================================================
   2) HERO-TO-DOCUMENT SIGNAL DIVIDER
============================================================ */

.ai1policy-divider{
  position:relative;
  z-index:20;
  height:92px;
  margin:-46px 0 0;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}

.ai1policy-divider-line{
  position:absolute;
  left:50%;
  top:50%;
  width:calc(100vw - 36px);
  height:6px;
  border-radius:999px;
  transform:translate(-50%,-50%);
  background:linear-gradient(90deg,
    transparent,
    var(--ai1policy-green),
    var(--ai1policy-cyan),
    var(--ai1policy-orange),
    var(--ai1policy-pink),
    transparent
  );
  box-shadow:0 0 22px rgba(0,207,255,.22),0 0 18px rgba(57,255,20,.18);
}

.ai1policy-divider-badge{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:84px;
  height:84px;
  border:4px solid #fff;
  border-radius:50%;
  background:radial-gradient(circle at 30% 25%,#fff 0%,#e7f7ff 48%,#a9d9ef 100%);
  color:#061126;
  font-size:2rem;
  font-weight:900;
  box-shadow:0 0 0 6px rgba(57,255,20,.18),0 0 30px rgba(0,207,255,.30),0 16px 34px rgba(0,0,0,.30);
}

/* ============================================================
   3) DOCUMENT AREA
============================================================ */

.ai1policy-content{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(4rem,7vw,6.5rem) 0 clamp(5rem,8vw,7rem);
  background:
    radial-gradient(circle at 8% 10%,rgba(57,255,20,.10),transparent 30%),
    radial-gradient(circle at 92% 20%,rgba(0,207,255,.12),transparent 32%),
    radial-gradient(circle at 78% 86%,rgba(255,123,0,.08),transparent 30%),
    linear-gradient(180deg,#07111f 0%,#081a2b 48%,#050c16 100%);
}

.ai1policy-content::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:52px 52px;
  opacity:.55;
  -webkit-mask-image:radial-gradient(circle at center,black 25%,transparent 100%);
          mask-image:radial-gradient(circle at center,black 25%,transparent 100%);
}

.ai1policy-wrap{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(260px,.32fr) minmax(0,.68fr);
  gap:clamp(1.5rem,3vw,2.6rem);
  width:min(1380px,calc(100% - 48px));
  margin:0 auto;
  align-items:start;
}

.ai1policy-panel{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:30px;
  background:
    radial-gradient(circle at 8% 8%,rgba(57,255,20,.08),transparent 28%),
    radial-gradient(circle at 92% 12%,rgba(0,207,255,.08),transparent 30%),
    linear-gradient(145deg,rgba(10,27,48,.94),rgba(6,16,29,.96));
  box-shadow:0 28px 82px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.05);
  color:#fff;
}

.ai1policy-summary{
  position:sticky;
  top:1.25rem;
  padding:clamp(1.5rem,3vw,2.2rem);
}

.ai1policy-summary h2,
.ai1policy-document h2{
  margin:0 0 1rem;
  font-size:clamp(1.8rem,3.4vw,3rem);
  line-height:1.08;
  letter-spacing:-.04em;
  background-image:linear-gradient(90deg,#fff,var(--ai1policy-green),var(--ai1policy-cyan),var(--ai1policy-orange),#fff);
  background-size:420% 100%;
  -webkit-background-clip:text;
          background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:ai1policyGradient 10s linear infinite;
}

.ai1policy-summary p,
.ai1policy-document p,
.ai1policy-document li{
  color:rgba(255,255,255,.84);
  line-height:1.75;
}

.ai1policy-meta-card{
  margin:1.5rem 0;
  padding:1rem 1.1rem;
  border:1px solid rgba(255,255,255,.11);
  border-radius:18px;
  background:rgba(255,255,255,.045);
}

.ai1policy-meta-card span{
  display:block;
  margin-bottom:.25rem;
  color:var(--ai1policy-cyan);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ai1policy-meta-card strong{ color:#fff; }

.ai1policy-progress{
  margin:1.35rem 0 1.55rem;
}

.ai1policy-progress-label{
  display:flex;
  justify-content:space-between;
  gap:1rem;
  margin-bottom:.55rem;
  color:rgba(255,255,255,.66);
  font-size:.78rem;
  font-weight:750;
}

.ai1policy-progress-track{
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.08);
}

.ai1policy-progress-bar{
  width:calc(var(--ai1policy-progress) * 100%);
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--ai1policy-green),var(--ai1policy-cyan),var(--ai1policy-orange));
  box-shadow:0 0 18px rgba(0,207,255,.22);
  transition:width .1s linear;
}

.ai1policy-jump-list{
  display:grid;
  gap:.55rem;
}

.ai1policy-jump-list a{
  position:relative;
  display:flex;
  align-items:center;
  min-height:44px;
  padding:.72rem .9rem .72rem 2rem;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.78);
  font-size:.9rem;
  font-weight:750;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
}

.ai1policy-jump-list a::before{
  content:"";
  position:absolute;
  left:.85rem;
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(255,255,255,.28);
  box-shadow:0 0 10px rgba(255,255,255,.08);
}

.ai1policy-jump-list a:hover,
.ai1policy-jump-list a.is-active{
  transform:translateX(4px);
  border-color:rgba(0,207,255,.30);
  background:rgba(0,207,255,.08);
  color:#fff;
}

.ai1policy-jump-list a.is-active::before{
  background:var(--ai1policy-green);
  box-shadow:0 0 14px rgba(57,255,20,.44);
}

.ai1policy-document{
  padding:clamp(1.8rem,4vw,3.4rem);
}

.ai1policy-document-header{
  padding-bottom:1.8rem;
  margin-bottom:1.6rem;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.ai1policy-section{
  position:relative;
  margin:0 0 1.15rem;
  padding:clamp(1.3rem,2.6vw,1.9rem);
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
  scroll-margin-top:2rem;
}

.ai1policy-section::before{
  content:"";
  position:absolute;
  left:0;
  top:1.15rem;
  bottom:1.15rem;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,var(--ai1policy-green),var(--ai1policy-cyan),var(--ai1policy-orange));
  box-shadow:0 0 14px rgba(0,207,255,.14);
}

.ai1policy-section h3{
  margin:0 0 .85rem;
  padding-left:.4rem;
  color:#fff;
  font-size:clamp(1.25rem,2.3vw,1.65rem);
  line-height:1.2;
}

.ai1policy-section p:last-child,
.ai1policy-section ul:last-child{ margin-bottom:0; }

.ai1policy-section a{
  color:var(--ai1policy-green);
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}

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

.ai1policy-check-list li{
  position:relative;
  padding-left:2rem;
}

.ai1policy-check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:.1rem;
  display:grid;
  place-items:center;
  width:1.3rem;
  height:1.3rem;
  border-radius:50%;
  background:rgba(57,255,20,.13);
  color:var(--ai1policy-green);
  font-size:.76rem;
  font-weight:950;
}

.ai1policy-info-box{
  display:grid;
  gap:.7rem;
  margin-top:1rem;
  padding:1.15rem;
  border:1px solid rgba(0,207,255,.16);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(0,207,255,.07),rgba(57,255,20,.04));
}

.ai1policy-info-box p{ margin:0; }

/* ============================================================
   4) SCROLL MOTION — CONTROLLED BY POLICY.JS
============================================================ */

.ai1-policy-js-active .ai1policy-reveal{
  opacity:0;
  transition:opacity .76s var(--ai1policy-ease),transform .76s var(--ai1policy-ease);
  transition-delay:var(--ai1policy-delay,0ms);
  will-change:opacity,transform;
}

.ai1-policy-js-active .ai1policy-reveal.ai1policy-from-left{
  transform:translate3d(-58px,16px,0);
}

.ai1-policy-js-active .ai1policy-reveal.ai1policy-from-right{
  transform:translate3d(58px,16px,0);
}

.ai1-policy-js-active .ai1policy-reveal.ai1policy-from-down{
  transform:translate3d(0,38px,0);
}

.ai1-policy-js-active .ai1policy-reveal.ai1policy-zoom{
  transform:translate3d(0,24px,0) scale(.972);
}

.ai1-policy-js-active .ai1policy-reveal.is-inview{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  will-change:auto;
}

body.ai1-scroll-up .ai1policy-reveal.ai1policy-from-left:not(.is-inview){
  transform:translate3d(-58px,-16px,0);
}

body.ai1-scroll-up .ai1policy-reveal.ai1policy-from-right:not(.is-inview){
  transform:translate3d(58px,-16px,0);
}

body.ai1-scroll-up .ai1policy-reveal.ai1policy-from-down:not(.is-inview){
  transform:translate3d(0,-38px,0);
}

/* ============================================================
   5) RESPONSIVE
============================================================ */

@media (max-width:980px){
  .ai1policy-wrap{ grid-template-columns:1fr; }
  .ai1policy-summary{ position:relative; top:auto; }
  .ai1policy-jump-list{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:768px){
  .ai1policy-hero,
  .ai1policy-hero-inner{ min-height:100svh; }

  .ai1policy-hero-inner{ padding:5rem 1rem 5.5rem; }
  .ai1policy-hero-card{ padding:2rem 1.35rem; border-radius:24px; }
  .ai1policy-hero-card h1{ font-size:clamp(2.35rem,11vw,3.8rem); }
  .ai1policy-hero-actions{ flex-direction:column; }
  .ai1policy-btn{ width:100%; }

  .ai1policy-wrap{ width:calc(100% - 28px); }
  .ai1policy-jump-list{ grid-template-columns:1fr; }
  .ai1policy-panel{ border-radius:24px; }

  .ai1policy-divider{ height:82px; margin:-41px 0 0; }
  .ai1policy-divider-badge{ width:74px; height:74px; font-size:1.65rem; }

  .ai1-policy-js-active .ai1policy-reveal.ai1policy-from-left{ transform:translate3d(-28px,12px,0); }
  .ai1-policy-js-active .ai1policy-reveal.ai1policy-from-right{ transform:translate3d(28px,12px,0); }
}

@media (prefers-reduced-motion:reduce){
  .ai1policy-hero-card::before,
  .ai1policy-hero-card::after,
  .ai1policy-kicker,
  .ai1policy-hero-card h1,
  .ai1policy-summary h2,
  .ai1policy-document h2{
    animation:none !important;
  }

  .ai1policy-reveal{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* ============================================================
   6) KEYFRAMES
============================================================ */

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

@keyframes ai1policyGradient300{
  0%{background-position:0% 50%;}
  100%{background-position:300% 50%;}
}

@keyframes ai1policyBorder{
  0%{background-position:0% 50%;}
  100%{background-position:300% 50%;}
}

@keyframes ai1policySweep{
  0%,42%{left:-65%;opacity:0;}
  52%{opacity:1;}
  100%{left:135%;opacity:0;}
}

@keyframes ai1policyGlow{
  0%,100%{filter:drop-shadow(0 0 8px rgba(57,255,20,.14)) drop-shadow(0 0 15px rgba(0,207,255,.10));}
  50%{filter:drop-shadow(0 0 15px rgba(57,255,20,.24)) drop-shadow(0 0 25px rgba(0,207,255,.18));}
}
