@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Italianno&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap');


/*------------------------------------------------*/
/* Variable STYLES */
/*------------------------------------------------*/

:root {
    /* Color Palette */
    --color-h1: #111;  
    --color-h2: #666;  
    --color-h3: #666;
    --color-text: #666;
    
    --color-link: #666; 
    --color-hover: #999;  
    
    --color-hr-border: #999;  
    
    --button-bg-link:#666;  
    --button-bg-hover: #FFF;
    
    /* Typography */
    --font-family-base: "Nunito", sans-serif;
    --font-family-heading: "Italianno", cursive;
    --font-size-normal: 1rem;

    /* Top Level Menu */
    --color-topmenu-link: #666;
    --color-topmenu-hover: #999;
    --color-topmenu-border-link: 2px solid transparent;
    --color-topmenu-border-hover: 2px solid #999;

    --font-size-topmenu: 20px;
    --background-color-up: transparent;
    --background-color-down: transparent;
    --font-weight-topmenu: 400;

    }

/*------------------------------------------------*/
/* Global STYLES */
/*------------------------------------------------*/

a:link, a:visited, a:active {

    color:var(--color-link);
    text-decoration: none; 
	-webkit-transition:all ease .3s; 
	transition:all ease .3s;

}

a:hover {
        color:var(--color-hover); 
        text-decoration: none;
		-webkit-transition:all ease .3s; 
		transition:all ease .3s;
}

html, body {
  height: 100%;
  background: #eae8e9;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.2;
    margin: 0 0 10px 0;
}

h1 {

    margin-bottom: 10px;
    color: #666;
    font-family: var(--font-family-heading);
    font-weight:400;
    font-size:3rem;
}

h2 {
    font-size: 24px;
	color:var(--color-h2);
	font-weight:300;
	font-family: var(--font-family-base);
}

h3 {
    font-size: 20px;
    color:var(--color-h3);
	font-weight:300;
}

h4 {
    font-size: 18px;
    color: #111;
}

h5  {
    font-size: 14px;
    color: #111;
}

h6  {
    font-size: 13px;
    color: #666;
}

p {
    margin: 0 0 25px 0;
    font-size:var(--font-size-normal);
}

hr {
    clear: both;
    height: 0;
    border: var(--color-hr-border);
    border-width: 1px 0 0;
    margin: 20px 0 20px 0;
}

div, p {line-height:24px;}

td {color:var(--color-text);padding:5px;line-height:18px; font-size:var(--font-size-normal);font-family: var(--font-family-base);}

ul li {
    font-size:var(--font-size-normal); 
	color:#222;
	margin-bottom: 8px;
	}

ol li {
    list-style-type: decimal;
    margin-bottom: 8px;
	font-size:var(--font-size-normal); 
}

ol ol {
    margin-top: 8px;
    margin-left: 30px;
}

    ol ol li {
        list-style-type: lower-roman;
    }

    ol ol ol li {
        list-style-type: lower-alpha;
    }

ol ul li {
    list-style-type: lower-roman;
}


/*------------------------------------------------*/
/* Responsive Video and Image STYLE */
/*------------------------------------------------*/

img {
	max-width: 100%;
	height:auto;
}

.video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}

.video iframe,
.video object,
.video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-responsive{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}




.imglg{ transition: all .2s ease-in-out; }
.imglg:hover { transform: scale(1.02); }


.page-break-section {box-shadow:none !important;background:transparent !important;}



/* ==============================================
   CHEVRON (Custom Arrow for Dropdowns)
   ============================================== */

/* Prepare dropdown link for arrow positioning */
#dnnMenu .dropdown-toggle {
    position: relative;
    padding-right: 30px; /* Space for arrow */
}

/* Replace Bootstrap triangle */
#dnnMenu .dropdown-toggle::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    transition: transform .25s ease;
    border-top: none;
    border-left: none;
}

/* Rotate arrow when open */
#dnnMenu li.show > .dropdown-toggle::after {
    transform: translateY(-50%) rotate(225deg);
}



/* ==============================================
   TOP LEVEL NAVIGATION (DESKTOP BASE)
   ============================================== */

#dnnMenu .topLevel {
    list-style: none;
    padding: 0;
    margin: 0;
}

#dnnMenu .topLevel > li {
    position: relative;
}

#dnnMenu .topLevel > li > a {
    text-transform: uppercase;
    padding: 8px 14px;
    margin: 0 8px;
    background: var(--background-color-up);
    color: var(--color-topmenu-link);
    border-bottom: var(--color-topmenu-border-link);
    transition: all .3s ease;
    font-size: var(--font-size-topmenu);
    font-weight: var(--font-weight-topmenu);
    display: inline-block;
}

