/* =====================================================
   全国ドコデモこども食堂 | About Us
   ===================================================== */
:root{
  --bg:#FFFFFF;
  --bg-soft:#FBF7F2;
  --ink:#1A1614;
  --ink-soft:#4A4340;
  --ink-faint:#D9D2C7;
  --line:#E8DFD3;
  --accent:#C8332B;
  --accent-deep:#9E2520;
  --accent-soft:#F4DCD9;
  --gold:#B89150;
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:var(--bg);color:var(--ink);font-family:"Noto Sans JP",sans-serif;font-feature-settings:"palt";line-height:1.85;-webkit-font-smoothing:antialiased;}
body{overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
::selection{background:var(--accent);color:#fff;}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

/* ---------- preloader ---------- */
.preloader{position:fixed;inset:0;z-index:9999;}
.pl-layer{position:absolute;inset:0;will-change:transform;}
.pl-layer-accent{background:var(--accent-soft);z-index:1;}
.pl-layer-base{background:var(--bg);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;}
.pl-phrase{font-family:"Noto Serif JP",serif;font-weight:700;font-size:clamp(15px,2.4vw,21px);letter-spacing:.22em;color:var(--ink);text-align:center;padding:0 6vw;}
.pl-phrase .ch{display:inline-block;}
.pl-bar{width:min(300px,58vw);height:2px;background:var(--line);overflow:hidden;}
.pl-bar span{display:block;height:100%;width:0;background:var(--accent);}
.pl-count{font-family:"Inter",sans-serif;font-weight:600;font-size:12px;letter-spacing:.3em;color:var(--ink-soft);}

/* ---------- 質感（グレイン） ---------- */
.grain{position:fixed;inset:0;z-index:2500;pointer-events:none;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ---------- カスタムカーソル ---------- */
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:9000;border-radius:50%;mix-blend-mode:multiply;}
.cursor-dot{width:6px;height:6px;background:var(--accent);transform:translate(-50%,-50%);}
.cursor-ring{width:36px;height:36px;border:1px solid var(--accent);transform:translate(-50%,-50%);transition:width .3s,height .3s,background .3s;}
.cursor-ring.hover{width:60px;height:60px;background:rgba(200,51,43,.08);}
@media(max-width:900px){.cursor-dot,.cursor-ring{display:none;}}

/* ---------- header ---------- */
header{position:fixed;top:0;left:0;width:100%;padding:22px 5vw;display:flex;justify-content:space-between;align-items:center;z-index:1000;background:rgba(255,255,255,0);transition:all .4s;}
header.scrolled{background:rgba(255,255,255,.96);box-shadow:0 1px 0 var(--line);backdrop-filter:blur(8px);padding:14px 5vw;}
header.hide{transform:translateY(-110%);}
.logo{display:block;width:clamp(220px,24vw,360px);}
.logo img{width:100%;height:auto;display:block;}
nav ul{display:flex;gap:34px;list-style:none;align-items:center;}
nav a{font-size:14px;letter-spacing:.08em;color:var(--ink-soft);transition:color .3s;}
nav a:hover{color:var(--accent);}
.btn-donate{display:inline-block;padding:11px 22px;border:1px solid var(--accent);background:var(--accent);color:#fff !important;border-radius:999px;font-size:13px;letter-spacing:.1em;transition:background .3s,border-color .3s;}
.btn-donate:hover{background:var(--accent-deep);border-color:var(--accent-deep);}
@media(max-width:900px){nav ul{gap:16px;} nav li:not(:last-child){display:none;}}

/* ---------- 共通 ---------- */
section{position:relative;padding:160px 8vw;}
.section-num{font-family:"Inter",sans-serif;font-size:12px;letter-spacing:.4em;color:var(--accent);margin-bottom:32px;display:flex;align-items:center;gap:14px;}
.section-num::before{content:"";width:48px;height:1px;background:var(--accent);}
.kicker{font-family:"Inter",sans-serif;font-size:13px;letter-spacing:.35em;color:var(--accent);}
@media(max-width:900px){section{padding:110px 6vw;}}

/* 行マスク（タイトル演出） */
.line-mask{display:block;overflow:hidden;}
.line-mask .line{display:inline-block;will-change:transform;}

/* ---------- hero ---------- */
.hero{min-height:100vh;display:flex;align-items:center;padding:0 8vw;position:relative;overflow:hidden;background:var(--bg);}
.hero::before{content:"";position:absolute;right:-15vw;top:-10vh;width:55vw;height:55vw;background:radial-gradient(circle,var(--accent-soft) 0%,transparent 70%);opacity:.55;z-index:0;}
.hero-bg-text{position:absolute;right:-2vw;bottom:-3vw;font-family:"Inter",sans-serif;font-weight:800;font-size:clamp(140px,22vw,360px);color:var(--accent-soft);opacity:.5;line-height:.85;letter-spacing:-.04em;z-index:0;pointer-events:none;white-space:nowrap;}
.hero-motes{position:absolute;inset:0;z-index:1;pointer-events:none;}
.mote{position:absolute;width:9px;height:9px;border-radius:50%;opacity:0;background:radial-gradient(circle at 35% 35%,rgba(184,145,80,.9),rgba(184,145,80,0) 70%);filter:blur(.5px);}
.hero-inner{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,1fr);gap:clamp(36px,5vw,82px);align-items:center;}
.hero-copy{min-width:0;}
.hero-photo{width:100%;max-width:680px;justify-self:end;aspect-ratio:16/10;border-radius:8px;background:var(--bg-soft);border:1px solid var(--line);position:relative;overflow:hidden;box-shadow:0 24px 70px rgba(31,23,18,.12);}
.hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,0) 45%,rgba(26,22,20,.16) 100%);pointer-events:none;z-index:2;}
.hero-photo img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1;will-change:transform;}
.hero-kicker{font-family:"Inter",sans-serif;font-size:13px;letter-spacing:.4em;color:var(--accent);margin-bottom:40px;}
.hero h1{font-family:"Noto Serif JP",serif;font-weight:900;font-size:clamp(38px,5vw,74px);line-height:1.32;letter-spacing:.02em;color:var(--ink);}
.hero h1 .em{color:var(--accent);}
.hero h1 .mask{display:block;overflow:hidden;}
.hero h1 .mask>span{display:inline-block;transform:translateY(105%);white-space:nowrap;will-change:transform;}
.hero-sub{margin-top:48px;max-width:560px;font-size:16px;color:var(--ink-soft);line-height:2.1;opacity:0;transform:translateY(20px);transition:opacity 1s,transform 1s;}
.hero-sub.show{opacity:1;transform:translateY(0);}
.scroll-hint{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.3em;color:var(--ink-soft);writing-mode:vertical-rl;z-index:2;}
.scroll-hint::after{content:"";display:block;width:1px;height:40px;background:var(--accent);margin:14px auto 0;animation:scrolldown 2s infinite;}
@keyframes scrolldown{0%{transform:scaleY(0);transform-origin:top;}50%{transform:scaleY(1);transform-origin:top;}51%{transform-origin:bottom;}100%{transform:scaleY(0);transform-origin:bottom;}}
@media(max-width:900px){
  .hero{padding:110px 6vw 80px;align-items:flex-start;}
  .hero-inner{grid-template-columns:1fr;gap:42px;}
  .hero h1{font-size:clamp(32px,8.8vw,58px);}
  .hero-photo{justify-self:start;max-width:420px;aspect-ratio:16/11;}
}

