:root {
  --perfection-line: color-mix(in srgb, var(--green, #4dffa7) 30%, transparent);
  --perfection-panel: color-mix(in srgb, #07110c 82%, transparent);
}

html { scroll-padding-top: 7.5rem; }
body { overflow-x: clip; }
main section { content-visibility: auto; contain-intrinsic-size: 1px 720px; }

.site-scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 9999;
  height: 3px;
  pointer-events: none;
  background: rgba(255,255,255,.025);
}
.site-scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #0aa866, #4dffa7 55%, #dfff9a);
  box-shadow: 0 0 22px rgba(77,255,167,.5);
  will-change: transform;
}
[dir="rtl"] .site-scroll-progress span { transform-origin: right center; }

.back-to-top {
  position: fixed;
  z-index: 100;
  right: max(1rem, env(safe-area-inset-right));
  bottom: max(1rem, env(safe-area-inset-bottom));
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid var(--perfection-line);
  border-radius: 999px;
  color: #dfff9a;
  background: rgba(5, 15, 10, .82);
  backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 18px 50px rgba(0,0,0,.35), inset 0 1px rgba(255,255,255,.08);
  opacity: 0;
  visibility: hidden;
  transform: translateY(.75rem) scale(.9);
  transition: opacity .25s ease, transform .25s ease, visibility .25s;
  cursor: pointer;
}
.back-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.back-to-top:hover { border-color: #4dffa7; transform: translateY(-2px); }
[dir="rtl"] .back-to-top { right: auto; left: max(1rem, env(safe-area-inset-left)); }

.site-header {
  border-bottom-color: rgba(77,255,167,.08);
  box-shadow: 0 16px 50px rgba(0,0,0,.18);
}
.nav-link { position: relative; }
.nav-link::after {
  content: "";
  position: absolute;
  inset: auto .2rem -.5rem;
  height: 1px;
  transform: scaleX(0);
  background: linear-gradient(90deg, transparent, #4dffa7, transparent);
  transition: transform .22s ease;
}
.nav-link:hover::after,
.nav-link[aria-current="page"]::after { transform: scaleX(1); }

.page-hero .wrap,
.hero-grid { position: relative; isolation: isolate; }
.page-hero .wrap::before,
.hero-grid::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(32rem, 70vw);
  aspect-ratio: 1;
  inset: -14rem auto auto -18rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(77,255,167,.11), transparent 68%);
  filter: blur(10px);
  pointer-events: none;
}
[dir="rtl"] .page-hero .wrap::before,
[dir="rtl"] .hero-grid::before { left: auto; right: -18rem; }

.quality-system { position: relative; }
.quality-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.quality-card {
  min-height: 15rem;
  padding: clamp(1.25rem, 2.5vw, 2rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  overflow: hidden;
}
.quality-card::before {
  content: "";
  position: absolute;
  width: 9rem;
  aspect-ratio: 1;
  right: -4rem;
  top: -4rem;
  border: 1px solid rgba(77,255,167,.14);
  border-radius: 50%;
  box-shadow: 0 0 70px rgba(77,255,167,.08);
}
[dir="rtl"] .quality-card::before { right: auto; left: -4rem; }
.quality-card > span {
  position: absolute;
  top: 1.25rem;
  left: 1.25rem;
  font: 600 .7rem/1 var(--font-mono, monospace);
  letter-spacing: .18em;
  color: #4dffa7;
}
[dir="rtl"] .quality-card > span { left: auto; right: 1.25rem; }
.quality-card h3 { margin: 0 0 .65rem; }
.quality-card p { margin: 0; opacity: .72; }

.perfection-card,
.perfection-row { position: relative; overflow: hidden; }
.perfection-card::after,
.perfection-row::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(77,255,167,.5), transparent);
  transform: scaleX(.2);
  opacity: .25;
  transition: transform .35s ease, opacity .35s ease;
}
.perfection-card:hover::after,
.perfection-row:hover::after { transform: scaleX(1); opacity: 1; }
.detail-card p,
.process-row p { max-width: 62ch; }

