/* Visitor presets. Keep colors, material and geometry together in either mode.
   The published design is deliberately outside this scope. */
html[data-design] {
  color-scheme: light;
  --design-hue: 160;
  --design-accent-hue: var(--design-hue);
  --design-dark-lightness: 18%;
  --design-dark-chroma: .018;
  --design-material: none;
  --design-material-size: auto;
  --design-card-radius: var(--radius-lg);
  --design-heading-weight: 700;
  --design-heading-spacing: -.035em;
  --design-brand-ink: #102c45;
  --design-brand-accent: #00636b;
  --design-brand-filter: url(#brand-option3-light);
  --design-link: oklch(43% .12 var(--design-accent-hue));
  --color-ink-strong: var(--color-ink);
  --color-paper-soft: color-mix(in srgb, var(--color-paper) 92%, var(--color-ink));
  --color-panel-raised: color-mix(in srgb, var(--color-panel) 95%, var(--color-ink));
  --color-focus: var(--design-link);
  --design-texture-ink: color-mix(in srgb, var(--color-ink) 6%, transparent);
}

/* Each dark counterpart retains its own hue, surface depth and accent. */
html[data-design][data-theme="dark"] {
  --color-paper: oklch(var(--design-dark-lightness) var(--design-dark-chroma) var(--design-hue));
  --color-panel: oklch(calc(var(--design-dark-lightness) + 6%) var(--design-dark-chroma) var(--design-hue));
  --color-header: oklch(var(--design-dark-lightness) var(--design-dark-chroma) var(--design-hue) / 97%);
  --color-ink: oklch(95% .012 var(--design-hue));
  --color-muted: oklch(77% .025 var(--design-hue));
  --color-rule: oklch(40% .035 var(--design-hue));
}

/* These nocturnal presets have dark surfaces even with the Light preference.
   Their foreground, artwork filter and native controls must follow the surface. */
html[data-design][data-theme="dark"],
html:is([data-design="midnight"], [data-design="bloom"], [data-design="violet"], [data-design="aurora"], [data-design="obsidian"]) {
  color-scheme: dark;
  --design-brand-ink: #f4f7fb;
  --design-brand-accent: #00d9df;
  --design-brand-filter: url(#brand-option3-dark);
  --design-link: oklch(82% .10 var(--design-accent-hue));
  --color-accent: oklch(76% .12 var(--design-accent-hue));
  --color-accent-strong: oklch(84% .09 var(--design-accent-hue));
  --color-accent-ink: oklch(14% .018 var(--design-hue));
}

/* Editorial and tactile families. Fonts use installed fallbacks; no new font requests. */
html[data-design="specimen"] {
  --design-hue: 65; --design-accent-hue: 24;
  --font-display: Georgia, 'Times New Roman', serif;
  --design-heading-weight: 400;
  --radius-sm: 2px; --radius-md: 2px; --radius-lg: 2px; --radius-xl: 2px;
  --shadow-soft: none;
}
html[data-design="atelier"] {
  --design-hue: 82; --design-accent-hue: 145; --design-dark-lightness: 22%;
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --design-heading-weight: 400;
  --design-card-radius: 28px 4px 28px 4px;
  --design-material: repeating-linear-gradient(0deg, var(--design-texture-ink) 0 1px, transparent 1px 5px);
}
html[data-theme="light"]:is([data-design="atelier"], [data-design="coral"], [data-design="plume"], [data-design="riso"]) {
  --color-accent: oklch(49% .13 var(--design-accent-hue));
  --color-accent-strong: oklch(41% .11 var(--design-accent-hue));
  --color-accent-ink: #fff;
}
html[data-design="brutal"] {
  --design-hue: 250; --design-accent-hue: 28; --design-dark-chroma: .008;
  --font-display: 'Arial Black', Arial, sans-serif;
  --design-heading-spacing: -.05em;
  --shadow-soft: 6px 6px 0 var(--color-rule);
}
html[data-design="salon"] {
  --design-hue: 28; --design-accent-hue: 358; --design-dark-lightness: 22%;
  --font-display: Georgia, 'Times New Roman', serif;
  --design-heading-weight: 400;
  --radius-md: 18px; --radius-lg: 32px; --radius-xl: 40px;
  --design-material: radial-gradient(ellipse at 50% 0, color-mix(in srgb, var(--color-accent) 12%, transparent), transparent 65%);
  --design-material-size: 100% 1000px;
}
html[data-design="newsprint"] {
  --design-hue: 82; --design-accent-hue: 226; --design-dark-chroma: .008;
  --font-display: 'Times New Roman', Times, serif;
  --font-body: Georgia, 'Times New Roman', serif;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --radius-xl: 0;
  --theme-card-border-style: double; --theme-card-border-width: 3px;
  --design-material: radial-gradient(var(--design-texture-ink) .7px, transparent .7px);
  --design-material-size: 4px 4px;
}
html[data-design="linen"] {
  --design-hue: 105; --design-accent-hue: 165; --design-dark-lightness: 24%;
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --design-heading-weight: 400;
  --radius-md: 3px; --radius-lg: 3px;
  --design-material: repeating-linear-gradient(0deg, var(--design-texture-ink) 0 1px, transparent 1px 4px), repeating-linear-gradient(90deg, var(--design-texture-ink) 0 1px, transparent 1px 4px);
}
html[data-design="studio"] {
  --design-hue: 160; --design-accent-hue: 164;
  --font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --radius-md: 8px; --radius-lg: 16px;
}
html[data-design="manifesto"] {
  --design-hue: 28; --design-accent-hue: 24; --design-dark-chroma: .035;
  --font-display: Impact, 'Arial Narrow', sans-serif;
  --design-heading-weight: 400; --design-heading-spacing: .015em;
  --shadow-soft: 8px 8px 0 var(--color-rule);
}
html[data-design="terminal"] {
  --design-hue: 155; --design-accent-hue: 145; --design-dark-lightness: 12%; --design-dark-chroma: .03;
  --design-material: repeating-linear-gradient(0deg, var(--design-texture-ink) 0 1px, transparent 1px 6px);
  --design-heading-spacing: -.045em;
}
html[data-design="midnight"] {
  --design-hue: 260; --design-accent-hue: 222; --design-dark-lightness: 14%; --design-dark-chroma: .04;
  --font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --radius-sm: 2px; --radius-md: 3px; --radius-lg: 4px; --radius-xl: 4px;
  --theme-card-top-rule: 3px;
  --shadow-soft: 0 20px 48px #0005;
}
html[data-design="almanac"] {
  --design-hue: 88; --design-accent-hue: 135; --design-dark-lightness: 21%;
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --font-ui: Consolas, 'Courier New', monospace;
  --design-heading-weight: 400;
  --design-material: linear-gradient(var(--design-texture-ink) 1px, transparent 1px);
  --design-material-size: 100% 32px;
}
html[data-design="garden"] {
  --design-hue: 145; --design-accent-hue: 150; --design-dark-chroma: .04;
  --font-display: 'Trebuchet MS', sans-serif;
  --design-card-radius: 30px 8px 30px 8px;
  --design-material: radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--color-accent) 13%, transparent), transparent 60%);
  --design-material-size: 100% 900px;
}
html[data-design="quiet"] {
  --design-hue: 250; --design-accent-hue: 245; --design-dark-lightness: 20%; --design-dark-chroma: .005;
  --font-display: system-ui, sans-serif;
  --design-heading-weight: 400; --design-heading-spacing: -.05em;
  --theme-card-border-width: 0px; --theme-card-top-rule: 1px;
  --radius-md: 2px; --radius-lg: 0; --radius-xl: 0;
}
html[data-design="riso"] {
  --design-hue: 290; --design-accent-hue: 330; --design-dark-chroma: .035;
  --font-display: 'Courier New', monospace;
  --design-material: radial-gradient(var(--design-texture-ink) 1px, transparent 1px);
  --design-material-size: 5px 5px;
}
html[data-design="sport"] {
  --design-hue: 240; --design-accent-hue: 92; --design-dark-lightness: 17%; --design-dark-chroma: .03;
  --font-display: Impact, 'Arial Narrow', sans-serif;
  --design-heading-weight: 400; --design-heading-spacing: .025em;
  --design-card-radius: 2px 20px 2px 2px;
}
html[data-design="bloom"] {
  --design-hue: 300; --design-accent-hue: 330; --design-dark-lightness: 16%; --design-dark-chroma: .045;
  --font-display: Georgia, 'Times New Roman', serif;
  --design-heading-weight: 400;
  --radius-md: 18px; --radius-lg: 32px; --radius-xl: 44px;
  --design-material: radial-gradient(ellipse at 10% 20%, color-mix(in srgb, var(--color-accent) 13%, transparent), transparent 55%), radial-gradient(ellipse at 90% 80%, color-mix(in srgb, var(--color-warm) 8%, transparent), transparent 55%);
  --design-material-size: 100% 1100px;
}
html[data-design="coral"] {
  --design-hue: 36; --design-accent-hue: 24; --design-dark-lightness: 23%; --design-dark-chroma: .04;
  --font-display: 'Trebuchet MS', sans-serif;
  --design-card-radius: 20px 20px 4px 20px;
}
html[data-design="violet"] {
  --design-hue: 285; --design-accent-hue: 292; --design-dark-lightness: 18%; --design-dark-chroma: .045;
  --font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --theme-title-transform: uppercase; --design-heading-spacing: .015em;
  --radius-sm: 0; --radius-md: 2px; --radius-lg: 2px; --radius-xl: 2px;
  --design-material: repeating-linear-gradient(135deg, var(--design-texture-ink) 0 1px, transparent 1px 14px);
  --shadow-soft: 5px 5px 0 color-mix(in srgb, var(--color-accent) 25%, transparent);
}
html[data-design="aurora"] {
  --design-hue: 210; --design-accent-hue: 178; --design-dark-lightness: 15%; --design-dark-chroma: .04;
  --font-display: 'Trebuchet MS', sans-serif;
  --radius-md: 14px; --radius-lg: 24px; --radius-xl: 32px;
  --design-material: radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--color-accent) 18%, transparent), transparent 60%), radial-gradient(ellipse at 100% 50%, color-mix(in srgb, var(--color-warm) 12%, transparent), transparent 60%);
  --design-material-size: 100% 1100px;
}
html[data-design="halo"] {
  --design-hue: 72; --design-accent-hue: 72; --design-dark-lightness: 23%;
  --font-display: 'Trebuchet MS', sans-serif;
  --radius-md: 16px; --radius-lg: 28px;
  --design-material: radial-gradient(circle at 50% 0, color-mix(in srgb, var(--color-accent) 16%, transparent), transparent 55%);
  --design-material-size: 100% 900px;
}
html[data-design="plume"] {
  --design-hue: 300; --design-accent-hue: 296; --design-dark-lightness: 24%;
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --design-heading-weight: 400;
  --design-card-radius: 36px 36px 6px 6px;
}
html[data-design="editorial"] {
  --design-hue: 72; --design-accent-hue: 18; --design-dark-lightness: 16%; --design-dark-chroma: .006;
  --font-display: Georgia, 'Times New Roman', serif;
  --design-heading-weight: 400;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --radius-xl: 0;
  --theme-card-top-rule: 3px; --shadow-soft: none;
}

