

/* --------------------------------------------------------------------------
 (.why-book-us-section) (airportsection page)
   -------------------------------------------------------------------------- */
/*
.why-book-us-section {
   --card-bg: rgba(255, 255, 255, 0.03);
   --card-border: rgba(255, 255, 255, 0.05);
   --card-hover-bg: rgba(255, 255, 255, 0.07);
   --card-title-color: #ffffff;
   --card-desc-color: #b0b0b0;
   --icon-bg: rgba(201, 168, 76, 0.08);
   --icon-hover-bg: rgba(201, 168, 76, 0.18);
   --shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}
.why-book-us-section .heading-line {
   width: 50px;
   height: 3px;
   background: #c9a84c;
   margin: 15px auto 0;
   border-radius: 2px;
}

.accordion-gallery {
   display: flex;
   gap: 20px;
   width: 100%;
   min-height: 380px;
   margin-top: 40px;
}

.accordion-card {
   flex: 1;
   background: var(--card-bg);
   border: 1px solid var(--card-border);
   border-radius: 20px;
   padding: 40px 30px;
   position: relative;
   overflow: hidden;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: center;
   text-align: center;
   transition: flex-grow 0.7s cubic-bezier(0.25, 1, 0.2, 1), background 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
   will-change: flex-grow;
   cursor: pointer;
   z-index: 2;
}

.accordion-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 4px;
   background: linear-gradient(90deg, #c9a84c, #ffba23);
   opacity: 0;
   transition: opacity 0.4s ease;
}

.accordion-card-watermark {
   position: absolute;
   right: -20px;
   bottom: -20px;
   font-size: 9rem;
   font-weight: 900;
   line-height: 1;
   color: transparent;
   -webkit-text-stroke: 2px rgba(255, 255, 255, 0.02);
   user-select: none;
   z-index: 1;
   transition: transform 0.7s cubic-bezier(0.25, 1, 0.2, 1), -webkit-text-stroke 0.4s ease;
   will-change: transform;
}


.inf-icon-wrap {
   width: 75px;
   height: 75px;
   background: var(--icon-bg);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 24px;
   transition: transform 0.6s cubic-bezier(0.25, 1, 0.2, 1), background 0.4s ease;
   will-change: transform;
   flex-shrink: 0;
   position: relative;
   z-index: 2;
}

.inf-icon-wrap img {
   width: 35px !important;
   height: 35px;
   object-fit: contain;
   transition: transform 0.6s cubic-bezier(0.25, 1, 0.2, 1);
   will-change: transform;
}

.inf-card-title {
   font-size: 1.25rem;
   color: var(--card-title-color);
   font-weight: 700;
   margin-bottom: 15px;
   line-height: 1.4;
   position: relative;
   z-index: 2;
   transition: color 0.4s ease;
}


.accordion-card .inf-card-desc {
   color: var(--card-desc-color);
   font-size: 0.95rem;
   line-height: 1.6;
   font-weight: 400;
   margin-bottom: 0;
   position: relative;
   z-index: 2;
   opacity: 0;
   max-height: 0;
   transform: translateY(15px);
   transition: opacity 0.6s cubic-bezier(0.25, 1, 0.2, 1), transform 0.6s cubic-bezier(0.25, 1, 0.2, 1), max-height 0.6s cubic-bezier(0.25, 1, 0.2, 1);
   will-change: opacity, transform, max-height;
   overflow: hidden;
}

@media (min-width: 768px) {
   .accordion-card:hover,
   .accordion-card.active {
      flex: 2.2;
      background: var(--card-hover-bg);
      border-color: rgba(201, 168, 76, 0.4);
      box-shadow: var(--shadow);
   }
   
   .accordion-card:hover::before,
   .accordion-card.active::before {
      opacity: 1;
   }
   
   .accordion-card:hover .accordion-card-watermark,
   .accordion-card.active .accordion-card-watermark {
      -webkit-text-stroke: 2px rgba(201, 168, 76, 0.05);
      transform: scale(1.05) translate(-10px, -10px);
   }
   
   .accordion-card:hover .inf-icon-wrap,
   .accordion-card.active .inf-icon-wrap {
      background: var(--icon-hover-bg);
      transform: scale(1.1);
   }
   
   .accordion-card:hover .inf-icon-wrap img,
   .accordion-card.active .inf-icon-wrap img {
      transform: scale(1.15) rotate(3deg);
   }
   
   .accordion-card:hover .inf-card-desc,
   .accordion-card.active .inf-card-desc {
      opacity: 1;
      max-height: 150px;
      transform: translateY(0);
      margin-top: 10px;
   }
}

@media (max-width: 767.98px) {
   .accordion-gallery {
      flex-direction: column;
      gap: 20px;
      min-height: auto;
   }
   .accordion-card {
      padding: 35px 24px;
   }
   .accordion-card::before {
      opacity: 1;
   }
   .accordion-card-watermark {
      -webkit-text-stroke: 2px rgba(201, 168, 76, 0.03);
   }
   .inf-icon-wrap {
      background: var(--icon-hover-bg);
   }
   .accordion-card .inf-card-desc {
      opacity: 1;
      max-height: none;
      transform: translateY(0);
      overflow: visible;
   }
}
*/

