
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Pinyon Script';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-2.ttf) format('truetype');
}

:root{color-scheme:dark;--ink:#f4f0e9;--dark:#100b0b;--line:rgba(244,240,233,.28)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:40px}body{margin:0;background:var(--dark);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}a:focus-visible,button:focus-visible{outline:2px solid #fff;outline-offset:7px}button,a{-webkit-tap-highlight-color:transparent}.skip{position:fixed;top:-100px;left:20px;padding:12px;background:#000;z-index:10}.skip:focus{top:15px}.hero{min-height:760px;height:100svh;position:relative;isolation:isolate;background:#100707;overflow:hidden}.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 47%;z-index:-3;transition:opacity .35s}.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.05) 40%,rgba(0,0,0,.65))}.hero-photo.fading{opacity:0}header{display:flex;align-items:center;justify-content:space-between;padding:32px 4%;gap:24px}.wordmark{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:35px;letter-spacing:-2px}.nav,.socials{display:flex;align-items:center;gap:30px}.nav a,.socials a,.eyebrow,.outline,.photo-nav button,.scroll-link,.footer-label{font-size:14px;letter-spacing:.12em;text-transform:uppercase}.nav a,.socials a{padding:10px 0}.nav a:hover,.socials a:hover{box-shadow:0 1px var(--ink)}.socials{gap:22px}.socials a{font-size:12px}.hero-title{position:absolute;top:40%;left:50%;transform:translate(-50%,-30%);text-align:center;width:90%}.hero-title h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(100px,15vw,220px);letter-spacing:-.07em;line-height:1.12;margin:0 0 20px;padding-right:.07em}.outline{display:inline-flex;align-items:center;justify-content:center;min-width:210px;padding:18px 32px;border:1px solid rgba(255,255,255,.7);background:rgba(0,0,0,.08);transition:background .2s,color .2s}.outline:hover{background:var(--ink);color:var(--dark)}.hero-bottom{position:absolute;bottom:35px;left:4%;right:4%;display:flex;justify-content:space-between;align-items:center}.photo-nav{display:flex;gap:7px}.photo-nav button{border:0;border-bottom:1px solid transparent;background:transparent;min-height:44px;min-width:38px;padding:8px;cursor:pointer;opacity:.65}.photo-nav button[aria-pressed="true"]{opacity:1;border-color:var(--ink)}.photo-nav button:hover{opacity:1}.scroll-link{border-bottom:1px solid var(--line);padding:12px 0}.music{padding:120px 8%;display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:center}.music-photo{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}.eyebrow{margin:0 0 30px;color:#c6beba}.music h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(50px,5.8vw,88px);font-weight:400;letter-spacing:-.045em;line-height:1.06;margin:0 0 50px}.platforms{border-top:1px solid var(--line)}.platforms a{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:23px 0;gap:12px;font-size:18px;transition:padding .2s}.platforms a:hover{padding-left:10px}.platforms span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#c6beba}.all-links{display:inline-block;font-size:14px;margin-top:28px;text-decoration:underline;text-underline-offset:6px}.footer{padding:40px 4%;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:28px}.footer-label{font-size:12px;color:#c6beba}.footer .socials a{font-size:14px}.footer-brand{display:flex;align-items:center;gap:26px}.photo-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(min-width:1600px){.hero-photo{object-position:center 45%}}@media(max-width:750px){.hero{min-height:650px;max-height:1100px}header{padding:22px 6%;align-items:flex-start}.wordmark{font-size:30px}.nav{gap:21px}.nav a{font-size:12px}header>.socials{display:none}.hero-title{top:44%}.hero-title h1{font-size:clamp(100px,26vw,160px)}.hero-photo{object-position:48% center}.hero-bottom{left:6%;right:6%;bottom:25px}.photo-nav{gap:0}.photo-nav button{min-width:31px;font-size:12px}.scroll-link{font-size:12px}.music{padding:70px 6%;grid-template-columns:1fr;gap:45px}.music-photo{aspect-ratio:1/1;object-position:center 35%}.music h2{margin-bottom:32px;font-size:62px}.eyebrow{margin-bottom:20px}.footer{padding:30px 6%;align-items:flex-start;flex-direction:column}.footer .socials{gap:24px;flex-wrap:wrap}.footer-brand{width:100%;justify-content:space-between}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* DeCC — a love-letter wordmark, wine-dark surfaces, quiet editorial details. */
:root{--ink:#f9eee7;--dark:#200b10;--line:rgba(249,238,231,.26)}
body{font-family:'Cormorant Garamond',Georgia,serif;background:var(--dark)}
.wordmark{font-family:'Pinyon Script',cursive;font-size:46px;letter-spacing:0;line-height:1.2;font-weight:400}
.hero-title{top:43%;transform:translate(-50%,-30%)}
.hero-title h1{font-family:'Pinyon Script',cursive;font-size:clamp(120px,17vw,240px);letter-spacing:0;line-height:1.25;padding:0 .13em 0 0;margin:0 0 2px;font-weight:400;text-shadow:0 2px 35px rgba(25,0,0,.18)}
.hero:after{background:linear-gradient(180deg,rgba(20,2,8,.42),rgba(20,2,8,.05) 45%,rgba(20,2,8,.72))}
.nav a,.socials a,.outline,.scroll-link{font-family:'Cormorant Garamond',Georgia,serif;text-transform:none;font-size:20px;letter-spacing:.01em}
.nav{gap:32px}.socials{gap:25px}.socials a{font-size:18px}
.outline{min-width:0;padding:9px 8px 7px;border:0;border-bottom:1px solid var(--ink);font-size:25px;font-style:italic;background:transparent}
.outline:hover{background:transparent;color:var(--ink);border-bottom-color:transparent}
.photo-nav button{font-family:Arial,sans-serif;font-size:12px;letter-spacing:.04em}
.scroll-link{font-style:italic}
.music{padding:90px 12%;gap:12%;grid-template-columns:1fr 1fr}
.music-photo{aspect-ratio:4/5;outline:1px solid var(--line);outline-offset:12px}
.platforms a{font-size:clamp(27px,3vw,40px);font-weight:400;padding:20px 0}
.platforms span{font-family:Arial,sans-serif;font-size:12px;letter-spacing:.1em;color:#e0c7ce}
.all-links{font-size:18px;font-style:italic}
.footer-label{font-family:Arial,sans-serif}.footer .socials a{font-size:18px}
@media(max-width:750px){header{padding:20px 6%}.wordmark{font-size:38px}.nav{gap:19px}.nav a{font-size:18px}.hero-title h1{font-size:clamp(128px,32vw,190px)}.hero-title{top:44%}.music{padding:65px 9%;grid-template-columns:1fr;gap:48px}.music-photo{aspect-ratio:1/1;outline-offset:8px}.platforms a{font-size:32px}.scroll-link{font-size:18px}.footer .socials{gap:25px}}

.film{padding:90px 12% 10px;max-width:1500px;margin:auto}.film-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.film h2{font:400 clamp(42px,5vw,70px)/1.3 'Pinyon Script',cursive;margin:0}.play-film{font:italic 22px 'Cormorant Garamond',Georgia,serif;border:0;border-bottom:1px solid var(--line);background:none;padding:12px 0;cursor:pointer;white-space:nowrap}.play-film:hover{border-color:var(--ink)}.film video{display:block;width:100%;max-height:78svh;object-fit:contain;background:#090708;border:1px solid var(--line)}
@media(max-width:750px){.film{padding:55px 6% 5px}.film h2{font-size:43px}.film-heading{margin-bottom:18px}.film video{max-height:72svh}.play-film{font-size:20px}}
.films{padding:85px 7% 20px;display:grid;grid-template-columns:1fr 1fr;gap:5%;max-width:1600px;margin:auto}.film{padding:0;min-width:0;width:100%}.film h2{font-size:clamp(40px,4.5vw,64px)}.film video{width:100%;aspect-ratio:16/10;max-height:none}.film-heading{gap:16px}.play-film{font-size:20px}
@media(max-width:750px){.films{padding:55px 6% 5px;grid-template-columns:1fr;gap:45px}.film{padding:0}.film h2{font-size:43px}}

.hero-photo{object-position:center 42%}.hero:after{background:linear-gradient(180deg,rgba(15,4,8,.43),rgba(15,4,8,.05) 45%,rgba(15,4,8,.55))}
.video-page header{border-bottom:1px solid var(--line)}.video-page .wordmark{white-space:nowrap}.video-page .nav [aria-current="page"]{border-bottom:1px solid var(--ink)}
.video-intro{max-width:1160px;margin:60px auto 35px;padding:0 30px}.video-intro h1{font:400 clamp(70px,9vw,120px)/1.2 'Pinyon Script',cursive;margin:0}
.video-page .films{display:block;padding:0 30px 90px;max-width:1160px}.video-page .film{margin-bottom:70px}.video-page .film:last-child{margin-bottom:0}.video-page .film video{aspect-ratio:auto;width:100%;height:auto;max-height:78svh;object-fit:contain}.video-page .film-heading{margin-bottom:20px}.video-status{font-size:18px;min-height:1.2em;margin:12px 0 0}.video-status:empty{display:none}
@media(max-width:750px){.video-intro{margin-top:35px;padding:0 6%}.video-page .films{padding:0 6% 60px}.video-page .film{margin-bottom:45px}}

/* Accessible social icons, including the mobile header. */
header .social-icons{display:flex;gap:8px}header .social-icons a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;border-radius:50%;transition:background .2s}header .social-icons a:hover{box-shadow:none;background:rgba(249,238,231,.15)}.social-icons svg{width:22px;height:22px;display:block}
@media(max-width:750px){header{flex-wrap:wrap;gap:8px 16px}header .social-icons{width:100%;justify-content:flex-end;gap:4px}header .social-icons a{width:40px;height:40px;padding:9px}}
