.navbar.light-hero {
     background: rgba(255, 255, 255, .94) !important;
     backdrop-filter: blur(14px) saturate(140%);
     -webkit-backdrop-filter: blur(14px) saturate(140%);
     border-bottom: 1px solid rgba(185, 154, 91, .18);
     box-shadow: 0 1px 12px rgba(9, 23, 54, .06);
     transition: background .35s ease, box-shadow .35s ease
 }

 .navbar.light-hero .logo-img {
     filter: none !important
 }

 .navbar.light-hero .nav-menu a {
     color: rgba(9, 23, 54, .65) !important
 }

 .navbar.light-hero .nav-menu a:hover,
 .navbar.light-hero .nav-menu a.active {
     color: var(--primary) !important
 }

 .navbar.light-hero .hamburger span {
     background: var(--primary) !important
 }

 .promo-swiper-hero {
     width: 100%;
     background: #F8F7F2;
     overflow: hidden;
     position: relative
 }

 .promo-swiper {
     width: 100%
 }

 .psh-slide {
     position: relative;
     height: clamp(380px, 33.33vw, 600px);
     overflow: hidden;
     user-select: none
 }

 .psh-bg {
     position: absolute;
     inset: 0;
     overflow: hidden
 }

 .psh-bg-img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     pointer-events: none;
     user-select: none;
     -webkit-user-drag: none;
     will-change: transform
 }

 .swiper-slide-active .psh-bg-img {
     animation: pshKenBurns 10s ease-out forwards
 }

 @keyframes pshKenBurns {
     from {
         transform: scale(1.0)
     }

     to {
         transform: scale(1.08)
     }
 }

 .psh-overlay {
     position: absolute;
     inset: 0;
     z-index: 1;
     background: linear-gradient(to right, rgba(248, 247, 242, .86) 0%, rgba(248, 247, 242, .60) 35%, rgba(248, 247, 242, .14) 62%, rgba(248, 247, 242, .00) 100%);
     pointer-events: none
 }

 .psh-content {
     position: absolute;
     inset: 0;
     z-index: 2;
     display: flex;
     align-items: center;
     padding: 0 clamp(24px, 6vw, 90px)
 }

 .psh-glass-card {
     background: rgba(255, 255, 255, .40);
     backdrop-filter: blur(25px) saturate(160%);
     -webkit-backdrop-filter: blur(25px) saturate(160%);
     border: 1px solid rgba(255, 255, 255, .30);
     border-radius: 20px;
     padding: 38px 44px 36px;
     max-width: 440px;
     width: 100%;
     box-shadow: 0 12px 48px rgba(9, 23, 54, .10), 0 2px 0 rgba(255, 255, 255, .65) inset;
     opacity: 0;
     transform: translateX(-28px);
     transition: opacity .0s, transform .0s
 }

 .swiper-slide-active .psh-glass-card {
     animation: pshCardIn .70s cubic-bezier(.22, 1, .36, 1) .15s forwards
 }

 @keyframes pshCardIn {
     from {
         opacity: 0;
         transform: translateX(-28px)
     }

     to {
         opacity: 1;
         transform: translateX(0)
     }
 }

 .psh-eyebrow {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     font-size: .67rem;
     font-weight: 700;
     letter-spacing: .16em;
     text-transform: uppercase;
     color: #8b7240;
     background: rgba(184, 150, 100, .10);
     border: 1px solid rgba(184, 150, 100, .22);
     padding: 4px 12px;
     border-radius: 100px;
     margin-bottom: 14px
 }

 .psh-title {
     font-size: clamp(1.6rem, 2.8vw, 2.3rem);
     font-weight: 800;
     color: var(--primary);
     line-height: 1.18;
     letter-spacing: -.025em;
     margin: 0 0 10px
 }

 .psh-location {
     font-size: .83rem;
     color: rgba(9, 23, 54, .50);
     margin: 0 0 22px;
     display: flex;
     align-items: center;
     gap: 6px
 }

 .psh-location i {
     color: #B89664;
     font-size: .76rem
 }

 .psh-benefits {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 9px 14px;
     margin-bottom: 26px
 }

 .psh-benefit {
     display: flex;
     align-items: center;
     gap: 8px;
     font-size: .79rem;
     font-weight: 500;
     color: rgba(9, 23, 54, .65)
 }

 .psh-benefit-icon {
     width: 28px;
     height: 28px;
     border-radius: 7px;
     flex-shrink: 0;
     background: rgba(184, 150, 100, .10);
     display: flex;
     align-items: center;
     justify-content: center
 }

 .psh-benefit-icon i {
     font-size: .70rem;
     color: #B89664
 }

 .psh-cta {
     display: inline-flex;
     align-items: center;
     gap: 9px;
     background: var(--primary);
     color: #fff;
     font-size: .87rem;
     font-weight: 700;
     letter-spacing: .02em;
     padding: 13px 28px;
     border-radius: 10px;
     text-decoration: none;
     box-shadow: 0 4px 18px rgba(9, 23, 54, .22);
     transition: transform .22s ease, box-shadow .22s ease
 }

 .psh-cta:hover {
     transform: translateY(-3px);
     box-shadow: 0 10px 32px rgba(9, 23, 54, .28)
 }

 .psh-cta i {
     transition: transform .22s ease
 }

 .psh-cta:hover i {
     transform: translateX(4px)
 }

 .psh-pagination {
     bottom: 20px !important
 }

 .psh-pagination .swiper-pagination-bullet {
     width: 8px;
     height: 8px;
     background: rgba(9, 23, 54, .22);
     opacity: 1;
     transition: all .28s ease
 }

 .psh-pagination .swiper-pagination-bullet-active {
     width: 26px;
     border-radius: 100px;
     background: #B89664
 }

 .psh-btn-prev,
 .psh-btn-next {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     z-index: 10;
     width: 46px;
     height: 46px;
     background: rgba(255, 255, 255, .82);
     backdrop-filter: blur(8px);
     border: none;
     border-radius: 50%;
     cursor: pointer;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: .88rem;
     color: var(--primary);
     box-shadow: 0 4px 18px rgba(9, 23, 54, .12);
     transition: all .22s ease
 }

 .psh-btn-prev {
     left: 24px
 }

 .psh-btn-next {
     right: 24px
 }

 .psh-btn-prev:hover,
 .psh-btn-next:hover {
     background: #fff;
     box-shadow: 0 6px 28px rgba(9, 23, 54, .18);
     transform: translateY(-50%) scale(1.07)
 }

 @media (max-width:1024px) {
     .psh-slide {
         height: auto;
         display: flex;
         flex-direction: column
     }

     .psh-bg {
         position: relative;
         width: 100%;
         height: 56vw;
         max-height: 320px
     }

     .psh-overlay {
         position: absolute;
         inset: 0;
         background: linear-gradient(to bottom, rgba(248, 247, 242, 0) 40%, rgba(248, 247, 242, .92) 100%)
     }

     .psh-content {
         position: relative;
         padding: 0 20px 36px;
         display: block
     }

     .psh-glass-card {
         max-width: 100%;
         border-radius: 0 0 20px 20px;
         border-top: none;
         padding: 26px 20px 30px;
         background: rgba(248, 247, 242, .97);
         backdrop-filter: none
     }

     .psh-btn-prev,
     .psh-btn-next {
         display: none
     }
 }

 @media (max-width:480px) {
     .psh-benefits {
         grid-template-columns: 1fr;
         gap: 8px
     }

     .psh-title {
         font-size: clamp(1.3rem, 6vw, 1.7rem)
     }
 }

 .promo-section {
     padding: 80px 0 88px;
     background: #fdf8f0
 }

 .promo-special-announce {
     text-align: center;
     margin-bottom: 48px
 }

 .psa-ribbon {
     display: inline-flex;
     align-items: center;
     gap: 14px;
     background: linear-gradient(135deg, #091736 0%, #122155 100%);
     color: #fff;
     padding: 14px 38px;
     border-radius: 50px;
     font-size: 1rem;
     font-weight: 700;
     letter-spacing: .03em;
     border: 1.5px solid rgba(185, 154, 91, .42);
     box-shadow: 0 10px 40px rgba(9, 23, 54, .22), 0 0 0 6px rgba(185, 154, 91, .06);
     animation: psa-bounce .85s cubic-bezier(.34, 1.56, .64, 1) both
 }

 .psa-ribbon i {
     color: var(--accent);
     font-size: .95rem
 }

 .psa-ribbon i:first-child {
     animation: star-pop 2.5s ease-in-out infinite
 }

 .psa-ribbon i:last-child {
     animation: star-pop 2.5s ease-in-out .5s infinite
 }

 @keyframes psa-bounce {
     0% {
         opacity: 0;
         transform: translateY(-40px) scale(.86)
     }

     55% {
         opacity: 1;
         transform: translateY(10px) scale(1.04)
     }

     75% {
         transform: translateY(-5px) scale(.98)
     }

     90% {
         transform: translateY(3px) scale(1.01)
     }

     100% {
         opacity: 1;
         transform: translateY(0) scale(1)
     }
 }

 @keyframes star-pop {

     0%,
     100% {
         transform: scale(1) rotate(0deg)
     }

     50% {
         transform: scale(1.35) rotate(20deg)
     }
 }

 .psa-sub {
     display: block;
     margin-top: 12px;
     font-size: .75rem;
     color: rgba(9, 23, 54, .42);
     letter-spacing: .18em;
     text-transform: uppercase;
     font-weight: 600;
     animation: psa-bounce .85s cubic-bezier(.34, 1.56, .64, 1) .18s both
 }

 .promo-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 24px;
     margin-top: 0;
     align-items: start
 }

 .pgc {
     background: #fff;
     border-radius: 18px;
     overflow: hidden;
     box-shadow: 0 4px 24px rgba(9, 23, 54, .07), 0 1px 4px rgba(9, 23, 54, .04);
     display: flex;
     flex-direction: column;
     position: relative;
     opacity: 0;
     transform: translateY(44px) scale(.96);
     transition: box-shadow .28s ease, border-color .28s ease;
     border-top: 3px solid rgba(185, 154, 91, .28);
     cursor: default
 }

 .pgc.in-view {
     animation: card-bounce-in .68s cubic-bezier(.34, 1.56, .64, 1) forwards
 }

 .pgc:hover {
     box-shadow: 0 20px 56px rgba(9, 23, 54, .14), 0 4px 12px rgba(9, 23, 54, .07);
     border-top-color: var(--accent);
     transform: translateY(-8px) !important
 }

 @keyframes card-bounce-in {
     0% {
         opacity: 0;
         transform: translateY(44px) scale(.96)
     }

     52% {
         opacity: 1;
         transform: translateY(-11px) scale(1.016)
     }

     72% {
         transform: translateY(5px) scale(.997)
     }

     88% {
         transform: translateY(-3px) scale(1.004)
     }

     100% {
         opacity: 1;
         transform: translateY(0) scale(1)
     }
 }

 .pgc-img {
     position: relative;
     height: 200px;
     flex-shrink: 0;
     overflow: hidden
 }

 .pgc-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform .72s cubic-bezier(.25, .46, .45, .94)
 }

 .pgc:hover .pgc-img img {
     transform: scale(1.10)
 }

 .pgc-img::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to bottom, rgba(9, 23, 54, .22) 0%, transparent 45%, rgba(9, 23, 54, .38) 100%);
     pointer-events: none
 }

 .pgc-badge {
     position: absolute;
     top: 13px;
     left: 13px;
     z-index: 3;
     padding: 5px 11px;
     border-radius: 3px;
     font-size: .62rem;
     font-weight: 800;
     letter-spacing: .12em;
     text-transform: uppercase;
     opacity: 0;
     transform: scale(0) rotate(-14deg)
 }

 .pgc.in-view .pgc-badge {
     animation: badge-pop .55s cubic-bezier(.34, 1.56, .64, 1) .40s forwards
 }

 @keyframes badge-pop {
     0% {
         opacity: 0;
         transform: scale(0) rotate(-14deg)
     }

     58% {
         transform: scale(1.20) rotate(4deg);
         opacity: 1
     }

     78% {
         transform: scale(.93) rotate(-2deg)
     }

     100% {
         opacity: 1;
         transform: scale(1) rotate(0)
     }
 }

 .pgc-badge.hot {
     background: #e74c3c;
     color: #fff;
     box-shadow: 0 4px 14px rgba(231, 76, 60, .50)
 }

 .pgc-badge.excl {
     background: var(--accent);
     color: #fff;
     box-shadow: 0 4px 14px rgba(185, 154, 91, .50)
 }

 .pgc-badge.new {
     background: #27ae60;
     color: #fff;
     box-shadow: 0 4px 14px rgba(39, 174, 96, .44)
 }

 .pgc-badge.spec {
     background: var(--primary);
     color: var(--accent);
     box-shadow: 0 4px 14px rgba(9, 23, 54, .40)
 }

 .pgc-badge.hot {
     animation: badge-pop .55s cubic-bezier(.34, 1.56, .64, 1) .40s forwards, badge-float 2.8s ease-in-out 1.2s infinite
 }

 @keyframes badge-float {

     0%,
     100% {
         transform: translateY(0) scale(1)
     }

     50% {
         transform: translateY(-5px) scale(1.04)
     }
 }

 .pgc-units {
     position: absolute;
     bottom: 12px;
     right: 12px;
     z-index: 3;
     background: rgba(0, 0, 0, .58);
     backdrop-filter: blur(6px);
     color: #fff;
     font-size: .68rem;
     font-weight: 600;
     padding: 4px 10px;
     border-radius: 100px;
     border: 1px solid rgba(255, 255, 255, .14)
 }

 .pgc-units.urgent {
     background: rgba(231, 76, 60, .88);
     animation: units-pulse 2s ease-in-out infinite
 }

 @keyframes units-pulse {

     0%,
     100% {
         box-shadow: 0 0 0 0 rgba(231, 76, 60, .45)
     }

     50% {
         box-shadow: 0 0 0 8px rgba(231, 76, 60, 0)
     }
 }

 .pgc-body {
     padding: 18px 20px 20px;
     flex: 1;
     display: flex;
     flex-direction: column;
     position: relative;
     overflow: hidden
 }

 .pgc-body::before {
     content: '';
     position: absolute;
     top: 0;
     left: -80%;
     width: 50%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(185, 154, 91, .05), transparent);
     transition: left .60s ease;
     pointer-events: none
 }

 .pgc:hover .pgc-body::before {
     left: 160%
 }

 .pgc-project {
     font-size: .62rem;
     font-weight: 700;
     letter-spacing: .14em;
     text-transform: uppercase;
     color: var(--accent);
     margin-bottom: 6px
 }

 .pgc-title {
     font-size: .98rem;
     font-weight: 800;
     color: var(--primary);
     line-height: 1.32;
     margin-bottom: 12px;
     letter-spacing: -.01em;
     display: -webkit-box;
     -webkit-line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden
 }

 .pgc-price {
     margin-bottom: 12px
 }

 .pgc-price-old {
     display: block;
     font-size: .78rem;
     font-weight: 400;
     color: rgba(9, 23, 54, .32);
     text-decoration: line-through;
     margin-bottom: 2px
 }

 .pgc-price-row {
     display: flex;
     align-items: baseline;
     gap: 8px;
     flex-wrap: wrap
 }

 .pgc-price-now {
     font-size: 1.38rem;
     font-weight: 800;
     color: #c0392b;
     letter-spacing: -.02em;
     position: relative;
     display: inline-block
 }

 .pgc-price-now::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(90deg, transparent 20%, rgba(255, 255, 255, .55) 50%, transparent 80%);
     background-size: 200% 100%;
     animation: price-shimmer 3.5s linear infinite;
     pointer-events: none
 }

 @keyframes price-shimmer {
     0% {
         background-position: -200% 0
     }

     100% {
         background-position: 200% 0
     }
 }

 .pgc-price-save {
     font-size: .66rem;
     font-weight: 700;
     background: rgba(231, 76, 60, .10);
     color: #c0392b;
     padding: 2px 8px;
     border-radius: 100px;
     border: 1px solid rgba(231, 76, 60, .22);
     white-space: nowrap
 }

 .pgc-perks {
     list-style: none;
     padding: 0;
     margin: 0 0 12px;
     display: flex;
     flex-direction: column;
     gap: 5px
 }

 .pgc-perks li {
     display: flex;
     align-items: flex-start;
     gap: 7px;
     font-size: .79rem;
     color: rgba(9, 23, 54, .64);
     line-height: 1.4
 }

 .pgc-perks li i {
     color: #27ae60;
     font-size: .70rem;
     flex-shrink: 0;
     margin-top: 3px
 }

 .pgc-progress-wrap {
     margin-bottom: 14px
 }

 .pgc-progress-label {
     display: flex;
     justify-content: space-between;
     font-size: .66rem;
     font-weight: 600;
     margin-bottom: 5px
 }

 .pgc-progress-label .left {
     color: rgba(9, 23, 54, .44)
 }

 .pgc-progress-label .right {
     color: #e74c3c;
     font-weight: 700
 }

 .pgc-progress-track {
     height: 6px;
     background: rgba(9, 23, 54, .08);
     border-radius: 100px;
     overflow: hidden
 }

 .pgc-progress-fill {
     height: 100%;
     background: linear-gradient(90deg, #e74c3c, #f39c12);
     border-radius: 100px;
     width: 0;
     transition: width 1.30s cubic-bezier(.34, 1.56, .64, 1)
 }

 .pgc-footer {
     display: flex;
     flex-direction: column;
     gap: 8px;
     margin-top: auto;
     padding-top: 14px;
     border-top: 1px solid rgba(185, 154, 91, .12)
 }

 .pgc-btn-primary {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     padding: 11px 16px;
     background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
     color: #fff;
     border-radius: 7px;
     font-size: .84rem;
     font-weight: 800;
     text-decoration: none;
     box-shadow: 0 5px 18px rgba(231, 76, 60, .34);
     transition: all .22s ease;
     letter-spacing: .02em;
     position: relative;
     overflow: hidden
 }

 .pgc-btn-primary::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .22), transparent);
     transform: translateX(-100%);
     transition: transform .40s ease
 }

 .pgc-btn-primary:hover::after {
     transform: translateX(100%)
 }

 .pgc-btn-primary:hover {
     background: linear-gradient(135deg, #c0392b, #a93226);
     box-shadow: 0 8px 28px rgba(231, 76, 60, .52);
     transform: translateY(-2px)
 }

 .pgc-btn-secondary {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 6px;
     padding: 9px 14px;
     border: 1.5px solid rgba(185, 154, 91, .35);
     border-radius: 7px;
     font-size: .78rem;
     font-weight: 600;
     color: rgba(9, 23, 54, .52);
     text-decoration: none;
     transition: all .22s ease
 }

 .pgc-btn-secondary:hover {
     border-color: var(--accent);
     color: var(--accent)
 }

 .benefit-strip {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 20px;
     margin-top: 48px
 }

 .bstrip-card {
     background: #fff;
     border-radius: 12px;
     padding: 26px 22px;
     display: flex;
     align-items: flex-start;
     gap: 14px;
     box-shadow: 0 2px 12px rgba(9, 23, 54, .05);
     border-left: 3px solid var(--accent);
     transition: transform .22s ease
 }

 .bstrip-card:hover {
     transform: translateY(-3px)
 }

 .bstrip-icon {
     width: 42px;
     height: 42px;
     flex-shrink: 0;
     background: rgba(185, 154, 91, .10);
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center
 }

 .bstrip-icon i {
     font-size: 1.15rem;
     color: var(--accent)
 }

 .bstrip-text h4 {
     font-size: .92rem;
     font-weight: 700;
     color: var(--primary);
     margin-bottom: 3px
 }

 .bstrip-text p {
     font-size: .80rem;
     color: rgba(9, 23, 54, .52);
     line-height: 1.6;
     margin: 0
 }

 .promo-cta-hard {
     background: linear-gradient(135deg, #c0392b 0%, #e74c3c 100%);
     padding: 64px 0;
     text-align: center;
     position: relative;
     overflow: hidden
 }

 .promo-cta-hard::before {
     content: '';
     position: absolute;
     inset: 0;
     background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
     pointer-events: none
 }

 .promo-cta-hard h2 {
     color: #fff;
     font-size: clamp(1.8rem, 3.5vw, 2.8rem);
     font-weight: 800;
     letter-spacing: -.02em;
     margin-bottom: 12px;
     position: relative
 }

 .promo-cta-hard p {
     color: rgba(255, 255, 255, .75);
     font-size: 1rem;
     margin-bottom: 32px;
     position: relative
 }

 .promo-cta-hard-btns {
     display: flex;
     gap: 14px;
     justify-content: center;
     flex-wrap: wrap;
     position: relative
 }

 .btn-cta-white {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 14px 32px;
     background: #fff;
     color: #c0392b;
     border-radius: 6px;
     font-size: .95rem;
     font-weight: 800;
     text-decoration: none;
     box-shadow: 0 8px 24px rgba(0, 0, 0, .20);
     transition: all .2s ease
 }

 .btn-cta-white:hover {
     transform: translateY(-2px);
     box-shadow: 0 12px 32px rgba(0, 0, 0, .28)
 }

 .btn-cta-outline-white {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 14px 32px;
     background: transparent;
     color: #fff;
     border: 2px solid rgba(255, 255, 255, .60);
     border-radius: 6px;
     font-size: .95rem;
     font-weight: 700;
     text-decoration: none;
     transition: all .2s ease
 }

 .btn-cta-outline-white:hover {
     background: rgba(255, 255, 255, .12);
     border-color: #fff
 }

 @media (max-width:1100px) {
     .promo-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 20px
     }
 }

 @media (max-width:900px) {
     .benefit-strip {
         grid-template-columns: 1fr 1fr
     }
 }

 @media (max-width:600px) {
     .promo-grid {
         grid-template-columns: 1fr
     }

     .benefit-strip {
         grid-template-columns: 1fr
     }
 }