@charset "utf-8";
/* CSS Document */
:root {
    --page-content-gutter: 6.7%;
    --font-body: 'Figtree', sans-serif;
}
body {
    font-family: var(--font-body)!important;
	margin: 0;
	padding:0;
    background-color: rgba(50,51,63, 1);
}

@font-face {
	font-family: 'Gotham Rounded';
	src: url('../css/font/GothamRounded-Medium.eot');
	src: url('../css/font/GothamRounded-Medium.eot?#iefix') format('embedded-opentype'),
		url('../css/font/GothamRounded-Medium.woff2') format('woff2'),
		url('../css/font/GothamRounded-Medium.woff') format('woff'),
		url('../css/font/GothamRounded-Medium.ttf') format('truetype'),
		url('../css/font/GothamRounded-Medium.svg#GothamRounded-Medium') format('svg');
	font-weight: 500;
	font-style: normal;
}

@font-face {
    font-family: 'Sloke';
    src: url('font/Sloke-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sloke';
    src: url('font/Sloke-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sloke';
    src: url('font/Sloke-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sloke';
    src: url('font/Sloke-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sloke';
    src: url('font/Sloke-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

body a:link {
	color: #b68bfc;
	text-decoration: none;

	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}

body a:visited {
	color: #b68bfc;
	text-decoration: none;
}

body a:hover {
	color: #b68bfc;
	text-decoration: none;
}

body a:active {
	color: white;
	text-decoration: none;
}

h1, h2, h3, h4, h5 {
	text-transform: uppercase;
	font-family: 'Gotham Rounded', sans-serif!important;
	color: white!important;
}

h1 {
    font-size: 2.5rem!important;
}

h1 small {
    text-transform: none;
}

h2 {
    font-size: 2rem!important;
}

h3 {
    font-size: 1.4rem!important;
}

ul {
    list-style-type: none;
}

ul li {
    padding: 4px;
}

ul li:before {
    content: "\2022";
    color: #F04E3E;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
}

.modal-open .modal {
    padding-right: 0!important;
}

.modal-open {
	overflow: inherit!important;
}

.modal button {
    cursor: pointer;
    background: none;
    padding: 0!;
    font-size: 24px!important;
    border: none;
    color: #A0A3A6;
}

main {
    position: relative;
    background-color: rgba(50,51,63, 1);
    background-attachment: fixed;
    background-repeat:no-repeat;
    background-position: center bottom;
    background-size: cover;
    z-index: 0;
    overflow: hidden;
}

/************************CALENDAR************************/

.calendar-section {
    --calendar-background: #e8edf4;
    --calendar-border: #bcc5d4;
    --calendar-ink: #111050;
    position: relative;
    z-index: 0;
    background: var(--calendar-background);
    color: var(--calendar-ink);
    padding: 0 24px 36px;
}

.calendar-toolbar {
    position: sticky;
    top: var(--drawer-menu-height, 0px);
    z-index: 5;
    background: var(--calendar-background);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 8px 12px;
    margin: 0 auto;
}

.calendar-heading-group,
.calendar-date-navigation {
    display: flex;
    align-items: center;
}

.calendar-heading-group {
    gap: 18px;
}

.calendar-heading-group h2 {
    text-transform: none;
    color: var(--calendar-ink)!important;
    font-size: 2rem;
    font-weight: 700;
    margin: 0;
}

.calendar-language-filter {
    position: relative;
    display: inline-grid;
    grid-template-columns: repeat(2, minmax(54px, 1fr));
    border: 1px solid #9ba7bd;
    border-radius: 999px;
    overflow: hidden;
    padding: 0.25em;
}

.calendar-language-filter::before {
    content: '';
    position: absolute;
    top: 0.25em;
    bottom: 0.25em;
    left: 0.25em;
    width: calc((100% - 0.5em) / 2);
    border-radius: 999px;
    background: #9aabff;
    pointer-events: none;
    transform: translateX(0);
    transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.calendar-language-filter:has([data-calendar-language="en"][aria-pressed="true"])::before {
    transform: translateX(100%);
}

@media (prefers-reduced-motion: reduce) {
    .calendar-language-filter::before {
        transition: none;
    }
}

.calendar-language-filter button {
    position: relative;
    z-index: 1;
    min-width: 54px;
    border: 0;
    background: transparent;
    color: var(--calendar-ink);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 9px 14px;
    border-radius: 999px;
}

.calendar-language-filter button:focus-visible,
.calendar-navigation-button:focus-visible,
.calendar-datepicker-button:focus-visible,
.calendar-resource.is-interactive:focus-visible {
    outline: 3px solid #7157ff;
    outline-offset: 2px;
}

.calendar-date-navigation {
    gap: 10px;
}

#calendar-date-label {
    min-width: 145px;
    border-radius: 10px;
    background: #302aa0;
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 10px 14px;
    text-align: center;
    text-transform: uppercase;
}

.calendar-navigation-button,
.calendar-datepicker-button {
    display: inline-grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #302aa0;
    font-size: 1.25rem;
}

.calendar-navigation-button:disabled {
    color: #9ba7bd;
    cursor: not-allowed;
}

#calendar-datepicker {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.calendar-status {
    height: 0;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    border-radius: 8px;
    background: rgba(48, 42, 160, 0.08);
    text-align: center;
    transition: opacity 450ms ease, height 450ms ease, margin-bottom 450ms ease;
}

.calendar-status.is-visible {
    height: var(--calendar-status-height, 44px);
    margin-bottom: 12px;
    opacity: 1;
}

.calendar-status-message {
    padding: 10px 16px;
}

@media (prefers-reduced-motion: reduce) {
    .calendar-status { transition: none; }
}

.calendar-status.is-error,
.calendar-status.is-warning {
    background: rgba(167, 45, 45, 0.12);
    color: #711f1f;
}

.calendar-scroll {
    margin: 0 auto;
    /* FullCalendar handles horizontal scrolling; vertical scrolling belongs to the page. */
    overflow: visible;
}

#calendar {
    min-width: 0;
    background-color: var(--calendar-background);
}

/* FullCalendar 7's sticky table-header containers (resource and hour columns). */
#calendar .fc-yg {
    top: calc(var(--drawer-menu-height, 0px) + var(--calendar-toolbar-height, 0px))!important;
    background-color: var(--calendar-background)!important;
}

/* Attach the toolbar to the same native sticky header as the hour labels.
   The empty slot preserves its original space above the calendar. */
#calendar .calendar-controls-column {
    position: relative;
    z-index: 1;
}

#calendar .calendar-controls-host {
    z-index: 6!important;
}

#calendar .calendar-controls {
    position: absolute;
    left: 0;
    bottom: calc(100% + 1px);
    width: var(--calendar-controls-width);
    background: var(--calendar-background)!important;
}

#calendar .calendar-controls .calendar-toolbar {
    position: relative;
    top: auto;
    background: var(--calendar-background)!important;
}

#calendar {
    --fc-border-color: var(--calendar-border);
    --fc-event-bg-color: transparent;
    --fc-event-border-color: transparent;
    --fc-event-text-color: var(--calendar-ink);
    color: var(--calendar-ink);
    font-family: inherit;
}

#calendar > *,
#calendar [class*="fc-"] {
    background-color: transparent !important;
   /* background-color: var(--calendar-background); */
}

#calendar .fc-monarch-9yp {
    width: 100%;
}

#calendar .fc-monarch-MAH {
   background-color: var(--calendar-background) !important;
   padding-top: 1em;
   padding-bottom: 0.5em;
   border-top: solid 1px var(--calendar-border);
}

#calendar .fc-monarch-MAH td,
#calendar .fc-monarch-MAH th {
    background-color: var(--calendar-background) !important;
}

#calendar .fc-monarch-zOd {
    border-width: 0px;
}

#calendar table,
#calendar td,
#calendar th {
    border-color: var(--calendar-border);
}

.planetarium-resource-header,
.planetarium-slot-header {
    background: var(--calendar-background);
}

.planetarium-resource-header {
    font-size: 0;
}

#calendar .planetarium-resource-row {
    border-color: var(--calendar-border)!important;
}

#calendar .planetarium-resource-cell {
    min-height: 118px;
    background: var(--calendar-background);
    border-color: var(--calendar-border)!important;
    border-style: solid!important;
    border-width: 0 1px 0px 0!important;
}

#calendar .planetarium-resource-cell > * {
    width: 100%;
    padding: 12px 8px;
}

#calendar .planetarium-resource-header {
    border-color: var(--calendar-border)!important;
    border-style: solid!important;
    border-width: 0px 0px 2px 0!important;
}

/* Keep the closing rule on the scrolling rows, not the frame containing
   the sticky hour headers, so it can pass underneath those headers. */
#calendar .planetarium-resource-row:last-child .planetarium-resource-cell {
    border-bottom-width: 1px!important;
}

#calendar .planetarium-calendar-view {
    border-width: 0 !important;
    border-radius: 0px;
    padding-bottom: 0px;
    border-color: var(--calendar-border);
}


#calendar .planetarium-slot-header {
    color: var(--calendar-ink);
    font-size: 0.85rem;
    font-weight: 700;
    border-color: var(--calendar-border)!important;
    border-style: solid!important;
    border-width: 0px 0px 2px 0!important;
}

.calendar-resource {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 92px;
    align-items: center;
    gap: 15px;
    border: 0;
    background: transparent;
    color: var(--calendar-ink);
    padding: 0;
    text-align: left;
}

.calendar-resource.is-interactive {
    cursor: pointer;
}

.calendar-resource img {
    flex: 0 0 150px;
    width: 150px;
    height: 150px;
    border-radius: 9px;
    object-fit: cover;
}

.calendar-resource-copy {
    font-family: Figtree;
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 10px;
    white-space: normal;
}

.calendar-resource-copy strong {
    font-family: Figtree;
    font-size: 16px;
    line-height: 1.2;
}

.calendar-resource-copy small {
    color: #666a8f;
    font-size: 15px;
    line-height: 1.25;
}

.calendar-resource.is-interactive .calendar-resource-copy {
    padding-bottom: 32px;
}

.calendar-resource-arrow {
    position: absolute;
    right: 0;
    bottom: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--calendar-ink);
    color: #fff;
}

