/* Seasons of Japan | PWA navigation and first-visit mobile invitation. */
body .site-header #primary-nav>a.nav-pwa {
  color:#f8e6a9;
  border-color:rgba(228,199,98,.38);
}
body .site-header #primary-nav>a.nav-pwa:hover,
body .site-header #primary-nav>a.nav-pwa[aria-current="page"] {
  color:#fff;
  border-color:#e4c762;
}

/* Accommodate one more global link without shrinking the approved logo excessively. */
@media (min-width:1051px) and (max-width:1340px) {
  body .site-header .brand {flex-basis:126px;width:126px}
  body .site-header .brand img {left:-9px;width:122px;height:122px}
  body .site-header #primary-nav {gap:5px}
  body .site-header #primary-nav>a {padding-inline:8px;font-size:12px}
  body .site-header #primary-nav .small-button {padding-inline:11px;gap:7px;font-size:12px}
}
@media (min-width:1051px) and (max-width:1140px) {
  body .site-header .brand {flex-basis:111px;width:111px}
  body .site-header #primary-nav {gap:3px}
  body .site-header #primary-nav>a {padding-inline:7px}
  body .site-header #primary-nav .small-button {padding-inline:9px}
}
/* The mobile drawer must remain scrollable on shorter phones. */
@media (max-width:1050px) {
  body .site-header #primary-nav.nav-open {
    max-height:calc(100dvh - 96px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
}

.soj-pwa-invite {
  position:fixed;
  right:14px;
  bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  z-index:930;
  box-sizing:border-box;
  width:min(358px, calc(100vw - 28px));
  max-height:calc(100dvh - 35px - env(safe-area-inset-bottom, 0px));
  overflow-y:auto;
  padding:17px 17px 15px;
  color:#163e32;
  background:linear-gradient(155deg,#fffef8 0%,#faf3e4 100%);
  border:1px solid #d7c389;
  border-top:3px solid #bd9f43;
  border-radius:17px;
  box-shadow:0 19px 42px rgba(3,27,19,.26),0 3px 10px rgba(3,27,19,.12);
  font-family:inherit;
  line-height:1.35;
  text-align:left;
  animation:soj-pwa-invite-enter .35s ease-out both;
}
.soj-pwa-invite * {box-sizing:border-box}
.soj-pwa-invite-top {
  display:flex;
  gap:12px;
  align-items:center;
  padding-right:26px;
}
.soj-pwa-invite-top img {
  flex:0 0 60px;
  width:60px;
  height:60px;
  display:block;
  object-fit:contain;
  border-radius:13px;
  background:#fff;
  border:1px solid #e2d8b9;
  box-shadow:0 3px 9px rgba(3,40,27,.08);
}
.soj-pwa-invite-kicker {
  display:block;
  margin-bottom:5px;
  color:#977325;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
}
.soj-pwa-invite-top strong {
  display:block;
  font-size:19px;
  line-height:1.12;
  letter-spacing:-.02em;
  font-weight:900;
}
.soj-pwa-invite>p {
  margin:11px 0 13px;
  font-size:13px;
  line-height:1.45;
  color:#3a564c;
}
.soj-pwa-invite-close {
  position:absolute;
  top:4px;
  right:5px;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  background:transparent;
  border:0;
  border-radius:50%;
  color:#506c61;
  font-size:27px;
  cursor:pointer;
}
.soj-pwa-invite-close:hover {background:rgba(22,62,50,.07);color:#163e32}
.soj-pwa-invite-buttons {display:flex;align-items:center;gap:8px}
.soj-pwa-invite-buttons button {
  min-height:43px;
  font-size:13px;
  font-weight:800;
  border-radius:10px;
  cursor:pointer;
}
.soj-pwa-invite-action {
  flex:1 1 auto;
  background:#073e2b;
  color:#fff;
  border:1px solid #073e2b;
  padding:8px 15px;
}
.soj-pwa-invite-action:hover {background:#08543a}
.soj-pwa-invite-later {
  flex:0 0 auto;
  padding:8px 12px;
  background:#fffdf7;
  color:#164331;
  border:1px solid #b9c8bd;
}
.soj-pwa-invite-later:hover {background:#f1eadb}
.soj-pwa-invite-steps {
  margin-top:13px;
  padding:11px 12px;
  border-radius:10px;
  border:1px solid #dfd1a7;
  background:#fffefa;
}
.soj-pwa-invite-steps[hidden]{display:none!important}
.soj-pwa-invite-steps ol {
  padding-left:19px;
  margin:0 0 9px;
  font-size:12px;
  line-height:1.65;
}
.soj-pwa-invite-steps li+li{margin-top:4px}
.soj-pwa-invite-steps a {
  font-size:12px;
  font-weight:800;
  color:#096342;
  text-decoration:underline;
  text-underline-offset:2px;
}
.soj-pwa-invite :focus-visible {outline:3px solid #bd9f43;outline-offset:3px}
/* Modals and the open mobile navigation always take priority. */
body.dialog-open .soj-pwa-invite,
body.nav-drawer-open .soj-pwa-invite,
html.soj-soft-nav-active .soj-pwa-invite {display:none!important}
@media (max-width:560px) {
  .soj-pwa-invite {
    left:12px;
    right:12px;
    bottom:calc(12px + env(safe-area-inset-bottom, 0px));
    width:auto;
    padding:16px;
  }
}
@keyframes soj-pwa-invite-enter {
  from{opacity:0;transform:translateY(13px)}
  to{opacity:1;transform:translateY(0)}
}
@media (prefers-reduced-motion: reduce) {
  .soj-pwa-invite {animation:none}
}
