/*
Theme Name: ちびGO
Theme URI: https://example.com/chibigo
Author: ちびGO制作チーム
Author URI: https://example.com
Description: IT・クリエイティブ・イベント事業「ちびGO」のための、雑誌のような太いゴシック見出しとサーモグラフィ風ビジュアルが特徴のオリジナルテーマ。ヒーロー文言・お知らせ（イベント）・メンバー紹介・工程・統計・お問い合わせを管理画面からすべて編集できます。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: chibigo
*/

:root{
  --paper:#FFFFFF;
  --paper-dim:#F6F6F4;
  --ink:#14110F;
  --ink-soft:#3A342C;
  --cobalt:#2A3EFF;
  --ember:#FF5A1F;
  --mustard:#E8A33D;
  --line:#E4E4E0;
  --max:none;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-snap-type:y proximity;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Zen Kaku Gothic New', sans-serif;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
::selection{ background:var(--cobalt); color:var(--paper); }
img{ max-width:100%; display:block; }

.grain{ position:fixed; inset:0; pointer-events:none; z-index:999; opacity:.05; mix-blend-mode:multiply; }

a{ color:inherit; }
.wrap{ max-width:var(--max); margin:0 auto; padding:0 6vw; }
.screen-reader-text{ position:absolute !important; left:-9999px; }

/* ---------- persistent logo seal ---------- */
.seal{
  position:fixed; top:24px; left:24px; z-index:500;
  width:82px; height:82px; border-radius:50%;
  background:var(--paper);
  border:1.5px solid var(--ink);
  display:flex; align-items:center; justify-content:center;
  animation:spin 22s linear infinite;
  box-shadow:0 2px 10px rgba(20,17,15,.08);
  overflow:hidden;
}
.seal svg, .seal img{ width:100%; height:100%; display:block; object-fit:cover; }
@keyframes spin{ to{ transform:rotate(360deg); } }
@media (max-width:640px){ .seal{ width:60px; height:60px; top:14px; left:14px; } }

/* ---------- top nav ---------- */
.nav{ position:fixed; top:0; right:0; z-index:500; padding:34px 6vw 0 0; display:flex; gap:28px; }
.nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:32px; }
.nav ul li{ margin:0; padding:0; list-style:none; }
.nav a{ font-family:'Zen Kaku Gothic New', sans-serif; font-weight:700; font-size:14px; text-decoration:none; letter-spacing:.04em; border-bottom:1px solid transparent; padding-bottom:2px; transition:border-color .2s; white-space:nowrap; }
.nav a:hover{ border-color:var(--ink); }
@media (max-width:820px){ .nav{ display:none; } }

.eyebrow{
  font-family:'Shippori Mincho', serif;
  writing-mode:vertical-rl;
  font-size:13px; letter-spacing:.35em;
  color:var(--ink-soft);
  position:absolute; left:6vw; top:0;
}
@media (max-width:640px){ .eyebrow{ writing-mode:horizontal-tb; position:static; margin-bottom:14px; letter-spacing:.2em;} }

section{ position:relative; min-height:100vh; min-height:100dvh; box-sizing:border-box; scroll-snap-align:start; scroll-snap-stop:normal; }

/* ---------- HERO ---------- */
.hero{ min-height:100vh; min-height:100dvh; padding-top:150px; padding-bottom:90px; display:flex; flex-direction:column; justify-content:flex-end; }

/* full-bleed media layer: abstract gradient (default), image carousel, or video */
.hero-media{ position:absolute; inset:0; overflow:hidden; z-index:0; }

.hero-art{ position:absolute; inset:0; }
.hero-art .blob{
  position:absolute; border-radius:50%;
  opacity:.8; mix-blend-mode:multiply; filter:blur(30px);
}
/* radial-gradient blobs fade to fully transparent well before their own edge,
   so they never look hard-cropped regardless of container clipping */
