/* === Swiftech-Art v2: motion, theme, portfolio and contact === */
:root {
  --page-bg: #ffffff;
  --page-text: #0d1117;
  --surface: #ffffff;
  --surface-2: #f4f7fc;
  --surface-3: #eaf3ff;
  --text-muted: #646b79;
  --border-theme: #dfe5ee;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --page-bg: #080d14;
  --page-text: #f4f7fb;
  --surface: #0e151f;
  --surface-2: #111b28;
  --surface-3: #10223a;
  --text-muted: #a8b2c1;
  --border-theme: #253246;
}

body { background: var(--page-bg); color: var(--page-text); transition: background-color .35s ease, color .35s ease; }
.section > .container, .logo-marquee .marquee-track, .site-footer > .container { position: relative; z-index: 2; }

/* Animated light-blue background objects generated in JS */
.ambient-bg { position: fixed; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.ambient-item { position: absolute; left: var(--x); top: var(--y); width: var(--size); height: var(--size); transform: translate3d(0,0,0); will-change: transform; opacity: var(--opacity); }
.ambient-item i { display: block; width: 100%; height: 100%; border-radius: var(--radius, 50%); background: linear-gradient(145deg, rgba(111,190,255,.26), rgba(31,137,255,.055)); border: 1px solid rgba(76,162,255,.2); box-shadow: 0 12px 55px rgba(56,149,255,.11); animation: ambientFloat var(--duration) ease-in-out var(--delay) infinite alternate, ambientSpin calc(var(--duration) * 2.3) linear infinite; }
.ambient-item.ring i { background: transparent; border: clamp(1px, .16vw, 3px) solid rgba(84,174,255,.2); box-shadow: inset 0 0 40px rgba(58,151,255,.055), 0 20px 70px rgba(58,151,255,.09); }
.ambient-item.square i { --radius: 24%; }
.ambient-item.line { height: 3px; }
.ambient-item.line i { border-radius: 999px; background: linear-gradient(90deg, transparent, rgba(56,153,255,.36), transparent); border: 0; box-shadow: none; }
html[data-theme="dark"] .ambient-item { opacity: calc(var(--opacity) * 1.35); }
html[data-theme="dark"] .ambient-item i { background: linear-gradient(145deg, rgba(31,127,255,.16), rgba(95,187,255,.045)); border-color: rgba(84,170,255,.16); box-shadow: 0 12px 65px rgba(0,108,255,.13); }
html[data-theme="dark"] .ambient-item.ring i { background: transparent; border-color: rgba(74,164,255,.18); }
@keyframes ambientFloat { from { translate: -10px -14px; scale: .95; } to { translate: 16px 22px; scale: 1.08; } }
@keyframes ambientSpin { to { rotate: 360deg; } }

.nav-actions { display: flex; align-items: center; gap: 10px; }
.theme-toggle { position: relative; flex: 0 0 auto; width: 44px; height: 44px; border: 1px solid rgba(119,139,173,.25); border-radius: 12px; background: rgba(255,255,255,.78); color: #344156; box-shadow: 0 10px 28px rgba(24,59,115,.08); cursor: pointer; overflow: hidden; backdrop-filter: blur(14px); transition: background .25s, border-color .25s, color .25s, transform .25s; }
.theme-toggle:hover { transform: translateY(-2px); border-color: rgba(11,99,246,.38); }
.theme-icon { position: absolute; inset: 0; display: grid; place-items: center; font-size: 19px; transition: opacity .25s, transform .35s; }
.theme-icon-moon { opacity: 1; transform: rotate(0) scale(1); }
.theme-icon-sun { opacity: 0; transform: rotate(-70deg) scale(.55); }
html[data-theme="dark"] .theme-toggle { background: rgba(17,26,39,.85); color: #d8e8ff; border-color: rgba(103,155,226,.24); box-shadow: 0 10px 32px rgba(0,0,0,.24); }
html[data-theme="dark"] .theme-icon-moon { opacity: 0; transform: rotate(70deg) scale(.55); }
html[data-theme="dark"] .theme-icon-sun { opacity: 1; transform: rotate(0) scale(1); }

/* Portfolio is now a stronger proof section */
.work { padding-top: 128px; background: linear-gradient(180deg, rgba(229,242,255,.94), rgba(247,251,255,.96) 52%, rgba(255,255,255,.98)); }
.work::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 12% 10%, rgba(46,150,255,.15), transparent 25%), radial-gradient(circle at 88% 72%, rgba(7,93,239,.1), transparent 28%); pointer-events: none; }
.portfolio-heading { margin-bottom: 30px; }
.portfolio-heading h2 { max-width: 820px; }
.portfolio-proof { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin: 0 0 22px; }
.portfolio-proof > div { min-height: 112px; display: flex; flex-direction: column; justify-content: center; padding: 20px; border: 1px solid rgba(111,156,217,.2); border-radius: 16px; background: rgba(255,255,255,.76); backdrop-filter: blur(12px); box-shadow: 0 16px 42px rgba(40,93,164,.07); }
.portfolio-proof strong { color: var(--blue); font-size: 31px; line-height: 1; letter-spacing: -1.5px; }
.portfolio-proof span { margin-top: 9px; color: #526071; font-size: 11px; font-weight: 750; line-height: 1.35; }
.portfolio-note { display: flex; align-items: center; gap: 10px; margin: 0 0 26px; color: #5d6878; font-size: 12px; }
.portfolio-note span { padding: 5px 9px; border-radius: 999px; background: var(--blue); color: #fff; font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; }
.work .filter-bar { margin-top: 0; }
.work .project-preview { box-shadow: 0 28px 75px rgba(25,65,126,.16); border: 1px solid rgba(94,139,202,.15); }
.work .project-card-wide .project-preview { min-height: 675px; }
.work .project-meta { padding-top: 22px; }
.work .project-meta h3 { font-size: 23px; }

/* More flexible contact options */
.contact-method-fieldset, .callback-fieldset { padding: 0; margin: 0; border: 0; }
.contact-method-fieldset legend, .callback-fieldset legend { margin-bottom: 8px; color: #404858; font-size: 11px; font-weight: 800; }
.contact-method-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.contact-method { position: relative; display: block !important; cursor: pointer; }
.contact-method input { position: absolute; opacity: 0; pointer-events: none; }
.contact-method > span { display: grid; gap: 2px; min-height: 64px; padding: 12px 14px; border: 1px solid #dfe5ee; border-radius: 12px; background: #f8fafe; transition: .2s; }
.contact-method > span b { color: #1f2937; font-size: 13px; }
.contact-method > span small { color: #7b8492; font-size: 9px; font-weight: 650; }
.contact-method.active > span { border-color: var(--blue); background: #edf5ff; box-shadow: 0 0 0 3px rgba(11,99,246,.08); }
.contact-method.active > span b { color: var(--blue); }
.contact-data-row > label[hidden], .callback-fieldset[hidden] { display: none !important; }
.callback-options { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; }
.callback-options label { position: relative; display: block !important; cursor: pointer; }
.callback-options input { position: absolute; opacity: 0; pointer-events: none; }
.callback-options span { display: grid; gap: 2px; min-height: 55px; padding: 9px 8px; border: 1px solid #dfe5ee; border-radius: 10px; background: #f8fafe; color: #354052; font-size: 10px; transition: .2s; }
.callback-options small { color: #818b99; font-size: 8px; font-weight: 650; }
.callback-options input:checked + span { border-color: var(--blue); background: #edf5ff; color: var(--blue); box-shadow: 0 0 0 2px rgba(11,99,246,.07); }

/* Complete dark theme */
html[data-theme="dark"] body { background: #080d14; color: #f3f6fb; }
html[data-theme="dark"] ::selection { background: rgba(59,147,255,.3); color: #fff; }
html[data-theme="dark"] .preloader { background: #080d14; }
html[data-theme="dark"] .loader-line { background: #1d2939; }
html[data-theme="dark"] .site-header.scrolled { background: rgba(8,13,20,.86); border-color: rgba(62,79,103,.58); box-shadow: 0 8px 30px rgba(0,0,0,.22); }
html[data-theme="dark"] .main-nav a { color: #c4cfdd; }
html[data-theme="dark"] .menu-toggle span { background: #f2f6fb; }
html[data-theme="dark"] .hero { background: radial-gradient(circle at 78% 18%, rgba(27,125,255,.16), transparent 31%), linear-gradient(180deg,#080d14 0%,#0a111c 72%,#0e1724 100%); }
html[data-theme="dark"] .eyebrow { border-color: rgba(77,155,255,.25); background: rgba(14,25,39,.75); color: #a9caff; box-shadow: 0 10px 30px rgba(0,0,0,.15); }
html[data-theme="dark"] .hero-lead, html[data-theme="dark"] .section-heading > p, html[data-theme="dark"] .service-card p, html[data-theme="dark"] .faq-intro p { color: #a7b2c1; }
html[data-theme="dark"] .hero-trust span { color: #a5afbd; }
html[data-theme="dark"] .visual-shell { border-color: rgba(93,127,176,.28); box-shadow: 0 36px 90px rgba(0,0,0,.42), 0 0 0 8px rgba(17,27,41,.64); }
html[data-theme="dark"] .floating-card { background: rgba(14,23,35,.88); border-color: rgba(89,124,174,.3); color: #eef5ff; box-shadow: 0 18px 45px rgba(0,0,0,.28); }
html[data-theme="dark"] .floating-card small { color: #98a7bb; }
html[data-theme="dark"] .stats-strip { background: rgba(14,22,34,.8); border-color: rgba(75,101,138,.24); box-shadow: 0 22px 60px rgba(0,0,0,.18); }
html[data-theme="dark"] .stats-strip span { color: #9ba7b8; }
html[data-theme="dark"] .logo-marquee { background: #0d1520; border-color: #202d3e; }
html[data-theme="dark"] .services, html[data-theme="dark"] .contact { background: #080d14; }
html[data-theme="dark"] .service-card { background: #0e151f; border-color: #233044; }
html[data-theme="dark"] .service-card:hover { border-color: rgba(69,149,255,.42); box-shadow: 0 24px 70px rgba(0,0,0,.28); }
html[data-theme="dark"] .service-card ul { color: #b7c2d0; }
html[data-theme="dark"] .service-card > a { border-color: #263448; }
html[data-theme="dark"] .service-icon { background: #10243f; }
html[data-theme="dark"] .work { background: linear-gradient(180deg, rgba(13,28,47,.97), rgba(10,19,30,.98) 54%, rgba(8,13,20,.99)); }
html[data-theme="dark"] .portfolio-proof > div { background: rgba(14,25,39,.74); border-color: rgba(70,132,213,.23); box-shadow: 0 16px 42px rgba(0,0,0,.2); }
html[data-theme="dark"] .portfolio-proof span, html[data-theme="dark"] .portfolio-note { color: #aeb9c8; }
html[data-theme="dark"] .filter-btn { background: #111b28; border-color: #28384e; color: #aeb9c8; }
html[data-theme="dark"] .filter-btn:hover, html[data-theme="dark"] .filter-btn.active { background: #1978ff; border-color: #1978ff; color: #fff; }
html[data-theme="dark"] .project-meta h3 { color: #edf4ff; }
html[data-theme="dark"] .project-open { background: #101a27; border-color: #2a3a50; color: #d9e7f8; }
html[data-theme="dark"] .differentiators { background: #080d14; }
html[data-theme="dark"] .benefit { background: #0e151f; border-color: #233044; }
html[data-theme="dark"] .benefit p { color: #a7b2c1; }
html[data-theme="dark"] .faq { background: #0d1520; }
html[data-theme="dark"] .accordion-item { border-color: #283548; }
html[data-theme="dark"] .accordion-item button { color: #eef4fc; }
html[data-theme="dark"] .accordion-item button b { background: #172235; }
html[data-theme="dark"] .accordion-panel > p { color: #a8b3c2; }
html[data-theme="dark"] .contact-form { background: #0e151f; color: #f2f6fb; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
html[data-theme="dark"] .contact-form label, html[data-theme="dark"] .contact-method-fieldset legend, html[data-theme="dark"] .callback-fieldset legend { color: #c5d0df; }
html[data-theme="dark"] .contact-form input, html[data-theme="dark"] .contact-form select, html[data-theme="dark"] .contact-form textarea { border-color: #2a384b; background: #111b28; color: #eff5fc; }
html[data-theme="dark"] .contact-form input:focus, html[data-theme="dark"] .contact-form select:focus, html[data-theme="dark"] .contact-form textarea:focus { background: #142033; }
html[data-theme="dark"] .contact-method > span, html[data-theme="dark"] .callback-options span { background: #111b28; border-color: #29394e; }
html[data-theme="dark"] .contact-method > span b, html[data-theme="dark"] .callback-options span { color: #dbe7f5; }
html[data-theme="dark"] .contact-method > span small, html[data-theme="dark"] .callback-options small { color: #8f9caf; }
html[data-theme="dark"] .contact-method.active > span, html[data-theme="dark"] .callback-options input:checked + span { background: #10284a; border-color: #3088ff; }
html[data-theme="dark"] .consent { color: #9eabbc !important; }
html[data-theme="dark"] .contact-form .button-white { background: #eaf2ff; color: #0d1117; }
html[data-theme="dark"] .site-footer { background: #080d14; }
html[data-theme="dark"] .footer-top { border-color: #243044; }
html[data-theme="dark"] .footer-top p, html[data-theme="dark"] .footer-bottom { color: #8f9bac; }
html[data-theme="dark"] .modal-card { background: #0f1722; color: #f2f6fc; }
html[data-theme="dark"] .modal-card p { color: #a7b2c1; }
html[data-theme="dark"] .modal-close { background: #1b283a; color: #eaf2ff; }
html[data-theme="dark"] .modal-tags span { background: #10284a; color: #9fc5ff; }
html[data-theme="dark"] .toast { background: #edf4ff; color: #0d1117; }

@media (max-width: 1050px) {
  .callback-options { grid-template-columns: repeat(3,1fr); }
  .portfolio-proof { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 800px) {
  .nav-actions { margin-left: auto; }
  .menu-toggle { margin-left: 0; }
  .theme-toggle { width: 40px; height: 40px; border-radius: 10px; z-index: 2; }
  html[data-theme="dark"] .site-header { background: rgba(8,13,20,.9); border-color: #1d2a3b; }
  html[data-theme="dark"] .main-nav { background: rgba(8,13,20,.98); }
  .work .project-card-wide .project-preview { min-height: 500px; }
}

@media (max-width: 560px) {
  .ambient-item:nth-child(n+10) { display: none; }
  .portfolio-proof { grid-template-columns: 1fr 1fr; }
  .portfolio-proof > div { min-height: 104px; padding: 16px; }
  .portfolio-proof strong { font-size: 25px; }
  .portfolio-note { align-items: flex-start; }
  .contact-method-grid { grid-template-columns: 1fr 1fr; }
  .callback-options { grid-template-columns: repeat(2,1fr); }
  .nav-actions .desktop-cta { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ambient-item i { animation: none !important; }
  .ambient-item { transform: none !important; }
  .theme-icon { transition: none; }
}