/* Hover / Active / Open */
#dnnMenu .topLevel > li > a:hover,
#dnnMenu .topLevel > li > a:focus,
#dnnMenu .topLevel > li.active > a,
#dnnMenu .topLevel > li.show > a {
    color: var(--color-topmenu-hover);
    background: var(--background-color-down);
    border-bottom: var(--color-topmenu-border-hover);
}



/* ==============================================
   DESKTOP DROPDOWN STYLING
   ============================================== */

@media (min-width: 993px) {

    #dnnMenu .dropdown-menu {
        border-radius: 0;
        background: #f5f5f5;
        padding: 0;
        margin-top: 0;
        border: none;
        min-width: 220px;
        box-shadow: 0 10px 25px rgba(0,0,0,.08);
    }

    #dnnMenu .dropdown-menu li {
        border-bottom: 1px solid #e1e1e1;
    }

    #dnnMenu .dropdown-menu li:last-child {
        border-bottom: none;
    }

    #dnnMenu .dropdown-menu li > a {
        display: block;
        padding: 10px 16px;
        color: #333;
        font-size: 15px;
        text-align: left;
        transition: background .2s ease, color .2s ease;
    }

    #dnnMenu .dropdown-menu li > a:hover {
        background: #e9e9e9;
        color: #111;
    }

}



/* ==============================================
   NAVBAR TOGGLER (Mobile Button)
   ============================================== */

.navbar-toggler {
    margin-bottom: 3px;
    margin-top: -80px; /* Adjust if needed */
}

.navbar-toggler:focus {
    outline: none;
    box-shadow: none;
}



/* ==============================================
   MOBILE NAVIGATION (≤ 992px)
   ============================================== */

@media (max-width: 992px) {

    /* Stack menu vertically */
    #dnnMenu .topLevel {
        width: 100%;
        text-align: center;
    }

    #dnnMenu .topLevel > li {
        width: 100%;
        border-top: 1px solid rgba(0,0,0,.1);
    }

    /* Remove desktop underline styling */
    #dnnMenu .topLevel > li > a,
    #dnnMenu .topLevel > li.show > a,
    #dnnMenu .topLevel > li.active > a {
        border-bottom: none !important;
        background: transparent;
        margin: 0;
        padding: 14px 0;
        width: 100%;
        display: block;
    }

    /* Larger arrow for touch */
    #dnnMenu .dropdown-toggle::after {
        right: 18px;
        width: 10px;
        height: 10px;
    }

    /* Mobile dropdown container */
    #dnnMenu .dropdown-menu {
        position: static;
        box-shadow: none;
        background: #eeeeee;
        border-top: 1px solid rgba(0,0,0,.1);
    }

    /* Center dropdown links */
    #dnnMenu .dropdown-menu li > a {
        text-align: center;
        padding: 12px 0;
        border-bottom: 1px solid rgba(0,0,0,.05);
    }

    #dnnMenu .dropdown-menu li:last-child > a {
        border-bottom: none;
    }

}




/*------------------------------------------------*/
/* Global Button Styles */
/*------------------------------------------------*/


.MoreButton a:link, .MoreButton a:visited {
  padding: 16px 25px;
  text-align: center;
  color: #FFF;
  font-size:20px;
  display: inline-block;  border-radius:40px;
  border:1px solid var(--button-bg-link);
  background:var(--button-bg-link);
  font-family: var(--font-family-base);
  margin:3px 0 3px 0;
  -webkit-transition:all ease .5s; transition:all ease .5s;
}

.MoreButton a:hover, .MoreButton a:active {
  padding: 16px 25px;
  text-align: center;
  color: var(--button-bg-link);
  font-size:20px;
  display: inline-block;
  border:1px solid var(--button-bg-link);
  border-radius:40px;
  background:var(--button-bg-hover);
  font-family: var(--font-family-base);
  margin:3px 0 3px 0; 
  -webkit-transition:all ease .5s; transition:all ease .5s;
}


/*------------------------------------------------*/
/* Main Content STYLES */
/*------------------------------------------------*/


.hero-bg {
  width: 80vw;
  max-width: 1100px;
  aspect-ratio: 4 / 3;
  background: url('images/shan-watters_responsive_bg.webp') no-repeat center center;
  background-size: contain;
  margin:0 auto;
}

.hero-content{
  flex: 1;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hero-content > div {
    width: 100%;
}

.hero-bg{
  position:relative;
}


.hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  backdrop-filter: blur(6px);
  opacity:0;
  transition:opacity .4s ease;
}

.hero-bg.blur::after{
  opacity:1;
}

