@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Outfit:wght@300;400;500;600&display=swap');
/* ═══════════════════════════════════════════════════════
   SOL GRAVITAS™ — SHARED STYLESHEET
   solgravitas.com
═══════════════════════════════════════════════════════ */

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

:root{
  --ink:#1a1714;
  --ink-2:#4a4540;
  --ink-3:#8a8480;
  --red:#e8192c;
  --red-lt:#ff3345;
  --cream:#f7f3ed;
  --paper:#fcfaf6;
  --white:#ffffff;
  --rule:#e6e0d6;
  --rule-dk:#ccc5b8;
  --serif:'Libre Baskerville',Georgia,serif;
  --sans:'Outfit',system-ui,sans-serif;
  --nav-h:72px;
  --max-w:1240px;
  --gutter:6vw;
}

html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}


/* ══════════════════════════════
   NAVIGATION
══════════════════════════════ */
.sg-nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--gutter);
  background:rgba(252,250,246,0.95);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule);
}
.sg-nav-logo{text-decoration:none;display:flex;align-items:center}
.sg-nav-logo img{height:44px;width:auto;display:block}
.sg-nav-links{display:flex;align-items:center;gap:0.1rem;list-style:none}
.sg-nav-links a{
  font-size:0.79rem;font-weight:400;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--ink-2);text-decoration:none;
  padding:0.5rem 1rem;transition:color 0.2s,background 0.2s;
}
.sg-nav-links a:hover,.sg-nav-links a.active{color:var(--ink);background:var(--cream)}
.sg-nav-cta{
  font-size:0.76rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--paper);background:var(--ink);
  padding:0.6rem 1.6rem;text-decoration:none;border:none;cursor:pointer;
  transition:background 0.2s;white-space:nowrap;
}
.sg-nav-cta:hover{background:var(--red)}
.sg-hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;background:none;border:none}
.sg-hamburger span{display:block;width:22px;height:1.5px;background:var(--ink);transition:all 0.3s}
.sg-mobile-nav{
  display:none;position:fixed;top:var(--nav-h);left:0;right:0;z-index:190;
  background:var(--paper);border-bottom:1px solid var(--rule);padding:1.5rem var(--gutter) 2rem;
}
.sg-mobile-nav.open{display:block}
.sg-mobile-nav a{
  display:block;font-size:0.95rem;font-weight:400;letter-spacing:0.06em;
  text-transform:uppercase;color:var(--ink-2);text-decoration:none;
  padding:0.85rem 0;border-bottom:1px solid var(--rule);
}
.sg-mobile-nav a.cta-link{border:none;margin-top:1rem;color:var(--red);font-weight:600}

@media(max-width:860px){
  .sg-nav-links,.sg-nav-cta{display:none}
  .sg-hamburger{display:flex}
}

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
.sg-footer{
  background:var(--ink);
  color:var(--ink-3);
  padding:4rem var(--gutter) 2.5rem;
}
.sg-footer-inner{
  max-width:var(--max-w);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  gap:3rem 4rem;
}
.sg-footer-brand img{width:207px;height:auto;display:block;margin-bottom:0.7rem}
.sg-footer-brand p{font-size:0.85rem;line-height:1.7;color:var(--ink-3);max-width:220px;white-space:nowrap}
.sg-footer-col h4{
  font-size:0.7rem;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:1.1rem;
}
.sg-footer-col a{
  display:block;font-size:0.87rem;color:rgba(255,255,255,0.45);text-decoration:none;
  margin-bottom:0.55rem;transition:color 0.2s;
}
.sg-footer-col a:hover{color:var(--cream)}
.sg-footer-social{display:flex;gap:0.6rem;margin-top:0.9rem;flex-wrap:wrap}
.sg-footer-social a{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;padding:0;margin:0;
  border:1px solid rgba(255,255,255,0.18);
  color:var(--ink-3);transition:all 0.2s;
}
.sg-footer-social a:hover{background:var(--cream);border-color:var(--cream);color:var(--ink)}
.sg-footer-social svg{width:17px;height:17px;fill:currentColor}
.sg-footer-bottom{
  max-width:var(--max-w);margin:0 auto;
  margin-top:3rem;padding-top:1.5rem;
  border-top:1px solid #2f2c29;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
}
.sg-footer-bottom p,.sg-footer-bottom a{font-size:0.78rem;color:rgba(255,255,255,0.4);text-decoration:none}
.sg-footer-bottom a:hover{color:var(--cream)}
@media(max-width:860px){
  .sg-footer-inner{grid-template-columns:1fr 1fr;gap:2.5rem}
}
@media(max-width:560px){
  .sg-footer-inner{grid-template-columns:1fr}
}

