:root {
  --ground:#4A1F22;
  --ground-deep:#381518;
  --ground-surface:#572528;
  --ground-elevated:#662B2F;
  --ground-subtle:#3F191C;
  --ground-overlay:rgba(56, 21, 24, 0.88);
  --ground-translucent:rgba(74, 31, 34, 0.92);

  --ink:#F7F2EB;
  --ink-muted:#E2D9CE;
  --ink-faint:#C8BAAA;
  --ink-subtle:#9E8D7D;
  --ink-inverse:#240E10;

  --accent:#D4AF37;
  --accent-dim:#9E7D23;
  --accent-soft:rgba(212, 175, 55, 0.14);
  --accent-hover:#E5C358;
  --accent-glow:rgba(212, 175, 55, 0.28);

  --rule:rgba(247, 242, 235, 0.16);
  --rule-strong:rgba(212, 175, 55, 0.45);
  --rule-faint:rgba(247, 242, 235, 0.08);

  --biru-fad:'Cinzel', serif;
  --biru-038:'Mulish', sans-serif;
  --biru-a04:'JetBrains Mono', monospace;

  --font-size-xs:clamp(0.72rem, 0.7rem + 0.12vw, 0.8rem);
  --font-size-sm:clamp(0.84rem, 0.81rem + 0.16vw, 0.94rem);
  --font-size-base:clamp(0.96rem, 0.92rem + 0.2vw, 1.08rem);
  --font-size-md:clamp(1.12rem, 1.04rem + 0.35vw, 1.32rem);
  --font-size-lg:clamp(1.36rem, 1.22rem + 0.65vw, 1.72rem);
  --font-size-xl:clamp(1.75rem, 1.5rem + 1.2vw, 2.45rem);
  --font-size-2xl:clamp(2.2rem, 1.85rem + 1.8vw, 3.4rem);
  --font-size-display:clamp(2.6rem, 2.1rem + 2.8vw, 4.4rem);

  --line-height-tight:1.15;
  --line-height-heading:1.25;
  --line-height-snug:1.4;
  --line-height-body:1.62;
  --line-height-loose:1.8;

  --tracking-tight:-0.015em;
  --tracking-normal:0em;
  --tracking-wide:0.04em;
  --tracking-caps:0.1em;
  --tracking-wider:0.16em;

  --shell-max:1360px;
  --measure-prose:68ch;
  --measure-narrow:46ch;
  --measure-wide:86ch;
  --nav-rail-width:76px;

  --gutter:clamp(1.25rem, 3.5vw, 3rem);
  --space-3xs:0.25rem;
  --space-2xs:0.5rem;
  --space-xs:0.75rem;
  --space-sm:1rem;
  --space-md:1.5rem;
  --space-lg:2.25rem;
  --space-xl:3.5rem;
  --space-2xl:5rem;
  --space-3xl:7.5rem;

  --radius-xs:1px;
  --radius-sm:2px;
  --radius-md:4px;

  --motion-fast:160ms;
  --motion-base:240ms;
  --motion-deliberate:420ms;
  --motion-slow:720ms;

  --ease-standard:cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring:cubic-bezier(0.18, 0.89, 0.32, 1.28);
  --ease-inout:cubic-bezier(0.65, 0, 0.35, 1);

  --z-base:1;
  --z-nav:50;
  --z-header:60;
  --z-chat:70;
  --z-banner:80;
  --z-modal:90;
  --z-cursor:100;
}

*, *::before, *::after {
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html {
  font-size:100%;
  background-color:var(--ground);
  color:var(--ink);
  color-scheme:dark;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--space-xl) + 1rem);
}

body {
  min-height:100vh;
  background-color:var(--ground);
  color:var(--ink);
  font-family:var(--biru-038);
  font-size:var(--font-size-base);
  font-weight:400;
  line-height:var(--line-height-body);
  letter-spacing:var(--tracking-normal);
  overflow-x:hidden;
  position:relative;
  background-image: 
    radial-gradient(ellipse at 85% 8%, rgba(212, 175, 55, 0.05) 0%, transparent 45%),
    radial-gradient(ellipse at 15% 90%, rgba(56, 21, 24, 0.6) 0%, transparent 60%);
  background-attachment:fixed;
}

img, picture, svg, video {
  display:block;
  max-width:100%;
  height:auto;
}

