/* HQ global polish - visual and readability upgrades without layout redesign */
:root {
  color-scheme: dark;
  --skimo-desktop-width: 1280px;
  --skimo-theme-bg: #11181d;
  --skimo-theme-bg-soft: #1c2931;
  --skimo-theme-panel: rgba(47, 64, 74, 0.9);
  --skimo-theme-panel-strong: rgba(31, 44, 52, 0.94);
  --skimo-theme-panel-soft: rgba(56, 74, 84, 0.78);
  --skimo-theme-line: rgba(143, 180, 192, 0.22);
  --skimo-theme-line-strong: rgba(143, 180, 192, 0.34);
  --skimo-theme-text: #f5f8fb;
  --skimo-theme-muted: #dbe4ea;
  --skimo-theme-accent: #8fb4c0;
  --skimo-pro-glow: 0 12px 30px rgba(0, 0, 0, 0.38);
  --skimo-pro-border: rgba(143, 180, 192, 0.34);
  --skimo-pro-highlight: rgba(143, 180, 192, 0.2);
  --skimo-pro-shadow-soft: 0 18px 44px rgba(0, 0, 0, 0.34);
  --skimo-pro-shadow-hard: 0 3px 12px rgba(0, 0, 0, 0.3);
  /* Biograf/reference: rig farve, dybde, uden at knuse detaljer */
  --skimo-cinema-video: saturate(1.16) contrast(1.1) brightness(0.94);
  --skimo-cinema-video-hero: saturate(1.2) contrast(1.12) brightness(0.9);
  --skimo-cinema-video-card: saturate(1.14) contrast(1.1) brightness(0.86);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-kerning: normal;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scrollbar-gutter: stable both-edges;
}

body {
  overflow-wrap: break-word;
  hyphens: auto;
  background: linear-gradient(145deg, var(--skimo-theme-bg), var(--skimo-theme-bg-soft)) !important;
  color: var(--skimo-theme-text) !important;
}

body::before,
body::after,
.animated-background {
  background: linear-gradient(145deg, rgba(17, 24, 29, 0.78), rgba(28, 41, 49, 0.62)) !important;
}

/* Keep desktop composition at all sizes and scale it proportionally on small windows */
@media (max-width: 1279px) and (pointer: fine) {
  html {
    overflow-x: hidden;
  }

  body {
    width: var(--skimo-desktop-width);
    min-width: var(--skimo-desktop-width);
    zoom: calc(100vw / var(--skimo-desktop-width));
  }
}

img,
video,
canvas,
svg {
  image-rendering: auto;
  backface-visibility: hidden;
  transform: translateZ(0);
  max-width: 100%;
}

img {
  image-orientation: from-image;
  height: auto;
}

video {
  filter: var(--skimo-cinema-video);
  object-fit: cover;
  object-position: center center;
}

header,
nav,
.main-header,
.main-nav,
.dashboard-header,
.section-header {
  background: var(--skimo-theme-panel-strong) !important;
  color: var(--skimo-theme-text) !important;
  border-color: var(--skimo-theme-line) !important;
}

header h1,
header h2,
header p,
nav a,
.logo,
.brand {
  color: var(--skimo-theme-text) !important;
}

nav a:hover,
.logo:hover,
a:hover {
  color: var(--skimo-theme-accent) !important;
}

nav a::before {
  background: var(--skimo-theme-accent) !important;
}

.container,
.card,
.feature,
.plan-card,
.download-box,
.antivirus-card,
.profile-section,
.guide-step,
.info-box,
.warning-box,
.price-box,
.about-container,
.security-section,
.purchase-section,
.subscription-card,
.plan,
.dashboard-card,
.dashboard-panel,
.status-card,
.game-card,
.marketplace-container > *,
.content-section {
  background: var(--skimo-theme-panel) !important;
  color: var(--skimo-theme-text) !important;
  border-color: var(--skimo-theme-line) !important;
}

