/* 深大 Jindai v3 — one type system, two grounds (dark story / washi object). Built 2026-09. */
:root{
  --washi:#fbf9f4; --yuge:#f6f2e7; --sen:#e4ddcf; --sumi:#1c1b18; --nibi:#6b6557; --kin:#9a7b2e; --yukin:#c9a227;
  --ink:#120f0b; --ink-2:#1a1510; --kuroyu:#35291f; --bone:#e9e3d6; --bone-2:rgba(233,227,214,.64); --bone-3:rgba(233,227,214,.42); --line-dark:rgba(233,227,214,.16);
  --f-display:"Shippori Mincho B1","Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;
  --f-body:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",Georgia,serif;
  --f-ui:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic",-apple-system,sans-serif;
  --gutter:clamp(20px,5vw,72px); --measure:36em;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-inout:cubic-bezier(.87,0,.13,1);
  --bg:var(--washi); --fg:var(--sumi); --fg-2:var(--nibi); --line:var(--sen); --accent:var(--kin);
}
body.mood-dark{ --bg:var(--ink); --fg:var(--bone); --fg-2:var(--bone-2); --line:var(--line-dark); --accent:var(--yukin); }
*{margin:0;padding:0;box-sizing:border-box}
html{ -webkit-text-size-adjust:100%; }
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{ background:var(--bg); color:var(--fg); font-family:var(--f-body); font-weight:400; font-size:16px; line-height:2; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:clip; transition:background-color .6s var(--ease-inout), color .6s var(--ease-inout); }
body:lang(en){ font-size:16.5px; line-height:1.85; }
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--yukin);color:var(--ink)}
:focus-visible{outline:1px solid var(--accent);outline-offset:4px}

/* ---------- type ---------- */
.eyebrow{ display:block; font-family:var(--f-ui); font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); font-weight:500; }
.eyebrow-2{ color:var(--fg-2); }
h1,h2,h3,.display{ font-family:var(--f-display); font-weight:500; line-height:1.35; letter-spacing:.06em; }
.display-xl{ font-size:clamp(56px,11vw,168px); line-height:1; letter-spacing:.02em; font-weight:500; }
.display-l{ font-size:clamp(34px,5.2vw,72px); line-height:1.25; }
.display-m{ font-size:clamp(24px,3vw,40px); line-height:1.5; }
.display-s{ font-size:clamp(19px,2vw,26px); line-height:1.6; }
.lede{ font-size:clamp(17px,1.5vw,20px); line-height:2.1; }
.small{ font-size:13px; line-height:1.9; color:var(--fg-2); }
.ui{ font-family:var(--f-ui); font-size:11.5px; letter-spacing:.22em; text-transform:uppercase; }
.num{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum"; }
.measure{ max-width:var(--measure); }
.center{ text-align:center; margin-left:auto; margin-right:auto; }
.gold{ color:var(--accent); }
.muted{ color:var(--fg-2); }
.tate{ writing-mode:vertical-rl; text-orientation:mixed; }
.nw{ white-space:nowrap; display:inline-block; }
.rule{ height:1px; border:0; background:linear-gradient(90deg,var(--line) 0 46%,transparent 46% 54%,var(--line) 54%); }
.rule-plain{ height:1px; border:0; background:var(--line); }

/* ---------- frame (persistent, Izanami-style; no live element) ---------- */
.frame-top{ position:fixed; inset:0 0 auto 0; z-index:60; display:flex; justify-content:space-between; align-items:center; padding:26px var(--gutter); pointer-events:none; mix-blend-mode:normal; }
.frame-top>*{pointer-events:auto}
.mark{ display:flex; align-items:center; gap:10px; }
.mark-ripple{ width:26px; height:26px; color:var(--accent); }
.mark-word{ font-family:var(--f-display); font-size:19px; letter-spacing:.2em; font-weight:500; line-height:1; margin-top:2px; }
.mark-romaji{ font-family:var(--f-ui); font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:var(--accent); margin-top:4px; }
.frame-right{ display:flex; align-items:center; gap:22px; }
.lang{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; border:1px solid color-mix(in srgb,var(--fg) 34%,transparent); padding:7px 13px 6px; border-radius:999px; transition:border-color .3s,background .3s,color .3s; }
.lang:hover{ border-color:var(--accent); color:var(--accent); }
.menu-btn{ position:relative; font-family:var(--f-ui); font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; padding:8px 0 6px; }
.menu-btn::before{ content:""; position:absolute; top:0; left:50%; width:3px; height:3px; margin-left:-1.5px; border-radius:50%; background:var(--accent); }
.menu-btn-close{display:none}
body.menu-open .menu-btn-label{display:none}
body.menu-open .menu-btn-close{display:inline}
.frame-rail{ position:fixed; left:calc(var(--gutter) / 2); top:50%; z-index:60; transform:translate(-50%,-50%) rotate(-90deg); transform-origin:center; pointer-events:none; }
.rail-label{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.34em; text-transform:uppercase; color:var(--fg-2); white-space:nowrap; }
.frame-bottom{ position:fixed; inset:auto 0 0 0; z-index:60; display:flex; justify-content:space-between; align-items:flex-end; padding:22px var(--gutter); pointer-events:none; font-family:var(--f-ui); font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--fg-2); }
.frame-scroll{ display:flex; align-items:center; gap:12px; transition:opacity .5s; }
.frame-scroll::after{ content:""; width:36px; height:1px; background:currentColor; transform-origin:left; animation:scrollcue 2.2s var(--ease-inout) infinite; }
@keyframes scrollcue{ 0%{transform:scaleX(0);transform-origin:left} 45%{transform:scaleX(1);transform-origin:left} 55%{transform:scaleX(1);transform-origin:right} 100%{transform:scaleX(0);transform-origin:right} }
body.scrolled .frame-scroll{ opacity:0; }
body.menu-open .frame-top,body.menu-open .frame-rail,body.menu-open .frame-bottom{ --fg:var(--bone); --fg-2:var(--bone-2); --accent:var(--yukin); color:var(--bone); }

