:root{--cream:#f2ede4;--stone:#d2c2a9;--burgundy:#6c2839;--ink:#282622}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',sans-serif}button{cursor:pointer;font:inherit}header{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid #b5a994;background:var(--cream);position:sticky;top:0;z-index:20}.wordmark{font-family:'Cormorant Garamond',serif;font-size:25px;letter-spacing:.045em;background:none;border:0}.wordmark i{font-size:16px}.edition{font-size:10px;letter-spacing:.25em}.menu{border:0;background:transparent;font-size:11px;letter-spacing:.15em}.hero{text-align:center;padding:65px 3vw 0;background:radial-gradient(ellipse at center,#f7f3e9,#e5ddcf)}.eyebrow{font-size:11px;letter-spacing:.33em;color:var(--burgundy)}h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500}h1{font-size:clamp(62px,10vw,150px);line-height:.85;letter-spacing:-.045em;margin:18px 0 10px}h1 em{font-weight:400}.intro{font-size:13px;letter-spacing:.08em}.museum{position:relative;max-width:1330px;margin:65px auto 0;min-height:470px;padding:0 2%}.pediment{height:105px;background:#d9c8ad;clip-path:polygon(50% 0,100% 100%,0 100%);border-bottom:8px solid #a7977e;position:relative}.pediment:after{content:'C · D · C';position:absolute;top:65%;left:0;right:0;font:25px 'Cormorant Garamond';letter-spacing:.4em}.entablature{height:42px;background:repeating-linear-gradient(90deg,#c4b197 0 7%,#e4d6c0 7% 8%);border-block:6px solid #ac987b}.wings{display:grid;grid-template-columns:1fr 1.12fr 1fr;background:#d7c6ad;padding:0 3%;border-inline:14px solid #b8a68b}.door{height:310px;border:0;border-inline:9px solid #c5b296;background:linear-gradient(160deg,#403a35,#171817);position:relative;overflow:hidden;color:#fff;transition:filter .3s}.door:hover{filter:brightness(1.25)}.door:before{content:'';position:absolute;inset:10px;border:2px solid #a28a6b;pointer-events:none}.door img{width:100%;height:100%;object-fit:cover;opacity:.72;transition:transform .6s}.door:hover img{transform:scale(1.08)}.door.center img{object-fit:contain;object-position:bottom;opacity:1;filter:grayscale(1)}.door span{position:absolute;bottom:0;left:0;right:0;padding:45px 6px 25px;background:linear-gradient(transparent,#1c1a18dc);font:clamp(23px,3vw,42px) 'Cormorant Garamond';letter-spacing:.03em}.stairs{height:68px;background:repeating-linear-gradient(to bottom,#d8c9b3 0 17px,#b9a88d 18px 21px)}.hero-bottom{display:flex;justify-content:space-between;padding:24px 4vw 42px;font-size:10px;letter-spacing:.2em}.section{padding:70px 6vw 120px;max-width:1500px;margin:auto}.back{background:none;border:0;color:var(--burgundy);font-size:11px;letter-spacing:.2em}.section-heading{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #a99b8a;margin:35px 0 45px;padding-bottom:15px}.section h2{font-size:clamp(62px,8vw,110px);line-height:.85;margin:10px 0}.section-heading p{max-width:250px;font-size:12px;line-height:1.7}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:60px 28px}.art{border:0;background:transparent;text-align:left;padding:0;min-width:0}.art img{width:100%;height:350px;object-fit:contain;background:#e8e1d6;padding:15px;transition:transform .3s}.art:hover img{transform:translateY(-6px)}.art h3{font-size:30px;margin:13px 0 4px}.meta{font-size:11px;line-height:1.6;color:#655b50}.about{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center}.about img{width:100%;filter:grayscale(1)}.about h2{font-size:clamp(60px,8vw,120px)}.about p{line-height:1.9;max-width:540px}.project{padding:35px 0 70px;border-bottom:1px solid #b9ae9e}.project h3{font-size:56px;margin:0}.project p{max-width:600px;line-height:1.7;font-size:14px}.project-images{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}.project-images img{width:100%;height:300px;object-fit:contain;background:#e9e4dd;cursor:zoom-in}.modal{position:fixed;inset:0;background:#171511eb;z-index:50;overflow:auto;padding:5vh 5vw;display:flex;align-items:center;justify-content:center}.hidden{display:none}.close{position:fixed;right:3vw;top:20px;background:none;color:white;border:0;font-size:28px;z-index:60}#modalContent{max-width:1150px;width:100%;display:grid;grid-template-columns:1.3fr 1fr;gap:50px;align-items:center;color:#f2ede4}#modalContent img{max-height:82vh;width:100%;object-fit:contain}#modalContent h2{font-size:58px;margin:0 0 20px}#modalContent p{font-size:13px;line-height:1.85;white-space:pre-line}footer{display:flex;justify-content:space-between;padding:32px 4vw;background:#302b28;color:#e5d9c7;font-size:10px;letter-spacing:.13em}footer button{background:none;border:0;color:inherit;font-size:10px;letter-spacing:.13em}@media(max-width:760px){.edition{display:none}.museum{min-height:0}.pediment{height:55px}.pediment:after{font-size:15px}.entablature{height:25px}.wings{border-inline-width:5px;padding:0}.door{height:200px;border-inline-width:3px}.door span{font-size:18px}.hero-bottom{gap:12px;font-size:8px}.gallery{grid-template-columns:repeat(2,1fr);gap:32px 14px}.art img{height:220px}.art h3{font-size:24px}.section{padding:45px 5vw}.section-heading{display:block}.about{grid-template-columns:1fr}.project-images{grid-template-columns:repeat(2,1fr)}.project-images img{height:190px}#modalContent{grid-template-columns:1fr;gap:15px}#modalContent img{max-height:45vh}#modalContent h2{font-size:38px}footer{gap:14px;flex-wrap:wrap}}@media(max-width:450px){.gallery{grid-template-columns:1fr}.art img{height:330px}.door{height:155px}.door span{font-size:15px}}

/* Approved homepage is shown as the exact, unmodified image; only transparent click targets are layered on top. */
body.museum-home{background:#271b15}body.museum-home header,body.museum-home footer{display:none}.approved-home{width:100%;position:relative;line-height:0}.approved-scene{display:block;width:100%;height:auto}.entrance{position:absolute;z-index:2;border:0;background:transparent;padding:0;cursor:pointer;transition:background .2s}.entrance:focus-visible{outline:3px solid #e5cb9b;outline-offset:-4px;background:#fff2}.entrance-art{left:13.8%;top:25%;width:18%;height:53%}.entrance-about{left:41.7%;top:29%;width:16.5%;height:51%}.entrance-design{left:68.5%;top:25%;width:18.2%;height:53%}
/* V2 interior system: homepage remains the approved image; all interior typography is sans-serif. */
.section h1,.section h2,.section h3,.modal h2{font-family:'DM Sans',sans-serif}.inside-controls{display:flex;justify-content:space-between;align-items:center}.lang{display:flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.14em}.lang button{border:0;background:none;padding:4px;color:#85786a}.lang button.active{color:var(--ink);border-bottom:1px solid currentColor}.design-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 28px}.project-card{border:0;background:transparent;text-align:left;padding:0;color:inherit}.project-cover{aspect-ratio:4/3;background:#e8e1d6;overflow:hidden}.project-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s ease}.project-card:hover .project-cover img{transform:scale(1.025)}.project-card-text{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding-top:14px;border-top:1px solid #a99b8a;margin-top:10px}.project-card h3{font-size:clamp(25px,3vw,42px);margin:0;font-weight:500}.project-card span{font-size:10px;letter-spacing:.14em;white-space:nowrap}.project-page .project-hero{display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center;margin:45px 0 85px}.project-hero h2{font-size:clamp(55px,8vw,110px);margin:10px 0 25px;line-height:.9}.project-hero p{max-width:570px;line-height:1.8;font-size:14px}.project-hero>img{width:100%;max-height:70vh;object-fit:contain;background:#e8e1d6}.project-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.project-detail-grid img{width:100%;height:520px;object-fit:contain;background:#e8e1d6;cursor:zoom-in}.coming-soon{border-top:1px solid #a99b8a;padding-top:30px;color:#655b50}.approved-home{overflow:hidden;transform-origin:center;transition:transform .72s cubic-bezier(.65,0,.35,1),filter .72s ease,opacity .72s ease}.approved-home.entering{pointer-events:none;filter:brightness(.82);opacity:.96}.approved-home.enter-art{transform:scale(1.9) translate(19%,-5%)}.approved-home.enter-about{transform:scale(1.9) translate(0,-5%)}.approved-home.enter-design{transform:scale(1.9) translate(-19%,-5%)}
@media(max-width:760px){.design-grid{grid-template-columns:1fr}.project-page .project-hero{grid-template-columns:1fr;margin-bottom:45px}.project-detail-grid{grid-template-columns:1fr}.project-detail-grid img{height:auto}.project-card-text{align-items:center}.approved-home.enter-art{transform:scale(1.65) translate(18%,-3%)}.approved-home.enter-about{transform:scale(1.65) translate(0,-3%)}.approved-home.enter-design{transform:scale(1.65) translate(-18%,-3%)}}

/* V5 — horizontal museum carousel + card flip */
.carousel-page{max-width:none;min-height:calc(100vh - 150px);overflow:hidden;padding-bottom:55px}.carousel-heading{max-width:1380px;margin:28px auto 10px;padding:0 3vw;display:flex;align-items:end;justify-content:space-between}.carousel-heading h2{font-size:clamp(52px,6vw,88px);margin:8px 0 0}.carousel-heading>p{max-width:360px;font-size:12px;line-height:1.65}.museum-carousel{height:min(680px,68vh);min-height:520px;display:grid;grid-template-columns:70px 1fr 70px;align-items:center;max-width:1550px;margin:auto}.carousel-stage{height:100%;display:grid;grid-template-columns:minmax(100px,.27fr) minmax(520px,1fr) minmax(100px,.27fr);gap:28px;align-items:center;perspective:1800px}.carousel-arrow{width:54px;height:54px;border:1px solid #9f9281;border-radius:50%;background:#f2ede4;color:#282622;font-size:25px;justify-self:center;transition:.2s}.carousel-arrow:hover{background:#282622;color:#f2ede4}.peek{height:64%;opacity:.28;overflow:hidden;cursor:pointer;transition:.35s;position:relative}.peek:hover{opacity:.55;transform:scale(1.02)}.peek img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}.peek span{position:absolute;bottom:0;left:0;right:0;padding:30px 12px 12px;background:linear-gradient(transparent,#111b);color:white;font-size:11px}.flip-wrap{height:100%;min-width:0}.flip-card{height:100%;width:100%;perspective:1800px;cursor:pointer}.flip-inner{position:relative;width:100%;height:100%;transition:transform .72s cubic-bezier(.2,.72,.2,1);transform-style:preserve-3d}.flip-card.flipped .flip-inner{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#e8e1d6;border:1px solid #c9bdad;box-shadow:0 24px 70px #392b1f22;overflow:hidden}.card-front{display:flex;flex-direction:column}.art-front>img,.design-front>img{width:100%;height:calc(100% - 92px);object-fit:contain;background:#e5ddd1;padding:22px}.design-front>img{object-fit:cover;padding:0}.card-caption{min-height:92px;padding:16px 20px;background:#f4efe7;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #c9bdad}.card-caption h3{font-family:'DM Sans',sans-serif;font-size:22px;margin:0;font-weight:500}.card-caption p{margin:4px 0 0;font-size:11px;color:#6a6055}.card-caption span{font-size:9px;letter-spacing:.15em;white-space:nowrap}.card-back{transform:rotateY(180deg);background:#f4efe7;padding:0;cursor:default}.back-scroll{height:100%;overflow-y:auto;padding:48px 7%;overscroll-behavior:contain}.card-back h3{font-family:'DM Sans',sans-serif;font-size:clamp(34px,4vw,60px);line-height:1;margin:10px 0 20px}.card-back p{font-size:13px;line-height:1.85;max-width:800px}.card-back .price{font-weight:600;margin-bottom:28px}.statement{white-space:normal}.back-images{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}.back-images img{width:100%;height:310px;object-fit:contain;background:#e1d9cd}.flip-back{margin-top:28px;border:1px solid #9f9281;background:transparent;padding:11px 15px;font-size:10px;letter-spacing:.12em}.carousel-count{text-align:center;font-size:10px;letter-spacing:.25em;color:#766b60;margin-top:8px}
/* door transition: quick push-in, then eased approach, then soft blur */
.approved-home{will-change:transform,filter,opacity;transition:none}.approved-home.entering{pointer-events:none;animation-duration:.98s;animation-fill-mode:forwards;animation-timing-function:linear}.approved-home.enter-art{transform-origin:22% 52%;animation-name:doorZoom}.approved-home.enter-about{transform-origin:50% 52%;animation-name:doorZoom}.approved-home.enter-design{transform-origin:78% 52%;animation-name:doorZoom}@keyframes doorZoom{0%{transform:scale(1);filter:blur(0) brightness(1);opacity:1}48%{transform:scale(1.78);filter:blur(0) brightness(.98);opacity:1}78%{transform:scale(2.05);filter:blur(1px) brightness(.92);opacity:.98}100%{transform:scale(2.22);filter:blur(10px) brightness(.72);opacity:.2}}
@media(max-width:800px){.carousel-heading{display:block}.carousel-heading>p{max-width:520px}.museum-carousel{grid-template-columns:48px 1fr 48px;height:65vh;min-height:470px}.carousel-stage{grid-template-columns:38px minmax(0,1fr) 38px;gap:8px}.peek span{display:none}.carousel-arrow{width:42px;height:42px}.card-caption{padding:12px}.card-caption h3{font-size:17px}.card-caption span{font-size:8px}.back-scroll{padding:32px 7%}.back-images{grid-template-columns:1fr}.back-images img{height:auto}}

/* V6 — clean, borderless media presentation */
.card-face{border:0;box-shadow:none}
.art-front>img,.design-front>img{background:transparent;padding:0}
.card-caption{border-top:0}
.back-images{align-items:start}
.back-images img,.project-video{width:100%;height:auto;max-height:none;object-fit:contain;background:transparent;border:0;box-shadow:none;display:block}
.project-video{grid-column:span 2}
.peek img{border:0}
@media(max-width:760px){.project-video{grid-column:1/-1}}

/* V7 — About archive card */
.about-page{max-width:1380px;min-height:calc(100vh - 120px)}.about-heading{margin:28px 0 18px}.about-heading h2{font-size:clamp(52px,6vw,88px);margin:8px 0 0}.about-card{height:min(650px,67vh);min-height:520px;max-width:1180px;margin:0 auto}.about-front{display:grid;grid-template-columns:44% 56%;background:#f4efe7}.about-photo{overflow:hidden;background:#ded8cf}.about-photo img{width:100%;height:100%;object-fit:cover;display:block}.about-intro{padding:7% 8%;display:flex;flex-direction:column;align-items:flex-start}.about-index{font-size:9px;letter-spacing:.18em;color:#776d62}.about-intro h3{font-size:clamp(52px,6vw,92px);line-height:.88;margin:10% 0 28px;font-weight:500}.about-intro>p{font-size:15px;line-height:1.8;max-width:520px}.about-explore{margin-top:auto;width:100%;padding-top:18px;display:flex;justify-content:space-between;align-items:end;border-top:1px solid #b9afa2}.about-explore span{font-size:10px;letter-spacing:.15em}.about-explore small{font-size:9px;letter-spacing:.08em;color:#776d62}.about-back{background:#f4efe7}.about-back-inner{height:100%;display:flex;flex-direction:column;padding:38px 5% 28px}.about-tabs{display:flex;gap:28px;border-bottom:1px solid #b9afa2;flex:0 0 auto}.about-tabs button{border:0;background:none;padding:0 0 13px;font:600 10px 'DM Sans',sans-serif;letter-spacing:.15em;color:#8b8176}.about-tabs button.active{color:#25211d;border-bottom:2px solid #25211d}.about-panel{overflow-y:auto;flex:1;padding:26px 2px 12px;overscroll-behavior:contain}.about-list{display:grid;gap:0}.about-entry{display:grid;grid-template-columns:115px 1fr;gap:28px;padding:20px 0;border-bottom:1px solid #d0c7bc}.about-entry:first-child{padding-top:0}.about-entry>span{font-size:10px;letter-spacing:.12em;color:#776d62;padding-top:5px}.about-entry h4{font:500 clamp(22px,2.4vw,34px) 'DM Sans',sans-serif;margin:0 0 5px}.about-entry b{font-size:11px;letter-spacing:.06em}.about-entry p{font-size:12px;line-height:1.7;margin:8px 0 0;max-width:760px}.about-list.compact .about-entry{padding:15px 0}.about-list.compact .about-entry h4{font-size:23px}.faq-list details{border-bottom:1px solid #d0c7bc;padding:18px 0}.faq-list summary{font:500 clamp(20px,2.4vw,31px) 'DM Sans',sans-serif;cursor:pointer;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:'+';float:right;font-weight:300}.faq-list details[open] summary:after{content:'–'}.faq-list p{font-size:13px;line-height:1.8;max-width:760px;margin:14px 0 4px}.about-return{flex:0 0 auto;margin-top:12px}
@media(max-width:760px){.about-card{height:70vh;min-height:520px}.about-front{grid-template-columns:1fr;grid-template-rows:44% 56%}.about-intro{padding:7%}.about-intro h3{font-size:44px;margin:7% 0 14px}.about-intro>p{font-size:12px}.about-explore small{display:none}.about-back-inner{padding:26px 7% 20px}.about-tabs{gap:16px}.about-entry{grid-template-columns:1fr;gap:6px}.about-entry>span{padding:0}.about-entry h4{font-size:21px}}

/* V8 — fluid horizontal gallery + completely borderless artwork media */
.carousel-stage{touch-action:pan-y;user-select:none;-webkit-user-select:none;will-change:transform;transition:transform .46s cubic-bezier(.22,.75,.25,1),opacity .32s ease}
.carousel-stage.dragging{transition:none;cursor:grabbing}
.carousel-stage.sliding-left{transform:translateX(-16%);opacity:.18}
.carousel-stage.sliding-right{transform:translateX(16%);opacity:.18}
.carousel-stage.enter-from-right{animation:carouselEnterRight .48s cubic-bezier(.18,.78,.24,1)}
.carousel-stage.enter-from-left{animation:carouselEnterLeft .48s cubic-bezier(.18,.78,.24,1)}
@keyframes carouselEnterRight{from{transform:translateX(16%);opacity:.18}to{transform:translateX(0);opacity:1}}
@keyframes carouselEnterLeft{from{transform:translateX(-16%);opacity:.18}to{transform:translateX(0);opacity:1}}
.art-front,.design-front{background:transparent}
.art-front>img,.design-front>img{background:transparent;padding:0;border:0;box-shadow:none}
.peek,.peek img{background:transparent;border:0;box-shadow:none}

/* V10 — Binghamton Printing integrated brand case study */
.binghamton-front{background:#fff}.bing-cover{height:calc(100% - 92px);display:flex;align-items:center;justify-content:center;gap:clamp(24px,5vw,70px);padding:7%;background:#fff}.bing-mark{width:clamp(130px,22vw,250px);aspect-ratio:1;border-radius:50%;background:#00AEEF;color:#fff;display:grid;place-items:center;font-size:clamp(54px,10vw,118px);font-weight:700;letter-spacing:-.12em;line-height:1}.bing-cover small{font-size:9px;letter-spacing:.22em}.bing-cover strong{display:block;margin-top:12px;font-size:clamp(34px,5vw,68px);line-height:.82;color:#F37232;letter-spacing:-.055em}.bing-back{background:#fff}.bing-case{padding:0;background:#fff;color:#231F20}.bing-case>section{padding:52px 6%}.bing-intro{min-height:420px;display:flex;flex-direction:column;justify-content:flex-end;background:#fff}.bing-intro h3{font-size:clamp(55px,8vw,105px);letter-spacing:-.065em;margin:12px 0 24px}.bing-intro p{max-width:650px!important;font-size:14px!important}.bing-values{display:grid;grid-template-columns:repeat(4,1fr);padding:0!important}.bing-values span{min-height:110px;display:flex;align-items:flex-end;padding:18px;font-size:10px;letter-spacing:.12em;color:#fff;background:#F37232}.bing-values span:nth-child(2){background:#00AEEF}.bing-values span:nth-child(3){background:#231F20}.bing-values span:nth-child(4){background:#d9c7aa;color:#231F20}.bing-system{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:end}.bing-case h4{font:600 clamp(28px,4vw,52px)/1.02 'DM Sans',sans-serif;letter-spacing:-.045em;margin:10px 0 18px}.bing-case small{font-size:9px;letter-spacing:.2em}.bing-swatches{display:grid;grid-template-columns:1fr 1fr;aspect-ratio:1.45}.bing-swatches i{font-style:normal;padding:15px;display:flex;align-items:flex-end;font-size:10px}.bing-swatches .orange{background:#F37232;color:#fff}.bing-swatches .cyan{background:#00AEEF;color:#fff}.bing-swatches .black{background:#231F20;color:#fff}.bing-swatches .white{background:#fff;border:1px solid #eee}.bing-brandcards{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:0!important}.bing-brandcards img{display:block;width:100%;height:auto}.bing-mockups{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:start}.bing-section-title{grid-column:1/-1;margin-bottom:8px}.bing-mockups img{display:block;width:100%;height:360px;object-fit:cover}.bing-mockups .wide{grid-column:1/-1;height:430px}.bing-space{display:grid;grid-template-columns:.72fr 1.28fr;gap:6%;align-items:center;background:#f5f2ec}.bing-space img{width:100%;height:auto;display:block}.bing-case>.flip-back{margin:20px 6% 52px}
@media(max-width:760px){.bing-cover{gap:18px}.bing-mark{width:110px}.bing-values{grid-template-columns:1fr 1fr}.bing-values span{min-height:85px}.bing-system,.bing-space{grid-template-columns:1fr}.bing-brandcards{grid-template-columns:1fr}.bing-mockups{grid-template-columns:1fr}.bing-mockups .wide,.bing-section-title{grid-column:auto}.bing-mockups img,.bing-mockups .wide{height:auto}.bing-case>section{padding:38px 7%}}

/* V11 — Citronella integrated case study */
.citronella-front{background:#111}.citronella-back{background:#f6f2eb}.citro-case{padding:0;background:#f6f2eb;color:#211d19}.citro-case>section{padding:50px 6%}.citro-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:7%;align-items:end;min-height:330px}.citro-intro h3{font-size:clamp(62px,9vw,116px);letter-spacing:-.07em;margin:10px 0 0}.citro-intro>p{font-size:14px!important;line-height:1.8!important;max-width:480px!important}.citro-feature{display:grid;grid-template-columns:1.18fr .82fr;gap:5%;align-items:center;background:#171512;color:#f7f1e8}.citro-feature img{width:100%;height:min(62vh,600px);object-fit:contain;display:block}.citro-note small,.citro-divider small,.citro-merch-head small{font-size:9px;letter-spacing:.2em}.citro-note h4,.citro-divider h4,.citro-merch-head h4{font:600 clamp(30px,4vw,54px)/1.02 'DM Sans',sans-serif;letter-spacing:-.045em;margin:12px 0 18px}.citro-note p,.citro-merch-head p{font-size:12px!important;line-height:1.75!important}.citro-poster-grid{display:grid;grid-template-columns:.72fr 1.28fr;grid-template-rows:repeat(2,minmax(190px,1fr));gap:14px;background:#fff}.citro-poster-grid img{width:100%;height:100%;object-fit:cover;display:block}.citro-poster-grid .portrait{grid-row:1/3}.citro-divider{padding-bottom:28px!important}.citro-divider h4{font-size:clamp(38px,5vw,68px);max-width:700px;margin-bottom:0}.citro-records{padding-top:0!important;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.citro-records img{width:100%;height:auto;display:block}.citro-merch-head{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:end;background:#efe8de}.citro-merch-head p{max-width:430px!important}.citro-merch{padding-top:0!important;background:#efe8de;display:grid;grid-template-columns:1fr 1fr;gap:14px}.citro-merch img{width:100%;height:360px;object-fit:cover;display:block}.citro-merch .wide{grid-column:1/-1;height:auto;max-height:520px;object-fit:contain;background:#d7cdc0}.citro-case>.flip-back{margin:20px 6% 52px}
@media(max-width:760px){.citro-case>section{padding:38px 7%}.citro-intro,.citro-feature,.citro-merch-head{grid-template-columns:1fr}.citro-feature img{height:auto}.citro-poster-grid{grid-template-columns:1fr;grid-template-rows:auto}.citro-poster-grid .portrait{grid-row:auto}.citro-poster-grid img{height:auto}.citro-records,.citro-merch{grid-template-columns:1fr}.citro-merch .wide{grid-column:auto}.citro-merch img{height:auto}}
/* V12 — preserve full Festival Conjura poster */
.citro-poster-grid .citro-conjura-full{object-fit:contain;background:transparent;object-position:center;width:100%;height:100%;}

/* V13 — Design collection windows */
.design-windows{max-width:1380px;margin:18px auto 22px;padding:0 3vw;display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr 1fr;gap:8px}.design-window{min-height:72px;border:1px solid #c8beb0;background:transparent;color:#655d54;padding:14px 16px;display:flex;align-items:flex-end;justify-content:space-between;text-align:left;cursor:pointer;transition:background .28s ease,color .28s ease,border-color .28s ease,transform .28s ease}.design-window span{font:600 10px 'DM Sans',sans-serif;letter-spacing:.13em}.design-window small{font:400 9px 'DM Sans',sans-serif;letter-spacing:.12em;opacity:.6}.design-window:hover{transform:translateY(-2px);border-color:#83786c}.design-window.active{background:#27231f;color:#f5f0e8;border-color:#27231f}.design-window.active:first-child{background:#6f1f2b;border-color:#6f1f2b}.carousel-page:has(.design-windows) .museum-carousel{height:min(620px,61vh);min-height:480px}.carousel-page:has(.design-windows) .carousel-heading{margin-bottom:0}
@media(max-width:800px){.design-windows{display:flex;overflow-x:auto;gap:7px;padding-bottom:5px;scrollbar-width:none}.design-windows::-webkit-scrollbar{display:none}.design-window{flex:0 0 138px;min-height:62px}.carousel-page:has(.design-windows) .museum-carousel{height:62vh;min-height:460px}}
/* E-commerce case study — integrated campaign presentation */
.ecommerce-back{background:#fff}.ecommerce-case{padding:0;background:#fff;color:#171717}.ecommerce-case>section{padding:48px 6%}.ecom-intro{min-height:330px;display:grid;grid-template-columns:1.1fr .9fr;gap:7%;align-items:end}.ecom-intro h3{font-size:clamp(60px,9vw,112px);letter-spacing:-.07em;margin:10px 0 0}.ecom-intro>p{font-size:14px!important;line-height:1.8!important;max-width:500px!important}.ecom-brand-head{border-top:1px solid #171717;padding-bottom:28px!important}.ecom-brand-head small{font-size:9px;letter-spacing:.2em}.ecom-brand-head h4{font:600 clamp(30px,4vw,54px)/1.03 'DM Sans',sans-serif;letter-spacing:-.045em;max-width:760px;margin:12px 0 0}.ecom-feature{padding-top:0!important;display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:start}.ecom-feature img,.ecom-strip img,.ecom-laque img,.ecom-senza img{display:block;width:100%;height:auto;border:0!important;box-shadow:none!important;background:transparent!important}.ecom-stack{display:grid;gap:14px}.ecom-strip{padding-top:0!important;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.ecom-brand-head.alt{margin-top:24px;background:#f1f0ed}.ecom-laque{padding-top:0!important;background:#f1f0ed;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}.ecom-brand-head.senza{background:#111;color:#fff;margin-top:24px}.ecom-senza{padding-top:0!important;background:#111;display:flex;justify-content:center}.ecom-senza img{max-width:620px}.ecommerce-case>.flip-back{margin:24px 6% 52px}@media(max-width:760px){.ecom-intro{grid-template-columns:1fr;min-height:280px}.ecom-feature,.ecom-strip,.ecom-laque{grid-template-columns:1fr}.ecom-brand-head h4{font-size:30px}}


/* V15 — clean hover titles + repaired E-commerce case study */
.card-front{position:relative}
.art-front>img,.design-front>img{
  width:100%;height:100%;object-fit:contain;padding:0!important;
  border:0!important;box-shadow:none!important;background:transparent!important;
}
.design-front>img{object-fit:cover}
.card-caption{
  position:absolute;inset:0;min-height:0;padding:24px 26px;border:0!important;
  background:rgba(12,12,12,.26);color:#fff;display:flex;align-items:flex-end;
  justify-content:space-between;gap:18px;opacity:0;pointer-events:none;
  transition:opacity .28s ease;
}
.card-caption::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.34),rgba(0,0,0,0) 52%);z-index:0;
}
.card-caption>*{position:relative;z-index:1}
.card-caption h3{font-size:clamp(18px,2vw,26px);font-weight:500;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.18)}
.card-caption p{color:rgba(255,255,255,.86)}
.card-caption span{color:rgba(255,255,255,.9)}
.card-front:hover .card-caption{opacity:1}
.binghamton-front .bing-cover{height:100%}
.citronella-front>img,.ecommerce-front>img{height:100%}

.ecommerce-case,.ecommerce-case *{box-sizing:border-box}
.ecommerce-case{width:100%;max-width:100%;overflow-x:hidden}
.ecommerce-case>section{width:100%;max-width:100%;min-width:0}
.ecom-intro{
  grid-template-columns:minmax(0,1.05fr) minmax(260px,.95fr);
  gap:clamp(28px,6vw,72px);
  padding-left:clamp(28px,6%,72px)!important;
  padding-right:clamp(28px,6%,72px)!important;
}
.ecom-intro>div,.ecom-intro>p,.ecom-brand-head>*{min-width:0;max-width:100%}
.ecom-intro h3{font-size:clamp(46px,7vw,92px);letter-spacing:-.055em;overflow-wrap:anywhere}
.ecom-intro>p{width:100%;max-width:460px!important;justify-self:end;overflow-wrap:break-word}
.ecom-brand-head{padding-left:clamp(28px,6%,72px)!important;padding-right:clamp(28px,6%,72px)!important}
.ecom-brand-head h4{font-size:clamp(28px,3.6vw,48px);line-height:1.06;letter-spacing:-.035em;overflow-wrap:break-word}
.ecom-feature,.ecom-strip,.ecom-laque{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ecom-feature>*,.ecom-strip>*,.ecom-laque>*{min-width:0;max-width:100%}
.ecom-feature img,.ecom-strip img,.ecom-laque img,.ecom-senza img{max-width:100%}

@media (hover:none){
  .card-caption{opacity:1;background:linear-gradient(to top,rgba(0,0,0,.42),rgba(0,0,0,0) 42%)}
  .card-caption::before{display:none}
}
@media(max-width:760px){
  .ecom-intro{grid-template-columns:1fr}
  .ecom-intro>p{justify-self:start}
  .ecom-feature,.ecom-strip,.ecom-laque{grid-template-columns:1fr}
  .card-caption{padding:18px}
}


/* V16 — remaining design projects as integrated case studies */
.citronella-front .card-caption{z-index:6}
.citronella-front:hover .card-caption{opacity:1!important}

.pro-case{padding:0!important;background:#f7f4ee;color:#171717}
.pro-case section{box-sizing:border-box}
.pro-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:56px;padding:64px 7% 54px;border-bottom:1px solid rgba(0,0,0,.12)}
.pro-intro h3{font-size:clamp(50px,7vw,96px);line-height:.9;letter-spacing:-.055em;margin:10px 0 0}
.pro-intro>p{align-self:end;max-width:520px;font-size:15px;line-height:1.65;margin:0}
.pro-hero,.cannes-opening,.product-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:0;align-items:stretch}
.pro-hero>img,.cannes-opening>img,.product-hero>img{width:100%;height:100%;min-height:420px;object-fit:cover;display:block}
.product-hero>img{object-fit:contain;background:#ece9e3;padding:28px}
.pro-copy{padding:54px clamp(30px,5vw,68px);display:flex;flex-direction:column;justify-content:center}
.pro-copy small,.pro-section-head small{font-size:10px;letter-spacing:.16em;font-weight:700}
.pro-copy h4,.pro-section-head h4{font-size:clamp(28px,3.5vw,48px);line-height:1.02;letter-spacing:-.04em;margin:12px 0 18px}
.pro-copy p{font-size:14px;line-height:1.65;max-width:440px}
.pro-section-head{padding:64px 7% 34px}
.pro-section-head.compact{padding-bottom:22px}
.ebay-motion{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 7% 68px}
.case-video{margin:0;min-width:0}
.case-video video{width:100%;aspect-ratio:9/16;object-fit:cover;background:#111;display:block}
.case-video figcaption{font-size:10px;letter-spacing:.12em;text-transform:uppercase;margin-top:9px;opacity:.6}
.pro-endnote{margin:0 7% 68px;border-top:1px solid rgba(0,0,0,.18);border-bottom:1px solid rgba(0,0,0,.18);padding:30px 0;display:grid;grid-template-columns:70px 1fr;gap:24px;align-items:start}
.pro-endnote span{font-size:11px;letter-spacing:.15em;font-weight:700}
.pro-endnote p{margin:0;max-width:680px;font-size:17px;line-height:1.5}
.cannes-spreads{display:grid;grid-template-columns:1.15fr .85fr;gap:12px;padding:0 7% 64px}
.cannes-spreads img{width:100%;height:100%;object-fit:cover;display:block}
.cannes-spreads img:first-child{grid-row:span 2}
.cannes-motion{padding:0 7% 68px}
.cannes-motion video{display:block;width:100%;max-height:680px;background:#111}
.product-pairs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 7% 68px}
.product-pairs>div{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:#ece9e3;padding:12px}
.product-pairs img{width:100%;height:420px;object-fit:contain;display:block}
@media(max-width:760px){
 .pro-intro,.pro-hero,.cannes-opening,.product-hero{grid-template-columns:1fr}
 .pro-intro{gap:26px;padding:42px 28px}
 .pro-hero>img,.cannes-opening>img,.product-hero>img{min-height:300px}
 .ebay-motion,.product-pairs{grid-template-columns:1fr;padding-left:28px;padding-right:28px}
 .cannes-spreads{grid-template-columns:1fr;padding-left:28px;padding-right:28px}
 .cannes-spreads img:first-child{grid-row:auto}
 .pro-section-head,.cannes-motion{padding-left:28px;padding-right:28px}
 .pro-endnote{margin-left:28px;margin-right:28px}
 .product-pairs>div{grid-template-columns:1fr 1fr}
 .product-pairs img{height:320px}
}


/* V17 — preserve eBay video frames + restore full scrolling on long case studies */

/* eBay: never crop the original video frame */
.ebay-motion .case-video video{
  width:100%;
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  background:#111;
}

/*
  Long flipped case studies need their own scroll surface.
  min-height:0 is essential inside the flex/card stack; without it,
  the content can grow beyond the card while the scroll container itself
  remains "stuck" at the visible height.
*/
.design-flip .flip-inner,
.design-flip .card-back,
.design-flip .project-back{
  min-height:0;
}

.design-flip .project-back{
  overflow:hidden !important;
}

.design-flip .project-back > .back-scroll{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  max-height:100%;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
  padding-bottom:max(72px, env(safe-area-inset-bottom)) !important;
}

/* Make sure the final sections can actually clear the bottom edge */
.citronella-case > :last-child,
.product-case > :last-child{
  margin-bottom:28px;
}



/* V18 — Editorial / Subway Type Specimen */
.typespec-front>img{object-fit:cover}
.typespec-case{background:#f4f1ec}
.typespec-intro{background:#f4f1ec}
.typespec-intro h3{max-width:760px}
.typespec-opening{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 7% 70px}
.typespec-opening img,.typespec-grid img,.typespec-city img{width:100%;display:block}
.typespec-statement{margin:0 7%;padding:54px 0 60px;border-top:1px solid rgba(0,0,0,.16);display:grid;grid-template-columns:140px minmax(0,1fr) minmax(260px,.65fr);gap:28px;align-items:start}
.typespec-statement small{font-size:10px;letter-spacing:.15em;font-weight:700}
.typespec-statement h4{font-size:clamp(34px,4.4vw,58px);line-height:.98;letter-spacing:-.045em;margin:0}
.typespec-statement p{font-size:14px;line-height:1.65;margin:0}
.typespec-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 7% 44px}
.typespec-city{display:grid;gap:10px;padding:0 7% 70px}
.typespec-city.ny,.typespec-city.berlin{grid-template-columns:repeat(2,minmax(0,1fr))}
.typespec-city.paris{grid-template-columns:1.15fr .85fr}
.typespec-city.paris img:first-child{grid-row:span 2;height:100%;object-fit:cover}
.typespec-city img{background:#fff}
@media(max-width:760px){
 .typespec-opening,.typespec-grid,.typespec-city.ny,.typespec-city.berlin,.typespec-city.paris{grid-template-columns:1fr;padding-left:28px;padding-right:28px}
 .typespec-city.paris img:first-child{grid-row:auto;height:auto}
 .typespec-statement{margin-left:28px;margin-right:28px;grid-template-columns:1fr;padding-top:38px}
}


/* V20 — targeted fixes only, based on V18 */

/* Type Specimen: prevent intro title/description overlap without changing the site's type system */
.typespec-intro{
  grid-template-columns:minmax(0,1.05fr) minmax(300px,.95fr) !important;
  gap:clamp(56px,7vw,100px) !important;
  align-items:end;
}
.typespec-intro > div,
.typespec-intro > p{min-width:0}
.typespec-intro h3{
  max-width:620px !important;
  font-size:clamp(42px,5.4vw,76px) !important;
  line-height:.92 !important;
}
.typespec-intro > p{
  width:100%;
  max-width:470px !important;
  justify-self:end;
  margin:0 !important;
}

/* One opening image after removing the TOC: keep its complete frame */
.typespec-opening{
  display:block !important;
}
.typespec-opening img{
  width:min(100%,900px) !important;
  height:auto !important;
  object-fit:contain !important;
  margin:0 auto;
}

/* Paris: preserve every original page frame. No cropping. */
.typespec-city.paris{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:start;
}
.typespec-city.paris img,
.typespec-city.paris img:first-child{
  grid-row:auto !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}
.typespec-city.paris img:last-child{
  grid-column:1 / -1;
  width:min(50%,720px) !important;
  justify-self:center;
}

/* New York now has only its first two images; preserve both complete frames. */
.typespec-city.ny{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}
.typespec-city.ny img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}

/* Berlin now contains the one remaining image after deleting the final three. */
.typespec-city.berlin{
  display:block !important;
}
.typespec-city.berlin img{
  display:block;
  width:min(100%,760px) !important;
  height:auto !important;
  object-fit:contain !important;
  margin:0 auto;
}

/*
  Citronella + Product Design:
  keep the bottom control/bar from covering the final content.
  Give the internal scroller enough clearance to scroll the last title/content
  fully above it.
*/
.citronella-case,
.product-case{
  scroll-padding-bottom:150px;
}
.citronella-case > .flip-back,
.product-case > .flip-back{
  position:relative;
  margin-bottom:110px !important;
}
.citronella-case > :nth-last-child(2),
.product-case > :nth-last-child(2){
  margin-bottom:48px !important;
}

/* Preserve vertical scrolling inside those long cards. */
.design-flip .project-back > .back-scroll.citronella-case,
.design-flip .project-back > .back-scroll.product-case{
  overflow-y:auto !important;
  padding-bottom:140px !important;
  -webkit-overflow-scrolling:touch;
}

@media(max-width:760px){
  .typespec-intro{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .typespec-intro > p{justify-self:start}
  .typespec-city.paris,
  .typespec-city.ny{grid-template-columns:1fr !important}
  .typespec-city.paris img:last-child{
    grid-column:auto;
    width:100% !important;
  }
}



/* V21 — fix the actual carousel/footer collision shown in screenshot */

/*
  The problem was not the case-study scroller. The DESIGN CAROUSEL itself was
  taller than the remaining viewport, while .carousel-page clipped overflow.
  That made the footer look like it was covering the bottom of tall covers.
*/
.carousel-page:has(.design-windows){
  overflow:visible !important;
  padding-bottom:42px !important;
}

/* Reserve actual room for header + headings/categories + footer. */
.carousel-page:has(.design-windows) .museum-carousel{
  height:clamp(390px, calc(100vh - 385px), 560px) !important;
  min-height:390px !important;
}

/* Keep the complete active card inside that available space. */
.carousel-page:has(.design-windows) .carousel-stage,
.carousel-page:has(.design-windows) .flip-wrap,
.carousel-page:has(.design-windows) .flip-card,
.carousel-page:has(.design-windows) .flip-inner,
.carousel-page:has(.design-windows) .card-face{
  max-height:100%;
}

/* Long cover names remain visible inside the hover overlay. */
.carousel-page:has(.design-windows) .card-caption{
  padding-bottom:28px !important;
}
.carousel-page:has(.design-windows) .card-caption h3{
  max-width:78%;
  line-height:1.12;
  overflow-wrap:normal;
}

/* The old V20 internal-scroll workaround is no longer needed to solve this. */
.citronella-case > .flip-back,
.product-case > .flip-back{
  margin-bottom:52px !important;
}
.design-flip .project-back > .back-scroll.citronella-case,
.design-flip .project-back > .back-scroll.product-case{
  padding-bottom:72px !important;
}

@media(max-width:800px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:clamp(390px, calc(100vh - 350px), 520px) !important;
    min-height:390px !important;
  }
}



/* V22 — screenshot-targeted fixes */

/* Footer: stay at the bottom in normal document flow; never float over artwork. */
body:not(.home) footer,
body:not(.home) .site-footer{
  position:relative !important;
  bottom:auto !important;
  left:auto !important;
  right:auto !important;
  inset:auto !important;
  flex:0 0 auto !important;
}

/* Undo V21's visible overflow, which let the carousel pass behind the footer. */
.carousel-page:has(.design-windows){
  overflow:hidden !important;
  padding-bottom:0 !important;
}

/* Fit the carousel into the space above the footer. */
.carousel-page:has(.design-windows) .museum-carousel{
  height:clamp(350px,calc(100vh - 430px),510px) !important;
  min-height:350px !important;
}

/* Type Specimen intro: reduce title and create a hard gutter between columns. */
.typespec-intro{
  grid-template-columns:minmax(0,.9fr) minmax(320px,.72fr) !important;
  gap:clamp(90px,9vw,140px) !important;
  align-items:end !important;
}
.typespec-intro > div,
.typespec-intro > p{min-width:0 !important}
.typespec-intro h3{
  max-width:520px !important;
  font-size:clamp(38px,4.4vw,62px) !important;
  line-height:.93 !important;
  margin:10px 0 0 !important;
}
.typespec-intro > p{
  position:static !important;
  width:100% !important;
  max-width:420px !important;
  margin:0 !important;
  justify-self:end !important;
  align-self:end !important;
  font-size:14px !important;
  line-height:1.65 !important;
}

/* Checkerboard hierarchy requested:
   left = THE TYPE FAMILY + its description
   right = One family, different cities, left aligned */
.typespec-statement{
  display:grid !important;
  grid-template-columns:minmax(280px,.8fr) minmax(320px,1fr) !important;
  gap:clamp(80px,9vw,140px) !important;
  align-items:start !important;
  margin:0 7% !important;
  padding:56px 0 68px !important;
}
.typespec-family-copy{min-width:0}
.typespec-family-copy small{
  display:block;
  margin-bottom:22px;
}
.typespec-family-copy p{
  max-width:420px;
  margin:0 !important;
  font-size:14px;
  line-height:1.65;
}
.typespec-statement h4{
  justify-self:start !important;
  text-align:left !important;
  max-width:520px !important;
  margin:0 !important;
  font-size:clamp(38px,5vw,66px) !important;
  line-height:.96 !important;
}

@media(max-width:800px){
  .typespec-intro,
  .typespec-statement{
    grid-template-columns:1fr !important;
    gap:30px !important;
  }
  .typespec-intro > p{justify-self:start !important}
  .carousel-page:has(.design-windows) .museum-carousel{
    height:clamp(340px,calc(100vh - 400px),490px) !important;
  }
}



/* V23 — give flipped Design case studies room to breathe */

/*
  When a Design card is OPEN, it should feel like a page, not a tiny viewport.
  The footer remains in normal document flow BELOW the project.
*/
.carousel-page:has(.design-windows){
  overflow:visible !important;
  min-height:calc(100vh - 82px);
  padding-bottom:0 !important;
}

/* Closed carousel still fits comfortably on screen. */
.carousel-page:has(.design-windows) .museum-carousel{
  height:clamp(430px,58vh,650px) !important;
  min-height:430px !important;
}

/* The center flipped card gets a taller reading window. */
.carousel-page:has(.design-windows) .carousel-item.is-center .design-flip.flipped{
  height:min(74vh,760px) !important;
  max-height:none !important;
}
.carousel-page:has(.design-windows) .carousel-item.is-center .design-flip.flipped .flip-inner,
.carousel-page:has(.design-windows) .carousel-item.is-center .design-flip.flipped .card-face{
  height:100% !important;
  max-height:none !important;
}
.carousel-page:has(.design-windows) .carousel-item.is-center .design-flip.flipped .back-scroll{
  height:100% !important;
  max-height:none !important;
  overflow-y:auto !important;
  padding-bottom:110px !important;
}

/* Type Specimen intro: move description right while preserving a real outer margin. */
.typespec-intro{
  grid-template-columns:minmax(0,.84fr) minmax(330px,.66fr) !important;
  gap:clamp(105px,10vw,160px) !important;
  padding-left:7% !important;
  padding-right:8.5% !important;
}
.typespec-intro h3{
  max-width:510px !important;
  font-size:clamp(38px,4.25vw,60px) !important;
}
.typespec-intro > p{
  max-width:390px !important;
  justify-self:end !important;
}

/* Give the checkerboard row enough horizontal room.
   The large phrase is allowed to wrap naturally instead of being clipped. */
.typespec-statement{
  grid-template-columns:minmax(260px,.72fr) minmax(0,1fr) !important;
  gap:clamp(70px,8vw,125px) !important;
  overflow:visible !important;
}
.typespec-statement h4{
  width:100% !important;
  max-width:600px !important;
  min-width:0 !important;
  font-size:clamp(34px,4.35vw,58px) !important;
  line-height:.98 !important;
  white-space:normal !important;
  overflow:visible !important;
  overflow-wrap:normal !important;
}

/* Make sure case-study sections themselves never clip oversized editorial text. */
.typespec-case,
.typespec-case section{
  overflow-x:visible !important;
}

@media(max-width:900px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:clamp(420px,62vh,620px) !important;
  }
  .carousel-page:has(.design-windows) .carousel-item.is-center .design-flip.flipped{
    height:72vh !important;
  }
  .typespec-intro{
    grid-template-columns:1fr !important;
    gap:32px !important;
    padding-left:7% !important;
    padding-right:7% !important;
  }
  .typespec-intro > p{justify-self:start !important}
  .typespec-statement{
    grid-template-columns:1fr !important;
    gap:38px !important;
  }
}



/* V24 — definitive footer/carousel fix */

/*
  The black bar is the footer. Previous versions were shrinking the carousel
  to the viewport, while the visual card itself overflowed that grid track.
  Result: the footer entered normal flow too early and visually sliced the work.

  Stop trying to force the museum into one viewport. Let the Design room be
  genuinely tall and let the PAGE scroll. The footer comes only after it.
*/
.carousel-page:has(.design-windows){
  overflow:visible !important;
  min-height:0 !important;
  padding-bottom:70px !important;
}

.carousel-page:has(.design-windows) .museum-carousel{
  height:720px !important;
  min-height:720px !important;
  max-height:none !important;
  align-items:center !important;
}

.carousel-page:has(.design-windows) .carousel-stage,
.carousel-page:has(.design-windows) .flip-wrap,
.carousel-page:has(.design-windows) .flip-card,
.carousel-page:has(.design-windows) .flip-inner,
.carousel-page:has(.design-windows) .card-face{
  height:100% !important;
  max-height:none !important;
}

/* V23 targeted a .carousel-item element that doesn't exist.
   Target the actual center wrapper instead. */
.carousel-page:has(.design-windows) .flip-wrap .design-flip.flipped{
  height:100% !important;
  max-height:none !important;
}
.carousel-page:has(.design-windows) .flip-wrap .design-flip.flipped .back-scroll{
  height:100% !important;
  max-height:none !important;
  overflow-y:auto !important;
  padding-bottom:100px !important;
}

/* Footer is ordinary document content AFTER the full Design section. */
body:not(.museum-home) footer{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:100% !important;
  margin:0 !important;
}

/* Keep Type Specimen's roomy intro from V23. */
.typespec-intro > p{
  padding-left:18px;
  padding-right:4px;
}

@media(max-width:900px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:650px !important;
    min-height:650px !important;
  }
}

@media(max-width:600px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:600px !important;
    min-height:600px !important;
  }
}



/* V25 — ALL Design projects get a large, breathable reading window */

/*
  Stop compressing case studies into a short carousel slot.
  The design room itself is now tall enough that every flipped project gets
  a generous reading canvas. The project scrolls inside that canvas and the
  footer only appears AFTER the full room.
*/
.carousel-page:has(.design-windows){
  overflow:visible !important;
  padding-bottom:90px !important;
}

.carousel-page:has(.design-windows) .museum-carousel{
  height:clamp(760px,84vh,920px) !important;
  min-height:760px !important;
  max-height:none !important;
}

.carousel-page:has(.design-windows) .carousel-stage,
.carousel-page:has(.design-windows) .flip-wrap,
.carousel-page:has(.design-windows) .flip-card,
.carousel-page:has(.design-windows) .flip-inner,
.carousel-page:has(.design-windows) .card-face{
  height:100% !important;
  max-height:none !important;
}

/* Apply to EVERY design project, not only Citronella/Product/Type Specimen. */
.carousel-page:has(.design-windows) .design-flip.flipped .project-back{
  overflow:hidden !important;
}
.carousel-page:has(.design-windows) .design-flip.flipped .back-scroll{
  position:absolute !important;
  inset:0 !important;
  height:100% !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:150px !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}

/* Keep the footer after the entire tall Design room. */
body:not(.museum-home) footer{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:100% !important;
  margin:0 !important;
}

/* Type Specimen intro: eliminate the collision decisively.
   Smaller title + description begins farther right with a real gutter. */
.typespec-intro{
  display:grid !important;
  grid-template-columns:minmax(0, .78fr) minmax(340px, .62fr) !important;
  column-gap:clamp(120px,11vw,180px) !important;
  padding-left:7% !important;
  padding-right:9% !important;
  align-items:end !important;
}
.typespec-intro > div,
.typespec-intro > p{
  min-width:0 !important;
}
.typespec-intro h3{
  width:auto !important;
  max-width:470px !important;
  font-size:clamp(36px,3.85vw,56px) !important;
  line-height:.95 !important;
  letter-spacing:-.045em !important;
  margin:10px 0 0 !important;
}
.typespec-intro > p{
  position:static !important;
  width:100% !important;
  max-width:390px !important;
  padding:0 !important;
  margin:0 !important;
  justify-self:end !important;
  align-self:end !important;
  font-size:14px !important;
  line-height:1.65 !important;
}

/* Paris now has two full, uncropped pages side by side. */
.typespec-city.paris{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:10px !important;
  align-items:start !important;
}
.typespec-city.paris img,
.typespec-city.paris img:first-child,
.typespec-city.paris img:last-child{
  grid-column:auto !important;
  grid-row:auto !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  justify-self:stretch !important;
}

/* Checkerboard line remains fully visible. */
.typespec-statement{
  overflow:visible !important;
}
.typespec-statement h4{
  max-width:none !important;
  width:100% !important;
  overflow:visible !important;
  white-space:normal !important;
}

@media(max-width:900px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:78vh !important;
    min-height:650px !important;
  }
  .typespec-intro{
    grid-template-columns:1fr !important;
    column-gap:0 !important;
    row-gap:34px !important;
    padding-left:7% !important;
    padding-right:7% !important;
  }
  .typespec-intro > p{justify-self:start !important}
}

@media(max-width:600px){
  .carousel-page:has(.design-windows) .museum-carousel{
    height:76vh !important;
    min-height:590px !important;
  }
  .typespec-city.paris{
    grid-template-columns:1fr !important;
  }
}



/* V27 — Artwork: same generous reading/scroll space as Design */
#artwork.carousel-page{
  overflow:visible !important;
  padding-bottom:90px !important;
}

#artwork .museum-carousel{
  height:clamp(760px,84vh,920px) !important;
  min-height:760px !important;
  max-height:none !important;
}

#artwork .carousel-stage,
#artwork .flip-wrap,
#artwork .flip-card,
#artwork .flip-inner,
#artwork .card-face{
  height:100% !important;
  max-height:none !important;
}

/* All painting backs can scroll through their full content. */
#artwork .flip-card.flipped .card-back,
#artwork .flip-card.flipped .art-back{
  overflow:hidden !important;
}

#artwork .flip-card.flipped .back-scroll,
#artwork .flip-card.flipped .art-back-scroll{
  height:100% !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:150px !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
}

