.nara-hero-slider.hero-mockup2{position:relative;overflow:hidden;min-height:clamp(500px,62vw,650px);background:#dfe6dc}
.hero-mockup2 .nara-hero-slides,.hero-mockup2 .nara-hero-slide{min-height:inherit}
.hero-mockup2 .nara-hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .85s ease,visibility .85s ease}
.hero-mockup2 .nara-hero-slide.is-active{opacity:1;visibility:visible;z-index:2}
.hero-mockup2 .nara-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.hero-mockup2 .nara-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,252,246,.93) 0%,rgba(255,252,246,.80) 29%,rgba(255,252,246,.34) 49%,rgba(255,252,246,.04) 72%)}
.hero-mockup2 .nara-hero-content{position:relative;z-index:3;display:flex;flex-direction:column;justify-content:center;min-height:inherit;padding-top:48px;padding-bottom:78px}
.hero-mockup2 h1,.hero-mockup2 h2{width:min(680px,56vw);margin:0;color:#1f1b18;font-family:"Yu Mincho","Hiragino Mincho ProN","Noto Serif JP",serif;font-weight:700;font-size:clamp(3rem,5.1vw,5.4rem);line-height:1.08;letter-spacing:-.045em;text-shadow:0 2px 14px rgba(255,255,255,.72)}
.hero-mockup2 h1 span,.hero-mockup2 h2 span{color:#b7482f}
.hero-mockup2 .nara-hero-content p{margin:22px 0 0;color:#29231f;font-size:clamp(1.02rem,1.45vw,1.22rem);line-height:1.85;font-weight:600;text-shadow:0 2px 12px rgba(255,255,255,.88)}
.hero-mockup2 .nara-hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}
.hero-mockup2 .nara-hero-actions .btn{min-height:54px;padding:0 26px;border-radius:999px;font-size:1rem;font-weight:850}
.hero-mockup2 .nara-hero-actions .btn-primary{background:#be4d31;border-color:#be4d31;color:#fff;box-shadow:0 10px 22px rgba(125,45,27,.16)}
.hero-mockup2 .nara-hero-actions .btn-light{background:rgba(255,255,255,.92);border:1px solid rgba(70,55,42,.18);color:#2a241f;backdrop-filter:blur(8px)}
.hero-mockup2 .nara-hero-arrow{position:absolute;z-index:5;top:50%;width:48px;height:48px;margin-top:-24px;border:1px solid rgba(255,255,255,.86);border-radius:50%;background:rgba(28,50,37,.72);color:#fff;font-size:2rem;line-height:1;cursor:pointer;backdrop-filter:blur(8px)}
.hero-mockup2 .nara-hero-prev{left:18px}.hero-mockup2 .nara-hero-next{right:18px}
.hero-mockup2 .nara-hero-dots{position:absolute;z-index:6;left:50%;bottom:22px;display:flex;gap:9px;transform:translateX(-50%)}
.hero-mockup2 .nara-hero-dots button{width:10px;height:10px;padding:0;border:1.5px solid #fff;border-radius:50%;background:rgba(53,79,62,.38);cursor:pointer}
.hero-mockup2 .nara-hero-dots button.is-active{background:#b7482f}
.hero-mockup2 .nara-hero-caption{position:absolute;z-index:4;right:22px;bottom:18px;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.82);color:#4b463f;font-size:.72rem;font-weight:800;backdrop-filter:blur(7px)}
.hero-quick-nav{border-bottom:1px solid rgba(74,85,74,.12);background:#fffaf2}
.hero-quick-nav-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.hero-quick-nav-grid a{display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;gap:0 10px;align-items:center;padding:18px 22px;color:#2d2823;text-decoration:none;border-right:1px solid rgba(74,85,74,.12)}
.hero-quick-nav-grid a:last-child{border-right:0}.hero-quick-nav-grid a>span{grid-row:1/3;color:#a45732;font-size:1.35rem}.hero-quick-nav-grid strong{font-size:.92rem}.hero-quick-nav-grid small{margin-top:3px;color:#7a756e;font-size:.72rem}
.home-regions-after-hero{padding-top:34px}.home-regions-after-hero .hero-card{width:100%}
@media(max-width:760px){
.nara-hero-slider.hero-mockup2{min-height:610px}.hero-mockup2 .nara-hero-shade{background:linear-gradient(180deg,rgba(255,252,246,.93) 0%,rgba(255,252,246,.74) 39%,rgba(255,252,246,.25) 66%,rgba(27,45,33,.08) 100%)}
.hero-mockup2 .nara-hero-content{justify-content:flex-start;padding-top:42px;padding-bottom:118px}.hero-mockup2 h1,.hero-mockup2 h2{width:94%;font-size:clamp(2.65rem,12vw,4.15rem);line-height:1.04}.hero-mockup2 .nara-hero-content p{width:94%;margin-top:17px;font-size:.96rem;line-height:1.72}
.hero-mockup2 .nara-hero-actions{display:grid;grid-template-columns:1fr;width:min(94%,430px);gap:10px;margin-top:20px}.hero-mockup2 .nara-hero-actions .btn{width:100%;min-height:50px;justify-content:center}
.hero-mockup2 .nara-hero-arrow{top:auto;bottom:54px;width:42px;height:42px;margin:0}.hero-mockup2 .nara-hero-prev{left:14px}.hero-mockup2 .nara-hero-next{right:14px}.hero-mockup2 .nara-hero-dots{bottom:70px}.hero-mockup2 .nara-hero-caption{right:13px;bottom:15px}
.hero-quick-nav-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-quick-nav-grid a{padding:14px 13px;border-bottom:1px solid rgba(74,85,74,.12)}.hero-quick-nav-grid a:nth-child(2n){border-right:0}.hero-quick-nav-grid a:nth-last-child(-n+2){border-bottom:0}
}
@media(prefers-reduced-motion:reduce){.hero-mockup2 .nara-hero-slide{transition:none}}


/* Final visual polish v3 */
.hero-break-mobile{display:none}

/* Slightly stronger text protection without washing out imagery */
.hero-mockup2 .nara-hero-shade{
  background:
    linear-gradient(90deg,
      rgba(255,252,246,.95) 0%,
      rgba(255,252,246,.84) 28%,
      rgba(255,252,246,.42) 48%,
      rgba(255,252,246,.08) 70%);
}

/* Better spacing to the quick nav and cleaner separation */
.hero-quick-nav{
  position:relative;
  box-shadow:0 -1px 0 rgba(255,255,255,.72), 0 8px 24px rgba(59,48,37,.04);
}
.hero-quick-nav::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(155,116,78,.22),transparent);
}

/* Keep theme labels compact on narrow displays */
.hero-mockup2 .nara-hero-caption{
  max-width:44vw;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Slightly soften arrows and keep them clear over varied images */
.hero-mockup2 .nara-hero-arrow{
  background:rgba(38,67,47,.80);
  box-shadow:0 6px 18px rgba(20,38,27,.18);
}

/* Mobile */
@media(max-width:760px){
  .hero-break-mobile{display:inline}

  .hero-mockup2 .nara-hero-shade{
    background:
      linear-gradient(180deg,
        rgba(255,252,246,.95) 0%,
        rgba(255,252,246,.82) 36%,
        rgba(255,252,246,.38) 62%,
        rgba(26,45,33,.08) 100%);
  }

  .hero-mockup2 h1,
  .hero-mockup2 h2{
    width:92%;
    font-size:clamp(2.35rem,10.7vw,3.75rem);
    line-height:1.02;
    letter-spacing:-.04em;
  }

  .hero-mockup2 .nara-hero-content{
    padding-top:40px;
  }

  .hero-mockup2 .nara-hero-content p{
    width:92%;
    margin-top:18px;
    font-size:.92rem;
    line-height:1.68;
  }

  .hero-mockup2 .nara-hero-actions{
    width:92%;
    margin-top:18px;
  }

  .hero-mockup2 .nara-hero-actions .btn{
    min-height:48px;
    font-size:.93rem;
  }

  .hero-mockup2 .nara-hero-caption{
    right:12px;
    bottom:14px;
    max-width:38vw;
    font-size:.66rem;
    padding:5px 8px;
  }

  .hero-quick-nav-grid a{
    min-height:92px;
  }
}

/* iPhone-class narrow widths */
@media(max-width:430px){
  .hero-mockup2 h1,
  .hero-mockup2 h2{
    font-size:clamp(2.15rem,10vw,3.25rem);
  }

  .hero-mockup2 .nara-hero-content p{
    font-size:.88rem;
  }

  .hero-quick-nav-grid strong{
    font-size:.86rem;
  }

  .hero-quick-nav-grid small{
    font-size:.68rem;
  }
}



/* Nara Plus desktop hero heading wrap fix 2026-09-25 */
@media(min-width:761px){
  .hero-mockup2 h1,
  .hero-mockup2 h2{
    width:max-content;
    max-width:88vw;
    white-space:nowrap;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .hero-mockup2 h1 span:not(.hero-break-mobile),
  .hero-mockup2 h2 span:not(.hero-break-mobile){
    white-space:nowrap;
  }
}