.b1{ width:64vw; height:64vw; left:-18vw; top:-16vh; background:radial-gradient(circle, var(--cobalt) 0%, rgba(42,62,255,0) 66%); }
.b2{ width:50vw; height:50vw; right:-10vw; top:6vh; background:radial-gradient(circle, var(--mustard) 0%, rgba(232,163,61,0) 66%); }
.b3{ width:46vw; height:46vw; left:18vw; bottom:-18vh; background:radial-gradient(circle, var(--ember) 0%, rgba(255,90,31,0) 66%); }

.hero-slideshow{ position:relative; width:100%; height:100%; }
.hero-slide{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0; transition:opacity 1.4s ease;
}
.hero-slide.is-active{ opacity:1; }

.hero-bg-video{ width:100%; height:100%; object-fit:cover; display:block; }

/* soft white scrim so headline stays legible over photos/video */
.hero-scrim{
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.72) 38%, rgba(255,255,255,.28) 62%, rgba(255,255,255,0) 82%);
  pointer-events:none;
}

.hero-inner{ position:relative; z-index:2; max-width:44rem; }
.hero-head{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(44px, 8.4vw, 122px); line-height:1.16; letter-spacing:0; margin:0 0 18px; }
.hero-head .accent{ color:var(--cobalt); }
.hero-word{
  font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400;
  font-size:clamp(46px, 9.6vw, 148px); letter-spacing:0;
  color:var(--paper); -webkit-text-stroke:2px var(--ink);
  margin:-6px 0 30px; opacity:.94;
}
.hero-sub{ max-width:min(560px, 100%); font-size:16px; line-height:1.9; color:var(--ink-soft); font-weight:500; }
.hero-meta{ margin-top:56px; display:flex; gap:40px; flex-wrap:wrap; font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink-soft); }


.rule{ border:0; border-top:1.5px solid var(--ink); margin:0; }
.tri{ width:0; height:0; border-left:22px solid transparent; border-right:22px solid transparent; border-top:34px solid var(--ember); margin:0 0 0 6vw; }

/* ---------- ABOUT ---------- */
.about{ padding-top:120px; padding-bottom:130px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.about-bg{ position:absolute; inset:0; background-size:cover; background-position:center; z-index:0; }
.about-bg::after{ content:''; position:absolute; inset:0; background:rgba(255,255,255, var(--about-bg-opacity, .72)); }
.about-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; margin-top:60px; }
.about-water{ position:absolute; right:-2vw; top:40px; font-size:clamp(200px,30vw,480px); font-weight:900; line-height:1; color:var(--ink); opacity:.05; z-index:1; user-select:none; pointer-events:none; font-family:'GenEiKiwamiGo','Zen Kaku Gothic New',sans-serif; }
.about h2{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(28px,3.9vw,50px); line-height:1.48; margin:0 0 26px; }
.about .about-body p{ font-size:16px; line-height:2; color:var(--ink-soft); margin:0 0 18px; max-width:46ch; }
@media (max-width:820px){ .about-grid{ grid-template-columns:1fr; } }

