body {
      font-family: "Playfair Display", Georgia, serif;
      background-color: #f8f9fa;
    }
   .custom-navbar {
      background-color: rgba(15, 23, 42, 0.85); 
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .navbar-brand img {
      max-height: 70px;
      width: auto;
      transition: transform 0.3s ease;
    }
    
    .navbar-brand:hover img {
      transform: scale(1.05);
    }

    .nav-link {
      font-weight: 500;
      color: rgba(255, 255, 255, 0.85) !important;
      position: relative;
      transition: color 0.3s ease;
    }

    .nav-link::after {
      content: '';
      position: absolute;
      width: 0;
      height: 2px;
      bottom: 0;
      left: 8px;
      background-color: #ffc107;
      transition: width 0.3s ease;
    }

    .nav-link:hover::after, .nav-link.active::after {
      width: calc(100% - 16px);
    }

    .nav-link:hover, .nav-link.active {
      color: #ffc107 !important; 
    }

    /* Hero Header Section */
    .hero-header {
      /* Smooth dark overlay gradient ensures text remains highly readable */
      background: linear-gradient(rgba(15, 23, 42, 0.75), rgba(15, 23, 42, 0.85)), 
                  url('exterior.jpg') no-repeat center center;
      background-size: cover;
      height: auto;
      display: flex;
      align-items: center;
      padding-top:40px; /* Accounts for the fixed navbar height */
    }

    /* Responsive Typography for your requested copy */
    .hero-title {
	font-family: "Inter", Arial, sans-serif;
      font-size: calc(1.2rem + 2vw); 
      font-weight: 800;
      letter-spacing: -1px;
      line-height: 1.15;
      color: #ffffff;
    }

    .hero-subtitle {
		font-family: "Playfair Display", Georgia, serif;
      font-size: 1.15rem;
      color: #cbd5e1; /* Soft gray/blue for secondary text */
      font-weight: 400;
    }

    /* Custom Button Enhancements */
    .btn-primary-custom {
      background-color: #ffc107;
      border-color: #ffc107;
      color: #0f172a;
      font-weight: 700;
      padding: 0.8rem 2rem;
      transition: all 0.2s ease;
    }

    .btn-primary-custom:hover {
      background-color: #e0a800;
      border-color: #e0a800;
      color: #0f172a;
      transform: translateY(-2px);
    }

    .btn-outline-custom {
      border: 2px solid #ffffff;
      color: #ffffff;
      font-weight: 600;
      padding: 0.8rem 2rem;
      transition: all 0.2s ease;
    }

    .btn-outline-custom:hover {
      background-color: #ffffff;
      color: #0f172a;
      transform: translateY(-2px);
    }

    /* Permanent Proximity Banner Container */
    .proximity-banner {
      background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); /* Deep slate aesthetic */
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.08);
    }

    /* Graphic Block Time Accent */
    .time-graphic-block {
      background: #ffc107; /* Premium Bootstrap Yellow */
      color: #0f172a;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      min-height: 140px;
      position: relative;
    }

    .time-number {
      font-size: 3.5rem;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -2px;
    }

    .time-label {
      font-size: 0.75rem;
      font-weight: 700;
      text-uppercase: uppercase;
      letter-spacing: 1.5px;
    }

    /* Glowing radar pulse to symbolize closeness/live tracking */
    .radar-pulse {
      position: absolute;
      top: 15px;
      right: 15px;
      width: 8px;
      height: 8px;
      background-color: #dc3545;
      border-radius: 50%;
    }

    .radar-pulse::after {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: #dc3545;
      border-radius: 50%;
      animation: pulse 1.8s infinite ease-out;
      top: 0;
      left: 0;
    }

    @keyframes pulse {
      0% { transform: scale(1); opacity: 1; }
      100% { transform: scale(3.5); opacity: 0; }
    }

    /* Text Formatting */
    .banner-title {
		font-family: "Inter", Arial, sans-serif;
      font-size: 1.35rem;
      font-weight: 800;
      letter-spacing: -0.3px;
    }

    .banner-text {
		font-family: "Playfair Display", Georgia, serif;
      color: #cbd5e1;
      font-size: 1rem;
    }

    .dashed-divider {
      border-left: 2px dashed rgba(255, 255, 255, 0.15);
      height: 100%;
    }

    .section-title {
		font-family: "Inter", Arial, sans-serif;
      font-weight: 800;
      color: #0f172a;
      letter-spacing: -0.5px;
    }

    /* Card Wrapper Design */
    .events-widget-card {
      border: none;
      border-radius: 16px;
      overflow: hidden;
      background: #ffffff;
    }

    /* Header styling with gradient accent */
    .widget-header {
      background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
      padding: 1.5rem 2rem;
    }

    /* Individual Event Row Adjustments */
    .event-row {
      transition: background-color 0.2s ease;
      border-bottom: 1px solid #f1f5f9;
    }

    .event-row:hover {
      background-color: #f8fafc;
    }

    /* Date Box Component */
    .date-badge {
      background-color: #f1f5f9;
      color: #0f172a;
      width: 65px;
      height: 65px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border-radius: 12px;
      font-weight: 700;
      line-height: 1.2;
    }

    .date-badge .month {
      font-size: 0.75rem;
      text-uppercase: uppercase;
      color: #64748b;
    }

    .date-badge .day {
      font-size: 1.4rem;
    }

    /* Text & Status Styles */
    .event-title {
      font-weight: 600;
      color: #0f172a;
      font-size: 1.05rem;
      margin-bottom: 0.25rem;
    }

    .venue-tag {
      font-size: 0.85rem;
      color: #64748b;
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }

    .urgency-pill {
      font-size: 0.75rem;
      font-weight: 600;
      padding: 0.35rem 0.75rem;
      border-radius: 50px;
    }

    /* Custom Booking CTA Button inside the table */
    .btn-book-event {
      background-color: #ffc107;
      color: #0f172a;
      font-weight: 700;
      font-size: 0.85rem;
      border: none;
      padding: 0.5rem 1.25rem;
      border-radius: 8px;
      transition: all 0.2s ease;
    }

    .btn-book-event:hover {
      background-color: #e0a800;
      color: #0f172a;
      transform: translateY(-1px);
    }

    .section-title {
      font-weight: 800;
      color: #0f172a;
      letter-spacing: -0.5px;
    }

    /* Transit Card Wrapper */
    .transit-card {
      border: 1px solid #e2e8f0;
      border-radius: 16px;
      background: #ffffff;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .transit-card:hover {
      transform: translateY(-4px);
      border-color: #cbd5e1;
      box-shadow: 0 12px 20px -5px rgba(0, 0, 0, 0.05);
    }

    /* Left-side Icon/Graphic Frame */
    .icon-box {
      width: 56px;
      height: 56px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    /* Specialized branding colors for local context */
    .bg-max-rail {
      background-color: rgba(25, 135, 84, 0.1); /* TriMet green theme */
      color: #198754;
    }

    .bg-union-station {
      background-color: rgba(13, 110, 253, 0.1); /* Station blue theme */
      color: #0d6efd;
    }

    /* Time Badge Overlay */
    .time-badge {
      font-size: 0.8rem;
      font-weight: 700;
      padding: 0.35rem 0.75rem;
      border-radius: 50px;
    }

    .card-headline {
      font-weight: 700;
      color: #0f172a;
      font-size: 1.15rem;
    }

    .feature-list-text {
      font-size: 0.9rem;
      color: #475569;
    }

    .section-title {
      font-weight: 800;
      color: #0f172a;
      letter-spacing: -0.5px;
    }

    /* Demographic Card Styling */
    .demo-card {
      border: 1px solid #f1f5f9;
      border-radius: 16px;
      background: #f8fafc;
      padding: 2rem;
      height: 100%;
      transition: all 0.25s ease;
    }

    .demo-card:hover {
      background: #ffffff;
      border-color: #e2e8f0;
      box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.08);
      transform: translateY(-2px);
    }

    /* Icon Accent Circle */
    .icon-wrapper {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      background-color: #0f172a;
      color: #ffffff;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 1.25rem;
    }

    .demo-card:hover .icon-wrapper {
      background-color: #ffc107; /* Pop yellow on card hover */
      color: #0f172a;
    }

    .card-heading {
      font-weight: 700;
      color: #0f172a;
      font-size: 1.15rem;
      margin-bottom: 0.5rem;
    }

    .demo-badge {
      font-size: 0.75rem;
      font-weight: 600;
      text-uppercase: uppercase;
      letter-spacing: 0.5px;
      color: #64748b;
    }

    .opportunity-section {
      background: #ffffff;
      border-radius: 24px;
      border: 1px solid #e2e8f0;
    }

    .section-title {
		font-family: "Inter", Arial, sans-serif;
      font-weight: 800;
      color: #0f172a;
      letter-spacing: -1px;
      line-height: 1.2;
    }

    /* Value Checklist styling */
    .opportunity-list-item {
      display: flex;
      gap: 1rem;
      align-items: start;
    }

    .icon-check-box {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background-color: rgba(25, 135, 84, 0.1);
      color: #198754;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      font-weight: bold;
    }

    .benefit-title {
		font-family: "Inter", Arial, sans-serif;
      font-weight: 700;
      color: #0f172a;
      font-size: 1.1rem;
      margin-bottom: 0.25rem;
    }

    /* Embedded Highlight Badge */
    .location-banner-badge {
      background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
      color: #ffffff;
      border-radius: 16px;
      padding: 2rem;
    }

    /* Footer Container Styles */
    .site-footer {
      background-color: #0f172a; /* Sleek Dark Slate */
      color: #94a3b8; /* Soft readable gray for links and body */
      font-size: 0.95rem;
    }

    .footer-heading {
      font-weight: 700;
      color: #ffffff;
      font-size: 1.1rem;
      letter-spacing: -0.2px;
    }

    /* Link Hover Effects */
    .site-footer a {
      color: #94a3b8;
      text-decoration: none;
      transition: all 0.2s ease;
    }

    .site-footer a:hover {
      color: #ffc107; /* Premium Yellow/Gold on hover */
      padding-left: 4px; /* Subtle slide interaction */
    }

    /* Social Media Icons Box Styling */
    .social-icon-link {
      width: 38px;
      height: 38px;
      background-color: rgba(255, 255, 255, 0.05);
      border-radius: 8px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-right: 8px;
      color: #ffffff !important;
    }

    .social-icon-link:hover {
      background-color: #ffc107;
      color: #0f172a !important;
      padding-left: 0 !important; /* Locks icon layout scale */
      transform: translateY(-3px);
    }

    /* Dynamic Back to Top Button Sticky Styling */
    .back-to-top-btn {
      position: fixed;
      bottom: 25px;
      right: 25px;
      width: 45px;
      height: 45px;
      background-color: #ffc107;
      color: #0f172a;
      border: none;
      border-radius: 50%;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.2rem;
      cursor: pointer;
      z-index: 1000;
      opacity: 0; /* Hidden initially, toggled via JS */
      visibility: hidden;
      transition: all 0.3s ease;
    }

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

    .back-to-top-btn:hover {
      background-color: #e0a800;
      transform: translateY(-3px);
    }

    /* Underline divider rule adjustments */
    .footer-divider {
      border-color: rgba(255, 255, 255, 0.08);
    }

        /* Slider Wrapper */
        .zoom-slider {
            width: 100%;
            height:100vh; /* Adjust height as needed */
            overflow: hidden;
            position: relative;
        }

        .zoom-slider .carousel-inner,
        .zoom-slider .carousel-item {
            height: 100%;
        }

        /* The Zoom Effect Magic */
        .zoom-slider .carousel-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transform: scale(1);
            transition: transform 6s ease-in-out; /* Slow, smooth zoom */
        }

        /* Triggers zoom ONLY when the slide becomes active */
        .zoom-slider .carousel-item.active img {
            transform: scale(1.15);
        }

        /* Dark overlay for text readability */
        .zoom-slider .carousel-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(to bottom, rgba(0,0,0,0.2), rgba(0,0,0,0.6));
            z-index: 1;
        }

        /* Animated Captions */
        .zoom-slider .carousel-caption {
            z-index: 2;
            bottom: 20%;
            text-align: left;
            max-width: 600px;
            left: 10%;
        }

        .zoom-slider .carousel-caption h5 {
            font-size: 3rem;
            font-weight: 700;
            text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s ease out 0.5s;
        }

        .zoom-slider .carousel-caption p {
            font-size: 1.2rem;
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s ease out 0.8s;
        }

        /* Slide-in text animation when active */
        .zoom-slider .carousel-item.active .carousel-caption h5,
        .zoom-slider .carousel-item.active .carousel-caption p {
            opacity: 1;
            transform: translateY(0);
        }

        /* Custom Modern Next/Prev Buttons */
        .zoom-slider .carousel-control-prev,
        .zoom-slider .carousel-control-next {
            width: 60px;
            height: 60px;
            background-color: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            top: 50%;
            transform: translateY(-50%);
            backdrop-filter: blur(5px);
            transition: all 0.3s ease;
            z-index: 3;
        }

        .zoom-slider .carousel-control-prev { left: 30px; }
        .zoom-slider .carousel-control-next { right: 30px; }

        .zoom-slider .carousel-control-prev:hover,
        .zoom-slider .carousel-control-next:hover {
            background-color: #fff;
            color: #000;
            box-shadow: 0 0 15px rgba(255,255,255,0.5);
        }

        .zoom-slider .carousel-control-prev-icon,
        .zoom-slider .carousel-control-next-icon {
            background-image: none; /* Remove default bootstrap arrows */
            display: flex;
            align-items: center;
            justify-content: center;
            color: inherit;
            font-size: 1.5rem;
        }
		/* ==================================
   Attractive Room Section
================================== */

