:root{color-scheme:light;--bg:#f4f3ed;--panel:#fffefa;--text:#19201b;--muted:#68716a;--line:#d8dbd2;--accent:#5a45c8;--blue:#3678d4;--purple:#704bd4;--green:#438b54;--orange:#e27735;--surface:#eaece4;--hero-grid:rgba(43,65,42,.12);--card:#e9ece5;--card-alt:#e3e8df;--subtle:#626b63;--display:'Manrope',sans-serif;--body:'DM Sans',sans-serif;--mono:'DM Mono',monospace}[data-theme="dark"]{color-scheme:dark;--bg:#0c1110;--panel:#141b18;--text:#f1f0e9;--muted:#969d95;--line:#303934;--accent:#9a83ff;--blue:#61a1ff;--purple:#9a83ff;--green:#72cd88;--orange:#ff965e;--surface:#141a17;--hero-grid:rgba(181,205,179,.13);--card:#19211d;--card-alt:#1a211c;--subtle:#9ca39b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body);font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden}a{color:inherit;text-decoration:none}.grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E")}.site-header{height:62px;padding:0 6.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid color-mix(in srgb,var(--line) 65%,transparent);position:fixed;z-index:50;top:0;width:100%;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 4px 24px rgba(10,18,30,.08)}.wordmark{display:flex;align-items:center;gap:10px;font:600 10px var(--mono);letter-spacing:.14em;color:var(--text)}.brand-logo{width:40px;height:40px;object-fit:contain;display:block}.site-header .brand-logo{width:34px;height:34px}.mark{font:800 23px var(--display);letter-spacing:-.12em;color:var(--accent)}nav{display:flex;gap:38px;margin-left:70px}nav a,.header-cta{font-size:12px;color:var(--subtle);transition:color .2s}nav a:hover,.header-cta:hover{color:var(--accent)}.header-tools{display:flex;align-items:center;gap:10px}.theme-toggle{height:34px;min-width:76px;padding:0 11px;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--text);font:10px var(--mono);cursor:pointer;transition:background .2s,border-color .2s}.theme-toggle:hover{background:var(--surface);border-color:var(--accent)}.theme-toggle .theme-icon{margin-right:7px;color:var(--accent)}.header-cta{border:1px solid var(--line);border-radius:2px;padding:8px 12px;color:var(--text)}.header-cta span,.text-link span,.work-footer a span{color:var(--accent);margin-left:10px}.hero{position:relative;min-height:760px;height:min(100vh,920px);max-height:980px;padding:205px 12% 100px;overflow:hidden;display:flex;align-items:center;background:linear-gradient(90deg,rgba(12,16,32,.84) 0%,rgba(17,18,39,.69) 40%,rgba(15,17,34,.34) 100%),linear-gradient(0deg,rgba(10,14,26,.42),transparent 55%)}.hero-background{position:absolute;inset:-14% 0;z-index:0;background:url("../images/parallax/parallax1.jpg") center 46%/cover no-repeat;will-change:transform;transform:translate3d(0,0,0)}.hero-grid{position:absolute;inset:0;z-index:0;opacity:.18;background-image:linear-gradient(var(--hero-grid) 1px,transparent 1px),linear-gradient(90deg,var(--hero-grid) 1px,transparent 1px);background-size:88px 88px;mask-image:linear-gradient(90deg,black,transparent 87%)}.hero-copy{position:relative;z-index:2;max-width:690px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.22)}.hero-copy .hero-intro{color:rgba(255,255,255,.85)}.hero-copy .eyebrow{color:rgba(255,255,255,.84)}.hero-copy .text-link{color:#fff}.hero-copy .motto-label{color:rgba(255,255,255,.72)}.eyebrow,.section-kicker,.filter-label,.repo-source,.hero-bottom,.hero-index,.art-label,.art-coordinate,.timeline-period,.timeline-tag,.experience-stats div>span,.work-footer,.contact-bottom>a,footer>span,footer>div{font-family:var(--mono);font-size:9px;letter-spacing:.14em}.eyebrow{color:var(--subtle);display:flex;align-items:center;gap:12px}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 14px color-mix(in srgb,var(--green) 55%,transparent)}.hero h1,.work-heading h2,.experience-layout h2,.ideas-copy h2,.contact-main h2{font:600 clamp(62px,8vw,116px)/.95 var(--display);letter-spacing:-.075em;margin:30px 0 24px}.hero h1 em,.work-heading h2 em,.experience-layout h2 em,.ideas-copy h2 em,.contact-main h2 em{font-style:normal;color:var(--accent)}.hero-intro{max-width:460px;color:var(--muted);font-size:15px;line-height:1.8}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:36px}.button{display:inline-flex;align-items:center;gap:25px;padding:15px 19px;font-size:12px;font-weight:600}.button-primary{background:var(--accent);color:#fff}.button-primary span{font-size:17px}.text-link{font-size:12px;color:#e3e5de}.text-link:hover{color:var(--accent)}.hero-art{position:absolute;right:5%;top:12%;width:min(50vw,620px);height:72%;pointer-events:none;z-index:1}.hero-art:before{content:none}.hero-art>*{position:absolute}.hero-art .orbit{top:50%;left:50%}.hero-art .sun{top:25%;left:34%}.hero-art .art-label{top:23%;right:0}.hero-art .art-coordinate{bottom:18%;left:4%}.hero-art .cross-one{top:17%;left:34%}.hero-art .cross-two{right:16%;bottom:31%}.hero-motto{display:flex;flex-direction:column;gap:7px;margin-top:30px;padding-left:13px;border-left:2px solid var(--orange);min-height:40px}.motto-label{font:8px var(--mono);letter-spacing:.15em;color:var(--muted)}.motto-text{font:500 15px var(--display);color:var(--orange);letter-spacing:-.02em}.sun{position:absolute;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffbc84,#ec7949 56%,#7844be);top:25%;left:34%;box-shadow:0 0 140px #db6f4650}.orbit{border:1px solid #a1b49d42;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-25deg)}.orbit-one{width:570px;height:210px}.orbit-two{width:500px;height:410px;transform:translate(-50%,-50%) rotate(49deg)}.orbit-three{width:440px;height:600px;transform:translate(-50%,-50%) rotate(74deg)}.art-label{position:absolute;top:23%;right:0;line-height:1.8;color:#d5dbd2}.art-label span{color:var(--orange);font-size:17px;margin-left:5px}.art-coordinate{position:absolute;bottom:18%;left:4%;line-height:1.9;color:var(--muted);font-size:8px}.art-cross{position:absolute;font:22px var(--mono);color:var(--accent)}.cross-one{top:17%;left:34%;color:var(--blue)}.cross-two{right:16%;bottom:31%;color:var(--green)}.hero-bottom{position:absolute;bottom:34px;left:6.2%;right:6.2%;display:flex;align-items:center;gap:18px;color:rgba(255,255,255,.9);font-size:8px;text-shadow:0 1px 4px rgba(0,0,0,.7)}.hero-bottom span:last-child{margin-left:auto}.scroll-line{width:90px;height:1px;background:#657060}.hero-index{position:absolute;right:6.2%;top:105px;color:rgba(255,255,255,.92);font-size:8px;text-shadow:0 1px 4px rgba(0,0,0,.7)}.intro-band{padding:140px 12% 145px;border-top:1px solid #242c27}.section-kicker{display:flex;gap:18px;color:#858d84;font-size:9px}.section-kicker span:first-child{color:var(--accent)}.intro-content{display:grid;grid-template-columns:1.4fr .6fr;gap:9%;align-items:end;margin:55px 0 90px}.big-statement{font:500 clamp(34px,4.4vw,60px)/1.14 var(--display);letter-spacing:-.055em;max-width:740px;margin:0}.big-statement span{color:var(--accent)}.intro-aside,.work-note,.experience-copy>p,.ideas-copy>p,.contact-bottom p{color:var(--muted);font-size:13px;line-height:1.8;margin:0}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:6%;border-top:1px solid var(--line);padding-top:25px}.principles>div{display:grid;grid-template-columns:32px 1fr;column-gap:12px;align-content:start}.principles>div>span{grid-row:span 2;color:var(--accent);font:10px var(--mono)}.principles strong{font-size:13px;font-weight:600}.principles p{font-size:11px;line-height:1.7;color:var(--muted);margin:10px 0 0}.work-section{padding:130px 12% 110px;background:var(--surface)}.work-heading{display:flex;justify-content:space-between;align-items:end}.work-heading h2,.experience-layout h2,.ideas-copy h2,.contact-main h2{font-size:clamp(52px,6vw,78px);margin:27px 0 0}.work-note{max-width:245px;margin-bottom:5px}.filter-row{display:flex;align-items:center;gap:25px;margin:65px 0 25px;padding-bottom:17px;border-bottom:1px solid var(--line)}.filter-label{color:#727c73;font-size:8px}.filters{display:flex;gap:7px;flex-wrap:wrap}.filter{border:1px solid transparent;background:transparent;color:var(--muted);padding:8px 12px;border-radius:2px;font:11px var(--body);cursor:pointer;transition:.2s}.filter:hover,.filter.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,var(--surface))}.filter span{font:9px var(--mono);margin-left:6px}.repo-source{margin-left:auto;color:#788277;font-size:8px;white-space:nowrap}.repo-source .status-dot{margin-right:8px;width:6px;height:6px}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.project-card{min-height:275px;background:var(--card);border:1px solid var(--line);padding:27px;position:relative;display:flex;flex-direction:column;overflow:hidden;transition:transform .3s,border-color .3s,background .3s}.project-card:hover{transform:translateY(-4px);border-color:var(--accent);background:var(--surface)}.project-card:nth-child(3n+1){background:var(--card-alt)}.project-top{display:flex;justify-content:space-between;align-items:center}.project-number{font:9px var(--mono);color:#738073}.project-link{font-size:20px;color:#a5b09f}.project-card h3{font:600 24px var(--display);letter-spacing:-.04em;margin:auto 0 9px}.project-card p{font-size:12px;color:var(--muted);line-height:1.65;margin:0;max-width:420px}.tag-list{display:flex;gap:7px;flex-wrap:wrap;margin-top:21px}.tag-list span{font:8px var(--mono);letter-spacing:.08em;color:var(--subtle);border:1px solid var(--line);padding:6px 8px}.project-card.featured{background:linear-gradient(120deg,var(--card),var(--surface))}.project-card.featured:after{content:'✳';position:absolute;right:53px;top:58px;font-size:95px;color:color-mix(in srgb,var(--green) 9%,transparent)}.work-footer{padding:20px 0;display:flex;justify-content:space-between;color:var(--muted);font-size:8px}.work-footer a{color:var(--text);font:11px var(--body)}.experience-section{padding:130px 12% 145px}.experience-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:10%;margin:44px 0 95px}.experience-layout h2{margin:0}.experience-copy>p{max-width:400px}.experience-stats{display:flex;gap:65px;margin:34px 0}.experience-stats div{display:flex;flex-direction:column;gap:6px}.experience-stats strong{font:600 37px var(--display);letter-spacing:-.08em}.experience-stats strong span{color:var(--accent)}.experience-stats div>span{font-size:7px;color:#828a82}.timeline{border-top:1px solid var(--line)}.timeline-row{display:grid;grid-template-columns:110px 1fr 2fr auto;align-items:center;gap:22px;min-height:104px;border-bottom:1px solid var(--line)}.timeline-period,.timeline-tag{color:#79837a;font-size:8px}.timeline-line{height:1px;background:#424d42;position:relative}.timeline-line:after{content:'';width:5px;height:5px;border-radius:50%;background:var(--accent);position:absolute;right:0;top:-2px}.timeline-row strong{font:600 14px var(--display)}.timeline-row p{font-size:11px;color:var(--muted);margin:6px 0 0}.ideas-section{display:grid;grid-template-columns:1fr 1fr;min-height:500px;background:var(--surface);overflow:hidden}.ideas-art{position:relative;min-height:500px;overflow:hidden;background:radial-gradient(ellipse at 49% 54%,color-mix(in srgb,var(--accent) 12%,var(--surface)),var(--surface) 68%)}.ideas-ring{position:absolute;width:340px;height:340px;border:1px solid #a0b89c45;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 42px #78916d0b,0 0 0 85px #78916d08,0 0 0 130px #78916d06}.ideas-star{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--green);font-size:100px;text-shadow:0 0 60px color-mix(in srgb,var(--green) 40%,transparent)}.ideas-orbit-label{position:absolute;bottom:15%;left:19%;font:9px var(--mono);letter-spacing:.15em;color:#8b9789}.ideas-copy{padding:100px 14% 75px 9%;align-self:center}.ideas-copy h2{margin:28px 0}.ideas-copy>p{max-width:380px;margin-bottom:25px}.contact-section{padding:125px 12% 80px;background:linear-gradient(120deg,var(--purple),var(--blue));color:#fff}.contact-section .section-kicker{color:#ece8ff}.contact-section .section-kicker span:first-child{color:#fff}.contact-main{display:flex;align-items:end;justify-content:space-between}.contact-main h2{font-size:clamp(64px,8vw,105px);margin:50px 0 38px}.contact-main h2 em{color:#d5ff9d}.contact-arrow{display:flex;justify-content:center;align-items:center;width:82px;height:82px;border:1px solid rgba(255,255,255,.5);border-radius:50%;font-size:32px;margin-bottom:44px;transition:background .2s,transform .2s}.contact-arrow:hover{background:var(--orange);transform:rotate(45deg)}.contact-bottom{border-top:1px solid rgba(255,255,255,.38);display:flex;justify-content:space-between;align-items:center;padding-top:18px}.contact-bottom p{color:#f0ecff;font-size:12px}.contact-bottom>a{color:#fff;font-size:9px;letter-spacing:.05em}.contact-bottom>a span{margin-left:8px}footer{padding:24px 6.2%;display:flex;align-items:center;justify-content:space-between;color:#798078}footer .wordmark{color:#e4e7df}footer>span,footer>div{font-size:8px}footer>div{display:flex;gap:22px}footer>div a:hover{color:var(--accent)}.reveal{will-change:transform,opacity}.empty-state{grid-column:1/-1;padding:55px;border:1px solid var(--line);color:#a9b0a8}.empty-state strong{display:block;font:500 18px var(--display);color:var(--text);margin-bottom:8px}.empty-state p{font-size:12px;margin:0}@media(max-width:900px){.hero{padding-left:8%;min-height:740px}.hero-art{right:-15%;opacity:.76;transform:scale(.82);transform-origin:center right}.intro-band,.work-section,.experience-section{padding-left:8%;padding-right:8%}.intro-content{grid-template-columns:1fr;gap:25px;margin:44px 0 65px}.intro-aside{max-width:520px}.timeline-row{grid-template-columns:88px 1fr 2fr}.timeline-tag{display:none}.ideas-copy{padding-right:8%}.site-header{padding:0 5%;height:62px}}@media(max-width:620px){.site-header{height:58px}.wordmark{font-size:8px}.mark{font-size:21px}nav{display:none}.header-cta{font-size:10px;padding:9px 12px}.theme-toggle{min-width:72px;height:35px;padding:0 8px;font-size:9px}.hero{height:auto;min-height:750px;padding:145px 7% 110px;align-items:flex-start}.hero-copy{margin-top:55px}.hero h1{font-size:72px}.hero-intro{font-size:13px;max-width:360px}.hero-art{width:460px;height:500px;top:34%;right:-55%;opacity:.78;transform:scale(.75)}.hero-background{background-position:58% center}.hero-copy{max-width:94%}.hero-index{top:88px}.hero-bottom{left:7%;right:7%;font-size:7px}.intro-band,.work-section,.experience-section{padding:90px 7%}.big-statement{font-size:37px}.principles{grid-template-columns:1fr;gap:25px}.principles>div{max-width:390px}.work-heading{display:block}.work-note{margin-top:25px}.filter-row{align-items:flex-start;flex-wrap:wrap;gap:12px;margin:42px 0 20px}.filter-label{width:100%}.filters{order:2;width:100%}.repo-source{margin-left:auto}.project-grid{grid-template-columns:1fr}.project-card{min-height:250px;padding:22px}.experience-layout{grid-template-columns:1fr;gap:30px;margin:40px 0 60px}.timeline-row{grid-template-columns:75px 1fr;gap:15px;padding:20px 0}.timeline-line{grid-column:1;grid-row:2}.timeline-row>div{grid-column:2;grid-row:1/span 2}.timeline-row p{line-height:1.6}.ideas-section{grid-template-columns:1fr}.ideas-art{min-height:300px}.ideas-ring{width:230px;height:230px}.ideas-star{font-size:70px}.ideas-copy{padding:15px 7% 75px}.contact-section{padding:85px 7% 45px}.contact-main h2{font-size:69px;margin:45px 0 30px}.contact-arrow{width:60px;height:60px;margin-bottom:31px}.contact-bottom{display:block}.contact-bottom>a{display:inline-block;margin-top:18px}.contact-bottom p{max-width:290px}footer{padding:22px 7%;flex-wrap:wrap;gap:20px}footer>span{order:3;width:100%}footer>div{gap:12px;font-size:7px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

[data-theme="dark"] .button-primary{color:#10170c}[data-theme="dark"] .contact-section{background:linear-gradient(120deg,var(--purple),var(--blue));color:#fff}[data-theme="dark"] .contact-section .section-kicker{color:#ece8ff}[data-theme="dark"] .contact-section .section-kicker span:first-child{color:#fff}[data-theme="dark"] .contact-main h2 em{color:#d5ff9d}[data-theme="dark"] .contact-bottom{border-color:rgba(255,255,255,.38)}[data-theme="dark"] .contact-bottom p{color:#f0ecff}[data-theme="dark"] .contact-bottom>a{color:#fff}[data-theme="dark"] .contact-arrow{border-color:rgba(255,255,255,.5)}[data-theme="dark"] .ideas-ring{border-color:#a0b89c45}[data-theme="dark"] .ideas-orbit-label{color:#8b9789}[data-theme="dark"] .timeline-line{background:#424d42}[data-theme="dark"] .timeline-row strong{color:var(--text)}[data-theme="dark"] .project-card.featured:after{color:color-mix(in srgb,var(--green) 9%,transparent)}
.featured-sites{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:32px}.featured-sites>a{min-height:132px;padding:19px 20px;border:1px solid var(--line);background:var(--card);display:flex;flex-direction:column;transition:transform .25s,border-color .25s}.featured-sites>a:hover{transform:translateY(-3px);border-color:var(--accent)}.featured-sites>a>span{font:8px var(--mono);letter-spacing:.13em;color:var(--muted)}.featured-sites strong{font:600 19px var(--display);letter-spacing:-.04em;margin:auto 0 7px}.featured-sites small{font:9px var(--mono);color:var(--muted)}.featured-sites b{color:var(--orange);font-weight:400;margin-left:4px}@media(max-width:620px){.featured-sites{grid-template-columns:1fr}.featured-sites>a{min-height:115px}}

[data-theme="dark"] .hero-art:before{opacity:.66;mix-blend-mode:screen}[data-theme="dark"] .motto-text{color:var(--orange)}

/* Transparent, animated globe supplied for the hero artwork. */
.hero-art .globe{top:25%;left:34%;width:246px;height:246px;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none;isolation:auto}
.globe-image{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 24px rgba(9,24,46,.28))}

.hero-art .orbit{border-color:rgba(231,229,255,.35)}.hero-art .art-label,.hero-art .art-coordinate{color:rgba(255,255,255,.9)}[data-theme="dark"] .hero{background-image:linear-gradient(90deg,rgba(7,10,24,.82) 0%,rgba(13,12,34,.68) 40%,rgba(8,13,28,.3) 100%),linear-gradient(0deg,rgba(6,9,20,.42),transparent 55%)}

@media(prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important}}

