/* KH-WEB-03 v1 rollout + KH-WEB-05 v1 + KH-WEB-06 v1 (2026-11-03). Shared editorial system for all local pages.
   Fonts, tokens, heading scale and paper tokens: brand-core.css.
   Type: Archivo = hierarchy/nav/buttons; Instrument Serif = editorial headlines; Special Elite = metadata/captions.
   Vermilion (--red) is an accent only: rules, borders, marks; never text under 24px.
   KH-WEB-06 paper system (supersedes "paper only on the guest feature"), one set of components:
     1. paper base on every page (body: --paper-base + near-flat grain)
     2. torn-paper transitions (.paper-band, .page-title, .site-footer edges via --torn; .tear image layers on Home)
     3. clippings as the card component (.clip-card: flat tint, tape, torn foot)
     4. newsprint/halftone for every photographic still (.newsprint)
   Text always sits on a flat paper tint at WCAG AA. Home has one motion (the spray K); reduced motion turns it off. */

/* 1. Base */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}
body{background:var(--paper-base) var(--paper-grain) repeat;background-size:400px 400px;color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
img,video{max-width:100%}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
h1,h2,h3{font-weight:400;text-wrap:balance}
p{text-wrap:pretty}
em{font-style:normal}
ul,ol.frames{list-style:none}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--light);padding:12px 16px;z-index:9}
.skip:focus{left:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.wrap{max-width:1320px;margin:0 auto;padding:0 60px}

/* 2. Paper system components (KH-WEB-06) */
.paper-band,.page-title,.site-footer{position:relative;background:var(--paper-deep)}
.paper-band::before,.paper-band::after,.page-title::after,.site-footer::before{content:"";position:absolute;left:0;right:0;height:18px;background:var(--paper-deep);clip-path:var(--torn);pointer-events:none}
.paper-band::before,.site-footer::before{bottom:calc(100% - 1px)}
.paper-band::after,.page-title::after{top:calc(100% - 1px);transform:scaleY(-1)}
.wrap>.paper-band,main>.wrap .paper-band{padding-left:40px;padding-right:40px}
.clip-card{position:relative;background:var(--paper-flat);box-shadow:0 1px 1px rgba(22,18,15,.08),0 14px 26px -18px rgba(22,18,15,.5);transform:rotate(var(--tilt,0deg))}
.clip-card::before{content:"";position:absolute;top:-11px;left:50%;width:84px;height:22px;margin-left:-42px;background:var(--paper-tape);box-shadow:0 1px 2px rgba(22,18,15,.14);transform:rotate(-2.5deg);pointer-events:none}
.clip-card::after{content:"";position:absolute;left:0;right:0;top:calc(100% - 1px);height:12px;background:inherit;clip-path:var(--torn);transform:scaleY(-1);pointer-events:none}
:where(.clip-card:nth-child(3n+1)){--tilt:-.5deg}
:where(.clip-card:nth-child(3n+2)){--tilt:.4deg}
:where(.clip-card:nth-child(3n)){--tilt:-.2deg}
.newsprint{position:relative;isolation:isolate}
.still{display:block}
.newsprint img,.newsprint video{filter:var(--newsprint)}
.newsprint::after{content:"";position:absolute;inset:0;z-index:1;background:var(--halftone);mix-blend-mode:multiply;opacity:.5;pointer-events:none}
/* Torn-paper image layers on Home (Room and Road), decorative only */
.tear{width:100%;height:64px;background-repeat:no-repeat;background-color:transparent}
.tear-room{height:84px;background-image:url('/assets/rm-03.webp');background-size:100% 170px;background-position:center}
.tear-room-tape{height:58px;background-image:url('/assets/rm-04.webp');background-size:100% auto;background-position:center 78%}
.tear-road{height:auto;aspect-ratio:100/12;background-image:url('/assets/rd-04.webp');background-size:100% auto;background-position:center 61.8%}

/* 3. Header with issue bar inside it */
.top{border-bottom:1px solid var(--line)}
.issue{border-bottom:1px solid var(--ink)}
.issue .wrap{display:flex;justify-content:space-between;gap:16px;font:400 13px/1.3 var(--label);padding-top:10px;padding-bottom:10px;letter-spacing:.04em}
.issue .preview{color:var(--meta);text-align:right}
.top>.wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:18px;padding-bottom:18px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:44px;height:44px;display:block}
.top nav{display:flex;gap:28px}
.top nav a{display:inline-flex;align-items:center;min-height:44px;font:600 13px/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid transparent}
.top nav a:hover{border-bottom-color:var(--red)}
.top nav a[aria-current="page"]{border-bottom-color:var(--ink)}

/* 4. Home hero and rail */
.hero .wrap{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;padding-top:44px;padding-bottom:28px;align-items:end}
.hero figure{grid-column:1/8}
.hero figure .frame{overflow:hidden;aspect-ratio:2200/1054;background:var(--line)}
.hero figure img{display:block;width:100%;height:100%;object-fit:cover}
.hero figcaption{font:400 13px/1.4 var(--label);margin-top:10px;color:var(--ink)}
.copy{grid-column:8/13;padding-bottom:6px}
.kicker{display:inline-block;font:700 12px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;border-left:6px solid var(--red);padding:2px 0 2px 10px}
.copy h1{font:400 var(--h1)/1.08 var(--serif);letter-spacing:-.015em;margin:20px 0 22px}
.standfirst{font:400 26px/1.25 var(--serif);max-width:24ch}
/* Spray-painted K over the C: culture given -> Kulture defined. The one motion on Home. */
.kword{position:relative;display:inline-block;white-space:nowrap}
.kword .c{color:var(--ink)}
.kword .spray{position:absolute;left:-.18em;top:-.2em;height:1.36em;width:auto;max-width:none;pointer-events:none;
  animation:spray calc(var(--motion-time) * 1.6) .35s cubic-bezier(.2,.7,.2,1) both}
