@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
:root{--bg:#111111;--panel:#191919;--ink:#f0f0f0;--muted:#aaaaaa;--line:#383838;--accent:#dedede;--rail:44px;--roll:0px;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:auto;scroll-snap-type:none;scroll-padding-top:0}body{position:relative;margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 'DM Sans',Arial,sans-serif;}body[data-look=silver]{--bg:#e9e9e9;--panel:#dedede;--ink:#202020;--muted:#626262;--line:#bebebe;--accent:#333333;color-scheme:light}body[data-look=contrast]{--bg:#080808;--panel:#141414;--ink:#ffffff;--muted:#bdbdbd;--line:#444444;--accent:#ffffff}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,select,a{ -webkit-tap-highlight-color:transparent}button,a,select{touch-action:manipulation}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}h1,h2,h3,p,figure{margin:0}h1,h2{font-family:'Playfair Display',Georgia,serif;font-weight:500;letter-spacing:-.055em;line-height:1.04}h1{font-size:clamp(70px,7.5vw,124px)}h2{font-size:clamp(44px,4.7vw,76px)}h3{font:500 28px/1.2 'Playfair Display',Georgia,serif;margin:12px 0}em{font-weight:500;color:var(--accent)}p{max-width:580px}img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}.rail{position:absolute;top:0;bottom:0;width:var(--rail);z-index:30;pointer-events:none;background:#090909;border-inline:1px solid #343434}.rail:after{content:'';position:absolute;inset:0 12px;background:linear-gradient(to bottom,#767676 0 25px,transparent 25px 50px);background-size:100% 50px;opacity:.66}.left{left:0}.right{right:0}.rail:before{content:'JJJ PHOTO 35mm KODAK';font:10px monospace;position:absolute;top:45%;color:#bcbcbc;writing-mode:vertical-rl;z-index:2;left:2px;letter-spacing:3px}header{position:relative;margin:0 var(--rail);height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid var(--line);z-index:20;background:var(--bg)}.brand{display:flex;align-items:center;gap:12px;font:bold 39px/.9 Georgia,serif;letter-spacing:-4px}.brand span{font:600 12px/1.3 'DM Sans',sans-serif;letter-spacing:2.5px;border-left:1px solid var(--line);padding-left:13px}nav{display:flex;gap:30px;font-size:14px}nav a:hover,nav a.current{color:var(--accent)}nav a:last-child{margin-left:20px}nav span{color:var(--accent)}.menu{display:none}.frame{position:relative;margin:0 var(--rail);padding:65px 5% 60px;min-height:calc(100svh - 80px);scroll-snap-align:none;border-bottom:1px solid var(--line);}.hero{padding-top:40px;display:grid;grid-template-columns:44% 56%;gap:0;align-items:center;min-height:calc(100svh - 100px)}.hero-copy{padding:0 25px 80px 0;z-index:2}.eyebrow,.micro,.frame-foot,.hero-note,.format,.map-top,.map-bottom,.status{font:500 12px/1.5 'DM Sans',sans-serif;letter-spacing:2px}.eyebrow{color:var(--accent)}.hero .eyebrow{margin-bottom:30px}.intro{color:var(--muted);font-size:18px;margin:28px 0}.button{display:inline-flex;align-items:center;gap:45px;padding:15px 21px;background:var(--ink);color:var(--bg);font-size:14px;font-weight:600}.button:hover{background:var(--accent)}.hero-note{margin-top:50px;display:flex;gap:22px;color:var(--muted);font-size:11px}.hero-photo{margin:0 0 65px;align-self:center}.hero-photo img{aspect-ratio:1.05;object-fit:cover;object-position:center;height:auto}.hero-photo figcaption{border-top:1px solid var(--line);padding-top:12px;display:flex;justify-content:space-between;gap:12px}figcaption{font-size:13px;color:var(--muted);margin-top:12px}figcaption span{font-size:11px}.frame-foot{position:absolute;bottom:26px;left:5%;right:5%;display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.section-top{display:flex;justify-content:space-between;gap:20px;margin-bottom:44px}.micro{color:var(--muted)}.story-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:8%;align-items:center}.story-grid figure img{max-height:490px;object-fit:contain}.story-grid p{margin-top:22px;color:var(--muted)}.editor-note{font-size:13px!important;line-height:1.6;color:var(--muted);border-left:2px solid var(--line);padding-left:14px;margin-top:24px}.text-link{display:inline-block;margin-top:22px;font-size:14px;border-bottom:1px solid var(--accent);padding-bottom:4px}.milestones{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--line);margin-top:50px;padding-top:28px;gap:30px}.milestones div{display:flex;gap:20px;align-items:center}.milestones b{font:500 35px Georgia,serif;white-space:nowrap}.milestones span{font-size:13px;color:var(--muted);max-width:160px}.source{font-size:12px;color:var(--muted);margin-top:22px}.source a{text-decoration:underline}.archive-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:32px}.archive-heading p{max-width:300px;color:var(--muted)}.archive-controls{display:grid;grid-template-columns:1fr 1.2fr 1fr auto;gap:16px;align-items:end}.archive-controls label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:var(--muted)}select,input[type=search]{width:100%;border:1px solid var(--line);background:var(--panel);padding:11px 12px;color:var(--ink);border-radius:0;min-height:48px}.outline{background:transparent;color:var(--ink);border:1px solid var(--line);padding:11px 16px;min-height:48px;font-size:14px}.outline:hover{border-color:var(--accent)}.year-control{display:flex;align-items:center;gap:22px;margin:25px 0;font-size:12px;letter-spacing:1px}.year-control label{white-space:nowrap}.year-control output{font-size:20px;color:var(--accent);margin-left:7px}.year-control input{flex:1;min-width:70px;accent-color:var(--accent)}.year-control>span{color:var(--muted);white-space:nowrap}.map-layout{display:grid;grid-template-columns:1.5fr 1fr;border:1px solid var(--line);min-height:370px}.map{background:var(--panel);position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.map svg{width:100%;height:auto;max-height:390px;color:var(--muted)}.map-top,.map-bottom{display:flex;justify-content:space-between;padding:16px 20px;gap:15px;font-size:10px;color:var(--muted);letter-spacing:1px}.region{fill:currentColor;opacity:.4;font:12px 'DM Sans',sans-serif;letter-spacing:4px}.pin{cursor:pointer;outline:none}.pin circle{fill:var(--accent);stroke:var(--bg);stroke-width:4}.pin:hover circle,.pin:focus circle{r:12;stroke:var(--ink)}.pin text{font:14px 'DM Sans',sans-serif;fill:var(--ink)}.results{padding:24px;border-left:1px solid var(--line)}#records{max-height:365px;overflow-y:auto;margin-top:15px}.record{display:block;border:0;border-top:1px solid var(--line);background:transparent;color:var(--ink);width:100%;text-align:left;padding:17px 0}.record time{color:var(--accent);font-size:13px}.record h3{font:500 18px/1.35 'DM Sans',sans-serif;margin:5px 0}.record p{font-size:13px;color:var(--muted)}.record a{font-size:12px;text-decoration:underline;color:var(--accent)}.films h2{margin-bottom:38px}.video-grid{display:grid;grid-template-columns:1.8fr 1fr;gap:40px;align-items:start}.video-image{position:relative;overflow:hidden}.wide .video-image{aspect-ratio:16/9}.wide img{object-position:center 42%}.short .video-image{aspect-ratio:9/12;max-height:480px}.short img{filter:grayscale(1) brightness(.7)}.format{position:absolute;top:18px;left:18px;color:#eee;background:#111c;padding:6px 10px;font-size:10px}.video-copy{padding-top:20px}.video-copy p{color:var(--muted);font-size:15px}.status{display:block;letter-spacing:.5px;color:var(--accent);margin-top:18px}.short-title{position:absolute;bottom:28px;left:25px;color:white;font:italic 46px/1.08 Georgia,serif}.prints-grid{display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:center}.prints-grid p{margin-top:27px;color:var(--muted)}.prints-grid .button{margin-top:25px}.prints-grid figure img{aspect-ratio:1;object-fit:contain}footer{border-top:1px solid var(--line);margin-top:70px;padding:30px 0 45px;display:grid;grid-template-columns:.5fr 1fr 1fr;gap:30px;align-items:start}footer p,footer details{font-size:13px;color:var(--muted)}footer details a{display:block;text-decoration:underline;margin-top:7px}summary{cursor:pointer;color:var(--ink)}footer details p{margin:15px 0}.preview-controls{position:fixed;bottom:0;left:var(--rail);right:var(--rail);z-index:40;background:var(--bg);border-top:1px solid var(--line);padding:8px 22px;display:flex;align-items:center;gap:18px;font-size:11px;letter-spacing:1px}.preview-controls select{font-size:12px;padding:4px 8px;min-height:30px;width:155px}.preview-controls button{background:transparent;border:0;color:var(--muted);font-size:12px}.preview-controls>span:last-child{margin-left:auto;color:var(--accent)}.skip{position:fixed;top:-100px;z-index:100;background:var(--ink);color:var(--bg);padding:10px}.skip:focus{top:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}body.no-motion *,body.no-motion *:before,body.no-motion *:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}body.no-motion .rail:after{transform:none}body.no-motion .frame{filter:none}body.no-motion .exposure{display:none}
@media(min-width:1600px){.frame,header{padding-left:8%;padding-right:8%}.hero{grid-template-columns:42% 58%}}
@media(max-width:1000px){:root{--rail:28px}.rail:after{inset:0 7px}.rail:before{display:none}header{height:85px}nav{gap:16px;font-size:12px}nav a:last-child{margin-left:0}.hero{grid-template-columns:45% 55%}h1{font-size:80px}.hero .eyebrow{font-size:10px}.hero-note{flex-direction:column;gap:2px}.hero-photo figcaption{flex-direction:column}.milestones div{flex-direction:column;align-items:start;gap:6px}.map-layout{grid-template-columns:1.2fr 1fr}.archive-controls{grid-template-columns:1fr 1fr}.micro{font-size:10px}.hero-copy{padding-bottom:90px}}
@media(max-width:700px){:root{--rail:18px}.rail:after{inset:0 4px;background-size:100% 34px;background-image:linear-gradient(to bottom,#767676 0 17px,transparent 17px 34px)}header{height:74px;padding:0 6%}.brand{font-size:32px}.menu{display:block;background:none;border:1px solid var(--line);padding:7px 12px;color:var(--ink);font-size:13px}nav{display:none;position:absolute;top:73px;left:0;right:0;padding:25px;background:var(--bg);border-bottom:1px solid var(--line);font-size:16px}nav.open{display:flex;flex-direction:column}.frame{padding:38px 6% 75px;min-height:auto;scroll-snap-align:none}.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:32px}.hero-copy{padding:0}.hero .eyebrow{margin-bottom:20px;letter-spacing:1.4px}h1{font-size:72px}h1 br{display:none}h2{font-size:43px}.intro{font-size:16px;margin:22px 0}.hero-note{display:none}.hero-photo{margin:32px 0 30px}.hero-photo figcaption{flex-direction:row;font-size:12px}.hero-photo figcaption span{font-size:9px}.frame-foot{bottom:20px;font-size:9px;letter-spacing:1px}.frame-foot>a{display:none}.section-top{margin-bottom:28px}.micro{display:none}.story-grid,.prints-grid{grid-template-columns:1fr;gap:30px}.story-grid>figure{order:2}.story-grid p{font-size:16px}.milestones{gap:15px;margin-top:30px}.milestones b{font-size:26px}.milestones span{font-size:12px}.archive-heading{display:block}.archive-heading p{margin-top:18px}.archive-controls{gap:12px}.archive-controls label{font-size:12px}.archive-controls input,.archive-controls select{font-size:14px;min-width:0}.year-control{flex-wrap:wrap;gap:12px}.year-control input{flex-basis:100%;order:3}.year-control>span{display:none}.map-layout{grid-template-columns:1fr}.results{border-left:0;border-top:1px solid var(--line)}.map-top,.map-bottom{font-size:9px;padding:12px}.video-grid{grid-template-columns:1fr;gap:35px}.short{display:grid;grid-template-columns:1fr 1fr;gap:18px}.short .video-image{aspect-ratio:9/16}.short-title{font-size:29px;bottom:15px;left:15px}.short .format{font-size:8px;left:8px;top:8px}.video-copy p{font-size:14px}.status{font-size:11px}.prints-grid>figure{margin-top:15px}footer{grid-template-columns:1fr;gap:25px;margin-top:35px}.preview-controls{padding:6px 9px;gap:8px;letter-spacing:0}.preview-controls>span:first-child{display:none}.preview-controls>span:last-child{font-size:9px}.preview-controls select{width:135px;font-size:11px}.preview-controls button{font-size:11px}.eyebrow{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.frame,.exposure,.rail:after{animation:none!important;transition:none!important}.rail:after{transform:none!important}}

.map-tools{position:absolute;left:14px;top:55px;z-index:2;display:flex;gap:4px}.map-tools button{border:1px solid var(--line);background:var(--bg);color:var(--ink);padding:6px 11px;min-height:36px;font-size:14px}#map-svg{cursor:grab;touch-action:none}#map-svg:active{cursor:grabbing}.map-bottom a{text-decoration:underline}

.biography-chapters{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;border-top:1px solid var(--line);padding-top:38px;margin-top:36px}.biography-chapters h3{font-size:30px;margin:13px 0 20px}.biography-chapters p{font-size:16px;color:var(--muted);margin-top:16px}.biography-chapters .text-link{font-size:13px}.schematic-note{max-width:none;padding:18px 20px;border:1px solid var(--line);margin-bottom:24px;color:var(--muted);font-size:14px}.schematic-note .eyebrow{display:block;margin-bottom:7px}@media(max-width:850px){.biography-chapters{grid-template-columns:1fr;gap:35px}}


/* First-page review: centered display crop preserves the original photo. */
.hero h1{font-size:clamp(48px,5.8vw,96px)}
.hero{min-height:calc(100svh - 116px)}
footer{grid-template-columns:.5fr 2fr}
@media(max-width:700px){.hero h1{font-size:clamp(42px,10.5vw,72px)}.hero h1 br{display:block}.hero-photo{width:100%}.hero-photo figcaption{flex-direction:column;gap:3px}footer{grid-template-columns:1fr}#map-svg{touch-action:pan-y}}

/* Static negative-frame windows and substantial inter-frame dividers. */
main{background:#050505;padding-bottom:18px}
.frame{border:1px solid #555;border-radius:22px;background:var(--bg);margin-bottom:18px;box-shadow:0 1px 0 #777;overflow:clip}
@media(max-width:700px){main{padding-bottom:12px}.frame{border-radius:15px;margin-bottom:12px}}

/* The closing portrait is the only scroll-linked image effect. */
.portrait-images{position:relative;aspect-ratio:1.25;overflow:hidden}
.prints-grid .portrait-images img{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover}
.portrait-raised{opacity:var(--portrait-up,0)}
@media(prefers-reduced-motion:reduce){.portrait-raised{display:none}}

/* Opening collection label emphasis; removed location note leaves a compact text group. */
.hero .eyebrow{font-size:16px;font-weight:700;letter-spacing:2px}.hero-copy{padding-bottom:35px}@media(max-width:700px){.hero .eyebrow{font-size:14px;letter-spacing:1.5px}.hero-copy{padding-bottom:0}}

/* Keep the full Partnership portrait visible at its natural proportions. */
.story-grid>figure img{width:auto;height:auto;max-width:100%;max-height:560px;object-fit:contain;margin-inline:auto}

/* Each highlight belongs to its chapter in desktop and mobile reading order. */
.chapter-highlight{min-height:100px;padding-bottom:22px;margin-bottom:28px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}
.chapter-highlight b{font:500 clamp(25px,2.5vw,38px)/1.2 Georgia,serif;letter-spacing:-.025em}
.chapter-highlight span{font-size:14px;color:var(--muted)}
@media(max-width:850px){.chapter-highlight{min-height:0;margin-bottom:24px}.chapter-highlight b{font-size:32px}}

.chapter-highlight .ranch-brand-text{font-family:"DM Sans",Arial,sans-serif;font-weight:500;letter-spacing:.04em}

/* Sprocket openings repeat along the full document-length film rails. */
.rail:after{inset:0 8px;background-image:linear-gradient(to bottom,#767676 0 36px,transparent 36px 56px);background-size:100% 56px}
@media(max-width:1000px){.rail:after{inset:0 4px;background-image:linear-gradient(to bottom,#767676 0 29px,transparent 29px 46px);background-size:100% 46px}}
@media(max-width:700px){.rail:after{inset:0 3px;background-image:linear-gradient(to bottom,#767676 0 24px,transparent 24px 39px);background-size:100% 39px}}

.timeline-progress{max-width:370px}.archive-heading .timeline-progress p{max-width:none}.timeline-progress .eyebrow{font-size:14px;font-weight:600;letter-spacing:1px;color:var(--ink);margin-bottom:8px}.timeline-progress p:last-child{font-size:16px}@media(max-width:700px){.archive-heading .timeline-progress p+p{margin-top:8px}}

.legacy-honors{margin-top:30px;border-top:1px solid var(--line);padding-top:22px}.legacy-honors h4{font:600 16px/1.4 "DM Sans",Arial,sans-serif;margin:0 0 14px}.legacy-honors ul{padding-left:20px;margin:0 0 25px}.legacy-honors li{font-size:16px;line-height:1.65;color:var(--muted);margin-bottom:13px}.legacy-honors li::marker{color:var(--ink)}

.official-history{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:28px;padding:16px 0}.official-history summary{font-size:16px;font-weight:600;cursor:pointer}.official-history ul{padding-left:20px;margin:20px 0 0}.official-history li{font-size:16px;line-height:1.65;margin-bottom:14px;color:var(--muted)}

.photographs-highlight{flex-direction:row;align-items:center;justify-content:space-between;gap:14px}.photographs-highlight>div{display:flex;flex-direction:column;gap:8px}.photographs-highlight img{width:90px;height:auto;flex-shrink:0;object-fit:contain}.wide img[src="jim-steer-wrestling.jpg"]{object-fit:contain;object-position:center;background:#080808}@media(max-width:1000px) and (min-width:851px){.photographs-highlight img{width:65px}}

/* Larger film rails and perforations requested in review. */
:root{--rail:64px}
.rail:after{inset:0 9px;background-image:linear-gradient(to bottom,#767676 0 52px,transparent 52px 76px);background-size:100% 76px}
@media(max-width:1000px){:root{--rail:44px}.rail:after{inset:0 6px;background-image:linear-gradient(to bottom,#767676 0 42px,transparent 42px 64px);background-size:100% 64px}}
@media(max-width:700px){:root{--rail:26px}.rail:after{inset:0 4px;background-image:linear-gradient(to bottom,#767676 0 34px,transparent 34px 52px);background-size:100% 52px}}

/* Shared career record below all three biography chapters. */
.career-details{border-top:1px solid var(--line);margin-top:44px;padding-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.career-details>.official-history,.career-details>.legacy-honors{margin:0;padding:0;border:0;min-width:0}
.career-details .official-history summary{padding-bottom:14px}
@media(max-width:850px){.career-details{grid-template-columns:1fr;gap:32px;margin-top:34px;padding-top:28px}}

/* Stronger rounded negative-frame outlines. */
.frame{border-width:2px;border-color:#686868}

footer .footer-contact{grid-column:1/-1;max-width:none;font-size:16px;line-height:1.7;border-top:1px solid var(--line);padding-top:24px;margin-top:4px}.footer-contact a{text-decoration:underline;text-underline-offset:3px;color:var(--ink);overflow-wrap:anywhere}

/* Compact closing frame while retaining room for contact details. */
.frame.prints{min-height:0;padding-bottom:24px}
.prints footer{margin-top:38px;padding-bottom:12px;row-gap:20px}
footer .footer-contact{padding-top:18px;margin-top:0}
@media(max-width:700px){.frame.prints{padding-bottom:20px}.prints footer{margin-top:28px;padding-bottom:8px;row-gap:18px}}

/* Slightly tighter opening portrait spacing. */
.hero{min-height:calc(100svh - 160px);padding-top:28px}
.hero-photo{margin-bottom:40px}
@media(max-width:700px){.hero{min-height:0;padding-top:28px}.hero-photo{margin:24px 0 22px}}

/* Rounded perforations; lettering follows the outside edges of the strip. */
.rail:after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2244%22%20height%3D%2276%22%3E%3Crect%20width%3D%2244%22%20height%3D%2252%22%20rx%3D%224%22%20fill%3D%22%23767676%22%2F%3E%3C%2Fsvg%3E");background-size:100% 76px;}
.rail:before{display:block;top:45vh;left:0;right:auto;width:8px;font-size:8px;line-height:1;letter-spacing:2px;white-space:nowrap;}
.rail.right:before{left:auto;right:0;text-align:right;}
@media(max-width:1000px){.rail:after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2230%22%20height%3D%2264%22%3E%3Crect%20width%3D%2230%22%20height%3D%2242%22%20rx%3D%223%22%20fill%3D%22%23767676%22%2F%3E%3C%2Fsvg%3E");background-size:100% 64px;}.rail:before{width:5px;font-size:5px;letter-spacing:1.5px;}}
@media(max-width:700px){.rail:after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2252%22%3E%3Crect%20width%3D%2216%22%20height%3D%2234%22%20rx%3D%222%22%20fill%3D%22%23767676%22%2F%3E%3C%2Fsvg%3E");background-size:100% 52px;}.rail:before{width:3px;font-size:3px;letter-spacing:1px;}}

/* Read the right stock label from the opposite outside edge. */
.rail.right:before{transform:rotate(180deg);}
