@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,300,0,0");

/* Link-button system based on the supplied thin-frame reference. */
:root{
  --action-ink:#403B35;
  --action-circle:#A79A7A;
  --action-circle-hover:#C56831;
  --action-paper:#FFFDFC;
  --action-paper-warm:#FBF6EF;
  --action-border:rgba(64,59,53,.72);
}

:where(a,button,summary):focus-visible{
  outline:3px solid rgba(197,104,49,.34);
  outline-offset:4px;
}

/* Reference-style framed links */
.btn{
  position:relative;
  justify-content:center;
  width:min(100%,420px);
  min-height:68px;
  padding:11px 56px;
  border:1px solid var(--action-border);
  border-radius:0;
  background:var(--action-paper);
  color:var(--action-ink);
  font-family:"Noto Serif JP","Yu Mincho","YuMincho",serif;
  font-size:17px;
  font-weight:400;
  line-height:1.55;
  letter-spacing:.09em;
  box-shadow:none;
  transition:border-color .22s ease,color .22s ease,background-color .22s ease;
}
.btn-primary,.btn-outline{
  border-color:var(--action-border);
  background:var(--action-paper);
  color:var(--action-ink);
}
.btn .arrow{
  position:absolute;
  right:11px;
  top:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  margin:0;
  border-radius:50%;
  overflow:hidden;
  white-space:nowrap;
  background:var(--action-circle);
  color:#fff;
  transform:translateY(-50%);
  transition:background-color .22s ease,transform .22s ease;
}
.btn .arrow::before{
  content:"arrow_forward_ios";
  position:static;
  width:auto;
  height:auto;
  background:none;
  font-family:"Material Symbols Outlined";
  font-size:17px;
  font-weight:300;
  line-height:1;
  letter-spacing:0;
  font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;
}
.btn .arrow::after{display:none}
.service-more{
  width:min(100%,420px);
  min-height:68px;
  margin:28px auto 0;
  padding:11px 54px;
  justify-content:center;
}
.final-cta .btn-primary{
  width:auto;
  min-height:54px;
  padding:15px 30px;
  border:0;
  border-radius:999px;
  background:#fff;
  color:var(--pink-500);
  box-shadow:0 10px 28px rgba(67,54,60,.12);
}
.final-cta .btn-primary .arrow{display:none}