/* ---------- menu overlay ---------- */
.menu{ position:fixed; inset:0; z-index:55; background:var(--ink); color:var(--bone); opacity:0; visibility:hidden; pointer-events:none; }
body.menu-open .menu{ pointer-events:auto; }
.menu-inner{ height:100%; display:flex; flex-direction:column; justify-content:center; padding:96px var(--gutter) 84px; overflow:auto; }
.menu-list{ display:grid; gap:clamp(6px,1.4vh,18px); }
.menu-list a{ display:flex; align-items:baseline; gap:22px; padding:6px 0; }
.menu-main{ font-family:var(--f-display); font-size:clamp(30px,min(7vw,9.5vh),84px); line-height:1.15; letter-spacing:.06em; transition:color .3s; }
.menu-sub{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--yukin); opacity:.9; }
.menu-list a:hover .menu-main,.menu-list a.on .menu-main{ color:var(--yukin); }
.menu-foot{ margin-top:6vh; display:flex; gap:32px; align-items:center; font-family:var(--f-ui); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--bone-2); }
.menu-lang{ border-bottom:1px solid var(--bone-3); padding-bottom:2px; }

/* ---------- intro + curtain ---------- */
.intro{ position:fixed; inset:0; z-index:80; background:var(--ink); color:var(--bone); display:grid; place-items:center; align-content:center; gap:26px; }
.intro-ripple{ width:104px; height:104px; }
.intro-ripple circle{ stroke-dasharray:1; stroke-dashoffset:1; }
.intro-line{ font-family:var(--f-display); font-size:clamp(17px,2.2vw,24px); letter-spacing:.14em; line-height:1.9; text-align:center; opacity:0; }
html:not(.js) .intro{ display:none; }
.curtain{ position:fixed; inset:0; z-index:70; background:var(--ink); opacity:0; visibility:hidden; pointer-events:none; }
.curtain.on{ pointer-events:auto; }

