/* 152 入境 — the brand mark opens into the photograph once; afterwards a calm 150 composition:
   a large picture with a vertical caption beside it, changing by dissolve and depth. */
.c152{--paper:#eeece4}
.c152 .stage .brand{left:7vw;top:calc(var(--leap-vh, 100svh) * 0.38)}
.c152 .brand h1{font-size:clamp(26px,2.2vw,31px);letter-spacing:.16em;line-height:1.7}
.c152 .brand p{margin-top:10px;font-size:14px;letter-spacing:.16em}
.c152 .frame{left:52vw;top:calc(var(--leap-vh, 100svh) * 0.19);width:38vw;height:calc(var(--leap-vh, 100svh) * 0.63)}
.c152 .masked{position:absolute;inset:0;-webkit-mask:url(/brand-v127/round22/assets/leap-icon.svg) center/contain no-repeat;mask:url(/brand-v127/round22/assets/leap-icon.svg) center/contain no-repeat;z-index:3}
.c152 .shot{z-index:1}
.c152 .cap{left:89vw;top:calc(var(--leap-vh, 100svh) * 0.3);writing-mode:vertical-rl;display:flex;gap:16px}
.c152 .cap h2{letter-spacing:.3em}
.c152 .cap p{letter-spacing:.26em;font-size:13px}

/* Map: ink drawing, photograph slightly wider than tall. */
.c152 .map-canvas{--photo-ar:4/3}

/* Membership: 142 comparison — photographs reveal top-down, open rows beneath. */
.c152 .members{display:flex;flex-direction:column;justify-content:center;padding:100px 6vw 56px}
.c152 .members .section-title{margin-bottom:30px}

/* Closing: 142 vertical invitation — vertical title, photograph, text booking. */
.c152 .closing{display:grid;grid-template-columns:16% 1fr 22%;grid-template-rows:1fr auto;align-items:center;gap:0 5vw;padding:calc(var(--leap-vh, 100svh) * 0.15) 9vw calc(var(--leap-vh, 100svh) * 0.09)}
.c152 .closing h2{grid-column:1;grid-row:1;writing-mode:vertical-rl;justify-self:center;font-size:clamp(28px,2.4vw,34px);letter-spacing:.3em}
.c152 .closing figure{grid-column:2;grid-row:1/3;height:calc(var(--leap-vh, 100svh) * 0.67);overflow:hidden}
.c152 .closing .book{grid-column:3;grid-row:1;justify-self:start;align-self:center;white-space:nowrap}
.c152 .closing .back{grid-column:3;grid-row:2}
@media(prefers-reduced-motion:no-preference){
  .c152 .closing figure{clip-path:inset(0 10%);transition:clip-path 1.1s var(--ease)}
  .c152 .closing figure.seen{clip-path:inset(0)}
  .c152 .closing h2,.c152 .closing .book{transition:opacity .9s .45s}
  .c152 .closing:not(.seen) h2,.c152 .closing:not(.seen) .book{opacity:0}
}

@media(max-width:700px){
  .c152 .stage .brand{left:24px;top:calc(var(--leap-vh, 100svh) * 0.16)}
  .c152 .frame{left:15vw;top:calc(var(--leap-vh, 100svh) * 0.36);width:70vw;height:calc(var(--leap-vh, 100svh) * 0.42)}
  .c152 .cap{left:20px;right:20px;top:calc(var(--leap-vh, 100svh) * 0.79);writing-mode:horizontal-tb;display:block}
  .c152 .cap h2{letter-spacing:.1em}.c152 .cap p{letter-spacing:.05em;margin-top:6px}
  .c152 .members{padding:86px 20px 48px}
  .c152 .closing{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding:92px 22px 48px}
  .c152 .closing h2{writing-mode:horizontal-tb;justify-self:auto;letter-spacing:.12em}
  .c152 .closing figure{width:100%;height:calc(var(--leap-vh, 100svh) * 0.46)}
}