/* AISHITERU — the page behind Discover. The philosophy, then the three ways in.
   21 September 2026. White page, her red, Cormorant for her lines, Jost for the small words.
   Editorial magazine: air, one large line a chapter, nothing yelling, no lines drawn across
   the page, no pale-pink ground, words never over the film. Every word of hers arrives as
   the page reaches it. */

:root{--ph-red:#C8102E;--ph-white:#FFFFFF;--ph-faint:rgba(200,16,46,.22);
 --ph-display:"Cormorant Garamond","Iowan Old Style",Palatino,Georgia,serif;
 --ph-sans:Jost,system-ui,sans-serif;
 --ph-jp:"Hiragino Mincho ProN","Yu Mincho","Noto Serif JP","Songti SC",serif}

body.page-begin,body.page-begin > .ent{background:var(--ph-white)!important}
body.page-begin .breath,body.page-begin .grain{display:none}
.ph{color:var(--ph-red);font-family:var(--ph-sans);font-weight:300;overflow:hidden}
.ph p,.ph h1,.ph h2{margin:0}
.ph p,.ph h1,.ph h2,.ph dt,.ph dd,.ph button,.ph input,.ph label{color:var(--ph-red)}

/* ── arrival ─────────────────────────────────────────────── */
.ph-in{opacity:0;transform:translateY(16px);
 transition:opacity 1.25s cubic-bezier(.2,.6,.2,1) calc(var(--i,0) * .14s),
            transform 1.4s cubic-bezier(.2,.7,.2,1) calc(var(--i,0) * .14s)}
.ph-in.on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.ph-in{opacity:1;transform:none;transition:none}}

/* ── type ────────────────────────────────────────────────── */
.ph-eye{font-family:var(--ph-sans);font-weight:400;font-size:11px;letter-spacing:.32em;
 text-transform:uppercase;padding-left:.32em;margin-bottom:clamp(22px,4vw,34px)}
.ph-big{font-family:var(--ph-display);font-weight:300;font-style:italic;
 font-size:clamp(38px,9.4vw,74px);line-height:1.06;letter-spacing:-.005em;text-wrap:balance;
 max-width:14ch}
.ph-line{font-family:var(--ph-display);font-weight:400;
 font-size:clamp(24px,5.9vw,36px);line-height:1.28;max-width:22ch}
.ph-line--lead{font-size:clamp(27px,6.6vw,42px);line-height:1.2}
.ph-line--soft{font-style:italic;font-weight:300}
@media(max-width:599px){.ph-line{font-size:clamp(21px,5.6vw,24px);max-width:none}.ph-line--lead{font-size:clamp(24px,6.4vw,27px)}.ph-big{max-width:none}}
.ph-prose{font-family:var(--ph-sans);font-weight:300;font-size:clamp(16.5px,4.1vw,19px);
 line-height:1.68;max-width:36em}
.ph-name{font-family:var(--ph-display);font-weight:400;font-size:clamp(28px,6.6vw,40px);
 line-height:1.12;text-wrap:balance}
.ph-kanji{font-family:var(--ph-jp);font-weight:400;font-size:clamp(44px,11vw,84px);
 line-height:1;letter-spacing:.14em;padding-left:.14em}

/* ── the chapters ────────────────────────────────────────── */
.ph-ch{padding:clamp(72px,14vw,150px) clamp(22px,6vw,48px);display:grid;
 gap:clamp(20px,4.2vw,34px);justify-items:start;max-width:720px;margin:0 auto}
@media(min-width:900px){
  .ph-big{max-width:19ch}.ph-line{max-width:28ch}.ph-line--lead{max-width:30ch}
  .ph-ch{max-width:none;margin:0;padding-left:clamp(48px,22vw,340px);padding-right:6vw}
  .ph-ch--wide{padding-left:clamp(48px,11vw,170px)}
}
.ph-ch--word{justify-items:center;text-align:center}
@media(min-width:900px){.ph-ch--word{padding-left:6vw;padding-right:6vw}}
.ph-ch--word .ph-line,.ph-ch--word .ph-big,.ph-ch--word .ph-prose{max-width:30ch;margin:0 auto}
.ph-ch--word .ph-big{font-style:normal;letter-spacing:.14em;padding-left:.14em;
 font-size:clamp(30px,7vw,54px)}