@media (min-width: 769px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .calendar-resource-arrow {
        transition: transform 200ms ease;
    }

    .calendar-resource:hover .calendar-resource-arrow,
    .calendar-resource:focus-visible .calendar-resource-arrow {
        transform: translateX(5px);
    }
}

.planetarium-event {
    min-height: 38px;
    border: 0!important;
    background: transparent!important;
    box-shadow: none!important;
    cursor: default;
}

#calendar .planetarium-resource-lane {
    background: transparent !important;
    border-color: var(--calendar-border)!important;
    border-style: solid!important;
    border-width: 0 1px 1px 0!important;
}

/* Center the whole time-label stack, preserving any overlapping showtimes. */
#calendar .planetarium-resource-lane > :has(.planetarium-event) {
    top: 50%;
    transform: translateY(-50%);
}

.planetarium-event > * {
    display: flex;
    align-items: center;
    overflow: visible;
}

.calendar-event-time {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 1px 4px rgba(17, 16, 80, 0.14);
    color: var(--calendar-ink);
    font-size: 0.85rem;
    font-weight: 700;
    padding: 7px 8px;
    white-space: nowrap;
}

/************************CALENDAR END************************/

/************************DATEPICKER************************/
.ui-widget {
    font-family: var(--font-body);
}

#datepicker {
    display: none;
}

/* Match the compact, unboxed date grid used in the calendar design. */
.ui-datepicker {
    width: 344px;
    max-width: calc(100vw - 24px);
    padding: 0 0 8px;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    background: #fff;
    color: #100b42;
    box-shadow: none;
    font-size: 13px;
    z-index: 99999999!important;
}

.ui-datepicker .ui-datepicker-header {
    height: 60px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.ui-datepicker .ui-datepicker-title {
    margin: 0 48px;
    color: inherit;
    font-size: 16px;
    font-weight: 700;
    line-height: 60px;
    text-align: center;
}

.ui-datepicker a {
    cursor: pointer;
    text-decoration: none;
}

.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    top: 50%;
    width: 22px;
    height: 22px;
    margin-top: -11px;
    border: 0;
    border-radius: 50%;
    background: #adb4ff;
    cursor: pointer;
}

.ui-datepicker .ui-datepicker-prev { left: 15px; }
.ui-datepicker .ui-datepicker-next { right: 15px; }

.ui-datepicker .ui-datepicker-prev:hover,
.ui-datepicker .ui-datepicker-next:hover {
    background: #969fff;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    top: 50%;
    left: 50%;
    width: 6px;
    height: 6px;
    margin: -3px 0 0 -3px;
    border: solid #100b42;
    border-width: 0 1.5px 1.5px 0;
    background-image: none;
}

.ui-datepicker .ui-datepicker-prev span { transform: translateX(1px) rotate(135deg); }
.ui-datepicker .ui-datepicker-next span { transform: translateX(-1px) rotate(-45deg); }

.ui-datepicker table {
    width: 100%;
    margin: 0;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: inherit;
}

.ui-datepicker th {
    height: 38px;
    padding: 0;
    border: 0;
    color: inherit;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.ui-datepicker table td {
    height: 48px;
    padding: 0;
    border: 0;
    text-align: center;
}

.ui-datepicker .ui-state-default {
    display: grid;
    width: min(48px, 100%);
    height: 48px;
    margin: auto;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #100b42;
    font-weight: 400;
    text-align: center;
}

.ui-datepicker a.ui-state-default:hover {
    background: #e6eff4;
    color: #100b42;
}

.ui-datepicker .ui-state-active,
.ui-datepicker .ui-state-highlight {
    background: transparent;
    color: #9ca6ff;
    font-weight: 700;
}

.ui-datepicker .ui-state-disabled {
    opacity: 1;
}

.ui-datepicker .ui-datepicker-other-month .ui-state-default,
.ui-datepicker .ui-state-disabled .ui-state-default {
    color: #bbc0ca;
    font-weight: 400;
}

.ui-datepicker .ui-datepicker-prev:focus-visible,
.ui-datepicker .ui-datepicker-next:focus-visible,
.ui-datepicker a.ui-state-default:focus-visible {
    outline: 2px solid #111050;
    outline-offset: 1px;
}

.ui-datepicker-trigger {
    margin-left: 0.75em!important;
    border-radius: 4px!important;
}

.ui-datepicker-trigger img {
    display: inline-block;
    height: 1.6em;
    line-height: 1.6em;
    position: relative;
    top: -0.05em;
    margin: 0 0.2em;
    vertical-align: middle;
}

/************************DATEPICKER END************************/

.gradient-shows {
    padding:0;
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 30%;
    z-index: -1;
    background: rgb(50,51,63);
    background: linear-gradient(180deg, rgba(50,51,63,1) 8%, rgba(50,51,63,0) 100%);
}

/* Stars belong to the hero, independent of the drawer breakpoint. */
.hero-stars {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

@keyframes particleAnimation {
    from { left: -100px; opacity: 1; }
    to { left: calc(100% + 100px); top: 70%; opacity: .3; }
}

.hero-stars .shooting,
.hero-stars .shooting-medium {
    position: absolute;
    left: 0;
    width: 1px;
    height: 1px;
    background: white;
    animation: particleAnimation linear infinite;
    transform: rotate(20deg);
}

.hero-stars .shooting::before,
.hero-stars .shooting-medium::before {
    position: absolute;
    display: block;
    content: "";
    width: 100px;
    right: 1px;
    top: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, .4));
}

.hero-stars .shooting-medium,
.hero-stars .shooting-medium::before {
    height: 2px;
}
.hero-stars .shooting-medium { width: 2px; }

/* Staggered starting points keep stars visible immediately at every width. */
.hero-stars .star { top: 20%; animation-duration: 20s; animation-delay: -7s; }
.hero-stars .star2 { top: 30%; animation-duration: 10s; animation-delay: -2s; }
.hero-stars .star3 { top: 40%; animation-duration: 15s; animation-delay: -8s; }
.hero-stars .star4 { top: 5%; animation-duration: 5s; animation-delay: -3s; }

@media (prefers-reduced-motion: reduce) {
    .hero-stars .shooting,
    .hero-stars .shooting-medium { animation-play-state: paused; }
}

.services {
	cursor: pointer;
}

.services p {
	padding: 0;
	margin: 0;
	color: white;
}

.services h4 {
	color: white!important;
}

.services i {
	font-size: 50px;
	margin-bottom: 5%;
	color: #b1dc62;
}

.flashit {
	-webkit-animation: flash linear 2s infinite;
	animation: flash linear 2s infinite;
}

.tickets-link a {
	font-family: var(--font-body) !important;
	font-size: 1.5vw;
	padding: 0.5rem 1.3rem 0.5rem 4.2rem!important;
}

.tickets-link a img {
	width: 28px;
}


/************************COPYRIGHT************************/

footer {
	background-color: rgba(50,51,63, 1);
    position: relative;
    z-index:1;
}

footer small {
    color: #b1dc62;
}

#map {
	height: 400px;
	width: 100%;
    background-image: url(../img/bg-map.png);
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-moz-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-ms-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	border-radius: 22px;
	-webkit-border-radius: 22px;
	-moz-border-radius: 22px;
	-ms-border-radius: 22px;
	-o-border-radius: 22px;
    cursor: grab;
}

.coords h4 {
	width: 100%;
	font-size: 1.5rem!important;
	font-family: 'Gotham Rounded', sans-serif;
    font-weight: normal;
}

address {
	font-size: 12px;
	color: white;
	text-transform: none;
	padding-bottom: 1%;
	line-height: 18px;
}

address:last-child {
	margin-bottom: 0 !important;
}

.coords span {
	color: white;
}

.coords strong,
.coords span {
	font-family: var(--font-body);
	font-size: 16px;
	font-weight: normal;
}

.coords strong {
	margin-bottom: 7px;
	display: block;
}

.minutes {
	color: #b1dc62!important;
	font-size: 1.5rem!important;
}

.minutes a {
	color: #b1dc62!important;
	font-size: 1.5rem!important;
}

.copyright {
    position: relative;
    background-color: #2C2D8B;
	width: 100%;
	-webkit-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-moz-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-ms-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
}

.logo-left {
	height: 34px;
    width: auto;
}

.logo-right {
	height: 34px;
    width: auto;
}

/* Footer logos and cookie preferences share one aligned row. */
footer.site-footer {
    position: relative;
    z-index: 1;
    background: #2c2d8b;
}

.site-footer .copyright {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px 32px;
    min-height: 94px;
    padding: 26px clamp(24px, 3.6vw, 56px);
    box-shadow: none;
}

.site-footer .footer-logos {
    display: flex;
    align-items: center;
    gap: clamp(32px, 4.7vw, 72px);
}

.site-footer .footer-logos img {
    display: block;
    width: auto;
    height: 30px;
}

.site-footer .cky-banner-element {
    position: static;
    margin-left: auto;
    min-height: 40px;
    padding: 8px 0;
    color: #fff;
    font-size: 12px;
    cursor: pointer;
}

.site-footer .cky-banner-element:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 5px;
}

/************************SHOWS************************/

.films-item {
    position: relative;
    cursor: pointer;
    background-color:rgba(50,51,63,0.78);
    -moz-border-radius: 15px;
	-webkit-border-radius: 15px;
    border-radius: 15px;
    text-align: center;

    -webkit-transition: all .3s;
	-moz-transition: all .3s;
    transition: all .3s;
}

.films-item-text-solo {
    text-align: left;
}

.films-item span {
	float: right;
}

.films-item span.details {
	float: none;
}

.films-item em {
    color: #b1dc62;
    font-style: normal;
}

.films-item em.reg {
    color: #A0A3A6 !important;
    font-style: italic !important;
}

.films-item-container {
    color: #A0A3A6 !important;
}

.films-item-container p {
    margin-top: 12px !important;
}

.films-item-container:hover .films-item {
	-webkit-box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.29);
	-moz-box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.29);
	-ms-box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.29);
	box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.29);
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard */
    background-color:rgba(50,51,63,1);
}

.films-item i {
    filter: alpha(opacity=0);
    opacity: 0;
}

.films-item-container a, .films-item i, .films-item-container img {
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}

.films-item-container a:hover .films-item i {
	-ms-transform: scale(2);
	-webkit-transform: scale(2);
    transform: scale(2);
    filter: alpha(opacity=1);
    opacity: 1;
}

