/* ===========================================================
   Sira — shared styles
   Palette derived from brand mark: forest green, gold, cream
=========================================================== */

:root{
  --green-900: #1C2B25;
  --green-800: #24382F;
  --green-700: #2F4A40;
  --green-600: #405F56;   /* brand mark background */
  --green-500: #557166;
  --gold: #D9A94E;
  --gold-soft: #E7C583;
  --cream: #F1E2C9;       /* brand mark highlight */
  --paper: #FBF6EC;       /* warm off-white page background */
  --paper-dim: #F3EBDC;
  --navy: #262D35;
  --ink: #20302A;
  --ink-soft: #4B5C55;
  --line: rgba(32,48,42,0.12);
  --line-on-dark: rgba(241,226,201,0.18);

  --serif: "Fraunces", "Iowan Old Style", ui-serif, Georgia, serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --radius: 20px;
  --radius-sm: 12px;
  --container: 1180px;
}

*{box-sizing:border-box;}
button{font:inherit;color:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;}
button::-moz-focus-inner{border:0;padding:0;}
html{scroll-behavior:smooth;overflow-x:clip;}
body{overflow-x:clip;
  margin:0;
  font-family:var(--sans);
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

.wrap{
  max-width:var(--container);
  margin:0 auto;
  padding:0 28px;
}

h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:600;
  line-height:1.08;
  margin:0 0 0.4em;
  letter-spacing:-0.01em;
  color:var(--green-900);
}
h1{font-size:clamp(2.6rem, 5.4vw, 4.6rem); font-weight:560;}
h2{font-size:clamp(1.9rem, 3.4vw, 2.7rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1em; color:var(--ink-soft);}

.eyebrow{
  font-family:var(--sans);
  font-size:0.78rem;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--gold);
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:26px;height:1px;
  background:var(--gold);
  display:inline-block;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 26px;
  border-radius:999px;
  font-family:var(--sans);
  font-weight:600;
  font-size:0.96rem;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px);}
.btn-gold{
  background:var(--gold);
  color:var(--green-900);
}
.btn-gold:hover{background:var(--gold-soft);}
.btn-ghost{
  background:transparent;
  color:var(--paper);
  border-color:var(--line-on-dark);
}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold);}
.btn-outline{
  background:transparent;
  color:var(--green-900);
  border-color:var(--line);
}
.btn-outline:hover{border-color:var(--green-900);}

/* ---------- Nav ---------- */
header.site-nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(251,246,236,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 28px;
}
.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--serif);
  font-size:1.28rem;
  font-weight:600;
  color:var(--green-900);
}
.brand img{width:34px;height:34px;border-radius:9px;}
.nav-links{
  display:flex;
  align-items:center;
  gap:34px;
  font-size:0.95rem;
  font-weight:500;
  color:var(--green-800);
}
.nav-links a{opacity:0.82;transition:opacity .2s;}
.nav-links a:hover{opacity:1;}
.nav-cta{display:flex;align-items:center;gap:16px;}
.nav-cta .btn{padding:11px 22px;font-size:0.9rem;}

.nav-toggle{
  display:none;
    background:none;
      border:none;
        padding:6px;
          margin:0;
            cursor:pointer;
              color:var(--green-900);
                align-items:center;
                  justify-content:center;
                  }
                  .nav-toggle svg{width:24px;height:24px;display:block;}
                  
                  .mobile-menu{
                    display:none;
                      flex-direction:column;
                        background:var(--paper);
                          border-top:1px solid var(--line);
                            padding:8px 20px 18px;
                            }
                            .mobile-menu a{
                              padding:14px 2px;
                                border-bottom:1px solid var(--line);
                                  font-size:1rem;
                                    font-weight:500;
                                      color:var(--green-800);
                                      }
                                      .mobile-menu a:last-child{border-bottom:none;}
                                      .mobile-menu.open{display:flex;}
                                      
                                      @media (max-width:860px){
          header.site-nav .nav-row{padding:19px 20px;}
                                                                        .nav-links{display:none;}
                                            .nav-cta{gap:10px;}
                                              .nav-cta .btn-outline{display:none;}
                                                .nav-cta .btn-gold{display:none;}
                                                  .nav-toggle{display:inline-flex;}
          .brand{font-size:1.3rem;}
                    .brand img{width:36px;height:36px;}
                                                                          }
                                                      @media (min-width:861px){
                                                        .mobile-menu{display:none !important;}
                                                        }

/* ---------- Footer ---------- */
footer.site-footer{
  background:var(--green-900);
  color:var(--cream);
  padding:64px 0 28px;
  margin-top:120px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr;
  gap:40px;
  padding-bottom:44px;
  border-bottom:1px solid var(--line-on-dark);
}
.footer-grid h4{color:var(--cream);font-family:var(--sans);font-size:0.85rem;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;margin-bottom:16px;opacity:0.75;}
.footer-brand{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:1.3rem;margin-bottom:14px;}
.footer-brand img{width:32px;height:32px;border-radius:8px;}
.footer-grid p{color:rgba(241,226,201,0.7);max-width:32ch;}
.footer-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.footer-links a{color:rgba(241,226,201,0.82);font-size:0.95rem;}
.footer-links a:hover{color:var(--gold);}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:24px;
  font-size:0.82rem;
  color:rgba(241,226,201,0.55);
  flex-wrap:wrap;
  gap:12px;
}

@media (max-width:760px){
  .footer-grid{grid-template-columns:1fr 1fr;}
}

/* ---------- Generic section helpers ---------- */
section{padding:96px 0;}
.section-tight{padding:64px 0;}
.center{text-align:center;}
.max-w{max-width:640px;margin-left:auto;margin-right:auto;}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.grid-2 > *, .grid-3 > *{min-width:0;}
img,svg{max-width:100%;}
@media (max-width:860px){
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
}

.card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:34px 30px;
}

/* page hero band used on secondary pages */
.page-hero{
  background:var(--green-900);
  color:var(--paper);
  padding:120px 0 90px;
}
.page-hero .eyebrow{color:var(--gold);}
.page-hero h1{color:var(--paper);}
.page-hero p{color:rgba(241,226,201,0.78);}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

@media (max-width:600px){
  section{padding:64px 0;}
  .wrap{padding:0 20px;}
}

.mode-pill{font-family:var(--sans);font-size:0.82rem;font-weight:600;padding:8px 16px;border-radius:999px;border:1px solid var(--line-on-dark);background:transparent;color:rgba(241,226,201,0.65);cursor:pointer;transition:all .25s ease;}
.mode-pill.active{background:var(--gold);color:var(--green-900);border-color:var(--gold);}