.rooms-section {
    background-color: #f4f7fa;
}

.rooms-subtitle {
	font-family: "Playfair Display", Georgia, serif;
    display: inline-block;
    margin-bottom: 8px;
    color: #8a4b00;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.rooms-title {
	font-family: "Inter", Arial, sans-serif;
    margin-bottom: 14px;
    color: #102f4f;
    font-size: clamp(32px, 5vw, 48px);
    font-weight: 800;
}

.rooms-intro {
	font-family: "Inter", Arial, sans-serif;
    max-width: 720px;
    margin-bottom: 0;
    color: #455565;
    font-size: 17px;
    line-height: 1.8;
}

.room-card {
    overflow: hidden;
    background-color: #ffffff;
    border: 1px solid #d9e1e8;
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(16, 47, 79, 0.12);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.room-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(16, 47, 79, 0.18);
}

.room-image-wrapper {
    position: relative;
    height: 320px;
    overflow: hidden;
    background-color: #dce4eb;
}

.room-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.room-card:hover .room-image {
    transform: scale(1.06);
}

.room-badge {
    position: absolute;
    top: 18px;
    left: 18px;
    padding: 8px 15px;
    color: #ffffff;
    background-color: #7a3500;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4px;
}

.room-content {
    padding: 30px;
}

.room-name {
	font-family: "Inter", Arial, sans-serif;
    margin-bottom: 15px;
    color: #102f4f;
    font-size: 27px;
    font-weight: 800;
    text-transform: uppercase;
}

