/* Portfolio gallery. Glyph Portal © 2026 Christian Katzmann, MIT; adapted to E.Wright. */
#work-gallery-root{--gallery-field:#eee6da;position:relative}
:root[data-theme=dark] #work-gallery-root{--gallery-field:#1c2338}
.work-gallery-portal{font-family:var(--body);border-top:1px solid var(--line)}
.work-gallery-portal [data-gp-pin]{background:var(--canvas)}
.gallery-portal-heading{position:absolute;inset:120px max(32px,calc((100% - 1312px)/2)) auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.gallery-portal-category{font-size:13px;color:var(--muted)}
.gallery-portal-support{position:absolute;inset:calc(var(--gp-word-bottom,50%) + 32px) 24px auto;text-align:center;font:400 clamp(16px,1.5vw,21px)/1.5 var(--body);color:var(--secondary)}
.work-gallery-portal [data-gp-caption]{inset:calc(var(--gp-word-bottom,50%) + 86px) 24px auto;justify-content:center;font-family:var(--body);opacity:var(--gp-action,1)}
.work-gallery-portal [data-gp-hint]{position:absolute;top:92px;font-size:12px;letter-spacing:.03em}
.work-gallery-portal [data-gp-enter]{min-height:50px;padding:12px 24px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:14px;gap:26px;box-shadow:var(--shadow)}
.work-gallery-portal [data-gp-enter]:hover{background:var(--text);color:var(--canvas)}
.work-gallery-portal [data-gp-enter]:focus-visible{padding:12px 24px;margin:0;outline-color:var(--accent);background:var(--accent);color:var(--on-accent)}
.work-gallery-portal [data-gp-touch-picker]{top:auto;bottom:20px;font-family:var(--body)}
.work-gallery-portal [data-gp-select]{border-color:var(--line);border-radius:8px;font-family:inherit}
.work-gallery-portal [data-gp-content]{padding:100px max(32px,calc((100% - 1312px)/2)) 120px;min-height:0;outline:none}
.work-gallery-portal[data-gp-motion=on] [data-gp-content]{background:var(--gallery-field)}
.gallery-portal-scene{position:absolute;inset:0;background:var(--gallery-field);overflow:hidden}
.gallery-scene-image{position:absolute;inset:-8%;background:linear-gradient(100deg,#45231435,#15182370),url('/forward/media/device-forward.jpg') center/cover;transform:scale(var(--gp-field-scale,1));opacity:var(--gp-scene-opacity,1)}
:root[data-theme=dark] .gallery-scene-image{background:linear-gradient(#f2dbc4d9,#f2dbc4d9),url('/forward/media/device-forward.jpg') center/cover}
.work-gallery-portal [data-gp-letter]:focus-visible{outline-color:var(--accent)}
.gallery-scene-grain{position:absolute;inset:0;background:linear-gradient(125deg,#cd957d28,transparent 50%,#717b9826);opacity:var(--gp-scene-opacity,1)}
.gallery-inner{width:100%;max-width:1312px;margin:auto}
.gallery-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:60px}
.gallery-heading h2{margin:14px 0 0;font-size:clamp(38px,4.4vw,64px);font-weight:500;line-height:1.12;color:var(--text)}
.gallery-heading>p{max-width:350px;font-size:15px;line-height:1.7;color:var(--secondary)}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px 36px;align-items:start}
.gallery-card{min-width:0}
.gallery-art{position:relative;aspect-ratio:1.3;overflow:hidden;border-radius:20px;background:var(--surface);isolation:isolate}
.gallery-art-index{position:absolute;top:20px;left:20px;display:grid;place-items:center;min-width:34px;min-height:34px;border-radius:50%;font:500 11px/1 var(--body);background:#fffcf7e6;color:#251e1b;z-index:2}
.gallery-art-caption{position:absolute;bottom:16px;left:20px;right:20px;justify-self:start;width:fit-content;max-width:calc(100% - 40px);padding:5px 8px;background:#171b25c9;color:#fff9ef;border-radius:4px;font:400 10px/1.5 var(--body);z-index:2}
.gallery-card-copy{padding:23px 4px 0}
.gallery-card-kicker{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:11px;line-height:1.5;color:var(--muted)}
.gallery-card-kicker>span:first-child{text-transform:uppercase;letter-spacing:.09em}
.gallery-card-kicker>span:last-child{border-bottom:1px solid var(--line);padding-bottom:3px}
.gallery-card h3{font-size:32px;line-height:1.2;margin:15px 0 12px;color:var(--text)}
.gallery-card-copy>p{font-size:16px;line-height:1.7;max-width:48ch;color:var(--secondary)}
.gallery-project-notes{margin-top:17px;font-size:14px}
.gallery-project-notes summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:16px;width:fit-content;cursor:pointer;color:var(--accent);list-style:none}
.gallery-project-notes summary::-webkit-details-marker{display:none}
.gallery-project-notes summary:focus-visible{outline:3px solid var(--accent);outline-offset:5px;border-radius:5px}
.gallery-project-notes summary svg{transition:transform .2s}
.gallery-project-notes[open] summary svg{transform:rotate(90deg)}
.gallery-project-notes>div{padding:13px 0 0;border-top:1px solid var(--line);max-width:52ch}
.gallery-project-notes p{font-size:14px;line-height:1.7;color:var(--secondary)}
.gallery-project-notes .gallery-disciplines{margin-top:12px;font-size:12px;color:var(--muted)}
.gallery-forward-art{width:100%;height:100%;object-fit:cover;object-position:67% center}
.gallery-vip-art{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 40%,#4c4034,transparent 65%),#121316;overflow:hidden}
.gallery-art-wordmark{position:absolute;left:13%;top:16%;font:500 clamp(24px,2.6vw,38px)/1.1 Georgia,serif;letter-spacing:-.04em;color:#efd3a2;z-index:1}
.gallery-art-wordmark span{display:block;color:#d6c9b4;font:400 11px/1.5 var(--body);letter-spacing:0;margin-top:10px}
.gallery-phone-pair{position:absolute;inset:0;display:flex;gap:1%;padding:6% 4% 0 34%;transform:rotate(-9deg)}
.gallery-phone-pair img{align-self:flex-start;width:57%;max-width:none;height:auto;border-radius:28px;box-shadow:0 16px 42px #0008}
.gallery-phone-pair img:first-child{margin-top:17%}
.gallery-phone-pair img:last-child{margin-top:-12%}
.gallery-barber-art{position:absolute;inset:0;padding:15% 9% 9%;background:#df6c3f;color:#261f1a;overflow:hidden}
.gallery-art-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;font:500 9px/1.5 var(--body);letter-spacing:.05em}
.gallery-art-toolbar b{display:flex;align-items:center;gap:7px;font-weight:600}
.gallery-art-toolbar b span{opacity:.5;margin-inline:3px}
.gallery-barber-title{font:600 clamp(25px,3.4vw,49px)/1.08 var(--heading);letter-spacing:-.05em;margin:8% 0 7%}
.gallery-barber-title em{color:#fff7e9}
.gallery-queue-paths{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gallery-queue-paths>div{padding:14px 15px;background:#fff7e9e8;border-radius:10px;display:flex;flex-direction:column;gap:4px}
.gallery-queue-paths svg{height:20px;width:20px;margin-bottom:7px}
.gallery-queue-paths span{font-size:9px;color:#66584c}
.gallery-queue-paths strong{font-size:12px;font-weight:600}
.gallery-queue-join{display:flex;align-items:center;gap:10px;margin-top:18px;font-size:10px}
.gallery-queue-join span{display:flex;align-items:center;gap:8px}
.gallery-queue-join i{flex:1;height:1px;background:#261f1a55}
.gallery-studio-art{position:absolute;inset:0;padding:15% 6% 6%;background:#dcd7e7;color:#2e2639;overflow:hidden}
.gallery-studio-art>.gallery-art-toolbar{padding:0 2% 6%}
.gallery-studio-workspace{display:flex;gap:16px;padding:18px 15px;border-radius:13px;background:#faf7fc;box-shadow:0 20px 32px #392e5121}
.gallery-studio-steps{display:flex;flex-direction:column;gap:15px;font-size:8px;white-space:nowrap;padding-top:7px}
.gallery-studio-steps span{color:#73697e}
.gallery-studio-steps strong{color:#643d8c;background:#ece3f4;border-radius:4px;margin:-5px;padding:5px;font-weight:600}
.gallery-theme-options{display:grid;grid-template-columns:1fr 1fr;gap:9px;flex:1;min-width:0}
.gallery-theme-sample{padding:12px 9px;border-radius:6px;overflow:hidden;background:#f0eadc;color:#353026;min-width:0}
.gallery-theme-sample>span{font:500 7px/1.4 var(--body);display:block;min-height:20px}
.gallery-theme-sample b{display:block;font:500 clamp(14px,1.8vw,25px)/1.1 Georgia,serif;margin:12px 0}
.gallery-theme-sample i{display:block;width:85%;aspect-ratio:1.7;border-radius:60px 60px 4px 4px;background:linear-gradient(120deg,#d6c3a4,#a9b89f);margin:16px auto}
.gallery-theme-sample>div{display:flex;gap:4px}
.gallery-theme-sample small{width:33%;height:28px;border-radius:3px;background:#bfb09966}
.gallery-theme-sample.dark{background:#292331;color:#f2decb}
.gallery-theme-sample.dark em{color:#d8a67e}
.gallery-theme-sample.dark i{background:linear-gradient(120deg,#c1916f,#695677)}
.gallery-theme-sample.dark small{background:#795f795c}
.gallery-studio-footer{display:flex;justify-content:space-between;gap:14px;margin-top:20px;font-size:8px;color:#635a71}
@media(min-width:1440px){.gallery-art-wordmark{font-size:38px}.gallery-barber-title{font-size:49px}.gallery-theme-sample b{font-size:25px}}
@media(max-width:900px){.gallery-grid{gap:52px 24px}.gallery-heading{gap:28px}.gallery-heading>p{max-width:260px}.gallery-art{aspect-ratio:1.1}.gallery-studio-steps{display:none}.gallery-studio-workspace{padding:15px 12px}.gallery-art-toolbar{font-size:8px}.gallery-studio-footer{font-size:8px}.gallery-studio-footer span:last-child{display:none}.gallery-card-kicker{align-items:start;flex-direction:column}.gallery-art-wordmark{font-size:26px}.gallery-barber-title{font-size:35px}}
@media(max-width:640px){
  .gallery-portal-heading{inset:100px 22px auto;align-items:start}.gallery-portal-category{max-width:16ch;text-align:right;font-size:11px}.gallery-portal-heading .eyebrow{font-size:10px}
  .gallery-portal-support{font-size:16px;top:calc(var(--gp-word-bottom,50%) + 24px)}
  .work-gallery-portal [data-gp-caption]{top:calc(var(--gp-word-bottom,50%) + 68px)}
  .work-gallery-portal [data-gp-hint]{top:82px}
  .work-gallery-portal [data-gp-content]{padding:64px 22px 80px}
  .gallery-heading{display:block;margin-bottom:36px}.gallery-heading h2{font-size:42px}.gallery-heading>p{margin-top:22px;max-width:32ch;font-size:14px}
  .gallery-grid{grid-template-columns:1fr;gap:46px}.gallery-art{aspect-ratio:1.12;border-radius:15px}
  .gallery-card-copy{padding:20px 0 0}.gallery-card-kicker{font-size:10px;gap:8px}.gallery-card h3{font-size:29px;margin-top:13px}.gallery-card-copy>p{font-size:15px}
  .gallery-art-wordmark{font-size:29px}.gallery-barber-title{font-size:40px}.gallery-art-toolbar{font-size:9px}.gallery-theme-sample b{font-size:19px;overflow-wrap:normal}.gallery-theme-sample>span{font-size:8px}.gallery-studio-workspace{padding:16px}.gallery-studio-steps{display:none}.gallery-studio-footer{font-size:9px}
}
@media(max-width:360px){.gallery-studio-steps{display:none}.gallery-barber-title{font-size:34px}.gallery-queue-paths>div{padding:11px}.gallery-art-toolbar>span{display:none}}
@media(max-height:580px){.gallery-portal-heading{top:95px}.gallery-portal-support{top:calc(var(--gp-word-bottom,50%) + 16px)}.work-gallery-portal [data-gp-caption]{top:calc(var(--gp-word-bottom,50%) + 55px)}.work-gallery-portal [data-gp-hint]{display:none}.work-gallery-portal [data-gp-touch-picker]{bottom:8px}}
@media(prefers-reduced-motion:reduce){.gallery-portal-heading{top:30px}.gallery-project-notes summary svg{transition:none}.gallery-scene-image{transform:none}html{scroll-behavior:auto}}
@media(forced-colors:active){.work-gallery-portal [data-gp-field]{display:none}.work-gallery-portal [data-gp-fallback]{visibility:visible;color:CanvasText}.work-gallery-portal [data-gp-content]{background:Canvas!important;color:CanvasText!important;opacity:1!important}.work-gallery-portal [data-gp-enter]{border:1px solid ButtonText}.gallery-art{outline:1px solid CanvasText}}

.gallery-project-link{display:inline-block;margin-top:1.25rem;text-underline-offset:.25em;font-weight:600}