:root{--clywork-black:#070707;--clywork-ink:#111;--clywork-muted:#646464;--clywork-soft:#f3f3f1;--clywork-line:rgba(0,0,0,.12);--clywork-ease:cubic-bezier(.2,.75,.25,1)} .clywork-archive,.clywork-single,.clywork-manager,.clywork-home{font-family:'Inter',system-ui,sans-serif;color:var(--clywork-ink);background:#fdfdfd} .clywork-archive h1,.clywork-archive h2,.clywork-single :where(h1),.clywork-single :where(h2),.clywork-single :where(h3),.clywork-manager h1,.clywork-manager h2,.clywork-home h2,.clywork-home h3{font-family:'Satoshi','Inter',sans-serif} .clywork-shell{width:min(1380px,calc(100% - 80px));margin:0 auto} .clywork-kicker{margin:0 0 24px;font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:#777} /* Homepage */ .clywork-home{padding:clamp(96px,8vw,140px) 0;background:#fdfdfd!important} .clywork-home-head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.65fr);gap:72px;align-items:end} .clywork-home-head h2{margin:0;max-width:900px;font-size:clamp(54px,5.6vw,92px);line-height:.92;letter-spacing:-.06em} .clywork-home-intro{padding-bottom:8px}.clywork-home-intro p{font-size:17px;line-height:1.65;color:var(--clywork-muted)} .clywork-home-intro a{display:inline-flex;margin-top:22px;gap:12px;color:#111;font-weight:800;text-decoration:none} .clywork-home-types{display:flex;gap:10px;margin-top:44px}.clywork-home-types a{padding:10px 14px;border:1px solid var(--clywork-line);border-radius:999px;color:#111;text-decoration:none;font-size:12px;font-weight:800} .clywork-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:26px} .clywork-home-card{display:block;color:#111;text-decoration:none;border-radius:26px;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);transition:transform .45s var(--clywork-ease),box-shadow .45s var(--clywork-ease)} .clywork-home-card:hover{transform:translateY(-8px);box-shadow:0 26px 60px rgba(0,0,0,.1)} .clywork-home-card figure{margin:0;aspect-ratio:16/11;overflow:hidden;background:#111}.clywork-home-card.is-wide figure{aspect-ratio:16/10} .clywork-home-card img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--clywork-ease)}.clywork-home-card:hover img{transform:scale(1.035)} .clywork-home-card>div{padding:24px 26px 28px}.clywork-home-card span{font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#666}.clywork-home-card h3{margin:12px 0 0;font-size:clamp(28px,2.5vw,44px);line-height:1;letter-spacing:-.045em}.clywork-home-card p{margin:14px 0 0;max-width:42ch;font-size:15px;line-height:1.55;color:#666} /* Archive */ .clywork-archive-hero{padding:clamp(110px,11vw,180px) 0 72px;background:#fdfdfd} .clywork-archive-hero h1{margin:0;max-width:12ch;font-size:clamp(70px,8.5vw,144px);line-height:.86;letter-spacing:-.075em} .clywork-lead{max-width:640px;margin:44px 0 0;font-size:20px;line-height:1.6;color:#5f5f5f} .clywork-filters{display:flex;flex-wrap:wrap;gap:10px;margin-top:48px}.clywork-filters a{padding:12px 17px;border:1px solid var(--clywork-line);border-radius:999px;color:#111;text-decoration:none;font-size:13px;font-weight:800}.clywork-filters a.is-active{background:#111;color:#fff;border-color:#111} .clywork-index{padding:20px 0 130px}.clywork-index-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 24px}.clywork-case-card{display:block;color:#111;text-decoration:none;min-width:0}.clywork-case-card.is-wide{grid-column:1/-1} .clywork-case-card figure{margin:0;border-radius:26px;overflow:hidden;background:#111;aspect-ratio:16/11}.clywork-case-card.is-wide figure{aspect-ratio:16/8.2}.clywork-case-card img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--clywork-ease)}.clywork-case-card:hover img{transform:scale(1.025)} .clywork-case-card-copy{padding:20px 2px 0}.clywork-case-card-copy>div{display:flex;justify-content:space-between;gap:18px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#707070}.clywork-case-card h2{margin:12px 0 0;font-size:clamp(36px,4vw,70px);line-height:.94;letter-spacing:-.055em}.clywork-case-card p{max-width:55ch;margin:15px 0 0;font-size:16px;line-height:1.55;color:#666}.clywork-case-card em{display:inline-flex;gap:10px;margin-top:20px;font-style:normal;font-weight:800} .clywork-empty{padding:90px 0;border-top:1px solid var(--clywork-line)}.clywork-empty h2{font-size:46px;margin:0}.clywork-empty p{color:#666} /* Single */ .clywork-single{background:#fdfdfd}.clywork-single-hero{padding:90px 0 70px}.clywork-back{display:inline-flex;margin-bottom:72px;color:#111;text-decoration:none;font-weight:800}.clywork-single-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.65fr);gap:72px;align-items:end}.clywork-single-hero h1{margin:0;font-size:clamp(78px,10vw,170px);line-height:.82;letter-spacing:-.08em}.clywork-single-hero h2{margin:24px 0 0;max-width:18ch;font-size:clamp(30px,3vw,52px);line-height:1;letter-spacing:-.05em;font-weight:600}.clywork-single-summary p{font-size:20px;line-height:1.65;color:#606060}.clywork-single-summary a{display:inline-flex;margin-top:18px;color:#111;font-weight:800;text-decoration:none}.clywork-single-meta{display:flex;gap:60px;margin-top:70px;padding-top:24px;border-top:1px solid var(--clywork-line)}.clywork-single-meta span{display:block;margin-bottom:9px;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#777}.clywork-single-meta p{margin:0;font-size:15px} .clywork-hero-image{margin:0;width:100%;background:#111;max-height:88vh;overflow:hidden}.clywork-hero-image img{display:block;width:100%;height:100%;max-height:88vh;object-fit:cover} .clywork-narrative{padding:120px 0}.clywork-narrative-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px}.clywork-narrative article{border-top:1px solid var(--clywork-line);padding-top:20px}.clywork-narrative article>span{font-size:12px;font-weight:800;color:#777}.clywork-narrative h2{margin:24px 0 18px;font-size:38px;line-height:1;letter-spacing:-.045em}.clywork-narrative article div{font-size:16px;line-height:1.72;color:#5d5d5d} .clywork-gallery-section{padding:80px 0 120px;background:#f0f0ed}.clywork-gallery-section.is-web{background:#111;color:#fff}.clywork-gallery-section header{max-width:800px;margin-bottom:56px}.clywork-gallery-section h2{margin:0;font-size:clamp(52px,6vw,92px);line-height:.9;letter-spacing:-.065em}.clywork-gallery{width:min(1500px,calc(100% - 40px));margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.clywork-gallery figure{margin:0;border-radius:20px;overflow:hidden;background:#ddd;min-height:420px}.clywork-gallery figure.is-wide{grid-column:1/-1;min-height:620px}.clywork-gallery img{display:block;width:100%;height:100%;object-fit:cover}.clywork-gallery-web figure{background:#222} .clywork-story{padding:110px 0;background:#fdfdfd}.clywork-story-inner{width:min(760px,calc(100% - 40px));margin:0 auto;font-size:19px;line-height:1.8;color:#383838}.clywork-story-inner h2{margin:72px 0 20px;font-size:52px;line-height:1;letter-spacing:-.05em;color:#111}.clywork-story-inner h3{margin:50px 0 16px;font-size:32px;color:#111}.clywork-story-inner img{max-width:100%;height:auto;border-radius:18px}.clywork-story-inner blockquote{margin:60px 0;padding:32px;border-left:4px solid #111;background:#f1f1ee;font-size:26px;line-height:1.4} .clywork-quote{padding:120px 0;background:#111;color:#fff}.clywork-quote blockquote{margin:0;max-width:1100px;font-family:'Satoshi','Inter',sans-serif;font-size:clamp(48px,6vw,92px);line-height:.95;letter-spacing:-.055em}.clywork-quote cite{display:block;margin-top:34px;font-family:'Inter',sans-serif;font-size:15px;font-style:normal;color:#aaa} .clywork-next{padding:96px 0;background:#fdfdfd}.clywork-next p{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#777}.clywork-next a{display:flex;justify-content:space-between;align-items:center;gap:30px;color:#111;text-decoration:none;border-top:1px solid var(--clywork-line);padding-top:28px}.clywork-next a span{font-family:'Satoshi','Inter',sans-serif;font-size:clamp(54px,7vw,110px);line-height:.9;letter-spacing:-.06em}.clywork-next a b{font-size:60px} /* Manager */ .clywork-manager{width:min(1180px,calc(100% - 40px));margin:70px auto 110px;padding:54px;border-radius:26px;background:#f3f3f1}.clywork-manager header{max-width:760px}.clywork-manager h1{margin:0;font-size:clamp(48px,6vw,84px);line-height:.9;letter-spacing:-.06em}.clywork-manager header>p:last-child{font-size:17px;line-height:1.6;color:#666}.clywork-manager-form{margin-top:50px}.clywork-manager-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.clywork-manager label{display:flex;flex-direction:column;gap:8px}.clywork-manager label.is-wide{grid-column:1/-1}.clywork-manager label>span,.clywork-editor>span{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.clywork-manager input,.clywork-manager select,.clywork-manager textarea{width:100%;box-sizing:border-box;border:1px solid rgba(0,0,0,.14);border-radius:12px;padding:14px 16px;background:#fff;font:500 15px/1.5 'Inter',sans-serif}.clywork-check{flex-direction:row!important;align-items:center}.clywork-check input{width:auto}.clywork-media-field>div{display:flex;gap:10px}.clywork-media-field button,.clywork-manager-actions button{border:0;border-radius:12px;padding:0 18px;background:#111;color:#fff;font-weight:800}.clywork-editor{margin-top:28px}.clywork-editor>span{display:block;margin-bottom:10px}.clywork-manager-actions{display:flex;align-items:center;gap:20px;margin-top:26px}.clywork-manager-actions button{padding:15px 22px;cursor:pointer}.clywork-manager-actions a{color:#111;font-weight:800}.clywork-library{margin-top:70px}.clywork-library h2{font-size:38px}.clywork-library-list{display:grid;gap:10px}.clywork-library-list article{display:flex;justify-content:space-between;gap:20px;padding:18px;border-radius:12px;background:#fff}.clywork-library-list article div{display:flex;gap:12px}.clywork-library-list article span{color:#777}.clywork-library-list nav{display:flex;gap:14px}.clywork-library-list a{color:#111;font-weight:700}.clywork-library-list a.is-delete{color:#a11}.clywork-login{max-width:700px}.clywork-login form{margin-top:30px}.clywork-login label{display:block;margin-bottom:14px} .clywork-case-card,.clywork-home-card,.clywork-narrative article,.clywork-gallery figure{opacity:0;transform:translateY(24px);transition:opacity .7s var(--clywork-ease),transform .7s var(--clywork-ease)}.clywork-case-card.is-visible,.clywork-home-card.is-visible,.clywork-narrative article.is-visible,.clywork-gallery figure.is-visible{opacity:1;transform:none} @media(max-width:1000px){.clywork-shell{width:min(100% - 40px,1380px)}.clywork-home-head,.clywork-single-hero-grid{grid-template-columns:1fr;gap:28px}.clywork-home-grid,.clywork-index-grid{grid-template-columns:1fr}.clywork-case-card.is-wide{grid-column:auto}.clywork-narrative-grid{grid-template-columns:1fr}.clywork-gallery{grid-template-columns:1fr}.clywork-gallery figure.is-wide{grid-column:auto}.clywork-single-meta{flex-wrap:wrap}.clywork-manager{padding:32px}.clywork-manager-grid{grid-template-columns:1fr}.clywork-manager label.is-wide{grid-column:auto}} @media(max-width:680px){.clywork-shell{width:calc(100% - 28px)}.clywork-archive-hero{padding-top:80px}.clywork-archive-hero h1{font-size:clamp(58px,18vw,92px)}.clywork-lead{font-size:17px}.clywork-home-grid{grid-template-columns:1fr}.clywork-single-hero h1{font-size:clamp(68px,22vw,110px)}.clywork-single-hero h2{font-size:32px}.clywork-single-meta{gap:28px}.clywork-hero-image img{min-height:420px}.clywork-gallery{width:calc(100% - 20px)}.clywork-gallery figure,.clywork-gallery figure.is-wide{min-height:300px}.clywork-next a{align-items:flex-end}.clywork-next a b{font-size:34px}.clywork-manager{width:calc(100% - 20px);margin:20px auto 70px;padding:22px}.clywork-library-list article{flex-direction:column}.clywork-media-field>div{flex-direction:column}.clywork-media-field button{padding:13px}} @media(prefers-reduced-motion:reduce){.clywork-case-card,.clywork-home-card,.clywork-narrative article,.clywork-gallery figure{opacity:1;transform:none;transition:none}.clywork-home-card img,.clywork-case-card img{transition:none}} /* v1.6.2 — sharper case study imagery */ .clywork-hero-image img, .clywork-case-card img, .clywork-home-card img, .clywork-gallery img{ image-rendering:auto; backface-visibility:hidden; -webkit-backface-visibility:hidden; } .clywork-gallery figure{ background:#f4f4f1; } .clywork-gallery-web figure{ background:#161616; } .clywork-gallery-web img{ object-fit:contain; padding:0; background:#111; } /* v1.6.3 — visual Media Library image manager */ .clywork-image-manager{display:block!important;padding:22px;border:1px solid rgba(0,0,0,.12);border-radius:18px;background:#fff} .clywork-image-manager-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px} .clywork-image-manager-head span{display:block;font-size:12px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#111} .clywork-image-manager-head small{display:block;margin-top:5px;color:#777;font-size:12px;line-height:1.45;text-transform:none;letter-spacing:0;font-weight:500} .clywork-single-image-preview{min-height:220px;display:grid;place-items:center;overflow:hidden;border:1px dashed rgba(0,0,0,.18);border-radius:14px;background:#f5f5f3} .clywork-single-image-preview.has-image{background:#111;border-style:solid} .clywork-single-image-preview img{display:block;width:100%;height:320px;object-fit:contain;background:#111} .clywork-image-empty{padding:34px;text-align:center;color:#777} .clywork-image-empty strong{display:block;margin-bottom:8px;color:#222;font-size:16px} .clywork-image-empty span{display:block;font-size:13px;line-height:1.5} .clywork-image-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px} .clywork-image-actions button{min-height:44px;border:0;border-radius:11px;padding:11px 16px;font-family:'Inter',sans-serif;font-size:13px;font-weight:800;cursor:pointer} .clywork-media-primary{background:#111;color:#fff} .clywork-media-secondary{background:#ededeb;color:#111} .clywork-image-actions button[hidden]{display:none!important} .clywork-gallery-editor{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-height:160px;padding:12px;border:1px dashed rgba(0,0,0,.18);border-radius:14px;background:#f5f5f3} .clywork-gallery-editor figure{position:relative;margin:0;overflow:hidden;border-radius:11px;background:#111;aspect-ratio:4/3;opacity:1!important;transform:none!important} .clywork-gallery-editor figure img{display:block;width:100%;height:100%;object-fit:cover} .clywork-gallery-editor figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;padding:8px 9px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.88));color:#fff;font-size:11px;font-weight:800} .clywork-gallery-editor figcaption button{width:28px;height:28px;padding:0;border:1px solid rgba(255,255,255,.25);border-radius:999px;background:rgba(0,0,0,.65);color:#fff;font-size:18px;line-height:1;cursor:pointer} .clywork-gallery-empty{grid-column:1/-1;min-height:134px;display:grid;align-content:center;justify-items:center;text-align:center;color:#777} .clywork-gallery-empty strong{color:#222;font-size:16px}.clywork-gallery-empty span{margin-top:7px;font-size:13px}.clywork-gallery-empty.is-hidden{display:none} @media(max-width:900px){.clywork-gallery-editor{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:620px){.clywork-image-manager{padding:16px}.clywork-single-image-preview img{height:220px}.clywork-gallery-editor{grid-template-columns:repeat(2,minmax(0,1fr))}.clywork-image-actions{flex-direction:column}.clywork-image-actions button{width:100%}} /* v1.6.5 — homepage feature controls */ .clywork-feature-check{align-items:flex-start!important;padding:13px 15px;border:1px solid rgba(0,0,0,.1);border-radius:12px;background:#fff}.clywork-feature-check input{margin-top:3px}.clywork-feature-check>span{display:flex;flex-direction:column;gap:3px}.clywork-feature-check strong{font-size:13px}.clywork-feature-check small{font-size:11px;line-height:1.4;color:#777;text-transform:none;letter-spacing:0;font-weight:500}.clywork-featured-badge{display:inline-flex!important;align-items:center;padding:4px 7px;border-radius:999px;background:#111;color:#fff!important;font-size:9px!important;font-weight:800;letter-spacing:.08em;text-transform:uppercase} /* v1.6.6 — all-featured homepage case-study slider */ .clywork-home-slider{position:relative;margin-top:26px;overflow:hidden} .clywork-home-slider-viewport{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:0 0 18px} .clywork-home-slider-viewport::-webkit-scrollbar{display:none} .clywork-home-track{display:flex;gap:24px;align-items:stretch;width:max-content;min-width:100%} .clywork-home-slide{flex:0 0 calc((min(1380px,calc(100vw - 80px)) - 24px)/2);width:calc((min(1380px,calc(100vw - 80px)) - 24px)/2);scroll-snap-align:start;scroll-snap-stop:always} .clywork-home-slide figure,.clywork-home-slide.is-wide figure{aspect-ratio:16/10!important} .clywork-home-slider-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:12px;padding-top:22px;border-top:1px solid var(--clywork-line)} .clywork-home-slider-status{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:800;letter-spacing:.12em;color:#777} .clywork-home-slider-status i{display:block;width:72px;height:1px;background:rgba(0,0,0,.18)} .clywork-home-slider-buttons{display:flex;gap:10px} .clywork-home-slider-buttons button{display:grid;place-items:center;width:52px;height:52px;border:1px solid rgba(0,0,0,.14);border-radius:999px;background:#fff;color:#111;font:700 22px/1 'Inter',sans-serif;cursor:pointer;transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease} .clywork-home-slider-buttons button:hover{background:#111;color:#fff;border-color:#111;transform:translateY(-2px)} .clywork-home-slider-buttons button:disabled{opacity:.28;cursor:not-allowed;transform:none} @media(max-width:1000px){.clywork-home-slide{flex-basis:calc(82vw - 40px);width:calc(82vw - 40px)}} @media(max-width:680px){.clywork-home-track{gap:14px}.clywork-home-slide{flex-basis:calc(100vw - 42px);width:calc(100vw - 42px)}.clywork-home-slider-controls{margin-top:4px}.clywork-home-slider-status i{width:40px}.clywork-home-slider-buttons button{width:46px;height:46px}} @media(prefers-reduced-motion:reduce){.clywork-home-slider-viewport{scroll-behavior:auto}} /* v1.6.7 — seamless auto-playing Featured Work slider */ .clywork-home-slider.is-autoplay .clywork-home-slider-viewport{ scroll-snap-type:none; scroll-behavior:auto; will-change:scroll-position; } .clywork-home-slider.is-autoplay .clywork-home-slide{ scroll-snap-align:none; scroll-snap-stop:normal; } .clywork-home-slider.is-autoplay .clywork-home-track{ transform:translateZ(0); } @media(prefers-reduced-motion:reduce){ .clywork-home-slider.is-autoplay .clywork-home-slider-viewport{scroll-behavior:auto} } /* ========================================================= v1.6.12 — full-image previews and uncropped case-study galleries ========================================================= */ /* Work Manager: show the complete selected image, never a crop. */ .clywork-single-image-preview.has-image{ display:block !important; min-height:0 !important; padding:12px !important; overflow:visible !important; background:#ececea !important; border-style:solid !important; } .clywork-natural-preview{ position:relative !important; display:block !important; width:100% !important; margin:0 !important; overflow:hidden !important; border-radius:11px !important; background: linear-gradient(45deg,#ddd 25%,transparent 25%), linear-gradient(-45deg,#ddd 25%,transparent 25%), linear-gradient(45deg,transparent 75%,#ddd 75%), linear-gradient(-45deg,transparent 75%,#ddd 75%) !important; background-size:24px 24px !important; background-position:0 0,0 12px,12px -12px,-12px 0 !important; } .clywork-single-image-preview .clywork-natural-preview img{ display:block !important; width:100% !important; max-width:100% !important; height:auto !important; max-height:none !important; object-fit:contain !important; object-position:center !important; margin:0 auto !important; background:transparent !important; } .clywork-image-details{ position:absolute !important; right:10px !important; bottom:10px !important; display:flex !important; align-items:flex-end !important; gap:8px !important; padding:8px 10px !important; border:1px solid rgba(255,255,255,.18) !important; border-radius:9px !important; background:rgba(0,0,0,.78) !important; color:#fff !important; backdrop-filter:blur(8px); font:600 11px/1.25 'Inter',sans-serif !important; } .clywork-image-details strong{font-size:11px !important} .clywork-image-details span{color:rgba(255,255,255,.7) !important} /* Work Manager galleries: larger cards with the full natural image visible. */ .clywork-gallery-editor{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; align-items:start !important; gap:16px !important; } .clywork-gallery-editor figure{ position:relative !important; display:flex !important; flex-direction:column !important; align-self:start !important; width:100% !important; margin:0 !important; aspect-ratio:auto !important; min-height:0 !important; overflow:hidden !important; border-radius:12px !important; background:#e8e8e6 !important; opacity:1 !important; transform:none !important; } .clywork-gallery-editor figure img{ display:block !important; width:100% !important; max-width:100% !important; height:auto !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain !important; object-position:center !important; flex:none !important; background: linear-gradient(45deg,#ddd 25%,transparent 25%), linear-gradient(-45deg,#ddd 25%,transparent 25%), linear-gradient(45deg,transparent 75%,#ddd 75%), linear-gradient(-45deg,transparent 75%,#ddd 75%) !important; background-size:18px 18px !important; background-position:0 0,0 9px,9px -9px,-9px 0 !important; } .clywork-gallery-editor figcaption{ position:static !important; display:grid !important; grid-template-columns:auto minmax(0,1fr) auto !important; align-items:center !important; gap:8px !important; width:100% !important; box-sizing:border-box !important; padding:9px 10px !important; background:#111 !important; color:#fff !important; } .clywork-gallery-index{ display:grid !important; place-items:center !important; min-width:24px !important; height:24px !important; border-radius:999px !important; background:#fff !important; color:#111 !important; } .clywork-gallery-image-details{ display:flex !important; flex-direction:column !important; justify-content:center !important; min-width:0 !important; color:#fff !important; font-size:10px !important; line-height:1.25 !important; } .clywork-gallery-image-details strong{display:block !important;color:#fff !important;font-size:10px !important} .clywork-gallery-image-details span{color:rgba(255,255,255,.62) !important} .clywork-gallery-editor figcaption button{position:static !important;align-self:center !important} /* Published case studies: retain every image's original proportions. */ .clywork-gallery{ align-items:start !important; } .clywork-gallery figure, .clywork-gallery figure.is-wide{ min-height:0 !important; height:auto !important; aspect-ratio:auto !important; align-self:start !important; overflow:hidden !important; } .clywork-gallery img, .clywork-gallery-web img, .clywork-gallery-brand img{ display:block !important; width:100% !important; max-width:100% !important; height:auto !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain !important; object-position:center !important; } .clywork-gallery-web img{background:#111 !important} .clywork-gallery-brand img{background:#f4f4f1 !important} /* Hero artwork also remains complete instead of being zoom-cropped. */ .clywork-hero-image{ max-height:none !important; overflow:visible !important; background:#111 !important; } .clywork-hero-image img{ width:100% !important; height:auto !important; min-height:0 !important; max-height:none !important; object-fit:contain !important; } @media(max-width:760px){ .clywork-gallery-editor{grid-template-columns:1fr !important} .clywork-image-details{ position:static !important; width:100% !important; box-sizing:border-box !important; justify-content:space-between !important; border-radius:0 !important; } } /* v1.6.13 — full HTML/CSS story editor */ .clywork-editor-heading{display:grid;gap:6px;margin-bottom:12px} .clywork-editor-heading>span{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase} .clywork-editor-heading>small{max-width:860px;color:#666;font:500 13px/1.55 'Inter',sans-serif} .clywork-editor .wp-editor-wrap{background:#fff;border-radius:14px;overflow:hidden;border:1px solid rgba(0,0,0,.14)} .clywork-editor .wp-editor-container{border:0!important} .clywork-editor .quicktags-toolbar{display:flex!important;flex-wrap:wrap!important;gap:4px!important;padding:8px!important;background:#f2f2ef!important;border-bottom:1px solid rgba(0,0,0,.12)!important} .clywork-editor .quicktags-toolbar input.ed_button, .clywork-editor .quicktags-toolbar input.button{display:inline-flex!important;width:auto!important;min-width:0!important;height:30px!important;margin:0!important;padding:3px 9px!important;border:1px solid #c7c7c2!important;border-radius:5px!important;background:#fff!important;color:#222!important;font:600 12px/1 'Inter',sans-serif!important;box-shadow:none!important} .clywork-editor .quicktags-toolbar input.ed_button:hover, .clywork-editor .quicktags-toolbar input.button:hover{background:#111!important;border-color:#111!important;color:#fff!important} .clywork-editor textarea.wp-editor-area{display:block!important;min-height:620px!important;border:0!important;border-radius:0!important;padding:20px!important;background:#111!important;color:#f6f6f2!important;font:500 13px/1.65 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono',monospace!important;tab-size:2} .clywork-story.has-custom-html{padding:0;background:transparent} .clywork-story.has-custom-html>.clywork-story-custom{width:100%;max-width:none;margin:0;color:inherit;font-size:initial;line-height:normal} @media(max-width:680px){.clywork-editor textarea.wp-editor-area{min-height:460px!important;padding:14px!important;font-size:12px!important}} /* v1.6.15 — autoplay remains active while the pointer is over the large section. */ .clywork-home-slider.is-autoplay:hover .clywork-home-slider-viewport{ scroll-behavior:auto; } /* ========================================================= v1.6.16 — GPU-composited Featured Work motion system ========================================================= */ .clywork-home-slider.is-transform-slider{ --clywork-progress:12.5%; overflow:visible; } .clywork-home-slider.is-transform-slider .clywork-home-slider-viewport{ position:relative; overflow:hidden !important; padding-bottom:18px; scroll-snap-type:none !important; scroll-behavior:auto !important; scrollbar-width:none; touch-action:pan-y; cursor:grab; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 2.2%,#000 97.8%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 2.2%,#000 97.8%,transparent 100%); } .clywork-home-slider.is-transform-slider .clywork-home-slider-viewport.is-dragging{ cursor:grabbing; user-select:none; } .clywork-home-slider.is-transform-slider .clywork-home-track{ display:flex; width:max-content; min-width:100%; transform:translate3d(0,0,0); transform-origin:0 50%; will-change:transform; backface-visibility:hidden; -webkit-backface-visibility:hidden; contain:layout style; } .clywork-home-slider.is-transform-slider .clywork-home-slide{ scroll-snap-align:none !important; scroll-snap-stop:normal !important; flex-shrink:0; transform:translateZ(0); backface-visibility:hidden; -webkit-backface-visibility:hidden; contain:layout paint style; } .clywork-home-slider.is-transform-slider .clywork-home-slide img{ backface-visibility:hidden; -webkit-backface-visibility:hidden; transform:translateZ(0); } .clywork-home-slider.is-transform-slider .clywork-home-slider-status i{ position:relative; overflow:hidden; background:rgba(0,0,0,.12); } .clywork-home-slider.is-transform-slider .clywork-home-slider-status i::after{ content:""; position:absolute; inset:0 auto 0 0; width:var(--clywork-progress); background:#111; transition:width .32s cubic-bezier(.22,1,.36,1); } .clywork-home-slider.is-transform-slider .clywork-home-slider-buttons button{ will-change:transform; } @media(max-width:680px){ .clywork-home-slider.is-transform-slider .clywork-home-slider-viewport{ -webkit-mask-image:none; mask-image:none; } } @media(prefers-reduced-motion:reduce){ .clywork-home-slider.is-transform-slider .clywork-home-slider-viewport{ overflow-x:auto !important; scroll-snap-type:x mandatory !important; cursor:auto; -webkit-mask-image:none; mask-image:none; } .clywork-home-slider.is-transform-slider .clywork-home-track{ transform:none !important; will-change:auto; } .clywork-home-slider.is-transform-slider .clywork-home-slide{ scroll-snap-align:start !important; } .clywork-home-slider.is-transform-slider .is-clone{display:none !important} } /* v1.6.18 — Scafox partnership credits */ .clywork-home-card figure,.clywork-case-card figure{position:relative} .clywork-scafox-badge{position:absolute;left:20px;bottom:20px;z-index:3;display:inline-flex;align-items:center;justify-content:center;max-width:calc(100% - 40px);min-height:40px;padding:11px 18px;border:1px solid rgba(255,255,255,.34);border-radius:999px;background:rgba(0,0,0,.86);color:#fff!important;font:800 12px/1 'Inter',sans-serif!important;letter-spacing:.085em!important;text-transform:uppercase;white-space:nowrap;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 28px rgba(0,0,0,.24)} .clywork-scafox-credit{display:inline-flex;margin:12px 0 22px;padding:9px 13px;border:1px solid rgba(0,0,0,.14);border-radius:999px;color:#111;text-decoration:none;font:800 11px/1 'Inter',sans-serif;letter-spacing:.08em;text-transform:uppercase;transition:background .25s ease,color .25s ease,border-color .25s ease} .clywork-scafox-credit:hover{background:#111;color:#fff;border-color:#111} .clywork-single-meta a{color:inherit;text-decoration:underline;text-underline-offset:3px} .clywork-partner-check{padding:14px 16px;border:1px solid rgba(0,0,0,.12);border-radius:12px;background:#fff} .clywork-partner-check>span{display:flex!important;flex-direction:column;gap:3px;letter-spacing:0!important;text-transform:none!important} .clywork-partner-check strong{font-size:13px;text-transform:uppercase;letter-spacing:.07em} .clywork-partner-check small{color:#777;font-size:12px;line-height:1.4} .clywork-scafox-manager-badge{display:inline-flex!important;align-items:center;padding:4px 8px;border-radius:999px;background:#111;color:#fff!important;font-size:10px!important;font-weight:800;letter-spacing:.06em;text-transform:uppercase} @media(max-width:680px){.clywork-scafox-badge{left:12px;bottom:12px;max-width:calc(100% - 24px);min-height:34px;font-size:10px!important;padding:9px 13px}}