.package-matrix {
  margin-top: clamp(2rem, 6vw, 5rem);
  padding: clamp(1.25rem, 3vw, 2.25rem);
}
.section-heading.compact { margin-bottom: 1.5rem; }
.matrix-scroll { overflow: auto; border-radius: 1rem; outline: none; }
.matrix-scroll:focus-visible { box-shadow: 0 0 0 3px rgba(77,255,167,.25); }
.package-matrix table {
  width: 100%;
  min-width: 42rem;
  border-collapse: collapse;
  background: rgba(2, 8, 5, .34);
}
.package-matrix th,
.package-matrix td {
  padding: 1rem 1.1rem;
  border-bottom: 1px solid rgba(255,255,255,.07);
  text-align: center;
}
.package-matrix th:first-child { text-align: start; }
.package-matrix thead th {
  position: sticky;
  top: 0;
  color: #dfff9a;
  background: rgba(5,16,10,.95);
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.package-matrix tbody td { color: #4dffa7; font-size: 1.1rem; }
.package-matrix tbody tr:hover { background: rgba(77,255,167,.035); }

.contact-trust {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(77,255,167,.15);
}
.contact-trust p { opacity: .76; }
.text-link { color: #dfff9a; text-decoration: none; }
.text-link:hover { color: #fff; }

.reveal-ready {
  opacity: 0;
  transform: translateY(1.25rem);
  transition: opacity .65s cubic-bezier(.2,.8,.2,1), transform .65s cubic-bezier(.2,.8,.2,1);
}
.reveal-ready.is-revealed { opacity: 1; transform: none; }

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid #dfff9a;
  outline-offset: 4px;
  box-shadow: 0 0 0 5px rgba(77,255,167,.14);
}

.form-panel input,
.form-panel select,
.form-panel textarea,
.project-form input,
.project-form select,
.project-form textarea {
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.form-panel input:hover,
.form-panel select:hover,
.form-panel textarea:hover,
.project-form input:hover,
.project-form select:hover,
.project-form textarea:hover { border-color: rgba(77,255,167,.32); }
.form-panel :is(input,select,textarea):focus,
.project-form :is(input,select,textarea):focus {
  border-color: rgba(77,255,167,.72);
  background: rgba(7,20,13,.8);
}

@media (max-width: 980px) {
  .quality-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  html { scroll-padding-top: 6rem; }
  .quality-grid { grid-template-columns: 1fr; }
  .quality-card { min-height: 12rem; }
  .back-to-top { width: 2.75rem; height: 2.75rem; }
  .package-matrix { padding: 1rem; }
  .package-matrix th,
  .package-matrix td { padding: .8rem; }
}

@media (prefers-contrast: more) {
  .glass,
  .quality-card,
  .package-matrix { border-color: rgba(223,255,154,.5) !important; }
  .nav-link,
  p { color: #fff; }
}

@media (prefers-reduced-motion: reduce) {
  .site-scroll-progress span,
  .back-to-top,
  .reveal-ready,
  .perfection-card::after,
  .perfection-row::after,
  .nav-link::after { transition: none !important; }
  .reveal-ready { opacity: 1; transform: none; }
}

/* Perceived-performance correction: render information immediately and keep
   the glass identity without making scrolling depend on expensive live blur. */
main section {
  content-visibility: visible;
  contain-intrinsic-size: auto;
}

.reveal-ready,
.reveal-ready.is-revealed {
  opacity: 1;
  transform: none;
  transition: none;
}

.site-header {
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
}

.glass {
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
}

.service-card,
.detail-card,
.package-card,
.design-card,
.quality-card,
.process-row,
.package-matrix {
  background: linear-gradient(135deg, rgba(8, 24, 16, .94), rgba(10, 31, 21, .86));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.float-site {
  animation-duration: 12s;
  backdrop-filter: blur(8px) saturate(110%);
  -webkit-backdrop-filter: blur(8px) saturate(110%);
  will-change: auto;
}

@media (max-width: 980px) {
  .float-site {
    animation: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .site-header,
  .back-to-top {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
  }
}

/* WebKRON Fintech Intelligence Experience */
.intelligence-hero{padding:clamp(72px,8vw,116px) 0 74px;position:relative}
.intelligence-hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 49.8%,rgba(77,255,167,.055) 50%,transparent 50.2%),linear-gradient(rgba(77,255,167,.025) 1px,transparent 1px);background-size:100% 100%,100% 54px;mask-image:linear-gradient(to bottom,#000,transparent 92%)}
.intelligence-hero .hero-grid{position:relative;z-index:1;grid-template-columns:minmax(0,1.04fr) minmax(440px,.96fr);gap:clamp(38px,6vw,84px)}
.hero-copy{min-width:0}
.hero-scan{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin:30px 0 18px;padding:10px;border-radius:22px;background:rgba(5,22,14,.78);box-shadow:0 24px 70px rgba(0,0,0,.36),0 0 0 1px rgba(77,255,167,.07)}
.hero-scan-field{display:grid;gap:3px;min-width:0;padding:4px 8px}
.hero-scan-field>span{color:var(--cyan);font:750 9px/1.2 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}
.hero-scan-field input{width:100%;min-width:0;padding:4px 0;border:0;outline:0;color:#f6fff8;background:transparent;font-size:15px}
.hero-scan-field input::placeholder{color:#759486}
.hero-scan .button{align-self:stretch;white-space:nowrap;border-radius:16px}
.hero-scan-consent{grid-column:1/-1;display:flex;align-items:flex-start;gap:8px;padding:1px 8px 4px;color:#8eab9b;font-size:11px;line-height:1.4}
.hero-scan-consent input{accent-color:var(--cyan);margin-top:2px}
.hero-scan .audit-status{grid-column:1/-1;margin:0 8px 4px}
.hero-audit-results{margin:18px 0 24px;padding:24px;border:1px solid rgba(77,255,167,.22);border-radius:24px;background:rgba(4,18,11,.88);box-shadow:0 26px 80px rgba(0,0,0,.38)}
.hero-audit-results h2{font-size:24px!important;margin:14px 0!important}
.hero-audit-results .audit-score{font-size:clamp(44px,7vw,72px)}
.hero-audit-results .audit-findings{max-height:320px;overflow:auto}
.intelligence-console{min-height:590px;isolation:isolate}
.console-aura{position:absolute;inset:7% 2% 5% 8%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(77,255,167,.25),rgba(10,168,102,.08) 42%,transparent 72%);filter:blur(14px);animation:console-breathe 7s ease-in-out infinite}
.console-frame{position:absolute;inset:6% 1% 9% 4%;overflow:hidden;border-radius:32px;background:linear-gradient(155deg,rgba(18,54,37,.86),rgba(3,13,8,.94) 68%);box-shadow:0 36px 120px rgba(0,0,0,.55),inset 0 1px rgba(255,255,255,.08)}
.console-frame::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(77,255,167,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(77,255,167,.045) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(135deg,#000,transparent 72%)}
.console-topline,.console-target,.console-foot{position:relative;display:flex;align-items:center;gap:12px}
.console-topline{justify-content:space-between;padding:17px 20px;border-bottom:1px solid rgba(211,255,229,.12);color:#83a894;font:700 9px ui-monospace,monospace;letter-spacing:.1em}
.console-topline b{color:#dfff8e}
.console-live{display:flex;align-items:center;gap:7px;color:#dfffee}
.console-live i,.console-float-two i{width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 18px var(--cyan);animation:signal-pulse 1.8s ease-out infinite}
.console-target{margin:21px 20px 0;padding:13px 15px;border:1px solid rgba(211,255,229,.11);border-radius:15px;background:rgba(255,255,255,.035)}
.console-target span{color:#06190f;background:var(--cyan);border-radius:7px;padding:4px 7px;font:800 8px ui-monospace,monospace}
.console-target strong{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#e7fff0;font:650 12px ui-monospace,monospace}
.console-target i{margin-left:auto;color:#769587;font-style:normal}
.console-grid{position:relative;display:grid;grid-template-columns:.8fr 1.2fr;gap:17px;padding:25px 20px 20px}
.console-score{display:grid;place-items:center;align-content:center;gap:12px;min-height:230px;border:1px solid rgba(211,255,229,.1);border-radius:22px;background:radial-gradient(circle at center,rgba(77,255,167,.1),transparent 66%)}
.score-ring{width:145px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;align-content:center;background:radial-gradient(circle at center,#07150d 57%,transparent 58%),conic-gradient(var(--cyan) 0 86%,rgba(211,255,229,.09) 86%);box-shadow:0 0 45px rgba(77,255,167,.12)}
.score-ring strong{font-size:45px;line-height:.9;letter-spacing:-.06em}
.score-ring span{color:#799787;font:700 10px ui-monospace,monospace}
.console-score small{color:#9ab7a7;font:700 9px ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}
.signal-stack{display:grid;gap:10px;align-content:center}
.signal-row{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center;padding:13px;border:1px solid rgba(211,255,229,.1);border-radius:14px;background:rgba(255,255,255,.035)}
.signal-row>span{color:var(--cyan);font:700 9px ui-monospace,monospace}
.signal-row p{margin:0;overflow:hidden;text-overflow:ellipsis;color:#9ab7a7;font-size:11px;white-space:nowrap}
.signal-row strong{font:800 11px ui-monospace,monospace}
.console-trace{height:70px;display:flex;align-items:end;gap:7px;margin:0 20px 20px;padding:10px 13px;border:1px solid rgba(211,255,229,.08);border-radius:14px}
.console-trace span{flex:1;min-width:5px;border-radius:999px 999px 3px 3px;background:linear-gradient(to top,rgba(10,168,102,.28),var(--cyan));animation:trace-wave 2.8s ease-in-out infinite}
.console-trace span:nth-child(1){height:24%}.console-trace span:nth-child(2){height:41%;animation-delay:-.3s}.console-trace span:nth-child(3){height:68%;animation-delay:-.6s}.console-trace span:nth-child(4){height:38%;animation-delay:-.9s}.console-trace span:nth-child(5){height:82%;animation-delay:-1.2s}.console-trace span:nth-child(6){height:56%;animation-delay:-1.5s}.console-trace span:nth-child(7){height:92%;animation-delay:-1.8s}.console-trace span:nth-child(8){height:62%;animation-delay:-2.1s}
.console-foot{justify-content:space-between;padding:14px 20px;border-top:1px solid rgba(211,255,229,.1);color:#6f8e7e;font:700 8px ui-monospace,monospace;letter-spacing:.09em}
.console-float{position:absolute;z-index:3;border:1px solid rgba(211,255,229,.18);background:rgba(8,28,18,.88);backdrop-filter:blur(18px);box-shadow:0 20px 55px rgba(0,0,0,.4)}
.console-float-one{right:-4%;top:3%;display:grid;grid-template-columns:auto 1fr;column-gap:10px;padding:13px 16px;border-radius:18px;transform:rotate(3deg)}
.console-float-one span{grid-row:1/3;color:var(--cyan);font-size:20px}.console-float-one strong{font-size:18px}.console-float-one small{color:#789787;font:700 7px ui-monospace,monospace;letter-spacing:.08em}
.console-float-two{left:-1%;bottom:4%;display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:999px;color:#ccebdd;font:700 8px ui-monospace,monospace;letter-spacing:.09em}
.intelligence-rail{border-block:1px solid rgba(211,255,229,.1);background:rgba(2,10,6,.52)}
.intelligence-rail-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.intelligence-rail article{position:relative;min-height:178px;padding:27px 25px;border-inline-end:1px solid rgba(211,255,229,.1)}
.intelligence-rail article:last-child{border-inline-end:0}
.intelligence-rail article>span{display:block;margin-bottom:32px;color:var(--cyan);font:750 10px ui-monospace,monospace}
.intelligence-rail strong{display:block;font-size:18px}
.intelligence-rail p{margin:8px 0 0;color:#86a394;font-size:12px;line-height:1.45}
@keyframes console-breathe{50%{transform:scale(1.06);opacity:.72}}
@keyframes signal-pulse{70%,100%{box-shadow:0 0 0 12px rgba(77,255,167,0)}}
@keyframes trace-wave{50%{filter:brightness(1.55);transform:scaleY(.78);transform-origin:bottom}}
@media(max-width:980px){
  .intelligence-hero .hero-grid{grid-template-columns:1fr}
  .intelligence-console{min-height:570px;width:min(620px,100%);margin:auto}
  .intelligence-rail-grid{grid-template-columns:1fr 1fr}
  .intelligence-rail article:nth-child(2){border-inline-end:0}
  .intelligence-rail article:nth-child(-n+2){border-bottom:1px solid rgba(211,255,229,.1)}
}
@media(max-width:620px){
  .hero-scan{grid-template-columns:1fr}
  .hero-scan .button{min-height:48px}
  .hero-scan-consent{grid-column:1}
  .intelligence-console{min-height:500px}
  .console-frame{inset:3% 0 7%}
  .console-grid{grid-template-columns:1fr;padding-top:16px}
  .console-score{min-height:150px}
  .score-ring{width:105px}
  .score-ring strong{font-size:34px}
  .signal-row{padding:10px}
  .console-trace{display:none}
  .console-float-one{right:-2%;top:0}
  .console-float-two{left:1%;bottom:2%}
  .intelligence-rail-grid{grid-template-columns:1fr}
  .intelligence-rail article{min-height:0;border-inline-end:0;border-bottom:1px solid rgba(211,255,229,.1)}
}
@media(prefers-reduced-motion:reduce){.console-aura,.console-live i,.console-float-two i,.console-trace span{animation:none!important}}