[data-theme="dark"] .site-header{background:rgba(12,17,16,.9);border-color:rgba(255,255,255,.12)}[data-theme="dark"] .site-header nav a,[data-theme="dark"] .site-header .header-cta{color:#f1f0e9}[data-theme="dark"] .site-header .theme-toggle{color:#f1f0e9}

.wordmark .brand-logo{flex:0 0 auto}.site-header .brand-logo{width:34px;height:34px}

/* Section photography sits beneath existing content and can be cycled for review. */
.hero,.intro-band,.work-section,.experience-section,.ideas-section,.contact-section{position:relative;isolation:isolate}
.section-photo{position:absolute;inset:0;z-index:0;pointer-events:none;background-position:center;background-size:cover;background-repeat:no-repeat;opacity:1}
.intro-band,.work-section,.experience-section,.ideas-section,.contact-section{isolation:isolate}
.intro-band>:not(.section-photo),.work-section>:not(.section-photo),.experience-section>:not(.section-photo),.ideas-section>:not(.section-photo),.contact-section>:not(.section-photo){position:relative;z-index:1}
.hero>.section-photo{inset:-5% 0;z-index:0;opacity:calc(var(--scroll-photo-opacity,1)*var(--hero-image-ready,0));transition:opacity .7s ease;--section-image-overlay:linear-gradient(90deg,rgba(12,16,32,.72) 0%,rgba(17,18,39,.53) 40%,rgba(15,17,34,.24) 100%),linear-gradient(0deg,rgba(10,14,26,.35),transparent 55%);--section-photo-url:url("../assets/hero.jpg?v=1.0.15");background-size:cover,cover,contain;background-position:center,center,center 50%;will-change:transform;transform:translate3d(0,0,0)}
.hero{background-image:linear-gradient(90deg,rgba(12,16,32,.84) 0%,rgba(17,18,39,.69) 40%,rgba(15,17,34,.34) 100%),linear-gradient(0deg,rgba(10,14,26,.42),transparent 55%)}
.intro-band>.section-photo{opacity:1;--section-photo-url:url("../assets/about.jpg");--section-image-position:right center;--section-edge-fade:linear-gradient(90deg,var(--bg) 0%,transparent 62%)}
.work-section>.section-photo{opacity:1;--section-photo-url:url("../assets/work.jpg");--section-image-position:left center;--section-edge-fade:linear-gradient(270deg,var(--surface) 0%,transparent 62%)}
.experience-section>.section-photo{opacity:1;--section-photo-url:url("../assets/experience.jpg");--section-image-position:right center;--section-edge-fade:linear-gradient(90deg,var(--bg) 0%,transparent 62%)}
.ideas-section>.section-photo{opacity:1;--section-photo-url:url("../assets/ideas-2.jpg");--section-image-position:left center;--section-edge-fade:linear-gradient(270deg,var(--surface) 0%,transparent 62%)}
.contact-section>.section-photo{z-index:0;opacity:1;--section-photo-url:url("../assets/david.jpg");--section-image-position:right center;--section-edge-fade:linear-gradient(90deg,color-mix(in srgb,var(--purple) 75%,transparent) 0%,transparent 62%);background-size:100% 100%,contain;background-position:center,right center}
.section-photo{background-image:var(--section-edge-fade,linear-gradient(90deg,transparent,transparent)),var(--section-photo-url,none);background-position:center,var(--section-image-position,center);background-size:100% 100%,auto 100%;background-repeat:no-repeat;will-change:transform,opacity;opacity:var(--scroll-photo-opacity,1)}
/* Keep the hero image as one continuous, full-bleed photo beneath its readability overlays. */
.hero>.section-photo{--section-edge-fade:linear-gradient(90deg,rgba(12,16,32,.72) 0%,rgba(17,18,39,.53) 40%,rgba(15,17,34,.24) 100%),linear-gradient(0deg,rgba(10,14,26,.35),transparent 55%);background-size:100% 100%,cover;background-position:center,center 50%}
.section-image-controls{position:absolute;z-index:5;right:12%;top:24px;display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--line) 75%,transparent);border-radius:4px;background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--text);font:8px var(--mono);letter-spacing:.08em}
.image-name{padding-left:8px;border-left:1px solid var(--line);color:var(--muted);font:8px var(--mono);letter-spacing:0;text-transform:none;white-space:nowrap}
.section-image-controls button{width:25px;height:25px;padding:0;border:1px solid var(--line);border-radius:3px;background:var(--panel);color:var(--text);font:14px var(--body);cursor:pointer}
.section-image-controls button:hover{border-color:var(--accent);color:var(--accent)}
.section-image-controls button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hero .section-image-controls{top:82px;right:6.2%;z-index:4}
.contact-section .section-image-controls{top:24px}
@media(max-width:620px){.section-image-controls{right:7%;top:16px}.hero .section-image-controls{right:7%;top:73px}.contact-section .section-image-controls{right:7%;top:16px}}

