/* Scaligine — shared brand tokens & base typography
   Per Brand_Colours_Fonts_Template (May 2026):
     · Felix Titling (paid) for the wordmark → Cinzel as free placeholder
     · Open Sauce Sans for body, hero headlines, subheads
     · Blosta Script (paid) for script accents → Pinyon Script as free placeholder
   Colours all warm gray-orange + brown family; no true black. */

:root{
  --taupe:#c9b097;
  --taupe-light:#d1b99f;
  --taupe-deep:#aa9778;
  --taupe-deeper:#695a43;
  --neutral:#d0af8c;
  --olive:#757755;
  --brown:#695a43;
  --white:#ffffff;
  --cream:#d1b99f;
  --offwhite:#FAF6EF;
  /* Legacy aliases */
  --ink:#695a43;
  --ink-true:#695a43;
  --ink-soft:#695a43;
  --hairline:rgba(105,90,67,.22);
  --hairline-light:rgba(255,255,255,.55);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--offwhite);color:var(--brown);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
body{
  font-family:"Open Sauce Sans","Helvetica Neue",Arial,sans-serif;
  font-weight:400;
  font-size:16px;
  line-height:1.6;
  letter-spacing:.005em;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

.display{font-family:"Cinzel","Italiana","Felix Titling",serif;font-weight:500;letter-spacing:.04em}
.script{font-family:"Pinyon Script","Blosta Script",cursive;font-weight:400}
.serif{font-family:"Open Sauce Sans","Helvetica Neue",sans-serif;font-weight:400}
.tracked{font-family:"Open Sauce Sans","Helvetica Neue",sans-serif;letter-spacing:.32em;text-transform:uppercase;font-weight:500;font-size:11px}

.brand-shell{
  max-width:880px;margin:0 auto;
  padding:clamp(72px,8vw,128px) clamp(24px,5vw,72px) clamp(64px,7vw,112px);
}

.brand-nav{
  position:sticky;top:0;z-index:10;
  background:rgba(250,246,239,.85);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--hairline);
}
.brand-nav__inner{
  max-width:1280px;margin:0 auto;
  padding:18px clamp(24px,5vw,72px);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.brand-nav__mark{
  font-family:"Cinzel","Italiana",serif;font-weight:500;
  font-size:18px;letter-spacing:.32em;color:var(--brown);
}
.brand-nav__back{
  color:var(--brown);
  border-bottom:1px solid transparent;
  padding-bottom:2px;
  transition:color .2s, border-color .2s;
}
.brand-nav__back:hover{color:var(--brown);border-color:var(--hairline)}

.page-eyebrow{
  color:var(--olive);
  margin-bottom:20px;
}
.page-h1{
  font-family:"Cinzel","Italiana",serif;
  font-weight:500;
  font-size:clamp(38px,4.8vw,64px);
  line-height:1.06;
  letter-spacing:.04em;
  color:var(--brown);
}
.page-rule{
  width:64px;height:1px;background:rgba(105,90,67,.35);
  margin:32px 0 36px;
}
.page-body p{margin-bottom:1.1em;color:var(--brown);font-size:17px;font-weight:300;line-height:1.7}
.page-body p:last-child{margin-bottom:0}
.page-body em{font-style:italic;color:var(--brown)}
.page-body strong{font-weight:500;color:var(--brown)}
.page-body a{
  color:var(--brown);
  border-bottom:1px solid var(--hairline);
  padding-bottom:1px;
  transition:border-color .2s;
}
.page-body a:hover{border-color:var(--brown)}
.page-body h2{
  font-family:"Cinzel","Italiana",serif;
  font-weight:500;
  font-size:clamp(20px,2.2vw,28px);
  letter-spacing:.04em;
  color:var(--brown);
  margin:48px 0 18px;
}
.page-body ul{list-style:none;margin:0 0 1.1em;padding:0}
.page-body ul li{
  position:relative;padding-left:22px;margin-bottom:8px;color:var(--brown);font-weight:300;
}
.page-body ul li::before{
  content:"";position:absolute;left:0;top:.85em;
  width:8px;height:1px;background:var(--hairline);
}

.brand-footer{
  border-top:1px solid var(--hairline);
  padding:32px clamp(24px,5vw,72px);
  text-align:center;
  color:rgba(105,90,67,.55);
  font-family:"Open Sauce Sans","Helvetica Neue",sans-serif;font-weight:500;
  font-size:10px;letter-spacing:.36em;text-transform:uppercase;
}
.brand-footer a{
  color:inherit;
  border-bottom:1px solid transparent;
  padding-bottom:1px;
  transition:color .2s, border-color .2s;
}
.brand-footer a:hover{color:var(--brown);border-color:var(--hairline)}
.brand-footer .sep{opacity:.45;margin:0 12px}

@media (max-width:680px){
  .brand-nav__inner{padding:14px 20px}
  .brand-nav__mark{font-size:16px;letter-spacing:.28em}
  .brand-shell{padding:60px 20px 80px}
  .page-body p{font-size:16px}
  .brand-footer{padding:28px 20px;letter-spacing:.28em}
  .brand-footer .sep{margin:0 8px}
}