/* ---------- 本文 ---------- */
.prose{max-width:820px;margin:0 auto;}
.prose p{font-family:"Noto Serif JP",serif;font-size:clamp(17px,1.45vw,21px);line-height:2.35;letter-spacing:.04em;color:var(--ink);margin-bottom:1.9em;}
.prose p.lead{font-size:clamp(20px,1.8vw,26px);font-weight:500;line-height:2.1;color:var(--ink);}
.prose .em{color:var(--accent);font-weight:700;}
.prose .big{font-family:"Inter",sans-serif;font-weight:800;font-size:1.15em;color:var(--accent);letter-spacing:.02em;}
.source{display:block;font-family:"Noto Sans JP",sans-serif;font-size:12px;color:var(--ink-soft);letter-spacing:.05em;margin-top:-1em;margin-bottom:2em;}

.section-title{font-family:"Noto Serif JP",serif;font-weight:900;font-size:clamp(30px,4vw,52px);line-height:1.45;letter-spacing:.04em;margin-bottom:60px;color:var(--ink);}
.section-title .em{color:var(--accent);}

/* 9人に1人 */
.nine-wrap{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin:10px 0 70px;}
.nine-grid{display:grid;grid-template-columns:repeat(9,auto);gap:clamp(8px,1.6vw,16px);}
.nine-grid span{width:clamp(12px,1.6vw,17px);height:clamp(12px,1.6vw,17px);border-radius:50%;background:var(--line);position:relative;}
.nine-grid span.lost{background:var(--accent);}
.nine-grid.lit span.lost::after{content:"";position:absolute;inset:-7px;border:1px solid var(--accent);border-radius:50%;animation:ninePulse 2.2s ease-out infinite;}
@keyframes ninePulse{0%{transform:scale(.4);opacity:.9;}100%{transform:scale(1.7);opacity:0;}}
.nine-caption{font-size:12.5px;letter-spacing:.18em;color:var(--ink-soft);}

