.project-page { background: #090b10; }
.project-page .site-header { position: relative; background: rgba(8,10,14,.97); }
.project-page .main-nav a.active { color: var(--gold-light); }
.project-page .main-nav a.active::after { content: ""; display: block; width: 100%; height: 1px; margin-top: 7px; background: var(--gold); }
.project-page main { overflow: hidden; }

.project-hero { position: relative; padding: 112px 0 95px; overflow: hidden; border-bottom: 1px solid var(--line); background: linear-gradient(125deg, #11161e 0%, #0a0d12 60%, #15100e 100%); }
.project-hero::before { content: ""; position: absolute; inset: 0; opacity: .23; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 52px 52px; }
.project-hero-glow { position: absolute; width: 680px; height: 680px; top: -350px; right: -100px; border-radius: 50%; background: radial-gradient(circle, rgba(197,69,58,.25), rgba(217,179,108,.07) 38%, transparent 69%); }
.project-hero-grid { position: relative; display: grid; grid-template-columns: 1.35fr .65fr; gap: 90px; align-items: end; }
.project-hero h1 { margin: 0; font: 500 clamp(52px, 6vw, 82px)/.98 Georgia, "Times New Roman", serif; letter-spacing: -.035em; }
.project-hero h1 em { color: var(--gold-light); font-weight: 400; }
.project-lead { max-width: 720px; margin: 27px 0 0; color: #aeb6c1; font-size: 17px; line-height: 1.75; }
.project-summary { padding: 29px; border: 1px solid rgba(217,179,108,.25); border-radius: 5px; background: rgba(12,15,21,.72); box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.project-summary-label { display: block; color: #76808d; font-size: 9px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.project-summary > strong { display: block; margin-top: 8px; color: var(--gold-light); font: 500 27px/1.2 Georgia, serif; }
.project-summary p { margin: 18px 0; color: #929ba7; font-size: 13px; line-height: 1.65; }
.text-link { color: #e4d4b6; font-size: 12px; font-weight: 700; letter-spacing: .04em; }
.text-link span { margin-left: 8px; color: var(--gold); font-size: 18px; }

.project-section { padding: 100px 0; }
.project-section-heading { margin-bottom: 48px; display: flex; align-items: end; justify-content: space-between; gap: 45px; }
.project-section-heading h2, .knowledge-copy h2 { margin: 0; font: 500 clamp(35px, 4vw, 52px)/1.1 Georgia, serif; }
.project-section-heading > p { max-width: 580px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.status-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.status-pill, .fix-area { padding: 6px 9px; display: inline-flex; align-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 100px; color: #9fa7b2; background: rgba(255,255,255,.025); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.status-done { color: #79cfb4; border-color: rgba(84,190,154,.32); background: rgba(84,190,154,.08); }
.status-active, .status-priority { color: #ffd783; border-color: rgba(217,179,108,.42); background: rgba(217,179,108,.1); }
.status-next { color: #ff9b87; border-color: rgba(209,83,77,.38); background: rgba(209,83,77,.09); }
.status-planned { color: #96cdd4; border-color: rgba(75,168,181,.35); background: rgba(75,168,181,.08); }
.status-ideas, .status-research { color: #aeb5c0; }

.roadmap-section { background: radial-gradient(circle at 0 30%, rgba(75,168,181,.055), transparent 28%), #0b0e13; }
.roadmap-list { position: relative; }
.roadmap-list::before { content: ""; position: absolute; left: 29px; top: 35px; bottom: 35px; width: 1px; background: linear-gradient(var(--gold), rgba(217,179,108,.08)); }
.roadmap-item { position: relative; display: grid; grid-template-columns: 60px 1fr; gap: 28px; margin-bottom: 18px; }
.roadmap-marker { position: relative; z-index: 2; width: 59px; height: 59px; display: grid; place-items: center; color: #c8a867; border: 1px solid rgba(217,179,108,.3); background: #10141b; transform: rotate(45deg); }
.roadmap-marker span { font: 500 12px Georgia, serif; transform: rotate(-45deg); }
.roadmap-card { padding: 30px 34px; border: 1px solid var(--line); border-radius: 5px; background: linear-gradient(145deg, #141922, #10141b); }
.status-card-active .roadmap-card { border-color: rgba(217,179,108,.35); box-shadow: inset 3px 0 var(--gold); }
.status-card-done .roadmap-marker { color: #79cfb4; border-color: rgba(84,190,154,.35); }
.card-meta { display: flex; align-items: center; gap: 12px; color: #707986; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.roadmap-card h3, .idea-card h3 { margin: 16px 0 10px; font: 500 27px/1.2 Georgia, serif; }
.roadmap-card > p, .idea-card p { margin: 0; color: #969fab; font-size: 14px; line-height: 1.7; }
.deliverable-list { margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px 24px; list-style: none; }
.deliverable-list li { position: relative; padding-left: 18px; color: #bec4cc; font-size: 12px; line-height: 1.5; }
.deliverable-list li::before { content: "◆"; position: absolute; left: 0; top: 1px; color: var(--gold); font-size: 8px; }

.knowledge-section { background: #090b10; }
.knowledge-panel { padding: 58px; border: 1px solid rgba(217,179,108,.24); background: linear-gradient(120deg, rgba(133,38,42,.16), rgba(16,20,27,.7) 45%, rgba(75,168,181,.08)); }
.knowledge-copy { max-width: 780px; }
.knowledge-copy > p:not(.eyebrow) { color: #9ba4af; font-size: 15px; line-height: 1.75; }
.knowledge-note { padding-left: 18px; border-left: 2px solid var(--gold); }
.knowledge-flow { margin-top: 46px; display: grid; grid-template-columns: repeat(7, auto); gap: 15px; align-items: center; }
.knowledge-flow div { min-height: 110px; padding: 20px; display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--line); background: rgba(7,9,13,.62); }
.knowledge-flow div span { color: var(--gold); font-size: 9px; font-weight: 800; }
.knowledge-flow div strong { margin: 8px 0 5px; font: 500 18px Georgia, serif; }
.knowledge-flow div small { color: #757e89; }
.knowledge-flow i { color: var(--gold); font-style: normal; }

.ideas-section { background: #0b0e13; }
.ideas-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.idea-card { min-height: 245px; padding: 29px; border: 1px solid var(--line); border-radius: 5px; background: #11161e; }
.idea-card:first-child { border-color: rgba(217,179,108,.34); background: linear-gradient(145deg, rgba(160,52,48,.16), #11161e 55%); }
.idea-card h3 { font-size: 22px; }

.fix-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.fix-stats div { display: flex; flex-direction: column; }
.fix-stats div strong { color: var(--gold-light); font: 500 37px Georgia, serif; }
.fix-stats div span { margin-top: 5px; color: #7e8793; font-size: 9px; letter-spacing: .11em; text-transform: uppercase; }
.fix-stats p { grid-column: 1 / -1; margin: 0; padding-top: 18px; border-top: 1px solid var(--line); }
.fixes-section { background: #0b0e13; }
.fix-list { position: relative; }
.fix-entry { display: grid; grid-template-columns: 64px 1fr; gap: 25px; }
.fix-index { position: relative; display: flex; justify-content: center; }
.fix-index span { position: relative; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; color: var(--gold); border: 1px solid rgba(217,179,108,.32); border-radius: 50%; background: #0b0e13; font: 500 11px Georgia, serif; }
.fix-index i { position: absolute; top: 44px; bottom: 0; width: 1px; background: rgba(217,179,108,.18); }
.fix-entry:last-child .fix-index i { display: none; }
.fix-card { margin-bottom: 20px; padding: 31px 35px; border: 1px solid var(--line); border-radius: 5px; background: linear-gradient(145deg, #141922, #10141b); }
.fix-card h2 { margin: 18px 0 10px; font: 500 28px/1.2 Georgia, serif; }
.fix-card > p { margin: 0; color: #9da5b0; font-size: 14px; line-height: 1.7; }
.fix-details { margin-top: 25px; padding-top: 22px; border-top: 1px solid var(--line); }
.fix-details > strong { color: #d5b878; font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
.fix-details ul { margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 25px; list-style: none; }
.fix-details li { position: relative; padding-left: 18px; color: #bcc3cb; font-size: 12px; line-height: 1.55; }
.fix-details li::before { content: "✓"; position: absolute; left: 0; color: #69b9a6; }

@media (max-width: 1020px) {
    .project-hero-grid { grid-template-columns: 1fr .72fr; gap: 45px; }
    .ideas-grid { grid-template-columns: repeat(2, 1fr); }
    .knowledge-flow { grid-template-columns: 1fr; }
    .knowledge-flow i { text-align: center; transform: rotate(90deg); }
}
@media (max-width: 760px) {
    .project-hero { padding: 76px 0 65px; }
    .project-hero-grid { grid-template-columns: 1fr; gap: 37px; }
    .project-hero h1 { font-size: 48px; }
    .project-section { padding: 72px 0; }
    .project-section-heading { align-items: flex-start; flex-direction: column; }
    .status-legend { justify-content: flex-start; }
    .roadmap-item { grid-template-columns: 42px 1fr; gap: 14px; }
    .roadmap-list::before { left: 20px; }
    .roadmap-marker { width: 42px; height: 42px; }
    .roadmap-card, .fix-card { padding: 24px 20px; }
    .deliverable-list, .fix-details ul { grid-template-columns: 1fr; }
    .knowledge-panel { padding: 38px 23px; }
    .ideas-grid { grid-template-columns: 1fr; }
    .idea-card { min-height: auto; }
    .fix-entry { grid-template-columns: 44px 1fr; gap: 12px; }
    .fix-index span { width: 38px; height: 38px; }
    .fix-index i { top: 38px; }
}
