/* Shared family tokens. Only the service accent and its accessible on-color vary. */
:root {
  --ink:#17140f; --paper:#f4ede0; --accent:#ff8a2b; --on-accent:var(--ink); --gold:#d9a441;
  --display:"Shippori Mincho B1",serif; --body:"Zen Kaku Gothic New",sans-serif;
  --s1:8px; --s2:16px; --s3:24px; --s4:32px; --s6:48px; --s8:64px;
  --section:160px; --gutter:clamp(24px,5vw,80px); --content:1152px;
  --display-size:clamp(56px,12vw,160px); --body-size:18px; --small:14px;
  --duration:480ms; --ease:cubic-bezier(.2,.7,.2,1); --stagger:60ms;
  --grain:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23f4ede0' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  color-scheme:dark; font-family:var(--body); font-size:var(--body-size); line-height:1.8; color:var(--paper); background:var(--ink); font-synthesis:none;
}
*{box-sizing:border-box}body{margin:0;position:relative;isolation:isolate}body::after{content:"";position:fixed;inset:0;background-image:var(--grain);opacity:.08;pointer-events:none;z-index:-1}
a{color:inherit;text-underline-offset:6px}button,input{font:inherit}button,a,input{touch-action:manipulation}button{cursor:pointer}img{display:block;max-width:100%}p,h1,h2,h3,figure{margin:0}p+p{margin-top:24px}
:focus-visible{outline:3px solid var(--paper);outline-offset:6px}.paper :focus-visible{outline-color:var(--ink)}
.skip{position:absolute;z-index:30;top:8px;left:24px;padding:8px 16px;background:var(--paper);color:var(--ink);transform:translateY(-160%)}.skip:focus{transform:none}
.shell{width:min(calc(100% - var(--gutter)*2),var(--content));margin-inline:auto}
.top{position:absolute;z-index:5;inset:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;height:96px;border-bottom:1px solid #f4ede038}
.brand{font-weight:900;text-decoration:none;font-size:24px;min-height:44px;display:flex;align-items:center}.top-cta{font-size:14px;min-height:44px;display:flex;align-items:center;gap:24px;text-decoration:none}.top-cta::after{content:'↗';font-size:24px}
.hero{height:85vh;min-height:768px;max-height:1100px;position:relative;isolation:isolate;overflow:hidden;background:var(--ink)}
.hero-art{position:absolute;inset:0;z-index:-3;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 58%;animation:kenburns 24s linear forwards}
.hero::before{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,#17140fe6 0%,#17140fb8 42%,#17140f08 56%,#17140ff2 84%,#17140f 100%)}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:var(--grain);opacity:.08;pointer-events:none}
.hero-inner{height:100%;padding-top:144px;display:flex;flex-direction:column;justify-content:space-between;padding-bottom:48px}
h1{font:800 var(--display-size)/1 var(--display);letter-spacing:-.03em;white-space:nowrap;position:relative;width:max-content;max-width:100%}.underline{display:block;width:38%;height:24px;margin:16px 0 0 auto;overflow:visible}.underline path{stroke:var(--accent);stroke-width:3;fill:none}
.hero-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:48px}.hero-copy{max-width:440px}.hero-copy p{font-size:18px;line-height:1.8}.hero-copy .date{font-size:14px;margin-bottom:16px}.hero-actions{width:360px;flex:none}.btn{min-height:56px;padding:16px 24px;display:flex;gap:16px;align-items:center;justify-content:space-between;background:var(--accent);color:var(--on-accent);border:0;border-radius:0;text-decoration:none;font-weight:900;line-height:1.5}.btn::after{content:'↗';font-size:24px;transition:transform var(--duration) var(--ease)}.btn:hover::after{transform:translate(4px,-4px)}.btn-secondary{background:none;color:var(--paper);border-bottom:1px solid #f4ede066;font-size:16px;font-weight:400}.hero-free{font-size:14px!important;margin:16px 0 0!important}.edge-line{position:absolute;right:24px;top:38%;writing-mode:vertical-rl;font-size:16px;letter-spacing:.15em;animation:drift 24s linear forwards;text-shadow:0 1px 4px var(--ink);background:#17140fbb;padding:16px 8px}
.section{padding-block:var(--section)}.sample-section{position:relative;isolation:isolate}.sample-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:center}.sample-aside{align-self:start;padding-top:48px}.sample-aside h2{font:800 clamp(56px,6.4vw,88px)/1.25 var(--display);letter-spacing:-.03em}.sample-aside h2 span{display:block}.diagram{margin-top:48px;display:flex;align-items:center;gap:24px}.question-number{font:900 96px/1 var(--body)}.question-number small{font-size:18px}.bubbles{display:flex;gap:8px}.bubble{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--paper);border-radius:50% 50% 50% 0;font-size:24px}.bubble:nth-child(2){transform:translateY(-16px)}.bubble:nth-child(3){transform:translateY(8px)}.sample-aside .micro{font-size:14px;margin-top:24px}.sample-caption{font-size:14px;margin-top:32px;border-top:1px solid var(--gold);padding-top:16px}.paper-stage{perspective:1400px;min-width:0;position:relative;padding:16px 0 0 16px}.paper{color:var(--ink);background-color:var(--paper);background-image:linear-gradient(90deg,#17140f05,transparent 8%,#17140f05 100%);position:relative;padding:48px;color-scheme:light;box-shadow:12px 12px 0 #f4ede024}.paper::before{content:'';position:absolute;inset:0;background:var(--grain);opacity:.1;pointer-events:none}.paper>*{position:relative}.paper h3{font:800 28px/1.6 var(--display);margin-bottom:32px}.paper p{font-size:18px;line-height:1.8}.paper .story-quotes{margin-top:32px;padding-top:24px;border-top:1px solid #17140f4d;display:grid;gap:8px;font-size:16px}.story-quotes span{font:900 14px var(--body);margin-bottom:8px}.story-quotes em{font-style:normal}.paper .story-sign{text-align:right;margin-top:32px}.sample-art{position:absolute;left:0;bottom:0;width:35%;height:40%;object-fit:cover;opacity:.1;z-index:-1;mask-image:linear-gradient(transparent,#17140f)}
.offer-section{border-top:1px solid #f4ede038}.offer-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:start}.offer-aside h2{font:800 clamp(56px,6.4vw,88px)/1.25 var(--display);letter-spacing:-.03em}.book-object{width:176px;height:240px;background:var(--paper);color:var(--ink);margin:48px 0 0 32px;transform:rotate(-8deg);border-left:8px double #17140f55;box-shadow:8px 6px 0 #f4ede066,16px 12px 0 #f4ede022;display:flex;align-items:center;justify-content:center;font:800 24px/1.5 var(--display);writing-mode:vertical-rl;position:relative}.book-object::before{content:'';position:absolute;top:0;right:24px;width:1px;height:40px;background:var(--gold)}
.reg{min-width:0}.offer-main{border-top:1px solid var(--gold);padding-top:24px}.offer-title{font-size:24px;line-height:1.5;font-weight:900}.offer-price{font-weight:900;font-size:clamp(56px,6vw,88px);line-height:1.15;margin:16px 0 24px;letter-spacing:-.03em}.offer-price span{font-size:18px;letter-spacing:0;margin-left:8px}.offer-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px 24px;padding:0;margin:0 0 24px;font-size:18px}.offer-list li{border-bottom:1px solid #f4ede033;padding-block:8px}.offer-note,.reg-consent{font-size:14px;line-height:1.8;margin-top:16px}.offer-front{margin-top:32px;padding-top:24px;border-top:1px solid #f4ede038}.offer-front h3{font-size:24px;font-weight:900}.reg-choice{border:0;padding:0;margin:32px 0 24px}.reg-choice legend{font-size:14px;margin-bottom:8px}.radio{display:flex;align-items:center;gap:16px;min-height:56px;cursor:pointer;padding:8px 0;font-size:16px}.radio input{appearance:auto;accent-color:var(--accent);width:24px;height:24px;flex:none;margin:0}.email-label{display:block;font-size:14px;margin:32px 0 8px}input[type=email]{display:block;width:100%;min-height:56px;background:var(--paper);color:var(--ink);border:0;border-radius:0;padding:16px;font-size:18px}input::placeholder{color:#17140f99}#regBtn{width:100%;margin-top:16px}.reg-consent a{display:inline-block;min-height:44px;padding-top:8px}.reg-msg{margin-top:24px;overflow-wrap:anywhere}.reg-msg:empty{display:none}.reg-extra{margin-top:24px;overflow-wrap:anywhere}.reg-extra p{font-size:16px}.reg-extra a:not(.btn){display:block;min-height:44px;margin:16px 0}.reg-extra .btn{margin-block:16px}button:disabled{opacity:.65;cursor:wait}
.foot{border-top:1px solid #f4ede038;padding-block:32px;font-size:14px}.foot-top{display:flex;justify-content:space-between;align-items:center;gap:24px}.foot a{display:inline-flex;align-items:center;min-height:44px}.sisters{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:16px}.foot p{margin:0}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.reveal.in-view{animation:reveal var(--duration) var(--ease) both;animation-delay:var(--delay,0ms)}.page-turn.in-view{animation:page-turn var(--duration) var(--ease) both;transform-origin:left center}.noscript-note{padding:24px;background:var(--paper);color:var(--ink)}
@keyframes kenburns{to{transform:scale(1.06)}}@keyframes drift{to{transform:translateY(24px)}}@keyframes reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes page-turn{from{opacity:0;transform:translateY(24px) rotateX(12deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}
@media(max-width:900px){.sample-layout,.offer-layout{gap:48px;grid-template-columns:.7fr 1.3fr}.paper{padding:32px}.brand{font-size:20px}.hero-bottom{gap:24px}.hero-actions{width:320px}.sample-aside h2,.offer-aside h2{font-size:56px}.diagram{gap:16px}.bubble{width:32px;height:32px;font-size:18px}.question-number{font-size:72px}}
@media(max-width:640px){:root{--section:96px}.top{height:80px}.brand{font-size:18px}.top-cta{gap:8px}.hero{height:100svh;min-height:760px;max-height:none}.hero-inner{padding-top:112px;padding-bottom:32px}.hero-art{object-position:20% 50%}.hero::before{background:linear-gradient(180deg,#17140ff2 0%,#17140fb8 34%,#17140f00 48%,#17140ff0 68%,#17140f 100%)}h1{font-size:var(--display-size);white-space:normal}h1 span{display:block;margin-top:8px}.underline{width:60%;margin:16px 0 0}.hero-bottom{display:block}.hero-copy{max-width:100%}.hero-copy .date{font-size:14px;margin-bottom:8px}.hero-copy p{font-size:18px}.hero-actions{width:100%;margin-top:24px}.hero-free{font-size:14px!important;margin-top:8px!important}.btn{padding:16px;min-height:56px}.btn-secondary{min-height:48px;padding:12px 16px}.edge-line{right:16px;top:32%;font-size:14px;padding:8px}.sample-layout,.offer-layout{display:block}.sample-aside{padding:0;display:grid;grid-template-columns:1fr auto;gap:24px}.sample-aside h2{font-size:48px;line-height:1.25}.diagram{margin-top:8px;gap:8px;align-self:center}.question-number{font-size:64px}.question-number small{font-size:14px}.bubbles{display:grid;gap:4px}.bubble{width:24px;height:24px;font-size:14px}.bubble:nth-child(2){transform:translateX(-8px)}.bubble:nth-child(3){transform:none}.sample-aside .micro{grid-column:1/-1;margin:0}.sample-caption{grid-column:1/-1;margin:0}.paper-stage{margin-top:48px;padding:0 8px 0 0}.paper{padding:32px 24px;box-shadow:8px 8px 0 #f4ede024}.paper h3{font-size:24px;margin-bottom:24px}.paper .story-quotes{font-size:16px}.sample-art{width:100%;height:40%}.offer-aside{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:48px}.offer-aside h2{font-size:48px}.book-object{width:96px;height:136px;font-size:18px;margin:0 16px 0 0;flex:none}.book-object::before{right:16px;height:24px}.offer-price{font-size:64px}.offer-list{gap:8px 16px}.foot-top{display:block}.foot-top>a{margin-top:8px}.sisters{gap:0 16px}.foot{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal,.page-turn{opacity:1;transform:none}}

/* Signature: an inked weekend stamp; no spring or bounce. */
.mission-route{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:176px;margin-top:48px}.mission-route span{display:grid;place-items:center;width:64px;height:72px;border:1px solid #f4ede080;transform:rotate(-5deg);font-weight:900}.mission-route span:nth-of-type(2){transform:rotate(5deg)}.mission-route i{font-style:normal}.mission-route b{display:block;width:100%;font-size:32px;text-align:center}.mission-paper{border-top:8px solid var(--ink);outline:1px solid #f4ede033;padding-top:80px}.stamp{position:absolute;top:16px;right:24px;display:inline-block;background:var(--ink);color:var(--accent);border:3px double var(--accent);padding:4px 16px;font-size:24px;font-weight:900;line-height:1.4;transform:rotate(-8deg);text-shadow:1px 0 var(--accent);box-shadow:0 0 2px var(--accent)}.mission-paper.in-view .stamp{animation:stamp 120ms ease-out both;animation-delay:240ms}.story-steps{padding:0;list-style:none;counter-reset:step;margin:24px 0}.story-steps li{counter-increment:step;position:relative;padding:16px 0 16px 48px;border-bottom:1px solid #17140f33;font-size:18px;line-height:1.8}.story-steps li::before{content:counter(step);position:absolute;left:0;top:16px;width:32px;height:32px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:18px;line-height:1}.story-roles{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:16px}.story-roles span{border-bottom:1px solid #17140f33}.safety{font-size:14px;margin-top:32px;border-left:1px solid var(--gold);padding-left:16px}.mission-paper h3{font-family:var(--body);font-weight:900}.book-object{writing-mode:horizontal-tb;font:900 18px/1.5 var(--body);transform:rotate(5deg);border:0;border-top:8px solid #17140f66;padding:16px;text-align:center}
@keyframes stamp{from{opacity:0;transform:scale(1.4) rotate(-8deg)}to{opacity:1;transform:scale(1) rotate(-8deg)}}
@media(max-width:640px){.hero-art{object-position:60% 50%}.mission-route{margin-top:8px;width:88px;gap:4px}.mission-route span{width:32px;height:40px;font-size:14px}.mission-route i{font-size:14px}.mission-route b{font-size:24px}.mission-paper{padding-top:80px}.stamp{right:16px}.story-steps li{padding-left:40px}.story-roles{display:grid;gap:8px}.book-object{font-size:16px}}

/* 2026-09-10 かず指示: 仕組み3ステップ＋中身の一覧（親の一話と同じ型） */
.how-section{border-top:1px solid #f4ede038}.how-layout,.stories-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:start}.how-aside h2,.stories-aside h2{font:800 clamp(56px,6.4vw,88px)/1.25 var(--display);letter-spacing:-.03em}.how-aside h2 span,.stories-aside h2 span{display:block}.how-sub,.stories-sub{margin-top:24px;font-size:18px}
.steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--gold)}.steps li{display:grid;grid-template-columns:96px 1fr;gap:24px;padding-block:32px;border-bottom:1px solid #f4ede033;align-items:start}.step-num{font:800 64px/1 var(--display);color:var(--accent)}.steps h3{font-size:24px;font-weight:900;line-height:1.5}.steps p{font-size:16px;margin-top:8px;opacity:.85}
.stories-section{border-top:1px solid #f4ede038}.stories-aside{position:sticky;top:48px}
.toc-stage{perspective:1400px;min-width:0;padding:16px 0 0 16px}.toc{list-style:none;margin:0;padding:48px}.toc li{display:grid;grid-template-columns:88px 1fr;gap:24px;padding-block:20px;border-bottom:1px dotted #17140f66;align-items:baseline}.toc li:last-child{border-bottom:0}.toc-num{font:800 16px/1.8 var(--display);letter-spacing:.06em;white-space:nowrap}.toc h3{font:800 22px/1.5 var(--display);margin:0}.toc p{font-size:15px;line-height:1.7;margin-top:4px;color:#17140fcc}.toc-last{margin-top:8px;border-top:1px solid #17140f66;padding-top:24px}.toc-note{font-size:14px;margin-top:24px;border-top:1px solid var(--gold);padding-top:16px;max-width:520px}
@media(max-width:900px){.how-layout,.stories-layout{gap:48px;grid-template-columns:.7fr 1.3fr}.how-aside h2,.stories-aside h2{font-size:56px}.steps li{grid-template-columns:72px 1fr}.step-num{font-size:52px}.toc{padding:32px}}
@media(max-width:640px){.how-layout,.stories-layout{display:block}.how-aside h2,.stories-aside h2{font-size:48px}.how-sub,.stories-sub{margin-top:16px}.steps{margin-top:40px}.steps li{grid-template-columns:56px 1fr;gap:16px;padding-block:24px}.step-num{font-size:44px}.steps h3{font-size:20px}.stories-aside{position:static}.toc-stage{margin-top:40px;padding:0 8px 0 0}.toc{padding:32px 24px}.toc li{grid-template-columns:1fr;gap:4px;padding-block:16px}.toc h3{font-size:20px}.toc-last{padding-top:20px}}