/* Footer comes after the Artwork room instead of blocking it. */
body:not(.museum-home) footer{
  position:static !important;
  inset:auto !important;
  transform:none !important;
  width:100% !important;
  margin:0 !important;
}

@media(max-width:900px){
  #artwork .museum-carousel{
    height:78vh !important;
    min-height:650px !important;
  }
}
@media(max-width:600px){
  #artwork .museum-carousel{
    height:76vh !important;
    min-height:590px !important;
  }
}


/* V28 — Diamonds Through the Ages editorial case study */
.diamonds-front>img{object-fit:cover}
.diamonds-case{background:#050505;color:#fff}
.diamonds-intro{background:#050505;color:#fff;border-bottom:1px solid rgba(255,255,255,.2)}
.diamonds-intro .eyebrow{color:rgba(255,255,255,.62)}
.diamonds-cover-feature{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,.55fr);gap:clamp(34px,5vw,76px);padding:34px 7% 84px;align-items:center}
.diamonds-cover-feature img{width:100%;display:block}
.diamonds-cover-feature small{font-size:10px;letter-spacing:.15em;font-weight:700}
.diamonds-cover-feature h4{font-size:clamp(28px,3.5vw,52px);line-height:1.02;letter-spacing:-.04em;margin:18px 0}
.diamonds-cover-feature p{font-size:14px;line-height:1.65;color:rgba(255,255,255,.74)}
.diamonds-case .pro-section-head{color:#fff;border-color:rgba(255,255,255,.2)}
.diamonds-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 7% 70px}
.diamonds-grid img,.diamonds-break img,.diamonds-finale img{width:100%;display:block}
.diamonds-break{padding:0 7% 76px}
.diamonds-grid.feature img:first-child{grid-column:1/-1}
.diamonds-grid.culture{align-items:start}
.diamonds-finale{padding:0 7% 80px}
.diamonds-finale>div{display:grid;grid-template-columns:90px minmax(0,560px);gap:28px;margin-top:28px;align-items:start}
.diamonds-finale span{font-size:clamp(40px,6vw,78px);line-height:1}
.diamonds-finale p{margin:0;font-size:15px;line-height:1.65;color:rgba(255,255,255,.75)}
.diamonds-case .flip-back{color:#fff;border-color:rgba(255,255,255,.35)}
@media(max-width:760px){
 .diamonds-cover-feature,.diamonds-grid{grid-template-columns:1fr}
 .diamonds-cover-feature,.diamonds-grid,.diamonds-break,.diamonds-finale{padding-left:28px;padding-right:28px}
 .diamonds-grid.feature img:first-child{grid-column:auto}
 .diamonds-finale>div{grid-template-columns:1fr}
}


/* V29 — BLACK MUSEUM SKIN
   Visual theme only. Structure, sizing, interactions and project content remain unchanged. */
:root{
  --museum-black:#050505;
  --museum-panel:#0b0b0b;
  --museum-panel-2:#111;
  --museum-white:#f5f5f2;
  --museum-muted:#a8a8a3;
  --museum-line:rgba(255,255,255,.18);
}

/* Interior museum */
body:not(.home-page),
body[data-page="artwork"],
body[data-page="about"],
body[data-page="design"]{
  background:var(--museum-black) !important;
  color:var(--museum-white) !important;
}

/* Common interior surfaces */
body:not(.home-page) header,
body:not(.home-page) main,
body:not(.home-page) footer,
body:not(.home-page) .museum-page,
body:not(.home-page) .section-page,
body:not(.home-page) .gallery-shell,
body:not(.home-page) .design-shell,
body:not(.home-page) .about-shell{
  background-color:var(--museum-black);
  color:var(--museum-white);
}

/* Navigation / museum labels */
body:not(.home-page) a,
body:not(.home-page) button,
body:not(.home-page) .eyebrow,
body:not(.home-page) .section-kicker,
body:not(.home-page) .back-link{
  color:var(--museum-white);
}
body:not(.home-page) header,
body:not(.home-page) footer,
body:not(.home-page) .section-header{
  border-color:var(--museum-line) !important;
}

/* Design collection windows */
body:not(.home-page) .design-category,
body:not(.home-page) .category-window,
body:not(.home-page) .design-filter,
body:not(.home-page) .filter-btn{
  background:transparent !important;
  color:var(--museum-white) !important;
  border-color:var(--museum-line) !important;
}
body:not(.home-page) .design-category.active,
body:not(.home-page) .category-window.active,
body:not(.home-page) .design-filter.active,
body:not(.home-page) .filter-btn.active{
  background:var(--museum-white) !important;
  color:var(--museum-black) !important;
}

/* Card backs and archive surfaces */
body:not(.home-page) .card-back,
body:not(.home-page) .project-back,
body:not(.home-page) .about-card,
body:not(.home-page) .about-back,
body:not(.home-page) .back-scroll,
body:not(.home-page) .pro-case{
  background-color:var(--museum-panel) !important;
  color:var(--museum-white) !important;
  border-color:var(--museum-line) !important;
}
body:not(.home-page) .pro-case p,
body:not(.home-page) .card-back p,
body:not(.home-page) .about-card p,
body:not(.home-page) .about-back p{
  color:rgba(245,245,242,.74);
}
body:not(.home-page) .pro-section-head,
body:not(.home-page) .pro-endnote,
body:not(.home-page) .flip-back{
  border-color:var(--museum-line) !important;
  color:var(--museum-white) !important;
}

/* About tabs/windows */
body:not(.home-page) .about-tab,
body:not(.home-page) .archive-tab,
body:not(.home-page) .about-window{
  background:transparent !important;
  color:var(--museum-white) !important;
  border-color:var(--museum-line) !important;
}
body:not(.home-page) .about-tab.active,
body:not(.home-page) .archive-tab.active,
body:not(.home-page) .about-window.active{
  background:var(--museum-white) !important;
  color:var(--museum-black) !important;
}

/* Carousel controls */
body:not(.home-page) .carousel-arrow,
body:not(.home-page) .gallery-arrow,
body:not(.home-page) .nav-arrow{
  color:var(--museum-white) !important;
  border-color:var(--museum-line) !important;
  background:rgba(5,5,5,.72) !important;
}

/* Keep imagery untouched; remove accidental light frames around image containers */
body:not(.home-page) .design-front,
body:not(.home-page) .art-front{
  background:transparent !important;
}
body:not(.home-page) img{
  border-color:transparent;
}

/* Diamonds already uses black; keep its authored hierarchy intact. */
.diamonds-case,.diamonds-intro{background:#050505 !important}

/* Selection + scrollbar details */
body:not(.home-page) ::selection{background:#f5f5f2;color:#050505}
body:not(.home-page) *{scrollbar-color:#555 #0b0b0b}

/* V30 fixes */
body:has(#art.active),body:has(#artwork.active){overflow-y:auto!important;height:auto!important;min-height:100vh!important}
#art,#artwork,#art.active,#artwork.active{height:auto!important;min-height:100vh!important;max-height:none!important;overflow:visible!important;padding-bottom:200px!important}
#art .carousel,#artwork .carousel,#art .gallery-carousel,#artwork .gallery-carousel,#art .carousel-track,#artwork .carousel-track{height:auto!important;min-height:calc(100vh - 150px)!important;max-height:none!important;overflow:visible!important;align-items:flex-start!important}
#art .card-face.card-front,#artwork .card-face.card-front,#art .art-front,#artwork .art-front,#art .flip-card,#artwork .flip-card,#art .flip-inner,#artwork .flip-inner{height:auto!important;max-height:none!important;overflow:visible!important}
#art .art-front img,#artwork .art-front img,#art .card-front img,#artwork .card-front img{width:100%;height:auto!important;max-height:none!important;object-fit:contain!important;display:block}
body:has(#art.active) footer,body:has(#artwork.active) footer{position:relative!important;inset:auto!important;margin-top:60px!important}

/* About is fully dark too */
#about,#about.active,#about .about-shell,#about .about-card,#about .flip-card,#about .flip-inner,#about .card-face,#about .card-front,#about .card-back,#about .about-front,#about .about-back,#about .about-panel,#about .about-content,#about .archive-card,#about .archive-content{background:#050505!important;color:#f5f5f2!important;border-color:rgba(255,255,255,.18)!important}
#about h1,#about h2,#about h3,#about h4,#about h5,#about span,#about small,#about strong,#about em,#about .about-name,#about .about-role,#about .eyebrow,#about .section-kicker{color:#f5f5f2!important}
#about p,#about li,#about .about-intro{color:rgba(245,245,242,.76)!important}
#about .about-tab,#about .archive-tab,#about .about-window,#about button{background:#050505!important;color:#f5f5f2!important;border-color:rgba(255,255,255,.24)!important}
#about .about-tab.active,#about .archive-tab.active,#about .about-window.active,#about button.active{background:#f5f5f2!important;color:#050505!important}


/* V31 — COMPLETE DESIGN PROJECT BLACK/WHITE INVERSION
   Anything that functioned as a white/light project surface is now black.
   Dark text on those surfaces becomes white. Original artwork/images are untouched. */

/* Every project slide / flipped case-study canvas */
body:not(.home-page) .design-flip .project-back,
body:not(.home-page) .design-flip .back-scroll,
body:not(.home-page) .design-flip .project-back > .back-scroll,
body:not(.home-page) .design-flip .back-scroll > section,
body:not(.home-page) .design-flip .back-scroll > div,
body:not(.home-page) .design-flip .back-scroll > article,
body:not(.home-page) .design-flip .back-scroll > header,
body:not(.home-page) .design-flip .back-scroll > footer,
body:not(.home-page) .binghamton-back,
body:not(.home-page) .bing-back,
body:not(.home-page) .bing-case,
body:not(.home-page) .bing-case > section,
body:not(.home-page) .bing-intro,
body:not(.home-page) .bing-system,
body:not(.home-page) .bing-space,
body:not(.home-page) .citronella-back,
body:not(.home-page) .citro-case,
body:not(.home-page) .citro-case > section,
body:not(.home-page) .citro-intro,
body:not(.home-page) .citro-poster-grid,
body:not(.home-page) .citro-divider,
body:not(.home-page) .citro-records,
body:not(.home-page) .citro-merch-head,
body:not(.home-page) .citro-merch,
body:not(.home-page) .ecommerce-case,
body:not(.home-page) .product-case,
body:not(.home-page) .ebay-case,
body:not(.home-page) .cannes-case,
body:not(.home-page) .type-case,
body:not(.home-page) .pro-case{
  background:#050505 !important;
  color:#f5f5f2 !important;
  border-color:rgba(255,255,255,.18) !important;
}

/* Typography throughout project slides */
body:not(.home-page) .design-flip .project-back h1,
body:not(.home-page) .design-flip .project-back h2,
body:not(.home-page) .design-flip .project-back h3,
body:not(.home-page) .design-flip .project-back h4,
body:not(.home-page) .design-flip .project-back h5,
body:not(.home-page) .design-flip .project-back h6,
body:not(.home-page) .design-flip .project-back strong,
body:not(.home-page) .design-flip .project-back b,
body:not(.home-page) .design-flip .project-back small,
body:not(.home-page) .design-flip .project-back label,
body:not(.home-page) .design-flip .project-back .eyebrow,
body:not(.home-page) .design-flip .project-back .section-kicker,
body:not(.home-page) .bing-case h3,
body:not(.home-page) .bing-case h4,
body:not(.home-page) .bing-case small,
body:not(.home-page) .citro-case h3,
body:not(.home-page) .citro-case h4,
body:not(.home-page) .citro-case small{
  color:#f5f5f2 !important;
}
body:not(.home-page) .design-flip .project-back p,
body:not(.home-page) .design-flip .project-back li,
body:not(.home-page) .design-flip .project-back .meta,
body:not(.home-page) .design-flip .project-back .description,
body:not(.home-page) .bing-case p,
body:not(.home-page) .citro-case p{
  color:rgba(245,245,242,.76) !important;
}

/* Previously-white Binghamton elements */
body:not(.home-page) .binghamton-front,
body:not(.home-page) .bing-cover,
body:not(.home-page) .bing-back,
body:not(.home-page) .bing-case,
body:not(.home-page) .bing-intro{
  background:#050505 !important;
}
body:not(.home-page) .bing-swatches .white{
  background:#050505 !important;
  color:#f5f5f2 !important;
  border-color:rgba(255,255,255,.35) !important;
}
body:not(.home-page) .bing-values span:nth-child(4){
  background:#161616 !important;
  color:#f5f5f2 !important;
}

/* Citronella: replace old cream/white editorial canvases with black */
body:not(.home-page) .citronella-back,
body:not(.home-page) .citro-case,
body:not(.home-page) .citro-intro,
body:not(.home-page) .citro-poster-grid,
body:not(.home-page) .citro-divider,
body:not(.home-page) .citro-records,
body:not(.home-page) .citro-merch-head,
body:not(.home-page) .citro-merch{
  background:#050505 !important;
  color:#f5f5f2 !important;
}
body:not(.home-page) .citro-feature{
  background:#f5f5f2 !important;
  color:#050505 !important;
}
body:not(.home-page) .citro-feature h1,
body:not(.home-page) .citro-feature h2,
body:not(.home-page) .citro-feature h3,
body:not(.home-page) .citro-feature h4,
body:not(.home-page) .citro-feature p,
body:not(.home-page) .citro-feature small,
body:not(.home-page) .citro-feature span{
  color:#050505 !important;
}
body:not(.home-page) .citro-merch .wide{
  background:#111 !important;
}

/* Generic light cards/panels inside all design projects */
body:not(.home-page) .design-flip .project-back .light,
body:not(.home-page) .design-flip .project-back .light-panel,
body:not(.home-page) .design-flip .project-back .white-panel,
body:not(.home-page) .design-flip .project-back .cream-panel,
body:not(.home-page) .design-flip .project-back .panel,
body:not(.home-page) .design-flip .project-back .section-card{
  background:#050505 !important;
  color:#f5f5f2 !important;
  border-color:rgba(255,255,255,.18) !important;
}

/* Lines/dividers switch from dark-on-light to light-on-dark */
body:not(.home-page) .design-flip .project-back hr,
body:not(.home-page) .design-flip .project-back [class*="divider"],
body:not(.home-page) .design-flip .project-back [class*="border"]{
  border-color:rgba(255,255,255,.18) !important;
}

/* Never recolor the actual portfolio work itself. */
body:not(.home-page) .design-flip img,
body:not(.home-page) .design-flip video{
  filter:none !important;
}


/* V32 — selected Design category: white, never maroon */
body:not(.home-page) .design-filter.active,
body:not(.home-page) .design-filter.is-active,
body:not(.home-page) .design-filter[aria-selected="true"],
body:not(.home-page) .collection-window.active,
body:not(.home-page) .collection-window.is-active,
body:not(.home-page) .collection-window[aria-selected="true"],
body:not(.home-page) .design-tabs button.active,
body:not(.home-page) .design-tabs button[aria-selected="true"],
body:not(.home-page) .category-tabs button.active,
body:not(.home-page) .category-tabs button[aria-selected="true"],
body:not(.home-page) [data-design-filter].active,
body:not(.home-page) [data-design-filter][aria-selected="true"] {
  background:#f5f5f2 !important;
  color:#050505 !important;
  border-color:#f5f5f2 !important;
}


/* V33 — exact selector fix for ALL WORK + all active Design category windows */
body:not(.home-page) .design-window.active,
body:not(.home-page) .design-window.active:first-child {
  background:#f5f5f2 !important;
  color:#050505 !important;
  border-color:#f5f5f2 !important;
}
body:not(.home-page) .design-window.active span,
body:not(.home-page) .design-window.active small {
  color:#050505 !important;
}

/* V34 — About intro readability correction requested by Chiara */
.about-front .about-intro{
  background:#f5f5f2 !important;
  color:#050505 !important;
}
.about-front .about-intro h3,
.about-front .about-intro > p,
.about-front .about-intro .about-index,
.about-front .about-intro .about-explore span,
.about-front .about-intro .about-explore small{
  color:#050505 !important;
}
.about-front .about-intro .about-explore{
  border-color:rgba(5,5,5,.24) !important;
}

/* V35 — mobile museum viewport: exact approved homepage image, touch-drag only */
.mobile-museum-pan{position:relative;width:100%;line-height:0}.mobile-drag-hint{display:none}
@media(max-width:760px){
 body.museum-home{overflow:hidden;overscroll-behavior:none}
 .approved-home{height:100dvh;width:100vw;overflow:hidden;touch-action:none;cursor:grab;background:#271b15}
 .approved-home:active{cursor:grabbing}
 .mobile-museum-pan{height:100dvh;width:max-content;will-change:transform;transform:translate3d(0,0,0)}
 .mobile-museum-pan.dragging{transition:none}
 .approved-scene{height:100dvh;width:auto;max-width:none;user-select:none;-webkit-user-drag:none;pointer-events:none}
 .mobile-drag-hint{display:block;position:absolute;z-index:5;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);padding:8px 12px;border-radius:999px;background:rgba(24,15,10,.62);backdrop-filter:blur(6px);color:#f3e4ca;font:600 9px/1 'DM Sans',sans-serif;letter-spacing:.16em;white-space:nowrap;pointer-events:none;animation:dragHintFade 4.2s ease forwards}
 @keyframes dragHintFade{0%,58%{opacity:.88}100%{opacity:0}}
 .entrance{touch-action:none}
}

/* V36 — Citronella type + CRLN identity + independent posters */
.citronella-front>img{object-fit:contain!important;background:#000;padding:8%}
.citro-type-section{padding:42px 0;border-top:1px solid rgba(255,255,255,.18)}
.citro-type-stage{background:#f4f1e9;padding:34px;display:grid;gap:18px;overflow:hidden}
.citro-type-stage img{width:100%;height:auto;object-fit:contain;filter:none!important}
.citro-socials{margin:46px 0 12px;padding:26px 0;border-top:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25);display:flex;justify-content:space-between;gap:24px;align-items:center}
.citro-socials>span{font-size:10px;letter-spacing:.18em}.citro-socials div{display:flex;gap:10px;flex-wrap:wrap}.citro-socials a{color:inherit;text-decoration:none;border:1px solid currentColor;border-radius:999px;padding:9px 13px;font-size:11px;display:flex;gap:7px;align-items:center}.citro-socials a:hover{background:#fff;color:#050505}.citro-socials b{font-size:12px}
.crln-case{background:#121715;color:#f6f3ed}.crln-case h3,.crln-case h4,.crln-case p,.crln-case small{color:inherit}.crln-hero{display:grid;grid-template-columns:.8fr 1.2fr;min-height:500px;align-items:center;padding:50px;gap:35px}.crln-hero h3{font-size:clamp(68px,10vw,150px);line-height:.78;margin:18px 0}.crln-hero img{width:100%;max-height:560px;object-fit:contain}.crln-system{background:#ef2027;color:#111;display:grid;grid-template-columns:.7fr 1.3fr;padding:50px;gap:36px}.crln-copy h4,.crln-use h4{font-size:clamp(30px,4vw,56px);line-height:.95;margin:12px 0 20px}.crln-logos{display:grid;grid-template-columns:1fr 1fr;gap:14px}.crln-logos img{width:100%;background:#000;object-fit:contain}.crln-process{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px;background:#f5f5f2}.crln-process img{width:100%;height:420px;object-fit:cover;object-position:center}.crln-use{padding:50px;display:grid;grid-template-columns:.7fr 1.3fr;gap:20px}.crln-use>div{grid-row:span 2}.crln-use img{width:100%;max-height:650px;object-fit:contain;background:#000}
.posters-case{background:#f3f1eb;color:#0a0a0a}.posters-case h3,.posters-case h4,.posters-case p,.posters-case small{color:inherit}.poster-intro{padding:50px;display:grid;grid-template-columns:1fr 1fr;gap:40px;border-bottom:1px solid #aaa}.poster-intro h3{font-size:clamp(48px,7vw,96px);line-height:.9;margin:10px 0}.poster-feature{padding:50px;display:grid;grid-template-columns:1.2fr .8fr;gap:45px;align-items:center}.poster-feature.reverse{grid-template-columns:.8fr 1.2fr;background:#d8efc9}.poster-feature.reverse img{order:2}.poster-feature img{width:100%;max-height:760px;object-fit:contain}.poster-feature h4,.cmyk-head h4{font-size:clamp(42px,6vw,80px);line-height:.9;margin:12px 0 20px}.cmyk-head{padding:55px 50px 30px;background:#050505;color:#fff}.cmyk-head p{max-width:720px}.cmyk-grid{padding:16px;background:#050505;display:grid;grid-template-columns:1fr 1fr;gap:16px}.cmyk-grid img{width:100%;height:520px;object-fit:contain;background:#111}.cmyk-grid .wide{grid-column:1/-1;height:auto;max-height:900px}
/* consistent design card type */
.design-front .card-caption h3{font-family:'DM Sans',sans-serif!important;font-weight:600!important;letter-spacing:-.03em!important;font-size:clamp(22px,2.3vw,34px)!important;line-height:1!important;text-transform:none!important}.design-front .card-caption span{font-family:'DM Sans',sans-serif!important;font-size:10px!important;letter-spacing:.12em!important}
/* artwork fronts: allow tall work to be fully seen instead of clipped */
#artwork .art-front{overflow-y:auto!important;overflow-x:hidden!important;align-content:start!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}
#artwork .art-front>img{height:auto!important;max-height:none!important;object-fit:contain!important;display:block!important;width:100%!important}
#artwork .art-front .card-caption{position:sticky!important;bottom:0!important;z-index:3}
@media(max-width:760px){.citro-socials{align-items:flex-start;flex-direction:column}.crln-hero,.crln-system,.crln-use,.poster-intro,.poster-feature,.poster-feature.reverse{grid-template-columns:1fr;padding:28px}.crln-process{grid-template-columns:1fr}.crln-process img{height:auto}.crln-use>div{grid-row:auto}.poster-feature.reverse img{order:0}.cmyk-grid{grid-template-columns:1fr}.cmyk-grid img{height:auto}.cmyk-grid .wide{grid-column:auto}.citro-type-stage{padding:18px}}

/* V36 — Citronella type + CRLN identity + independent posters */
.citronella-front>img{object-fit:contain!important;background:#000;padding:8%}
.citro-type-section{padding:42px 0;border-top:1px solid rgba(255,255,255,.18)}
.citro-type-stage{background:#f4f1e9;padding:34px;display:grid;gap:18px;overflow:hidden}.citro-type-stage img{width:100%;height:auto;object-fit:contain;filter:none!important}
.citro-socials{margin:46px 0 12px;padding:26px 0;border-top:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25);display:flex;justify-content:space-between;gap:24px;align-items:center}.citro-socials>span{font-size:10px;letter-spacing:.18em}.citro-socials div{display:flex;gap:10px;flex-wrap:wrap}.citro-socials a{color:inherit;text-decoration:none;border:1px solid currentColor;border-radius:999px;padding:9px 13px;font-size:11px;display:flex;gap:7px;align-items:center}.citro-socials a:hover{background:#fff;color:#050505}.citro-socials b{font-size:12px}
.crln-case{background:#121715;color:#f6f3ed}.crln-case h3,.crln-case h4,.crln-case p,.crln-case small{color:inherit}.crln-hero{display:grid;grid-template-columns:.8fr 1.2fr;min-height:500px;align-items:center;padding:50px;gap:35px}.crln-hero h3{font-size:clamp(68px,10vw,150px);line-height:.78;margin:18px 0}.crln-hero img{width:100%;max-height:560px;object-fit:contain}.crln-system{background:#ef2027;color:#111;display:grid;grid-template-columns:.7fr 1.3fr;padding:50px;gap:36px}.crln-copy h4,.crln-use h4{font-size:clamp(30px,4vw,56px);line-height:.95;margin:12px 0 20px}.crln-logos{display:grid;grid-template-columns:1fr 1fr;gap:14px}.crln-logos img{width:100%;background:#000;object-fit:contain}.crln-process{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px;background:#f5f5f2}.crln-process img{width:100%;height:420px;object-fit:cover;object-position:center}.crln-use{padding:50px;display:grid;grid-template-columns:.7fr 1.3fr;gap:20px}.crln-use>div{grid-row:span 2}.crln-use img{width:100%;max-height:650px;object-fit:contain;background:#000}
.posters-case{background:#f3f1eb;color:#0a0a0a}.posters-case h3,.posters-case h4,.posters-case p,.posters-case small{color:inherit}.poster-intro{padding:50px;display:grid;grid-template-columns:1fr 1fr;gap:40px;border-bottom:1px solid #aaa}.poster-intro h3{font-size:clamp(48px,7vw,96px);line-height:.9;margin:10px 0}.poster-feature{padding:50px;display:grid;grid-template-columns:1.2fr .8fr;gap:45px;align-items:center}.poster-feature.reverse{grid-template-columns:.8fr 1.2fr;background:#d8efc9}.poster-feature.reverse img{order:2}.poster-feature img{width:100%;max-height:760px;object-fit:contain}.poster-feature h4,.cmyk-head h4{font-size:clamp(42px,6vw,80px);line-height:.9;margin:12px 0 20px}.cmyk-head{padding:55px 50px 30px;background:#050505;color:#fff}.cmyk-head p{max-width:720px}.cmyk-grid{padding:16px;background:#050505;display:grid;grid-template-columns:1fr 1fr;gap:16px}.cmyk-grid img{width:100%;height:520px;object-fit:contain;background:#111}.cmyk-grid .wide{grid-column:1/-1;height:auto;max-height:900px}
.design-front .card-caption h3{font-family:'DM Sans',sans-serif!important;font-weight:600!important;letter-spacing:-.03em!important;font-size:clamp(22px,2.3vw,34px)!important;line-height:1!important;text-transform:none!important}.design-front .card-caption span{font-family:'DM Sans',sans-serif!important;font-size:10px!important;letter-spacing:.12em!important}
#artwork .art-front{overflow-y:auto!important;overflow-x:hidden!important;align-content:start!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y}#artwork .art-front>img{height:auto!important;max-height:none!important;object-fit:contain!important;display:block!important;width:100%!important}#artwork .art-front .card-caption{position:sticky!important;bottom:0!important;z-index:3}
@media(max-width:760px){.citro-socials{align-items:flex-start;flex-direction:column}.crln-hero,.crln-system,.crln-use,.poster-intro,.poster-feature,.poster-feature.reverse{grid-template-columns:1fr;padding:28px}.crln-process{grid-template-columns:1fr}.crln-process img{height:auto}.crln-use>div{grid-row:auto}.poster-feature.reverse img{order:0}.cmyk-grid{grid-template-columns:1fr}.cmyk-grid img{height:auto}.cmyk-grid .wide{grid-column:auto}.citro-type-stage{padding:18px}}

/* V37 — Artwork fronts: never crop tall paintings; page can scroll past the card */
#artwork.carousel-page{overflow:visible!important;min-height:0!important;padding-bottom:70px!important}
#artwork .museum-carousel{height:auto!important;min-height:0!important;max-height:none!important;align-items:start!important}
#artwork .carousel-stage{height:auto!important;min-height:0!important;align-items:start!important}
#artwork .flip-wrap,#artwork .flip-card,#artwork .flip-inner{height:auto!important;min-height:0!important;max-height:none!important}
#artwork .flip-inner{display:grid!important}
#artwork .card-face{grid-area:1/1;position:relative!important;inset:auto!important;height:auto!important;min-height:0!important;max-height:none!important}
#artwork .card-front{overflow:visible!important}
#artwork .art-front>img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
#artwork .card-back{position:absolute!important;inset:0!important;height:100%!important;overflow:hidden!important}
#artwork .flip-card:not(.flipped) .card-back{pointer-events:none!important}
#artwork .flip-card.flipped .card-front{visibility:hidden!important}
#artwork .flip-card.flipped .card-back{position:relative!important;inset:auto!important;min-height:760px!important}
#artwork .flip-card.flipped .back-scroll{height:auto!important;max-height:none!important;min-height:760px!important;overflow:visible!important}
#artwork .peek{margin-top:80px}
@media(max-width:900px){#artwork .flip-card.flipped .card-back,#artwork .flip-card.flipped .back-scroll{min-height:650px!important}}
@media(max-width:600px){#artwork .flip-card.flipped .card-back,#artwork .flip-card.flipped .back-scroll{min-height:590px!important}#artwork .peek{margin-top:40px}}

/* V37 — CRLN: curated identity system, original asset proportions preserved */
.crln-hero img,.crln-logos img,.crln-use img{height:auto!important;max-height:none!important;object-fit:contain!important;background:transparent!important}
.crln-hero{min-height:0!important;align-items:center}
.crln-logos{align-items:start}
.crln-logos img{display:block;width:100%}
.crln-palette{padding:46px 50px;background:#f5f3ee;color:#121715}
.crln-palette small,.crln-palette h4{color:inherit}
.crln-palette h4{font-size:clamp(30px,4vw,54px);line-height:1;margin:10px 0 26px}
.crln-swatches{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.crln-swatch{min-height:150px;padding:18px;display:flex;align-items:flex-end;font-size:11px;letter-spacing:.12em;border:1px solid rgba(0,0,0,.12)}
.crln-swatch.red{background:#ef2027;color:#111}.crln-swatch.black{background:#121715;color:#f6f3ed}
.crln-use{align-items:start}.crln-use img{display:block;width:100%}
@media(max-width:760px){.crln-palette{padding:28px}.crln-swatches{grid-template-columns:1fr}.crln-use{grid-template-columns:1fr!important}}

/* V38 — Design case-study consistency + clean poster imagery */
/* Keep project eyebrow/kicker labels on one line and visually consistent. */
.pro-intro .eyebrow,
.citro-intro .eyebrow,
.crln-hero small,
.poster-intro small,
.ecom-intro .eyebrow,
.bing-intro .eyebrow {
  display:block;
  white-space:nowrap;
  font-size:10px;
  line-height:1.2;
  letter-spacing:.08em;
}

/* One title scale across design case studies; prevent clipping/overflow. */
.pro-intro h3,
.citro-intro h3,
.crln-hero h3,
.poster-intro h3,
.ecom-intro h3,
.bing-intro h3 {
  font-family:'DM Sans',sans-serif;
  font-size:clamp(42px,5vw,64px) !important;
  line-height:.96 !important;
  letter-spacing:-.045em !important;
  max-width:100%;
  width:auto;
  overflow:visible;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}
.poster-intro > div,
.pro-intro > div,
.citro-intro > div,
.crln-hero > div,
.ecom-intro > div {min-width:0;}

/* Poster/CMYK images should be the image only — no grey/white framing boxes. */
.posters-case img,
.poster-feature img,
.cmyk-grid img,
.cmyk-grid .wide {
  display:block;
  width:100%;
  height:auto !important;
  max-height:none !important;
  object-fit:contain;
  background:transparent !important;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:0 !important;
}
.cmyk-grid {
  background:#050505;
  padding:0;
  gap:16px;
  align-items:start;
}

@media(max-width:760px){
  .pro-intro .eyebrow,
  .citro-intro .eyebrow,
  .crln-hero small,
  .poster-intro small,
  .ecom-intro .eyebrow,
  .bing-intro .eyebrow {font-size:8px;letter-spacing:.055em;}
  .pro-intro h3,
  .citro-intro h3,
  .crln-hero h3,
  .poster-intro h3,
  .ecom-intro h3,
  .bing-intro h3 {font-size:clamp(36px,11vw,52px) !important;}
}

/* V39 — CRLN hero cleanup + sharper identity covers */
.crln-front>img{object-fit:contain!important;background:#000!important;padding:10%!important}
.crln-hero{grid-template-columns:.82fr 1.18fr!important;gap:54px!important}
.crln-hero .crln-primary-logo{width:min(100%,620px)!important;justify-self:center!important;transform:scale(1.16);transform-origin:center;display:block!important}
.citronella-front>img{image-rendering:auto;object-fit:contain!important;background:#000!important;padding:7%!important}
@media(max-width:760px){.crln-hero{grid-template-columns:1fr!important;gap:26px!important}.crln-hero .crln-primary-logo{width:min(86vw,520px)!important;transform:none!important}}

/* V40 — CRLN logo sizing: show the complete mark at a normal scale */
.crln-front>img{
  object-fit:contain!important;
  object-position:center!important;
  background:#000!important;
  padding:18%!important;
  transform:none!important;
}
.crln-hero{grid-template-columns:1fr 1fr!important;gap:42px!important;align-items:center!important;}
.crln-hero .crln-primary-logo{
  width:min(82%,460px)!important;
  max-width:460px!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  justify-self:center!important;
  transform:none!important;
  display:block!important;
}
/* Remove the tiny logo/mockup strip in the logo-system section. */
.crln-system .crln-logos{display:none!important;}
.crln-system{grid-template-columns:1fr!important;}
.crln-system .crln-copy{max-width:620px!important;}
@media(max-width:760px){
 .crln-front>img{padding:15%!important;}
 .crln-hero .crln-primary-logo{width:min(76vw,390px)!important;max-width:390px!important;}
}

/* V41 — CRLN: full uncropped logo, comfortably framed */
.crln-front>img{object-fit:contain!important;object-position:center!important;padding:22%!important;transform:none!important;}
.crln-hero .crln-primary-logo{width:min(68%,360px)!important;max-width:360px!important;height:auto!important;object-fit:contain!important;transform:none!important;}
@media(max-width:760px){.crln-front>img{padding:20%!important}.crln-hero .crln-primary-logo{width:min(64vw,320px)!important;max-width:320px!important}}

/* V43 — Artwork front: give tall paintings enough vertical room to display in full. */
.artwork-page{
  overflow:visible !important;
  padding-bottom:120px !important;
}
.artwork-page .museum-carousel{
  height:clamp(900px,112vh,1250px) !important;
  min-height:900px !important;
  max-height:none !important;
  align-items:start !important;
}
.artwork-page .carousel-stage,
.artwork-page .flip-wrap,
.artwork-page .flip-card,
.artwork-page .flip-inner,
.artwork-page .card-face{
  height:100% !important;
  max-height:none !important;
}
.artwork-page .art-front > img{
  width:100% !important;
  height:calc(100% - 92px) !important;
  object-fit:contain !important;
  object-position:center top !important;
  display:block !important;
}
.artwork-page .peek{align-self:start;margin-top:110px}
@media(max-width:900px){
  .artwork-page .museum-carousel{height:105vh !important;min-height:820px !important}
}
@media(max-width:600px){
  .artwork-page .museum-carousel{height:112vh !important;min-height:760px !important}
  .artwork-page .art-front > img{height:calc(100% - 82px) !important}
}

/* V43 — About exhibition image + longer personal bio. */
.about-front .about-photo img{object-position:center center}
.about-front .about-intro>p{max-width:600px;font-size:14px;line-height:1.72}
.about-front .about-intro h3{margin:7% 0 20px}
@media(max-width:760px){
  .about-front .about-intro>p{font-size:11.5px;line-height:1.55}
}

/* V44 — intro alignment + safe type layout + clean CMYK photos */
/* E-commerce: eyebrow/title block begins on the same top line as the body copy. */
.ecom-intro{
  align-items:start !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:56px !important;
}
.ecom-intro > div,
.ecom-intro > p{align-self:start !important;margin-top:0 !important;min-width:0 !important;}
.ecom-intro .eyebrow{margin-top:0 !important;}
.ecom-intro h3{margin:10px 0 0 !important;}

/* Subway Type Specimen: keep title and copy in separate columns, fully readable. */
.typespec-intro{
  display:grid !important;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr) !important;
  gap:64px !important;
  align-items:start !important;
  overflow:visible !important;
}
.typespec-intro > div,
.typespec-intro > p{min-width:0 !important;align-self:start !important;margin-top:0 !important;}
.typespec-intro h3{
  font-size:clamp(46px,5vw,68px) !important;
  line-height:.94 !important;
  letter-spacing:-.045em !important;
  max-width:100% !important;
  width:100% !important;
  overflow:visible !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  margin:10px 0 0 !important;
}
.typespec-intro > p{
  position:static !important;
  width:auto !important;
  max-width:520px !important;
  justify-self:start !important;
  overflow:visible !important;
}

/* CMYK process photos: image only, no CSS frame around them. */
.cmyk-grid,.cmyk-grid img,.cmyk-grid .wide{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}
.cmyk-grid img{background:transparent !important;padding:0 !important;}

@media(max-width:760px){
  .ecom-intro,.typespec-intro{grid-template-columns:1fr !important;gap:24px !important;}
  .typespec-intro h3{font-size:clamp(40px,12vw,56px) !important;}
}

/* MASTER mobile polish — full artwork, swipe + vertical reading, aligned header */
@media(max-width:760px){
  header{
    height:68px !important;
    padding-left:14px !important;
    padding-right:14px !important;
    gap:12px !important;
  }
  header .wordmark{
    margin:0 !important;
    padding:0 !important;
    white-space:nowrap !important;
    font-size:18px !important;
    letter-spacing:.025em !important;
    flex:0 1 auto !important;
    text-align:left !important;
  }
  header .wordmark i{font-size:12px !important}
  header .menu{
    margin-left:auto !important;
    padding:0 !important;
    white-space:nowrap !important;
    font-size:9px !important;
    letter-spacing:.12em !important;
  }

  .artwork-page{padding-left:0 !important;padding-right:0 !important;overflow:visible !important}
  .artwork-page .inside-controls,.artwork-page .carousel-heading{padding-left:18px !important;padding-right:18px !important}
  .artwork-page .museum-carousel{
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:0 12px !important;
    overflow:visible !important;
  }
  .artwork-page .carousel-stage{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    touch-action:pan-y !important;
  }
  .artwork-page .peek{display:none !important}
  .artwork-page .flip-wrap{width:100% !important;height:auto !important;min-height:0 !important}
  .artwork-page .flip-card{width:100% !important;height:auto !important;min-height:0 !important}
  .artwork-page .flip-inner{height:auto !important;min-height:0 !important}
  .artwork-page .card-front.art-front{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }
  .artwork-page .art-front>img{
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center top !important;
  }
  .artwork-page .card-caption{
    position:relative !important;
    width:100% !important;
    min-height:82px !important;
    padding:14px 8px 12px !important;
  }
  .artwork-page .card-caption h3{font-size:20px !important;line-height:1.08 !important}
  .artwork-page .card-caption p{font-size:10px !important}
  .artwork-page .card-caption span{font-size:7px !important}
  .artwork-page .carousel-arrow{
    position:absolute !important;
    z-index:8 !important;
    top:42% !important;
    width:36px !important;
    height:36px !important;
    background:rgba(5,5,5,.72) !important;
    color:#fff !important;
    border-color:rgba(255,255,255,.42) !important;
  }
  .artwork-page .carousel-arrow.prev{left:18px !important}
  .artwork-page .carousel-arrow.next{right:18px !important}
  .artwork-page .carousel-count{margin-top:14px !important}
  .artwork-page .flip-card.flipped .card-back{
    position:relative !important;
    inset:auto !important;
    min-height:72vh !important;
  }
  .artwork-page .flip-card.flipped .card-front{position:absolute !important;inset:0 !important}
  .artwork-page .flip-card.flipped .flip-inner{min-height:72vh !important}
}

/* MASTER V3 — mobile Design cards: full-width, readable, swipeable */
@media(max-width:760px){
  .design-page{padding-left:0!important;padding-right:0!important;overflow:visible!important;padding-bottom:90px!important}
  .design-page .inside-controls,.design-page .carousel-heading{padding-left:18px!important;padding-right:18px!important}
  .design-page .design-windows{margin-left:0!important;margin-right:0!important;padding-left:18px!important;padding-right:18px!important}
  .design-page .museum-carousel{
    position:relative!important;display:block!important;width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;
    padding:0 12px!important;overflow:visible!important;
  }
  .design-page .carousel-stage{
    display:block!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;
    touch-action:pan-y!important;
  }
  .design-page .peek{display:none!important}
  .design-page .flip-wrap,.design-page .flip-card{width:100%!important;height:auto!important;min-height:0!important;max-height:none!important}
  .design-page .flip-inner{height:auto!important;min-height:0!important;max-height:none!important}
  .design-page .card-front.design-front{
    position:relative!important;inset:auto!important;width:100%!important;height:auto!important;
    min-height:0!important;overflow:hidden!important;aspect-ratio:4/3!important;
  }
  .design-page .design-front>img{width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;display:block!important}
  .design-page .card-caption{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;padding:16px!important}
  .design-page .card-caption h3{font-size:clamp(22px,7vw,32px)!important;line-height:1!important;max-width:80%!important}
  .design-page .carousel-arrow{position:absolute!important;z-index:12!important;top:42%!important;width:36px!important;height:36px!important;background:rgba(5,5,5,.72)!important;color:#fff!important;border-color:rgba(255,255,255,.42)!important}
  .design-page .carousel-arrow.prev{left:18px!important}.design-page .carousel-arrow.next{right:18px!important}
  .design-page .carousel-count{margin-top:14px!important}
  .design-page .flip-card.flipped .card-back{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;min-height:78vh!important;transform:none!important}
  .design-page .flip-card.flipped .card-front{position:absolute!important;inset:0!important}
  .design-page .flip-card.flipped .flip-inner{min-height:78vh!important;height:auto!important;transform:none!important}
  .design-page .back-scroll{height:auto!important;max-height:none!important;overflow:visible!important;-webkit-overflow-scrolling:touch!important}
  .mobile-tilt-btn{display:block;position:absolute;z-index:20;right:14px;bottom:18px;border:1px solid rgba(255,255,255,.55);background:rgba(12,12,12,.62);color:#fff;padding:10px 12px;font:600 9px/1 'DM Sans',sans-serif;letter-spacing:.12em;backdrop-filter:blur(5px)}
  .mobile-tilt-btn.enabled{opacity:.58}
}
@media(min-width:761px){.mobile-tilt-btn{display:none!important}}

/* MASTER V4 — iOS mobile flip-face isolation.
   Safari can composite the hidden 180deg face when cards use auto-height/overflow.
   On mobile we isolate the active face completely; desktop keeps the 3D flip. */
@media(max-width:760px){
  .artwork-page .flip-inner,
  .design-page .flip-inner{
    transform:none !important;
    transform-style:flat !important;
    -webkit-transform:none !important;
  }
  .artwork-page .card-face,
  .design-page .card-face{
    -webkit-backface-visibility:hidden !important;
    backface-visibility:hidden !important;
  }
  .artwork-page .flip-card:not(.flipped) .card-back,
  .design-page .flip-card:not(.flipped) .card-back{
    display:none !important;
  }
  .artwork-page .flip-card.flipped .card-front,
  .design-page .flip-card.flipped .card-front{
    display:none !important;
    visibility:hidden !important;
  }
  .artwork-page .flip-card.flipped .card-back,
  .design-page .flip-card.flipped .card-back{
    display:block !important;
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    -webkit-transform:none !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}