/* ===========================================
    ARTIKEL ~ AVIANTOGEL (STYLE SEO SEMOK)
=========================================== */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;700;900&display=swap');

.mecha-notes{
position:relative;
max-width:px;
margin:px auto;
padding:24px 150px;
font-family:'Orbitron',sans-serif;
background:linear-gradient(180deg,#0e2403 0%, #0e2403 100%);
border:1px solid rgb(30, 255, 0);
border-radius:14px;
overflow:hidden;
box-shadow:
0 0 18px rgba(60, 255, 0, 0.25),
0 0 35px rgba(94, 255, 0, 0.18),
inset 0 0 24px rgba(51, 255, 0, 0.08);
}

.mecha-notes::before{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(rgba(123, 255, 0, 0.185) 1px, transparent 1px),
linear-gradient(90deg, rgba(72, 255, 0, 0.178) 1px, transparent 1px);
background-size:28px 28px;
pointer-events:none;
}

.mecha-notes::after{
content:"";
position:absolute;
left:0;
top:-40%;
width:100%;
height:100px;
background:linear-gradient(
to bottom,
rgba(43, 255, 0, 0),
rgba(9, 255, 0, 0.18),
rgba(43, 255, 0, 0.45),
rgba(81, 255, 0, 0.18),
rgba(60, 255, 0, 0)
);
box-shadow:0 0 20px rgba(51, 255, 0, 0.18);
animation:mechaScan 3.5s linear infinite;
pointer-events:none;
}

.mecha-notes .hud-corner{
position:absolute;
width:34px;
height:34px;
pointer-events:none;
}

.mecha-notes .hud-corner::before,
.mecha-notes .hud-corner::after{
content:"";
position:absolute;
background:linear-gradient(90deg,#a8ff8d,#51ff00);
box-shadow:0 0 10px rgba(72, 255, 0, 0.7);
}

.mecha-notes .hud-corner::before{
width:26px;
height:3px;
top:0;
left:0;
}

.mecha-notes .hud-corner::after{
width:3px;
height:26px;
top:0;
left:0;
}

.mecha-notes .tl{top:8px;left:8px;}
.mecha-notes .tr{top:8px;right:8px;transform:rotate(90deg);}
.mecha-notes .bl{bottom:8px;left:8px;transform:rotate(-90deg);}
.mecha-notes .br{bottom:8px;right:8px;transform:rotate(180deg);}

.mecha-notes .title{
position:relative;
z-index:2;
margin:0 0 14px;
font-size:18px;
font-weight:800;
letter-spacing:2px;
text-transform:uppercase;
color:#a5ff8e;
text-shadow:
0 0 8px #1eff00,
0 0 18px #2bff00;
}

.mecha-notes .desc{
position:relative;
z-index:2;
margin:0;
font-size:13px;
line-height:1.9;
color:#ecffe8;
text-shadow:0 0 6px rgba(51, 255, 0, 0.15);
}

.mecha-notes .status-line{
position:relative;
z-index:2;
display:inline-block;
margin-bottom:12px;
padding:6px 10px;
font-size:10px;
letter-spacing:2px;
text-transform:uppercase;
color:#caffbd;
border:1px solid rgba(60, 255, 0, 0.3);
background:rgba(40, 110, 0, 0.18);
box-shadow:0 0 12px rgba(72, 255, 0, 0.12);
}

.mecha-notes .pulse-ring{
position:absolute;
inset:0;
border-radius:14px;
border:1px solid rgba(0,255,255,.12);
box-shadow:inset 0 0 18px rgba(0,255,255,.06);
pointer-events:none;
}

@keyframes mechaScan{
0%{top:-40%;}
100%{top:120%;}
}

@keyframes mechaPulse{
0%,100%{opacity:.5;transform:scale(1);}
50%{opacity:1;transform:scale(1.01);}
}

@media(max-width:768px){
.mecha-notes{
padding:20px 16px;
}
.mecha-notes .title{
font-size:15px;
}
.mecha-notes .desc{
font-size:12px;
line-height:1.8;
}
}

/* =====================================
    FAQ ~ AVIANTOGEL (STYLE SEO SEMOK)
=======================================*/
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@600;800;900&display=swap');
:root{
  --mb-bg0:#0d1602;
  --mb-bg1:#0b2700;
  --mb-bg2:#183b00;
  --mb-line:rgba(60, 255, 0, 0.7);
  --mb-line2:rgba(60, 255, 0, 0.55);
  --mb-glow:rgba(0, 255, 0, 0.85);
  --mb-glow2:rgba(60, 255, 0, 0.75);
  --mb-txt:#e0ffd7;
  --mb-muted:#afff8f;
  --mb-red:#ff2d55;
}

.faq-mecha{
  max-width: 980px;
  margin: 70px auto;
  font-family:'Orbitron',sans-serif;
  position:relative;
  padding: 0 14px;
}

.mecha-status{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-bottom: 18px;
  font-size:12px;
  letter-spacing:2.2px;
  color: var(--mb-muted);
  text-shadow: 0 0 14px var(--mb-glow);
  user-select:none;
}
.mecha-dot{
  width:9px;height:9px;border-radius:50%;
  background: var(--mb-glow);
  box-shadow: 0 0 18px var(--mb-glow), 0 0 35px var(--mb-glow2);
  animation: pulse 1.1s infinite;
}
@keyframes pulse{
  50%{ transform:scale(.75); opacity:.55; }
}
.mecha-tag{
  padding: 6px 10px;
  border:1px solid rgba(81, 255, 0, 0.35);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(43, 255, 0, 0.08), rgba(51, 255, 0, 0.05));
  box-shadow: inset 0 0 18px rgba(60, 255, 0, 0.1);
}

.avian-togel-faq{
  margin: 18px 0;
  border-radius: 22px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 22% 18%, rgba(72, 255, 0, 0.18), transparent 45%),
    radial-gradient(circle at 80% 20%, rgba(30, 255, 0, 0.18), transparent 48%),
    linear-gradient(160deg, var(--mb-bg0), var(--mb-bg1) 45%, var(--mb-bg2));
  border: 1.8px solid rgba(43, 255, 0, 0.85);
  box-shadow:
    0 0 40px rgba(36, 119, 11, 0.85),
    inset 0 0 35px rgba(43, 212, 1, 0.45);
  transition: transform .5s cubic-bezier(.16,.96,.2,1), box-shadow .5s;
}