.films-item img {
    padding: 0;
    background-color: #7e48d4;
    border: none;
    width: 100%;
}

.films-item:hover img {
    padding: .3rem;
    -ms-transform: scale(0.9);
	-webkit-transform: scale(0.9);
    transform: scale(0.9);

    -webkit-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.29);
	-moz-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.29);
	-ms-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.29);
	box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.29);
    -webkit-transition: all .3s;
	-moz-transition: all .3s;
    transition: all .3s;
}

.films-item-container a:hover h5 {
    color: #b68bfc!important;
}

.img-thumbnail-flex {
    display: flex;
    align-items: center;
    justify-content: center;
}

small span.details {
    float: none;
}

small span.details::before, p.date span.details::before {
    content: " · ";
}

.notice {
	width: 70%;
	margin: 10% auto;
	border: 2px solid #7e48d4;
	padding: 5%;
	background-color: rgba(44, 56, 61, 0.8);
	color: white;
	text-align: center;
}

.notice h3 {
	margin-bottom: 20px;
}

.new {
    position: absolute;
    width: 100%;
    z-index: 1;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
    padding: 6px 5px 4px 5px;
    color: white;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    background: linear-gradient(90deg, rgba(240,78,62,0) 3%, rgba(240,78,62,0.78) 30%, rgba(240,78,62,0.78) 70%, rgba(240,78,62,0) 97%);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);

    -webkit-border-bottom-right-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-bottomright: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.promo-new {
    width: 100%;
    padding: 6px 5px 4px 5px;
    color: white;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    background: linear-gradient(90deg, rgba(240,78,62,0) 3%, rgba(240,78,62,0.78) 30%, rgba(240,78,62,0.78) 70%, rgba(240,78,62,0) 97%);
}

.new-slider {
    padding: 5px 8px 3px 8px;
    color: white;
    text-transform: uppercase;
    font-size: 22px;
    font-weight: bold;
    background: linear-gradient(90deg, rgba(240,78,62,0) 3%, rgba(240,78,62,0.78) 30%, rgba(240,78,62,0.78) 70%, rgba(240,78,62,0) 97%);
}

:focus {
	outline-color: transparent;
	outline-style: none;
}

/************************SHOWS END************************/

/************************HERO************************/
.legacy-site-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 8px 56px;
    background: #0d3563;
    color: #fff;
    font-size: 15px;
    line-height: 1.4;
    text-align: center;
}

.legacy-site-banner .legacy-site-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 5px 18px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #080b39;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.legacy-site-banner .legacy-site-cta:hover {
    background: #bec2ff;
    color: #080b39;
}

.legacy-site-banner .legacy-site-cta:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

.legacy-site-close {
    position: absolute;
    top: 2px;
    right: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
}

.legacy-site-close:hover {
    color: #a4a9ff;
}

.legacy-site-close:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.planetarium-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    width: 100%;
    height: 100vh;
    height: 100dvh;
    background: #003746;
    color: #fff;
}

.planetarium-hero-image {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 58%;
    transform: scale(1);
    transform-origin: center 58%;
}

@media (prefers-reduced-motion: no-preference) {
    .planetarium-hero-image {
        transform: scale(1.12);
    }

    .planetarium-hero-image.is-zooming {
        animation: hero-image-zoom 2s ease-out both;
    }
}

@keyframes hero-image-zoom {
    from { transform: scale(1.12); }
    to { transform: scale(1); }
}

/* Keep navigation and heading above the decorative star layer. */
.hero-header,
.hero-content {
    position: relative;
    min-width: 0;
    z-index: 1;
}

.hero-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 30px 3.4%;
}

.hero-brand {
    display: block;
    flex-shrink: 0;
    width: clamp(150px, 13vw, 220px);
}

.hero-brand img {
    display: block;
    width: 100%;
    height: auto;
    filter: brightness(0) invert(1);
}

.hero-navigation {
    display: flex;
    align-items: center;
    gap: clamp(24px, 3vw, 48px);
    font-family: var(--font-body);
}

/* Set transitions on the base state so hover and leave use the same timing. */
.legacy-site-banner .legacy-site-cta,
.legacy-site-close,
.hero-navigation .hero-ticket-link,
.offer-copy .offer-ticket-link,
.astronomy-intro .astronomy-ticket,
.films-intro .films-ticket,
.day-visit-section .day-visit-ticket,
.event-modal .event-modal-ticket,
.access-section .access-directions,
.visit-date-modal .visit-date-modal-choice,
.ticket-purchase-modal a.ticket-purchase-pill,
.event-modal .event-modal-close,
.event-modal .event-modal-close-text,
.map-image-modal .map-image-close,
.ticket-purchase-close,
body .btn {
    transition: background-color 300ms ease,
                color 300ms ease,
                border-color 300ms ease,
                box-shadow 300ms ease,
                opacity 300ms ease;
}

/* Ticket and directions CTAs share typography at every breakpoint. */
.hero-navigation .hero-ticket-link,
.offer-copy .offer-ticket-link,
.astronomy-intro .astronomy-ticket,
.films-intro .films-ticket,
.day-visit-section .day-visit-ticket,
.event-modal .event-modal-ticket,
.access-section .access-directions,
.btn.ticket-cta {
    border: 0;
    font-size: 16px;
    font-weight: 500;
}

.hero-navigation .hero-ticket-link,
.offer-copy .offer-ticket-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 22px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #080b39;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
}

.hero-navigation .hero-ticket-link:hover,
.offer-copy .offer-ticket-link:hover {
    background: #bec2ff;
    color: #080b39;
}

.hero-navigation .language {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
}

.hero-header a:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 6px;
}

.hero-content {
    display: flex;
    align-items: center;
    padding: 0 var(--page-content-gutter) 100px;
}

.planetarium-hero h1 {
    margin: 0;
    max-width: 100%;
    font-size: clamp(45px, 5.25vw, 85px) !important;
    font-weight: 500;
    line-height: 1.08;
    letter-spacing: -0.025em;
    text-transform: none;
}


/************************STICKY MENU************************/
.sticky-menu {
    position: fixed;
    inset: 0 0 auto;
    z-index: 1030;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 54px;
    padding: 15px 2.5%;
    background: #302d87;
    transform: translateY(-100%);
    visibility: hidden;
    transition: transform 320ms cubic-bezier(.22, 1, .36, 1), visibility 0s 320ms;
}

.sticky-menu.is-visible {
    transform: translateY(0);
    visibility: visible;
    transition-delay: 0s;
}

.sticky-brand,
.sticky-brand img {
    display: block;
    width: 90px;
    height: 37px;
    flex-shrink: 0;
}

.sticky-menu .hero-ticket-link {
    max-width: none;
    padding: 10px 20px;
    line-height: 1.125;
    white-space: nowrap;
}

.sticky-menu .language {
    min-height: 37px;
    font-size: 16px;
}

.sticky-menu a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .sticky-menu {
        transition: none;
    }
}

/************************COMBINED OFFER************************/
.offer-section {
    position: relative;
    z-index: 1;
    margin-top: -86px;
    padding: 0 var(--page-content-gutter) 42px;
    background: linear-gradient(to bottom, transparent 86px, #fff 86px);
}

.offer-card {
    display: grid;
    grid-template-columns: 41% minmax(0, 1fr);
    align-items: start;
    gap: 48px;
    min-height: 200px;
    margin: 0 auto;
    padding: 70px 60px;
    border-radius: 20px;
    background: #302d87;
    color: #fff;
}

.offer-card .offer-title {
    margin: 4px 0 0;
    font-size: 34px!important;
    font-weight: 500;
    line-height: 1.32;
    text-transform: none;
}

.offer-copy {
    font-size: 20px;
    line-height: 1.4;
}

.offer-copy p {
    margin: 0 0 28px;
}

.offer-copy .offer-ticket-link {
    font-family: var(--font-body);
    cursor: pointer;
}

.offer-ticket-link:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 6px;
}

#showtimes {
    scroll-margin-top: 80px;
}

.offer-pending .offer-card {
    visibility: hidden;
    clip-path: inset(100% 0 0);
}

@media (prefers-reduced-motion: no-preference) {

    .offer-pending .offer-title,
    .offer-pending .offer-copy {
        opacity: 0;
    }

    .offer-entering .offer-card {
        animation: offer-panel-in 700ms cubic-bezier(.25, .8, .25, 1) both;
    }

    .offer-entering .offer-title {
        animation: offer-title-in 650ms cubic-bezier(.25, .8, .25, 1) 650ms both;
    }

    .offer-entering .offer-copy {
        animation: offer-copy-in 650ms cubic-bezier(.25, .8, .25, 1) 650ms both;
    }
}

@keyframes offer-panel-in {
    from { clip-path: inset(100% 0 0); }
    to { clip-path: inset(0 0 0); }
}

