#cff-schedule-app {
--cff-navy: #2e2e48;
--cff-navy-dark: #202035;
--cff-ink: #242337;
--cff-gold: #c5a26e;
--cff-gold-soft: #d9c7aa;
--cff-paper: #fbf9f5;
--cff-line: #dcd4c8;
--cff-muted: #777383;
--cff-white: #ffffff;
width: 100%;
color: var(--cff-ink);
background: var(--cff-paper);
font-family: "DM Sans", "Helvetica Neue", Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
}
#cff-schedule-app,
#cff-schedule-app *,
#cff-schedule-app *::before,
#cff-schedule-app *::after {
box-sizing: border-box;
}
#cff-schedule-app button,
#cff-schedule-app input,
#cff-schedule-app select {
margin: 0;
font: inherit;
text-transform: none;
box-shadow: none;
}
#cff-schedule-app button,
#cff-schedule-app a {
-webkit-tap-highlight-color: transparent;
}
#cff-schedule-app a {
color: inherit;
text-decoration: none;
}
#cff-schedule-app p,
#cff-schedule-app h1,
#cff-schedule-app h2,
#cff-schedule-app h3 {
padding: 0;
}
body.cff-schedule-modal-open {
overflow: hidden;
}
#cff-schedule-app .cff-schedule-sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
#cff-schedule-app .cff-schedule-notice {
min-height: 42px;
padding: 9px clamp(20px, 5vw, 72px);
display: flex;
align-items: center;
justify-content: center;
gap: 9px;
flex-wrap: wrap;
background: #e6d8c2;
color: #5c4b35;
font-size: 11px;
}
#cff-schedule-app .cff-schedule-notice strong {
color: inherit;
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.09em;
}
#cff-schedule-app .cff-schedule-status-dot {
width: 7px;
height: 7px;
border-radius: 50%;
background: #98713e;
box-shadow: 0 0 0 4px rgba(152, 113, 62, 0.12);
}
#cff-schedule-app .cff-schedule-hero {
position: relative;
min-height: 445px;
overflow: hidden;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: end;
gap: 60px;
padding: 80px clamp(24px, 7vw, 110px) 72px;
background: var(--cff-navy);
color: var(--cff-white);
}
#cff-schedule-app .cff-schedule-hero::before {
content: "";
position: absolute;
inset: 0;
opacity: 0.23;
background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.18) 1px, transparent 0);
background-size: 28px 28px;
-webkit-mask-image: linear-gradient(90deg, #000, transparent 70%);
mask-image: linear-gradient(90deg, #000, transparent 70%);
}
#cff-schedule-app .cff-schedule-hero-copy {
position: relative;
z-index: 2;
max-width: 780px;
}
#cff-schedule-app .cff-schedule-overline {
margin: 0 0 22px;
color: var(--cff-gold-soft);
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.22em;
}
#cff-schedule-app .cff-schedule-hero h1 {
margin: 0;
color: var(--cff-white);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: clamp(58px, 7vw, 104px);
font-weight: 600;
letter-spacing: -0.045em;
line-height: 0.82;
}
#cff-schedule-app .cff-schedule-hero h1 em {
color: var(--cff-gold);
font-weight: 500;
}
#cff-schedule-app .cff-schedule-hero-intro {
max-width: 610px;
margin: 34px 0 0;
color: rgba(255, 255, 255, 0.7);
font-size: 16px;
line-height: 1.7;
}
#cff-schedule-app .cff-schedule-hero-date {
position: relative;
z-index: 2;
min-width: 245px;
padding: 28px;
border-left: 1px solid rgba(255, 255, 255, 0.2);
display: flex;
flex-direction: column;
}
#cff-schedule-app .cff-schedule-hero-date span {
color: var(--cff-gold);
font-size: 12px;
font-weight: 700;
letter-spacing: 0.26em;
}
#cff-schedule-app .cff-schedule-hero-date strong {
margin: 4px 0 2px;
color: var(--cff-white);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 57px;
font-weight: 600;
line-height: 1;
}
#cff-schedule-app .cff-schedule-hero-date small {
color: rgba(255, 255, 255, 0.54);
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.15em;
}
#cff-schedule-app .cff-schedule-orbit {
position: absolute;
border: 1px solid rgba(197, 162, 110, 0.2);
border-radius: 50%;
pointer-events: none;
}
#cff-schedule-app .cff-schedule-orbit-one {
right: -130px;
top: -210px;
width: 560px;
height: 560px;
}
#cff-schedule-app .cff-schedule-orbit-two {
right: 30px;
top: -40px;
width: 360px;
height: 360px;
}
#cff-schedule-app .cff-schedule-tools {
position: sticky;
top: var(--cff-sticky-offset, 0);
z-index: 30;
background: rgba(251, 249, 245, 0.96);
border-bottom: 1px solid var(--cff-line);
-webkit-backdrop-filter: blur(18px);
backdrop-filter: blur(18px);
}
#cff-schedule-app .cff-schedule-day-switcher {
max-width: 1280px;
margin: 0 auto;
padding: 0 clamp(20px, 4vw, 52px);
display: flex;
border-bottom: 1px solid var(--cff-line);
}
#cff-schedule-app .cff-schedule-day-switcher button {
position: relative;
min-width: 160px;
padding: 18px 32px 17px;
display: flex;
align-items: baseline;
justify-content: center;
gap: 10px;
border: 0;
border-radius: 0;
background: transparent;
color: #9994a0;
cursor: pointer;
}
#cff-schedule-app .cff-schedule-day-switcher button:hover,
#cff-schedule-app .cff-schedule-day-switcher button:focus-visible,
#cff-schedule-app .cff-schedule-day-switcher button.is-selected {
color: var(--cff-navy);
background: transparent;
}
#cff-schedule-app .cff-schedule-day-switcher button:focus-visible {
outline: 2px solid var(--cff-gold);
outline-offset: -4px;
}
#cff-schedule-app .cff-schedule-day-switcher button span {
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 22px;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-day-switcher button small {
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.08em;
}
#cff-schedule-app .cff-schedule-day-switcher button.is-selected::after {
content: "";
position: absolute;
left: 28px;
right: 28px;
bottom: -1px;
height: 3px;
background: var(--cff-gold);
}
#cff-schedule-app .cff-schedule-filter-row {
max-width: 1280px;
min-height: 74px;
margin: 0 auto;
padding: 14px clamp(20px, 4vw, 52px);
display: grid;
grid-template-columns: minmax(240px, 1fr) 220px auto;
align-items: center;
gap: 12px;
}
#cff-schedule-app .cff-schedule-search,
#cff-schedule-app .cff-schedule-select {
height: 44px;
display: flex;
align-items: center;
border: 1px solid var(--cff-line);
border-radius: 10px;
background: var(--cff-white);
}
#cff-schedule-app .cff-schedule-search {
gap: 10px;
padding: 0 15px;
color: var(--cff-gold);
}
#cff-schedule-app .cff-schedule-search input {
min-width: 0;
width: 100%;
height: 100%;
padding: 0;
border: 0;
outline: 0;
color: var(--cff-ink);
background: transparent;
font-size: 13px;
}
#cff-schedule-app .cff-schedule-search input::placeholder {
color: #aaa4ad;
}
#cff-schedule-app .cff-schedule-select select {
width: 100%;
height: 100%;
padding: 0 38px 0 14px;
border: 0;
outline: 0;
-webkit-appearance: none;
appearance: none;
background:
linear-gradient(45deg, transparent 50%, #817b84 50%) calc(100% - 17px) 19px / 5px 5px no-repeat,
linear-gradient(135deg, #817b84 50%, transparent 50%) calc(100% - 12px) 19px / 5px 5px no-repeat;
color: var(--cff-ink);
font-size: 12px;
}
#cff-schedule-app .cff-schedule-timezone {
margin: 0 0 0 12px;
white-space: nowrap;
color: var(--cff-muted);
font-size: 11px;
}
#cff-schedule-app .cff-schedule-timezone span {
margin-right: 5px;
color: var(--cff-gold);
font-size: 16px;
}
#cff-schedule-app .cff-schedule-list {
max-width: 1180px;
min-height: 520px;
margin: 0 auto;
padding: 58px clamp(20px, 4vw, 50px) 100px;
}
#cff-schedule-app .cff-schedule-heading {
margin-bottom: 22px;
padding-bottom: 15px;
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 16px;
border-bottom: 1px solid var(--cff-line);
}
#cff-schedule-app .cff-schedule-heading p {
margin: 0;
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 30px;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-heading span {
color: var(--cff-muted);
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.12em;
}
#cff-schedule-app .cff-schedule-card {
position: relative;
min-height: 210px;
margin-top: 14px;
display: grid;
grid-template-columns: 145px minmax(0, 1fr) 122px;
border: 1px solid var(--cff-line);
border-radius: 16px;
background: var(--cff-white);
overflow: hidden;
transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
#cff-schedule-app .cff-schedule-card:hover {
transform: translateY(-2px);
border-color: #c6b99f;
box-shadow: 0 18px 50px rgba(38, 35, 55, 0.08);
}
#cff-schedule-app .cff-schedule-card.is-event {
border-color: rgba(197, 162, 110, 0.48);
}
#cff-schedule-app .cff-schedule-card.is-event .cff-schedule-time {
background: #eee4d3;
}
#cff-schedule-app .cff-schedule-card.is-event .cff-schedule-film-preview span {
background: #eee4d3;
color: #775f3f;
}
#cff-schedule-app .cff-schedule-time {
padding: 34px 22px;
border-right: 1px solid var(--cff-line);
background: #f6f1e9;
display: flex;
flex-direction: column;
align-items: center;
}
#cff-schedule-app .cff-schedule-time strong {
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 25px;
font-weight: 600;
white-space: nowrap;
}
#cff-schedule-app .cff-schedule-time span {
margin-top: 3px;
color: var(--cff-muted);
font-size: 11px;
}
#cff-schedule-app .cff-schedule-card-body {
padding: 30px 34px 28px;
}
#cff-schedule-app .cff-schedule-card-meta {
display: flex;
gap: 8px;
color: #8c7758;
font-size: 9px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.13em;
}
#cff-schedule-app .cff-schedule-card-meta span + span::before {
content: "·";
margin-right: 8px;
}
#cff-schedule-app .cff-schedule-card h2 {
margin: 8px 0 5px;
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 32px;
line-height: 1.1;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-venue {
margin: 0;
color: var(--cff-muted);
font-size: 11px;
}
#cff-schedule-app .cff-schedule-venue span {
color: var(--cff-gold);
font-size: 8px;
}
#cff-schedule-app .cff-schedule-description {
max-width: 700px;
margin: 18px 0 20px;
color: #666270;
font-size: 12px;
line-height: 1.65;
}
#cff-schedule-app .cff-schedule-film-preview {
display: flex;
gap: 7px;
flex-wrap: wrap;
}
#cff-schedule-app .cff-schedule-film-preview span {
padding: 6px 9px;
border-radius: 6px;
background: #f3efe9;
color: #66616b;
font-size: 9px;
}
#cff-schedule-app .cff-schedule-film-preview span:last-child {
color: #8c714a;
}
#cff-schedule-app .cff-schedule-view {
padding: 12px;
border: 0;
border-left: 1px solid var(--cff-line);
border-radius: 0;
background: transparent;
color: var(--cff-navy);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 14px;
cursor: pointer;
transition: 0.2s ease;
}
#cff-schedule-app .cff-schedule-view span {
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.11em;
}
#cff-schedule-app .cff-schedule-view b {
display: grid;
place-items: center;
width: 38px;
height: 38px;
border: 1px solid var(--cff-line);
border-radius: 50%;
font-weight: 400;
}
#cff-schedule-app .cff-schedule-view:hover,
#cff-schedule-app .cff-schedule-view:focus-visible {
color: var(--cff-white);
background: var(--cff-navy);
}
#cff-schedule-app .cff-schedule-view:hover b,
#cff-schedule-app .cff-schedule-view:focus-visible b {
border-color: rgba(255, 255, 255, 0.35);
}
#cff-schedule-app .cff-schedule-empty {
min-height: 360px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
}
#cff-schedule-app .cff-schedule-empty > span {
color: var(--cff-gold);
font-size: 38px;
}
#cff-schedule-app .cff-schedule-empty h2 {
margin: 12px 0 5px;
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 28px;
}
#cff-schedule-app .cff-schedule-empty p {
margin: 0 0 18px;
color: var(--cff-muted);
font-size: 13px;
}
#cff-schedule-app .cff-schedule-empty button {
padding: 10px 16px;
border: 1px solid var(--cff-navy);
border-radius: 999px;
background: var(--cff-navy);
color: var(--cff-white);
cursor: pointer;
font-size: 11px;
}
#cff-schedule-app .cff-schedule-modal-shell {
position: fixed;
inset: 0;
z-index: 999999;
padding: 28px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(22, 22, 35, 0.78);
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
animation: cff-schedule-fade-in 0.2s ease both;
}
#cff-schedule-app .cff-schedule-modal {
position: relative;
width: min(820px, 100%);
max-height: calc(100vh - 56px);
overflow-y: auto;
border-radius: 20px;
padding: 40px 44px 0;
background: var(--cff-paper);
box-shadow: 0 28px 90px rgba(0, 0, 0, 0.28);
animation: cff-schedule-modal-in 0.3s ease both;
}
#cff-schedule-app .cff-schedule-modal-close {
all: unset;
box-sizing: border-box;
position: absolute;
right: 22px;
top: 20px;
width: 44px !important;
min-width: 44px !important;
max-width: 44px !important;
height: 44px !important;
min-height: 44px !important;
max-height: 44px !important;
padding: 0 !important;
display: grid !important;
place-items: center !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: var(--cff-ink);
font-family: Arial, sans-serif;
font-size: 32px;
font-weight: 400;
line-height: 1;
cursor: pointer;
appearance: none;
-webkit-appearance: none;
}
#cff-schedule-app .cff-schedule-modal-close:hover,
#cff-schedule-app .cff-schedule-modal-close:focus-visible {
background: transparent !important;
color: var(--cff-gold);
box-shadow: none !important;
}
#cff-schedule-app .cff-schedule-modal-close::before,
#cff-schedule-app .cff-schedule-modal-close::after {
content: none !important;
display: none !important;
}
#cff-schedule-app .cff-schedule-modal-topline {
padding-right: 60px;
display: flex;
gap: 24px;
color: var(--cff-muted);
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.12em;
}
#cff-schedule-app .cff-schedule-modal-eyebrow {
margin: 34px 0 8px;
color: #92764f;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.14em;
}
#cff-schedule-app .cff-schedule-modal > h2 {
margin: 0;
max-width: 650px;
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: clamp(40px, 6vw, 62px);
line-height: 0.98;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-modal-venue {
margin: 16px 0 0;
color: var(--cff-muted);
font-size: 11px;
}
#cff-schedule-app .cff-schedule-modal-description {
max-width: 650px;
margin: 24px 0 32px;
color: #696572;
font-size: 13px;
line-height: 1.7;
}
#cff-schedule-app .cff-schedule-modal-film-list {
padding: 24px 0 12px;
border-top: 1px solid var(--cff-line);
}
#cff-schedule-app .cff-schedule-section-label {
margin: 0 0 14px;
color: #8f774f;
font-size: 9px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.15em;
}
#cff-schedule-app .cff-schedule-modal-film {
display: grid;
grid-template-columns: 34px 48px minmax(0, 1fr);
align-items: start;
gap: 16px;
padding: 18px 0;
border-top: 1px solid #e8e2d9;
}
#cff-schedule-app .cff-schedule-modal-film:first-of-type {
border-top: 0;
}
#cff-schedule-app .cff-schedule-film-number {
color: #aaa3ad;
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 16px;
}
#cff-schedule-app .cff-schedule-mini-poster {
width: 48px;
height: 64px;
overflow: hidden;
border-radius: 3px;
}
#cff-schedule-app .cff-schedule-modal-film h3 {
margin: 0 0 4px;
color: var(--cff-ink);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 19px;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-film-meta {
display: flex;
align-items: center;
gap: 10px;
}
#cff-schedule-app .cff-schedule-film-meta p {
margin: 0;
color: var(--cff-muted);
font-size: 9px;
}
#cff-schedule-app .cff-schedule-film-meta span {
display: block;
padding-left: 10px;
border-left: 1px solid var(--cff-line);
color: #907958;
font-size: 9px;
}
#cff-schedule-app .cff-schedule-modal-film .cff-schedule-film-synopsis {
max-width: 720px;
margin: 10px 0 0;
color: #625f6a;
font-size: 11px;
line-height: 1.6;
}
#cff-schedule-app .cff-schedule-modal-film .cff-schedule-film-synopsis.is-pending {
color: #97919b;
font-style: italic;
}
#cff-schedule-app .cff-schedule-access {
margin: 24px -44px 0;
padding: 30px 44px 36px;
background: var(--cff-navy);
color: var(--cff-white);
}
#cff-schedule-app .cff-schedule-access .cff-schedule-section-label {
margin-bottom: 5px;
color: var(--cff-gold-soft);
}
#cff-schedule-app .cff-schedule-access-heading h3 {
margin: 0 0 7px;
color: var(--cff-white);
font-family: "Cormorant Garamond", Georgia, serif;
font-size: 30px;
line-height: 1;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-access-heading > p:last-child {
margin: 0;
color: rgba(255, 255, 255, 0.68);
font-size: 11px;
line-height: 1.5;
}
#cff-schedule-app .cff-schedule-access-heading .cff-schedule-access-note {
margin-top: 14px;
padding: 11px 13px;
border: 1px solid rgba(197, 162, 110, 0.38);
border-radius: 8px;
background: rgba(255, 255, 255, 0.07);
color: rgba(255, 255, 255, 0.82);
font-size: 10px;
line-height: 1.55;
}
#cff-schedule-app .cff-schedule-access-options {
margin-top: 20px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
}
#cff-schedule-app a.cff-schedule-access-option {
min-width: 0;
padding: 15px;
display: grid;
gap: 4px;
border: 1px solid rgba(197, 162, 110, 0.32);
border-radius: 10px;
background: rgba(255, 255, 255, 0.07);
color: var(--cff-white);
text-decoration: none;
transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}
#cff-schedule-app a.cff-schedule-access-option:hover {
border-color: var(--cff-gold);
background: rgba(255, 255, 255, 0.12);
color: var(--cff-white);
transform: translateY(-2px);
}
#cff-schedule-app .cff-schedule-access-option > span {
color: var(--cff-gold-soft);
font-size: 8px;
font-weight: 800;
letter-spacing: 0.13em;
text-transform: uppercase;
}
#cff-schedule-app .cff-schedule-access-option > strong {
overflow-wrap: anywhere;
color: var(--cff-white);
font-size: 12px;
line-height: 1.35;
}
#cff-schedule-app .cff-schedule-access-option > small {
color: rgba(255, 255, 255, 0.62);
font-size: 9px;
}
#cff-schedule-app .cff-schedule-access-option > b {
margin-top: 8px;
color: var(--cff-gold-soft);
font-size: 9px;
letter-spacing: 0.07em;
text-transform: uppercase;
}
#cff-schedule-app .cff-schedule-access-option i {
font-style: normal;
}
#cff-schedule-app .cff-schedule-poster-art {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
padding: 10%;
display: flex;
flex-direction: column;
justify-content: space-between;
color: var(--cff-white);
background: linear-gradient(145deg, var(--cff-poster-a), var(--cff-poster-b));
isolation: isolate;
}
#cff-schedule-app .cff-schedule-poster-art::before {
content: "";
position: absolute;
z-index: -1;
width: 78%;
aspect-ratio: 1;
right: -26%;
top: 18%;
border: 1px solid rgba(255, 255, 255, 0.25);
border-radius: 50%;
box-shadow: 0 0 0 38px rgba(255, 255, 255, 0.04), 0 0 0 76px rgba(255, 255, 255, 0.03);
}
#cff-schedule-app .cff-schedule-poster-art::after {
content: "";
position: absolute;
z-index: -1;
inset: auto 0 0;
height: 45%;
background: linear-gradient(transparent, rgba(0, 0, 0, 0.46));
}
#cff-schedule-app .cff-schedule-poster-art strong {
color: var(--cff-white);
font-family: "Cormorant Garamond", Georgia, serif;
line-height: 0.9;
font-weight: 600;
}
#cff-schedule-app .cff-schedule-poster-kicker,
#cff-schedule-app .cff-schedule-poster-credit {
font-size: 7px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.15em;
}
#cff-schedule-app .cff-schedule-poster-art.is-compact {
padding: 6px;
}
#cff-schedule-app .cff-schedule-poster-art.is-compact strong {
font-size: 8px;
}
#cff-schedule-app .cff-schedule-poster-art.is-compact .cff-schedule-poster-kicker,
#cff-schedule-app .cff-schedule-poster-art.is-compact .cff-schedule-poster-credit {
font-size: 3px;
}
#cff-schedule-app .cff-schedule-poster-image {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
@keyframes cff-schedule-fade-in {
from { opacity: 0; }
}
@keyframes cff-schedule-modal-in {
from { opacity: 0; transform: translateY(18px) scale(0.98); }
}
@media (max-width: 840px) {
#cff-schedule-app .cff-schedule-hero {
min-height: 490px;
grid-template-columns: 1fr;
align-content: center;
align-items: start;
gap: 46px;
padding-top: 58px;
}
#cff-schedule-app .cff-schedule-hero-date {
width: max-content;
min-width: 0;
padding: 0 0 0 20px;
}
#cff-schedule-app .cff-schedule-hero-date strong {
font-size: 46px;
}
#cff-schedule-app .cff-schedule-filter-row {
grid-template-columns: 1fr 180px;
}
#cff-schedule-app .cff-schedule-timezone {
grid-column: 1 / -1;
margin: 0;
text-align: right;
}
#cff-schedule-app .cff-schedule-card {
grid-template-columns: 110px minmax(0, 1fr);
}
#cff-schedule-app .cff-schedule-view {
grid-column: 1 / -1;
min-height: 48px;
border-left: 0;
border-top: 1px solid var(--cff-line);
flex-direction: row;
}
#cff-schedule-app .cff-schedule-view b {
width: auto;
height: auto;
border: 0;
}
}
@media (max-width: 600px) {
#cff-schedule-app .cff-schedule-notice {
justify-content: flex-start;
padding: 10px 18px;
}
#cff-schedule-app .cff-schedule-notice span:last-child {
flex: 1 1 100%;
padding-left: 16px;
}
#cff-schedule-app .cff-schedule-hero {
min-height: 520px;
padding: 62px 24px 55px;
}
#cff-schedule-app .cff-schedule-hero h1 {
font-size: clamp(54px, 16vw, 72px);
line-height: 0.88;
}
#cff-schedule-app .cff-schedule-hero-intro {
font-size: 14px;
line-height: 1.6;
}
#cff-schedule-app .cff-schedule-orbit-one {
width: 390px;
height: 390px;
right: -200px;
}
#cff-schedule-app .cff-schedule-orbit-two {
width: 260px;
height: 260px;
right: -80px;
top: 40px;
}
#cff-schedule-app .cff-schedule-day-switcher {
padding: 0;
overflow-x: auto;
}
#cff-schedule-app .cff-schedule-day-switcher button {
min-width: 33.333%;
padding: 15px 5px;
flex-direction: column;
gap: 1px;
}
#cff-schedule-app .cff-schedule-day-switcher button span {
font-size: 18px;
}
#cff-schedule-app .cff-schedule-day-switcher button.is-selected::after {
left: 16px;
right: 16px;
}
#cff-schedule-app .cff-schedule-filter-row {
grid-template-columns: 1fr;
padding: 12px 16px;
}
#cff-schedule-app .cff-schedule-timezone {
display: none;
}
#cff-schedule-app .cff-schedule-list {
padding: 42px 16px 90px;
}
#cff-schedule-app .cff-schedule-heading p {
font-size: 24px;
}
#cff-schedule-app .cff-schedule-heading span {
font-size: 9px;
}
#cff-schedule-app .cff-schedule-card {
min-height: 0;
grid-template-columns: 1fr;
}
#cff-schedule-app .cff-schedule-time {
padding: 14px 20px;
border-right: 0;
border-bottom: 1px solid var(--cff-line);
align-items: baseline;
flex-direction: row;
gap: 8px;
}
#cff-schedule-app .cff-schedule-time strong {
font-size: 19px;
}
#cff-schedule-app .cff-schedule-card-body {
padding: 24px 20px 22px;
}
#cff-schedule-app .cff-schedule-card h2 {
font-size: 29px;
}
#cff-schedule-app .cff-schedule-description {
font-size: 11px;
}
#cff-schedule-app .cff-schedule-modal-shell {
padding: 0;
align-items: flex-end;
}
#cff-schedule-app .cff-schedule-modal {
width: 100%;
max-height: 92vh;
border-radius: 20px 20px 0 0;
padding: 34px 20px 0;
}
#cff-schedule-app .cff-schedule-modal-close {
top: 16px;
right: 16px;
}
#cff-schedule-app .cff-schedule-modal-topline {
padding-right: 44px;
flex-direction: column;
gap: 4px;
}
#cff-schedule-app .cff-schedule-modal-eyebrow {
margin-top: 26px;
}
#cff-schedule-app .cff-schedule-access {
margin: 20px -20px 0;
padding: 22px 20px 40px;
}
#cff-schedule-app .cff-schedule-access-options {
grid-template-columns: 1fr;
}
#cff-schedule-app .cff-schedule-modal-film {
grid-template-columns: 26px 40px minmax(0, 1fr);
gap: 10px;
}
#cff-schedule-app .cff-schedule-mini-poster {
width: 36px;
height: 48px;
}
#cff-schedule-app .cff-schedule-modal-film h3 {
font-size: 16px;
}
#cff-schedule-app .cff-schedule-modal-film .cff-schedule-film-synopsis {
font-size: 10px;
line-height: 1.55;
}
}
@media (prefers-reduced-motion: reduce) {
#cff-schedule-app *,
#cff-schedule-app *::before,
#cff-schedule-app *::after {
scroll-behavior: auto !important;
animation-duration: 0.01ms !important;
transition-duration: 0.01ms !important;
}
}