


:root {
   /* Color Story: Jewel on Dark (OKLCH aligned) */
   --ground:#141212;
   --surface:#1D1D1D;
   --surface-2:#2A2A2A;
   --line:#464646;
   --ink-soft:#B7B7B7;
   --ink:#E8E8E8;
   --accent:#268551;
   --accent-ink:#FFF;
   --hairline:#B08D57;


   --accent-hover:#1E6D42;
   --accent-active:#175433;
   --surface-hover:#242424;
   --line-strong:#636363;
   --focus-ring:rgba(176, 141, 87, 0.45);
   --error-ink:#F07B7B;
   --error-surface:#2D1818;
   --error-border:#803030;
   --success-ink:#65D693;


   --doci-1c9:'Cinzel', 'Cinzel Fallback', Georgia, 'Times New Roman', serif;
   --doci-527:'Literata', 'Literata Fallback', Charter, 'Source Serif 4', Georgia, serif;
   --doci-049:'JetBrains Mono', 'JetBrains Mono Fallback', Consolas, Monaco, monospace;


   /* Fluid Optical Scales via clamp() */
   --fs-root:16px;
   --fs-xs:clamp(0.72rem, 0.7rem + 0.12vw, 0.8rem);
   --fs-sm:clamp(0.82rem, 0.8rem + 0.16vw, 0.92rem);
   --fs-base:clamp(1rem, 0.98rem + 0.15vw, 1.08rem);
   --fs-md:clamp(1.15rem, 1.1rem + 0.35vw, 1.35rem);
   --fs-lg:clamp(1.4rem, 1.3rem + 0.6vw, 1.8rem);
   --fs-xl:clamp(1.8rem, 1.6rem + 1.2vw, 2.5rem);
   --fs-display:clamp(2.2rem, 1.9rem + 2vw, 3.8rem);


   --lh-tight:1.15;
   --lh-snug:1.3;
   --lh-reading:1.65;
   --tracking-tight:-0.015em;
   --tracking-chiseled:0.08em;
   --tracking-mono:0.04em;


   /* Engineering Grid & Layout Metrics */
   --site-max-width:1440px;
   --reading-width:65ch;
   --frame-width:1px;
   --frame-inset:clamp(12px, 2vw, 24px);
   --space-2xs:4px;
   --space-xs:8px;
   --space-sm:16px;
   --space-md:24px;
   --space-lg:40px;
   --space-xl:64px;
   --space-2xl:96px;


   /* Desktop Chrome / Phone Dock Metrics */
   --header-height:64px;
   --dock-height:64px;


   /* Motion Tokens (Precise, Focus-First Luxury) */
   --ease-precision:cubic-bezier(0.2, 0, 0, 1);
   --ease-settle:cubic-bezier(0.16, 1, 0.3, 1);
   --ease-in-out:cubic-bezier(0.4, 0, 0.2, 1);
   --dur-fast:140ms;
   --dur-base:220ms;
   --dur-settle:380ms;
}



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


html {
   font-size:var(--fs-root);
   background-color:var(--ground);
   color:var(--ink);
   -webkit-text-size-adjust:100%;
   text-rendering:optimizeLegibility;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
   scroll-behavior:smooth;
   scroll-padding-top:calc(var(--header-height) + 16px);
}


body {
   font-family:var(--doci-527);
   font-size:var(--fs-base);
   line-height:var(--lh-reading);
   color:var(--ink);
   background-color:var(--ground);
   min-height:100vh;
   min-height:100dvh;
   position:relative;

   overflow-x:hidden;
   padding-bottom:var(--dock-height);
}


@media (min-width: 1024px) {

   body {
      padding-bottom:0;
   }
}


/* Inherit for form controls only (never body) */
button,
input,
optgroup,
select,
textarea {
   font-family:inherit;
   font-size:inherit;
   line-height:inherit;
   color:inherit;
}


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


a {
   color:inherit;
   text-decoration:none;
   transition:color var(--dur-fast) var(--ease-precision);
}


/* Tabular figures for prices, weights, coordinates */
.tabular-nums,
.spec-value,
.price-figure,
.lot-code,
.weight-badge {
   font-family:var(--doci-049);
   font-variant-numeric:tabular-nums;
   letter-spacing:var(--tracking-mono);
}



h1,
h2,
h3,
h4 {
   font-family:var(--doci-1c9);
   font-weight:700;
   color:var(--ink);
   line-height:var(--lh-tight);
   letter-spacing:var(--tracking-chiseled);
   text-transform:uppercase;
   word-wrap:break-word;
   overflow-wrap:break-word;
}


h1 {
   font-size:var(--fs-display);
   margin-bottom:var(--space-md);
   max-width:16ch;
}


h2 {
   font-size:var(--fs-xl);
   margin-bottom:var(--space-sm);
   max-width:22ch;
}


h3 {
   font-size:var(--fs-lg);
   margin-bottom:var(--space-xs);
   max-width:30ch;
}


h4 {
   font-size:var(--fs-md);
   margin-bottom:var(--space-xs);
}


p {
   max-width:var(--reading-width);
   margin-bottom:var(--space-md);
   color:var(--ink);
}


