:root {
  --td-primary: #006bff;
  --td-primary-2: #004ee6;
  --td-accent: #00a7ff;
  --td-cyan: #2ed7ff;
  --td-navy: #071b3d;
  --td-ink: #08233f;
  --td-text: #173653;
  --td-muted: #5f748a;
  --td-soft: #f0f8ff;
  --td-soft-2: #e7f3ff;
  --td-card: rgba(255, 255, 255, 0.86);
  --td-line: rgba(0, 107, 255, 0.13);
  --td-shadow: 0 24px 70px rgba(4, 42, 91, 0.11);
  --td-radius: 28px;
  --tp-ff-inter: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}* { box-sizing: border-box; }html { scroll-behavior: smooth; }html.tokodev-menu-open,
body.tokodev-menu-open { overflow: hidden; }body {
  margin: 0;
  background: #ffffff;
  color: var(--td-text);
  font-family: var(--tp-ff-inter);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}img, svg { max-width: 100%; display: block; }a { text-decoration: none !important; }button, input, textarea, select { font: inherit; }button { cursor: pointer; }body :where(h1,h2,h3,h4,h5,h6,p,a,span,button,input,textarea,summary,label,strong,small,li,div) {
  font-family: var(--tp-ff-inter) !important;
}.container {
  width: min(100% - 40px, 1160px);
  margin-inline: auto;
}.row { display: flex; flex-wrap: wrap; margin-inline: -15px; }.row > * { padding-inline: 15px; width: 100%; }.g-5 { row-gap: 48px; }.align-items-center { align-items: center; }@media (min-width: 992px) { .col-lg-6 { width: 50%; } }.tokodev-header-wrap {
  position: fixed !important;
  top: 20px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  pointer-events: none !important;
}.tokodev-header, #header-sticky {
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}.tokodev-header-inner {
  pointer-events: auto !important;
  width: min(100% - 40px, 1040px) !important;
  min-height: 64px !important;
  margin: 0 auto !important;
  padding: 0 22px 0 26px !important;
  display: grid !important;
  grid-template-columns: 180px minmax(0, 1fr) 180px !important;
  align-items: center !important;
  gap: 20px !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transition: width .28s ease, background-color .28s ease, border-color .28s ease, box-shadow .28s ease, backdrop-filter .28s ease;
}.tokodev-header-wrap.tokodev-header-scrolled .tokodev-header-inner,
#header-sticky.header-sticky .tokodev-header-inner {
  width: min(100% - 40px, 980px) !important;
  background: rgba(255,255,255,.9) !important;
  border-color: rgba(0,107,255,.10) !important;
  box-shadow: 0 16px 46px rgba(4,42,91,.10), inset 0 1px 0 rgba(255,255,255,.86) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
}.tokodev-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--td-ink) !important;
  white-space: nowrap !important;
}.tokodev-brand img { width: 32px !important; height: 32px !important; object-fit: contain !important; }.tokodev-brand span {
  color: var(--td-ink) !important;
  font-size: 19px !important;
  line-height: 1 !important;
  letter-spacing: -.03em !important;
  font-weight: 500 !important;
}.tokodev-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 32px !important;
  white-space: nowrap !important;
}.tokodev-nav a {
  position: relative !important;
  padding: 24px 0 21px !important;
  color: var(--td-ink) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: .055em !important;
  text-transform: uppercase !important;
  font-weight: 650 !important;
}.tokodev-nav a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 14px;
  width: 0;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--td-primary), var(--td-accent));
  transform: translateX(-50%);
  transition: width .24s ease;
}.tokodev-nav a:hover,
.tokodev-nav a.tokodev-active-nav,
.tokodev-nav a.is-active { color: var(--td-primary) !important; }.tokodev-nav a:hover::after,
.tokodev-nav a.tokodev-active-nav::after,
.tokodev-nav a.is-active::after { width: 100%; }.tokodev-header-actions {
  visibility: hidden !important;
  pointer-events: none !important;
  display: flex !important;
  justify-content: flex-end !important;
}.tokodev-menu-trigger {
  display: none !important;
  position: relative !important;
  width: 46px !important;
  height: 44px !important;
  min-width: 46px !important;
  padding: 0 !important;
  border-radius: 17px !important;
  border: 1px solid rgba(0,107,255,.14) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(238,248,255,.82)) !important;
  color: var(--td-primary) !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  box-shadow: 0 10px 24px rgba(4,42,91,.08) !important;
}.tokodev-menu-trigger span { display: none !important; }.tokodev-menu-icon { width: 27px !important; height: 27px !important; color: inherit; transition: transform .35s ease; }.tokodev-menu-trigger:hover { color: #fff !important; background: linear-gradient(135deg, var(--td-primary), var(--td-accent)) !important; transform: translateY(-1px); }.tokodev-menu-trigger:hover .tokodev-menu-icon { transform: rotate(-5deg) scale(1.04); }.tokodev-menu-link,.tokodev-menu-dot { transform-origin: center; transition: transform .35s ease, opacity .25s ease; }.tokodev-menu-trigger:hover .dot-1,.tokodev-menu-trigger:hover .dot-3 { transform: translateX(-2px); }.tokodev-menu-trigger:hover .dot-2,.tokodev-menu-trigger:hover .dot-4 { transform: translateX(2px); }.body-overlay {
  position: fixed;
  inset: 0;
  z-index: 1990;
  background: rgba(3,20,38,.48);
  opacity: 0;
  visibility: hidden;
  backdrop-filter: blur(4px);
  transition: opacity .32s ease, visibility .32s ease;
}.body-overlay.apply { opacity: 1; visibility: visible; }.tp-offcanvas.tokodev-offcanvas {
  position: fixed;
  top: 12px;
  right: 12px;
  bottom: 12px;
  width: min(390px, calc(100vw - 24px));
  height: auto;
  z-index: 2000;
  padding: 18px;
  border-radius: 28px;
  background: radial-gradient(circle at 100% 0%, rgba(0,167,255,.14), transparent 34%), radial-gradient(circle at 0% 100%, rgba(0,107,255,.12), transparent 30%), rgba(255,255,255,.97);
  border: 1px solid rgba(0,107,255,.12);
  box-shadow: -22px 24px 80px rgba(4,42,91,.22), inset 0 1px 0 rgba(255,255,255,.9);
  transform: translateX(calc(100% + 24px));
  transition: transform .38s cubic-bezier(.22,.61,.36,1);
  overflow-y: auto;
}.tp-offcanvas.tokodev-offcanvas.opened { transform: translateX(0); }.tokodev-drawer-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }.tokodev-offcanvas .tokodev-brand img { width: 30px !important; height: 30px !important; }.tokodev-offcanvas .tokodev-brand span { font-size: 18px !important; font-weight: 500 !important; }.tokodev-drawer-close,
.tp-offcanvas .close-btn {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: var(--td-ink) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  box-shadow: 0 10px 24px rgba(4,42,91,.08);
}.tokodev-drawer-close:hover { background: var(--td-primary) !important; color: #fff !important; transform: rotate(90deg); }.tokodev-drawer-hero {
  position: relative;
  padding: 20px;
  margin-bottom: 16px;
  border-radius: 24px;
  overflow: hidden;
  background: radial-gradient(circle at 90% 10%, rgba(46,215,255,.24), transparent 32%), linear-gradient(135deg, var(--td-navy), var(--td-primary-2));
  border: 1px solid rgba(255,255,255,.10);
}.tokodev-drawer-hero::after { content: ""; position: absolute; right: -34px; bottom: -38px; width: 126px; height: 126px; border-radius: 999px; background: rgba(0,167,255,.22); }.tokodev-drawer-hero span {
  position: relative; z-index: 2; display: inline-flex; margin-bottom: 12px; color: var(--td-cyan) !important; font-size: 11px !important; line-height: 1 !important; letter-spacing: .12em !important; text-transform: uppercase; font-weight: 700 !important;
}.tokodev-drawer-hero h3 {
  position: relative; z-index: 2; max-width: 285px; margin: 0 0 10px !important; color: #fff !important; font-size: 24px !important; line-height: 1.14 !important; letter-spacing: -.045em !important; font-weight: 650 !important;
}.tokodev-drawer-hero p { position: relative; z-index: 2; max-width: 292px; margin: 0 !important; color: rgba(255,255,255,.74) !important; font-size: 13.5px !important; line-height: 1.65 !important; }.tokodev-offcanvas-menu { display: grid; gap: 10px; margin: 0 0 16px; }.tokodev-offcanvas-menu a {
  position: relative;
  min-height: 56px;
  display: flex !important;
  align-items: center;
  padding: 0 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(0,107,255,.10);
  color: var(--td-ink) !important;
  box-shadow: 0 10px 24px rgba(4,42,91,.035);
  overflow: hidden;
  isolation: isolate;
  transition: transform .28s ease, border-color .28s ease, background-color .28s ease, box-shadow .28s ease;
}.tokodev-offcanvas-menu a::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,107,255,.12), rgba(0,167,255,.12), transparent); transform: translateX(-105%); transition: transform .34s ease; z-index: -1; }.tokodev-offcanvas-menu a::after { content: ""; position: absolute; left: 0; top: 13px; bottom: 13px; width: 4px; border-radius: 999px; background: var(--td-primary); transform: scaleY(0); transition: transform .28s ease; }.tokodev-offcanvas-menu a strong { color: var(--td-ink) !important; font-size: 15px !important; line-height: 1 !important; font-weight: 650 !important; letter-spacing: -.01em !important; transition: color .25s ease, transform .25s ease; }.tokodev-offcanvas-menu a:hover { background: #fff; border-color: rgba(0,107,255,.22); transform: translateX(6px); box-shadow: 0 16px 36px rgba(4,42,91,.075); }.tokodev-offcanvas-menu a:hover::before { transform: translateX(0); }.tokodev-offcanvas-menu a:hover::after { transform: scaleY(1); }.tokodev-offcanvas-menu a:hover strong { color: var(--td-primary) !important; transform: translateX(6px); }.tokodev-offcanvas-menu a span,.tokodev-offcanvas-menu a svg { display: none !important; }.tokodev-drawer-contact { display: grid; gap: 9px; }.tokodev-drawer-contact a,.tokodev-drawer-contact div {
  min-height: 62px; display: flex; flex-direction: column; justify-content: center; padding: 13px 15px; border-radius: 18px; background: rgba(255,255,255,.82); border: 1px solid rgba(0,107,255,.10);
}.tokodev-drawer-contact a:hover { background: #fff; border-color: rgba(0,107,255,.22); transform: translateX(4px); }.tokodev-drawer-contact span { margin-bottom: 5px; color: #73879a !important; font-size: 12px !important; line-height: 1 !important; }.tokodev-drawer-contact strong { color: var(--td-ink) !important; font-size: 14px !important; line-height: 1.35 !important; font-weight: 650 !important; }.tokodev-hero {
  padding: 168px 0 62px;
  overflow: hidden;
  background: radial-gradient(circle at 10% 84%, rgba(219,239,255,.95), transparent 32%), radial-gradient(circle at 86% 28%, rgba(184,229,255,.95), transparent 42%), linear-gradient(180deg, #edf7ff 0%, #f8fcff 66%, #fff 100%);
}.tokodev-hero-content { max-width: 1000px; margin: 0 auto 42px; text-align: center; }.tokodev-kicker {
  display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 14px; border-radius: 999px; background: rgba(0,107,255,.10); color: var(--td-primary) !important; font-size: 12px; line-height: 1; letter-spacing: .08em; text-transform: uppercase; font-weight: 650 !important;
}.tokodev-hero-title {
  max-width: 1000px; margin: 0 auto 18px !important; color: var(--td-ink) !important; font-size: clamp(54px, 5.55vw, 72px) !important; line-height: 1.14 !important; letter-spacing: -.048em !important; font-weight: 560 !important;
}.tokodev-word-wrap { display: inline-flex !important; align-items: baseline !important; justify-content: center !important; position: relative !important; width: max-content !important; white-space: nowrap !important; line-height: 1 !important; vertical-align: baseline !important; }.tokodev-word { display: inline-block !important; position: relative !important; color: var(--td-primary) !important; line-height: 1 !important; font-weight: 560 !important; }.tokodev-word-line { position: absolute !important; left: 50% !important; bottom: -13px !important; width: 205px !important; color: var(--td-primary) !important; transform: translateX(-50%) !important; pointer-events: none !important; }.tokodev-word-line path { stroke: currentColor !important; }.tokodev-hero-subtitle { max-width: 780px !important; margin: 0 auto 34px !important; color: #506982 !important; font-size: 20px !important; line-height: 1.58 !important; letter-spacing: -.01em !important; }.tokodev-dashboard { max-width: 920px; margin: 0 auto; border-radius: 30px 30px 0 0; background: #061a35; padding: 14px 14px 0; box-shadow: 0 38px 80px rgba(4,42,91,.18); overflow: hidden; animation: tokodev-float 6s ease-in-out infinite; }.tokodev-browser-bar { height: 50px; display: flex; align-items: center; gap: 9px; padding: 0 18px; border-radius: 20px 20px 0 0; background: #f7fbff; }.tokodev-browser-bar span { width: 11px; height: 11px; border-radius: 50%; background: #cfd7d2; flex: 0 0 auto; }.tokodev-browser-bar span:nth-child(1) { background: #ff706c; }.tokodev-browser-bar span:nth-child(2) { background: #ffd166; }.tokodev-browser-bar span:nth-child(3) { background: #48cf6a; }.tokodev-browser-bar p { min-width: 260px; margin: 0 0 0 10px !important; height: 30px; padding: 0 16px; border-radius: 999px; display: flex; align-items: center; background: #fff; color: #697b8e !important; font-size: 12px; }.tokodev-dashboard-grid { min-height: 300px; display: grid; grid-template-columns: 215px 1fr; background: #fff; }.tokodev-dashboard-grid aside { padding: 30px 24px; background: #f1f7ff; }.tokodev-dashboard-grid aside h3,.tokodev-dashboard-head h3 { color: var(--td-ink) !important; margin: 0 0 8px !important; font-weight: 560 !important; }.tokodev-dashboard-grid aside h3 { font-size: 24px; }.tokodev-dashboard-grid aside p,.tokodev-dashboard-head p { margin: 0 !important; color: var(--td-muted) !important; font-size: 13px; }.tokodev-dashboard-grid aside i,.tokodev-mini-list i { display: block; height: 15px; border-radius: 999px; background: #dbeaf8; margin-bottom: 12px; }.tokodev-dashboard-grid aside i:nth-of-type(1) { width: 86%; background: #cae0f5; margin-top: 34px; }.tokodev-dashboard-grid aside i:nth-of-type(2) { width: 64%; }.tokodev-dashboard-grid aside i:nth-of-type(3) { width: 72%; }.tokodev-dashboard-grid aside i:nth-of-type(4) { width: 48%; }.tokodev-dashboard-grid main { padding: 30px; }.tokodev-dashboard-head { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 22px; }.tokodev-dashboard-head h3 { font-size: 26px; }.tokodev-dashboard-head > span { display: inline-flex; align-items: center; justify-content: center; height: 38px; padding: 0 18px; border-radius: 999px; background: #dff6ff; color: var(--td-primary) !important; font-size: 13px; font-weight: 650 !important; }.tokodev-dashboard-stat { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-bottom: 18px; }.tokodev-dashboard-stat div { height: 82px; border-radius: 20px; background: linear-gradient(135deg, #edf5ff, #d7eaff); }.tokodev-dashboard-stat div:nth-child(2) { background: linear-gradient(135deg, #e6f8ff, #99dcff); }.tokodev-dashboard-stat div:nth-child(3) { background: linear-gradient(135deg, #edf1ff, #c4d0ff); }.tokodev-dashboard-panel { display: grid; grid-template-columns: 1.25fr .75fr; gap: 16px; }.tokodev-bars { height: 100px; border-radius: 18px; background: #f5f9ff; padding: 18px; display: flex; gap: 12px; align-items: end; }.tokodev-bars span { flex: 1; border-radius: 10px 10px 0 0; background: var(--td-primary); }.tokodev-bars span:nth-child(1){height:38%;}.tokodev-bars span:nth-child(2){height:80%;background:var(--td-navy);}.tokodev-bars span:nth-child(3){height:55%;}.tokodev-bars span:nth-child(4){height:90%;background:var(--td-accent);}.tokodev-bars span:nth-child(5){height:64%;background:#8bb8d8;}.tokodev-mini-list { height: 100px; border-radius: 18px; background: #f5f9ff; padding: 18px; display: grid; align-content: center; gap: 12px; }.tokodev-mini-list i { margin: 0; height: 12px; }.tokodev-mini-list i:nth-child(1){width:88%;}.tokodev-mini-list i:nth-child(2){width:62%;}.tokodev-mini-list i:nth-child(3){width:74%;}.tokodev-section { padding: 96px 0; }.tokodev-section h2 { color: var(--td-ink) !important; font-size: clamp(36px, 4.6vw, 56px); line-height: 1.08; letter-spacing: -.048em; }.tokodev-lead { font-size: 17px; line-height: 1.75; margin-top: 20px; color: var(--td-muted) !important; }.tokodev-services-template { padding-top: 118px !important; padding-bottom: 110px !important; background: #fff !important; overflow: hidden; }.tokodev-services-template-head { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 48px; align-items: center; margin-bottom: 82px; }.tokodev-services-template-head h2 { max-width: 830px; margin: 22px 0 0 !important; font-size: clamp(44px, 4.55vw, 66px) !important; line-height: 1.07 !important; letter-spacing: -.055em !important; font-weight: 650 !important; }.tokodev-services-template .tokodev-kicker,.tokodev-faq-section-head .tokodev-kicker { min-height: 38px; padding: 0 20px; letter-spacing: .14em !important; }.tokodev-service-feature-grid { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; column-gap:72px !important; row-gap:78px !important; }.tokodev-feature-service { position:relative; min-height:230px; padding-bottom:34px; }.tokodev-feature-service::after { content:""; position:absolute; left:0; bottom:0; width:82%; height:1px; background:rgba(0,107,255,.12); }.tokodev-feature-service::before { content:""; position:absolute; left:0; bottom:0; width:0; height:2px; border-radius:999px; background:linear-gradient(90deg,var(--td-primary),var(--td-accent)); transition:width .35s ease; z-index:2; }.tokodev-feature-service:hover::before { width:82%; }.tokodev-feature-icon { width:54px !important; height:54px !important; min-width:54px !important; margin-bottom:28px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; border-radius:999px !important; color:var(--td-primary) !important; background:#eef7ff !important; transition:transform .35s ease, box-shadow .35s ease; }.tokodev-feature-icon svg { width:23px !important; height:23px !important; }.tokodev-feature-icon.icon-1{background:#dff3ff!important}.tokodev-feature-icon.icon-2{background:#dbeaff!important}.tokodev-feature-icon.icon-3{background:#e8f7ff!important}.tokodev-feature-icon.icon-4{background:#e4edff!important}.tokodev-feature-icon.icon-5{background:#dcf6ff!important}.tokodev-feature-icon.icon-6{background:#e8f0ff!important}.tokodev-feature-service:hover .tokodev-feature-icon { transform:translateY(-8px) rotate(-5deg); box-shadow:0 18px 34px rgba(4,42,91,.12); }.tokodev-feature-service h3 { max-width:320px!important; margin:0 0 14px!important; color:var(--td-ink)!important; font-size:25px!important; line-height:1.13!important; letter-spacing:-.04em!important; font-weight:650!important; }.tokodev-feature-service p { max-width:330px!important; margin:0!important; color:#607487!important; font-size:16.5px!important; line-height:1.65!important; }.tokodev-feature-service:hover h3 { color:var(--td-primary)!important; }.tokodev-why { padding-top:118px!important; padding-bottom:118px!important; background:radial-gradient(circle at 12% 18%, rgba(0,107,255,.06), transparent 30%), radial-gradient(circle at 86% 72%, rgba(0,167,255,.10), transparent 28%), linear-gradient(180deg,#eef7ff 0%,#f8fcff 100%)!important; overflow:hidden; }.tokodev-why h2 { max-width:620px; margin:0 0 28px!important; font-size:clamp(42px,4.45vw,64px)!important; line-height:1.06!important; letter-spacing:-.055em!important; font-weight:650!important; }.tokodev-why .tokodev-lead { max-width:610px; margin:0!important; font-size:17.5px!important; line-height:1.78!important; }.tokodev-why-list { display:grid; gap:14px; padding:18px; border-radius:32px; background:rgba(255,255,255,.74)!important; border:1px solid rgba(0,107,255,.10); box-shadow:var(--td-shadow); backdrop-filter:blur(14px); }.tokodev-why-list div { position:relative; min-height:76px; display:grid; grid-template-columns:52px minmax(0,1fr); align-items:center; gap:18px; padding:16px 22px 16px 16px; border-radius:22px; background:#fff!important; border:1px solid rgba(0,107,255,.10); overflow:hidden; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; }.tokodev-why-list div::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,167,255,.12),transparent 55%); opacity:0; transition:opacity .3s ease; }.tokodev-why-list div:hover { transform:translateX(8px); border-color:rgba(0,107,255,.22); box-shadow:0 16px 34px rgba(4,42,91,.07); }.tokodev-why-list div:hover::before { opacity:1; }.tokodev-why-list span { position:relative; z-index:2; width:46px; height:46px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:linear-gradient(135deg,var(--td-primary),var(--td-accent))!important; color:#fff!important; font-size:15px!important; font-weight:650!important; box-shadow:0 12px 24px rgba(0,107,255,.20); transition:transform .3s ease; }.tokodev-why-list div:hover span { transform:scale(1.06) rotate(-4deg); }.tokodev-why-list p { position:relative; z-index:2; margin:0!important; color:var(--td-ink)!important; font-size:16px!important; line-height:1.45!important; font-weight:560!important; }.tokodev-process-section { padding-top:118px!important; padding-bottom:110px!important; background:#fff!important; overflow:hidden; }.tokodev-process-head { max-width:860px; margin:0 auto 74px; text-align:center; }.tokodev-process-head h2 { max-width:760px; margin:20px auto 0!important; font-size:clamp(42px,4.5vw,64px)!important; line-height:1.08!important; letter-spacing:-.055em!important; font-weight:560!important; }.tokodev-process-subtitle { max-width:720px; margin:22px auto 0!important; color:#61758b!important; font-size:18px!important; line-height:1.7!important; }.tokodev-process-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:26px; align-items:start; }.tokodev-process-item-wrap { position:relative; }.tokodev-process-item { text-align:center; }.tokodev-process-visual { position:relative; width:132px; height:132px; margin:0 auto 28px; }.tokodev-process-circle { position:relative; width:100px; height:100px; margin:16px auto 0; display:flex; align-items:center; justify-content:center; border-radius:999px; border:2px solid var(--td-primary); background:#fff; transition:background-color .32s ease, transform .32s ease, box-shadow .32s ease; z-index:2; }.tokodev-process-circle::before { content:""; position:absolute; inset:-8px; border-radius:999px; border:1.5px dashed rgba(0,107,255,.48); opacity:0; transform:scale(.94); transition:opacity .3s ease, transform .3s ease; }.tokodev-process-circle i { width:22px; height:12px; border-left:2.5px solid var(--td-primary); border-bottom:2.5px solid var(--td-primary); transform:rotate(-45deg) translateY(-1px); transition:border-color .32s ease; }.tokodev-process-number { position:absolute; top:2px; right:13px; width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:var(--td-primary); color:#fff!important; border:5px solid #fff; font-size:13px!important; font-weight:650!important; z-index:5; box-shadow:0 10px 22px rgba(0,107,255,.22); }.tokodev-process-item:hover .tokodev-process-circle { background:linear-gradient(135deg,var(--td-primary),var(--td-accent)); box-shadow:0 18px 42px rgba(0,107,255,.22); transform:translateY(-2px); }.tokodev-process-item:hover .tokodev-process-circle::before { opacity:1; transform:scale(1); }.tokodev-process-item:hover .tokodev-process-circle i { border-color:#fff; }.tokodev-process-item h3 { margin:0 0 14px!important; color:var(--td-ink)!important; font-size:24px!important; line-height:1.18!important; letter-spacing:-.03em!important; font-weight:560!important; }.tokodev-process-item p { max-width:260px; margin:0 auto!important; color:#61758b!important; font-size:15.5px!important; line-height:1.7!important; }.tokodev-process-arrow { position:absolute; top:42px; right:-58px; width:74px; height:30px; color:#0d3862; opacity:.82; transition:transform .28s ease,color .28s ease; }.tokodev-process-item-wrap:hover .tokodev-process-arrow { color:var(--td-primary); transform:translateX(4px); }.tokodev-portfolio-v3 { padding-top:118px!important; padding-bottom:120px!important; background:radial-gradient(circle at 12% 6%, rgba(0,167,255,.16), transparent 28%), radial-gradient(circle at 88% 20%, rgba(0,107,255,.13), transparent 26%), linear-gradient(180deg,#071b3d 0%,#06152f 100%)!important; overflow:hidden; }.tokodev-portfolio-v3 .container { max-width:1180px; }.tokodev-portfolio-v3-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,.48fr); gap:48px; align-items:end; margin-bottom:64px; }.tokodev-portfolio-v3-head .tokodev-kicker { background:rgba(255,255,255,.10); color:#8edcff!important; }.tokodev-portfolio-v3-head h2 { max-width:820px; margin:22px 0 0!important; color:#fff!important; font-size:clamp(42px,4.55vw,66px)!important; line-height:1.06!important; letter-spacing:-.055em!important; font-weight:650!important; }.tokodev-portfolio-v3-head p { margin:0!important; color:rgba(255,255,255,.68)!important; font-size:17px!important; line-height:1.75!important; }.tokodev-project-showcase { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }.tokodev-project-card-v3 { position:relative; display:flex; flex-direction:column; overflow:hidden; border-radius:30px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.11); box-shadow:0 24px 70px rgba(0,0,0,.16); transition:transform .35s ease,border-color .35s ease,background-color .35s ease,box-shadow .35s ease; }.tokodev-project-card-v3::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 84% 8%, rgba(0,167,255,.13), transparent 28%), radial-gradient(circle at 12% 86%, rgba(0,107,255,.17), transparent 28%); opacity:0; transition:opacity .35s ease; pointer-events:none; }.tokodev-project-card-v3:hover { transform:translateY(-8px); border-color:rgba(0,167,255,.34); background:rgba(255,255,255,.105); box-shadow:0 34px 84px rgba(0,0,0,.24); }.tokodev-project-card-v3:hover::before { opacity:1; }.tokodev-project-preview { position:relative; z-index:2; display:block; margin:18px 18px 0; overflow:hidden; border-radius:22px; background:#fff; border:1px solid rgba(255,255,255,.16); }.tokodev-project-browser { height:44px; display:flex; align-items:center; gap:8px; padding:0 16px; background:#f6f9ff; border-bottom:1px solid rgba(0,107,255,.08); }.tokodev-project-browser span { width:10px; height:10px; border-radius:999px; }.tokodev-project-browser span:nth-child(1){background:#ff6b5f}.tokodev-project-browser span:nth-child(2){background:#ffd056}.tokodev-project-browser span:nth-child(3){background:#4bd174}.tokodev-project-browser p { width:min(260px,58%); height:24px; margin:0 0 0 10px!important; display:flex; align-items:center; padding:0 14px; border-radius:999px; background:#fff; color:#6b7c8e!important; font-size:12px!important; line-height:1!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.tokodev-project-image-scroll { --portfolio-shot-height:330px; height:var(--portfolio-shot-height); overflow:hidden; background:#eef5ff; position:relative; }.tokodev-project-image-scroll img { width:100%; min-height:100%; height:auto; object-fit:cover; object-position:top center; transform:translateY(0); transition:transform 4.2s ease; will-change:transform; }.tokodev-project-card-v3:hover .tokodev-project-image-scroll img { transform:translateY(calc(-100% + var(--portfolio-shot-height))); }.tokodev-project-placeholder { height:330px; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 20% 18%, rgba(0,107,255,.18), transparent 30%), radial-gradient(circle at 80% 82%, rgba(0,167,255,.20), transparent 30%), linear-gradient(135deg,#f7fbff,#eef6ff); }.tokodev-project-placeholder div { max-width:310px; padding:28px; text-align:center; border-radius:26px; background:rgba(255,255,255,.74); border:1px solid rgba(0,107,255,.10); box-shadow:0 20px 50px rgba(4,42,91,.08); }.tokodev-project-placeholder span { min-height:30px; display:inline-flex; align-items:center; padding:0 12px; margin-bottom:16px; border-radius:999px; background:rgba(0,107,255,.10); color:var(--td-primary)!important; font-size:12px!important; letter-spacing:.08em; text-transform:uppercase; font-weight:650!important; }.tokodev-project-placeholder h4 { margin:0 0 8px!important; color:var(--td-ink)!important; font-size:28px!important; line-height:1.1!important; letter-spacing:-.04em!important; font-weight:650!important; }.tokodev-project-placeholder p { margin:0!important; color:#66788b!important; font-size:15px!important; }.tokodev-project-content { position:relative; z-index:2; padding:28px 30px 32px; display:flex; flex-direction:column; flex:1; }.tokodev-project-meta { width:max-content; max-width:100%; min-height:32px; display:inline-flex; align-items:center; padding:0 13px; margin-bottom:18px; border-radius:999px; background:rgba(0,167,255,.14); color:#9be6ff!important; font-size:12px!important; line-height:1!important; letter-spacing:.04em; font-weight:560!important; }.tokodev-project-content h3 { margin:0 0 14px!important; color:#fff!important; font-size:clamp(27px,2.2vw,34px)!important; line-height:1.12!important; letter-spacing:-.045em!important; font-weight:650!important; }.tokodev-project-content p { margin:0 0 22px!important; color:rgba(255,255,255,.68)!important; font-size:16px!important; line-height:1.7!important; }.tokodev-project-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; margin-bottom:22px; }.tokodev-project-tags span { min-height:30px; display:inline-flex; align-items:center; padding:0 11px; border-radius:999px; background:rgba(255,255,255,.08); color:rgba(255,255,255,.76)!important; font-size:12px!important; line-height:1!important; }.tokodev-project-card-v3:hover .tokodev-project-tags span { background:rgba(0,167,255,.13); color:#9be6ff!important; }.tokodev-project-link { display:inline-flex!important; align-items:center; gap:10px; width:max-content; color:#fff!important; font-size:15px!important; line-height:1!important; font-weight:560!important; }.tokodev-project-link:hover { color:#9be6ff!important; }.tokodev-faq-section { padding-top:118px!important; padding-bottom:88px!important; background:linear-gradient(180deg,#fff 0%,#f7fbff 100%)!important; }.tokodev-faq-section .container,.tokodev-contact-v4 .container { max-width:1180px; }.tokodev-faq-section-head { max-width:860px; margin:0 auto 56px; text-align:center; }.tokodev-faq-section-head h2 { margin:22px 0 18px!important; font-size:clamp(42px,4.4vw,64px)!important; line-height:1.06!important; letter-spacing:-.055em!important; font-weight:650!important; }.tokodev-faq-section-head p { max-width:700px; margin:0 auto!important; color:#61758b!important; font-size:18px!important; line-height:1.75!important; }.tokodev-faq-section-list { max-width:920px; margin:0 auto; display:grid; gap:14px; }.tokodev-faq-item { border-radius:24px; background:#fff; border:1px solid rgba(0,107,255,.10); box-shadow:0 16px 40px rgba(4,42,91,.04); overflow:hidden; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; }.tokodev-faq-item:hover,.tokodev-faq-item[open] { transform:translateY(-3px); border-color:rgba(0,107,255,.22); box-shadow:0 22px 54px rgba(4,42,91,.08); }.tokodev-faq-item summary { min-height:78px; display:grid; grid-template-columns:46px minmax(0,1fr) 42px; align-items:center; gap:16px; padding:18px 20px; cursor:pointer; list-style:none; }.tokodev-faq-item summary::-webkit-details-marker { display:none; }.tokodev-faq-index { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:#eef6ff; color:var(--td-primary)!important; font-size:13px!important; font-weight:650!important; }.tokodev-faq-item[open] .tokodev-faq-index,.tokodev-faq-item:hover .tokodev-faq-index { background:var(--td-primary); color:#fff!important; }.tokodev-faq-title { color:var(--td-ink)!important; font-size:18px!important; line-height:1.35!important; font-weight:650!important; }.tokodev-faq-plus { position:relative; width:42px; height:42px; border-radius:999px; border:1px solid rgba(0,107,255,.12); background:#fff; }.tokodev-faq-plus::before,.tokodev-faq-plus::after { content:""; position:absolute; left:50%; top:50%; width:14px; height:2px; border-radius:999px; background:var(--td-ink); transform:translate(-50%,-50%); transition:opacity .25s ease, background-color .25s ease; }.tokodev-faq-plus::after { transform:translate(-50%,-50%) rotate(90deg); }.tokodev-faq-item[open] .tokodev-faq-plus { background:var(--td-primary); border-color:var(--td-primary); }.tokodev-faq-item[open] .tokodev-faq-plus::before,.tokodev-faq-item[open] .tokodev-faq-plus::after { background:#fff; }.tokodev-faq-item[open] .tokodev-faq-plus::after { opacity:0; }.tokodev-faq-body { padding:0 82px 22px 82px; }.tokodev-faq-body p { margin:0!important; color:#61758b!important; font-size:15.5px!important; line-height:1.75!important; }.tokodev-contact-v4 { padding-top:108px!important; padding-bottom:112px!important; background:radial-gradient(circle at 12% 12%, rgba(0,107,255,.05), transparent 28%), radial-gradient(circle at 88% 78%, rgba(0,167,255,.10), transparent 30%), linear-gradient(180deg,#f7fbff 0%,#eef7ff 100%)!important; overflow:hidden; }.tokodev-contact-v4-shell { display:grid; grid-template-columns:minmax(0,1fr) minmax(380px,.95fr); gap:26px; align-items:stretch; }.tokodev-contact-v4-form-card { min-height:760px; height:100%; display:flex; flex-direction:column; border-radius:34px; padding:38px; background:rgba(255,255,255,.88); border:1px solid rgba(0,107,255,.10); box-shadow:var(--td-shadow); backdrop-filter:blur(14px); }.tokodev-contact-v4-side { min-height:760px; height:100%; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:22px; }.tokodev-contact-v4-kicker { display:inline-flex; width:max-content; margin-bottom:18px; color:var(--td-primary)!important; font-size:12px!important; line-height:1!important; letter-spacing:.14em!important; text-transform:uppercase; font-weight:700!important; }.tokodev-contact-v4-form-card h2 { max-width:560px; margin:0 0 18px!important; color:var(--td-ink)!important; font-size:clamp(42px,4.2vw,62px)!important; line-height:1.06!important; letter-spacing:-.055em!important; font-weight:650!important; }.tokodev-contact-v4-form-card > p { max-width:620px; margin:0!important; color:#61758b!important; font-size:17px!important; line-height:1.75!important; }.tokodev-contact-v4-divider { height:1px; margin:30px 0 26px; background:rgba(0,107,255,.12); }.tokodev-contact-v4-form { display:flex; flex-direction:column; gap:18px; flex:1; }.tokodev-contact-v4-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.tokodev-contact-v4-field { display:grid; gap:9px; }.tokodev-contact-v4-field label { color:var(--td-ink)!important; font-size:14px!important; line-height:1.2!important; font-weight:650!important; }.tokodev-contact-v4-field input,.tokodev-contact-v4-field textarea { width:100%!important; border:1px solid rgba(0,107,255,.10)!important; border-radius:16px!important; background:#fff!important; color:var(--td-ink)!important; padding:0 17px!important; outline:none!important; box-shadow:none!important; font-size:15px!important; }.tokodev-contact-v4-field input { height:54px!important; }.tokodev-contact-v4-field textarea { min-height:176px!important; padding-top:16px!important; padding-bottom:16px!important; resize:vertical; line-height:1.65!important; }.tokodev-contact-v4-field input::placeholder,.tokodev-contact-v4-field textarea::placeholder { color:rgba(8,35,63,.45)!important; }.tokodev-contact-v4-field input:focus,.tokodev-contact-v4-field textarea:focus { border-color:rgba(0,107,255,.45)!important; box-shadow:0 0 0 4px rgba(0,107,255,.10)!important; }.tokodev-contact-v4-submit { min-height:56px; margin-top:auto; width:100%; display:inline-flex!important; align-items:center; justify-content:center; border:0!important; border-radius:999px!important; background:linear-gradient(135deg,var(--td-primary),var(--td-accent))!important; color:#fff!important; font-size:16px!important; line-height:1!important; font-weight:650!important; box-shadow:0 16px 34px rgba(0,107,255,.20)!important; }.tokodev-contact-v4-submit:hover { background:var(--td-navy)!important; transform:translateY(-2px); box-shadow:0 20px 42px rgba(4,42,91,.16)!important; }.tokodev-contact-v4-visual-card { height:100%; border-radius:34px; overflow:hidden; background:linear-gradient(180deg,#eaf5ff 0%,#dff0ff 100%); border:1px solid rgba(0,107,255,.10); box-shadow:var(--td-shadow); }.tokodev-contact-v4-illustration { width:100%; height:100%; }.tokodev-contact-v4-info-wrap { border-radius:30px; padding:18px; display:grid; gap:13px; background:rgba(255,255,255,.88); border:1px solid rgba(0,107,255,.10); box-shadow:var(--td-shadow); backdrop-filter:blur(14px); }.tokodev-contact-v4-info-item { display:grid; grid-template-columns:58px minmax(0,1fr); gap:15px; align-items:center; min-height:82px; padding:16px; border-radius:22px; background:#fff; border:1px solid rgba(0,107,255,.08); }.tokodev-contact-v4-info-icon { width:50px; height:50px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:rgba(0,107,255,.10); color:var(--td-primary); }.tokodev-contact-v4-info-item h3 { margin:0 0 4px!important; color:var(--td-ink)!important; font-size:18px!important; line-height:1.2!important; font-weight:650!important; }.tokodev-contact-v4-info-item a,.tokodev-contact-v4-info-item span { color:#61758b!important; font-size:15px!important; line-height:1.55!important; }.tokodev-contact-v4-info-item a:hover { color:var(--td-primary)!important; }.tokodev-footer { position:relative; padding:78px 0 26px; background:radial-gradient(circle at 8% 0%, rgba(0,167,255,.12), transparent 25%), radial-gradient(circle at 100% 8%, rgba(0,107,255,.12), transparent 24%), linear-gradient(180deg,#071b3d 0%,#06152f 100%); overflow:hidden; }.tokodev-footer .container { max-width:1180px; position:relative; z-index:2; }.tokodev-footer-cta { position:relative; min-height:210px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:32px; padding:34px; margin-bottom:56px; border-radius:30px; overflow:hidden; background:linear-gradient(135deg, rgba(0,167,255,.15), rgba(0,107,255,.18)), rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.11); box-shadow:0 26px 74px rgba(0,0,0,.14); isolation:isolate; }.tokodev-footer-cta::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 42%, rgba(0,167,255,.08), transparent 34%), linear-gradient(90deg, rgba(7,27,61,.94) 0%, rgba(7,27,61,.86) 44%, rgba(7,27,61,.58) 70%, rgba(7,27,61,.38) 100%); z-index:1; pointer-events:none; }.tokodev-footer-cta::after { content:""; position:absolute; inset:16px; border-radius:24px; border:1px solid rgba(255,255,255,.055); z-index:4; pointer-events:none; }.tokodev-footer-cta-copy,.tokodev-footer-cta-action { position:relative; z-index:5; }.tokodev-footer-cta-copy { max-width:660px; }.tokodev-footer-cta-copy h2 { max-width:660px; margin:0 0 14px!important; color:#fff!important; font-size:clamp(38px,4.2vw,58px)!important; line-height:1.08!important; letter-spacing:-.055em!important; font-weight:650!important; }.tokodev-footer-cta-copy p { max-width:560px; margin:0!important; color:rgba(255,255,255,.68)!important; font-size:16.5px!important; line-height:1.72!important; }.tokodev-footer-cta-action { display:flex; justify-content:flex-end; align-items:center; }.tokodev-footer-cta-visual { position:absolute; top:-38px; right:18px; bottom:-44px; width:min(46%,500px); z-index:2; display:flex; align-items:center; justify-content:flex-end; overflow:visible; pointer-events:none; background:transparent!important; }.tokodev-footer-cta-visual::before,.tokodev-footer-cta-visual::after { display:none!important; content:none!important; }.tokodev-footer-cta-visual img { width:auto; height:118%; max-width:none; object-fit:contain; object-position:center right; opacity:.34; filter:saturate(1.05) contrast(1.04); background:transparent!important; -webkit-mask-image:radial-gradient(circle at 58% 52%, black 0%, black 56%, transparent 78%); mask-image:radial-gradient(circle at 58% 52%, black 0%, black 56%, transparent 78%); }.tokodev-footer-main { display:grid; grid-template-columns:minmax(260px,1.35fr) .7fr 1.05fr .92fr; gap:48px; padding-bottom:38px; border-bottom:1px solid rgba(255,255,255,.11); }.tokodev-footer-about { max-width:400px; }.tokodev-brand-footer { margin-bottom:22px; }.tokodev-brand-footer img { width:32px!important; height:32px!important; }.tokodev-brand-footer span { color:#fff!important; font-size:22px!important; font-weight:500!important; }.tokodev-footer-about p { max-width:380px; margin:0!important; color:rgba(255,255,255,.66)!important; font-size:15.5px!important; line-height:1.85!important; }.tokodev-footer-col { display:grid; align-content:start; gap:10px; }.tokodev-footer-col h3 { margin:0 0 12px!important; color:#fff!important; font-size:18px!important; line-height:1.2!important; font-weight:650!important; }.tokodev-footer-col a,.tokodev-footer-col span { width:max-content; max-width:100%; color:rgba(255,255,255,.64)!important; font-size:15px!important; line-height:1.65!important; }.tokodev-footer-col a:hover { color:#fff!important; transform:translateX(4px); }.tokodev-footer-contact-btn { width:max-content!important; min-height:42px; margin-top:8px; padding:0 16px; display:inline-flex!important; align-items:center; justify-content:center; border-radius:999px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.10); color:#fff!important; font-size:14px!important; line-height:1!important; font-weight:560!important; }.tokodev-footer-contact-btn:hover { background:#fff; color:var(--td-primary)!important; transform:translateY(-2px)!important; }.tokodev-footer-bottom { padding-top:22px; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }.tokodev-footer-bottom p { margin:0!important; color:rgba(255,255,255,.52)!important; font-size:14px!important; line-height:1.6!important; }.tokodev-footer-bottom div { display:flex; align-items:center; gap:18px; }.tokodev-footer-bottom a { color:rgba(255,255,255,.62)!important; font-size:14px!important; line-height:1!important; }.tokodev-footer-bottom a:hover { color:#fff!important; }.tokodev-backtop.show { opacity:1; visibility:visible; transform:translateY(0); }.tp_fade_anim,.tp-text-revel-anim,.tpshake-wrap { opacity:0; transform:translateY(20px); transition:opacity .75s ease var(--reveal-delay,0ms), transform .75s ease var(--reveal-delay,0ms); }.tp_fade_anim.tokodev-visible,.tp-text-revel-anim.tokodev-visible,.tpshake-wrap.tokodev-visible { opacity:1; transform:translateY(0); }@keyframes tokodev-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }@media (max-width:1199px) {
  .tokodev-header-inner { width:min(100% - 32px,920px)!important; grid-template-columns:170px minmax(0,1fr) 170px!important; gap:16px!important; }
  .tokodev-header-wrap.tokodev-header-scrolled .tokodev-header-inner,#header-sticky.header-sticky .tokodev-header-inner { width:min(100% - 32px,900px)!important; }
  .tokodev-nav { gap:24px!important; }
  .tokodev-service-feature-grid { column-gap:42px!important; row-gap:58px!important; }
  .tokodev-process-flow { gap:18px; }
  .tokodev-process-arrow { right:-44px; width:58px; }
}@media (max-width:991px) {
  .container { width:min(100% - 32px, 720px); }
  .tokodev-header-wrap { top:14px!important; }
  .tokodev-header-inner { width:calc(100% - 24px)!important; min-height:60px!important; grid-template-columns:1fr 46px!important; padding:0 12px 0 18px!important; background:rgba(255,255,255,.88)!important; border-color:rgba(0,107,255,.10)!important; box-shadow:0 14px 38px rgba(4,42,91,.08)!important; backdrop-filter:blur(16px)!important; }
  .tokodev-nav { display:none!important; }
  .tokodev-header-actions { visibility:visible!important; pointer-events:auto!important; display:flex!important; }
  .tokodev-menu-trigger { display:inline-flex!important; }
  .tokodev-hero { padding-top:128px; }
  .tokodev-section { padding:78px 0; }
  .tokodev-dashboard-grid { grid-template-columns:170px 1fr; }
  .tokodev-dashboard-grid main { padding:22px; }
  .tokodev-dashboard-grid aside { padding:22px 18px; }
  .tokodev-services-template-head,.tokodev-portfolio-v3-head { grid-template-columns:1fr; gap:26px; margin-bottom:58px; }
  .tokodev-service-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; column-gap:36px!important; row-gap:52px!important; }
  .tokodev-process-flow { grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:44px; }
  .tokodev-process-arrow { display:none; }
  .tokodev-project-showcase { grid-template-columns:1fr; }
  .tokodev-project-image-scroll { --portfolio-shot-height:360px; }
  .tokodev-project-placeholder { height:360px; }
  .tokodev-contact-v4 { padding-top:88px!important; padding-bottom:88px!important; }
  .tokodev-contact-v4-shell { grid-template-columns:1fr; }
  .tokodev-contact-v4-form-card,.tokodev-contact-v4-side { min-height:auto; }
  .tokodev-contact-v4-visual-card { min-height:420px; }
  .tokodev-contact-v4-submit { margin-top:6px; }
  .tokodev-footer-cta { grid-template-columns:1fr; min-height:250px; padding:32px 28px; gap:22px; }
  .tokodev-footer-cta-action { justify-content:flex-start; }
  .tokodev-footer-cta-visual { width:62%; right:-8%; top:-28px; bottom:-34px; }
  .tokodev-footer-cta-visual img { height:112%; opacity:.26; }
  .tokodev-footer-main { grid-template-columns:1fr 1fr; gap:34px; }
}@media (max-width:767px) {
  .container { width:min(100% - 24px, 540px); }
  .tokodev-hero { padding:120px 0 54px; }
  .tokodev-hero-title { font-size:clamp(42px,11vw,58px)!important; line-height:1.12!important; }
  .tokodev-word-line { width:160px!important; bottom:-11px!important; }
  .tokodev-hero-subtitle { font-size:16px!important; line-height:1.7!important; }
  .tokodev-dashboard { border-radius:22px 22px 0 0; padding:10px 10px 0; animation:none; }
  .tokodev-browser-bar { height:44px; padding:0 12px; }
  .tokodev-browser-bar p { min-width:0; width:100%; font-size:11px; }
  .tokodev-dashboard-grid { grid-template-columns:1fr; }
  .tokodev-dashboard-grid aside { display:none; }
  .tokodev-dashboard-head { flex-direction:column; }
  .tokodev-dashboard-stat { grid-template-columns:1fr; }
  .tokodev-dashboard-panel { grid-template-columns:1fr; }
  .tokodev-services-template,.tokodev-why,.tokodev-process-section,.tokodev-portfolio-v3,.tokodev-faq-section,.tokodev-contact-v4 { padding-top:76px!important; padding-bottom:76px!important; }
  .tokodev-services-template-head h2,.tokodev-why h2,.tokodev-process-head h2,.tokodev-portfolio-v3-head h2,.tokodev-faq-section-head h2,.tokodev-contact-v4-form-card h2 { font-size:clamp(34px,10vw,44px)!important; line-height:1.12!important; }
  .tokodev-services-template-head { margin-bottom:44px; }
  
  .tokodev-service-feature-grid { grid-template-columns:1fr!important; row-gap:42px!important; }
  .tokodev-feature-service { min-height:auto; }
  .tokodev-why-list { padding:12px; border-radius:24px; }
  .tokodev-why-list div { grid-template-columns:42px minmax(0,1fr); gap:14px; padding:14px; border-radius:18px; }
  .tokodev-why-list div:hover { transform:translateY(-3px); }
  .tokodev-why-list span { width:40px; height:40px; font-size:13px!important; }
  .tokodev-why-list p { font-size:14.5px!important; }
  .tokodev-process-flow { grid-template-columns:1fr; }
  .tokodev-process-head { margin-bottom:44px; }
  .tokodev-process-visual { margin-bottom:20px; }
  .tokodev-project-preview { margin:14px 14px 0; border-radius:18px; }
  .tokodev-project-browser { height:40px; padding:0 12px; }
  .tokodev-project-browser p { width:min(220px,62%); height:22px; font-size:10.5px!important; }
  .tokodev-project-image-scroll { --portfolio-shot-height:260px; }
  .tokodev-project-placeholder { height:260px; }
  .tokodev-project-content { padding:24px; }
  .tokodev-faq-section-head { margin-bottom:38px; }
  .tokodev-faq-section-head p { font-size:16px!important; line-height:1.7!important; }
  .tokodev-faq-item summary { grid-template-columns:38px minmax(0,1fr) 36px; gap:12px; padding:16px; }
  .tokodev-faq-index { width:36px; height:36px; font-size:12px!important; }
  .tokodev-faq-title { font-size:16px!important; }
  .tokodev-faq-plus { width:36px; height:36px; }
  .tokodev-faq-body { padding:0 16px 20px 66px; }
  .tokodev-contact-v4-form-card { padding:26px 22px 24px; border-radius:26px; }
  .tokodev-contact-v4-form-card > p { font-size:16px!important; line-height:1.7!important; }
  .tokodev-contact-v4-divider { margin:24px 0 22px; }
  .tokodev-contact-v4-grid { grid-template-columns:1fr; gap:16px; }
  .tokodev-contact-v4-field input { height:52px!important; }
  .tokodev-contact-v4-field textarea { min-height:140px!important; }
  .tokodev-contact-v4-visual-card { min-height:320px; border-radius:26px; }
  .tokodev-contact-v4-info-wrap { border-radius:24px; padding:16px; }
  .tokodev-contact-v4-info-item { grid-template-columns:50px minmax(0,1fr); min-height:76px; padding:15px; border-radius:18px; }
  .tokodev-contact-v4-info-icon { width:44px; height:44px; }
  .tokodev-footer { padding:60px 0 24px; }
  .tokodev-footer-cta { min-height:auto; padding:28px 22px; border-radius:26px; margin-bottom:40px; }
  .tokodev-footer-cta::after { inset:12px; border-radius:20px; }
  .tokodev-footer-cta-copy h2 { font-size:clamp(31px,10vw,42px)!important; line-height:1.12!important; }
  .tokodev-footer-cta-copy p { font-size:15px!important; line-height:1.68!important; max-width:100%; }
  .tokodev-footer-cta-action a { width:100%; min-height:54px; }
  .tokodev-footer-cta-visual { width:92%; right:-42%; top:-20px; bottom:-22px; }
  .tokodev-footer-cta-visual img { height:105%; opacity:.18; }
  .tokodev-footer-main { grid-template-columns:1fr; gap:30px; }
  .tokodev-footer-about p { font-size:15px!important; line-height:1.75!important; }
  .tokodev-footer-contact-btn { width:100%!important; }
  .tokodev-footer-bottom { padding-top:18px; flex-direction:column; align-items:flex-start; }
}@media (max-width:575px) {
  .tokodev-header-inner { border-radius:26px!important; }
  .tokodev-brand img { width:30px!important; height:30px!important; }
  .tokodev-brand span { font-size:18px!important; }
  .tp-offcanvas.tokodev-offcanvas { top:10px; right:10px; bottom:10px; width:calc(100vw - 20px); padding:16px; border-radius:24px; }
  .tokodev-drawer-hero { padding:18px; border-radius:22px; }
  .tokodev-drawer-hero h3 { font-size:23px!important; }
  .tokodev-offcanvas-menu a { min-height:56px; }
}.tokodev-floating-wa{position:fixed;right:24px;bottom:24px;z-index:1200;min-height:56px;padding:0 22px;display:inline-flex!important;align-items:center;justify-content:center;gap:10px;border-radius:999px;background:#25d366;color:#fff!important;font-family:var(--tp-ff-inter),Inter,Arial,sans-serif!important;font-size:15px!important;line-height:1!important;font-weight:700!important;box-shadow:0 18px 42px rgba(37,211,102,.28),inset 0 1px 0 rgba(255,255,255,.24);overflow:hidden}.tokodev-floating-wa:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.26) 42%,transparent 72%);transform:translateX(-120%);transition:transform .55s ease}.tokodev-floating-wa svg,.tokodev-floating-wa span{position:relative;z-index:2}.tokodev-floating-wa:hover{background:#1fbe5b;color:#fff!important;transform:translateY(-3px);box-shadow:0 22px 50px rgba(37,211,102,.34),inset 0 1px 0 rgba(255,255,255,.26)}.tokodev-floating-wa:hover:before{transform:translateX(120%)}.tokodev-backtop{
  position: fixed;
  right: 24px !important;
  bottom: 92px !important;
  z-index: 1190 !important;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(0,107,255,.12) !important;
  border-radius: 50%;
  background: rgba(255,255,255,.94) !important;
  color: var(--td-ink,#061a33) !important;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  box-shadow: 0 16px 34px rgba(4,42,91,.12) !important;
  left: auto !important;
  backdrop-filter: blur(12px);
}.tokodev-backtop:hover{
  background: var(--td-primary,#006bff) !important;
  transform: translateY(-2px);
  color: #fff !important;
}.tokodev-footer-cta-action a{
  min-height: 54px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #25d366 !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  white-space: nowrap;
  box-shadow: 0 14px 32px rgba(37,211,102,.24) !important;
  border: 1px solid rgba(37,211,102,.35) !important;
}.tokodev-footer-cta-action a:hover{
  background: #1fbe5b !important;
  color: #fff !important;
  transform: translateY(-2px);
  border-color: rgba(31,190,91,.48) !important;
  box-shadow: 0 18px 40px rgba(37,211,102,.30) !important;
}.tokodev-footer-cta-action a svg{color:currentColor!important}.tokodev-subnav-brand{display:inline-flex!important;align-items:center;gap:10px}.tokodev-subnav-brand img{width:32px;height:32px}.tokodev-subnav-brand span{font-family:var(--tp-ff-inter),Inter,Arial,sans-serif!important;font-size:19px!important;line-height:1!important;letter-spacing:-.025em!important;font-weight:600!important;color:#fff!important;transition:color .25s ease}.tokodev-subnav-light .tokodev-subnav-brand span,.tokodev-subnav-scrolled .tokodev-subnav-brand span{color:var(--td-ink,#061a33)!important}.tokodev-news-page{min-height:100vh;background:radial-gradient(circle at 12% 0%,rgba(0,107,255,.07),transparent 28%),radial-gradient(circle at 88% 12%,rgba(46,215,255,.06),transparent 26%),linear-gradient(180deg,#fff 0%,#f7fbff 52%,#eef6ff 100%);color:var(--td-ink,#061a33)}.tokodev-subpage .container{max-width:1180px}.tokodev-subpage-hero{padding:150px 0 70px;text-align:center}.tokodev-subpage-hero .tokodev-kicker{background:rgba(0,107,255,.08)!important;color:var(--td-primary,#006bff)!important}.tokodev-subpage-hero h1{max-width:900px;margin:22px auto 18px!important;color:var(--td-ink,#061a33)!important;font-family:var(--tp-ff-inter),Inter,Arial,sans-serif!important;font-size:clamp(44px,5vw,72px)!important;line-height:1.06!important;letter-spacing:-.055em!important;font-weight:700!important}.tokodev-subpage-hero p{max-width:760px;margin:0 auto!important;color:#53687f!important;font-family:var(--tp-ff-inter),Inter,Arial,sans-serif!important;font-size:18px!important;line-height:1.75!important}.tokodev-news-list{padding:0 0 108px}.tokodev-news-card span{display:inline-flex;margin-bottom:16px;color:var(--td-primary,#006bff)!important;font-weight:800!important;letter-spacing:.08em;text-transform:uppercase;font-size:12px!important}.tokodev-news-card p{color:#53687f!important;line-height:1.75!important}.tokodev-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.tokodev-news-card{
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(0,107,255,.08);
  box-shadow: 0 24px 70px rgba(4,42,91,.08);
  backdrop-filter: blur(14px);
  border-radius: 28px;
  padding: 28px;
  transition: transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}.tokodev-news-card:hover{transform:translateY(-6px);border-color:rgba(0,107,255,.18);box-shadow:0 30px 82px rgba(4,42,91,.12)}.tokodev-news-card h2{margin:0 0 14px!important;color:var(--td-ink,#061a33)!important;font-size:24px!important;line-height:1.18!important;letter-spacing:-.035em!important}.tokodev-news-card a{margin-top:18px;display:inline-flex!important;align-items:center;gap:8px;color:var(--td-primary,#006bff)!important;font-weight:800!important}.tokodev-news-page .tokodev-footer{background:radial-gradient(circle at 8% 0%,rgba(46,215,255,.13),transparent 26%),radial-gradient(circle at 100% 8%,rgba(0,107,255,.14),transparent 26%),linear-gradient(180deg,#061b34 0%,#07162b 52%,#06172c 100%)!important}.tokodev-portfolio-page{min-height:100vh;background:radial-gradient(circle at 18% 0%,rgba(0,107,255,.24),transparent 30%),radial-gradient(circle at 88% 12%,rgba(28,182,255,.16),transparent 28%),linear-gradient(180deg,#061b34 0%,#07162b 44%,#06172c 100%);color:#fff}.tokodev-portfolio-page .container{max-width:1180px}.tokodev-portfolio-page-hero{padding:142px 0 58px;text-align:center}.tokodev-portfolio-page-hero .tokodev-kicker{background:rgba(255,255,255,.10);color:#63c9ff!important}.tokodev-portfolio-page-hero h1{max-width:900px;margin:22px auto 18px!important;color:#fff!important;font-family:var(--tp-ff-inter),Inter,Arial,sans-serif!important;font-size:clamp(44px,5vw,72px)!important;line-height:1.06!important;letter-spacing:-.055em!important;font-weight:700!important}.tokodev-portfolio-page-hero p{max-width:740px;margin:0 auto!important;color:rgba(255,255,255,.68)!important;font-size:18px!important;line-height:1.75!important}.tokodev-portfolio-page-list{padding:0 0 96px}.tokodev-portfolio-page-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}@media (min-width:1400px){.tokodev-portfolio-page-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.tokodev-portfolio-mini-card{position:relative;display:flex;flex-direction:column;padding:0;text-align:left;border:1px solid rgba(255,255,255,.10);border-radius:26px;overflow:hidden;background:rgba(255,255,255,.075);box-shadow:0 22px 60px rgba(0,0,0,.16);cursor:pointer;transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease,background-color .32s ease}.tokodev-portfolio-mini-card:hover{transform:translateY(-8px);border-color:rgba(99,201,255,.34);background:rgba(255,255,255,.11);box-shadow:0 30px 76px rgba(0,0,0,.22)}.tokodev-portfolio-mini-shot{height:190px;overflow:hidden;background:rgba(255,255,255,.08)}.tokodev-portfolio-mini-shot img{width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .48s ease}.tokodev-portfolio-mini-card:hover .tokodev-portfolio-mini-shot img{transform:scale(1.06)}.tokodev-portfolio-mini-placeholder{height:100%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 20% 18%,rgba(99,201,255,.18),transparent 30%),linear-gradient(135deg,rgba(255,255,255,.10),rgba(255,255,255,.04))}.tokodev-portfolio-mini-placeholder span{color:rgba(255,255,255,.72)!important;font-size:13px!important}.tokodev-portfolio-mini-content{padding:20px}.tokodev-portfolio-mini-content>span{width:max-content;max-width:100%;min-height:30px;display:inline-flex;align-items:center;padding:0 11px;margin-bottom:14px;border-radius:999px;background:rgba(99,201,255,.14);color:#8edcff!important;font-size:11px!important;font-weight:800!important}.tokodev-portfolio-mini-content h2{margin:0 0 10px!important;color:#fff!important;font-size:22px!important;line-height:1.14!important;letter-spacing:-.035em!important}.tokodev-portfolio-mini-content p{min-height:78px;margin:0 0 18px!important;color:rgba(255,255,255,.66)!important;font-size:14px!important;line-height:1.62!important}.tokodev-portfolio-mini-tags{display:flex;flex-wrap:wrap;gap:7px}.tokodev-portfolio-mini-tags em{min-height:28px;display:inline-flex;align-items:center;padding:0 9px;border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.72)!important;font-style:normal;font-size:11px!important}.tokodev-portfolio-modal{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(3,12,24,.70);backdrop-filter:blur(10px)}.tokodev-portfolio-modal-card{position:relative;width:min(900px,100%);max-height:calc(100vh - 48px);display:grid;grid-template-columns:.92fr 1.08fr;overflow:hidden;border-radius:30px;background:#0d1714;border:1px solid rgba(255,255,255,.11);box-shadow:0 30px 90px rgba(0,0,0,.36)}.tokodev-portfolio-modal-close{position:absolute;top:16px;right:16px;z-index:8;width:42px;height:42px;border:0;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.94);color:#0d1714;box-shadow:0 12px 28px rgba(0,0,0,.14)}.tokodev-portfolio-modal-close:hover{background:#fff;transform:rotate(90deg)}.tokodev-portfolio-modal-image{height:auto;min-height:100%;overflow:hidden;background:#10221d}.tokodev-portfolio-modal-image img{width:100%;height:100%;object-fit:cover;object-position:top center}.tokodev-portfolio-modal-placeholder{min-height:380px;height:100%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7)}.tokodev-portfolio-modal-body{padding:28px;display:flex;flex-direction:column}.tokodev-portfolio-modal-meta{width:max-content;max-width:100%;min-height:32px;display:inline-flex;align-items:center;padding:0 12px;margin-bottom:14px;border-radius:999px;background:rgba(99,201,255,.14);color:#8edcff!important;font-size:12px!important;font-weight:800!important}.tokodev-portfolio-modal-body h2{margin:0 0 10px!important;color:#fff!important;font-size:clamp(32px,3.2vw,44px)!important;line-height:1.08!important;letter-spacing:-.045em!important}.tokodev-portfolio-modal-body>p{margin:0 0 18px!important;color:rgba(255,255,255,.68)!important;font-size:15px!important;line-height:1.65!important}.tokodev-portfolio-modal-info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:16px}.tokodev-portfolio-modal-info div{padding:14px;border-radius:16px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.06)}.tokodev-portfolio-modal-info span{display:block;margin-bottom:7px;color:rgba(255,255,255,.42)!important;font-size:11px!important;letter-spacing:.08em;text-transform:uppercase}.tokodev-portfolio-modal-info strong{color:#fff!important;font-size:14px!important;line-height:1.5!important;font-weight:600!important}.tokodev-portfolio-modal-tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.tokodev-portfolio-modal-tags span{min-height:30px;display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.74)!important;font-size:12px!important}.tokodev-portfolio-modal-wa{min-height:54px;margin-top:auto;width:100%;display:inline-flex!important;align-items:center;justify-content:center;gap:10px;border-radius:999px;background:#25d366;color:#fff!important;font-size:15px!important;font-weight:800!important}.tokodev-portfolio-modal-wa:hover{background:#1fbe5b;color:#fff!important;transform:translateY(-2px)}@media (max-width:991px){.tokodev-portfolio-page-grid, .tokodev-news-grid{grid-template-columns:1fr 1fr}.tokodev-portfolio-modal-card{grid-template-columns:1fr;max-height:calc(100vh - 48px);overflow:auto}.tokodev-portfolio-modal-image{height:240px}.tokodev-portfolio-modal-image img{height:100%}}@media (max-width:767px){.tokodev-floating-wa{right:16px;bottom:16px;min-height:52px;padding:0 18px;font-size:14px!important}.tokodev-backtop{right:16px!important;bottom:82px!important}.tokodev-subpage-hero,.tokodev-portfolio-page-hero{padding-top:112px;padding-bottom:50px}.tokodev-subpage-hero h1,.tokodev-portfolio-page-hero h1{font-size:clamp(34px,10vw,46px)!important;line-height:1.12!important}.tokodev-subpage-hero p,.tokodev-portfolio-page-hero p{font-size:16px!important;line-height:1.7!important}.tokodev-portfolio-page-grid, .tokodev-news-grid{grid-template-columns:1fr}.tokodev-portfolio-mini-shot{height:220px}.tokodev-portfolio-modal{padding:14px;align-items:flex-start;overflow-y:auto}.tokodev-portfolio-modal-card{max-height:none;border-radius:24px}.tokodev-portfolio-modal-image{height:210px}.tokodev-portfolio-modal-body{padding:22px}.tokodev-portfolio-modal-info{grid-template-columns:1fr}}.tokodev-hero-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 32px;
  align-items: center;
}.tokodev-hero-btn {
  position: relative;
  min-height: 56px;
  padding: 0 30px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 11px;
  border-radius: 16px;
  overflow: hidden;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background-color 0.25s ease,
    color 0.25s ease;
}.tokodev-hero-btn svg,
.tokodev-hero-btn span {
  position: relative;
  z-index: 2;
}.tokodev-hero-btn-whatsapp {
  background: #25d366 !important;
  color: #ffffff !important;
  border: 1px solid rgba(37, 211, 102, 0.42);
  box-shadow:
    0 18px 38px rgba(37, 211, 102, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}.tokodev-hero-btn-whatsapp::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255, 255, 255, 0.26) 42%,
    transparent 72%
  );
  transform: translateX(-120%);
  transition: transform 0.55s ease;
}.tokodev-hero-btn-whatsapp:hover {
  background: #1fbe5b !important;
  color: #ffffff !important;
  transform: translateY(-3px);
  box-shadow:
    0 24px 48px rgba(37, 211, 102, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
}.tokodev-hero-btn-whatsapp:hover::before {
  transform: translateX(120%);
}.tokodev-hero-btn-light {
  background: #ffffff !important;
  color: var(--td-dark, #0b3229) !important;
  border: 1px solid rgba(11, 50, 41, 0.08);
  box-shadow:
    0 16px 34px rgba(7, 31, 37, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.92);
}.tokodev-hero-btn-light:hover {
  background: #f7fbff !important;
  color: var(--td-primary, #006bff) !important;
  transform: translateY(-3px);
  box-shadow:
    0 22px 46px rgba(0, 107, 255, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 0.96);
}.tokodev-hero-btn-light svg {
  transition: transform 0.25s ease;
}.tokodev-hero-btn-light:hover svg {
  transform: translateX(5px);
}@media (max-width: 767px) {
  .tokodev-hero-actions {
    gap: 12px;
    margin-top: 26px;
  }

  .tokodev-hero-btn {
    min-height: 52px;
    padding: 0 22px;
    border-radius: 14px;
    font-size: 15px !important;
  }
}@media (max-width: 480px) {
  .tokodev-hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .tokodev-hero-btn {
    width: 100%;
  }
}.tokodev-drawer-cta {
  padding: 12px !important;
  margin-bottom: 14px !important;
  border-radius: 18px !important;
  background: radial-gradient(circle at 92% 10%, rgba(37, 211, 102, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(37, 211, 102, 0.10), rgba(0, 166, 255, 0.08)),
    #eefdff !important;
  border: 1px solid rgba(0, 166, 255, 0.10) !important;
  box-shadow: 0 12px 28px rgba(0, 107, 255, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}.tokodev-drawer-cta p {
  margin: 0 0 10px !important;
  color: var(--td-ink, #061a33) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  letter-spacing: -0.01em !important;
}.tokodev-drawer-cta a {
  min-height: 40px !important;
  width: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  background: #25d366 !important;
  color: #ffffff !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  box-shadow: 0 12px 24px rgba(37, 211, 102, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
  gap: 8px !important;
  border: 1px solid rgba(37, 211, 102, 0.42) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  line-height: 1 !important;
}.tokodev-drawer-cta a:hover {
  background: #1fbe5b !important;
  transform: translateY(-2px);
  color: #ffffff !important;
  box-shadow: 0 16px 30px rgba(37, 211, 102, 0.30),
    inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
}.tokodev-drawer-cta a svg {
  width: 15px !important;
  height: 15px !important;
  flex: 0 0 auto;
}.tokodev-drawer-cta a span {
  color: inherit !important;
}.tokodev-home-news {
  padding-top: 110px !important;
  padding-bottom: 112px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(0, 107, 255, 0.08), transparent 28%),
    radial-gradient(circle at 86% 18%, rgba(28, 182, 255, 0.08), transparent 28%),
    linear-gradient(180deg, #f7fbff 0%, #eef6ff 100%) !important;
  overflow: hidden;
}.tokodev-home-news .container {
  max-width: 1180px;
}.tokodev-home-news-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 440px);
  gap: 42px;
  align-items: end;
  margin-bottom: 48px;
}.tokodev-home-news-head h2 {
  max-width: 760px;
  margin: 22px 0 0 !important;
  color: var(--td-ink, #061a33) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: clamp(42px, 4.4vw, 64px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.055em !important;
  font-weight: 600 !important;
}.tokodev-home-news-head p {
  margin: 0 !important;
  color: #53687f !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
  font-weight: 400 !important;
}.tokodev-home-news-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}.tokodev-home-news-card {
  position: relative;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  padding: 28px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 107, 255, 0.08);
  box-shadow: 0 24px 70px rgba(4, 42, 91, 0.08);
  overflow: hidden;
  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease;
}.tokodev-home-news-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 88% 10%, rgba(0, 107, 255, 0.10), transparent 30%),
    radial-gradient(circle at 12% 90%, rgba(28, 182, 255, 0.10), transparent 30%);
  opacity: 0;
  transition: opacity 0.28s ease;
}.tokodev-home-news-card:hover {
  transform: translateY(-7px);
  border-color: rgba(0, 107, 255, 0.18);
  box-shadow: 0 32px 82px rgba(4, 42, 91, 0.12);
}.tokodev-home-news-card:hover::before {
  opacity: 1;
}.tokodev-home-news-card > * {
  position: relative;
  z-index: 2;
}.tokodev-home-news-card span {
  width: max-content;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  margin-bottom: 22px;
  border-radius: 999px;
  background: rgba(0, 107, 255, 0.08);
  color: var(--td-primary, #006bff) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
}.tokodev-home-news-card h3 {
  margin: 0 0 14px !important;
  color: var(--td-ink, #061a33) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 24px !important;
  line-height: 1.22 !important;
  letter-spacing: -0.035em !important;
  font-weight: 600 !important;
}.tokodev-home-news-card p {
  margin: 0 0 24px !important;
  color: #53687f !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
}.tokodev-home-news-card a {
  margin-top: auto;
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  color: var(--td-primary, #006bff) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
}.tokodev-home-news-card a svg {
  transition: transform 0.25s ease;
}.tokodev-home-news-card a:hover svg {
  transform: translateX(5px);
}@media (max-width: 991px) {
  .tokodev-home-news {
    padding-top: 88px !important;
    padding-bottom: 88px !important;
  }

  .tokodev-home-news-head {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .tokodev-home-news-grid {
    grid-template-columns: 1fr;
  }

  .tokodev-home-news-card {
    min-height: auto;
  }
}@media (max-width: 767px) {
  .tokodev-home-news {
    padding-top: 76px !important;
    padding-bottom: 76px !important;
  }

  .tokodev-home-news-head h2 {
    font-size: clamp(34px, 10vw, 44px) !important;
    line-height: 1.12 !important;
  }

  .tokodev-home-news-head p {
    font-size: 16px !important;
  }

  .tokodev-home-news-card {
    padding: 24px;
    border-radius: 24px;
  }

  
}.tp_fade_anim,
.tp_fade_anim[data-delay] {
  opacity: 1;
  visibility: visible;
}.tokodev-subnav {
  position: fixed !important;
  top: 18px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  background: transparent !important;
  pointer-events: none !important;
}.tokodev-subnav .container {
  max-width: 1180px;
}.tokodev-subnav-inner {
  pointer-events: auto !important;
  width: min(100%, 1040px) !important;
  min-height: 64px !important;
  margin: 0 auto !important;
  padding: 0 22px !important;
  display: grid !important;
  grid-template-columns: 180px minmax(0, 1fr) 180px !important;
  align-items: center !important;
  gap: 22px !important;
  border-radius: 999px !important;
  transition:
    width 0.28s ease,
    background-color 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease,
    backdrop-filter 0.28s ease;
}.tokodev-subnav-light:not(.tokodev-subnav-scrolled) .tokodev-subnav-inner {
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}.tokodev-subnav-light:not(.tokodev-subnav-scrolled) .tokodev-subnav-brand span,
.tokodev-subnav-light:not(.tokodev-subnav-scrolled) .tokodev-subnav-menu a {
  color: var(--td-ink, #061a33) !important;
}.tokodev-subnav-dark:not(.tokodev-subnav-scrolled) .tokodev-subnav-inner {
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}.tokodev-subnav-dark:not(.tokodev-subnav-scrolled) .tokodev-subnav-brand span,
.tokodev-subnav-dark:not(.tokodev-subnav-scrolled) .tokodev-subnav-menu a {
  color: rgba(255, 255, 255, 0.88) !important;
}.tokodev-subnav-scrolled .tokodev-subnav-inner {
  width: min(100%, 980px) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(11, 50, 41, 0.08) !important;
  box-shadow:
    0 18px 48px rgba(7, 31, 37, 0.10),
    inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}.tokodev-subnav-scrolled .tokodev-subnav-brand span,
.tokodev-subnav-scrolled .tokodev-subnav-menu a {
  color: var(--td-ink, #061a33) !important;
}.tokodev-subnav-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 30px !important;
  white-space: nowrap !important;
}.tokodev-subnav-menu a {
  position: relative !important;
  padding: 22px 0 20px !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: 0.055em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
}.tokodev-subnav-menu a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 14px;
  width: 0;
  height: 2px;
  border-radius: 999px;
  background: var(--td-primary, #006bff);
  transform: translateX(-50%);
  transition: width 0.25s ease;
}.tokodev-subnav-menu a:hover {
  color: var(--td-primary, #006bff) !important;
}.tokodev-subnav-menu a:hover::after {
  width: 100%;
}@media (max-width: 991px) {
  .tokodev-subnav {
    top: 14px !important;
  }

  .tokodev-subnav-inner {
    width: calc(100% - 24px) !important;
    min-height: 60px !important;
    grid-template-columns: 1fr !important;
    padding: 0 18px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 1px solid rgba(11, 50, 41, 0.08) !important;
    box-shadow: 0 14px 38px rgba(7, 31, 37, 0.10) !important;
    backdrop-filter: blur(16px) !important;
  }

  .tokodev-subnav-brand span {
    color: var(--td-ink, #061a33) !important;
  }

  .tokodev-subnav-menu,
  .tokodev-subnav-spacer {
    display: none !important;
  }
}.tokodev-404-page {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  padding: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 14% 12%, rgba(0, 107, 255, 0.26), transparent 30%),
    radial-gradient(circle at 84% 12%, rgba(28, 182, 255, 0.20), transparent 26%),
    radial-gradient(circle at 50% 100%, rgba(37, 211, 102, 0.10), transparent 32%),
    linear-gradient(180deg, #061b34 0%, #07162b 48%, #06172c 100%);
}.tokodev-404-noise {
  position: absolute;
  inset: 0;
  opacity: 0.24;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at center, black, transparent 78%);
}.tokodev-404-shapes {
  position: absolute;
  inset: 0;
  pointer-events: none;
}.tokodev-404-shapes .shape {
  position: absolute;
  border-radius: 999px;
  filter: blur(2px);
  opacity: 0.7;
  animation: tokodev404Float 8s ease-in-out infinite;
}.tokodev-404-shapes .shape-1 {
  width: 18px;
  height: 18px;
  left: 9%;
  top: 24%;
  background: #1cb6ff;
}.tokodev-404-shapes .shape-2 {
  width: 26px;
  height: 26px;
  right: 12%;
  top: 22%;
  background: #006bff;
  animation-delay: 1.2s;
}.tokodev-404-shapes .shape-3 {
  width: 15px;
  height: 15px;
  left: 54%;
  bottom: 11%;
  background: #25d366;
  animation-delay: 2s;
}.tokodev-404-wrap {
  position: relative;
  z-index: 2;
  width: min(100%, 1180px);
  min-height: 720px;
  padding: 22px;
  border-radius: 42px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow:
    0 38px 120px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(18px);
}.tokodev-404-nav {
  min-height: 70px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}.tokodev-404-brand {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  color: #ffffff !important;
}.tokodev-404-brand img {
  width: 34px;
  height: 34px;
  object-fit: contain;
}.tokodev-404-brand span {
  color: #ffffff !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 21px !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  font-weight: 600 !important;
}.tokodev-404-nav-links {
  display: flex;
  align-items: center;
  gap: 10px;
}.tokodev-404-nav-links a {
  min-height: 40px;
  padding: 0 15px;
  display: inline-flex !important;
  align-items: center;
  border-radius: 999px;
  color: rgba(255,255,255,.72) !important;
  border: 1px solid transparent;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}.tokodev-404-nav-links a:hover {
  color: #ffffff !important;
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.10);
}.tokodev-404-grid {
  min-height: 610px;
  display: grid;
  grid-template-columns: minmax(0, .96fr) minmax(430px, 1.04fr);
  gap: 32px;
  align-items: center;
  padding: 28px;
}.tokodev-404-copy {
  position: relative;
  z-index: 2;
}.tokodev-404-badge {
  min-height: 38px;
  padding: 0 16px;
  margin-bottom: 22px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: rgba(28, 182, 255, 0.14);
  color: #8edcff !important;
  border: 1px solid rgba(142, 220, 255, .16);
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 12px !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase;
  font-weight: 700 !important;
}.tokodev-404-copy h1 {
  max-width: 650px;
  margin: 0 0 20px !important;
  color: #ffffff !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: clamp(46px, 5.4vw, 78px) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.07em !important;
  font-weight: 650 !important;
}.tokodev-404-copy p {
  max-width: 590px;
  margin: 0 0 34px !important;
  color: rgba(255,255,255,.68) !important;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 17px !important;
  line-height: 1.75 !important;
  font-weight: 400 !important;
}.tokodev-404-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}.tokodev-404-btn {
  min-height: 54px;
  padding: 0 22px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: 999px;
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  transition:
    transform .25s ease,
    box-shadow .25s ease,
    background-color .25s ease,
    color .25s ease;
}.tokodev-404-btn svg {
  transition: transform .25s ease;
}.tokodev-404-btn:hover svg {
  transform: translateX(5px);
}.tokodev-404-btn-primary {
  background: #ffffff;
  color: #061a33 !important;
  box-shadow: 0 18px 42px rgba(255,255,255,.10);
}.tokodev-404-btn-primary:hover {
  background: #eaf5ff;
  color: #006bff !important;
  transform: translateY(-2px);
}.tokodev-404-btn-light {
  background: rgba(255,255,255,.10);
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.12);
}.tokodev-404-btn-light:hover {
  background: rgba(255,255,255,.16);
  color: #ffffff !important;
  transform: translateY(-2px);
}.tokodev-404-btn-wa {
  background: #25d366;
  color: #ffffff !important;
  box-shadow: 0 18px 38px rgba(37, 211, 102, 0.22);
}.tokodev-404-btn-wa:hover {
  background: #1fbe5b;
  color: #ffffff !important;
  transform: translateY(-2px);
}.tokodev-404-visual {
  position: relative;
  min-height: 520px;
  display: flex;
  align-items: center;
  justify-content: center;
}.tokodev-404-visual::before {
  content: "";
  position: absolute;
  width: 430px;
  height: 430px;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(28,182,255,.18), transparent 62%);
  border: 1px dashed rgba(142,220,255,.20);
  animation: tokodev404Spin 18s linear infinite;
}.tokodev-404-visual::after {
  content: "";
  position: absolute;
  width: 315px;
  height: 315px;
  border-radius: 999px;
  border: 1px dashed rgba(37,211,102,.22);
  animation: tokodev404Spin 12s linear infinite reverse;
}.tokodev-404-number {
  position: absolute;
  top: 42px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
  animation: tokodev404FloatCard 4.8s ease-in-out infinite;
}.tokodev-404-number > span {
  color: #ffffff;
  text-shadow:
    0 0 28px rgba(28,182,255,.35),
    0 18px 50px rgba(0,0,0,.20);
  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: clamp(92px, 11vw, 150px);
  line-height: .9;
  letter-spacing: -.09em;
  font-weight: 750;
}.tokodev-404-number > div {
  width: 112px;
  height: 112px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 34px;
  background:
    radial-gradient(circle at 28% 20%, rgba(255,255,255,.36), transparent 34%),
    linear-gradient(135deg, #006bff, #1cb6ff);
  box-shadow:
    0 28px 60px rgba(0,107,255,.38),
    inset 0 1px 0 rgba(255,255,255,.26);
  animation: tokodev404Pulse 2.7s ease-in-out infinite;
}.tokodev-404-number img {
  width: 58px;
  height: 58px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}.tokodev-404-terminal {
  position: relative;
  z-index: 4;
  width: min(100%, 430px);
  margin-top: 150px;
  overflow: hidden;
  border-radius: 28px;
  background:
    radial-gradient(circle at 90% 0%, rgba(28,182,255,.16), transparent 34%),
    rgba(4, 15, 30, .82);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow:
    0 30px 80px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(18px);
  animation: tokodev404Terminal 5.2s ease-in-out infinite;
}.tokodev-404-terminal-top {
  height: 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 16px;
  background: rgba(255,255,255,.07);
}.tokodev-404-terminal-top span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}.tokodev-404-terminal-top span:nth-child(1) {
  background: #ff6b6b;
}.tokodev-404-terminal-top span:nth-child(2) {
  background: #ffd166;
}.tokodev-404-terminal-top span:nth-child(3) {
  background: #25d366;
}.tokodev-404-terminal-top em {
  margin-left: auto;
  color: rgba(255,255,255,.44);
  font-style: normal;
  font-size: 12px;
}.tokodev-404-terminal-body {
  padding: 20px;
  display: grid;
  gap: 12px;
}.tokodev-404-terminal-body p {
  margin: 0 !important;
  color: rgba(255,255,255,.76) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
}.tokodev-404-terminal-body p span {
  color: #8edcff;
  margin-right: 8px;
}.tokodev-404-terminal-progress {
  height: 10px;
  margin-top: 6px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.10);
}.tokodev-404-terminal-progress i {
  display: block;
  width: 46%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #006bff, #1cb6ff, #25d366);
  animation: tokodev404Progress 2.2s ease-in-out infinite;
}.tokodev-404-chip {
  position: absolute;
  z-index: 5;
  min-height: 38px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.78);
  font-size: 12px;
  font-weight: 700;
  backdrop-filter: blur(12px);
  animation: tokodev404Float 6s ease-in-out infinite;
}.tokodev-404-chip.chip-1 {
  left: 18px;
  top: 136px;
}.tokodev-404-chip.chip-2 {
  right: 36px;
  top: 172px;
  animation-delay: .8s;
}.tokodev-404-chip.chip-3 {
  left: 54px;
  bottom: 112px;
  animation-delay: 1.6s;
}.tokodev-404-chip.chip-4 {
  right: 44px;
  bottom: 78px;
  animation-delay: 2.2s;
}@keyframes tokodev404Float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-16px); }
}@keyframes tokodev404FloatCard {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-14px) rotate(1deg); }
}@keyframes tokodev404Terminal {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(10px); }
}@keyframes tokodev404Spin {
  to { transform: rotate(360deg); }
}@keyframes tokodev404Pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.065); }
}@keyframes tokodev404Progress {
  0% { transform: translateX(-12%); }
  50% { transform: translateX(120%); }
  100% { transform: translateX(-12%); }
}@media (max-width: 991px) {
  .tokodev-404-page {
    padding: 18px;
  }

  .tokodev-404-wrap {
    min-height: auto;
    border-radius: 32px;
  }

  .tokodev-404-grid {
    grid-template-columns: 1fr;
    padding: 22px;
    text-align: center;
  }

  .tokodev-404-copy p {
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .tokodev-404-actions {
    justify-content: center;
  }

  .tokodev-404-visual {
    min-height: 430px;
  }

  .tokodev-404-number {
    top: 20px;
  }
}@media (max-width: 575px) {
  .tokodev-404-page {
    padding: 12px;
  }

  .tokodev-404-wrap {
    padding: 14px;
    border-radius: 26px;
  }

  .tokodev-404-nav {
    padding: 0 4px;
  }

  .tokodev-404-nav-links {
    display: none;
  }

  .tokodev-404-grid {
    padding: 16px 4px 12px;
  }

  .tokodev-404-badge {
    font-size: 10.5px !important;
  }

  .tokodev-404-copy h1 {
    font-size: clamp(34px, 11vw, 46px) !important;
    line-height: 1.1 !important;
  }

  .tokodev-404-copy p {
    font-size: 15px !important;
    line-height: 1.7 !important;
  }

  .tokodev-404-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .tokodev-404-btn {
    width: 100%;
  }

  .tokodev-404-visual {
    min-height: 360px;
  }

  .tokodev-404-number > span {
    font-size: 82px;
  }

  .tokodev-404-number > div {
    width: 76px;
    height: 76px;
    border-radius: 24px;
  }

  .tokodev-404-number img {
    width: 42px;
    height: 42px;
  }

  .tokodev-404-terminal {
    width: 100%;
    margin-top: 126px;
  }

  .tokodev-404-chip {
    display: none;
  }
}.td-home-section-more {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 46px !important;
}.td-home-section-more-btn {
  all: unset !important;
  box-sizing: border-box !important;

  min-height: 46px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: #ffffff !important;
  color: #061a33 !important;
  border: 1px solid rgba(0, 107, 255, 0.10) !important;
  box-shadow: 0 12px 28px rgba(4, 42, 91, 0.08) !important;

  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  cursor: pointer !important;

  transition:
    transform 0.22s ease,
    color 0.22s ease,
    background-color 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease !important;
}.td-home-section-more-btn:hover {
  background: #f3f8ff !important;
  color: #006bff !important;
  border-color: rgba(0, 107, 255, 0.18) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 36px rgba(0, 107, 255, 0.14) !important;
}.td-portfolio-load-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  margin-top: 46px !important;
}.td-portfolio-load-btn {
  all: unset !important;
  box-sizing: border-box !important;

  min-height: 46px !important;
  padding: 0 22px !important;
  border-radius: 999px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  cursor: pointer !important;

  transition:
    transform 0.22s ease,
    color 0.22s ease,
    background-color 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease !important;
}.td-portfolio-load-btn-primary {
  background: #ffffff !important;
  color: #061a33 !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12) !important;
}.td-portfolio-load-btn-primary:hover {
  background: #f3f8ff !important;
  color: #006bff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 36px rgba(0, 107, 255, 0.14) !important;
}.td-portfolio-load-btn-secondary {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  box-shadow: none !important;
}.td-portfolio-load-btn-secondary:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  transform: translateY(-2px) !important;
}@media (max-width: 767px) {
  .td-home-section-more {
    margin-top: 36px !important;
  }

  .td-home-section-more-btn,
  .td-portfolio-load-btn {
    width: 100% !important;
    min-height: 46px !important;
  }

  .td-portfolio-load-actions {
    gap: 10px !important;
    margin-top: 36px !important;
  }
}

