:root {
  /* Theme parameters & colors (Dark Config mapping) */
  --dia-bg: #0d1117;
  --dia-surface: #161e2e;
  --dia-surface-deep: #0a0d14;
  --dia-tint: #1f293d;
  --dia-accent: #00f2fe;
  --dia-accent-rgb: 0, 242, 254;
  --dia-gold: #ffb800;
  --dia-ink: #ffffff;
  --dia-ink-dim: #9ca3af;
  
  --dia-gradient: linear-gradient(135deg, #00f2fe 0%, #4facfe 100%);
  
  /* Layout constraints from config */
  --dia-max-width: 1140px;
  
  /* Heading & Typography elements */
  --font-display: 'Montserrat', sans-serif;
  --font-body: 'Inter', sans-serif;
  
  /* Randomized parameters from instructions */
  --dia-radius: 14px; /* soft style (12-20px) */
  --dia-radius-pill: 999px;
  
  /* Shadow depth: raised (standard shadows) */
  --dia-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.5);
  --dia-shadow-hover: 0 20px 35px -5px rgba(0, 242, 254, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.4);
  
  /* Heading transform: uppercase */
  --dia-heading-transform: uppercase;
}

/* Custom layout adapters to avoid standard forbidden grids & layouts templates */
.dia-grid-twin {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

@media (min-width: 768px) {
  .dia-grid-twin {
    flex-direction: row;
    flex-wrap: wrap;
  }
  
  /* Features items sizing calculations (approx 2 cols with gaps) */
  .dia-grid-twin .dia-item {
    width: calc(50% - 1rem) !important;
  }
}

/* Transitions and interactive configurations */
.dia-primary-action {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-shadow: 0 4px 14px 0 rgba(0, 242, 254, 0.3);
}

.dia-primary-action:hover {
  box-shadow: 0 6px 20px 0 rgba(0, 242, 254, 0.5);
  transform: translateY(-2px);
  filter: brightness(1.1);
}

.dia-primary-action:active {
  transform: translateY(1px);
}

/* Desktop sticky settings safe zone integration */
@media (min-width: 1024px) {
  .dia-sticky-payout {
    position: sticky;
    bottom: 24px;
    z-index: 30;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
  }
}

/* Custom list, reset and standard elements adaptives */
html {
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Guarantee badge styling rules */
.dia-guarantee-badge {
  flex-direction: row;
  align-items: center;
}

/* Custom styling override for line-height on quotes decoration */
blockquote .line-height-none {
  line-height: 1;
}