@media (max-width: 768px) {

    .hero {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .hero-content {
        flex: 1;
        display: flex;
        flex-direction: column; 
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .footerwrap {
        margin-top: auto;
    }

}
@media (max-width: 768px) {

    .hero-content {
        padding: 20px;
    }

    .footerwrap {
        padding-bottom: 10px;
    }

}

@media (max-width: 768px) {

    .hero-content img {
        max-height: 55vh;
        width: auto;
    }

}
/* ========================= */
/* HERO NAV DEFAULT (DESKTOP) */
/* ========================= */

.hero-nav {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    text-transform:uppercase;
    padding:25px;
    pointer-events: none;
}



.hero-nav .nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    pointer-events: all;
}

.hero-nav .nav {
    cursor: pointer;
}

/* FORCE LABEL FIRST */
.hero-nav .nav-label {
    order: 1;
}

/* FORCE ARROW SECOND */
.hero-nav .arrow {
    order: 2;
}



/* ========================= */
/* MOBILE FIX */
/* ========================= */

@media (max-width: 768px) {

    .hero-nav {
        position: fixed;
        top: 12%;
        left: 0;
        transform: none;
        display: flex;
        justify-content: space-between;
        padding: 0 10px;
        z-index: 9999;
        margin-top:15px;
    }

    .hero-nav .nav {
        background: transparent;
        backdrop-filter: blur(6px);
        border-radius: 30px;
        padding: 8px 14px;
        font-size: 0.75rem;
    }


    .hero-nav .arrow {
        transform: scale(0.8);
    }
}


@media (max-width: 768px) {
    .hero-nav {
        top: env(safe-area-inset-top, 12%);
    }
}




.arrow {
  width: 40px;
  height: 1px;
  background: #55614f;
  position: relative;

}

.arrow-left::before,
.arrow-right::before {
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-top: 1px solid #55614f;
  border-right: 1px solid #55614f;
}

.arrow-left::before {
  left: -4px;
  top: -4px;
  transform: rotate(-135deg);
}

.arrow-right::before {
  right: -4px;
  top: -4px;
  transform: rotate(45deg);
}
/* ===================================================== */
/* FLOATING PANEL SYSTEM */
/* ===================================================== */

.panel {
  position: fixed;
  inset: 0;
  z-index: 500;   /* raise this */
  pointer-events: none;
  visibility: hidden;
}

.panel.active {
  pointer-events: auto;
  visibility: visible;
}

.panel-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.05);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;
}




/* ===================================================== */
/* PANEL CARD (BASE - APPLIES TO DESKTOP + MOBILE) */
/* ===================================================== */

