/* DigitalPal — responsive refinements (1920 → 320) */
@media (min-width:1600px){.container{max-width:1320px}.section{padding:104px 0}}
@media (max-width:1399.98px){.dp-hero{padding:96px 0 56px}}
@media (max-width:1199.98px){.section{padding:76px 0}.floating-card{font-size:.76rem}.page-hero h1,.dp-hero .hero-copy h1{font-size:48px}}
@media (max-width:991.98px){
  .dp-navbar .navbar-collapse{background:#07131b;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);margin-top:.8rem;padding:1rem;box-shadow:none}
  .dp-navbar .nav-link{min-height:44px;color:#fff;padding:.8rem .85rem!important}
  .dp-hero{min-height:440px;padding:100px 0 44px;text-align:center;background-position:center center}
  .hero-shell{grid-template-columns:1fr;justify-content:center}
  .hero-copy{max-width:720px;padding:0}
  .hero-panel{max-width:540px;margin:0 auto}
  .hero-copy h1{font-size:58px}
  .hero-copy h1,.hero-copy p,.hero-actions,.hero-meta{margin-left:auto;margin-right:auto}
  .hero-copy p{max-width:560px}
  .hero-actions{justify-content:center}
  .hero-meta{justify-content:center}
  .hero-card-top,.hero-card-bottom{display:none}
  .floating-card{display:none}
  .hero-banner-wrap{margin-bottom:1rem}
  .page-hero{padding:96px 0 40px;text-align:center}
  .section{padding:64px 0}
}
@media (max-width:767.98px){
  body{font-size:15px}
  .section{padding:54px 0}
  .page-hero h1,.dp-hero .hero-copy h1{font-size:36px}
  .page-hero .lead-dp,.dp-hero .hero-copy p{font-size:1rem}
  .dp-card,.price-card,.step,.testi-card{padding:1.35rem}
  .dp-toast-wrap{left:14px;right:14px;top:76px}
  .dp-toast{min-width:0;width:100%}
  .dp-content{padding:1.1rem 1rem 2.4rem}
  .dp-table-wrap{min-width:0;max-width:100%}
  .dp-table{min-width:0;max-width:100%}
  .hero-actions{gap:.85rem}
  .dp-logo .brand-logo{width:clamp(52px, 16vw, 72px)}
  .hero-badge{letter-spacing:.08em;font-size:.7rem}
  .hero-copy h1{font-size:58px}
}
@media (max-width:575.98px){
  h1{font-size:2.35rem}
  .hero-actions{display:flex;flex-direction:column;align-items:stretch}
  .hero-actions .btn{width:100%}
  .btn-inline-auto,.filter-btn,.btn-icon-auto{width:auto}
  .stat-value{font-size:1.7rem}
  .dp-logo{font-size:.95rem}
  .dp-logo .brand-logo{width:clamp(50px, 20vw, 68px)}
  .hero-copy h1{font-size:58px}
  .hero-meta li{flex:1 1 110px;min-width:0}
}
@media (max-width:420px){
  .dp-hero{min-height:400px;padding-top:84px}
  .eyebrow{letter-spacing:.08em;font-size:.7rem}
  .section{padding:48px 0}
  .hero-banner-wrap{padding:0}
}
@media (max-width:359.98px){.dp-logo .brand-logo{width:52px}.dp-mock-body{padding:.8rem}.btn{padding:.72rem 1rem}}

/* Shared data-table behavior for static and dynamically rendered tables. */
.table-responsive-system{width:100%;max-width:100%;min-width:0;table-layout:auto;box-sizing:border-box}
.table-responsive-system th,.table-responsive-system td{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;word-break:normal;vertical-align:top}
.table-responsive-system img{width:auto;max-width:100%;height:auto;object-fit:cover}
.table-responsive-system input,.table-responsive-system select,.table-responsive-system textarea{width:100%;min-width:0;max-width:100%}
.table-responsive-system-wrap{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.table-responsive-system-wrap[data-table-complexity="complex"]{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.table-responsive-system .badge-dp,.table-responsive-system .badge{max-width:100%;white-space:normal;overflow-wrap:anywhere}
@media (min-width:768px) and (max-width:1199.98px){
  .table-responsive-system th,.table-responsive-system td{padding:.68rem .65rem;font-size:.88rem}
}
@media (max-width:767.98px){
  .table-responsive-system-wrap[data-responsive-mode="stacked"]{height:auto!important;max-height:none;overflow:visible!important;isolation:auto}
  .table-responsive-system[data-responsive-mode="adaptive"]{width:100%;min-width:0;table-layout:fixed}
  .table-responsive-system[data-responsive-mode="adaptive"] th,.table-responsive-system[data-responsive-mode="adaptive"] td{padding:.52rem .38rem;font-size:.78rem;overflow-wrap:anywhere}
  .table-responsive-system[data-responsive-mode="stacked"]{display:block;width:100%;min-width:0;max-width:100%;border-collapse:separate;border-spacing:0;background:transparent}
  .table-responsive-system[data-responsive-mode="stacked"] thead,.table-responsive-system[data-responsive-mode="stacked"] thead tr{position:absolute;display:block;width:1px;height:1px;max-width:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:normal;border:0}
  .table-responsive-system[data-responsive-mode="stacked"] thead th{position:absolute;display:block;inset:0 auto auto 0;width:1px;min-width:0;height:1px;max-width:1px;padding:0;border:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:normal}
  .table-responsive-system[data-responsive-mode="stacked"] tbody,.table-responsive-system[data-responsive-mode="stacked"] tfoot{display:block;width:100%;min-width:0}
  .table-responsive-system[data-responsive-mode="stacked"] tbody tr,.table-responsive-system[data-responsive-mode="stacked"] tfoot tr{display:block;width:100%;min-width:0;margin:0 0 .8rem;padding:.45rem .8rem;border:1px solid var(--border);border-radius:8px;background:var(--surface);box-shadow:var(--shadow-sm)}
  .table-responsive-system[data-responsive-mode="stacked"] td,.table-responsive-system[data-responsive-mode="stacked"] tfoot td{display:grid;grid-template-columns:minmax(6rem,32%) minmax(0,1fr);gap:.4rem .75rem;width:100%;max-width:100%;padding:.6rem .1rem;border:0;border-bottom:1px solid var(--border);font-size:.87rem;line-height:1.45;text-align:left;overflow-wrap:anywhere}
  .table-responsive-system[data-responsive-mode="stacked"] td:last-child{border-bottom:0}
  .table-responsive-system[data-responsive-mode="stacked"] td::before{content:attr(data-label);color:var(--muted);font-size:.76rem;font-weight:700;line-height:1.45;overflow-wrap:anywhere}
  .table-responsive-system[data-responsive-mode="stacked"] td[colspan]{display:block}
  .table-responsive-system[data-responsive-mode="stacked"] td[colspan]::before{content:none}
  .dp-order-table.table-responsive-system[data-responsive-mode="stacked"] td{white-space:normal!important;overflow-wrap:anywhere;word-break:normal}
  .table-responsive-system[data-responsive-mode="stacked"] td[data-label="Aksi"]>.d-flex,.table-responsive-system[data-responsive-mode="stacked"] td[data-label="Actions"]>.d-flex{justify-content:flex-start;flex-wrap:wrap}
  .table-responsive-system[data-responsive-mode="stacked"] td .btn{min-height:40px;max-width:100%;white-space:normal}
  .table-responsive-system[data-responsive-mode="stacked"] .badge-dp,.table-responsive-system[data-responsive-mode="stacked"] .badge{display:inline-flex;justify-self:start;white-space:normal;line-height:1.3}
  .table-responsive-system[data-responsive-mode="stacked"] tr:hover{background:transparent}
  .table-responsive-system[data-responsive-mode="stacked"] .dp-order-table{width:100%!important;min-width:0!important;max-width:100%!important;table-layout:auto!important}
  .table-responsive-system[data-responsive-mode="stacked"] .dp-order-table th,.table-responsive-system[data-responsive-mode="stacked"] .dp-order-table td,.dp-order-table.table-responsive-system[data-responsive-mode="stacked"] th,.dp-order-table.table-responsive-system[data-responsive-mode="stacked"] td{position:static!important;inset:auto!important;width:auto!important;min-width:0!important;max-width:100%!important;box-shadow:none!important}
  .table-responsive-system-wrap[data-responsive-mode="stacked"] .dp-order-table-wrap{height:auto!important;max-height:none;overflow:visible!important;border-radius:0}
  .dp-content .pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:.2rem;max-width:100%}
  .dp-content .page-link{min-width:40px;text-align:center}
  .dp-content .dp-table-wrap+.d-flex,.dp-content .table-responsive-system-wrap+.d-flex{flex-wrap:wrap;gap:.65rem;max-width:100%}
  .dp-content .dp-table-wrap+.d-flex>*,.dp-content .table-responsive-system-wrap+.d-flex>*{max-width:100%}
}
@media (prefers-reduced-motion:reduce){.table-responsive-system-wrap{scroll-behavior:auto}}

@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-old(dp-site-navbar),::view-transition-old(dp-site-footer){display:none}
::view-transition-new(root),::view-transition-new(dp-site-navbar),::view-transition-new(dp-site-footer){animation:none}
nav.dp-navbar{view-transition-name:dp-site-navbar;position:relative;z-index:20}
main#main{view-transition-name:dp-page-content;position:relative;overflow-x:clip;isolation:isolate}
footer.dp-footer{view-transition-name:dp-site-footer}
::view-transition-group(dp-page-content){animation:none}
::view-transition-old(dp-page-content){animation:dp-page-fade-out 180ms cubic-bezier(.4,0,.2,1) both}
::view-transition-new(dp-page-content){animation:dp-page-fade-in 250ms cubic-bezier(.4,0,.2,1) 100ms both}
::view-transition-group(dp-site-navbar),::view-transition-group(dp-site-footer){animation:none}
@keyframes dp-page-fade-out{from{opacity:1}to{opacity:0}}
@keyframes dp-page-fade-in{from{opacity:0}to{opacity:1}}
@media (min-width:768px) and (max-width:1199.98px){::view-transition-old(dp-page-content){animation-duration:165ms}::view-transition-new(dp-page-content){animation-duration:235ms;animation-delay:90ms}}
@media (max-width:767.98px){::view-transition-old(dp-page-content){animation-duration:150ms}::view-transition-new(dp-page-content){animation-duration:220ms;animation-delay:80ms}}
@media (prefers-reduced-motion:reduce){::view-transition-old(dp-page-content){animation-duration:60ms!important}::view-transition-new(dp-page-content){animation-duration:100ms!important;animation-delay:0ms!important}}