.avian-togel-faq::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(to right, rgba(115, 255, 0, 0.1) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(43, 255, 0, 0.1) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity:.25;
  mix-blend-mode: screen;
  pointer-events:none;
}

.avian-togel-faq::after{
  content:"";
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(180deg,
      rgba(255,255,255,.04) 0px,
      rgba(255,255,255,.04) 1px,
      transparent 2px,
      transparent 6px
    ),
    radial-gradient(circle at 40% 30%, rgba(94, 255, 0, 0.15), transparent 55%),
    radial-gradient(circle at 70% 70%, rgba(94, 255, 0, 0.14), transparent 60%);
  opacity:.20;
  animation: scan 1.9s linear infinite;
  pointer-events:none;
}
@keyframes scan{
  to{ transform: translateY(18px); }
}

.avian-togel-faq summary{
  padding: 22px 88px 22px 24px;
  cursor:pointer;
  list-style:none;
  color: var(--mb-txt);
  font-size: 18px;
  font-weight: 900;
  letter-spacing:.7px;
  position:relative;
  z-index:3;
  text-shadow: 0 0 14px var(--mb-glow), 0 0 32px rgb(60, 255, 0);
  outline:none;
}

.avian-togel-faq summary::-webkit-details-marker{ display:none; }

.avian-togel-faq summary::before{
  content:"";
  position:absolute;
  left:14px; top:14px;
  width: 22px; height: 22px;
  border-left: 2px solid rgba(43, 255, 0, 0.85);
  border-top: 2px solid rgba(94, 255, 0, 0.85);
  filter: drop-shadow(0 0 10px rgba(115, 255, 0, 0.55));
  opacity:.9;
}
.avian-togel-faq summary .mb-sub{
  display:block;
  margin-top:6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  color: rgba(213, 255, 185, 0.85);
  text-shadow:none;
}

