:root{
  --sage:#5F6E52;
  --sage-dark:#4B5741;
  --forest:#333D2C;
  --rust:#B5563A;
  --rust-dark:#8F4029;
  --bone:#F6F2E9;
  --bone-warm:#EFE8D8;
  --charcoal:#2A2924;
  --line:#D8D0BC;
  --navy:#2E3A4A;
  --navy-dark:#212A36;
  --gold:#C08A2E;
  --max:1180px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Work Sans', sans-serif;
  color:var(--charcoal);
  background:var(--bone);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Fraunces', serif;
  color:var(--forest);
  font-weight:500;
  line-height:1.12;
  letter-spacing:-0.01em;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
section{padding:88px 0;}
@media(max-width:720px){
  section{padding:56px 0;}
  .wrap{padding:0 20px;}
}
a:focus-visible, button:focus-visible{outline:3px solid var(--rust); outline-offset:3px;}
@media (prefers-reduced-motion: reduce){ *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;} }

.stripe-band{
  height:14px; width:100%;
  background:
    repeating-linear-gradient(100deg,
      var(--forest) 0px, var(--forest) 26px,
      transparent 26px, transparent 34px,
      var(--rust) 34px, var(--rust) 46px,
      transparent 46px, transparent 58px,
      var(--forest) 58px, var(--forest) 96px,
      transparent 96px, transparent 108px
    );
  background-size: 340px 100%;
}
.stripe-band.navy-mix{
  background:
    repeating-linear-gradient(100deg,
      var(--navy) 0px, var(--navy) 26px,
      transparent 26px, transparent 34px,
      var(--gold) 34px, var(--gold) 46px,
      transparent 46px, transparent 58px,
      var(--navy) 58px, var(--navy) 96px,
      transparent 96px, transparent 108px
    );
  background-size: 340px 100%;
}

/* header */
header{position:sticky; top:0; z-index:50; background:var(--bone); border-bottom:1px solid var(--line);}
.nav{display:flex; align-items:center; justify-content:space-between; padding:20px 32px; max-width:var(--max); margin:0 auto;}
.logo{font-family:'Fraunces', serif; font-size:22px; font-weight:600; color:var(--forest);}
.logo span{color:var(--rust);}
nav ul{display:flex; gap:32px; list-style:none;}
nav ul a{font-size:15px; font-weight:500; color:var(--forest); padding-bottom:4px; border-bottom:2px solid transparent; transition:border-color .15s ease;}
nav ul a:hover{border-color:var(--rust);}
.nav-cta{background:var(--forest); color:var(--bone); padding:11px 22px; border-radius:2px; font-size:14px; font-weight:600; white-space:nowrap;}
.nav-cta:hover{background:var(--rust);}
.mobile-toggle{display:none; background:none; border:none; font-size:26px; color:var(--forest); cursor:pointer; line-height:1;}
@media(max-width:860px){ nav ul{display:none;} .nav-cta{display:none;} .mobile-toggle{display:block;} .nav{padding:18px 20px;} }

.mobile-menu{display:none; flex-direction:column; gap:4px; padding:8px 20px 22px; background:var(--bone); border-bottom:1px solid var(--line);}
.mobile-menu.open{display:flex;}
.mobile-menu a{font-size:16px; font-weight:500; color:var(--forest); padding:12px 4px; border-bottom:1px solid var(--line);}
.mobile-menu a:last-child{border-bottom:none;}
.mobile-menu a.btn{color:var(--bone); border-bottom:none; padding:14px 26px;}
.mobile-menu .btn{margin-top:10px; text-align:center;}
@media(min-width:861px){ .mobile-menu{display:none !important;} }

/* buttons */
.btn{display:inline-block; padding:14px 26px; font-size:15px; font-weight:600; border-radius:2px; cursor:pointer; border:2px solid transparent; transition:transform .12s ease, background .15s ease, color .15s ease, border-color .15s ease;}
.btn:active{transform:scale(0.98);}
.btn-primary{background:var(--rust); color:var(--bone);}
.btn-primary:hover{background:var(--rust-dark);}
.btn-outline{background:transparent; color:var(--forest); border-color:var(--forest);}
.btn-outline:hover{background:var(--forest); color:var(--bone);}
.btn-navy{background:var(--navy); color:var(--bone);}
.btn-navy:hover{background:var(--navy-dark);}
.btn-outline-navy{background:transparent; color:var(--navy); border-color:var(--navy);}
.btn-outline-navy:hover{background:var(--navy); color:var(--bone);}

.eyebrow-mark{display:inline-flex; align-items:center; gap:10px; font-size:14px; color:var(--rust-dark); font-weight:600; margin-bottom:18px;}
.eyebrow-mark .dash{width:28px; height:2px; background:var(--rust);}
.eyebrow-mark.navy-mode{color:var(--gold);}
.eyebrow-mark.navy-mode .dash{background:var(--gold);}

