.sn .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 76px; }
.sn-brand { display: inline-flex; align-items: center; gap: 0.6rem; text-decoration: none; flex-shrink: 0; }
.sn-tag { font-size: 0.72rem; font-weight: 800; color: var(--green-deep); background: var(--green-tint); border-radius: 999px; padding: 0.2rem 0.6rem; }
.sn-links { display: flex; align-items: center; gap: 1.4rem; font-weight: 600; font-size: 0.95rem; white-space: nowrap; min-width: 0; }
.sn-links a { position: relative; color: var(--muted); text-decoration: none; padding: 0.3rem 0; }
.sn-links a::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 2px; background: var(--red); transition: width 0.25s ease; }
.sn-links a:hover { color: var(--ink); }
.sn-links a:hover::after, .sn-links a.on::after { width: 100%; }
.sn-links a.on { color: var(--ink); }
.sn-right { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }
.sn-cta { padding: 0.7rem 1.2rem; font-size: 0.92rem; }
.sn-menu { display: none; position: relative; width: 46px; height: 46px; border: 0; border-radius: 14px; background: var(--green-tint); cursor: pointer; flex-shrink: 0; }
.sn-menu span { position: absolute; left: 13px; width: 20px; height: 2.5px; border-radius: 2px; background: var(--green-deep); transition: transform 0.3s ease, opacity 0.2s ease, top 0.3s ease; }
.sn-menu span:nth-child(1) { top: 15px; }
.sn-menu span:nth-child(2) { top: 22px; }
.sn-menu span:nth-child(3) { top: 29px; }
.sn-menu.open span:nth-child(1) { top: 22px; transform: rotate(45deg); }
.sn-menu.open span:nth-child(2) { opacity: 0; }
.sn-menu.open span:nth-child(3) { top: 22px; transform: rotate(-45deg); }
.sn-mobile { display: none; }

@media (max-width: 1080px) {
  .sn-links { display: none; }
  .sn-menu { display: block; }
  .sn-mobile { display: block; max-height: 0; overflow: hidden; background: var(--white); border-top: 1px solid transparent; transition: max-height 0.4s ease, border-color 0.3s ease; }
  .sn-mobile.open { max-height: calc(100vh - 76px); max-height: calc(100dvh - 76px); overflow-y: auto; border-top-color: var(--line); box-shadow: 0 18px 30px rgba(26, 36, 32, 0.08); }
  .sn-mobile-in { max-width: 1160px; margin: 0 auto; padding: 0.4rem 1.25rem 1.25rem; display: grid; }
  .sn-mobile a:not(.btn) { padding: 0.9rem 0.25rem; font-weight: 700; font-size: 1.05rem; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line); }
  .sn-mobile a.on { color: var(--green-deep); }
  .sn-mobile .btn { margin-top: 1rem; width: 100%; }
}
@media (max-width: 600px) {
  .sn .wrap { height: 66px; }
  .sn .logo { height: 40px; }
  .sn-cta { display: none; }
  .sn-mobile.open { max-height: calc(100vh - 66px); max-height: calc(100dvh - 66px); }
}

.sf { margin-top: 3rem; border-top: 1px solid var(--line); background: #FAFCFB; color: var(--muted); font-size: 0.92rem; }
.sf .sf-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; padding-top: 2.5rem; padding-bottom: 2rem; }
.sf-brand img { height: 50px; width: auto; margin-bottom: 0.6rem; }
.sf-tag { font-weight: 700; color: var(--green-deep); margin-bottom: 0.4rem; }
.sf h4 { font-family: var(--body); font-size: 0.82rem; text-transform: none; color: var(--ink); margin: 0 0 0.7rem; font-weight: 800; }
.sf-grid a { display: block; color: var(--muted); text-decoration: none; padding: 0.22rem 0; }
.sf-grid a:hover { color: var(--green-deep); }
.sf .sf-bottom { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 1rem; padding-bottom: calc(1.2rem + env(safe-area-inset-bottom, 0px)); font-size: 0.85rem; }
@media (max-width: 860px) { .sf-grid { grid-template-columns: 1fr 1fr; } .sf-brand { grid-column: 1 / -1; } }
@media print { .sf, .sn { display: none !important; } }
