/* ========================================
   CSS Reset / Normalize
   ======================================== */
   article,
   aside,
   details,
   figcaption,
   figure,
   footer,
   header,
   hgroup,
   main,
   nav,
   section,
   summary {
	   display: block;
   }
   
   audio,
   canvas,
   video {
	   display: inline-block;
   }
   
   audio:not([controls]) {
	   display: none;
	   height: 0;
   }
   
   [hidden] {
	   display: none;
   }
   
   html {
	   font-family: sans-serif;
	   -ms-text-size-adjust: 100%;
	   -webkit-text-size-adjust: 100%;
   }
   
   body {
	   margin: 0;
   }
   
   a:focus {
	   outline: thin dotted;
   }
   
   a:active,
   a:hover {
	   outline: 0;
   }
   
   h1 {
	   font-size: 2em;
	   margin: 0.67em 0;
   }
   
   abbr[title] {
	   border-bottom: 1px dotted;
   }
   
   b,
   strong {
	   font-weight: bold;
   }
   
   dfn {
	   font-style: italic;
   }
   
   hr {
	   -moz-box-sizing: content-box;
	   box-sizing: content-box;
	   height: 0;
   }
   
   mark {
	   background: #ff0;
	   color: #000;
   }
   
   code,
   kbd,
   pre,
   samp {
	   font-family: monospace, serif;
	   font-size: 1em;
   }
   
   pre {
	   white-space: pre-wrap;
   }
   
   q {
	   quotes: "\201C""\201D""\2018""\2019";
   }
   
   small {
	   font-size: 80%;
   }
   
   sub,
   sup {
	   font-size: 75%;
	   line-height: 0;
	   position: relative;
	   vertical-align: baseline;
   }
   
   sup {
	   top: -0.5em;
   }
   
   sub {
	   bottom: -0.25em;
   }
   
   img {
	   border: 0;
   }
   
   svg:not(:root) {
	   overflow: hidden;
   }
   
   figure {
	   margin: 0;
   }
   
   fieldset {
	   border: 1px solid #c0c0c0;
	   margin: 0 2px;
	   padding: 0.35em 0.625em 0.75em;
   }
   
   legend {
	   border: 0;
	   padding: 0;
   }
   
   button,
   input,
   select,
   textarea {
	   font-family: inherit;
	   font-size: 100%;
	   margin: 0;
   }
   
   button,
   input {
	   line-height: normal;
   }
   
   button,
   select {
	   text-transform: none;
   }
   
   button,
   html input[type="button"],
   input[type="reset"],
   input[type="submit"] {
	   -webkit-appearance: button;
	   cursor: pointer;
   }
   
   button[disabled],
   html input[disabled] {
	   cursor: default;
   }
   
   input[type="checkbox"],
   input[type="radio"] {
	   box-sizing: border-box;
	   padding: 0;
   }
   
   input[type="search"] {
	   -webkit-appearance: textfield;
	   -moz-box-sizing: content-box;
	   -webkit-box-sizing: content-box;
	   box-sizing: content-box;
   }
   
   input[type="search"]::-webkit-search-cancel-button,
   input[type="search"]::-webkit-search-decoration {
	   -webkit-appearance: none;
   }
   
   button::-moz-focus-inner,
   input::-moz-focus-inner {
	   border: 0;
	   padding: 0;
   }
   
   textarea {
	   overflow: auto;
	   vertical-align: top;
   }
   
   table {
	   border-collapse: collapse;
	   border-spacing: 0;
   }
   ::-webkit-scrollbar {
      width: 6px;
      height: 2px;
    }
    ::-webkit-scrollbar-thumb {
      background: #888;
      border-radius: 10px;
    }
   /* ========================================
	  Box Sizing
	  ======================================== */
   *,
   *::after,
   *::before {
	   box-sizing: border-box;
   }
   
   /* ========================================
	  Base Styles
	  ======================================== */
   html {
	   background-color: #1E2026 !important;
	   background-image: linear-gradient(180deg, #1E2026, #15171B) !important;
	   scrollbar-gutter: stable;
   }
   
   html,
   body {
	   min-height: 100vh;
	   width: 100%;
	   color: #FFF;
	   font-family: var(--font-text);
   }
   
   body {
	   --font-title: 'Gemunu Libre', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	   --font-text: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	   --color-link: #fff;
	   --color-link-hover: #f20c40;
	   --color-bg-item1: #15171b;
	   --color-bg-item2: #f20c40;
	   --color-bg-item3: #0f1013;
	   --color-bg-item4: #15171b;
	   --color-bg-item5: #0f1013;
	   --color-item-alt: #555;
	   background: transparent !important;
	   -webkit-font-smoothing: antialiased;
	   -moz-osx-font-smoothing: grayscale;
   }
   
   /* ========================================
	  Links
	  ======================================== */
   a {
	   text-decoration: none;
	   color: var(--color-link);
	   outline: none;
	   transition: color 0.2s;
   }
   
   a:hover,
   a:focus {
	   color: var(--color-link-hover);
   }
   
   button:focus,
   a:focus {
	   outline: none;
   }
   
   /* ========================================
	  Utility Classes
	  ======================================== */
   .hidden {
	   position: absolute;
	   overflow: hidden;
	   width: 0;
	   height: 0;
	   pointer-events: none;
   }
   
   /* ========================================
	  Logo
	  ======================================== */
   #logo {
	   position: fixed;
	   top: 30px;
	   left: 30px;
	   z-index: 101;
   }
   .image-wrapper {
    position: relative;
    /* width: 50vw; */
}
.tags_hiddn_text {
    font-size: 2rem;
    padding: 10px;
    opacity: 0;
}
/* body.productionpagemain {
    overflow: unset !important;
} */
.image-wrapper img {
    height: auto;  
    display: block;  
}

.inst_hero__image_new.image-wrapper img {
    width: 100%;
    height: 684px; 
}

.image-wrapper:hover::after {
    background: red; 
}

