:root{

  --gold:#d4af37;
  --dark:#050505;
  --dark2:#0b0b0b;
  --glass:rgba(255,255,255,0.04);

}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{

  background:

  radial-gradient(
    circle at top left,
    rgba(212,175,55,0.07),
    transparent 25%
  ),

  radial-gradient(
    circle at bottom right,
    rgba(255,255,255,0.04),
    transparent 25%
  ),

  linear-gradient(
    180deg,
    #050505,
    #080808,
    #050505
  );

  color:white;

  overflow-x:hidden;

  font-family:'Inter',sans-serif;

  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;

}

/* ========================= */

h1,h2,h3{
  font-family:'Playfair Display',serif;
}

section{
  position:relative;
  padding:140px 20px;
  overflow:hidden;
  scroll-margin-top:110px;
}

/* =========================
   TECHNOLOGY GRID
========================= */

.tech-lines{

  position:absolute;
  inset:0;

  background-image:

  linear-gradient(
    rgba(255,255,255,0.03) 1px,
    transparent 1px
  ),

  linear-gradient(
    90deg,
    rgba(255,255,255,0.03) 1px,
    transparent 1px
  );

  background-size:60px 60px;

  mask-image:
  linear-gradient(
    to bottom,
    transparent,
    black 20%,
    black 80%,
    transparent
  );

  pointer-events:none;

}

/* =========================
   PREMIUM GLOW
========================= */

section::before{

  content:"";

  position:absolute;

  width:500px;
  height:500px;

  background:
  radial-gradient(
    circle,
    rgba(212,175,55,0.05),
    transparent 70%
  );

  top:-200px;
  right:-200px;

  border-radius:50%;

}

section::after{

  content:"";

  position:absolute;

  width:400px;
  height:400px;

  background:
  radial-gradient(
    circle,
    rgba(255,255,255,0.03),
    transparent 70%
  );

  bottom:-200px;
  left:-200px;

  border-radius:50%;

}

/* =========================
   IMAGE PROTECTION
========================= */

img{

  -webkit-user-drag:none;

  user-select:none;

  pointer-events:none;

}

/* =========================
   NAVBAR
========================= */

.navbar{

  position:fixed;
  top:0;
  left:0;

  width:100%;

  display:flex;
  justify-content:space-between;
  align-items:center;

  padding:18px 70px;

  z-index:999;

  background:
  rgba(0,0,0,0.45);

  backdrop-filter:blur(15px);

  border-bottom:
  1px solid rgba(255,255,255,0.08);

}

/* =========================
   LOGO
========================= */

.logo{

  width:220px;
  height:70px;

  overflow:hidden;

  border-radius:14px;

  display:flex;
  align-items:center;
  justify-content:center;

}

.logo img{

  width:100%;
  height:100%;

  object-fit:contain;

}

/* ========================= */

.nav-menu{
  display:flex;
  gap:40px;
}

.nav-menu a{

  position:relative;

  color:white;

  text-decoration:none;

  transition:0.3s;

  padding-bottom:8px;

}

/* garis bawah animasi */
.nav-menu a::after{

  content:"";

  position:absolute;

  left:0;
  bottom:0;

  width:0%;
  height:2px;

  background:
  linear-gradient(
    90deg,
    transparent,
    var(--gold),
    #f5e08a
  );

  border-radius:20px;

  transition:0.4s ease;

  box-shadow:
  0 0 15px rgba(212,175,55,0.4);

}

/* hover */
.nav-menu a:hover{

  color:var(--gold);

}

/* animasi garis jalan */
.nav-menu a:hover::after{

  width:100%;

}

.login-btn{

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  text-decoration:none;

  padding:14px 24px;

  border-radius:12px;

  font-weight:700;

}

/* =========================
   HAMBURGER
========================= */

.menu-toggle{

  display:none;

  width:40px;
  height:40px;

  position:relative;

  cursor:pointer;

}

.menu-toggle span{

  position:absolute;

  width:100%;
  height:3px;

  background:white;

  border-radius:10px;

  transition:0.4s;

}