p:last-child {
   margin-bottom:0;
}


.lede {
   font-size:var(--fs-md);
   line-height:var(--lh-snug);
   color:var(--ink);
   max-width:var(--reading-width);
   margin-bottom:var(--space-md);
}


.text-soft {
   color:var(--ink-soft);
}


.caption {
   font-size:var(--fs-xs);
   line-height:1.4;
   color:var(--ink-soft);
   font-family:var(--doci-049);
   text-transform:uppercase;
   letter-spacing:var(--tracking-mono);
}



.asym-headline-lockup {
   position:relative;
   display:block;
   margin-bottom:var(--space-md);
}


.asym-headline-lockup .lockup-primary {
   display:block;
   font-size:var(--fs-display);
   line-height:0.95;
   color:var(--ink);

   letter-spacing:var(--tracking-chiseled);
}


.asym-headline-lockup .lockup-cut {
   position:relative;
   display:flex;
   align-items:center;
   gap:var(--space-sm);
   margin:var(--space-xs) 0;
}


.asym-headline-lockup .lockup-rule {
   height:1px;
   background-color:var(--hairline);
   flex-grow:1;
   transform-origin:left center;
}


.asym-headline-lockup .lockup-secondary {
   display:block;
   padding-left:clamp(24px, 5vw, 64px);
   font-size:clamp(1.4rem, 1.2rem + 1.2vw, 2.3rem);
   line-height:1.05;
   color:var(--hairline);
   font-style:italic;
   font-family:var(--doci-527);
   text-transform:none;
   font-weight:400;
}



.site-frame {
   min-height:100vh;
   min-height:100dvh;
   margin:0 auto;
   max-width:var(--site-max-width);
   border-left:1px solid var(--line);
   border-right:1px solid var(--line);
   background-color:var(--ground);
   position:relative;
   display:flex;
   flex-direction:column;
}


@media (max-width: 1023px) {
   body.consent-banner-open {
      padding-bottom:240px;
   }
}
body.consent-banner-open {
   padding-bottom:240px;
}


@media (max-width: 1440px) {
   .site-frame {
      border-left:none;
      border-right:none;
   }
}


.container {
   width:100%;
   max-width:var(--site-max-width);
   margin-left:auto;
   margin-right:auto;
   padding-left:clamp(16px, 4vw, 40px);
   padding-right:clamp(16px, 4vw, 40px);
}


.section {
   padding-top:clamp(48px, 6vw, 96px);
   padding-bottom:clamp(48px, 6vw, 96px);
   border-bottom:1px solid var(--line);
   position:relative;
}


.section-surface {
   background-color:var(--surface);
}


.section-tight {
   padding-top:clamp(32px, 4vw, 56px);
   padding-bottom:clamp(32px, 4vw, 56px);
}


/* Technical Hairline Coordinates & Edge Labels */
.tech-meta-bar {
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:var(--space-sm);
   padding:var(--space-xs) clamp(16px, 4vw, 40px);
   background-color:var(--surface);
   border-bottom:1px solid var(--line);
   font-family:var(--doci-049);
   font-size:var(--fs-xs);
   color:var(--ink-soft);
   text-transform:uppercase;
   letter-spacing:var(--tracking-mono);
}


.tech-meta-bar span {
   display:inline-flex;
   align-items:center;
   gap:6px;
}


.skip-link {
   position:absolute;
   top:-100px;
   left:16px;
   z-index:1000;
   background-color:var(--accent);
   color:var(--accent-ink);
   padding:12px 20px;
   font-family:var(--doci-049);
   font-size:var(--fs-sm);
   font-weight:500;
   text-decoration:none;
   border:1px solid var(--hairline);
   transition:top var(--dur-fast) var(--ease-precision);
}


.skip-link:focus {
   top:16px;
   outline:2px solid var(--hairline);
   outline-offset:2px;
}


/* Accessibility Focus Ring Defaults */
:focus-visible {
   outline:2px solid var(--hairline);
   outline-offset:3px;
}


/* Sprite Icons Defaults */
.icon {
   width:1.25em;
   height:1.25em;
   fill:currentColor;
   flex-shrink:0;
   display:inline-block;
   vertical-align:middle;
}


/* Technical Specification Grids */
.spec-grid {
   display:grid;
   grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
   gap:1px;
   background-color:var(--line);
   border:1px solid var(--line);
   margin:var(--space-md) 0;
}


.spec-cell {
   background-color:var(--surface);
   padding:var(--space-md);
   display:flex;
   flex-direction:column;
   gap:var(--space-2xs);
}


.spec-label {
   font-family:var(--doci-049);
   font-size:var(--fs-xs);
   text-transform:uppercase;
   color:var(--ink-soft);
   letter-spacing:var(--tracking-mono);
}


.spec-value {
   font-size:var(--fs-base);
   color:var(--ink);
   font-weight:500;
}


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



@media (prefers-reduced-motion: reduce) {
   html {
      scroll-behavior:auto;
   }


   *,
   *::before,
   *::after {
      animation-duration:0.01ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.01ms !important;
      scroll-behavior:auto !important;
   }
}