.room-description {
	font-family: "Playfair Display", Georgia, serif;
    margin-bottom: 22px;
    color: #455565;
    font-size: 16px;
    line-height: 1.75;
}

.room-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

.room-features li {
	font-family: "Playfair Display", Georgia, serif;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #263746;
    font-size: 15px;
    font-weight: 600;
}

.room-features li span {
    width: 20px;
    color: #8a4b00;
    text-align: center;
}

.room-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 12px 24px;
    color: #ffffff;
    background-color: #102f4f;
    border: 2px solid #102f4f;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: background-color 0.3s ease,
                border-color 0.3s ease,
                transform 0.3s ease;
}

.room-button:hover,
.room-button:focus {
    color: #ffffff;
    background-color: #7a3500;
    border-color: #7a3500;
    transform: translateY(-2px);
}

.room-button:focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 3px;
}

/* Tablet */
@media (max-width: 991.98px) {
    .room-image-wrapper {
        height: 270px;
    }

    .room-content {
        padding: 25px;
    }

    .room-features {
        grid-template-columns: 1fr;
    }
}

/* Mobile */
@media (max-width: 575.98px) {
    .rooms-section {
        padding-top: 55px !important;
        padding-bottom: 55px !important;
    }

    .room-image-wrapper {
        height: 230px;
    }

    .room-content {
        padding: 22px 20px;
    }

    .room-name {
        font-size: 23px;
    }

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

    .room-button {
        width: 100%;
    }
}
   /* Horizontal Attractions Slider */

