/* ==========================================================================
   Digisoft home (dark one-pager design) - plain static page, no client
   framework. Theme tokens + motion layer on top of the design's own markup.
   ========================================================================== */
:root[data-theme="blue"]    { --dk-p:#0A85C7; --dk-strong:#0B6BA3; --dk-soft:#E6F3FA; --dk-onp:#FFFFFF; --dk-ondark:#5BBDF0; --dk-onlight:#0B6BA3; }
:root[data-theme="maroon"]  { --dk-p:#7B1E2B; --dk-strong:#5E1420; --dk-soft:#F6E9EB; --dk-onp:#FFFFFF; --dk-ondark:#E8919D; --dk-onlight:#7B1E2B; }
:root[data-theme="amber"]   { --dk-p:#D99A00; --dk-strong:#B37E00; --dk-soft:#FBF3DC; --dk-onp:#0B1220; --dk-ondark:#F2C14E; --dk-onlight:#8A6100; }
:root[data-theme="emerald"] { --dk-p:#0F8A5F; --dk-strong:#0A6B49; --dk-soft:#E4F4EE; --dk-onp:#FFFFFF; --dk-ondark:#4FD1A1; --dk-onlight:#0A6B49; }
:root { --dk-ease-out: cubic-bezier(0.16, 1, 0.3, 1); --dk-ease-in: cubic-bezier(0.7, 0, 0.84, 0); --dk-reveal: 520ms; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
.grecaptcha-badge { visibility: hidden !important; }
body {
  margin: 0;
  background: #07090D;
  color: #F2F4F7;
  font-family: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
input, textarea, button { font: inherit; }
h1, h2, h3, h4 { text-wrap: balance; }
p { text-wrap: pretty; }
img { max-width: 100%; display: block; }

.dk-skip {
  position: absolute; left: 16px; top: -64px; z-index: 2000;
  padding: 10px 16px; border-radius: 10px;
  background: var(--dk-p); color: var(--dk-onp);
  font-weight: 600; text-decoration: none;
  transition: top 200ms var(--dk-ease-out);
}
.dk-skip:focus { top: 16px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid #F2F4F7; outline-offset: 2px;
}

@media (max-width: 575px) { .dk-scroll, .dk-notch { display: none; } }

/* Reveals ------------------------------------------------------------------- */
.dk-reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity var(--dk-reveal) var(--dk-ease-out), transform var(--dk-reveal) var(--dk-ease-out);
  transition-delay: calc(var(--dk-wi, 0) * 40ms + var(--dk-base, 0ms));
}
.dk-reveal.dk-in { opacity: 1; transform: none; }
.dk-reveal--scale { transform: scale(0.97); }
.dk-reveal--scale.dk-in { transform: none; }
.dk-group > * {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity var(--dk-reveal) var(--dk-ease-out), transform var(--dk-reveal) var(--dk-ease-out);
  transition-delay: calc(var(--dk-wi, 0) * 45ms + var(--dk-base, 0ms));
}
.dk-group.dk-in > * { opacity: 1; transform: none; }
.dk-group > :nth-child(1)  { --dk-wi: 0; }  .dk-group > :nth-child(2)  { --dk-wi: 1; }
.dk-group > :nth-child(3)  { --dk-wi: 2; }  .dk-group > :nth-child(4)  { --dk-wi: 3; }
.dk-group > :nth-child(5)  { --dk-wi: 4; }  .dk-group > :nth-child(6)  { --dk-wi: 5; }
.dk-group > :nth-child(7)  { --dk-wi: 6; }  .dk-group > :nth-child(8)  { --dk-wi: 7; }
.dk-group > :nth-child(9)  { --dk-wi: 8; }  .dk-group > :nth-child(10) { --dk-wi: 9; }
.dk-group > :nth-child(11) { --dk-wi: 10; } .dk-group > :nth-child(12) { --dk-wi: 11; }

/* Word masks (hero lines + section headings) -------------------------------- */
.dk-w { display: inline-block; overflow: hidden; vertical-align: top; padding: 0.08em 0.06em 0.16em; margin: -0.08em -0.06em -0.16em; }
.dk-w__i {
  display: inline-block;
  transform: translateY(115%);
  transition: transform 640ms var(--dk-ease-out);
  transition-delay: calc(var(--dk-base, 0ms) + var(--dk-wi, 0) * 55ms);
}
.dk-w:nth-child(1) { --dk-wi: 0; } .dk-w:nth-child(2) { --dk-wi: 1; } .dk-w:nth-child(3) { --dk-wi: 2; }
.dk-w:nth-child(4) { --dk-wi: 3; } .dk-w:nth-child(5) { --dk-wi: 4; } .dk-w:nth-child(6) { --dk-wi: 5; }
.dk-w:nth-child(7) { --dk-wi: 6; } .dk-w:nth-child(8) { --dk-wi: 7; } .dk-w:nth-child(9) { --dk-wi: 8; }
.dk-in .dk-w__i { transform: none; }

/* Hero choreography ----------------------------------------------------------- */
#top h1 > span:nth-child(1) { --dk-base: 120ms; }
#top h1 > span:nth-child(2) { --dk-base: 340ms; }
#top .dk-hero-group > * { --dk-base: 560ms; }
#top header.dk-group > * { --dk-base: 60ms; }
#top .dk-scroll, #top .dk-notch {
  opacity: 0;
  transition: opacity 500ms ease 1100ms, transform 500ms var(--dk-ease-out) 1100ms;
}
#top .dk-scroll { transform: translate(-16px, -50%); }
#top .dk-notch { transform: translateY(12px); }
#top.dk-in .dk-scroll { opacity: 1; transform: translateY(-50%); }
#top.dk-in .dk-notch { opacity: 1; transform: none; }
#top { outline: none; }

/* Interaction ------------------------------------------------------------------- */
a[style*="border-radius: 999px"], button[style*="border-radius: 999px"] {
  transition: transform 100ms ease-out, filter 200ms ease, opacity 200ms ease;
}
a[style*="border-radius: 999px"]:hover, button[style*="border-radius: 999px"]:hover { filter: brightness(1.08); }
a[style*="border-radius: 999px"]:active, button[style*="border-radius: 999px"]:active { transform: scale(0.97); }
nav[aria-label="Main"] a { transition: background-color 200ms ease; }
nav[aria-label="Main"] a:hover { background: rgba(255, 255, 255, 0.14) !important; }
a[href$=".html"][style*="border-radius"], a[href="#contact"][style*="min-height: 254px"], a[href="#contact"][style*="padding: 28px"] {
  transition: transform 220ms var(--dk-ease-out), box-shadow 220ms ease;
}
a[href$=".html"][style*="border-radius"]:hover, a[href="#contact"][style*="min-height: 254px"]:hover, a[href="#contact"][style*="padding: 28px"]:hover {
  transform: translateY(-4px);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08), 0 16px 40px rgba(0, 0, 0, 0.18);
}
a[href$=".html"][style*="border-radius"] svg:last-child { transition: transform 220ms var(--dk-ease-out); }
a[href$=".html"][style*="border-radius"]:hover svg:last-child { transform: translateX(3px); }

/* Magnetic buttons (fine pointers only) */
@media (pointer: fine) {
  .dk-magnet { transform: translate3d(var(--dk-tx, 0px), var(--dk-ty, 0px), 0); transition: transform 450ms cubic-bezier(0.22, 1.35, 0.36, 1), filter 200ms ease; }
  .dk-magnet.is-magnet { transition: transform 160ms ease-out, filter 200ms ease; }
  .dk-magnet:active { transform: translate3d(var(--dk-tx, 0px), var(--dk-ty, 0px), 0) scale(0.97); }
}

/* Theme switcher pill ------------------------------------------------------------- */
.dk-themes { display: inline-flex; align-items: center; gap: 2px; padding: 3px; margin-left: 6px; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; background: rgba(255, 255, 255, 0.04); }
.dk-themes button { appearance: none; border: 0; background: transparent; cursor: pointer; width: 30px; height: 30px; border-radius: 999px; padding: 0; display: inline-flex; align-items: center; justify-content: center; transition: transform 100ms ease-out; }
.dk-themes button::before { content: ""; width: 14px; height: 14px; border-radius: 999px; background: currentColor; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25) inset; transition: transform 200ms var(--dk-ease-out), box-shadow 200ms ease; }
.dk-themes button:hover::before { transform: scale(1.15); }
.dk-themes button:active { transform: scale(0.92); }
.dk-themes button[aria-checked="true"]::before { box-shadow: 0 0 0 2px #07090D, 0 0 0 4px currentColor; }
.dk-themes button[data-dk-theme="blue"] { color: #0A85C7; }
.dk-themes button[data-dk-theme="maroon"] { color: #7B1E2B; }
.dk-themes button[data-dk-theme="amber"] { color: #D99A00; }
.dk-themes button[data-dk-theme="emerald"] { color: #0F8A5F; }
.dk-themes button:focus-visible { outline: 2px solid #F2F4F7; outline-offset: 1px; }
@media (pointer: coarse) { .dk-themes button { width: 38px; height: 38px; } }

.dk-wipe { position: fixed; inset: 0; z-index: 2147483000; pointer-events: none; will-change: clip-path, opacity; }

/* Sector carousel (vanilla JS swaps classes/data, CSS owns the look) --------------- */
.dk-sbtn { border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.02); color: rgb(196, 203, 214); font-weight: 500; transition: border-color 200ms ease, background-color 200ms ease, color 200ms ease; }
.dk-sbtn[aria-pressed="true"] { border-color: var(--dk-p); background: rgba(255, 255, 255, 0.08); color: rgb(242, 244, 247); font-weight: 600; }
.dk-sbtn:hover { border-color: rgba(255, 255, 255, 0.3); }
.dk-sbtn:active { transform: scale(0.99); }
.dk-sbtn__tile { background: rgba(255, 255, 255, 0.06); transition: background-color 200ms ease; }
.dk-sbtn[aria-pressed="true"] .dk-sbtn__tile { background: var(--dk-p); }
.dk-sbtn__icon { stroke: var(--dk-ondark); transition: stroke 200ms ease; }
.dk-sbtn[aria-pressed="true"] .dk-sbtn__icon { stroke: var(--dk-onp); }
.dk-sbtn__chev { stroke: transparent; transition: stroke 200ms ease; }
.dk-sbtn[aria-pressed="true"] .dk-sbtn__chev { stroke: var(--dk-ondark); }
.dk-spanel__img, .dk-spanel__name, .dk-spanel__desc, .dk-spanel__ctaname { transition: opacity 220ms ease; }
.dk-spanel--swapping .dk-spanel__img, .dk-spanel--swapping .dk-spanel__name, .dk-spanel--swapping .dk-spanel__desc, .dk-spanel--swapping .dk-spanel__ctaname { opacity: 0; }

/* Hero stat row: never let an odd item orphan onto its own grid row. Snap
   straight from 1 column to 3, skip the in-between 2-column state entirely. */
.dk-stats-row { grid-template-columns: 1fr !important; }
@media (min-width: 560px) { .dk-stats-row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }

/* Blog category filter ------------------------------------------------------------------ */
.dk-catbtn { border: 1px solid rgba(255, 255, 255, 0.22); background: transparent; color: #F2F4F7; transition: background-color 200ms ease, border-color 200ms ease, color 200ms ease; }
.dk-catbtn[aria-pressed="true"] { border-color: var(--dk-p); background: var(--dk-p); color: #FFFFFF; }
.dk-catbtn:hover { border-color: rgba(255, 255, 255, 0.4); }
.dk-catbtn:active { transform: scale(0.97); }

/* Form status ------------------------------------------------------------------------ */
.dk-status { margin-top: 4px; padding: 12px 16px; border-radius: 12px; font-size: 15px; line-height: 1.5; }
.dk-status--ok { background: rgba(79, 209, 161, 0.16); color: #C9F2E2; }
.dk-status--err { background: rgba(255, 99, 99, 0.16); color: #FFD6D6; }
/* Forms on a light card (e.g. the Contact page) need darker, higher-contrast status text. */
.dk-form-light .dk-status--ok { background: rgba(15, 138, 95, 0.12); color: #0A6B49; }
.dk-form-light .dk-status--err { background: rgba(220, 38, 38, 0.10); color: #B42318; }

/* Page-load loader ---------------------------------------------------------------------- */
.dk-loader { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; background: rgba(7,9,13,0.6); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); transition: opacity 260ms var(--dk-ease-out), visibility 260ms var(--dk-ease-out); }
.dk-loader__mark { width: 72px; height: 72px; animation: dk-loader-pulse 1.15s var(--dk-ease-out) infinite; }
.dk-loader--out { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes dk-loader-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(0.9); opacity: 0.72; } }

/* Reduced motion ------------------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .dk-reveal, .dk-group > *, .dk-w__i, #top .dk-scroll, #top .dk-notch { opacity: 1 !important; transform: none !important; transition: none !important; }
  .dk-magnet, a[href$=".html"][style*="border-radius"] { transform: none !important; transition: none !important; }
  .dk-wipe { display: none !important; }
  .dk-spanel__img, .dk-spanel__name, .dk-spanel__desc, .dk-spanel__ctaname { transition: none !important; }
  .dk-loader__mark { animation: none !important; }
}