.panel-card {
  position: absolute;
  top: 50%;
  left: 50%;
  width: clamp(800px, 85vw, 1100px);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  background: rgba(234, 232, 233, 1);
  
  border-radius: 16px;
  box-shadow: 0 40px 120px rgba(0,0,0,0.12);
  overflow: hidden;
  transform: translate(-50%, -50%) scale(0.95);
  opacity: 0;
  transition:
    transform 0.6s cubic-bezier(0.77, 0, 0.175, 1),
    opacity 0.4s ease;
  z-index: 2;
    -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Subtle directional offset (desktop feel preserved) */
.panel-left .panel-card {
  transform: translate(-55%, -50%) scale(0.96);
}

.panel-right .panel-card {
  transform: translate(-45%, -50%) scale(0.96);
}

/* ===================================================== */
/* ACTIVE STATE */
/* ===================================================== */

.panel.active {
  pointer-events: auto;
}

.panel.active .panel-card {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.panel.active .panel-overlay {
  opacity: 1;
}

/* ===================================================== */
/* CLOSE BUTTON */
/* ===================================================== */

.close-btn {
  position: absolute;
  top: 40px;
  right: 40px;
  background: none;
  border: none;
  font-size: 26px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s ease;
  z-index: 5;
  border-radius:50%;
  padding:12px 7px 7px 7px;
}

.close-btn:hover {
  opacity: 1;
}

/* ===================================================== */
/* SCROLL AREA */
/* ===================================================== */

.panel-scroll {
  overflow-y: auto;
  flex: 1;
  padding: 1.5rem;
}
/* ===================================================== */
/* MOBILE REFINEMENTS */
/* ===================================================== */

@media (max-width: 768px) {

  .nav {
    font-size: 12px;
    letter-spacing: 1px;
  }

  .nav-left {
    left: 20px;
  }

  .nav-right {
    right: 20px;
  }

  .panel-card {
    width: 92vw;
    height: 85vh;
    border-radius: 14px;
  }

  .panel-scroll {
    padding: 80px 40px 40px;
  }
}


/* ===================================================== */
/* Gallery View */
/* ===================================================== */

.gallery-title {
    text-align: center;
    margin-bottom: 10px;
    color: #666;
    font-family: var(--font-family-heading);
    font-weight:400;
    font-size:3rem;
}

.gallery-sub-title {
    text-align: center;
    margin-bottom: 15px;
    color: #999;
    font-family: var(--font-family-base);
    font-weight:400;
    font-size:1rem;
}


.series-grid {
  display: flex;
  justify-content: center;
  gap: 60px;
  flex-wrap: wrap;
}

.series-card {
  cursor: pointer;
  text-align: center;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.series-card img {
  width: 220px;
  height: auto;
  box-shadow: 0 15px 40px rgba(0,0,0,0.06);
}

.series-card:hover {
  transform: translateY(-8px);
}

.series-name {
  margin-top: 20px;
  letter-spacing: 2px;
  font-size: 14px;
  text-transform: uppercase;
}

.gallery-slider-view {
  display: none;
}

.gallery-back {
  background: none;
  border: none;
  letter-spacing: 2px;
  margin-bottom: 40px;
  cursor: pointer;
}


.season-nav .nav-link.active{
    background:#c97a3c;
    color:white;
}




.season-intro-layout{
    display:flex;
    gap:60px;
    align-items:flex-start;
    max-width:1100px;
    margin:0 auto;
}


.season-intro-image img{
    width:100%;
    height:auto;
    display:block;
    box-shadow:0 20px 60px rgba(0,0,0,0.1);
}

.season-intro-content{
    width:100%
}

.season-intro-content h2{
    font-family: var(--font-family-heading);
    font-size:2.5rem;
    margin-bottom:20px;
}

.season-intro-text p {
    margin-bottom:18px;
    line-height:1.7;
    color:#555;
    font-size:var(--font-size-normal);
}

.season-swiper-wrap{
    display:none;
}

@media (max-width:768px){
    .season-intro-layout{
        flex-direction:column;
    }

    .season-intro-image,
    .season-intro-content{
        width:100%;
    }
}

/* ================================= */
/* Swiper Layout */
/* ================================= */

.gallery-swiper {
  width: 100%;
  height: auto;
  overflow:hidden;
}

/* Only apply full-width slides to cinematic galleries */
#gallery-panel .gallery-swiper .swiper-slide {
    width: 100%;little better balanced

}

.swiper-slide {
  display: flex;Version with darker mount
  justify-content: center;
  align-items: flex-start;
  height: auto;
}

.swiper {
  height: auto;
}


.slide-inner {
  display: flex;
  gap: 60px;
  max-width: 1000px;
  width: 100%;
  align-items: flex-start;
}

.slide-caption h3 {font-family: "Italianno", cursive;font-size:2.5rem;line-height:1.4;color:#666;}
.slide-caption p {font-family:var(--font-family-base);color:#666;line-height:1.2;font-size:1rem;}

.slide-inner img {
  width: 50%;
  height: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.08);
}

.slide-caption {
  width: 50%;
  padding-right: 20px; /* room for scrollbar */
}

.slide-inner img {
  width: 50%;
  height: auto;
  align-self: flex-start;
}

/* Mobile */

@media (max-width: 768px) {

  .slide-inner {
    flex-direction: column;
  }

  .slide-inner img,
  .slide-caption {
    width: 100%;
  }
}
.about-slide {
  display: block;
  width: 100%;
  max-width: 100%;
}
.about-slide h2 {
  letter-spacing: 3px;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.about-slide p {
  line-height: 1.7;
  margin-bottom: 18px;
  color: #444;
}

.about-slide img {
  box-shadow: 0 20px 60px rgba(0,0,0,0.08);
}

.about-slide {
  display: block;        /* remove flex behavior */
  max-width: none;       /* remove inherited width cap */
  width: 100%;
}
/* Mobile */
@media (max-width: 768px) {
  .about-inner {
    flex-direction: column;
    gap: 40px;
  }

  .about-image img {
    width: 100%;
  }
}

.about-slide .slide-caption {
  width: 100%;
}

#about-panel .gallery-swiper {
    min-height: 400px;
}

.about-slider-view {
  display: block;
}


/* Allow about slide to grow naturally */
#about-panel .swiper-slide {
  display: block;
  align-items: unset;
  height: auto;
}

/* Make swiper height follow content */
#about-panel .gallery-swiper {
  height: auto;
}

/* Make wrapper flexible */
#about-panel .swiper-wrapper {
  height: auto;
}

/* Ensure scroll container works */
#about-panel .panel-scroll {
  overflow-y: auto;
}

.slide-caption::-webkit-scrollbar {
  width: 6px;
}

.slide-caption::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.2);
  border-radius: 10px;
}
.gallery-swiper {
  padding:0 !important;
  box-sizing: border-box;
  height: 100%;
}

@media (max-width: 768px) {
  .gallery-swiper {
   padding:0 !important;
  }
}


/* ================================= */
/* Minimal Swiper Arrows */
/* ================================= */