/* ScrollStory-style page and section progress indicators. */
.scroll-progress{position:fixed;z-index:120;left:0;right:0;top:0;height:4px;background:color-mix(in srgb,var(--text) 12%,transparent);overflow:hidden}
.scroll-progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--purple),var(--blue),var(--orange),var(--green));box-shadow:0 0 14px color-mix(in srgb,var(--blue) 60%,transparent);will-change:width}
.section-progress{position:fixed;z-index:110;right:19px;top:50%;width:5px;height:clamp(110px,18vh,170px);transform:translateY(-50%);border-radius:99px;background:color-mix(in srgb,var(--text) 14%,transparent);overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 10%,transparent)}
.section-progress span{position:absolute;inset:0;transform:scaleY(0);transform-origin:top;background:linear-gradient(180deg,var(--blue),var(--purple) 48%,var(--green));border-radius:inherit;box-shadow:0 0 12px color-mix(in srgb,var(--purple) 70%,transparent);will-change:transform}
.section-ticks{position:fixed;z-index:109;right:7px;top:0;width:12px;height:100vh;pointer-events:none}
.section-ticks i{position:absolute;right:0;width:8px;height:2px;border-radius:99px;background:var(--muted);opacity:.55;transform:translateY(-1px);transition:width .2s,background .2s,opacity .2s}
.section-ticks i b{position:absolute;right:calc(100% + 7px);top:50%;transform:translateY(-50%);font:8px var(--mono);color:var(--muted);opacity:.8;white-space:nowrap}
.section-ticks i.completed{width:10px;background:var(--green);opacity:.8}.section-ticks i.completed b{color:var(--green)}
.section-ticks i.active{width:16px;height:3px;background:linear-gradient(90deg,var(--purple),var(--blue),var(--orange));opacity:1;box-shadow:0 0 10px color-mix(in srgb,var(--blue) 60%,transparent)}.section-ticks i.active b{color:var(--accent);opacity:1}
.site-header nav a.active{color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,transparent)}
@media(max-width:620px){.section-progress{right:9px;width:4px;height:112px}.section-ticks{right:3px;width:8px}.section-ticks i b{font-size:7px;right:calc(100% + 4px)}.scroll-progress{height:3px}}