@keyframes offer-title-in {
    from { opacity: 0; transform: translateY(-32px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes offer-copy-in {
    from { opacity: 0; transform: translateY(32px); }
    to { opacity: 1; transform: translateY(0); }
}


/************************EXPERIENCE CARDS************************/
.experiences-section {
    position: relative;
    background: #fff;
    color: #10083e;
    padding: 72px var(--page-content-gutter) clamp(240px, 18vw, 320px);
}

.experiences-intro {
    text-align: center;
}

.experiences-intro h2 {
    max-width: 1050px;
    margin: 0 auto 28px;
    color: #10083e!important;
    font-size: clamp(32px, 3.4vw, 48px)!important;
    font-weight: 500;
    line-height: 1.15;
    text-transform: none;
    letter-spacing: -0.025em;
}

.experiences-intro p {
    max-width: 600px;
    margin: 0 auto 60px;
    font-size: 20px;
    line-height: 1.4;
}

/* Each text block rises through its own clipping edge, title first. */
.text-reveal-mask {
    overflow: hidden;
}

.text-reveal-description {
    --text-reveal-delay: 550ms;
}

.text-reveal-cta {
    --text-reveal-delay: 850ms;
    /* Keep the button's focus outline inside the clipping edge. */
    margin: -8px;
    padding: 8px;
}

.text-reveal-content {
    display: block;
}

@media (prefers-reduced-motion: no-preference) {
    [data-text-reveal].is-reveal-pending .text-reveal-content {
        transform: translateY(105%);
    }

    [data-text-reveal].is-revealed .text-reveal-content {
        transform: translateY(0);
        transition: transform 800ms cubic-bezier(0.22, 1, 0.36, 1) var(--text-reveal-delay, 250ms);
    }

}

.experience-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}

.experience-grid .experience-card {
    position: relative;
    isolation: isolate;
    display: grid;
    place-items: center;
    min-width: 0;
    height: clamp(360px, 29.6vw, 520px);
    padding: 24px 16px;
    overflow: hidden;
    border-radius: 10px;
    background: #10083e;
    color: #fff;
    text-align: center;
    text-decoration: none;
    transition: box-shadow 350ms ease;
}

.experience-card img,
.experience-card::after {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.experience-card img {
    z-index: -2;
    object-fit: cover;
    transition: transform 650ms cubic-bezier(.22, 1, .36, 1);
}

.experience-card::after {
    content: '';
    z-index: -1;
    background: linear-gradient(180deg, rgba(8, 4, 30, .05), rgba(8, 4, 30, .3) 52%, rgba(8, 4, 30, .1));
}

.experience-card--astronomy img { object-position: 35% center; }
.experience-card--films img { object-position: 40% center; }
.experience-card--exhibition img { object-position: center; }
.experience-card--science img { object-position: 40% center; }

.experience-card h3 {
    margin: 0;
    font-family: var(--font-body)!important;
    font-size: clamp(22px, 1.9vw, 28px)!important;
    font-weight: 500;
    line-height: 1.25;
    text-transform: none;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .3);
}

.experience-card-arrow {
    position: absolute;
    right: 22px;
    bottom: 30px;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #a4a9ff;
    color: #10083e;
}

.experience-grid .experience-card:focus-visible {
    outline: 3px solid #302d87;
    outline-offset: 5px;
}

.experience-card:focus-visible .experience-card-arrow {
    background: #fff;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .experience-grid .experience-card:hover {
        box-shadow: 0 16px 28px rgba(16, 8, 62, .18);
    }

    .experience-card:hover img {
        transform: scale(1.06);
    }
}

@media (prefers-reduced-motion: reduce) {
    .experience-grid .experience-card,
    .experience-card img {
        transition: none;
    }
}


/************************EXPERIENCE SCROLL REVEAL************************/
.experience-card--astronomy { --card-colour: #201e56; }
.experience-card--films { --card-colour: #333544; }
.experience-card--exhibition { --card-colour: #520000; }
.experience-card--science { --card-colour: #0d3563; }

.experience-grid { position: relative; }

@media (prefers-reduced-motion: no-preference) {
    .experiences-section.is-scroll-pinned {
        height: var(--experience-scroll-height);
    }

    .is-scroll-pinned .experiences-stage {
        position: sticky;
        top: var(--experience-pin-top, 88px);
    }

    .experiences-animated .experience-card {
        transform: translateY(var(--card-offset, 0px)) scale(var(--card-scale, 1));
        transform-origin: center top;
        background: var(--card-colour);
    }

    .experiences-animated .experience-card::before {
        content: '';
        position: absolute;
        inset: 0;
        z-index: 2;
        background: var(--card-colour);
        opacity: var(--card-cover, 0);
        pointer-events: none;
    }

    .experiences-animated .experience-card h3,
    .experiences-animated .experience-card-arrow {
        opacity: var(--card-label-opacity, 1);
    }
}


/************************STACKED SECTION DRAWERS************************/
/* Native anchors on mobile use the measured menu height, matching the
   custom desktop drawer navigation without leaving a fixed-offset gap. */
.section-drawers > .drawer-panel {
    scroll-margin-top: var(--drawer-menu-height, 0px);
}

.drawer-origin {
    height: 0;
    pointer-events: none;
}

.drawer-pause {
    display: none;
    pointer-events: none;
}

.drawers-enabled > .drawer-pause {
    display: block;
    height: clamp(320px, 45vh, 600px);
}

/* No transformed ancestors or wheel handlers: each panel keeps its natural
   document height, including the calendar and expanded details. */
.section-drawers.drawers-enabled > .drawer-panel {
    position: relative;
    z-index: var(--drawer-order);
    width: 100%;
}

.section-drawers.drawers-enabled > .drawer-panel:not(.is-normal-scroll) {
    position: sticky;
    top: var(--drawer-top, 88px);
    min-height: var(--drawer-viewport-height);
}

/* The closed feature and its toggle fill the screen together. Expanded
   details add natural height instead of being clipped inside a fixed box. */
.drawers-enabled > .drawer-panel > .astronomy-overview {
    min-height: calc(var(--drawer-viewport-height) - var(--drawer-toggle-height, 92px));
}

.drawers-enabled > .drawer-panel > .astronomy-overview > .astronomy-intro {
    align-self: center;
}

/************************ASTRONOMY SECTION************************/
.astronomy-section {
    position: relative;
    z-index: 1;
    background: #201e56;
    color: #fff;
    scroll-margin-top: 88px;
}

/* Exhibition shares the astronomy split layout, without its expandable panel. */
.exhibition-section {
    position: relative;
    z-index: 1;
    background: #520000;
    color: #fff;
    scroll-margin-top: 88px;
}

.exhibition-section .astronomy-image img {
    object-position: center;
}

.activities-section {
    position: relative;
    z-index: 1;
    background: #0d3563;
    color: #fff;
    scroll-margin-top: 88px;
}

@media (min-width: 768px) {
    .activities-section .astronomy-overview {
        grid-template-columns: 43.5% minmax(0, 1fr);
    }
}

.astronomy-overview {
    display: grid;
    grid-template-columns: 56.5% minmax(0, 1fr);
    min-height: 680px;
}

.astronomy-intro {
    box-sizing: border-box;
    width: 100%;
    /* Limit the text to 760px, plus the two 96px desktop gutters. */
    max-width: 952px;
    padding: 100px clamp(32px, 5vw, 96px) 88px;
}

.astronomy-intro h2 {
    margin: 0 0 35px;
    font-size: clamp(40px, 4.5vw, 64px)!important;
    font-weight: 500;
    line-height: 1.12;
    text-transform: none;
    letter-spacing: -.025em;
}

.astronomy-copy,
.astronomy-more-copy {
    font-size: clamp(14px, 1.2vw, 18px);
    line-height: 1.5;
}

.astronomy-copy {
    max-width: 620px;
}

@media (min-width: 1101px) {
    .astronomy-section .astronomy-overview {
        grid-template-columns: 60% minmax(0, 1fr);
    }

    .astronomy-section .astronomy-intro {
        max-width: 1012px;
        padding-block: clamp(32px, 4vh, 64px);
    }

    .astronomy-section .astronomy-copy {
        max-width: 820px;
    }
}

.astronomy-copy p {
    margin: 0 0 22px;
}

.astronomy-copy .astronomy-lead {
    margin-bottom: 18px;
    font-size: clamp(18px, 1.55vw, 22px);
    font-weight: 500;
    line-height: 1.4;
}

.astronomy-intro .astronomy-ticket,
.films-intro .films-ticket {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    margin-top: 25px;
    padding: 8px 18px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #10083e;
    font-family: var(--font-body);
    text-align: center;
    text-transform: uppercase;
}

.astronomy-intro .astronomy-ticket:hover,
.films-intro .films-ticket:hover {
    background: #bec2ff;
}

.astronomy-image {
    position: relative;
    min-width: 0;
    overflow: hidden;
}

.astronomy-image img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.astronomy-more {
    overflow: hidden;
}

.astronomy-more-layout {
    display: grid;
    grid-template-columns: 31% minmax(0, 1fr);
    align-items: flex-start;
    gap: 50px;
    padding: 90px clamp(32px, 5vw, 96px) 70px;
}

/* Alternate the expanded image when the main image is on the left. */
@media (min-width: 768px) {
    .activities-section .astronomy-more-layout {
        grid-template-columns: minmax(0, 1fr) 31%;
    }

    .activities-section .astronomy-more-layout > img {
        order: 1;
    }
}

.astronomy-more-layout > img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.18;
    border-radius: 8px;
    object-fit: cover;
}

.astronomy-more-copy {
    align-self: start;
    max-width: 75%;
    padding-top: 0;
}

.astronomy-more-copy h3,
.astronomy-more-copy .astronomy-schedule-title {
    margin: 0;
    font-family: var(--font-body)!important;
    font-size: clamp(18px, 1.55vw, 28px)!important;
    font-weight: 500;
    line-height: 1.4;
    text-transform: none;
}

.astronomy-more-copy .astronomy-schedule-title {
    margin-bottom: 20px;
}

.astronomy-schedule-columns {
    --calendar-ink: #111050;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
    margin-bottom: 28px;
}

.astronomy-schedule-days {
    display: grid;
    gap: 20px;
    margin: 0;
}

.astronomy-schedule-day dt {
    margin-bottom: 8px;
    font-weight: 500;
}

.astronomy-schedule-times {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
}

.astronomy-more-copy .astronomy-schedule-language,
.astronomy-more-copy .experience-details-heading {
    margin-bottom: 10px;
    font-size: inherit !important;
    font-weight: 700;
    font-size: 22px !important;
    text-transform: uppercase;
}

.exhibition-section .astronomy-more-copy h3,
.activities-section .astronomy-more-copy h3 {
    font-size: 26px !important;
    margin-top: 30px;
}

.exhibition-section .astronomy-more-copy .experience-details-heading,
.activities-section .astronomy-more-copy .experience-details-heading {
    text-transform: none;
}

.astronomy-more-copy p {
    margin: 0 0 15px;
}

.astronomy-more-copy ul {
    margin: 0;
    padding-left: 21px;
    list-style: disc;
}

.astronomy-more-copy li {
    padding: 0;
}

.astronomy-more-copy li::before {
    content: none;
}

.astronomy-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    width: 100%;
    min-height: 92px;
    padding: 24px;
    border: 0;
    border-top: 1px solid #fff;
    border-radius: 0;
    background: inherit;
    color: #fff;
    font-family: var(--font-body);
    font-size: 20px;
    line-height: 1.3;
    text-transform: uppercase;
    cursor: pointer;
}

.astronomy-toggle svg {
    transition: transform 350ms ease;
}

@media (prefers-reduced-motion: reduce) {
    .astronomy-toggle svg {
        transition: none;
    }
}

.astronomy-toggle[aria-expanded="true"] svg {
    transform: rotate(45deg);
}

.astronomy-toggle:focus-visible {
    outline: 3px solid #fff;
    outline-offset: -8px;
}

.astronomy-ticket:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 5px;
}

/************************IMMERSIVE FILMS INTRODUCTION************************/
.films-section {
    min-height: 100vh;
    min-height: 100dvh;
    /* Clip decoration without creating a scroll container for sticky headers. */
    overflow: clip;
    background: #e8edf4;
    scroll-margin-top: 88px;
}

/* A separate window onto the background between the two content drawers. */
.films-parallax {
    position: relative;
    z-index: 2;
    width: 100%;
    height: clamp(240px, 31.5vw, 480px);
    background: #09131c url('../img/experiences/space-brain.webp') center 47% / cover no-repeat;
}

@media (min-width: 1101px) and (prefers-reduced-motion: no-preference) {
    .films-parallax {
        background-attachment: fixed;
    }
}

@media (max-width: 1100px) and (prefers-reduced-motion: no-preference) {
    .films-parallax.is-mobile-parallax {
        overflow: hidden;
    }

    .films-parallax.is-mobile-parallax::before {
        content: '';
        position: absolute;
        inset: -48px 0;
        background: inherit;
        transform: translate3d(0, var(--films-parallax-offset, 0px), 0);
        will-change: transform;
    }
}

.films-intro {
    position: relative;
    display: grid;
    grid-template-columns: 48% minmax(0, 1fr);
    align-items: start;
    gap: 48px;
    padding: 72px clamp(24px, 5vw, 96px) 84px;
    background: #e8edf4;
    color: #10083e;
}

.films-intro h2 {
    margin: 0;
    color: #10083e!important;
    font-size: clamp(36px, 4.5vw, 60px)!important;
    font-weight: 500;
    line-height: 1.12;
    text-transform: none;
    letter-spacing: -.025em;
}

.films-heading {
    min-width: 0;
}

.films-schedule-notice {
    margin-top: 24px;
}

.films-intro p {
    margin: 16px 0 0;
    font-size: clamp(14px, 1.2vw, 18px);
    line-height: 1.5;
}

.films-ticket:focus-visible {
    outline: 3px solid #10083e;
    outline-offset: 5px;
}

.films-section .calendar-section {
    padding-inline: clamp(24px, 5vw, 96px);
}

/************************PRACTICAL INFORMATION************************/
.practical-sections {
    position: relative;
    z-index: 1;
    background-image: url('../img/moon-stars-background.svg'), linear-gradient(to bottom, #F0F4FF, #C2CEEA);
    background-position: center top;
    background-size: max(100%, 768px) auto, 100% 100%;
    background-repeat: repeat-y, no-repeat;
}

.practical-info-section {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(100, minmax(0, 1fr));
    align-items: start;
    padding: clamp(80px, 8.8vw, 140px) 3% 80px 4.3%;
    color: #10083e;
    scroll-margin-top: 88px;
}

.practical-info-section h2 {
    grid-column: 1 / span 39;
    margin: 0;
    color: #10083e!important;
    font-size: clamp(40px, 3vw, 72px)!important;
    font-weight: 500;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: -.025em;
}

.practical-info-copy {
    grid-column: 43 / -1;
}

.practical-info-copy h3 {
    margin: 14px 0 16px;
    color: #10083e!important;
    font-size: clamp(24px, 2vw, 32px)!important;
    font-weight: 500;
    line-height: 1.25;
    text-transform: none;
}

.practical-info-copy p {
    margin: 0 0 30px;
    font-size: clamp(14px, 1.2vw, 18px);
    line-height: 1.5;
}

.practical-info-copy p:last-child {
    margin-bottom: 0;
}

/************************A DAY AT THE PLANETARIUM************************/
.day-visit-section {
    display: grid;
    grid-template-columns: repeat(100, minmax(0, 1fr));
    align-items: start;
    padding: 60px 3% 140px 4.3%;
    color: #10083e;
    scroll-margin-top: 88px;
}

.day-visit-heading {
    grid-column: 1 / span 39;
    grid-row: 1;
    padding-right: 24px;
}

.day-visit-heading h3 {
    margin: 0 0 32px;
    color: #10083e!important;
    font-size: clamp(28px, 3vw, 46px)!important;
    font-weight: 500;
    line-height: 1.2;
    text-transform: none;
}

.day-visit-heading p {
    margin: 0 0 24px;
    font-size: 18px;
    line-height: 1.5;
}

.day-visit-section .day-visit-ticket {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 22px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #10083e;
    text-transform: uppercase;
    text-decoration: none;
}

.day-visit-section .day-visit-ticket:hover {
    background: #bec2ff;
    color: #10083e;
    text-decoration: none;
}

.day-visit-section .day-visit-ticket:focus-visible {
    outline: 2px solid #10083e;
    outline-offset: 4px;
}

.day-visit-stop {
    position: relative;
    min-width: 0;
    margin: 0;
    padding-bottom: 28px;
}

.day-visit-stop img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1.4;
    object-fit: cover;
    border-radius: 8px;
}

@media (prefers-reduced-motion: no-preference) {
    .content-reveal {
        --reveal-duration: 1200ms;
    }

    .content-reveal.is-reveal-pending,
    .day-visit-stop img.is-reveal-pending {
        opacity: 0;
        transform: translateY(24px);
    }

    .content-reveal.is-revealed,
    .day-visit-stop img.is-revealed {
        opacity: 1;
        transform: translateY(0);
        transition: opacity var(--reveal-duration, 900ms) ease var(--reveal-delay, 0ms),
            transform var(--reveal-duration, 900ms) cubic-bezier(0.22, 1, 0.36, 1) var(--reveal-delay, 0ms);
    }
}

.day-visit-stop h3 {
    margin: 20px 0 4px;
    color: #10083e!important;
    font-family: var(--font-body)!important;
    font-size: clamp(18px, 1.5vw, 22px)!important;
    font-weight: 700;
    line-height: 1.3;
    text-transform: none;
}

.day-visit-stop p {
    margin: 0;
    font-size: clamp(16px, 1.3vw, 20px);
    line-height: 1.5;
}

.day-visit-stop--shows { grid-area: 1 / 43 / auto / span 29; }
.day-visit-stop--films { grid-area: 2 / 72 / auto / span 29; }
.day-visit-stop--exhibition {
    grid-area: 2 / 24 / auto / span 38;
    margin-top: 11vw;
    /* Reserve the next arrow's 3vw overhang plus clear space below the copy. */
    padding-bottom: calc(3vw + 32px);
}
.day-visit-stop--vego { grid-area: 3 / 63 / auto / span 29; }
.day-visit-stop--activities {
    grid-area: 3 / 24 / auto / span 28;
    margin-top: 8vw;
}
.day-visit-stop--shops {
    grid-area: 4 / 53 / auto / span 29;
    margin-top: 2vw;
}
.day-visit-stop--shows img { aspect-ratio: 1.15; }
.day-visit-stop--films img,
.day-visit-stop--activities img { aspect-ratio: 1.04; }
.day-visit-stop--exhibition img { aspect-ratio: 1.6; }

/* Decorative arrows follow the cards as the grid grows with the text. */
.day-visit-arrow {
    position: absolute;
    display: block;
    pointer-events: none;
    background: center / contain no-repeat;
    transform-origin: center top;
}

.day-visit-stop--activities > .day-visit-arrow { display: none; }

@media (prefers-reduced-motion: no-preference) {
    .day-visit-arrow.has-entered {
        animation: day-visit-arrow-bounce 2400ms ease-in-out infinite;
        animation-play-state: paused;
    }

    .day-visit-arrow.has-entered.is-in-view { animation-play-state: running; }

    @keyframes day-visit-arrow-bounce {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(10px); }
    }
}

.day-visit-stop--shows > .day-visit-arrow--after {
    top: 30%;
    left: 118%;
    width: 37%;
    aspect-ratio: 137 / 97;
    background-image: url('../img/day-visit/arrow-svg-1.svg');
}

.day-visit-stop--exhibition > .day-visit-arrow--before {
    bottom: calc(100% + 2vw);
    left: 4%;
    width: 40%;
    aspect-ratio: 200 / 247;
    background-image: url('../img/day-visit/arrow-svg-2.svg');
}

.day-visit-stop--vego > .day-visit-arrow--before {
    top: -3vw;
    right: calc(100% + .5vw);
    width: 20%;
    aspect-ratio: 78 / 112;
    background-image: url('../img/day-visit/arrow-svg-4.svg');
}

.day-visit-stop--vego > .day-visit-arrow--after {
    top: calc(100% - 1vw);
    left: 98%;
    width: 22%;
    aspect-ratio: 80 / 149;
    background-image: url('../img/day-visit/arrow-svg-5.svg');
}

.day-visit-stop--shops > .day-visit-arrow--before {
    top: 5%;
    left: -54%;
    width: 32%;
    aspect-ratio: 119 / 121;
    background-image: url('../img/day-visit/arrow-svg-3.svg');
}

/************************ACCESS AND DIRECTIONS************************/
.access-section {
    padding: 36px 4.6% 90px;
    color: #10083e;
    scroll-margin-top: 88px;
}

.access-section h2 {
    margin: 0 0 34px;
    color: #10083e!important;
    font-size: clamp(28px, 2.9vw, 44px)!important;
    font-weight: 500;
    line-height: 1.2;
    text-transform: none;
}

.access-layout {
    display: grid;
    grid-template-columns: minmax(0, 2.7fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 64px);
    align-items: stretch;
}

.access-map-panel {
    position: relative;
    min-width: 0;
    min-height: 440px;
    border-radius: 20px;
    overflow: hidden;
}

.access-map-panel #map {
    display: block;
    height: 100%;
    min-height: 440px;
    padding: 0;
    border: 0;
    background-position: 50% center;
    border-radius: 0;
    box-shadow: none;
    cursor: zoom-in;
}