/* ── the opening ─────────────────────────────────────────── */
.ph-open{display:grid;gap:clamp(26px,6vw,40px);padding:0 0 clamp(20px,4vw,40px)}
.ph-film{position:relative;height:58svh;min-height:360px;overflow:hidden;background:var(--ph-white)}
.ph-v{width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
.ph-open-words{padding:0 clamp(22px,6vw,48px);display:grid;gap:clamp(18px,3.4vw,26px);
 justify-items:start;max-width:720px;margin:0 auto;width:100%;box-sizing:border-box}
.ph-open-words .ph-eye{margin-bottom:0}
.ph-open-words .ph-big{font-size:clamp(40px,10.4vw,80px)}
@media(min-width:900px){
  .ph-open{grid-template-columns:minmax(300px,38vw) 1fr;align-items:center;gap:0;
   min-height:88vh;padding:clamp(30px,5vh,60px) 6vw clamp(30px,5vh,60px) clamp(48px,11vw,170px)}
  .ph-film{height:min(78vh,760px);min-height:0}
  .ph-open-words{max-width:none;margin:0;padding:0 0 0 clamp(48px,7vw,110px)}
}

/* ── the exchange ────────────────────────────────────────── */
.ph-ch--exchange .ph-line--soft{font-size:clamp(26px,6.4vw,40px)}

/* ── the pillars ─────────────────────────────────────────── */
.ph-pillars{list-style:none;margin:0;padding:0;display:grid;gap:clamp(44px,8vw,64px);
 width:100%;max-width:1100px}
@media(min-width:900px){.ph-pillars{grid-template-columns:repeat(3,1fr);gap:clamp(36px,5vw,72px)}}
.ph-pillars li{display:grid;gap:clamp(12px,2.4vw,18px);align-content:start}
.ph-n{font-family:var(--ph-display);font-style:italic;font-weight:300;
 font-size:clamp(34px,8vw,56px);line-height:1;opacity:.55}
.ph-pillars .ph-prose{font-size:clamp(16px,3.9vw,17.5px)}

/* ── the words ───────────────────────────────────────────── */
.ph-words{margin:clamp(18px,4vw,36px) 0 0;width:100%;max-width:1100px;display:grid;
 gap:clamp(28px,5vw,40px) clamp(30px,5vw,64px)}
@media(min-width:720px){.ph-words{grid-template-columns:1fr 1fr}}
.ph-word{display:grid;gap:8px;align-content:start}
.ph-word dt{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.ph-roman{font-family:var(--ph-display);font-weight:500;font-size:clamp(20px,4.8vw,25px);
 letter-spacing:.16em;padding-left:.16em}
.ph-jp{font-family:var(--ph-jp);font-size:clamp(18px,4.2vw,22px);letter-spacing:.06em;opacity:.8}
.ph-said{font-family:var(--ph-sans);font-weight:400;font-size:11px;letter-spacing:.18em;opacity:.75}
.ph-word dd{margin:0;font-family:var(--ph-sans);font-weight:300;
 font-size:clamp(15px,3.7vw,16.5px);line-height:1.62;max-width:34em}
.ph-word dd.ph-gloss{font-family:var(--ph-display);font-weight:400;font-size:clamp(20px,4.8vw,25px);line-height:1.28;margin:2px 0 4px}
.ph-words{gap:clamp(36px,6vw,54px) clamp(30px,5vw,64px)}
/* the foot on this page stands on white, like the page — hers, "don't use that ugly colour on the footer" */
body.page-begin .foot,body.page-begin footer{background:var(--ph-white)!important;border-top:0}

/* ── the three ways in ───────────────────────────────────── */
.ph-ways{padding-bottom:clamp(90px,16vw,170px)}
.ph-doors{margin:clamp(30px,6vw,60px) 0 0;width:100%;max-width:1100px;display:grid;
 gap:clamp(44px,8vw,64px)}
@media(min-width:900px){.ph-doors{grid-template-columns:repeat(3,1fr);gap:clamp(36px,5vw,72px)}}
.ph-door{display:grid;gap:clamp(12px,2.4vw,16px);align-content:start;justify-items:start}
.ph-door .ph-eye{margin-bottom:4px}
.ph-door .ph-name{font-size:clamp(26px,6.2vw,34px)}
.ph-door .ph-prose{font-size:clamp(16px,3.9vw,17.5px)}
.ph-fee{font-family:var(--ph-display);font-weight:400;font-size:clamp(22px,5.4vw,28px);
 line-height:1.2;margin-top:6px}
.ph-go,.ph-send{font:inherit;font-family:var(--ph-display);font-weight:400;
 font-size:clamp(20px,5vw,26px);color:var(--ph-red);background:transparent;border:0;
 padding:0 2px 4px;margin-top:8px;cursor:pointer;line-height:1.2;
 text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.28em;
 text-decoration-color:var(--ph-faint);transition:text-decoration-color .5s ease}
.ph-go:hover,.ph-go:focus-visible,.ph-send:hover,.ph-send:focus-visible{
 text-decoration-color:var(--ph-red);outline:none}
.ph-door.is-chosen .ph-go{text-decoration-color:var(--ph-red)}

/* ── the moment ──────────────────────────────────────────── */
.ph-moment{margin:clamp(56px,10vw,96px) 0 0;width:100%;max-width:640px;display:grid;
 gap:clamp(26px,5vw,40px);justify-items:start;opacity:0;transform:translateY(14px);
 transition:opacity 1.1s ease,transform 1.3s cubic-bezier(.2,.7,.2,1)}
.ph-moment[hidden]{display:none}
.ph-moment.on{opacity:1;transform:none}
.ph-chosen{font-family:var(--ph-sans);font-weight:400;font-size:11px;letter-spacing:.32em;
 text-transform:uppercase;padding-left:.32em}
.ph-sentence{font-family:var(--ph-display);font-weight:400;line-height:1.5;
 font-size:clamp(28px,7vw,44px);max-width:20ch}
.ph-fill{display:inline-block;position:relative;min-width:5ch}
.ph-sentence input{font:inherit;color:var(--ph-red);background:transparent;border:0;
 border-bottom:1px solid var(--ph-faint);padding:0 .12em 2px;width:100%;
 caret-color:var(--ph-red);text-align:center;border-radius:0}
.ph-sentence input:focus{outline:none;border-bottom-color:var(--ph-red)}
.ph-sentence input::placeholder{color:rgba(200,16,46,.28)}
.ph-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
 clip-path:inset(50%);white-space:nowrap}
.ph-asks{display:grid;gap:clamp(20px,4vw,30px);width:100%}
@media(min-width:640px){.ph-asks{grid-template-columns:1.3fr 1fr;gap:40px}}
.ph-ask{display:grid;gap:6px}
.ph-ask span{font-family:var(--ph-sans);font-weight:400;font-size:11px;letter-spacing:.28em;
 text-transform:uppercase;padding-left:.28em}
.ph-ask input{font:inherit;font-family:var(--ph-display);font-size:clamp(20px,5vw,26px);
 color:var(--ph-red);background:transparent;border:0;border-bottom:1px solid var(--ph-faint);
 padding:4px 0 6px;width:100%;caret-color:var(--ph-red);border-radius:0}
.ph-ask input:focus{outline:none;border-bottom-color:var(--ph-red)}
.ph-ask input::placeholder{color:rgba(200,16,46,.28)}
.ph-send{margin-top:0}
.ph-send[disabled]{opacity:.5;cursor:default}
.ph-after{font-family:var(--ph-display);font-weight:400;font-size:clamp(22px,5.4vw,30px);
 line-height:1.3;max-width:24ch;min-height:1em}

/* ── her films as the pictures, 21 September — "you need some images there" ── */
.ph-pic{margin:0;position:relative;overflow:hidden;background:#F6EEF0;width:100%}
.ph-pic video,.ph-pic img.ph-still{display:block;width:100%;height:100%;object-fit:cover}
.ph-pic--wide{aspect-ratio:4/3}
.ph-pic--door{aspect-ratio:3/4;margin-bottom:clamp(14px,3vw,22px)}
.ph-ch--pic{display:grid;gap:clamp(30px,6vw,44px)}
.ph-ch--pic .ph-words{display:grid;gap:clamp(20px,4.2vw,34px);justify-items:start}
@media(max-width:899px){
  .ph-ch--pic{padding-left:0;padding-right:0;max-width:none}
  .ph-ch--pic .ph-words{padding:0 clamp(22px,6vw,48px);max-width:720px;margin:0 auto;width:100%;box-sizing:border-box}
}
@media(min-width:900px){
  .ph-ch--pic{grid-template-columns:minmax(320px,44%) 1fr;align-items:center;gap:clamp(48px,7vw,120px);
   padding-left:clamp(48px,8vw,120px);padding-right:6vw}
  .ph-ch--pic .ph-pic--wide{aspect-ratio:5/6;height:min(78vh,720px)}
  .ph-ch--flip{grid-template-columns:1fr minmax(320px,44%)}
  .ph-ch--flip .ph-pic{order:2}
  .ph-ch--flip .ph-words{order:1}
  .ph-ch--pic .ph-big{max-width:16ch}
}

/* ── the dates a shitaku begins ──────────────────────────── */
.ph-dates{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:clamp(18px,3vw,24px);width:100%}
.ph-date{display:grid;gap:4px;justify-items:start}
.ph-date-name{font-family:var(--ph-display);font-weight:500;font-size:clamp(20px,4.8vw,24px);line-height:1.2}
.ph-date-when{font-family:var(--ph-display);font-weight:400;font-size:clamp(17px,4.2vw,20px);line-height:1.3}
.ph-date-note,.ph-date-left{font-family:var(--ph-sans);font-weight:300;font-size:clamp(14.5px,3.6vw,16px);line-height:1.5}
.ph-date-left{opacity:.85}
.ph-date.is-full .ph-date-name,.ph-date.is-full .ph-date-when{opacity:.55}
.ph-date .ph-go{margin-top:2px;font-size:clamp(18px,4.6vw,22px)}
.ph-soon{font-size:clamp(15px,3.7vw,16.5px)}
.ph-go--cal{display:inline-block;margin-top:0}

/* ── THE PAGE AFTER THE FILM, REBUILT — hers, 23 September 2026:
   "I want images all the way across and then beautiful information down the
   page." So every film runs edge to edge, full width, and her words stand
   underneath it in one measured column with air around them. Words never over
   a film. Last block wins. ─────────────────────────────────────────────── */

.ph{overflow-x:hidden}

/* the opening — her journey film across the whole screen, her line beneath */
.ph-open{display:block;gap:0;padding:0}
.ph-open .ph-film{width:100%}
.ph-open .ph-v{display:block;width:100%;height:clamp(420px,72vh,760px);object-fit:cover}
.ph-open-words{max-width:none;margin:0;padding:clamp(44px,7vw,86px) clamp(22px,6vw,48px) 0;
 display:grid;justify-items:center;text-align:center;gap:clamp(16px,2.6vw,24px)}
.ph-open-words .ph-big{max-width:20ch;font-size:clamp(40px,7.2vw,86px)}

/* every chapter with a film — the film across, then the words down the page */
.ph-ch--pic,.ph-ch--flip{display:block;max-width:none;
 padding:clamp(56px,9vw,120px) 0 clamp(60px,10vw,132px)}
.ph-ch--pic .ph-pic,.ph-ch--flip .ph-pic{width:100%;margin:0 0 clamp(40px,6vw,78px)}
.ph-ch--pic .ph-pic--wide,.ph-ch--flip .ph-pic--wide{aspect-ratio:auto;width:100%;
 height:clamp(300px,54vh,620px)}
.ph-ch--pic .ph-pic video,.ph-ch--pic .ph-pic img.ph-still{height:100%;object-fit:cover}
.ph-ch--pic .ph-words,.ph-ch--flip .ph-words{display:grid;grid-template-columns:1fr;
 justify-items:center;text-align:center;gap:clamp(26px,4vw,44px);
 max-width:min(78ch,86vw);margin:0 auto;padding:0 clamp(22px,6vw,48px);box-sizing:border-box}
.ph-ch--pic .ph-line,.ph-ch--flip .ph-line{max-width:30ch}
.ph-ch--pic .ph-big,.ph-ch--flip .ph-big{max-width:22ch;font-size:clamp(38px,6.4vw,76px)}
.ph-ch--pic .ph-prose,.ph-ch--flip .ph-prose{max-width:52ch}
.ph-ch--pic .ph-eye,.ph-ch--flip .ph-eye{margin-bottom:0}

/* the chapters with no film keep the same measured column */
.ph-ch--wide,.ph-ch--word{max-width:min(78ch,86vw);margin:0 auto;
 padding-left:clamp(22px,6vw,48px);padding-right:clamp(22px,6vw,48px);
 justify-items:center;text-align:center}
.ph-ch--wide .ph-line,.ph-ch--wide .ph-big{max-width:30ch;margin-left:auto;margin-right:auto}
.ph-ch--wide .ph-words{max-width:none}

@media(max-width:899px){
  .ph-open .ph-v{height:clamp(360px,62vh,560px)}
  .ph-ch--pic .ph-pic--wide,.ph-ch--flip .ph-pic--wide{height:clamp(240px,44vh,420px)}
}

/* ── THE FILM IS THE TOP OF THE PAGE NOW — hers, 23 September 2026: the journey
   film and her opening line came off (kept whole in spares/), her philosophy
   film stands at the top, taller, and the frame is lifted so their hands show:
   "it is all about their hands." ───────────────────────────────────────── */
.ph-ch--first{padding-top:0}
.ph-ch--first .ph-pic--wide{height:clamp(420px,78vh,820px)}
.ph-ch--first .ph-pic video,.ph-ch--first .ph-pic img.ph-still{object-position:50% 72%}
@media(max-width:899px){.ph-ch--first .ph-pic--wide{height:clamp(340px,62vh,560px)}}

/* Her hands film is the top of the page — the crop sits on the hands
   themselves rather than the centre of the frame. Hers, 23 September 2026. */
.ph-ch--first .ph-pic video,.ph-ch--first .ph-pic img.ph-still{object-position:50% 46%}