/*
Theme Name: Cedar Storyteller
Theme URI: https://cedardaniels.com
Author: Cedar Daniels
Description: Screenplay-styled portfolio theme for films, edits, and music.
Version: 3.2.0
Requires PHP: 7.4
Text Domain: cedar
*/
:root{--ground:#15120F;--panel:#241E19;--ink:#EFE6D8;--soft:#CFC4B3;--muted:#A99C8A;--rule:#3A322A;--accent:#E3A24A;--display:'League Gothic','Arial Narrow',sans-serif;--script:'Courier Prime','Courier New',monospace}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:24px}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--script);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--ink);text-decoration:none}a:hover{color:var(--accent)}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
img,video,iframe{max-width:100%;display:block}
.wrap{max-width:1360px;margin:0 auto;padding:0 40px}
@media (max-width:700px){.wrap{padding:0 20px}body{font-size:17px}}
.site-header{display:flex;flex-wrap:wrap;gap:16px 28px;justify-content:space-between;align-items:center;padding-top:28px;padding-bottom:28px}
.brand{font-family:var(--display);font-size:34px;line-height:1;letter-spacing:.02em}
.nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:16px}
.nav .current-menu-item>a,.nav a[aria-current]{color:var(--accent)}
.display{font-family:var(--display);font-weight:400;line-height:.85;margin:0;letter-spacing:.01em}
.hero-title{font-size:clamp(88px,17vw,260px);color:var(--accent);margin-top:36px}
.page-title{font-size:clamp(88px,14vw,210px);color:var(--accent)}
.slug{display:flex;justify-content:space-between;gap:24px;font-weight:700;border-bottom:1px solid var(--rule);padding-bottom:14px;margin:0;font-size:18px}
.transition{font-weight:700;margin:0 0 18px}
.transition.right{text-align:right}
.section{padding-top:150px}
@media (max-width:700px){.section{padding-top:96px}}
.screen{position:relative;aspect-ratio:2.39/1;background:var(--panel);overflow:hidden}
.screen video,.screen iframe,.screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.screen.player{aspect-ratio:16/9;background:#0D0B09}
.screen .note{position:absolute;top:16px;left:20px;font-size:14px;color:var(--muted)}
.thumb{aspect-ratio:16/9;background:var(--panel);overflow:hidden}
.thumb.wide{aspect-ratio:2.39/1}
.thumb img{width:100%;height:100%;object-fit:cover}
.row{display:flex;flex-wrap:wrap;gap:40px 48px}
.row>.main{flex:999 1 560px;min-width:0}
.row>.side{flex:1 1 320px}
.lede{font-size:21px;max-width:46ch;margin:0}
.soft{color:var(--soft)}.muted{color:var(--muted)}
.btns{display:flex;flex-wrap:wrap;gap:14px}
.btn{display:inline-block;border:1px solid var(--ink);padding:12px 21px;font-size:16px}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--ground);font-weight:700}
.btn.quiet{border-color:var(--rule)}
.link{border-bottom:1px solid var(--ink);padding-bottom:4px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:48px 32px;margin-top:40px}
.grid.credits{grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:64px 40px}
@media (max-width:420px){.grid,.grid.credits{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;gap:12px}
.card .t{font-family:var(--display);font-size:40px;line-height:.95}
.card .l{font-size:15px;line-height:1.5;color:var(--soft)}
.credit{display:grid;grid-template-columns:92px 1fr;gap:2px 12px;font-size:14px;line-height:1.5;border-top:1px solid var(--rule);padding-top:10px;margin:0}
.credit dt{color:var(--muted)}.credit dd{margin:0}
.dialogue{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;margin:0 auto}
.dialogue .who{font-weight:700}.dialogue .paren{font-style:italic;color:var(--muted)}.dialogue .line{font-size:22px;max-width:34ch}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 8px}
.filters button{min-height:44px;padding:0 18px;font:inherit;font-size:15px;cursor:pointer;background:transparent;color:var(--ink);border:1px solid var(--rule)}
.filters button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--ground);font-weight:700}
.facts{display:grid;gap:20px;align-content:start;font-size:16px;border-top:1px solid var(--rule);padding-top:22px;margin:0}
.facts dt{color:var(--muted)}.facts dd{margin:0;white-space:pre-line}
.prose{max-width:62ch}.prose p{margin:0 0 20px}
.prose h2,.prose h3{font-family:var(--display);font-weight:400;font-size:48px;line-height:1;margin:48px 0 16px}
.site-footer{padding-top:170px;padding-bottom:48px}
.site-footer .bar{border-top:1px solid var(--rule);padding-top:40px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px}
.site-footer .mail{font-family:var(--display);font-size:clamp(44px,6vw,72px);line-height:1}
.site-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:24px;font-size:16px}
.play{width:88px;height:88px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.yt-list{list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px}
.yt-list button{display:flex;flex-direction:column;gap:10px;width:100%;padding:0;border:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.yt-list button:hover .yt-t,.yt-list button[aria-pressed="true"] .yt-t{color:var(--accent)}
.yt-list button[aria-pressed="true"] .thumb{outline:2px solid var(--accent);outline-offset:2px}
.yt-t{font-size:15px;line-height:1.4}.yt-d{font-size:13px}
.news{list-style:none;margin:0;padding:0;display:grid;gap:28px;max-width:62ch}
.news li{display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--rule);padding-top:16px}
.news-meta{font-size:14px}.news-t{font-size:22px;line-height:1.35}
.wall-group{padding-top:96px}
.wall{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:40px 32px}
.pin{transform:rotate(var(--tilt,0deg));transition:transform .35s ease}
.pin-card{display:block;background:#EFE6D8;color:#2A221C;padding:10px 10px 14px;box-shadow:0 10px 24px rgba(0,0,0,.45);position:relative}
.pin-card::before{content:"";position:absolute;top:-7px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--accent);box-shadow:0 2px 3px rgba(0,0,0,.5)}
.pin-frame{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:#d9cfbf}
.pin-photo,.pin-sketch{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pin-sketch{opacity:1;transition:opacity .7s ease}
.pin-note{display:flex;flex-direction:column;gap:2px;margin-top:10px}
.pin-sc{font-size:12px;font-weight:700;color:#6B5E4E}
.pin-t{font-family:var(--display);font-size:26px;line-height:1;color:#1B1612}
.pin-m{font-size:13px;line-height:1.35;color:#4A4036}
.pin-card:hover,.pin-card:focus-visible{color:#2A221C}
@media (hover:hover){.pin:hover,.pin:focus-within{transform:rotate(0deg) translateY(-6px) scale(1.02);z-index:2}.pin:hover .pin-sketch,.pin:focus-within .pin-sketch{opacity:0}}
.pin.developed .pin-sketch{opacity:0}
@media (prefers-reduced-motion:reduce){.pin,.pin-sketch{transition:none}}
.portrait{flex:0 1 380px;aspect-ratio:4/5;background:var(--panel);position:relative;overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover}.portrait .note{position:absolute;left:18px;bottom:16px;font-size:14px;color:var(--muted)}
.endcredits{background:#000;color:#F4EFE6;margin-top:150px;padding:140px 0 120px}
.cr-title,.cr-end{text-align:center;font-weight:700;margin:0 0 80px;letter-spacing:.12em}
.cr-end{margin:40px 0 0}
.cr-career{max-width:560px;margin:0 auto 160px;padding:0 20px}
.cr-group{display:grid;grid-template-columns:1fr minmax(280px,520px) 1fr;gap:56px;max-width:1360px;margin:0 auto;padding:0 40px 160px}
.cr-side{display:flex;flex-direction:column;gap:140px;padding-top:120px}
.cr-left{align-items:flex-end}.cr-right{align-items:flex-start;padding-top:260px}
.cr-shot{display:block;width:min(100%,360px);opacity:0;transform:translateY(70px) rotate(var(--tilt,0deg)) scale(.96);transition:opacity 1s ease,transform 1.2s cubic-bezier(.2,.7,.2,1)}
.cr-shot.in{opacity:1;transform:rotate(var(--tilt,0deg))}
.sb{background:#EFE6D8;color:#1B1612;padding:10px 12px 12px;box-shadow:0 14px 30px rgba(0,0,0,.6)}
.sb:hover{color:#1B1612}
.sb-head{display:flex;justify-content:space-between;font-size:11px;font-weight:700;letter-spacing:.08em;color:#4A4036;border-bottom:1px solid #1B1612;padding-bottom:6px;margin-bottom:8px}
.sb-frame{position:relative;display:block;border:2px solid #1B1612;overflow:hidden}
.sb-frame img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .6s ease}
.sb:hover .sb-frame img{transform:scale(1.04)}
.sb-tag{position:absolute;top:8px;left:8px;background:#EFE6D8;color:#1B1612;font-size:11px;font-weight:700;padding:2px 6px;border:1px solid #1B1612}
.sb-c{position:absolute;width:16px;height:16px;border-color:#EFE6D8;border-style:solid;border-width:0;opacity:.9}
.sb-tl{display:none}
.sb-tr{inset:6px 6px auto auto;border-top-width:2px;border-right-width:2px}
.sb-bl{inset:auto auto 6px 6px;border-bottom-width:2px;border-left-width:2px}
.sb-br{inset:auto 6px 6px auto;border-bottom-width:2px;border-right-width:2px}
.sb-foot{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:baseline;margin-top:8px;border-top:1px dashed #8D8678;padding-top:6px}
.sb-k{font-size:10px;font-weight:700;letter-spacing:.08em;color:#6B5E4E}
.sb-t{font-size:14px;line-height:1.3;text-align:left}
.sb-y{font-size:12px;color:#6B5E4E}
.sb:hover .sb-t{color:#8A5A16}
.cr-center{text-align:center}
.cr-inline{display:none}
.cr-year{font-family:var(--display);font-size:clamp(80px,11vw,150px);line-height:.85;color:var(--accent);margin:0 0 56px;opacity:0;transform:translateY(30px);transition:opacity .9s ease,transform .9s ease}
.cr-line{margin:0 0 30px;opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.cr-year.in,.cr-line.in{opacity:1;transform:none}
.cr-line dt{font-size:13px;letter-spacing:.06em;color:#8D8678}
.cr-line dd{margin:6px 0 0;font-size:22px;line-height:1.35}
.cr-line a{color:#F4EFE6}.cr-line a:hover,.cr-line a:focus-visible{color:var(--accent)}
.cr-when{display:block;font-size:14px;color:#8D8678;margin-top:2px}
@media (max-width:900px){.cr-group{grid-template-columns:1fr;padding:0 20px 120px}.cr-side{display:none}.cr-inline{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;margin:0 0 40px}}
@media (prefers-reduced-motion:reduce){.cr-shot,.cr-year,.cr-line{opacity:1;transform:none;transition:none}.cr-shot{transform:rotate(var(--tilt,0deg))}}
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border-top:1px solid var(--rule)}
.doors a{display:flex;flex-direction:column;gap:12px;padding:32px 28px 36px 0;border-bottom:1px solid var(--rule)}
.doors .display{font-size:clamp(56px,6vw,84px)}
.doors a:hover .display{color:var(--accent)}
