/* Hollin & Pye v2 — cover + homepage spreads */
.cover{padding:clamp(14px,2vw,24px) 0 clamp(48px,6vw,96px)}
.issue-line{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding-bottom:12px;border-bottom:1px solid var(--ink)}
.mast{display:flex;justify-content:space-between;align-items:baseline;gap:.1em;font:700 calc((min(100vw,1440px) - 2 * var(--gut)) / 4.38)/.8 var(--disp);text-transform:uppercase;letter-spacing:-.012em;margin:clamp(10px,1.4vw,18px) 0 0;padding-bottom:clamp(10px,1.4vw,18px);border-bottom:6px solid var(--ink);white-space:nowrap}
.mast .amp{font-weight:200;color:var(--acc)}
.cover-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);row-gap:28px;margin-top:clamp(20px,2.6vw,36px)}
.cv-main{grid-column:1/8;grid-row:1/3}
.cv-main .cap{margin-top:10px}
.cv-copy{grid-column:8/13;grid-row:1;align-self:start;display:grid;gap:20px;padding-top:4px}
.cv-copy .h1{font-size:clamp(46px,5.2vw,84px)}
.cv-cta{display:flex;gap:10px;flex-wrap:wrap}
.coverlines{border-top:1px solid var(--ink)}
.coverlines a{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:18px}
.coverlines a:hover{color:var(--acc)}
.coverlines .num{font-size:12px;letter-spacing:.06em;color:var(--acc)}
.cv-a,.cv-b{grid-row:2;align-self:start}
.cv-a{grid-column:8/10}
.cv-b{grid-column:10/13;margin-top:clamp(24px,3vw,48px)}
.cv-a .cap,.cv-b .cap{margin-top:8px;font-size:14px}
.cv-a img,.cv-b img{aspect-ratio:4/5;object-fit:cover;width:100%}
@media (max-width:860px){
 .cover-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cv-main{grid-column:1/-1;grid-row:auto}
 .cv-copy{grid-column:1/-1;grid-row:auto}
 .cv-a{grid-column:1;grid-row:auto}.cv-b{grid-column:2;grid-row:auto;margin-top:48px}
 .mast{border-bottom-width:4px}
}
/* contents */
.contents{padding-top:0}
.contents-grid{display:grid;grid-template-columns:5fr 7fr;gap:clamp(24px,4vw,64px);align-items:start}
.contents-l{display:grid;gap:28px}
.contents-l figure{max-width:340px}
.contents-l .cap{margin-top:8px}
.index a{display:grid;grid-template-columns:56px 1fr auto 72px;gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none}
.index a:first-child{border-top:1px solid var(--ink)}
.index .n{font:500 12px/1 var(--mono);color:var(--acc)}
.index .t{font:700 clamp(26px,2.6vw,38px)/1 var(--disp);text-transform:uppercase}
.index .c{font:400 12px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.index .th{width:72px;aspect-ratio:4/5;overflow:hidden;background:var(--proof)}
.index .th img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .3s}
.index a:hover .t{color:var(--acc)}
.index a:hover .th img{filter:none}
@media (max-width:860px){.contents-grid{grid-template-columns:1fr}.index a{grid-template-columns:40px 1fr auto 56px;gap:10px}.index .th{width:56px}}
/* spreads */
.sp-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);row-gap:28px;align-items:start}
.sp-photo{grid-column:1/9}
.sp-side{grid-column:9/13;display:grid;gap:18px}
.sp-dek{font-size:17px}
@media (max-width:960px){.sp-photo,.sp-side{grid-column:1/-1}}
.spot.hl{transform:translate(-50%,-50%) scale(1.18);background:var(--ink)}
.pop.below{left:0;right:0;top:calc(100% + 8px);width:auto}
.double{background:var(--proof)}
.dbl-h{margin-bottom:clamp(20px,3vw,40px)}
.dbl{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:start}
.dbl-page{display:grid;gap:14px;padding:0 clamp(14px,2.4vw,40px)}
.dbl-page:first-child{padding-left:0;border-right:1px solid var(--ink)}
.dbl-page:last-child{padding-right:0;margin-top:clamp(40px,8vw,140px)}
.dbl-page .credits li:first-child{border-top-color:var(--ink)}
@media (max-width:860px){.dbl{grid-template-columns:1fr;gap:56px}.dbl-page{padding:0!important;border:0!important;margin:0!important}}
/* new in collage */
.new-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 20px;align-items:start}
.new-grid .card.big{grid-column:span 2;grid-row:span 2}
.new-grid .card.big .card-name{font-size:24px}
.new-grid .card.off{margin-top:64px}
@media (max-width:760px){.new-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 12px}.new-grid .card.off{margin-top:0}}
/* maker */
.maker-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);row-gap:28px;align-items:center}
.maker-img{grid-column:1/7}
.maker-img .cap{margin-top:10px}
.maker-copy{grid-column:8/13;display:grid;gap:18px}
.pull{font:200 clamp(30px,3vw,46px)/1.05 var(--disp);text-transform:uppercase;border-left:4px solid var(--acc);padding-left:18px}
.maker-list a{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);text-decoration:none}
.maker-list li:first-child a{border-top:1px solid var(--ink)}
.maker-list a:hover span:first-child{text-decoration:underline}
.maker-list .num{font-size:14px}
@media (max-width:960px){.maker-img,.maker-copy{grid-column:1/-1}}
/* workshop listings */
.ws-list{border-top:1px solid var(--ink)}
.ws-row{display:grid;grid-template-columns:120px 1fr 180px auto;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.ws-date{font:700 56px/.9 var(--disp)}
.ws-date span{display:block;font:500 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;margin-top:6px}
.ws-row h3{font:700 clamp(22px,2vw,30px)/1.05 var(--disp);text-transform:uppercase}
.ws-row p{margin:4px 0 0;color:var(--ink-2);font-size:16px}
.ws-left{font:500 12px/1.3 var(--mono)!important;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)!important}
@media (max-width:760px){.ws-row{grid-template-columns:72px 1fr;gap:6px 16px;align-items:start}.ws-date{font-size:40px;grid-row:span 3}.ws-row .btn{justify-self:start;margin-top:8px}}
/* colour page */
.colour{background:var(--acc);color:#fff;margin-top:clamp(24px,4vw,48px)}
.colour-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);align-items:stretch}
.colour-copy{grid-column:1/6;display:grid;gap:20px;align-content:center;padding:clamp(48px,7vw,104px) 0}
.colour-copy .folio{margin-bottom:0}
.colour-img{grid-column:7/13;margin-right:calc(-1 * var(--gut))}
.colour-img{display:flex}
.colour-img picture{flex:1;display:block}
.colour-img img{width:100%;height:100%;object-fit:cover;min-height:360px}
.gift-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.gift-links a{font:500 13px/1.6 var(--mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px}
.gift-links a:hover{text-decoration-thickness:2px}
.btn-white{background:#fff;color:var(--ink);border-color:#fff;justify-self:start}
.btn-white:hover{background:var(--ink);border-color:var(--ink);color:#fff}
@media (max-width:960px){.colour-copy{grid-column:1/-1;padding-bottom:32px}.colour-img{grid-column:1/-1;margin:0 calc(-1 * var(--gut))}}
/* visit */
.visit-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);row-gap:28px;align-items:start}
.visit-grid .spread-img{grid-column:1/7}
.visit-copy{grid-column:8/13;display:grid;gap:16px}
.hours{width:100%;border-collapse:collapse;font:400 14px/1.4 var(--mono)}
.hours th,.hours td{text-align:left;padding:9px 0;border-bottom:1px solid var(--line);font-weight:400}
.hours td{text-align:right}
.hours .is-today th,.hours .is-today td{font-weight:500;color:var(--acc)}
@media (max-width:960px){.visit-grid .spread-img,.visit-copy{grid-column:1/-1}}
/* journal */
.jgrid{display:grid;grid-template-columns:7fr 5fr;gap:clamp(20px,3vw,40px)}
.jcard a{display:grid;gap:10px;text-decoration:none}
.jcard img{width:100%;aspect-ratio:3/2;object-fit:cover}
.jcard h3{font:700 clamp(24px,2.2vw,34px)/1 var(--disp);text-transform:uppercase}
.jcard a:hover h3{color:var(--acc)}
.jcard p{margin:0}
.jmeta{font:400 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2)}
.jside{display:grid;gap:24px;align-content:start}
.jside .jcard a{grid-template-columns:44% 1fr;align-items:start;gap:16px}
.jside .jcard h3{font-size:clamp(20px,1.7vw,26px)}
@media (max-width:860px){.jgrid{grid-template-columns:1fr}}
@media (max-width:480px){.jside .jcard a{grid-template-columns:1fr}}