.image-wrapper::after {
    content: "";
    position: absolute;
    inset: 0; 
    background: #ad1010;  
    mix-blend-mode: multiply;
    transition: background 1s ease;
}
.action--close svg {
    width: 32px;
    height: 32px;
}
.action--menu svg {
    width: 32px;
    height: 32px;
}
.action--close button {
    width: 50px;
    height: 50px;
}
.action--menu button {
    width: 50px;
    height: 50px;
}

   
   /* ========================================
	  Home Carousel
	  ======================================== */
   #home {
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100vh;
	   z-index: 100;
	   overflow: hidden;
   }
   
   .carousel {
	   display: flex;
	   height: 100%;
	   width: 100%;
	   transition: transform 0.5s ease;
   }
   
   .carousel-item {
	   flex: 0 0 100%;
	   height: 100%;
	   position: relative;
	   display: flex;
	   align-items: flex-end;
	   justify-content: flex-start;
	   padding: 2rem;
	   background-size: cover;
	   background-position: center;
	   user-select: none;
	   -webkit-user-select: none;
	   -moz-user-select: none;
	   -ms-user-select: none;
	   touch-action: pan-x;
   }
   
   .carousel-item img,
   .carousel-item picture {
	   user-select: none;
	   -webkit-user-select: none;
	   -moz-user-select: none;
	   -ms-user-select: none;
	   -webkit-touch-callout: none;
	   -webkit-user-drag: none;
	   -khtml-user-drag: none;
	   -moz-user-drag: none;
	   -o-user-drag: none;
   }
   
   .carousel-item[data-has-link="true"] {
	   cursor: pointer;
   }
   
   .carousel-caption-link {
	   cursor: pointer;
	   pointer-events: auto;
   }
   
   .carousel-caption {
	   position: relative;
	   bottom: 0px;
	   width: 100%;
	   margin: 0 0 -40px 0;
	   padding: 30px 30px 62px 30px;
	   font-family: var(--font-title);
	   font-size: 2rem;
	   text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
	   z-index: 2;
   }
   
   .carousel-caption a {
	   opacity: 0.8;
	   transition: opacity 0.3s ease;
   }
   
   .carousel-caption a:hover {
	   opacity: 100%;
	   color: white;
   }
   
   .carousel-dots {
	   position: absolute;
	   bottom: 30px;
	   left: 50%;
	   transform: translateX(-50%);
	   display: flex;
	   gap: 1.2rem;
	   z-index: 5;
   }
   
   .carousel-dots button {
	   width: 16px;
	   height: 16px;
	   border-radius: 0%;
	   background: transparent;
	   border: 2px solid white;
	   cursor: pointer;
   }
   
   .carousel-dots button.active {
	   background: white;
   }
   
   /* ========================================
	  Blur Box
	  ======================================== */
   .blur-box {
	   color: white;
	   text-align: center;
	   border-radius: 10px;
	   background: rgba(0, 0, 0, 0.4);
	   backdrop-filter: blur(8px);
	   -webkit-backdrop-filter: blur(8px);
	   border: 1px solid rgba(255, 255, 255, 0.1);
	   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
   }
   
   /* ========================================
	  Tags
	  ======================================== */
   .tags {
	   padding: 10px;
	   font-family: var(--font-title);
	   font-size: 1.6rem;
	   z-index: 2;
	   padding-top: 0px;
   }
   .tags.more {
    padding-bottom: 38px;
}
   .tags a {
	   display: inline-block;
	   opacity: 0.8;
	   transition: opacity 0.3s ease;
	   padding: 8px 12px;
	   margin: 10px 10px 0px 10px; 
	   font-weight: bold;
   }
   .taglist a {
    margin-bottom: 10px;
}
   
   .tags a:hover {
	   opacity: 100%;
	   color: white;
   }
   
   .tags a.this,
   .tags a.this:hover {
	   background-color: white;
	   color: #15171B;
	   opacity: 1;
	   box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.5);
	   border-radius: 1px;
   }
   
   /* ========================================
	  Page Loader
	  ======================================== */
   .js .loading::before {
	   content: '';
	   position: fixed;
	   z-index: 100000;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: var(--color-bg);
   }
   
   .js .loading::after {
	   content: '';
	   position: fixed;
	   z-index: 100000;
	   top: 50%;
	   left: 50%;
	   width: 60px;
	   height: 60px;
	   margin: -30px 0 0 -30px;
	   pointer-events: none;
	   border-radius: 50%;
	   opacity: 0.4;
	   background: var(--color-link-hover);
	   animation: loaderAnim 0.7s linear infinite alternate forwards;
   }
   
   @keyframes loaderAnim {
	   to {
		   opacity: 1;
		   transform: scale3d(0.5, 0.5, 1);
	   }
   }
   
   /* ========================================
	  Icons
	  ======================================== */
   .icon {
	   display: block;
	   width: 1.5em;
	   height: 1.5em;
	   margin: 0 auto;
	   fill: currentColor;
   }
   
   .icon--menu,
   .icon--close {
	   width: 2rem;
   }
   
   .label--leftcenter {
	   color: #666666A8;
	   font-size: 18px;
	   font-weight: 400;
   }
   
   /* ========================================
	  Main Layout
	  ======================================== */
   main {
	   position: relative;
	   width: 100%;
   }
   
   .content {
	   text-align: center;
	   position: relative;
	   z-index: 100;
   }
   
   /* ========================================
	  Action Buttons
	  ======================================== */
   .action {
	   background: none;
	   border: 0;
	   color: #fff;
	   cursor: pointer;
	   padding: 0;
   }
   
   .action--menu {
	   pointer-events: auto;
	   position: absolute;
	   top:13px;
	   right: 13px;
	   z-index: 1000;
	   padding: 20px;
   }
   
   .menu--open .action--menu {
	   pointer-events: none;
   }
   
   .action--close {
	   position: absolute;
	   top: 13px;
	   right: 13px;
	   z-index: 1000;
	   opacity: 0;
	   padding: 20px;
   }
   
   /* ========================================
	  Menu
	  ======================================== */
   .menu {
	   text-align: center;
	   font-family: var(--font-title);
	   width: 100%;
	   height: 100vh;
	   overflow: hidden;
	   position: fixed;
	   top: 0;
	   left: 0;
	   z-index: 200;
	   display: grid;
	   grid-template-columns: 100%;
	   grid-template-rows: repeat(3, 33.33%);
	   pointer-events: none;
   }
   
   .menu--open {
	   pointer-events: auto;
   }
   
   .menu__item {
	   width: 100%;
	   position: relative;
	   overflow: hidden;
   }
   
   .menu__item-inner {
	   overflow: hidden;
	   transform: translate3d(100%, 0, 0);
	   height: 100%;
	   width: 101%;
	   position: relative;
	   display: flex;
	   flex-direction: column;
	   justify-content: space-around;
   }
   
   /* Menu Item Backgrounds */
   .menu__item--1 .menu__item-inner {
	   background: rgba(0, 0, 0, 0.4);
	   backdrop-filter: blur(8px);
	   -webkit-backdrop-filter: blur(8px);
   }
   
   .menu__item--2 .menu__item-inner {
	   background: var(--color-bg-item2);
   }
   
   .menu__item--3 .menu__item-inner {
	   background: rgba(0, 0, 0, 0.8);
	   backdrop-filter: blur(8px);
	   -webkit-backdrop-filter: blur(8px);
   }
   
   .menu__item--4 .menu__item-inner {
	   background: rgba(0, 0, 0, 0.4);
	   backdrop-filter: blur(8px);
	   -webkit-backdrop-filter: blur(8px);
   }
   
   .menu__item--5 .menu__item-inner {
	   background: rgba(0, 0, 0, 0.8);
	   backdrop-filter: blur(8px);
	   -webkit-backdrop-filter: blur(8px);
   }
   
   /* ========================================
	  Labels
	  ======================================== */
   .label {
	   display: none;
   }
   
   /* ========================================
	  Main Menu
	  ======================================== */
   .mainmenu__item {
	   opacity: 0;
   }
   
   .mainmenu__item,
   .sidemenu__item {
	   position: relative;
	   overflow: hidden;
	   transition: color 0.1s;
	   margin: 0.5rem 0;
	   display: block;
   }
   
   .sidemenu__item-inner {
	   display: block;
	   transform: translate3d(0, 100%, 0);
   }
   
   /* ========================================
	  Menu Map (Reel Section)
	  ======================================== */
   .menu__item-map {
	   width: 100%;
	   height: 100%;
	   position: absolute;
	   top: 0;
	   left: 0;
	   background-repeat: no-repeat 50% 50%;
	   transition: transform 0.8s cubic-bezier(0.2, 1, 0.8, 1);
   }
   
   .menu__item-inner:hover .menu__item-map {
	   transform: scale3d(1.1, 1.1, 1);
   }
   
   .menu__item-hoverlink {
	   font-weight: bold;
	   font-size: x-large;
	   text-decoration: none;
	   position: relative;
	   z-index: 1000;
	   display: block;
   }
   
   .menu__item-hoverlink:hover {
	   color: var(--color-link);
   }
   
   /* ========================================
	  Media Query: Desktop (min-width: 53em)
	  ======================================== */
   @media screen and (min-width: 53em) {
	   body {
		   padding: 0;
	   }
   
	   .content {
		   position: relative;
		   display: flex;
		   flex-direction: column;
		   justify-content: center;
		   align-items: center;
		   margin: 0 auto;
		   text-align: left;
	   }
	   
	   .content-production-detail {
		   min-height: 100vh;
	   }
   
	   .menu {
			width: 100%;
			height: 100vh;
			overflow: hidden;
			position: fixed;
			top: 0;
			left: 0;
			grid-template-columns: 27% 30% 43%;
			grid-template-rows: 60% 40%;
			grid-template-areas: "item3 item2 item1"
				"item4 item5 item1";
		}
   
	   .menu__item {
		   height: 100%;
	   }
   
	   .menu__item--1 {
		   grid-area: item1;
	   }
   
	   .menu__item--2 {
		   grid-area: item2;
	   }
   
	   .menu__item--3 {
		   grid-area: item3;
	   }
   
	   .menu__item--4 {
		   grid-area: item4;
		   vertical-align: middle;
	   }
   
	   .menu__item--5 {
		   grid-area: item5;
	   }
   
	   .menu__item--4,
	   .menu__item--5 {
		   display: block;
	   }
   
	   .menu__item-inner {
		   align-items: center;
	   }
   
	   /* Labels (Desktop Only) */
	   .label {
		   display: block;
		   color: var(--color-item-alt);
		   position: absolute;
		   z-index: 1000;
		   font-size: 0.85rem;
		   font-weight: bold;
		   margin: 0;
		   white-space: nowrap;
	   }
   
	   .label--topleft {
		   top: 2rem;
		   left: 2rem;
	   }
   
	   .label--vert,
	   .label--vert-mirror {
		   -webkit-writing-mode: vertical-rl;
		   writing-mode: vertical-rl;
	   }
   
	   .label--vert-mirror {
		   transform: rotate(180deg);
	   }
   
	   .label--bottomright {
		   bottom: 2rem;
		   right: 2rem;
	   }
   
	   .label::before {
		   content: '------------- ';
		   -webkit-font-smoothing: antialiased;
		   -moz-osx-font-smoothing: grayscale;
		   letter-spacing: -1px;
		   margin: 0 0.75rem 0 0;
	   }
   
	   .label--vert::before,
	   .label--vert-mirror::before {
		   margin: 0.75rem 0;
	   }
   
	   /* Menu Layout (Desktop) */
	   .mainmenu,
	   .sidemenu {
		   width: 100%;
		   height: 100%;
		   display: flex;
		   flex-direction: column;
		   align-items: center;
		   justify-content: center;
	   }
   
	   .mainmenu {
		   counter-reset: menuitem;
	   }
   
	   .mainmenu__item {
		   font-size: 5vw;
		   overflow: visible;
		   margin: 0.5rem 0;
		   padding: 0 0.5rem;
		   position: relative;
		   transition: color 0.3s;
	   }
   
	   .mainmenu__item:hover {
		   color: var(--color-item-alt);
	   }
   
	   .mainmenu__item::before {
		   counter-increment: menuitem;
		   content: counters(menuitem, "", decimal-leading-zero);
		   position: absolute;
		   font-size: 0.85rem;
		   top: 25%;
		   left: -1.25rem;
		   color: #fff;
		   font-weight: 600;
	   }
   
	   .mainmenu__item::after {
		   content: '';
		   width: 100%;
		   top: 58%;
		   height: 6px;
		   background: var(--color-link-hover);
		   position: absolute;
		   left: 0;
		   opacity: 0;
		   transform: scale3d(0, 1, 1);
		   transition: transform 0.3s, opacity 0.3s;
		   transform-origin: 100% 50%;
	   }
   
	   .mainmenu__item:hover::after {
		   opacity: 1;
		   transform: scale3d(1, 1, 1);
	   }
   
	   .sidemenu__item {
		   text-transform: uppercase;
		   letter-spacing: 0.15rem;
		   font-size: 1.5rem;
	   }
   
	   .menu__item-hoverlink {
		   font-size: 2rem;
		   border-bottom: none;
		   opacity: 0;
		   transition: opacity 0.3s;
	   }
   
	   .menu__item-inner:hover .menu__item-hoverlink {
		   opacity: 1;
	   }
   }
   
   /* ========================================
	  Media Query: Mobile (max-width: 52.99em)
	  ======================================== */
   @media screen and (max-width: 52.99em) {
	   .menu {
		   display: flex;
		   flex-direction: column;
		   height: intrinsic;
		   min-height: 100vh;
		   overflow-y: auto;
		   position: fixed;
		   top: 0;
		   left: 0;
		   width: 100%;
	   }
   
	   .menu__item {
		   height: 100%;
		   font-size: 150%;
		   line-height: 120%;
	   }
   
	   .menu__item--1 {
		   height: 111%;
	   }
   
	   .menu__item--2 {
		   height: 111%;
	   }
   
	   .menu__item--3 {
		   display: none;
	   }
   
	   .menu__item--4 {
		   height: 66%;
	   }
   
	   .menu__item--5 {
		   height: 66%;
	   }
   }
   
   :root {
	   --header-height: 120px;
	   --max-container: 1400px;
	   --poster-max: 420px;
	   --info-inner-pad: 1rem;
	   --info-inner-max: 720px;
	   --gap: 1rem;
   }
   
   html,
   body {
	   overflow-x: hidden;
	   /* trava qualquer scroll horizontal global */
   }
   
   .hero {
	   position: relative;
	   min-height: 100%;
	   overflow: hidden;
	   padding-bottom: 20px;
   }
   
   .hero::before {
	   content: "";
	   position: absolute;
	   inset: 0;
	   background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.55) 60%, rgba(0, 0, 0, 0.7) 100%);
	   pointer-events: none;
	   z-index: 1;
   }
   
   .hero-inner {
	   position: relative;
	   z-index: 2;
	   /* max-width: var(--max-container); */
	   margin: 0 auto;
	   min-height: calc(100vh - var(--header-height));
	   display: flex;
	   flex-direction: column;
	   padding: 0 30px;
	   width: 91%;
   }
   
   /* GRID PRINCIPAL */
   
   .film-content {
	   display: grid;
	   grid-template-columns: minmax(220px, var(--poster-max)) 1fr;
	   gap: var(--gap);
	   flex: 1 1 auto;
	   width: 100%;
	   align-items: stretch;
	   /* para igualar alturas */
   }
   
   /* POSTER */
   .poster-wrap {
	   display: flex;
	   align-items: flex-start;
	   justify-content: center;
	   padding-top: var(--header-height);
   }
   
   .poster-card {
	   width: 100%;
	   height: 100%;
   
   }
   
   .poster-card img {
	   display: block;
	   width: 100%;
	   max-width: 420px;
	   height: 100%;
	   max-height: 666px;
	   border-radius: 10px;
	   box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
	   object-fit: cover;
   }
   
   /* CONTAINER DO INFO + TITULO */
   
   .info-container {
	   display: flex;
	   flex-direction: column;
	   gap: 0;
	   height: 100%;
	   /* ocupa mesma altura que o poster */
   }
   
   /* TÍTULO */
   .title-wrap {
	   height: var(--header-height);
	   display: flex;
	   align-items: center;
	   padding-left: var(--info-inner-pad);
	   color: #fff;
   }
   
   .movie-title {
	   font-family: var(--font-title);
	   font-size: clamp(20px, 3.2vw, 40px);
	   margin: 0;
	   letter-spacing: 0.4px;
   }
   
   /* INFO BOX */
   .info-box {
	   display: flex;
	   flex-direction: column;
	   padding: 1.6rem;
	   border-radius: 12px;
	   background: rgba(12, 12, 12, 0.45);
	   backdrop-filter: blur(10px);
	   -webkit-backdrop-filter: blur(10px);
	   border: 1px solid rgba(255, 255, 255, 0.08);
	   box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
	   color: #eaeaea;
	   align-items: stretch;
	   justify-content: flex-start;
	   flex: 1 1 auto;
	   /* ocupa altura restante */
   }
   
   .info-inner {
	   display: flex;
	   flex-direction: column;
	   gap: 0.5rem;
   }
   
   /* APLICAR max-width apenas em sinopse e colunas */
   
   .synopsis,
   .info-columns {
	   max-width: var(--info-inner-max);
   }
   
   .box-header {
	   width: 100%;
	   display: flex;
	   justify-content: space-between;
	   align-items: center;
	   margin-bottom: 0.6rem;
   }
   
   .tags-row {
	   display: flex;
	   gap: 0.5rem;
	   align-items: center
   }
   
   .tag {
	   background: rgba(255, 255, 255, 0.06);
	   padding: 0.25rem 0.5rem;
	   border-radius: 2px;
	   height: 30px;
	   font-family: var(--font-title);
	   font-weight: bold;
	   transition: background 0.3s ease;
   }
   
   .tag:hover {
	   background: rgba(255, 255, 255, 1);
	   color: #222;
	   cursor: pointer
   }
   
   
   .icons-row {
	   display: flex;
	   gap: 0.6rem;
   }
   
   .icons-row .icon-btn {
	   background: transparent;
	   border: none;
	   color: #eaeaea;
	   cursor: pointer;
   }
   
   
   .synopsis {
	   line-height: 1.45;
	   opacity: 0.95;
	   font-size: 0.95rem;
	   margin-bottom: 0.8rem;
   }
   
   .info-columns {
	   display: grid;
	   grid-template-columns: repeat(3, 1fr);
	   gap: 1rem;
	   line-height: 150%;
	   font-size: 1rem;
	   text-align: left;
   }
   
   .info-label {
	   font-family: var(--font-title);
	   font-size: 0.85rem;
	   font-weight: 600;
	   color: #fff;
	   margin-bottom: 0.4rem;
	   text-transform: lowercase;
	   letter-spacing: 0.3px;
	   opacity: 0.9;
   }
   	
   .info-columns>div p {
	   font-family: var(--font-title);
	   font-variant: normal;
	   font-size: 18px;
	   margin-top: 0;
	   font-weight: 600;
   }
   
   .info-columns>div b {
	   font-family: var(--font-title);
	   font-variant: bold;
	   font-size: 18px;
	   display: block
   }
   
   .info-columns>a {}
   
   
   .media-strip-wrapper {
	   overflow: hidden !important;
	   padding: 11px 0 10px 0;
	   margin-top: 0px;
   }
   
   .media-strip {
	   flex: 0 0;
	   margin: 0;
	   display: flex;
	   align-items: center;
	   justify-content: space-between;
	   width: 100%;
	   gap: 1.5rem;
	   /*overflow-x: auto;*/
	   padding: 8px 0;
   }
   
   .media-thumb {
	   width: 320px !important;
	   height: 180px;
	   border-radius: 10px;
	   background: rgba(255, 255, 255, 0.06);
	   border: 4px solid rgba(255, 255, 255, 0.08);
	   display: block;
	   position: relative;
	   transition: border-color 0.3s ease;
	   flex-shrink: 0;
   }
   
   .media-thumb-link {
	   display: block;
	   width: 100%;
	   height: 100%;
	   overflow: hidden;
	   border-radius: 6px;
   }
   
   .media-thumb img {
	   width: 100%;
	   height: 100%;
	   display: block;
	   object-fit: cover;
   }
   
   .media-thumb:hover {
	   border-color: rgba(255, 255, 255, 1);
   }
   
   
   /* MEDIA QUERIES */
   @media (max-width: 1440px){
    .hero-inner {
        width: 98%;
    }
   }
   
   @media (max-width: 900px) {
	   .hero-inner {
		   padding: 0.8rem;
		   height: auto;
	   }
   
	   /* desabilita altura 100vh */
   
	   .film-content {
		   display: flex;
		   flex-direction: column;
		   gap: 0.8rem;
	   }
   
	   .poster-wrap {
		   margin: 0 auto;
		   padding-top: 100px;
	   }
   
	   .title-wrap {
		   height: auto;
		   margin: 20px auto;
	   }
   
	   .info-box {
		   padding: 1rem;
		   border-radius: 10px;
		   height: auto;
	   }
   
	   .info-columns {
		   grid-template-columns: 1fr 1fr;
	   }
   
	   .synopsis,
	   .info-columns {
		   max-width: 100%;
		   text-align: left;
	   }
   
	   .media-thumb {
		   flex: 0 0 71%;
	   }
   
	   .related-section {
		   overflow: auto !important;
		   padding: 30px 30px 2px 30px;
	   }
	   .inst-media-lightbox__video {
        max-width: 90vw !important;
        width: 100% !important;
    }
	   /* Production detail: allow page to scroll on mobile */
	   /* html:has(.content-production-detail),
	   body:has(.content-production-detail) {
		   overflow-y: auto !important;
		   height: auto !important;
		   min-height: 100%;
	   } */
	   .content-production-detail .hero {
		   overflow: visible;
		   min-height: auto;
	   }
	   .content-production-detail .hero-inner {
		   min-height: auto;
	   }
	   .content-production-detail .film-content,
	   .content-production-detail .info-container {
		   height: auto;
	   }
	   .content-production-detail .media-strip-wrapper {
		   overflow: visible !important;
	   }
   }
   
   
   @media (max-width: 768px) {
	   .media-item {
		   flex: 0 0 auto;
		   /* tamanho natural, scroll livre */
	   }
        	   .media-thumb {
            flex: 0 0 100%;
        }
	   .content-production-detail .hero {
		   overflow: visible;
		   min-height: auto;
	   }
	   .content-production-detail .hero-inner {
		   min-height: auto;
	   }
   }
   
   
   .related-section {
	   padding: 30px;
	   background: linear-gradient(to bottom, #1E2026, #15171B);
	   /* degrade suave */
	   box-shadow: inset 0 10px 20px rgba(0, 0, 0, 0.3);
	   /* sombra interna na parte de cima */
	   overflow: hidden;
	   position: relative;
	   margin-bottom: -83px;
   }
   
   .related-row {
        display: flex;
        gap: 30px;
        flex-wrap: nowrap;
        justify-content: center;
    }
   
   .related-card {
	   flex: 0 0 auto;
	   width: 280px;
	   height: 420px;
	   border-radius: 10px;
	   overflow: hidden;
	   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
	   transition: transform 0.3s, opacity 0.3s;
   }
   
   .related-card img {
	   width: 100%;
	   height: 100%;
	   object-fit: contain;
   }
   
   .related-card:hover {
	   transform: scale(1.05);
	   opacity: 1;
   }
   
   .taglist {
	   padding: 0px 30px;
	   position: fixed;
	   bottom: -5px;
	   width: calc(100% - 60px);
	   left: 30px;
	   right: 30px;
   }
   .menu__item--5 .menu__item-inner a i {
    font-size: 23px;
}
.menu__item--5 .menu__item-inner {
    justify-content: center;
}

   .productions-page {
        padding: 30px 30px;
        /* margin-bottom: -70px; */
        width: 91%;
        margin: auto;
    }
   
   .mySwiper2 {
	   padding-top: 30px;
   }
   
   .productions-container {
	   display: grid;
	   grid-template-columns: repeat(auto-fit, minmax(274px, 1fr));
	   gap: 30px;
	   /* max-width: 1400px; */
	   margin: 0 auto;
	   justify-items: center;
	   /* 🔑 centraliza os cards dentro de cada célula */
	   align-items: start;
	   /* garante topo alinhado */
   }
   
   .production-card {
	   width: 100%;
	   max-width: 420px;
	   /* mantém responsividade, mas não estica além */
	   aspect-ratio: 2/3;
	   border-radius: 12px;
	   overflow: hidden;
	   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.4);
	   transition: transform 0.3s, opacity 0.3s;
   }
   
   .production-card img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
   }
   
   
   .production-card:hover {
	   transform: scale(1.05);
	   opacity: 1;
   }
   
   /* Responsividade mobile: 1 coluna mínima */
   /*@media (max-width: 420px) {*/
	  /* .productions-container {*/
		 /*  grid-template-columns: 1fr;*/
	  /* }*/
   /*}*/
   
   /* ========================================
	  CONTACT PAGE STYLES
	  contact.css - Isolated styles for contact page only
	  ======================================== */
   
   /* ========================================
	  Page Setup
	  ======================================== */
   .page-contact {
	   min-height: 100vh;
	   background-color: #0d0f11;
   }
   
   .contact-page {
	   display: flex;
	   width: 100%;
	   min-height: 100vh;
	   /*height: 100vh;*/
   }
   
   .contact-content {
	   width: 100%;
	   height: 100%;
	   text-align: initial;
   }
   
   /* ========================================
	  Left Side - Form Section
	  ======================================== */
   .contact-form-section {
	   width: 60%;
	   min-height: 100vh;
	   background-color: #1c1e23;
	   display: flex;
	   flex-direction: column;
	   padding-top: clamp(40px, 8vh, 80px);
	   /* padding-bottom: clamp(30px, 6vh, 60px); */
	   box-sizing: border-box;
   }
   
   /* ========================================
	  Form Container
	  ======================================== */
   .contact-form-wrapper {
	   flex: 1;
	   display: flex;
	   flex-direction: column;
	   justify-content: flex-end;
   }
   
   .contact-form {
	   display: flex;
	   flex-direction: column;
	   margin-top: clamp(20px, 4vh, 40px);
	   padding: 0px 80px;
   }
   
   /* ========================================
	  Form Groups & Labels
	  ======================================== */
   .form-group {
	   display: flex;
	   flex-direction: column;
	   margin-bottom: 35px;
   }
   
   .form-group label {
	   font-family: var(--font-title);
	   font-size: 18px;
	   font-weight: 300;
	   color: #b8b8b8;
	   margin-bottom: 8px;
	   letter-spacing: 0.5px;
	   line-height: 1.4;
   }
   
   /* ========================================
	  Form Row (Email + Telefone side by side)
	  ======================================== */
   .form-row {
	   display: flex;
	   gap: 4%;
	   margin-bottom: 35px;
   }
   
   .form-row .form-group {
	   flex: 1;
	   margin-bottom: 0;
   }
   
   /* ========================================
	  Input & Textarea Styles
	  ======================================== */
   .form-group input,
   .form-group textarea {
	   width: 100%;
	   background-color: #00000087;
	   border: none;
	   border-radius: 0;
	   padding-left: 15px;
	   padding-right: 15px;
	   font-family: var(--font-text);
	   font-size: 18px;
	   color: #ffffff;
	   letter-spacing: 0.5px;
	   line-height: 1.4;
	   outline: none;
	   box-sizing: border-box;
   }
   
   .form-group input {
	   height: 55px;
   }
   
   .form-group textarea {
	   height: 200px;
	   padding-top: 15px;
	   resize: none;
   }
   
   .form-group input::placeholder,
   .form-group textarea::placeholder {
	   color: #707070;
   }
   
   /* ========================================
	  Submit Button
	  ======================================== */
   .form-submit {
	   display: flex;
	   justify-content: flex-end;
	   margin-top: 10px;
   }
   
   .btn-enviar {
	   width: 110px;
	   height: 48px;
	   background-color: #ffffff;
	   color: #000000;
	   border: none;
	   border-radius: 0;
	   font-family: var(--font-title);
	   font-size: 20px;
	   font-weight: 700;
	   cursor: pointer;
	   transition: opacity 0.3s ease;
	   text-transform: lowercase;
   }
   
   .btn-enviar:hover {
	   opacity: 0.85;
   }
   
   /* ========================================
	  Address Panel
	  ======================================== */
   .contact-address-panel {
	   position: relative;
	   margin-top: clamp(50px, 8vh, 110px);
	   padding: clamp(35px, 4vh, 38px) 24px;
	   background-color: #534d4d1a;
	   text-align: center;
   }
   
   /* Noise Overlay */
   
   
   .address-label {
	   position: absolute;
	   top: 14px;
	   left: 20px;
	   font-family: var(--font-text);
	   font-size: 14px;
	   letter-spacing: 1px;
	   text-transform: lowercase;
	   color: rgba(255, 255, 255, 0.06);
   }
   
   .contact-address {
	   font-family: var(--font-title);
	   font-style: normal;
	   font-size: 20px;
	   letter-spacing: 1px;
	   line-height: 1.6;
	   color: #ffffff;
   }
   
   .contact-address .address-line {
	   display: block;
   }
   
   .contact-address .address-line--split {
	   display: flex;
	   justify-content: center;
	   align-items: center;
	   gap: 36px;
   }
   
   .contact-address .address-left {
	   color: #ffffff;
   }
   
   .contact-address .address-right {
	   color: #ffffff;
	   letter-spacing: 1px;
   }
   
   /* ========================================
	  Right Side - Image Section
	  ======================================== */
   .contact-image-section {
	   width: 40%;
	   min-height: 100vh;
	   position: relative;
	   overflow: hidden;
   }
   
   .contact-image {
	   width: 100%;
	   height: 100%;
	   background-size: cover;
	   background-position: center;
	   background-repeat: no-repeat;
	   position: absolute;
	   top: 0;
	   left: 0;
	   transition: opacity 0.2s ease-in-out;
   }
   
   /* Red Overlay */
   /*.contact-image::after {*/
	  /* content: "";*/
	  /* position: absolute;*/
	  /* inset: 0;*/
	  /* background: #bf0909f7;*/
	  /* mix-blend-mode: multiply;*/
	  /* opacity: 1;*/
	  /* transition: opacity 0.2s ease-in-out;*/
   /*}*/
   
   .contact-image:hover::after{
	   opacity: 0.9;
   }
   
   /* ========================================
	  Mobile Layout (max-width: 900px)
	  ======================================== */
   @media screen and (max-width: 900px) {
	   .contact-page {
		   flex-direction: column;
		   min-height: auto;
	   }
   
	   /* Image comes first on mobile */
	   .contact-image-section {
		   width: 100%;
		   min-height: 40vh;
		   height: 40vh;
		   order: 1;
	   }
   
	   .contact-image {
		   position: relative;
		   height: 100%;
	   }
   
	   /* Form section comes second */
	   .contact-form-section {
		   width: 100%;
		   min-height: auto;
		   order: 2;
		   padding-top: 40px;
		   padding-left: 0px;
		   padding-right: 0px;
		   padding-bottom: 60px;
	   }
   
	   .contact-form {
		   margin-top: 20px;
	   }
   
	   /* Stack Email + Telefone vertically */
	   .form-row {
		   flex-direction: column;
		   gap: 0;
		   margin-bottom: 0;
	   }
   
	   .form-row .form-group {
		   margin-bottom: 35px;
	   }
   
	   /* Center the submit button */
	   .form-submit {
		   justify-content: center;
	   }
   
	   /* Address adjustments */
	   .contact-address-panel {
		   margin-top: 44px;
		   padding: 24px 16px;
	   }
   
	   .address-label {
		   top: -16px;
		   left: 16px;
		   font-size: 13px;
	   }
   
	   .contact-address {
		   font-size: 18px;
	   }
   
	   .contact-address .address-line--split {
		   gap: 20px;
		   flex-wrap: wrap;
	   }
   }
   
   /* ========================================
	  Small Mobile (max-width: 480px)
	  ======================================== */
	 @media screen and (max-width: 847px)  {
		.productionpagemain .new_related_section {
    margin-bottom: 0px;
}
	 .tags.more {
		position: absolute;
		width: 100%;
		bottom: 23px;
		padding-bottom: 0px !IMPORTANT;
	}
        .taglist.tags.blur-box {
            width: unset;
        }
		.tags_hiddn_text {
		display: none;
	}
	.tags a {
    margin: 10px;
}
	  }
   @media screen and (max-width: 480px) {
    .productions-page {
        margin: auto;
        padding-bottom: 70px;
    }
    .inst-media-lightbox__video {
        width: 97% !important;
    }
    .productions-container {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
    .production-card {
        width: 100%;
        max-width: 280px;
    }
    /*.swiper-free-mode>.swiper-wrapper.new_media_strip {*/
    /*    overflow: auto;*/
    /*}*/


	   .contact-form-section {
		   padding-left: 0px;
		   padding-right: 0px;
	   }
   
	   .contact-image-section {
		   min-height: 35vh;
		   height: 35vh;
	   }
   
   
	   /* ========================================
	  New Responsive Styles
	  ======================================== */
	   .carousel-item {
		   padding: 0 1rem;
	   }
   
	   /*.productions-container {*/
		  /* grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));*/
   
	   /*}*/
   
	   /* Tags: inline with horizontal scroll on mobile */
	   .taglist.tags.blur-box {
		   display: flex;
		   flex-wrap: nowrap;
		   flex-direction: row;
		   overflow-x: auto;
		   overflow-y: hidden;
		   -webkit-overflow-scrolling: touch;
		   gap: 10px;
		   padding: 12px 16px;
		   align-items: center;
		   min-height: 48px;
		   position: fixed;
		   bottom: 0;
		   left: 0;
		   right: 0;
		   width: 100%;
		   box-sizing: border-box;
	   }
	   .taglist.tags.blur-box a {
		   flex-shrink: 0;
	   }
   
	   .menu__item--3 {
		   display: none;
		   height: 191%;
	   }
   
	   .menu__item--5 {
		   height: 100%;
	   }
   
	   .menu__item-inner p img {
		   width: 50%;
	   }
   
	   .menu__item--5 .sidemenu__item {
		   font-size: 26px !important;
		   margin-top: 0px;
	   }
   
	   .menu__item--5 p {
		   margin-top: 8px;
		   margin-bottom: 0px;
	   }
   
	   .menu__item--5 .label--leftcenter {
		   margin-top: 11px;
	   }
   
	   .carousel-dots {
		   bottom: 11px;
	   }
   
	   .box-header {
		   align-items: flex-start;
	   }
   
	   .tags-row {
		   width: 70%;
		   flex-wrap: wrap;
	   }
   .inst-hero__image img {
	   height: 654px !important;
	   object-position: 50% 330% !important;
   }
   /*.menu__item {*/
   /*    overflow: unset;*/
   /*}*/
   .menu__item--2 .menu__item-inner {
	   height: 470px;
   }
   /*.menu__item--1 .menu__item-inner {*/
	  /* height: 338px;*/
   /*}*/
   .menu__item--1 .menu__item-inner {
        height: 407px;
        justify-content: end;
        padding-bottom: 56px;
    }
   .mainmenu a {
	   font-size: 44px;
	   line-height: 47px;
	   font-weight: 700;
   }
   .menu__item--3 .menu__item-inner {
	   padding: 24px;
   }
   .menu__item--4 .tags {
	   padding: 20px 10px;
   }
   .menu__item--5 .menu__item-inner {
		padding: 0px;
		height: 250px;
	}
	.menu__item--5 .menu__item-inner {
		justify-content: start;
		padding-top: 48px !important; 
	}
   .menu__item--5 .label--leftcenter {
	   display: none;
   }
   }
   
   /* ========================================
	  Institucional Page Styles
	  ======================================== */
   
   .page-institucional {
	   min-height: 100vh;
	   background-color: #0d0f11;
   }
   
   .institucional-content {
	   width: 100%;
	   text-align: left;
   }
   
   .institucional-page {
	   display: flex;
	   flex-direction: column;
	   gap: 0px;
	   padding: 0 0 0px;
   }
   
   /* ========================================
	  Hero
	  ======================================== */
   .inst-hero {
	   display: grid;
	   grid-template-columns: repeat(2, 1fr);
	   /* min-height: min(720px, 75vh); */
   }
   
   .inst-hero__image {
	   position: relative;
	   overflow: hidden;
   }
   
   .inst-hero__image img {
	   width: 100%;
	   height: 684px;
	   object-fit: cover;
	   object-position: bottom;
	   display: block;
	   object-position: 50% 83%;
	   opacity: 0.4;
	   transition: opacity 1s ease;
   }
   .inst-hero__image ::after {
	   content: "";
	   position: absolute;
	   inset: 0;
	   background: #b00f0feb;
	   mix-blend-mode: multiply;
	   opacity: 1;
   }
   .inst-hero__image:hover img {
	   opacity: 0.8;
   }
   /*.inst-hero__overlay {*/
   /*	position: absolute;*/
   /*	inset: 0;*/
   /*	background: rgba(122, 0, 0, 0.7);*/
   /*	background: rgba(90, 0, 0, 0.75);*/
   /*	transition: background 1s, opacity 1s;*/
   /*}*/
   
   /*.inst-hero__overlay:hover {*/
   /*	background: red;*/
   /*	opacity: 0.6;*/
   /*}*/
   button#instMediaLightboxClose img {
	   width: 100%;
   }
   .inst-hero__text {
	   padding: 80px 80px 80px 60px;
	   display: flex;
	   flex-direction: column;
	   justify-content: center;
	   gap: 32px;
	   max-width: 100%;
   }
   
   .inst-hero__text p {
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   font-size: clamp(30px, 3.5vw, 38px);
	   line-height: 1.2;
	   color: #ffffff;
	   margin: 0;
   }
   
   /* ========================================
	  Intro Paragraph
	  ======================================== */
   .inst-intro {
	   padding: 48px 50px;
	   background: #111316;
   }
   
   .inst-intro p,
   .inst-body p {
	   font-size: 18px;
	   line-height: 1.65;
	   color: #d8d8d8;
	   margin: 0;
   }
   
   .inst-intro strong,
   .inst-body strong {
	   color: #ffffff;
   }
   
   /* ========================================
	  Gallery
	  ======================================== */
   .inst-gallery {
	   display: flex;
	   flex-direction: column;
	   gap: 20px;
	   padding: 25px 50px !important;
   }
   
   /* ========================================
	  Media Gallery Grid
	  ======================================== */
   .inst-media-gallery {
	   display: grid;
	   grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	   gap: 24px;
	   padding: 25px 50px;
   }
   
   .inst-media-gallery__item {
	   position: relative;
	   cursor: pointer;
	   border-radius: 14px;
	   overflow: hidden;
	   border: 2px solid transparent;
	   transition: border-color 0.3s, transform 0.3s;
   }
   
   .inst-media-gallery__item img::after {
	   content: '';
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 280px;
	   border-radius: 14px 14px 0 0;
	   background: rgba(0, 0, 0, 0.25);
	   transition: background 0.3s ease;
	   pointer-events: none;
   }
   
   .inst-media-gallery__item img:hover::after {
	   background: unset;
	   border: 3px solid rgba(255, 255, 255, 1);
	   border-radius: 14px 14px 0 0;
	   overflow: hidden;
   }
   
   .inst-media-gallery__thumbnail {
	   width: 100%;
	   height: 280px;
	   object-fit: cover;
	   display: block;
	   border-radius: 0px;
   }
   
   .inst-media-gallery__title {
	   margin: 0.5rem 0 0;
	   padding: 0 0.25rem;
	   font-size: 0.95rem;
	   color: #e0e0e0;
	   text-align: center;
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   font-weight: 700;
   }
   
   .inst-section-title {
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   font-size: 16px;
	   text-transform: uppercase;
	   letter-spacing: 0.5px;
	   color: #d8d8d8;
	   margin: 0;
   }
   
   .inst-gallery__track {
	   display: grid;
	   grid-auto-flow: column;
	   grid-auto-columns: minmax(220px, 1fr);
	   gap: 24px;
	   /* overflow-x: auto; */
	   /* scroll-snap-type: x mandatory; */
	   padding-bottom: 6px;
   }
   
   .inst-gallery__card {
	   position: relative;
	   overflow: hidden;
	   border-radius: 16px;
	   scroll-snap-align: start;
	   border: 2px solid transparent;
	   transition: border-color 0.3s, transform 0.3s;
   }
   
   .inst-gallery__card::after {
	   content: '';
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: rgba(0, 0, 0, 0.25);
	   transition: background 0.3s ease;
   }
   
   .inst-gallery__card:hover::after {
	   background: unset;
	   border: 3px solid rgba(255, 255, 255, 1);
	   overflow: hidden;
	   border-radius: 16px;
   }
   
   .inst-gallery__card img {
	   width: 100%;
	   height: 208px;
	   object-fit: cover;
	   display: block;
   }
   
   
   /* ========================================
	  Body Copy
	  ======================================== */
   .inst-body {
	   background: #0f1113;
	   padding: 48px 50px;
	   margin-bottom: 30px;
   }
   
   /* ========================================
	  Team
	  ======================================== */
   .inst-team {
	   padding: 25px 0px;
	   overflow: hidden;
   }
   
   /* Swiper wrapper should use flex (Swiper default) - this takes priority */
   .swiper-wrapper.inst-team__track {
	   display: flex !important;
	   flex-direction: row !important;
	   grid-template-columns: none !important;
	   gap: 0 !important;
	   width: 100% !important;
	   align-items: stretch !important;
   }
   
   /* Only apply grid if NOT a swiper-wrapper */
   .inst-team__track:not(.swiper-wrapper) {
	   display: grid;
	   grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	   gap: 24px;
   }
   
   /* Ensure swiper slides display horizontally and have proper width */
   .swiper.inst-team .swiper-slide {
	   width: auto !important;
	   flex-shrink: 0 !important;
	   display: block !important;
	   height: auto !important;
   }
   
   /* Ensure team cards fill the slide */
   .swiper.inst-team .swiper-slide .inst-team__card {
	   width: 100%;
	   height: 100%;
   }
   
   .inst-team__card {
	   border-radius: 14px;
	   overflow: hidden;
	   border: 2px solid transparent;
	   text-align: center;
	   padding-bottom: 0;
	   transition: border-color 0.3s, transform 0.3s;
	   position: relative;
   }
   
   .inst-team__card::after {
	   content: '';
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: rgba(0, 0, 0, 0.25);
	   transition: background 0.3s ease;
   }
   
   .inst-team__card:hover::after {
	   background: unset;
	   border: 3px solid rgba(255, 255, 255, 1);
	   border-radius: 14px;
	   overflow: hidden;
   }
   
   .inst-team__card img {
	   width: 100%;
	   height: 411px;
	   object-fit: cover;
	   display: block;
   }
   
   
   /* ========================================
	  Mission
	  ======================================== */
   .inst-mission {
	   padding: 20px 80px 46px;
	   text-align: center;
   }
   
   .inst-mission p {
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   font-size: clamp(22px, 2.8vw, 28px);
	   line-height: 1.4;
	   color: #ffffff;
	   margin: 0;
   }
   
   /* ========================================
	  Footer Band
	  ======================================== */
   .inst-footer-band {
	   position: relative;
	   height: 500px;
	   margin-top: 0px;
   }
   .inst-footer-band::after {
	   content: "";
	   position: absolute;
	   inset: 0;
	   background: #b00f0feb;
	   mix-blend-mode: multiply;
	   opacity: 1;
	   transition: background 1s ease;
   }
   .inst-footer-band:hover::after {
	   background: red;
   }
   .inst-footer-band__image {
	   position: absolute;
	   inset: 0;
	   overflow: hidden;
   }
   
   .inst-footer-band__image img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
	   opacity: 1;
   }
   /* .inst-footer-band__overlay {
	   position: absolute;
	   inset: 0;
	   background: rgba(122, 0, 0, 0.7);
   } */
   
   .inst-footer-band__content {
	   position: relative;
	   z-index: 1;
	   height: 100%;
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: end;
	   text-align: center;
	   gap: 12px;
	   color: #ffffff;
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   letter-spacing: 0.8px;
	   padding-bottom: 8px;
   }
   
   .insta_para {
	   margin-bottom: 8px;
	   font-weight: 500;
	   font-size: 20px;
   }
   
   .inst-footer-band__phone {
	   font-size: 26px;
	   margin-top: 0px;
   }
   
   .inst-footer-band__phone strong {
	   font-weight: 700;
   }
   
   /* ========================================
   swiper
	  ======================================== */
   .swiper {
	   width: 100%;
	   height: 100%;
   }
   
   
   .swiper-slide img {
	   display: block;
	   width: 100%;
	   object-fit: cover;
   }
   
   .swiper-pagination {
	   display: none;
   }
   
   /* ========================================
   Responsive
	  ======================================== */
	  @media (max-width: 1500px) {
	  .inst-media-lightbox__video {
            max-width: 90vw !important;
            width: 100% !important;
        }
	  }
	  @media (max-width: 1100px) {
	  .inst-media-lightbox__video {
            max-width: 90vw !important;
            width: 100% !important;
        }
	  }
   @media (max-width: 900px) {
       .inst-media-lightbox__video {
            max-width: 90vw !important;
            width: 100% !important;
        }
	   .inst-hero {
		   grid-template-columns: 1fr;
		   min-height: auto;
	   }
   
	   .inst-hero__image {
		   height: 300px;
	   }
   
	   .inst-hero__text {
		   padding: 48px 32px;
		   max-width: none;
	   }
   
	   .inst-hero__text p {
		   font-size: clamp(24px, 6vw, 30px);
	   }
   
	   .inst-intro,
	   .inst-gallery,
	   .inst-body,
	   .inst-team,
	   .inst-mission {
		   padding-left: 24px;
		   padding-right: 24px;
	   }
   
	   .inst-gallery__track {
		   grid-auto-columns: minmax(70%, 1fr);
	   }
   
	   .inst-team__track {
		   grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	   }
   
	   .inst-footer-band {
		   height: 380px;
	   }
   
	   .inst-footer-band__content {
		   padding: 0 16px;
	   }
   }
   
   /* ========================================
	  Profile Modal Styles
	  ======================================== */
   .profile-modal {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 9999;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
	   background: #534d4d1a;
       backdrop-filter: blur(27px);
   }
   
   .profile-modal.is-open {
	   opacity: 1;
	   visibility: visible;
   }
   
   .profile-modal__overlay {
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: rgba(0, 0, 0, 0.6);
	   cursor: pointer;
   }
   
   .profile-modal__container {
        position: relative;
        z-index: 1;
        width: 90%;
        /*max-width: 950px;*/
        background: #534d4d1a;
        backdrop-filter: blur(27px);
        -webkit-backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 12px;
        padding: 50px;
        transform: scale(0.9) translateY(20px);
        transition: transform 0.3s ease;
        box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
    }
   
   .profile-modal.is-open .profile-modal__container {
	   transform: scale(1) translateY(0);
   }
   .carousel-caption.blur-box p {
        margin: 0px 0px 11px 0px;
    }
	iframe.production-media-modal__video {
		width: 100%;
		max-width: 90vw;
		height: auto;
		min-height: 400px;
		aspect-ratio: 16/9;
    }
    

   .profile-modal__close {
	   position: absolute;
	   top: 16px;
	   right: 20px;
	   width: 40px;
	   height: 40px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #fff;
	   padding: 8px;
	   border-radius: 50%;
	   transition: background 0.2s ease, transform 0.2s ease;
	   z-index: 10;
   }
   
   .profile-modal__close:hover {
	   opacity: 0.7;
   }
   
   .profile-modal__close svg {
	   width: 100%;
	   height: 100%;
   }
   
   .profile-modal__content {
	   display: flex;
	   align-items: flex-start;
	   gap: 50px;
   }
   
   .profile-modal__photo {
	   flex-shrink: 0;
   }
   
   .profile-modal__photo img {
	   width: 280px;
	   height: 380px;
	   object-fit: cover;
	   object-position: center top;
	   border: 2px solid #fff;
	   border-radius: 10px;
   }
   
   .profile-modal__close img {
	   width: 23px;
   }
   
   .profile-modal__info {
	   flex: 1;
	   min-width: 0;
   }
   
   .profile-modal__name {
	   font-family: var(--font-title);
	   font-size: 36px;
	   font-weight: 500;
	   color: #fff;
	   margin: 0 0 20px 0;
	   line-height: 1.2;
   }
   
   .profile-modal__bio {
	   font-family: var(--font-text);
	   font-size: 16px;
	   line-height: 1.7;
	   color: #fff;
	   opacity: 0.95;
	   word-wrap: break-word;
	   overflow-wrap: break-word;
   }
   
   /* Modal Responsive */
   @media screen and (max-width: 768px) {
       .inst-media-lightbox__main {
    height: 100%;
}

	   .profile-modal__container {
		   padding: 30px 25px;
		   max-height: 90vh;
		   overflow-y: auto;
	   }
	    .related-card {
            width: unset;
            height: 300;
        }
        .poster-card {
            width: 100%;
            height: 300px;
        }
        .content-production-detail .new_poster_wrap .poster-card {
            height: auto;
        }

	   .profile-modal__content {
		   flex-direction: column;
		   gap: 25px;
		   text-align: left;
	   }
   
	   .profile-modal__photo {
		   width: 100%;
	   }
   
	   .profile-modal__photo img {
		   width: 100%;
		   height: 430px;
		   min-width: auto;
		   margin-top: 35px;
	   }
   
	   .contact-form {
		   padding: 0px 30px;
	   }
   
	   .contact-form-section {
		   padding-bottom: 0px;
		   padding-top: 8px;
	   }
   
	   .profile-modal__name {
		   font-size: 28px;
	   }
   
	   .profile-modal__bio {
		   font-size: 15px;
	   }
   
	   .profile-modal__close {
		   top: 12px;
		   right: 21px;
		   width: 36px;
		   height: 36px;
	   }
   }
   
   /* Team Card Cursor */
   .inst-team__card {
	   cursor: pointer;
   }
   
   .social_img ul {
	   list-style: none;
	   padding-left: 0px;
	   display: flex;
	   gap: 18px;
	   margin-top: 30px;
   }
   
   .social_img ul img {
	   width: 70%;
   }
   
   /* ========================================
	  Gallery Lightbox Modal
	  ======================================== */
   .gallery-modal {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 10000;
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
   }
   
   .gallery-modal.is-open {
	   opacity: 1;
	   visibility: visible;
   }
   
   .gallery-modal__overlay {
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: #282828;
	   cursor: pointer;
   }
   
   .gallery-modal__close {
	   position: absolute;
	   top: 20px;
	   right: 20px;
	   width: 36px;
	   height: 36px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #fff;
	   z-index: 10;
	   transition: transform 0.2s ease;
   }
   
   .gallery-modal__close:hover {
	   transform: scale(1.1);
   }
   
   .gallery-modal__close svg {
	   width: 100%;
	   height: 100%;
   }
   
   .gallery-modal__main {
	   position: relative;
	   z-index: 1;
	   max-width: 70%;
	   max-height: 65vh;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   margin-bottom: 70px;
   }
   
   .gallery-modal__image {
	   max-width: 100%;
	   max-height: 65vh;
	   /* object-fit: cover; */
	   border-radius: 8px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
	   width: 538px;
	   height: 382px;
   }
   
   .gallery-modal__thumbs {
	   position: relative;
	   z-index: 1;
	   display: flex;
	   gap: 10px;
	   padding: 15px;
	   max-width: 90%;
	   overflow-x: auto;
	   justify-content: center;
   }
   
   .gallery-modal__thumb {
	   flex-shrink: 0;
	   width: 125px;
	   height: 80px;
	   border-radius: 6px;
	   overflow: hidden;
	   cursor: pointer;
	   opacity: 0.5;
	   transition: opacity 0.2s ease, transform 0.2s ease;
	   border: 2px solid transparent;
   }
   
   .gallery-modal__thumb:hover {
	   opacity: 0.8;
   }
   
   .gallery-modal__thumb.is-active {
	   opacity: 1;
	   border-color: #fff;
   }
   
   .gallery-modal__thumb img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
   }
   
   /* Gallery Card Hover */
   .inst-gallery__card {
	   cursor: pointer;
	   transition: transform 0.3s ease;
   }
   
   .inst-gallery__card:hover {
	   transform: scale(1.02);
   }
   
   /* Gallery Modal Responsive */
   @media screen and (max-width: 768px) {
	   .gallery-modal__main {
		   max-width: 90%;
		   max-height: 50vh;
	   }
   .gallery-modal__thumbs {
	   position: absolute;
	   bottom: 23px;
   }
	   .gallery-modal__image {
		   max-height: 50vh;
	   }
   
	   .gallery-modal__thumb {
		   width: 80px;
		   height: 53px;
	   }
   
	   .gallery-modal__close {
		   top: 15px;
		   right: 23px;
		   width: 30px;
		   height: 30px;
	   }
   }
   
   /* ========================================
	  Institutional Media Gallery Lightbox
	  ======================================== */
   .inst-media-lightbox {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 10000;
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
   }
   
   /* Ensure menu icon is hidden when lightbox is open - high specificity */
   body.inst-lightbox-open button.action.action--menu,
   body.inst-lightbox-open .action.action--menu,
   .inst-media-lightbox.is-open ~ nav button.action.action--menu,
   .inst-media-lightbox.is-open ~ nav .action.action--menu {
	   display: none !important;
	   visibility: hidden !important;
	   opacity: 0 !important;
	   pointer-events: none !important;
	   z-index: -1 !important;
   }
   
   /* Hide menu close icon when institution media lightbox is open */
   body.inst-lightbox-open button.action.action--close,
   body.inst-lightbox-open .action.action--close,
   .inst-media-lightbox.is-open ~ nav button.action.action--close,
   .inst-media-lightbox.is-open ~ nav .action.action--close {
	   display: none !important;
	   visibility: hidden !important;
	   opacity: 0 !important;
	   pointer-events: none !important;
	   z-index: -1 !important;
   }
   
   .inst-media-lightbox.is-open {
		opacity: 1;
		visibility: visible;
   }
   
   
   .inst-media-lightbox__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        /* background: rgba(0, 0, 0, 0.9); */
        cursor: pointer;
        background: #7e7a7a3b;
        backdrop-filter: blur(8px);
        z-index: 1;
    }
    
    /* Cover menu icon area with overlay when lightbox is open */
    .inst-media-lightbox.is-open::before {
        content: '';
        position: fixed;
        top: 0;
        right: 0;
        width: 100px;
        height: 100px;
        z-index: 10001;
        pointer-events: none;
    }
   
   .inst-media-lightbox__close {
	   position: absolute;
	   top: 27px;
	   right: 27px;
	   width: 45px;
	   height: 45px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #fff;
	   z-index: 10;
	   transition: transform 0.2s ease;
   }
   .inst-media-lightbox__close img {
	   width: 100%;
   }
   .inst-media-lightbox__close:hover {
	   transform: scale(1.1);
   }
   
   .inst-media-lightbox__prev,
   .inst-media-lightbox__next {
	   position: absolute;
	   top: 50%;
	   transform: translateY(-50%);
	   width: 50px;
	   height: 50px;
	   background: rgba(255, 255, 255, 0.2);
	   border: none;
	   border-radius: 50%;
	   color: #fff;
	   font-size: 32px;
	   cursor: pointer;
	   z-index: 10;
	   transition: background 0.2s ease;
	   display: flex;
	   align-items: center;
	   justify-content: center;
   }
   
   .inst-media-lightbox__prev:hover,
   .inst-media-lightbox__next:hover {
	   background: rgba(255, 255, 255, 0.4);
   }
   
   .inst-media-lightbox__prev {
	   left: 20px;
   }
   
   .inst-media-lightbox__next {
	   right: 20px;
   }
   
   /* Hide prev/next arrows on institution media lightbox */
   .inst-media-lightbox__prev,
   .inst-media-lightbox__next {
	   display: none !important;
   }
   
   .inst-media-lightbox__main {
	   position: relative;
	   z-index: 1;
	   max-width: 90%;
	   max-height: 80vh;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   margin: auto;
	   margin-bottom: 100px;
   }
   
   .inst-media-lightbox__image {
	   max-width: 100%;
	   max-height: 80vh;
	   border-radius: 8px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
	   object-fit: contain;
   }
   
   .inst-media-lightbox__video {
	   width: 90vw;
	   height: 70vh;
	   max-width: 1200px;
	   border-radius: 8px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
   }
   
   .inst-media-lightbox__video-file {
	   max-width: 90vw;
	   max-height: 80vh;
	   border-radius: 8px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
   }
   
   .inst-media-lightbox__thumbs {
	   position: relative;
	   z-index: 1;
	   display: flex;
	   gap: 10px;
	   padding: 15px;
	   max-width: 90%;
	   overflow-x: auto;
	   justify-content: center;
   }
   
   .inst-media-lightbox__thumb {
	   flex-shrink: 0;
	   width: 125px;
	   height: 80px;
	   border-radius: 6px;
	   overflow: hidden;
	   cursor: pointer;
	   opacity: 0.5;
	   transition: opacity 0.2s ease, transform 0.2s ease;
	   border: 2px solid transparent;
   }
   
   .inst-media-lightbox__thumb:hover {
	   opacity: 0.8;
   }
   
   .inst-media-lightbox__thumb.is-active {
	   opacity: 1;
	   border-color: #fff;
   }
   
   .inst-media-lightbox__thumb img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
   }
   
   .inst-media-lightbox__caption {
	   margin: 0;
	   padding: 10px 15px;
	   max-width: 90%;
	   text-align: center;
	   color: #e0e0e0;
	   font-size: 0.95rem;
	   font-family: var(--font-title, 'Gemunu Libre', sans-serif);
	   font-weight: 700;
   }
   
   @media screen and (max-width: 768px) {
	   .inst-media-lightbox__main {
		   max-width: 95%;
		   max-height: 100vh;
		   margin-bottom: 80px;
	   }
	   
	   .inst-media-lightbox__thumbs {
		   position: absolute;
		   bottom: 20px;
	   }
	   
	   .inst-media-lightbox__image,
	   .inst-media-lightbox__video-file {
		   max-height: 60vh;
	   }
	   
	   .inst-media-lightbox__video {
		   width: 95vw;
		   height: 50vh;
	   }
	   
	   .inst-media-lightbox__thumb {
		   width: 80px;
		   height: 53px;
	   }
	   
	   .inst-media-lightbox__close {
		display: flex !important;
		align-items: center;
		justify-content: center;
		top: max(10px, env(safe-area-inset-top));
		right: max(10px, env(safe-area-inset-right));
		width: 44px;
		height: 44px;
		z-index: 10002;
	   }
	   
	   .inst-media-lightbox__prev,
	   .inst-media-lightbox__next {
		   width: 40px;
		   height: 40px;
		   font-size: 24px;
	   }
	   
	   .inst-media-lightbox__prev {
		   left: 10px;
	   }
	   
	   .inst-media-lightbox__next {
		   right: 10px;
	   }
   }
   
   /* ========================================
	  Production Media Lightbox Modal
	  ======================================== */
   .production-media-modal {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 10000;
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
   }
   
   .production-media-modal.is-open {
	   opacity: 1;
	   visibility: visible;
   }
   
   .production-media-modal__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #282828;
        cursor: pointer;
        background: #141313bf;
        backdrop-filter: blur(27px);
    }
   
   .production-media-modal__close {
	   position: absolute;
	   top: 27px;
	   right: 27px;
	   width: 45px;
	   height: 45px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #fff;
	   z-index: 10;
	   transition: transform 0.2s ease;
   }
   
   .production-media-modal__close:hover {
	   transform: scale(1.1);
   }
   
   .production-media-modal__close img {
	   width: 100%;
	   height: 100%;
   }
   
   .production-media-modal__main {
	   position: relative;
	   z-index: 1;
	   max-width: 70%;
	   max-height: 65vh;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   margin-bottom: 70px;
   }
   
   .production-media-modal__image {
        max-width: 100%;
        max-height: 65vh;
        width: auto;
        height: auto;
        object-fit: contain;
        border-radius: 8px;
        box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
    }
   
   video.production-media-modal__video {
        width: 100%;
        max-width: 90vw;
        height: auto;
        min-height: 400px;
        max-height: 65vh;
    }
   
   .production-media-modal__thumbs {
	   position: absolute;
	   bottom: 15px;
	   z-index: 1;
	   display: flex;
	   gap: 10px;
	   padding: 15px;
	   max-width: 90%;
	   overflow-x: auto;
	   justify-content: center;
   }
   
   .production-media-modal__thumb {
	   flex-shrink: 0;
	   width: 125px;
	   height: 80px;
	   border-radius: 6px;
	   overflow: hidden;
	   cursor: pointer;
	   opacity: 0.5;
	   transition: opacity 0.2s ease, transform 0.2s ease;
	   border: 2px solid transparent;
   }
   
   .production-media-modal__thumb:hover {
	   opacity: 0.8;
   }
   
   .production-media-modal__thumb.is-active {
	   opacity: 1;
	   border-color: #fff;
   }
   
   .production-media-modal__thumb img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
   }
   
   .production-media-modal__caption {
	   margin: 0;
	   padding: 10px 15px;
	   text-align: center;
	   color: #e0e0e0;
	   font-size: 0.95rem;
   }
   
   /* Media Strip Thumb Hover */
   .media-thumb {
	   cursor: pointer;
	   transition: border-color 0.3s ease;
	   position: relative;
	   overflow: visible;
   }
   
   .media-thumb:hover {
	   /* Removed transform to prevent clipping */
	   border-color: rgba(255, 255, 255, 1);
   }
   
   /* Production Media Modal Responsive */
   @media screen and (max-width: 768px) {
	   .production-media-modal__main {
		   max-width: 90%;
		   max-height: 50vh;
	   }
	   
	   .production-media-modal__thumbs {
		   position: absolute;
		   bottom: 23px;
	   }
	   
	   .production-media-modal__image {
		   max-height: 50vh;
	   }
   
	   .production-media-modal__thumb {
		   width: 80px;
		   height: 53px;
	   }
   
	   .production-media-modal__close {
		   top: 27px;
		   right: 27px;
		   width: 45px;
		   height: 45px;
	   }
   }
   
   /* ========================================
	  Carousel Media Lightbox Modal (reuses production-media-modal styles)
	  ======================================== */
   .carousel-media-modal {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 10000;
	   display: flex;
	   flex-direction: column;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
	   pointer-events: none;
   }
   
   .carousel-media-modal.is-open {
	   opacity: 1;
	   visibility: visible;
	   pointer-events: auto;
   }
   
   .carousel-media-modal.is-open {
	   opacity: 1;
	   visibility: visible;
   }
   
   .carousel-media-modal__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: #282828;
        cursor: pointer;
        background: #ebdcdc2b;
        backdrop-filter: blur(8px);
    }
   
   .carousel-media-modal__close {
	   position: absolute;
	   top: 27px;
	   right: 27px;
	   width: 45px;
	   height: 45px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #fff;
	   z-index: 10;
	   transition: transform 0.2s ease;
   }
   
   .carousel-media-modal__close:hover {
	   transform: scale(1.1);
   }
   
   .carousel-media-modal__close img {
	   width: 100%;
	   height: 100%;
   }
   
   .carousel-media-modal__main {
	   position: relative;
	   z-index: 1;
	   max-width: 70%;
	   max-height: 65vh;
	   display: flex;
	   align-items: center;
	   justify-content: center;
   }
   #reelModal .carousel-media-modal__main {
	   width: 100%;
   }
   
   .carousel-media-modal__image {
	   max-width: 100%;
	   max-height: 65vh;
	   object-fit: contain;
	   border-radius: 8px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
   }
   
   .carousel-media-modal__video {
	width: 100%;
	max-width: 90vw;
	height: auto;
	min-height: 400px;
	aspect-ratio: 16/9;
	border-radius: 8px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
	margin-bottom: 100px;
   }
   
   @media screen and (max-width: 768px) {
	   .carousel-media-modal__main {
		   max-width: 90%;
		   max-height: 50vh;
	   }
	   
	   .carousel-media-modal__image {
		   max-height: 50vh;
	   }
	   
	   .carousel-media-modal__video {
		   width: 95vw;
		   height: 50vh;
	   }
   
	   .carousel-media-modal__close {
		   top: 27px;
		   right: 27px;
		   width: 45px;
		   height: 45px;
	   }
	   
	   .carousel-media-modal__thumbs {
		   bottom: 23px;
		   padding: 8px;
		   gap: 8px;
	   }
	   
	   .carousel-media-modal__thumb {
		   width: 80px;
		   height: 53px;
	   }
   }
   
   /* Carousel Media Modal Thumbnails */
   .carousel-media-modal__thumbs {
	   position: absolute;
	   bottom: 15px;
	   left: 50%;
	   transform: translateX(-50%);
	   z-index: 1;
	   display: flex;
	   gap: 10px;
	   padding: 15px;
	   max-width: 90%;
	   overflow-x: auto;
	   justify-content: center;
	   scrollbar-width: thin;
	   scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
   }
   
   .carousel-media-modal__thumbs::-webkit-scrollbar {
	   height: 6px;
   }
   
   .carousel-media-modal__thumbs::-webkit-scrollbar-track {
	   background: transparent;
   }
   
   .carousel-media-modal__thumbs::-webkit-scrollbar-thumb {
	   background: rgba(255, 255, 255, 0.3);
	   border-radius: 3px;
   }
   
   .carousel-media-modal__thumb {
	   flex-shrink: 0;
	   width: 125px;
	   height: 80px;
	   border-radius: 6px;
	   overflow: hidden;
	   cursor: pointer;
	   opacity: 0.6;
	   transition: opacity 0.2s ease, transform 0.2s ease;
	   border: 2px solid transparent;
   }
   
   .carousel-media-modal__thumb:hover {
	   opacity: 0.8;
	   transform: scale(1.05);
   }
   
   .carousel-media-modal__thumb.is-active {
	   opacity: 1;
	   border-color: #fff;
	   transform: scale(1.05);
   }
   
   .carousel-media-modal__thumb img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
	   display: block;
   }
   
   /* ========================================
	  Contact Form Overlay Modal
	  ======================================== */
   .contact-modal {
	   position: fixed;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   z-index: 10000;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   opacity: 0;
	   visibility: hidden;
	   transition: opacity 0.3s ease, visibility 0.3s ease;
   }
   
   .contact-modal.is-open {
	   opacity: 1;
	   visibility: visible;
   }
   
   .contact-modal__overlay {
	   position: absolute;
	   top: 0;
	   left: 0;
	   width: 100%;
	   height: 100%;
	   background: rgba(0, 0, 0, 0.85);
	   cursor: pointer;
   }
   
   .contact-modal__container {
	   position: relative;
	   z-index: 1;
	   background: #fff;
	   border-radius: 8px;
	   max-width: 600px;
	   width: 90%;
	   max-height: 90vh;
	   overflow-y: auto;
	   padding: 40px;
	   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
	   transform: scale(0.9);
	   transition: transform 0.3s ease;
   }
   
   .contact-modal.is-open .contact-modal__container {
	   transform: scale(1);
   }
   
   .contact-modal__close {
	   position: absolute;
	   top: 15px;
	   right: 15px;
	   width: 36px;
	   height: 36px;
	   background: transparent;
	   border: none;
	   cursor: pointer;
	   color: #2c3e50;
	   z-index: 10;
	   transition: transform 0.2s ease;
	   display: flex;
	   align-items: center;
	   justify-content: center;
   }
   
   .contact-modal__close:hover {
	   transform: scale(1.1);
   }
   
   .contact-modal__close img {
	   width: 100%;
	   height: 100%;
	   filter: brightness(0);
   }
   
   .contact-modal__content {
	   position: relative;
   }
   
   .contact-modal__content .contact-form {
	   padding: 0;
   }
   
   .contact-modal__content .contact-address-panel {
	   margin-top: 30px;
	   padding-top: 30px;
	   border-top: 1px solid #ddd;
   }
   
   .contact-modal__content .contact-address {
	   color: #2c3e50;
	   font-style: normal;
   }
   
   .contact-modal__content .address-phone {
	   font-weight: 600;
	   margin-top: 10px;
   }
   .alert_box {
	   margin-top: -8px;
   }
   
   /* Lightbox wrapper */
   .inst-media-lightbox {
	   position: fixed;
	   inset: 0;
	   display: none;
	   background: rgba(0,0,0,0.9);
	   z-index: 10000;
   }
   
     .inst-media-lightbox.is-open {
        display: flex;
        align-items: center;
    }
   
   /* Main image */
   .inst-media-lightbox__main {
	   min-height: 100vh;
	   display: flex;
	   align-items: center;
	   justify-content: center;
	   padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
   }
   
   .inst-media-lightbox__image, .inst-media-lightbox__video, .inst-media-lightbox__video-file {
        max-width: 100%;
        max-height: 80vh;
        width: auto;
        object-fit: contain;
        margin-top: 0;
    }
    .inst-media-lightbox__video {
        width: 100%;
        max-width: 90vw;
        height: auto;
        min-height: 400px;
        aspect-ratio: 16/9;
    }

   /* THUMBNAILS BAR */
   .inst-media-lightbox__thumbs {
	   position: fixed;
	   bottom: 15px;
	   left: 50%;
	   transform: translateX(-50%);
	   display: flex;
	   gap: 10px;
	   padding: 8px 12px;
	   background: rgba(0,0,0,0.6);
	   border-radius: 8px;
	   max-width: 90vw;
	   overflow-x: auto;
	   z-index: 10001;
   }
   
   /* Each thumb */
   .inst-media-lightbox__thumbs img {
	   width: 100%;
	   height: 100%;
	   object-fit: cover;
	   border-radius: 4px;
	   opacity: 0.5;
	   cursor: pointer;
	   transition: all 0.2s ease;
   }
   
   /* Active thumb */
   .inst-media-lightbox__thumbs img.active {
	   opacity: 1;
	   outline: 2px solid #fff;
	   transform: scale(1.05);
   }