/* ================================
   NEWS DETAIL PAGE
================================ */
.tokodev-news-detail {
  padding: 146px 0 108px;
}
.tokodev-news-detail .container {
  max-width: 920px;
}
.tokodev-news-detail-back {
  min-height: 42px;
  padding: 0 16px;
  margin-bottom: 34px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #ffffff;
  color: var(--td-ink, #061a33) !important;
  border: 1px solid rgba(0, 107, 255, 0.10);
  box-shadow: 0 12px 30px rgba(4, 42, 91, 0.06);
  font-size: 14px !important;
  font-weight: 500 !important;
}
.tokodev-news-detail-back:hover {
  color: var(--td-primary, #006bff) !important;
  transform: translateY(-2px);
}
.tokodev-news-detail-head {
  margin-bottom: 38px;
}
.tokodev-news-detail-head h1 {
  margin: 22px 0 20px !important;
  color: var(--td-ink, #061a33) !important;
  font-size: clamp(42px, 5vw, 72px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.055em !important;
  font-weight: 700 !important;
}
.tokodev-news-detail-head p {
  max-width: 760px;
  margin: 0 !important;
  color: #53687f !important;
  font-size: 18px !important;
  line-height: 1.75 !important;
}
.tokodev-news-detail-cover {
  margin-bottom: 28px;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(0, 107, 255, 0.08);
  box-shadow: 0 24px 70px rgba(4, 42, 91, 0.08);
}
.tokodev-news-detail-cover img {
  width: 100%;
  max-height: 430px;
  object-fit: cover;
  object-position: center;
}
.tokodev-news-detail-body {
  padding: 42px;
  border-radius: 30px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 107, 255, 0.08);
  box-shadow: 0 24px 70px rgba(4, 42, 91, 0.08);
}
.tokodev-news-detail-body p {
  margin: 0 0 24px !important;
  color: #2e4057 !important;
  font-size: 18px !important;
  line-height: 1.9 !important;
  font-weight: 400 !important;
}
.tokodev-news-detail-body p:last-child {
  margin-bottom: 0 !important;
}
.tokodev-news-detail-cta {
  margin-top: 34px;
  padding: 34px;
  border-radius: 30px;
  background: radial-gradient(circle at 90% 0%, rgba(28, 182, 255, 0.18), transparent 30%), linear-gradient(135deg, #061b34, #07162b);
  border: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow: 0 24px 70px rgba(4, 42, 91, 0.14);
}
.tokodev-news-detail-cta h2 {
  margin: 0 0 12px !important;
  color: #ffffff !important;
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.045em !important;
  font-weight: 600 !important;
}
.tokodev-news-detail-cta p {
  max-width: 640px;
  margin: 0 0 24px !important;
  color: rgba(255, 255, 255, 0.70) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}
.tokodev-news-detail-cta a {
  min-height: 48px;
  padding: 0 20px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #25d366;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
.tokodev-news-detail-cta a:hover {
  background: #1fbe5b;
  color: #ffffff !important;
  transform: translateY(-2px);
}
@media (max-width: 767px) {
  .tokodev-news-detail {
    padding: 120px 0 76px;
  }
  .tokodev-news-detail-head h1 {
    font-size: clamp(34px, 10vw, 46px) !important;
    line-height: 1.12 !important;
  }
  .tokodev-news-detail-head p,
  .tokodev-news-detail-body p {
    font-size: 16px !important;
    line-height: 1.8 !important;
  }
  .tokodev-news-detail-body,
  .tokodev-news-detail-cta {
    padding: 26px;
    border-radius: 24px;
  }
  .tokodev-news-detail-cta a {
    width: 100%;
  }
}
/* ================================
   FINAL UPDATE: lighter labels + media upload rendering
================================ */
.tokodev-project-meta,
.tokodev-portfolio-mini-content > span,
.tokodev-portfolio-modal-meta,
.tokodev-news-card span,
.tokodev-home-news-card span {
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.tokodev-news-card h2,
.tokodev-home-news-card h3 {
  font-weight: 560 !important;
}

.tokodev-news-card a,
.tokodev-home-news-card a,
.tokodev-portfolio-modal-wa {
  font-weight: 500 !important;
}

.tokodev-portfolio-modal-info strong {
  font-weight: 500 !important;
}

.tokodev-home-news-media,
.tokodev-news-card-media {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 168px;
  margin-bottom: 20px;
  border-radius: 20px;
  overflow: hidden;
  background: #eef6ff;
  border: 1px solid rgba(0, 107, 255, 0.08);
}

.tokodev-home-news-media img,
.tokodev-home-news-media video,
.tokodev-news-card-media img,
.tokodev-news-card-media video,
.tokodev-news-detail-cover img,
.tokodev-news-detail-cover video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

.tokodev-news-detail-cover {
  height: min(56vw, 520px);
  margin: 0 0 32px;
  border-radius: 30px;
  overflow: hidden;
  background: #eef6ff;
  border: 1px solid rgba(0, 107, 255, 0.08);
  box-shadow: 0 24px 70px rgba(4, 42, 91, 0.08);
}

.tokodev-admin-top-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.tokodev-admin-ghost-link {
  min-height: 38px;
  padding: 0 14px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #ffffff;
  color: #061a33 !important;
  border: 1px solid rgba(0, 107, 255, 0.12);
  box-shadow: 0 10px 24px rgba(4, 42, 91, 0.05);
  font-size: 13px !important;
  font-weight: 500 !important;
}

.tokodev-admin-ghost-link:hover {
  color: #006bff !important;
  transform: translateY(-2px);
}

.tokodev-admin-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.tokodev-admin-form input[type="file"] {
  min-height: 54px;
  padding: 12px 14px;
}

.tokodev-admin-media-preview {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  background: #f7fbff;
  border: 1px solid rgba(0, 107, 255, 0.10);
}

.tokodev-admin-media-preview span {
  color: #53687f !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.tokodev-admin-media-preview img,
.tokodev-admin-media-preview video {
  width: 100%;
  max-height: 260px;
  object-fit: cover;
  border-radius: 14px;
  background: #eef6ff;
}

@media (max-width: 767px) {
  .tokodev-home-news-media,
  .tokodev-news-card-media {
    height: 180px;
  }

  .tokodev-news-detail-cover {
    height: 240px;
    border-radius: 24px;
  }

  .tokodev-admin-form-grid {
    grid-template-columns: 1fr;
  }

  .tokodev-admin-top-actions {
    justify-content: flex-start;
  }
}

  /* ================================
   NEWS DETAIL MEDIA - NO BACKGROUND
   Gambar/video tampil natural tanpa box kosong
================================ */

.tokodev-news-detail-cover,
.tokodev-news-detail-media {
  width: fit-content !important;
  max-width: 100% !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  margin: 32px auto 38px !important;
  padding: 0 !important;

  display: block !important;
  overflow: hidden !important;
  line-height: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 24px !important;
}

.tokodev-news-detail-cover img,
.tokodev-news-detail-media img,
.tokodev-news-detail-cover video,
.tokodev-news-detail-media video {
  width: auto !important;
  max-width: 100% !important;

  height: auto !important;
  max-height: 300px !important;
  min-height: 0 !important;

  display: block !important;

  object-fit: contain !important;
  object-position: center center !important;

  border-radius: 24px !important;
  background: transparent !important;
  box-shadow: 0 18px 48px rgba(4, 42, 91, 0.10) !important;
}

.tokodev-news-detail-cover video,
.tokodev-news-detail-media video {
  background: #000 !important;
}

/* Matikan pseudo/background lama */
.tokodev-news-detail-cover::before,
.tokodev-news-detail-cover::after,
.tokodev-news-detail-media::before,
.tokodev-news-detail-media::after {
  content: none !important;
  display: none !important;
}

/* Mobile */
@media (max-width: 767px) {
  .tokodev-news-detail-cover,
  .tokodev-news-detail-media {
    width: 100% !important;
    margin: 26px auto 30px !important;
    border-radius: 20px !important;
  }

  .tokodev-news-detail-cover img,
  .tokodev-news-detail-media img,
  .tokodev-news-detail-cover video,
  .tokodev-news-detail-media video {
    width: 100% !important;
    max-height: 300px !important;
    border-radius: 20px !important;
  }
}

/* ================================
   NEWS DETAIL CONTENT CARD
   Background putih full dari excerpt sampai isi artikel
================================ */

.tokodev-news-detail-content-card {
  width: 100% !important;
  margin: 0 auto 38px !important;
  padding: 34px 36px 38px !important;

  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(0, 107, 255, 0.08) !important;
  border-radius: 30px !important;
  box-shadow: 0 22px 64px rgba(4, 42, 91, 0.08) !important;
}

.tokodev-news-detail-excerpt {
  margin: 0 0 30px !important;
  color: #53687f !important;

  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.85 !important;
  font-weight: 400 !important;
}

/* Media tetap natural, tidak punya background sendiri */
.tokodev-news-detail-content-card .tokodev-news-detail-media {
  width: fit-content !important;
  max-width: 100% !important;

  margin: 0 auto 30px !important;
  padding: 0 !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.tokodev-news-detail-content-card .tokodev-news-detail-media img,
.tokodev-news-detail-content-card .tokodev-news-detail-media video {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 420px !important;

  display: block !important;
  object-fit: contain !important;
  object-position: center !important;

  border-radius: 20px !important;
  box-shadow: 0 16px 42px rgba(4, 42, 91, 0.10) !important;
}

/* Body artikel sekarang tidak perlu card putih lagi */
.tokodev-news-detail-content-card .tokodev-news-detail-body {
  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.tokodev-news-detail-content-card .tokodev-news-detail-body p {
  margin: 0 0 22px !important;
  color: #2e4057 !important;

  font-family: var(--tp-ff-inter), Inter, Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.9 !important;
  font-weight: 400 !important;
}

.tokodev-news-detail-content-card .tokodev-news-detail-body p:last-child {
  margin-bottom: 0 !important;
}

/* Mobile */
@media (max-width: 767px) {
  .tokodev-news-detail-content-card {
    padding: 24px 20px 28px !important;
    border-radius: 24px !important;
  }

  .tokodev-news-detail-excerpt {
    margin-bottom: 24px !important;
    font-size: 15.5px !important;
    line-height: 1.75 !important;
  }

  .tokodev-news-detail-content-card .tokodev-news-detail-media {
    width: 100% !important;
    margin-bottom: 24px !important;
  }

  .tokodev-news-detail-content-card .tokodev-news-detail-media img,
  .tokodev-news-detail-content-card .tokodev-news-detail-media video {
    width: 100% !important;
    max-height: 280px !important;
    border-radius: 18px !important;
  }

  .tokodev-news-detail-content-card .tokodev-news-detail-body p {
    font-size: 15.5px !important;
    line-height: 1.8 !important;
  }
}

/* ================================
   SUBPAGE MOBILE DRAWER
   Untuk Portfolio / Insight / Detail Page
================================ */

.tokodev-subnav-trigger {
  display: none !important;
  width: 46px !important;
  height: 44px !important;
  min-width: 46px !important;
  padding: 0 !important;

  align-items: center !important;
  justify-content: center !important;

  border-radius: 17px !important;
  border: 1px solid rgba(0, 107, 255, 0.14) !important;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 248, 255, 0.82)) !important;
  color: var(--td-primary, #006bff) !important;

  box-shadow: 0 10px 24px rgba(4, 42, 91, 0.08) !important;
}

.tokodev-subnav-trigger:hover {
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--td-primary, #006bff), var(--td-accent, #00a7ff)) !important;
  transform: translateY(-1px);
}

.tokodev-subnav-drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 2490;

  background: rgba(3, 20, 38, 0.48);
  backdrop-filter: blur(4px);

  opacity: 0;
  visibility: hidden;

  transition: opacity 0.28s ease, visibility 0.28s ease;
}

.tokodev-subnav-drawer-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.tokodev-subnav-drawer {
  position: fixed;
  top: 12px;
  right: 12px;
  bottom: 12px;

  width: min(390px, calc(100vw - 24px));
  z-index: 2500;

  padding: 18px;
  border-radius: 28px;

  background:
    radial-gradient(circle at 100% 0%, rgba(0, 167, 255, 0.14), transparent 34%),
    radial-gradient(circle at 0% 100%, rgba(0, 107, 255, 0.12), transparent 30%),
    rgba(255, 255, 255, 0.97);

  border: 1px solid rgba(0, 107, 255, 0.12);
  box-shadow:
    -22px 24px 80px rgba(4, 42, 91, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);

  transform: translateX(calc(100% + 24px));
  transition: transform 0.36s cubic-bezier(0.22, 0.61, 0.36, 1);

  overflow-y: auto;
}

.tokodev-subnav-drawer.is-open {
  transform: translateX(0);
}

.tokodev-subnav-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.tokodev-subnav-drawer-close {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;

  border: 0 !important;
  border-radius: 999px !important;

  background: #ffffff !important;
  color: var(--td-ink, #061a33) !important;

  font-size: 24px !important;
  line-height: 1 !important;

  box-shadow: 0 10px 24px rgba(4, 42, 91, 0.08);
}

.tokodev-subnav-drawer-close:hover {
  background: var(--td-primary, #006bff) !important;
  color: #ffffff !important;
  transform: rotate(90deg);
}

.tokodev-subnav-drawer-hero {
  position: relative;
  padding: 20px;
  margin-bottom: 16px;

  border-radius: 24px;
  overflow: hidden;

  background:
    radial-gradient(circle at 90% 10%, rgba(46, 215, 255, 0.24), transparent 32%),
    linear-gradient(135deg, var(--td-navy, #071b3d), var(--td-primary-2, #004ee6));

  border: 1px solid rgba(255, 255, 255, 0.10);
}

.tokodev-subnav-drawer-hero span {
  display: inline-flex;
  margin-bottom: 12px;

  color: var(--td-cyan, #2ed7ff) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
  font-weight: 600 !important;
}

.tokodev-subnav-drawer-hero h3 {
  max-width: 285px;
  margin: 0 0 10px !important;

  color: #ffffff !important;
  font-size: 24px !important;
  line-height: 1.14 !important;
  letter-spacing: -0.045em !important;
  font-weight: 600 !important;
}

.tokodev-subnav-drawer-hero p {
  max-width: 292px;
  margin: 0 !important;

  color: rgba(255, 255, 255, 0.74) !important;
  font-size: 13.5px !important;
  line-height: 1.65 !important;
  font-weight: 400 !important;
}

.tokodev-subnav-drawer-menu {
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
}

.tokodev-subnav-drawer-menu a {
  position: relative;

  min-height: 56px;
  padding: 0 18px;

  display: flex !important;
  align-items: center;

  border-radius: 18px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(0, 107, 255, 0.10);

  color: var(--td-ink, #061a33) !important;

  box-shadow: 0 10px 24px rgba(4, 42, 91, 0.035);

  transition:
    transform 0.28s ease,
    border-color 0.28s ease,
    background-color 0.28s ease,
    box-shadow 0.28s ease;
}

.tokodev-subnav-drawer-menu a strong {
  color: var(--td-ink, #061a33) !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

.tokodev-subnav-drawer-menu a:hover {
  background: #ffffff;
  border-color: rgba(0, 107, 255, 0.22);
  transform: translateX(6px);
  box-shadow: 0 16px 36px rgba(4, 42, 91, 0.075);
}

.tokodev-subnav-drawer-menu a:hover strong {
  color: var(--td-primary, #006bff) !important;
}

.tokodev-subnav-drawer-cta {
  padding: 12px !important;
  border-radius: 18px !important;

  background:
    radial-gradient(circle at 92% 10%, rgba(37, 211, 102, 0.16), transparent 34%),
    linear-gradient(135deg, rgba(37, 211, 102, 0.10), rgba(0, 166, 255, 0.08)),
    #eefdff !important;

  border: 1px solid rgba(0, 166, 255, 0.10) !important;
}

.tokodev-subnav-drawer-cta p {
  margin: 0 0 10px !important;

  color: var(--td-ink, #061a33) !important;
  font-size: 12.5px !important;
  line-height: 1.45 !important;
  font-weight: 500 !important;
}

.tokodev-subnav-drawer-cta a {
  min-height: 40px !important;
  width: 100% !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  border-radius: 999px !important;
  background: #25d366 !important;
  color: #ffffff !important;

  font-size: 12.5px !important;
  line-height: 1 !important;
  font-weight: 500 !important;

  box-shadow: 0 12px 24px rgba(37, 211, 102, 0.22) !important;
}

.tokodev-subnav-drawer-cta a:hover {
  background: #1fbe5b !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

/* Mobile behavior */
@media (max-width: 991px) {
  .tokodev-subnav-inner {
    grid-template-columns: 1fr 46px !important;
    gap: 12px !important;
  }

  .tokodev-subnav-menu {
    display: none !important;
  }

  .tokodev-subnav-trigger {
    display: inline-flex !important;
  }
}

/* Desktop */
@media (min-width: 992px) {
  .tokodev-subnav-trigger {
    display: none !important;
  }

  .tokodev-subnav-drawer,
  .tokodev-subnav-drawer-overlay {
    display: none !important;
  }
}

/* Portfolio modal fix: CTA WA always visible */
.tokodev-portfolio-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(3, 12, 24, 0.72);
  backdrop-filter: blur(14px);
}

.tokodev-portfolio-modal-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  width: min(1120px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: #071a16;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.35);
}

.tokodev-portfolio-modal-image {
  min-height: 420px;
  max-height: calc(100vh - 48px);
  overflow: auto;
  background: #eaf3ff;
}

.tokodev-portfolio-modal-image img {
  display: block;
  width: 100%;
  height: auto;
  min-height: 100%;
  object-fit: cover;
}

.tokodev-portfolio-modal-body {
  display: flex;
  min-height: 0;
  max-height: calc(100vh - 48px);
  flex-direction: column;
  overflow-y: auto;
  padding: 46px 34px 34px;
}

.tokodev-portfolio-modal-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 22px;
}

.tokodev-portfolio-modal-wa {
  display: inline-flex !important;
  width: 100%;
  min-height: 56px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: auto;
  border-radius: 999px;
  background: #25d366;
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 650;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: 0 18px 36px rgba(37, 211, 102, 0.22);
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.tokodev-portfolio-modal-wa:hover {
  transform: translateY(-2px);
  background: #20bf5b;
  color: #ffffff !important;
  box-shadow: 0 22px 44px rgba(37, 211, 102, 0.3);
}

.tokodev-portfolio-modal-wa svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .tokodev-portfolio-modal {
    align-items: flex-start;
    padding: 14px;
    overflow-y: auto;
  }

  .tokodev-portfolio-modal-card {
    grid-template-columns: 1fr;
    width: 100%;
    max-height: none;
  }

  .tokodev-portfolio-modal-image {
    min-height: 260px;
    max-height: 420px;
  }

  .tokodev-portfolio-modal-body {
    max-height: none;
    padding: 28px 22px 24px;
  }

  .tokodev-portfolio-modal-wa {
    margin-top: 24px;
  }
}