.gallery-swiper .swiper-button-prev,
.gallery-swiper .swiper-button-next {
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  color: #666;
  opacity: 0.7;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.gallery-swiper .swiper-button-prev::after,
.gallery-swiper .swiper-button-next::after {
  font-size: 16px;   /* smaller arrow */
  font-weight: 300;  /* lighter feel */
}

.gallery-swiper .swiper-button-prev:hover,
.gallery-swiper .swiper-button-next:hover {
  opacity: 0.9;
  transform: scale(1.1);
}

.gallery-swiper .swiper-button-prev {
  left: 10px;
}

.gallery-swiper .swiper-button-next {
  right: 10px;
}
.gallery-swiper .swiper-button-prev,
.gallery-swiper .swiper-button-next {
  top: 50%;
  transform: translateY(-50%);
}

.gallery-swiper .swiper-button-prev,
.gallery-swiper .swiper-button-next {
  color: #999;
  opacity: 0.25;
}

.gallery-swiper .swiper-button-prev:hover,
.gallery-swiper .swiper-button-next:hover {
  opacity: 0.7;
}

.gallery-swiper .swiper-pagination-bullet {
  background: #999;
  opacity: 0.3;
}

.gallery-swiper .swiper-pagination-bullet-active {
  opacity: 0.8;
}

.gallery-swiper img {
  width: 100%;
  height: auto;
  display: block;
}

.slide-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.swiper-slide {
  height: auto !important;
}

.swiper-wrapper {
  align-items: stretch;
}
.panel-card {
  will-change: transform;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* ================================= */
/* Modern About Layout */
/* ================================= */
@media (max-width: 768px) {

  .about-image {
    float: none;
    width: 100%;
    margin: 0 0 30px 0;
  }

}
.about-content {
  max-width: 900px;
  margin: 0 auto;
  line-height: 1.8;
}

.about-image {
  float: left;
  width: 320px;
  max-width: 40%;
  margin: 0 40px 30px 0;
  height: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.08);
}

.about-content::after {
  content: "";
  display: block;
  clear: both;
}



/* ========================= */
/* STUDIO OVERLAY LAYOUT */
/* ========================= */



.studio-layout {
  align-items: flex-start;
}

.studio-content h2 {color:var(--color-text);font-family:var(--font-family-heading);font-size:48px;font-weight:normal;}

/* --- Studio Image Composition --- */

.studio-images{
  position: relative;
  max-width: 600px;
  margin: 0 auto 60px auto;   /* centers and adds breathing room under */
}

.studio-main{
  width: 600px;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
  display: block;
}

.studio-overlay{
  position: absolute;
  bottom: -40px;              /* makes it hang slightly */
  right: -40px;
  width: 40%;
  border-radius: 8px;
  box-shadow: 0 25px 70px rgba(0,0,0,0.25);
  background: #fff;
}

/* Breathing room for text below */
.slide-caption{
  max-width: 720px;

}

.slide-caption p{
  margin-bottom: 1.6rem;
  line-height: 1.75;
}

.studio-overlay {
  position: absolute;
  width: 45%;
  bottom: -40px;
  right: -40px;

  box-shadow: 0 25px 60px rgba(0,0,0,0.18);
  border-radius: 6px;

  transition: transform 0.4s ease;
}

@media (max-width: 768px) {

  .studio-layout {
    flex-direction: column;
  }

  .studio-images {
    width: 100%;
  }
  
  .studio-overlay {
    position: relative;
    bottom: auto;
    right: auto;
    width: 70%;
    margin: -40px auto 40px;
  }
}



/* ========================= */
/* STANDALONE SWIPER FIX */
/* ========================= */

.standalone-swiper {
    width: 100%;
}

.standalone-swiper .swiper-wrapper {
    display: flex !important;
    transition-timing-function: ease !important;
}

.standalone-swiper .swiper-slide {
    width: auto !important;
    flex-shrink: 0;
    backface-visibility: hidden;
    transform: translateZ(0);
    box-sizing: border-box;
    padding: 10px;
}

.standalone-swiper .slide-inner {
    display: block;
}

.standalone-swiper img {
    width: 100%;
    height: auto;
    display: block;
}

.standalone-swiper img {
    box-shadow: 0 15px 40px rgba(0,0,0,0.1);
    border-radius: 4px;
}

/* ================================= */
/* STUDIO SLIDE OVERRIDES */
/* ================================= */

.studio-layout .slide-inner {
  align-items: flex-start;
}

.studio-layout .studio-images {
  position: relative;
  width: 55%;
  flex-shrink: 0;
}

/* Remove the global 50% rule */
.studio-layout img {
  width: auto;
}

/* Main large image */
.studio-layout .studio-main {
  width: 100%;
  display: block;
  box-shadow: 0 30px 80px rgba(0,0,0,0.12);
}

/* Smaller offset image */
.studio-layout .studio-overlay {
  position: absolute;
  width: 45%;
  bottom: -40px;
  right: -40px;
  box-shadow: 0 25px 60px rgba(0,0,0,0.18);
  border-radius: 6px;
}

#about-panel .panel-scroll{
  width: 100%;
}