/* Four new compositions: technical grid, art gallery, warm paper, dark metal. */
html:is([data-design="blueprint"], [data-design="gallery"], [data-design="parchment"]) {
  --color-paper: oklch(97% .015 var(--design-hue));
  --color-panel: oklch(99% .008 var(--design-hue));
  --color-header: oklch(97% .015 var(--design-hue) / 97%);
  --color-ink: oklch(24% .025 var(--design-hue));
  --color-muted: oklch(45% .025 var(--design-hue));
  --color-rule: oklch(77% .03 var(--design-hue));
  --color-accent: oklch(47% .12 var(--design-accent-hue));
  --color-accent-strong: oklch(39% .10 var(--design-accent-hue));
  --color-accent-ink: #fff;
}
html[data-design="blueprint"] {
  --design-hue: 250; --design-accent-hue: 245; --design-dark-lightness: 22%; --design-dark-chroma: .05;
  --font-display: Consolas, 'Courier New', monospace;
  --font-ui: Consolas, 'Courier New', monospace;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --radius-xl: 0;
  --theme-card-border-style: dashed; --theme-hero-align: left; --theme-section-align: left;
  --design-material: linear-gradient(var(--design-texture-ink) 1px, transparent 1px), linear-gradient(90deg, var(--design-texture-ink) 1px, transparent 1px);
  --design-material-size: 32px 32px;
  --shadow-soft: 5px 5px 0 color-mix(in srgb, var(--color-accent) 18%, transparent);
}
html[data-design="gallery"] {
  --design-hue: 65; --design-accent-hue: 48; --design-dark-lightness: 14%; --design-dark-chroma: .004;
  --font-display: 'Times New Roman', Times, serif;
  --font-body: system-ui, sans-serif;
  --design-heading-weight: 400; --design-heading-spacing: -.045em;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --radius-xl: 0;
  --theme-card-border-width: 0px; --theme-card-top-rule: 1px;
  --theme-gap: 2rem; --shadow-soft: none;
}
html[data-design="parchment"] {
  --design-hue: 80; --design-accent-hue: 40; --design-dark-lightness: 25%; --design-dark-chroma: .03;
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --font-body: Georgia, 'Times New Roman', serif;
  --design-heading-weight: 400;
  --radius-sm: 2px; --radius-md: 3px; --radius-lg: 3px; --radius-xl: 3px;
  --theme-card-border-style: double; --theme-card-border-width: 3px;
  --theme-hero-align: left; --theme-section-align: left;
  --design-material: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23887755' opacity='.12' filter='url(%23paper)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  --design-material-size: 180px 180px;
  --shadow-soft: 0 3px 0 var(--color-paper), 0 4px 0 var(--color-rule), 0 12px 24px #0001;
}
html[data-design="obsidian"] {
  --design-hue: 70; --design-accent-hue: 82; --design-dark-lightness: 13%; --design-dark-chroma: .008;
  --color-paper: oklch(13% .008 70); --color-panel: oklch(19% .008 70);
  --color-header: oklch(13% .008 70 / 97%); --color-ink: oklch(95% .012 70);
  --color-muted: oklch(77% .025 70); --color-rule: oklch(40% .035 70);
  --font-display: 'Palatino Linotype', Palatino, Georgia, serif;
  --design-heading-weight: 400; --design-heading-spacing: .01em;
  --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --radius-xl: 0;
  --theme-card-border-style: double; --theme-card-border-width: 3px;
  --theme-gap: 1.75rem; --shadow-soft: 0 16px 40px #0004;
}