.access-map-panel #map:focus-visible {
    outline: 3px solid #10083e;
    outline-offset: -6px;
}

body.map-image-modal-open {
    overflow: hidden !important;
}

.map-image-modal .modal-dialog {
    width: calc(100% - 32px);
    max-width: 1800px;
    margin: 16px auto;
    min-height: calc(100% - 32px);
}

.map-image-modal .modal-content {
    position: relative;
    width: fit-content;
    margin-inline: auto;
    overflow: hidden;
    border-radius: 12px;
    background: transparent;
}

.map-image-modal .map-image-close {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 1;
    width: 44px;
    height: 44px;
    color: #fff;
    font-size: 32px !important;
    line-height: 1;
    text-shadow: 0 1px 4px rgba(0, 0, 0, .8);
}

.map-image-close:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.map-image-full {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: calc(100dvh - 32px);
    object-fit: contain;
}

html[lang="fr"] .access-map-panel #map {
    background-image: url(../img/map-planetarium-fr.jpg);
}

html[lang="en"] .access-map-panel #map {
    background-image: url(../img/map-planetarium-en.jpg);
}

.access-address-card {
    position: absolute;
    top: 6%;
    left: 3%;
    width: 39%;
    min-width: 260px;
    padding: clamp(24px, 2.7vw, 40px);
    border-radius: 12px;
    background: rgba(255, 255, 255, .86);
}
html[lang="en"] {
    .access-address-card {
        width: 34%;
    }
}