.attractions-slider {
    width: 100%;
    padding: 10px 55px 25px;
}

.attractions-scroll-container {
    display: flex;
    gap: 24px;
    overflow-x: auto;
    padding: 10px 5px 30px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
}

.attractions-scroll-container::-webkit-scrollbar {
    display: none;
}

.attractions-scroll-container .attraction-card {
    flex: 0 0 calc(33.333% - 16px);
    min-width: 0;
    scroll-snap-align: start;
}

.attraction-scroll-btn {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    padding: 0;
    color: #ffffff;
    background-color: #102f4f;
    border: 2px solid #102f4f;
    border-radius: 50%;
    box-shadow: 0 7px 20px rgba(16, 47, 79, 0.25);
    cursor: pointer;
    transform: translateY(-50%);
    transition:
        background-color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.attraction-scroll-btn:hover,
.attraction-scroll-btn:focus {
    color: #ffffff;
    background-color: #8a4100;
    border-color: #8a4100;
    transform: translateY(-50%) scale(1.08);
}

.attraction-scroll-btn:focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 3px;
}

.attraction-scroll-prev {
    left: 0;
}

.attraction-scroll-next {
    right: 0;
}

/* Tablet */

@media (max-width: 991.98px) {
    .attractions-scroll-container .attraction-card {
        flex-basis: calc(50% - 12px);
    }
}

