*{box-sizing:border-box}
:root{
  --bg:#f5f1e8;
  --header-h:62px;
  --desktop-max:1480px;
}
html{scroll-behavior:smooth;background:var(--bg);scroll-padding-top:var(--header-h)}
body{margin:0;background:var(--bg);color:#101820;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
.site-header{
  position:sticky;top:0;z-index:1000;height:var(--header-h);
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;
  padding-left:max(28px,calc((100vw - var(--desktop-max))/2 + 8px));
  padding-right:max(28px,calc((100vw - var(--desktop-max))/2 + 8px));
  background:rgba(248,246,239,.98);
  border-bottom:1px solid rgba(25,85,44,.12);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.brand{
  font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:40px;
  line-height:1;color:#176534;text-decoration:none
}
.desktop-nav{display:flex;justify-content:center;gap:34px}
.desktop-nav a,.mobile-menu a{color:#18211d;text-decoration:none;font-size:14px}
.desktop-nav a:hover{color:#176534}
.header-actions{display:flex;align-items:center;gap:10px}
.header-cta{
  display:flex;align-items:center;justify-content:center;min-height:42px;
  padding:0 24px;border-radius:16px;background:#146b34;color:#fff;
  text-decoration:none;font-weight:700;font-size:13px
}
.menu-toggle{
  display:none;width:38px;height:38px;border:0;border-radius:50%;
  background:#ecece6;color:#176534;font-size:21px
}
.mobile-menu{
  position:fixed;z-index:999;top:64px;left:0;right:0;
  display:grid;grid-template-columns:1fr 1fr;gap:0;padding:10px 16px 16px;
  background:rgba(248,246,239,.995);border-bottom:1px solid rgba(25,85,44,.12);
  transform:translateY(-125%);opacity:0;pointer-events:none;transition:.2s ease
}
.mobile-menu.is-open{transform:none;opacity:1;pointer-events:auto}
.mobile-menu a{padding:12px 8px;border-bottom:1px solid rgba(25,85,44,.08)}

main{display:block}
.visual-section{
  position:relative;margin:0;padding:0;
  background:var(--bg);overflow:hidden
}
.visual-wrap{
  position:relative;width:min(86vw,var(--desktop-max));margin:0 auto;line-height:0;
  overflow:hidden
}
.visual-wrap picture,.visual-wrap img{display:block;width:100%;height:auto}
.hotspot{
  position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  z-index:5;border-radius:12px
}
.hotspot:focus-visible{outline:3px solid #176534;outline-offset:2px}
.hotspot--mobile{display:none}
.sr-only{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;
  margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;border:0!important
}

/* Compact edge blend only: no spacer bands and no masks over content. */
@media (min-width:701px){
  .visual-section + .visual-section::before{
    content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:min(86vw,var(--desktop-max));height:10px;z-index:4;pointer-events:none;
    background:linear-gradient(to bottom,rgba(245,241,232,.16),rgba(245,241,232,0))
  }
  .hotspot--desktop{display:block}
}

/* Mobile uses the already-approved dedicated mobile compositions.
   No viewport-height section sizing: this prevents blank bands on tall phones. */
@media (max-width:700px){
  :root{--header-h:64px}
  .site-header{
    height:64px;padding:0 12px 0 15px;grid-template-columns:auto 1fr;gap:8px
  }
  .brand{font-size:31px}
  .desktop-nav{display:none}
  .header-actions{justify-self:end}
  .header-cta{min-height:38px;padding:0 14px;border-radius:13px;font-size:12px}
  .menu-toggle{display:grid;place-items:center}
  .mobile-menu{top:64px}
  .visual-section{height:auto;min-height:0}
  .visual-wrap{width:100%;max-width:none;margin:0}
  .visual-wrap picture,.visual-wrap img{width:100%;height:auto}
  .hotspot--desktop{display:none}
  .hotspot--mobile{display:block}
}

@media (max-width:420px){
  .brand{font-size:28px}
  .header-cta{padding:0 11px;font-size:11px}
}


/* ===== V13 ANCHOR ALIGNMENT STANDARD ===== */
html{scroll-padding-top:var(--header-h);}
.visual-section{scroll-margin-top:0 !important;}
@media (max-width:700px){html{scroll-padding-top:64px}.visual-section{scroll-margin-top:0 !important}}