
.lp-template {
  box-sizing: border-box;
  width: 100%;
  max-width: 1160px;
  margin-inline: auto;
  --lp-ink: #1d1812;
  --lp-muted: #6f6258;
  --lp-line: #e5ddd4;
  --lp-paper: #fffaf3;
  --lp-cream: #f6efe3;
  --lp-accent: #b53625;
  --lp-accent-dark: #7d2018;
  --lp-green: #236044;
  --lp-gold: #c69a38;
  color: var(--lp-ink);
  background: var(--lp-paper);
  container-type: inline-size;
  font-family: "Noto Sans JP", system-ui, sans-serif;
  line-height: 1.8;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.lp-template * {
  box-sizing: border-box;
}

.lp-template h1, .lp-template h2, .lp-template h3 { font-weight: 700; }

.lp-template a {
  color: inherit;
}

.lp-section {
  padding: 72px 20px;
}

.lp-section-inner {
  width: min(1120px, 100%);
  margin: 0 auto;
}

.lp-hero {
  min-height: 0;
  display: grid;
  align-items: end;
  position: relative;
  overflow: hidden;
  color: #fff;
  background: #1e1712;
}

.lp-hero-media {
  position: relative;
  grid-area: 1 / 1;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 640px;
}

.lp-hero-media img,
.lp-image img,
.lp-menu-image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.lp-hero-overlay {
  position: absolute;
  inset: 0;
}

.lp-hero-content {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
  width: min(1120px, 100%);
  margin: 0 auto;
  padding: 96px 20px 64px;
}

.lp-hero-text-background {
  width: 100%;
  padding: 40px max(20px, calc((100% - 1080px) / 2));
}

.lp-kicker {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 4px 12px;
  border: 1px solid rgb(255 255 255 / 46%);
  font-size: 13px;
  letter-spacing: 0.08em;
}

.lp-hero h1 {
  margin: 20px 0 10px;
  max-width: 760px;
  font-size: 72px;
  line-height: 1.02;
  letter-spacing: 0;
}

.lp-hero-lead {
  max-width: 680px;
  margin: 0;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.5;
}

.lp-hero-copy {
  max-width: 640px;
  margin: 20px 0 0;
  font-size: 17px;
  color: inherit;
}

.lp-heading {
  display: grid;
  gap: 10px;
  margin-bottom: 32px;
}

.lp-heading span {
  color: var(--lp-accent);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.lp-heading h2 {
  margin: 0;
  font-size: 44px;
  line-height: 1.2;
  letter-spacing: 0;
}

.lp-heading p {
  max-width: 760px;
  margin: 0;
  color: var(--lp-muted);
}

.lp-intro {
  background: var(--lp-cream);
}

.lp-intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 40px;
  align-items: center;
}

.lp-image {
  position: relative;
  overflow: hidden;
  border-radius: 4px;
  background: #dfd4c3;
}

.lp-image-16x9 {
  aspect-ratio: 16 / 9;
}

.lp-image-4x3,
.lp-menu-image {
  aspect-ratio: 4 / 3;
}

.lp-menu-image {
  position: relative;
  overflow: hidden;
}

.lp-menu {
  background: #fff;
}

.lp-menu-grid {
  display: grid;
  grid-template-columns: repeat(var(--lp-columns, 3), minmax(0, 1fr));
  gap: 20px;
}

.lp-menu-item {
  border-top: 4px solid var(--lp-accent);
  background: var(--lp-card-background, var(--lp-paper));
}

.lp-menu-body {
  padding: 18px;
}

.lp-menu-body h3 {
  margin: 0 0 8px;
  font-size: 21px;
  line-height: 1.35;
}

.lp-menu-body p,
.lp-story p,
.lp-info-list dd {
  margin: 0;
  color: var(--lp-muted);
}

.lp-story {
  background: var(--lp-paper);
}

.lp-story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 44px;
  align-items: center;
}

.lp-story-text {
  font-size: 17px;
}

.lp-info {
  background: var(--lp-green);
  color: #fff;
}

.lp-info .lp-heading span,
.lp-info .lp-heading p,
.lp-info-list dd {
  color: inherit;
}

.lp-info-list {
  border-top: 1px solid rgb(255 255 255 / 22%);
}

.lp-info-row { display: grid; grid-template-columns: 180px minmax(0, 1fr); }

.lp-info-list dt,
.lp-info-list dd {
  margin: 0;
  padding: 18px 0;
  border-bottom: 1px solid rgb(255 255 255 / 22%);
}