/* Mobile */

@media (max-width: 575.98px) {
    .attractions-slider {
        padding-right: 0;
        padding-left: 0;
    }

    .attractions-scroll-container {
        gap: 16px;
        padding-right: 15px;
        padding-left: 15px;
    }

    .attractions-scroll-container .attraction-card {
        flex-basis: 88%;
    }

    .attraction-scroll-btn {
        display: none;
    }
}
/* =====================================
   Nearby Attractions Section
===================================== */

.nearby-attractions {
    background-color: #f4f7f9;
}

.attractions-small-title {
	font-family: "Playfair Display", Georgia, serif;
    display: inline-block;
    margin-bottom: 8px;
    color: #8a4100;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.attractions-main-title {
	font-family: "Inter", Arial, sans-serif;
    margin-bottom: 15px;
    color: #102f4f;
    font-size: clamp(24px, 5vw, 48px);
    font-weight: 800;
    line-height: 1.2;
}

.attractions-intro {
	font-family: "Playfair Display", Georgia, serif;
    max-width: 760px;
    margin-bottom: 0;
    color: #455565;
    font-size: 17px;
    line-height: 1.8;
}

/* Attraction Card */

.attraction-card {
    position: relative;
    overflow: hidden;
    background-color: #ffffff;
    border: 1px solid #d6e0e8;
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(16, 47, 79, 0.11);
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.attraction-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(16, 47, 79, 0.18);
}

/* Attraction Image */

.attraction-image-wrapper {
    position: relative;
    height: 255px;
    overflow: hidden;
    background-color: #dce4e9;
}

.attraction-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.attraction-card:hover .attraction-image {
    transform: scale(1.07);
}

.attraction-image-wrapper::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 45%;
    background: linear-gradient(
        to top,
        rgba(0, 24, 46, 0.65),
        rgba(0, 24, 46, 0)
    );
    content: "";
}

/* Icon */

.attraction-icon {
	font-family: "Inter", Arial, sans-serif;
    position: absolute;
    right: 22px;
    bottom: -25px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    color: #ffffff;
    background-color: #8a4100;
    border: 4px solid #ffffff;
    border-radius: 50%;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    font-size: 21px;
}

/* Card Content */

.attraction-content {
    padding: 32px 28px 28px;
}

.attraction-category {
    display: inline-block;
    margin-bottom: 9px;
    color: #8a4100;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.attraction-name {
    margin-bottom: 14px;
    color: #102f4f;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.3;
}

.attraction-description {
    min-height: 84px;
    margin-bottom: 22px;
    color: #455565;
    font-size: 15px;
    line-height: 1.75;
}

/* Direction Link */

.attraction-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 44px;
    padding: 10px 18px;
    color: #ffffff;
    background-color: #102f4f;
    border: 2px solid #102f4f;
    border-radius: 7px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition:
        background-color 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.attraction-link:hover,