.airport-section {
   --card-bg: #ffffff;
   --card-border: rgba(0, 0, 0, 0.05);
   --card-hover-bg: #ffffff;
   --card-title-color: #1a1a1a;
   --card-desc-color: #555555;
   --icon-bg: rgba(201, 168, 76, 0.05);
   --icon-hover-bg: rgba(201, 168, 76, 0.12);
   --shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}
/* Section Header Styling */
.airport-section .section-header {
   margin-bottom: 50px;
}

.airport-section .section-subtitle {
   display: inline-block;
   font-size: 0.85rem;
   font-weight: 700;
   color: #c9a84c;
   letter-spacing: 3px;
   text-transform: uppercase;
   margin-bottom: 12px;
   position: relative;
   padding: 4px 14px;
   background: rgba(201, 168, 76, 0.06);
   border-radius: 30px;
   border: 1px solid rgba(201, 168, 76, 0.15);
}

.airport-section .section-title {
   font-size: 2.5rem;
   font-weight: 800;
   color: #1a1a1a;
   line-height: 1.2;
   margin-bottom: 16px;
   letter-spacing: -0.5px;
}

.airport-section .section-title .highlight {
   color: #c9a84c;
   background: linear-gradient(135deg, #c9a84c 0%, #a48131 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   position: relative;
   display: inline-block;
}

.airport-section .title-divider-wrap {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 12px;
   margin-top: 15px;
}

.airport-section .title-line-left,
.airport-section .title-line-right {
   height: 2px;
   width: 40px;
   background: linear-gradient(90deg, transparent, #c9a84c);
}

.airport-section .title-line-right {
   background: linear-gradient(90deg, #c9a84c, transparent);
}

.airport-section .title-dot {
   width: 8px;
   height: 8px;
   background-color: #c9a84c;
   border-radius: 50%;
   box-shadow: 0 0 10px rgba(201, 168, 76, 0.6);
   animation: pulseGlow 2s infinite ease-in-out;
}

@keyframes pulseGlow {
   0%, 100% {
      transform: scale(1);
      box-shadow: 0 0 6px rgba(201, 168, 76, 0.4);
   }
   50% {
      transform: scale(1.3);
      box-shadow: 0 0 14px rgba(201, 168, 76, 0.8);
   }
}

.airport-section .description-wrap {
   font-size: 1.05rem;
   line-height: 1.7;
   color: #555555;

   margin-left: auto;
   margin-right: auto;
}

/* Glow Card Layout */
.glow-card {
   background: var(--card-bg);
   border: 1px solid var(--card-border);
   border-radius: 20px;
   padding: 40px 24px;
   text-align: center;
   position: relative;
   overflow: hidden;
   transition: transform 0.5s cubic-bezier(0.25, 1, 0.2, 1), border-color 0.4s ease, box-shadow 0.4s ease;
   will-change: transform;
   z-index: 2;
}

/* Radial backlight glow on hover */
.glow-card::after {
   content: '';
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%) scale(0.8);
   width: 250px;
   height: 250px;
   background: radial-gradient(circle, rgba(201, 168, 76, 0.07) 0%, rgba(201, 168, 76, 0) 70%);
   opacity: 0;
   transition: transform 0.5s ease, opacity 0.5s ease;
   will-change: transform, opacity;
   z-index: 1;
   pointer-events: none;
}

/* Colored top line indicator */
.glow-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 4px;
   background: linear-gradient(90deg, #c9a84c, #ffba23);
   opacity: 0;
   transition: opacity 0.3s ease;
}

.glow-card:hover, .glow-card.active {
   transform: translateY(-8px);
   border-color: rgba(201, 168, 76, 0.3);
   box-shadow: var(--shadow);
}
.glow-card:hover::after, .glow-card.active::after {
   opacity: 1;
   transform: translate(-50%, -50%) scale(1.1);
}
.glow-card:hover::before, .glow-card.active::before {
   opacity: 1;
}

.airport-section .inf-icon-wrap {
   width: 75px;
   height: 75px;
   background: var(--icon-bg);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 auto 24px;
   position: relative;
   z-index: 2;
   transition: transform 0.5s cubic-bezier(0.25, 1, 0.2, 1), background 0.4s ease;
   will-change: transform;
}
.airport-section .inf-icon-wrap img {
   width: 35px !important;
   height: 35px;
   object-fit: contain;
   transition: transform 0.5s cubic-bezier(0.25, 1, 0.2, 1);
   will-change: transform;
}
.glow-card:hover .inf-icon-wrap,
.glow-card.active .inf-icon-wrap {
   background: var(--icon-hover-bg);
   transform: scale(1.1);
}
.glow-card:hover .inf-icon-wrap img,
.glow-card.active .inf-icon-wrap img {
   transform: scale(1.12) rotate(3deg);
}

.airport-section .inf-card-title {
   font-size: 1.25rem;
   color: var(--card-title-color);
   font-weight: 700;
   margin-bottom: 12px;
   line-height: 1.4;
   position: relative;
   z-index: 2;
}
.airport-section .inf-card-desc {
   color: var(--card-desc-color);
   font-size: 0.92rem;
   line-height: 1.6;
   margin-bottom: 0;
   font-weight: 400;
   position: relative;
   z-index: 2;
}
.inf-icon-wrap i{
    font-size: 55px;
    color: #d4af37;
    display: block;
}

/* 
--------------------------------------------------------------------------
   (.download-app-section) - Disabled
--------------------------------------------------------------------------
.download-app-section {
   background: #0b0b0c;
   background-image: 
      radial-gradient(circle at 80% 20%, rgba(201, 168, 76, 0.16) 0%, transparent 60%),
      radial-gradient(circle at 10% 80%, rgba(201, 168, 76, 0.08) 0%, transparent 60%);
   color: #ffffff;
   position: relative;
   border-top: 1px solid rgba(255, 255, 255, 0.03);
   border-bottom: 1px solid rgba(255, 255, 255, 0.03);
}

.download-app-section .app-badge {
   display: inline-block;
   font-size: 0.8rem;
   font-weight: 700;
   color: #c9a84c;
   letter-spacing: 3px;
   padding: 6px 16px;
   background: rgba(201, 168, 76, 0.07);
   border: 1px solid rgba(201, 168, 76, 0.25);
   border-radius: 30px;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.download-app-section .app-title {
   font-size: 3rem;
   font-weight: 800;
   line-height: 1.25;
   color: #ffffff;
   letter-spacing: -0.5px;
}

.download-app-section .gradient-text {
   background: linear-gradient(135deg, #c9a84c 0%, #ffc84a 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   font-weight: 900;
}

.download-app-section .app-description {
   font-size: 1.08rem;
   line-height: 1.7;
   color: #a5a5a5;
   max-width: 540px;
}

.download-app-section .feature-item {
   background: rgba(255, 255, 255, 0.02);
   border: 1px solid rgba(255, 255, 255, 0.05);
   border-radius: 20px;
   padding: 24px 20px;
   transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
   will-change: transform, border-color, box-shadow, background;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
   backdrop-filter: blur(8px);
   -webkit-backdrop-filter: blur(8px);
}

.download-app-section .feature-item:hover {
   background: rgba(255, 255, 255, 0.05);
   border-color: rgba(201, 168, 76, 0.35);
   transform: translateY(-5px);
   box-shadow: 
      0 15px 35px rgba(0, 0, 0, 0.3),
      0 0 20px rgba(201, 168, 76, 0.1);
}

.download-app-section .feature-icon-wrapper {
   width: 46px;
   height: 46px;
   background: rgba(201, 168, 76, 0.08);
   border-radius: 14px;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #c9a84c;
   font-size: 1.15rem;
   flex-shrink: 0;
   border: 1px solid rgba(201, 168, 76, 0.2);
   transition: background 0.3s, transform 0.3s, color 0.3s;
}

.download-app-section .feature-item:hover .feature-icon-wrapper {
   background: #c9a84c;
   color: #1a1a1a;
   transform: scale(1.08) rotate(-5deg);
}

.download-app-section .feature-title {
   font-size: 1.1rem;
   font-weight: 700;
   color: #ffffff;
   margin-bottom: 6px;
}

.download-app-section .feature-text {
   font-size: 0.92rem;
   line-height: 1.5;
   color: #a5a5a5;
   margin-bottom: 0;
}

.download-app-section .store-btn {
   display: inline-flex;
   align-items: center;
   background: rgba(255, 255, 255, 0.02);
   border: 1px solid rgba(255, 255, 255, 0.08);
   padding: 12px 24px;
   border-radius: 16px;
   color: #ffffff;
   text-decoration: none;
   transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
   cursor: pointer;
   backdrop-filter: blur(5px);
   -webkit-backdrop-filter: blur(5px);
}

.download-app-section .store-btn:hover {
   background: rgba(255, 255, 255, 0.06);
   border-color: rgba(201, 168, 76, 0.4);
   transform: translateY(-3px);
   box-shadow: 
      0 12px 24px rgba(0, 0, 0, 0.3),
      0 0 15px rgba(201, 168, 76, 0.05);
}

.download-app-section .store-icon {
   margin-right: 14px;
   transition: transform 0.3s;
}

.download-app-section .store-btn:hover .store-icon {
   transform: scale(1.15);
}

.download-app-section .btn-text {
   display: flex;
   flex-direction: column;
}

.download-app-section .btn-subtitle {
   font-size: 0.68rem;
   text-transform: uppercase;
   letter-spacing: 0.8px;
   opacity: 0.5;
   line-height: 1;
}

.download-app-section .btn-title {
   font-size: 1.15rem;
   font-weight: 700;
   line-height: 1.2;
   margin-top: 3px;
}

.download-app-section .visual-column {
   position: relative;
   perspective: 1500px;
}

.download-app-section .mockup-container {
   position: relative;
   width: 100%;
   max-width: 380px;
   margin: auto;
}

.download-app-section .mockup-container::before {
   content: '';
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 450px;
   height: 450px;
   background: radial-gradient(circle, rgba(201, 168, 76, 0.15) 0%, transparent 70%);
   pointer-events: none;
   z-index: 1;
}

.download-app-section .glowing-orb {
   position: absolute;
   border-radius: 50%;
   filter: blur(80px);
   z-index: 1;
   pointer-events: none;
}

.download-app-section .orb-1 {
   top: -15%;
   left: -15%;
   width: 280px;
   height: 280px;
   background: rgba(201, 168, 76, 0.18);
}

.download-app-section .orb-2 {
   bottom: -15%;
   right: -15%;
   width: 300px;
   height: 300px;
   background: rgba(201, 168, 76, 0.12);
}

.phone-3d-wrapper {
   position: relative;
   width: 320px;
   height: 640px;
   margin: auto;
   transform-style: preserve-3d;
   transform: rotateY(-18deg) rotateX(10deg) rotateZ(3deg);
   transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);
   z-index: 2;
}

.phone-3d-wrapper:hover {
   transform: rotateY(-5deg) rotateX(4deg) rotateZ(1deg) scale(1.03);
}

.phone-bezel-side {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   border-radius: 42px;
   background: #111111;
   transform-style: preserve-3d;
   border: 1px solid rgba(255, 255, 255, 0.1);
}

.phone-bezel-side.layer-1 { transform: translateZ(-2px); background: #282828; }
.phone-bezel-side.layer-2 { transform: translateZ(-4px); background: #1c1c1c; }
.phone-bezel-side.layer-3 { transform: translateZ(-6px); background: #111111; }

.phone-shadow-3d {
   position: absolute;
   top: 5%;
   left: 5%;
   width: 90%;
   height: 90%;
   background: rgba(0, 0, 0, 0.65);
   border-radius: 40px;
   filter: blur(25px);
   transform: translateZ(-30px) translateY(24px) translateX(-12px);
   transition: transform 0.8s ease, filter 0.8s ease;
   pointer-events: none;
}

.phone-3d-wrapper:hover .phone-shadow-3d {
   transform: translateZ(-50px) translateY(35px) translateX(-6px);
   filter: blur(35px);
}

.phone-body-3d {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: #080808;
   border: 12px solid #1a1a1c;
   border-radius: 42px;
   box-shadow: 
      inset 0 0 10px rgba(0,0,0,0.95),
      0 0 1px rgba(255, 255, 255, 0.25);
   overflow: hidden;
   transform: translateZ(0);
   transform-style: preserve-3d;
}

.phone-screen {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: #121214;
   overflow: hidden;
   display: flex;
   flex-direction: column;
}

.phone-notch {
   position: absolute;
   top: 10px;
   left: 50%;
   transform: translateX(-50%);
   width: 100px;
   height: 26px;
   background: #000000;
   border-radius: 15px;
   z-index: 10;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   box-shadow: 0 1px 2px rgba(255,255,255,0.05);
}

.notch-camera {
   width: 8px;
   height: 8px;
   background: #111133;
   border-radius: 50%;
}

.notch-speaker {
   width: 35px;
   height: 3px;
   background: #222222;
   border-radius: 2px;
}

.phone-status-bar {
   font-size: 0.75rem;
   color: #ffffff;
   font-weight: 600;
   z-index: 9;
   margin-top: 5px;
}

.phone-status-bar i {
   font-size: 0.7rem;
}

.app-ui-content {
   width: 100%;
   height: 100%;
   padding-top: 38px !important;
   flex-grow: 1;
   display: flex;
   flex-direction: column;
   z-index: 2;
}

.app-menu-dot {
   width: 18px;
   cursor: pointer;
}

.app-menu-dot span {
   height: 2px;
   background: #ffffff;
   border-radius: 2px;
}

.app-menu-dot span:nth-child(1) { width: 100%; height: 2px; }
.app-menu-dot span:nth-child(2) { width: 60%; height: 2px; align-self: flex-end; }

.app-map-area {
   border-radius: 18px;
   border: 1px solid rgba(255,255,255,0.06);
   background: #151518;
   position: relative;
}

.map-bg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-size: 16px 16px;
   background-image: 
      linear-gradient(to right, rgba(255,255,255,0.02) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(255,255,255,0.02) 1px, transparent 1px);
}

.route-line-svg {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

.route-line-svg path {
   stroke: #c9a84c;
   stroke-width: 3.5;
   stroke-linecap: round;
   stroke-dasharray: 8 6;
   animation: routeFlow 4s infinite linear;
   filter: drop-shadow(0 0 3px rgba(201, 168, 76, 0.8));
}

@keyframes routeFlow {
   to {
      stroke-dashoffset: -28;
   }
}

.map-marker {
   position: absolute;
   transform: translate(-50%, -50%);
   z-index: 4;
}

.marker-pin {
   width: 26px;
   height: 26px;
   background: #f03c2d;
   border-radius: 50% 50% 50% 0;
   transform: rotate(-45deg);
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 4px 10px rgba(0,0,0,0.45);
}

.marker-pin.gold {
   background: #c9a84c;
}

.marker-pin i {
   color: #ffffff;
   font-size: 0.7rem;
   transform: rotate(45deg);
}

.marker-pulse {
   position: absolute;
   top: -12px;
   left: -12px;
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background: rgba(240, 60, 45, 0.25);
   animation: markerRipple 2s infinite ease-out;
}

.marker-pin.gold ~ .marker-pulse {
   background: rgba(201, 168, 76, 0.25);
}

@keyframes markerRipple {
   0% { transform: scale(0.3); opacity: 1; }
   100% { transform: scale(1); opacity: 0; }
}

.car-tracker-node {
   position: absolute;
   width: 28px;
   height: 28px;
   background: #ffffff;
   border: 2px solid #c9a84c;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 5;
   transform: translate(-50%, -50%);
   box-shadow: 0 4px 12px rgba(0,0,0,0.5);
   animation: carFloating 3s infinite ease-in-out;
}

.car-icon {
   color: #1a1a1a;
   font-size: 0.8rem;
}

.car-halo {
   position: absolute;
   width: 38px;
   height: 38px;
   border: 1.5px solid rgba(201, 168, 76, 0.5);
   border-radius: 50%;
   animation: carHaloRipple 2s infinite linear;
}

@keyframes carHaloRipple {
   0% { transform: scale(0.6); opacity: 1; }
   100% { transform: scale(1.3); opacity: 0; }
}

@keyframes carFloating {
   0%, 100% { transform: translate(-50%, -50%) translateY(0); }
   50% { transform: translate(-50%, -50%) translateY(-4px); }
}

.app-status-card {
   background: rgba(255, 255, 255, 0.06);
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-radius: 20px;
   backdrop-filter: blur(16px);
   -webkit-backdrop-filter: blur(16px);
   box-shadow: 0 10px 25px rgba(0,0,0,0.4);
}

.driver-avatar {
   width: 40px;
   height: 40px;
   border-radius: 50%;
   overflow: hidden;
   border: 2px solid #c9a84c;
}

.driver-avatar img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.driver-name {
   font-size: 0.85rem;
   font-weight: 700;
   color: #ffffff !important;
}

.car-details {
   font-size: 0.7rem;
   color: #b0b0b0 !important;
}

.stars {
   color: #c9a84c !important;
}

.driver-rating {
   font-size: 0.78rem;
   font-weight: 700;
}

.status-label {
   letter-spacing: 0.6px;
   font-size: 0.58rem !important;
   color: #a5a5a5 !important;
}

.eta-time {
   font-size: 0.9rem;
   color: #c9a84c !important;
}

.ride-controls {
   display: flex;
}

.control-btn {
   width: 34px;
   height: 34px;
   border-radius: 50%;
   background: rgba(255,255,255,0.08);
   display: flex;
   align-items: center;
   justify-content: center;
   color: #ffffff !important;
   font-size: 0.85rem;
   transition: background 0.3s, transform 0.3s;
}

.control-btn:hover {
   background: rgba(255,255,255,0.18);
   transform: scale(1.08);
   text-decoration: none;
}

.control-btn.chat-btn.active {
   background: #c9a84c;
   color: #121214 !important;
   position: relative;
}

.control-btn.chat-btn.active::after {
   content: '';
   position: absolute;
   top: 3px;
   right: 3px;
   width: 7px;
   height: 7px;
   background: #f03c2d;
   border-radius: 50%;
   border: 1px solid #c9a84c;
}

.phone-home-indicator {
   position: absolute;
   bottom: 8px;
   left: 50%;
   transform: translateX(-50%);
   width: 120px;
   height: 4px;
   background: rgba(255,255,255,0.35);
   border-radius: 2px;
   z-index: 10;
}

@media (max-width: 991.98px) {
   .download-app-section {
      text-align: center;
      padding-top: 80px;
      padding-bottom: 80px;
   }
   
   .download-app-section .app-description {
      margin-left: auto;
      margin-right: auto;
   }
   
   .download-app-section .feature-item {
      text-align: left;
   }
   
   .download-app-section .download-buttons {
      justify-content: center;
   }
   
   .download-app-section .visual-column {
      margin-top: 50px;
   }
   
   .phone-3d-wrapper {
      transform: rotateY(0deg) rotateX(0deg) rotateZ(0deg);
   }
}

@media (max-width: 575.98px) {
   .download-app-section .app-title {
      font-size: 2.1rem;
   }
   
   .download-app-section .store-btn {
      width: 100%;
      justify-content: center;
      margin-right: 0 !important;
   }
}
*/