/* ---------- layout primitives ---------- */
main{ position:relative; }
.wrap{ width:min(1240px,100% - 2*var(--gutter)); margin-inline:auto; }
.wrap-n{ width:min(920px,100% - 2*var(--gutter)); margin-inline:auto; }
.section{ padding:clamp(72px,12vh,140px) 0; }
.section-tight{ padding:clamp(48px,7vh,80px) 0; }
.grid{ display:grid; gap:clamp(24px,4vw,64px); }
.g2{ grid-template-columns:repeat(2,minmax(0,1fr)); align-items:center; }
.g5-7{ grid-template-columns:5fr 7fr; align-items:center; }
.g7-5{ grid-template-columns:7fr 5fr; align-items:center; }
.frame-img{ position:relative; overflow:clip; background:var(--kuroyu); }
.frame-img img{ width:100%; height:100%; object-fit:cover; }
.frame-img.plx{ aspect-ratio:4/5; }
.frame-img.plx img{ position:absolute; inset:-12% 0; height:124%; }
.frame-img.r34{ aspect-ratio:3/4; }
.frame-img.r45{ aspect-ratio:4/5; }
.frame-img.r1{ aspect-ratio:1; }
.frame-img.r32{ aspect-ratio:3/2; }
.frame-img.r169{ aspect-ratio:16/9; }
.cap{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.2em; color:var(--fg-2); margin-top:12px; }
.stack{ display:grid; gap:18px; }
.stack-l{ display:grid; gap:28px; }
.teaser{ display:inline-flex; align-items:center; gap:18px; font-family:var(--f-ui); font-size:11px; letter-spacing:.26em; text-transform:uppercase; padding:8px 0; }
.teaser::before{ content:""; width:44px; height:1px; background:currentColor; transition:width .5s var(--ease-out); }
.teaser:hover::before{ width:72px; }
.teaser:hover{ color:var(--accent); }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:14px; font-family:var(--f-ui); font-size:11.5px; letter-spacing:.24em; text-transform:uppercase; border:1px solid currentColor; padding:18px 30px 16px; min-width:220px; transition:background .4s var(--ease-out),color .4s var(--ease-out),border-color .4s; }
.btn:hover{ background:var(--fg); color:var(--bg); }
.btn-gold{ background:var(--kin); border-color:var(--kin); color:var(--washi); }
.btn-gold:hover{ background:var(--sumi); border-color:var(--sumi); color:var(--washi); }
.btn[aria-disabled="true"]{ opacity:.5; pointer-events:none; }
.note{ font-size:13px; line-height:1.9; color:var(--fg-2); }
.list{ display:grid; gap:10px; }
.list li{ position:relative; padding-left:1.4em; }
.list li::before{ content:""; position:absolute; left:0; top:1em; width:.6em; height:1px; background:var(--accent); }

/* ---------- home: film ---------- */
.film{ position:relative; min-height:100svh; display:grid; align-items:end; overflow:clip; isolation:isolate; padding-bottom:clamp(72px,14vh,150px); }
.film-media{ position:absolute; inset:0; z-index:-2; }
.film-media img,.film-media video{ width:100%; height:100%; object-fit:cover; object-position:50% 58%; transform:scale(1.06); }
.film::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(18,15,11,.55) 0%,rgba(18,15,11,.08) 30%,rgba(18,15,11,.12) 58%,rgba(18,15,11,.86) 100%); }
.film-body{ text-align:left; padding:0 var(--gutter); display:grid; gap:18px; justify-items:start; max-width:min(100%, 860px); }
.film-line{ font-family:var(--f-display); font-size:clamp(23px,3.2vw,46px); letter-spacing:.1em; line-height:1.7; font-weight:500; color:var(--washi); text-shadow:0 1px 24px rgba(0,0,0,.35); }
.film-sub{ font-family:var(--f-ui); font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:var(--yukin); }
.film-under{ font-size:14px; letter-spacing:.14em; color:var(--bone-2); }
.film-fade{ position:absolute; inset:auto 0 0 0; height:22vh; background:linear-gradient(180deg,transparent,var(--ink)); z-index:-1; }

