

:root {
   --ground:#DED2BC;
   --surface:#D1C3AA;
   --surface-2:#C1B296;
   --line:#9E9074;
   --ink-soft:#382F1F;
   --ink:#2B261C;
   --accent:#A65E2E;
   --accent-ink:#FFFFFF;


   --tesi-ef8:'Cinzel', 'Cinzel Fallback', Georgia, 'Times New Roman', serif;
   --tesi-843:'Zilla Slab', 'Zilla Slab Fallback', Georgia, 'DejaVu Serif', serif;
   --tesi-fa0:'Space Mono', 'Space Mono Fallback', 'SF Mono', Consolas, monospace;


   --sidebar-w:320px;
   --dock-h:68px;
   --header-condensed-h:56px;
   --control-h:48px;
   --control-h-sm:38px;
   --radius:0px;


   --step--2:clamp(0.75rem, 0.72rem + 0.15vw, 0.84rem);
   --step--1:clamp(0.88rem, 0.83rem + 0.22vw, 1.00rem);
   --tesi-546:clamp(1.00rem, 0.94rem + 0.30vw, 1.18rem);
   --tesi-c6f:clamp(1.15rem, 1.06rem + 0.45vw, 1.42rem);
   --tesi-0c4:clamp(1.35rem, 1.21rem + 0.70vw, 1.76rem);
   --tesi-550:clamp(1.60rem, 1.39rem + 1.05vw, 2.22rem);
   --tesi-9e6:clamp(1.90rem, 1.60rem + 1.50vw, 2.80rem);
   --tesi-ba2:clamp(2.25rem, 1.82rem + 2.15vw, 3.55rem);


   --space-3xs:0.25rem;
   --space-2xs:0.5rem;
   --space-xs:0.75rem;
   --space-s:1rem;
   --space-m:1.5rem;
   --space-l:2rem;
   --space-xl:3rem;
   --space-2xl:4.5rem;
   --space-3xl:6rem;


   --measure:58ch;
   --measure-narrow:48ch;


   --transition-fast:140ms cubic-bezier(0.2, 0, 0, 1);
   --transition-mid:240ms cubic-bezier(0.2, 0, 0, 1);
   --transition-slow:400ms cubic-bezier(0.16, 1, 0.3, 1);

   --ease-out:cubic-bezier(0.16, 1, 0.3, 1);
}


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


html {
   font-size:100%;
   background-color:var(--ground);
   color:var(--ink);
   font-family:var(--tesi-843);
   line-height:1.58;
   text-rendering:optimizeLegibility;
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale;
   scroll-behavior:smooth;
   scroll-padding-top:calc(var(--header-condensed-h) + var(--space-s));
}


body {
   min-height:100vh;
   background-color:var(--ground);
   color:var(--ink);
   font-family:var(--tesi-843);
   font-size:var(--tesi-546);
   font-weight:400;
   overflow-x:hidden;
   padding-bottom:var(--dock-h);
}


@media (min-width: 1024px) {
   body { padding-bottom:0; }
}


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


svg.icon {
   width:1.25em;
   height:1.25em;
   fill:currentColor;
   flex-shrink:0;
}


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


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


a {
   color:inherit;
   text-decoration-thickness:1px;
   text-underline-offset:3px;
   transition:color var(--transition-fast), border-color var(--transition-fast);
}


h1,
h2,
h3,
h4,
h5,
h6 {
   font-family:var(--tesi-ef8);
   font-weight:700;
   line-height:1.15;
   color:var(--ink);
   letter-spacing:0.02em;
   text-wrap:balance;
}


h1 {
   font-size:var(--tesi-9e6);
   letter-spacing:0.03em;
}


h2 {
   font-size:var(--tesi-550);
   letter-spacing:0.025em;
}


h3 { font-size:var(--tesi-0c4); }


h4 { font-size:var(--tesi-c6f); }


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


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


p.lede {
   font-size:var(--tesi-c6f);
   line-height:1.48;
   color:var(--ink);
   max-width:var(--measure);
   font-weight:500;
}


small,
.caption,
.meta-label {
   font-family:var(--tesi-fa0);
   font-size:var(--step--1);
   line-height:1.4;
   color:var(--ink-soft);
   letter-spacing:0.02em;
}


.num,
.spec-val,
.price-figure,
.coord {
   font-family:var(--tesi-fa0);
   font-variant-numeric:tabular-nums;
   letter-spacing:-0.01em;
}


ul,
ol {
   max-width:var(--measure);
   padding-inline-start:var(--space-l);
   margin-block-end:var(--space-m);
}


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


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


blockquote {
   border-left:2px solid var(--ink);
   padding-left:var(--space-m);
   margin-block:var(--space-xl);
   font-style:italic;
   max-width:var(--measure);
}


table {
   border-collapse:collapse;
   width:100%;
   font-variant-numeric:tabular-nums;
}