@keyframes spray{from{opacity:0;transform:scale(1.15) rotate(-4deg)}to{opacity:1;transform:none}}
.sub{font-size:17px;line-height:1.5;max-width:36ch;margin-top:14px}
.hosts{font:400 14px/1.4 var(--label);margin-top:18px;letter-spacing:.03em}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:30px}
.rail .wrap{display:grid;grid-template-columns:repeat(3,1fr);column-gap:32px;padding-top:12px;padding-bottom:64px}
.rail article{border-top:2px solid var(--ink);padding:16px 20px 8px}
.rail h2{font:700 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.rail p{font:400 26px/1.15 var(--serif);margin-top:10px}
.rail a{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;font:400 13px/1 var(--label);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}

/* 5. Buttons and links */
.button{display:inline-flex;align-items:center;gap:10px;min-height:46px;background:var(--ink);color:var(--light);border:0;text-decoration:none;font:600 14px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:14px 22px}
.button:hover{background:#000}
.button:disabled,.button[aria-disabled="true"]{background:var(--line);color:var(--ink)}
.text-link{display:inline-flex;align-items:center;gap:.35em;min-height:44px;font:600 15px/1.2 var(--sans);text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:2px;text-underline-offset:6px}
.text-link:hover{text-decoration-color:var(--ink)}

/* 6. Shared section system */
.section{padding:84px 0}
.section-tight{padding:48px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:32px;border-top:2px solid var(--ink);padding-top:16px;margin-bottom:44px}
.section-head>p{font:400 14px/1.5 var(--label);color:var(--meta);max-width:30ch;text-align:right}
.eyebrow{font:700 12px/1.5 var(--sans);letter-spacing:.16em;text-transform:uppercase;margin-bottom:14px}
.display{font:400 var(--h2)/1.04 var(--serif);letter-spacing:-.015em}
.meta,.caption{font:400 13px/1.5 var(--label);color:var(--meta)}
.caption span{margin-left:.6em}
.pending-stamp{display:inline-block;font:400 13px/1.3 var(--label);color:var(--ink);background:var(--paper-flat);border:1.5px solid var(--red);padding:8px 12px;letter-spacing:.04em;text-transform:uppercase;text-align:left}
.section-head>.pending-stamp{max-width:none}
.photo-credit{font:400 13px/1.5 var(--label);color:var(--meta);margin-top:26px;border-top:1px solid var(--line);padding-top:12px}
.split{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px}

/* 7. Inner page title (torn band) */
.page-title .wrap{padding-top:56px;padding-bottom:44px}
.page-title h1{font:400 var(--h1)/1.04 var(--serif);letter-spacing:-.015em;margin-top:20px;max-width:18ch}
.page-title .standfirst{margin-top:22px;max-width:34ch}

/* 8. Home: manifesto */
.manifesto .split>.eyebrow{grid-column:1/4;border-top:2px solid var(--ink);padding-top:16px}
.manifesto .split>div{grid-column:4/13;border-top:1px solid var(--line);padding-top:16px}
.columns{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:32px;max-width:860px}
.columns p{font-size:18px;line-height:1.6}

/* 9. Home: the hosts, in their words (KH-WEB-05) */
.voice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.voice{display:flex;flex-direction:column;padding:16px 16px 18px}
.voice-cut{aspect-ratio:5/4;background:var(--paper);border-bottom:2px solid var(--ink);display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.voice-cut img{display:block;width:auto;height:94%;max-width:96%;object-fit:contain;object-position:bottom}
.voice blockquote{margin-top:22px;font:400 25px/1.28 var(--serif);flex:1}
.voice blockquote::before{content:"\201C";display:block;font:400 64px/.6 var(--serif);color:var(--red);height:.36em}
.voice figcaption{margin-top:20px;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:4px}
.voice-name{font:700 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.voice-source{font:400 13px/1.4 var(--label);color:var(--meta)}

/* 10. Home: series (The Room / On the Road) */
.series{padding-top:0}
.series .section-head{margin-top:72px}
.series-story{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:center;padding:36px 0}
.film{grid-column:1/8;position:relative;padding:24px;background:var(--paper) center/cover no-repeat}
.series-story.room .film{background-image:url('/assets/rm-01.webp')}
.series-story.road .film{grid-column:6/13;grid-row:1;background-image:url('/assets/rd-01.webp')}
.film img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;box-shadow:0 1px 0 var(--ink)}
.play-film{position:absolute;left:44px;bottom:44px;display:inline-flex;align-items:center;gap:10px;min-height:44px;background:var(--ink);color:var(--light);border:0;padding:12px 18px;font:600 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase}
.play-film:hover{background:#000}
.play-film:focus-visible{outline:3px solid var(--light);box-shadow:0 0 0 6px var(--ink)}
.series-copy{grid-column:8/13}
.series-story.road .series-copy{grid-column:1/6;grid-row:1}
.series-copy h3{font:400 var(--h3)/1.04 var(--serif);letter-spacing:-.01em;margin-bottom:14px}
.series-copy>p:not(.eyebrow):not(.serif-note){font-size:17px;line-height:1.6;max-width:42ch}
.serif-note{font:400 26px/1.2 var(--serif);margin-top:20px;border-left:6px solid var(--red);padding-left:14px}
.road-sticker{margin-top:26px;max-width:300px}
.road-sticker img{display:block;width:100%;height:auto;border:1px solid var(--line)}

/* 11. Home: follow-story teaser */
.follow-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:center}
.chapter{grid-column:1/7}
.chapter>p:not(.eyebrow){margin:22px 0 10px;max-width:46ch;font-size:18px;line-height:1.6}
.news-preview{grid-column:8/13;position:relative;padding:88px 48px 92px;background:var(--light) url('/assets/rd-06.webp') center/100% 100% no-repeat}
.news-preview h3{font:400 var(--h3)/1.08 var(--serif);margin:6px 0 16px}
.news-preview>p:not(.eyebrow){font-size:16px}
.issue-stamp{position:absolute;top:26px;right:30px;font:400 13px/1.2 var(--label);background:var(--light);border:1.5px solid var(--red);padding:6px 8px;text-align:center;transform:rotate(4deg)}
.fine-print{display:block;margin-top:22px;font:400 13px/1.3 var(--label);color:var(--meta)}

/* 12. Home: invitation */
.invite{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:center;border-top:2px solid var(--ink);padding-top:44px}
.invite-copy{grid-column:1/7}
.invite-copy .button{margin-top:28px}
.invite-copy .meta{margin-top:18px}
.invite-poster{grid-column:8/12;max-width:480px;padding:30px;background:var(--paper) url('/assets/rm-05.webp') center/cover no-repeat}
.invite-poster img{display:block;width:100%;height:auto;box-shadow:0 6px 18px rgba(22,18,15,.18)}
.invite-poster figcaption{display:flex;justify-content:space-between;gap:10px;margin-top:12px;background:var(--light);padding:6px 8px;font:400 13px/1.3 var(--label)}

/* 13. Footer (shared by every page, torn top edge) */
.site-footer{margin-top:64px}
.site-footer .wrap{display:flex;justify-content:space-between;align-items:flex-start;gap:32px;padding-top:28px;padding-bottom:44px}
.footer-title{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.site-footer .wrap>div>p{font-size:15px;margin-top:6px}
.footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;column-gap:24px}
.footer-links a{display:inline-flex;align-items:center;gap:.35em;min-height:44px;font:600 13px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border-bottom:2px solid transparent}
.footer-links a:hover{border-bottom-color:var(--red)}
.footer-links>span{font:400 13px/1 var(--label);color:var(--meta)}

/* 14. Film dialog (site.js) */
#film-dialog{margin:auto;width:min(960px,calc(100% - 32px));max-height:calc(100% - 32px);border:1px solid var(--ink);background:var(--light);color:var(--ink);padding:20px}
#film-dialog::backdrop{background:rgba(22,18,15,.82)}
.dialog-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}
.dialog-top h2{font:400 var(--h4)/1.1 var(--serif)}
#close-film{min-height:44px;padding:0 16px;background:var(--ink);color:var(--light);border:0;font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase}
#film-player{display:block;width:100%;aspect-ratio:16/9;background:var(--ink)}
#film-description{margin-top:12px;font:400 13px/1.5 var(--label);color:var(--meta)}

/* 15. WANTED poster component */
.wanted-sheet{container-type:inline-size;background:var(--paper) url('/assets/kh-img-01.webp') center/cover;padding:21px 25px 14px;border:1px solid var(--line);scroll-margin-top:20px}
.poster-mast{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:1px}
.poster-mast>img{width:34px;height:34px}
.poster-mast>span:last-child{margin-left:auto;font:600 12px/1.25 var(--sans);letter-spacing:.06em;text-align:right}
.poster-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;border-block:1px solid var(--ink);padding:6px 0;margin-top:10px;font:16px var(--label)}
.poster-meta>span:last-child{font:12px var(--sans);letter-spacing:.06em}
.wanted-heading{font:400 clamp(56px,20cqi,102px)/1.15 var(--serif);text-align:center;letter-spacing:1px}
.portrait-slot{position:relative;background:var(--ink);border:1px solid var(--ink);outline:1px solid var(--ink);outline-offset:4px;aspect-ratio:1.25;margin:5px 4px 12px;overflow:hidden;view-transition-name:kulture-guest-portrait}
.source-portrait{isolation:isolate}
.portrait-cover,.portrait-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.portrait-video[hidden]{display:none}
/* Centre seat (host Aafthab, layout sample): source rectangle x350 y135 w300 h240 in 960x540. */
.source-portrait .portrait-cover,.source-portrait .portrait-video{width:320%;height:225%;max-width:none;left:-116.666667%;top:-56.25%;right:auto;bottom:auto;object-fit:fill}
.poster-story-link{display:block;text-decoration:none}
.poster-story-link:hover .portrait-slot{outline-color:var(--red)}
.guest-name{font:40px/1.1 var(--serif);text-align:center;margin:17px 0 12px}
.wanted-for{text-align:center;border-top:1px solid;padding:10px 0}
.wanted-for>span,.last-seen>span{font:16px var(--label)}
.wanted-for p{font:25px/1.15 var(--serif);margin:4px 0 3px}
.last-seen{border-block:1px solid;padding:9px 0;display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.last-seen b{font:500 13px var(--sans)}
.poster-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;padding-top:10px;font:12px var(--sans);letter-spacing:.3px}
.portrait-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:14px 0;font:400 13px/1.5 var(--label);color:var(--meta)}
.portrait-controls button{min-height:44px;background:var(--ink);color:var(--light);border:1px solid var(--ink);padding:0 16px;font:600 13px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.portrait-controls button:disabled{background:var(--line);color:var(--ink);border-color:var(--line)}
/* Torn-edge frames around the poster (rd-02 portrait) and the story header (rm-02 landscape) */
.guest-frame{position:relative;isolation:isolate;padding:11% 12%}
.guest-frame::before{content:"";position:absolute;inset:0;z-index:-1;background:url('/assets/rd-02.webp') center/100% 100% no-repeat;pointer-events:none}
.guest-frame-wide{position:relative;isolation:isolate;padding:7% 8%}
.guest-frame-wide::before{content:"";position:absolute;inset:0;z-index:-1;background:url('/assets/rm-02.webp') center/100% 100% no-repeat;pointer-events:none}
.guest-frame-wide .portrait-slot{margin:0}
@view-transition{navigation:auto}
::view-transition-group(kulture-guest-portrait){animation-duration:var(--motion-time);animation-timing-function:cubic-bezier(.22,.61,.36,1)}

/* 16. Guests page */
.guest-grid{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:start}
.living-edition{grid-column:1/7;max-width:560px}
.living-caption{font:400 13px/1.4 var(--label);color:var(--meta);margin-top:12px}
.guest-editorial{grid-column:8/13;padding-top:40px}
.guest-editorial>p:not(.eyebrow){font-size:17px;line-height:1.6;margin-top:16px;max-width:44ch}
.poster-fields{margin:28px 0;border-top:1px solid var(--ink)}
.poster-fields div{border-bottom:1px solid var(--line);padding:12px 0;display:grid;grid-template-columns:130px 1fr;gap:16px}
.poster-fields dt{font:400 14px/1.4 var(--label)}
.poster-fields dd{font-size:16px}
.guest-editorial .button{margin-top:28px}
.poster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.poster-grid>li{padding:14px 14px 4px}
.poster-grid figure img{display:block;width:100%;height:auto;border:1px solid var(--line)}
.poster-grid figcaption{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font:700 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase}
.case-file{margin-top:6px;border-top:1px solid var(--line)}
.case-file summary{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font:400 14px/1.3 var(--label);list-style:none}
.case-file summary::-webkit-details-marker{display:none}
.case-file summary::before{content:"+";display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--ink);font:600 15px/1 var(--sans)}
.case-file[open] summary::before{content:"\2212"}
.case-file img{display:block;width:100%;height:auto;margin-top:8px;border:1px solid var(--line)}
.small-cta .cta-row{display:flex;justify-content:space-between;align-items:end;gap:32px;border-top:2px solid var(--ink);padding-top:28px}
.small-cta h2{font:400 var(--h3)/1.08 var(--serif)}