.access-section h3 {
    margin: 0 0 10px;
    color: #10083e!important;
    font-family: var(--font-body)!important;
    font-size: 22px!important;
    font-weight: 600;
    line-height: 1.3;
    text-transform: none;
}

.access-address-card h3 {
    margin-bottom: 4px;
    font-size: 20px!important;
    font-weight: 700;
}

.access-address-card address {
    color: #10083e;
    margin: 0 0 22px;
    padding: 0;
    font-size: 18px;
    font-style: normal;
    line-height: 1.5;
}

.access-section .access-directions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #10083e;
    text-decoration: none;
}

.access-section .access-directions:hover { background: #bec2ff; }
.access-section .access-directions:focus-visible {
    outline: 2px solid #10083e;
    outline-offset: 4px;
}
.access-directions svg { width: 18px; height: 18px; flex: none; }

.access-option { padding: 22px 0; }
.access-option:first-child { padding-top: 0; }
.access-option:last-child { padding-bottom: 0; }
.access-option + .access-option { border-top: 1px solid #b0bbdb; }
.access-icon { display: block; width: 34px; height: 34px; margin-bottom: 12px; }
img.access-icon { object-fit: contain; object-position: left center; }
.access-option p { margin: 0; font-size: 16px; line-height: 1.5; }

/* Full-width photograph, with the gradient visible through the curved mask. */
.planetarium-exterior {
    width: 100%;
    aspect-ratio: 1512 / 856;
    margin: 0;
}

.planetarium-exterior img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 70%;
    -webkit-mask-image: url('../img/planetarium-external-mask.svg');
    mask-image: url('../img/planetarium-external-mask.svg');
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.cursor-none {
	cursor: auto!important;
}

.flashit {
    -webkit-animation: flash linear 2s infinite;
    animation: flash linear 2s infinite;
}

.video-englobe {
	text-align: center;
}

.buy-tickets {
    background-color: rgba(50,51,63,0.78);
    -webkit-border-bottom-right-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-bottomright: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.buy-tickets p {
    color: #ff5242;
    margin-bottom: 20px;
}

.video {
    position: relative;
    padding-bottom: 56.25%;
    overflow: hidden;
	/*-webkit-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-moz-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	-ms-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);*/
    background-color: #262730;
    margin: 0 auto;
}
.video iframe, #videos object, #videos embed, .youtube-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: .5rem;
}
.img-popup {
    background-color: #262730;
    padding: .5rem;
}
.hidden_desktop {
	display:none!important;
}
/*LOADING*/
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999999999999;
    background: #13171a;
}
#sun {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 55px;
    width: 55px;
    margin-top: -25px;
    margin-left: -25px;
    border-radius: 50%;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#7e48d4+0,512f8c+100 */
    background: #7e48d4; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #7e48d4 0%, #512f8c 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #7e48d4 0%,#512f8c 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #7e48d4 0%,#512f8c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7e48d4', endColorstr='#512f8c',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    animation: spin-right 5s linear infinite;
}
@keyframes spin-right {
    100% { transform: rotate(-360deg);
        -webkit-transform: rotate(-360deg);
        -moz-transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -o-transform: rotate(-360deg);
    }
}

#earth {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff5242+0,b2392e+100 */
    background: #ff5242; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #ff5242 0%, #b2392e 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #ff5242 0%,#b2392e 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #ff5242 0%,#b2392e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5242', endColorstr='#b2392e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-top: -20px;
    margin-left: -20px;
}

/*LOADING END*/

.modal-content {
	border: none !important;
    background: rgb(50,51,63);
	background: linear-gradient(90deg, rgba(50,51,63,1) 0%, rgba(19,23,26,1) 100%);
}

.modal-body {
    color: #B9BAB5;
}

.modal-footer {
    border-top: 1px solid #262730!important;
    padding: 7px 15px!important;
}

.modal-header {
    border-bottom: 1px solid #262730!important;
    padding: 7px 15px!important;
    justify-content: flex-end!important;
}

.close:focus, .close:hover {
	filter: alpha(opacity=40)!important;
    opacity: .4!important;
    color: white!important;
}

.close {
    filter: alpha(opacity=70)!important;
    opacity: .7!important;
	color: white!important;
}

.btn-default {
    color: white!important;
    background-color: #262730!important;
    border-color: #B9BAB5!important;
}

.modal-open {
    padding-right: 0px!important;
}

.modal-fullscreen {
    width: 92%!important;
    height: auto!important;
    margin: 4%!important;
}

.modal-body img.principal {
    background-color: #262730;
    padding: 5px;
}
.modal-body img.modal-logo {
	height: 50px;
    width: auto!important;
    margin: 0 0 5% 0;
	-webkit-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0)!important;
	-moz-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0)!important;
	-ms-box-shadow: 0px 0px 18px 4px rgba(0,0,0,0)!important;
}

.modal-body span {
    display: block;
    margin-top: 4%;
    text-align: center;
}

.modal-body h5 {
    margin-top: 25px;
}

.modal-body h5.first {
    margin-top: 0!important;
}

.small {
    font-size: 87%!important;
}

small.date {
    display: block;
    margin-bottom: 4%;
}

small.date span.details {
    float: none;
    display: inline;
    color: #b1dc62;
}

small.date em {
    color: #F04E3E;
    font-style: normal;
}

.orange {
    color: #F04E3E;
}

.purple-box {
    margin: 5% auto;
    padding: 20px;
    border: 5px solid rgba(50,51,63, 0.74);
    background: rgba(50,51,63, 0.74);
    text-align: center;
    width: 50%;
    -moz-border-radius: 11px;
    -webkit-border-radius: 11px;
    border-radius: 11px;
    -ms-border-radius: 11px;
    -o-border-radius: 11px;
    box-shadow: inset 0 0 20px 0 rgba(0,0,0,0.29);
}

.purple-box p {
    margin: 20px 20px 0 20px;
    color: white;
}

.purple-box h6 img {
    margin: 0 12px;
}

/* Calendar event modals */
body.event-modal-open {
    overflow: hidden !important;
}

.event-modal .event-modal-dialog {

}

.event-modal .modal-content {
    border: 0 !important;
    border-radius: 0;
    background: #e5eaf0 !important;
}

.event-modal .event-modal-header {
    min-height: 58px;
    padding: 18px 14px 4px;
    border: 0 !important;
}

.event-modal .event-modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #10053d;
    color: #fff;
    line-height: 1;
}

.event-modal .event-modal-close svg {
    display: block;
    flex: none;
    width: 14px;
    height: 14px;
}

.event-modal .event-modal-close:hover,
.event-modal .event-modal-close:focus {
    background: #10053d;
    color: #fff;
    opacity: .8;
}

.event-modal .event-modal-body {
    padding: 0 10rem 64px !important;
    padding-top: 2rem !important;
    color: #10053d;
}

.event-modal .event-modal-section + .event-modal-section {
    margin-top: 76px;
}

.event-modal .event-modal-section-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.event-modal .event-modal-heading-copy {
    min-width: 0;
    flex: 1 1 420px;
    overflow-wrap: anywhere;
}

.event-modal .event-modal-badge {
    display: inline-block;
    margin: 0 0 12px;
    padding: 5px 10px;
    border-radius: 4px;
    background: #302c89;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.event-modal .event-modal-title {
    margin: 0;
    color: #10053d !important;
    font-size: clamp(1.65rem, 2.5vw, 2rem) !important;
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
    text-transform: none;
}

.event-modal .event-modal-ticket {
    font-size: 16px !important;
    flex: 0 0 auto;
    max-width: 100%;
    white-space: normal;
    margin-bottom: 1px;
    padding: 9px 18px;
    border-radius: 999px;
    background: #a9b7ff;
    color: #10053d !important;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
}

.event-modal .event-modal-ticket:hover,
.event-modal .event-modal-ticket:focus {
    background: #8fa1fa;
    color: #10053d !important;
    text-decoration: none;
}

.event-modal .event-modal-divider {
    height: 1px;
    margin-top: 29px;
    background: #bbc3cf;
}

.event-modal .event-modal-section-content {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 64px;
    padding-top: 72px;
}

.event-modal .event-modal-copy {
    min-width: 0;
    color: #10053d;
    font-size: 18px;
    line-height: 1.55;
}

.event-modal .event-modal-copy p {
    margin: 0 0 20px;
    color: #10053d;
}

.event-modal .event-modal-description > p {
    font-size: 18px;
}

.event-modal .event-modal-description > p:first-of-type {
    font-size: 21px;
    font-weight: 600;
    line-height: 1.48;
}

.event-modal .event-modal-copy .event-modal-warning {
    margin-top: 64px;
    font-size: 13px;
    line-height: 1.45;
}

.event-modal .event-modal-availability {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    margin-bottom: 14px !important;
    color: #10053d !important;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    text-transform: uppercase;
}

.event-modal .event-modal-availability span {
    display: inline;
    margin: 0;
    color: inherit;
    text-align: left;
}

.event-modal .event-modal-copy ul {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 0;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
}