svg.icon {
  width:1.15em;
  height:1.15em;
  display:inline-block;
  vertical-align:-0.18em;
  fill:currentColor;
  flex-shrink:0;
}

a {
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--accent-dim);
  text-underline-offset:0.22em;
  transition:color var(--motion-fast) ease, text-decoration-color var(--motion-fast) ease;
}

a:hover {
  color:var(--accent);
  text-decoration-color:var(--accent);
}

a:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:3px;
}

h1, h2, h3, h4, h5, h6 {
  font-family:var(--biru-fad);

  font-weight:700;
  line-height:var(--line-height-heading);
  letter-spacing:var(--tracking-tight);
  color:var(--ink);
  text-wrap:balance;
  overflow-wrap:break-word;
}

h1 {
  font-size:var(--font-size-display);
  font-weight:900;
  letter-spacing:var(--tracking-tight);
  line-height:var(--line-height-tight);
}

h2 {
  font-size:var(--font-size-2xl);
  font-weight:700;
}

h3 {
  font-size:var(--font-size-xl);
  font-weight:700;
}

h4 {
  font-size:var(--font-size-lg);
  font-weight:600;
}

h5 {
  font-size:var(--font-size-md);
  font-weight:600;
}

h6 {
  font-size:var(--font-size-sm);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:var(--tracking-caps);
}

p {
  margin-block-end:var(--space-md);
  max-width:var(--measure-prose);
  color:var(--ink-muted);
}

p:last-child { margin-block-end:0; }

strong, b {
  font-weight:700;
  color:var(--ink);
}

em, i {
  font-style:italic;

  color:var(--ink);
}

small {
  font-size:var(--font-size-xs);
  line-height:var(--line-height-snug);
  color:var(--ink-faint);
}

code, kbd, samp, pre {
  font-family:var(--biru-a04);
  font-size:0.9em;
}

hr {
  border:0;
  border-top:1px solid var(--rule);
  margin-block:var(--space-xl);
}

blockquote {
  border-left:2px solid var(--accent);
  padding-left:var(--space-md);
  margin-block:var(--space-lg);
  font-style:italic;
  color:var(--ink);
}

ul, ol {
  padding-left:1.4em;
  margin-block-end:var(--space-md);
  color:var(--ink-muted);
}

li { margin-block-end:var(--space-2xs); }

li:last-child { margin-block-end:0; }

button, input, select, textarea {
  font:inherit;
  color:inherit;
}

table {
  border-collapse:collapse;
  width:100%;
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}

.skip-link {
  position:absolute;
  top:var(--space-sm);
  left:var(--space-sm);
  z-index:999;
  padding:var(--space-xs) var(--space-md);
  background-color:var(--accent);
  color:var(--ground-deep);
  font-family:var(--biru-a04);
  font-size:var(--font-size-xs);
  font-weight:600;
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:var(--tracking-wider);
  transform:translateY(-160%);
  transition:transform var(--motion-fast) var(--ease-standard);
  border-radius:var(--radius-xs);
}

.skip-link:focus {
  transform:translateY(0);
  outline:3px solid var(--ink);
  outline-offset:2px;
}

.site-wrap {
  width:100%;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  position:relative;
}