/* ---------- manifesto (centered measure over ink) ---------- */
.manifesto{ text-align:center; display:grid; gap:34px; justify-items:center; }
.manifesto p{ max-width:30em; font-size:clamp(16px,1.35vw,19px); line-height:2.3; letter-spacing:.06em; font-weight:300; color:var(--fg); }
.manifesto p:lang(en){ letter-spacing:.02em; line-height:2; }
.manifesto .display-m{ letter-spacing:.14em; }

/* ---------- chapters (home index) ---------- */
.chapters{ display:grid; gap:clamp(96px,16vh,200px); }
.chapter{ display:grid; grid-template-columns:repeat(12,1fr); gap:0 clamp(16px,2.5vw,40px); align-items:center; }
.chapter-text{ grid-column:1/7; display:grid; gap:20px; justify-items:start; }
.chapter-media{ grid-column:8/13; }
.chapter.flip .chapter-text{ grid-column:7/13; order:2; }
.chapter.flip .chapter-media{ grid-column:1/6; order:1; }
.chapter-no{ font-family:var(--f-ui); font-size:11px; letter-spacing:.34em; color:var(--accent); }
.chapter-kanji{ font-family:var(--f-display); font-size:clamp(44px,6.6vw,96px); line-height:1.1; letter-spacing:.04em; font-weight:500; white-space:nowrap; }
.chapter-en{ font-family:var(--f-ui); font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--fg-2); margin-top:-6px; }
.chapter-line{ font-size:clamp(16px,1.4vw,19px); line-height:2.1; letter-spacing:.04em; max-width:26em; }

/* ---------- story page ---------- */
.plate{ position:relative; min-height:100svh; display:grid; align-items:end; overflow:clip; isolation:isolate; padding-bottom:12vh; }
.plate-media{ position:absolute; inset:0; z-index:-2; }
.plate-media img{ width:100%; height:100%; object-fit:cover; object-position:50% 40%; }
.plate::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(18,15,11,.5),rgba(18,15,11,.05) 40%,rgba(18,15,11,.9) 100%); }
.plate-body{ display:grid; gap:18px; }
.poem{ display:grid; gap:28px; max-width:34em; }
.poem p{ font-family:var(--f-display); font-size:clamp(17px,1.7vw,23px); line-height:2.2; letter-spacing:.1em; font-weight:400; }
.poem p:lang(en){ letter-spacing:.03em; line-height:1.9; }
.poem .spine{ color:var(--accent); margin-top:14px; }
.paper{ background:var(--washi); color:var(--sumi); --fg:var(--sumi); --fg-2:var(--nibi); --line:var(--sen); --accent:var(--kin); padding:clamp(56px,8vw,110px) clamp(28px,6vw,96px); }
.paper p{ font-size:15.5px; line-height:2.15; }
.cite{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.14em; color:var(--fg-2); line-height:1.8; }
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,4vw,56px); }
.stat{ display:grid; gap:8px; border-top:1px solid var(--line); padding-top:22px; }
.stat-n{ font-family:var(--f-display); font-size:clamp(46px,6.5vw,96px); line-height:1; letter-spacing:.02em; }
.stat-n small{ font-size:.34em; letter-spacing:.1em; margin-left:.2em; }
.stat p{ font-size:13.5px; line-height:1.9; color:var(--fg-2); }

