/* Typografi — 7 november 2026 (Newsreader/Hanken upplevdes som tråkiga).
   Rubriker: Gloock — skarp, kontrastrik antikva med karaktär, besläktad med loggan.
   Löptext, menyer och länkar: Hedvig Letters Sans — svensk grotesk med egenheter
   (Kanon Foundry). Lost Highway-citatet behåller Newsreader kursiv (--quote).
   Alla OFL och lokala (licens i respektive mapp). Byt familj i --serif/--sans. */
@font-face{font-family:"Gloock";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/gloock/Gloock-normal-latin.woff2") format("woff2")}
@font-face{font-family:"Hedvig Letters Sans";font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/hedvig/HedvigLettersSans-normal-latin.woff2") format("woff2")}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url("/assets/fonts/newsreader-2026/Newsreader-normal-latin.woff2") format("woff2")}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:200 800;font-display:swap;src:url("/assets/fonts/newsreader-2026/Newsreader-italic-latin.woff2") format("woff2")}
:root,body{
 --sans:"Hedvig Letters Sans",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;
 --serif:"Gloock","Iowan Old Style",Georgia,serif;
 --quote:"Newsreader","Iowan Old Style",Georgia,serif;
 --display:var(--serif);
 --art-serif:var(--serif);
}
body,input,textarea,select,button{font-family:var(--sans)}
body{font-synthesis-weight:none;font-optical-sizing:auto;text-rendering:optimizeLegibility}
/* Headings share the serif (Gloock has one weight), with tight natural spacing. */
:is(h1,h2,.ribbon-name,.ribbon-work-heading h2,.page-hero h1,.project-hero h1,.section-heading h2,.collection-intro h1,.pullquote p,.bio-text h2,.contact-exhibition-intro h1){
 font-family:var(--serif)!important;font-weight:400!important;letter-spacing:-.018em!important;
}
:is(h3,h4,.service-list h3,.project h3){font-family:var(--sans);font-weight:500;letter-spacing:-.005em}
.ribbon-name{letter-spacing:-.016em!important}
:is(.collage-note cite,.exhibit-playback,.ribbon-number){font-family:var(--sans)}
.editorial-unlabelled{display:block}

/* Decorative, silent films never show a player (Safari/iOS start buttons included). */
video:not([controls])::-webkit-media-controls,
video:not([controls])::-webkit-media-controls-panel,
video:not([controls])::-webkit-media-controls-overlay-play-button,
video:not([controls])::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none;opacity:0!important}

/* Homepage: the white identity glides into softly tinted rooms (colours in home-exhibition.js). */
body.approved-home{
 --paper:#fff;--ink:var(--exhibit-ink,#1d1c1a);--quiet:var(--exhibit-muted,#6d6a64);
 --ui-hover-fill:var(--exhibit-ink,#1d1c1a);--ui-hover-ink:var(--exhibit-canvas,#fff);
 background:var(--exhibit-canvas,#fff)!important;color:var(--exhibit-ink,#1d1c1a)!important;
}
body.approved-home .hero{position:relative;z-index:1;background:transparent}
/* 9 nov: a clearer footer — its own dark, square panel with the collage's width and shadow,
   so the text never sits directly on the faint works behind the grain. */
body.approved-home > .site-footer.unified-footer{
 width:min(1960px,calc(100% - 2 * clamp(14px,2.6vw,56px)));box-sizing:border-box;
 margin:clamp(14px,1.6vw,28px) auto clamp(14px,2.6vw,56px);
 padding:clamp(36px,3.8vw,68px) clamp(24px,3.2vw,60px) clamp(20px,1.8vw,30px);
 background:rgb(8 8 8 / .9);box-shadow:0 30px 120px rgb(0 0 0 / .55);border:0;border-radius:0;
 --footer-colour:var(--exhibit-ink,#f6f4f0);color:var(--footer-colour);
}
body.approved-home > .site-footer.unified-footer :is(.unified-footer-main,.unified-footer-meta){max-width:none}
@media(max-width:760px){
 body.approved-home > .site-footer.unified-footer{width:calc(100% - 16px);margin:8px auto 16px;padding:30px 18px 18px}
}
body.approved-home .identity-caption{color:#1d1c1a}
body.approved-home .identity-caption .identity-location{color:#6d6a64}
body > .site-footer.unified-footer,.unified-footer-meta{border-top:0}
/* Category names sit on the photograph rather than in a coloured rectangle. */
body[data-section="photography"] .ribbon-collection .ribbon-label{
 background:transparent;color:#fff;text-shadow:0 1px 15px #0009;
}