th,
td {
   padding:var(--space-xs) var(--space-s);
   border-bottom:1px solid var(--line);
   text-align:left;
}


th {
   font-family:var(--tesi-fa0);
   font-size:var(--step--1);
   text-transform:uppercase;
   letter-spacing:0.06em;
   color:var(--ink-soft);
   font-weight:700;
}


td { font-size:var(--tesi-546); }


.skip-link {
   position:absolute;
   top:-999px;
   left:var(--space-s);
   background:var(--ink);
   color:var(--ground);
   padding:var(--space-2xs) var(--space-s);
   font-family:var(--tesi-fa0);

   font-size:var(--step--1);
   text-decoration:none;
   z-index:99999;
   border:1px solid var(--ground);
}


.skip-link:focus { top:var(--space-s); }


.visually-hidden {
   position:absolute !important;
   width:1px !important;
   height:1px !important;
   padding:0 !important;
   margin:-1px !important;
   overflow:hidden !important;
   clip:rect(0, 0, 0, 0) !important;

   white-space:nowrap !important;
   border:0 !important;
}


.app-frame {
   display:flex;
   flex-direction:column;
   min-height:100vh;
   min-height:100svh;
   position:relative;
}


@media (min-width: 1024px) {
   .app-frame {
      flex-direction:row;
      flex-wrap:nowrap !important;
   }


   .content-column {
      margin-left:var(--sidebar-w);
      flex:1 1 0;
      min-width:0;
      width:calc(100% - var(--sidebar-w));
      background-color:var(--ground);
   }
}


.site-main {
   width:100%;
   min-width:0;
}


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


.vojia97 {
   width:100%;
   overflow-x:auto;
   -webkit-overflow-scrolling:touch;
   margin-block:var(--space-m);
   border:1px solid var(--line);
   background:var(--surface);
}


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


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



/* Technical Grid System & Spec Rules */
.grid-ruler {
   display:grid;
   grid-template-columns:repeat(12, 1fr);
   gap:var(--space-m);
   width:100%;
}


.col-12 { grid-column: span 12; }
.col-8 { grid-column: span 12; }
.col-6 { grid-column: span 12; }
.col-4 { grid-column: span 12; }


@media (min-width: 768px) {
   .col-8 { grid-column: span 8; }
   .col-6 { grid-column: span 6; }
   .col-4 { grid-column: span 4; }
}


.spec-rule {
   display:block;
   width:100%;
   height:1px;
   background-color:var(--line);
   margin-block:var(--space-l);
   position:relative;
}


.spec-rule[data-label]::after {
   content:attr(data-label);
   position:absolute;
   right:0;
   top:-0.7em;
   background-color:var(--ground);
   padding-left:var(--space-xs);
   font-family:var(--tesi-fa0);
   font-size:var(--step--2);
   color:var(--ink-soft);
   text-transform:uppercase;
   letter-spacing:0.08em;
}


/* Editorial Spec Box & Inset Data Panels */
.inset-panel {
   background-color:var(--surface);
   border:1px solid var(--line);
   padding:var(--space-m);
   margin-block:var(--space-l);
   position:relative;
}


.inset-panel--accent { border-left:4px solid var(--accent); }


.inset-panel__title {
   font-family:var(--tesi-fa0);
   font-size:var(--step--1);
   text-transform:uppercase;
   letter-spacing:0.08em;
   color:var(--ink-soft);
   margin-bottom:var(--space-xs);
   display:flex;
   align-items:center;
   gap:var(--space-xs);
}


.data-pair-list {
   display:grid;
   grid-template-columns:1fr;
   gap:var(--space-2xs) var(--space-m);
   font-family:var(--tesi-fa0);
   font-size:var(--step--1);
   margin-block:var(--space-s);
}


@media (min-width: 640px) {
   .data-pair-list { grid-template-columns:auto 1fr; }
}


.data-pair-key {
   color:var(--ink-soft);
   text-transform:uppercase;
   letter-spacing:0.04em;
}


.data-pair-val {
   color:var(--ink);
   font-weight:700;
   text-align:left;
   word-break:break-word;
   overflow-wrap:anywhere;
}


.data-pair-val a {
   display:inline-flex;
   align-items:center;
   min-height:44px;
   padding-block:4px;
}


.framed-document-card a[href^='mailto:'],
.framed-document-card a[href^='tel:'] {
   display:inline-flex;
   align-items:center;
   min-height:44px;
   padding-block:4px;
}


@media (min-width: 640px) {
   .data-pair-val { text-align:right; }
}


/* Optical Display Heading Utility */
.display-title {
   font-family:var(--tesi-ef8);
   font-weight:700;
   line-height:1.08;
   letter-spacing:0.02em;
   text-transform:none;
}


.display-title--clamp { font-size:clamp(1.85rem, 1.4rem + 2.4vw, 3.8rem); }