.feature p,
.container p,
.container li,
.info-box p,
.warning-box p,
.security-section p,
.security-section li,
.guide-step p,
.guide-step li,
.dashboard p,
.dashboard li,
.status-card p,
.status-card li,
.content-section p,
.content-section li,
label,
.muted,
.sub,
.meta {
  color: var(--skimo-theme-muted) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.feature h3,
.container h2,
.container h3,
.section-title,
.card-title {
  color: var(--skimo-theme-text) !important;
}

button,
.btn,
.download-btn,
.buy-btn,
.back-btn,
.return-btn,
.cta-btn,
.primary-btn,
a[role="button"] {
  background: linear-gradient(135deg, #0f2433 0%, #173447 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(143, 180, 192, 0.28) !important;
}

input,
select,
textarea {
  background: rgba(68, 88, 99, 0.78) !important;
  color: var(--skimo-theme-text) !important;
  border-color: var(--skimo-theme-line) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(219, 228, 234, 0.76) !important;
}

a,
button,
input,
select,
textarea {
  -webkit-tap-highlight-color: rgba(143, 180, 192, 0.2);
}

a {
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

a:hover {
  text-decoration-thickness: 1.5px;
}

::selection {
  background: rgba(143, 180, 192, 0.28);
  color: #fff;
}

header,
nav,
.main-header,
.main-nav,
.antivirus-card,
.profile-section,
.marketplace-container > *,
.content-section,
.feature,
.card,
.plan-card,
.download-box,
.guide-step,
.info-box,
.warning-box,
.price-box,
.about-container,
.security-section,
.purchase-section {
  box-shadow: var(--skimo-pro-shadow-hard), var(--skimo-pro-glow);
}

.card,
.feature,
.plan-card,
.download-box,
.antivirus-card,
.profile-section,
.guide-step,
.info-box,
.warning-box,
.price-box,
.about-container,
.security-section,
.purchase-section {
  border-color: var(--skimo-pro-border);
  backdrop-filter: saturate(1.1);
}

button,
.btn,
.download-btn,
.buy-btn,
.back-btn,
.return-btn,
a[role="button"] {
  letter-spacing: 0.2px;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  transition: box-shadow 0.1s ease, filter 0.1s ease, background-color 0.1s ease, transform 0.1s ease;
  will-change: transform;
}

button:hover,
.btn:hover,
.download-btn:hover,
.buy-btn:hover,
.back-btn:hover,
.return-btn:hover,
a[role="button"]:hover {
  filter: saturate(1.08);
  transform: translateY(-1px);
  box-shadow: 0 0 0 1px var(--skimo-pro-highlight), var(--skimo-pro-shadow-soft);
}

h1,
h2,
h3 {
  letter-spacing: 0.2px;
  text-wrap: balance;
}

p,
li,
label,
input,
button,
select,
textarea {
  line-height: 1.48;
}

input,
select,
textarea {
  border: 1px solid rgba(143, 180, 192, 0.24);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.16);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
a:focus-visible {
  outline: 2px solid rgba(143, 180, 192, 0.82);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(143, 180, 192, 0.24);
}

/* Responsive stability: avoid card overlap on narrow widths */
.cards-container,
.subscription-grid,
.features,
.plan-options,
.marketplace-container,
.dashboard,
.antivirus,
.purchase-section,
.about-container,
.container,
nav,
.nav-left,
.nav-right {
  min-width: 0;
}

.cards-container > *,
.subscription-grid > *,
.features > *,
.plan-options > *,
.marketplace-container > * {
  min-width: 0;
}

.card,
.plan-card,
.download-box,
.antivirus-card,
.profile-section,
.guide-step {
  max-width: 100%;
}

@media (pointer: coarse) and (max-width: 1100px) {
  .cards-container,
  .subscription-grid,
  .features,
  .plan-options,
  .marketplace-container {
    gap: clamp(12px, 2.2vw, 24px) !important;
  }
}

@media (pointer: coarse) and (max-width: 860px) {
  nav,
  .nav-left,
  .nav-right {
    flex-wrap: wrap;
    row-gap: 10px;
  }

  .card,
  .plan-card,
  .download-box,
  .antivirus-card,
  .profile-section,
  .guide-step {
    width: min(100%, 430px) !important;
  }

  .language-selector select,
  select {
    min-height: 42px;
  }
}

@media (min-resolution: 2dppx) {
  .card,
  .feature,
  .plan-card,
  .download-box,
  .antivirus-card,
  .profile-section,
  .guide-step,
  .info-box,
  .warning-box,
  .price-box {
    box-shadow: var(--skimo-pro-shadow-hard), 0 14px 36px rgba(0, 0, 0, 0.36);
  }
}

@media (prefers-contrast: more) {
  :root {
    --skimo-pro-border: rgba(143, 180, 192, 0.6);
    --skimo-pro-highlight: rgba(143, 180, 192, 0.44);
  }

  p,
  li,
  label {
    color: #edf4f8;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(143, 180, 192, 0.48), rgba(143, 180, 192, 0.28));
  border-radius: 999px;
  border: 2px solid rgba(12, 12, 12, 0.85);
}

::-webkit-scrollbar-track {
  background: rgba(8, 8, 8, 0.65);
}

/* site-wide blue-gray unifier */
.topbar,
.wrapper,
.hero,
.shell,
.layout,
.panel,
.purchase-card,
.purchase-main,
.purchase-side,
.product-tab,
.pay-chip,
.trust-chip,
.payment-method,
.detail-row,
.order-details,
.code-section,
.instructions,
.email-notice,
.contact-card,
.support-box,
.term-card,
.updated,
.back-link,
.step-header,
.step-content,
.step-image,
.step-description,
.downloads,
.actions,
.status,
.scan-terminal,
.dropzone,
.help-tooltip,
.help-pop,
.success-message,
.confirmation-message,
.activation-code,
.product-help-btn,
.help-btn,
.product-media,
.price-line,
.price-summary,
.fineprint,
.chips-row,
.product-tabs,
.terms-grid,
.nav-links a,
.language-selector select,
select.language-selector,
.card.has-video .card-content,
.coming-soon-ribbon,
.coming-soon-label,
.plan-options > *,
.subscription-grid > *,
.cards-container > * {
  background: var(--skimo-theme-panel) !important;
  color: var(--skimo-theme-text) !important;
  border-color: var(--skimo-theme-line) !important;
}

.step-header,
.hero,
.shell,
.purchase-card.wide,
.price-box,
.order-details,
.code-section,
.instructions,
.email-notice,
.terms-grid,
.term-card,
.contact-card,
.support-box,
.panel,
.scan-terminal,
.dropzone,
.help-tooltip,
.help-pop,
.status-card,
.dashboard-card,
.dashboard-panel,
.security-section,
.info-box,
.warning-box {
  box-shadow: var(--skimo-pro-shadow-hard), var(--skimo-pro-glow) !important;
  border: 1px solid var(--skimo-theme-line) !important;
}

.logo,
.tab-skimo,
.price-box strong,
.detail-value,
.activation-code,
.scan-terminal .terminal-title,
.scan-terminal .terminal-text,
.dropzone-text,
.trust-chip,
.pay-chip,
.product-label,
.product-name,
.container h2,
.container h3,
.panel h3,
.purchase-card .card-title,
.contact-card h3,
.support-box h3,
.term-card h3,
.step-header h2,
.step-header h3,
.step-description h3,
.order-details h3,
.code-section h3,
.instructions h3,
.email-notice h3,
.checkout-subtitle,
.success-message,
.confirmation-message,
.status,
.small,
.fineprint {
  color: var(--skimo-theme-text) !important;
}

.detail-label,
.product-desc,
.feature-list li,
.warning-box p,
.info-box p,
.contact-card p,
.support-box p,
.term-card p,
.term-card li,
.step-description p,
.step-description li,
.checkout-subtitle,
.small,
.fineprint,
.help-pop,
.help-tooltip,
.updated,
.back-link,
.coupon-hint,
#product-selected,
#modeSummary,
#sourceNote,
#accessStatus {
  color: var(--skimo-theme-muted) !important;
}

.feature-list li,
.detail-row,
.price-line,
.pay-chip,
.trust-chip,
.payment-method,
.product-tab,
.contact-card,
.support-box,
.term-card,
.help-pop,
.help-tooltip,
.instructions,
.email-notice,
.code-section,
.order-details,
.step-content,
.step-image,
.step-description,
.downloads,
.actions,
.status {
  background: var(--skimo-theme-panel-soft) !important;
  border-color: var(--skimo-theme-line-strong) !important;
}

.product-tab.selected,
.product-tab[aria-checked="true"],
.payment-method.selected,
.payment-method.active,
.plan-card.featured,
.card.active,
.status-card.active,
.game-card.active,
.nav-links a.active,
nav a.active {
  background: linear-gradient(135deg, rgba(84, 107, 122, 0.94), rgba(64, 84, 98, 0.94)) !important;
  border-color: rgba(183, 210, 220, 0.45) !important;
  box-shadow: 0 0 0 1px rgba(183, 210, 220, 0.14), var(--skimo-pro-shadow-soft) !important;
}

.coming-soon-ribbon,
.coming-soon-label,
.scan-badge,
.badge-text {
  background: linear-gradient(135deg, rgba(58, 76, 88, 0.96), rgba(78, 102, 116, 0.96)) !important;
  color: #f7fbfd !important;
  border-color: rgba(183, 210, 220, 0.36) !important;
}

.product-help-btn,
.help-btn,
.help-icon,
.language-selector select,
select.language-selector {
  background: rgba(62, 84, 98, 0.96) !important;
  color: #f5f8fb !important;
  border: 1px solid rgba(143, 180, 192, 0.32) !important;
  box-shadow: none !important;
}

.product-help-btn:hover,
.help-btn:hover,
.help-icon:hover,
.language-selector select:hover,
select.language-selector:hover {
  background: rgba(83, 109, 125, 0.98) !important;
  color: #ffffff !important;
}

.download-btn,
.buy-btn,
.back-btn,
.return-btn,
.cta-btn,
.primary-btn,
.coupon-btn,
.guide-btn,
#freeCodeBtn,
#copyCodeBtn,
#subscriptionLink,
.action-buttons .btn,
.btn-primary,
.btn-secondary {
  background: linear-gradient(135deg, #173447 0%, #28495b 100%) !important;
  color: #f7fbfd !important;
  border: 1px solid rgba(143, 180, 192, 0.32) !important;
}

.download-btn:hover,
.buy-btn:hover,
.back-btn:hover,
.return-btn:hover,
.cta-btn:hover,
.primary-btn:hover,
.coupon-btn:hover,
.guide-btn:hover,
#freeCodeBtn:hover,
#copyCodeBtn:hover,
#subscriptionLink:hover,
.action-buttons .btn:hover,
.btn-primary:hover,
.btn-secondary:hover {
  background: linear-gradient(135deg, #25485c 0%, #355c70 100%) !important;
}

.success-icon,
.fa-shield-halved,
.fa-circle-question,
.fa-download,
.fa-apple,
.fa-windows,
.fa-linux {
  color: var(--skimo-theme-accent) !important;
  text-shadow: none !important;
  filter: none !important;
}

.card-video-bg,
.video-background video,
.hero video,
#bgVideo,
#gameVideo,
#skyrimVideo {
  filter: var(--skimo-cinema-video-hero) !important;
}

.home-page #bgVideo {
  filter: saturate(1.12) contrast(1.1) brightness(0.78) !important;
}

.home-page {
  background: transparent !important;
}

.home-page::before,
.home-page::after {
  display: none !important;
  background: transparent !important;
}

.home-page .animated-background {
  display: none !important;
  background: transparent !important;
}

.home-page .animated-background::before {
  display: none !important;
  background: transparent !important;
}

.home-page .hero,
.home-page .hero.highlighted-shell {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.dashboard,
.dashboard .cards-container,
.dashboard .modguard-container,
.dashboard .cards-container > *,
.dashboard .modguard-container > *:not(.card) {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

.cards-container .card.has-video {
  padding: 0 !important;
  background: transparent !important;
}

.cards-container .card.has-video .card-video-bg {
  opacity: 0.9 !important;
  filter: var(--skimo-cinema-video-card) !important;
}

.cards-container .card.has-video.disabled .card-video-bg {
  opacity: 0.44 !important;
  filter: saturate(1.02) contrast(1.04) brightness(0.68) !important;
}

.cards-container .card.has-video .card-content {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 30px 24px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
  gap: 16px !important;
  border-radius: inherit !important;
  background: transparent !important;
}

.cards-container .card.has-video .card-content h2,
.cards-container .card.has-video .card-content p {
  width: 100% !important;
  max-width: none !important;
  text-shadow: 0 2px 28px rgba(0, 0, 0, 0.65), 0 1px 3px rgba(0, 0, 0, 0.85) !important;
}

.cards-container .card.has-video .card-content h2 {
  margin: 0 !important;
  font-size: clamp(2rem, 2.8vw, 3.25rem) !important;
  line-height: 1.05 !important;
  color: #f5f8fb !important;
}

.cards-container .card.has-video .card-content p {
  margin: 0 !important;
  font-size: clamp(1rem, 1.38vw, 1.45rem) !important;
  line-height: 1.45 !important;
  display: none !important;
}

.cards-container .card.has-video.disabled .card-content {
  background: transparent !important;
}

.video-overlay,
.hero::before,
.hero::after {
  background: linear-gradient(180deg, rgba(17, 24, 29, 0.46), rgba(17, 24, 29, 0.58)) !important;
}

@media (max-width: 860px) {
  .hero,
  .shell,
  .layout,
  .purchase-main,
  .purchase-side,
  .panel,
  .purchase-card,
  .contact-card,
  .support-box,
  .term-card,
  .step-content,
  .step-description,
  .step-image {
    width: 100% !important;
    max-width: 100% !important;
  }
}

body {
  background:
    radial-gradient(circle at top, rgba(161, 209, 224, 0.18), transparent 34%),
    linear-gradient(165deg, #18242c, #243744 52%, #314854 100%) !important;
}

body::before,
body::after,
.animated-background {
  background:
    radial-gradient(circle at 18% 18%, rgba(191, 247, 255, 0.14), transparent 24%),
    radial-gradient(circle at 82% 12%, rgba(142, 193, 208, 0.12), transparent 28%),
    linear-gradient(165deg, rgba(24, 36, 44, 0.82), rgba(49, 72, 84, 0.64)) !important;
}

.dashboard {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01)) !important;
}

.dashboard-stage {
  position: relative;
}

.dashboard-stage::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 0%, rgba(201, 244, 255, 0.16), transparent 34%),
    radial-gradient(circle at 85% 30%, rgba(154, 202, 202, 0.1), transparent 24%);
  opacity: 0.9;
}

.game-panel {
  border: 1px solid rgba(191, 247, 255, 0.14) !important;
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.28) !important;
}

.game-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), transparent 26%);
}