.menu-toggle span:nth-child(1){
  top:8px;
}

.menu-toggle span:nth-child(2){
  top:18px;
}

.menu-toggle span:nth-child(3){
  top:28px;
}

.menu-toggle.active span:nth-child(1){

  transform:rotate(45deg);

  top:18px;

}

.menu-toggle.active span:nth-child(2){
  opacity:0;
}

.menu-toggle.active span:nth-child(3){

  transform:rotate(-45deg);

  top:18px;

}

/* =========================
   HERO
========================= */

.hero{

  min-height:100vh;
  filter:contrast(1.05) brightness(1.05);
  display:flex;
  justify-content:center;
  align-items:center;

  text-align:center;

  position:relative;

  overflow:hidden;

  background:
  linear-gradient(
    rgba(0,0,0,0.55),
    rgba(0,0,0,0.82)
  ),

  url("https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?q=80&w=2000");

  background-size:cover;
  background-position:center;

}

.hero-overlay{

  position:absolute;
  inset:0;

}

.hero-content{

  position:relative;
  z-index:2;

  max-width:1100px;

}

.mini-title{

  color:var(--gold);

  letter-spacing:5px;

}

.hero h1{

  font-size:76px;
  line-height:1.2;

  margin:30px 0;

  text-shadow:
  0 0 35px rgba(212,175,55,0.25);

}

.hero-subtitle{

  font-size:24px;
  opacity:0.85;

}

.hero-buttons{

  display:flex;
  justify-content:center;
  gap:20px;

  margin-top:45px;

}

.store-btn{

  display:flex;
  align-items:center;
  gap:12px;

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  text-decoration:none;

  padding:16px 30px;

  border-radius:14px;

  font-weight:700;

  transition:0.4s;

  box-shadow:
  0 0 20px rgba(212,175,55,0.15);

}

.store-btn{

  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  text-decoration:none;

  padding:16px 30px;

  border-radius:14px;

  font-weight:700;

  transition:0.4s;

  box-shadow:
  0 0 20px rgba(212,175,55,0.15);

}

.store-btn i{

  font-size:22px;

  color:black;

}

.store-btn:hover{

  transform:
  translateY(-5px);

  box-shadow:
  0 0 30px rgba(212,175,55,0.35);

}

/* =========================
   WHY
========================= */

.why-us{

  background:

  radial-gradient(
    circle at top right,
    rgba(212,175,55,0.08),
    transparent 30%
  ),

  linear-gradient(
    135deg,
    #080808,
    #101010,
    #080808
  );

}

.why-grid{

  max-width:1400px;
  margin:auto;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:70px;

  align-items:center;

  position:relative;
  z-index:2;

}

video{

  width:100%;

  border-radius:30px;

  border:
  1px solid rgba(212,175,55,0.15);

}

.why-text span{

  color:var(--gold);

  letter-spacing:4px;

}

.why-text h2{

  font-size:55px;
  margin:20px 0;

}

.why-text p{

  line-height:2;
  opacity:0.8;

  margin-bottom:20px;

}

/* =========================
   SERVICES
========================= */

.services{

  background:

  radial-gradient(
    circle at center,
    rgba(212,175,55,0.08),
    transparent 30%
  ),

  linear-gradient(
    180deg,
    #050505,
    #0d0d0d,
    #050505
  );

}

.section-title{

  text-align:center;

  margin-bottom:70px;

}

.section-title span{

  color:var(--gold);

  letter-spacing:4px;

  font-size:13px;

}

.section-title h2{

  font-size:58px;

  margin-top:15px;

}

.services-grid{

  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:30px;

  position:relative;
  z-index:2;

}

.service-card{

  position:relative;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.12);

  border-radius:30px;

  overflow:hidden;

  transition:0.5s;

  backdrop-filter:blur(15px);

  box-shadow:

  inset 0 1px 1px rgba(255,255,255,0.05),

  0 10px 40px rgba(0,0,0,0.5);

}

.service-card:hover{

  transform:
  translateY(-10px);

  border-color:var(--gold);

  box-shadow:
  0 0 40px rgba(212,175,55,0.15);

}