/* ---------- tote page ---------- */
.hero-w{ padding-top:clamp(120px,18vh,200px); }
.spine-line{ font-family:var(--f-display); font-size:clamp(30px,5vw,68px); letter-spacing:.1em; line-height:1.5; }
.spine-line:lang(en){ font-size:clamp(26px,3.2vw,44px); letter-spacing:.01em; line-height:1.35; }
.display-l:lang(en){ letter-spacing:.01em; }
.display-xl:lang(en){ letter-spacing:0; }
.fn{ display:grid; grid-template-columns:repeat(12,1fr); gap:0 clamp(16px,2.5vw,40px); align-items:center; }
.fn-text{ grid-column:1/6; display:grid; gap:18px; }
.fn-media{ grid-column:7/13; }
.fn.flip .fn-text{ grid-column:8/13; order:2; }
.fn.flip .fn-media{ grid-column:1/7; order:1; }
.fn-no{ font-family:var(--f-display); font-size:13px; letter-spacing:.34em; color:var(--accent); }
.fn h3{ font-size:clamp(22px,2.4vw,32px); line-height:1.6; letter-spacing:.06em; }
.fn p{ color:var(--fg); }
.spec{ display:grid; grid-template-columns:max-content 1fr; gap:0 32px; border-top:1px solid var(--line); }
.spec>*{ padding:16px 0; border-bottom:1px solid var(--line); font-size:14.5px; line-height:1.9; }
.spec dt{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.24em; color:var(--fg-2); padding-top:21px; }
.dims{ display:flex; align-items:baseline; gap:.35em; font-family:var(--f-display); font-size:clamp(40px,6vw,88px); line-height:1; letter-spacing:.02em; }
.dims small{ font-family:var(--f-ui); font-size:11px; letter-spacing:.24em; color:var(--accent); }
.price{ font-family:var(--f-display); font-size:clamp(30px,3.6vw,46px); letter-spacing:.06em; line-height:1.2; color:var(--accent); }
.price small{ font-size:.42em; letter-spacing:.14em; color:var(--fg-2); margin-left:.4em; }

/* ---------- register ---------- */
.reg-grid{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.reg-card{ background:var(--bg); border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:26px 22px 22px; display:grid; gap:12px; min-height:196px; align-content:start; transition:background .4s; position:relative; }
.reg-card:hover{ background:var(--yuge); }
.reg-no{ font-family:var(--f-display); font-size:clamp(26px,2.6vw,36px); letter-spacing:.06em; line-height:1; }
.reg-no small{ font-family:var(--f-ui); font-size:10px; letter-spacing:.3em; color:var(--accent); display:block; margin-bottom:10px; }
.reg-state{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.2em; color:var(--fg-2); }
.reg-card p{ font-size:13.5px; line-height:1.8; color:var(--fg-2); }
.reg-card.is-real{ background:var(--yuge); }
.reg-card.is-real .reg-state{ color:var(--accent); }
.timeline{ display:grid; gap:0; border-top:1px solid var(--line); }
.timeline li{ display:grid; grid-template-columns:8.5em 1fr; gap:24px; padding:16px 0; border-bottom:1px solid var(--line); font-size:14.5px; line-height:1.9; }
.timeline .t{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.2em; color:var(--fg-2); padding-top:6px; }
.timeline li.todo{ color:var(--fg-2); }
.counter{ font-family:var(--f-display); font-size:clamp(40px,6vw,88px); line-height:1; letter-spacing:.02em; }
.counter small{ font-size:.32em; letter-spacing:.14em; color:var(--fg-2); margin-left:.3em; }
.form{ display:grid; gap:26px; }
.field{ display:grid; gap:8px; }
.field label{ font-family:var(--f-ui); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--fg-2); }
.field input,.field textarea,.field select{ font-family:var(--f-ui); font-size:15px; color:var(--fg); background:transparent; border:0; border-bottom:1px solid var(--line); padding:10px 0; border-radius:0; transition:border-color .3s; }
.field input:focus,.field textarea:focus{ outline:0; border-bottom-color:var(--accent); }
.field textarea{ min-height:96px; resize:vertical; }
.check{ display:flex; gap:12px; align-items:flex-start; font-size:13.5px; line-height:1.8; color:var(--fg-2); }
.check input{ margin-top:.55em; accent-color:var(--kin); }
.f2{ display:grid; grid-template-columns:1fr 1fr; gap:26px; }

