.elementor-495 .elementor-element.elementor-element-3974f8a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}/* Start custom CSS *//* =================================================================== */
/* UPWARD SOLUTION PAGE: PARKING 360                                   */
/* Standalone Stylesheet with all Final Edits                          */
/* =================================================================== */

/* ---------------------------------- */
/* 1. Foundation & Globals            */
/* ---------------------------------- */
:root {
    --upward-blue: #43bded;
    --upward-blue-light: #6de2ff;
    --dark-bg: #0d122b;
    --dark-bg-secondary: #1a224a;
    --text-primary: #ffffff;
    --text-secondary: rgba(235, 235, 255, 0.85);
    --neon-glow-shadow: 0 0 20px rgba(67, 189, 237, 0.6), 0 0 30px rgba(67, 189, 237, 0.4);
}

html { scroll-behavior: smooth; }
* { margin: 0; padding: 0; box-sizing: border-box; }

body, .upward-solution-page-content {
    font-family: 'Diodrum', 'Manrope', 'Arial', sans-serif !important;
    background-color: var(--dark-bg);
    color: var(--text-primary);
    overflow-x: hidden;
}

/* ---------------------------------- */
/* 2. Typography                      */
/* ---------------------------------- */
.upward-solution-page-content h1, .upward-solution-page-content h2, .upward-solution-page-content h3, .upward-solution-page-content h4 { font-weight: normal; color: var(--text-primary); }
.upward-solution-page-content p { font-weight: 400; color: var(--text-secondary); line-height: 1.8; }
.upward-solution-page-content .eyebrow { display: block; font-size: 1rem; font-weight: 500; color: var(--upward-blue); margin-bottom: 0.75rem; text-transform: uppercase; letter-spacing: 1.5px; }
.upward-solution-page-content a { color: var(--upward-blue); text-decoration: none; transition: color 0.3s ease; }
.upward-solution-page-content a:hover { color: var(--upward-blue-light); }

/* ---------------------------------- */
/* 3. General Layout & Components     */
/* ---------------------------------- */
.upward-solution-page-content .content-wrapper { max-width: 1200px; margin: 0 auto; padding: 6rem 2rem; position: relative; z-index: 3; }
.upward-solution-page-content .section-header { text-align: center; margin-bottom: 4rem; max-width: 900px; margin-left: auto; margin-right: auto; }
.upward-solution-page-content .section-header h2 { font-size: 3.5rem; font-weight: 700; }
.upward-solution-page-content .section-header p { font-size: 1.2rem; margin-top: 1rem; }
.upward-solution-page-content .cta-button { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.2); padding: 1.1rem 2.8rem; font-size: 1.1rem; color: white; border-radius: 50px; cursor: pointer; display: inline-flex; align-items: center; gap: 0.8rem; font-weight: 600; transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1); }
.upward-solution-page-content .cta-button:hover { background: rgba(255, 255, 255, 0.2); transform: translateY(-5px); }
.upward-solution-page-content .reveal { opacity: 0; transform: translateY(50px); transition: all 1s cubic-bezier(0.25, 1, 0.5, 1); }
.upward-solution-page-content .reveal.active { opacity: 1; transform: translateY(0); }
.upward-solution-page-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 7px;
    width: 1em;
    height: 1em;
    background-color: var(--upward-blue);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E") no-repeat 50% 50%;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E") no-repeat 50% 50%;
}

/* ---------------------------------- */
/* 4. Page Section Styles             */
/* ---------------------------------- */

/* --- Hero Section --- */
.upward-solution-page-content .hero { position: relative; min-height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; }
.upward-solution-page-content .hero-video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; transform: translateX(-50%) translateY(-50%); object-fit: cover; z-index: 1; }
.upward-solution-page-content .hero-bg { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(13, 18, 43, 0.6) 0%, rgba(8, 12, 28, 0.7) 100%); z-index: 2; }
.upward-solution-page-content .hero-content { position: relative; z-index: 3; max-width: 1200px; padding: 2rem; }
.upward-solution-page-content .solution-hero .hero-logo img { height: 140px; margin-bottom: 1.5rem; }
.upward-solution-page-content .solution-hero h1 { font-weight: 700; font-size: 4rem; margin-bottom: 1rem; }
.upward-solution-page-content .solution-hero p { font-weight: 400; max-width: 800px; margin: 0 auto 2.5rem; font-size: 1.3rem; }

/* --- Value Section --- */
.upward-solution-page-content .strategic-value { background-image: radial-gradient(circle, var(--dark-bg-secondary) 0%, var(--dark-bg) 80%); border-top: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 1px solid rgba(255, 255, 255, 0.1); position: relative; }
.upward-solution-page-content .value-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2.5rem; margin-top: 4rem; }
.upward-solution-page-content .value-card { text-align: center; }
.upward-solution-page-content .value-card i { font-size: 2.5rem; color: var(--upward-blue); margin-bottom: 1.5rem; }
.upward-solution-page-content .value-card h3 { font-weight: 600; font-size: 1.5rem; margin-bottom: 0.75rem; }