#about-panel .about-home-view,
#about-panel .about-section-view{
  width: 100%;
  max-width: 100%;
}

#about-panel .slide-caption{
  width: 100% !important;
  max-width: 900px;   /* optional aesthetic limit */
  margin: 0 auto;     /* center it */
}

.process-section{
  padding:0;
}

.process-section h2 {color:var(--color-text);font-family:var(--font-family-heading);font-size:56px;font-weight:normal;}
.process-section p {color:var(--color-text);font-family:var(--font-family-heading);font-size:38px;font-weight:300;}

.process-main-image{
  border-radius: 8px;
  box-shadow: 0 30px 80px rgba(0,0,0,0.15);
}

.process-subheading {
  font-size: 1.4rem;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin: 20px 0;
}

.process-thumb{
  border-radius: 6px;
  transition: transform .3s ease, box-shadow .3s ease;
  box-shadow: 0 15px 40px rgba(0,0,0,0.12);
}

.process-thumb:hover{
  transform: translateY(-6px);
  box-shadow: 0 25px 60px rgba(0,0,0,0.2);
}

/* ================================= */
/* GALLERY SLIDE QUICK FIX */
/* ================================= */

#gallery-panel .slide-inner{
  display:flex !important;
  flex-direction:row !important;
  align-items:center;
  gap:60px;
}

#gallery-panel .slide-inner img{
  width:48%;
  height:auto;
  flex-shrink:0;
}

#gallery-panel .slide-caption{
  width:50%;
}

/* Mobile stack */
@media (max-width:768px){

  #gallery-panel .slide-inner{
    flex-direction:column !important;
  }

  #gallery-panel .slide-inner img,
  #gallery-panel .slide-caption{
    width:100%;
  }

}

/* =========================
   STICKY PANEL BACK BUTTONS
========================= */

.about-back-btn,
.gallery-back-btn {
    position: sticky;
    top: 20px;
    z-index: 200;
    display: inline-flex;
    align-items: center;
    margin-bottom: 30px;
    backdrop-filter: blur(10px);
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 8px 20px rgba(0,0,0,.08);
    transition: .3s ease;
}

/* hover */
.about-back-btn:hover,
.gallery-back-btn:hover {
    transform: translateX(-3px);
    background: #fff;
}

/* ========================= */
/* Seasonal Tab Navigation */
/* ========================= */

.season-nav .nav-link{
  border-radius:30px;
  padding:10px 24px;
  margin:6px;
  font-size:.9rem;
  letter-spacing:1px;
  text-transform:uppercase;
  transition:all .3s ease;
  border: none !important;
}

/* Fall */

.season-fall{
  background:#e9ded1;
  color:#8a5b32;
}

.season-fall:hover{
  background:#d8c3ad;
}

/* Spring */

.season-spring{
  background:#e6efe6;
  color:#4c7a4c;
}

.season-spring:hover{
  background:#d4e6d4;
}

/* Summer */

.season-summer{
  background:#f4efd9;
  color:#9a8735;
}

.season-summer:hover{
  background:#ece3bb;
}

/* Winter */

.season-winter{
  background:#e7edf1;
  color:#4a6475;
}

/* ========================= */
/* Contact Button */
/* ========================= */

.contact-btn {
  background:#f0f0f0;
  color:#666;
}

.contact-btn:hover {
  background:#e2e2e2;
  color:#444;
}

.gallery-slider-view{
  margin-top:40px;
}
/* ========================= */
/* Season Tabs Layout Fix */
/* ========================= */

.season-tabs{
  position:relative;
  width:100%;
  display:block;
  margin-bottom:50px;
  z-index:2;
}

.season-nav{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
}

.season-nav .nav-item{
  position:relative;
}

.season-nav .nav-link{
  position:relative;
}

/* ---------- FIX SEASON TAB OVERLAY ---------- */

.sub-series-view{
    display:block;
}

.season-tabs{
    position:relative !important;
    display:block;
    width:100%;
    margin:30px auto 40px;
    z-index:1;
}

.season-nav{
    position:relative !important;
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
}

.gallery-artwork-view{
    position:relative;
    display:block;
    clear:both;
}




/* FORCE PANEL INTO CENTER FOR STATIC PAGE */
.panel-page {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 900;
}

/* SINGLE overlay layer (matches homepage feel) */
.panel-page::before{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.05);
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;
}

