/* KOJO Living catalogue. The palette and fonts match the approved homepage. */
#catalogue-main{padding-top:var(--hdr-h,92px);background:var(--pearl)}
.catalogue-heading{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.3rem var(--pad);color:var(--kiln)}
.catalogue-heading h1{font-size:1.6rem}.catalogue-heading p{font-size:.72rem;color:var(--umber)}
.reader{--paper-ratio:1.415;position:relative;background:#38322D;color:var(--linen);isolation:isolate}
.reader-top{min-height:50px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 1.5rem;border-bottom:1px solid rgba(239,225,212,.12)}
.reader-label{font-size:.625rem;letter-spacing:.25em;text-transform:uppercase}
.reader-top output{font-size:.75rem;font-variant-numeric:tabular-nums}
.reader-stage{height:clamp(380px,calc(100dvh - 265px),780px);min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:28px 64px;overflow:hidden}
.book-viewport{position:relative;width:100%;height:100%;overflow:auto;display:flex;align-items:center;justify-content:center;scrollbar-width:thin;scrollbar-color:var(--sandstone) transparent}
.book-pan{flex:none;transform:translateX(var(--cover-shift,0px));transition:transform .6s ease;position:relative}
.book-scale{transform:scale(var(--zoom,1));transform-origin:top left}
.book-viewport.zoomed{display:block;text-align:center;padding:20px}.book-viewport.zoomed .book-pan{margin:20px;display:inline-block;transform:none}
.book-viewport.zoomed .book-scale{pointer-events:none}
#book{position:relative;filter:drop-shadow(0 15px 16px rgba(0,0,0,.23))}
.paper{background:var(--pearl);color:var(--umber);container-type:inline-size;overflow:hidden;border:1px solid rgba(43,33,26,.1)}
.paper .inside{position:relative;width:100%;height:100%;padding:4.5cqw 4.8cqw 4cqw;display:flex;flex-direction:column;overflow:hidden}
.paper.--left .inside:after,.paper.--right .inside:after{content:"";position:absolute;top:0;bottom:0;width:3%;pointer-events:none;z-index:4}
.paper.--left .inside:after{right:0;background:linear-gradient(90deg,transparent,rgba(43,33,26,.08))}
.paper.--right .inside:after{left:0;background:linear-gradient(90deg,rgba(43,33,26,.12),transparent)}
.paper h2{color:var(--kiln);font-size:4.7cqw;line-height:1.16;font-weight:500}.paper p{font-size:2.25cqw;line-height:1.7}
.paper-kicker{font:400 1.6cqw var(--f-body);letter-spacing:.24em;text-transform:uppercase;color:var(--ochre)}
.paper-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:2cqw;border-bottom:1px solid rgba(108,35,12,.18);margin-bottom:2.4cqw}
.paper-head span:first-child{font:400 2.8cqw var(--f-mark);letter-spacing:.16em;color:var(--kiln)}
.paper-head span:last-child{font:400 1.4cqw var(--f-body);letter-spacing:.22em;color:var(--ochre);text-transform:uppercase}
.folio{margin-top:auto;padding-top:1.8cqw;display:flex;justify-content:space-between;gap:1cqw;border-top:1px solid rgba(108,35,12,.18);font:400 1.4cqw var(--f-body);color:#66574C;letter-spacing:.06em}
.paper.cover{background:var(--kiln);color:var(--linen);border-color:#57200B}.paper.cover .inside{padding:6cqw;background:linear-gradient(130deg,rgba(108,35,12,.05),rgba(43,20,8,.25)),url('assets/catalogue-cover-wall.jpg') center/cover}
.cover .cover-lockup{text-align:center;margin:auto;width:100%;color:var(--linen)}
.cover-mark{font:400 15cqw/1 var(--f-mark);letter-spacing:.2em;text-indent:.2em}
.cover-sub{display:flex;justify-content:center;align-items:center;gap:1.15em;font:300 1.65cqw var(--f-body);letter-spacing:.62em;text-indent:.62em;margin-top:2cqw}
.cover-sub i{display:block;width:3em;height:1px;background:currentColor;opacity:.6}
.cover-eyebrow,.cover-bottom{font:400 1.6cqw var(--f-body);text-transform:uppercase;letter-spacing:.28em}
.cover-bottom{display:flex;justify-content:space-between;padding-top:2cqw;border-top:1px solid rgba(239,225,212,.35)}
.cover-caption{margin-top:5cqw!important;font:300 2.2cqw var(--f-body)!important;letter-spacing:.1em}
.intro-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:5cqw;flex:1;min-height:0;padding:3cqw 0}
.intro-layout h2{font-size:5.7cqw;margin:2cqw 0 3cqw}.intro-layout p{font-size:2.1cqw}.intro-image{width:100%;height:100%;object-fit:cover;min-height:0}
.contents-title{margin:2cqw 0 5cqw}.contents-list{display:flex;flex-direction:column;gap:0}
.contents-row{font-family:var(--f-head);font-weight:500;background:none;border:0;border-top:1px solid rgba(108,35,12,.18);display:flex;align-items:center;justify-content:space-between;color:var(--kiln);padding:2.2cqw 0;font-size:3.3cqw;text-align:left;cursor:pointer}
.contents-row span:last-child{font-size:5cqw}.contents-row:hover{color:var(--ochre)}
.section .inside{padding:0}.section-text{position:absolute;inset:0;padding:7cqw;display:flex;flex-direction:column;justify-content:center;background:rgba(251,248,244,.86)}
.section .section-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.section h2{font-size:10cqw;margin:2.2cqw 0;color:var(--kiln)}.section p{max-width:30ch;font-size:2.4cqw}.section .section-no{font:400 2cqw var(--f-body);letter-spacing:.28em;color:var(--ochre)}
.section .section-foot{position:absolute;bottom:5cqw;left:7cqw;right:7cqw;border-top:1px solid rgba(108,35,12,.2);padding-top:2cqw;display:flex;justify-content:space-between;font:400 1.6cqw var(--f-body);color:var(--kiln)}
.products-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3cqw;flex:1;min-height:0;padding-bottom:2cqw}
.product-print{min-width:0;display:flex;flex-direction:column;align-items:flex-start}.panel-image-wrap{width:100%;height:29cqw;display:flex;align-items:center;justify-content:center;margin-bottom:2cqw;background:#FFFFFF}
.panel-image-wrap img{height:90%;max-width:90%;width:auto;object-fit:contain}
.product-print h3{font:600 3.1cqw var(--f-head);color:var(--kiln);line-height:1.2;overflow-wrap:anywhere}
.product-print .print-name{font:500 2.15cqw var(--f-head);color:var(--umber);margin-top:.65cqw;line-height:1.3}
.product-print .print-series{font:400 1.3cqw var(--f-body);color:#6C5C4C;margin-top:.65cqw;line-height:1.4}
.size-strip{padding:1.6cqw 0;border-top:1px solid rgba(108,35,12,.18);font:400 1.45cqw/1.7 var(--f-body);color:#5D4B3D}
.size-strip strong{font-weight:500;color:var(--kiln)}.products .folio{padding-top:1cqw}
.interlude .inside{padding:0}.interlude-image{height:100%;width:100%;object-fit:cover}.interlude-caption{position:absolute;inset:auto 0 0;background:rgba(251,248,244,.92);padding:4cqw 6cqw}.interlude-caption h2{font-size:5cqw}
.enquiry .inside,.closing .inside{justify-content:center;padding:8cqw;background:var(--linen-light)}.enquiry h2,.closing h2{font-size:7.5cqw;margin:2cqw 0 4cqw}.enquiry p,.closing p{font-size:2.6cqw}.paper-link{display:inline-block;align-self:flex-start;color:var(--kiln);border-bottom:1px solid var(--kiln);padding:2cqw 0;font:400 2cqw var(--f-body);margin-top:3cqw}
.back .inside{justify-content:center;align-items:center;text-align:center}.back h2{color:var(--linen);font-size:7cqw;max-width:13ch;margin:5cqw 0 3cqw}.back .back-brand{font:400 4cqw var(--f-mark);letter-spacing:.16em}.back address{font:300 2.1cqw/2 var(--f-body);font-style:normal}.back .paper-link{color:var(--linen);border:1px solid rgba(239,225,212,.7);padding:2cqw 3cqw;align-self:center}
.edge{position:absolute;top:50%;transform:translateY(-50%);z-index:10;border:0;color:var(--linen);background:rgba(239,225,212,.08);width:42px;height:64px;border-radius:3px;font-size:32px;cursor:pointer}.edge:hover{background:rgba(239,225,212,.18)}.edge:disabled{opacity:.22;cursor:default}.edge-prev{left:10px}.edge-next{right:10px}
.reader-toolbar{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.5rem 1rem;min-height:65px;background:var(--pearl);color:var(--kiln);padding:.7rem 1rem;border-bottom:1px solid rgba(108,35,12,.14)}
.tool{display:inline-flex;align-items:center;gap:.5rem;justify-content:center;background:none;border:1px solid transparent;padding:.6rem;min-width:40px;min-height:40px;font:400 .72rem var(--f-body);color:inherit;cursor:pointer}.tool:hover,.tool[aria-pressed="true"]{background:var(--linen-light);border-color:rgba(108,35,12,.2)}.tool:disabled{opacity:.35;cursor:default}.tool svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}.toolbar-divider{height:24px;width:1px;background:rgba(108,35,12,.2)}
.jump-form{display:flex;align-items:center;gap:.6rem;font-size:.75rem}.jump-form input{width:3.5rem;border:1px solid rgba(108,35,12,.3);background:transparent;padding:.4rem;color:var(--kiln);font:400 .8rem var(--f-body);text-align:center}
.reader-help{font-size:.7rem;color:#66574C;text-align:center;padding:1rem var(--pad);background:var(--pearl)}
#reader-status{padding:.7rem var(--pad);color:var(--kiln);background:var(--linen-light);font-size:.75rem}#reader-status:empty{display:none}
.reader:fullscreen{height:100dvh;display:flex;flex-direction:column}.reader:fullscreen .reader-stage{flex:1;height:auto}.reader:fullscreen .reader-help{display:none}
.catalogue-dialog{position:fixed;inset:0;width:min(820px,calc(100% - 2rem));max-height:85dvh;margin:auto;background:var(--pearl);color:var(--umber);border:1px solid rgba(108,35,12,.2);padding:1.5rem;box-shadow:0 24px 70px rgba(0,0,0,.3)}.catalogue-dialog::backdrop{background:rgba(43,33,26,.72)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;color:var(--kiln)}.dialog-head h2{font-size:1.5rem}.dialog-search{display:block;width:100%;padding:.8rem;border:1px solid rgba(108,35,12,.3);background:transparent;color:var(--umber);font:300 .9rem var(--f-body)}
.section-jumps{display:flex;gap:.5rem;flex-wrap:wrap;margin:1rem 0}.section-jumps button{border:1px solid rgba(108,35,12,.25);background:var(--linen-light);padding:.5rem .8rem;font:400 .75rem var(--f-body);color:var(--kiln);cursor:pointer}
.index-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin-top:1rem}.index-item{display:flex;align-items:center;gap:1rem;text-align:left;border:1px solid rgba(108,35,12,.12);background:none;padding:.7rem;color:var(--umber);font:300 .78rem var(--f-body);cursor:pointer}.index-item img{width:34px;height:65px;object-fit:contain;background:white}.index-item b{display:block;font-weight:500;color:var(--kiln)}.index-item small{display:block;font-size:.68rem;color:#65584D}.index-item:hover{background:var(--linen-light)}
.flat-catalogue{max-width:1350px;margin:auto;padding:2rem var(--pad);background:var(--pearl)}.flat-catalogue h2{margin:2rem 0;color:var(--kiln);font-size:2rem}.flat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem}.flat-product{background:white;border:1px solid rgba(108,35,12,.12);padding:1.2rem}.flat-product img{height:230px;max-width:100%;margin:auto;object-fit:contain}.flat-product h3{font-size:1.2rem;color:var(--kiln);margin:1rem 0 .4rem}.flat-product p{font-size:.8rem}.flat-product .flat-size{font-size:.7rem;margin-top:.8rem}.flat-product a{display:block;margin-top:1rem;font-size:.75rem;text-decoration:underline;color:var(--ochre)}
[hidden]{display:none!important}
@media(max-width:820px){.catalogue-heading{padding:1rem var(--pad)}.catalogue-heading h1{font-size:1.3rem}.catalogue-heading p{display:none}.reader-stage{height:clamp(280px,calc(100dvh - 280px),550px);padding:20px 25px}.edge{width:25px;height:50px;font-size:25px;background:transparent}.edge-prev{left:0}.edge-next{right:0}.reader-top{padding:.65rem 1rem}.reader-label{font-size:.52rem}.reader-toolbar{gap:.25rem;padding:.4rem}.tool{font-size:.65rem;padding:.45rem}.tool-label{display:none}.toolbar-divider{margin:0 .3rem}.jump-form{gap:.3rem}.reader-help{font-size:.65rem}.index-results{grid-template-columns:1fr}.book-pan{transition:none}}
@media(prefers-reduced-motion:reduce){.book-pan{transition:none}}
@media print{#hdr,.nav-panel,.search,.site-footer,.catalogue-heading,.reader,.reader-help,.review-ui{display:none!important}#catalogue-main{padding:0}.flat-catalogue{display:block!important}.flat-grid{grid-template-columns:repeat(3,1fr)}.flat-product{break-inside:avoid}.flat-product img{height:150px}}

/* back cover without a tagline: room between the wordmark and the contact lines */
.back .cover-sub{margin-bottom:5cqw}