.service-card img{

  width:100%;
  height:240px;

  object-fit:cover;

}

.card-content{
  padding:30px;
}

.service-card h2{

  font-size:30px;

  margin-bottom:15px;

}

.service-card p{

  line-height:1.8;

  opacity:0.8;

  margin-bottom:25px;

}

/* =========================
   BUTTONS
========================= */

.service-card button,
.back-btn,
.download-btn{

  display:inline-block;

  margin-top:35px;

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  border:none;

  color:black;

  padding:14px 24px;

  border-radius:12px;

  font-weight:700;

  cursor:pointer;

  text-decoration:none;

  transition:0.3s;

}

.service-card button:hover,
.back-btn:hover,
.download-btn:hover{

  transform:translateY(-3px);

  box-shadow:
  0 10px 25px rgba(212,175,55,0.25);

}

/* =========================
   SERVICE DETAIL
========================= */

.service-detail{

  display:none;

  max-width:1400px;

  margin:0 auto;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.15);

  border-radius:30px;

  padding:50px;

  position:relative;

  z-index:2;

  backdrop-filter:blur(20px);

  overflow:hidden;

  animation:fadeDetail .5s ease;

}

.service-detail.active{
  display:block;
}

@keyframes fadeDetail{

  from{
    opacity:0;
    transform:translateY(30px);
  }

  to{
    opacity:1;
    transform:translateY(0);
  }

}

.detail-title{

  font-size:60px;

  margin-bottom:25px;

}

.detail-text{

  line-height:2;

  opacity:0.82;

  font-size:17px;

}

.detail-image{

  width:100%;

  max-height:500px;

  object-fit:cover;

  border-radius:25px;

  margin-top:35px;

  display:block;

}

/* =========================
   MOBILE
========================= */

@media(max-width:992px){

  .services-grid{
    grid-template-columns:1fr;
  }

  .section-title h2,
  .detail-title{
    font-size:38px;
  }

  .service-detail{
    padding:25px;
  }

  .detail-image{

    width:100%;

    max-width:100%;

    max-height:260px;

    object-fit:cover;

  }

  .service-card img{
    height:220px;
  }

}
/* =========================
   LEI
========================= */

.lei-section{

  background:

  radial-gradient(
    circle at left,
    rgba(212,175,55,0.08),
    transparent 30%
  ),

  radial-gradient(
    circle at bottom right,
    rgba(255,255,255,0.03),
    transparent 30%
  ),

  linear-gradient(
    135deg,
    #070707,
    #101010
  );

}

.lei-grid{

  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:70px;

  align-items:center;

  position:relative;
  z-index:2;

}

.lei-images{

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:20px;

}

.lei-images img{

  width:100%;

  aspect-ratio:210 / 297;

  object-fit:cover;

  border-radius:20px;

  background:white;

}
/* =========================
   LEI DESCRIPTION BOX
========================= */

.lei-text{

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.12);

  border-radius:30px;

  padding:40px;

  backdrop-filter:blur(15px);

  transition:0.4s;

  position:relative;

  overflow:hidden;

}

.lei-text:hover{

  transform:
  translateY(-8px);

  border-color:var(--gold);

  box-shadow:
  0 0 35px rgba(212,175,55,0.15);

}
.lei-content span{

  color:var(--gold);

  letter-spacing:4px;

  font-size:13px;

}

.lei-content h2{

  font-size:48px;

  margin:20px 0;

  line-height:1.3;

}

.lei-content p{

  line-height:2;

  opacity:0.82;

  margin-bottom:18px;

}
/* =========================
   DOWNLOAD BUTTON
========================= */

.download-btn{

  display:inline-block;

  margin-top:30px;

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  text-decoration:none;

  padding:14px 24px;

  border-radius:12px;

  font-weight:700;

  transition:0.4s;

}

.download-btn:hover{

  transform:
  translateY(-5px);

  box-shadow:
  0 0 25px rgba(212,175,55,0.35);

}

/* =========================
   ABOUT US
========================= */