/* panel above overlay */
.panel-page .panel-card {
    position: relative !important;
    z-index: 1;

    top: auto !important;
    left: auto !important;

    transform: none !important;
    opacity: 1 !important;

    width: clamp(700px, 85vw, 1100px);
    max-height: 85vh;

    display: flex;
    flex-direction: column;
}

.panel-page .panel-scroll {
    overflow-y: auto;
    padding: 30px;
}

/* scroll area */
.panel-page .panel-scroll {
    overflow-y: auto;
    padding: 30px;
}



/* keep panel above */
.panel-page .panel-card{
    position: relative;
    z-index: 1;
}


.pricing-guide-wrap {
    max-width: 1100px;
    margin: 0 auto;
}

.pricing-guide-title {
    text-align: center;
    margin-bottom: 10px;
}

.pricing-guide-intro {
    text-align: center;
    margin-bottom: 40px;
    color: #666;
    line-height: 1.6;
}

/* GROUP */
.pricing-group {
    margin-bottom: 50px;
}

.pricing-group-title {
    font-size: 18px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* GRID */
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
}

/* CARD */
.pricing-card {
    background: #fff;
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.06);
    transition: all .3s ease;
}

.pricing-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 60px rgba(0,0,0,0.1);
}

/* PRICE */
.pricing-card .price {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 5px;
}

/* TITLE */
.pricing-card .title {
    font-weight: 600;
    margin-bottom: 5px;
}

/* META */
.pricing-card .meta {
    font-size: 14px;
    color: #777;
}

/* FEATURED CARD */
.pricing-card.featured {
    border: 2px solid #d6c6a5;
    background: #faf7f2;
}

/* DISABLED / NFS */
.pricing-card.disabled {
    opacity: 0.6;
}
body.panel-page-active {
    overflow: hidden;
    height: 100%;
}



/*------------------------------------------------*/
/* Cart Button STYLES */
/*------------------------------------------------*/

.art-purchase-btn{
    display:inline-block;
    padding:7px 15px;
    margin-top:0;
    border:1px solid #b9afa1;
    border-radius:40px;
    background:rgba(255,255,255,0.6);
    color:#666 !important;
    font-family: var(--font-family-base);
    font-size:.85rem;
    letter-spacing:2px;
    text-transform:uppercase;
    backdrop-filter: blur(6px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.05);
    transition: all .35s ease;
}

.art-purchase-btn:hover{
    color:#fff !important;
    background:#8c7b68;
    border-color:#8c7b68;
    transform:translateY(-2px);
    box-shadow:0 14px 35px rgba(0,0,0,0.12);
}

/* Sold State */
.art-purchase-btn-sold{
    background:#d8d8d8 !important;
    border-color:#c8c8c8 !important;
    color:#8a8a8a !important;
    cursor:default;
    pointer-events:none;
    box-shadow:none;
    opacity:.75;
    display:inline-block;
    padding:7px 15px;
    margin-top:0;
    border:1px solid #b9afa1;
    border-radius:40px;
    background:#d8d8d8 !important;
    border-color:#c8c8c8 !important;
    color:#8a8a8a !important;
    font-family: var(--font-family-base);
    font-size:.85rem;
    letter-spacing:2px;
    text-transform:uppercase;
    backdrop-filter: blur(6px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.05);
    transition: all .35s ease;
    text-decoration:none;
}

/* Prevent hover animation */
.art-purchase-btn-sold:hover{
    transform:none !important;
    background:#d8d8d8 !important;
    border-color:#c8c8c8 !important;
    color:#8a8a8a !important;
    box-shadow:none !important;
    text-decoration:none;
}





/* =========================
   HEALING WALL FEATURE
========================= */

.healing-gallery-section{
    padding:30px 0 80px;
}

.healing-feature{
    max-width:1100px;
    margin:0 auto;
}

.healing-image{
    text-align:center;
    margin-bottom:50px;
}

.healing-image img{
    width:100%;
    max-width:600px;
    border-radius:12px;
}

.healing-link{
    margin-top:20px;
}

.healing-link a{
    color:#666;
    text-decoration:none;
    letter-spacing:1px;
    text-transform:uppercase;
    font-size:.85rem;
    transition:.3s ease;
}

.healing-link a:hover{
    color:#000;
}

.healing-content{
    max-width:850px;
    margin:0 auto;
}

.healing-content .gallery-title{
    margin-bottom:30px;
    text-align:center;
}

.healing-content .lead-text{
    font-size:1.2rem;
    font-weight:600;
    line-height:1.7;
    margin-bottom:28px;
}

.healing-content p{
    font-size:1.05rem;
    line-height:1.9;
    margin-bottom:24px;
}

.healing-content blockquote{
    margin:40px 0;
    padding:30px;
    border-left:3px solid #bbb;
    background:#f7f7f7;
    font-style:italic;
    line-height:1.9;
}

