/* Direction 04: Frame. A proposed typographic departure requested through the new visual reference. */
@font-face{font-family:Anton;src:url('./assets/fonts/Anton-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
.direction-frame{--bg:#090909;--fg:#fff;--muted:#b8b8b8;--line:#4c4c4c;--display:Anton,'Arial Narrow',Impact,sans-serif;background:var(--bg);color:var(--fg)}
.direction-frame h1,.direction-frame h2,.direction-frame h3{font-weight:400;text-transform:uppercase;letter-spacing:-.005em;line-height:1.1;text-wrap:pretty}
.direction-frame .meta{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:400}
.direction-frame .site-header{width:min(var(--content),calc(100% - var(--gutter)*2));margin:26px auto 0;padding:22px 36px;border:1px solid #676767;min-height:110px;background:#090909}
.direction-frame .wordmark{width:132px}.direction-frame .site-header nav{gap:30px}.direction-frame .site-header nav a{font-size:13px}.direction-frame .nav-watch{margin-left:10px}
.direction-frame .button{min-height:46px;padding:11px 20px;font-size:14px;gap:28px}.direction-frame .text-link{font-size:14px}
.frame-hero{border:1px solid #676767;border-top:0;display:grid;grid-template-columns:1fr 1fr;min-height:620px;position:relative;overflow:hidden;background:#090909}
.frame-hero-copy{padding:42px 0 30px 40px;position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.frame-hero h1{font-size:clamp(56px,5.65vw,82px);line-height:1.03;max-width:11.2ch;margin:25px 0 22px}
.frame-byline{font-size:15px;text-transform:uppercase;letter-spacing:.12em}.frame-host-name{font-size:13px;color:var(--muted);margin-top:7px}.frame-hero .button{margin-top:27px}.frame-chapter-line{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#b8b8b8;margin-top:42px;max-width:none}
.frame-portrait{position:relative;overflow:hidden;min-width:0}.frame-portrait img{position:absolute;top:0;left:0;width:100%;height:128%;object-fit:cover;object-position:66% top;max-width:none}
.frame-manifesto{padding:31px 0 34px;display:grid;grid-template-columns:1fr 1.15fr auto;gap:40px;align-items:center}.frame-manifesto h2{font-family:Inter,Arial,sans-serif;font-size:22px;text-transform:none;font-weight:700;letter-spacing:-.03em}.frame-manifesto>p{font-size:15px;color:var(--muted);max-width:39ch}
.direction-frame .collection{padding-block:34px 54px}.direction-frame .section-heading{margin-bottom:26px}.direction-frame .section-heading h2{font-size:43px;line-height:1.06}.direction-frame .section-heading h2 br{display:none}.direction-frame .section-heading h2 br::after{content:' '}
.direction-frame .episode-grid{gap:20px}.direction-frame .episode-card{border:1px solid #676767;padding:10px}.direction-frame .card-copy{padding:4px 12px 10px}.direction-frame .episode-card h3{font-size:30px;line-height:1.12}.direction-frame .card-image{border:1px solid #383838}.direction-frame .guest-line{font-size:13px}.direction-frame .episode-card .meta{font-size:10px;letter-spacing:.11em}.direction-frame .episode-card .text-link{margin-top:16px}
.frame-case{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding-block:10px 60px}.frame-case-copy{padding:34px 28px 30px 0}.frame-case-copy h2{font-size:54px;margin:20px 0}.frame-case-copy>p:not(.meta){font-size:16px;color:var(--muted);max-width:48ch}.frame-case-copy .text-link{margin-top:23px}.frame-question{padding:40px;border:1px solid #676767;outline:1px solid #b8b8b8;outline-offset:-11px;display:flex;flex-direction:column;justify-content:center}.frame-question h2{font-size:clamp(48px,5vw,72px);line-height:1.06;margin-top:25px}
.direction-frame .site-footer{border-top:1px solid #4c4c4c;background:#090909;padding-top:45px}.direction-frame .footer-top{padding-bottom:40px}.direction-frame .footer-top h2{font-size:52px}.direction-frame .footer-bottom{padding-top:28px}.direction-frame .footer-bottom p{text-transform:none}
.direction-frame .page-intro{padding-top:45px;padding-bottom:45px}.direction-frame .page-intro h1{font-size:clamp(52px,6vw,82px);line-height:1.06;max-width:19ch}.direction-frame .page-intro>p:last-child{font-size:16px}
.direction-frame .filter-bar{padding-block:17px}.direction-frame .filter{font-size:13px}.direction-frame .result-header p{margin:0}.direction-frame .library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.direction-frame .library-grid h3{font-size:38px;max-width:23ch}.direction-frame .episode-library{padding-bottom:60px}
.direction-frame .episode-heading{padding-block:32px 36px}.direction-frame .episode-heading h1{font-size:clamp(48px,6vw,83px);max-width:21ch;line-height:1.08}.direction-frame .episode-byline{font-size:14px}.direction-frame .back-link{margin-bottom:27px}.direction-frame .video-player{border:1px solid #676767;padding:10px}.direction-frame .video-poster .play-button{text-transform:uppercase;letter-spacing:.04em}.direction-frame .episode-body{padding-top:43px;gap:65px}.direction-frame .reading-column h2{font-size:42px}.direction-frame .reading-column p{font-size:17px}.direction-frame .guest-card h2{font-size:31px}.direction-frame .guest-card p{font-size:13px}.direction-frame .clarification{padding:22px;background:#141414;border:1px solid #676767}.direction-frame .clarification p{font-size:14px}.direction-frame .reading-column>section{margin-bottom:45px}.direction-frame .related{padding-bottom:60px}.direction-frame .related h2{font-size:43px}.direction-frame .error-label span{color:#ffa99f}.direction-frame .error-label input{border-color:#ffa99f}
@media(min-width:701px) and (max-width:1050px){.direction-frame .site-header{padding-inline:25px}.frame-hero{grid-template-columns:1.1fr 1fr;min-height:570px}.frame-hero-copy{padding:30px 0 27px 25px}.frame-hero h1{font-size:60px;max-width:10.8ch}.frame-byline{font-size:12px;letter-spacing:.08em}.frame-chapter-line{font-size:9px;letter-spacing:.08em}.frame-portrait img{object-position:62% top}.frame-manifesto{grid-template-columns:1fr 1.3fr;gap:20px}.frame-manifesto .text-link{grid-column:2}.frame-case{gap:18px}.frame-question{padding:30px}.frame-question h2{font-size:52px}.direction-frame .episode-grid{grid-template-columns:1fr 1fr}.direction-frame .episode-grid .episode-card:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}.direction-frame .episode-body{gap:35px}.direction-frame .library-grid h3{font-size:33px}}
@media(max-width:700px){.direction-frame{--gutter:18px}.direction-frame .site-header{margin-top:18px;padding:16px 20px;min-height:93px}.direction-frame .wordmark{width:114px}.direction-frame .site-header nav{gap:6px}.direction-frame .site-header nav a{font-size:15px}.frame-hero{display:flex;flex-direction:column;min-height:0}.frame-hero-copy{padding:29px 21px 24px;display:block}.frame-hero .meta{font-size:10px}.frame-hero h1{font-size:clamp(47px,12.6vw,65px);max-width:12ch;margin:22px 0}.frame-byline{font-size:12px;letter-spacing:.08em}.frame-host-name{font-size:12px}.frame-hero .button{margin-top:22px}.frame-chapter-line{margin-top:25px;font-size:9px;letter-spacing:.09em;line-height:1.8}.frame-portrait{height:340px;width:100%;border-top:1px solid #383838}.frame-portrait img{height:133%;object-position:67% top}.frame-manifesto{grid-template-columns:1fr;gap:20px;padding-block:27px}.frame-manifesto h2{font-size:22px}.frame-manifesto>p{font-size:15px}.frame-manifesto .text-link{margin-top:0}.direction-frame .collection{padding-block:28px 35px}.direction-frame .section-heading{gap:13px}.direction-frame .section-heading h2{font-size:37px}.direction-frame .episode-grid{grid-template-columns:1fr;gap:20px}.direction-frame .card-copy{padding:3px 10px 10px}.direction-frame .episode-card h3{font-size:31px}.direction-frame .episode-card .meta{font-size:10px}.frame-case{grid-template-columns:1fr;gap:20px;padding-bottom:38px}.frame-case-copy{padding:10px 2px 12px}.frame-case-copy h2{font-size:45px;margin:18px 0}.frame-case-copy>p:not(.meta){font-size:16px}.frame-question{padding:34px 28px;min-height:310px}.frame-question h2{font-size:51px;margin-top:22px}.direction-frame .footer-top h2{font-size:43px}.direction-frame .page-intro{padding-block:32px}.direction-frame .page-intro h1{font-size:48px}.direction-frame .library-grid{grid-template-columns:1fr;gap:22px}.direction-frame .library-grid h3{font-size:31px}.direction-frame .episode-heading{padding-block:20px 28px}.direction-frame .episode-heading h1{font-size:46px;max-width:15ch}.direction-frame .episode-heading .meta{font-size:10px}.direction-frame .episode-byline{font-size:13px}.direction-frame .video-player{padding:7px}.direction-frame .episode-body{gap:25px;padding-top:28px}.direction-frame .reading-column h2{font-size:35px}.direction-frame .guest-card h2{font-size:26px}.direction-frame .guest-card{grid-template-columns:80px 1fr;gap:17px}.direction-frame .related h2{font-size:36px}.direction-frame .related{padding-bottom:40px}.direction-frame .clarification{padding:17px}.direction-frame .reading-column .meta{font-size:10px}.direction-frame .reading-column>section{margin-bottom:33px}}
/* Fit the longer real episode question into a compact title block. */
@media(min-width:1051px){.frame-hero h1{font-size:clamp(64px,5.3vw,76px);max-width:none;width:100%;padding-right:22px;line-height:1.05}.frame-hero{min-height:610px}}
/* Selected hero: one continuous photograph with editable logo, navigation and headline. */
.direction-frame.page-home #app{position:relative}
.direction-frame.page-home .site-header{position:absolute;z-index:5;inset:0 0 auto;margin:0 auto;width:100%;max-width:1600px;min-height:0;padding:30px 3.65%;border:0;background:transparent;align-items:flex-start}
.direction-frame.page-home .site-header .wordmark{width:175px}
.direction-frame.page-home .site-header nav{gap:42px;padding-top:0}
.direction-frame.page-home .site-header nav a{font-size:16px}
.direction-frame.page-home .frame-hero{width:100%;max-width:1600px;aspect-ratio:1656/734;min-height:0;display:block;border:0;margin:0 auto;position:relative;overflow:hidden}
.frame-hero-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.direction-frame.page-home .frame-hero-copy{position:relative;display:block;padding:11.4% 3.65% 6%;width:53%;z-index:1}
.direction-frame.page-home .frame-hero h1{font-size:clamp(48px,7.55vw,121px);line-height:1.08;letter-spacing:-.008em;margin:0 0 16px;padding:0;max-width:none;width:100%;text-wrap:nowrap}
.direction-frame.page-home .frame-byline{font:400 clamp(12px,1.35vw,21px)/1.4 Inter,Arial,sans-serif;letter-spacing:.22em;margin:0}
.direction-frame.page-home .frame-hero .button{margin-top:25px;min-height:46px;padding:10px 23px;font-size:16px;display:inline-flex;justify-content:center;gap:0}
#frame-watch-dialog{max-width:560px;width:calc(100% - 40px);padding:32px;background:#101010;color:#fff;border:1px solid #777}#frame-watch-dialog::backdrop{background:#000b}#frame-watch-dialog h2{font-size:34px}#frame-watch-dialog p{margin:20px 0 26px;font-size:16px}#frame-watch-dialog .button{margin:0 12px 14px 0}
@media(min-width:1601px){.direction-frame.page-home .frame-hero-copy{padding-top:182px}.direction-frame.page-home .frame-hero h1{font-size:121px}}
@media(min-width:701px) and (max-width:1050px){.direction-frame.page-home .site-header{padding-top:22px}.direction-frame.page-home .site-header .wordmark{width:125px}.direction-frame.page-home .site-header nav{gap:25px}.direction-frame.page-home .site-header nav a{font-size:14px}.direction-frame.page-home .frame-hero-copy{padding-top:13.5%}.direction-frame.page-home .frame-hero h1{font-size:7.4vw;margin-bottom:12px}.direction-frame.page-home .frame-hero .button{font-size:13px;min-height:40px;margin-top:18px;padding:8px 17px}}
@media(max-width:700px){.direction-frame.page-home .site-header{padding:22px;align-items:center}.direction-frame.page-home .site-header .wordmark{width:128px}.direction-frame.page-home .site-header nav.open{background:#090909;padding:22px;margin-top:12px}.direction-frame.page-home .frame-hero{aspect-ratio:auto;min-height:740px}.frame-hero-background{height:460px;object-position:70% center}.direction-frame.page-home .frame-hero-copy{width:100%;padding:455px 22px 32px;background:linear-gradient(transparent 380px,#090909 457px)}.direction-frame.page-home .frame-hero h1{font-size:clamp(48px,13.5vw,76px);margin-bottom:18px;line-height:1.05}.direction-frame.page-home .frame-byline{font-size:12px;letter-spacing:.19em}.direction-frame.page-home .frame-hero .button{font-size:15px;margin-top:22px}.direction-frame.page-home .frame-manifesto{border-top:1px solid var(--line)}}
/* Selected Frame site: immersive viewport and a quieter landing page. */
.direction-frame.page-home .site-header{max-width:none}
.direction-frame.page-home .frame-hero{max-width:none;height:100svh;min-height:0;aspect-ratio:auto}
.direction-frame.page-home .frame-hero-copy{position:absolute;left:0;top:50%;transform:translateY(-42%);padding:0 3.65%;width:53%;background:none}
.direction-frame.page-home .frame-hero-background{height:100%;object-fit:cover;object-position:60% center}
.direction-frame.page-home .collection{padding-block:70px;border-top:0}
.direction-frame.page-home .collection .episode-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 32px}
.direction-frame.page-home .collection .episode-card{padding:0;border:0}
.direction-frame.page-home .collection .card-copy{padding:0}
.direction-frame.page-home .collection .card-copy>.meta,.direction-frame.page-home .collection .card-copy>.text-link{display:none}
.direction-frame.page-home .collection .episode-card h3{margin-top:20px}
.direction-frame.page-home .frame-case{padding-bottom:60px}
@media(max-width:900px){.direction-frame.page-home .frame-hero-background{height:63%;object-position:70% center}.direction-frame.page-home .frame-hero-copy{top:auto;bottom:0;left:0;transform:none;width:100%;padding:42px 22px max(32px,5svh);background:linear-gradient(transparent,#090909 40px)}.direction-frame.page-home .frame-hero h1{font-size:clamp(42px,7svh,72px);line-height:1.05;margin-bottom:18px}.direction-frame.page-home .frame-byline{font-size:12px}.direction-frame.page-home .frame-hero .button{font-size:15px;margin-top:22px}.direction-frame.page-home .collection{padding-block:40px}.direction-frame.page-home .collection .episode-grid{grid-template-columns:1fr;gap:32px}.direction-frame.page-home .collection .episode-card:last-child{grid-column:auto;display:block}}
@media(max-height:500px) and (min-width:901px){.direction-frame.page-home .frame-hero h1{font-size:clamp(44px,13vh,65px)}.direction-frame.page-home .frame-hero-copy{transform:translateY(-28%)}.direction-frame.page-home .site-header{padding-top:18px}.direction-frame.page-home .site-header .wordmark{width:130px}.direction-frame.page-home .frame-hero .button{margin-top:16px}}
@media(max-width:900px){.direction-frame.page-home .frame-hero h1{font-size:clamp(38px,min(7svh,13vw),72px)}}
