.guide-body { background: #e9d8ae; }
.guide-header { position: absolute; }
.guide-hero { position: relative; min-height: 760px; padding: 185px 9vw 100px; background: #20221e; color: var(--cream); overflow: hidden; isolation: isolate; }
.guide-hero::before { content:''; position:absolute; z-index:-2; inset:0; background:radial-gradient(circle at 78% 48%,rgba(217,155,43,.58),transparent 6%),radial-gradient(circle at 78% 48%,rgba(161,103,28,.45),transparent 25%),linear-gradient(108deg,#191b18 5%,#30312a 57%,#181a17); }
.guide-hero::after { content:'';position:absolute;z-index:-1;inset:-30%;opacity:.17;transform:rotate(-11deg);background-image:linear-gradient(30deg,transparent 46%,#f2e3bd 48%,transparent 51%),linear-gradient(150deg,transparent 46%,#f2e3bd 48%,transparent 51%);background-size:25px 43px;mask-image:linear-gradient(90deg,transparent,#000); }
.guide-hero h1 { max-width:900px;margin:0;font-family:var(--serif);font-size:clamp(74px,10vw,148px);line-height:.8;letter-spacing:-.065em;font-weight:430; }
.guide-hero h1 em { color:var(--gold);font-weight:230; }
.guide-deck { max-width:560px;margin:45px 0 0 22%;color:rgba(242,227,189,.7);font-size:18px; }
.guide-scroll { min-height:48px;display:inline-flex;align-items:center;gap:22px;margin:35px 0 0 22%;font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-underline-offset:6px; }
.guide-scroll span { color:var(--gold);font-size:20px; }
.guide-orbit { position:absolute;right:8vw;top:170px;width:300px;aspect-ratio:1;border:1px solid rgba(242,227,189,.2);border-radius:50%;animation:orbit 38s linear infinite; }
.guide-orbit i { position:absolute;left:50%;top:50%;width:30px;height:34px;border:1px solid rgba(240,189,72,.5);transform:translate(-50%,-50%) rotate(calc(var(--i) * 60deg)) translateY(-112px);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); }
.guide-orbit i:nth-child(1){--i:0}.guide-orbit i:nth-child(2){--i:1}.guide-orbit i:nth-child(3){--i:2}.guide-orbit i:nth-child(4){--i:3}.guide-orbit i:nth-child(5){--i:4}.guide-orbit i:nth-child(6){--i:5}.guide-orbit b{position:absolute;left:50%;top:50%;width:22px;height:22px;background:var(--blue);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 35px rgba(47,99,174,.8)}
.guide-article { padding:80px 7vw 130px; }
.guide-block { display:grid;grid-template-columns:110px 1fr;gap:5vw;max-width:1120px;margin:0 auto;padding:100px 0;border-bottom:1px solid var(--line); }
.guide-number { width:74px;height:85px;display:grid;place-items:center;background:var(--amber);font-family:var(--serif);font-size:28px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); }
.guide-block h2 { max-width:850px;margin:0 0 40px;font-family:var(--serif);font-size:clamp(47px,6vw,84px);font-weight:380;line-height:.95;letter-spacing:-.05em; }
.guide-block>div:last-child>p:not(.eyebrow) { max-width:820px;color:#49483f;font-size:16px;line-height:1.85; }
.technique-list { display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line); }
.technique-list p { margin:0;padding:28px;background:#f0e0b9;color:#42423a;font-size:14px;line-height:1.75; }
.technique-list b { display:block;margin-bottom:7px;font-family:var(--serif);font-size:24px;font-weight:500;color:var(--brown); }
code { padding:2px 5px;background:rgba(117,72,23,.11);font-family:var(--sans);font-size:.86em;font-weight:700; }
.swatches { display:grid;grid-template-columns:repeat(5,1fr);margin:0 0 38px;border:1px solid var(--line); }
.swatches div { min-width:0;padding:8px;border-right:1px solid var(--line); }
.swatches div:last-child { border:0; }
.swatches i { display:block;height:110px;background:var(--swatch);margin-bottom:13px;box-shadow:inset 0 0 0 1px rgba(23,25,22,.08); }
.swatches b,.swatches span{display:block;font-size:8px;text-transform:uppercase;letter-spacing:.1em}.swatches span{color:#6b6659;margin-top:4px}
.reproduce-block blockquote { margin:0;padding:35px 40px;background:var(--ink-soft);color:var(--cream);border-left:8px solid var(--blue);font-family:var(--serif);font-size:20px;line-height:1.6; }
.reproduce-block blockquote + p { margin-top:30px; }
.guide-close { min-height:620px;padding:120px 8vw;display:grid;place-content:center;justify-items:center;text-align:center;background:var(--amber); }
.guide-close>span { font-size:9px;text-transform:uppercase;letter-spacing:.18em; }
.guide-close h2 { margin:20px 0 45px;font-family:var(--serif);font-size:clamp(58px,8vw,112px);font-weight:400;line-height:.88;letter-spacing:-.055em; }
.guide-close h2 em { color:#fff1c9;font-weight:240; }
.guide-close .button-solid { background:var(--ink);color:var(--cream);box-shadow:10px 10px 0 rgba(117,72,23,.28); }
@media(max-width:900px){.guide-orbit{right:-90px;top:260px}.guide-deck,.guide-scroll{margin-left:8%}.guide-block{grid-template-columns:80px 1fr;gap:25px;padding:78px 0}.swatches{grid-template-columns:repeat(5,1fr)}}
@media(max-width:600px){.guide-hero{min-height:700px;padding:145px 20px 90px}.guide-hero h1{font-size:70px}.guide-deck{margin:35px 0 0 18px;font-size:15px;max-width:310px}.guide-scroll{margin:28px 0 0 18px}.guide-orbit{width:180px;right:-90px;top:445px}.guide-orbit i{transform:translate(-50%,-50%) rotate(calc(var(--i) * 60deg)) translateY(-66px)}.guide-article{padding:25px 18px 70px}.guide-block{display:block;padding:58px 0}.guide-number{width:54px;height:62px;font-size:20px;margin-bottom:30px}.guide-block h2{font-size:49px;margin-bottom:30px}.guide-block>div:last-child>p:not(.eyebrow){font-size:15px}.technique-list{grid-template-columns:1fr}.technique-list p{padding:23px}.swatches{grid-template-columns:1fr 1fr}.swatches div{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.swatches div:nth-child(even){border-right:0}.swatches div:last-child{grid-column:1/-1;border-right:0}.swatches i{height:85px}.reproduce-block blockquote{padding:27px 23px;font-size:18px}.guide-close{min-height:520px;padding:80px 20px}.guide-close h2{font-size:59px}}
@media(prefers-reduced-motion:reduce){.guide-orbit{animation:none}}

/* Pass 2 — a working field manual, not a component catalogue */
.guide-body{background:radial-gradient(circle at 20% 22%,rgba(255,249,218,.9),transparent 25%),linear-gradient(106deg,#e6d2a1,#f1e2bd 55%,#dfc792)}
.guide-hero{min-height:820px;padding:190px 9.5vw 105px;background:#181a16}
.guide-hero::before{background:radial-gradient(circle at 78% 48%,rgba(255,221,126,.72) 0 1%,rgba(217,155,43,.5) 5%,transparent 9%),radial-gradient(circle at 78% 48%,rgba(161,103,28,.48),transparent 27%),linear-gradient(108deg,#151713 5%,#30312a 57%,#151713)}
.guide-hero h1{max-width:980px;font-size:clamp(82px,10.5vw,154px);line-height:.77}
.guide-deck,.guide-scroll{margin-left:19%}.guide-deck{color:rgba(246,233,197,.8)}
.guide-coordinate{position:absolute;right:5vw;bottom:40px;margin:0;text-align:right;color:rgba(242,227,189,.42);font-size:7px;line-height:1.7;letter-spacing:.16em;text-transform:uppercase}
.guide-article{padding:95px 7vw 150px;background:radial-gradient(circle at 82% 30%,rgba(255,249,221,.72),transparent 24%),radial-gradient(circle at 8% 76%,rgba(210,152,42,.1),transparent 24%)}
.guide-block{grid-template-columns:135px 1fr;gap:3.5vw;max-width:1180px;padding:115px 0}
.guide-number{position:sticky;top:30px;width:92px;height:106px;background:transparent;border:1px solid rgba(117,72,23,.42);color:var(--brown);font-size:35px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.guide-number::after{content:'';position:absolute;inset:9px;background:var(--amber);z-index:-1;clip-path:inherit}
.guide-block h2{font-size:clamp(56px,6.2vw,91px);max-width:920px}
.guide-block>div:last-child>p:not(.eyebrow){color:#413f37;font-size:16px;line-height:1.9}
.signal-flow{margin-top:38px;padding:22px 0;display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;gap:14px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:8px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--brown)}.signal-flow i{height:1px;background:linear-gradient(90deg,var(--amber),var(--blue));position:relative}.signal-flow i::after{content:'';position:absolute;right:0;top:-3px;border-left:5px solid var(--blue);border-top:3px solid transparent;border-bottom:3px solid transparent}
.technique-list{display:block;background:transparent;border:0;counter-reset:field-step}.technique-list p{position:relative;margin:0;padding:31px 35px 31px 95px;background:rgba(241,226,186,.58);border-top:1px solid var(--line);font-size:14px;line-height:1.78}.technique-list p:last-child{border-bottom:1px solid var(--line)}.technique-list p:nth-child(even){margin-left:8%;background:rgba(83,87,80,.1)}.technique-list p::before{content:attr(data-step);position:absolute;left:25px;top:32px;width:42px;padding-top:7px;border-top:2px solid var(--blue);color:var(--blue);font-size:9px;letter-spacing:.14em}.technique-list b{font-size:26px}
code{background:rgba(47,99,174,.09);color:#183f76}
.swatches{grid-template-columns:1.35fr 1.15fr 1fr 1.2fr .72fr;gap:8px;border:0;align-items:end}.swatches div{padding:0;border:0}.swatches i{height:150px;margin-bottom:12px;box-shadow:inset 0 0 0 1px rgba(23,25,22,.12),0 12px 30px rgba(76,50,12,.08)}.swatches div:nth-child(2) i{height:122px}.swatches div:nth-child(3) i{height:136px}.swatches div:nth-child(4) i{height:105px}.swatches div:nth-child(5) i{height:72px}.swatches b,.swatches span{padding-left:3px}.swatches span{line-height:1.5}
.reproduce-block blockquote{position:relative;margin-left:5%;padding:52px 55px 45px;background:linear-gradient(125deg,#2d302b,#20231f);border-left:0;box-shadow:18px 18px 0 rgba(47,99,174,.17);font-size:22px}.reproduce-block blockquote::before{content:'AGENT BRIEF / 66';position:absolute;left:55px;top:21px;color:#8eb7f4;font-family:var(--sans);font-size:7px;letter-spacing:.17em}
.guide-close{min-height:680px;background:radial-gradient(circle at 50% 53%,rgba(255,230,152,.34),transparent 29%),linear-gradient(115deg,#d58e1c,#e5a62e 62%,#c77e16)}

@media(max-width:900px){.guide-hero{min-height:760px}.guide-block{grid-template-columns:90px 1fr}.guide-number{position:static;width:68px;height:78px;font-size:26px}.guide-deck,.guide-scroll{margin-left:8%}.signal-flow{grid-template-columns:1fr auto 1fr auto 1fr auto 1fr}.signal-flow i{width:18px}.technique-list p:nth-child(even){margin-left:0}.swatches{gap:5px}.swatches i{height:110px}.swatches div:nth-child(2) i{height:96px}.swatches div:nth-child(3) i{height:102px}.swatches div:nth-child(4) i{height:82px}.swatches div:nth-child(5) i{height:58px}}
@media(max-width:600px){.guide-hero{min-height:720px;padding:145px 20px 85px}.guide-hero h1{font-size:68px;line-height:.79}.guide-deck{font-size:15px}.guide-coordinate{display:none}.guide-article{padding:30px 18px 75px}.guide-block{padding:68px 0}.guide-number{width:58px;height:67px;margin-bottom:34px}.guide-block h2{font-size:50px;line-height:.93}.signal-flow{grid-template-columns:1fr 1fr;gap:0;margin-top:28px;border:1px solid var(--line)}.signal-flow span{padding:13px 10px;border-bottom:1px solid var(--line);font-size:7px}.signal-flow i{display:none}.technique-list p,.technique-list p:nth-child(even){padding:65px 22px 24px;margin:0}.technique-list p::before{left:22px;top:24px}.swatches{grid-template-columns:1fr 1fr;gap:12px}.swatches div:last-child{grid-column:2}.swatches i,.swatches div:nth-child(2) i,.swatches div:nth-child(3) i,.swatches div:nth-child(4) i,.swatches div:nth-child(5) i{height:92px}.swatches div:last-child i{height:45px}.reproduce-block blockquote{margin:0;padding:58px 24px 30px;font-size:18px;box-shadow:10px 10px 0 rgba(47,99,174,.17)}.reproduce-block blockquote::before{left:24px;top:23px}.guide-close{min-height:560px}}
@media(prefers-reduced-motion:reduce){.guide-number{position:static}}
