:root { --green:#145f4a; --deep:#0c4335; --lime:#b5d533; --orange:#f58a24; --cream:#f5f2e9; --ink:#18312b; --muted:#68756f; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif; }
a { color:inherit; text-decoration:none; }
button,select { font:inherit; }
img { display:block; width:100%; }
.container { width:min(1120px, calc(100% - 40px)); margin:auto; }
.utility { background:#f2f3f1; font-size:12px; color:#53615b; }
.utility-inner { height:34px; display:flex; justify-content:space-between; align-items:center; }
.utility a { margin-left:18px; }.utility b { background:var(--orange); color:white; border-radius:10px; padding:1px 7px; }
.header-inner { min-height:92px; display:flex; align-items:center; gap:28px; }.logo { display:flex; align-items:center; gap:10px; margin-right:auto; }.logo-mark { width:50px; height:50px; display:grid; place-items:center; color:white; background:var(--green); border-radius:50% 50% 46% 54%; font-family:Georgia,serif; font-size:30px; font-weight:bold; }.logo strong { display:block; font-size:24px; letter-spacing:.04em; color:var(--green); }.logo small { display:block; font-size:9px; letter-spacing:.18em; color:#7a8983; }.trust { border:1px solid #d9ddd9; box-shadow:0 3px 10px #153b2e12; padding:9px 14px; border-radius:4px; }.trust span,.trust em { font-size:11px; font-style:normal; }.trust strong { color:var(--orange); font-size:24px; margin-left:7px; }.contact-mini strong,.contact-mini small { display:block; }.contact-mini strong { font-size:22px; color:var(--deep); }.contact-mini small { color:#77817d; }.header-cta { background:var(--orange); color:white; padding:15px 21px; border-radius:4px; font-weight:bold; box-shadow:0 5px 0 #c9670d; }
.global-nav { background:var(--green); color:white; }.nav-grid { display:grid; grid-template-columns:repeat(5,1fr); }.nav-grid a { text-align:center; padding:19px 8px; font-weight:bold; border-left:1px solid #ffffff24; }.nav-grid a:last-child { border-right:1px solid #ffffff24; }.nav-grid a:hover { background:var(--deep); }
.hero { position:relative; min-height:615px; color:white; background:url("https://images.unsplash.com/photo-1731304319707-6168e48e4278?auto=format&fit=crop&w=2000&q=86") center/cover; }.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,#092e26e6 0%,#153f328c 49%,#1a362f26 100%); }.hero-inner { position:relative; min-height:565px; display:flex; justify-content:space-between; align-items:center; gap:60px; }.hero-copy { max-width:660px; }.eyebrow { font-family:Arial,sans-serif; font-size:12px; font-weight:bold; letter-spacing:.22em; color:#d7ed76; }.hero h1 { margin:16px 0; font-size:clamp(40px,5vw,68px); line-height:1.24; letter-spacing:.02em; text-shadow:0 4px 20px #0005; }.hero h1 span { color:#e3f48b; }.hero-lead { font-size:17px; }.hero-proof { width:max-content; max-width:100%; margin-top:34px; background:#ffffffed; color:var(--ink); border-top:4px solid var(--lime); padding:14px 22px; box-shadow:0 8px 22px #0002; }.hero-proof strong { color:var(--green); font-size:24px; margin-right:18px; }.hero-proof span { font-size:13px; }
.search-panel { width:310px; flex:0 0 310px; background:#fff; color:var(--ink); border-radius:10px; padding:18px; box-shadow:0 18px 44px #001b1666; }.panel-head { margin:-18px -18px 14px; padding:13px; text-align:center; border-radius:10px 10px 0 0; background:var(--orange); color:white; }.panel-head span,.panel-head strong { display:block; }.panel-head span { font-size:13px; }.panel-head strong { margin-top:2px; font-size:22px; }.search-panel label { display:block; margin:10px 0; color:#5d6864; font-size:12px; }.search-panel select { width:100%; height:47px; margin-top:4px; padding:0 12px; border:1px solid #dde1de; border-radius:5px; color:#34403b; background:#fafbf9; }.found { margin:14px -18px 10px; padding:11px; background:#f8f7d6; color:#5a5d42; text-align:center; }.found strong { color:#e65e18; font-size:25px; margin-right:3px; }.search-button { display:block; padding:14px; text-align:center; background:var(--orange); color:white; border-radius:5px; font-size:17px; font-weight:bold; box-shadow:inset 0 -3px 0 #c76913; }
.popular { position:relative; display:flex; align-items:center; gap:15px; min-height:50px; color:#31453e; background:#fffffff2; padding:10px 18px; font-size:12px; border-radius:10px 10px 0 0; overflow:auto; white-space:nowrap; }.popular span { font-weight:bold; color:var(--green); }.popular a { text-decoration:underline; text-underline-offset:4px; }
.quick-links { background:var(--cream); padding:28px 0; }.quick-grid { display:grid; grid-template-columns:repeat(4,1fr); background:white; border-radius:10px; box-shadow:0 10px 30px #19382c12; overflow:hidden; }.quick-grid a { display:flex; align-items:center; gap:14px; min-height:100px; padding:20px; border-right:1px solid #e5e7e2; }.quick-grid b { color:var(--orange); font-size:28px; }.quick-grid span { display:flex; flex-direction:column; font-size:13px; }.quick-grid strong { font-size:21px; }.quick-grid i { margin-left:auto; color:var(--green); font-style:normal; }
.section { padding:96px 0; }.section-head { margin-bottom:40px; text-align:center; }.section-head p { margin:0 0 12px; color:var(--orange); font:700 11px Arial,sans-serif; letter-spacing:.22em; }.section-head h2 { margin:0 0 12px; font-size:clamp(28px,4vw,42px); }.section-head span { color:var(--muted); font-size:14px; }.area-section { background:#fff; }.area-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }.area-card { position:relative; min-height:390px; overflow:hidden; border-radius:4px; background:#ddd; }.area-card img { height:100%; object-fit:cover; transition:transform .6s ease; }.area-card:hover img { transform:scale(1.06); }.area-overlay { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:25px; color:white; background:linear-gradient(0deg,#082f27e8 0%,transparent 70%); }.area-overlay small { color:#dceb93; }.area-overlay h3 { margin:5px 0; font-size:28px; }.area-overlay p { margin:0 0 22px; font-size:13px; }.area-overlay span { padding-top:13px; border-top:1px solid #ffffff66; font-size:12px; }
.property-section { background:var(--deep); }.section-head.light h2,.section-head.light span { color:white; }.filter-tabs { display:flex; justify-content:center; gap:5px; margin-bottom:30px; flex-wrap:wrap; }.filter-tabs button { border:0; background:white; padding:12px 18px; color:var(--deep); cursor:pointer; }.filter-tabs button:first-child { background:var(--lime); font-weight:bold; }.property-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.property-card { overflow:hidden; background:white; border-radius:6px; box-shadow:0 12px 40px #00191355; }.photo { position:relative; height:230px; overflow:hidden; }.photo img { height:100%; object-fit:cover; transition:transform .5s ease; }.property-card:hover .photo img { transform:scale(1.05); }.photo span { position:absolute; left:12px; bottom:12px; background:var(--orange); color:white; padding:6px 10px; font-size:11px; font-weight:bold; }.photo button { position:absolute; right:12px; top:12px; width:38px; height:38px; border:0; border-radius:50%; background:#ffffffed; color:var(--orange); font-size:22px; }.property-body { padding:22px; }.property-body small { color:var(--green); font-weight:bold; }.property-body h3 { margin:6px 0 12px; }.price strong { color:#e66720; font-size:28px; }.price span,.property-body p { color:#68756f; font-size:13px; }.property-body p { margin:8px 0; }.property-body a { display:block; margin-top:18px; padding-top:15px; border-top:1px solid #e4e6e3; color:var(--green); font-weight:bold; font-size:13px; }.center { margin-top:38px; text-align:center; }.outline-button { display:inline-block; border:1px solid #b7dbcc; padding:15px 28px; color:white; }
.guide { background:var(--cream); }.guide-grid { display:grid; grid-template-columns:1fr 1.25fr; gap:80px; align-items:center; }.eyebrow.dark { color:var(--orange); }.guide-copy h2 { margin:14px 0 22px; font-size:clamp(30px,4vw,46px); line-height:1.35; }.guide-copy > p:not(.eyebrow) { color:var(--muted); line-height:2; }.text-link { display:inline-block; margin-top:22px; color:var(--green); font-weight:bold; }.guide-list { border-top:1px solid #ced4cd; }.guide-list a { display:flex; align-items:center; gap:22px; padding:23px 8px; border-bottom:1px solid #ced4cd; }.guide-list b { color:var(--orange); font-family:Georgia,serif; font-size:24px; }.guide-list span { display:flex; flex-direction:column; font-weight:bold; }.guide-list small { margin-bottom:6px; color:var(--green); font-weight:normal; }.guide-list i { margin-left:auto; font-style:normal; }
.reasons { background:white; }.reason-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:#dfe4df; }.reason-grid > div { position:relative; padding:38px; background:white; }.reason-grid b { position:absolute; right:22px; top:15px; color:#edf0ed; font:italic 70px Georgia,serif; }.reason-grid span { color:var(--orange); font:700 11px Arial,sans-serif; letter-spacing:.15em; }.reason-grid h3 { position:relative; margin:25px 0 12px; font-size:24px; }.reason-grid p { color:var(--muted); font-size:14px; line-height:1.9; }
.contact { position:relative; padding:90px 0; color:white; text-align:center; background:url("https://images.unsplash.com/photo-1470770841072-f978cf4d019e?auto=format&fit=crop&w=1800&q=80") center/cover; }.contact-bg { position:absolute; inset:0; background:#0b4335e8; }.contact-inner { position:relative; }.contact-inner > p:first-child { color:#dcec8a; }.contact h2 { font-size:clamp(30px,4vw,46px); }.contact-actions { display:flex; justify-content:center; gap:12px; margin:35px 0 20px; }.contact-actions a { min-width:280px; padding:18px; background:var(--orange); font-weight:bold; border-radius:4px; box-shadow:0 5px 0 #ac5508; }.contact-actions a:last-child { background:white; color:var(--deep); box-shadow:0 5px 0 #c7cbc8; }
footer { background:#092e26; color:#bdcdc6; padding:55px 0 20px; }.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:60px; }.footer-logo .logo-mark { background:#b5d533; color:#0b4335; }.footer-logo strong { color:white; }.footer-grid > div:not(.logo) { display:flex; flex-direction:column; gap:10px; font-size:13px; }.footer-grid > div > strong { color:white; margin-bottom:8px; }.copyright { max-width:1120px; margin:40px auto 0; padding-top:18px; border-top:1px solid #ffffff17; font-size:11px; text-align:center; }
@media (max-width:900px) { .trust,.contact-mini { display:none; }.nav-grid { grid-template-columns:repeat(4,1fr); }.nav-grid a:last-child { display:none; }.hero-inner { padding:60px 0; }.hero-copy { flex:1; }.area-grid { grid-template-columns:repeat(2,1fr); }.property-grid { grid-template-columns:repeat(2,1fr); }.property-card:last-child { display:none; }.guide-grid { gap:40px; } }
@media (max-width:640px) { .container { width:min(100% - 28px,1120px); }.utility { display:none; }.header-inner { min-height:72px; }.logo-mark { width:40px; height:40px; font-size:24px; }.logo strong { font-size:18px; }.header-cta { padding:11px 12px; font-size:12px; }.nav-grid { grid-template-columns:repeat(4,1fr); width:100%; }.nav-grid a { padding:13px 3px; font-size:10px; }.hero { min-height:auto; }.hero-inner { display:block; padding:55px 0 32px; }.hero h1 { font-size:38px; }.hero-lead { font-size:14px; }.hero-proof { padding:10px 12px; }.hero-proof strong,.hero-proof span { display:block; }.hero-proof strong { font-size:19px; }.search-panel { width:100%; margin-top:35px; }.popular { width:100%; border-radius:0; }.quick-grid { grid-template-columns:repeat(2,1fr); }.quick-grid a { min-height:86px; padding:14px; }.quick-grid strong { font-size:17px; }.section { padding:65px 0; }.area-grid,.property-grid,.reason-grid { grid-template-columns:1fr; }.area-card { min-height:320px; }.property-card:last-child { display:block; }.guide-grid { grid-template-columns:1fr; gap:35px; }.contact-actions { flex-direction:column; }.contact-actions a { min-width:0; }.footer-grid { grid-template-columns:1fr 1fr; }.footer-logo { grid-column:1/-1; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; } }
.area-card:first-child img { object-position:68% center; }
.area-card:nth-child(2) img { object-position:50% 46%; }
.area-card:nth-child(3) img { object-position:50% 58%; }
.area-card:nth-child(4) img { object-position:50% 58%; }
.hero h1 .hero-line { display:inline-block !important; color:white; white-space:nowrap !important; }
.hero h1 br { display:block !important; content:""; }
.hero h1 .hero-line em { color:#e3f48b; font-style:normal; }
.guide-copy h2 span { display:inline-block; white-space:nowrap; }
.property-card:nth-child(1) .photo img { object-position:50% 54%; }
.property-card:nth-child(2) .photo img { object-position:52% 50%; }
.property-card:nth-child(3) .photo img { object-position:50% 55%; }

/* Keep the full navigation header visible while scrolling. */
.utility { position:sticky; top:0; z-index:1002; }
.header { position:sticky; top:34px; z-index:1001; background:#fff; }
.global-nav { position:sticky; top:126px; z-index:1000; box-shadow:0 6px 18px rgba(7,45,36,.14); }
@media (max-width:640px) {
  .header { top:0; }
  .global-nav { top:72px; }
}

/* Kamikochi background shared by the first and closing views. */
.hero { background-image:url("./kamikochi-hero-upscaled.webp"); background-position:center; }
.contact { background-image:url("./kamikochi-hero-upscaled.webp"); background-position:center 56%; }