/* Keep the section rail unmistakable, with chapter ticks drawn over it. */
.section-progress{right:18px;width:7px;background:color-mix(in srgb,var(--text) 22%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--text) 18%,transparent),0 0 12px rgba(40,50,70,.12)}
.section-progress span{background:linear-gradient(180deg,var(--blue),var(--purple) 48%,var(--orange),var(--green));box-shadow:0 0 16px color-mix(in srgb,var(--purple) 72%,transparent)}
.section-ticks{right:15px;width:12px}.section-ticks i{right:0;width:9px;height:2px;background:color-mix(in srgb,var(--text) 62%,transparent);opacity:.82}.section-ticks i.completed{width:11px;background:var(--green);opacity:1}.section-ticks i.active{width:15px;height:3px;z-index:2}
.scroll-status{position:fixed;z-index:115;left:0;right:0;bottom:0;min-height:42px;padding:7px 18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;background:color-mix(in srgb,var(--bg) 94%,transparent);border-top:1px solid var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 -5px 24px rgba(10,18,30,.08);opacity:0;transform:translateY(110%);pointer-events:none;transition:opacity .24s ease,transform .24s ease}
.scroll-status.visible{opacity:1;transform:translateY(0);pointer-events:auto}
.status-version,.status-badges span{display:inline-flex;align-items:center;justify-content:center;min-height:23px;padding:0 8px;border:1px solid color-mix(in srgb,var(--accent) 38%,var(--line));border-radius:3px;background:color-mix(in srgb,var(--accent) 8%,var(--bg));color:var(--accent);font:8px var(--mono);letter-spacing:.06em;white-space:nowrap}
.status-copy{display:flex;justify-content:center;align-items:center;gap:16px;color:var(--muted);font:9px var(--body);text-align:center}
.status-badges{display:flex;align-items:center;gap:5px}.status-badges span{color:var(--subtle);border-color:var(--line);background:var(--surface);font-size:7px}
[data-theme="dark"] .scroll-status{background:rgba(12,17,16,.94);border-color:rgba(255,255,255,.14)}
@media(max-width:720px){.section-progress{right:8px;width:5px}.section-ticks{right:5px;width:9px}.section-ticks i{width:7px}.section-ticks i.active{width:12px}.section-ticks i b{font-size:6px;right:calc(100% + 4px)}.scroll-status{grid-template-columns:auto 1fr;gap:6px 10px;padding:6px 10px;min-height:58px}.status-copy{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:5px;font-size:8px}.status-version{grid-column:1;grid-row:1}.status-badges{grid-column:2;grid-row:1;justify-content:end}.status-badges span{min-height:20px;padding:0 6px;font-size:6px}}
@media(prefers-reduced-motion:reduce){.scroll-status{transition:none}}