.avian-togel-faq summary::after{
  content:"⌁ LOCK-ON";
  position:absolute;
  right: 18px; top: 18px;
  font-size: 12px;
  letter-spacing: 2px;
  padding: 8px 10px;
  border-radius: 10px;
  color: rgba(102, 255, 0, 0.95);
  border: 1px solid rgba(102, 255, 0, 0.45);
  background: linear-gradient(180deg, rgba(81, 255, 0, 0.1)rgba(43, 255, 0, 0.06)6);
  box-shadow: inset 0 0 18px rgba(81, 255, 0, 0.12), 0 0 18px rgba(72, 255, 0, 0.18);
  transition: .45s;
}

.avian-togel-faq[open]{
  transform: translateY(-2px) scale(1.03);
  border-color: rgb(81, 255, 0);
  box-shadow:
    0 0 85px rgb(52, 136, 13),
    0 0 140px rgba(20, 165, 7, 0.7),
    inset 0 0 70px rgb(37, 134, 13);
}

.avian-togel-faq[open] summary::after{
  content:"⟁ ENGAGED";
  color: #00131f;
  background: linear-gradient(180deg, rgb(30, 255, 0), rgb(60, 255, 0));
  border-color: rgba(94, 255, 0, 0.95);
  box-shadow: 0 0 28px rgba(43, 255, 0, 0.75), 0 0 55px rgba(81, 255, 0, 0.45);
}

.avian-togel-faq[open] summary{
  animation: mbGlitch .32s steps(2) 1;
}
@keyframes mbGlitch{
  0%{ text-shadow: 3px 0 var(--mb-red), -3px 0 var(--mb-glow); }
  45%{ text-shadow: -3px 0 var(--mb-red), 3px 0 var(--mb-glow); }
  100%{ text-shadow: 0 0 16px var(--mb-glow), 0 0 32px rgb(72, 255, 0); }
}

.avian-togel-faq .mb-body{
  padding: 0 24px 24px;
  color: rgba(243, 255, 235, 0.95);
  font-size: 15.1px;
  line-height: 1.85;
  position:relative;
  z-index:3;
  animation: deploy .45s ease-out;
}
@keyframes deploy{
  0%{ opacity:0; transform: translateY(-10px) scale(.96); }
  100%{ opacity:1; transform:none; }
}

.mb-shock{
  position:absolute;
  inset:-40px;
  background:
    radial-gradient(circle, rgba(94, 255, 0, 0.95), transparent 58%),
    radial-gradient(circle, rgba(43, 255, 0, 0.55), transparent 64%);
  opacity:.0;
  transform: scale(.7);
  pointer-events:none;
  animation: shock .48s ease-out forwards;
  filter: blur(.2px);
}
@keyframes shock{
  0%{ opacity:.95; transform: scale(.55); }
  100%{ opacity:0; transform: scale(1.35); }
}

.mb-log{
  margin-top: 12px;
  font-size: 12px;
  letter-spacing: 1.6px;
  color: rgba(180, 255, 145, 0.85);
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px dashed rgba(94, 255, 0, 0.35);
  background: rgba(10, 22, 0, 0.35);
}
.mb-log b{ color: rgba(72, 255, 0, 0.95); }

@media (prefers-reduced-motion: reduce){
  .avian-togel-faq, .avian-togel-faq::after, .mecha-dot, .avian-togel-faq[open] summary{ animation:none !important; }
  .avian-togel-faq{ transition:none !important; }
}


/* ===============================================
    TESTIMONI ~ AVIANTOGEL (STYLE BY SEO SEMOK)
=============================================== */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;900&display=swap');

.avian-togel-section{
  --void0:#020a00;
  --void1:#041602;
  --void2:#0b3407;

  --core:#00ff19;
  --core2:#57ff2a;
  --ice:#bbff9b;

  padding: 40px 80px;
  position:relative;
  overflow:hidden;

  font-family:"Orbitron","Inter",system-ui,sans-serif;
  color: rgba(243, 255, 240, 0.92);

  background:
    radial-gradient(120% 120% at 14% 10%, rgba(51, 255, 0, 0.14), transparent 45%),
    radial-gradient(120% 120% at 88% 92%, rgba(102, 255, 42, 0.12), transparent 55%),
    linear-gradient(180deg, var(--void1), var(--void0) 58%, var(--void2));
}

