@font-face{font-family:futura-book;src:url(/assets/fonts/futura-book/Futura-Book.woff2) format("woff2"),url(/assets/fonts/futura-book/Futura-Book.eot) format("eot"),url(/assets/fonts/futura-book/Futura-Book.ttf) format("ttf");font-weight:400;font-style:normal}
@font-face{font-family:metropolis;src:url(/assets/fonts/metropolis-master/WOFF/Metropolis-Medium.woff) format("woff"),url(/assets/fonts/metropolis-master/WOFF/Metropolis-Medium.woff2) format("woff2"),;font-weight:400;font-style:normal}
@layer tokens {
  :root { --font-body: "din-2014", sans-serif; --font-heading: var(--font-body); --font-size-base: 1rem; --line-height-body: 1.5; --color-bg: #000; --color-text: #fff; --color-heading: currentColor; --color-link: currentColor; --container-padding: 1rem; }
}
@layer theme {
  html { font-family: var(--font-body); font-weight: 200; scroll-behavior: smooth; }
  body { background: #000; color: #fff; font-family: var(--font-body); font-weight: 200; line-height: 1.5; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-rendering: auto; }
  a { color: inherit; text-decoration: none; }
  button { color: inherit; background: transparent; border: 0; cursor: pointer; }
  button:disabled { opacity: .5; cursor: default; }
  .player-poster button:disabled { opacity: 1; }
  [hidden] { display: none !important; }
  .player-home .player-track[data-player-active="false"] [data-player-icon="play"] { display: none; }
  .player-home .player-track[data-player-active="false"]:hover [data-player-icon="play"] { display: block; }
  .player-home .player-track[data-player-active="false"]:hover [data-player-icon="number"] { display: none; }
  .pinar-container { width: 100%; padding-inline: 1rem; margin-inline: auto; }
  .site-shell { display: flex; flex-direction: column; min-height: 100vh; }
  #main-content { position: relative; top: 3rem; flex-grow: 1; overflow-x: hidden; overflow-y: auto; padding-bottom: .5rem; z-index: 10; }
  body[data-page="home"] { background: #fff; color: #000; }
  body[data-page="home"] #main-content { background: transparent; }
  body:not([data-page="home"]) #main-content { background: #000; }
  @media (min-width: 768px) { #main-content { top: auto; } }
  @media (min-width: 1536px) { .pinar-container { max-width: 1400px; padding-inline: 2rem; } }
}
@layer components {
  .site-header { position: fixed; inset: 0 0 auto; z-index: 50; width: 100%; padding: .75rem 1rem; background: #000; color: #fff; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1), 0 4px 6px -4px rgb(0 0 0/.1); transition: all .3s; }
  body[data-page="home"] .site-header { background: #fff; color: #000; }
  .header-inner { display: flex; flex-wrap: wrap; align-items: flex-end; position: relative; padding-bottom: .5rem; margin-top: .5rem; }
  .site-logo { margin-right: auto; display: inline-flex; font-family: "futura-pt",sans-serif; font-size: 3rem; line-height: 1; font-weight: 400; letter-spacing: -.2rem; }
  .site-logo:hover { opacity: .5; }
  .desktop-nav { display: none; gap: 1.5rem; align-items: center; font-size: 1rem; text-transform: uppercase; font-weight: 300; padding-right: 1.5rem; }
  .desktop-nav a.active { border-bottom: 1px solid #d1d5db; }
  .home-link svg { width: 1rem; height: 1rem; }
  body[data-page="home"] .home-link { display: none; }
  .nav-toggle { display: inline-block; height: 26px; padding-inline: .75rem; }
  .nav-toggle > span { display: block; width: 28px; height: 16px; position: absolute; right: 1rem; top: 1.25rem; color: #fff; }
  body[data-page="home"] .nav-toggle > span { color: #393939; }
  .nav-toggle > span::before,.nav-toggle > span::after { content: ""; position: absolute; left: 0; right: 0; top: 0; border-bottom: 2px solid currentColor; transition: all .3s ease-out; }
  .nav-toggle > span::after { top: 100%; }
  .nav-toggle i { position: absolute; left: 0; width: 100%; top: 50%; height: 2px; background: currentColor; text-indent: 100%; white-space: nowrap; overflow: hidden; transition: all .1s ease-out; }
  .nav-toggle[aria-expanded="true"] > span::before { transform: rotate(45deg); top: 50%; }
  .nav-toggle[aria-expanded="true"] > span::after { transform: rotate(-45deg); top: 50%; }
  .nav-toggle[aria-expanded="true"] i { opacity: 0; }
  .mobile-nav { position: absolute; right: 1rem; top: calc(100% + .75rem); padding: .5rem 2rem .75rem; z-index: 300; background: #000; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1); font-size: 1.5rem; line-height: 2rem; text-transform: uppercase; }
  body[data-page="home"] .mobile-nav { background: #fff; }
  .mobile-nav a { display: block; }
  .mobile-nav a + a { margin-top: 1.75rem; }
  .site-footer { padding-block: .5rem; overflow-x: hidden; position: relative; z-index: 100; background: linear-gradient(to bottom, transparent, #000); }
  @media (min-width: 768px) { .site-footer { background: none; } }
  .footer-inner { display: flex; justify-content: flex-end; }
  .social-panel { padding: .5rem 1rem 0; border-radius: .75rem; width: 100%; }
  .social-links { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; }
  .social-links a { display: inline-flex; }
  .social-links a:hover { transform: scale(1.05); opacity: .75; }
  .social-links svg { width: 2rem; height: 2rem; filter: drop-shadow(0 0 10px rgb(155 155 155/.5)); }
  .social-links .icon-fill { fill: currentColor; }
  .social-links .icon-stroke { stroke: currentColor; }
  .social-desktop { display: none; }
  .social-mobile { color: #fff; display: flex; flex-direction: column; padding: 1rem 2rem; gap: 1rem; }
  .copyright { text-align: center; padding-top: .5rem; font-size: .75rem; line-height: 1rem; color: #fff; }
  .home-wrap { padding-inline: 1rem; }
  .home-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 1rem; margin-bottom: 1rem; }
  .home-player-column { grid-column: span 12; order: 2; position: relative; margin-top: 1rem; z-index: 600; }
  .home-spacer { grid-column: span 12; order: 3; padding: 1rem; }
  .home-video-column { grid-column: span 12; order: 1; padding: 1rem; }
  .home-video-trigger { position: relative; display: block; width: 100%; padding: 0; transition: transform .3s; }
  .home-video-trigger:hover { transform: scale(1.02); }
  .home-video-trigger img { width: 100%; border-radius: .5rem; object-fit: cover; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1); }
  .hero-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; }
  .hero-play svg { width: 4rem; height: 4rem; opacity: .8; }
  .home-ribbon { min-height: 70vh; display: flex; align-items: center; justify-content: flex-end; overflow-x: hidden; }
  .home-wrap .pinar-container { display: flex; flex-direction: column; }
  .home-wrap .home-ribbon { order: -1; }
  .marquee-wrapper { width: 100%; overflow: hidden; }
  .marquee-track { display: flex; align-items: flex-start; gap: .5rem; width: max-content; will-change: transform; }
  .marquee-poster { position: relative; flex: none; width: 8em; height: 12em; padding: 0; }
  .marquee-poster img { width: 100%; height: 100%; object-fit: cover; border-radius: .5rem; box-shadow: 0 4px 6px -1px rgb(0 0 0/.1); }
  .poster-hover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: .5rem; color: #fff; text-align: center; background: rgb(0 0 0/.8); opacity: 0; transition: opacity .3s; border-radius: inherit; font-size: 1rem; font-weight: 200; }
  .marquee-poster:hover .poster-hover,.listen-poster:hover .poster-hover { opacity: .8; }
  .root-background { position: fixed; inset: 5rem 0 0; height: 100vh; z-index: 5; pointer-events: none; }
  .desktop-portrait { display: none; width: 100%; height: 100%; object-fit: cover; object-position: 50% top; }
  .mobile-poster-wall { width: 100%; height: 100%; overflow: hidden; position: relative; }
  .mobile-poster-wall::after { content: ""; position: absolute; inset: 0; background: rgb(0 0 0/.3); }
  .poster-wall-columns { display: flex; width: 100%; height: 100%; }
  .poster-wall-column { width: 25%; animation: posterFloat1 150s linear infinite; }
  .poster-wall-column:nth-child(2),.poster-wall-column:nth-child(4) { animation-name: posterFloat2; }
  .poster-wall-column:nth-child(3) { animation-name: posterFloat3; }
  .poster-wall-column img { width: 100%; aspect-ratio: 2/3; object-fit: cover; }
  .mobile-portrait { position: fixed; top: 40px; left: 0; width: 90%; height: 100%; object-fit: contain; z-index: 10; pointer-events: none; filter: drop-shadow(0 0 30px black) contrast(1.1); }
  .listen-container { margin-block: 4rem; padding-inline: 0; }
  .listen-inset { padding-inline: 0; }
  .listen-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; padding: 0 3rem; }
  .listen-poster { display: block; position: relative; width: 100%; height: 100%; padding: 0; margin-block: .25rem; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1); }
  .listen-poster img { display: block; width: 100%; height: 100%; object-fit: cover; }
  .listen-poster .poster-hover { background: rgb(0 0 0/.7); border-radius: 0; font-weight: 500; font-size: 1rem; transition: opacity .15s; }
  .listen-poster:hover .poster-hover { opacity: 1; }
  .about-container { margin-top: 4rem; margin-bottom: 2.5rem; }
  .about-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
  .about-image,.about-copy { grid-column: span 3; }
  .about-image img { object-fit: cover; width: 100%; height: 100%; max-height: 20rem; border-radius: .375rem; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1); }
  .about-copy { font-weight: 300; }
  .about-copy p + p { margin-top: .5rem; }
  .contact-page { max-width: 80rem; margin-inline: auto; padding-inline: 1rem; }.contact-container { margin-top: 4rem; }
  .contact-content { max-width: 48rem; width: 100%; margin-inline: auto; margin-bottom: 5rem; }
  .contact-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .25rem; padding-block: 1.5rem; border-bottom: 1px solid #1f2937; transition: background .3s; animation: contactFly .6s both; }
  .contact-row:nth-child(2) { animation-delay: .2s; }.contact-row:nth-child(3) { animation-delay: .4s; }
  .contact-row:hover { background: rgb(17 24 39/.2); }.contact-row:last-child { border-bottom-width: 2px; }
  .contact-label { grid-column: span 3; margin-bottom: 1rem; font-size: .875rem; text-align: center; color: #9ca3af; letter-spacing: .1em; font-weight: 300; line-height: 1.25rem; }
  .contact-detail { grid-column: span 3; text-align: center; margin-bottom: .5rem; }
  .contact-detail > * + * { margin-top: .75rem; }
  .contact-detail > div > * + * { margin-top: .25rem; }.contact-detail h3 { font-size: 1.5rem; line-height: 2rem; font-weight: 500; }.contact-small { font-size: .875rem; color: #d1d5db; line-height: 1.25rem; }
  .contact-detail address { font-style: normal; white-space: pre-line; }.contact-detail .contact-link { display: inline-block; font-size: .875rem; border-bottom: 1px solid rgb(255 255 255/.5); line-height: 1.25rem; }.contact-detail .contact-link:hover { border-color: transparent; color: #d1d5db; }
  .poster-modal { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 950; background: #000; color: #fff; }
  .poster-backdrop { position: absolute; inset: 0; background-size: cover; background-color: #000; filter: blur(.75rem); }
  .poster-modal::after { content: ""; position: absolute; inset: 0; background: rgb(0 0 0/.5); pointer-events: none; }
  .poster-modal-inner { position: relative; z-index: 1; width: 100%; max-width: 80rem; margin-inline: auto; display: flex; flex-direction: column; height: 100%; padding-inline: 1rem; background: rgb(0 0 0/.6); backdrop-filter: blur(24px); }
  .poster-heading { position: relative; z-index: 20; display: grid; grid-template-columns: 1.5rem 1fr auto; gap: 1rem; padding: .75rem 1rem; backdrop-filter: blur(16px); }
  .poster-heading h2 { text-align: center; font-size: 1.25rem; line-height: 1.75rem; font-weight: 500; font-family: "proxima-nova",sans-serif; padding-inline: 1.5rem; overflow-wrap: anywhere; }.poster-heading small { color: #9ca3af; font-size: 1rem; line-height: 1.5rem; font-weight: 400; }
  .poster-heading button { color: #9ca3af; display: flex; padding: 0; }.poster-heading button:hover { color: #fff; }.poster-heading svg { width: 1.5rem; height: 1.5rem; }
  .poster-content { flex: 1; min-height: 0; overflow: hidden; }
  .poster-mobile { display: flex; flex-direction: column; height: 100%; }.poster-mobile-image { height: 25vh; flex: none; }.poster-mobile-image img { width: 100%; height: 100%; object-fit: contain; }.poster-tabs { display: flex; border-bottom: 1px solid #374151; background: rgb(0 0 0/.1); backdrop-filter: blur(24px); }.poster-tabs button { flex: 1; padding: .75rem 1.5rem; font-size: .875rem; color: #9ca3af; line-height: 1.25rem; }.poster-tabs button[data-active="true"] { color: #fff; }.poster-tabs button { position: relative; line-height: 1.25rem; }.poster-tabs button[data-active="true"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #e5e7eb; }.poster-mobile-scroll { flex: 1; overflow-y: auto; }.poster-mobile-links { padding: 1rem; margin-top: .5rem; background: rgb(0 0 0/.95); border-top: 1px solid #1f2937; }.poster-desktop { display: none; }.poster-info { padding: .75rem 1rem; font-size: .875rem; font-weight: 500; opacity: .9; line-height: 1.25rem; }.poster-info p + p { margin-top: .5rem; }.poster-info strong { font-weight: 500; }.poster-platforms { display: flex; justify-content: space-around; align-items: center; gap: .75rem; padding-block: .75rem; background: rgb(156 163 175/.05); }.poster-platforms a:hover { transform: scale(1.05); }.poster-platforms svg { width: 1.5rem; height: 1.5rem; }.poster-video-list { display: grid; grid-template-columns: 1fr; align-content: start; gap: 1rem; padding: 1rem; overflow-y: auto; }.poster-video-card { display: block; position: relative; aspect-ratio: 16/9; width: 100%; padding: 0; border-radius: .5rem; overflow: hidden; }.poster-video-card img { width: 100%; height: 100%; object-fit: cover; }.video-card-play { position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; background: rgb(0 0 0/.4); }.video-card-play svg { width: 3rem; height: 3rem; }.poster-video-card:hover .video-card-play { background: rgb(0 0 0/.2); }.poster-video-card:hover .video-card-play svg { transform: scale(1.1); }.video-description { position: absolute; bottom: 0; left: 0; right: 0; padding: .75rem; background: rgb(0 0 0/.6); color: #fff; font-size: .875rem; text-align: left; line-height: 1.25rem; }
  .pinar-player { overflow: hidden; color: #fff; }.player-home { background: var(--player-background,#111827); position: relative; margin-inline: .5rem; width: 100%; border-radius: .5rem; font-family: Arial,sans-serif; box-shadow: 0 10px 15px -3px rgb(0 0 0/.1); }.player-top { display: flex; padding: 1rem; background: var(--player-lighter,#222c3c); }.player-cover { width: 6rem; height: 6rem; object-fit: cover; margin-right: 1rem; border-radius: .375rem; flex: none; }.player-top-info { display: flex; flex-direction: column; flex: 1; min-width: 0; }.player-album { font-family: Jost,system-ui; font-weight: 500; line-height: 1.25; }.player-title { font-size: .875rem; margin-bottom: .5rem; line-height: 1.25rem; }.player-control-row { display: flex; align-items: center; width: 100%; }.player-progress { flex: 1; min-width: 0; }.player-progress input { width: 100%; cursor: pointer; appearance: none; background: transparent; }.player-progress input::-webkit-slider-runnable-track { background: #e2e2e2; height: .1rem; }.player-progress input::-webkit-slider-thumb { appearance: none; width: 10px; height: 10px; background: #6d6d6d; border-radius: 50%; margin-top: -3px; }.player-times { display: flex; justify-content: space-between; font-size: .75rem; line-height: 1rem; }.player-controls { display: flex; align-items: center; margin-top: -.75rem; }.player-controls button { padding: .25rem; }.player-controls svg { width: 1rem; height: 1rem; }.player-controls .player-play { margin-inline: .25rem; }.player-controls .player-play svg { width: 2.5rem; height: 2.5rem; }.player-playlist { max-height: 50dvh; overflow-y: auto; scrollbar-color: var(--player-darker,#273140) var(--player-lighter,#414956); }.player-track { display: flex; align-items: center; gap: .5rem; padding: .5rem 1.5rem; border-radius: .25rem; cursor: pointer; font-size: .875rem; line-height: 1.25rem; }.player-track:hover { background: rgb(0 0 0/.2); }.player-track[data-player-active="true"] { background: rgb(0 0 0/.4); }.track-number,.track-playing { width: .75rem; flex: none; font-size: .75rem; line-height: 1rem; }.track-cover { display: none; }.track-label { flex: 1; min-width: 0; }.track-label small { display: block; font-size: .75rem; line-height: 1rem; opacity: .5; }
  .track-label p { line-height: 1.25rem; }
  svg[hidden] { display: none; }.track-duration { font-size: .75rem; line-height: 1rem; }.player-poster { display: flex; flex-direction: column; height: 100%; box-shadow: 0 20px 25px -5px rgb(0 0 0/.1); }.player-poster .player-top { background: transparent; }.player-poster .player-cover { width: 3.5rem; height: 3.5rem; margin-right: .75rem; border-radius: .5rem; }.player-poster .player-top-info .player-title { order: 1; font-size: .875rem; font-weight: 500; margin-bottom: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 1.25rem; }.player-poster .player-album { order: 2; font-family: inherit; font-size: .75rem; color: rgb(255 255 255/.6); font-weight: 200; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; line-height: 1rem; }.player-poster .player-control-row { order: 3; gap: .5rem; margin-top: .25rem; }.player-poster .player-times { font-size: 10px; color: rgb(255 255 255/.6); }.player-poster .player-controls { margin-top: 0; }.player-poster .player-controls svg { width: .875rem; height: .875rem; }.player-poster .player-controls .player-play { background: #fff; color: #111827; border-radius: 50%; padding: .375rem; }.player-poster .player-controls .player-play svg { width: 1rem; height: 1rem; }.player-poster .player-playlist { flex: 1; max-height: none; border-top: 1px solid rgb(255 255 255/.1); margin-bottom: 1rem; }.player-poster .player-track { padding: .5rem 1rem; gap: .75rem; border-bottom: 1px solid rgb(255 255 255/.1); border-radius: 0; }.player-poster .player-track[data-player-active="true"] { background: rgb(255 255 255/.1); }.player-poster .player-track:hover { background: rgb(255 255 255/.05); }.player-poster .track-number,.player-poster .track-playing { display: none; }
  .player-poster .icon-home,.player-home .icon-poster { display: none; }
  .track-playing { width: 1.5rem; height: 1.5rem; margin-left: -.5rem; }
  .player-poster .player-controls button:not(.player-play) { border-radius: 50%; transition: background-color .15s; }
  .player-poster .player-controls button:not(.player-play):hover { background: rgb(255 255 255/.1); }.player-poster .track-cover { display: block; width: 2rem; height: 2rem; border-radius: .25rem; object-fit: cover; }.player-poster .track-label p { font-weight: 500; }.player-poster .track-label p,.player-poster .track-label small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.player-poster .track-duration { color: rgb(255 255 255/.6); }
  @media (min-width: 768px) { .player-home .player-cover { width: 4rem; height: 4rem; }.player-home .player-controls svg { width: .75rem; height: .75rem; }.player-home .player-controls .player-play svg { width: 1.75rem; height: 1.75rem; }.player-home .player-playlist { max-height: 40rem; }.poster-mobile { display: none; }.poster-desktop { display: grid; height: 100%; grid-template-columns: 1fr 1fr; gap: 1rem; padding: 1rem; }.poster-desktop[data-media-mode="both"] { grid-template-columns: 2.5fr 2.5fr 2fr; }.poster-audio-column,.poster-videos-column { height: 100%; min-height: 0; overflow: hidden; border-radius: .5rem; }.poster-info-column { display: flex; flex-direction: column; min-height: 0; }.poster-info-column .poster-info { margin-bottom: 1rem; padding: 1rem; border-radius: .5rem; background: rgb(0 0 0/.2); }.poster-image { width: 100%; max-height: 65vh; object-fit: contain; }.poster-desktop-links { margin-top: 1rem; padding: 1rem; background: rgb(0 0 0/.2); border-radius: .5rem; }.poster-videos-column { display: flex; flex-direction: column; }.poster-videos-column h3 { padding: .75rem 1rem; font-size: 1.125rem; font-weight: 500; border-bottom: 1px solid #374151; backdrop-filter: blur(16px); line-height: 1.75rem; }.poster-videos-column .poster-video-list { flex: 1; min-height: 0; } }
  @media (min-width: 1024px) { .player-home { margin-inline: 0; }.player-home .player-cover { width: 6rem; height: 6rem; }.player-home .player-controls svg { width: 1rem; height: 1rem; }.player-home .player-controls .player-play svg { width: 2.5rem; height: 2.5rem; }.player-home .player-playlist { max-height: 50dvh; }.poster-desktop[data-media-mode="both"] { grid-template-columns: 2fr 3fr 2fr; } }
  .video-modal-player:has(video) { height: 100%; max-height: 90vh; }.video-frame:has(video) { width: 100%; height: 100%; }.video-modal[data-video-orientation="portrait"] .video-frame { aspect-ratio: 9/16; }
  .video-modal { position: fixed; inset: 0; z-index: 1000; background: #000; color: #fff; padding: 1rem; display: flex; align-items: center; justify-content: center; }
  .video-backdrop { position: absolute; inset: 0; background-image: var(--video-cover); background-size: cover; background-position: center; filter: blur(.75rem); opacity: .5; }
  .video-modal-player { position: relative; width: 100%; max-width: 80rem; max-height: 90vh; z-index: 1001; }
  .video-modal[data-video-kind="home"] .video-modal-player { max-width: 56rem; }
  .video-frame { position: relative; width: 100%; aspect-ratio: 16/9; }.video-frame iframe,.video-frame video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: contain; }.video-close { position: fixed; top: 2rem; right: 2rem; z-index: 1002; display: flex; padding: 0; }.video-close svg { width: 3rem; height: 3rem; }
  @media (orientation: landscape) { .mobile-portrait { top: 25vh; } }
  @media (min-width: 640px) { .contact-page { padding-inline: 1.5rem; } }
  @media (min-width: 768px) {
    .site-header { position: relative; box-shadow: none; }.header-inner { align-items: center; padding-bottom: 0; }.site-logo { font-size: 3.75rem; }.nav-toggle { display: none; }.desktop-nav { display: flex; }body[data-page="home"] .site-header { background: transparent; }.mobile-nav { display: none; }
    .social-desktop { display: flex; margin-bottom: .5rem; }.social-mobile { display: none; }.social-links svg { width: 2.5rem; height: 2.5rem; }.social-panel { width: auto; backdrop-filter: blur(24px); }body[data-page="home"] .social-panel { background: rgb(255 255 255/.2); }.copyright { text-align: right; margin-bottom: .5rem; }body[data-page="home"] .copyright { color: #000; }
    .home-wrap { padding-inline: 0; }.home-wrap .pinar-container { display: block; }.home-grid { gap: 0; margin-bottom: 0; }.home-player-column { grid-column: span 4; order: 1; max-height: 45vh; }.home-spacer { grid-column: span 4; order: 2; }.home-video-column { grid-column: span 4; order: 3; }.home-ribbon { min-height: 0; justify-content: center; position: absolute; bottom: 2rem; }.root-background { inset: 0; }.desktop-portrait { display: block; }.mobile-poster-wall,.mobile-portrait { display: none; }
    .listen-grid { grid-template-columns: repeat(4,minmax(0,1fr)); padding: 0 8rem; }.listen-poster { margin-block: 0 }.listen-poster { margin-block: 0; }.listen-poster .poster-hover { font-size: 1.125rem; line-height: 1.75rem; }.about-image { grid-column: span 1; }.about-copy { grid-column: span 2; }.about-image img { max-height: 32rem; }.contact-row { gap: 2.5rem; padding-block: 2rem; }.contact-label { grid-column: span 1; text-align: right; margin-bottom: 0; font-size: 1rem; line-height: 1.5rem; }.contact-detail { grid-column: span 2; text-align: left; }.poster-heading h2 { font-size: 1.5rem; line-height: 2rem; }.poster-heading small { font-size: 1.125rem; line-height: 1.75rem; }
  }
  @media (min-width: 1024px) { .site-header { padding-inline: 0; }.site-logo { font-size: 4.5rem; }.home-grid { gap: 1rem; }.home-ribbon { position: relative; bottom: auto; }.listen-grid { grid-template-columns: repeat(5,minmax(0,1fr)); padding: 0 13rem; }.about-copy { column-count: 2; } }
  @media (min-width: 1024px) { .contact-page { padding-inline: 2rem; } }
  @media (min-width: 1280px) { .contact-container { margin-top: 9rem; } }
  @media (min-width: 1536px) { .home-player-column { grid-column: span 3; }.home-spacer { grid-column: span 5; } }
  @media (max-height: 450px) and (min-width: 768px) and (max-width: 1025px) { .desktop-portrait { object-position: 8rem top; }.video-close svg { width: 2rem; height: 2rem; }.video-close { top: 1rem; right: 1rem; } }
  @media (min-height: 450px) and (max-height: 1280px) and (min-width: 768px) and (max-width: 1000px) { .desktop-portrait { object-position: 40% top; } }
  @keyframes posterFloat1 { from { transform: translateY(-600%); } to { transform: translateY(-200%); } }
  @keyframes posterFloat2 { from { transform: translateY(-1000%); } to { transform: translateY(-600%); } }
  @keyframes posterFloat3 { from { transform: translateY(-1100%); } to { transform: translateY(-700%); } }
  @keyframes contactFly { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
}

/* The old site animated regardless of the OS Reduce Motion setting. yg-base.css forces every
   duration to ~0 with !important, which freezes the GSAP ribbon (each transform write restarts
   a 0.01ms transition) and the CSS wall/menu motion. `motion` is declared before `base` in the
   layouts, so its important declarations outrank yg-base's. */
@layer motion {
  @media (prefers-reduced-motion: reduce) {
    .marquee-track, .marquee-poster, .marquee-wrapper { transition-duration: 0s !important; }
    .poster-wall-column { animation-duration: 150s !important; animation-iteration-count: infinite !important; }
    .contact-row { animation-duration: .6s !important; transition-duration: .3s !important; }
    .nav-toggle > span::before, .nav-toggle > span::after { transition-duration: .3s !important; }
    .nav-toggle i { transition-duration: .1s !important; }
    .site-header, .home-video-trigger, .poster-hover { transition-duration: .3s !important; }
    .listen-poster .poster-hover, .player-poster .player-controls button:not(.player-play) { transition-duration: .15s !important; }
  }
}

@layer components {
  .player-poster .player-progress input { height: .25rem; margin: 0; }
  .player-poster .player-times { margin-top: .125rem; line-height: 1.5; }
  .player-poster .player-progress input::-webkit-slider-runnable-track { background: rgb(255 255 255/.2); height: 4px; border-radius: 2px; }
  .player-poster .player-progress input::-webkit-slider-thumb { margin-top: -4px; top: 0; width: 12px; height: 12px; background: #fff; border-radius: 50%; box-shadow: 0 2px 4px rgb(0 0 0/.2); }
  .player-poster .player-progress input::-moz-range-track { background: rgb(255 255 255/.2); height: 4px; border-radius: 2px; }
  .player-poster .player-progress input::-moz-range-thumb { border: 0; background: #fff; width: 12px; height: 12px; border-radius: 50%; box-shadow: 0 2px 4px rgb(0 0 0/.2); }
}

@layer components {
  /* Home player box model, copied from the original AudioPlayer2 markup. */
  .player-home .player-progress input { display: block; height: .5rem; margin: 9px .25rem 7px; width: calc(100% - .5rem); overflow: hidden; }
  .player-home .player-progress input::-webkit-slider-thumb { margin-top: 0; position: relative; top: -3px; z-index: 100; pointer-events: all; }
  .player-home .player-progress input::-moz-range-track { background: #d7d7d7; height: .1rem; }
  .player-home .player-progress input::-moz-range-thumb { background: rgb(212 212 212); width: 10px; height: 10px; border: 0; }
  .player-home .player-times span:first-child { margin-right: .5rem; }
  .player-home .player-times span:last-child { margin-inline: .5rem; }
  .player-home .track-number { display: flex; align-items: center; height: 2.5rem; transform: translateX(-.25rem); }
  .player-home .track-playing { width: 1.5rem; margin-left: -.5rem; margin-right: -.25rem; flex: none; }
  .player-home .track-duration { box-sizing: border-box; width: .75rem; padding-right: 1rem; white-space: nowrap; flex: none; }
}

@layer components {
  @media (min-width: 1536px) { .listen-grid { padding: 0 14rem; } }
}

@layer components {
  .player-home .player-progress input::-webkit-slider-thumb { background: #fff; }
  .player-home .player-progress input::-moz-range-thumb { background: #fff; }
  @media (min-width: 768px) and (max-width: 1023.98px) { .player-home .player-controls .player-play { padding: 0; } }
}

@layer components {
  /* Original flex children keep min-width:auto, so the controls never shrink below their content. */
  .player-home .player-top-info, .player-home .player-progress { min-width: auto; }
}

@layer components {
  .player-home .player-controls { flex: none; }
  .player-home .player-controls button, .player-home .player-controls svg { flex: none; }
}

@layer components {
  /* Original input is overflow-hidden but its 10px thumb sits in an 8px box; show the whole dot. */
  .player-home .player-progress input { overflow: visible; }
}

/* Page-to-page fade. The source faded <main> in and out over 300ms on every route change.
   Cross-document view transitions give that crossfade natively; browsers without them
   (Firefox, older Safari) get the fade-in only. */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .3s; animation-timing-function: ease; }
@keyframes pageFadeIn { from { opacity: 0; } to { opacity: 1; } }
@supports not (view-transition-name: none) {
  #main-content { animation: pageFadeIn .3s ease both; }
}
@layer motion {
  @media (prefers-reduced-motion: reduce) {
    #main-content { animation-duration: .3s !important; }
  }
}