/* Apply the presets to the current home, catalogue and product components,
   including components that predate the design tokens. */
html[data-design] body {
  background-image: var(--design-material);
  background-size: var(--design-material-size);
  --doc-content-font-family: var(--font-body);
}
/* Published product sections also carry site-themed. Reset their local palette
   when a visitor selects a preset, while retaining intentionally dark sections. */
html[data-design] .site-themed {
  --font-body: inherit; --font-display: inherit;
  --doc-content-font-family: var(--font-body);
  --bg: inherit; --bg-card: inherit; --bg-header: inherit;
  --primary: inherit; --accent: inherit; --text: inherit; --text-muted: inherit;
  --surface: var(--bg-card);
  font-family: var(--font-body);
  background: var(--bg-card);
  color: var(--text);
}
html[data-design] .landing-block.theme-light { background: var(--bg); }
html[data-design] .landing-block.theme-dark {
  --bg: oklch(15% .025 var(--design-hue));
  --bg-card: oklch(21% .025 var(--design-hue));
  --text: oklch(95% .012 var(--design-hue));
  --text-muted: oklch(78% .025 var(--design-hue));
  --border: oklch(42% .035 var(--design-hue));
  --primary: oklch(76% .12 var(--design-accent-hue));
  --primary-dark: oklch(84% .09 var(--design-accent-hue));
  --color-accent-ink: oklch(14% .018 var(--design-hue));
  --design-link: oklch(82% .10 var(--design-accent-hue));
  background: var(--bg);
}
html[data-design] .site-themed .btn-primary { background: var(--primary); color: var(--color-accent-ink); border-color: var(--primary); }
html[data-design] .site-themed .btn-primary:hover { background: var(--primary-dark); }
html[data-design] .site-themed .btn-outline { color: var(--text); border-color: var(--border); }
html[data-design] .site-themed a:not(.btn) { color: var(--design-link); }
html[data-design] .landing-block img { border-radius: var(--radius-md); }
html[data-design] :is(h1, h2, h3) { font-family: var(--font-display); }
html[data-design] :is(.showcase-copy h1, .section-title, .close-panel h2, .catalog-detail-hero h1) {
  font-weight: var(--design-heading-weight);
  letter-spacing: var(--design-heading-spacing);
  text-transform: var(--theme-title-transform);
  line-height: 1.1;
}
html[data-design] :is(.nav-actions, .nav-links, .btn, .catalog-badge, .catalog-eyebrow, .workbench-strip) { font-family: var(--font-ui); }
html[data-design] :is(.catalog-card, .catalog-plan, .pricing-product, .product-card, .workbench-panel, .catalog-story section, .catalog-cta) {
  border: var(--theme-card-border-width) var(--theme-card-border-style) var(--border);
  border-top-width: max(var(--theme-card-border-width), var(--theme-card-top-rule));
  border-radius: var(--design-card-radius);
  background: var(--bg-card);
  box-shadow: var(--shadow-soft);
}
html[data-design] .catalog-plan.featured { border-color: var(--primary); }
html[data-design] .home-catalog .catalog-grid { gap: var(--theme-gap); }
html[data-design] :is(.landing-block, .close-panel, .home-section-image, .catalog-detail-hero img, .blog-article-cover) { border-radius: var(--radius-xl); }
html[data-design] :is(.style-select, .catalog-tabs a, .catalog-filters select, .catalog-search input, .workbench-shot, .home-product-icon) { border-radius: var(--radius-md); }
html[data-design] :is(.catalog-link, .catalog-back, .catalog-eyebrow, .home-product-arrow, .lang-option.active) { color: var(--design-link); }
html[data-design] .catalog-badge:not(.catalog-free) { color: var(--design-link); }
html[data-design] .catalog-tabs a.active { color: var(--color-accent-ink); }
html[data-design] .catalog-picture { background: var(--color-paper-soft); }
html[data-design] .catalog-monogram { color: var(--design-link); }
html[data-design] .home-hero .showcase-copy { text-align: var(--theme-hero-align); }
html[data-design] .home-hero .showcase-actions { justify-content: var(--theme-hero-align); }
html[data-design] .home-hero .showcase-copy :is(h1, p) { margin-inline: auto; }
html[data-design] .section-sub { margin-inline: var(--theme-section-margin, auto); }

