:root {
     --wine: #61152E;
     --wine-dark: #4F0920;
     --rose: #c43d70;
     --rose-light: #f7d5e2;
     --champagne: #e9c98a;
     --cream: #fffaf7;
     --soft: #f8f2f5;
     --dark: #170c13;
     --muted: #746871;
     --white: #ffffff;
     --shadow: 0 25px 70px rgba(47, 13, 31, .13);
     --radius: 28px;
 }

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 html,
 body {
     scroll-behavior: smooth;
     overflow-x: hidden;
 }

 body {
     font-family: 'Times New Roman', Times, serif;
     color: var(--dark);
     background: var(--cream);
     overflow-x: hidden;
     padding-top: 60px;
 }

 h1,
 h2,
 h3,
 h4,
 h5 {
     font-family: "Playfair Display", serif;
 }


 p {
     font-size: 1.3rem !important;
 }

 a {
     text-decoration: none;
 }

 ul {
     font-size: 1.3rem;
 }

 .section-padding {
     padding: 110px 0;
 }

 .section-label {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 9px 18px;
     border-radius: 50px;
     background: var(--rose-light);
     color: var(--wine);
     font-size: 18px;
     font-weight: 700;

     text-transform: capitalize;
 }

 .section-label i {
     font-size: 16px;
 }

 .premium-navbar {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 9999;
     padding: 18px 0;
     transition: .35s ease;
     background: rgba(38, 9, 24);
     backdrop-filter: blur(20px);
     -webkit-backdrop-filter: blur(20px);
     border-bottom: 1px solid rgba(255, 255, 255, .09);
 }

 .premium-navbar.scrolled {
     padding: 12px 0;
     background: rgba(38, 9, 24, .95);
     box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
 }

 .brand {
     color: #fff !important;
     font-size: 28px;
     font-weight: 800;
     display: flex;
     align-items: center;
     gap: 10px;
     font-family: "Playfair Display", serif;
 }

 .brand-icon {
     width: 42px;
     height: 42px;
     border-radius: 14px;
     display: inline-flex;
     align-items: center;
     justify-content: center;
     background: linear-gradient(135deg, var(--rose), var(--champagne));
     color: #fff;
     box-shadow: 0 8px 25px rgba(196, 61, 112, .35);
 }

 .navbar-nav {
     gap: 8px;
 }

 .navbar .nav-link {
     color: rgba(255, 255, 255, .78) !important;
     font-size: 18px;
     font-weight: 600;
     padding: 10px 14px !important;
     border-radius: 50px;
     transition: .3s ease;
 }

 .navbar .nav-link:hover,
 .navbar .nav-link.active {
     color: #fff !important;
     background: rgba(255, 255, 255, .08);
 }

 .nav-join {
     background: linear-gradient(135deg, var(--rose), #e75b8b);
     color: #fff !important;
     padding: 12px 23px !important;
     box-shadow: 0 8px 25px rgba(196, 61, 112, .3);
 }

 .nav-join:hover {
     transform: translateY(-2px);
     background: linear-gradient(135deg, #d4497d, #ef709c) !important;
 }

 .navbar-toggler {
     color: #fff !important;
     border: 0 !important;
     font-size: 23px;
 }

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

 .hero {
     min-height: 100vh;
     padding: 120px 0 90px;
     position: relative;
     overflow: hidden;
     background:
         radial-gradient(circle at 8% 20%, rgba(196, 61, 112, .18), transparent 30%),
         radial-gradient(circle at 85% 25%, rgba(233, 201, 138, .12), transparent 25%),
         linear-gradient(135deg, #260918 0%, #732640 52%, #732640 100%);
 }

 .hero::before {
     content: "";
     position: absolute;
     width: 650px;
     height: 650px;
     border-radius: 50%;
     right: -250px;
     bottom: -300px;
     border: 1px solid rgba(255, 255, 255, .09);
 }

 .hero::after {
     content: "";
     position: absolute;
     width: 420px;
     height: 420px;
     border-radius: 50%;
     left: -250px;
     top: 100px;
     border: 1px solid rgba(255, 255, 255, .06);
 }

 .hero-content {
     position: relative;
     z-index: 3;
 }

 .hero-badge {
     display: inline-flex;
     align-items: center;
     gap: 9px;
     color: #f9dbe7;
     background: rgba(255, 255, 255, .07);
     border: 1px solid rgba(255, 255, 255, .12);
     padding: 9px 17px;
     border-radius: 50px;
     font-size: 19px;
     font-weight: 600;
     backdrop-filter: blur(10px);
 }

 .hero-badge i {
     color: var(--champagne);
 }

 .hero h1 {
     color: #fff;
     font-size: clamp(40px, 6vw, 58px);
     line-height: 1.02;
     margin-top: 28px;

 }

 .hero h1 span {
     background: linear-gradient(90deg, #fff, var(--champagne), #f3b8cc);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     background-clip: text;
 }

 .hero-description {
     color: rgba(255, 255, 255);
     line-height: 1.8;

     margin-top: 25px;
 }

 .hero-buttons {
     margin-top: 32px;
     display: flex;
     flex-wrap: wrap;
     gap: 14px;
 }

 .btn-premium {
     border: 0;
     border-radius: 50px;
     padding: 15px 30px;
     font-weight: 700;
     color: #fff;
     background: linear-gradient(135deg, var(--rose), #e86695);
     box-shadow: 0 15px 35px rgba(196, 61, 112, .28);
     transition: .3s ease;
     font-size: 1.2rem;
 }

 .btn-premium:hover {
     color: #fff;
     transform: translateY(-3px);
     box-shadow: 0 20px 40px rgba(196, 61, 112, .4);
 }

 .btn-ghost {
     border: 1px solid rgba(255, 255, 255, .2);
     border-radius: 50px;
     padding: 15px 30px;
     font-weight: 600;
     color: #fff;
     background: rgba(255, 255, 255, .06);
     backdrop-filter: blur(10px);
     transition: .3s ease;
     font-size: 1.2rem;
 }

 .btn-ghost:hover {
     color: #fff;
     background: rgba(255, 255, 255, .12);
     transform: translateY(-3px);
 }

 .hero-stats {
     display: flex;
     flex-wrap: wrap;
     gap: 35px;
     margin-top: 45px;
 }

 .hero-stat strong {
     display: block;
     color: #fff;
     font-size: 25px;
     font-weight: 700;
 }

 .hero-stat span {
     color: rgba(255, 255, 255, .52);
     font-size: 12px;
     text-transform: uppercase;

 }

 .hero-visual {
     position: relative;
     min-height: 570px;
     z-index: 2;
 }

 .hero-main-image {
     width: 420px;
     height: 580px;
     object-fit: cover;
     border-radius: 34px;
     position: absolute;
     right: 55px;
     top: 5px;
     border: 7px solid rgba(255, 255, 255, .1);
     box-shadow: 0 40px 90px rgba(0, 0, 0, .35);
     transform: rotate(2deg);
 }

 .profile-card {
     position: absolute;
     z-index: 5;
     background: rgba(255, 255, 255, .96);
     padding: 13px;
     border-radius: 22px;
     box-shadow: 0 25px 55px rgba(0, 0, 0, .25);
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .profile-card img {
     width: 255px;
     height: 255px;
     object-fit: cover;
     border-radius: 10px;
 }

 .profile-card h6 {
     font-family: "DM Sans", sans-serif;
     margin: 0;
     font-size: 14px;
     font-weight: 700;
 }

 .profile-card small {
     color: var(--muted);
     font-size: 11px;
 }

 .profile-card i {
     color: var(--rose);
     margin-left: 8px;
 }


 .profile-two {
     right: -52px;
     top: 380px;
 }

 .floating-heart {
     position: absolute;
     width: 58px;
     height: 58px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: linear-gradient(135deg, var(--rose), #ef719c);
     color: #fff;
     border-radius: 50%;
     box-shadow: 0 15px 30px rgba(196, 61, 112, .35);
     animation: float 4s ease-in-out infinite;
 }

 .heart-one {
     right: 10px;
     top: 55px;
 }

 .heart-two {
     left: 65px;
     bottom: 75px;
     width: 46px;
     height: 46px;
     animation-delay: 1.2s;
 }

 @keyframes float {

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

     50% {
         transform: translateY(-14px);
     }
 }

 .trust-strip {
     background: #fff;
     padding: 20px 0;
     border-bottom: 1px solid #eee5e9;
 }

 .trust-item {
     text-align: center;
     color: var(--muted);
     font-size: 18px;
     font-weight: 600;
 }

 .trust-item i {
     color: var(--rose);
     margin-right: 7px;
 }

 .about-section {
     background: var(--cream);
 }

 .about-image-wrap {
     position: relative;
     padding: 25px;
 }

 .about-image {
     width: 100%;
     height: 650px;
     object-fit: cover;
     border-radius: 35px;
     box-shadow: var(--shadow);
 }

 .about-badge {
     position: absolute;
     bottom: 0;
     right: 0;
     background: #fff;
     border-radius: 25px;
     padding: 24px 28px;
     box-shadow: 0 20px 50px rgba(54, 19, 36, .15);
     max-width: 220px;
 }

 .about-badge strong {
     font-size: 28px;
     color: var(--wine);
 }

 .about-badge span {
     display: block;
     color: var(--muted);
     font-size: 13px;
     margin-top: 3px;
 }

 .section-title {
     font-size: clamp(38px, 4vw, 48px);

     color: var(--wine-dark);
     margin-top: 22px;
 }

 .section-title span {
     color: var(--rose);
 }

 .section-text {
     color: var(--muted);
     font-size: 16px;
     line-height: 1.8;
 }

 .about-list {
     margin-top: 20px;
 }

 .about-list-item {
     display: flex;
     gap: 16px;
     margin-bottom: 22px;
 }

 .about-list-icon {
     flex: 0 0 48px;
     width: 48px;
     height: 48px;
     border-radius: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: var(--rose-light);
     color: var(--rose);
 }

 .about-list-item h3 {
      color: var(--muted);
     font-weight: 700;
     margin-bottom: 5px;
     font-size: 1.3rem;
 }

 .about-list-item p {
     color: var(--muted);
     margin: 0;
     font-size: 14px;
     line-height: 1.6;
 }

 .features-section {
     background: linear-gradient(135deg, #2b0b1d, #48132e);
     color: #fff;
     position: relative;
     overflow: hidden;
 }

 .features-section::before {
     content: "";
     position: absolute;
     width: 500px;
     height: 500px;
     border-radius: 50%;
     background: rgba(196, 61, 112, .13);
     top: -300px;
     right: -150px;
 }

 .features-section .section-title {
     color: #fff;
 }

 .features-section .section-text {
     color: rgba(255, 255, 255, .62);
 }

 .feature-card {
     position: relative;
     height: 100%;
     padding: 34px;
     border-radius: var(--radius);
     background: rgba(255, 255, 255, .055);
     border: 1px solid rgba(255, 255, 255, .1);
     backdrop-filter: blur(15px);
     transition: .35s ease;
 }

 .feature-card:hover {
     transform: translateY(-8px);
     background: rgba(255, 255, 255, .085);
     border-color: rgba(233, 201, 138, .35);
 }

 .feature-icon {
     width: 60px;
     height: 60px;
     border-radius: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     background: linear-gradient(135deg, var(--rose), #7b214b);
     font-size: 22px;
     margin-bottom: 25px;
 }

 .feature-card h3 {
     font-size: 25px;
     margin-bottom: 12px;
 }

 .feature-card p {
     color: rgba(255, 255, 255, .58);
     font-size: 14px;
     line-height: 1.8;
     margin: 0;
 }

 .discover-section {
     background: var(--soft);
 }

 .member-card {
     background: #fff;
     border-radius: 28px;
     overflow: hidden;
     box-shadow: 0 15px 45px rgba(47, 13, 31, .08);
     transition: .35s ease;
     height: 100%;
 }

 .member-card:hover {
     transform: translateY(-9px);
     box-shadow: 0 25px 60px rgba(47, 13, 31, .15);
 }

 .member-image {
     position: relative;
     height: 600px;
     overflow: hidden;
 }

 .member-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: .5s ease;
 }

 .member-card:hover .member-image img {
     transform: scale(1.02);
 }

 .member-status {
     position: absolute;
     left: 18px;
     bottom: 18px;
     padding: 8px 13px;
     border-radius: 50px;
     background: rgba(255, 255, 255, .94);
     color: var(--wine);
     font-size: 11px;
     font-weight: 700;
     box-shadow: 0 8px 20px rgba(0, 0, 0, .1);
 }

 .member-status i {
     color: #2aa66f;
 }

 .member-content {
     padding: 24px;
 }

 .member-content h3 {
     font-family: "DM Sans", sans-serif;
     font-size: 20px;
     font-weight: 700;
 }

 .member-content .age {
     color: var(--rose);
     font-weight: 700;
 }

 .member-content p {
     color: var(--muted);
     font-size: 13px;
     line-height: 1.7;
     margin: 12px 0 20px;
 }

 .profile-btn {
     width: 100%;
     border-radius: 50px;
     padding: 12px;
     border: 1px solid #eadde3;
     color: var(--wine);
     font-weight: 700;
     background: #fff;
     transition: .3s ease;
 }

 .profile-btn:hover {
     background: var(--wine);
     color: #fff;
     border-color: var(--wine);
 }

 .journey-section {
     background: #fff;
 }

 .step-card {
     text-align: center;
     padding: 25px 20px;
     position: relative;
     border: 1px solid #45122d;
     border-radius: 25px;
     transition: 0.3s;
 }

 .step-card:hover {
     transform: scale(1.05);
     background-color: #554951;

 }

 .step-number {
     width: 78px;
     height: 78px;
     margin: 0 auto 25px;
     border-radius: 25px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: linear-gradient(135deg, var(--wine), var(--rose));
     color: #fff;
     font-family: "Playfair Display", serif;
     font-size: 25px;
     box-shadow: 0 15px 30px rgba(74, 16, 44, .2);
 }

 .step-card h3 {
     font-size: 23px;
     color: var(--wine-dark);
 }

 .step-card p {
     color: var(--muted);
     font-size: 14px;
     line-height: 1.8;
 }

 .step-card:hover p,
 .step-card:hover h3 {
     color: white;
 }

 .step-line {
     position: absolute;
     top: 63px;
     left: 72%;
     width: 56%;
     height: 1px;
     border-top: 2px dashed #e8cbd6;
 }

 .step-card:last-child .step-line {
     display: none;
 }

 .story-section {
     background: var(--soft);
 }

 .story-card {
     background: #fff;
     border-radius: 30px;
     padding: 35px;
     height: 100%;
     box-shadow: 0 15px 45px rgba(47, 13, 31, .06);
     position: relative;
 }

 .quote {
     width: 50px;
     height: 50px;
     border-radius: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: var(--rose-light);
     color: var(--rose);
     margin-bottom: 20px;
 }

 .story-card>p {
     color: #554951;
     line-height: 1.9;
     font-size: 14px;
 }

 .story-user {
     display: flex;
     align-items: center;
     gap: 13px;
     margin-top: 25px;
 }

 .story-user img {
     width: 92px;
     height: 92px;
     border-radius: 50%;
     object-fit: cover;
 }

 .story-user strong {
     display: block;
     font-size: 18px;
 }

 .story-user span {
     color: var(--muted);
     font-size: 16px;
 }

 .cta-section {
     padding: 110px 0;
     position: relative;
     overflow: hidden;
     background: linear-gradient(135deg, #230916, #5a173a, #2c0a1d);
 }

 .cta-section::before {
     content: "";
     position: absolute;
     width: 600px;
     height: 600px;
     border-radius: 50%;
     right: -250px;
     top: -300px;
     border: 1px solid rgba(255, 255, 255, .1);
 }

 .cta-section::after {
     content: "";
     position: absolute;
     width: 450px;
     height: 450px;
     border-radius: 50%;
     left: -300px;
     bottom: -250px;
     border: 1px solid rgba(255, 255, 255, .08);
 }

 .cta-content {
     position: relative;
     z-index: 2;
 }

 .cta-section h2 {
     color: #fff;
     font-size: clamp(38px, 4vw, 58px);

 }

 .cta-section h2 span {
     color: var(--champagne);
 }

 .cta-section p {
     color: rgba(255, 255, 255, .65);

     margin: 20px auto 30px;
     line-height: 1.8;
 }

 .cta-points {
     margin-top: 40px;
 }

 .cta-point {
     color: rgba(255, 255, 255, .8);
     font-size: 19px;
 }

 .cta-point i {
     color: var(--champagne);
     margin-right: 7px;
 }

 .faq-section {
     background: var(--cream);
 }

 .faq-wrap {

     margin: auto;
 }

 .accordion-item {
     border: 0;
     margin-bottom: 12px;
     border-radius: 18px !important;
     overflow: hidden;
     box-shadow: 0 7px 25px rgba(47, 13, 31, .05);
 }

 .accordion-button {
     padding: 23px 25px;
     color: var(--wine-dark);
     font-weight: 700;
     background: #fff;
     box-shadow: none !important;
     font-size: 1.3rem !important;
 }

 .accordion-button:not(.collapsed) {
     color: var(--rose);
     background: #fff;
 }

 .accordion-body {
     color: var(--muted);
     background: #fff;
     line-height: 1.8;
     padding: 0 25px 25px;
     font-size: 1.3rem !important;
 }

 .footer {
     background: #180911;
     color: #fff;
     padding: 75px 0 20px;
 }

 .footer-brand {
     font-family: 'Times New Roman', Times, serif;
     font-size: 30px;
     font-weight: 700;
     color: #fff;
 }

 .footer p {
     color: rgba(255, 255, 255, .55);
     font-size: 14px;
     line-height: 1.8;
 }

 .footer strong {
     font-family: 'Times New Roman', Times, serif;
     font-size: 18px;
     font-weight: 700;

     color: #fff;
 }

 .footer ul {
     list-style: none;
     padding: 0;
     margin-top: 25px;

 }

 .footer ul li {
     margin-bottom: 11px;
 }

 .footer ul li a {
     color: rgba(255, 255, 255, .55);
     font-size: 18px;
     transition: .3s ease;
 }

 .footer ul li a:hover {
     color: var(--champagne);
 }



 .footer-bottom {
     border-top: 1px solid rgba(255, 255, 255, .08);
     margin-top: 50px;
     padding-top: 20px;
     text-align: center;
 }

 .footer-bottom p {

     margin-top: 25px;
 }

 .back-to-top {
     position: fixed;
     right: 22px;
     bottom: 22px;
     width: 48px;
     height: 48px;
     border: 0;
     border-radius: 15px;
     background: var(--rose);
     color: #fff;
     z-index: 999;
     box-shadow: 0 12px 30px rgba(196, 61, 112, .3);
     opacity: 0;
     visibility: hidden;
     transition: .3s ease;
 }

 .back-to-top.show {
     opacity: 1;
     visibility: visible;
 }

 @media (max-width: 1199px) {
     .hero-main-image {
         width: 450px;
         height: 580px;
         right: 25px;
     }

     .hero-visual {
         min-height: 530px;
     }

     .profile-one {
         left: -5px;
     }

     .profile-two {
         right: -15px;
     }
 }

 @media (max-width: 991px) {
     .premium-navbar {
         padding: 14px 0;
     }

     .navbar-collapse {
         margin-top: 15px;
         padding: 15px;
         border-radius: 20px;
         background: rgba(38, 9, 24, .97);
     }

     .navbar-nav {
         gap: 0px !important;
         text-align: center;
     }

     .navbar .nav-link {
         display: block;
     }

     .nav-join {
         display: inline-block !important;
         margin-top: 8px;
     }

     .hero {
         padding-top: 120px;
     }


     .hero-description {
         margin-left: auto;
         margin-right: auto;
     }

     .hero-buttons {
         justify-content: center;
     }

     .hero-visual {
         min-height: 560px;
         max-width: 600px;
         margin: 25px auto 0;
     }

     .hero-main-image {
         right: 50%;
         transform: translateX(50%) rotate(2deg);
     }

     .profile-one {
         left: 10px;
     }

     .profile-two {
         right: 5px;
     }

     .step-line {
         display: none;
     }

     .about-image {
         height: 520px;
     }

     .section-title {
         font-size: 1.8rem !important;
     }

     .cta-section h2 {
         font-size: 1.8rem !important;
     }
 }

 @media (max-width: 767px) {
     .section-padding {
         padding: 75px 0;
     }

     .hero {
         padding: 75px 0 65px;
     }

     .hero h1 {
         font-size: 48px;

     }

     .hero-description {
         font-size: 15px;
     }

     .hero-buttons .btn-premium,
     .hero-buttons .btn-ghost {
         width: 100%;
     }

     .hero-stats {
         gap: 20px;
     }

     .hero-stat strong {
         font-size: 21px;
     }

     .hero-visual {
         min-height: 480px;
     }

     .hero-main-image {
         width: auto;
         height: auto;
     }

     .profile-card {
         padding: 9px;
     }

     .profile-card img {
         width: 215px;
         height: 250px;
     }

     .profile-card h6 {
         font-size: 12px;
     }

     .profile-one {
         left: 0;
         top: 75px;
     }

     .profile-two {
         right: 0;
         bottom: 50px;
     }

     .floating-heart {
         width: 45px;
         height: 45px;
     }

     .heart-one {
         right: 0;
         top: 30px;
     }

     .heart-two {
         left: 25px;
         bottom: 30px;
     }

     .about-image-wrap {
         padding: 10px;
     }

     .about-image {
         height: auto;
     }

     .about-badge {
         right: -5px;
         padding: 17px;
     }

     .about-badge strong {
         font-size: 23px;
     }

     .member-image {
         height: auto;
     }

     .cta-section {
         padding: 80px 0;
     }

     .cta-point {
         margin-bottom: 8px;
     }
 }

 @media (max-width: 575px) {
     .brand {
         font-size: 23px;
     }

     .brand-icon {
         width: 36px;
         height: 36px;
         border-radius: 11px;
     }

     .hero h1 {
         font-size: 30px;
     }

     .hero-badge {
         font-size: 1.1rem;
         text-wrap: inherit;
         line-height: 1.5;
     }

     .hero-content{
        margin-top: 10%;
     }

     .hero-visual {
         min-height: 425px;
     }

     .hero-main-image {
         width: 245px;
         height: 350px;
         border-width: 5px;
     }

     .profile-card {
         transform: scale(.85);
     }

     .profile-one {
         display: none !important;
     }

     .profile-two {
         right: 0;
         bottom: 50px;
     }

     .about-image {
         height: auto;
     }

     .about-badge {
         right: -10px;
         bottom: -10px;
     }



     .feature-card,
     .story-card {
         padding: 25px;
     }

     .member-image {
         height: auto;
     }

     .trust-item {
         margin-bottom: 10px;
     }

     .back-to-top {
         width: 44px;
         height: 44px;
         right: 15px;
         bottom: 15px;
     }
 }





.gallery-section {
    background: #f9f8f8;
}
.gallery-card {
    
    background: #f8f4f7;
    box-shadow: 0 15px 40px rgba(80, 35, 70, 0.10);
    cursor: pointer;
}
.gallery-image {
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}
.gallery-card:hover .gallery-image {
    transform: scale(1.08);
}
.gallery-overlay {
    background: linear-gradient(
        to top,
        rgba(30, 10, 30, 0.88) 0%,
        rgba(30, 10, 30, 0.45) 45%,
        rgba(30, 10, 30, 0.02) 100%
    );
    opacity: 0;
    transition: opacity 0.4s ease;
}
.gallery-card:hover .gallery-overlay {
    opacity: 1;
}
.gallery-content {
    transform: translateY(25px);
    transition: transform 0.4s ease;
}
.gallery-card:hover .gallery-content {
    transform: translateY(0);
}
.gallery-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(135deg, #ff4f81, #9b3fc8);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}
.gallery-content h3 {
    font-size: 1.35rem;
    font-weight: 700;
}
.gallery-content p {
    font-size: 0.95rem;
    line-height: 1.6;
    opacity: 0.92;
}

@media (max-width: 767.98px) {
   
    .gallery-overlay {
        opacity: 1;
    }
    .gallery-content {
        transform: translateY(0);
    }
}
@media (max-width: 575.98px) {
    .gallery-card {
      
        border-radius: 18px !important;
    }
    .gallery-content {
        padding: 20px !important;
    }
    .gallery-content h3 {
        font-size: 1.15rem;
    }
    .gallery-content p {
        display: none !important;
    }
}