/* --- Core Modules Section --- */
.upward-solution-page-content .core-modules { position: relative; background-image: url('https://upward.sa/solutions/wp-content/uploads/2025/09/parking-bg.jpg'); background-size: cover; background-position: center; background-attachment: fixed; }
.upward-solution-page-content .core-modules::before { content: ''; position: absolute; inset: 0; background-color: rgba(13, 18, 43, 0.85); z-index: 1; }
.upward-solution-page-content .modules-container { display: grid; grid-template-columns: 2fr 1fr; gap: 4rem; margin-top: 4rem; }
.upward-solution-page-content .modules-column h3 { font-weight: 700; font-size: 1.8rem; margin-bottom: 2rem; color: var(--upward-blue); border-bottom: 2px solid var(--upward-blue); padding-bottom: 1rem; }
.upward-solution-page-content .modules-column ul { list-style: none; padding-left: 0; }
.upward-solution-page-content .modules-column ul li { padding-left: 2rem; position: relative; margin-bottom: 1.25rem; font-size: 1.1rem; line-height: 1.7; }

/* --- AI Section --- */
.upward-solution-page-content .ai-capabilities { position: relative; overflow: hidden; }
.upward-solution-page-content .ai-video-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.upward-solution-page-content .ai-overlay { position: absolute; inset: 0; background: rgba(13, 18, 43, 0.85); backdrop-filter: blur(5px); z-index: 2; }
.upward-solution-page-content .ai-features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2rem; margin-top: 4rem; }
.upward-solution-page-content .ai-feature { display: flex; align-items: flex-start; gap: 1.5rem; background: rgba(26, 34, 74, 0.5); border: 1px solid rgba(67, 189, 237, 0.4); padding: 2rem; border-radius: 15px; transition: all 0.3s ease; }
.upward-solution-page-content .ai-feature i { font-size: 2rem; color: var(--upward-blue-light); margin-top: 0.25rem; }
.upward-solution-page-content .ai-feature:hover { transform: translateY(-5px); border-color: var(--upward-blue); box-shadow: var(--neon-glow-shadow); }
.upward-solution-page-content .ai-feature h4 { font-weight: 600; font-size: 1.3rem; margin-bottom: 0.5rem; color: var(--upward-blue-light); }

/* --- Benefits Section --- */
.upward-solution-page-content .benefits-use-cases { background-image: radial-gradient(circle, #12193e 0%, var(--dark-bg) 80%); position: relative; }
.upward-solution-page-content .bento-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem; }
.upward-solution-page-content .bento-item { background-color: var(--dark-bg); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.1); padding: 2.5rem; border-radius: 20px; }
.upward-solution-page-content .bento-item h3 { font-weight: 700; font-size: 1.8rem; margin-bottom: 2rem; color: var(--upward-blue); }
.upward-solution-page-content .bento-item ul { list-style: none; }
.upward-solution-page-content .bento-item ul li { padding-left: 2rem; position: relative; margin-bottom: 1.25rem; font-size: 1.1rem; line-height: 1.7; }

/* --- Contact Section --- */
.upward-solution-page-content .contact-section { position: relative; background-image: url('https://upward.sa/solutions/wp-content/uploads/2025/09/king-abdullah-financial-district.webp'); background-size: cover; background-position: center; background-attachment: fixed; }
.upward-solution-page-content .contact-section-inner { background-color: rgba(13, 18, 43, 0.85); padding: 8rem 0; }
.upward-solution-page-content .contact-content { max-width: 1200px; margin: 0 auto; padding: 0 2rem; display: grid; grid-template-columns: 1.5fr 1fr; gap: 4rem; align-items: center; }
.upward-solution-page-content .contact-text h2 { font-size: 3.5rem; font-weight: 700; line-height: 1.2; margin-bottom: 1.5rem; }
.upward-solution-page-content .contact-text p { font-size: 1.2rem; }
.upward-solution-page-content .contact-details { display: flex; flex-direction: column; gap: 2rem; background: rgba(13, 18, 43, 0.7); backdrop-filter: blur(15px); padding: 3rem; border-radius: 20px; border: 1px solid rgba(255, 255, 255, 0.1); }
.upward-solution-page-content .contact-item { display: flex; align-items: center; gap: 1.5rem; }
.upward-solution-page-content .contact-item i { font-size: 1.5rem; color: var(--upward-blue); width: 30px; }
.upward-solution-page-content .contact-item span { font-weight: 500; }

/* ---------------------------------- */
/* 5. Responsive Media Queries        */
/* ---------------------------------- */
@media (max-width: 1200px) { .upward-solution-page-content .contact-content { grid-template-columns: 1fr; text-align: center; } .upward-solution-page-content .contact-details { margin-top: 3rem; } }
@media (max-width: 992px) { .upward-solution-page-content .section-header h2, .upward-solution-page-content .contact-text h2 { font-size: 3rem; } .upward-solution-page-content .bento-grid, .upward-solution-page-content .modules-container { grid-template-columns: 1fr; } }
@media (max-width: 768px) { .upward-solution-page-content .content-wrapper, .upward-solution-page-content .hero-content { padding: 4rem 1rem; } .upward-solution-page-content .solution-hero h1 { font-size: 3rem; } .upward-solution-page-content .section-header h2, .upward-solution-page-content .contact-text h2 { font-size: 2.5rem; } .upward-solution-page-content .contact-details { padding: 2rem; } }/* End custom CSS */