.section-head{max-width:640px; margin-bottom:48px;}
.section-head h2{font-size:clamp(28px, 3.6vw, 38px);}
.section-head p{margin-top:14px; font-size:16.5px; color:#4A4A40;}

/* card grids (classes, products, live, blog) */
.card-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:24px;}
@media(max-width:900px){ .card-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .card-grid{grid-template-columns:1fr;} }
.card{background:var(--bone); border:1px solid var(--line); padding:30px 26px; display:flex; flex-direction:column; height:100%;}
.card.featured{border-width:2px; border-color:var(--forest);}
.card.featured.navy-theme{border-color:var(--navy);}
.card-tag{font-size:12.5px; font-weight:700; letter-spacing:.02em; color:var(--rust-dark); margin-bottom:12px;}
.card-tag.navy-tag{color:var(--gold);}
.card h3{font-size:20px; margin-bottom:8px;}
.card-price{font-family:'Fraunces', serif; font-size:24px; color:var(--forest); margin:12px 0 14px;}
.card-price.navy-price{color:var(--navy);}
.card-price span{font-size:13px; color:#6b6a5f; font-family:'Work Sans',sans-serif;}
.card p.desc{font-size:14.5px; color:#4A4A40; flex-grow:1; margin-bottom:20px;}
.card .meta{font-size:13px; color:#7a7a6d; margin-bottom:14px;}

/* offers section bg variants */
.section-alt{background:var(--bone-warm);}
.section-alt.navy-alt{background:#E7EAEE;}

/* blog list */
.blog-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media(max-width:900px){ .blog-grid{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .blog-grid{grid-template-columns:1fr;} }
.blog-card{background:var(--bone); border:1px solid var(--line);}
.blog-thumb{aspect-ratio:16/10; background:var(--sage); position:relative; overflow:hidden;}
.blog-thumb.navy-thumb{background:var(--navy);}
.blog-thumb::before{content:""; position:absolute; inset:0; background:repeating-linear-gradient(110deg, rgba(51,61,44,0.4) 0 3px, transparent 3px 32px);}
.blog-thumb.navy-thumb::before{background:repeating-linear-gradient(110deg, rgba(0,0,0,0.35) 0 3px, transparent 3px 32px);}
.blog-body{padding:22px 22px 26px;}
.blog-date{font-size:12.5px; color:var(--rust-dark); font-weight:600; margin-bottom:8px;}
.blog-date.navy-date{color:var(--gold);}
.blog-body h3{font-size:17px; margin-bottom:8px;}
.blog-body p{font-size:14px; color:#4A4A40;}

/* splitter (homepage) */
.split{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line);}
@media(max-width:820px){ .split{grid-template-columns:1fr;} }
.split-panel{background:var(--bone); padding:56px 44px; display:flex; flex-direction:column;}
.split-panel.navy{background:#EEF0EC;}
.split-panel .eyebrow-mark{margin-bottom:16px;}
.split-panel h3{font-size:28px; margin-bottom:14px;}
.split-panel p{font-size:15.5px; color:#4A4A40; margin-bottom:26px; flex-grow:1;}

/* hero generic */
.hero{padding:80px 0 64px;}
.hero .wrap{display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:center;}
@media(max-width:900px){ .hero .wrap{grid-template-columns:1fr; gap:36px;} .hero{padding:52px 0 44px;} }
.hero h1{font-size:clamp(36px, 5vw, 56px); max-width:640px;}
.hero h1 em{font-style:italic; color:var(--rust);}
.hero h1 em.navy-em{color:var(--navy);}
.hero p.lede{margin-top:22px; font-size:18px; color:var(--forest); max-width:480px;}
.hero-ctas{margin-top:30px; display:flex; gap:16px; flex-wrap:wrap;}
.hero-art{position:relative; aspect-ratio:4/5; background:var(--sage); border-radius:2px; overflow:hidden; display:flex; align-items:flex-end;}
.hero-art.navy-art{background:var(--navy);}
.hero-art::before{content:""; position:absolute; inset:0; background:repeating-linear-gradient(115deg, rgba(51,61,44,0.55) 0px, rgba(51,61,44,0.55) 3px, transparent 3px, transparent 34px); mix-blend-mode:multiply;}
.hero-art.navy-art::before{background:repeating-linear-gradient(115deg, rgba(0,0,0,0.45) 0px, rgba(0,0,0,0.45) 3px, transparent 3px, transparent 34px);}
.hero-art-caption{position:relative; padding:24px 26px; color:var(--bone); font-family:'Fraunces', serif; font-style:italic; font-size:19px; line-height:1.35; background:linear-gradient(180deg, transparent, rgba(51,61,44,0.75) 65%); width:100%;}
.hero-art.navy-art .hero-art-caption{background:linear-gradient(180deg, transparent, rgba(0,0,0,0.7) 65%);}

/* footer */
footer{background:var(--forest); color:#CBD2BC; padding:60px 0 32px;}
footer.navy-footer{background:var(--navy-dark); color:#C7CDD5;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,0.12);}
@media(max-width:760px){ .footer-grid{grid-template-columns:1fr 1fr; row-gap:30px;} }
.footer-grid h4{color:var(--bone); font-size:13px; font-weight:700; letter-spacing:.03em; margin-bottom:14px;}
.footer-grid ul{list-style:none;}
.footer-grid li{margin-bottom:9px; font-size:14.5px;}
.footer-grid a:hover{color:var(--bone);}
.footer-logo{font-family:'Fraunces', serif; color:var(--bone); font-size:21px; margin-bottom:12px;}
.footer-logo span{color:var(--rust);}
footer.navy-footer .footer-logo span{color:var(--gold);}
.footer-bottom{padding-top:26px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:13px; color:#98A187;}
footer.navy-footer .footer-bottom{color:#8D96A3;}

.skip-link{position:absolute; left:-999px; top:0; background:var(--rust); color:#fff; padding:12px 18px; z-index:100;}
.skip-link:focus{left:12px; top:12px;}

.pillar-badge{display:inline-block; font-size:12px; font-weight:700; letter-spacing:.03em; padding:6px 12px; border-radius:2px; margin-bottom:16px;}
.pillar-badge.sage-badge{background:var(--sage); color:var(--bone);}
.pillar-badge.navy-badge{background:var(--navy); color:var(--bone);}