.container {
  width:100%;
  max-width:var(--shell-max);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.container-wide {
  width:100%;
  max-width:1520px;
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.section {
  padding-block:clamp(3.5rem, 6vw, 6.5rem);
  position:relative;
  border-bottom:1px solid var(--rule);
}

.section-hero {
  padding-top:clamp(2rem, 4vw, 4.5rem);
  padding-bottom:clamp(3.5rem, 6vw, 6rem);
  border-bottom:1px solid var(--rule);
}

.asymmetric-2-1 {
  display:grid;
  grid-template-columns:minmax(0, 2fr) minmax(360px, 1fr);

  gap:clamp(2rem, 4vw, 4.5rem);
  align-items:start;
}

.asymmetric-1-2 {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 2fr);
  gap:clamp(2rem, 4vw, 4.5rem);
  align-items:start;
}

.asymmetric-item { min-width:0; }

.book-composition {
  display:grid;
  grid-template-columns:minmax(0, 1fr) 260px;
  gap:clamp(2rem, 4vw, 4.5rem);
  align-items:start;
  margin-block:var(--space-lg);
}

.book-main { min-width:0; }

.book-margin {
  min-width:0;
  font-family:var(--biru-038);
  font-size:var(--font-size-xs);
  line-height:var(--line-height-snug);
  color:var(--ink-faint);
  border-left:1px solid var(--rule);
  padding-left:var(--space-md);
  margin-top:0.35rem;
}

.margin-note { margin-bottom:var(--space-md); }

.margin-note:last-child { margin-bottom:0; }

.margin-term {
  font-family:var(--biru-a04);
  font-size:0.72rem;
  letter-spacing:var(--tracking-caps);
  text-transform:uppercase;
  color:var(--accent);
  display:block;
  margin-bottom:var(--space-3xs);
}

.margin-val {
  font-family:var(--biru-a04);
  color:var(--ink);
  font-size:0.82rem;
  display:block;
  font-weight:500;
}

.letterpress-rule {
  height:1px;
  background:linear-gradient(90deg, var(--rule-strong) 0%, var(--rule) 50%, transparent 100%);
  margin-block:var(--space-md);
  border:0;
}

.letterpress-rule-centered {
  height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--rule-strong) 50%, transparent 100%);
  margin-block:var(--space-lg);
  border:0;
}

.plate-stamp {
  font-family:var(--biru-a04);
  font-size:var(--font-size-xs);
  text-transform:uppercase;
  letter-spacing:var(--tracking-wider);
  color:var(--accent);
  display:inline-flex;
  align-items:center;
  gap:var(--space-2xs);
  padding:0.2rem 0.55rem;
  border:1px solid var(--rule-strong);
  border-radius:var(--radius-xs);
  background-color:rgba(56, 21, 24, 0.4);
}

.price-tag {
  font-family:var(--biru-a04);
  font-size:var(--font-size-sm);
  color:var(--accent);
  font-weight:500;
  letter-spacing:var(--tracking-wide);
  display:inline-block;
}

.spec-line {
  font-family:var(--biru-a04);
  font-size:var(--font-size-xs);
  color:var(--ink-faint);
  display:flex;
  justify-content:space-between;
  gap:var(--space-sm);
  padding-block:var(--space-2xs);
  padding-inline:0.25rem;
  border-bottom:1px dashed var(--rule);
  background-color:var(--ground);
}

.spec-line dt {
  color:var(--ink-muted);
  flex-shrink:0;
  min-width:0;
}

.spec-line dd {
  color:var(--ink);
  font-weight:500;
  text-align:right;
  min-width:0;
  background-color:var(--ground-deep);
  padding:0 0.35rem;
  border-radius:var(--radius-xs);
}

.studio-card-plate .spec-line {
  flex-direction:column;
  align-items:flex-start;
  gap:0.2rem;
}

.studio-card-plate .spec-line dt {
  font-size:0.72rem;
  color:var(--accent);
  text-transform:uppercase;
  letter-spacing:var(--tracking-caps);
}

.studio-card-plate .spec-line dd {
  text-align:left;
  padding:0;
  background-color:transparent;
}

@media (max-width: 480px) {
  h1, h2, h3, h4, h5, h6 { text-wrap:normal; }
  .spec-line {
    flex-direction:column;
    align-items:flex-start;
    gap:0.2rem;
  }
  .spec-line dt {
    font-size:0.72rem;
    color:var(--accent);
    text-transform:uppercase;
    letter-spacing:var(--tracking-caps);
  }
  .spec-line dd {
    text-align:left;
    padding:0;
    background-color:transparent;
  }
}

.table-responsive {
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  margin-block:var(--space-md);
  border:1px solid var(--rule);
  border-radius:var(--radius-sm);
}

@media (max-width: 1024px) {
  .asymmetric-2-1,
  .asymmetric-1-2 {
    grid-template-columns:1fr;
    gap:var(--space-xl);
  }

  .book-composition {
    grid-template-columns:1fr;
    gap:var(--space-md);
  }

  .book-margin {
    border-left:2px solid var(--accent-dim);
    padding-left:var(--space-sm);
    margin-top:var(--space-xs);
    margin-bottom:var(--space-md);
  }
}

@media (max-width: 768px) {
  :root {
    --nav-rail-width:0px;
    --gutter:1.25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }

  .signature-ticker-track { animation:none !important; }
}