/* Premium Claude project track — additive to the existing source. */
:root{--premium-ink:#0c1116;--premium-muted:#657180;--premium-green:#19e85a}
body{background:radial-gradient(ellipse 60% 26% at 95% 31%,rgba(25,232,90,.095),transparent 72%),#fff;color:var(--premium-ink)}
.wrap{max-width:1380px;padding-left:clamp(20px,4vw,64px);padding-right:clamp(20px,4vw,64px)}
nav{background:rgba(255,255,255,.94);box-shadow:0 2px 22px rgba(12,17,22,.025)}
nav .wrap{height:76px}
nav .brand img{height:43px}
.backBtn{margin-top:25px;margin-bottom:0;padding:11px 18px;border-radius:11px;background:#0d0f12;color:var(--premium-green)}
.backBtn:focus-visible,.item:focus-visible,.seg button:focus-visible{outline:3px solid #079b39;outline-offset:3px}
header.fold{padding:40px 0 30px;grid-template-columns:172px minmax(0,1fr);gap:36px;position:relative}
header.fold::after{content:"";position:absolute;right:-8%;top:8%;width:34%;height:82%;background:radial-gradient(ellipse,rgba(25,232,90,.11),transparent 70%);pointer-events:none;z-index:-1}
header.fold .icon{width:164px;height:164px;display:grid;place-items:center;background:linear-gradient(145deg,#fff,#f9fafb);border-radius:28px;box-shadow:0 14px 40px rgba(15,23,42,.09);border:1px solid #f0f2f3}
header.fold .icon svg{width:112px;height:100px}
.eyebrow{font-size:.82rem;font-weight:800;color:#09a83c;letter-spacing:.12em;margin-bottom:7px}
header.fold h1{font-size:clamp(2.5rem,5vw,4rem);letter-spacing:-.055em;line-height:1.12;margin-bottom:8px}
header.fold p{max-width:830px;color:var(--premium-muted);font-size:clamp(.96rem,1.25vw,1.12rem);line-height:1.65}
.track-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.track-tags span{padding:8px 13px;border-radius:999px;background:#f2f6f4;color:#334155;font-size:.8rem;font-weight:650}
.section-heading{margin-top:18px;margin-bottom:17px;font-size:1.55rem;letter-spacing:-.035em}
.section-heading small{letter-spacing:0}
.project-timeline{position:relative;padding-left:75px;gap:20px}
.project-timeline::before{content:"";position:absolute;left:25px;top:45px;bottom:45px;border-left:2px dashed #d9e0e3}
.project-timeline .item{position:relative;grid-template-columns:78px minmax(0,1fr) auto;gap:22px;min-height:175px;padding:26px 28px;border-radius:23px;border:1px solid #e5ebea;box-shadow:0 9px 25px rgba(12,17,22,.045);transition:transform .2s,box-shadow .2s,border-color .2s}
.project-timeline .item:hover{transform:translateY(-2px);box-shadow:0 14px 35px rgba(12,17,22,.08);border-color:#8cecb1}
.project-timeline .item.live{box-shadow:0 10px 30px rgba(12,17,22,.045);border-color:#d8f4e2}
.project-timeline .item:first-child{background:linear-gradient(110deg,#f4fff8,#fff 65%)}
.project-timeline .item .n{position:absolute;left:-75px;top:24px;width:50px;height:50px;border-radius:50%;font-size:1rem;z-index:1;box-shadow:0 4px 14px rgba(25,232,90,.18)}
.project-timeline .item:nth-child(2) .n{background:#f1f3f5;color:#0d1117;box-shadow:0 3px 14px rgba(15,23,42,.07)}
.project-symbol{width:76px;height:76px;border-radius:20px;background:#dcfbe8;color:#069c38;display:flex;align-items:center;justify-content:center;font-size:2.4rem;font-weight:700}
.project-timeline .item h3{font-size:1.3rem;letter-spacing:-.03em}
.project-timeline .item p{max-width:790px;line-height:1.55}
.project-timeline .chips{margin-top:12px}
.project-timeline .act{justify-self:end}
.project-timeline .btn.green{border-radius:12px;padding:13px 20px;font-size:.91rem;min-width:150px;justify-content:center}
.chip{background:#f7f9fa}
.chip.ai{background:#eefcf2}
@media(max-width:800px){header.fold{grid-template-columns:100px minmax(0,1fr);gap:18px}header.fold .icon{width:100px;height:100px;border-radius:19px}header.fold .icon svg{width:76px;height:70px}.project-timeline{padding-left:53px}.project-timeline::before{left:18px}.project-timeline .item{grid-template-columns:56px minmax(0,1fr);padding:20px;gap:14px}.project-timeline .item .n{left:-53px;width:38px;height:38px}.project-symbol{width:56px;height:56px;font-size:1.8rem}.project-timeline .act{grid-column:2;justify-self:start}}
@media(max-width:520px){nav .wrap{height:65px}nav .brand{font-size:.72rem}nav .brand img{height:28px}nav .seg{font-size:.7rem}.seg button{padding:6px 8px}header.fold{grid-template-columns:1fr;padding-top:28px}header.fold .icon{width:86px;height:86px}header.fold h1{font-size:2.6rem}.track-tags span{font-size:.72rem}.project-timeline{padding-left:42px}.project-timeline::before{left:14px}.project-timeline .item{grid-template-columns:1fr}.project-timeline .item .n{left:-42px;width:30px;height:30px;font-size:.8rem}.project-timeline .act{grid-column:1}.project-symbol{width:50px;height:50px}.project-timeline .item h3{font-size:1.12rem}.project-timeline .btn.green{width:100%}}
@media(prefers-reduced-motion:reduce){.project-timeline .item{transition:none}.project-timeline .item:hover{transform:none}}

/* Relay sessions belong to Project 02, not a separate modules catalog. */
.relay-build-sessions{margin-top:36px}
.relay-session-heading{margin-bottom:18px}
.relay-session-heading h2{font-size:clamp(1.5rem,2.5vw,2rem);letter-spacing:-.035em;margin:4px 0 8px}
.relay-session-heading h2 small{font-size:.85rem;font-weight:500;color:#667085;letter-spacing:normal;margin-left:10px}
.relay-session-heading p{color:#64748b;font-size:.95rem;line-height:1.55}
.relay-session-list .item{border:1px solid #e5ebea;box-shadow:0 8px 26px rgba(12,17,22,.045);border-radius:22px;grid-template-columns:64px minmax(0,1fr) auto;gap:20px;padding:24px}
.relay-session-list .item.live{border-color:#bcefcf;background:linear-gradient(115deg,#f7fff9,#fff 60%);box-shadow:0 8px 26px rgba(12,17,22,.045)}
.relay-session-list .item.soon{background:#fafbfc}
.relay-session-list .item .n{font-family:inherit;font-weight:800}
.relay-session-list .item.soon .n{background:#eef1f3;color:#667085}
.relay-session-list .item p{max-width:880px;line-height:1.6}
.relay-live-result{margin:20px 0 0;padding:28px 32px;display:flex;align-items:center;gap:25px;border-radius:23px;background:linear-gradient(115deg,#081512,#101d1a 70%,#07371c);color:white;box-shadow:0 14px 34px rgba(0,0,0,.11)}
.relay-live-symbol{flex:none;width:72px;height:72px;border:1px solid #19e85a;border-radius:18px;color:#19e85a;font-size:3rem;display:grid;place-items:center;box-shadow:inset 0 0 25px rgba(25,232,90,.13)}
.relay-live-copy{flex:1;min-width:0}.relay-live-copy .eyebrow{color:#19e85a}.relay-live-copy h2{font-size:1.5rem;letter-spacing:-.03em;margin:0 0 4px}.relay-live-copy p{color:#cbd5e1;line-height:1.55;font-size:.93rem;max-width:770px}
.relay-live-button{background:#19e85a!important;color:#062b14!important;border-color:#19e85a!important;justify-content:center}
.relay-about-link{margin:24px 0 0;text-align:center}.relay-about-link a{color:#475569;text-decoration:underline;text-underline-offset:3px}
@media(max-width:800px){.relay-session-list .item{grid-template-columns:48px minmax(0,1fr)}.relay-session-list .act{grid-column:2;justify-self:start}.relay-live-result{flex-wrap:wrap}.relay-live-button{margin-left:97px}}
@media(max-width:520px){.relay-session-heading h2 small{display:block;margin:4px 0 0}.relay-session-list .item{grid-template-columns:1fr;padding:20px}.relay-session-list .act{grid-column:1}.relay-live-result{padding:22px;gap:16px}.relay-live-symbol{width:56px;height:56px}.relay-live-copy{flex-basis:calc(100% - 72px)}.relay-live-button{margin-left:0;width:100%}}
.item h3 .mname { display:block; font-size:.78rem; font-weight:500; color:#5b6670; margin-top:2px; }
.modules-standalone { margin-top:28px; }

/* Integrated Relay development sessions: shared with the existing premium Claude page. */
.relay-sequence{position:relative;gap:14px}
.relay-sequence .item{min-height:142px;transition:box-shadow .18s ease,border-color .18s ease}
.relay-sequence .item.live:hover{border-color:#19e85a;box-shadow:0 10px 30px rgba(6,95,36,.09)}
.relay-sequence .item .n{width:54px;height:54px;flex-shrink:0;font-size:.95rem;border-radius:15px}
.relay-sequence .item.soon{border-style:dashed;opacity:.88}
.relay-sequence .item.soon .n{background:#eef1f3;color:#475569}
.relay-sequence .item h3{font-size:1.16rem;letter-spacing:-.025em}
.relay-sequence .item .act{justify-self:end}
.relay-sequence .item .btn{min-width:160px;justify-content:center}
.future-build-topics{margin-top:30px;padding:20px 24px;border:1px solid #e5ebea;border-radius:20px;background:#fafbfc}
.future-build-topics h2{margin:0 0 14px;font-size:1.15rem}
.future-build-topics h2 small{font-size:.8rem;color:#64748b;font-weight:400}
.future-topic-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.future-topic-grid strong{font-size:.92rem}.future-topic-grid p{font-size:.83rem;color:#64748b;margin-top:4px}
@media(max-width:800px){.relay-sequence .item .act{grid-column:2;justify-self:start}}
@media(max-width:520px){.relay-sequence .item .act{grid-column:1;width:100%}.relay-sequence .item .btn{width:100%}.future-topic-grid{grid-template-columns:1fr}}

/* Page hierarchy: setup is preparation; Relay is a separate application. */
.setup-section,.application-section{margin-top:28px}
.section-intro{margin-bottom:18px}
.section-intro h2{font-size:clamp(1.55rem,2.6vw,2rem);letter-spacing:-.035em;margin:0 0 5px}
.section-intro p{font-size:.96rem;line-height:1.55;color:#64748b}
.setup-card{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:22px;align-items:center;padding:25px 28px;border:1px solid #d8f4e2;border-radius:23px;background:linear-gradient(110deg,#f4fff8,#fff 65%);box-shadow:0 9px 25px rgba(12,17,22,.045);text-decoration:none;color:inherit}
.setup-card h3{font-size:1.23rem;margin:0 0 5px}.setup-card p{color:#657180;line-height:1.55}
.setup-card .chips{margin-top:12px}.setup-card .act{justify-self:end}
.setup-card:hover{border-color:#19e85a;box-shadow:0 12px 30px rgba(12,17,22,.07)}
.application-shell{border:1px solid #d7eee0;border-radius:26px;padding:26px;background:linear-gradient(135deg,#fbfffc,#fff 55%);box-shadow:0 14px 38px rgba(12,17,22,.045)}
.application-head{display:flex;align-items:center;gap:22px;padding-bottom:23px;border-bottom:1px solid #e2eee7}
.application-head-copy{flex:1;min-width:0}.application-head h3{font-size:clamp(1.5rem,2.6vw,2rem);margin:0 0 4px;letter-spacing:-.035em}
.application-head p{color:#64748b;line-height:1.55;max-width:850px}.application-head .chips{margin-top:12px}
.application-details{color:#087b31;font-weight:750;text-decoration:none;white-space:nowrap;padding:11px 14px;border:1px solid #a9e6bd;border-radius:12px}
.application-details:hover{background:#edfff3}.application-details:focus-visible{outline:3px solid #079b39;outline-offset:3px}
.application-shell .relay-build-sessions{margin-top:26px}
.application-shell .relay-live-result{margin-top:20px}
@media(max-width:800px){.setup-card{grid-template-columns:60px minmax(0,1fr)}.setup-card .act{grid-column:2;justify-self:start}.application-head{flex-wrap:wrap}.application-details{margin-left:98px}}
@media(max-width:520px){.setup-card{grid-template-columns:1fr;padding:20px}.setup-card .act{grid-column:1;width:100%}.setup-card .btn{width:100%;justify-content:center}.application-shell{padding:16px;border-radius:20px}.application-head{gap:12px}.application-head .project-symbol{width:50px;height:50px;font-size:1.8rem}.application-head-copy{flex-basis:calc(100% - 62px)}.application-details{margin-left:0;width:100%;text-align:center}}