/* ---------- SERVICES ---------- */
.services{ padding-top:120px; padding-bottom:60px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.services-bg{ position:absolute; inset:0; background-size:cover; background-position:center; z-index:0; }
.services-bg::after{ content:''; position:absolute; inset:0; background:rgba(255,255,255, var(--services-bg-opacity, .8)); }
.services h2{ position:relative; z-index:1; font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(28px,3.9vw,50px); line-height:1.42; margin:60px 0 50px; max-width:18ch; }
.service-grid{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.service-card{
  position:relative; border-radius:22px; padding:44px 42px; overflow:hidden;
  min-height:280px; display:flex; flex-direction:column; justify-content:space-between;
}
.service-card.wide{ grid-column:1 / -1; }
.service-card.c-cobalt{ background:var(--cobalt); color:var(--paper); }
.service-card.c-mustard{ background:var(--mustard); color:var(--ink); }
.service-card.c-ink{ background:var(--ink); color:var(--paper); }
.service-icon{ width:44px; height:44px; }
.service-num{ font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:.12em; opacity:.75; margin-top:16px; }
.service-card h3{
  font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400;
  font-size:clamp(26px,3.2vw,38px); margin:14px 0 12px; line-height:1.3;
}
.service-card p{ font-size:14.5px; line-height:1.85; margin:0; max-width:48ch; opacity:.92; }
.service-link{
  margin-top:26px; font-family:'JetBrains Mono', monospace; font-size:13px;
  text-decoration:none; display:inline-flex; align-items:center; gap:8px; color:inherit;
  border-bottom:1px solid currentColor; padding-bottom:2px; align-self:flex-start;
  transition:opacity .2s ease;
}
.service-link:hover{ opacity:.7; }
@media (max-width:820px){ .service-grid{ grid-template-columns:1fr; } .service-card.wide{ grid-column:auto; } }

/* ---------- WORKS / EVENTS ---------- */
.works{ padding-top:120px; padding-bottom:130px; display:flex; flex-direction:column; justify-content:center; }
.works h2{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(28px,3.9vw,50px); line-height:1.42; margin:60px 0 60px; max-width:18ch; }
.work-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; background:var(--ink); border:2px solid var(--ink); }
.work-card{ background:var(--paper); display:flex; flex-direction:column; }
.work-photo{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--paper-dim); }
.work-photo svg, .work-photo img{ width:100%; height:100%; display:block; object-fit:cover; }
.ended-stamp{
  position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%) rotate(-14deg);
  background:rgba(255,255,255,.92);
  border:3px solid #D3251C;
  color:#D3251C;
  font-weight:900; font-size:clamp(20px,2.4vw,30px);
  letter-spacing:.15em;
  padding:6px 26px;
  white-space:nowrap;
}
.work-body{ padding:26px 30px 30px; display:flex; flex-direction:column; gap:12px; flex:1; }
.work-date{ font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--ink-soft); letter-spacing:.04em; }
.work-card h3{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:19px; line-height:1.6; margin:0; }
.work-card .work-excerpt{ font-size:14px; color:var(--ink-soft); line-height:1.75; margin:0; max-width:42ch; }
.tags{ display:flex; gap:8px; margin-top:auto; flex-wrap:wrap; padding-top:14px; }
.tag{ font-family:'JetBrains Mono', monospace; font-size:11px; border:1px solid var(--ink); padding:3px 10px; border-radius:99px; text-decoration:none; }
.tag.upcoming{ background:var(--mustard); border-color:var(--mustard); color:var(--ink); font-weight:700; }
@media (max-width:1100px){ .work-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .work-grid{ grid-template-columns:1fr; } }

/* ---------- MEMBERS / INTERVIEW ---------- */
.members{ padding-top:120px; padding-bottom:90px; border-top:1.5px solid var(--ink); display:flex; flex-direction:column; justify-content:center; }
.members-head{ position:relative; margin-top:60px; padding-bottom:70px; }
.members-head h2{
  font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400;
  font-size:clamp(30px,4.8vw,58px); line-height:1.35; margin:0 0 20px; max-width:14ch;
  position:relative; z-index:2;
}
.members-head p{ font-size:15px; line-height:1.9; color:var(--ink-soft); max-width:44ch; position:relative; z-index:2; }
.script{
  position:absolute; right:2vw; top:-6px;
  font-family:'Yellowtail', cursive;
  font-size:clamp(60px,10vw,150px);
  color:transparent;
  -webkit-text-stroke:1.4px var(--ink);
  transform:rotate(-7deg);
  white-space:nowrap;
  z-index:1;
  pointer-events:none;
}
@media (max-width:820px){ .script{ display:none; } }

