/* Aviv Ebbo — Quiet Spectacle, an artwork-first concept preview. */
:root{--paper:#f8f7f2;--ink:#1e211e;--muted:#6d7169;--line:#d9dad3;--accent:#dd6448;--sage:#e8eee5;--ease:cubic-bezier(.2,.8,.2,1);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}
body:has(dialog[open]){overflow:hidden}
button,input{font:inherit}
button{cursor:pointer;color:inherit}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
img{display:block;max-width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:200;top:-70px;left:20px;background:var(--ink);color:#fff;padding:12px}
.skip-link:focus{top:10px}
.site-shell{overflow:visible}
.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:35px;padding:0 clamp(24px,5vw,86px);border-bottom:1px solid var(--line);background:rgba(248,247,242,.97);position:sticky;top:0;z-index:80;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.wordmark{font-weight:700;font-size:27px;letter-spacing:-1.8px;white-space:nowrap;line-height:1}
.brand-dot{color:var(--accent)}
.site-nav{display:flex;align-items:center;gap:clamp(18px,2.5vw,39px);font-size:13px;font-weight:600}
.site-nav>a:not(.contact-nav),.nav-archive{background:none;border:0;padding:11px 0;color:#363b36;transition:color .2s}
.site-nav>a:not(.contact-nav):hover,.nav-archive:hover{color:var(--accent)}
.contact-nav{border-bottom:1px solid var(--ink);padding:11px 0;white-space:nowrap}
.contact-nav span{display:inline-block;margin-left:9px;transition:transform .2s}
.contact-nav:hover span{transform:translate(2px,-2px)}
.eyebrow,.section-index,.breather-label{font-size:11px;letter-spacing:.15em;font-weight:700;line-height:1.6}
.eyebrow{display:flex;gap:12px;align-items:center}
.tiny-line{display:inline-block;width:19px;height:1px;background:var(--accent)}
h1,h2,h3,p{margin-top:0}
h1,h2,.breather p,.footer-main p{letter-spacing:-.066em;line-height:.99;font-weight:500}
h1 em,h2 em,.breather p em,.footer-main p em{font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:-.045em}
.hero{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);min-height:min(760px,calc(100svh - 88px));max-width:1760px;margin:0 auto}
.hero-message{display:flex;flex-direction:column;justify-content:center;padding:65px 5% 70px clamp(24px,6vw,106px)}
.hero-message .eyebrow{margin-bottom:37px}
.hero-message h1{font-size:clamp(68px,7.5vw,135px);margin:0 0 32px;white-space:nowrap}
.hero-message h1 em{color:var(--accent)}
.hero-lead{font-size:clamp(15px,1.22vw,19px);line-height:1.7;max-width:385px;color:#50564e;margin-bottom:29px}
.hero-cta-group{display:flex;align-items:center;gap:28px}
.primary-link{min-height:55px;border:0;display:inline-flex;align-items:center;justify-content:center;gap:45px;background:var(--ink);color:#f9faf4;padding:0 22px;font-size:13px;font-weight:600;transition:background .25s,color .25s,transform .25s;white-space:nowrap}
.primary-link:hover{background:var(--accent);transform:translateY(-2px)}
.primary-link span{font-size:22px;font-weight:400}
.hero-sidenote{font-size:12px;line-height:1.55;color:#868981}
.hero-understated{font-size:11px;letter-spacing:.09em;color:#858981;margin-top:auto;padding-top:38px;margin-bottom:0}
.hero-exhibit{display:flex;flex-direction:column;min-width:0;padding:38px clamp(24px,4.3vw,76px) 40px 20px;justify-content:center}
.artwork-stage{height:clamp(390px,41vw,620px);min-height:0;display:flex;align-items:center;justify-content:center;background:#dcebd1;position:relative;isolation:isolate;overflow:hidden;transition:background .55s var(--ease);touch-action:pan-y}
.artwork-stage:after{content:"";position:absolute;inset:18px;border:1px solid rgb(255 255 255 / .32);pointer-events:none}
.artwork-stage>img{width:calc(100% - 72px);height:calc(100% - 72px);object-fit:contain;object-position:center;box-shadow:0 14px 35px rgb(20 26 17 / .08);transition:opacity .24s,transform .65s var(--ease);user-select:none}
.artwork-stage>img.is-transitioning{opacity:.1;transform:scale(.975)}
.hero-stage-number{position:absolute;left:21px;top:23px;font-size:10px;letter-spacing:.12em;font-weight:700;background:rgba(250,250,246,.85);padding:8px 10px}
.artwork-lens{display:none;position:absolute;pointer-events:none;width:166px;height:166px;border-radius:100%;background-repeat:no-repeat;background-color:#fff;border:8px solid rgba(255,255,255,.96);box-shadow:0 14px 40px rgb(0 0 0 / .20);transform:translate(-50%,-50%);z-index:4}
.artwork-stage.lens-on{cursor:crosshair}
.artwork-stage.lens-on .artwork-lens.is-visible{display:block}
.exhibit-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:18px}
.exhibit-label{display:flex;flex-direction:column;gap:5px;min-width:0}
.exhibit-label span{font-size:10px;letter-spacing:.13em;color:var(--muted);font-weight:600}
.exhibit-label strong{font-size:18px;font-weight:500;letter-spacing:-.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exhibit-tools{display:flex;align-items:center;gap:6px}
.exhibit-tools button{background:none;border:1px solid transparent;height:40px;transition:background .2s,border-color .2s}
.exhibit-zoom{font-size:12px;display:flex;align-items:center;gap:7px;padding:0 9px;white-space:nowrap}
.exhibit-zoom span{font-size:22px;line-height:1}
.exhibit-zoom[aria-pressed="true"]{color:var(--accent)}
.exhibit-zoom:hover{background:#edede7}
.round-icon{min-width:40px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:20px}
.round-icon:hover{border-color:var(--ink)}
.tool-divider{height:19px;width:1px;background:var(--line);margin:0 5px}
.section-wrap{max-width:1600px;margin:0 auto;padding-left:clamp(24px,6vw,106px);padding-right:clamp(24px,6vw,106px)}
.selected{padding-top:145px;padding-bottom:126px}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:58px}
.section-index{margin-bottom:26px;color:var(--accent)}
.section-heading h2,.archive-teaser h2,.about h2{font-size:clamp(56px,6vw,108px);margin:0}
.section-heading h2 em,.archive-teaser h2 em,.about h2 em{color:var(--accent)}
.section-description{max-width:300px;font-size:16px;line-height:1.72;color:var(--muted);margin:0 0 9px}
.projects-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(28px,4vw,72px);row-gap:80px}
.project-card{min-width:0}
.project-open{border:0;background:none;text-align:left;padding:0;display:block;width:100%;color:inherit}
.project-frame{width:100%;aspect-ratio:1.22;display:flex;align-items:center;justify-content:center;background:var(--wash,#f1e8df);overflow:hidden;position:relative}
.project-frame::after{content:"VIEW PROJECT ↗";position:absolute;right:15px;bottom:15px;color:#121612;background:var(--paper);padding:12px 15px;font-size:11px;letter-spacing:.06em;transform:translateY(12px);opacity:0;transition:opacity .3s,transform .3s}
.project-open:hover .project-frame::after,.project-open:focus-visible .project-frame::after{opacity:1;transform:translateY(0)}
.project-frame img{width:calc(100% - 62px);height:calc(100% - 62px);object-fit:contain;transition:transform .65s var(--ease)}
.project-open:hover .project-frame img{transform:scale(1.035)}
.project-card:nth-child(2n){transform:translateY(46px)}
.project-text{display:flex;justify-content:space-between;gap:15px;align-items:start;padding-top:18px}
.project-text h3{font-size:clamp(22px,2vw,30px);font-weight:500;letter-spacing:-.05em;margin:0 0 7px}
.project-text small{font-size:12px;color:var(--muted);line-height:1.6}
.project-number{font-size:12px;letter-spacing:.08em;padding-top:4px}
.work-end{margin-top:150px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:21px 0;border-top:1px solid var(--line)}
.work-end>span{font-size:11px;letter-spacing:.12em;color:var(--muted)}
.inline-arrow{background:none;border:0;border-bottom:1px solid var(--ink);padding:8px 0;font-weight:600;font-size:14px;text-align:left;display:inline-flex;align-items:center;gap:23px}
.inline-arrow:hover{color:var(--accent);border-color:var(--accent)}
.inline-arrow span{font-size:22px;font-weight:400}
.breather{min-height:410px;background:var(--sage);position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:85px 24px;overflow:hidden}
.breather-label{color:#60685d}
.breather p{font-size:clamp(44px,5.8vw,91px);margin:21px 0 0;max-width:1170px}
.breather p em{color:#778d73}
.archive-teaser{min-height:680px;display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center;padding-top:125px;padding-bottom:125px}
.archive-teaser h2{margin-bottom:25px}
.archive-teaser-copy>p:not(.section-index){max-width:360px;color:var(--muted);line-height:1.7;font-size:16px;margin-bottom:31px}
.archive-cta{gap:48px}
.archive-peek{height:450px;position:relative;display:flex;align-items:center;justify-content:center}
.peek-paper{position:absolute;width:49%;height:70%;background:white;box-shadow:0 12px 33px rgb(0 0 0 / .075);padding:13px;transition:transform .5s var(--ease)}
.peek-paper img{height:100%;width:100%;object-fit:contain;background:#f8f6f2}
.peek-one{transform:translate(-40%,-12%) rotate(-12deg);z-index:1}
.peek-two{transform:translate(9%,9%) rotate(8deg);z-index:2}
.peek-three{transform:translate(60%,-1%) rotate(17deg);z-index:3}
.archive-peek:hover .peek-one{transform:translate(-50%,-18%) rotate(-15deg)}
.archive-peek:hover .peek-two{transform:translate(5%,13%) rotate(5deg)}
.archive-peek:hover .peek-three{transform:translate(68%,-6%) rotate(19deg)}
.peek-count{position:absolute;bottom:9px;right:5%;z-index:4;font-size:46px;font-weight:500;letter-spacing:-.06em;display:flex;align-items:baseline;gap:10px}
.peek-count small{font-size:10px;letter-spacing:.09em;font-weight:600}
.about{padding-top:95px;padding-bottom:150px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,10vw,170px);align-items:center}
.about-art{max-width:540px;aspect-ratio:1;position:relative;background:#ece6de;padding:38px}
.about-art img{width:100%;height:100%;object-fit:contain}
.about-art span{position:absolute;bottom:16px;left:18px;color:#595a55;font-size:10px;letter-spacing:.12em;font-weight:600}
.about h2{margin-bottom:35px}
.about-copy>p:not(.section-index){font-size:16px;line-height:1.86;color:#5c6259;max-width:460px;margin-bottom:18px}
.about-copy .inline-arrow{margin-top:13px}
.site-footer{background:#1d241f;color:#f6f7f0;padding:36px clamp(24px,6vw,106px) 24px}
.footer-top,.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.12em;color:#a9b4a9;font-weight:600}
.footer-main{display:flex;justify-content:space-between;align-items:end;padding:80px 0 105px;gap:20px}
.footer-main p{font-size:clamp(76px,11vw,170px);margin:0}
.footer-main p em{color:#bfd6b6}
.footer-main>a{width:102px;height:102px;border-radius:100%;border:1px solid #a8bbab;display:flex;align-items:center;justify-content:center;font-size:52px;transition:background .3s,transform .3s}
.footer-main>a:hover{background:#354938;transform:rotate(45deg)}
.footer-bottom{padding-top:22px;border-top:1px solid #4b554c}
.footer-bottom a:hover{color:white}
dialog{margin:auto;border:0;padding:0;box-shadow:0 24px 100px #10141033;color:var(--ink)}
dialog::backdrop{background:rgba(21,27,21,.78);backdrop-filter:blur(5px)}
.dialog-top{position:sticky;top:0;z-index:4;background:var(--paper);padding:17px clamp(18px,3.6vw,60px);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:.13em;font-weight:600}
.close-dialog{padding:7px 3px 7px 10px;background:none;border:0;font-size:13px;letter-spacing:0}
.close-dialog span{font-size:25px;vertical-align:-2px;margin-left:12px}
.close-dialog:hover{color:var(--accent)}
.project-dialog,.archive-dialog{width:min(1200px,96vw);height:min(92dvh,1050px);max-width:96vw;max-height:92dvh;overflow-y:auto;background:var(--paper)}
.project-dialog-body{padding:clamp(24px,4.5vw,75px)}
.project-dialog-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:55px;align-items:end}
.project-dialog-head h2{font-size:clamp(54px,7vw,104px);margin:0 0 8px}
.project-dialog-head h2 em{color:var(--accent)}
.project-dialog-head .intro{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(27px,3vw,41px);line-height:1.15;margin:0 0 16px}
.project-dialog-head .description{font-size:15px;line-height:1.76;color:var(--muted);max-width:460px}
.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.project-photo{border:0;min-width:0;padding:13px;background:#edebe5;display:flex;align-items:center;justify-content:center;aspect-ratio:1.25}
.project-photo:first-child{grid-column:span 2;aspect-ratio:1.78}
.project-photo img{width:100%;height:100%;object-fit:contain;transition:transform .3s}
.project-photo:hover img{transform:scale(1.02)}
.project-source{margin-top:40px}
.archive-dialog-inner{padding:35px clamp(18px,4vw,62px) 55px}
.archive-dialog-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:35px}
.archive-dialog-head .section-index{margin:0 0 15px}
.archive-dialog-head h2{font-size:clamp(47px,5vw,80px);margin:0}
.archive-dialog-head h2 em{color:var(--accent)}
.archive-dialog-head>p{font-size:13px;line-height:1.7;color:var(--muted);text-align:right;margin:0}
.archive-dialog-head>p span{color:var(--ink);font-weight:700}
.archive-control-row{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);padding:18px 0 22px}
.archive-chip-row{display:flex;flex-wrap:wrap;gap:7px}
.archive-chip{background:none;border:1px solid var(--line);padding:9px 12px;font-size:11px}
.archive-chip:hover,.archive-chip[aria-pressed="true"]{background:var(--ink);color:white;border-color:var(--ink)}
.archive-search{border-bottom:1px solid var(--ink);display:flex;align-items:center;gap:8px;min-width:205px}
.archive-search span[aria-hidden]{font-size:24px}
.archive-search input{border:0;background:none;outline:0;padding:10px 0;width:190px;min-width:0;color:var(--ink);font-size:12px}
.archive-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:21px 13px}
.archive-item{display:block;text-align:left;width:100%;padding:0;background:none;border:0;min-width:0}
.archive-item-frame{aspect-ratio:1;display:flex;background:#ecece5;padding:9px;align-items:center;justify-content:center}
.archive-item-frame img{width:100%;height:100%;object-fit:contain;transition:transform .35s}
.archive-item:hover img{transform:scale(1.045)}
.archive-item .archive-caption{padding-top:8px;display:flex;justify-content:space-between;gap:8px;font-size:11px;color:#535a50}
.archive-item .archive-caption span:first-child{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.archive-item .archive-caption span:last-child{color:#90948e;flex-shrink:0}
.archive-bottom{text-align:center;padding-top:45px}
.archive-footnote{margin:46px 0 0;padding-top:16px;border-top:1px solid var(--line);color:#878c83;font-size:11px;line-height:1.7}
.archive-empty{grid-column:1/-1;padding:45px;font-size:15px}
.viewer{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;background:#151a15;color:white;box-shadow:none;overflow:hidden}
.viewer::backdrop{background:#151a15}
.viewer-head{height:65px;display:flex;justify-content:space-between;align-items:center;padding:0 36px;font-size:11px;letter-spacing:.11em}
.viewer .close-dialog{color:white}
.viewer-content{height:calc(100dvh - 155px);display:grid;grid-template-columns:70px 1fr 70px;align-items:center;justify-items:center}
.viewer-content>img{min-width:0;max-width:min(85vw,1450px);max-height:calc(100dvh - 172px);width:auto;height:auto;object-fit:contain}
.viewer-step{border:1px solid #6b736b;border-radius:100%;width:44px;height:44px;background:none;color:white;font-size:19px}
.viewer-step:hover{background:#39473a}
.viewer-step:disabled{opacity:.2;cursor:default}
.viewer-footer{height:90px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 36px;border-top:1px solid #3a413a;font-size:12px}
.viewer-footer>div{display:flex;flex-direction:column;gap:4px}
.viewer-footer strong{font-size:14px;font-weight:500}
.viewer-footer span{color:#aeb7a9}
.viewer-footer a{text-decoration:underline;text-underline-offset:6px}
@media(max-width:1100px){
 .hero{grid-template-columns:1fr 1.1fr}
 .hero-message{padding-left:38px}
 .hero-message h1{font-size:clamp(63px,7vw,99px)}
 .hero-exhibit{padding:25px 25px 30px 8px}
 .artwork-stage{height:500px}
 .hero-sidenote{display:none}
 .exhibit-zoom{font-size:0;gap:0}
 .exhibit-zoom span{font-size:24px}
 .selected{padding-top:110px}
}
@media(max-width:760px){
 html{scroll-padding-top:65px}
 .site-header{height:67px;padding:0 20px;gap:10px}
 .wordmark{font-size:23px}
 .site-nav{gap:15px;font-size:12px}
 .site-nav a[href="#about"]{display:none}
 .contact-nav{display:none}
 .site-nav .nav-archive{padding:10px 0}
 .hero{grid-template-columns:1fr;min-height:0}
 .hero-message{padding:55px 24px 36px;display:block}
 .hero-message .eyebrow{font-size:10px;margin-bottom:22px}
 .hero-message h1{font-size:clamp(66px,14vw,103px);margin-bottom:24px}
 .hero-lead{font-size:15px;line-height:1.6;max-width:460px}
 .hero-understated{display:none}
 .hero-exhibit{padding:0 18px 40px}
 .artwork-stage{height:clamp(350px,90vw,620px)}
 .artwork-stage>img{height:calc(100% - 46px);width:calc(100% - 46px)}
 .hero-stage-number{left:13px;top:13px}
 .exhibit-foot{padding-top:11px}
 .exhibit-label strong{font-size:16px}
 .exhibit-label span{font-size:9px}
 .exhibit-tools{gap:0}
 .exhibit-tools button{height:36px}
 .round-icon{min-width:36px}
 .section-wrap{padding-left:22px;padding-right:22px}
 .selected{padding-top:80px;padding-bottom:75px}
 .section-heading{display:block;margin-bottom:36px}
 .section-heading h2,.archive-teaser h2,.about h2{font-size:clamp(56px,12vw,86px)}
 .section-description{margin-top:24px;max-width:490px;font-size:15px}
 .projects-grid{gap:40px 15px}
 .project-card:nth-child(2n){transform:none}
 .project-frame{aspect-ratio:1}
 .project-frame img{height:calc(100% - 24px);width:calc(100% - 24px)}
 .project-text{padding-top:12px}
 .project-text h3{font-size:20px}
 .project-text small{font-size:11px}
 .work-end{margin-top:70px}
 .work-end>span{display:none}
 .breather{min-height:320px;padding:75px 20px}
 .breather p{font-size:clamp(43px,8vw,72px)}
 .archive-teaser{grid-template-columns:1fr;gap:20px;padding-top:86px;padding-bottom:40px}
 .archive-peek{height:365px}
 .peek-paper{height:72%}
 .peek-count{bottom:4px}
 .about{grid-template-columns:1fr;gap:48px;padding-top:74px;padding-bottom:95px}
 .about-art{max-width:510px}
 .footer-main{padding:75px 0 100px}
 .footer-main p{font-size:clamp(64px,11vw,110px)}
 .footer-main>a{width:65px;height:65px;font-size:36px}
 .footer-bottom span:nth-child(2){display:none}
 .project-dialog,.archive-dialog{width:100vw;height:100dvh;max-height:100dvh;max-width:100vw}
 .project-dialog-head{grid-template-columns:1fr;gap:18px;margin-bottom:24px}
 .project-dialog-body{padding:26px 18px}
 .archive-dialog-head{align-items:start}
 .archive-dialog-head>p{max-width:160px}
 .archive-control-row{display:block}
 .archive-chip-row{margin-bottom:16px}
 .archive-search{max-width:none}
 .archive-search input{width:100%;flex:1}
 .archive-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 10px}
 .viewer-content{grid-template-columns:45px 1fr 45px}
 .viewer-content>img{max-width:calc(100vw - 100px)}
 .viewer-head,.viewer-footer{padding:0 18px}
}
@media(max-width:480px){
 .site-nav{gap:12px}
 .hero-message h1{font-size:clamp(62px,15vw,82px)}
 .primary-link{min-height:50px}
 .artwork-stage{height:94vw}
 .exhibit-zoom{display:flex!important;font-size:11px;gap:4px;padding:0 5px}.exhibit-zoom span{font-size:19px}
 .projects-grid{grid-template-columns:1fr;gap:39px}
 .project-frame{aspect-ratio:1.15}
 .project-frame img{height:calc(100% - 46px);width:calc(100% - 46px)}
 .section-heading h2,.archive-teaser h2,.about h2{font-size:64px}
 .archive-peek{height:300px}
 .archive-teaser{padding-bottom:60px}
 .archive-dialog-head{display:block}
 .archive-dialog-head>p{text-align:left;margin-top:17px;max-width:none}
 .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .project-gallery{gap:8px}
 .project-photo{padding:6px}
 .viewer-footer{height:75px}
 .viewer-content{height:calc(100dvh - 140px);grid-template-columns:42px 1fr 42px}
 .viewer-content>img{max-width:calc(100vw - 88px);max-height:calc(100dvh - 165px)}
 .viewer-footer a{font-size:10px}
 .viewer-step{width:33px;height:33px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Visible content is primary. Motion is a small bonus. */
.project-title{font-size:clamp(22px,2vw,30px);font-weight:500;letter-spacing:-.05em;display:block;line-height:1.2;margin:0 0 7px}
.project-open{color:inherit}
.project-frame{position:relative;display:flex}
.project-frame img{display:block}
.onpage-archive{padding-top:116px;padding-bottom:140px;border-bottom:1px solid var(--line)}
.onpage-archive-heading{margin-bottom:50px}
.onpage-archive-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:20px;row-gap:38px}
.front-art{display:block;min-width:0;position:relative}
.front-art-photo{display:flex;align-items:center;justify-content:center;aspect-ratio:1;overflow:hidden;background:#edede8;padding:14px}
.front-art-photo img{width:100%;height:100%;object-fit:contain;transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.front-art:hover .front-art-photo img,.front-art:focus-visible .front-art-photo img{transform:scale(1.065)}
.front-art-caption{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding-top:11px;font-size:12px}
.front-art-caption strong{font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:70%}
.front-art-caption small{font-size:10px;color:var(--muted);text-align:right;white-space:nowrap}
.full-collection{margin-top:65px}
.full-collection>summary{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;display:grid;grid-template-columns:1fr auto 40px;gap:22px;align-items:center;cursor:pointer;list-style:none;transition:color .2s}
.full-collection>summary::-webkit-details-marker{display:none}
.full-collection>summary>span:first-child{font-size:11px;color:var(--muted);letter-spacing:.12em;font-weight:600}
.full-collection>summary strong{font-size:17px;letter-spacing:-.025em;font-weight:500}
.full-collection>summary .collection-arrow{font-size:27px;text-align:right;transition:transform .25s}
.full-collection[open]>summary .collection-arrow{transform:rotate(90deg)}
.full-collection>summary:hover{color:var(--accent)}
.rest-of-archive{padding-top:40px}
.archive-attribution{font-size:11px;color:var(--muted);line-height:1.7;margin:27px 0 0}
.worldmap-menu-link{color:var(--accent)!important}
.world-invite{font-size:12px;color:var(--accent);display:inline-flex;gap:12px;margin-top:23px;align-items:center;text-decoration:underline;text-underline-offset:5px}
.worldmap-preview{border-top:1px solid var(--line);background:#ebece5;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:45px;min-height:570px;padding-top:70px;padding-bottom:70px}
.worldmap-preview h2{font-size:clamp(61px,7vw,112px);line-height:.98;letter-spacing:-.065em;font-weight:500;margin:18px 0 24px}
.worldmap-preview h2 em{font-family:"Instrument Serif",Georgia,serif;color:#647a68;font-weight:400}
.worldmap-preview p{font-size:16px;color:#596558;max-width:425px;line-height:1.7;margin-bottom:26px}
.mini-planet{width:min(100%,400px);aspect-ratio:1;display:grid;place-items:center;position:relative;justify-self:center}
.mini-planet-ocean{display:block;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 25% 22%,#c2ddd2,#739e96 53%,#456c66 77%,#324e49);box-shadow:inset -32px -20px 55px #213c3d66,0 35px 70px #5674623b;overflow:hidden;position:relative}
.mini-planet-land{position:absolute;inset:14% 15%;background:#dce4bf;clip-path:polygon(13% 17%,24% 9%,46% 15%,51% 30%,36% 41%,48% 52%,34% 63%,28% 88%,16% 71%,15% 52%,7% 38%,13% 17%,63% 12%,83% 16%,94% 32%,83% 47%,71% 41%,69% 71%,59% 83%,55% 55%,52% 35%,63% 12%);filter:drop-shadow(0 3px 2px #567566)}
.mini-planet small{position:absolute;bottom:0;font-size:10px;letter-spacing:.14em;font-weight:700;color:#5d6c5b}
.mini-planet:hover .mini-planet-ocean{transform:rotate(7deg) scale(1.03)}
.mini-planet-ocean{transition:transform .55s cubic-bezier(.2,.8,.2,1)}
@media(max-width:950px){.onpage-archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.worldmap-preview{min-height:440px}}
@media(max-width:760px){
 .onpage-archive{padding-top:85px;padding-bottom:95px}
 .onpage-archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
 .front-art-photo{padding:9px}
 .front-art-caption{display:block}
 .front-art-caption strong{display:block;max-width:100%;font-size:11px}
 .front-art-caption small{display:block;text-align:left;font-size:9px;margin-top:4px}
 .full-collection{margin-top:45px}
 .full-collection>summary{grid-template-columns:1fr 30px;gap:12px}
 .full-collection>summary>span:first-child{grid-column:1/-1}
 .full-collection>summary strong{font-size:16px}
 .worldmap-preview{grid-template-columns:1fr;padding-top:80px;padding-bottom:65px;gap:15px}
 .mini-planet{max-width:270px}
 .worldmap-preview h2{font-size:72px}
 .site-nav .worldmap-menu-link{display:inline-flex}
}
@media(max-width:400px){.site-header{gap:8px}.site-nav{gap:9px}.site-nav a{font-size:12px}}

/* Real NASA Earth photography in place of quote-mark-like fake continents. */
.mini-planet-ocean{background:none;border-radius:50%;isolation:isolate;box-shadow:0 24px 67px #2b4e4d3a;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.mini-planet-ocean img{display:block;width:100%;height:100%;object-fit:contain;aspect-ratio:1}
.mini-planet:hover .mini-planet-ocean{transform:scale(1.035) rotate(-2deg)}
.mini-planet .earth-credit{position:absolute;bottom:-14px;left:0;right:0;text-align:center;color:#899588;font-size:9px;letter-spacing:.08em;font-weight:500}
@media(prefers-reduced-motion:reduce){.mini-planet:hover .mini-planet-ocean{transform:none}}

/* Crisp, deliberately non-emoji artwork navigation symbols on iOS/Android. */
.ui-diagonal-arrow{width:18px;height:18px;display:block;flex-shrink:0;stroke:currentColor}
.primary-link .ui-diagonal-arrow{width:19px;height:19px}
.world-invite .ui-diagonal-arrow{width:15px;height:15px;display:inline-block;vertical-align:-3px}
.exhibit-tools .ui-diagonal-arrow{width:21px;height:21px}
.artwork-stage>img,#viewer-image{pointer-events:none;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.artwork-stage:not(.lens-on){touch-action:pan-y;cursor:grab}
.artwork-stage:not(.lens-on):active{cursor:grabbing}
.viewer-content{touch-action:pan-y}
@media(prefers-reduced-motion:reduce){.artwork-stage>img{transition:none!important}}


/* Aviv's gentle pastel palette: color supports the art without overwhelming it. */
:root{
 --paper:#fbfaf6;
 --sage:#e6f0e7;
 --accent:#c86b53;
 --line:#deddd5;
}
body{background:var(--paper)}
.hero{
 background:linear-gradient(115deg,#fff4ed 0%,#fcf9f4 41%,#f0f4ed 100%);
}
.hero-message{background:linear-gradient(140deg,#fff4edb8,transparent 76%)}
.hero-exhibit{background:linear-gradient(148deg,#f6eff3 0%,#f1f4ef 62%,#faf5ee 100%)}
.selected{
 background:linear-gradient(155deg,#fbfaf6 0%,#f9f5fa 45%,#fbfaf6 96%);
}
.selected .section-index{color:#a16e70}
.breather{
 background:linear-gradient(125deg,#e5eee6 0%,#eef1e5 55%,#f9ecdf 100%);
}
.worldmap-preview{
 background:linear-gradient(125deg,#e5eee6 0%,#f1eee9 55%,#f3e8ec 100%);
}
.worldmap-preview h2 em{color:#687f71}
.onpage-archive{
 background:linear-gradient(152deg,#fdfbf7 0%,#f8f4f9 52%,#faf8f4 100%);
}
.front-art-photo{background:#eeeae9}
.front-art:nth-child(3n+1) .front-art-photo{background:#e8f0e8}
.front-art:nth-child(3n+2) .front-art-photo{background:#f3e8eb}
.front-art:nth-child(3n) .front-art-photo{background:#f0ece3}
.hero-cta-group .primary-link:hover{background:#a55849}
@media(prefers-reduced-motion:reduce){
 .front-art-photo img{transition:none!important}
}

/* The unfiltered originals remain available without turning the curated gallery
   into a wall of duplicate/blank source uploads. */
.archive-source-variants{margin-top:35px;border-top:1px solid var(--line)}
.archive-source-variants>summary{
 cursor:pointer;list-style:none;padding:18px 4px;color:var(--muted);
 font-size:12px;font-weight:500;letter-spacing:.02em
}
.archive-source-variants>summary::-webkit-details-marker{display:none}
.archive-source-variants>summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.archive-source-variants>summary:hover{color:var(--accent)}
.archive-source-variants:not([open]) .rest-of-archive{display:none}

/* Lightweight editorial portal to three genuinely different experiments. */
.home-experiment-gateway{padding:clamp(60px,7vw,110px) clamp(22px,6vw,110px);display:grid;grid-template-columns:1fr 1fr;gap:5vw;background:linear-gradient(120deg,#e5eee5,#f6ebe8 70%,#f5ecf2);align-items:center}
.gateway-intro>span{font-size:10px;font-weight:700;letter-spacing:.14em;color:#9e675e}
.gateway-intro h2{font-size:clamp(49px,5vw,90px);letter-spacing:-.07em;line-height:.97;font-weight:500;margin:25px 0}
.gateway-intro h2 em{font:italic 1em "Instrument Serif",Georgia,serif;color:#97706a}
.gateway-intro p{font-size:15px;line-height:1.8;max-width:420px;color:#627063}
.gateway-links{display:grid;gap:11px}
.gateway-links a{display:grid;grid-template-columns:1fr 25px;align-items:center;gap:10px;padding:20px 25px;background:#ffffffad;border:1px solid #d6dfd2;transition:transform .25s,background .25s}
.gateway-links a:hover{transform:translateX(4px);background:#fff}
.gateway-links a span:first-child{grid-column:1/-1;font-size:10px;font-weight:700;letter-spacing:.13em;color:#9e726c}
.gateway-links a strong{font-size:clamp(22px,2.2vw,38px);font-weight:500;letter-spacing:-.05em}
.gateway-links a span:last-child{font-size:25px}
@media(max-width:760px){
 .home-experiment-gateway{grid-template-columns:1fr;gap:30px}
 .gateway-intro h2{font-size:clamp(54px,11vw,77px)}
 .gateway-links a{padding:18px}
}

/* Hero: every source aspect ratio sits within exactly the same artwork mat.
   The image is never cropped, and directional swipes keep the mat dimensions fixed. */
.hero-exhibit .artwork-stage>img#hero-image,
.hero-exhibit .artwork-stage>img.hero-slide-layer{
 width:calc(100% - 48px);height:calc(100% - 48px);
 object-fit:contain;object-position:center;
 background:#fcfaf5;padding:clamp(10px,1.2vw,19px);
 border:1px solid #e9e5dd;
 box-shadow:0 11px 27px #2e36302a;
 max-width:none;pointer-events:none;-webkit-user-drag:none;
}
.hero-exhibit .artwork-stage>img.hero-slide-layer{
 position:absolute;inset:24px;z-index:2;margin:0;animation:none!important;
}
.artwork-stage.is-sliding>img#hero-image{animation:none!important;transition:none!important}
.artwork-stage:not(.is-sliding)>img#hero-image{transition:none}
.hero-exhibit .artwork-stage{overflow:hidden}
@media(max-width:760px){
 .hero-exhibit .artwork-stage>img#hero-image,
 .hero-exhibit .artwork-stage>img.hero-slide-layer{
  width:calc(100% - 32px);height:calc(100% - 32px);
  padding:10px;
 }
 .hero-exhibit .artwork-stage>img.hero-slide-layer{inset:16px}
}
/* Animation must be seen on phones without requiring hover. Never hide text. */
@keyframes aviv-mobile-hero-arrival{
 from{transform:translateY(17px);opacity:.76}
 to{transform:translateY(0);opacity:1}
}
@keyframes aviv-mobile-frame-glow{
 0%,100%{box-shadow:0 11px 27px #28342a1c}
 50%{box-shadow:0 13px 35px #a569584d}
}
@media(max-width:760px) and (prefers-reduced-motion:no-preference){
 .hero-message h1{animation:aviv-mobile-hero-arrival .75s cubic-bezier(.2,.8,.2,1) both}
 .hero-exhibit .artwork-stage:not(.is-sliding)>img#hero-image{
  animation:aviv-mobile-frame-glow 6s ease-in-out infinite;
 }
 .hero-exhibit .artwork-stage:not(.is-sliding){transition:background .45s}
}
@media(prefers-reduced-motion:reduce){
 .hero-exhibit .artwork-stage>img#hero-image,
 .hero-exhibit .artwork-stage>img.hero-slide-layer{animation:none!important;transition:none!important}
}

/* Mobile gallery motion — clearly visible and genuinely controllable. */
.hero-motion-bar{
 display:flex;gap:15px;align-items:center;
 padding:15px 2px 3px;color:#75857a;min-height:45px;
}
.hero-motion-label{
 white-space:nowrap;font-size:10px;font-weight:700;letter-spacing:.13em;
}
.hero-motion-progress{
 display:block;flex:1;height:2px;background:#d9ded5;position:relative;overflow:hidden;
}
.hero-motion-progress>span{
 position:absolute;inset:0;background:linear-gradient(90deg,#b3cdbc,#b8878a,#c2cfd1);
 transform:scaleX(0);transform-origin:left;
}
.hero-motion-bar.is-playing .hero-motion-progress>span{
 animation:aviv-auto-progress 6.6s linear infinite;
}
@keyframes aviv-auto-progress{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
.hero-motion-bar button{
 border:1px solid #cad3c9;color:#32453c;background:#f7f7f1;
 padding:8px 12px;font-size:11px;font-weight:600;white-space:nowrap;
 border-radius:25px;min-height:38px;transition:background .2s;
}
.hero-motion-bar button:hover{background:#ebf0e9}
.hero-motion-bar button:focus-visible{outline:2px solid #bb705c;outline-offset:3px}
.hero-motion-bar button span{display:inline-block;padding-left:5px;font-size:12px}
@media(max-width:760px){
 .hero-motion-bar{gap:9px;padding-top:13px;min-height:53px}
 .hero-motion-label{font-size:8px;letter-spacing:.08em}
 .hero-motion-bar button{padding:8px 10px;font-size:10px;min-height:38px}
 .hero-motion-bar.is-playing .hero-motion-progress{height:3px}
}
@media(prefers-reduced-motion:reduce){
 .hero-motion-progress>span{animation:none!important}
 .hero-motion-bar button{transition:none!important}
}


/* Avoid repainting big mobile photographs/shadows during touch scrolling. */
@media(max-width:850px){
 .hero-exhibit .artwork-stage:not(.is-sliding)>img#hero-image{
  animation:none!important;
  box-shadow:0 11px 27px #28342a22
 }
 .hero-exhibit .artwork-stage:not(.is-sliding){
  transition:none!important
 }
}