.media-page { background: var(--ink); color: var(--paper); overflow: hidden; }
.media-page section { position: relative; }
.media-section-no, .media-hero-no { position: absolute; z-index: 4; font-size: 9px; letter-spacing: .28em; opacity: .48; }
.media-section-no { left: var(--pad); top: 38px; }

.media-hero { min-height: 100svh; padding: 128px var(--pad) 46px; display: grid; grid-template-columns: 56fr 44fr; align-items: center; isolation: isolate; border-bottom: 1px solid var(--line); }
.media-hero::before { content:""; position:absolute; inset:0; z-index:-2; background: radial-gradient(circle at 76% 44%, rgba(184,145,87,.17), transparent 28%), linear-gradient(90deg, transparent 49.8%, rgba(238,233,222,.06) 50%, transparent 50.15%); }
.media-hero-no { right: var(--pad); bottom: 38px; }
.media-hero-ghost { position:absolute; z-index:0; left:var(--pad); bottom:13vh; font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(90px,15vw,260px); line-height:.75; letter-spacing:.03em; color:rgba(238,233,222,.025); pointer-events:none; user-select:none; }
.media-hero-copy { position: relative; z-index: 3; grid-column: 1; align-self: end; justify-self: start; width:min(760px,48vw); padding-bottom: 10vh; }
.media-hero-copy h1 { margin:0; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; text-transform:uppercase; font-size: clamp(88px, 13vw, 224px); line-height:.78; letter-spacing:.01em; }
.media-hero-copy h1 span, .media-hero-copy h1 strong, .media-hero-copy h1 em { display:block; font-style:normal; font-weight:900; }
.media-hero-copy h1 span { color:transparent; -webkit-text-stroke: 1.7px rgba(238,233,222,.9); }
.media-hero-copy h1 strong { color:var(--paper); margin-left:3vw; }
.media-hero-copy h1 em { color:var(--gold); margin-left:7vw; }
.media-hero-lead { margin: 34px 0 0 7vw; max-width:560px; font: 400 clamp(20px,2vw,34px)/1.2 Georgia,serif; }
.media-hero-lead em { color:var(--gold); }
.media-hero-image { position:absolute; z-index:1; right:5vw; top:16vh; width:min(37vw,600px); height:min(68vh,760px); transform:rotate(2.5deg); clip-path:polygon(8% 0,100% 8%,94% 94%,0 100%,3% 18%); }
.media-hero-note { position:absolute; z-index:3; right:var(--pad); bottom:15vh; width:190px; }
.media-hero-note span { display:block; width:54px; height:1px; background:var(--gold); margin-bottom:14px; }
.media-hero-note p { margin:0; text-transform:uppercase; font-size:10px; letter-spacing:.2em; line-height:1.7; }

