@view-transition{navigation:none}
:root{--press-edge:clamp(18px,2.9vw,66px);--thin:#b8b6aa;--butter:#f1ebdc;--black:#24221f;--wall-ease:cubic-bezier(.2,.8,.17,1)}
.studio-front,.studio-case{background:#f6f4ec}
.studio-front .wrap,.studio-case .wrap{padding-inline:var(--press-edge);max-width:1920px}
.mast{min-height:65px}.mast:after{left:var(--press-edge);right:var(--press-edge);background:var(--thin)}
.studio-front .mast .brand>:first-child{width:62px;height:auto}.mast nav{gap:clamp(16px,2.8vw,44px);font-size:15px}
.mast .enquire,.mast .enquire:hover{width:auto;color:var(--black);background:transparent;padding:0;border-radius:0;gap:5px}
.mast nav .enquire{width:auto;white-space:nowrap}.mast .enquire span{display:inline}.mast .enquire:hover span{text-decoration:underline;text-underline-offset:4px}
.front{padding-block:clamp(16px,2vw,38px) clamp(18px,2vw,34px)}.logotype{width:100%;position:relative;margin:0;perspective:850px}
.studio-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 28px;margin-top:clamp(20px,2.6vw,42px)}
.studio-intro p{margin:0;max-width:42ch;font-size:clamp(17px,1.5vw,24px);line-height:1.45;letter-spacing:-.025em}
.studio-intro a{display:inline-flex;align-items:center;gap:8px;flex:none;min-height:44px;font-size:15px;text-decoration:underline;text-underline-offset:4px}
.studio-intro a:hover{text-decoration-thickness:2px}
@media(max-width:600px){.studio-intro{align-items:flex-start;flex-direction:column;gap:4px;margin-top:18px}.studio-intro p{font-size:17px}.studio-intro a{font-size:14px}}
.work-label{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin:0 0 8px;font-size:13px;color:#54534c}
.studio-front .mast{position:sticky;top:0;z-index:7;background:#f6f4ec}
.studio-front :is(#work,#studio,#services,#contact,#main){scroll-margin-top:70px}
.wall{scroll-margin-top:12px;padding-bottom:clamp(27px,3.6vw,66px)}
.plate-caption{display:none}
.wall-posters{container-type:inline-size;display:flex;gap:clamp(3px,.45vw,8px);height:clamp(330px,32vw,580px);isolation:isolate}
.poster{position:relative;min-width:0;flex:1 1 0;overflow:hidden;isolation:isolate;background:var(--black);touch-action:pan-y;user-select:none}
.poster[data-active=true]{flex-grow:2.8}
.poster-entry,.poster-select{position:absolute;inset:0;width:100%;height:100%;display:block}
.poster-select{z-index:3;border:0;border-radius:0;background:transparent;cursor:pointer}
.poster-select:focus-visible,.poster-entry:focus-visible{outline:3px solid #fff9ed;outline-offset:-6px;box-shadow:inset 0 0 0 7px #24221f}
.poster-art{position:absolute;inset:0 auto 0 50%;width:60cqw;transform:translateX(-50%);pointer-events:none;overflow:hidden}
.poster-art>div{position:absolute;inset:0;overflow:hidden}
.poster-action{position:absolute;inset:auto 16px 16px auto;display:inline-flex;align-items:center;gap:8px;background:#f2673e;color:#211d19;padding:8px 11px;font-size:13px;font-weight:600}
.poster[data-active=false] .poster-action{opacity:0}
.daymark-print{background:#345347}
.daymark-print>img{width:100%;height:100%;object-fit:cover;object-position:50% 66%}
.window-name{position:absolute;top:8%;left:5%;width:58%;text-align:center;transform:rotate(-6deg);color:#183c2e;filter:drop-shadow(0 1px 0 #f7e9c7)}
.window-name>span{display:block;width:100%;aspect-ratio:4286/1043;background:currentColor;mask:url(/sites/daymark-coffee/assets/daymark-lettering.svg) center/contain no-repeat}
.window-name b{display:block;font:700 clamp(12px,1.35cqw,25px)/1.15 Georgia,serif;letter-spacing:.2em;text-transform:uppercase}
.poster[data-active=false] .window-name{opacity:0}
.crumb-print{background:#f3e7cc;color:#a9341e}.pastry{position:absolute;width:84%;height:89%;max-width:none;object-fit:contain;inset:15% auto auto 10%;transform:rotate(-7deg)}
.bakery-type{position:absolute;inset:6% auto auto 6%;width:88%;height:auto}
.echo-print{background:#b6acf1;display:grid;place-items:center}.sleeve{height:81%;width:auto;max-width:82%;object-fit:contain;aspect-ratio:1;transform:translateX(-9%) rotate(-6deg);box-shadow:3px 5px 0 #252125}
.vinyl{position:absolute;width:min(28cqw,90%);aspect-ratio:1;border-radius:50%;transform:translateX(23%) rotate(-22deg);background:repeating-radial-gradient(circle,#252324 0px,#252324 1.4px,#363532 1.9px,#171614 2.6px);border:1px solid #171614}
.vinyl:after{content:"";position:absolute;inset:35%;background:#f1ad40;border-radius:50%;border:1px solid #36322a}
@media(min-width:601px){
 .poster[data-active=false] .bakery-type{width:30%;left:35%;top:15%}
 .poster[data-active=false] .pastry{width:44%;left:28%;height:76%;top:20%}
 .poster[data-active=false] .sleeve{width:30%;max-width:none;height:auto;transform:translateX(-3%) rotate(-10deg)}
 .poster[data-active=false] .vinyl{width:18cqw;transform:translateX(15%)}
}
.wall-index { --poster-gap: clamp(3px,.45vw,8px); display: grid; }
.wall-index > * { grid-area: 1 / 1; }
.wall-nav{display:flex;gap:var(--poster-gap);border-bottom:1px solid var(--thin)}
.label-measure { display: flex; gap: var(--poster-gap); visibility: hidden; pointer-events: none; border-bottom: 1px solid transparent; }
.label-measure .wall-title { flex: 0 0 calc((100% - 2 * var(--poster-gap)) / 4.8); min-width: 0; }
@media (max-width: 600px) { .label-measure { display: none; } }
.wall-nav .wall-title{min-width:0;flex:1 1 0}.wall-nav .wall-title[aria-pressed=true],.wall-nav:has(a) .wall-title:first-child{flex-grow:2.8}
.wall-title{display:flex;align-items:baseline;gap:9px;padding:13px 0 12px;min-height:46px;line-height:1.14;background:none;border:0;text-align:left;font:500 clamp(15px,1.42vw,26px)/1.12 "DM Sans",Arial,sans-serif;letter-spacing:-.045em;position:relative;color:#55544f}
.wall-order{font-size:11px;letter-spacing:0;font-family:var(--mono);flex:none}.wall-title[aria-pressed=true]{color:#1c1c18}
.wall-title[aria-pressed=true]:after{content:"";position:absolute;bottom:-2px;left:1px;width:32px;height:4px;background:#df542f;transform:skewX(-21deg)}
.wall-title:hover>span:last-child{text-decoration:underline;text-underline-offset:4px}
.wall-title > span:last-child { min-width: 0; overflow-wrap: anywhere; }
@media (min-width: 601px) and (max-width: 1100px) {
  .wall-nav .wall-title { min-height: calc(2lh + 26px); align-items: flex-start; }
}
.wall-detail { display: grid; }
.wall-note {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 10px 24px; padding-top: 12px; font-size: 16px;
}
.wall-ready .wall-note { grid-area: 1 / 1; }
.wall-ready .note-name { display: none; }
.wall-ready .wall-note[hidden] { display: flex !important; visibility: hidden; }
/* Reserve exactly the same caption space before the gallery script has loaded. */
@media (scripting: enabled) {
  .wall:not(.wall-ready) .wall-note { grid-area: 1 / 1; }
  .wall:not(.wall-ready) .note-name { display: none; }
  .wall:not(.wall-ready) .wall-note:not(:first-child) { visibility: hidden; }
}
.wall-note > div { display: flex; flex-wrap: wrap; gap: 0 22px; flex-shrink: 0; }
.wall-note a, .proof-link {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 15px;
  text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px;
}
.wall-note a:hover, .proof-link:hover { text-decoration-thickness: 2px; }

/* Folded prints share a baseline. The vacant strip above each one carries its caption. */
@media (min-width: 850px) {
  .wall .poster { --step: 0px; background: transparent; }
  .wall .poster[data-active="false"] { --step: clamp(42px,4.5vw,85px); }
  .wall .poster:last-child[data-active="false"],
  .wall .poster:first-child[data-active="false"]:has(~ .poster:last-child[data-active="true"]) {
    --step: clamp(67px,7.6vw,142px);
  }
  .wall .poster-entry, .wall .poster-select { top: var(--step); height:auto; }
  .plate-caption {
    display:block; position:absolute; left:0; right:0; top:var(--step);
    transform:translateY(calc(-100% - 6px)); white-space:nowrap;
    font:500 clamp(11px,.88vw,15px)/1.25 "DM Sans",Arial,sans-serif; color:#57544b;
  }
}
@media (min-width: 850px) and (prefers-reduced-motion: no-preference) {
  .wall .poster-entry, .wall .poster-select, .plate-caption { transition:top .82s var(--wall-ease); }
}

.studio-spread { background:#24221f; color:#f6f4ec; }
.studio-spread .proof-byline::before, .studio-case .case-title .eyebrow i {
  content:""; display:inline-block; width:17px; height:5px; border-radius:0;
  background:#f2673e; transform:skewX(-21deg);
}
.studio-spread .proof-byline::before { margin:0 10px 2px 1px; }
.studio-spread .proof-switch input { accent-color:#f2673e; }
.studio-spread :focus-visible { outline-color:#fbdabf; }
.workshop {
  display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); align-items: center;
  column-gap: clamp(32px,8vw,145px); padding-block: clamp(56px,7.6vw,138px);
}
.proof-byline { font: 13px/1.5 var(--mono); }
.workshop > *, .shop-services > *, .contact-grid > * { min-width: 0; }
.proof-copy h2 {
  margin: 18px 0 24px; max-width: 8em; overflow-wrap: anywhere;
  font: italic 500 clamp(49px,6.5vw,112px)/1.02 "Bodoni Moda",Georgia,serif;
  letter-spacing: -.055em;
}
.proof-copy > p:not(.proof-byline) { max-width: 31ch; font-size: clamp(17px,1.6vw,26px); line-height: 1.45; }
.proof-link { margin-top: 12px; }
.proof-paper { position: relative; display: grid; place-items: center; background: #e9ddc5; }
.print-layers {
  display: grid; width: min(74%,530px); margin: clamp(22px,3vw,62px) auto;
  aspect-ratio: 660 / 506;
}
.print-layers img { grid-area: 1 / 1; width: 100%; height: auto; }
.ink-proof:has([value=rust]:checked) .black-ink,
.ink-proof:has([value=black]:checked) .rust-ink { opacity: 0; }
.corner { position: absolute; width: 10px; height: 10px; border: solid #796e5c; pointer-events: none; }
.tl { top: 13px; left: 13px; border-width: 1px 0 0 1px; }
.tr { top: 13px; right: 13px; border-width: 1px 1px 0 0; }
.bl { bottom: 13px; left: 13px; border-width: 0 0 1px 1px; }
.br { bottom: 13px; right: 13px; border-width: 0 1px 1px 0; }
.proof-switch {
  display: flex; align-items: center; flex-wrap: wrap; gap: 0 20px;
  min-width: 0; padding: 5px 0 0; margin: 0; border: 0;
}
.proof-switch legend { float: left; margin: 0 auto 0 0; padding: 0; line-height: 44px; font-size: 13px; }
.proof-switch label { display: inline-flex; min-height: 44px; align-items: center; gap: 6px; font-size: 14px; cursor: pointer; }
.proof-switch input { accent-color: var(--ink); width: 15px; height: 15px; margin: 0; }
.shop-services {
  display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: start;
  gap: clamp(24px,5vw,80px); position: relative;
  padding-block: clamp(32px,4vw,70px) clamp(45px,5.8vw,95px);
}
.shop-services::before { content: ""; position: absolute; top: 0; inset-inline: var(--press-edge); border-top: 1px solid #807d71; }
.shop-services h2 { font-size: clamp(28px,3.2vw,55px); line-height: 1.08; letter-spacing: -.045em; }
.shop-services h3 { margin-bottom: 9px; font-size: 18px; }
.shop-services p { max-width: 37ch; font-size: clamp(16px,1.25vw,22px); line-height: 1.5; }
.studio-questions{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:28px clamp(40px,7vw,132px);padding-bottom:clamp(48px,6vw,100px)}
.questions-heading .eyebrow{margin:0 0 12px;color:#54534c}
.questions-heading h2{margin:0;font-size:clamp(30px,3.7vw,62px);line-height:1.05;letter-spacing:-.045em}
.questions-list{min-width:0;border-bottom:1px solid var(--thin)}
.questions-list details{border-top:1px solid var(--thin)}
.questions-list summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:16px 2px;cursor:pointer;list-style:none;font-size:clamp(16px,1.3vw,21px);font-weight:500;line-height:1.4}
.questions-list summary::-webkit-details-marker{display:none}
.questions-list summary>span{flex:none;font-size:24px;font-weight:400;line-height:1}
.questions-list details[open] summary>span{transform:rotate(45deg)}
.questions-list summary:hover{color:#963319}
.questions-list summary:focus-visible{outline:3px solid #963319;outline-offset:4px}
.questions-list details p{max-width:48ch;margin:0;padding:0 30px 22px 2px;font-size:clamp(16px,1.2vw,19px);line-height:1.6;color:#54534c}
@media(max-width:789px){.studio-questions{grid-template-columns:1fr;gap:22px}.questions-heading h2{font-size:clamp(34px,7vw,52px)}.questions-list summary{gap:14px;min-height:64px}}

.studio-front #contact, .studio-case #contact { background: #ef714c; color:#211d19; --ink:#211d19; --dim:#402119; }
.studio-front .contact-grid, .studio-case .contact-grid { align-items: start; }
.studio-front .contact-copy h2, .studio-case .contact-copy h2 {
  font-size: clamp(48px,5.4vw,94px); letter-spacing: -.055em; margin: 0 0 15px;
}
.contact-copy .mail {
  font-size: clamp(19px,2.45vw,42px); overflow-wrap: anywhere; max-width: 100%;
  line-height: 1.3; margin-bottom: 23px;
}
.contact-copy p { max-width: 34ch; }
.studio-front .enquiry-ticket {
  background: transparent; padding: 0; box-shadow: none;
}
.studio-front .enquiry-ticket::after { content: none; }
.studio-front .enquiry-ticket h3 { margin: 3px 0 18px; font-size: 23px; letter-spacing: -.035em; }
.studio-front .enquiry-ticket :is(input,select,textarea) { border-color: #663323; }
.studio-front .enquiry-ticket ::placeholder { color:var(--dim); opacity:1; }
.studio-front #contact :focus-visible, .studio-case #contact :focus-visible { outline-color:#211d19; }
.studio-front .draft-button, .studio-front .copy-button { border-radius: 0; min-height: 44px; }
.studio-front .footline, .studio-case .footline { font: 13px/1.5 "DM Sans",Arial,sans-serif; }
.studio-front .ticket-status:not(:empty) { padding-top: 8px; font-size: 15px; color: var(--ink); }
@media (max-width: 800px) {
  .workshop { column-gap: 28px; }
  .wall-note { gap: 8px 14px; align-items: start; }
  .wall-note > div { flex-shrink: 1; gap: 0 15px; }
  .proof-switch { gap: 0 12px; }
}
@media (max-width: 640px) {
  .studio-front .mast, .studio-case .mast { flex-wrap: wrap; gap: 0 14px; }
  .studio-front .mast nav, .studio-case .mast nav { flex-wrap: wrap; max-width: 100%; margin-left: auto; justify-content: flex-end; row-gap: 0; }
  .workshop { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .proof-copy h2 { max-width: none; margin: 10px 0 13px; }
  .proof-copy > p:not(.proof-byline) { max-width: 41ch; }
  .shop-services { grid-template-columns: 1fr; gap: 21px; }
  .shop-services h3 { margin-bottom: 3px; }
  .wall-note, .wall-ready .wall-note[hidden] { flex-direction: column; justify-content: start; gap: 0; }
  .work-label { font-size: 12px; }
  .proof-switch legend { float: none; margin: 0; line-height: 1.4; padding-top: 8px; }
  .proof-switch { column-gap: clamp(10px,4vw,22px); }
}
.studio-case .case-title{margin:clamp(30px,4vw,77px) 0}.studio-case .case-preview{background:var(--board);padding:clamp(12px,2.5vw,45px)}
.studio-case .preview-view{box-shadow:none}.studio-case .launch{border-radius:0}.studio-case .view-switch{border:0;border-radius:0;gap:12px}
.case-try{display:flex;width:fit-content;align-items:center;gap:6px;margin-top:13px;font-weight:600;border-bottom:1px solid}
.p-daymark-coffee{--board:#e0ddc8}.p-crumb-assembly{--board:#d7bfa2}.p-little-echo{--board:#bbafa9}
.studio-front main :focus-visible, .studio-case main :focus-visible { outline-color:#963319; }
.studio-front .studio-spread :focus-visible { outline-color:#fbdabf; }
.studio-front .poster :focus-visible { outline-color:#fff9ed; }
@media (max-width: 789px) {
  .shop-services { grid-template-columns:1fr; gap:0; padding-block:clamp(40px,7vw,65px); }
  .shop-services::before { content:none; }
  .shop-services h2 { font-size:clamp(35px,7.6vw,56px); margin-bottom:22px; line-height:1.02; }
  .shop-services > div {
    display:grid; grid-template-columns:minmax(82px,.55fr) minmax(0,1.45fr);
    gap:clamp(12px,4vw,28px); align-items:baseline; border-top:1px solid var(--thin); padding:14px 0 19px;
  }
  .shop-services > div:last-child { padding-bottom:0; }
}
@media (min-width: 790px) {
  .shop-services {
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    gap:0 clamp(40px,7vw,132px); padding-block:clamp(56px,7vw,120px);
  }
  .shop-services::before { content:none; }
  .shop-services h2 { grid-row:1 / span 2; max-width:9ch; font-size:clamp(44px,5.6vw,96px); line-height:.98; }
  .shop-services > div {
    display:grid; grid-template-columns:minmax(90px,.63fr) minmax(0,1.37fr);
    align-items:baseline; gap:18px; border-top:1px solid var(--thin); padding:16px 0 22px;
  }
  .shop-services > div:last-child { padding-bottom:0; }
}
@media (min-width: 960px) {
  .studio-case .case-title {
    display:grid; grid-template-columns:minmax(0,1.55fr) minmax(0,.75fr);
    align-items:end; gap:16px clamp(32px,6vw,100px);
  }
  .case-title .eyebrow { grid-column:1/-1; }
  .case-title h1 { margin:0; max-width:10ch; line-height:.97; }
  .case-title .case-intro { display:block; padding-bottom:.25em; }
  .case-title .case-intro .launch { margin-top:18px; }
}
.studio-case .view-switch button{border-radius:0;padding:6px 1px;background:none;color:var(--dim)}.studio-case .view-switch button[aria-pressed=true]{color:var(--black);border-bottom:2px solid currentColor}
@media(prefers-reduced-motion:no-preference){
 .poster,.wall-title{transition:flex-grow .82s var(--wall-ease)}
 .poster-action,.window-name{transition:opacity .28s}.poster-entry:hover .poster-action .arrow{transform:translate(2px,-2px)}
 .bakery-type,.pastry{transition:width .75s var(--wall-ease),height .75s var(--wall-ease),left .75s var(--wall-ease),top .75s var(--wall-ease)}
 .poster-action .arrow{transition:transform .4s var(--wall-ease)}
}
@media(max-width:800px){
 .mast{min-height:54px}.studio-front .mast .brand>:first-child{width:51px}
 .wall-posters{height:clamp(272px,39vw,330px)}
 .wall-title{gap:6px}
}
@media(max-width:600px){
 .mast nav{font-size:14px;gap:17px}.mast .enquire{min-height:40px}.mast .enquire span{display:inline}
 .front{padding-top:20px}
 .wall-posters{height:clamp(238px,66vw,355px);gap:0}.poster-art{width:100cqw}
 .wall-posters .poster[data-active=false]{display:none}.wall-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
 .poster-action{inset:auto 9px 9px auto;padding:6px 8px}.window-name{font-size:13cqw}.bakery-type{font-size:12cqw}
 .pastry{width:95%;left:4%}.vinyl{width:50cqw}.sleeve{height:auto;width:72%}
 .wall-title{display:block;align-self:stretch;padding:8px 4px 11px 0;font-size:15px;min-height:51px}.wall-order{display:block;font-size:10px;margin:0 0 3px}

}