/* Michael Flexig · personal greeting for friends in Japan.
   Isolated selectors: does not alter the approved homepage or other pages. */
.mf-japan {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  overflow: hidden;
  color: #f7f2e8;
  background: #090a0d;
}
/* Exactly the same golden source image and warmth treatment as THE STORY.
   No changes to the original artwork or to any other page. */
.mf-japan::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg,rgba(8,10,28,.16),rgba(3,5,16,.34)),
    url("https://michaelflexig.com/wp-content/uploads/2026/10/MF-Story-Motherland-Golden-Dom-Phi-v01.png") 50% 50%/cover no-repeat;
  filter: saturate(1.10) contrast(1.12) brightness(.88);
}
.mf-japan-shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 20% 48%,rgba(5,7,18,.64),transparent 60%),
    radial-gradient(ellipse at 80% 48%,rgba(16,18,44,.28),transparent 56%),
    linear-gradient(180deg,rgba(8,9,26,.06),rgba(4,6,18,.14));
}
.mf-japan-layout {
  position: relative;
  z-index: 2;
  max-width: 1610px;
  margin: 0 auto;
  padding: clamp(96px,10vh,114px) clamp(25px,4vw,64px) 7px;
  display: grid;
  grid-template-columns: minmax(0,1.34fr) minmax(430px,1fr);
  gap: clamp(34px,3.4vw,62px);
  align-items: center;
}
.mf-japan-letter { min-width: 0; max-width: 870px; }
.mf-japan-kicker {
  margin: 0 0 10px;
  color: rgba(255,255,255,.82);
  font: 500 11px/1.5 var(--mf-sans);
  letter-spacing: .22em;
}
.mf-japan-overline { color: #f1d9ac; font: 500 13px/1.6 var(--mf-sans); letter-spacing: .1em; margin: 0 0 6px; }
.mf-japan h1 {
  color: #f1dfb7;
  font-family: var(--mf-display), "Yu Mincho", "Hiragino Mincho ProN", "Noto Serif CJK JP", serif;
  font-size: clamp(39px,3.6vw,60px);
  font-weight: 500;
  font-variant-caps: small-caps;
  font-feature-settings: "smcp" 1;
  letter-spacing: .045em;
  line-height: 1.08;
  margin: 0 0 6px;
  text-shadow: 0 1px 14px rgba(0,0,0,.38), 0 0 20px rgba(224,184,103,.10);
}
.mf-japan-en {font: 500 10px/1.5 var(--mf-sans); letter-spacing:.18em; color:rgba(241,223,183,.88); margin:0 0 11px}
.mf-japan-rule {height:1px;width:min(100%,480px);margin:0 0 12px;background:linear-gradient(to right,rgba(217,189,122,.54),transparent)}
.mf-japan-content {
  font-family: var(--mf-sans),"Yu Gothic","Hiragino Kaku Gothic ProN","Noto Sans CJK JP",sans-serif;
  font-size: 16px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
  color: rgba(241,223,183,.92);
  text-shadow: 0 2px 18px rgba(0,0,0,.54);
}
.mf-japan-content p { margin:0 0 9px; }
.mf-japan-content strong { font-weight: 500; color: #f1dfb7; }
.mf-japan-signature { margin: 9px 0 9px; }
.mf-japan-signature strong { display:block;font:500 clamp(28px,2.2vw,36px)/1.12 var(--mf-display);color:#f1dfb7;letter-spacing:.045em;font-variant-caps:small-caps }
.mf-japan-signature span {display:block;margin-top:4px;font:500 10px/1.5 var(--mf-sans);letter-spacing:.12em;color:rgba(241,223,183,.88)}
.mf-japan-links {display:flex;flex-wrap:wrap;gap:6px 23px;align-items:center}
.mf-japan-links a {
  display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;min-height:28px;
  padding:4px 0;border:0;background:transparent;
  color:rgba(241,223,183,.92);font:500 11px/1.5 var(--mf-sans);letter-spacing:.12em;text-decoration:none;
  transition:color .2s ease;
}
.mf-japan-links a:hover {color:#fff1d1;text-decoration:underline;text-underline-offset:5px}
.mf-japan-links a.mf-japan-primary {background:transparent;color:rgba(241,223,183,.92);border:0}
.mf-japan-portrait {margin:0;justify-self:center;width:100%;max-width:640px}
.mf-japan-portrait img {
  display:block;width:100%;height:auto;max-height:560px;object-fit:contain;
  border:1px solid rgba(223,181,119,.35);padding:5px;background:rgba(1,7,14,.29);
  box-shadow:0 18px 55px rgba(0,0,0,.33);
}
.mf-japan-portrait figcaption {margin-top:9px;text-align:right;color:rgba(241,223,183,.88);font:500 10px/1.5 var(--mf-sans);letter-spacing:.13em}
.mf-japan-footer {position:relative;z-index:2;max-width:1610px;margin:auto;padding:10px clamp(25px,4vw,64px) 14px;border-top:1px solid rgba(224,185,120,.24);display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;color:rgba(241,223,183,.82);font:500 10px/1.5 var(--mf-sans);letter-spacing:.13em}
.mf-japan-footer a:hover {color:#f2d5a1}
@media (max-width:900px) {
  .mf-japan-layout {grid-template-columns:1fr;gap:22px;padding:107px 22px 25px}
  .mf-japan-shade {background:linear-gradient(180deg,rgba(5,7,18,.44),rgba(5,7,18,.29) 58%,rgba(5,7,18,.46))}
  .mf-japan h1 {font-size:clamp(32px,7.6vw,48px)}
  .mf-japan-content {font-size:15.5px;line-height:1.69}
  .mf-japan-portrait {max-width:600px}
  .mf-japan-links a {flex:0 1 auto}
  .mf-japan-footer {justify-content:center;text-align:center;padding:18px 22px 25px}
}
@media (max-width:430px) {
  .mf-japan-layout {padding-top:108px;padding-inline:18px}
  .mf-japan-content {font-size:15px}
  .mf-japan-links a {width:auto}
}
@media (prefers-reduced-motion:reduce){.mf-japan-links a{transition:none}}