:root {

  --blue: #1e398f;

  --pink: #c7007e;

  --white: #ffffff;

  --off-white: #f8f7ff;

  --light-gray: #f0eeff;

  --dark: #0b2545;

  --grad: linear-gradient(135deg, #1e398f, #c7007e);

  --grad-rev: linear-gradient(135deg, #c7007e, #1e398f);

  --font-display: "DM Sans", sans-serif;

  --font-body: "DM Sans", sans-serif;

  --font-mono: "DM Sans", monospace;

}



*,

*::before,

*::after {

  box-sizing: border-box;

  margin: 0;

  padding: 0;

}



html {

  scroll-behavior: smooth;

  overflow-x: hidden;

}



body {

  font-family: var(--font-body);

  background: var(--white);

  color: var(--dark);

  overflow-x: hidden;

  /*cursor: none;*/

}



/* CURSOR */

/*#cursor {*/

/*  width: 20px;*/

/*  height: 20px;*/

/*  position: fixed;*/

/*  top: 0;*/

/*  left: 0;*/

/*  pointer-events: none;*/

/*  z-index: 99999;*/

/*  border-radius: 50%;*/

/*  transform: translate(-50%, -50%);*/

/*  background: linear-gradient(135deg, #ff00cc, #3333ff, #00ffe7);*/

/*  background-size: 300% 300%;*/

/*  animation: funkyGradient 4s ease infinite;*/

/*  box-shadow:*/

/*    0 0 10px rgba(255, 0, 200, 0.8),*/

/*    0 0 20px rgba(0, 255, 255, 0.6),*/

/*    0 0 40px rgba(0, 0, 255, 0.5);*/

/*}*/



/*#cursor-aura {*/

/*  width: 70px;*/

/*  height: 70px;*/

/*  position: fixed;*/

/*  top: 0;*/

/*  left: 0;*/

/*  pointer-events: none;*/

/*  border-radius: 50%;*/

/*  transform: translate(-50%, -50%);*/

/*  background: radial-gradient(circle, rgba(255, 0, 200, 0.25), transparent 60%);*/

/*  filter: blur(6px);*/

/*  animation: pulseAura 2s infinite ease-in-out;*/

/*}*/



/*@keyframes funkyGradient {*/

/*  0% {*/

/*    background-position: 0% 50%;*/

/*  }*/



/*  50% {*/

/*    background-position: 100% 50%;*/

/*  }*/



/*  100% {*/

/*    background-position: 0% 50%;*/

/*  }*/

/*}*/



@keyframes pulseAura {

  0%,

  100% {

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

    opacity: 0.6;

  }



  50% {

    transform: translate(-50%, -50%) scale(1.3);

    opacity: 0.3;

  }

}



@media (hover: none) and (pointer: coarse) {

  #cursor,

  #cursor-aura {

    display: none !important;

  }



  * {

    cursor: auto !important;

  }

}



/* PROGRESS */

#progress {

  position: fixed;

  top: 0;

  left: 0;

  height: 3px;

  z-index: 9999;

  background: var(--grad);

  width: 0;

  transition: width 0.1s;

}



/* BTT */

#btt {

  position: fixed;

  bottom: 2rem;

  right: 2rem;

  width: 48px;

  height: 48px;

  border-radius: 50%;

  border: none;

  background: var(--grad);

  color: #fff;

  font-size: 1.2rem;

  /*cursor: none;*/

  z-index: 999;

  box-shadow: 0 6px 20px rgba(199, 0, 126, 0.4);

  display: flex;

  align-items: center;

  justify-content: center;

  opacity: 0;

  transform: translateY(20px);

  transition:

    opacity 0.3s,

    transform 0.3s;

}



#btt.show {

  opacity: 1;

  transform: translateY(0);

}



#btt:hover {

  transform: translateY(-3px);

}



/* NAV */

nav {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  z-index: 1000;

  padding: 1.1rem 5%;

  display: flex;

  align-items: center;

  justify-content: space-between;

  backdrop-filter: blur(18px);

  background: rgba(255, 255, 255, 0.75);

  border-bottom: 1px solid rgba(30, 57, 143, 0.08);

  transition: all 0.4s ease;

}