.event-modal .event-modal-copy li {
    min-width: 140px;
    max-width: 250px;
    margin: 0;
    padding: 0 12px;
    border-left: 1px solid #10053d;
    color: #10053d;
    font-size: 13px;
    line-height: 1.42;
}

.event-modal .event-modal-copy li::before {
    display: none;
}

.event-modal .event-modal-copy li i {
    display: none;
}

.event-modal .event-modal-programme-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 16px 0;
    margin: 28px 0 0;
}

.event-modal .event-modal-detail {
    min-width: 0;
    overflow-wrap: anywhere;
    padding: 0 12px;
    border-left: 1px solid #10053d;
}

.event-modal .event-modal-detail dt {
    margin: 0 0 3px;
    color: #10053d;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}

.event-modal .event-modal-detail dd {
    margin: 0;
    color: #10053d;
    font-size: 13px;
    line-height: 1.42;
}

.event-modal .event-modal-media {
    width: 100%;
    overflow: hidden;
    background: transparent;
}

.event-modal .event-modal-media img,
.event-modal .event-modal-media iframe {
    display: block;
    width: 100%;
    height: auto;
    padding: 0;
    border: 0;
}

.event-modal .event-modal-video {
    position: relative;
    aspect-ratio: 16 / 9;
}

.event-modal .event-modal-video iframe {
    position: absolute;
    inset: 0;
    height: 100%;
}

.event-modal .event-modal-placeholder-image {
    display: block;
    width: 100%;
    height: auto;
    margin-top: 24px;
    border-radius: 12px;
}

.event-modal .event-modal-media-caption {
    margin: 12px 0 0;
    color: #10053d;
    font-size: 13px;
}

.event-modal .event-modal-footer {
    justify-content: flex-end;
    padding: 0 10rem 28px !important;
    border: 0 !important;
}

.event-modal .event-modal-close-text {
    padding: 0;
    border: 0;
    background: transparent;
    color: #10053d;
    font-family: var(--font-body);
    font-size: 14px !important;
    font-weight: 700;
    text-decoration: underline;
}

/* Visit date selection modal */
.visit-date-modal .visit-date-modal-dialog {
    width: min(816px, calc(100% - 32px));
    max-width: none;
    margin: 1rem auto;
}

.visit-date-modal .modal-content {
    position: relative;
    min-height: 568px;
    overflow: hidden;
    border: 2px solid #a9b7ff !important;
    border-radius: 14px;
    background: #0a1828;
}

.visit-date-modal-image {
    position: absolute;
    inset: 0 0 0 auto;
    width: 26%;
    background: url('../img/backgrounds/interception-modal-bg.png') center / cover no-repeat;
}

.visit-date-modal-body {
    position: relative;
    z-index: 1;
    width: 91%;
    min-height: 564px;
    margin: 0;
    padding: 80px 80px 76px !important;
    border: 0;
    /* Fit the entire decorative shape as the panel's proportions change. */
    background: url('../img/backgrounds/interception-bg.svg') top left / 100% 100% no-repeat;
    color: #fff;
}

.visit-date-modal-body h2 {
    max-width: 455px;
    margin: 0 0 46px;
    color: #fff !important;
    font-family: var(--font-body);
    font-size: clamp(1.7rem, 3vw, 2rem) !important;
    font-weight: 700;
    line-height: 1.17;
    text-align: left;
    text-transform: none;
}

.visit-date-modal-choices {
    width: min(100%, 317px);
    border-top: 1px solid rgba(255, 255, 255, .16);
}

.visit-date-modal-choice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 73px;
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .16);
    background: transparent;
    color: #fff;
    font-family: var(--font-body);
    font-size: 24px;
    font-weight: 300;
    line-height: 1.2;
    text-align: left;
    text-decoration: none;
}

.visit-date-modal-choice span {
    transition: all 0.3s ease;
    margin-top: 0px;
    color: #fff;
}

.visit-date-modal-choice strong {
    font-weight: 700;
}

.visit-date-modal-choice:hover,
.visit-date-modal-choice:focus {
    color: #fff;
    text-decoration: none;
}

.visit-date-modal-choice:focus-visible {
    outline: 2px solid #a9b7ff;
    outline-offset: 4px;
}

.visit-date-modal-arrow {
    display: block;
    flex: 0 0 auto;
    width: 29px;
    height: 29px;
    margin-left: 16px;
    transform: rotate(90deg);
}

.visit-date-modal-explanation {
    max-width: 455px;
    margin-top: 61px;
    color: #fff;
    font-family: var(--font-body);
}

.visit-date-modal-explanation h3 {
    margin: 0 0 4px;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    text-transform: none;
}

.visit-date-modal-explanation p {
    margin: 0;
    color: #fff;
    font-size: 16px;
    line-height: 1.45;
}

@media only screen and (max-width : 575px) {
    .visit-date-modal .visit-date-modal-dialog {
        width: calc(100% - 24px);
    }

    .visit-date-modal .modal-content {
        min-height: 0;
    }

    .visit-date-modal-image {
        width: 38%;
        opacity: .45;
    }

    .visit-date-modal-body {
        min-height: 0;
        padding: 48px 32px !important;
        border-bottom-right-radius: 120px 100px;
    }

    .visit-date-modal-body h2 {
        margin-bottom: 32px;
        font-size: 1.7rem !important;
    }

    .visit-date-modal-choice {
        min-height: 64px;
        font-size: 17px;
    }

    .visit-date-modal-explanation {
        margin-top: 48px;
        max-width: 290px;
    }
}

/*BUTTONS*/
.btn {
	font-family: var(--font-body)!important;
    cursor: pointer;
    padding: 0.425rem 1rem 0.425rem 2.77rem!important;
	color: #32333f!important;
	position: relative;
}

.btn img {
    position: absolute;
    top: 50%;
	left: 7%;
    width: 20px;
    transform: translateY(-50%);
}

.btn-buy-tickets {
	background-color: #b1dc62!important;
}

.btn-buy-tickets:hover {
	box-shadow: 0 0.5rem 1rem rgba(var(--bs-body-color-rgb),.22)!important;
}

.btn-close {
	color: #b1dc62!important;
}

/******************SLIDER******************/
#slider-eplv h2 {
	margin: 0!important;
	font-size: 2.5vw!important;
}

#slider-eplv p {
	font-size: 1.3vw!important;
	font-weight: 300;
	margin: 0;
}

.carousel-item {
	cursor: pointer;
}

.carousel-indicators {
    bottom: -65px!important;
}

.carousel-indicators li {
	width: 14px!important;
	height: 14px!important;
	border-radius: 50%;
	background: rgba(191, 195, 199, 1)!important;
	margin: 10px!important;
	padding: 2px!important;
	box-shadow:
	0 1px 1px rgba(50,51,63, 0),
	inset 0 1px 1px rgba(50,51,63, 0),
	0 0 0 2px rgba(50,51,63, 0);
	-webkit-transition: all 0.3s!important;
	-moz-transition: all 0.3s!important;
	-ms-transition: all 0.3s!important;
	-o-transition: all 0.3s!important;
	transition: all 0.3s!important;
	border: none!important;
}

.carousel-indicators li:hover {
	box-shadow:
		0 1px 1px rgba(50,51,63, 0.4),
		inset 0 1px 1px rgba(50,51,63, 0.1),
		0 0 0 2px rgba(50,51,63, 0.5);
}

.carousel-indicators .active {
	background: rgba(50, 51, 63, 1);
}

.carousel-caption {
	position: absolute;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	z-index: 10;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #fff;
	text-align: center;
	background-color: rgba(50,51,63, 0.75);
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 30px!important;
    height: 30px!important;
}

.carousel-control-next, .carousel-control-prev {
    top: 60%!important;
	z-index:3;
}

@keyframes grow {
    0% {
        transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
}
    100% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
        -moz-transform: scale(1.0);
        -ms-transform: scale(1.0);
        -o-transform: scale(1.0);
}
}

#slider-eplv .bg-img {
    width: 100%;
    height: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    background-position: center center;
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);

    animation: grow 5s ease-in-out alternate;
    -webkit-animation: grow 5s ease-in-out alternate;
}

.slider-caption {
	position: absolute;
	right: 0;
	top: 80% !important;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	left: 0;
	z-index: 10;
	color: #fff;
	text-align: center;
	background: rgb(38,39,48);
	background: linear-gradient(90deg, rgba(38,39,48,0) 3%, rgba(38,39,48,0.78) 30%, rgba(38,39,48,0.78) 70%, rgba(38,39,48,0) 97%);
}

.curved {
	position: absolute;
	bottom: -2px;
	width: 100%;
	right: 0;
	z-index: 2;
}