/* ---------- buy ---------- */
.offer{ display:grid; grid-template-columns:7fr 5fr; gap:clamp(28px,5vw,80px); align-items:start; }
.offer-box{ border:1px solid var(--line); padding:clamp(24px,3vw,40px); display:grid; gap:22px; background:var(--yuge); position:sticky; top:100px; }
.offer-box .price{ font-size:clamp(28px,3vw,38px); }
.steps{ counter-reset:s; display:grid; gap:14px; }
.steps li{ display:grid; grid-template-columns:2.4em 1fr; gap:12px; font-size:14.5px; line-height:1.9; }
.steps li::before{ counter-increment:s; content:counter(s,decimal-leading-zero); font-family:var(--f-ui); font-size:10.5px; letter-spacing:.2em; color:var(--accent); padding-top:.5em; }
.terms-mini{ font-size:13px; line-height:1.9; color:var(--fg-2); display:grid; gap:8px; }

/* ---------- footer (always ink) ---------- */
.site-foot{ background:var(--ink); color:var(--bone); --fg:var(--bone); --fg-2:var(--bone-2); --line:var(--line-dark); --accent:var(--yukin); padding:clamp(72px,10vh,120px) 0 120px; margin-top:clamp(72px,12vh,140px); }
body.mood-dark .site-foot{ border-top:1px solid var(--line-dark); }
.foot-inner{ width:min(1240px,100% - 2*var(--gutter)); margin-inline:auto; display:grid; gap:56px; }
.foot-essence{ font-family:var(--f-display); font-size:clamp(20px,2.6vw,34px); letter-spacing:.12em; line-height:1.7; }
.foot-cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; font-size:13px; line-height:2; color:var(--bone-2); }
.foot-cols .eyebrow{ margin-bottom:10px; }
.foot-cols a:hover{ color:var(--yukin); }
.foot-copy{ font-family:var(--f-ui); font-size:10px; letter-spacing:.2em; color:var(--bone-3); }

/* ---------- reveals (initial states set in JS only) ---------- */
.fx-reveal .fx-mask{ display:inline-block; overflow:hidden; vertical-align:bottom; }
.fx-reveal .fx-word{ display:inline-block; will-change:transform; }
.fx-reveal .fx-char{ display:inline-block; will-change:transform; }

/* ---------- responsive ---------- */
@media (max-width:1100px){ .reg-grid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:900px){
  .frame-rail{ display:none; }
  .frame-top{ padding:18px var(--gutter); }
  .frame-bottom{ display:none; }
  .chapter-text,.chapter-media,.chapter.flip .chapter-text,.chapter.flip .chapter-media{ grid-column:1/-1; order:initial; }
  .chapter-media{ margin-top:28px; }
  .fn-text,.fn-media,.fn.flip .fn-text,.fn.flip .fn-media{ grid-column:1/-1; order:initial; }
  .fn-media{ margin-bottom:24px; order:-1 !important; }
  .g2,.g5-7,.g7-5,.offer{ grid-template-columns:1fr; }
  .offer-box{ position:static; }
  .stats{ grid-template-columns:1fr; gap:28px; }
  .foot-cols{ grid-template-columns:1fr; gap:28px; }
  .reg-grid{ grid-template-columns:repeat(2,1fr); }
  .f2{ grid-template-columns:1fr; }
  .timeline li{ grid-template-columns:1fr; gap:4px; }
  .frame-img.plx{ aspect-ratio:4/5; }
}
@media (max-width:560px){ .reg-grid{ grid-template-columns:1fr 1fr; } .reg-card{ min-height:150px; padding:18px 14px; } .menu-list a{ flex-direction:column; gap:4px; } }
.static .film,.static .plate{ min-height:900px; }
.static .intro{ display:none; }
@media (prefers-reduced-motion:reduce){ .frame-scroll::after{ animation:none; } .intro{ display:none; } }