html:is([data-design="blueprint"], [data-design="parchment"]) { --theme-section-margin: 0; }
html:is([data-design="editorial"], [data-design="newsprint"], [data-design="obsidian"]) .section-lead {
  border-top: 3px double var(--border); padding-top: 1.25rem;
}
html:is([data-design="bloom"], [data-design="salon"], [data-design="plume"]) .showcase-copy h1 { font-style: italic; }
html:is([data-design="garden"], [data-design="plume"], [data-design="bloom"], [data-design="halo"]) .btn { border-radius: 999px; }
html[data-design="aurora"] body :is(.workbench-panel, .catalog-card) {
  background: linear-gradient(135deg, color-mix(in srgb, var(--bg-card) 95%, var(--primary)), var(--bg-card));
}
html[data-design="gallery"] body :is(.workbench-panel, .catalog-card) { background: transparent; }
html[data-design="gallery"] .workbench-panel { padding: 1.5rem 0; border-bottom: 1px solid var(--border); }
html[data-design="gallery"] .section-lead { padding-block: 1rem; }
html[data-design="blueprint"] .workbench-strip span { border-style: dashed; }
html[data-design="obsidian"] :is(.section-title, .catalog-eyebrow) { color: var(--design-link); }

@media (max-width: 600px) {
  html[data-design] .home-section:first-of-type { padding-top: calc(var(--theme-header-height) + 1.5rem); }
  html[data-design] .header .style-select { width: 110px; flex: 0 0 110px; }
}