/* ============================================================
   Dondas Interior Designs · Killam Remix theme
   Loads AFTER styles.css and re-skins the whole site in the
   visual language extracted from mariakillam.com
   (see ../Design Explorations/brand-spec.md).
   Structure and layout stay in styles.css; this file is the skin.
   ============================================================ */

:root {
  /* Palette A (default): verified from mariakillam.com.
     Palette B (Donda's swatch) overrides at the bottom of this file
     under [data-palette="v2"] — toggled by palette-toggle.js. */
  --k-cream: #fbf7f4;
  --k-cream-deep: #f6efe8;
  --k-peri: #4e68a1;
  --k-peri-dim: #3d5486;
  --k-peri-light: #93a4c3;
  --k-ink: #574943;
  --k-berry: #944953;
  --k-terra: #e2835b;
  --k-terra-deep: #c05f38;
  --k-peach: #f4c0a2;
  --k-mustard: #f3ba54;
  --k-blush: #e0c3d4;
  --k-body: #6b5d55;

  /* secondary tints (so the palette toggle flips every detail) */
  --k-navcta-hover: #eeb08b;
  --k-photo-bg: rgba(224, 195, 212, 0.4);
  --k-chip2-bg: #dfe5f0;
  --k-chip3-bg: #fbe3d2;
  --k-chip3-text: #b05c33;
  --k-chip1-bg: #f2dbe6;
  --k-benefits-grad: linear-gradient(160deg, #fdf6f1 0%, #fbeee6 55%, #f7e3e6 100%);
  --k-services-accent: #2e4470;
  --k-testi-grad: linear-gradient(180deg, var(--k-mustard) 0%, #f6d089 100%);
  --k-testi-eyebrow: var(--k-berry);
  --k-testi-star: var(--k-terra);
  --k-areas-grad: linear-gradient(115deg, #f5e9ef 0%, #e9e6f2 38%, #f3e2e4 68%, #f8e8d8 100%);
  --k-consider-grad: linear-gradient(160deg, #fdf6f1 0%, #f7e9ef 100%);
  --k-cta-btn-text: var(--k-ink);
  --k-cta-btn-hover: #eeae3f;
  --k-cta-home-grad: linear-gradient(115deg, #f5e9ef 0%, #ede9f2 48%, #f8e8d8 100%);
  --k-conf3: #cdd6ae;
  --k-faq-bg: #f6eee6;

  /* remap the base system */
  --color-primary: var(--k-peri);
  --color-primary-dim: var(--k-peri-dim);
  --color-surface: var(--k-cream-deep);
  --color-surface-high: #f1e8dd;
  --color-text: var(--k-ink);
  --color-body: var(--k-body);
  --color-muted: #8a7a70;

  --font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "Plus Jakarta Sans", -apple-system, sans-serif;
  --font-caps: "Oswald", sans-serif;
  --font-script: "Caveat", cursive;

  --radius: 10px;
  --radius-lg: 14px;
}

body {
  font-family: var(--font-sans);
  background: var(--k-cream);
  font-size: 16.5px;
  color: var(--k-ink);
}

/* ---------- signature: script accent everywhere ---------- */
.italic-accent {
  font-family: var(--font-script);
  font-style: normal;
  font-weight: 500;
  font-size: 1.18em;
  color: var(--k-berry);
  line-height: 1;
}

/* handwritten annotation (new class, used on homepage) */
.script-note {
  font-family: var(--font-script);
  font-size: 28px;
  font-weight: 500;
  color: var(--k-berry);
  transform: rotate(-4deg);
  display: inline-block;
  margin-bottom: 6px;
}

/* Oswald caps accent inside headlines (new class) */
.caps-accent {
  font-family: var(--font-caps);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  color: var(--k-peri);
}
.caps-accent.berry { color: var(--k-berry); }

/* ---------- eyebrows ---------- */
.section-eyebrow,
.eyebrow-text {
  font-family: var(--font-caps);
  font-weight: 600;
  letter-spacing: 0.22em;
  font-size: 12.5px;
  color: var(--k-terra-deep);
}
.eyebrow-rule { background: var(--k-terra); }

/* ---------- buttons: Killam pills ---------- */
.btn {
  border-radius: 999px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: none;
  font-weight: 700;
  padding: 13px 26px;
}
.btn-sm { padding: 10px 20px; font-size: 12.5px; border-radius: 999px; }
.btn-lg { padding: 16px 32px; font-size: 14px; border-radius: 999px; }
.btn-block { border-radius: 999px; }
.btn-primary { background: var(--k-peri); }
.btn-primary:hover { background: var(--k-peri-dim); }
.btn-outline { border: 1.5px solid var(--k-peri); color: var(--k-peri); }
.btn-outline:hover { background: var(--k-peri); }
.btn-ghost { border: 1.5px solid rgba(78, 104, 161, 0.35); color: var(--k-peri); background: #fff; }
.btn-ghost:hover { background: #fff; border-color: var(--k-peri); }
.nav-cta .btn-primary { background: var(--k-peach); color: var(--k-ink); box-shadow: none; }
.nav-cta .btn-primary:hover { background: var(--k-navcta-hover); }

/* ---------- navbar ---------- */
.navbar {
  background: rgba(251, 247, 244, 0.9);
  border-bottom: 1px solid rgba(87, 73, 67, 0.08);
}
.brand { color: var(--k-peri); }
.brand-thin { color: var(--k-ink); }
.nav-links { align-items: baseline; }
.nav-link, .nav-trigger { font-size: 12px; letter-spacing: 0.14em; line-height: 1; padding-bottom: 4px; }
.nav-link { color: var(--k-body); }
.nav-link:hover, .nav-link.active { color: var(--k-peri); }
.nav-link::after { background: var(--k-terra); }
.nav-trigger { color: var(--k-body); }
.nav-trigger:hover { color: var(--k-peri); }
.nav-trigger .caret { margin-top: 0; }
.dropdown-menu { border-radius: var(--radius-lg); border: 1px solid rgba(87,73,67,.08); box-shadow: 0 20px 44px rgba(87,73,67,.16); }
.dropdown-menu a:hover { color: var(--k-berry); }
.mobile-menu { background: var(--k-cream); }
.mobile-link { color: var(--k-peri); }

/* ---------- homepage hero ---------- */
.hero {
  background: linear-gradient(105deg, #ffffff 0%, #fdf9f5 45%, #f2ead9 100%);
}
.hero-title { color: var(--k-ink); font-weight: 350; }
.hero-title .italic-accent { font-size: 0.95em; color: var(--k-peri); }
.hero-clip { clip-path: none; border-radius: 8px; }
.hero-image-frame::before { display: none; }
.hero-meta {
  background: var(--k-berry);
  color: #fff;
  border: 0;
  border-radius: 999px;
  width: 104px;
  height: 104px;
  align-items: center;
  justify-content: center;
  transform: rotate(-6deg);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
  right: 12px;
  bottom: -8px;
}
.hero-meta-year { color: #fff; font-size: 26px; }

/* ---------- philosophy (Meet the Designer) ---------- */
.philosophy { background: var(--k-cream); }
.philosophy-photo {
  border-radius: 300px 300px 12px 12px;   /* Killam arch */
  box-shadow: 0 24px 48px rgba(87, 73, 67, 0.16);
}
.philosophy-photo-bg { background: var(--k-photo-bg); border-radius: 300px 300px 12px 12px; }
.philosophy-accent { border-color: var(--k-cream); border-radius: var(--radius-lg); }
.pain-title { font-family: var(--font-script); font-size: 30px; font-weight: 500; color: var(--k-berry); }
.pain-list { flex-direction: row; flex-wrap: wrap; gap: 12px; }
.pain-item { gap: 0; }
.pain-icon { display: none; }
.pain-text {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.06em;
  padding: 9px 18px;
  border-radius: 999px;
  background: var(--k-blush);
  color: var(--k-berry);
}
.pain-item:nth-child(2) .pain-text { background: var(--k-chip2-bg); color: var(--k-peri); }
.pain-item:nth-child(3) .pain-text { background: var(--k-chip3-bg); color: var(--k-chip3-text); }

/* ---------- benefits (What to Expect) ---------- */
.benefits {
  background: var(--k-benefits-grad);
  border-top: 0;
}
.benefit-icon {
  background: #fff;
  color: var(--k-berry);
  border: 0;
  box-shadow: 0 8px 22px rgba(148, 73, 83, 0.14);
}
.benefit-title { font-family: var(--font-caps); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; font-size: 17px; color: var(--k-peri); }

/* ---------- services band ---------- */
.services { background: var(--k-peri-light); border-top: 0; }
.services .section-eyebrow { color: #fff; opacity: 0.9; }
.services .section-title-lg { color: #fff; }
.services .section-title-lg .italic-accent { color: var(--k-services-accent); }
.service-card { background: var(--k-cream); border: 0; border-radius: var(--radius-lg); box-shadow: 0 16px 40px rgba(46, 68, 112, 0.22); }
.service-sub { color: var(--k-terra-deep); font-family: var(--font-caps); letter-spacing: 0.18em; }

/* ---------- testimonials ---------- */
.testimonials { background: var(--k-testi-grad); border-top: 0; }
.testimonials .section-eyebrow { color: var(--k-testi-eyebrow); }
.testimonial {
  background: rgba(255, 255, 255, 0.93);
  border-radius: var(--radius-lg);
  border: 0;
  box-shadow: 0 14px 34px rgba(150, 105, 15, 0.18);
}
.testimonial::before {
  content: "★★★★★";
  display: block;
  color: var(--k-testi-star);
  letter-spacing: 3px;
  font-size: 14px;
  margin-bottom: 12px;
}
.quote-mark { display: none; }
.testimonial blockquote { font-family: var(--font-display); font-style: italic; color: var(--k-ink); }

/* ---------- gallery (style tabs) ---------- */
.gallery { background: var(--k-cream); }
.style-tab {
  border-radius: 999px;
  font-family: var(--font-sans);
  font-weight: 700;
  border: 1.5px solid rgba(78, 104, 161, 0.3);
  color: var(--k-peri);
  background: #fff;
}
.style-radio:nth-of-type(1):checked ~ .style-tabs .style-tab:nth-of-type(1),
.style-radio:nth-of-type(2):checked ~ .style-tabs .style-tab:nth-of-type(2),
.style-radio:nth-of-type(3):checked ~ .style-tabs .style-tab:nth-of-type(3),
.style-radio:nth-of-type(4):checked ~ .style-tabs .style-tab:nth-of-type(4) {
  background: var(--k-peri);
  color: #fff;
  border-color: var(--k-peri);
}
.g-item { border-radius: var(--radius-lg); }
.g-caption { background: rgba(251, 247, 244, 0.94); border-radius: var(--radius); }
.g-caption h3 { color: var(--k-ink); }
.g-caption p { color: var(--k-terra-deep); }

/* ---------- process ---------- */
.process { background: var(--k-cream); }
.process-title { color: var(--k-ink); }
.process-underline { background: var(--k-mustard); height: 4px; border-radius: 99px; }
.process-line { background: rgba(148, 73, 83, 0.25); }
.step-num {
  background: var(--k-cream);
  border: 2px solid var(--k-berry);
  color: var(--k-berry);
  font-family: var(--font-display);
  font-weight: 500;
}
.step-title { font-family: var(--font-caps); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; font-size: 16px; color: var(--k-peri); }

/* ---------- areas (pastel gradient banner) ---------- */
.areas {
  background: var(--k-areas-grad);
  position: relative;
  overflow: hidden;
}
.areas .section-eyebrow, .areas-eyebrow { color: var(--k-terra-deep); opacity: 1; }
.areas-title { color: var(--k-ink); }
.areas-title .caps-accent { color: var(--k-peri); }
.areas-title .caps-accent.berry { color: var(--k-berry); }
.areas-lede { color: var(--k-body); }
.eyebrow-rule-sm { background: var(--k-terra); }
.areas-grid { align-items: center; }
.areas-list { gap: 18px; }
.area {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 999px;
  padding: 18px 24px;
  text-align: center;
  box-shadow: 0 8px 20px rgba(87, 73, 67, 0.12);
  transition: background 0.2s var(--ease), transform 0.2s var(--ease), box-shadow 0.2s var(--ease);
}
.area:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(87, 73, 67, 0.18); }
.area h3 {
  font-family: var(--font-caps);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-size: 15px;
  transition: color 0.2s var(--ease);
}
.area:nth-child(3n+1) { background: var(--k-chip1-bg); border: 1.5px solid color-mix(in srgb, var(--k-berry) 35%, transparent); }
.area:nth-child(3n+1) h3 { color: var(--k-berry); }
.area:nth-child(3n+1):hover { background: var(--k-berry); }
.area:nth-child(3n+2) { background: var(--k-chip2-bg); border: 1.5px solid color-mix(in srgb, var(--k-peri) 35%, transparent); }
.area:nth-child(3n+2) h3 { color: var(--k-peri); }
.area:nth-child(3n+2):hover { background: var(--k-peri); }
.area:nth-child(3n) { background: var(--k-chip3-bg); border: 1.5px solid color-mix(in srgb, var(--k-chip3-text) 35%, transparent); }
.area:nth-child(3n) h3 { color: var(--k-chip3-text); }
.area:nth-child(3n):hover { background: var(--k-chip3-text); }
.area:hover h3 { color: #fff; }

/* floating confetti chips */
.confetti { position: absolute; inset: 0; pointer-events: none; }
.confetti span {
  position: absolute;
  width: 46px;
  height: 30px;
  border-radius: 10px 22px 12px 20px;
  opacity: 0.5;
}
.confetti span:nth-child(1) { top: 12%; left: 4%; background: var(--k-blush); transform: rotate(24deg); }
.confetti span:nth-child(2) { bottom: 18%; left: 9%; background: var(--k-peach); transform: rotate(-32deg) scale(0.7); }
.confetti span:nth-child(3) { top: 8%; right: 6%; background: var(--k-conf3); transform: rotate(40deg) scale(0.85); }
.confetti span:nth-child(4) { bottom: 10%; right: 3%; background: var(--k-peri-light); transform: rotate(-18deg) scale(0.6); }
.confetti span:nth-child(5) { top: 46%; right: 14%; background: var(--k-mustard); transform: rotate(12deg) scale(0.5); }
.confetti span:nth-child(6) { top: 60%; left: 40%; background: var(--k-berry); transform: rotate(-40deg) scale(0.4); opacity: 0.25; }

/* ---------- FAQ ---------- */
.faq { background: var(--k-cream); }
.faq-item {
  border-radius: var(--radius-lg);
  background: var(--k-faq-bg);
  border: 0;
  margin-bottom: 14px;
}
.faq-item summary { padding: 24px 28px; }
.faq-item[open] summary { padding-bottom: 10px; }
.faq-answer { padding: 0 48px 26px 28px; }
.faq-item summary h3 { color: var(--k-ink); }
.faq-icon { color: var(--k-berry); }

/* ---------- CTA banner (inner pages, periwinkle) ---------- */
.cta-banner { background: var(--k-peri); }
.cta-banner .section-eyebrow { color: var(--k-mustard); }
.cta-banner .btn-primary { background: var(--k-mustard); color: var(--k-cta-btn-text); }
.cta-banner .btn-primary:hover { background: var(--k-cta-btn-hover); }
.cta-banner .btn-outline { border-color: rgba(255, 255, 255, 0.6); color: #fff; }

/* ---------- homepage CTA (pastel gradient banner, "Real Homes Real Results" treatment) ---------- */
.cta-home {
  background: var(--k-cta-home-grad);
  position: relative;
  overflow: hidden;
  padding: 110px 32px;
}
.cta-home-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px;
  align-items: center;
  position: relative;
}
.cta-home-copy { text-align: left; }
.cta-home h2 {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(34px, 4.5vw, 52px);
  line-height: 1.1;
  color: var(--k-ink);
  margin: 6px 0 18px;
  max-width: 22ch;
}
.cta-home p { color: var(--k-body); max-width: 48ch; margin: 0; font-size: 17px; }
.cta-home-actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: flex-start;
}
.cta-home .btn-primary { background: var(--k-peri); color: #fff; }
.cta-home .btn-primary:hover { background: var(--k-peri-dim); }
.cta-home .btn-outline { border-color: rgba(87, 73, 67, 0.4); color: var(--k-ink); }
.cta-home .btn-outline:hover { background: #fff; color: var(--k-peri); border-color: var(--k-peri); }

@media (min-width: 900px) {
  .cta-home-grid { grid-template-columns: 1.35fr 0.65fr; gap: 48px; }
  .cta-home-actions { justify-self: end; align-items: flex-end; }
}

/* ---------- footer ---------- */
.footer { background: var(--k-ink); border-top: 0; }
.footer, .footer p, .footer a, .footer span, .footer li { color: #cfc3bc; }
.footer .brand, .footer .footer-logo, .footer .brand-thin { color: #fff; }
.footer-quote {
  font-family: var(--font-script);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--k-mustard);
}
.footer-col-title { color: #fff; font-family: var(--font-caps); font-weight: 500; letter-spacing: 0.14em; }
.footer-list a:hover { color: var(--k-peach); }
.contact-label { color: #a3958c; }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.12); }
.footer-bottom p { color: #a3958c; }

/* ---------- inner pages ---------- */
.page-hero { background: linear-gradient(105deg, #ffffff 0%, #fdf9f5 45%, #f2ead9 100%); }
.breadcrumb { font-family: var(--font-caps); letter-spacing: 0.14em; text-transform: uppercase; font-size: 11.5px; color: var(--k-terra-deep); }
.breadcrumb a { color: var(--k-terra-deep); }
.breadcrumb .sep { color: var(--k-peach); }
.page-title { color: var(--k-ink); font-weight: 350; }
.page-hero-image img { border-radius: var(--radius-lg); box-shadow: 0 24px 48px rgba(87, 73, 67, 0.18); }

.page-body { background: var(--k-cream); }
.page-body-main h2 { color: var(--k-ink); }
.page-body-main h3 { color: var(--k-peri); }
.page-considerations {
  background: var(--k-consider-grad);
  border-radius: var(--radius-lg);
  border: 0;
}
.page-considerations h3 { color: var(--k-berry); }
.page-considerations li::before { background: var(--k-terra); }
.page-considerations li strong { color: var(--k-ink); }

.room-gallery { background: var(--k-cream-deep); }
.room-tile { border-radius: var(--radius-lg); overflow: hidden; box-shadow: 0 12px 30px rgba(87, 73, 67, 0.14); }

.related { background: var(--k-cream); }
.related-pill {
  border-radius: 999px;
  border: 0;
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: var(--k-blush);
  color: var(--k-berry);
}
.related-pill:nth-child(3n+2) { background: var(--k-chip2-bg); color: var(--k-peri); }
.related-pill:nth-child(3n) { background: var(--k-chip3-bg); color: var(--k-chip3-text); }
.related-pill:hover { transform: translateY(-2px); background: var(--k-peri); color: #fff; }

/* ---------- about ---------- */
.about-portrait img { border-radius: 300px 300px 12px 12px; }
.credentials { background: var(--k-peri-light); }
.credentials .section-eyebrow { color: #fff; }
.credentials .section-title-lg, .credentials .section-title { color: #fff; }
.credential { background: rgba(251, 247, 244, 0.94); border-radius: var(--radius-lg); border: 0; }
.credential .big-num, .credential .num { color: var(--k-berry); font-family: var(--font-display); }
.credential-label { color: var(--k-body); }
.feature-grid { background: var(--k-cream-deep); }
.feature-item { background: #fff; border-radius: var(--radius-lg); border: 0; box-shadow: 0 10px 26px rgba(87, 73, 67, 0.1); }

/* ---------- contact ---------- */
.contact-section { background: var(--k-cream); }
.contact-form {
  background: var(--k-consider-grad);
  border-radius: var(--radius-lg);
  border: 0;
  padding: 36px 32px;
  box-shadow: 0 20px 44px rgba(87, 73, 67, 0.12);
}
.contact-field label {
  font-family: var(--font-caps);
  font-weight: 500;
  letter-spacing: 0.12em;
  font-size: 12px;
  color: var(--k-terra-deep);
}
.contact-field input,
.contact-field textarea,
.contact-field select {
  border-radius: 10px;
  border: 1.5px solid rgba(87, 73, 67, 0.14);
  background: #fff;
  font-family: var(--font-sans);
}
.contact-field input:focus,
.contact-field textarea:focus,
.contact-field select:focus {
  border-color: var(--k-peri);
  outline: 2px solid rgba(78, 104, 161, 0.2);
}
.contact-hours { background: var(--k-cream-deep); border-radius: var(--radius-lg); }
.contact-value a:hover { color: var(--k-berry); }

/* ---------- homepage additions ---------- */
.script-note.terra { color: var(--k-terra-deep); }
.script-note.mustard { color: var(--k-mustard); }
.services .caps-accent { color: var(--k-services-accent); }

.photo-scribble {
  position: absolute;
  top: -34px;
  right: 8px;
  z-index: 3;
  transform: rotate(5deg);
  margin: 0;
}
.philosophy-media { position: relative; }

.murals-feature { background: var(--k-cream); padding: 128px 32px; }
.murals-feature-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 64px;
  align-items: center;
}
.murals-photos { position: relative; height: 540px; }
.murals-photos img {
  position: absolute;
  border-radius: var(--radius-lg);
  object-fit: cover;
  box-shadow: 0 20px 44px rgba(87, 73, 67, 0.22);
}
.murals-photos .mf-a { width: 72%; height: 410px; top: 0; left: 0; }
.murals-photos .mf-b { width: 52%; height: 290px; bottom: 0; right: 0; border: 8px solid var(--k-cream); }
.murals-copy .section-lede { margin-bottom: 32px; }

@media (min-width: 1024px) {
  .murals-feature-grid { grid-template-columns: 1.15fr 1fr; }
}
@media (max-width: 767px) {
  .murals-photos { height: 420px; }
  .murals-photos .mf-a { width: 84%; height: 300px; }
  .murals-photos .mf-b { width: 58%; height: 220px; }
}

.cta-banner .script-note { display: block; }

/* ---------- focus ring ---------- */
:focus-visible { outline-color: var(--k-peri); }

/* ============================================================
   Palette B: Donda's swatch (FFC1C1 / A842AE / 8984E0 / 314CB6 / 80C5F2)
   Activated by palette-toggle.js via <html data-palette="v2">.
   ============================================================ */
[data-palette="v2"] {
  --k-peri: #314cb6;
  --k-peri-dim: #27409a;
  --k-peri-light: #8984e0;
  --k-berry: #a842ae;
  --k-terra: #ffc1c1;
  --k-terra-deep: #a842ae;
  --k-peach: #ffc1c1;
  --k-mustard: #80c5f2;
  --k-blush: #ffd9d9;

  --k-navcta-hover: #f7abab;
  --k-photo-bg: rgba(255, 193, 193, 0.45);
  --k-chip2-bg: #e6e4f8;
  --k-chip3-bg: #d9edfb;
  --k-chip3-text: #2b6ea8;
  --k-chip1-bg: #ffd9d9;
  --k-benefits-grad: linear-gradient(160deg, #fff5f5 0%, #feecef 50%, #edeafb 100%);
  --k-services-accent: #22357e;
  --k-testi-grad: linear-gradient(180deg, #80c5f2 0%, #b3dbf8 100%);
  --k-testi-eyebrow: var(--k-peri);
  --k-testi-star: var(--k-berry);
  --k-areas-grad: linear-gradient(115deg, #ffecec 0%, #eae7fb 45%, #e3f2fd 100%);
  --k-consider-grad: linear-gradient(160deg, #fff2f2 0%, #eeebfb 100%);
  --k-cta-btn-text: #1c2f52;
  --k-cta-btn-hover: #6cb8ec;
  --k-cta-home-grad: linear-gradient(115deg, #ffe9ea 0%, #eae7fa 48%, #e2f0fc 100%);
  --k-conf3: #80c5f2;
  --k-faq-bg: #eef1fb;
}

/* ---------- palette toggle button ---------- */
.palette-toggle {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 999;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid #fff;
  cursor: pointer;
  padding: 0;
  background: linear-gradient(135deg, #4e68a1 0%, #4e68a1 49%, #e2835b 51%, #e2835b 100%);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.22);
  transition: transform 0.15s ease;
}
.palette-toggle:hover { transform: scale(1.08); }
[data-palette="v2"] .palette-toggle {
  background: linear-gradient(135deg, #314cb6 0%, #314cb6 49%, #ffc1c1 51%, #ffc1c1 100%);
}