@charset "UTF-8";


:root {
   --ground:#FFF;
   --surface:#F0F0F0;
   --surface-2:#DEDEDE;
   --line:#BABABA;
   --ink-soft:#4D4D4D;
   --ink:#292929;
   --accent:#3A5A8C;
   --accent-ink:#FFF;


   --vinu-811:"Cardo", "Cardo Fallback", Georgia, "Times New Roman", serif;
   --vinu-57f:"EB Garamond", "EB Garamond Fallback", Garamond, Georgia, serif;
   --vinu-235:"JetBrains Mono", "JetBrains Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;


   --text-xs:clamp(0.72rem, 0.70rem + 0.10vw, 0.78rem);
   --text-sm:clamp(0.84rem, 0.81rem + 0.15vw, 0.92rem);
   --text-base:clamp(1.05rem, 1.00rem + 0.25vw, 1.18rem);
   --text-md:clamp(1.22rem, 1.15rem + 0.35vw, 1.38rem);
   --text-lg:clamp(1.42rem, 1.30rem + 0.60vw, 1.72rem);
   --text-xl:clamp(1.75rem, 1.55rem + 1.00vw, 2.25rem);
   --text-2xl:clamp(2.15rem, 1.85rem + 1.50vw, 3.00rem);
   --text-3xl:clamp(2.65rem, 2.20rem + 2.25vw, 4.00rem);


   --leading-tight:1.15;
   --leading-snug:1.30;
   --leading-normal:1.55;
   --leading-loose:1.75;


   --space-2xs:clamp(0.25rem, 0.20rem + 0.15vw, 0.35rem);
   --space-xs:clamp(0.50rem, 0.45rem + 0.20vw, 0.65rem);
   --space-sm:clamp(0.75rem, 0.65rem + 0.35vw, 1.00rem);
   --space-md:clamp(1.25rem, 1.05rem + 0.70vw, 1.75rem);
   --space-lg:clamp(2.00rem, 1.65rem + 1.20vw, 2.85rem);
   --space-xl:clamp(3.00rem, 2.40rem + 2.00vw, 4.50rem);
   --space-2xl:clamp(4.50rem, 3.50rem + 3.20vw, 6.75rem);


   --shell-max:1240px;
   --measure:65ch;
   --radius:0px;


   --ease-ledger:cubic-bezier(0.16, 1, 0.3, 1);
   --ease-sharp:cubic-bezier(0.25, 0, 0.15, 1);
   --dur-fast:140ms;
   --dur-med:220ms;
   --dur-slow:420ms;
}


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


html {
   background-color:var(--ground);
   color:var(--ink);
   font-size:16px;
   -webkit-text-size-adjust:100%;
   tab-size:4;
   text-rendering:optimizeLegibility;
   scroll-behavior:smooth;
}


body {
   min-height:100vh;

   background-color:var(--ground);
   color:var(--ink);
   font-family:var(--vinu-57f);
   font-size:var(--text-base);
   line-height:var(--leading-normal);
   font-feature-settings:"kern" 1, "liga" 1, "calt" 1;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
   overflow-x:hidden;
   position:relative;
}


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


input,
button,
textarea,
select {
   font:inherit;
   color:inherit;
   border-radius:var(--radius);
}


@media (max-width: 48rem) {
   input,
   select,
   textarea,
   .form-input,
   .form-select,
   .form-textarea,
   .calc-select {
      font-size:max(16px, 1rem) !important;
   }
}


button {
   background:none;
   border:none;
   cursor:pointer;
}


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


ul,
ol {
   list-style:none;
}


a {
   color:inherit;
   text-decoration:none;
}


h1,
h2,
h3,
h4,
h5,
h6 {
   font-family:var(--vinu-811);
   font-weight:700;
   line-height:var(--leading-tight);
   color:var(--ink);

   letter-spacing:-0.01em;
   text-wrap:balance;
   overflow-wrap:break-word;
   word-break:normal;
}


h1 {
   font-size:var(--text-3xl);
   max-width:18ch;
}


h2 {
   font-size:var(--text-2xl);
   margin-bottom:var(--space-xs);
}


h3 {
   font-size:var(--text-xl);
   margin-bottom:var(--space-2xs);
}