.member-strip{
  display:grid; grid-template-columns:repeat(6,1fr); gap:14px;
  border-top:1.5px solid var(--ink); padding-top:40px;
}
.member-card{ display:flex; flex-direction:column; gap:10px; }
.member-photo{
  aspect-ratio:3/4; border-radius:16px; border:2.5px solid var(--ink);
  overflow:hidden; position:relative; background:var(--paper-dim);
}
.member-photo svg, .member-photo img{ width:100%; height:100%; display:block; object-fit:cover; }
.member-name{ font-size:12.5px; font-weight:700; }
.member-role{ font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--ink-soft); }
@media (max-width:980px){ .member-strip{ grid-template-columns:repeat(3,1fr); gap:20px 14px; } }
@media (max-width:520px){ .member-strip{ grid-template-columns:repeat(2,1fr); } }

/* ---------- PROCESS ---------- */
.process{ background:var(--ink); color:var(--paper); padding:120px 0 130px; display:flex; flex-direction:column; justify-content:center; }
.process .eyebrow{ color:#B9B3A5; }
.process h2{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(26px,3.4vw,42px); line-height:1.55; margin:60px 0 70px; max-width:20ch; }
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; }
.step{ padding-left:32px; border-left:1px solid #3A342C; }
.step:first-child{ border-left:0; padding-left:0; }
.step .num{ font-family:'JetBrains Mono', monospace; font-size:13px; color:var(--mustard); letter-spacing:.1em; }
.step h3{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:24px; margin:18px 0 14px; }
.step p{ font-size:14.5px; line-height:1.85; color:#C7C1B3; max-width:32ch; }
@media (max-width:820px){ .steps{ grid-template-columns:1fr; gap:44px; } .step{ border-left:0; padding-left:0; border-top:1px solid #3A342C; padding-top:32px; } .step:first-child{ border-top:0; padding-top:0; } }

/* ---------- STATS ---------- */
.stats{ padding-top:110px; padding-bottom:130px; border-top:1.5px solid var(--ink); display:flex; flex-direction:column; justify-content:center; }
.stats h2{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(26px,3.6vw,44px); line-height:1.45; margin:60px 0 50px; max-width:20ch; }
.stat-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.stat{ border-top:2px solid var(--ink); padding-top:18px; }
.stat b{ display:block; font-size:clamp(34px,4vw,54px); font-weight:900; font-family:'JetBrains Mono', monospace; }
.stat span{ font-size:13px; color:var(--ink-soft); }
@media (max-width:820px){ .stat-row{ grid-template-columns:1fr 1fr; } }

/* ---------- CTA ---------- */
.cta{ background:var(--cobalt); color:var(--paper); padding:140px 0 110px; display:flex; flex-direction:column; justify-content:center; }
.cta h2{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(32px,6vw,80px); line-height:1.28; margin:0 0 44px; max-width:16ch; }
.btn{ display:inline-flex; align-items:center; gap:14px; background:var(--paper); color:var(--ink); padding:18px 34px; border-radius:99px; font-weight:700; font-size:16px; text-decoration:none; transition:transform .18s ease; }
.btn:hover{ transform:translateX(6px); color:var(--ink); }

footer.site-footer{ padding:50px 0 60px; font-size:12.5px; color:var(--ink-soft); }
footer.site-footer .foot-grid{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:14px; font-family:'JetBrains Mono', monospace; }

.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ---------- generic page fallback ---------- */
.page-content{ padding-top:170px; padding-bottom:120px; max-width:760px; }
.page-content h1{ font-family:'GenEiKiwamiGo', 'Zen Kaku Gothic New', sans-serif; font-weight:400; font-size:clamp(30px,4.6vw,56px); margin:0 0 30px; }
.page-content .entry-content{ font-size:16px; line-height:2; color:var(--ink-soft); }

@media (prefers-reduced-motion: reduce){
  .seal{ animation:none; }
  .reveal{ transition:none; opacity:1; transform:none; }
  html{ scroll-behavior:auto; scroll-snap-type:none; }
  section{ scroll-snap-align:none; }
}
:focus-visible{ outline:2px solid var(--cobalt); outline-offset:3px; }