/* 17. Newsletter page */
.sheet{background:var(--paper) url('/assets/kh-img-01.webp') center/cover no-repeat;border:1px solid var(--line);padding:28px 40px 44px}
.newspaper-top{display:flex;justify-content:space-between;gap:16px;border-block:1px solid var(--ink);padding:8px 0;font:400 13px/1.3 var(--label)}
.newsletter-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:48px;margin-top:36px;align-items:start}
.newsletter-grid h2{font:400 var(--h2)/1.04 var(--serif);letter-spacing:-.01em;margin-bottom:22px}
.drop-cap{float:left;font:400 1.9em/.8 var(--serif);padding:.04em .08em 0 0;border-bottom:3px solid var(--red)}
.newsletter-grid>div>p{font-size:18px;line-height:1.65;max-width:52ch}
.newsletter-grid>div>p+p{margin-top:14px}
/* Edition note: flat tint, frame drawn on ::after behind the content (crop of kh-img-05), no aspect ratio */
.edition-note{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:flex-start;min-height:440px;padding:36px 30px 40px;background:#ece3d1}
.edition-note::after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;z-index:-1;background:url('/assets/edition-frame.webp') center/100% 100% no-repeat;pointer-events:none}
.edition-note>p{margin-bottom:76px}
.edition-note .text-link{margin-top:auto;padding:0 18px}
.asterisk{display:block;font:400 34px/1 var(--serif);color:var(--red);margin-bottom:8px}
.edition-note h3{font:400 var(--h4)/1.1 var(--serif);margin-bottom:12px}
.edition-note p{font-size:16px}
/* Clippings (cards) */
.clippings{display:grid;grid-template-columns:1.1fr .9fr 1fr;gap:28px;align-items:start}
.clipping{padding:22px 24px;border-top:2px solid var(--ink);min-width:0}
.clip-meta{display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:13px;font:400 13px/1.2 var(--label)}
.clip-meta img{width:24px;height:24px}
.clip-photo{height:190px;display:grid;place-items:center;margin:18px 0;font:400 13px/1.2 var(--label);background:var(--paper) url('/assets/kh-img-02.webp') center/cover no-repeat;border:1px solid var(--line)}
.clip-photo span{background:var(--light);padding:6px 10px}
.clipping h3{font:400 var(--h3)/1.05 var(--serif);margin:13px 0 15px;overflow-wrap:anywhere}
.clipping>p{font-size:16px;line-height:1.6}
.clipping .eyebrow{margin:14px 0 0}
.clip-end{border-top:1px solid var(--line);font:400 14px/1.6 var(--label);margin-top:28px;padding-top:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.clipping.quote{margin-top:45px;background:var(--ink);color:var(--light);border-top-color:var(--red);padding-bottom:32px}
.clipping.quote .clip-meta,.clipping.quote .clip-end{border-color:#4a433c}
.clipping.quote .clip-meta img{background:var(--light)}
.quote-mark{font:105px/.8 var(--serif);display:block;margin:24px 0 -18px;color:var(--red)}
.clipping>.quote-placeholder{font:500 30px/1.25 var(--note);margin:24px 0 38px}
.clipping>.sample-label{font:400 13px/1.4 var(--label);color:var(--line);margin-top:10px}
.clipping.update{margin-top:85px;padding-top:44px}
.date-stamp{font:400 16px/1.3 var(--label);margin:28px 0;display:inline-block;border:1.5px solid var(--red);padding:8px 12px}
.date-stamp b{display:block;font-size:30px;line-height:1.5;font-weight:400}

/* 18. Get involved: enquiry chooser and inactive form preview */
.enquiry-layout{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:stretch}
.enquiry-chooser{grid-column:1/6;align-self:start;aspect-ratio:752/1344;padding:46% 40px 56px;background:var(--light) url('/assets/rd-05.webp') center top/100% 100% no-repeat}
.enquiry-chooser>p:not(.eyebrow):not(.small){font:400 26px/1.2 var(--serif)}
.enquiry-options{display:flex;flex-direction:column;gap:10px;margin:24px 0}
.enquiry-options button{display:flex;align-items:center;gap:14px;min-height:56px;width:100%;text-align:left;padding:12px 16px;background:var(--light);border:1.5px solid var(--ink);font:600 15px/1.2 var(--sans);letter-spacing:.04em}
.enquiry-options button span{font:400 13px/1 var(--label)}
.enquiry-options button b{margin-left:auto;font-weight:400}
.enquiry-options button:hover{border-color:var(--red)}
.enquiry-options button[aria-pressed="true"]{background:var(--ink);color:var(--light);border-color:var(--ink)}
.small{font-size:15px;line-height:1.55}
.enquiry-paper{grid-column:6/13;padding:40px 44px;background:var(--paper) url('/assets/kh-img-06.webp') center/cover no-repeat;border:1px solid var(--line)}
.enquiry-paper h2{font:400 var(--h3)/1.05 var(--serif);margin-bottom:10px}
#enquiry-description{font-size:17px;max-width:46ch}
.form-notice{margin:22px 0;font:400 14px/1.5 var(--label);border-left:6px solid var(--red);background:var(--light);padding:10px 14px}
#enquiry-form fieldset{border:0;display:flex;flex-direction:column;gap:16px}
#enquiry-form label{display:flex;flex-direction:column;gap:6px;font:600 14px/1.35 var(--sans)}
#enquiry-form label span{font-weight:400;color:var(--meta)}
#enquiry-form input:not([type=checkbox]),#enquiry-form textarea{width:100%;min-height:46px;padding:11px 12px;background:var(--light);border:1px solid var(--meta);font:400 16px/1.4 var(--sans);color:var(--ink)}
#enquiry-form input:disabled,#enquiry-form textarea:disabled{background:#f1eee8;color:var(--meta)}
#enquiry-form [data-fields]{display:flex;flex-direction:column;gap:16px}
#enquiry-form [data-fields][hidden]{display:none}
.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#enquiry-form .checkbox{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400}
#enquiry-form .checkbox input{width:22px;height:22px;margin-top:2px;flex:none}
#enquiry-form .checkbox span{color:var(--ink)}
#enquiry-form .button{align-self:flex-start}
#google-form iframe{width:100%;min-height:900px;border:0}
/* Hosts strip: halftone cut-outs on the rm-06 three-panel board; no text over any cut-out. */
.hosts-strip .strip-title{font:400 var(--h3)/1.1 var(--serif);margin-bottom:22px}
.strip-board{aspect-ratio:1344/752;max-width:980px;background:url('/assets/rm-06.webp') center/100% 100% no-repeat;display:grid;grid-template-columns:repeat(3,1fr);column-gap:3.4%;padding:9.5% 8.6% 12%}
.strip-board li{display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.strip-board img{display:block;width:auto;height:100%;max-width:100%;object-fit:contain;object-position:bottom}
.strip-names{display:grid;grid-template-columns:repeat(3,1fr);column-gap:3.4%;max-width:980px;padding:10px 8.6% 0;font:700 13px/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-align:center}

/* 19. Privacy: text column left-aligned with the page title */
.privacy-copy h2{font:400 var(--h3)/1.15 var(--serif);margin:40px 0 12px}
.privacy-copy h2:first-child{margin-top:0}
.privacy-copy p{font-size:18px;line-height:1.65;max-width:62ch}
.privacy-copy p.small{font:400 14px/1.5 var(--label);color:var(--meta);margin-top:40px;border-top:1px solid var(--line);padding-top:14px}

/* 20. Review routes: editorial proof + story layout */
.dateline{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink);margin-top:36px;padding:4px 0;font:400 14px/1.3 var(--label)}
.dateline a{display:inline-flex;align-items:center;gap:.35em;min-height:44px}
.lead{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:center;padding:56px 0 72px}
.lead-copy{grid-column:1/7}
.lead-copy h1{font:400 var(--h1)/1.04 var(--serif);letter-spacing:-.015em;margin:20px 0 22px}
.intro{font-size:18px;line-height:1.6;color:var(--meta);margin:16px 0 28px}
.read-link{display:flex;justify-content:space-between;align-items:center;max-width:320px;min-height:48px;text-decoration:none;border-bottom:1px solid var(--ink);font:600 15px/1.2 var(--sans)}
.proof-note{font:400 13px/1.6 var(--label);color:var(--meta);margin-top:32px}
.poster-stage{grid-column:8/13;width:100%;max-width:520px;justify-self:end}
.clippings-section{margin:12px 0 48px}
.frames{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.frames li{min-width:0;padding:14px 14px 16px}
.frames li>div{height:180px;border:1px solid var(--line);background:var(--paper);padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.mini-window{background:#d8d2c8;width:65%;height:75px;display:grid;place-items:center;font:600 12px var(--sans);letter-spacing:.7px;border:1px solid var(--meta);text-align:center}
.mini-window span{font-size:20px}
.mini-poster b{font:400 25px var(--serif)}
.mini-poster>span,.mini-expand>span{font:400 12px var(--label)}
.mini-expand .mini-window{width:86%;height:100px}
.mini-article .mini-window{width:100%;height:68px}
.mini-article b{font:400 23px var(--serif)}
.mini-article i{width:85%;border-top:1px solid var(--line)}
.frames h3{font:400 15px var(--label);margin:18px 0 8px}
.frames p{font-size:15px;color:var(--meta);line-height:1.55}
.type-specimen{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.type-specimen>div{padding:20px 20px 22px}
.type-specimen h3{font:700 12px/1.4 var(--sans);letter-spacing:.14em;margin-bottom:18px}
.type-specimen .typed{font:23px/1.5 var(--label)}
.type-specimen .penned{font:500 34px/1.2 var(--note)}
.type-specimen .readable{font:18px/1.6 var(--sans)}
.series-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.series-card-grid figure{padding:14px 14px 10px}
.series-card-grid img{display:block;width:100%;height:auto;border:1px solid var(--line)}
.series-card-grid figcaption{font:400 14px/1.6 var(--label);color:var(--meta);margin-top:10px}
.series-card-review>p:last-child{font:400 14px/1.6 var(--label);color:var(--meta);margin-top:28px}
.review-status{margin:24px 0 40px;padding:22px 24px;display:grid;grid-template-columns:1fr 3fr;gap:32px}
.review-status b{font:700 12px/1.4 var(--sans);letter-spacing:.14em}
.review-status p{font-size:16px;color:var(--meta);max-width:680px}
.story-back{display:inline-flex;align-items:center;gap:.35em;min-height:44px;margin-top:20px;font:600 15px/1.2 var(--sans)}
.story-opening{display:grid;grid-template-columns:repeat(12,1fr);column-gap:32px;align-items:center;padding:48px 0 24px}
.story-opening>div:first-child{grid-column:1/6}
.story-opening>.guest-frame-wide{grid-column:6/13}
.story-opening h1{font:400 var(--h1)/1.04 var(--serif);letter-spacing:-.015em;margin:20px 0}
.story-review>.wrap>.portrait-controls{justify-content:flex-end;margin:4px 0 40px}
.story-reading{--tilt:0deg;max-width:760px;margin:24px auto 40px;padding:36px 40px 44px;font-size:19px;line-height:1.8}
.story-reading h2{font:400 var(--h3)/1.15 var(--serif);margin:24px 0 16px}
.story-reading .story-note{font:500 34px/1.3 var(--note);margin:36px 0;border-left:6px solid var(--red);padding-left:16px}
.story-reading hr{border:0;border-top:1px solid var(--line);margin:36px 0}
.story-reading a{display:inline-flex;align-items:center;gap:.35em;min-height:44px;font-weight:600}

/* 21. Responsive */
@media (max-width:1100px){
  .hero .wrap{display:block}
  .hero figure{max-width:none}
  .copy{margin-top:28px;max-width:760px}
  .frames{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .clippings{grid-template-columns:1fr;gap:36px}
  .clipping.quote,.clipping.update{margin-top:0}
}
@media (max-width:860px){
  .wrap{padding:0 20px}
  .wrap>.paper-band,main>.wrap .paper-band{padding-left:20px;padding-right:20px}
  .issue .wrap{flex-direction:column;gap:4px}
  .issue .preview{text-align:left}
  .top>.wrap{flex-direction:column;align-items:flex-start;gap:4px;padding-top:14px;padding-bottom:6px}
  .top nav{flex-wrap:wrap;column-gap:20px;row-gap:0}
  .top nav a{font-size:12px;white-space:nowrap}
  .hero .wrap{padding-top:20px}
  .copy h1{margin:16px 0}
  .standfirst{font-size:22px}
  .rail .wrap{grid-template-columns:1fr;row-gap:28px;padding-bottom:44px}
  .rail p{font-size:24px}
  .section{padding:56px 0}
  .section-head{flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:30px}
  .section-head>p{text-align:left}
  .page-title .wrap{padding-top:32px;padding-bottom:32px}
  .page-title .standfirst{font-size:22px}
  .split,.series-story,.follow-grid,.invite,.guest-grid,.enquiry-layout,.lead,.story-opening{display:block}
  .manifesto .split>div{margin-top:18px}
  .columns{grid-template-columns:1fr;gap:16px;margin-top:22px}
  .voice-grid,.poster-grid{gap:20px}
  .voice{padding:12px 12px 14px}
  .voice blockquote{font-size:20px}
  .series .section-head{margin-top:44px}
  .series-story{padding:24px 0}
  .film{padding:12px}
  .play-film{position:static;margin-top:12px;width:100%;justify-content:center}
  .series-copy{margin-top:22px}
  .serif-note{font-size:23px}
  .news-preview{margin-top:36px;padding:84px 48px 84px}
  .invite-poster{margin-top:36px;padding:18px}
  .site-footer .wrap{flex-direction:column;gap:12px}
  .footer-links{justify-content:flex-start}
  .living-edition{max-width:none}
  .guest-editorial{padding-top:40px}
  .small-cta .cta-row{flex-direction:column;align-items:flex-start;gap:12px}
  .sheet{padding:20px 20px 28px}
  .newsletter-grid{grid-template-columns:1fr;gap:32px}
  .edition-note{padding:40px 26px 40px}
  .enquiry-chooser{padding:48% 30px 44px;max-width:420px}
  .enquiry-paper{margin-top:28px;padding:28px 20px}
  .field-pair{grid-template-columns:1fr}
  .strip-names{font-size:12px;letter-spacing:.08em}
  .poster-stage{margin-top:36px;justify-self:auto;max-width:none}
  .story-opening>.guest-frame-wide{margin-top:24px}
  .story-review>.wrap>.portrait-controls{justify-content:flex-start;margin-top:12px}
  .story-reading{padding:28px 20px 32px}
  .type-specimen,.series-card-grid{grid-template-columns:1fr}
  .review-status{grid-template-columns:1fr;gap:10px}
  .wanted-sheet{padding:18px 18px 12px}
  .tear:not(.tear-road){height:44px}
  .tear-room{height:60px;background-size:100% 120px}
}
@media (max-width:700px){
  .voice-grid,.poster-grid{grid-template-columns:1fr;gap:40px}
  .voice blockquote{font-size:23px}
  .poster-grid figure{max-width:440px}
  .clip-card{--tilt:0deg}
}
@media (max-width:420px){
  .guest-frame{padding:12% 9%}
  .frames{grid-template-columns:1fr}
}
/* 22. Reduced motion: no spray, no view transitions. */
@media (prefers-reduced-motion:reduce){
  .kword .spray{animation:none}
  @view-transition{navigation:none}
  .portrait-slot{view-transition-name:none}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none}
}

/* 23. KH-WEB-07 Home pilot (index-v4-pilot.html only). Every rule is scoped to body.kh-v4, so no other page changes.
   Reference record: 06 Court/Orchestration Sessions/kulture-web07-references-20261103/reference-record.json
   Layout: portrait-first full-bleed lead, larger Home-only h1, broadsheet index row, one lead quote + two offset quotes,
   hand-set --tilt per card (inline style), two section spacings, eyebrows on 3 of 7 sections.
   Motion: one signature (the WANTED portrait opening into the story via the existing kulture-guest-portrait view transition),
   torn-mask title reveal (--torn points), halftone develop on the lead photo, scroll-driven tear on the Room/Road .tear strips,
   150-160ms state transitions. Transform, opacity and clip-path only; all motion inside prefers-reduced-motion:no-preference. */
.kh-v4{--h1-home:clamp(58px,7.6vw + 22px,132px);--sp-a:136px;--sp-b:64px}
.kh-v4 .v4-sp-a{padding:var(--sp-a) 0}
.kh-v4 .v4-sp-b{padding:var(--sp-b) 0}
/* 23a. Lead: full-bleed photo, cropped to the centre seat, against a tall type column */
.kh-v4 .v4-lead{display:grid;grid-template-columns:minmax(0,57fr) minmax(0,43fr);min-height:min(86vh,880px)}
.kh-v4 .v4-lead-photo{position:relative;margin:0;min-height:520px}
.kh-v4 .v4-lead-photo .frame{position:absolute;inset:0;overflow:hidden;background:var(--line)}
.kh-v4 .v4-lead-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:49% 30%}
.kh-v4 .v4-lead-photo figcaption{position:absolute;left:0;bottom:0;z-index:2;background:var(--paper-flat);padding:9px 16px 9px 60px;font:400 13px/1.4 var(--label)}
.kh-v4 .v4-lead-copy{display:flex;flex-direction:column;justify-content:flex-end;padding:48px 60px 44px 44px}
.kh-v4 .v4-title{font:400 var(--h1-home)/.9 var(--serif);letter-spacing:-.03em;margin:26px 0 30px}
.kh-v4 .v4-lead-copy .standfirst{max-width:22ch}
/* 23b. Broadsheet index row (replaces the three clip cards) */
.kh-v4 .v4-index .wrap{display:block;padding-top:0;padding-bottom:0}
.kh-v4 .v4-index-row{display:grid;grid-template-columns:1.1fr .9fr 1.3fr;border-top:3px double var(--ink);border-bottom:1px solid var(--ink)}
.kh-v4 .v4-index article{border-top:0;border-left:1px solid var(--line);padding:16px 24px 6px;display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:baseline}
.kh-v4 .v4-index article:first-child{border-left:0;padding-left:0}
.kh-v4 .v4-index h2{white-space:nowrap}
.kh-v4 .v4-index p{font:400 22px/1.2 var(--serif);margin-top:0}
.kh-v4 .v4-index a{grid-column:1/-1;justify-self:start}
/* 23c. Manifesto: the section label sits in the margin, not above the headline */
.kh-v4 .manifesto .split>.v4-margin-label{grid-column:1/4;border-top:2px solid var(--ink);padding-top:16px;font:400 13px/1.5 var(--label);letter-spacing:.06em}
/* 23d. Voices: one lead quote, two smaller offset quotes */
.kh-v4 .v4-voices{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:start}
.kh-v4 .v4-voice-lead{grid-column:1/8;grid-row:1/3}
.kh-v4 .v4-voice-lead .voice-cut{aspect-ratio:3/2}
.kh-v4 .v4-voice-lead blockquote{font:400 clamp(28px,1.6vw + 16px,40px)/1.16 var(--serif)}
.kh-v4 .v4-voice-b{grid-column:8/13;grid-row:1;margin-top:88px}
.kh-v4 .v4-voice-c{grid-column:9/13;grid-row:2;margin-top:44px}
.kh-v4 .v4-voice-b .voice-cut,.kh-v4 .v4-voice-c .voice-cut{aspect-ratio:2/1}
.kh-v4 .v4-voice-b blockquote,.kh-v4 .v4-voice-c blockquote{font-size:21px}
/* 23e. Series: Room wide film with copy at its foot; Road stacked (no mirrored split) */
.kh-v4 .v4-room{align-items:end;padding:48px 0 40px}
.kh-v4 .v4-room .film{grid-column:1/9}
.kh-v4 .v4-room .series-copy{grid-column:9/13;padding-bottom:8px}
.kh-v4 .v4-road{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;padding:40px 0 16px}
.kh-v4 .v4-road .film{grid-column:4/13;grid-row:1}
.kh-v4 .v4-road .play-film{left:auto;right:44px}
.kh-v4 .v4-road .series-copy{grid-column:4/13;grid-row:2;display:grid;grid-template-columns:1fr 1fr;column-gap:32px;margin-top:28px;align-items:start}
.kh-v4 .v4-road .series-copy>*{grid-column:1}
.kh-v4 .v4-road .series-copy>.serif-note{grid-column:2;grid-row:1/3;margin-top:0}
.kh-v4 .v4-road .series-copy>.road-sticker{grid-column:2;grid-row:3/5;margin-top:20px}
/* 23f. Follow: dateline rule instead of an eyebrow */
.kh-v4 .v4-follow{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:start}
.kh-v4 .v4-dateline{grid-column:1/-1;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:8px 0;margin-bottom:44px;font:400 13px/1.4 var(--label);letter-spacing:.06em}
.kh-v4 .v4-follow .chapter{grid-column:1/6}
.kh-v4 .v4-follow .news-preview{grid-column:7/12}
/* 23g. Invitation: the live WANTED sheet (shared component) replaces the static sample image */
.kh-v4 .invite-poster.v4-wanted{grid-column:8/13;max-width:500px;padding:0;background:none}
.kh-v4 .v4-wanted .guest-frame{padding:9% 10%}
.kh-v4 .v4-wanted img{box-shadow:none}
/* 23h. State changes: 150-160ms, transform and opacity only (colour swaps neutralised) */
.kh-v4 .button{position:relative;isolation:isolate;transition:transform 150ms ease}
.kh-v4 .play-film{isolation:isolate;transition:transform 150ms ease}
.kh-v4 .button::after,.kh-v4 .play-film::after{content:"";position:absolute;inset:0;z-index:-1;background:#000;opacity:0;transition:opacity 150ms ease;pointer-events:none}
.kh-v4 .button:hover,.kh-v4 .play-film:hover{background:var(--ink)}
.kh-v4 .button:hover::after,.kh-v4 .play-film:hover::after{opacity:1}
.kh-v4 .button:active,.kh-v4 .play-film:active{transform:translateY(1px)}
.kh-v4 .text-link{position:relative}
.kh-v4 .text-link:hover{text-decoration-color:var(--red)}
.kh-v4 .text-link::after,.kh-v4 .top nav a::after,.kh-v4 .footer-links a::after{content:"";position:absolute;left:0;right:0;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform 160ms ease;pointer-events:none}
.kh-v4 .text-link::after{bottom:4px}
.kh-v4 .top nav a,.kh-v4 .footer-links a{position:relative}
.kh-v4 .top nav a::after,.kh-v4 .footer-links a::after{bottom:-2px;background:var(--red)}
.kh-v4 .top nav a:hover,.kh-v4 .footer-links a:hover{border-bottom-color:transparent}
.kh-v4 .top nav a[aria-current="page"]:hover{border-bottom-color:var(--ink)}
.kh-v4 .text-link:hover::after,.kh-v4 .top nav a:hover::after,.kh-v4 .footer-links a:hover::after{transform:scaleX(1)}
.kh-v4 .portrait-slot{transition:transform 160ms ease}
.kh-v4 .poster-story-link:hover .portrait-slot{outline-color:var(--ink);transform:scale(1.015)}
/* 23i. Motion: all of it opt-in; without it every element is fully visible */
@media (prefers-reduced-motion:no-preference){
  .kh-v4 .v4-develop img{animation:v4-develop 1400ms cubic-bezier(.2,.7,.2,1) both}
  .kh-v4 .v4-develop::after{animation:v4-dots 1700ms cubic-bezier(.3,.6,.2,1) both}
  .kh-v4 .v4-title{animation:v4-torn-in 900ms cubic-bezier(.3,.7,.2,1) 150ms backwards}
  @keyframes v4-develop{from{opacity:.06;transform:scale(1.035)}to{opacity:1;transform:none}}
  @keyframes v4-dots{from{opacity:1}to{opacity:.5}}
  /* Torn edge derived from the --torn token's points (brand-core.css), descending through the title */
  @keyframes v4-torn-in{
    from{clip-path:polygon(-10% -40%,110% -40%,110% -40%,105% -40%,100% -40%,95% -40%,90% -40%,85% -40%,80% -40%,75% -40%,70% -40%,65% -40%,60% -40%,55% -40%,50% -40%,45% -40%,40% -40%,35% -40%,30% -40%,25% -40%,20% -40%,15% -40%,10% -40%,5% -40%,0% -40%,-5% -40%,-10% -40%)}
    to{clip-path:polygon(-10% -40%,110% -40%,110% 145%,105% 140.4%,100% 146%,95% 147.4%,90% 147.4%,85% 144.6%,80% 142.7%,75% 142.6%,70% 143%,65% 144.7%,60% 140%,55% 145.8%,50% 148%,45% 146.6%,40% 147.5%,35% 143.3%,30% 145.8%,25% 146.7%,20% 147.1%,15% 145.8%,10% 146.7%,5% 145.9%,0% 144.1%,-5% 146.3%,-10% 144.2%)}}
  @supports (animation-timeline:view()){
    /* Scroll-driven paper tear: the Room and Road strips only */
    .kh-v4 .v4-tear{animation:v4-tear linear both;animation-timeline:view();animation-range:entry 10% cover 50%}
    @keyframes v4-tear{
      from{clip-path:polygon(-2% -2%,-7% -2%,-11.6% 2.3%,-6% 6.7%,-4.6% 11%,-4.6% 15.3%,-7.4% 19.7%,-9.3% 24%,-9.4% 28.3%,-9% 32.7%,-7.3% 37%,-12% 41.3%,-6.2% 45.7%,-4% 50%,-5.4% 54.3%,-4.5% 58.7%,-8.7% 63%,-6.2% 67.3%,-5.3% 71.7%,-4.9% 76%,-6.2% 80.3%,-5.3% 84.7%,-6.1% 89%,-7.9% 93.3%,-5.7% 97.7%,-7.8% 102%,-2% 102%)}
      to{clip-path:polygon(-2% -2%,107% -2%,102.4% 2.3%,108% 6.7%,109.4% 11%,109.4% 15.3%,106.6% 19.7%,104.7% 24%,104.6% 28.3%,105% 32.7%,106.7% 37%,102% 41.3%,107.8% 45.7%,110% 50%,108.6% 54.3%,109.5% 58.7%,105.3% 63%,107.8% 67.3%,108.7% 71.7%,109.1% 76%,107.8% 80.3%,108.7% 84.7%,107.9% 89%,106.1% 93.3%,108.3% 97.7%,106.2% 102%,-2% 102%)}}
  }
}
/* 23j. Pilot responsive */
@media (max-width:1100px){
  .kh-v4 .v4-lead{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .kh-v4 .v4-lead-copy{padding:40px 40px 36px 32px}
  .kh-v4 .v4-index p{font-size:20px}
  .kh-v4 .v4-index article{grid-template-columns:1fr;row-gap:6px}
}
@media (max-width:860px){
  .kh-v4{--sp-a:88px;--sp-b:44px}
  .kh-v4 .v4-lead{display:block;min-height:0}
  .kh-v4 .v4-lead-photo{min-height:0}
  .kh-v4 .v4-lead-photo .frame{position:relative;inset:auto;aspect-ratio:4/5;max-height:76vh;width:100%}
  .kh-v4 .v4-lead-photo figcaption{position:static;background:none;padding:8px 20px 0}
  .kh-v4 .v4-lead-copy{padding:24px 20px 8px}
  .kh-v4 .v4-title{margin:18px 0 22px}
  .kh-v4 .v4-index-row{grid-template-columns:1fr}
  .kh-v4 .v4-index article,.kh-v4 .v4-index article:first-child{border-left:0;border-top:1px solid var(--line);padding:12px 0 2px;grid-template-columns:1fr}
  .kh-v4 .v4-index article:first-child{border-top:0}
  .kh-v4 .manifesto .split>.v4-margin-label{display:inline-block}
  .kh-v4 .v4-voices,.kh-v4 .v4-road,.kh-v4 .v4-road .series-copy,.kh-v4 .v4-follow{display:block}
  .kh-v4 .v4-voice-b{margin:44px 0 0 9%}
  .kh-v4 .v4-voice-c{margin:36px 9% 0 0}
  .kh-v4 .v4-road .series-copy>.serif-note{margin-top:20px}
  .kh-v4 .v4-follow .news-preview{margin-top:36px}
  .kh-v4 .play-film,.kh-v4 .v4-road .play-film{position:relative;left:0;right:auto;bottom:0}
  .kh-v4 .invite-poster.v4-wanted{margin-top:40px}
}

/* 23k. KH-WEB-07 iteration 2 (3 Nov live feedback). Pilot only, still scoped to body.kh-v4.
   Hero: timed carousel of the person in the centre chair (crossfade on opacity; JS in pilot-v4.js).
   Spray K: stroke-by-stroke mask reveal over the C after ~2 s (stem, upper arm, leg, drip; brief overspray).
   WANTED: three live sheets set out like the record-day chairs (left, centre, right), centre sheet larger.
   Transform, opacity, clip-path and mask only; every animation inside prefers-reduced-motion:no-preference. */
/* 23k-1. Hero carousel: slides stack in one grid cell so the frame keeps its height at every width */
.kh-v4 .v4-carousel{position:relative;margin:0}
.kh-v4 .v4-slides{position:absolute;inset:0;display:grid}
.kh-v4 .v4-slide{grid-area:1/1;position:relative;margin:0;opacity:0;visibility:hidden}
.kh-v4 .v4-slide.is-active{opacity:1;visibility:visible}
.kh-v4 .v4-lead-photo .v4-slide img{object-position:50% 30%}
.kh-v4 .v4-lead-photo .v4-slide figcaption{padding-right:16px;max-width:calc(100% - 24px)}
/* Controls sit at the photo's top edge so pause/play is in the first screen at every width */
.kh-v4 .v4-car-controls{position:absolute;left:0;top:0;z-index:3;display:flex;align-items:center;background:var(--paper-flat);padding:0 8px 0 50px}
.kh-v4 .v4-car-controls button{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 8px;border:0;background:none;color:var(--ink);font:400 13px/1 var(--label);letter-spacing:.04em;cursor:pointer}
.kh-v4 .v4-car-controls [data-slide-prev],.kh-v4 .v4-car-controls [data-slide-next]{font:400 18px/1 var(--sans)}
.kh-v4 .v4-car-toggle{margin-right:6px;border-right:1px solid var(--line)!important;padding-right:14px!important}
.kh-v4 .v4-toggle-icon{width:10px;height:12px;border-left:3px solid var(--ink);border-right:3px solid var(--ink)}
.kh-v4 .v4-car-toggle[aria-pressed="true"] .v4-toggle-icon{width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent var(--ink)}
.kh-v4 .v4-dot span{position:relative;display:block;width:10px;height:10px;border-radius:50%;border:1.5px solid var(--ink)}
.kh-v4 .v4-dot span::after{content:"";position:absolute;inset:1px;border-radius:50%;background:var(--ink);opacity:0;transform:scale(.4);transition:opacity 150ms ease,transform 150ms ease}
.kh-v4 .v4-dot[aria-current="true"] span::after{opacity:1;transform:none}
@media (prefers-reduced-motion:no-preference){
  .kh-v4 .v4-slide{transition:opacity 900ms cubic-bezier(.4,0,.2,1),visibility 0s linear 900ms}
  .kh-v4 .v4-slide.is-active{transition:opacity 900ms cubic-bezier(.4,0,.2,1),visibility 0s}
}
/* 23k-2. Spray K: five layers of the same image. Each region is fixed by clip-path; motion is a feathered mask
   sweep along the stroke. Without motion (or before JS/CSS animation support) all layers simply show the K. */
.kh-v4 .v4-spray{position:absolute;left:-.18em;top:-.2em;height:1.36em;aspect-ratio:485/651;pointer-events:none}
.kh-v4 .v4-spray img{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.kh-v4 .v4-spray .s-mist{opacity:0}
.kh-v4 .v4-spray .s-stem{clip-path:polygon(0 0,46% 0,46% 84%,0 84%)}
.kh-v4 .v4-spray .s-arm{clip-path:polygon(46% 0,100% 0,100% 44%,46% 50%)}
.kh-v4 .v4-spray .s-leg{clip-path:polygon(46% 50%,100% 44%,100% 100%,46% 100%)}
.kh-v4 .v4-spray .s-drip{clip-path:polygon(0 84%,46% 84%,46% 100%,0 100%)}
@media (prefers-reduced-motion:no-preference){
  .kh-v4 .v4-spray .s-stem,.kh-v4 .v4-spray .s-drip{-webkit-mask:linear-gradient(to bottom,#000 33.4%,transparent 40%) 0 0/100% 300% no-repeat;mask:linear-gradient(to bottom,#000 33.4%,transparent 40%) 0 0/100% 300% no-repeat}
  .kh-v4 .v4-spray .s-arm{-webkit-mask:linear-gradient(to top right,#000 33.4%,transparent 40%) 0 100%/300% 300% no-repeat;mask:linear-gradient(to top right,#000 33.4%,transparent 40%) 0 100%/300% 300% no-repeat}
  .kh-v4 .v4-spray .s-leg{-webkit-mask:linear-gradient(to bottom right,#000 33.4%,transparent 40%) 0 0/300% 300% no-repeat;mask:linear-gradient(to bottom right,#000 33.4%,transparent 40%) 0 0/300% 300% no-repeat}
  .kh-v4 .v4-spray .s-mist{animation:v4-k-mist 760ms ease-out 1950ms both}
  .kh-v4 .v4-spray .s-stem{animation:v4-k-down 450ms cubic-bezier(.35,.55,.3,1) 2000ms both}
  .kh-v4 .v4-spray .s-arm{animation:v4-k-up-right 380ms cubic-bezier(.35,.55,.3,1) 2400ms both}
  .kh-v4 .v4-spray .s-leg{animation:v4-k-down-right 380ms cubic-bezier(.35,.55,.3,1) 2720ms both}
  .kh-v4 .v4-spray .s-drip{animation:v4-k-down 430ms cubic-bezier(.55,0,.8,.6) 3100ms both}
  @keyframes v4-k-mist{0%{opacity:0;transform:scale(1.14)}35%{opacity:.28}100%{opacity:0;transform:scale(1.03)}}
  @keyframes v4-k-down{from{-webkit-mask-position:0 100%;mask-position:0 100%}to{-webkit-mask-position:0 0;mask-position:0 0}}
  @keyframes v4-k-up-right{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0 100%;mask-position:0 100%}}
  @keyframes v4-k-down-right{from{-webkit-mask-position:100% 100%;mask-position:100% 100%}to{-webkit-mask-position:0 0;mask-position:0 0}}
}
/* 23k-3. WANTED: three live sheets, seated like the record-day chairs; unequal widths, hand-set tilt and drop */
.kh-v4 .v4-invite{align-items:start}
.kh-v4 .v4-posters-set{grid-column:1/-1;margin:64px 0 0}
.kh-v4 .v4-posters{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) minmax(0,.8fr);column-gap:28px;align-items:start}
.kh-v4 .v4-poster{padding:9% 10%;transform:rotate(var(--tilt,0deg))}
.kh-v4 .v4-poster-zuri{grid-column:1;grid-row:1;margin-top:128px}
.kh-v4 .v4-poster-aafthab{grid-column:2;grid-row:1}
.kh-v4 .v4-poster-viktoria{grid-column:3;grid-row:1;margin-top:72px}
.kh-v4 .v4-poster:not(.v4-poster-aafthab) .portrait-slot{view-transition-name:none}
.kh-v4 .v4-poster .portrait-cover,.kh-v4 .v4-poster .portrait-video{inset:0;width:100%;height:100%;object-fit:cover}
.kh-v4 .v4-poster .wanted-heading{line-height:1.05}
.kh-v4 .v4-optin{width:fit-content;max-width:100%;margin:2px auto 10px;padding:6px 8px;border:1.5px solid var(--red);background:var(--paper-flat);font:400 12px/1.35 var(--label);letter-spacing:.03em;text-align:center;transform:rotate(-3deg)}
.kh-v4 .v4-posters-set>figcaption{display:flex;justify-content:space-between;gap:10px;max-width:520px;margin:28px auto 0;background:var(--light);padding:6px 8px;font:400 13px/1.3 var(--label)}
.kh-v4 .v4-poster:not(.v4-poster-aafthab){padding:7% 7.5%}
.kh-v4 .v4-poster:not(.v4-poster-aafthab) .wanted-sheet{padding:16px 16px 12px}
.kh-v4 .v4-poster:not(.v4-poster-aafthab) .poster-meta{font-size:13px}
.kh-v4 .v4-poster:not(.v4-poster-aafthab) .guest-name{font-size:34px}
.kh-v4 .v4-poster:not(.v4-poster-aafthab) .wanted-for p{font-size:21px}
@media (max-width:1100px){
  .kh-v4 .v4-posters{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:14px 6px 22px;margin:0 -6px}
  .kh-v4 .v4-poster{flex:0 0 min(440px,84%);scroll-snap-align:center;margin-top:0}
}
@media (max-width:860px){
  .kh-v4 .v4-lead-photo.v4-carousel{min-height:0}
  .kh-v4 .v4-slides{position:relative;inset:auto}
  .kh-v4 .v4-lead-photo .v4-slide figcaption{position:static;max-width:none;padding:8px 20px 0}
  .kh-v4 .v4-car-controls{position:static;padding:4px 12px 0;background:none;flex-wrap:wrap}
  .kh-v4 .v4-posters-set{margin-top:40px}
}

/* 24. Brief D completion (4 Nov 2026, static audit pass, self-edited: Codex at usage limit).
   The 4 Nov 01:39 build added this markup but crashed before its CSS was written.
   24a wayfinding motif layer (proposal v3, approved 2026-11-03T23:02Z): faint outline texture only; dividers sit
       between sections; the page-title layer is masked off the text column and dropped below 1100px, so it never
       sits over text, faces or photos. 24b Instagram drafts. 24c Support v3. 24d partner banner (KH-WEB-10). */
.kh-motif-divider{height:clamp(40px,6vw,88px);margin:12px 0;background:center/cover no-repeat;opacity:.28;pointer-events:none}
.kh-motif-divider.kh-motif-route{background-image:url('/assets/motifs/kh-motif-route-divider.svg')}
.kh-motif-divider.kh-motif-footprints{background-image:url('/assets/motifs/kh-motif-footprints-divider.svg')}
.kh-motif-bg{isolation:isolate}
.kh-motif-bg::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.08;
  background:right center/auto 130% no-repeat;
  -webkit-mask-image:linear-gradient(to right,transparent 62%,#000 85%);mask-image:linear-gradient(to right,transparent 62%,#000 85%)}
.kh-motif-bg.kh-motif-arrow::before{background-image:url('/assets/motifs/kh-motif-arrow-layer.svg')}
.kh-motif-bg.kh-motif-contours::before{background-image:url('/assets/motifs/kh-motif-contours-layer.svg')}
.kh-motif-bg.kh-motif-ticket::before{background-image:url('/assets/motifs/kh-motif-ticket-layer.svg')}
@media (max-width:1100px){.kh-motif-bg::before{display:none}}

.ig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;list-style:none}
.ig-tile{background:var(--paper-flat);padding:8px;box-shadow:0 1px 1px rgba(22,18,15,.08),0 14px 26px -18px rgba(22,18,15,.5);transform:rotate(var(--tilt,0deg))}
.ig-tile img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.ig-link{margin-top:32px}

.support-head{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:44px}
.support-head>p{max-width:36ch;color:var(--meta)}
.support-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;align-items:start}
.support-member{padding:32px 32px 36px}
.support-col-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}
.support-col-head h3{font:400 var(--h4)/1.15 var(--serif)}
.tier-list{list-style:none}
.tier-list li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:16px 0;border-top:1px solid var(--line)}
.tier-no{font:400 13px/1.6 var(--label);color:var(--red)}
.tier-list h4,.shop-item h4{font:600 16px/1.3 var(--sans)}
.tier-list p{font-size:15px;margin-top:4px}
.shop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;list-style:none}
.shop-item{padding:12px 12px 18px}
.shop-art{aspect-ratio:4/5;display:grid;place-items:center;overflow:hidden;background:var(--paper-base);color:var(--ink)}
.shop-art svg{width:80%;height:auto}
.shop-art-photo img{display:block;width:100%;height:100%;object-fit:contain}
.shop-item h4{margin-top:12px}
.shop-item p{font-size:14px;margin-top:4px}
.shop-item .shop-state{font:400 12px/1.4 var(--label);color:var(--meta);letter-spacing:.06em;text-transform:uppercase;margin-top:10px}
.kh-inactive-form{margin-top:24px}
.kh-inactive-form .form-notice{margin:0 0 14px}
.kh-inactive-form fieldset{border:0;display:flex;flex-direction:column;gap:14px}
.kh-inactive-form label{display:flex;flex-direction:column;gap:6px;font:600 14px/1.35 var(--sans)}
.kh-inactive-form input[type=email]{width:100%;min-height:46px;padding:11px 12px;background:#f1eee8;border:1px solid var(--meta);color:var(--meta);font:400 16px/1.4 var(--sans)}
.kh-inactive-form .choice{gap:8px}
.kh-inactive-form .choice legend{font:600 14px/1.35 var(--sans);margin-bottom:6px}
.kh-inactive-form .checkbox{flex-direction:row;align-items:center;gap:10px;font-weight:400}
.kh-inactive-form .checkbox input{width:20px;height:20px;flex:none}
.kh-inactive-form .button{align-self:flex-start}

.partner-banner[hidden]{display:none}
.partner-banner{margin-top:64px;border-top:2px solid var(--ink);border-bottom:1px solid var(--line);background:var(--paper-flat)}
.partner-banner+.site-footer{margin-top:40px}
.partner-banner .wrap{display:flex;align-items:center;gap:20px;min-height:56px}
.pb-title{flex:none;font:400 13px/1.3 var(--label);letter-spacing:.06em;text-transform:uppercase}
.pb-window{flex:1;min-width:0;overflow:hidden}
.pb-track{display:flex;width:max-content;list-style:none}
.pb-track li{display:inline-flex;align-items:baseline;gap:8px;padding-right:40px;white-space:nowrap}
.pb-tag{font:400 12px/1 var(--label);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--ink);padding:3px 6px}
.pb-name{font:600 15px/1.3 var(--sans)}
.pb-toggle{flex:none;min-height:44px;min-width:44px;padding:0 14px;background:none;border:1.5px solid var(--ink);font:600 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.partner-banner[data-moving="false"] .pb-track{width:auto;flex-wrap:wrap;row-gap:8px}
@media (prefers-reduced-motion:no-preference){
  .partner-banner[data-moving="true"] .pb-track{animation:kh-pb-scroll 40s linear infinite}
  .partner-banner[data-moving="true"]:hover .pb-track,.partner-banner[data-moving="true"]:focus-within .pb-track,
  .partner-banner[data-paused="true"] .pb-track{animation-play-state:paused}
}
@keyframes kh-pb-scroll{to{transform:translateX(-50%)}}

@media (max-width:1100px){
  .support-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .ig-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .ig-tile{transform:none;padding:6px}
  .support-head{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:30px}
  .support-member{padding:24px 20px 28px}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
  .partner-banner .wrap{flex-wrap:wrap;gap:10px 16px;padding-top:10px;padding-bottom:10px}
  .pb-window{order:3;flex-basis:100%}
}