h4 {
   font-size:var(--text-lg);
   font-weight:400;
   margin-bottom:var(--space-2xs);
}


p {
   max-width:var(--measure);
   font-size:var(--text-base);
   line-height:var(--leading-loose);
   color:var(--ink);
}


p + p {
   margin-top:var(--space-sm);
}


small,
.caption,
.meta-note {
   font-family:var(--vinu-235);
   font-size:var(--text-xs);
   line-height:var(--leading-normal);
   color:var(--ink-soft);
   letter-spacing:0.02em;
}


.numeral,
.stat-figure,
.price-figure,
.coord-tag {
   font-family:var(--vinu-235);
   font-variant-numeric:tabular-nums lining-nums;
   letter-spacing:-0.02em;
}


.lede {
   font-family:var(--vinu-57f);
   font-size:var(--text-md);
   line-height:var(--leading-snug);
   color:var(--ink-soft);
   max-width:58ch;
}


.prose {
   max-width:var(--measure);
}


.prose p {
   margin-bottom:var(--space-sm);
}


.prose h2,
.prose h3 {
   margin-top:var(--space-lg);
   margin-bottom:var(--space-xs);
}


.prose ul,
.prose ol {
   margin:var(--space-sm) 0 var(--space-md);
   padding-left:var(--space-md);
}


.prose ul {
   list-style:square;
}


.prose ol {
   list-style:decimal;
}


.prose li {
   margin-bottom:var(--space-2xs);
   line-height:var(--leading-normal);
}


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


.prose hr {
   border:0;
   height:1px;
   background-color:var(--line);
   margin:var(--space-lg) 0;
}


.shell-container {
   width:100%;
   max-width:var(--shell-max);
   margin-inline:auto;
   padding-inline:clamp(1rem, 0.75rem + 1.25vw, 2.5rem);
}


.ledger-grid-bg {
   position:relative;
   background-color:var(--ground);
   background-image:
      linear-gradient(to right, rgba(186, 186, 186, 0.18) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(186, 186, 186, 0.15) 1px, transparent 1px);
   background-size:120px 40px;
}


.spine-layout {
   position:relative;
   padding-left:clamp(1.5rem, 1rem + 2vw, 3.25rem);
}


.spine-layout::before {
   content:"";
   position:absolute;
   left:0;
   top:0;
   bottom:0;
   width:1px;
   background-color:var(--line);
}


.spine-stage {
   position:relative;
   padding-bottom:var(--space-xl);
}


.spine-stage::before {
   content:"";
   position:absolute;
   left:clamp(-1.5rem, -1rem - 2vw, -3.25rem);
   top:0.35rem;
   width:9px;
   height:9px;
   background-color:var(--ground);
   border:2px solid var(--ink);
   transform:translateX(-4px);
}


.spine-stage.is-accent::before {
   background-color:var(--accent);
   border-color:var(--accent);
}


.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:-100px;
   left:1rem;
   z-index:10000;
   padding:0.75rem 1.25rem;
   background:var(--ink);
   color:var(--ground);
   font-family:var(--vinu-235);
   font-size:var(--text-sm);
   text-decoration:underline;
   transition:top var(--dur-fast) var(--ease-ledger);
}


.skip-link:focus {
   top:1rem;
}


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


@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;
   }
}



/* Foundation Spacing and Utility Primitives */
.flow > * + * {
   margin-top:var(--space-md);
}


.flow-tight > * + * {
   margin-top:var(--space-xs);
}


.flow-loose > * + * {
   margin-top:var(--space-lg);
}


.divider-line {
   border:0;
   height:1px;
   background-color:var(--line);
   width:100%;
}


.spec-sheet-header {
   border-bottom:1px solid var(--line);
   padding-bottom:var(--space-xs);
   margin-bottom:var(--space-md);
   display:flex;
   justify-content:space-between;
   align-items:baseline;
   gap:var(--space-sm);
   flex-wrap:wrap;
}


.spec-sheet-header .title {
   font-family:var(--vinu-811);
   font-size:var(--text-lg);
   font-weight:700;
   color:var(--ink);
}


.spec-sheet-header .meta {
   font-family:var(--vinu-235);
   font-size:var(--text-xs);
   color:var(--ink-soft);
}