.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-15 .elementor-element.elementor-element-cfbe9a4{--display:flex;--min-height:875px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.89;--margin-top:-50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-15 .elementor-element.elementor-element-cfbe9a4::before, .elementor-15 .elementor-element.elementor-element-cfbe9a4 > .elementor-background-video-container::before, .elementor-15 .elementor-element.elementor-element-cfbe9a4 > .e-con-inner > .elementor-background-video-container::before, .elementor-15 .elementor-element.elementor-element-cfbe9a4 > .elementor-background-slideshow::before, .elementor-15 .elementor-element.elementor-element-cfbe9a4 > .e-con-inner > .elementor-background-slideshow::before, .elementor-15 .elementor-element.elementor-element-cfbe9a4 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-15 .elementor-element.elementor-element-8ee6f72{--display:flex;}.elementor-15 .elementor-element.elementor-element-e302040{--display:flex;}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-15 .elementor-element.elementor-element-ba7740b{--display:flex;}.elementor-15 .elementor-element.elementor-element-cb2b94e{--display:flex;}.elementor-15 .elementor-element.elementor-element-3e2ad60{--display:flex;--min-height:223px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-3e2ad60:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-3e2ad60 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-2ae9f9f{--display:flex;--min-height:1377px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-2ae9f9f:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-2ae9f9f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-8c545f2{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-2c4d25e{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-2c4d25e:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-2c4d25e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/1496.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-6d832a6{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-6d832a6:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-6d832a6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/podcast-editing-scaled.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-8b9ffc8{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-8b9ffc8:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-8b9ffc8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/22166.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-5088bd7{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-c616fb8{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-c616fb8:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-c616fb8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/3034.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-ccd5879{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-ccd5879:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-ccd5879 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/19059.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-9bdeb86{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-9bdeb86:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-9bdeb86 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/2150254684.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-65c5fc5{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-881f54b{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-881f54b:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-881f54b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/7927.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-f2cb335{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-f2cb335:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-f2cb335 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/Gemini_Generated_Image_jb201hjb201hjb20-scaled.png");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-d28f9b8{--display:flex;--min-height:500px;--justify-content:flex-end;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-15 .elementor-element.elementor-element-d28f9b8:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-d28f9b8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://1o1memeshow.com/wp-content/uploads/2026/01/2151941575.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-15 .elementor-element.elementor-element-d10ad26{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-15 .elementor-element.elementor-element-d10ad26:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-d10ad26 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-31b52dd{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-15 .elementor-element.elementor-element-5fa68ff{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:52px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-15 .elementor-element.elementor-element-5fa68ff:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-5fa68ff > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-fda516d{--display:flex;--min-height:882px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-15 .elementor-element.elementor-element-fda516d:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-fda516d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-97634d8{--display:flex;--min-height:613px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-15 .elementor-element.elementor-element-97634d8:not(.elementor-motion-effects-element-type-background), .elementor-15 .elementor-element.elementor-element-97634d8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#1A1A1A;}.elementor-15 .elementor-element.elementor-element-75fa88d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-15 .elementor-element.elementor-element-819aec2{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-button .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-button .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-15 .elementor-element.elementor-element-e8afdd1 .elementor-button{background-color:transparent;font-family:"Poppins", Sans-serif;font-weight:500;fill:#000000;color:#000000;background-image:linear-gradient(180deg, #B9932F 0%, #D4AF37 100%);border-radius:5px 5px 5px 5px;padding:17px 30px 17px 30px;}.elementor-15 .elementor-element.elementor-element-e8afdd1{padding:0px 0px 0px 0px;}.elementor-15 .elementor-element.elementor-element-e8afdd1 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-15 .elementor-element.elementor-element-04e4815 .elementor-button{background-color:#B9932F00;font-family:"Poppins", Sans-serif;font-weight:500;fill:#FFFFFF;color:#FFFFFF;border-style:solid;border-width:1px 1px 1px 1px;border-color:#F8CE0D;border-radius:5px 5px 5px 5px;padding:17px 30px 17px 30px;}.elementor-15 .elementor-element.elementor-element-04e4815{padding:0px 0px 0px 0px;}.elementor-15 .elementor-element.elementor-element-04e4815 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-15 .elementor-element.elementor-element-b4ffd62 .elementor-button{background-color:transparent;font-family:"Poppins", Sans-serif;font-weight:500;fill:#000000;color:#000000;background-image:linear-gradient(180deg, #25D366 0%, #029439 100%);border-radius:5px 5px 5px 5px;padding:17px 30px 17px 30px;}.elementor-15 .elementor-element.elementor-element-b4ffd62{padding:0px 0px 0px 0px;}.elementor-15 .elementor-element.elementor-element-c605dde{--display:flex;}.elementor-widget-icon-list .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-icon-list .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-15 .elementor-element.elementor-element-3f61e29 .elementor-icon-list-icon i{color:#D4AF37;transition:color 0.3s;}.elementor-15 .elementor-element.elementor-element-3f61e29 .elementor-icon-list-icon svg{fill:#D4AF37;transition:fill 0.3s;}.elementor-15 .elementor-element.elementor-element-3f61e29{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-15 .elementor-element.elementor-element-3f61e29 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-15 .elementor-element.elementor-element-3f61e29 .elementor-icon-list-item > a{font-family:"Poppins", Sans-serif;font-weight:400;}.elementor-15 .elementor-element.elementor-element-3f61e29 .elementor-icon-list-text{color:#E0E0E0;transition:color 0.3s;}/* Start custom CSS for html, class: .elementor-element-4cb631b *//* =========================================
   LAYOUT & SPACING FIXES
   ========================================= */
.cinema-hero {
  background: transparent !important;
  text-align: center;
  padding: 40px 20px; /* Reduced top/bottom padding */
  max-width: 1200px;
  margin: 0 auto;
}

.cinema-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  color: #d4af37;
  border: 1px solid rgba(212, 175, 55, 0.35);
  margin-bottom: 15px; /* REDUCED SPACE below badge */
  background: transparent;
}

.cinema-title {
  font-family: "Playfair Display", serif;
  font-size: clamp(38px, 5vw, 68px);
  line-height: 1.1; /* Tighter line height */
  letter-spacing: -0.5px;
  margin: 0 0 20px; /* REDUCED SPACE below title */
}

/* This fixes the space between the 3 lines of text */
.title-line {
  display: block; /* Forces each onto a new line */
  margin-bottom: 5px; /* Very small gap between lines */
}

.text-white {
  color: #ffffff;
}

.cinema-subtitle {
  font-family: "Inter", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.65);
  max-width: 720px;
  margin: 0 auto;
}

/* =========================================
   ANIMATIONS (The part that was missing)
   ========================================= */

/* 1. GOLD GRADIENT TEXT (Moving Color) */
.anim-gradient-text {
  background: linear-gradient(
    90deg, 
    #d4a017 0%, 
    #ffe680 50%, 
    #d4a017 100%
  );
  background-size: 200% auto;
  
  /* Essential for text gradient */
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  
  display: inline-block; /* Required for transform/float */
  animation: shimmer 3s linear infinite; /* 3s speed */
}

@keyframes shimmer {
  to { background-position: 200% center; }
}

/* 2. FLOATING ANIMATION (Bobbing Up/Down) */
.anim-float {
  /* We use 'animation' shorthand to combine float + shimmer if needed, 
     but since shimmer is on background, we separate them if possible. 
     Here we apply the float transform on top of the gradient. */
  animation: shimmer 3s linear infinite, gentleFloat 4s ease-in-out infinite;
}

@keyframes gentleFloat {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-10px); }
  100% { transform: translateY(0px); }
}

/* 3. FADE UP (Entrance) */
.anim-fade-up {
  opacity: 0; /* Starts hidden */
  animation: fadeUp 0.8s ease-out forwards;
}

/* If an element has multiple animations, we chain them: */
.anim-gradient-text.anim-fade-up.anim-float {
  animation: 
    fadeUp 0.8s ease-out forwards, 
    shimmer 3s linear infinite, 
    gentleFloat 4s ease-in-out infinite;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Delays */
.delay-1 { animation-delay: 0.1s; }
.delay-2 { animation-delay: 0.3s; }
.delay-3 { animation-delay: 0.5s; }/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e0dc370 *//* ===== WRAPPER (CENTER FIX) ===== */
.cta-buttons {
  display: flex;
  justify-content: center;   /* center horizontally */
  align-items: center;       /* center vertically */
  gap: 18px;
  width: 100%;
}

/* ===== BASE BUTTON ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  border-radius: 12px;       /* ⬅️ less rounded */
  font-family: Inter, sans-serif;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
  white-space: nowrap;
  
  /* Important: Ensures transform animations stack correctly */
  position: relative; 
}

/* ===== GOLD ===== */
.btn-gold {
  background: linear-gradient(135deg, #e6c36a 0%, #cfa94a 100%);
  color: #111;
}

.btn-gold:hover {
  background: linear-gradient(135deg, #f1d27f 0%, #ddb85f 100%);
  /* Hover lift is handled generally below to avoid conflict */
  box-shadow: 0 10px 24px rgba(212, 175, 55, 0.35);
}

/* ===== OUTLINE ===== */
.btn-outline {
  background: transparent;
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.35);
}

.btn-outline:hover {
  background: linear-gradient(135deg, #1a1a1a 0%, #000000 100%);
  border-color: rgba(255, 255, 255, 0.6);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.6);
}

/* ===== WHATSAPP ===== */
.btn-whatsapp {
  background: linear-gradient(135deg, #25d366 0%, #1ebe57 100%);
  color: #ffffff;
}

.btn-whatsapp:hover {
  background: linear-gradient(135deg, #2ae070 0%, #22c55e 100%);
  box-shadow: 0 10px 24px rgba(37, 211, 102, 0.45);
}

/* ===== MOBILE ===== */
@media (max-width: 768px) {
  .cta-buttons {
    flex-wrap: wrap;
    gap: 12px;
  }

  .btn {
    padding: 12px 22px;
    font-size: 14px;
  }
}

/* =========================================
   FLOATING ANIMATIONS (Added)
   ========================================= */

@keyframes float-button {
    0%   { transform: translateY(0px); }
    50%  { transform: translateY(-8px); } /* Floats up 8px */
    100% { transform: translateY(0px); }
}

/* Style 1: Normal Speed */
.float-1 {
    animation: float-button 4s ease-in-out infinite;
}

/* Style 2: Slower + Delayed */
.float-2 {
    animation: float-button 5s ease-in-out infinite;
    animation-delay: 0.5s;
}

/* Style 3: Faster + Delayed */
.float-3 {
    animation: float-button 3.5s ease-in-out infinite;
    animation-delay: 1s;
}

/* Pause animation on hover so it's easier to click */
.btn:hover {
    animation-play-state: paused; 
    transform: translateY(-5px); /* Lift slightly on hover */
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e5be398 *//* ===== SECTION ===== */
.stats-strip{
  background: transparent !important;
  width: 100%;
  padding: 40px 18px 26px;
  position: relative;
}

/* subtle top hairline */
.stats-strip::before{
  content:"";
  position:absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: min(1100px, 92%);
  height: 1px;
  background: rgba(255,255,255,0.10);
}

/* ===== GRID ===== */
.stats-wrap{
  width: min(1100px, 92%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  text-align: center;
  align-items: center;
}

/* ===== TYPO ===== */
.stat-num{
  font-family: "Playfair Display", serif;
  font-size: clamp(34px, 4vw, 46px);
  line-height: 1;
  letter-spacing: 0.4px;
  color: #d4af37; /* luxury gold */
  margin-bottom: 8px;
}

.stat-label{
  font-family: Inter, sans-serif;
  font-size: 13px;
  letter-spacing: 0.2px;
  color: rgba(255,255,255,0.55);
}

/* ===== SCROLL / MOUSE ICON ===== */
.scroll-cue{
  width: 18px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(212,175,55,0.45);
  margin: 18px auto 0;
  position: relative;
  background: transparent;
}

.scroll-dot{
  width: 4px;
  height: 6px;
  border-radius: 999px;
  background: rgba(212,175,55,0.75);
  position: absolute;
  left: 50%;
  top: 8px;
  transform: translateX(-50%);
  animation: scrollDot 1.6s ease-in-out infinite;
}

@keyframes scrollDot{
  0%   { transform: translateX(-50%) translateY(0);   opacity: 0.85; }
  60%  { transform: translateX(-50%) translateY(9px); opacity: 0.15; }
  100% { transform: translateX(-50%) translateY(0);   opacity: 0.85; }
}

/* ===== MOBILE ===== */
@media (max-width: 768px){
  .stats-strip{ padding: 34px 16px 22px; }
  .stats-wrap{
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .stats-strip::before{
    width: min(520px, 92%);
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e6719e4 *//* Base Layout (Your Original Code) */
.spaces-head {
  background: transparent !important;
  text-align: center;
  padding: 42px 18px 18px;
  width: min(1100px, 92%);
  margin: 0 auto;
}

.spaces-kicker {
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: rgba(212,175,55,0.85);
  margin-bottom: 14px;
}

.spaces-title {
  margin: 0 0 14px;
  line-height: 1.08;
  letter-spacing: -0.6px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: clamp(34px, 4.8vw, 50px);
}

.t-white { color: #ffffff; }

.spaces-desc {
  margin: 0 auto;
  max-width: 720px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(255,255,255,0.55);
}

/* =========================================
   NEW ANIMATION STYLES
   ========================================= */

.anim-float-text {
  /* 1. Gradient Color Setup */
  background: linear-gradient(
    90deg, 
    #d4af37 0%,   /* Darker Gold */
    #ffe680 50%,  /* Light Gold (Shimmer) */
    #d4af37 100%  /* Darker Gold */
  );
  background-size: 200% auto; /* Make background bigger so it can move */
  
  /* Clip background to text */
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;

  /* Ensure it behaves like a block so it can float properly */
  display: inline-block;

  /* 2. Combine Animations: Shimmer (Color) + Float (Movement) */
  animation: 
    shimmer 3s linear infinite, 
    gentleFloat 4s ease-in-out infinite;
}

/* Keyframe: Color Shimmer */
@keyframes shimmer {
  0%   { background-position: 0% center; }
  100% { background-position: 200% center; }
}

/* Keyframe: Floating Up/Down */
@keyframes gentleFloat {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-8px); } /* Moves up 8px */
  100% { transform: translateY(0px); }
}

/* Media Queries */
@media (max-width: 768px){
  .spaces-head{ padding: 34px 16px 14px; }
  .spaces-desc{ font-size: 13.5px; }
}

@media (min-width: 992px){
  .anim-float-text { white-space: nowrap; }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-ef82160 */.cinematic-card-content{
  position: relative;
  z-index: 2;              /* above the overlay ::before */
  height: 100%;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

/* Small Gold Label */
.card-meta{
  color: #D4AF37;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Main Title */
.card-title{
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
  color: #fff;
}

/* Description */
.card-desc{
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.68);
  margin: 0 0 16px 0;
}

/* Features */
.card-features{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: grid;
  gap: 10px;
}

.card-features li{
  display: flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.86);
  font-weight: 500;
}

.check{
  color: #D4AF37;
  margin-right: 10px;
  font-weight: 700;
}

/* CTA */
.card-btn{
  text-decoration: none;
  color: #D4AF37;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.card-btn .arrow{
  transition: transform .25s ease;
}

.card-btn:hover .arrow{
  transform: translateX(5px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-2c4d25e *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-2c4d25e{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-2c4d25e::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-2c4d25e:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-2c4d25e .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-2c4d25e:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-2c4d25e{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-2c4d25e .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-2c4d25e .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-2c4d25e .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-2c4d25e:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-2c4d25e:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-2c4d25e:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-74f8cb8 *//* =========================
   B) TEXT OVERLAY (HTML)
   Class: studio-card__content
========================= */

.studio-card__content{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 26px 26px 22px;
  z-index: 5;

  /* start state (visible but minimal) */
  transform: translateY(56px);
  opacity: 0.0;
  transition: transform .45s ease, opacity .45s ease;
}

/* show content only on hover */
.studio-card:hover .studio-card__content{
  transform: translateY(0);
  opacity: 1;
}

/* kicker */
.studio-kicker{
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: rgba(212,175,55,0.85);
  margin-bottom: 10px;
}

/* title */
.studio-title{
  font-family: "Poppins", sans-serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.05;
  color: #ffffff;
  margin-bottom: 10px;
}

/* description */
.studio-desc{
  font-family: "Poppins", sans-serif;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255,255,255,0.62);
  max-width: 520px;
  margin-bottom: 14px;

  /* clamp like the screenshot (ellipsis) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* list (with check icon) */
.studio-list{
  list-style: none;
  padding: 0;
  margin: 0 0 16px 0;
  display: grid;
  gap: 10px;
}

.studio-list li{
  position: relative;
  padding-left: 22px;
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,0.80);
}

.studio-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color: rgba(212,175,55,0.95);
}

/* CTA */
.studio-cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: rgba(212,175,55,0.95);
  text-decoration: none;
  padding: 10px 0 0;
}

.studio-cta .arrow{
  transition: transform .25s ease;
}

.studio-card:hover .studio-cta .arrow{
  transform: translateX(4px);
}

/* MOBILE: always show the text (no hover on phones) */
@media (max-width: 768px){
  .studio-card__content{
    opacity: 1;
    transform: translateY(0);
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6d832a6 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-6d832a6 {
    position: relative;
    /* Invisible border initially to prevent jumping */
    border: 1px solid rgba(255, 255, 255, 0.05); 
    border-radius: 20px; 
    overflow: hidden; /* Rounds the image corners */
    transition: all 0.4s ease-in-out;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-6d832a6::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Darker fade at bottom so text is readable */
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.4) 40%, transparent 100%);
    z-index: 1;
    transition: 0.5s ease;
}

/* 3. HOVER EFFECT: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-6d832a6:hover {
    border-color: #D4AF37; 
    /* IMPORTANT FIX: 'inset' makes the glow appear INSIDE the box so it isn't cut off */
    box-shadow: inset 0 0 35px rgba(212, 175, 55, 0.6); 
}

/* 4. ANIMATION: Hide/Show Text Content */

/* Initially Hidden */
.elementor-15 .elementor-element.elementor-element-6d832a6 .card-hidden-content {
    opacity: 0;
    max-height: 0;
    transform: translateY(20px);
    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); /* Smooth cinematic ease */
}

/* Reveal on Hover */
.elementor-15 .elementor-element.elementor-element-6d832a6:hover .card-hidden-content {
    opacity: 1;
    max-height: 300px; /* ample space for text */
    transform: translateY(0);
    margin-top: 15px;
}

/* Optional: Zoom Background Image slightly on hover */
.elementor-15 .elementor-element.elementor-element-6d832a6:hover .elementor-background-overlay, 
.elementor-15 .elementor-element.elementor-element-6d832a6:hover img {
    transform: scale(1.05);
    transition: transform 1.2s ease;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b8c8343 */.cinematic-card-content{
  position: relative;
  z-index: 2;              /* above the overlay ::before */
  height: 100%;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

/* Small Gold Label */
.card-meta{
  color: #D4AF37;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Main Title */
.card-title{
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
  color: #fff;
}

/* Description */
.card-desc{
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.68);
  margin: 0 0 16px 0;
}

/* Features */
.card-features{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: grid;
  gap: 10px;
}

.card-features li{
  display: flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.86);
  font-weight: 500;
}

.check{
  color: #D4AF37;
  margin-right: 10px;
  font-weight: 700;
}

/* CTA */
.card-btn{
  text-decoration: none;
  color: #D4AF37;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.card-btn .arrow{
  transition: transform .25s ease;
}

.card-btn:hover .arrow{
  transform: translateX(5px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-8b9ffc8 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-8b9ffc8{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-8b9ffc8::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-8b9ffc8:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-8b9ffc8 .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-8b9ffc8:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-8b9ffc8{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-8b9ffc8 .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-8b9ffc8 .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-8b9ffc8 .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-8b9ffc8:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-8b9ffc8:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-8b9ffc8:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c0cdcea */.cinematic-card-content{
  position: relative;
  z-index: 2;              /* above the overlay ::before */
  height: 100%;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

/* Small Gold Label */
.card-meta{
  color: #D4AF37;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Main Title */
.card-title{
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
  color: #fff;
}

/* Description */
.card-desc{
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.68);
  margin: 0 0 16px 0;
}

/* Features */
.card-features{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: grid;
  gap: 10px;
}

.card-features li{
  display: flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.86);
  font-weight: 500;
}

.check{
  color: #D4AF37;
  margin-right: 10px;
  font-weight: 700;
}

/* CTA */
.card-btn{
  text-decoration: none;
  color: #D4AF37;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.card-btn .arrow{
  transition: transform .25s ease;
}

.card-btn:hover .arrow{
  transform: translateX(5px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c616fb8 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-c616fb8{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-c616fb8::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-c616fb8:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-c616fb8 .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-c616fb8:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-c616fb8{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-c616fb8 .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-c616fb8 .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-c616fb8 .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-c616fb8:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-c616fb8:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-c616fb8:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-64884cd *//* =========================
   B) TEXT OVERLAY (HTML)
   Class: studio-card__content
========================= */

.studio-card__content{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 26px 26px 22px;
  z-index: 5;

  /* start state (visible but minimal) */
  transform: translateY(56px);
  opacity: 0.0;
  transition: transform .45s ease, opacity .45s ease;
}

/* show content only on hover */
.studio-card:hover .studio-card__content{
  transform: translateY(0);
  opacity: 1;
}

/* kicker */
.studio-kicker{
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: rgba(212,175,55,0.85);
  margin-bottom: 10px;
}

/* title */
.studio-title{
  font-family: "Poppins", sans-serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.05;
  color: #ffffff;
  margin-bottom: 10px;
}

/* description */
.studio-desc{
  font-family: "Poppins", sans-serif;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255,255,255,0.62);
  max-width: 520px;
  margin-bottom: 14px;

  /* clamp like the screenshot (ellipsis) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* list (with check icon) */
.studio-list{
  list-style: none;
  padding: 0;
  margin: 0 0 16px 0;
  display: grid;
  gap: 10px;
}

.studio-list li{
  position: relative;
  padding-left: 22px;
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,0.80);
}

.studio-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color: rgba(212,175,55,0.95);
}

/* CTA */
.studio-cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: rgba(212,175,55,0.95);
  text-decoration: none;
  padding: 10px 0 0;
}

.studio-cta .arrow{
  transition: transform .25s ease;
}

.studio-card:hover .studio-cta .arrow{
  transform: translateX(4px);
}

/* MOBILE: always show the text (no hover on phones) */
@media (max-width: 768px){
  .studio-card__content{
    opacity: 1;
    transform: translateY(0);
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-ccd5879 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-ccd5879 {
    position: relative;
    /* Invisible border initially to prevent jumping */
    border: 1px solid rgba(255, 255, 255, 0.05); 
    border-radius: 20px; 
    overflow: hidden; /* Rounds the image corners */
    transition: all 0.4s ease-in-out;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-ccd5879::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Darker fade at bottom so text is readable */
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.4) 40%, transparent 100%);
    z-index: 1;
    transition: 0.5s ease;
}

/* 3. HOVER EFFECT: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-ccd5879:hover {
    border-color: #D4AF37; 
    /* IMPORTANT FIX: 'inset' makes the glow appear INSIDE the box so it isn't cut off */
    box-shadow: inset 0 0 35px rgba(212, 175, 55, 0.6); 
}

/* 4. ANIMATION: Hide/Show Text Content */

/* Initially Hidden */
.elementor-15 .elementor-element.elementor-element-ccd5879 .card-hidden-content {
    opacity: 0;
    max-height: 0;
    transform: translateY(20px);
    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); /* Smooth cinematic ease */
}

/* Reveal on Hover */
.elementor-15 .elementor-element.elementor-element-ccd5879:hover .card-hidden-content {
    opacity: 1;
    max-height: 300px; /* ample space for text */
    transform: translateY(0);
    margin-top: 15px;
}

/* Optional: Zoom Background Image slightly on hover */
.elementor-15 .elementor-element.elementor-element-ccd5879:hover .elementor-background-overlay, 
.elementor-15 .elementor-element.elementor-element-ccd5879:hover img {
    transform: scale(1.05);
    transition: transform 1.2s ease;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f7ccf61 */.cinematic-card-content{
  position: relative;
  z-index: 2;              /* above the overlay ::before */
  height: 100%;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

/* Small Gold Label */
.card-meta{
  color: #D4AF37;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Main Title */
.card-title{
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
  color: #fff;
}

/* Description */
.card-desc{
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.68);
  margin: 0 0 16px 0;
}

/* Features */
.card-features{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: grid;
  gap: 10px;
}

.card-features li{
  display: flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.86);
  font-weight: 500;
}

.check{
  color: #D4AF37;
  margin-right: 10px;
  font-weight: 700;
}

/* CTA */
.card-btn{
  text-decoration: none;
  color: #D4AF37;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.card-btn .arrow{
  transition: transform .25s ease;
}

.card-btn:hover .arrow{
  transform: translateX(5px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-9bdeb86 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-9bdeb86{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-9bdeb86::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-9bdeb86:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-9bdeb86 .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-9bdeb86:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-9bdeb86{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-9bdeb86 .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-9bdeb86 .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-9bdeb86 .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-9bdeb86:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-9bdeb86:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-9bdeb86:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d60d5e7 */.cinematic-card-content{
  position: relative;
  z-index: 2;              /* above the overlay ::before */
  height: 100%;
  padding: 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: #fff;
  font-family: "Poppins", sans-serif;
}

/* Small Gold Label */
.card-meta{
  color: #D4AF37;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 8px;
}

/* Main Title */
.card-title{
  font-size: 32px;
  font-weight: 700;
  margin: 0;
  line-height: 1.1;
  color: #fff;
}

/* Description */
.card-desc{
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,0.68);
  margin: 0 0 16px 0;
}

/* Features */
.card-features{
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: grid;
  gap: 10px;
}

.card-features li{
  display: flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.86);
  font-weight: 500;
}

.check{
  color: #D4AF37;
  margin-right: 10px;
  font-weight: 700;
}

/* CTA */
.card-btn{
  text-decoration: none;
  color: #D4AF37;
  font-size: 15px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.card-btn .arrow{
  transition: transform .25s ease;
}

.card-btn:hover .arrow{
  transform: translateX(5px);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-881f54b *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-881f54b{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-881f54b::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-881f54b:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-881f54b .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-881f54b:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-881f54b{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-881f54b .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-881f54b .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-881f54b .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-881f54b:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-881f54b:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-881f54b:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e1ca938 *//* =========================
   B) TEXT OVERLAY (HTML)
   Class: studio-card__content
========================= */

.studio-card__content{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 26px 26px 22px;
  z-index: 5;

  /* start state (visible but minimal) */
  transform: translateY(56px);
  opacity: 0.0;
  transition: transform .45s ease, opacity .45s ease;
}

/* show content only on hover */
.studio-card:hover .studio-card__content{
  transform: translateY(0);
  opacity: 1;
}

/* kicker */
.studio-kicker{
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: rgba(212,175,55,0.85);
  margin-bottom: 10px;
}

/* title */
.studio-title{
  font-family: "Poppins", sans-serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.05;
  color: #ffffff;
  margin-bottom: 10px;
}

/* description */
.studio-desc{
  font-family: "Poppins", sans-serif;
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255,255,255,0.62);
  max-width: 520px;
  margin-bottom: 14px;

  /* clamp like the screenshot (ellipsis) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* list (with check icon) */
.studio-list{
  list-style: none;
  padding: 0;
  margin: 0 0 16px 0;
  display: grid;
  gap: 10px;
}

.studio-list li{
  position: relative;
  padding-left: 22px;
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  color: rgba(255,255,255,0.80);
}

.studio-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color: rgba(212,175,55,0.95);
}

/* CTA */
.studio-cta{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: "Poppins", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: rgba(212,175,55,0.95);
  text-decoration: none;
  padding: 10px 0 0;
}

.studio-cta .arrow{
  transition: transform .25s ease;
}

.studio-card:hover .studio-cta .arrow{
  transform: translateX(4px);
}

/* MOBILE: always show the text (no hover on phones) */
@media (max-width: 768px){
  .studio-card__content{
    opacity: 1;
    transform: translateY(0);
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-f2cb335 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-f2cb335 {
    position: relative;
    /* Invisible border initially to prevent jumping */
    border: 1px solid rgba(255, 255, 255, 0.05); 
    border-radius: 20px; 
    overflow: hidden; /* Rounds the image corners */
    transition: all 0.4s ease-in-out;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-f2cb335::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* Darker fade at bottom so text is readable */
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.4) 40%, transparent 100%);
    z-index: 1;
    transition: 0.5s ease;
}

/* 3. HOVER EFFECT: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-f2cb335:hover {
    border-color: #D4AF37; 
    /* IMPORTANT FIX: 'inset' makes the glow appear INSIDE the box so it isn't cut off */
    box-shadow: inset 0 0 35px rgba(212, 175, 55, 0.6); 
}

/* 4. ANIMATION: Hide/Show Text Content */

/* Initially Hidden */
.elementor-15 .elementor-element.elementor-element-f2cb335 .card-hidden-content {
    opacity: 0;
    max-height: 0;
    transform: translateY(20px);
    transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); /* Smooth cinematic ease */
}

/* Reveal on Hover */
.elementor-15 .elementor-element.elementor-element-f2cb335:hover .card-hidden-content {
    opacity: 1;
    max-height: 300px; /* ample space for text */
    transform: translateY(0);
    margin-top: 15px;
}

/* Optional: Zoom Background Image slightly on hover */
.elementor-15 .elementor-element.elementor-element-f2cb335:hover .elementor-background-overlay, 
.elementor-15 .elementor-element.elementor-element-f2cb335:hover img {
    transform: scale(1.05);
    transition: transform 1.2s ease;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-d28f9b8 *//* 1. Main Container Setup */
.elementor-15 .elementor-element.elementor-element-d28f9b8{
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.05); /* prevents border jump */
  border-radius: 20px;
  overflow: hidden;
  transition: border-color .4s ease, box-shadow .4s ease, transform .4s ease;
}

/* 2. Dark Overlay (Gradient) */
.elementor-15 .elementor-element.elementor-element-d28f9b8::before{
  content:'';
  position:absolute;
  inset:0;
  background: linear-gradient(to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.45) 45%,
    rgba(0,0,0,0.00) 100%);
  z-index: 1;
  pointer-events: none;
  transition: opacity .5s ease;
}

/* 3. Hover: Gold Border + Inner Glow */
.elementor-15 .elementor-element.elementor-element-d28f9b8:hover{
  border-color: #D4AF37;
  box-shadow: inset 0 0 35px rgba(212,175,55,0.60);
  transform: translateY(-2px);
}

/* 4. Hide / Show Content */
.elementor-15 .elementor-element.elementor-element-d28f9b8 .card-hidden-content{
  opacity: 0;
  max-height: 0;
  transform: translateY(18px);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.elementor-15 .elementor-element.elementor-element-d28f9b8:hover .card-hidden-content{
  opacity: 1;
  max-height: 320px;
  transform: translateY(0);
  margin-top: 14px;
}

/* 5. Optional: Zoom background image on hover (Elementor-safe targets) */
.elementor-15 .elementor-element.elementor-element-d28f9b8{
  /* makes scaling smoother on some browsers */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.elementor-15 .elementor-element.elementor-element-d28f9b8 .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-d28f9b8 .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-d28f9b8 .elementor-background-video-container{
  transition: transform 1.2s ease;
  will-change: transform;
}

.elementor-15 .elementor-element.elementor-element-d28f9b8:hover .elementor-background-overlay,
.elementor-15 .elementor-element.elementor-element-d28f9b8:hover .elementor-background-slideshow,
.elementor-15 .elementor-element.elementor-element-d28f9b8:hover .elementor-background-video-container{
  transform: scale(1.05);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-31b52dd *//* ===== Content Services Menu (FINAL CSS – WHITE + GOLD ONLY) ===== */

.services-menu{
  --bg:##1A1A1A;
  --white:#ffffff;
  --text:#F3F3F5;
  --muted:#B7B7C2;
  --gold:#C8A75E;
  --border:rgba(255,255,255,.08);

  position:relative;
  padding:48px 18px;
  background:
    radial-gradient(1200px 700px at 30% 20%, rgba(255,255,255,.06), transparent 55%),
    radial-gradient(900px 600px at 70% 70%, rgba(200,167,94,.08), transparent 60%),
    var(--bg);
  color:var(--text);
  overflow:hidden;
}
e
/* Subtle luxury grid */
.services-menu::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:140px 140px;
  opacity:.07;
  mask-image: radial-gradient(circle at 25% 10%, black 0%, transparent 65%);
  pointer-events:none;
}

/* ===== Header ===== */
.services-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  max-width:1200px;
  margin:0 auto 26px;
  position:relative;
  z-index:1;
}

.kicker{
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:8px;
}

/* Title */
.title{
  font-size:40px;
  line-height:1.05;
  margin:0;
  font-weight:700;
  color:#ffffff; /* Content Services */
}

.title span{
  color:var(--gold); /* Menu */
}

/* View All Services button */
.view-all{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 18px;
  border-radius:14px;
  border:1px solid rgba(200,167,94,.6);
  color:#ffffff;
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  background: rgba(0,0,0,.25);
  backdrop-filter: blur(10px);
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease;
  white-space:nowrap;
}

.view-all .arrow{
  color:#ffffff;
  transition: transform .25s ease;
}

.view-all:hover{
  transform: translateY(-2px);
  background: rgba(200,167,94,.08);
  box-shadow: 0 12px 30px rgba(0,0,0,.45), 0 0 0 1px rgba(200,167,94,.15) inset;
  color:var(--gold);
}

.view-all:hover .arrow{
  transform: translateX(3px);
  color:var(--gold);
}

/* ===== Grid ===== */
.services-grid{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:22px;
  position:relative;
  z-index:1;
}

/* ===== Cards ===== */
.service-card{
  position:relative;
  border-radius:20px;
  padding:26px 26px 22px;
  border:1px solid var(--border);
  background:
    radial-gradient(900px 400px at 15% 20%, rgba(200,167,94,.18), transparent 55%),
    rgba(255,255,255,.02);
  min-height:210px;
  display:flex;
  flex-direction:column;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  overflow:hidden;
}

.service-card::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(700px 280px at 70% 0%, rgba(255,255,255,.06), transparent 60%);
  opacity:0;
  transition: opacity .28s ease;
  pointer-events:none;
}

.service-card:hover{
  transform: translateY(-8px);
  border-color: rgba(200,167,94,.35);
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
}

.service-card:hover::after{
  opacity:1;
}

/* Icon */
.icon{
  width:44px;
  height:44px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background: rgba(200,167,94,.12);
  border:1px solid rgba(200,167,94,.18);
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  margin-bottom:18px;
}

.icon svg{
  width:22px;
  height:22px;
  fill:var(--gold);
}

/* Card text */
.card-title{
  margin:0 0 10px;
  font-size:18px;
  font-weight:700;
  color:#ffffff;
}

.card-desc{
  margin:0 0 22px;
  color:rgba(243,243,245,.72);
  font-size:13px;
  line-height:1.6;
  max-width:420px;
}

/* Price */
.card-price{
  margin-top:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.06);
}

.card-price .label{
  font-size:12px;
  color:rgba(243,243,245,.55);
}

.card-price .amount{
  font-size:14px;
  font-weight:700;
  color:var(--gold);
}

/* ===== Card Color Accents (NO BLUE) ===== */
.g-gold{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(200,167,94,.30), transparent 60%),
    rgba(255,255,255,.02);
}

.g-olive{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(200,167,94,.18), transparent 60%),
    rgba(255,255,255,.02);
}

.g-wine{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(120,20,40,.28), transparent 60%),
    rgba(255,255,255,.02);
}

.g-green{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(0,120,90,.28), transparent 60%),
    rgba(255,255,255,.02);
}

.g-navy{
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(40,40,40,.45), transparent 60%),
    rgba(255,255,255,.02);
}

/* ===== Responsive ===== */
@media (max-width:980px){
  .title{ font-size:34px; }
  .services-grid{ grid-template-columns:repeat(2,1fr); }
}

@media (max-width:560px){
  .services-top{ flex-direction:column; }
  .services-grid{ grid-template-columns:1fr; }
  .title{ font-size:30px; }
}
.card-desc{
  margin-bottom:24px;
  font-size:13.5px;
  line-height:1.7;
}

/* =========================================
   1. STRONGER FLOATING ANIMATION
   ========================================= */
@keyframes float-up-down {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-12px); } /* Increased movement to 12px */
  100% { transform: translateY(0px); }
}

@keyframes gradient-move {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* =========================================
   2. CARD STYLING & APPLIED ANIMATION
   ========================================= */
.service-card {
  position: relative;
  border-radius: 20px;
  padding: 26px 26px 22px;
  border: 1px solid var(--border);
  min-height: 210px;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  /* --- ANIMATION SETTINGS --- */
  /* Name | Duration | Timing | Loop */
  animation: float-up-down 3.5s ease-in-out infinite;
  
  /* Important: Ensures animation is smooth */
  will-change: transform; 
  transition: border-color .3s, box-shadow .3s; /* Removed 'transform' from transition to avoid conflict */
}

/* Stagger the animations so they don't move all at once */
.service-card:nth-child(1) { animation-delay: 0s; }
.service-card:nth-child(2) { animation-delay: 0.5s; }
.service-card:nth-child(3) { animation-delay: 1s; }
.service-card:nth-child(4) { animation-delay: 1.5s; }
.service-card:nth-child(5) { animation-delay: 0.2s; }
.service-card:nth-child(6) { animation-delay: 0.7s; }

/* HOVER: Pause the floating so it's easy to click */
.service-card:hover {
  animation-play-state: paused;
  border-color: rgba(200,167,94,.5);
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
}

.service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(700px 280px at 70% 0%, rgba(255,255,255,.08), transparent 60%);
  opacity: 0;
  transition: opacity .3s ease;
  pointer-events: none;
}

.service-card:hover::after {
  opacity: 1;
}

/* =========================================
   3. COLORED GRADIENT BACKGROUNDS
   ========================================= */
/* We set background-size to 200% so the gradient has space to move */

.g-gold {
  background: radial-gradient(circle at center, rgba(200,167,94, 0.25), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 5s ease infinite;
}

.g-olive {
  background: radial-gradient(circle at center, rgba(140, 130, 80, 0.25), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 6s ease infinite;
}

.g-wine {
  background: radial-gradient(circle at center, rgba(160, 40, 60, 0.35), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 5s ease infinite;
}

.g-green {
  background: radial-gradient(circle at center, rgba(20, 90, 70, 0.35), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 6s ease infinite;
}

.g-slate {
  background: radial-gradient(circle at center, rgba(180, 140, 60, 0.15), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 7s ease infinite;
}

.g-wine2 {
  background: radial-gradient(circle at center, rgba(120, 60, 100, 0.30), transparent 70%);
  background-size: 200% 200%;
  animation: gradient-move 5.5s ease infinite;
}

/* =========================================
   1. DEFINE THE FLOATING ANIMATION
   ========================================= */
@keyframes super-float {
  0%   { transform: translateY(0px); }
  50%  { transform: translateY(-16px); } /* Moving up 16 pixels */
  100% { transform: translateY(0px); }
}

/* =========================================
   2. APPLY TO CARDS
   ========================================= */
.service-card {
  position: relative;
  border-radius: 20px;
  padding: 26px 26px 22px;
  border: 1px solid var(--border);
  min-height: 210px;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  /* --- ACTIVATE FLOATING --- */
  animation: super-float 4s ease-in-out infinite;
  
  /* Force hardware acceleration for smooth movement */
  will-change: transform;
  
  /* Transition for border/shadow only (so they don't fight the float) */
  transition: border-color .3s ease, box-shadow .3s ease;
}

/* =========================================
   3. STAGGER THE MOVEMENT (Randomize)
   ========================================= */
/* This ensures they don't all move at the exact same time */
.service-card:nth-child(1) { animation-delay: 0s; }
.service-card:nth-child(2) { animation-delay: 1.5s; }
.service-card:nth-child(3) { animation-delay: 0.5s; }
.service-card:nth-child(4) { animation-delay: 2.5s; }
.service-card:nth-child(5) { animation-delay: 1s; }
.service-card:nth-child(6) { animation-delay: 2s; }

/* =========================================
   4. HOVER BEHAVIOR
   ========================================= */
.service-card:hover {
  /* Pause movement so the user can click easily */
  animation-play-state: paused;
  
  /* Keep it lifted while hovering */
  transform: translateY(-16px);
  
  border-color: rgba(200,167,94,.35);
  box-shadow: 0 18px 50px rgba(0,0,0,.55);
}

/* Keep your existing gradient overlay */
.service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(700px 280px at 70% 0%, rgba(255,255,255,.06), transparent 60%);
  opacity: 0;
  transition: opacity .28s ease;
  pointer-events: none;
}

.service-card:hover::after {
  opacity: 1;
}

/* =========================================
   HEADER ANIMATIONS
   ========================================= */

/* 1. Entrance Animation (Slide Up + Fade In) */
@keyframes fadeInUp {
  from { 
    opacity: 0; 
    transform: translateY(20px); 
    filter: blur(5px); /* Adds a cinematic focus pull effect */
  }
  to { 
    opacity: 1; 
    transform: translateY(0); 
    filter: blur(0);
  }
}

/* 2. Metallic Shine for the word "Menu" */
@keyframes gold-shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* =========================================
   APPLYING THE STYLES
   ========================================= */

.services-heading {
  position: relative;
  /* Optional: Ensures the text stays contained during animation */
  overflow: visible; 
}

/* Kicker: "WHAT WE DO" */
.kicker {
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 8px;
  
  /* Animation */
  opacity: 0; /* Start invisible */
  animation: fadeInUp 0.8s ease-out forwards;
  animation-delay: 0.2s; /* Waits 0.2s before starting */
}

/* Main Title: "Content Services" */
.title {
  font-size: 40px;
  line-height: 1.05;
  margin: 0;
  font-weight: 700;
  color: #ffffff;
  
  /* Animation */
  opacity: 0; /* Start invisible */
  animation: fadeInUp 0.8s ease-out forwards;
  animation-delay: 0.4s; /* Waits 0.4s (staggered after kicker) */
}

/* The word "Menu" - Gold + Shimmer */
.title span {
  /* Define the gold gradient for the text */
  background: linear-gradient(
    120deg, 
    #C8A75E 20%, 
    #FFF8E0 50%, 
    #C8A75E 80%
  );
  background-size: 200% auto;
  
  /* Clip background to text to make it metallic */
  -webkit-background-clip: text;
  background-clip: text;
  
  /* Make text transparent so the background shows through */
  -webkit-text-fill-color: transparent;
  color: transparent; 
  
  /* Continuous Shine Animation */
  animation: gold-shimmer 4s linear infinite;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-25cfc22 *//* =========================================================
   PRICING SECTION — SCOPED (will NOT affect navbar/menu)
   Wrapper class: .pricing-box
   ========================================================= */

.pricing-box{
  background:#1A1A1A;
  color:#ffffff;
  padding:60px 20px;
  font-family:'Poppins', sans-serif;
  position:relative;
  overflow:hidden;
}

/* soft gold glow */
.pricing-box::before{
  content:"";
  position:absolute;
  inset:-220px;
  background:
    radial-gradient(700px 380px at 50% 30%, rgba(191,160,104,0.12), transparent 60%),
    radial-gradient(650px 360px at 30% 85%, rgba(191,160,104,0.10), transparent 60%);
  pointer-events:none;
  z-index:0;
}

.pricing-box__wrap{
  max-width:1200px;
  margin:0 auto;
  position:relative;
  z-index:1;
}

/* Header */
.pricing-box__header{
  text-align:center;
  margin-bottom:50px;
}

.pricing-box__sub{
  display:block;
  color:#bfa068;
  font-size:0.8rem;
  letter-spacing:2px;
  text-transform:uppercase;
  font-weight:500;
  margin-bottom:10px;
}

.pricing-box__title{
  margin:0 0 18px 0;
  font-weight:600;
  font-size:3rem;
  line-height:1.15;
}

.pricing-box__gradient{
  background:linear-gradient(90deg,#ffffff 0%, #e6c88b 50%, #b88a44 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

.pricing-box__desc{
  color:#e0e0e0;
  max-width:600px;
  margin:0 auto;
  line-height:1.6;
  font-weight:300;
  font-size:0.98rem;
}

/* Grid */
.pricing-box__grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:30px;
  margin-bottom:40px;
}

/* Float animation (cards only) */
@keyframes pricingBoxFloat{
  0%{ transform:translateY(0); }
  50%{ transform:translateY(-15px); }
  100%{ transform:translateY(0); }
}

/* Card */
.pricing-box__card{
  background:#111111;
  border:1px solid #333333;
  border-radius:20px;
  padding:40px 30px;
  width:350px;
  display:flex;
  flex-direction:column;
  position:relative;

  animation:pricingBoxFloat 6s ease-in-out infinite;
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}

.pricing-box__card:nth-child(1){ animation-delay:0s; }
.pricing-box__card:nth-child(2){ animation-delay:1s; }
.pricing-box__card:nth-child(3){ animation-delay:2s; }

.pricing-box__card:hover{
  border-color:#bfa068;
  box-shadow:0 0 25px rgba(191,160,104,0.10);
}

.pricing-box__plan{
  margin:0 0 10px 0;
  font-size:1.8rem;
  text-align:center;
  font-weight:600;
}

.pricing-box__cardDesc{
  text-align:center;
  color:#d1d1d1;
  font-size:0.85rem;
  margin:0 0 18px 0;
  min-height:40px;
  font-weight:300;
}

.pricing-box__price{
  text-align:center;
  font-size:2.5rem;
  color:#e6c88b;
  margin:0 0 22px 0;
  font-weight:600;
}

.pricing-box__price span{
  font-size:1rem;
  color:#e0e0e0;
  font-weight:400;
}

/* ✅ LIST IS SCOPED (this fixes your navbar issue) */
.pricing-box__list{
  list-style:none;
  padding:0;
  margin:0 0 20px 0;
  flex-grow:1;
}

.pricing-box__list li{
  margin-bottom:12px;
  color:#f0f0f0;
  font-size:0.9rem;
  display:flex;
  align-items:center;
  font-weight:300;
}

.pricing-box__list li::before{
  content:"✓";
  color:#bfa068;
  margin-right:10px;
  font-weight:700;
}

/* More features */
.pricing-box__more{
  color:#bfa068;
  font-size:0.85rem;
  margin:0 0 18px 0;
  display:block;
  font-weight:400;
}

/* Buttons */
.pricing-box__btn{
  display:block;
  width:100%;
  text-align:center;
  text-decoration:none;
  border-radius:30px;
  font-weight:500;
  letter-spacing:0.5px;
  position:relative;
  overflow:hidden;

  background:linear-gradient(90deg,#bfa068,#d4af37);
  color:#000000;
  border:none;

  padding:15px;
  box-shadow:0 4px 15px rgba(0,0,0,0.30);
  transition:transform .35s ease, box-shadow .35s ease, filter .35s ease;
}

@keyframes pricingBoxGradientMove{
  0%{ background-position:0% 50%; }
  50%{ background-position:100% 50%; }
  100%{ background-position:0% 50%; }
}

.pricing-box__btn:hover{
  transform:scale(1.02);
  box-shadow:0 0 22px rgba(191,160,104,0.55);
  filter:brightness(1.03);

  background:linear-gradient(45deg,#a67c00,#ffdb73,#a67c00);
  background-size:200% 200%;
  animation:pricingBoxGradientMove 3s ease infinite;
}

/* Pro card extras */
.pricing-box__card--pro{
  border:1px solid #bfa068;
  box-shadow:0 0 20px rgba(191,160,104,0.08);
}

.pricing-box__badge{
  position:absolute;
  top:-15px;
  left:50%;
  transform:translateX(-50%);
  background:linear-gradient(90deg,#c49f60,#e8cf96);
  color:#000;
  padding:6px 20px;
  border-radius:20px;
  font-size:0.75rem;
  font-weight:700;
  text-transform:uppercase;
}

/* Bottom consultation */
.pricing-box__consult{
  max-width:500px;
  margin:0 auto;
  text-align:center;
}

.pricing-box__btn--large{
  padding:18px;
  font-weight:600;
  font-size:1rem;
}

/* Responsive */
@media (max-width:1100px){
  .pricing-box__grid{
    flex-direction:column;
    align-items:center;
  }
  .pricing-box__card{
    width:100%;
    max-width:420px;
  }
  .pricing-box__title{
    font-size:2.2rem;
  }
}

@media (max-width:520px){
  .pricing-box{
    padding:50px 16px;
  }
}
/* Title = WHITE */
.pricing-box__title{
  margin:0 0 18px 0;
  font-weight:600;
  font-size:3rem;
  line-height:1.15;
  color:#ffffff; /* FORCE WHITE */
}

/* Keep ONLY "Every Creator" gradient */
.pricing-box__gradient{
  background:linear-gradient(90deg,#ffffff 0%, #e6c88b 50%, #b88a44 100%);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
/* Card plan title (Starter / Pro / Elite) = WHITE */
.pricing-box__plan{
  color:#ffffff !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-d98dd86 */.hero-title {
  font-size: 56px;
  font-weight: 700;
  line-height: 1.15;
  color: #ffffff;
  text-align: center;
}

/* Animated gold text */
.animated-gold {
  display: inline-block;
  background: linear-gradient(
    90deg,
    #9e7c2f,
    #d4af37,
    #f6e7b2,
    #d4af37,
    #9e7c2f
  );
  background-size: 250% 100%;
  animation: goldSweep 5s linear infinite;

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Subtitle */
.hero-subtext {
  margin-top: 20px;
  text-align: center;
  font-size: 18px;
  color: rgba(255,255,255,0.7);
  max-width: 750px;
  margin-left: auto;
  margin-right: auto;
}

/* Left → Right movement */
@keyframes goldSweep {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}/* End custom CSS */