/* ==========================================================================
   Isilti Park: two quiet colour schemes, light and dark
   Modelled on how Kompan, Vestre and Lappset use colour: white pages,
   soft black text, one colour on buttons only, a light footer.
   Load after main.css and references.css, then add
   data-palette="wordmark" or data-palette="quiet" to the <html> tag.
   Without the attribute nothing changes.
   ========================================================================== */

/* Wordmark blue --------------------------------------------------------- */
html[data-palette="wordmark"] {
  --canvas: #ffffff;
  --surface: #ffffff;
  --stone: #f3f5f5;
  --stone-2: #e8ebeb;
  --line: #e1e4e4;
  --ink: #1b1d1e;
  --muted: #5e6366;
  --petrol: #123B52;
  --petrol-dark: #0d2b3c;
  --night: #1b1d1e;
  --teal: #123B52;
  --sun: #e8ebeb;
  --line-strong: #868c8f;
  --ink-disabled: #a4a8aa;
  --accent-tint: #e4edf2;
  --glint: #123B52;
  --brand-petrol: #123B52;
  --brand-night: #1b1d1e;
  --brand-stone: #f3f5f5;
  --brand-snow: #ffffff;
  --shadow: 0 18px 50px rgba(27,29,30,.08);
  --shadow-overlay: 0 24px 48px -16px rgba(27,29,30,.18), 0 2px 6px rgba(27,29,30,.06);
}
html[data-palette="wordmark"][data-theme="dark"] {
  --canvas: #141617;
  --surface: #1b1d1f;
  --stone: #1f2224;
  --stone-2: #2a2d30;
  --line: #2e3235;
  --ink: #ebeceb;
  --muted: #a0a5a8;
  --petrol: #7fb0cc;
  --petrol-dark: #a9cde0;
  --night: #0f1112;
  --line-strong: #7c8286;
  --ink-disabled: #5f6467;
  --accent-tint: #1a3347;
  --glint: #7fb0cc;
  --focus: #a9cde0;
  --action: #123B52;
  --action-hover: #0d2b3c;
  --on-action: #ffffff;
  --link: #7fb0cc;
  --link-hover: #a9cde0;
}
html[data-palette="wordmark"] .eyebrow { color: var(--muted); }
html[data-palette="wordmark"] .button-primary { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"] .button-primary:hover { background: #0d2b3c; }
html[data-palette="wordmark"][data-theme="dark"] .button-primary { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"][data-theme="dark"] .button-primary:hover { background: #0d2b3c; }
html[data-palette="wordmark"] .button-light:hover { background: var(--stone); }
html[data-palette="wordmark"] .saved-products-link span { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"][data-theme="dark"] .saved-products-link span { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"]:not([data-theme="dark"]) .site-footer { background: var(--stone); color: var(--ink); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-lead { border-bottom-color: var(--line); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-grid h3 { color: var(--muted); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-grid a, html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-grid p { color: #3d4245; }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-grid a:hover, html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-region:hover { color: var(--ink); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-bottom { border-top-color: var(--line); color: var(--muted); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-social a { border-color: var(--line-strong); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .footer-social a:hover { background: var(--ink); color: var(--surface); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .site-footer .button-light { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"]:not([data-theme="dark"]) .site-footer .button-light:hover { background: #0d2b3c; }
html[data-palette="wordmark"]:not([data-theme="dark"]) .project-card-feature { background: var(--surface); color: var(--ink); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .project-card-feature p:not(.eyebrow) { color: var(--muted); }
html[data-palette="wordmark"]:not([data-theme="dark"]) .project-card-feature .button-light { background: #123B52; color: #ffffff; }
html[data-palette="wordmark"]:not([data-theme="dark"]) .project-card-feature .button-light:hover { background: #0d2b3c; }
html[data-palette="wordmark"] .product-subnav, html[data-palette="wordmark"] .mobile-product-bar { --sb-bg: var(--surface); --sb-ink: var(--ink); --sb-soft: var(--muted); --sb-btn-bg: #123B52; --sb-btn-ink: #ffffff; }
html[data-palette="wordmark"][data-theme="dark"] .product-subnav, html[data-palette="wordmark"][data-theme="dark"] .mobile-product-bar { --sb-bg: var(--surface); --sb-ink: var(--ink); --sb-soft: var(--muted); --sb-btn-bg: #123B52; --sb-btn-ink: #ffffff; }
html[data-palette="wordmark"] .ip-viewer[data-theme="night"] {
  --canvas: #141617;
  --surface: #1b1d1f;
  --stone: #1f2224;
  --stone-2: #2a2d30;
  --surface-alt: #1f2224;
  --surface-alt-strong: #2a2d30;
  --line: #2e3235;
  --line-strong: #7c8286;
  --ink: #ebeceb;
  --muted: #a0a5a8;
  --ink-muted: #a0a5a8;
  --ink-disabled: #5f6467;
  --action: #ebeceb;
  --action-hover: #a9cde0;
  --on-action: #141617;
  --link: #7fb0cc;
  --link-hover: #a9cde0;
  --accent-tint: #1a3347;
  --glint: #7fb0cc;
  --focus: #a9cde0;
}
html[data-palette="wordmark"] .home-hero-media::after { background: linear-gradient(rgba(27,29,30,.42) 0%, rgba(27,29,30,.12) 30%, rgba(27,29,30,0) 56%, rgba(27,29,30,.3) 100%), linear-gradient(95deg, rgba(27,29,30,.28) 0%, rgba(27,29,30,0) 62%); }
html[data-palette="wordmark"] .category-card-shade { background: linear-gradient(0deg, rgba(27,29,30,.78), rgba(27,29,30,.02) 66%); }
html[data-palette="wordmark"] .compact-form { background: rgba(27,29,30,.32); }
html[data-palette="wordmark"] .search-scrim { background: rgba(27,29,30,.55); }
html[data-palette="wordmark"] .region-dialog__scrim { background: rgba(27,29,30,.6); }
html[data-palette="wordmark"] .gallery-lightbox__scrim { background: rgba(27,29,30,.9); }
html[data-palette="wordmark"] .region-dialog__panel { background: var(--canvas); }
html[data-palette="wordmark"] .mega-menu { box-shadow: 0 22px 40px rgba(27,29,30,.08); }
html[data-palette="wordmark"] .ip-feature__media, html[data-palette="wordmark"] .single-reference { background: #141617; }

/* Quiet ----------------------------------------------------------------- */
html[data-palette="quiet"] {
  --canvas: #ffffff;
  --surface: #ffffff;
  --stone: #f3f3f2;
  --stone-2: #e8e8e6;
  --line: #e2e2df;
  --ink: #1c1c1b;
  --muted: #62625e;
  --petrol: #1c1c1b;
  --petrol-dark: #3d3d3b;
  --night: #1c1c1b;
  --teal: #1c1c1b;
  --sun: #e8e8e6;
  --line-strong: #8b8b87;
  --ink-disabled: #a5a5a1;
  --accent-tint: #f0f0ee;
  --glint: #1c1c1b;
  --brand-petrol: #1c1c1b;
  --brand-night: #1c1c1b;
  --brand-stone: #f3f3f2;
  --brand-snow: #ffffff;
  --shadow: 0 18px 50px rgba(28,28,27,.08);
  --shadow-overlay: 0 24px 48px -16px rgba(28,28,27,.18), 0 2px 6px rgba(28,28,27,.06);
}
html[data-palette="quiet"][data-theme="dark"] {
  --canvas: #161615;
  --surface: #1d1d1c;
  --stone: #222221;
  --stone-2: #2b2b2a;
  --line: #31312f;
  --ink: #ededea;
  --muted: #a3a39e;
  --petrol: #ededea;
  --petrol-dark: #d6d6d2;
  --night: #10100f;
  --line-strong: #80807b;
  --ink-disabled: #62625e;
  --accent-tint: #2a2a28;
  --glint: #ededea;
  --focus: #ededea;
  --action: #ededea;
  --action-hover: #d6d6d2;
  --on-action: #161615;
  --link: #ededea;
  --link-hover: #ffffff;
}
html[data-palette="quiet"] .eyebrow { color: var(--muted); }
html[data-palette="quiet"] .button-primary { background: #1c1c1b; color: #ffffff; }
html[data-palette="quiet"] .button-primary:hover { background: #3d3d3b; }
html[data-palette="quiet"][data-theme="dark"] .button-primary { background: #ededea; color: #161615; }
html[data-palette="quiet"][data-theme="dark"] .button-primary:hover { background: #d6d6d2; }
html[data-palette="quiet"] .button-light:hover { background: var(--stone); }
html[data-palette="quiet"] .saved-products-link span { background: #1c1c1b; color: #ffffff; }
html[data-palette="quiet"][data-theme="dark"] .saved-products-link span { background: #ededea; color: #161615; }
html[data-palette="quiet"]:not([data-theme="dark"]) .site-footer { background: var(--stone); color: var(--ink); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-lead { border-bottom-color: var(--line); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-grid h3 { color: var(--muted); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-grid a, html[data-palette="quiet"]:not([data-theme="dark"]) .footer-grid p { color: #3f3f3d; }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-grid a:hover, html[data-palette="quiet"]:not([data-theme="dark"]) .footer-region:hover { color: var(--ink); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-bottom { border-top-color: var(--line); color: var(--muted); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-social a { border-color: var(--line-strong); }
html[data-palette="quiet"]:not([data-theme="dark"]) .footer-social a:hover { background: var(--ink); color: var(--surface); }
html[data-palette="quiet"]:not([data-theme="dark"]) .site-footer .button-light { background: #1c1c1b; color: #ffffff; }
html[data-palette="quiet"]:not([data-theme="dark"]) .site-footer .button-light:hover { background: #3d3d3b; }
html[data-palette="quiet"]:not([data-theme="dark"]) .project-card-feature { background: var(--surface); color: var(--ink); }
html[data-palette="quiet"]:not([data-theme="dark"]) .project-card-feature p:not(.eyebrow) { color: var(--muted); }
html[data-palette="quiet"]:not([data-theme="dark"]) .project-card-feature .button-light { background: #1c1c1b; color: #ffffff; }
html[data-palette="quiet"]:not([data-theme="dark"]) .project-card-feature .button-light:hover { background: #3d3d3b; }
html[data-palette="quiet"] .product-subnav, html[data-palette="quiet"] .mobile-product-bar { --sb-bg: var(--surface); --sb-ink: var(--ink); --sb-soft: var(--muted); --sb-btn-bg: #1c1c1b; --sb-btn-ink: #ffffff; }
html[data-palette="quiet"][data-theme="dark"] .product-subnav, html[data-palette="quiet"][data-theme="dark"] .mobile-product-bar { --sb-bg: var(--surface); --sb-ink: var(--ink); --sb-soft: var(--muted); --sb-btn-bg: #ededea; --sb-btn-ink: #161615; }
html[data-palette="quiet"] .ip-viewer[data-theme="night"] {
  --canvas: #161615;
  --surface: #1d1d1c;
  --stone: #222221;
  --stone-2: #2b2b2a;
  --surface-alt: #222221;
  --surface-alt-strong: #2b2b2a;
  --line: #31312f;
  --line-strong: #80807b;
  --ink: #ededea;
  --muted: #a3a39e;
  --ink-muted: #a3a39e;
  --ink-disabled: #62625e;
  --action: #ededea;
  --action-hover: #d6d6d2;
  --on-action: #161615;
  --link: #ededea;
  --link-hover: #ffffff;
  --accent-tint: #2a2a28;
  --glint: #ededea;
  --focus: #ededea;
}
html[data-palette="quiet"] .home-hero-media::after { background: linear-gradient(rgba(28,28,27,.42) 0%, rgba(28,28,27,.12) 30%, rgba(28,28,27,0) 56%, rgba(28,28,27,.3) 100%), linear-gradient(95deg, rgba(28,28,27,.28) 0%, rgba(28,28,27,0) 62%); }
html[data-palette="quiet"] .category-card-shade { background: linear-gradient(0deg, rgba(28,28,27,.78), rgba(28,28,27,.02) 66%); }
html[data-palette="quiet"] .compact-form { background: rgba(28,28,27,.32); }
html[data-palette="quiet"] .search-scrim { background: rgba(28,28,27,.55); }
html[data-palette="quiet"] .region-dialog__scrim { background: rgba(28,28,27,.6); }
html[data-palette="quiet"] .gallery-lightbox__scrim { background: rgba(28,28,27,.9); }
html[data-palette="quiet"] .region-dialog__panel { background: var(--canvas); }
html[data-palette="quiet"] .mega-menu { box-shadow: 0 22px 40px rgba(28,28,27,.08); }
html[data-palette="quiet"] .ip-feature__media, html[data-palette="quiet"] .single-reference { background: #161615; }