/* Reservation and phone links */
.reservation-phone{
  position:relative;
  width:min(100%,520px);
  max-width:520px;
  margin:28px auto 34px;
  min-height:142px;
  padding:24px 66px 24px 34px;
  border:1px solid var(--action-border);
  border-radius:0;
  background:var(--action-paper);
  color:var(--action-ink);
  box-shadow:none;
  transition:border-color .22s ease,background-color .22s ease;
}
.reservation-phone::after{
  content:"arrow_forward_ios";
  position:absolute;
  right:17px;
  top:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  overflow:hidden;
  white-space:nowrap;
  background:var(--action-circle);
  color:#fff;
  font-family:"Material Symbols Outlined";
  font-size:21px;
  font-weight:300;
  line-height:1;
  letter-spacing:0;
  transform:translateY(-50%);
  font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;
  transition:background-color .22s ease,transform .22s ease;
}
.reservation-phone-label,.reservation-phone-number,.reservation-phone-hours{color:var(--action-ink)}
.cta-band .tel{
  display:inline-block;
  min-width:0;
  min-height:0;
  margin-top:16px;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  color:#fff;
  box-shadow:none;
  transition:opacity .22s ease;
}
.cta-band .tel::after{display:none}
/* Inline links and downloads retain their function inside the same frame system. */
.inline-guide-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:min(100%,360px);
  min-width:0;
  min-height:68px;
  padding:11px 52px;
  border:1px solid var(--action-border);
  border-radius:0;
  background:var(--action-paper);
  color:var(--action-ink);
  font-family:"Noto Serif JP","Yu Mincho","YuMincho",serif;
  font-size:17px;
  font-weight:400;
  letter-spacing:.09em;
  box-shadow:none;
  transition:border-color .22s ease,background-color .22s ease;
}
.inline-guide-link::after{
  content:"arrow_forward_ios";
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:10px;
  top:50%;
  width:32px;
  height:32px;
  margin:0;
  border-radius:50%;
  overflow:hidden;
  white-space:nowrap;
  background:var(--action-circle);
  color:#fff;
  font-family:"Material Symbols Outlined";
  font-size:19px;
  font-weight:300;
  line-height:1;
  letter-spacing:0;
  font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;
  transform:translateY(-50%);
}
.form-download{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:calc(100% - 28px);
  min-height:62px;
  margin-left:auto;
  margin-right:auto;
  padding:9px 48px;
  border:1px solid var(--action-border);
  border-radius:0;
  background:var(--action-paper);
  color:var(--action-ink);
  font-family:"Noto Serif JP","Yu Mincho","YuMincho",serif;
  font-size:15px;
  font-weight:400;
  letter-spacing:.06em;
  box-shadow:none;
  transition:border-color .22s ease,background-color .22s ease;
}
.form-download::after{
  content:"download";
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:8px;
  top:50%;
  width:32px;
  height:32px;
  border-radius:50%;
  overflow:hidden;
  white-space:nowrap;
  background:var(--action-circle);
  color:#fff;
  font-family:"Material Symbols Outlined";
  font-size:20px;
  font-weight:300;
  line-height:1;
  letter-spacing:0;
  font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 24;
  transform:translateY(-50%);
}
.form-download.primary{
  border-color:var(--action-border);
  background:var(--action-paper-warm);
  color:var(--action-ink);
}
.form-download.primary::after{background:var(--action-circle);color:#fff}

/* Small navigational links use the same icon family without becoming oversized. */
.drawer-panel .drawer-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.drawer-panel .drawer-link::after,
footer ul a::after{
  content:"arrow_forward_ios";
  font-family:"Material Symbols Outlined";
  font-size:18px;
  font-weight:300;
  line-height:1;
  letter-spacing:0;
  font-variation-settings:"FILL" 0,"wght" 300,"GRAD" 0,"opsz" 20;
  transition:transform .22s ease,color .22s ease;
  flex:0 0 18px;
  width:18px;
  height:18px;
  overflow:hidden;
  white-space:nowrap;
}
.drawer-panel .drawer-link::after{color:var(--action-circle)}
.reservation-policy a,.prose a:not([class]),.news-post-body a{
  color:#9B4D25;
  text-decoration-line:underline;
  text-decoration-color:rgba(197,104,49,.55);
  text-decoration-thickness:1px;
  text-underline-offset:4px;
}
footer ul a{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:2px 0;
}
footer ul a::after{color:rgba(255,255,255,.48)}

@media (hover:hover){
  .btn:hover,.reservation-phone:hover,.inline-guide-link:hover,.form-download:hover{
    border-color:var(--action-circle-hover);
    background:#fff;
  }
  .btn:hover .arrow{background:var(--action-circle-hover)}
  .btn:hover .arrow{
    transform:translate(2px,-50%);
  }
  .reservation-phone:hover::after{
    background:var(--action-circle-hover);
    transform:translate(3px,-50%);
  }
  .form-download:hover::after,.inline-guide-link:hover::after{
    background:var(--action-circle-hover);
  }
  .drawer-panel .drawer-link:hover::after,footer ul a:hover::after{transform:translateX(3px)}
  footer ul a:hover::after{color:#fff}
  .cta-band .tel:hover{opacity:.82}
}

@media (max-width:768px){
  .btn{
    width:min(100%,360px);
    min-height:62px;
    margin-left:auto;
    margin-right:auto;
    padding:9px 48px;
    justify-content:center;
    font-size:16px;
    letter-spacing:.055em;
  }
  .btn .arrow{right:9px;width:26px;height:26px}
  .btn .arrow::before{font-size:16px}
  .service-more{margin:22px auto 0}
  .reservation-phone{
    width:calc(100% - 24px);
    min-height:132px;
    margin:22px auto 26px;
    padding:20px 50px 20px 22px;
  }
  .reservation-phone::after{right:12px;width:32px;height:32px;font-size:19px}
  .inline-guide-link{
    width:min(100%,340px);
    min-width:0;
    min-height:62px;
    padding:9px 45px;
    font-size:16px;
  }
  .inline-guide-link::after{width:30px;height:30px;font-size:18px}
  .form-download{width:calc(100% - 16px);min-height:58px;padding:8px 42px;font-size:14px}
  .form-download::after{width:30px;height:30px;font-size:19px}
  .final-cta .btn-primary{width:100%;min-height:54px;padding:15px 22px}
}

@media (max-width:380px){
  .cta-band .tel{font-size:29px}
}

@media (prefers-reduced-motion:reduce){
  .btn,.btn .arrow,.reservation-phone,.reservation-phone::after,
  .cta-band .tel,.cta-band .tel::after,.inline-guide-link,.form-download,
  .drawer-panel .drawer-link::after,footer ul a::after{transition:none!important}
}