/* scanline */
.avian-togel-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: repeating-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.016),
    rgba(255, 255, 255, 0.016) 1px,
    transparent 1px,
    transparent 6px
  );
  opacity:.22;
  mix-blend-mode:overlay;
}

/* neon scan sweep */
.avian-togel-section::before{
  content:"";
  position:absolute;
  top:-25%;
  left:-60%;
  width:60%;
  height:160%;
  background: linear-gradient(120deg, transparent, rgba(81, 255, 0, 0.28), transparent);
  transform: skewX(-25deg);
  animation: tScan 4.2s infinite;
  pointer-events:none;
  mix-blend-mode:screen;
  opacity:.9;
}
@keyframes tScan{
  0%{left:-60%;}
  70%{left:140%;}
  100%{left:140%;}
}

.a-v-i-a-n-t-o-g-e-l-container{
  width:100%;
  margin:0;
  text-align:center;
  position:relative;
  z-index:2;
}

/* TITLE */
.a-v-i-a-n-t-o-g-e-l-container h2{
  margin:0 0 44px;
  font-size: 30px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;

  color: rgba(250,255,255,.98);
  text-shadow: 0 0 18px rgba(102, 255, 0, 0.55);
  display:inline-block;
  position:relative;
  padding: 6px 12px;
}

/* HUD underline */
.a-v-i-a-n-t-o-g-e-l-container h2::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:-10px;
  width:88px;
  height:3px;
  border-radius:2px;
  background: linear-gradient(90deg, var(--core), var(--core2));
  box-shadow: 0 0 14px rgba(102, 255, 0, 0.55);
}

/* GRID */
.avian-togel-testimoni{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 28px;
}

/* CARD */
.testimoni-avian-togel{
  position:relative;
  overflow:hidden;
  text-align:left;

  padding: 22px 22px 20px;
  border-radius: 18px;

  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    radial-gradient(120% 120% at 18% 0%, rgba(30, 255, 0, 0.12), transparent 55%),
    rgba(14, 34, 2, 0.62);

  border: 1px solid rgba(94, 255, 0, 0.3);

  box-shadow:
    0 14px 34px rgba(0,0,0,.68),
    inset 0 0 0 1px rgba(255,255,255,.05);

  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease;
}

.testimoni-avian-togel::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:4px;
  background: linear-gradient(180deg, rgba(255,255,255,.55), var(--core), rgba(255,255,255,.12));
  box-shadow: 0 0 14px rgba(102, 255, 0, 0.55);
  opacity:.9;
}

.testimoni-avian-togel:hover::after{
  content:"";
  position:absolute;
  inset:-2px;
  background: linear-gradient(120deg,
    transparent 0%,
    rgba(255,255,255,0) 40%,
    rgba(255,255,255,.85) 50%,
    rgba(255,255,255,0) 60%,
    transparent 100%
  );
  opacity:.55;
  animation: tSlash .32s linear;
  pointer-events:none;
  mix-blend-mode:screen;
}
@keyframes tSlash{
  from{transform:translateX(-160%);}
  to{transform:translateX(160%);}
}

.testimoni-avian-togel:hover{
  transform: translateY(-6px);
  border-color: rgba(21, 255, 0, 0.7);
  box-shadow:
    0 20px 48px rgba(0,0,0,.78),
    0 0 30px rgba(94, 255, 0, 0.3),
    inset 0 0 0 1px rgba(255,255,255,.07);
  filter: saturate(1.06);
}

.testimoni-avian-togel p{
  margin: 0 0 14px;
  font-size: 14.5px;
  line-height: 1.75;
  color: rgba(220,252,255,.86);
}

.testimoni-avian-togel h4{
  margin:0;
  font-size: 15px;
  font-weight: 900;
  color: rgba(250,255,255,.98);
  text-shadow: 0 0 12px rgb(38 255 0 / 35%);
}

.testimoni-avian-togel span{
  display:block;
  margin-top: 6px;
  font-size: 12px;
  color: rgba(204, 255, 180, 0.65);
}