/* Let Me 3D Print That — brand theme (palette sampled from the logo) */
:root {
  --primary:      #2A1FB8; /* logo outline indigo, lifted slightly for buttons */
  --primary-soft: #5A50D6;
  --accent:       #F28C38; /* rainbow filament orange */
  --secondary:    #FEDD59; /* "3D PRINT" yellow */
  --tertiary:     #3FB0B5; /* dragon teal */
  --quaternary:   #D8709A; /* dragon pink */
  --dark:         #17125E; /* deep indigo text */
  --info:         #3A86FF; /* rainbow blue */
  --soft:         #8F5AAC; /* rainbow purple */
  --success:      #5DBB63; /* rainbow green */
  --success-dark: #3E8E44;
  --highlight:    #D8709A;
  --glow:         #FEDD59;
  --earth:        #C98A4B;
  --earth-dark:   #8A5A2B;

  --bg:     #FAFDFF;
  --bg-alt: #EEF8FD;
  --tint-1: #FBEAF1;
  --tint-2: #FFF7D6;
  --tint-3: #E2F6F6;
  --tint-4: #E7F6FD;
  --tint-5: #EEE8F8;
  --line:   #E1E8F0;
  --ink-2:  #3F4570;

  --f-display: 'Fredoka', 'Nunito', system-ui, sans-serif;
  --f-brush:   'Lilita One', 'Fredoka', system-ui, sans-serif;
  --f-body:    'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* Chunky outlined lettering, like the logo */
h1, h2, .h-xl, .h-lg { font-weight: 700; }
.brush { letter-spacing: .01em; -webkit-text-stroke: .06em var(--dark); paint-order: stroke fill; }
.hero h1 .brush { transform: rotate(-2deg); }
/* Rainbow letters use the filament rainbow from the logo */
.rainbow .r1 { color: #E8505B; }
.rainbow .r2 { color: #F28C38; }
.rainbow .r3 { color: #FEDD59; }
.rainbow .r4 { color: #5DBB63; }
.rainbow .r5 { color: #3A86FF; }
.rainbow .r6 { color: #8F5AAC; }

/* Rainbow filament stripe under the header */
.site-header::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -4px; height: 4px;
  background: linear-gradient(90deg, #E8505B, #F28C38, #FEDD59, #5DBB63, #3A86FF, #8F5AAC);
}
.announce { background: var(--dark); }

/* Hero: round dragon sticker instead of a nest, rainbow ring */
.hero-nest { width: 26%; left: 0; bottom: 6%; border-radius: 50%; box-shadow: 0 0 0 6px #fff, 0 0 0 10px var(--secondary), var(--shadow-lg); filter: none; }
.hero-sticker { background: var(--secondary); color: var(--dark); box-shadow: 0 0 0 6px #fff, 0 0 0 9px var(--dark), var(--shadow); }
.hero-sticker b { font-size: 2.2rem; }

/* Buttons: a touch of the logo's bold outline */
.btn-ghost { border-width: 3px; }
.btn-secondary { --fg: var(--dark); }

/* Steps / tiers / cards get a crisp indigo hairline */
.step, .tier, .quote, .value { border: 2px solid color-mix(in srgb, var(--dark) 8%, transparent); }
.card { border: 2px solid color-mix(in srgb, var(--dark) 6%, transparent); }

/* Footer logo badge */
.footer-brand img { padding: 0; background: none; border-radius: 22px; width: 260px; }

/* Newsletter on the yellow brand colour */
.newsletter .bird { width: 110px; top: 18px; border-radius: 50%; transform: rotate(-8deg); animation: none; box-shadow: var(--shadow); }
@media (max-width: 820px) { .newsletter .bird { width: 80px; } }