.lp-info-list dt {
  font-weight: 700;
}

.lp-cta {
  padding: 64px 20px;
  background: #fff;
  color: #111;
}

.lp-access-grid { width: min(960px, 100%); display: grid; grid-template-columns: minmax(240px, 300px) minmax(0, 1fr); gap: 36px; align-items: start; }
.lp-access-no-map { grid-template-columns: minmax(0, 1fr); }
.lp-access-map { position: relative; width: 100%; aspect-ratio: 17 / 20; background: #f3f4f6; }
.lp-access-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lp-template .lp-map-link { position: absolute; top: 8px; left: 8px; min-height: 44px; display: inline-flex; align-items: center; gap: 8px; background: #fff; color: #1967d2; padding: 8px 12px; font-size: 12px; text-decoration: none; box-shadow: 0 1px 3px #0003; }
.lp-access-shop-name { margin: 0 0 18px; font-size: 20px; line-height: 1.6; }
.lp-access-list { margin: 0; border: 0; font-size: 14px; }
.lp-access-list .lp-info-row { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; }
.lp-access-list dt, .lp-access-list dd { padding: 4px 0; border: 0; color: inherit; }
.lp-access-list dt { font-weight: 400; }
.lp-access-contact { margin-top: 24px; }
.lp-access-contact h3 { margin: 0 0 8px; font-size: 18px; }
.lp-access-contact p { margin: 0 0 16px; font-size: 14px; }
.lp-access-details > .lp-access-contact:first-child { margin-top: 0; }
.lp-template .lp-cta .lp-cta-button { background: transparent; color: inherit; border: 1px solid currentColor; font-size: 14px; }

.lp-template .lp-cta-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 26px;
  border: 2px solid #fff;
  background: #fff;
  color: var(--lp-accent-dark);
  font-weight: 800;
  text-decoration: none;
}

.lp-footer {
  padding: 28px 20px;
  background: #1d1812;
  color: rgb(255 255 255 / 78%);
  text-align: center;
  font-size: 13px;
}

.lp-placeholder {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 180px;
  place-items: center;
  background:
    linear-gradient(135deg, rgb(181 54 37 / 16%), transparent),
    #e7dccb;
  color: var(--lp-muted);
  font-weight: 700;
}

@container (max-width: 760px) {
  .lp-hero h1 { font-size: 40px; }
  .lp-hero-lead { font-size: 22px; }
  .lp-heading h2 { font-size: 28px; }
  .lp-section {
    padding: 52px 16px;
  }

  .lp-hero-media {
    grid-area: auto;
  }

  .lp-hero-content {
    grid-area: auto;
    padding: 32px 16px;
  }

  .lp-intro-grid,
  .lp-story-grid,
  .lp-menu-grid {
    grid-template-columns: 1fr;
  }

  .lp-menu-grid {
    gap: 18px;
  }

  .lp-info-row {
    grid-template-columns: 1fr;
  }

  .lp-info-list dt {
    padding-bottom: 2px;
    border-bottom: 0;
  }

  .lp-info-list dd {
    padding-top: 0;
  }

  .lp-hero-text-background { padding: 32px 16px; }
  .lp-access-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .lp-access-map { max-width: 360px; margin-inline: auto; }
  .lp-cta { padding: 40px 16px; }
}

.lp-hero-no-image { min-height: 0; }
.lp-hero-no-image .lp-hero-content { padding: 64px 20px; }
.lp-hero-image-only { min-height: 0; }
.lp-hero-content .lp-cta-button { margin-top: 24px; }
.lp-single-column { grid-template-columns: minmax(0, 1fr); }
.lp-single-column .lp-heading p { max-width: none; }
.lp-intro-grid .lp-image { order: 2; }
.lp-gallery { background: #f3f4f6; }
.lp-gallery-grid { display: grid; grid-template-columns: repeat(var(--lp-columns, 3), minmax(0, 1fr)); gap: 20px; }
.lp-gallery figure { margin: 0; min-width: 0; }
.lp-gallery figcaption { padding-top: 12px; white-space: pre-wrap; }
.lp-template p, .lp-info-list dd { white-space: pre-wrap; }
.lp-menu-body .lp-price { margin-top: 12px; color: inherit; font-weight: 700; }
@container (max-width: 760px) {
  .lp-gallery-grid { grid-template-columns: minmax(0, 1fr); }
}