.about-section{

  background:

  radial-gradient(
    circle at top left,
    rgba(212,175,55,0.08),
    transparent 30%
  ),

  linear-gradient(
    135deg,
    #080808,
    #101010,
    #080808
  );

}

.about-box{

  max-width:1200px;

  margin:0 auto 80px;

  padding:50px;

  border-radius:30px;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.12);

  backdrop-filter:blur(15px);

  line-height:2;

  position:relative;
  z-index:2;

  transition:0.4s;

}

.about-box:hover{

  transform:
  translateY(-8px);

  border-color:var(--gold);

  box-shadow:
  0 0 40px rgba(212,175,55,0.15);

}

.about-box h3{

  margin:35px 0 15px;

  color:var(--gold);

  font-size:28px;

}

.about-box p{

  opacity:0.85;

  margin-bottom:20px;

}

.about-highlight{

  margin-top:40px;

  padding:35px;

  border-radius:25px;

  background:
  rgba(255,255,255,0.03);

  border:
  1px solid rgba(255,255,255,0.08);

}
/* =========================
   ABOUT VIDEO
========================= */

.about-video{

  width:100%;

  max-width:1000px;

  margin:0 auto 50px;

  border-radius:28px;

  overflow:hidden;

  position:relative;

  border:
  1px solid rgba(212,175,55,0.15);

  background:black;

  box-shadow:
  0 0 40px rgba(0,0,0,0.45);

  transition:0.4s;

}

.about-video:hover{

  transform:
  translateY(-6px);

  border-color:var(--gold);

  box-shadow:
  0 0 45px rgba(212,175,55,0.18);

}

.about-video video{

  width:100%;

  aspect-ratio:16/9;

  display:block;

  object-fit:cover;

  background:black;

}
/* =========================
   OFFICE BOXES
========================= */

.office-grid{

  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:repeat(3,1fr);

  gap:30px;

  position:relative;
  z-index:2;

}

.office-box{

  padding:30px;

  border-radius:30px;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.12);

  transition:0.4s;

  backdrop-filter:blur(15px);

}

.office-box:hover{

  transform:
  translateY(-10px);

  border-color:var(--gold);

  box-shadow:
  0 0 40px rgba(212,175,55,0.15);

}

.office-box h3{

  color:var(--gold);

  margin-bottom:20px;

  font-size:26px;

}

.office-box p{

  line-height:2;

  opacity:0.85;

  margin-bottom:25px;

}

.office-box iframe{

  width:100%;

  height:250px;

  border:none;

  border-radius:20px;

}

/* =========================
   MOBILE
========================= */

@media(max-width:992px){

  .office-grid{
    grid-template-columns:1fr;
  }

  .about-box{
    padding:30px;
  }

  .about-box h3{
    font-size:24px;
  }

}

/* =========================
   CONTACT
========================= */

.contact{

  background:

  linear-gradient(
    rgba(0,0,0,0.78),
    rgba(0,0,0,0.88)
  ),

  url("https://images.unsplash.com/photo-1512428559087-560fa5ceab42?q=80&w=870&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");

  background-size:cover;

  background-position:center;

}

.contact-grid{

  max-width:900px;

  margin:auto;

  display:grid;

  grid-template-columns:1fr 1fr;

  gap:30px;

  position:relative;
  z-index:2;

}

.contact-box{

  background:
  rgba(255,255,255,0.03);

  border:
  1px solid rgba(212,175,55,0.12);

  border-radius:25px;

  padding:40px;

}
/* =========================
   CONTACT HOVER
========================= */

.contact-box{

  transition:0.4s;

}

.contact-box:hover{

  transform:
  translateY(-8px);

  border-color:var(--gold);

  box-shadow:
  0 0 35px rgba(212,175,55,0.15);

}
/* =========================
   CONTACT EMAIL LINK
========================= */

.contact-box a{

  color:white;

  text-decoration:none;

  transition:0.3s;

}

.contact-box a:hover{

  color:var(--gold);

}/* =========================
   FOOTER
========================= */