.nav-logo {

  font-family: var(--font-display);

  font-size: 1.5rem;

  font-weight: 800;

  background: var(--grad);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  text-decoration: none;

  letter-spacing: -0.02em;

}



.nav-links {

  display: flex;

  gap: 2.2rem;

  list-style: none;

}



.nav-links a {

  font-family: var(--font-display);

  font-size: 0.88rem;

  font-weight: 600;

  color: var(--dark);

  text-decoration: none;

  letter-spacing: 0.04em;

  position: relative;

  transition: color 0.3s;

}



.nav-links a::after {

  content: "";

  position: absolute;

  bottom: -4px;

  left: 0;

  width: 0;

  height: 2px;

  background: var(--grad);

  transition: width 0.3s ease;

}



.nav-links a:hover {

  color: var(--blue);

}



.nav-links a:hover::after {

  width: 100%;

}



.nav-cta {

  background: var(--grad);

  color: #fff;

  border: none;

  padding: 0.65rem 1.6rem;

  border-radius: 50px;

  font-family: var(--font-display);

  font-weight: 700;

  font-size: 0.85rem;

  /*cursor: none;*/

  letter-spacing: 0.06em;

  box-shadow: 0 4px 20px rgba(199, 0, 126, 0.35);

  transition:

    transform 0.2s,

    box-shadow 0.2s;

}



.nav-cta:hover {

  transform: translateY(-2px) scale(1.04);

  box-shadow: 0 8px 30px rgba(199, 0, 126, 0.5);

}



@media (max-width: 640px) {

  .nav-links {

    display: none;

  }

}



/* MARQUEE */

.marquee-wrap {

  overflow: hidden;

  background: var(--grad);

  padding: 1rem 0;

}



.marquee-track {

  display: flex;

  gap: 0;

  animation: marquee 22s linear infinite;

  white-space: nowrap;

}



@keyframes marquee {

  0% {

    transform: translateX(0);

  }



  100% {

    transform: translateX(-50%);

  }

}



.marquee-item {

  font-family: var(--font-display);

  font-size: 0.85rem;

  font-weight: 700;

  color: rgba(255, 255, 255, 0.85);

  letter-spacing: 0.1em;

  padding: 0 2rem;

  display: inline-flex;

  align-items: center;

  gap: 0.8rem;

}



.marquee-sep {

  opacity: 0.4;

}



/* HERO BANNER */

.page-hero {

  min-height: 38vh;

  display: flex;

  align-items: center;

  padding: 9rem 5% 5rem;

  position: relative;

  overflow: hidden;

  background: var(--dark);

}



.blob-wrap {

  position: absolute;

  inset: 0;

  overflow: hidden;

  pointer-events: none;

}



.blob {

  position: absolute;

  border-radius: 50%;

  filter: blur(70px);

  opacity: 0.18;

  animation: blobFloat 10s ease-in-out infinite alternate;

}



.blob-1 {

  width: 520px;

  height: 520px;

  background: var(--blue);

  top: -120px;

  right: -80px;

  animation-duration: 13s;

}



.blob-2 {

  width: 300px;

  height: 300px;

  background: var(--pink);

  bottom: -60px;

  left: -40px;

  animation-duration: 10s;

  animation-delay: -4s;

}



@keyframes blobFloat {

  0% {

    transform: translate(0, 0) scale(1);

  }



  50% {

    transform: translate(30px, -40px) scale(1.08);

  }



  100% {

    transform: translate(-20px, 20px) scale(0.96);

  }

}



.dot-grid {

  position: absolute;

  inset: 0;

  pointer-events: none;

  background-image: radial-gradient(

    circle,

    rgba(30, 57, 143, 0.12) 1px,

    transparent 1px

  );

  background-size: 34px 34px;

  mask-image: radial-gradient(

    ellipse 80% 80% at 50% 50%,

    black 40%,

    transparent 100%

  );

}