/* Fly the status strip into view as soon as scrolling starts; keep it above the page UI. */
.scroll-status{position:fixed!important;z-index:10000!important;bottom:0!important;transform:translate3d(0,calc(100% + 12px),0);transition:transform .48s cubic-bezier(.16,1,.3,1),opacity .22s ease;visibility:hidden}
.scroll-status.visible{visibility:visible;transform:translate3d(0,0,0)}
@media(prefers-reduced-motion:reduce){.scroll-status{transition:none;transform:translate3d(0,0,0)}.scroll-status:not(.visible){visibility:hidden}}

/* The footer itself is the persistent, fixed status strip. */
footer.scroll-status{position:fixed!important;z-index:10000!important;left:0!important;right:0!important;bottom:0!important;width:100%;min-height:46px;padding:7px 18px!important;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;align-items:center!important;gap:18px!important;margin:0!important;border-radius:0!important;opacity:0;visibility:hidden;transform:translate3d(0,calc(100% + 12px),0);pointer-events:none;transition:transform .48s cubic-bezier(.16,1,.3,1),opacity .24s ease,visibility .24s ease;background:color-mix(in srgb,var(--bg) 96%,transparent);border-top:1px solid var(--line);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 -8px 28px rgba(10,18,30,.12);color:var(--text)}
footer.scroll-status.visible{opacity:1;visibility:visible;transform:translate3d(0,0,0);pointer-events:auto}
footer.scroll-status .status-version{grid-column:1;grid-row:1;justify-self:start}
footer.scroll-status .status-copy{grid-column:2;grid-row:1;justify-content:center}
footer.scroll-status .status-badges{grid-column:3;grid-row:1;justify-self:end}
[data-theme="dark"] footer.scroll-status{background:rgba(12,17,16,.96);border-color:rgba(255,255,255,.14)}
@media(max-width:720px){footer.scroll-status{grid-template-columns:auto minmax(0,1fr)!important;gap:5px 10px!important;padding:6px 10px!important;min-height:58px}.status-copy{grid-column:1/-1!important;grid-row:2!important;justify-content:space-between!important;gap:5px;font-size:8px}.status-version{grid-column:1!important;grid-row:1!important}.status-badges{grid-column:2!important;grid-row:1!important;justify-self:end!important}}
@media(prefers-reduced-motion:reduce){footer.scroll-status{transition:none;transform:translate3d(0,0,0)}footer.scroll-status:not(.visible){visibility:hidden}}