.footer{

  background:
  linear-gradient(
    180deg,
    #050505,
    #0b0b0b
  );

  border-top:
  1px solid rgba(212,175,55,0.12);

  padding:80px 20px 40px;

  position:relative;

  overflow:hidden;

}

.footer-top{

  max-width:1400px;

  margin:auto;

  display:grid;

  grid-template-columns:
  1.5fr 1fr 1fr;

  gap:60px;

  position:relative;
  z-index:2;

}

.footer-brand{

  display:flex;

  flex-direction:column;

  gap:25px;

}

.footer-logo{

  width:220px;

  height:auto;

  object-fit:contain;

}

.footer-desc{

  line-height:1.9;

  opacity:0.8;

  max-width:500px;

}

.footer-links h3,
.footer-social h3{

  margin-bottom:25px;

  font-size:24px;

}

.footer-links{

  display:flex;

  flex-direction:column;

}

.footer-links a{

  color:white;

  text-decoration:none;

  margin-bottom:16px;

  opacity:0.8;

  transition:0.4s;

  width:fit-content;

  position:relative;

}

.footer-links a::after{

  content:"";

  position:absolute;

  left:0;
  bottom:-5px;

  width:0%;

  height:2px;

  background:var(--gold);

  transition:0.4s;

}

.footer-links a:hover{

  color:var(--gold);

  opacity:1;

}

.footer-links a:hover::after{

  width:100%;

}

.social-icons{

  display:flex;

  gap:18px;

}

.social-icons a{

  width:52px;
  height:52px;

  display:flex;
  justify-content:center;
  align-items:center;

  border-radius:14px;

  background:
  rgba(255,255,255,0.03);

  border:
  1px solid rgba(212,175,55,0.12);

  color:var(--gold);

  font-size:20px;

  transition:0.4s;

  text-decoration:none;

}

.social-icons a:hover{

  transform:
  translateY(-6px);

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  box-shadow:
  0 0 25px rgba(212,175,55,0.35);

}

.footer-bottom{

  max-width:1400px;

  margin:70px auto 0;

  padding-top:35px;

  border-top:
  1px solid rgba(212,175,55,0.15);

  text-align:center;

  font-size:10px;

  color:rgba(212,175,55,0.75);

  opacity:0.7;

  line-height:2;

  position:relative;
  z-index:2;

}

/* =========================
   MOBILE FOOTER
========================= */

@media(max-width:992px){

  .footer-top{

    grid-template-columns:1fr;

    gap:50px;

  }

  .footer-logo{

    width:220px;

    height:80px;

  }

  .footer-links,
  .footer-social{

    margin-top:10px;

  }

}

/* =========================
   MOBILE
========================= */

.mobile-login{
  display:none;
}

@media(max-width:992px){

  .navbar{
    padding:20px;
  }

  .login-btn{
    display:none;
  }

  .menu-toggle{
    display:block;
    z-index:1001;
  }

  .nav-menu{

    position:fixed;

    top:0;
    right:-100%;

    width:280px;
    height:100vh;

    background:
    rgba(5,5,5,0.95);

    backdrop-filter:blur(20px);

    flex-direction:column;

    padding:120px 40px;

    transition:0.5s;

    border-left:
    1px solid rgba(212,175,55,0.12);

  }

  .nav-menu.active{
    right:0;
  }

  .mobile-login{
    display:block;
  }

  .hero h1{
    font-size:42px;
  }

  .hero-buttons{
    flex-direction:column;
  }

  .why-grid,
  .services-grid,
  .lei-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }

  .section-title h2,
  .why-text h2,
  .detail-title{
    font-size:38px;
  }

  .service-detail{
    padding:25px;
  }

  .detail-image{

    width:100%;

    max-width:100%;

    max-height:260px;

    object-fit:cover;

  }

  .service-card img{
    height:220px;
  }

}

/* =========================
   PRIVACY PAGE
========================= */

.privacy-hero{

  min-height:60vh;

}

.privacy-section{

  background:
  linear-gradient(
    180deg,
    #050505,
    #0d0d0d,
    #050505
  );

}