/* ---------- photo ---------- */
.photo-frame{width:100%;max-width:480px;aspect-ratio:4/3;background:var(--bg-soft);border:1px solid var(--line);margin:50px auto;position:relative;overflow:hidden;border-radius:6px;}
.photo-frame img{width:100%;height:100%;object-fit:cover;will-change:transform;}

/* ---------- message ---------- */
.message{background:var(--bg-soft);padding:180px 8vw;position:relative;overflow:hidden;}
.message-bar{position:absolute;left:0;top:0;width:6px;height:100%;background:var(--accent);transform-origin:top;}
.message-headline{font-family:"Noto Serif JP",serif;font-weight:900;font-size:clamp(28px,3.5vw,48px);line-height:1.6;color:var(--ink);margin-bottom:50px;letter-spacing:.04em;}
.message-headline .em{color:var(--accent);}
.message-signature{margin-top:60px;font-family:"Noto Serif JP",serif;}
.message-signature .role{font-size:13px;color:var(--ink-soft);letter-spacing:.2em;}
.message-signature .name{font-size:26px;font-weight:700;letter-spacing:.1em;margin-top:6px;}

/* ---------- ticket ---------- */
.ticket{max-width:560px;margin:60px auto;background:#fff;border:2px dashed var(--accent);border-radius:8px;padding:40px;position:relative;text-align:center;transform-style:preserve-3d;}
.ticket::before,.ticket::after{content:"";position:absolute;top:50%;width:24px;height:24px;background:var(--bg);border-radius:50%;transform:translateY(-50%);}
.ticket::before{left:-12px;}.ticket::after{right:-12px;}
.ticket .t-label{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.4em;color:var(--accent);margin-bottom:14px;}
.ticket .t-amount{font-family:"Noto Serif JP",serif;font-weight:900;font-size:56px;color:var(--ink);letter-spacing:.02em;}
.ticket .t-amount .yen{font-size:24px;}
.ticket .t-unit{font-size:13px;color:var(--ink-soft);letter-spacing:.2em;margin-top:8px;}
.t-shine{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:6px;}
.t-shine::before{content:"";position:absolute;top:-20%;left:-60%;width:38%;height:140%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.85),transparent);transform:skewX(-18deg);}
.ticket.show .t-shine::before{animation:ticketShine 1.5s .9s ease both;}
@keyframes ticketShine{to{left:135%;}}

