/* Premium rate-table accordion for kalkulator-pajak.html. */
.kalk-methodology .method-table-wrap{
  --calc-tap-x:50%;
  --calc-tap-y:50%;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:0;
  margin:0 0 16px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.085),rgba(255,255,255,.045));
  box-shadow:
    0 14px 36px rgba(3,7,35,.13),
    inset 0 1px 0 rgba(255,255,255,.08);
  transform-origin:center top;
  backface-visibility:hidden;
  transition:
    border-color .38s ease,
    background-color .38s ease,
    box-shadow .38s ease;
}

.kalk-methodology .method-table-wrap:hover{
  border-color:rgba(246,197,18,.34);
  box-shadow:
    0 17px 42px rgba(3,7,35,.18),
    inset 0 1px 0 rgba(255,255,255,.1);
}

.kalk-methodology .method-table-wrap[open]{
  border-color:rgba(43,214,150,.38);
  background:
    radial-gradient(circle at 92% 0,rgba(43,214,150,.11),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.055));
  box-shadow:
    0 22px 54px rgba(3,7,35,.22),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.kalk-methodology .method-table-wrap.is-opening,
.kalk-methodology .method-table-wrap.is-closing{
  overflow:hidden;
}

.kalk-methodology .method-table-wrap::before{
  content:"";
  position:absolute;
  inset:12px auto 12px 0;
  z-index:2;
  width:3px;
  border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,#F6C512 0%,#2BD696 100%);
  box-shadow:0 0 22px rgba(43,214,150,.35);
  opacity:0;
  transform:scaleY(.16);
  transform-origin:center;
  transition:opacity .34s ease,transform .46s cubic-bezier(.4,0,.2,1);
  pointer-events:none;
}

.kalk-methodology .method-table-wrap[open]::before{
  opacity:1;
  transform:scaleY(1);
}

.kalk-methodology .method-table-wrap::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background:radial-gradient(
    circle at var(--calc-tap-x) var(--calc-tap-y),
    rgba(43,214,150,.2) 0,
    rgba(246,197,18,.09) 22%,
    transparent 56%
  );
  opacity:0;
  pointer-events:none;
}

.kalk-methodology .method-table-wrap.calc-tapped::after{
  animation:calculatorAccordionTap .5s cubic-bezier(.16,1,.3,1) both;
}

.kalk-methodology .method-table-wrap summary{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:14px;
  min-height:72px;
  padding:18px 78px 18px 24px;
  outline:none;
  color:#F6C512;
  font-family:'Outfit',sans-serif;
  font-size:14px;
  font-weight:750;
  line-height:1.45;
  letter-spacing:-.01em;
  list-style:none;
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  transition:color .34s ease,background-color .34s ease;
}

.kalk-methodology .method-table-wrap summary::-webkit-details-marker{
  display:none;
}

/* A small signal dot keeps the summary visually anchored without an icon asset. */
.kalk-methodology .method-table-wrap summary::before{
  content:"";
  flex:0 0 10px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#F6C512;
  box-shadow:0 0 0 5px rgba(246,197,18,.1),0 0 18px rgba(246,197,18,.24);
  transform:none;
  transition:
    background-color .34s ease,
    box-shadow .34s ease,
    transform .42s cubic-bezier(.4,0,.2,1);
}

.kalk-methodology .method-table-wrap[open] summary{
  color:#fff;
}

.kalk-methodology .method-table-wrap[open] summary::before{
  background:#2BD696;
  box-shadow:0 0 0 6px rgba(43,214,150,.11),0 0 22px rgba(43,214,150,.38);
  transform:scale(1.08);
}

/* Layered gradients create the same plus-to-minus motion used on FAQ. */
.kalk-methodology .method-table-wrap summary::after{
  content:"";
  position:absolute;
  top:50%;
  right:22px;
  width:40px;
  height:40px;
  border:1px solid rgba(246,197,18,.28);
  border-radius:50%;
  color:#F6C512;
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    rgba(246,197,18,.1);
  box-shadow:0 9px 22px rgba(3,7,35,.18),inset 0 1px 0 rgba(255,255,255,.12);
  transform:translateY(-50%) rotate(0deg) scale(1);
  transition:
    transform .44s cubic-bezier(.4,0,.2,1),
    color .34s ease,
    border-color .34s ease,
    background-color .34s ease,
    background-size .4s cubic-bezier(.4,0,.2,1),
    box-shadow .36s ease;
}