.privacy-container{

  max-width:1200px;

  margin:auto;

  position:relative;
  z-index:2;

}

.privacy-box{

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.04),
    rgba(255,255,255,0.02)
  );

  border:
  1px solid rgba(212,175,55,0.12);

  border-radius:30px;

  padding:60px;

  backdrop-filter:blur(15px);

}

.privacy-box h2{

  font-size:50px;

  margin-bottom:30px;

}

.privacy-box h3{

  margin-top:45px;

  margin-bottom:20px;

  color:var(--gold);

  font-size:28px;

}

.privacy-box p{

  line-height:2;

  opacity:0.82;

  margin-bottom:20px;

}

.privacy-box ul{

  padding-left:20px;

}

.privacy-box li{

  margin-bottom:15px;

  line-height:1.8;

  opacity:0.82;

}

.privacy-email{

  color:var(--gold);

  text-decoration:none;

  font-weight:700;

}

.privacy-email:hover{

  text-decoration:underline;

}

@media(max-width:992px){

  .privacy-box{

    padding:30px;

  }

  .privacy-box h2{

    font-size:36px;

  }

  .privacy-box h3{

    font-size:24px;

  }

}
/* =========================
   POLICY HERO
========================= */

.policy-hero{

  height:55vh;

  display:flex;

  justify-content:center;
  align-items:center;

  text-align:center;

  position:relative;

  overflow:hidden;

  background:
  linear-gradient(
    135deg,
    #050505,
    #111
  );

}

.policy-content{

  position:relative;
  z-index:2;

  max-width:900px;

  padding:0 20px;

}

.policy-content span{

  color:var(--gold);

  letter-spacing:4px;

  font-size:13px;

}

.policy-content h1{

  font-size:68px;

  margin-top:20px;

}

.policy-content p{

  opacity:0.7;

  margin-top:20px;

}

/* =========================
   POLICY SECTION
========================= */

.policy-section{

  padding:120px 7%;

  position:relative;

}

.policy-box{

  display:flex;

  justify-content:space-between;

  gap:50px;

  align-items:center;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.01)
  );

  border:
  1px solid rgba(212,175,55,0.1);

  border-radius:35px;

  padding:50px;

  backdrop-filter:blur(14px);

}

.policy-text{

  flex:1;

}

.policy-text span{

  color:var(--gold);

  letter-spacing:3px;

  font-size:13px;

}

.policy-text h2{

  font-size:42px;

  margin:18px 0;

}

.policy-text p{

  opacity:0.8;

  line-height:2;

}

/* =========================
   BUTTONS
========================= */

.policy-actions{

  display:flex;

  flex-direction:column;

  gap:20px;

}

.policy-btn{

  background:
  linear-gradient(
    135deg,
    var(--gold),
    #f5e08a
  );

  color:black;

  text-decoration:none;

  padding:16px 30px;

  border-radius:14px;

  font-weight:700;

  transition:0.4s;

  text-align:center;

}

.policy-btn:hover{

  transform:
  translateY(-5px);

  box-shadow:
  0 0 25px rgba(212,175,55,0.3);

}

.policy-btn.outline{

  background:transparent;

  border:
  1px solid var(--gold);

  color:var(--gold);

}

/* =========================
   TERMS CONTENT
========================= */

.terms-content{

  margin-top:70px;

  background:
  linear-gradient(
    145deg,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.01)
  );

  border:
  1px solid rgba(255,255,255,0.06);

  border-radius:35px;

  padding:60px;

  line-height:2;

}

.terms-content h3{

  margin-top:40px;

  margin-bottom:15px;

  color:var(--gold);

  font-size:28px;

}

.terms-content p,
.terms-content li{

  opacity:0.82;

}

.terms-content ul{

  padding-left:20px;

}

/* =========================
   MOBILE
========================= */

@media(max-width:900px){

  .policy-box{

    flex-direction:column;

  }

  .policy-actions{

    width:100%;

  }

  .policy-btn{

    width:100%;

  }

  .policy-content h1{

    font-size:42px;

  }

  .terms-content{

    padding:35px;

  }

}