.page-hero-inner {

  position: relative;

  z-index: 2;

  max-width: 1280px;

  margin: 0 auto;

  width: 100%;

}



.hero-badge {

  display: inline-flex;

  align-items: center;

  gap: 0.5rem;

background: rgba(255, 255, 255, 0.07);

  border: 1px solid rgba(255, 255, 255, 0.15);

  padding: 0.4rem 1rem;

  border-radius: 50px;

  font-family: var(--font-mono);

  font-size: 0.75rem;

  letter-spacing: 0.08em;

    color: rgba(255, 255, 255, 0.7);

  margin-bottom: 1.4rem;

}



.badge-dot {

  width: 8px;

  height: 8px;

  border-radius: 50%;

  background: var(--pink);

  animation: blink 1.4s ease-in-out infinite;

}



@keyframes blink {

  0%,

  100% {

    opacity: 1;

  }



  50% {

    opacity: 0.2;

  }

}



.page-title {

  font-family: var(--font-display);

  font-size: clamp(2.4rem, 5vw, 4.2rem);

  font-weight: 800;

  line-height: 1.06;

  letter-spacing: -0.03em;

  color: #fff;

}



.page-title .grad-text {

  background: var(--grad);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



.page-meta {

  display: flex;

  gap: 2rem;

  margin-top: 1.4rem;

  flex-wrap: wrap;

}



.page-meta-item {

  font-family: var(--font-mono);

  font-size: 0.72rem;

  color: #888;

  letter-spacing: 0.06em;

  display: flex;

  align-items: center;

  gap: 0.4rem;

}



.page-meta-item span {

  color: var(--pink);

}



/* SECTION LABEL */

.section-label {

  font-family: var(--font-mono);

  font-size: 0.72rem;

  font-weight: 700;

  letter-spacing: 0.18em;

  color: var(--pink);

  margin-bottom: 0.8rem;

  display: flex;

  align-items: center;

  gap: 0.5rem;

}



.section-label::before {

  content: "//";

  color: var(--blue);

}



/* CONTENT LAYOUT */

.content-wrap {

  max-width: 1280px;

  margin: 0 auto;

  padding: 5rem 5%;

  display: grid;

  grid-template-columns: 280px 1fr;

  gap: 4rem;

  align-items: start;

}



/* SIDEBAR TOC */

.toc {

  position: sticky;

  top: 6rem;

  background: var(--off-white);

  border-radius: 20px;

  padding: 1.8rem;

  border: 1px solid rgba(30, 57, 143, 0.08);

}



.toc-title {

  font-family: var(--font-display);

  font-size: 0.8rem;

  font-weight: 700;

  letter-spacing: 0.1em;

  color: var(--blue);

  margin-bottom: 1rem;

  text-transform: uppercase;

}



.toc-list {

  list-style: none;

  display: flex;

  flex-direction: column;

  gap: 0.5rem;

}



.toc-list a {

  font-size: 0.82rem;

  color: #777;

  text-decoration: none;

  padding: 0.4rem 0.7rem;

  border-radius: 8px;

  display: flex;

  align-items: center;

  gap: 0.5rem;

  transition: all 0.2s;

  border-left: 2px solid transparent;

}



.toc-list a:hover {

  color: var(--blue);

  background: rgba(30, 57, 143, 0.06);

  border-left-color: var(--blue);

}



.toc-list a.active {

  color: var(--pink);

  background: rgba(199, 0, 126, 0.06);

  border-left-color: var(--pink);

}



.toc-num {

  font-family: var(--font-mono);

  font-size: 0.65rem;

  opacity: 0.5;

}



.toc-divider {

  height: 1px;

  background: rgba(30, 57, 143, 0.08);

  margin: 0.6rem 0;

}



/* MAIN CONTENT */

.policy-content {

  min-width: 0;

}



.policy-section {

  margin-bottom: 3.5rem;

  padding-bottom: 3.5rem;

  border-bottom: 1px solid rgba(30, 57, 143, 0.08);

}



.policy-section:last-child {

  border-bottom: none;

}



.policy-section-num {

  font-family: var(--font-mono);

  font-size: 0.68rem;

  color: rgba(30, 57, 143, 0.3);

  letter-spacing: 0.1em;

  margin-bottom: 0.6rem;

}



.policy-section h2 {

  font-family: var(--font-display);

  font-size: 1.5rem;

  font-weight: 800;

  color: var(--dark);

  margin-bottom: 1rem;

  letter-spacing: -0.02em;

}



.policy-section h2 .hl {

  background: var(--grad);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



.policy-section p {

  font-size: 0.92rem;

  color: #555;

  line-height: 1.8;

  margin-bottom: 0.9rem;

}



.policy-section p:last-child {

  margin-bottom: 0;

}



.policy-section ul,

.policy-section ol {

  padding-left: 1.4rem;

  display: flex;

  flex-direction: column;

  gap: 0.5rem;

  margin-bottom: 0.9rem;

}



.policy-section li {

  font-size: 0.92rem;

  color: #555;

  line-height: 1.7;

}



.policy-section strong {

  color: var(--dark);

  font-weight: 600;

}



/* INFO CARD */

.info-card {

  background: rgba(30, 57, 143, 0.04);

  border: 1px solid rgba(30, 57, 143, 0.12);

  border-left: 3px solid var(--blue);

  border-radius: 12px;

  padding: 1.2rem 1.4rem;

  margin: 1.2rem 0;

}



.info-card.pink {

  border-left-color: var(--pink);

  background: rgba(199, 0, 126, 0.03);

  border-color: rgba(199, 0, 126, 0.12);

  border-left-color: var(--pink);

}



.info-card p {

  font-size: 0.85rem;

  margin-bottom: 0 !important;

}



/* DATA TABLE */

.data-table {

  width: 100%;

  border-collapse: collapse;

  margin: 1.2rem 0;

  border-radius: 12px;

  overflow: hidden;

  border: 1px solid rgba(30, 57, 143, 0.1);

}



.data-table th {

  background: var(--grad);

  color: #fff;

  font-family: var(--font-display);

  font-size: 0.75rem;

  font-weight: 700;

  letter-spacing: 0.06em;

  padding: 0.85rem 1.1rem;

  text-align: left;

}



.data-table td {

  padding: 0.8rem 1.1rem;

  font-size: 0.83rem;

  color: #555;

  border-bottom: 1px solid rgba(30, 57, 143, 0.06);

}



.data-table tr:last-child td {

  border-bottom: none;

}



.data-table tr:nth-child(even) td {

  background: rgba(30, 57, 143, 0.02);

}



/* FOOTER */

footer {

  background: #060611;

  padding: 3rem 5% 2rem;

  border-top: 1px solid rgba(255, 255, 255, 0.05);

}



.footer-inner {

  max-width: 1280px;

  margin: 0 auto;

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 1.5rem;

}



.footer-logo {

  font-family: var(--font-display);

  font-size: 1.4rem;

  font-weight: 800;

  background: var(--grad);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



.footer-copy {

  font-size: 0.8rem;

  color: rgba(255, 255, 255, 0.3);

}



.footer-links {

  display: flex;

  gap: 1.5rem;

}



.footer-links a {

  font-size: 0.8rem;

  color: rgba(255, 255, 255, 0.4);

  text-decoration: none;

  transition: color 0.2s;

}



.footer-links a:hover {

  color: var(--pink);

}



/* NOISE */

body::after {

  content: "";

  position: fixed;

  inset: 0;

  pointer-events: none;

  z-index: 99990;

  opacity: 0.018;

  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

}



@media (max-width: 1024px) {

  .content-wrap {

    grid-template-columns: 1fr;

    gap: 2.5rem;

  }



  .toc {

    position: static;

  }

}



@media (max-width: 640px) {

  .content-wrap {

    padding: 3rem 5%;

  }



  .data-table {

    font-size: 0.75rem;

  }



  .data-table th,

  .data-table td {

    padding: 0.6rem 0.8rem;

  }

}