/* Content elements */
#slider-eplv .bg-img-1 {
	background-image: url(../img/slider/1.jpg);
}
#slider-eplv .bg-img-2 {
	background-image: url(../img/slider/2.jpg);
}
#slider-eplv .bg-img-3 {
	background-image: url(../img/slider/3.jpg);
}
#slider-eplv .bg-img-4 {
	background-image: url(../img/slider/4.jpg);
}
#slider-eplv .bg-img-5 {
	background-image: url(../img/slider/5.jpg);
}
#slider-eplv .bg-img-6 {
	background-image: url(../img/slider/6.jpg);
}
#slider-eplv .bg-img-7 {
	background-image: url(../img/slider/7.jpg);
}
#slider-eplv .bg-img-8 {
	background-image: url(../img/slider/8.jpg);
}
#slider-eplv .bg-img-9 {
	background-image: url(../img/slider/9.jpg);
}
#slider-eplv .bg-img-10 {
	background-image: url(../img/slider/10.jpg);
}
#slider-eplv .bg-img-11 {
	background-image: url(../img/slider/11.jpg);
}
#slider-eplv .bg-img-12 {
	background-image: url(../img/slider/12.jpg);
}
#slider-eplv .bg-img-13 {
	background-image: url(../img/slider/13.jpg);
}
#slider-eplv .bg-img-15 {
	background-image: url(../img/slider/15.jpg);
}
#slider-eplv .bg-img-16 {
	background-image: url(../img/slider/16.jpg);
}
#slider-eplv .bg-img-17 {
	background-image: url(../img/slider/17.jpg);
}
#slider-eplv .bg-img-18 {
	background-image: url(../img/slider/18.jpg);
}
#slider-eplv .bg-img-19 {
	background-image: url(../img/slider/19.jpg);
}
#slider-eplv .bg-img-20 {
	background-image: url(../img/slider/20.jpg);
}
#slider-eplv .bg-img-21 {
	background-image: url(../img/slider/21.jpg);
}
#slider-eplv .bg-img-22 {
	background-image: url(../img/slider/22.jpg);
}
#slider-eplv .bg-img-23 {
	background-image: url(../img/slider/23.jpg);
}
#slider-eplv .bg-img-24 {
	background-image: url(../img/slider/24.jpg);
}
#slider-eplv .bg-img-25 {
	background-image: url(../img/slider/25.jpg);
}
#slider-eplv .bg-img-26 {
	background-image: url(../img/slider/26.jpg);
}
#slider-eplv .bg-img-27 {
	background-image: url(../img/slider/27.jpg);
}
#slider-eplv .bg-img-28 {
	background-image: url(../img/slider/28.jpg);
}
#slider-eplv .bg-img-29 {
	background-image: url(../img/slider/29.jpg);
}
#slider-eplv .bg-img-30 {
	background-image: url(../img/slider/30.jpg);
}
#slider-eplv .bg-img-31 {
	background-image: url(../img/slider/31.jpg);
}
#slider-eplv .bg-img-32 {
	background-image: url(../img/slider/32.jpg);
}
#slider-eplv .bg-img-33 {
	background-image: url(../img/slider/33.jpg);
}
#slider-eplv .bg-img-34 {
	background-image: url(../img/slider/34.jpg);
}
#slider-eplv .bg-img-35 {
	background-image: url(../img/slider/35.jpg);
}
#slider-eplv .bg-img-HC {
	background-image: url(../img/slider/bg-hot-chocolate.jpg);
}
#slider-eplv .bg-img-halloween {
	background-image: url(../img/slider/bg-halloween.jpg);
}
#slider-eplv .bg-soiree-internationale-lune {
	background-image: url(../img/slider/bg-soiree-internationale-lune.jpg);
}

#slider-eplv h2 {
	-webkit-animation: moveUp 1s ease-in-out both;
	-moz-animation: moveUp 1s ease-in-out both;
	-o-animation: moveUp 1s ease-in-out both;
	-ms-animation: moveUp 1s ease-in-out both;
	animation: moveUp 1s ease-in-out both;
}

#slider-eplv p {
	-webkit-animation: fadeIn 0.5s linear 0.5s both;
	-moz-animation: fadeIn 0.5s linear 0.5s both;
	-o-animation: fadeIn 0.5s linear 0.5s both;
	-ms-animation: fadeIn 0.5s linear 0.5s both;
	animation: fadeIn 0.5s linear 0.5s both;
}

@-webkit-keyframes moveUp {
	0% {
		-webkit-transform: translateY(40px);
	}

	100% {
		-webkit-transform: translateY(0px);
	}
}

@-moz-keyframes moveUp {
	0% {
		-moz-transform: translateY(40px);
	}

	100% {
		-moz-transform: translateY(0px);
	}
}

@-o-keyframes moveUp {
	0% {
		-o-transform: translateY(40px);
	}

	100% {
		-o-transform: translateY(0px);
	}
}

@-ms-keyframes moveUp {
	0% {
		-ms-transform: translateY(40px);
	}

	100% {
		-ms-transform: translateY(0px);
	}
}

@keyframes moveUp {
	0% {
		transform: translateY(40px);
	}

	100% {
		transform: translateY(0px);
	}
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-moz-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-o-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-ms-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

/* ======== Cookie Yes ======== */

.cky-banner-element {
    position: absolute;
    right: 0;
    color: #fff;
    background-color: rgba(0,0,0,0);
    padding-left: 0px;
    padding-right: 0px;
    border-width: initial;
    border-style: none;
    display: inline-flex;
    align-items: center;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    font-size: .8rem;
}

/************************BACK TO TOP************************/
.back-to-top {
    position: fixed;
    right: max(16px, 1%, env(safe-area-inset-right));
    bottom: calc(max(24px, env(safe-area-inset-bottom)) + var(--back-to-top-footer-offset, 0px));
    z-index: 1020;
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: #a0affa;
    color: #1d1e57;
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity 250ms ease, transform 250ms ease, visibility 0s 250ms;
}

.back-to-top[hidden] { display: none; }

.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition-delay: 0s;
}

.back-to-top img {
    display: block;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
}

.back-to-top-label {
    display: block;
    max-width: 0;
    padding-left: 0;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
    transition: max-width 350ms ease, padding-left 350ms ease, opacity 250ms ease;
}

@media (hover: hover) {
    .back-to-top:hover .back-to-top-label {
        max-width: 200px;
        padding-left: 24px;
        opacity: 1;
    }
}

.back-to-top:focus-visible .back-to-top-label {
    max-width: 200px;
    padding-left: 24px;
    opacity: 1;
}

.back-to-top:focus-visible {
    outline: 2px solid #1d1e57;
    outline-offset: 4px;
}

body.modal-open .back-to-top,
body.event-modal-open .back-to-top {
    visibility: hidden;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .back-to-top,
    .back-to-top-label {
        transition: none;
        transform: none;
    }
}

/************************SHARED TICKET DIALOG************************/
body.ticket-modal-open { overflow: hidden !important; }
body.ticket-modal-open .back-to-top { visibility: hidden; pointer-events: none; }

.ticket-purchase-modal {
    box-sizing: border-box;
    width: min(840px, calc(100vw - 32px));
    max-width: none;
    max-height: calc(100dvh - 48px);
    margin: auto;
    padding: 56px 40px 46px;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0;
    border-radius: 18px;
    background: #fff;
    color: #10083e;
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.4;
}

.ticket-purchase-modal::backdrop { background: rgba(8, 12, 21, .72); }
.ticket-purchase-modal:not([open]) { display: none; }
.ticket-purchase-modal h2 {
    margin: 0 0 20px;
    color: #10083e !important;
    font-family: 'Gotham Rounded', sans-serif !important;
    font-size: 32px !important;
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    text-transform: none;
}

.ticket-purchase-close {
    position: absolute;
    top: 24px;
    right: 20px;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid currentColor;
    border-radius: 50%;
    background: #fff;
    color: #10083e;
}

.ticket-fares {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 30px 20px;
    border-radius: 9px;
    background: #201e56;
    color: #fff;
}

.ticket-fare-group { padding: 0 22px; text-align: center; }
.ticket-fare-group + .ticket-fare-group { border-left: 1px dotted #a4a9ff; }
.ticket-purchase-modal .ticket-fare-group h3 {
    margin: 0 0 28px;
    color: #fff !important;
    font-family: var(--font-body) !important;
    font-size: 22px !important;
    font-weight: 500;
    line-height: 1.25;
    text-transform: none;
}
.ticket-fare-buttons { display: flex; justify-content: center; gap: 18px; }
.ticket-purchase-modal a { color: #10083e; }
.ticket-purchase-modal a.ticket-purchase-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 22px;
    border-radius: 999px;
    background: #a4a9ff;
    color: #10083e;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}
.ticket-purchase-modal .ticket-fare-buttons a.ticket-purchase-pill {
    font-size: 18px;
}
.ticket-purchase-modal a.ticket-purchase-pill:hover { background: #bec2ff; }
.ticket-purchase-modal a:focus-visible,
.ticket-purchase-close:focus-visible { outline: 2px solid #5047be; outline-offset: 4px; }
.ticket-fare-notes { margin-top: 14px; font-size: 13px; }
.ticket-fare-notes p { margin: 0 0 10px; }
.ticket-purchase-modal .ticket-fare-notes a,
.ticket-purchase-modal .ticket-passport-holder a { color: #10083e; font-weight: 700; text-decoration: underline; }
.ticket-passport { margin-top: 58px; }
.ticket-purchase-modal .ticket-passport h2 { margin-bottom: 14px; }
.ticket-passport-intro { margin: 0 0 18px; text-align: center; }
.ticket-passport-layout { display: grid; grid-template-columns: 44% minmax(0, 1fr); align-items: center; gap: 30px; }
.ticket-passport-card {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    min-height: 186px;
    padding: 28px 18px 22px;
    border-radius: 9px;
    background: #302d87 url('../img/1passeport-5musees.png') center / cover;
    color: #fff;
}
.ticket-passport-card .ticket-purchase-pill { max-width: 100%; white-space: normal; }
.ticket-passport-card p { margin: 0; font-size: 22px; line-height: 1.2; }
.ticket-passport-card strong { display: block; font-family: var(--font-body); font-size: 32px; line-height: 1.1; }
.ticket-passport-museums {
    font-family: 'Sloke', Georgia, serif;
    font-weight: 400;
    position: relative;
    top: 2px;
}
.ticket-purchase-modal .ticket-passport-holder h3 {
    margin: 0 0 12px;
    color: #10083e !important;
    font-family: var(--font-body) !important;
    font-size: 18px !important;
    font-weight: 700;
    line-height: 1.3;
    text-transform: none;
}
.ticket-passport-holder p { margin: 0; }

@media (max-width: 780px) {
    .ticket-purchase-modal { padding: 54px 24px 30px; max-height: calc(100dvh - 24px); }
    .ticket-purchase-modal h2 { font-size: 26px !important; }
    .ticket-purchase-close { top: 16px; right: 16px; }
    .ticket-fares { grid-template-columns: minmax(0, 1fr); padding: 24px 16px; gap: 24px; }
    .ticket-fare-group { padding: 0; }
    .ticket-fare-group + .ticket-fare-group { border-left: 0; border-top: 1px dotted #a4a9ff; padding-top: 24px; }
    .ticket-purchase-modal .ticket-fare-group h3 { margin-bottom: 18px; font-size: 20px !important; }
    .ticket-fare-buttons { gap: 12px; flex-wrap: wrap; }
    .ticket-purchase-modal a.ticket-purchase-pill { padding-inline: 18px; }
    .ticket-passport { margin-top: 36px; }
    .ticket-passport-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
    .ticket-passport-intro { font-size: 15px; }
}

@media (prefers-reduced-motion: no-preference) {
    .ticket-purchase-modal[open] { animation: ticket-dialog-in 220ms ease-out; }
    @keyframes ticket-dialog-in {
        from { opacity: 0; transform: translateY(12px); }
        to { opacity: 1; transform: translateY(0); }
    }
}