.project-page{
  background:#fff;color:var(--ink)
}
.project-hero{
  position:relative;overflow:hidden;padding:82px 0 74px;
  background:
    radial-gradient(circle at 91% 9%,rgba(224,170,43,.18),transparent 28%),
    radial-gradient(circle at 4% 100%,rgba(42,155,108,.11),transparent 30%),
    linear-gradient(135deg,#fffdf8 0%,#fff7e8 57%,#f4f8ff 100%)
}
.project-hero::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(23,63,122,.10) .7px,transparent .7px);
  background-size:24px 24px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.45),transparent 82%)
}
.project-hero-grid{
  position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:68px;align-items:center
}
.project-hero h1{
  margin:0;max-width:11ch;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(3.65rem,7.4vw,6.65rem);line-height:.87;letter-spacing:-.055em
}
.project-hero h1 em{font-style:normal;color:var(--blue)}
.project-hero .lead{
  max-width:620px;margin:25px 0 0;color:var(--ink-soft);
  font-size:clamp(1.04rem,1.8vw,1.22rem)
}
.project-visual{
  position:relative;min-height:520px;display:grid;place-items:center
}
.project-visual::before,.project-visual::after{
  content:"";position:absolute;border-radius:50%;border:1px solid rgba(23,63,122,.12)
}
.project-visual::before{width:445px;height:445px}
.project-visual::after{width:540px;height:540px;border-style:dashed}
.project-visual figure{
  position:relative;z-index:2;width:min(390px,82%);margin:0;padding:12px;
  border-radius:38px;background:rgba(255,255,255,.76);
  border:1px solid rgba(255,255,255,.94);box-shadow:var(--shadow-lg);
  transform:rotate(2deg)
}
.project-visual img{
  width:100%;aspect-ratio:4/5;border-radius:29px;object-fit:cover
}
.project-note{
  position:absolute;z-index:3;left:-4px;bottom:65px;width:230px;padding:16px;
  border-radius:19px;background:rgba(255,255,255,.91);backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.95);box-shadow:var(--shadow-md)
}
.project-note strong{
  display:block;font-family:"Cormorant Garamond",serif;font-size:1.45rem;line-height:1
}
.project-note span{display:block;margin-top:5px;color:var(--ink-soft);font-size:.75rem}
.project-section{padding:98px 0;background:#fff}
.project-section.alt{background:var(--cream-deep)}
.project-narrow{width:min(820px,calc(100% - 36px));margin-inline:auto}
.project-opening{
  max-width:770px;margin:0 auto 92px;text-align:center
}
.project-opening .symbol{
  display:grid;place-items:center;width:52px;height:52px;margin:0 auto 22px;
  border-radius:17px;background:var(--cream);color:var(--gold);font-size:1.25rem
}
.project-opening p{
  margin:0;font-family:"Cormorant Garamond",serif;
  font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.28
}
.project-opening strong{color:var(--blue)}
.manifest-block{
  position:relative;padding:42px 0;border-top:1px solid var(--line)
}
.manifest-label{
  display:block;margin-bottom:14px;color:var(--blue);font-size:.72rem;
  font-weight:900;text-transform:uppercase;letter-spacing:.14em
}
.manifest-block h2{
  max-width:14ch;margin:0 0 25px;font-family:"Cormorant Garamond",serif;
  font-size:clamp(2.65rem,5vw,4.45rem);line-height:.96;letter-spacing:-.04em
}
.manifest-block p{
  margin:0 0 1.35rem;color:var(--ink-soft);font-size:1.05rem;line-height:1.9
}
.manifest-block p:last-child{margin-bottom:0}
.dropcap::first-letter{
  float:left;margin:.07em .12em 0 0;color:var(--gold);
  font-family:"Cormorant Garamond",serif;font-size:4.25rem;font-weight:700;line-height:.72
}
.manifest-quote{
  position:relative;width:min(1040px,calc(100% - 36px));margin:0 auto;
  padding:clamp(55px,8vw,90px) clamp(28px,7vw,84px);
  overflow:hidden;border-radius:38px;
  background:linear-gradient(135deg,var(--blue-deep),var(--blue));
  color:#fff;box-shadow:var(--shadow-md);text-align:center
}
.manifest-quote::before{
  content:"“";position:absolute;top:-58px;left:28px;color:rgba(255,255,255,.09);
  font-family:"Cormorant Garamond",serif;font-size:15rem;line-height:1
}
.manifest-quote blockquote{
  position:relative;max-width:800px;margin:0 auto;
  font-family:"Cormorant Garamond",serif;font-size:clamp(2.15rem,5vw,4.3rem);
  font-style:italic;font-weight:600;line-height:1.13
}
.manifest-quote p{
  position:relative;max-width:680px;margin:25px auto 0;color:rgba(255,255,255,.68)
}
.four-steps{margin-top:32px;counter-reset:manifest-step}
.four-step{
  counter-increment:manifest-step;display:grid;grid-template-columns:70px 1fr;
  gap:22px;padding:26px 0;border-bottom:1px solid var(--line)
}
.four-step:first-child{border-top:1px solid var(--line)}
.four-step::before{
  content:"0" counter(manifest-step);color:var(--gold);
  font-family:"Cormorant Garamond",serif;font-size:2.65rem;line-height:1
}
.four-step h3{margin:0 0 6px;font-size:1.18rem}
.four-step p{margin:0;color:var(--ink-soft);font-size:.95rem;line-height:1.7}
.principles{margin-top:30px}
.principle{
  position:relative;margin:0;padding:25px 0 25px 38px;border-bottom:1px solid var(--line)
}
.principle:first-child{border-top:1px solid var(--line)}
.principle::before{
  content:"✦";position:absolute;left:0;top:27px;color:var(--gold);font-size:.82rem
}
.principle strong{
  display:block;margin-bottom:7px;font-family:"Cormorant Garamond",serif;
  font-size:clamp(1.5rem,3vw,2rem);line-height:1.2
}
.principle span{display:block;color:var(--ink-soft);font-size:.96rem;line-height:1.75}
.custody-note{
  margin-top:30px;padding:22px 0 0 24px;border-top:1px solid var(--line);
  border-left:3px solid var(--gold)
}
.custody-note p{
  margin:0;color:var(--ink);font-family:"Cormorant Garamond",serif;
  font-size:clamp(1.4rem,3vw,1.95rem);font-style:italic;line-height:1.45
}
.project-closing{
  width:min(1040px,calc(100% - 36px));margin:0 auto 92px;
  padding:clamp(50px,8vw,84px);border-radius:38px;
  background:linear-gradient(135deg,#fff,#f4f7fd);border:1px solid var(--line);
  box-shadow:var(--shadow-sm);text-align:center
}
.project-closing h2{
  max-width:15ch;margin:0 auto 22px;font-family:"Cormorant Garamond",serif;
  font-size:clamp(3rem,6vw,5rem);line-height:.94;letter-spacing:-.04em
}
.project-closing h2 em{color:var(--blue);font-style:normal}
.project-closing>p{max-width:690px;margin:0 auto;color:var(--ink-soft)}
.project-closing .final-word{
  display:block;margin-top:30px;color:var(--gold);
  font-family:"Cormorant Garamond",serif;font-size:clamp(3rem,7vw,5.2rem);
  font-style:italic;line-height:1
}
.project-closing .hero-actions{justify-content:center}
.authorship{
  max-width:750px!important;margin:30px auto 0!important;padding-top:21px;
  border-top:1px solid var(--line);font-size:.8rem!important;color:#7b8798!important
}
.comic-shell{padding:75px 0 95px;background:linear-gradient(180deg,#fffdf8,#f5f8ff)}
.comic-intro{max-width:820px;margin:0 auto 36px;text-align:center}
.comic-intro h1{
  margin:0;font-family:"Cormorant Garamond",serif;
  font-size:clamp(3.4rem,7vw,6rem);line-height:.9;letter-spacing:-.05em
}
.comic-intro p{max-width:700px;margin:18px auto 0;color:var(--ink-soft)}
.legacy-comic-frame{
  position:relative;overflow:hidden;width:min(1140px,calc(100% - 24px));
  height:min(82vh,1120px);min-height:720px;margin:0 auto;
  border:10px solid rgba(255,255,255,.94);border-radius:28px;
  background:#f7f1e5;box-shadow:var(--shadow-lg)
}
.legacy-comic-frame iframe{
  position:absolute;left:0;top:-68px;width:100%;height:calc(100% + 68px);border:0
}
.comic-status{
  width:min(920px,calc(100% - 36px));margin:22px auto 0;padding:17px 19px;
  border-radius:18px;background:#fff;border:1px solid var(--line);
  color:var(--ink-soft);font-size:.86rem
}
.comic-status strong{color:var(--ink)}
.comic-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:25px}
@media(max-width:900px){
  .project-hero-grid{grid-template-columns:1fr;gap:35px}
  .project-hero h1{max-width:none}
  .project-visual{min-height:480px}
}
@media(max-width:650px){
  .project-hero{padding:55px 0}
  .project-visual{min-height:420px}
  .project-visual figure{width:270px}
  .project-visual::before{width:350px;height:350px}
  .project-visual::after{width:420px;height:420px}
  .project-note{left:0;bottom:35px;width:195px}
  .four-step{grid-template-columns:1fr;gap:8px}
  .four-step::before{font-size:2rem}
  .project-closing,.manifest-quote{border-radius:27px}
  .legacy-comic-frame{height:72vh;min-height:610px;border-width:5px;border-radius:17px}
}