.healing-content blockquote span{
    display:block;
    margin-top:18px;
    font-style:normal;
    font-size:.9rem;
    letter-spacing:1px;
    text-transform:uppercase;
    color:#777;
}





.hero-nav.hidden{
    opacity:0;
    pointer-events:none;
    visibility:hidden;

    transition:all .3s ease;
}



/*------------------------------------------------*/
/* Footer Content STYLES */
/*------------------------------------------------*/

.footerwrap{
  position: relative;
  width: 100%;
  background: #eae8e9;
  text-align: center;
  padding: 20px 0;
}

.footerlinks {padding-top:10px;font-size:18px;color:#CCC;text-align:center;}
.footerlinks h3 {font-size:20px;color:#CCC;text-align:left;font-weight:600;}
.footerlinks p {font-size:16px;color:#CCC;text-align:left;}

.footerlinks ul {
	list-style:none;
	margin:0;
	padding:10px 0 0 0;
}

.footerlinks ul li {
	list-style:none;
	margin:0;
}

.footerlinks li { text-align:left;font-size:11px;}

.footerlinks li a:link, .footerlinks li a:visited {color:#EEE;font-size:11px;-webkit-transition:all ease .5s; transition:all ease .5s;}
.footerlinks li a:hover, .footerlinks li a:active{color:#ec271c;font-size:11px;-webkit-transition:all ease .5s; transition:all ease .5s;}

.footerlinks a:link, .footerlinks a:visited {color:#CCC;font-size:11px;}
.footerlinks a:hover, .footerlinks a:active{color:#ec271c;font-size:11px;}

.login {color:#CCC;font-size:11px;}
.login li {color:#CCC;font-size:11px;}

a.login:visited {color:#CCC; font-size:11px; text-decoration:none;}
a.login:active {color:#CCC; font-size:11px; text-decoration:none;}
a.login:link {color:#CCC; font-size:11px; text-decoration:none;}
a.login:hover {color:#FFF; font-size:11px; text-decoration:underline;}

.copyright {font-size: 11px;color: #CCC;text-align:center;}

a.copyright:visited {color: #CCC; font-size:11px; text-decoration:none;}
a.copyright:active {color: #CCC; font-size:11px; text-decoration:none;}
a.copyright:link {color: #CCC; font-size:11px; text-decoration:none;}
a.copyright:hover {color: #FFF; font-size:11px; text-decoration:underline;}

.wecontrol {
    text-align: center;
    font-size: 11px;
    padding-top: 10px; 
	color: #CCC;
    border-top:1px solid #cbc2a8;
}

.wecontrol ul { 

  margin:0;
  padding:0;
}

.wecontrol ul li { 
  display: inline; 
  color: #CCC; 
  margin:0;
  padding:0;
  font-size:11px !important;
}

.wecontrol ul li a
{
   text-decoration: none;
   padding: 3px;
   color: #CCC;
}

.wecontrol ul li a:hover {
    color: #FFF;
    text-decoration:underline;
}

/*------------------------------------------------*/
/* @media Display STYLES */
/*------------------------------------------------*/


/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */

@media only screen and (max-width : 768px) {

}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
  
}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {

}

/* ========================= */
/* FORCE GRID MODE (FIX) */
/* ========================= */

.standalone-swiper .swiper-slide {
    width: calc((100% - 40px) / 3) !important;
    flex-shrink: 0;
}

/* kill cinematic layout */
.standalone-swiper .slide-inner {
    display: block !important;
    max-width: none !important;
    gap: 0 !important;
}

/* image fills card */
.standalone-swiper img {
    width: 100% !important;
    height: auto;
}

/* ensure flex behavior */
.standalone-swiper .swiper-wrapper {
    display: flex !important;
}



/* ========================= */
/* LEAF LAYER */
/* ========================= */

.leaf-layer {
    position: fixed;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 2;
}

/* Individual leaves */
.leaf {
    position: absolute;
    width: 18px;
    height: 18px;
    background: url('/portals/205/content/images/leaf.png') no-repeat center;
    background-size: contain;
    opacity: 0;

    animation: drift linear infinite;
}

/* Drift animation */
@keyframes drift {
    0%   { 
        transform: translateX(-10vw) translateY(0) rotate(0deg);
        opacity: 0;
    }

    10% {
        opacity: 0.5;
    }

    25%  { transform: translateX(25vw) translateY(10vh) rotate(90deg); }
    50%  { transform: translateX(50vw) translateY(20vh) rotate(180deg); }
    75%  { transform: translateX(75vw) translateY(30vh) rotate(270deg); }

    100% { 
        transform: translateX(110vw) translateY(40vh) rotate(360deg);
        opacity: 0;
    }
}