/* ONEST KIM shared design system. Loaded after route-specific styles. */
:root {
  --brand-navy: #172A46;
  --main-text: #202A35;
  --secondary-text: #66707A;
  --main-background: #FAF8F6;
  --white: #FFFFFF;
  --divider: #DEDCD8;
  --ink: var(--main-text);
  --blue: var(--brand-navy);
  --paper: var(--main-background);
  --line: var(--divider);
  --leiker-paper: var(--main-background);
  --leiker-ink: var(--main-text);
  --leiker-blue: var(--brand-navy);
  --leiker-line: var(--divider);
  --site-columns: repeat(12, minmax(0, 1fr));
  --site-gutter: 64px;
}
html { background:var(--main-background); }
body { color:var(--main-text); background:var(--main-background); }
main { max-width:1440px; margin-inline:auto; }
main.leiker-shell { max-width:1440px; }
/* Keep the existing asymmetric grids; give their outer edges one baseline. */
main > section { padding-inline:var(--site-gutter); }
main > section:not(.home-hero):not(.consult-hero):not(.zh-hero):not(.language-hero):not(.leiker-hero):not(.hero) { padding-block:120px; }
/* The header remains full width while its content aligns with the site grid. */
header { min-height:76px; height:76px; padding-inline:max(var(--site-gutter), calc((100vw - 1440px)/2 + var(--site-gutter))); background:var(--main-background); border-bottom:1px solid var(--divider); }
header .logo { color:var(--brand-navy); }
header nav { align-items:center; gap:clamp(14px, 1.6vw, 30px); }
header nav > a { font-size:14px; line-height:1.4; font-weight:500; }
header nav > a[aria-current="page"] { color:var(--brand-navy); }
header .language-switch { margin-left:10px; padding-left:20px; border-left:1px solid var(--divider); }
header .language-switch a { color:var(--secondary-text); }
header .language-switch a[aria-current="page"] { color:var(--brand-navy); }
/* A restrained type hierarchy; the original ONEST KIM serif image and LEIKER wordmark remain intact. */
.consult-hero h1, .zh-hero-lead, .language-hero h1:not(:has(img)) { font-size:clamp(52px, 4.2vw, 72px); font-weight:400; line-height:1.18; letter-spacing:-.035em; }
.statement h2, .story-copy h2, .band-main h2, .about-home h2, .contact-home h2,
.consult-intro h2, .consult-secondary h2, .consult-ingredient h2, .consult-experience h2, .consult-contact h2,
.zh-section h2, .zh-section-head h2, .zh-contact h2,
.leiker-hero-copy h2, .leiker-collection h2, .leiker-contact h2, .leiker-why-heading h2,
.portfolio-heading h1, .portfolio-heading h2, .section-head h2, .compact-detail h2, .contact-band h2 {
  font-size:clamp(42px, 3.5vw, 58px); font-weight:400; line-height:1.25; letter-spacing:-.035em;
}
.course-preview h2, .leiker-grain-copy { font-size:clamp(30px, 2.25vw, 34px); font-weight:400; line-height:1.35; letter-spacing:-.025em; }
/* Scope body sizing to long-form copy; preserve intentionally larger hero statements. */
.statement-content > p, .story-copy > p, .band-main > p, .about-home > p, .contact-home > p,
.consult-hero-copy > p, .consult-intro p, .consult-secondary p, .consult-ingredient p, .consult-experience p,
.zh-section p, .zh-contact p, .leiker-hero-copy p, .leiker-product-copy p,
.leiker-development-facts p, .compact-detail p, .portfolio-heading p {
  font-size:16px; font-weight:400; line-height:1.8; letter-spacing:-.01em; max-width:660px;
}
.overline, .section-marker, .zh-marker, .leiker-eyebrow, .eyebrow,
.leiker-granola-label, .row-number, .zh-leiker-parent {
  font-size:13px; font-weight:500; line-height:1.4; letter-spacing:.12em; text-transform:uppercase; color:var(--brand-navy);
}
.quiet-link, .text-link, .zh-link, .leiker-link, .contact-band a, .back {
  font-size:14px; font-weight:500; letter-spacing:.04em; line-height:1.5;
  color:var(--brand-navy); border-bottom:1px solid var(--brand-navy); padding-bottom:9px; min-height:44px;
}
.quiet-link:hover, .text-link:hover, .zh-link:hover, .leiker-link:hover { color:var(--brand-navy); }
.contact-option a, .contact-option button, .secondary-actions a, .course a, .submit {
  border:1px solid var(--brand-navy); background:transparent; color:var(--brand-navy);
  min-height:48px; padding:12px 18px; font-size:14px; font-weight:500; border-radius:0; box-shadow:none;
}
/* Unify fine rules, leaving photographs and image pixels untouched. */
section, article, .course-rows > div, .leiker-granola-point, .leiker-granola-flavor,
.leiker-why-item, .leiker-development-facts > div { border-color:var(--divider); }
footer { background:var(--brand-navy); color:var(--white); padding-inline:max(var(--site-gutter), calc((100vw - 1440px)/2 + var(--site-gutter))); }
footer strong { font-size:24px; line-height:1.3; }
footer p, footer a { font-size:14px; line-height:1.7; color:var(--white); }
@media (max-width:1100px) {
  :root { --site-gutter:36px; }
  header nav { gap:14px; }
  header .language-switch { margin-left:4px; padding-left:14px; }
}
@media (max-width:850px) {
  :root { --site-gutter:32px; }
  header { height:72px; min-height:72px; }
  header nav { top:72px; padding-inline:var(--site-gutter); background:var(--main-background); gap:20px; align-items:flex-start; }
  header nav > a { font-size:16px; }
  header .language-switch { margin-left:0; padding-left:0; border-left:0; }
  main > section:not(.home-hero):not(.consult-hero):not(.zh-hero):not(.language-hero):not(.leiker-hero):not(.hero) { padding-block:88px; }
  footer { padding-inline:var(--site-gutter); }
}
@media (max-width:700px) {
  :root { --site-gutter:22px; }
  main > section:not(.home-hero):not(.consult-hero):not(.zh-hero):not(.language-hero):not(.leiker-hero):not(.hero) { padding-block:72px; }
  .consult-hero h1, .language-hero h1:not(:has(img)) { font-size:clamp(34px, 8vw, 48px); }
  .statement h2, .story-copy h2, .band-main h2, .about-home h2, .contact-home h2,
  .consult-intro h2, .consult-secondary h2, .consult-ingredient h2, .consult-experience h2, .consult-contact h2,
  .zh-section h2, .zh-section-head h2, .zh-contact h2,
  .leiker-hero-copy h2, .leiker-collection h2, .leiker-contact h2, .leiker-why-heading h2,
  .portfolio-heading h1, .portfolio-heading h2, .section-head h2, .compact-detail h2, .contact-band h2 {
    font-size:clamp(31px, 7.5vw, 42px); line-height:1.3; overflow-wrap:normal; word-break:keep-all;
  }
  .course-preview h2, .leiker-grain-copy { font-size:clamp(25px, 6.3vw, 32px); }
  .zh-hero-lead { font-size:clamp(28px, 7vw, 39px); }
}