/* Swiper container styles */
.swiper-container {
    width: 100%;
    height: 100%;
    padding: 25px 50px;
}

.swiper-container .swiper-slide {
    border-radius: 16px;
    overflow: hidden;
    border: 2px solid transparent;
    transition: transform 0.3s;
}

.swiper-container .inst-media-gallery__item {
    border-radius: unset;
    border: unset;
    transition: border-color 0.3s, transform 0.3s;
	height: unset;
}

.swiper-container .swiper-slide img.inst-media-gallery__thumbnail,
.swiper-container .inst-media-gallery__item img {
    border-radius: 14px;
    height: 280px;
}

.swiper-container .swiper-slide img {
    width: 100%;
    height: 280px;
    object-fit: cover;
}
.mySwiper2 .swiper-slide img{
    width: 100%;
    height: 280px;
    object-fit: cover;
}
   /* Contact Modal Responsive */
   @media screen and (max-width: 768px) {
	   .contact-modal__container {
		   width: 95%;
		   padding: 30px 20px;
		   max-height: 95vh;
	   }
   
	   .contact-modal__close {
		   top: 10px;
		   right: 10px;
		   width: 30px;
		   height: 30px;
	   }
	   .inst-media-lightbox__main {
		   min-height: 100vh;
		   padding: max(2rem, env(safe-area-inset-top)) 1rem 5rem;
	   }
	   .inst-media-lightbox__image, .inst-media-lightbox__video, .inst-media-lightbox__video-file {
		   max-height: 60vh;
		   width: auto;
		   margin-top: 0;
	   }
	   .inst-media-lightbox__image img {
		   max-height: 100%;
	   }
	   .inst-media-lightbox__video {
		   min-width: 0 !important;
		   width: 100%;
		   max-height: 50vh;
	   }
   }
   @media screen and (max-width: 576px) {
       .inst-media-lightbox__video {
        min-width: 100% !important;
    }
       iframe.production-media-modal__video {
    width: 100%;
    max-width: 100%;
    height: 50vh;
    min-height: 250px;
}
.new_poster_wrap .poster-card img {
    width: 100%;
    max-width: 100% !important;
    max-width: min(280px, 85vw);
    height: auto;
    aspect-ratio: 2/3;
    object-fit: cover;
}
.new_media_strip .swiper-slide {
    min-width: 160px;
}
.new_media_strip .swiper-slide img {
    height: 180px;
    width: 100%;
    object-fit: cover;
}
.new_related_section .related-card img {
    width: 200px;
    height: 300px;
}
    iframe.carousel-media-modal__video {
		width: 100%;
		max-width: 100%;
		height: 50vh;
		min-height: 250px;
}
	   /* Production detail scroll at 576px */
	   .content-production-detail .hero {
		   overflow: visible;
		   min-height: auto;
	   }
	   .content-production-detail .hero-inner {
		   min-height: auto;
	   }
	   .content-production-detail .film-content,
	   .content-production-detail .info-container {
		   height: auto;
	   }
   }