/* ══════════════════════════════
   SHARED COMPONENTS
══════════════════════════════ */
.sg-page{padding-top:var(--nav-h)}

.tag{
  font-size:0.68rem;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--red);display:flex;align-items:center;gap:0.8rem;margin-bottom:1.2rem;
}
.tag::before{content:'';width:24px;height:1px;background:var(--red);flex-shrink:0}

h1,h2,h3{font-family:var(--serif)}
h1{font-size:clamp(2.6rem,5vw,5rem);font-weight:700;line-height:1.07;letter-spacing:-0.02em}
h2{font-size:clamp(1.9rem,3.5vw,3.2rem);font-weight:700;line-height:1.1;letter-spacing:-0.01em}
h3{font-size:clamp(1.2rem,2vw,1.6rem);font-weight:700;line-height:1.2}
h1 em,h2 em,h3 em{font-style:italic;font-weight:400;color:var(--ink-2)}

.lead{font-size:1.05rem;font-weight:300;color:var(--ink-2);line-height:1.75;max-width:560px}
.section{padding:6rem var(--gutter);max-width:var(--max-w);margin:0 auto}

.btn-dark{
  display:inline-block;
  font-size:0.8rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--paper);background:var(--ink);
  padding:0.9rem 2rem;text-decoration:none;border:none;cursor:pointer;
  transition:background 0.25s;
}
.btn-dark:hover{background:var(--red)}
.btn-outline{
  display:inline-block;
  font-size:0.8rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink);background:transparent;
  padding:0.9rem 2rem;text-decoration:none;border:1.5px solid var(--rule-dk);cursor:pointer;
  transition:border-color 0.25s,color 0.25s;
}
.btn-outline:hover{border-color:var(--ink);color:var(--ink)}
.btn-red{
  display:inline-block;
  font-size:0.8rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--white);background:var(--red);
  padding:0.9rem 2rem;text-decoration:none;border:none;cursor:pointer;
  transition:background 0.25s;
}
.btn-red:hover{background:#c4111f}

.cta-banner{
  background:var(--ink);color:var(--paper);
  padding:5rem var(--gutter);
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:2.5rem;
}
.cta-banner h2{color:var(--paper);max-width:560px}
.cta-banner h2 em{color:var(--red)}
.cta-banner .lead{color:rgba(255,255,255,0.45);max-width:480px}

.divider{border:none;border-top:1px solid var(--rule);margin:0}

/* Fade-in on scroll */
.fade{opacity:0;transform:translateY(18px);transition:opacity 0.55s ease,transform 0.55s ease}
.fade.in{opacity:1;transform:none}

/* ══════════════════════════════
   PAGE HERO
══════════════════════════════ */
.page-hero{
  padding:7rem var(--gutter) 5rem;
  max-width:var(--max-w);margin:0 auto;
}
.page-hero .tag{margin-bottom:1.5rem}

/* ══════════════════════════════
   BREADCRUMB
══════════════════════════════ */
.breadcrumb{
  padding:0.9rem var(--gutter);
  border-bottom:1px solid var(--rule);
  font-size:0.77rem;color:var(--ink-3);
  letter-spacing:0.06em;text-transform:uppercase;
}
.breadcrumb a{color:var(--ink-3);text-decoration:none;transition:color 0.2s}
.breadcrumb a:hover{color:var(--red)}
.breadcrumb span{margin:0 0.5rem;color:var(--rule-dk)}

/* Utility */
.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}