.attraction-link:focus {
    color: #ffffff;
    background-color: #8a4100;
    border-color: #8a4100;
    transform: translateY(-2px);
}

.attraction-link:focus-visible {
    outline: 3px solid #ffbf47;
    outline-offset: 3px;
}

/* Tablet */

@media (max-width: 991.98px) {
    .attraction-image-wrapper {
        height: 245px;
    }

    .attraction-description {
        min-height: auto;
    }
}

/* Mobile */

@media (max-width: 575.98px) {
    .nearby-attractions {
        padding-top: 55px !important;
        padding-bottom: 55px !important;
    }

    .attractions-heading {
        margin-bottom: 35px !important;
    }

    .attractions-intro {
        font-size: 15px;
    }

    .attraction-image-wrapper {
        height: 225px;
    }

    .attraction-content {
        padding: 31px 21px 24px;
    }

    .attraction-name {
        font-size: 21px;
    }

    .attraction-link {
        width: 100%;
        justify-content: center;
    }
} 

/* =====================================
   Event Parking Section
===================================== */

.event-parking-section {
  background-color: #f3f6f8;
}

.event-parking-card {
  overflow: hidden;
  background-color: #ffffff;
  border: 1px solid #d9e1e7;
  border-radius: 22px;
  box-shadow: 0 18px 45px rgba(15, 45, 75, 0.15);
}

/* Parking Picture */

.event-parking-image {
  position: relative;
  height: 100%;
  min-height: 500px;
  overflow: hidden;
  background-color: #d9e1e7;
}

.event-parking-image::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(7, 31, 54, 0.55),
    rgba(7, 31, 54, 0.05)
  );
  content: "";
  pointer-events: none;
}

.event-parking-image img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 500px;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.event-parking-card:hover .event-parking-image img {
  transform: scale(1.05);
}

.parking-image-badge {
  position: absolute;
  bottom: 25px;
  left: 25px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 11px 17px;
  color: #102f4f;
  background-color: #ffffff;
  border-radius: 50px;
  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.2);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Parking Content */

.event-parking-content {
  display: flex;
  min-height: 500px;
  flex-direction: column;
  justify-content: center;
  padding: 55px;
}

.parking-small-title {
  display: inline-block;
  margin-bottom: 11px;
  color: #804000;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.event-parking-title {
	font-family: "Inter", Arial, sans-serif;
  margin-bottom: 18px;
  color: #102f4f;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 800;
  line-height: 1.2;
}

.event-parking-description {
	font-family: "Playfair Display", Georgia, serif;
  margin-bottom: 25px;
  color: #455565;
  font-size: 17px;
  line-height: 1.8;
}

/* Parking Notice */

.parking-charge-notice {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
  padding: 17px 19px;
  color: #3d2500;
  background-color: #fff1c7;
  border: 1px solid #e3b94f;
  border-left: 5px solid #8a4b00;
  border-radius: 10px;
}

.parking-notice-icon {
	font-family: "Playfair Display", Georgia, serif;
  display: inline-flex;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: #ffffff;
  background-color: #7a3d00;
  border-radius: 50%;
  font-size: 18px;
}

.parking-charge-notice strong {
  display: block;
  margin-bottom: 3px;
  color: #3d2500;
  font-size: 17px;
}

.parking-charge-notice span {
  display: block;
  color: #5f470f;
  font-size: 14px;
  line-height: 1.5;
}

/* Booking Button */