.kalk-methodology .method-table-wrap[open] summary::after{
  color:#fff;
  border-color:rgba(43,214,150,.44);
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 0 no-repeat,
    linear-gradient(135deg,#0E9F68,#2BD696);
  box-shadow:0 11px 26px rgba(14,166,114,.3),inset 0 1px 0 rgba(255,255,255,.28);
  transform:translateY(-50%) rotate(180deg) scale(1.06);
}

.kalk-methodology .method-table-wrap.is-closing summary::after{
  color:#F6C512;
  border-color:rgba(246,197,18,.28);
  background:
    linear-gradient(currentColor,currentColor) center/12px 2px no-repeat,
    linear-gradient(currentColor,currentColor) center/2px 12px no-repeat,
    rgba(246,197,18,.1);
  box-shadow:0 9px 22px rgba(3,7,35,.18),inset 0 1px 0 rgba(255,255,255,.12);
  transform:translateY(-50%) rotate(0deg) scale(1);
}

.kalk-methodology .method-table-wrap summary:focus-visible{
  border-radius:18px;
  box-shadow:inset 0 0 0 3px rgba(246,197,18,.34);
}

.kalk-methodology .method-table-scroll{
  position:relative;
  z-index:1;
  overflow-x:auto;
  margin:0 24px 22px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.1);
  scrollbar-width:thin;
  scrollbar-color:rgba(43,214,150,.58) rgba(255,255,255,.07);
  transform-origin:top center;
}

.kalk-methodology .method-table-scroll::-webkit-scrollbar{height:8px;}
.kalk-methodology .method-table-scroll::-webkit-scrollbar-track{
  border-radius:999px;
  background:rgba(255,255,255,.07);
}
.kalk-methodology .method-table-scroll::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:linear-gradient(90deg,#D6A619,#2BD696);
}

.kalk-methodology .method-table-wrap:not(.is-opening):not(.is-closing)[open] > .method-table-scroll{
  opacity:1!important;
  transform:none!important;
}

.kalk-methodology .method-table-wrap table.ter-table{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(7,12,48,.2);
}

.kalk-methodology .method-table-wrap table.ter-table th{
  background:rgba(246,197,18,.075);
}

.kalk-methodology .method-table-wrap table.ter-table tbody tr{
  transition:background-color .22s ease;
}

.kalk-methodology .method-table-wrap table.ter-table tbody tr:hover{
  background:rgba(43,214,150,.075);
}

@keyframes calculatorAccordionTap{
  0%{opacity:0;}
  34%{opacity:1;}
  100%{opacity:0;}
}

@media(max-width:560px){
  .kalk-methodology .method-table-wrap{border-radius:17px;margin-bottom:12px;}
  .kalk-methodology .method-table-wrap::before{inset-block:10px;}
  .kalk-methodology .method-table-wrap summary{
    min-height:66px;
    gap:11px;
    padding:15px 62px 15px 18px;
    font-size:12.75px;
    line-height:1.42;
  }
  .kalk-methodology .method-table-wrap summary::before{
    flex-basis:8px;
    width:8px;
    height:8px;
  }
  .kalk-methodology .method-table-wrap summary::after{
    right:14px;
    width:34px;
    height:34px;
  }
  .kalk-methodology .method-table-scroll{
    margin:0 14px 16px;
    padding-top:13px;
  }
}

@media(prefers-reduced-motion:reduce){
  .kalk-methodology .method-table-wrap,
  .kalk-methodology .method-table-wrap::before,
  .kalk-methodology .method-table-wrap::after,
  .kalk-methodology .method-table-wrap summary,
  .kalk-methodology .method-table-wrap summary::before,
  .kalk-methodology .method-table-wrap summary::after,
  .kalk-methodology .method-table-wrap table.ter-table tbody tr{
    animation:none!important;
    transition:none!important;
  }
}