/* ---------- numbers ---------- */
.numbers{background:var(--bg-soft);padding:160px 8vw;}
.numbers-intro{font-family:"Noto Serif JP",serif;font-size:clamp(18px,1.6vw,22px);line-height:2.2;max-width:680px;margin:0 auto 80px;text-align:center;color:var(--ink);}
.numbers-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;max-width:1280px;margin:0 auto;}
@media(max-width:1100px){.numbers-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media(max-width:680px){.numbers-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
.num-card{background:#fff;padding:44px 18px;text-align:center;border:1px solid var(--line);transition:border-color .4s,transform .4s,box-shadow .4s;position:relative;overflow:hidden;min-width:0;}
.num-card::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.num-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 14px 36px rgba(200,51,43,.1);}
.num-card:hover::before{transform:scaleX(1);}
.num-card .n-label{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.2em;color:var(--accent);margin-bottom:18px;}
.num-card .n-value{font-family:"Noto Serif JP",serif;font-weight:900;font-size:clamp(34px,3.4vw,52px);color:var(--ink);line-height:1;letter-spacing:.01em;display:flex;align-items:baseline;justify-content:center;gap:4px;flex-wrap:nowrap;}
.num-card .n-value .num{display:inline-block;}
.num-card .n-value .unit{font-size:.32em;color:var(--ink-soft);font-weight:500;letter-spacing:.05em;white-space:nowrap;}
.num-card .n-desc{margin-top:18px;font-size:12.5px;color:var(--ink-soft);letter-spacing:.05em;}

/* ---------- cta ---------- */
.cta{padding:180px 8vw;text-align:center;background:var(--bg);position:relative;overflow:hidden;}
.cta::before{content:"";position:absolute;left:50%;top:0;width:60vw;height:60vw;background:radial-gradient(circle,var(--accent-soft) 0%,transparent 70%);opacity:.4;transform:translate(-50%,-30%);animation:ctaBreath 9s ease-in-out infinite;}
@keyframes ctaBreath{0%,100%{transform:translate(-50%,-30%) scale(1);}50%{transform:translate(-50%,-30%) scale(1.1);}}
.cta-headline{font-family:"Noto Serif JP",serif;font-weight:900;font-size:clamp(28px,3.6vw,48px);line-height:1.6;margin-bottom:30px;position:relative;}
.cta-headline .em{color:var(--accent);}
.cta-sub{font-size:15px;color:var(--ink-soft);max-width:560px;margin:0 auto 60px;line-height:2;position:relative;}
.cta-buttons{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;position:relative;}
.btn{display:inline-block;padding:22px 44px;font-size:15px;letter-spacing:.12em;border-radius:999px;transition:background .35s,color .35s,border-color .35s,box-shadow .35s;font-weight:500;will-change:transform;}
.btn-primary{background:var(--accent);color:#fff;border:1px solid var(--accent);box-shadow:0 10px 30px rgba(200,51,43,.25);}
.btn-primary:hover{background:var(--accent-deep);border-color:var(--accent-deep);box-shadow:0 14px 36px rgba(200,51,43,.32);}
.btn-outline{background:transparent;color:var(--ink);border:1px solid var(--ink);}
.btn-outline:hover{background:var(--ink);color:#fff;}

/* ---------- directors ---------- */
.directors{background:var(--bg-soft);padding:160px 8vw;}
.directors-intro{text-align:center;max-width:640px;margin:0 auto 80px;font-size:16px;color:var(--ink-soft);line-height:2;}
.directors-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;max-width:1200px;margin:0 auto;}
.director-card{background:#fff;padding:36px 30px;border:1px solid var(--line);transition:border-color .4s,transform .4s,box-shadow .4s;}
.director-card:hover{border-color:var(--accent);transform:translateY(-4px);box-shadow:0 12px 40px rgba(200,51,43,.08);}
.director-photo{width:100%;aspect-ratio:1;background:var(--bg-soft);margin-bottom:24px;display:flex;align-items:center;justify-content:center;color:var(--line);font-size:48px;overflow:hidden;border-radius:4px;}
.director-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.22,1,.36,1);}
.director-card:hover .director-photo img{transform:scale(1.05);}
.director-role{font-family:"Inter",sans-serif;font-size:11px;letter-spacing:.3em;color:var(--accent);margin-bottom:8px;}
.director-name{font-family:"Noto Serif JP",serif;font-size:22px;font-weight:700;margin-bottom:14px;letter-spacing:.06em;}
.director-bio{font-size:13.5px;line-height:1.95;color:var(--ink-soft);}

/* ---------- history ---------- */
.history{padding:160px 8vw;background:var(--bg);}
.history-list{max-width:880px;margin:80px auto 0;position:relative;}
.history-list::before{content:"";position:absolute;left:180px;top:0;width:1px;height:100%;background:var(--line);}
.history-progress{position:absolute;left:180px;top:0;width:1px;height:100%;background:var(--accent);transform:scaleY(0);transform-origin:top;}
.history-item{display:grid;grid-template-columns:180px 1fr;gap:60px;padding:36px 0;position:relative;}
.history-item::before{content:"";position:absolute;left:175px;top:46px;width:11px;height:11px;background:var(--accent);border-radius:50%;border:3px solid var(--bg);z-index:1;}
.history-year{font-family:"Inter",sans-serif;font-weight:800;font-size:18px;color:var(--accent);letter-spacing:.1em;}
.history-title{font-family:"Noto Serif JP",serif;font-size:20px;font-weight:700;margin-bottom:10px;letter-spacing:.04em;}
.history-desc{font-size:14.5px;color:var(--ink-soft);line-height:1.95;}
.history-item.future .history-year{color:var(--ink);}
.history-item.future::before{background:var(--ink);}
@media(max-width:700px){
  .history-list::before{left:6px;}
  .history-progress{left:6px;}
  .history-item{grid-template-columns:1fr;gap:8px;padding-left:30px;}
  .history-item::before{left:1px;top:8px;}
}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#fff;padding:80px 8vw 40px;}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-bottom:60px;}
.footer-grid h4{font-family:"Noto Serif JP",serif;font-size:18px;margin-bottom:18px;letter-spacing:.1em;}
.footer-grid p{font-size:13.5px;line-height:2;color:rgba(255,255,255,.7);}
.footer-grid a{transition:color .3s;}
.footer-grid a:hover{color:var(--accent-soft);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding-top:30px;font-size:12px;color:rgba(255,255,255,.5);text-align:center;letter-spacing:.1em;}
@media(max-width:700px){.footer-grid{grid-template-columns:1fr;gap:30px;}}

/* ---------- reveal ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1);}
.reveal.show{opacity:1;transform:translateY(0);}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;}
  .reveal{opacity:1;transform:none;}
  .hero h1 .mask>span{transform:none;}
  .hero-sub{opacity:1;transform:none;}
}