.index-clone-nav {
  background: rgba(20, 32, 40, 0.74) !important;
  border: 1px solid rgba(191, 247, 255, 0.18) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(18px) !important;
}

.hero-brand-logo {
  filter: drop-shadow(0 10px 28px rgba(177, 241, 255, 0.2));
}

#skimoHeroPanel .card-video-bg {
  opacity: 1 !important;
  filter: saturate(1.2) contrast(1.08) brightness(1.06) !important;
}

#skimoHeroPanel::before {
  background:
    linear-gradient(180deg, rgba(48, 110, 145, 0.2) 0%, rgba(17, 52, 79, 0.24) 34%, rgba(11, 25, 44, 0.56) 84%, rgba(8, 15, 30, 0.72) 100%),
    linear-gradient(90deg, rgba(7, 25, 44, 0.56) 0%, rgba(9, 34, 61, 0.24) 45%, rgba(6, 19, 36, 0.08) 100%) !important;
}

.game-copy p,
.game-note,
.game-meta,
.game-logo small {
  color: rgba(244, 251, 252, 0.94) !important;
}

.game-copy p {
  max-width: 58ch;
  line-height: 1.72 !important;
}

.game-actions .game-btn,
.coming-pill {
  border-color: rgba(191, 247, 255, 0.22) !important;
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.18);
}

@media (prefers-reduced-motion: reduce) {
  video {
    filter: saturate(1.06) contrast(1.06) brightness(0.96) !important;
  }
}