.media-featured { min-height:120svh; padding:16vh var(--pad) 12vh; background:#0d0d0c; }
.media-featured-word { position:absolute; right:-1vw; top:2vh; font-family:Impact,sans-serif; font-size:31vw; line-height:.8; color:rgba(238,233,222,.035); pointer-events:none; }
.media-featured-head { position:relative; z-index:2; width:min(830px,70vw); margin-left:8vw; }
.media-featured-head h2, .media-gallery-head h2, .media-sessions-head h2 { margin:0; font:400 clamp(58px,7vw,120px)/.9 Georgia,serif; letter-spacing:-.055em; }
.media-featured-head h2 em, .media-sessions-head h2 em { color:var(--gold); }
.media-featured-head > p:last-child { width:min(540px,70%); margin:30px 0 0 22vw; color:var(--paper-muted); font-size:17px; line-height:1.7; }
.media-featured-screen { position:relative; z-index:2; margin:9vh auto 0; width:min(1320px,92vw); display:grid; grid-template-columns:minmax(0,1fr) 310px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.media-featured-visual { position:relative; aspect-ratio:16/9; overflow:hidden; background:#151410; }
.media-featured-visual img { width:100%; height:100%; object-fit:cover; filter:saturate(.45) contrast(1.12) brightness(.7); }
.media-featured-visual::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at center,transparent 25%,rgba(0,0,0,.38) 100%); }
.media-play { position:absolute; z-index:3; left:50%; top:50%; transform:translate(-50%,-50%); width:96px; height:96px; border:1px solid rgba(238,233,222,.68); border-radius:50%; display:grid; place-items:center; padding-left:5px; font-size:18px; }
.media-featured-caption { position:absolute; z-index:3; left:28px; bottom:26px; }
.media-featured-caption small { display:block; margin-bottom:8px; color:var(--gold); font-size:8px; letter-spacing:.23em; }
.media-featured-caption strong { font:400 clamp(24px,3vw,48px)/1 Georgia,serif; }
.media-featured-meta { padding:36px 28px; display:flex; flex-direction:column; justify-content:flex-end; border-left:1px solid var(--line); }
.media-featured-meta > span { margin-bottom:auto; font-family:Impact,sans-serif; font-size:70px; color:rgba(238,233,222,.15); }
.media-featured-meta p { font:400 17px/1.65 Georgia,serif; color:var(--paper-muted); }
.media-featured-meta small { margin-top:24px; color:var(--gold); font-size:8px; letter-spacing:.22em; }

.media-gallery { min-height:135svh; padding:15vh var(--pad) 12vh; background:var(--paper); color:var(--ink); }
.media-gallery .media-section-no { color:var(--ink); }
.media-gallery-head { width:min(850px,80vw); margin-left:8vw; }
.media-gallery-head .wtl-kicker { color:#765d38; }
.media-gallery-head h2 span { color:#765d38; font-style:italic; }
.media-collage { position:relative; min-height:112vh; margin-top:4vh; }
.media-shot { position:absolute; overflow:hidden; box-shadow:0 24px 65px rgba(0,0,0,.17); }
.media-shot img { width:100%; height:100%; object-fit:cover; filter:saturate(.42) contrast(1.08); }
.media-shot-a { left:3vw; top:10vh; width:28vw; height:48vh; transform:rotate(-3deg); }
.media-shot-b { left:38vw; top:2vh; width:34vw; height:58vh; transform:rotate(2deg); }
.media-shot-c { right:1vw; bottom:2vh; width:25vw; height:40vh; transform:rotate(-2deg); }
.media-collage-copy { position:absolute; left:14vw; bottom:5vh; width:min(500px,30vw); padding:28px 30px 24px; background:rgba(238,233,222,.94); z-index:4; }
.media-collage-copy p { font:400 clamp(20px,1.7vw,28px)/1.5 Georgia,serif; }
.media-collage-copy span { display:block; margin-top:28px; color:#765d38; font-size:9px; letter-spacing:.24em; }

.media-sessions { min-height:110svh; padding:16vh var(--pad) 12vh; background:#0b0b0a; }
.media-sessions-ghost { position:absolute; left:-2vw; top:3vh; font-family:Impact,sans-serif; font-size:35vw; line-height:.8; color:rgba(238,233,222,.035); pointer-events:none; }
.media-sessions-head { position:relative; z-index:2; display:grid; grid-template-columns:2fr 1fr; gap:6vw; align-items:end; margin-left:8vw; }
.media-sessions-head .wtl-kicker, .media-sessions-head h2 { grid-column:1; }
.media-sessions-head > p:last-child { grid-column:2; grid-row:2; color:var(--paper-muted); font:400 17px/1.65 Georgia,serif; }
.media-session-list { position:relative; z-index:2; margin-top:9vh; border-top:1px solid var(--line); }
.media-session { min-height:150px; display:grid; grid-template-columns:120px minmax(0,1fr) 120px; gap:30px; align-items:center; border-bottom:1px solid var(--line); transition:padding .25s ease,background .25s ease; }
.media-session:hover { padding-left:16px; padding-right:16px; background:rgba(238,233,222,.035); }
.media-session-no { font-family:Impact,sans-serif; font-size:56px; color:var(--gold); }
.media-session small { color:var(--gold); font-size:8px; letter-spacing:.23em; }
.media-session h3 { margin:8px 0 8px; font:400 clamp(25px,2.7vw,46px)/1 Georgia,serif; }
.media-session p { margin:0; color:var(--paper-muted); font-size:14px; }
.media-session-state { justify-self:end; border:1px solid rgba(238,233,222,.25); padding:7px 9px; font-size:8px; letter-spacing:.16em; opacity:.55; }

.media-home-booking { border-top:1px solid rgba(10,10,9,.2); }

@media (max-width:900px) {
    .media-hero { display:block; padding-top:120px; }
    .media-hero-copy { width:72vw; padding-bottom:0; }
    .media-hero-ghost { left:var(--pad); bottom:10vh; font-size:28vw; }
    .media-hero-copy h1 { font-size:24vw; }
    .media-hero-image { top:41vh; right:-5vw; width:62vw; height:48vh; opacity:.88; }
    .media-hero-lead { position:relative; z-index:3; width:55vw; margin-left:2vw; }
    .media-hero-note { display:none; }
    .media-featured-head { width:92%; margin-left:0; }
    .media-featured-head > p:last-child { width:78%; margin-left:12vw; }
    .media-featured-screen { grid-template-columns:1fr; }
    .media-featured-meta { border-left:0; border-top:1px solid var(--line); min-height:240px; }
    .media-gallery { min-height:155svh; }
    .media-gallery-head { width:92%; margin-left:0; }
    .media-shot-a { left:0; width:45vw; height:45vh; }
    .media-shot-b { left:auto; right:0; width:52vw; height:55vh; top:18vh; }
    .media-shot-c { right:6vw; width:42vw; height:38vh; }
    .media-collage-copy { left:0; width:48vw; bottom:4vh; padding:24px; }
    .media-sessions-head { grid-template-columns:1fr; margin-left:0; }
    .media-sessions-head > p:last-child { grid-column:1; grid-row:auto; width:75%; margin-left:12vw; }
}

@media (max-width:560px) {
    .media-hero-copy h1 { font-size:23vw; line-height:.82; }
    .media-hero-image { width:80vw; right:-15vw; top:39vh; }
    .media-hero-lead { width:72vw; font-size:20px; }
    .media-featured { min-height:auto; }
    .media-featured-head h2, .media-gallery-head h2, .media-sessions-head h2 { font-size:13vw; }
    .media-featured-head > p:last-child { width:88%; margin-left:8vw; }
    .media-featured-screen { width:100%; }
    .media-featured-visual { aspect-ratio:4/5; }
    .media-play { width:70px; height:70px; }
    .media-gallery { min-height:165svh; }
    .media-shot-a { width:60vw; height:38vh; }
    .media-shot-b { width:67vw; height:45vh; top:36vh; }
    .media-shot-c { width:55vw; height:34vh; bottom:3vh; }
    .media-collage-copy { width:88%; left:0; bottom:40vh; padding:22px 20px; }
    .media-session { grid-template-columns:65px minmax(0,1fr); gap:16px; padding:20px 0; }
    .media-session-state { display:none; }
    .media-session-no { font-size:40px; }
    .media-session h3 { font-size:26px; }
}

/* V16.8.1 — custom audio sessions */
.media-session { grid-template-columns:120px minmax(0,1fr) 120px; }
.media-session-copy { min-width:0; }
.media-session-state.is-live { color:var(--gold); border-color:rgba(184,145,87,.55); opacity:1; }
.media-session.is-playing { background:rgba(238,233,222,.045); }
.media-session.is-playing .media-session-state { color:var(--paper); }
.media-audio { display:flex; align-items:center; gap:18px; margin-top:22px; max-width:720px; }
.media-audio-toggle { flex:0 0 44px; width:44px; height:44px; border:1px solid rgba(238,233,222,.42); border-radius:50%; background:transparent; color:var(--paper); cursor:pointer; display:grid; place-items:center; transition:border-color .2s ease, background .2s ease, color .2s ease; }
.media-audio-toggle:hover, .media-audio-toggle:focus-visible { border-color:var(--gold); color:var(--gold); outline:none; }
.media-session.is-playing .media-audio-toggle { background:var(--gold); border-color:var(--gold); color:var(--ink); }
.media-audio-icon { font-size:12px; transform:translateX(1px); }
.media-session.is-playing .media-audio-icon { transform:none; }
.media-audio-track { flex:1 1 auto; min-width:0; }
.media-audio-range { width:100%; height:18px; margin:0; appearance:none; -webkit-appearance:none; background:transparent; cursor:pointer; }
.media-audio-range::-webkit-slider-runnable-track { height:1px; background:linear-gradient(90deg,var(--gold) 0 var(--audio-progress,0%),rgba(238,233,222,.28) var(--audio-progress,0%) 100%); }
.media-audio-range::-moz-range-track { height:1px; background:rgba(238,233,222,.28); }
.media-audio-range::-moz-range-progress { height:1px; background:var(--gold); }
.media-audio-range::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:8px; height:8px; margin-top:-3.5px; border-radius:50%; border:0; background:var(--gold); }
.media-audio-range::-moz-range-thumb { width:8px; height:8px; border-radius:50%; border:0; background:var(--gold); }
.media-audio-time { margin-top:7px; display:flex; justify-content:space-between; color:rgba(238,233,222,.5); font-size:8px; letter-spacing:.12em; font-variant-numeric:tabular-nums; }
.media-audio audio { display:none; }
@media (max-width:560px) {
    .media-session { grid-template-columns:48px minmax(0,1fr); gap:12px; }
    .media-session-no { font-size:34px; }
    .media-audio { gap:12px; margin-top:18px; }
    .media-audio-toggle { flex-basis:40px; width:40px; height:40px; }
}

/* V16.8.2 — audio player layout polish */
.media-session-copy {
    padding: 24px 0;
}

.media-audio {
    width: 100%;
    max-width: none;
    margin-top: 18px;
}

.media-audio-track {
    width: 100%;
}

.media-session-state {
    align-self: center;
}

@media (max-width: 980px) {
    .media-session {
        grid-template-columns: 86px minmax(0, 1fr) auto;
        gap: 22px;
    }

    .media-session-no {
        font-size: 48px;
    }
}

@media (max-width: 560px) {
    .media-session {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 12px;
        padding: 22px 0;
    }

    .media-session:hover {
        padding-left: 0;
        padding-right: 0;
    }

    .media-session-copy {
        padding: 0;
    }

    .media-audio {
        width: 100%;
        gap: 12px;
        margin-top: 16px;
    }

    .media-audio-track {
        min-width: 0;
    }

    .media-session-state {
        display: none;
    }
}

/* --- Editorial photography --------------------------------------------------
   Explicit rows keep the composition graphic without absolute-position
   collisions or large accidental holes. Source ratios remain untouched. */
.media-editorial-intro { position:relative; overflow:clip; padding:15vh var(--pad) 13vh; background:var(--paper); color:var(--ink); border-bottom:1px solid rgba(10,10,9,.14); }
.media-editorial-intro .media-section-no { color:rgba(10,10,9,.48); }
.media-editorial-copy { width:min(950px,76vw); margin-left:8vw; }
.media-editorial-copy .wtl-kicker { color:#765d38; }
.media-editorial-copy h2 { margin:0 0 46px; font:400 clamp(58px,7vw,120px)/.9 Georgia,serif; letter-spacing:-.055em; }
.media-editorial-copy h2 em { color:#765d38; }
.media-editorial-copy > p { width:min(610px,74%); margin:0 0 0 18vw; font-size:17px; line-height:1.72; }
.media-editorial-copy > p + p { margin-top:18px; }

.media-gallery { min-height:auto; padding-bottom:14vh; }
.media-collage.media-collage-real {
    position:relative;
    min-height:0;
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-template-rows:auto auto auto auto;
    gap:clamp(20px,2.3vw,38px);
    margin:8vh 2vw 0;
    align-items:start;
}
.media-collage-real .media-real-shot {
    position:relative;
    inset:auto;
    width:100%;
    height:auto;
    margin:0 !important;
    box-shadow:0 20px 50px rgba(0,0,0,.15);
}
.media-collage-real .media-real-shot img { width:100%; height:auto; object-fit:contain; }

/* Upper composition: the text deliberately occupies the negative space below
   the first photograph instead of leaving an accidental blank area. */
.media-real-ag27 { grid-column:1 / 5; grid-row:1; transform:rotate(-1.2deg) !important; }
.media-real-ag62 { grid-column:5 / 10; grid-row:1 / span 2; transform:rotate(.5deg) !important; z-index:2; align-self:start; }
.media-real-ag57 { grid-column:10 / 13; grid-row:1 / span 2; transform:rotate(-.8deg) !important; }
.media-collage-real .media-collage-copy {
    position:relative;
    inset:auto;
    grid-column:1 / 5;
    grid-row:2;
    width:auto;
    margin:0;
    align-self:start;
    padding:30px 34px;
    background:rgba(238,233,222,.96);
}

/* Lower composition: landscape + details continue the visual rhythm without
   forcing the height of the upper portrait group. */
.media-real-ar54 { grid-column:1 / 7; grid-row:3; transform:rotate(.5deg) !important; }
.media-real-div21 { grid-column:7 / 10; grid-row:3; transform:rotate(1deg) !important; }
.media-real-div25 { grid-column:10 / 13; grid-row:3; transform:rotate(.8deg) !important; }
.media-real-div3 { grid-column:2 / 6; grid-row:4; transform:rotate(-.7deg) !important; }
.media-real-div29 { grid-column:7 / 11; grid-row:4; transform:rotate(1deg) !important; }

.media-photo-credit { margin:5vh 2vw 0 auto; width:max-content; max-width:90%; font-size:9px; text-transform:uppercase; letter-spacing:.18em; opacity:.62; }

@media (max-width:900px) {
    .media-editorial-copy { width:92%; margin-left:0; }
    .media-editorial-copy > p { width:78%; margin-left:12vw; }
    .media-collage.media-collage-real { grid-template-columns:repeat(6,minmax(0,1fr)); grid-template-rows:auto; margin-left:0; margin-right:0; gap:22px; }
    .media-real-ag27 { grid-column:1 / 3; grid-row:1; }
    .media-real-ag62 { grid-column:3 / 7; grid-row:1 / span 2; transform:rotate(.4deg) !important; }
    .media-collage-real .media-collage-copy { grid-column:1 / 3; grid-row:2; margin:0; padding:24px; }
    .media-real-ag57 { grid-column:1 / 3; grid-row:3; }
    .media-real-ar54 { grid-column:3 / 7; grid-row:3; }
    .media-real-div21 { grid-column:1 / 3; grid-row:4; }
    .media-real-div25 { grid-column:3 / 5; grid-row:4; }
    .media-real-div3 { grid-column:5 / 7; grid-row:4; }
    .media-real-div29 { grid-column:2 / 5; grid-row:5; }
}
@media (max-width:560px) {
    .media-editorial-copy { width:100%; }
    .media-editorial-copy h2 { font-size:13vw; }
    .media-editorial-copy > p { width:92%; margin-left:4vw; }
    .media-collage.media-collage-real { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .media-real-ag62 { grid-column:1/-1; grid-row:auto; width:84% !important; justify-self:end; transform:none !important; }
    .media-real-ag27,.media-real-div21,.media-real-div25,.media-real-div3,.media-real-div29,.media-real-ag57 { grid-column:auto; grid-row:auto; transform:none !important; }
    .media-real-ar54 { grid-column:1/-1; grid-row:auto; transform:none !important; }
    .media-collage-real .media-collage-copy { grid-column:1/-1; grid-row:auto; margin:12px 0 0; }
    .media-photo-credit { margin-right:0; }
}


/* V16.11.10 — mobile hero in document flow */
@media (max-width:560px) {
  .media-hero {
    min-height:auto;
    padding-top:104px;
    padding-bottom:74px;
  }
  .media-hero-copy { width:100%; padding-bottom:0; }
  .media-hero-image.wtl-photo {
    position:relative;
    inset:auto;
    width:88vw;
    height:52vh;
    min-height:410px;
    max-height:560px;
    margin:32px -4vw 0 auto;
    transform:rotate(2deg);
  }
  .media-hero-lead { width:88%; margin-left:2vw; }
  .media-hero-no { bottom:24px; }
}

/* V16.11.14 — featured live video */
.media-featured-visual--video {
    aspect-ratio:5/4;
    background:#050505;
}
.media-featured-visual--video::after,
.media-featured-visual--video .media-play {
    display:none;
}
.media-featured-video {
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    background:#050505;
}
.media-featured-visual--video .media-featured-caption {
    top:24px;
    bottom:auto;
    pointer-events:none;
    text-shadow:0 2px 14px rgba(0,0,0,.9);
}
@media (max-width:560px) {
    .media-featured-visual--video { aspect-ratio:5/4; }
    .media-featured-visual--video .media-featured-caption { top:16px; left:16px; }
}