/* Reet Trails — old-design header/footer, ported onto new-design blog pages.
   Scoped so it only touches the nav/footer chrome and never the article's
   own .btn/.kicker/.page-hero/.section styling from style.css. Values are
   hardcoded (not var()) since this file intentionally doesn't load theme.css. */

.container{width:100%;max-width:1180px;margin:0 auto;padding:0 24px}
.narrow{max-width:960px}

/* ---------- header / nav ---------- */
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid #dddddd}
.site-header .nav{display:flex;align-items:center;justify-content:space-between;height:76px}
.site-header .brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.site-header .brand img{height:44px;width:auto}
.site-header .brand-text{display:flex;flex-direction:column;line-height:1}
.site-header .brand-name{font-size:20px;font-weight:800;letter-spacing:.02em;color:#1c5138;font-family:inherit}
.site-header .brand-tag{font-size:9.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:#a67f3f;margin-top:4px}
.site-header .nav-links{display:flex;align-items:center;gap:30px;list-style:none;margin:0;padding:0}
.site-header .nav-links a{color:#222222;font-size:15.5px;font-weight:600;position:relative;padding:6px 0;text-decoration:none}
.site-header .nav-links a:hover{color:#1c5138}
.site-header .nav-links a.active{color:#1c5138}
.site-header .nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:#c19a5b;border-radius:2px}
.site-header .nav-right{display:flex;align-items:center;gap:16px}
.site-header .btn,.nav-drawer .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:inherit;font-size:16px;font-weight:600;line-height:1;padding:15px 26px;border-radius:12px;border:1.5px solid transparent;cursor:pointer;transition:background .18s,color .18s,border-color .18s,transform .18s;white-space:nowrap;text-decoration:none}
.site-header .btn svg,.nav-drawer .btn svg{width:18px;height:18px}
.site-header .btn--primary,.nav-drawer .btn--primary{background:#1c5138;color:#fff}
.site-header .btn--primary:hover,.nav-drawer .btn--primary:hover{background:#123726;color:#fff}
.site-header .btn--sm,.nav-drawer .btn--sm{padding:11px 18px;font-size:14px}
.site-header .nav-toggle{display:none;background:none;border:0;padding:8px;cursor:pointer;color:#222222}
.site-header .nav-toggle svg{width:26px;height:26px}
.nav-drawer{display:none}
@media(max-width:900px){
  .site-header .nav-links,.site-header .nav-right .btn{display:none}
  .site-header .nav-toggle{display:inline-flex}
  .nav-drawer{display:block;position:fixed;inset:76px 0 auto 0;background:#fff;border-bottom:1px solid #dddddd;padding:12px 24px 22px;transform:translateY(-8px);opacity:0;pointer-events:none;transition:.2s;z-index:59}
  .nav-drawer.open{opacity:1;transform:none;pointer-events:auto}
  .nav-drawer a{display:block;padding:14px 0;font-size:17px;font-weight:600;color:#222222;text-decoration:none;border-bottom:1px solid #ebebeb}
  .nav-drawer .btn{margin-top:16px;width:100%}
}

/* ---------- footer ---------- */
.site-footer{position:relative;background:linear-gradient(180deg,rgba(15,43,31,.90),rgba(11,31,22,.97)),url("../trek-ebc.jpg");background-size:cover;background-position:center 28%;color:#c8d5cc}
.site-footer a{text-decoration:none}
.footer-top{padding:44px 0 32px;gap:30px;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr}
@media(max-width:980px){.footer-top{grid-template-columns:1fr 1fr;gap:32px}}
@media(max-width:560px){.footer-top{grid-template-columns:1fr}}
.footer-brand img{height:52px;filter:brightness(0) invert(1);opacity:.95}
.footer-brand .fbt{font-size:19px;font-weight:800;color:#fff;letter-spacing:.02em}
.footer-brand p{font-size:14px;margin-top:12px;line-height:1.6;color:#a9bbb0;max-width:38ch}
.footer-col h4{color:#fff;font-size:14px;font-weight:700;margin-bottom:12px;letter-spacing:.02em}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.footer-col a{color:#b7c7bc;font-size:14px}
.footer-col a:hover{color:#fff}
.footer-contact li{display:flex;gap:10px;color:#b7c7bc;font-size:14px;line-height:1.5}
.footer-contact svg{width:18px;height:18px;color:#c19a5b;flex-shrink:0;margin-top:2px}
.footer-social{display:flex;gap:12px;margin-top:14px}
.footer-social a{width:36px;height:36px;border-radius:999px;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;color:#cdd9d0}
.footer-social a:hover{background:#1c5138;border-color:#1c5138;color:#fff}
.footer-social svg{width:17px;height:17px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:16px 0;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;color:#95a89d}
.footer-bottom a{color:#95a89d}
.footer-bottom a:hover{color:#fff}

/* ---------- floating whatsapp ---------- */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:80;display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:999px;background:#25d366;color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.25);transition:transform .18s;text-decoration:none}
.wa-float:hover{transform:scale(1.06);color:#fff}
.wa-float svg{width:30px;height:30px}