.event-parking-button {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-content: center;
  gap: 11px;
  min-height: 54px;
  padding: 14px 26px;
  color: #ffffff;
  background-color: #102f4f;
  border: 2px solid #102f4f;
  border-radius: 9px;
  box-shadow: 0 9px 22px rgba(16, 47, 79, 0.2);
  font-size: 16px;
  font-weight: 800;
  text-decoration: none;
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.event-parking-button:hover,
.event-parking-button:focus {
  color: #ffffff;
  background-color: #7a3d00;
  border-color: #7a3d00;
  box-shadow: 0 12px 27px rgba(122, 61, 0, 0.25);
  transform: translateY(-3px);
}

.event-parking-button:focus-visible {
  outline: 3px solid #ffbf47;
  outline-offset: 4px;
}

/* Tablet */

@media (max-width: 991.98px) {
  .event-parking-image,
  .event-parking-image img {
    min-height: 390px;
  }

  .event-parking-content {
    min-height: auto;
    padding: 45px 35px;
  }
}

/* Mobile */

@media (max-width: 575.98px) {
  .event-parking-section {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
  }

  .event-parking-card {

    border-radius: 16px;
  }

  .event-parking-image,
  .event-parking-image img {
    min-height: 280px;
  }

  .parking-image-badge {
    right: 18px;
    bottom: 18px;
    left: 18px;
    justify-content: center;
  }

  .event-parking-content {
    padding: 35px 21px;
    text-align: center;
  }

  .event-parking-description {
    font-size: 15px;
  }

  .parking-charge-notice {
    align-items: flex-start;
    text-align: left;
  }

  .event-parking-button {
    width: 100%;
    align-self: stretch;
  }
}
/* =====================================
   Video and FAQ Section
===================================== */

.video-faq-section {
  background:
    linear-gradient(
      rgba(244, 247, 249, 0.96),
      rgba(244, 247, 249, 0.96)
    ),
    url("images/video-faq-background.jpg") center/cover fixed no-repeat;
}

.video-faq-subtitle {
  display: inline-block;
  margin-bottom: 9px;
  color: #7a3d00;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.video-faq-title {
	font-family: "Inter", Arial, sans-serif;
  margin-bottom: 15px;
  color: #102f4f;
  font-size: clamp(32px, 5vw, 48px);
  font-weight: 800;
  line-height: 1.2;
}

.video-faq-intro {
	font-family: "Playfair Display", Georgia, serif;
  max-width: 780px;
  margin-bottom: 0;
  color: #455565;
  font-size: 17px;
  line-height: 1.8;
}

/* Video Card */

.hotel-video-card {
  overflow: hidden;
  background-color: #ffffff;
  border: 1px solid #d7e0e7;
  border-radius: 20px;
  box-shadow: 0 16px 40px rgba(16, 47, 79, 0.14);
}

.video-wrapper {
  overflow: hidden;
  background-color: #061b2e;
}

.video-wrapper iframe {
  border: 0;
}

.video-content {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 30px;
}

.video-icon {
  display: inline-flex;
  flex: 0 0 56px;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  color: #ffffff;
  background-color: #7a3d00;
  border-radius: 50%;
  box-shadow: 0 8px 20px rgba(122, 61, 0, 0.24);
  font-size: 20px;
}

.video-small-text,
.faq-small-text {
	font-family: "Inter", Arial, sans-serif;
  display: block;
  margin-bottom: 5px;
  color: #7a3d00;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.video-card-title {
	font-family: "Inter", Arial, sans-serif;
  margin-bottom: 10px;
  color: #102f4f;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.3;
}

.video-description {
	font-family: "Playfair Display", Georgia, serif;
  margin-bottom: 0;
  color: #455565;
  font-size: 16px;
  line-height: 1.75;
}

/* FAQ Card */

.faq-card {
  padding: 30px;
  background-color: #ffffff;
  border: 1px solid #d7e0e7;
  border-radius: 20px;
  box-shadow: 0 16px 40px rgba(16, 47, 79, 0.14);
}

.faq-card-heading {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-bottom: 25px;
}

.faq-icon {
	font-family: "Inter", Arial, sans-serif;
  display: inline-flex;
  flex: 0 0 54px;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  color: #ffffff;
  background-color: #102f4f;
  border-radius: 50%;
  font-size: 21px;
}

.faq-card-title {
	font-family: "Inter", Arial, sans-serif;
  margin-bottom: 0;
  color: #102f4f;
  font-size: 27px;
  font-weight: 800;
}

/* Accordion */

.custom-faq-accordion {
  display: grid;
  gap: 12px;
}

.custom-faq-accordion .accordion-item {
  overflow: hidden;
  border: 1px solid #d4dee6;
  border-radius: 10px;
}

.custom-faq-accordion .accordion-button {
	font-family: "Playfair Display", Georgia, serif;
  padding: 18px 20px;
  color: #102f4f;
  background-color: #ffffff;
  box-shadow: none;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
}

.custom-faq-accordion .accordion-button:not(.collapsed) {
  color: #ffffff;
  background-color: #102f4f;
}

.custom-faq-accordion .accordion-button::after {
  width: 30px;
  height: 30px;
  background-color: #edf2f5;
  background-position: center;
  background-size: 14px;
  border-radius: 50%;
}

.custom-faq-accordion .accordion-button:not(.collapsed)::after {
  background-color: #ffffff;
}

.custom-faq-accordion .accordion-button:focus-visible {
  position: relative;
  z-index: 3;
  outline: 3px solid #ffbf47;
  outline-offset: -3px;
}

.custom-faq-accordion .accordion-body {
	font-family: "Playfair Display", Georgia, serif;
  padding: 18px 20px;
  color: #455565;
  background-color: #ffffff;
  font-size: 15px;
  line-height: 1.75;
}

/* Contact Box */

.faq-contact-box {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 22px;
  padding: 16px 18px;
  color: #253746;
  background-color: #fff2cf;
  border-left: 5px solid #7a3d00;
  border-radius: 9px;
}

.faq-contact-box > span {
	font-family: "Inter", Arial, sans-serif;
  color: #7a3d00;
  font-size: 20px;
}

.faq-contact-box p {
	font-family: "Playfair Display", Georgia, serif;
  margin-bottom: 0;
  font-size: 15px;
  line-height: 1.6;
}

.faq-contact-box a {
  color: #653200;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.faq-contact-box a:hover,
.faq-contact-box a:focus {
  color: #102f4f;
}

.faq-contact-box a:focus-visible {
  outline: 3px solid #102f4f;
  outline-offset: 3px;
}

/* Tablet */

@media (max-width: 991.98px) {
  .video-faq-heading {
	 
    margin-bottom: 35px !important;
  }
}

/* Mobile */

@media (max-width: 575.98px) {
  .video-faq-section {
    padding-top: 55px !important;
    padding-bottom: 55px !important;
    background-attachment: scroll;
  }

  .video-faq-intro {
	  font-family: "Playfair Display", Georgia, serif;
    font-size: 15px;
  }

  .hotel-video-card,
  .faq-card {
    border-radius: 15px;
  }

  .video-content {
    flex-direction: column;
    padding: 24px 20px;
  }

  .video-card-title {
	   font-family: "Inter", Arial, sans-serif;
    font-size: 22px;
  }

  .faq-card {
    padding: 24px 18px;
  }

  .faq-card-heading {
    align-items: flex-start;
  }

  .faq-card-title {
	  font-family: "Inter", Arial, sans-serif;
    font-size: 23px;
  }

  .custom-faq-accordion .accordion-button {
    padding: 17px;
    font-size: 15px;
  }

  .custom-faq-accordion .accordion-body {
    padding: 17px;
  }

  .faq-contact-box {
    align-items: flex-start;
  }
}
.faq-txt {color:#000000; text-decoration:none;}
.faq-txt a{color:#000000; text-decoration:none;}
.faq-txt a:hover{color:#ffc107; text-decoration:none;}
 /* Gradient highlight card styling */
    .about-card {
      border: none;
      border-radius: 16px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
      background: #ffffff;
      transition: all 0.3s ease;
    }
    
    .feature-icon {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      background: rgba(13, 110, 253, 0.1);
      color: #0d6efd;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.25rem;
    }

    .btn-read-more {
      font-weight: 600;
      letter-spacing: 0.5px;
      padding: 10px 24px;
      border-radius: 30px;
    }

    /* Custom smooth transition for collapse */
    .collapsing {
      transition: height 0.4s ease;
    }
	#more {display: none;}
	.about p {font-family: "Playfair Display", Georgia, serif; font-size:17px;}
	strong {color:#7a3500; font-weight:700;}
	.slider-area { width:100%; margin:0 auto; background:#f8f9fa;}
.slider-area iframe{ margin-top:100px;}
.main-title {
  color: var(--location-dark);
  font-size:40px !important;
  font-weight: 700;
  line-height: 1.18;
}
.main-title a{
  color: var(--location-dark);
  text-decoration:none;
}
.main-title a:hover{
 color:#ffc107;
    text-decoration:none;
}
	
#myBtn1 {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 20px; /* Place the button at the bottom of the page */
  right: 30px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: red; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtn1:hover {
  background-color: #555; /* Add a dark-grey background on hover */}