/* Service Pages Styles - Miami Video Production */
/* Each service page has unique structural elements */

/* ================================
   SHARED SERVICE PAGE STYLES
   ================================ */

/* Service Hero Variations */
.service-hero {
    position: relative;
    min-height: 75vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.service-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.service-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.service-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.85) 0%, rgba(143, 1, 119, 0.75) 50%, rgba(222, 26, 88, 0.65) 100%);
    z-index: 2;
}

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

.service-hero-content {
    max-width: 750px;
}

.service-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.service-hero-subtitle {
    font-size: 1.3rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
    line-height: 1.7;
}

.service-hero-buttons {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* Breadcrumb */
.service-breadcrumb {
    background: var(--light-gray);
    padding: 15px 0;
}

.service-breadcrumb nav {
    font-size: 0.9rem;
}

.service-breadcrumb a {
    color: var(--primary);
}

.service-breadcrumb span {
    color: var(--gray);
    margin: 0 8px;
}

/* Section Spacing */
.service-section {
    padding: 80px 0;
}

.service-section.alt-bg {
    background: var(--light-gray);
}

.service-section.dark-bg {
    background: var(--black);
    color: var(--white);
}

.service-section.gradient-bg {
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
    color: var(--white);
}

/* Related Services */
.related-services {
    padding: 80px 0;
    background: var(--light-gray);
}

.related-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.related-service-card {
    background: var(--white);
    padding: 25px 20px;
    border-radius: 12px;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: var(--shadow-sm);
}

.related-service-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.related-service-card svg {
    width: 40px;
    height: 40px;
    fill: var(--primary);
    margin-bottom: 15px;
}

.related-service-card h4 {
    font-size: 1rem;
    color: var(--dark-gray);
    margin: 0;
}

.related-service-card:hover h4 {
    color: var(--primary);
}

/* ================================
   ANIMATION PAGE - Unique Structure
   ================================ */

/* Animated gradient hero */
.animation-hero {
    background: linear-gradient(-45deg, #FF3366, #1A1A2E, #F7B731, #F7B731);
    background-size: 400% 400%;
    animation: gradientShift 15s ease infinite;
}

@keyframes gradientShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.animation-hero .service-hero-overlay {
    background: rgba(0, 0, 0, 0.4);
}

/* What is Animation Section */
.what-is-animation {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.what-is-animation-content h2 {
    color: var(--primary);
    margin-bottom: 20px;
}

.what-is-animation-content p {
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 20px;
}

.what-is-animation-visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16/10;
    background: var(--gradient-primary);
}

/* Benefits Cards - 3 column */
.animation-benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.animation-benefit-card {
    background: var(--white);
    padding: 40px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.animation-benefit-card:hover {
    border-color: var(--primary);
    transform: translateY(-5px);
}

.animation-benefit-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 25px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.animation-benefit-icon svg {
    width: 40px;
    height: 40px;
    fill: var(--white);
}

.animation-benefit-card h3 {
    font-size: 1.2rem;
    color: var(--primary);
    margin-bottom: 15px;
}

.animation-benefit-card p {
    color: var(--gray);
    margin: 0;
    line-height: 1.6;
}

/* Horizontal Process Timeline */
.animation-process-timeline {
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-top: 60px;
}

.animation-process-timeline::before {
    content: '';
    position: absolute;
    top: 40px;
    left: 10%;
    right: 10%;
    height: 4px;
    background: rgba(255,255,255,0.3);
    border-radius: 2px;
}

.animation-process-step {
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 1;
}

.animation-process-number {
    width: 80px;
    height: 80px;
    margin: 0 auto 20px;
    background: var(--highlight);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: 700;
    color: var(--black);
}

.animation-process-step h4 {
    color: var(--white);
    font-size: 1.1rem;
    margin-bottom: 10px;
}

.animation-process-step p {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    max-width: 150px;
    margin: 0 auto;
}

/* Animation Types Tabs */
.animation-types-tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.animation-tab-btn {
    padding: 12px 30px;
    background: transparent;
    border: none;
    box-shadow: inset 0 0 0 2px var(--primary);
    border-radius: 50px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--primary);
    cursor: pointer;
    transition: all 0.3s ease;
}

.animation-tab-btn:hover,
.animation-tab-btn.active {
    background: var(--gradient-primary);
    box-shadow: none;
    color: var(--white);
}

.animation-type-content {
    display: none;
    padding: 40px;
    background: var(--light-gray);
    border-radius: 20px;
}

.animation-type-content.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}

.animation-type-text h3 {
    color: var(--primary);
    margin-bottom: 15px;
}

.animation-type-text p {
    color: var(--dark-gray);
    line-height: 1.7;
}

.animation-type-visual {
    aspect-ratio: 16/9;
    background: var(--gradient-primary);
    border-radius: 15px;
}

/* Portfolio Masonry Grid */
.animation-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.animation-portfolio-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 16/9;
    background: var(--dark-gray);
    cursor: pointer;
}

.animation-portfolio-item:nth-child(1) {
    grid-column: span 2;
    aspect-ratio: 21/9;
}

.animation-portfolio-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.animation-portfolio-item:hover img {
    transform: scale(1.05);
    opacity: 0.8;
}

.animation-portfolio-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.8));
    color: var(--white);
    opacity: 0;
    transition: all 0.3s ease;
}

.animation-portfolio-item:hover .animation-portfolio-overlay {
    opacity: 1;
}

/* FAQ Accordion */
.faq-accordion {
    max-width: 800px;
    margin: 0 auto;
}

.faq-accordion-item {
    background: var(--white);
    margin-bottom: 15px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.faq-accordion-question {
    width: 100%;
    padding: 25px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--dark-gray);
    transition: all 0.3s ease;
}

.faq-accordion-question:hover {
    color: var(--primary);
}

.faq-accordion-icon {
    width: 30px;
    height: 30px;
    background: var(--primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.faq-accordion-icon svg {
    width: 16px;
    height: 16px;
    fill: var(--white);
}

.faq-accordion-item.active .faq-accordion-icon {
    transform: rotate(45deg);
    background: var(--accent);
}

.faq-accordion-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq-accordion-item.active .faq-accordion-answer {
    max-height: 500px;
}

.faq-accordion-answer p {
    padding: 0 30px 25px;
    color: var(--gray);
    line-height: 1.7;
    margin: 0;
}

/* ================================
   CORPORATE PAGE - Unique Structure
   ================================ */

/* Corporate Hero */
.corporate-hero {
    position: relative;
    min-height: 80vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.corporate-hero-video-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    z-index: 1;
}

.corporate-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.9) 0%, rgba(143, 1, 119, 0.8) 50%, rgba(222, 26, 88, 0.7) 100%);
    z-index: 2;
}

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

.corporate-hero-content {
    max-width: 750px;
}

.corporate-hero-badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    color: var(--highlight);
    padding: 8px 20px;
    border-radius: 50px;
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 20px;
    backdrop-filter: blur(10px);
}

.corporate-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.corporate-hero-subtitle {
    font-size: 1.25rem;
    color: rgba(255,255,255,0.9);
    margin-bottom: 2rem;
    line-height: 1.7;
}

.corporate-hero-cta {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* Corporate Stats */
.corporate-stat-number {
    font-size: 3rem;
    font-weight: 700;
    color: var(--highlight);
    line-height: 1;
}

.corporate-stat-suffix {
    font-size: 2rem;
    color: var(--highlight);
}

.corporate-stat-label {
    display: block;
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    margin-top: 10px;
}

/* Corporate Why Section Grid */
.corporate-why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.corporate-why-features {
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin-top: 30px;
}

.corporate-why-feature {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.corporate-why-icon {
    width: 50px;
    height: 50px;
    background: var(--gradient-primary);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.corporate-why-icon svg {
    width: 24px;
    height: 24px;
    stroke: var(--white);
}

.corporate-why-text h4 {
    color: var(--primary);
    margin-bottom: 8px;
    font-size: 1.1rem;
}

.corporate-why-text p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
    line-height: 1.6;
}

.corporate-why-image-frame {
    width: 100%;
    background: none;
    padding: 0;
}

/* Corporate Services Section */
.corporate-services-section {
    background: var(--gradient-primary);
    padding: 80px 0;
}

.corporate-service-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px auto;
    width: 80px;
    height: 80px;
    background: rgba(255,255,255,0.15);
    border-radius: 15px;
}

.corporate-service-icon svg {
    width: 40px;
    height: 40px;
    stroke: var(--highlight);
    fill: none;
}

.corporate-service-features {
    text-align: left;
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.corporate-service-features li {
    padding-left: 20px;
    position: relative;
    margin-bottom: 8px;
    color: rgba(255,255,255,0.8);
    font-size: 0.85rem;
}

.corporate-service-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #F7B731;
}

/* Corporate Process */
.corporate-process {
    padding: 80px 0;
    background: var(--light-gray);
}

.corporate-process-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.corporate-process-step {
    text-align: center;
    padding: 30px 20px;
    background: var(--white);
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
}

.corporate-process-number {
    width: 60px;
    height: 60px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 auto 20px;
}

.corporate-process-step h4 {
    color: var(--primary);
    margin-bottom: 10px;
}

.corporate-process-step p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Corporate Carousel */
.corporate-carousel {
    position: relative;
    overflow: hidden;
}

.corporate-carousel-track {
    display: flex;
    gap: 30px;
    transition: transform 0.5s ease;
}

.corporate-carousel-nav {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

.corporate-carousel-btn {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--primary);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.corporate-carousel-btn:hover {
    background: var(--primary);
    color: var(--white);
}

.corporate-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

.corporate-carousel-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--light-gray);
    cursor: pointer;
    transition: background 0.3s ease;
}

.corporate-carousel-dot.active {
    background: var(--primary);
}

/* Corporate Case Studies */
.corporate-case-image {
    height: 200px;
    background: var(--gradient-primary);
}

.corporate-case-content {
    padding: 25px;
}

.corporate-case-industry {
    display: inline-block;
    background: var(--light-gray);
    color: var(--primary);
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.corporate-case-content h4 {
    color: var(--primary);
    margin-bottom: 10px;
}

.corporate-case-content p {
    color: var(--gray);
    font-size: 0.9rem;
    margin-bottom: 15px;
}

.corporate-case-stats {
    display: flex;
    gap: 20px;
}

.corporate-case-stat {
    text-align: center;
}

.corporate-case-stat strong {
    display: block;
    color: var(--accent);
    font-size: 1.25rem;
}

.corporate-case-stat span {
    font-size: 0.8rem;
    color: var(--gray);
}

/* Corporate Clients / Logos */
.corporate-clients {
    padding: 60px 0;
    background: var(--light-gray);
}

.corporate-logos-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 30px;
    align-items: center;
}

.corporate-logo-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: var(--white);
    border-radius: 10px;
    min-height: 80px;
}

.corporate-logo-placeholder {
    color: var(--gray);
    font-size: 0.85rem;
    text-align: center;
}

/* Corporate Testimonials */
.corporate-testimonials {
    padding: 80px 0;
}

.corporate-testimonial-slide {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    display: none;
}

.corporate-testimonial-slide.active {
    display: block;
}

.corporate-testimonial-quote {
    font-size: 1.5rem;
    color: var(--dark-gray);
    line-height: 1.8;
    font-style: italic;
    margin-bottom: 30px;
}

.corporate-testimonial-quote svg {
    width: 40px;
    height: 40px;
    opacity: 0.3;
    display: block;
    margin: 0 auto 20px;
    fill: var(--primary);
}

.corporate-testimonial-info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.corporate-testimonial-info img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    object-fit: cover;
}

.corporate-testimonial-content h4 {
    color: var(--primary);
    margin-bottom: 5px;
}

.corporate-testimonial-content span {
    color: var(--gray);
    font-size: 0.9rem;
}

.corporate-testimonial-track {
    overflow: hidden;
}

.corporate-testimonial-nav {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

.corporate-testimonial-btn {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--light-gray);
    border: none;
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.corporate-testimonial-btn:hover {
    background: var(--primary);
    color: var(--white);
}

.corporate-testimonial-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
}

.corporate-testimonial-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--light-gray);
    cursor: pointer;
}

.corporate-testimonial-dot.active {
    background: var(--primary);
}

/* Corporate Contact Section */
.corporate-contact {
    padding: 80px 0;
    background: var(--gradient-primary);
}

.corporate-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 60px;
    align-items: start;
}

.corporate-contact-info {
    color: var(--white);
}

.corporate-contact-info h2 {
    color: var(--white);
    margin-bottom: 20px;
}

.corporate-contact-info > p {
    color: rgba(255,255,255,0.9);
    margin-bottom: 30px;
    line-height: 1.7;
}

.corporate-contact-benefits {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.corporate-contact-benefit {
    display: flex;
    align-items: center;
    gap: 12px;
    color: rgba(255,255,255,0.9);
}

.corporate-contact-benefit svg {
    width: 20px;
    height: 20px;
    stroke: var(--highlight);
    flex-shrink: 0;
}

.corporate-contact-form {
    background: var(--white);
    padding: 40px;
    border-radius: 20px;
    box-shadow: var(--shadow-lg);
}

.corporate-contact-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.corporate-contact-form .form-group {
    margin-bottom: 0;
}

.corporate-contact-form label {
    display: block;
    color: var(--dark-gray);
    font-weight: 500;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.corporate-contact-form input,
.corporate-contact-form select,
.corporate-contact-form textarea {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid var(--light-gray);
    border-radius: 10px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
}

.corporate-contact-form input:focus,
.corporate-contact-form select:focus,
.corporate-contact-form textarea:focus {
    outline: none;
    border-color: var(--primary);
}

.corporate-contact-form button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.corporate-contact-form button[type="submit"] svg,
.btn svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.btn-block {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

/* Corporate Related Services */
.corporate-related {
    padding: 80px 0;
    background: var(--light-gray);
}

.corporate-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.corporate-related-card {
    background: var(--white);
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-decoration: none;
}

.corporate-related-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.corporate-related-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.corporate-related-icon svg {
    width: 32px;
    height: 32px;
    stroke: var(--white);
    fill: none;
}

.corporate-related-card h4 {
    color: var(--primary);
    margin-bottom: 10px;
}

.corporate-related-card p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Stats Bar */
.corporate-stats-bar {
    background: var(--black);
    padding: 40px 0;
}

.corporate-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    text-align: center;
}

.corporate-stat-item h3 {
    font-size: 3rem;
    color: var(--highlight);
    margin-bottom: 10px;
}

.corporate-stat-item p {
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    margin: 0;
}

/* Why Corporate Video Section */
.corporate-why-section {
    padding: 80px 0;
}

.corporate-why-content {
    order: 1;
}

.corporate-why-image {
    order: 2;
    background: none;
    padding: 0;
}

.corporate-why-image img {
    width: 100%;
    height: 450px;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.corporate-why-content h2 {
    color: var(--primary);
    margin-bottom: 25px;
}

.corporate-why-content p {
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 20px;
}

.corporate-why-list {
    list-style: none;
    padding: 0;
}

.corporate-why-list li {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 15px;
}

.corporate-why-list li svg {
    width: 24px;
    height: 24px;
    fill: var(--accent);
    flex-shrink: 0;
    margin-top: 2px;
}

.corporate-why-image {
    border-radius: 20px;
    overflow: hidden;
    background: none;
}

/* Icon Boxes Grid */
.corporate-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.corporate-service-box {
    text-align: center;
    padding: 40px 30px;
    background: rgba(255,255,255,0.1);
    border-radius: 15px;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.2);
    transition: all 0.3s ease;
}

.corporate-service-box:hover {
    background: rgba(255,255,255,0.2);
    transform: translateY(-5px);
}

.corporate-service-box svg {
    width: 50px;
    height: 50px;
    fill: var(--highlight);
    margin-bottom: 20px;
}

.corporate-service-box h3 {
    color: var(--white);
    font-size: 1.15rem;
    margin-bottom: 12px;
}

.corporate-service-box p {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.6;
}

/* Case Studies Carousel */
.corporate-case-studies {
    position: relative;
    overflow: hidden;
}

.corporate-case-slider {
    display: flex;
    gap: 30px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 20px 0;
}

.corporate-case-slider::-webkit-scrollbar {
    display: none;
}

.corporate-case-card {
    flex: 0 0 350px;
    scroll-snap-align: start;
    background: var(--white);
    border-radius: 15px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.corporate-case-image {
    aspect-ratio: 16/10;
    background: var(--gradient-primary);
}

.corporate-case-content {
    padding: 25px;
}

.corporate-case-content h4 {
    color: var(--primary);
    margin-bottom: 10px;
}

.corporate-case-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Client Logos */
.corporate-clients-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 40px;
    align-items: center;
}

.corporate-client-logo {
    opacity: 0.6;
    transition: all 0.3s ease;
    filter: grayscale(100%);
}

.corporate-client-logo:hover {
    opacity: 1;
    filter: grayscale(0%);
}

/* Testimonial Slider */
.corporate-testimonial-slider {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.corporate-testimonial {
    padding: 40px;
}

.corporate-testimonial blockquote {
    font-size: 1.3rem;
    font-style: italic;
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 30px;
}

.corporate-testimonial-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.corporate-testimonial-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--gradient-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-weight: 700;
    font-size: 1.2rem;
}

/* ================================
   EVENT COVERAGE PAGE - Unique Structure
   ================================ */

/* Full-width hero image */
.event-hero .service-hero-bg img {
    transform: scale(1.02);
}

/* Events We Cover - Circular Icons */
.event-types-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 30px;
    text-align: center;
}

.event-type-item {
    cursor: pointer;
    transition: all 0.3s ease;
}

.event-type-item:hover {
    transform: translateY(-5px);
}

.event-type-circle {
    width: 100px;
    height: 100px;
    margin: 0 auto 15px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.event-type-circle svg {
    width: 45px;
    height: 45px;
    fill: var(--white);
}

.event-type-item:hover .event-type-circle {
    transform: scale(1.1);
    box-shadow: 0 10px 30px rgba(54, 1, 133, 0.4);
}

.event-type-item h4 {
    font-size: 1rem;
    color: var(--dark-gray);
    margin: 0;
}

/* Vertical Timeline Process */
.event-process-timeline {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}

.event-process-timeline::before {
    content: '';
    position: absolute;
    top: 0;
    left: 30px;
    width: 4px;
    height: 100%;
    background: var(--gradient-primary);
    border-radius: 2px;
}

.event-process-step {
    display: flex;
    gap: 30px;
    margin-bottom: 40px;
    position: relative;
}

.event-process-step:last-child {
    margin-bottom: 0;
}

.event-process-number {
    width: 60px;
    height: 60px;
    background: var(--highlight);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--black);
    flex-shrink: 0;
    z-index: 1;
}

.event-process-content {
    background: var(--white);
    padding: 25px 30px;
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
    flex: 1;
}

.event-process-content h4 {
    color: var(--primary);
    margin-bottom: 10px;
}

.event-process-content p {
    color: var(--gray);
    margin: 0;
    line-height: 1.6;
}

/* Equipment Section */
.event-equipment-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.event-equipment-card {
    background: rgba(255,255,255,0.1);
    padding: 30px 20px;
    border-radius: 15px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.2);
}

.event-equipment-card svg {
    width: 50px;
    height: 50px;
    fill: var(--highlight);
    margin-bottom: 15px;
}

.event-equipment-card h4 {
    color: var(--white);
    font-size: 1rem;
    margin-bottom: 8px;
}

.event-equipment-card p {
    color: rgba(255,255,255,0.7);
    font-size: 0.85rem;
    margin: 0;
}

/* Gallery Grid with Lightbox */
.event-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.event-gallery-item {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 1;
    cursor: pointer;
}

.event-gallery-item:nth-child(1),
.event-gallery-item:nth-child(6) {
    grid-column: span 2;
    grid-row: span 2;
}

.event-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.event-gallery-item:hover img {
    transform: scale(1.1);
}

/* Pricing Packages Table */
.event-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.event-pricing-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
}

.event-pricing-card.featured {
    transform: scale(1.05);
    border: 3px solid var(--primary);
}

.event-pricing-card.featured::before {
    content: 'Popular';
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--highlight);
    color: var(--black);
    padding: 5px 20px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 700;
}

.event-pricing-card h3 {
    color: var(--primary);
    margin-bottom: 20px;
}

.event-pricing-price {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--dark-gray);
    margin-bottom: 25px;
}

.event-pricing-price span {
    font-size: 1rem;
    color: var(--gray);
}

.event-pricing-features {
    list-style: none;
    padding: 0;
    margin-bottom: 30px;
}

.event-pricing-features li {
    padding: 12px 0;
    border-bottom: 1px solid var(--light-gray);
    color: var(--dark-gray);
}

/* ================================
   INTERVIEWS PAGE - Unique Structure
   ================================ */

/* Split-screen hero */
.interviews-hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 80vh;
    padding: 0;
}

.interviews-hero-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 80px 60px;
    background: var(--primary);
}

.interviews-hero-visual {
    position: relative;
    overflow: hidden;
}

.interviews-hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Interview Types Accordion */
.interview-types-accordion {
    max-width: 800px;
    margin: 0 auto;
}

.interview-type-item {
    margin-bottom: 15px;
    border: 2px solid var(--light-gray);
    border-radius: 15px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.interview-type-item.active {
    border-color: var(--primary);
}

.interview-type-header {
    width: 100%;
    padding: 25px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--white);
    border: none;
    cursor: pointer;
    text-align: left;
}

.interview-type-header h3 {
    font-size: 1.2rem;
    color: var(--dark-gray);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 15px;
}

.interview-type-header h3 svg {
    width: 30px;
    height: 30px;
    fill: var(--primary);
}

.interview-type-body {
    max-height: 0;
    overflow: hidden;
    background: var(--light-gray);
    transition: max-height 0.3s ease;
}

.interview-type-item.active .interview-type-body {
    max-height: 400px;
}

.interview-type-body-content {
    padding: 25px 30px;
}

/* Benefits List with Icons */
.interview-benefits-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.interview-benefit-item {
    display: flex;
    gap: 20px;
}

.interview-benefit-icon {
    width: 60px;
    height: 60px;
    background: var(--gradient-primary);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.interview-benefit-icon svg {
    width: 30px;
    height: 30px;
    fill: var(--white);
}

.interview-benefit-text h4 {
    color: var(--dark-gray);
    margin-bottom: 8px;
}

.interview-benefit-text p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Behind the Scenes Section */
.interview-setup-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.interview-setup-card {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 4/5;
}

.interview-setup-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.interview-setup-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 25px;
    background: linear-gradient(transparent, rgba(0,0,0,0.9));
}

.interview-setup-overlay h4 {
    color: var(--white);
    font-size: 1.1rem;
    margin-bottom: 5px;
}

.interview-setup-overlay p {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    margin: 0;
}

/* Success Stories Cards */
.interview-stories-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.interview-story-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px;
    box-shadow: var(--shadow-md);
    position: relative;
}

.interview-story-card::before {
    content: '"';
    position: absolute;
    top: 20px;
    left: 30px;
    font-size: 5rem;
    color: var(--primary);
    opacity: 0.1;
    font-family: Georgia, serif;
    line-height: 1;
}

.interview-story-quote {
    font-size: 1.1rem;
    font-style: italic;
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 25px;
    position: relative;
    z-index: 1;
}

.interview-story-author {
    display: flex;
    align-items: center;
    gap: 15px;
}

.interview-story-avatar {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background: var(--gradient-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-weight: 700;
}

/* ================================
   LIVE STREAMING PAGE - Unique Structure
   ================================ */

/* Live indicator animation */
.livestream-hero::after {
    content: 'LIVE';
    position: absolute;
    top: 160px;
    right: 60px;
    background: #ff0000;
    color: var(--white);
    padding: 10px 25px;
    border-radius: 5px;
    font-weight: 700;
    font-size: 1.2rem;
    z-index: 10;
    animation: livePulse 2s ease-in-out infinite;
}

@keyframes livePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.05); }
}

/* Platform Logos Grid */
.livestream-platforms-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 30px;
    align-items: center;
}

.livestream-platform {
    text-align: center;
    padding: 25px;
    background: var(--white);
    border-radius: 15px;
    transition: all 0.3s ease;
}

.livestream-platform:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.livestream-platform svg {
    width: 60px;
    height: 60px;
    fill: var(--dark-gray);
    margin-bottom: 10px;
}

.livestream-platform h4 {
    font-size: 0.9rem;
    color: var(--dark-gray);
    margin: 0;
}

/* Packages Comparison */
.livestream-packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.livestream-package-card {
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
}

.livestream-package-card:hover {
    transform: translateY(-5px);
}

.livestream-package-header {
    padding: 30px;
    background: var(--gradient-primary);
    text-align: center;
}

.livestream-package-header h3 {
    color: var(--white);
    margin-bottom: 10px;
}

.livestream-package-header .price {
    font-size: 2rem;
    font-weight: 700;
    color: var(--highlight);
}

.livestream-package-features {
    padding: 30px;
}

.livestream-package-features li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid var(--light-gray);
}

.livestream-package-features li svg {
    width: 20px;
    height: 20px;
    fill: var(--accent);
}

/* Technical Specs Table */
.livestream-specs-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 30px;
}

.livestream-specs-table th,
.livestream-specs-table td {
    padding: 20px;
    text-align: left;
    border-bottom: 1px solid var(--light-gray);
}

.livestream-specs-table th {
    background: var(--primary);
    color: var(--white);
    font-weight: 600;
}

.livestream-specs-table tr:hover {
    background: var(--light-gray);
}

/* Industries Tabs */
.livestream-industries-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 30px;
    flex-wrap: wrap;
    justify-content: center;
}

.livestream-industry-tab {
    padding: 12px 25px;
    background: var(--light-gray);
    border: none;
    border-radius: 50px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--dark-gray);
    cursor: pointer;
    transition: all 0.3s ease;
}

.livestream-industry-tab:hover,
.livestream-industry-tab.active {
    background: var(--primary);
    color: var(--white);
}

.livestream-industry-content {
    display: none;
    background: var(--white);
    padding: 40px;
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
}

.livestream-industry-content.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}

/* ================================
   PHOTOGRAPHY PAGE - Unique Structure
   ================================ */

/* Photo gallery mosaic hero */
.photography-hero-mosaic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 5px;
    z-index: 1;
}

.photography-hero-mosaic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photography-hero-mosaic .large {
    grid-column: span 2;
    grid-row: span 2;
}

/* Photography Services Hover Cards */
.photography-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.photography-service-card {
    position: relative;
    height: 300px;
    border-radius: 15px;
    overflow: hidden;
    cursor: pointer;
}

.photography-service-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}

.photography-service-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(transparent 40%, rgba(54, 1, 133, 0.95) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 25px;
    opacity: 0;
    transition: all 0.3s ease;
}

.photography-service-card:hover .photography-service-overlay {
    opacity: 1;
}

.photography-service-card:hover img {
    transform: scale(1.1);
}

.photography-service-overlay h3 {
    color: var(--white);
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.photography-service-overlay p {
    color: rgba(255,255,255,0.9);
    font-size: 0.9rem;
    margin: 0;
}

/* Numbered Steps Process */
.photography-process-steps {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.photography-step {
    text-align: center;
    position: relative;
}

.photography-step::after {
    content: '';
    position: absolute;
    top: 35px;
    right: -50%;
    width: 100%;
    height: 3px;
    background: var(--primary);
    z-index: -1;
}

.photography-step:last-child::after {
    display: none;
}

.photography-step-number {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--white);
}

.photography-step h4 {
    color: var(--primary);
    font-size: 1rem;
    margin-bottom: 10px;
}

.photography-step p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Equipment & Technology */
.photography-equipment-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.photography-equipment-card {
    background: rgba(255,255,255,0.1);
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.2);
}

.photography-equipment-card svg {
    width: 60px;
    height: 60px;
    fill: var(--highlight);
    margin-bottom: 20px;
}

.photography-equipment-card h3 {
    color: var(--white);
    margin-bottom: 15px;
}

.photography-equipment-card p {
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    margin: 0;
    line-height: 1.6;
}

/* Before/After Showcase */
.photography-comparison {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.photography-comparison-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.photography-comparison-slider {
    position: relative;
    aspect-ratio: 16/10;
}

.photography-comparison-label {
    position: absolute;
    bottom: 15px;
    padding: 8px 20px;
    background: var(--primary);
    color: var(--white);
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 20px;
}

.photography-comparison-label.before {
    left: 15px;
}

.photography-comparison-label.after {
    right: 15px;
    background: var(--accent);
}

/* ================================
   REAL ESTATE PAGE - Unique Structure
   ================================ */

/* Property showcase hero */
.realestate-hero-overlay {
    background: linear-gradient(90deg, rgba(54, 1, 133, 0.9) 0%, rgba(54, 1, 133, 0.5) 50%, transparent 100%);
}

/* Feature Boxes */
.realestate-features-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.realestate-feature-box {
    background: var(--white);
    padding: 35px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
    border-bottom: 4px solid transparent;
}

.realestate-feature-box:hover {
    border-bottom-color: var(--primary);
    transform: translateY(-5px);
}

.realestate-feature-box svg {
    width: 50px;
    height: 50px;
    fill: var(--primary);
    margin-bottom: 20px;
}

.realestate-feature-box h3 {
    color: var(--dark-gray);
    margin-bottom: 12px;
}

.realestate-feature-box p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Property Types Filter Gallery */
.realestate-filter-buttons {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.realestate-filter-btn {
    padding: 12px 28px;
    background: transparent;
    border: 2px solid var(--gray);
    border-radius: 50px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--gray);
    cursor: pointer;
    transition: all 0.3s ease;
}

.realestate-filter-btn:hover,
.realestate-filter-btn.active {
    background: var(--primary);
    border-color: var(--primary);
    color: var(--white);
}

.realestate-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.realestate-gallery-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 4/3;
}

.realestate-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.realestate-gallery-item:hover img {
    transform: scale(1.05);
}

.realestate-gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.8));
    opacity: 0;
    transition: all 0.3s ease;
}

.realestate-gallery-item:hover .realestate-gallery-overlay {
    opacity: 1;
}

.realestate-gallery-overlay h4 {
    color: var(--white);
    font-size: 1rem;
    margin-bottom: 5px;
}

.realestate-gallery-overlay span {
    color: var(--highlight);
    font-size: 0.85rem;
}

/* Aerial/Drone Section */
.realestate-drone-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.realestate-drone-content h2 {
    color: var(--white);
    margin-bottom: 20px;
}

.realestate-drone-content p {
    color: rgba(255,255,255,0.9);
    line-height: 1.8;
    margin-bottom: 25px;
}

.realestate-drone-features {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.realestate-drone-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--white);
}

.realestate-drone-feature svg {
    width: 24px;
    height: 24px;
    fill: var(--highlight);
}

.realestate-drone-visual {
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16/10;
    background: var(--gradient-accent);
}

/* Virtual Tour Section */
.realestate-virtualtour {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.realestate-virtualtour-visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16/10;
}

.realestate-virtualtour-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: var(--primary);
    color: var(--white);
    padding: 10px 20px;
    border-radius: 25px;
    font-size: 0.9rem;
    font-weight: 600;
}

/* Agent Testimonials */
.realestate-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

/* Pricing Tiers */
.realestate-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.realestate-pricing-card {
    background: var(--white);
    border-radius: 15px;
    padding: 30px 25px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
}

.realestate-pricing-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.realestate-pricing-card.featured {
    background: var(--primary);
    color: var(--white);
}

.realestate-pricing-card.featured h3,
.realestate-pricing-card.featured .price,
.realestate-pricing-card.featured li {
    color: var(--white);
}

.realestate-pricing-card h3 {
    color: var(--primary);
    font-size: 1.2rem;
    margin-bottom: 15px;
}

.realestate-pricing-card .price {
    font-size: 2rem;
    font-weight: 700;
    color: var(--dark-gray);
    margin-bottom: 20px;
}

.realestate-pricing-card ul {
    list-style: none;
    padding: 0;
    margin-bottom: 25px;
    text-align: left;
}

.realestate-pricing-card li {
    padding: 10px 0;
    border-bottom: 1px solid var(--light-gray);
    font-size: 0.9rem;
}

/* ================================
   TIMELAPSE PAGE - Unique Structure
   ================================ */

/* Timelapse concept visual */
.timelapse-hero-overlay {
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.8) 0%, rgba(143, 1, 119, 0.6) 100%);
}

/* What is Timelapse */
.timelapse-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.timelapse-intro-content h2 {
    color: var(--primary);
    margin-bottom: 20px;
}

.timelapse-intro-content p {
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 20px;
}

.timelapse-intro-visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16/10;
}

.timelapse-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.timelapse-play-button:hover {
    transform: translate(-50%, -50%) scale(1.1);
}

.timelapse-play-button svg {
    width: 30px;
    height: 30px;
    fill: var(--white);
    margin-left: 5px;
}

/* Applications Grid */
.timelapse-applications-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.timelapse-application-card {
    background: var(--white);
    padding: 35px 25px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
}

.timelapse-application-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.timelapse-application-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.timelapse-application-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.timelapse-application-card h3 {
    color: var(--primary);
    font-size: 1.1rem;
    margin-bottom: 12px;
}

.timelapse-application-card p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Circular Process Diagram */
.timelapse-process-circle {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
    aspect-ratio: 1;
}

.timelapse-process-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 200px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--white);
}

.timelapse-process-center h3 {
    color: var(--white);
    font-size: 1.3rem;
    margin-bottom: 5px;
}

.timelapse-process-center p {
    font-size: 0.9rem;
    margin: 0;
    opacity: 0.9;
}

.timelapse-process-item {
    position: absolute;
    width: 150px;
    text-align: center;
}

.timelapse-process-item:nth-child(2) { top: 0; left: 50%; transform: translateX(-50%); }
.timelapse-process-item:nth-child(3) { top: 25%; right: 0; }
.timelapse-process-item:nth-child(4) { bottom: 25%; right: 0; }
.timelapse-process-item:nth-child(5) { bottom: 0; left: 50%; transform: translateX(-50%); }
.timelapse-process-item:nth-child(6) { bottom: 25%; left: 0; }
.timelapse-process-item:nth-child(7) { top: 25%; left: 0; }

.timelapse-process-dot {
    width: 50px;
    height: 50px;
    margin: 0 auto 10px;
    background: var(--highlight);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: var(--black);
}

/* Equipment Specs */
.timelapse-specs-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.timelapse-spec-card {
    display: flex;
    gap: 20px;
    background: rgba(255,255,255,0.1);
    padding: 25px;
    border-radius: 15px;
    border: 1px solid rgba(255,255,255,0.2);
}

.timelapse-spec-icon {
    width: 60px;
    height: 60px;
    background: var(--highlight);
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.timelapse-spec-icon svg {
    width: 30px;
    height: 30px;
    fill: var(--black);
}

.timelapse-spec-content h4 {
    color: var(--white);
    margin-bottom: 8px;
}

.timelapse-spec-content p {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
    margin: 0;
}

/* Duration Calculator */
.timelapse-calculator {
    background: var(--white);
    padding: 50px;
    border-radius: 20px;
    max-width: 600px;
    margin: 0 auto;
    box-shadow: var(--shadow-lg);
}

.timelapse-calculator h3 {
    text-align: center;
    color: var(--primary);
    margin-bottom: 30px;
}

.timelapse-calculator-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.timelapse-calculator-result {
    text-align: center;
    padding: 30px;
    background: var(--gradient-primary);
    border-radius: 15px;
    margin-top: 30px;
}

.timelapse-calculator-result h4 {
    color: var(--white);
    font-size: 1rem;
    margin-bottom: 10px;
}

.timelapse-calculator-result .result-value {
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--highlight);
}

/* Portfolio with Video Placeholders */
.timelapse-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.timelapse-portfolio-item {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 16/9;
}

.timelapse-portfolio-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.timelapse-portfolio-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.3s ease;
}

.timelapse-portfolio-item:hover .timelapse-portfolio-overlay {
    opacity: 1;
}

.timelapse-portfolio-play {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}

.timelapse-portfolio-play svg {
    width: 30px;
    height: 30px;
    fill: var(--white);
    margin-left: 5px;
}

/* ================================
   YACHTS PAGE - Unique Structure
   ================================ */

/* Luxury yacht aesthetic */
.yachts-hero {
    background: linear-gradient(135deg, #0a1628 0%, #1a365d 100%);
}

.yachts-hero-overlay {
    background: linear-gradient(90deg, rgba(10, 22, 40, 0.95) 0%, rgba(10, 22, 40, 0.6) 50%, transparent 100%);
}

/* Yacht Services Overview */
.yachts-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
}

.yachts-service-card {
    background: var(--white);
    padding: 35px 25px;
    border-radius: 15px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    transition: all 0.3s ease;
    border-top: 4px solid var(--primary);
}

.yachts-service-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
}

.yachts-service-card svg {
    width: 50px;
    height: 50px;
    fill: var(--primary);
    margin-bottom: 20px;
}

.yachts-service-card h3 {
    color: var(--dark-gray);
    font-size: 1.1rem;
    margin-bottom: 12px;
}

.yachts-service-card p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Why Yacht Marketing */
.yachts-why-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yachts-why-content h2 {
    color: var(--white);
    margin-bottom: 20px;
}

.yachts-why-content .lead {
    font-size: 1.3rem;
    color: var(--highlight);
    font-style: italic;
    margin-bottom: 25px;
}

.yachts-why-content p {
    color: rgba(255,255,255,0.9);
    line-height: 1.8;
    margin-bottom: 20px;
}

.yachts-why-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.yachts-stat {
    text-align: center;
    padding: 20px;
    background: rgba(255,255,255,0.1);
    border-radius: 10px;
}

.yachts-stat h3 {
    font-size: 2rem;
    color: var(--highlight);
    margin-bottom: 5px;
}

.yachts-stat p {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.8);
    margin: 0;
}

.yachts-why-visual {
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 4/5;
}

/* Yacht Portfolio Showcase */
.yachts-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.yachts-portfolio-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 4/3;
}

.yachts-portfolio-item.featured {
    grid-column: span 2;
    aspect-ratio: 21/10;
}

.yachts-portfolio-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}

.yachts-portfolio-item:hover img {
    transform: scale(1.05);
}

.yachts-portfolio-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 25px;
    background: linear-gradient(transparent, rgba(0,0,0,0.9));
    color: var(--white);
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
}

.yachts-portfolio-item:hover .yachts-portfolio-overlay {
    opacity: 1;
    transform: translateY(0);
}

.yachts-portfolio-overlay h4 {
    font-size: 1.1rem;
    margin-bottom: 5px;
}

.yachts-portfolio-overlay span {
    color: var(--highlight);
    font-size: 0.9rem;
}

/* Aerial & Underwater */
.yachts-capabilities-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.yachts-capability-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    height: 350px;
}

.yachts-capability-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yachts-capability-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(transparent 30%, rgba(54, 1, 133, 0.95) 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 40px;
}

.yachts-capability-overlay h3 {
    color: var(--white);
    font-size: 1.5rem;
    margin-bottom: 15px;
}

.yachts-capability-overlay p {
    color: rgba(255,255,255,0.9);
    margin: 0;
    line-height: 1.6;
}

/* Client Gallery */
.yachts-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.yachts-gallery-item {
    border-radius: 12px;
    overflow: hidden;
    aspect-ratio: 1;
}

.yachts-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s ease;
}

.yachts-gallery-item:hover img {
    transform: scale(1.1);
}

/* Exclusive Services */
.yachts-exclusive-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.yachts-exclusive-card {
    background: linear-gradient(135deg, #0a1628, #1a365d);
    padding: 40px 30px;
    border-radius: 20px;
    text-align: center;
    border: 1px solid rgba(255,255,255,0.1);
    transition: all 0.3s ease;
}

.yachts-exclusive-card:hover {
    transform: translateY(-5px);
    border-color: var(--highlight);
}

.yachts-exclusive-icon {
    width: 80px;
    height: 80px;
    margin: 0 auto 25px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.yachts-exclusive-icon svg {
    width: 40px;
    height: 40px;
    fill: var(--white);
}

.yachts-exclusive-card h3 {
    color: var(--white);
    margin-bottom: 15px;
}

.yachts-exclusive-card p {
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    margin: 0;
    line-height: 1.6;
}

/* ================================
   SERVICE CONTACT FORM SECTION
   ================================ */

.service-contact-section {
    padding: 80px 0;
    background: var(--white);
}

.service-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.service-contact-info h2 {
    color: var(--primary);
    margin-bottom: 20px;
}

.service-contact-info > p {
    color: var(--dark-gray);
    line-height: 1.8;
    margin-bottom: 30px;
}

.service-contact-details {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.service-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.service-contact-item svg {
    width: 24px;
    height: 24px;
    fill: var(--primary);
    flex-shrink: 0;
    margin-top: 2px;
}

.service-contact-form {
    background: var(--light-gray);
    padding: 40px;
    border-radius: 20px;
}

.service-contact-form h3 {
    color: var(--primary);
    margin-bottom: 25px;
}

/* ================================
   RESPONSIVE STYLES
   ================================ */

@media (max-width: 1200px) {
    .animation-benefits-grid,
    .corporate-services-grid,
    .photography-services-grid,
    .realestate-features-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .related-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .service-hero h1,
    .corporate-hero h1 {
        font-size: 2.75rem;
    }

    .what-is-animation,
    .corporate-why-section,
    .corporate-why-grid,
    .corporate-contact-wrapper,
    .timelapse-intro,
    .yachts-why-section,
    .service-contact-grid {
        grid-template-columns: 1fr;
    }

    .corporate-process-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .corporate-logos-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .corporate-related-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .interviews-hero {
        grid-template-columns: 1fr;
    }

    .interviews-hero-visual {
        height: 300px;
    }

    .animation-process-timeline {
        flex-direction: column;
        gap: 30px;
    }

    .animation-process-timeline::before {
        display: none;
    }

    .event-types-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .corporate-stats-grid,
    .timelapse-applications-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .corporate-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .livestream-platforms-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .yachts-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .realestate-pricing-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .service-hero {
        min-height: 60vh;
        padding: 120px 0 60px;
    }

    .service-hero h1 {
        font-size: 2.25rem;
    }

    .service-hero-subtitle {
        font-size: 1.1rem;
    }

    .animation-benefits-grid,
    .corporate-services-grid,
    .event-equipment-grid,
    .photography-equipment-grid,
    .yachts-capabilities-grid {
        grid-template-columns: 1fr;
    }

    .corporate-why-grid {
        grid-template-columns: 1fr;
    }

    .corporate-why-image {
        order: 1;
    }

    .corporate-why-content {
        order: 2;
    }

    .event-types-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .event-pricing-grid,
    .livestream-packages-grid {
        grid-template-columns: 1fr;
    }

    .photography-process-steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .photography-process-step::after {
        display: none;
    }

    .interview-benefits-list {
        grid-template-columns: 1fr;
    }

    .livestream-hero::after {
        top: 100px;
        right: 20px;
        font-size: 1rem;
        padding: 8px 15px;
    }

    .related-services-grid {
        grid-template-columns: 1fr;
    }

    .yachts-portfolio-item.featured {
        grid-column: span 1;
        aspect-ratio: 4/3;
    }
}

@media (max-width: 576px) {
    .service-hero h1 {
        font-size: 1.85rem;
    }

    .service-hero-buttons {
        flex-direction: column;
    }

    .service-hero-buttons .btn {
        width: 100%;
        text-align: center;
    }

    .animation-type-content.active {
        grid-template-columns: 1fr;
    }

    .corporate-stats-grid,
    .timelapse-applications-grid,
    .yachts-services-grid {
        grid-template-columns: 1fr;
    }

    .event-types-grid {
        grid-template-columns: 1fr;
    }

    .timelapse-process-circle {
        display: none;
    }

    .yachts-why-stats {
        grid-template-columns: 1fr;
    }
}

/* ================================
   SERVICE PAGE SHARED CLASSES
   ================================ */

.service-page {
    background: var(--white);
}

/* Section headers with label */
.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-header.centered {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.section-label {
    display: inline-block;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 15px;
}

.section-header h2 {
    font-size: 2.75rem;
    color: var(--black);
    margin-bottom: 15px;
}

.section-header p {
    font-size: 1.15rem;
    color: var(--gray);
    max-width: 600px;
    margin: 0 auto;
}

/* ================================
   EVENTS PAGE (Event Coverage)
   ================================ */

.events-page {
    background: var(--white);
}

/* Events Hero */
.events-hero {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.events-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.events-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.events-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.9) 0%, rgba(143, 1, 119, 0.8) 50%, rgba(222, 26, 88, 0.7) 100%);
    z-index: 2;
}

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

.events-hero-content {
    max-width: 750px;
}

.events-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50px;
    padding: 10px 20px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 25px;
}

.events-hero-badge .live-dot {
    width: 8px;
    height: 8px;
    background: #FF4757;
    border-radius: 50%;
    animation: pulse 1.5s infinite;
}

.events-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.events-hero-subtitle {
    font-size: 1.3rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2.5rem;
    line-height: 1.7;
}

.events-hero-stats {
    display: flex;
    gap: 40px;
    margin-top: 40px;
}

.events-hero-stat {
    text-align: center;
}

.events-hero-stat span:first-child {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--highlight);
}

.events-hero-stat span:last-child {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.8);
}

/* Events Services Circle Grid */
.events-services {
    padding: 100px 0;
    background: var(--white);
}

.events-services-circle-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.events-service-circle {
    text-align: center;
}

.events-service-icon-circle {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--gradient-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    transition: all 0.3s ease;
}

.events-service-icon-circle svg {
    width: 50px;
    height: 50px;
    fill: var(--white);
}

.events-service-circle:hover .events-service-icon-circle {
    transform: scale(1.1);
    box-shadow: 0 10px 30px rgba(143, 1, 119, 0.3);
}

.events-service-circle h4 {
    font-size: 1rem;
    color: var(--black);
    margin: 0;
}

/* Events Gallery */
.events-gallery {
    padding: 100px 0;
    background: var(--light-gray);
}

.events-gallery-filter {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 50px;
    flex-wrap: wrap;
}

.events-filter-btn {
    background: transparent;
    border: 2px solid var(--primary);
    color: var(--primary);
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.events-filter-btn:hover,
.events-filter-btn.active {
    background: var(--gradient-primary);
    border-color: transparent;
    color: var(--white);
}

.events-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.events-gallery-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 1;
    cursor: pointer;
}

.events-gallery-item.large {
    grid-column: span 2;
    grid-row: span 2;
}

.events-gallery-item.tall {
    grid-row: span 2;
}

.events-gallery-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.events-gallery-item:hover .events-gallery-image {
    transform: scale(1.1);
}

.events-gallery-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px 20px 20px;
    background: linear-gradient(transparent, rgba(0,0,0,0.8));
    opacity: 0;
    transition: all 0.3s ease;
}

.events-gallery-item:hover .events-gallery-overlay {
    opacity: 1;
}

.events-gallery-category {
    color: var(--highlight);
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.events-gallery-overlay h4 {
    color: var(--white);
    font-size: 1.1rem;
    margin: 0;
}

/* Events Timeline */
.events-timeline {
    padding: 100px 0;
    background: var(--white);
}

.events-timeline-list {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding: 30px 0;
}

.events-timeline-line {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--gradient-primary);
}

.events-timeline-item {
    display: flex;
    align-items: center;
    margin-bottom: 50px;
    position: relative;
}

.events-timeline-item:nth-child(odd) {
    flex-direction: row-reverse;
}

.events-timeline-marker {
    width: 60px;
    height: 60px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.events-timeline-marker svg {
    width: 28px;
    height: 28px;
    fill: var(--white);
}

.events-timeline-content {
    width: calc(50% - 60px);
    background: var(--white);
    padding: 25px 30px;
    border-radius: 15px;
    box-shadow: var(--shadow-md);
}

.events-timeline-item:nth-child(odd) .events-timeline-content {
    margin-right: auto;
    text-align: right;
}

.events-timeline-item:nth-child(even) .events-timeline-content {
    margin-left: auto;
}

.events-timeline-date {
    color: var(--primary);
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 5px;
}

.events-timeline-content h4 {
    font-size: 1.2rem;
    color: var(--black);
    margin-bottom: 8px;
}

.events-timeline-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Events Process */
.events-process {
    padding: 100px 0;
    background: var(--light-gray);
}

/* Events Pricing */
.events-pricing {
    padding: 100px 0;
    background: var(--white);
}

.events-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.events-pricing-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
    border: 2px solid transparent;
}

.events-pricing-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.events-pricing-card.featured {
    border-color: var(--primary);
    transform: scale(1.05);
}

.events-pricing-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 25px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.events-pricing-header h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.events-pricing-price {
    margin-bottom: 30px;
}

.events-pricing-from {
    font-size: 0.85rem;
    color: var(--gray);
}

.events-pricing-amount {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary);
}

.events-pricing-features {
    list-style: none;
    padding: 0;
    margin: 0 0 30px;
    text-align: left;
}

.events-pricing-features li {
    padding: 10px 0;
    border-bottom: 1px solid var(--light-gray);
    color: var(--gray);
    display: flex;
    align-items: center;
    gap: 10px;
}

.events-pricing-features li::before {
    content: '✓';
    color: var(--primary);
    font-weight: 700;
}

.events-pricing-note {
    text-align: center;
    margin-top: 40px;
    color: var(--gray);
    font-size: 0.9rem;
}

/* Events Equipment */
.events-equipment {
    padding: 100px 0;
    background: var(--gradient-primary);
    color: var(--white);
}

.events-equipment-grid {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 60px;
    align-items: center;
}

.events-equipment-content h2 {
    color: var(--white);
    font-size: 2.5rem;
    margin-bottom: 20px;
}

.events-equipment-content p {
    color: rgba(255,255,255,0.9);
    margin-bottom: 30px;
}

.events-equipment-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.events-equipment-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px;
    background: rgba(255,255,255,0.1);
    border-radius: 10px;
    transition: all 0.3s ease;
}

.events-equipment-item:hover {
    background: rgba(255,255,255,0.2);
    transform: translateX(5px);
}

.events-equipment-item svg {
    width: 24px;
    height: 24px;
    fill: var(--highlight);
}

.events-equipment-item span {
    color: var(--white);
    font-weight: 500;
}

.events-equipment-image {
    position: relative;
}

.events-equipment-image-frame {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.3);
}

.events-equipment-image-frame img {
    width: 100%;
    display: block;
}

/* Events Related */
.events-related {
    padding: 80px 0;
    background: var(--light-gray);
}

.events-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.events-related-card {
    background: var(--white);
    border-radius: 15px;
    padding: 40px 30px;
    text-align: center;
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
}

.events-related-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.events-related-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.events-related-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.events-related-card h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 10px;
}

.events-related-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Events Contact */
.events-contact {
    padding: 100px 0;
    background: var(--white);
}

.events-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.events-contact-info h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.events-contact-info p {
    color: var(--gray);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.events-contact-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.events-contact-feature {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.events-contact-feature-icon {
    width: 50px;
    height: 50px;
    background: var(--gradient-primary);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.events-contact-feature-icon svg {
    width: 24px;
    height: 24px;
    fill: var(--white);
}

.events-contact-feature-text h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin-bottom: 5px;
}

.events-contact-feature-text p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

.events-contact-form {
    background: var(--light-gray);
    padding: 40px;
    border-radius: 20px;
}

.events-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   INTERVIEWS PAGE
   ================================ */

/* Interviews Page Custom Color Palette */
.interviews-page,
body:has(.interviews-hero) {
    --interviews-primary: #476EAE;
    --interviews-secondary: #48B3AF;
    --interviews-accent: #A7E399;
    --interviews-highlight: #F6FF99;
    --interviews-gradient: linear-gradient(135deg, #476EAE 0%, #48B3AF 50%, #A7E399 100%);
    --interviews-gradient-alt: linear-gradient(135deg, #48B3AF 0%, #A7E399 100%);
}

.interviews-page {
    background: var(--white);
}

/* Interviews Page - Override shared components colors */
body:has(.interviews-hero) .service-hero-overlay {
    background: linear-gradient(135deg, rgba(71, 110, 174, 0.85) 0%, rgba(72, 179, 175, 0.75) 100%);
}

body:has(.interviews-hero) .btn-primary {
    background: var(--interviews-gradient);
    border-color: transparent;
}

body:has(.interviews-hero) .btn-primary:hover {
    background: linear-gradient(135deg, #3a5d94 0%, #3d9995 100%);
}

body:has(.interviews-hero) .section-label {
    background: var(--interviews-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

body:has(.interviews-hero) .animation-benefit-icon {
    background: var(--interviews-gradient);
}

body:has(.interviews-hero) .animation-benefit-card:hover {
    border-color: #48B3AF;
}

body:has(.interviews-hero) .animation-process-number {
    background: var(--interviews-gradient);
}

body:has(.interviews-hero) .animation-process-step::after {
    background: linear-gradient(90deg, #476EAE, #48B3AF);
}

body:has(.interviews-hero) .animation-tab-btn {
    box-shadow: inset 0 0 0 2px #48B3AF;
    color: #476EAE;
}

body:has(.interviews-hero) .animation-tab-btn.active {
    background: linear-gradient(135deg, #48B3AF 0%, #A7E399 100%);
    box-shadow: none;
    color: var(--white);
}

body:has(.interviews-hero) .animation-tab-btn:hover:not(.active) {
    background: rgba(167, 227, 153, 0.15);
    box-shadow: inset 0 0 0 2px #A7E399;
    color: #48B3AF;
}

body:has(.interviews-hero) .animation-type-visual::before {
    background: linear-gradient(135deg, rgba(72, 179, 175, 0.1) 0%, rgba(167, 227, 153, 0.15) 100%);
}

body:has(.interviews-hero) .animation-type-visual {
    border-radius: 15px;
    overflow: hidden;
    position: relative;
}

body:has(.interviews-hero) .animation-type-visual::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 3px solid transparent;
    border-radius: 15px;
    transition: all 0.3s ease;
    pointer-events: none;
}

body:has(.interviews-hero) .animation-type-content.active .animation-type-visual::after {
    border-color: #A7E399;
    box-shadow: 0 8px 25px rgba(167, 227, 153, 0.3);
}

body:has(.interviews-hero) .gradient-bg {
    background: var(--interviews-gradient);
}

body:has(.interviews-hero) .faq-accordion-item.active .faq-accordion-question {
    background: linear-gradient(135deg, rgba(72, 179, 175, 0.1) 0%, rgba(167, 227, 153, 0.15) 100%);
}

body:has(.interviews-hero) .faq-accordion-icon {
    transition: all 0.3s ease;
}

body:has(.interviews-hero) .faq-accordion-item.active .faq-accordion-icon {
    background: linear-gradient(135deg, #48B3AF 0%, #A7E399 100%);
    border-radius: 50%;
}

body:has(.interviews-hero) .faq-accordion-item.active .faq-accordion-icon svg {
    fill: #fff;
}

body:has(.interviews-hero) .related-service-card-new {
    display: flex;
    align-items: center;
    gap: 20px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

body:has(.interviews-hero) .related-service-content {
    flex: 1;
}

body:has(.interviews-hero) .related-service-card-new:hover {
    border-color: #A7E399;
    background: linear-gradient(135deg, rgba(72, 179, 175, 0.05) 0%, rgba(167, 227, 153, 0.1) 100%);
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(72, 179, 175, 0.2);
}

body:has(.interviews-hero) .related-service-icon {
    background: linear-gradient(135deg, #48B3AF 0%, #A7E399 100%);
}

body:has(.interviews-hero) .related-service-card-new:hover .related-service-icon {
    background: linear-gradient(135deg, #A7E399 0%, #F6FF99 100%);
    transform: scale(1.1);
}

body:has(.interviews-hero) .related-service-arrow {
    width: 40px;
    height: 40px;
    min-width: 40px;
    background: rgba(72, 179, 175, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    transition: all 0.3s ease;
}

body:has(.interviews-hero) .related-service-arrow svg {
    fill: #48B3AF;
    transition: all 0.3s ease;
}

body:has(.interviews-hero) .related-service-card-new:hover .related-service-arrow {
    background: linear-gradient(135deg, #A7E399 0%, #F6FF99 100%);
    transform: translateX(5px);
}

body:has(.interviews-hero) .related-service-card-new:hover .related-service-arrow svg {
    fill: #476EAE;
}

body:has(.interviews-hero) .service-contact-section {
    background: var(--interviews-gradient);
}

body:has(.interviews-hero) .service-contact-form .btn-primary {
    background: linear-gradient(135deg, #476EAE 0%, #48B3AF 100%);
}

/* Interviews Hero Split */
.interviews-hero {
    min-height: 90vh;
    display: flex;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
}

/* Interviews Hero - Standard Layout Override */
.interviews-hero.service-hero {
    padding: 140px 0 80px;
    align-items: center;
}

.interviews-hero-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    min-height: 100vh;
}

.interviews-hero-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 140px 60px 80px 60px;
    background: var(--white);
}

.interviews-hero-right {
    position: relative;
}

.interviews-hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.interviews-hero-label {
    display: inline-block;
    background: var(--interviews-gradient, var(--gradient-primary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 20px;
}

.interviews-hero-content h1 {
    font-size: 3rem;
    color: var(--black);
    margin-bottom: 1.5rem;
    line-height: 1.15;
}

.interviews-hero-content p {
    font-size: 1.15rem;
    color: var(--gray);
    margin-bottom: 2rem;
    line-height: 1.7;
}

.interviews-hero-features {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 30px;
}

.interviews-hero-feature {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--light-gray);
    padding: 10px 18px;
    border-radius: 30px;
    font-size: 0.9rem;
    color: var(--black);
}

.interviews-hero-feature svg {
    width: 18px;
    height: 18px;
    fill: var(--interviews-primary, var(--primary));
}

/* Interviews Setup Grid */
.interviews-setup {
    padding: 100px 0;
    background: var(--light-gray);
}

.interviews-setup-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-top: 50px;
}

.interviews-setup-image {
    position: relative;
}

.interviews-setup-image-frame {
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

.interviews-setup-image-frame img {
    width: 100%;
    display: block;
}

.interviews-setup-badge {
    position: absolute;
    bottom: 20px;
    left: 20px;
    background: rgba(0,0,0,0.7);
    backdrop-filter: blur(10px);
    color: var(--white);
    padding: 10px 20px;
    border-radius: 10px;
    font-size: 0.85rem;
}

.interviews-setup-content h2 {
    font-size: 2.25rem;
    color: var(--black);
    margin-bottom: 20px;
}

.interviews-setup-content > p {
    color: var(--gray);
    margin-bottom: 30px;
    font-size: 1.05rem;
}

.interviews-setup-features {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.interviews-setup-feature {
    padding: 20px;
    background: var(--white);
    border-radius: 12px;
    border-left: 4px solid var(--interviews-primary, var(--primary));
}

.interviews-setup-feature-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.interviews-setup-feature-header svg {
    width: 24px;
    height: 24px;
    fill: var(--interviews-primary, var(--primary));
}

.interviews-setup-feature-header h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin: 0;
}

.interviews-setup-feature p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
    padding-left: 36px;
}

/* Interviews Types Accordion */
.interviews-types {
    padding: 100px 0;
    background: var(--white);
}

.interviews-accordion {
    max-width: 900px;
    margin: 50px auto 0;
}

.interviews-accordion-item {
    background: var(--white);
    border-radius: 15px;
    margin-bottom: 15px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
    border: 1px solid var(--light-gray);
}

.interviews-accordion-header {
    display: flex;
    align-items: center;
    padding: 25px 30px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.interviews-accordion-header:hover {
    background: var(--light-gray);
}

.interviews-accordion-icon {
    width: 50px;
    height: 50px;
    background: var(--interviews-gradient, var(--gradient-primary));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
}

.interviews-accordion-icon svg {
    width: 26px;
    height: 26px;
    fill: var(--white);
}

.interviews-accordion-title {
    flex: 1;
}

.interviews-accordion-title h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin: 0 0 5px;
}

.interviews-accordion-title p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

.interviews-accordion-arrow {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.interviews-accordion-arrow svg {
    width: 20px;
    height: 20px;
    fill: var(--gray);
}

.interviews-accordion-item.active .interviews-accordion-arrow {
    transform: rotate(180deg);
}

.interviews-accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.interviews-accordion-item.active .interviews-accordion-content {
    max-height: 500px;
}

.interviews-accordion-inner {
    padding: 0 30px 30px;
    color: var(--gray);
    line-height: 1.7;
}

/* Interviews Locations */
.interviews-locations {
    padding: 100px 0;
    background: var(--light-gray);
}

.interviews-locations-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.interviews-location-card {
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
}

.interviews-location-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.interviews-location-image {
    height: 200px;
    overflow: hidden;
}

.interviews-location-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.interviews-location-card:hover .interviews-location-image img {
    transform: scale(1.1);
}

.interviews-location-content {
    padding: 25px;
}

.interviews-location-content h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 10px;
}

.interviews-location-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Interviews Tips */
.interviews-tips {
    padding: 100px 0;
    background: var(--white);
}

.interviews-tips-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.interviews-tips-header h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.interviews-tips-header p {
    color: var(--gray);
    font-size: 1.1rem;
}

.interviews-tips-grid {
    display: grid;
    gap: 20px;
}

.interviews-tip-card {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 25px;
    background: var(--light-gray);
    border-radius: 15px;
    transition: all 0.3s ease;
}

.interviews-tip-card:hover {
    background: var(--white);
    box-shadow: var(--shadow-md);
}

.interviews-tip-number {
    width: 50px;
    height: 50px;
    background: var(--interviews-gradient, var(--gradient-primary));
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-size: 1.25rem;
    font-weight: 700;
    flex-shrink: 0;
}

.interviews-tip-card h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin-bottom: 8px;
}

.interviews-tip-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Interviews Process */
.interviews-process {
    padding: 100px 0;
    background: var(--light-gray);
}

.interviews-process-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.interviews-process-step {
    text-align: center;
    position: relative;
}

.interviews-process-step::after {
    content: '';
    position: absolute;
    top: 40px;
    right: -15px;
    width: 30px;
    height: 2px;
    background: var(--interviews-primary, var(--primary));
}

.interviews-process-step:last-child::after {
    display: none;
}

.interviews-process-number {
    width: 80px;
    height: 80px;
    background: var(--interviews-gradient, var(--gradient-primary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: var(--white);
    font-size: 1.75rem;
    font-weight: 700;
}

.interviews-process-icon {
    width: 80px;
    height: 80px;
    background: var(--interviews-gradient, var(--gradient-primary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.interviews-process-icon svg {
    width: 36px;
    height: 36px;
    fill: var(--white);
}

.interviews-process-content h4 {
    font-size: 1.15rem;
    color: var(--black);
    margin-bottom: 10px;
}

.interviews-process-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Interviews Related */
.interviews-related {
    padding: 80px 0;
    background: var(--white);
}

.interviews-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.interviews-related-card {
    background: var(--light-gray);
    border-radius: 15px;
    padding: 40px 30px;
    text-align: center;
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
}

.interviews-related-card:hover {
    transform: translateY(-10px);
    background: var(--white);
    box-shadow: var(--shadow-lg);
}

.interviews-related-icon {
    width: 70px;
    height: 70px;
    background: var(--interviews-gradient, var(--gradient-primary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.interviews-related-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.interviews-related-card h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 10px;
}

.interviews-related-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Interviews Contact */
.interviews-contact {
    padding: 100px 0;
    background: var(--interviews-gradient, var(--gradient-primary));
}

.interviews-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.interviews-contact-header h2 {
    font-size: 2.5rem;
    color: var(--white);
    margin-bottom: 20px;
}

.interviews-contact-header p {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
}

.interviews-contact-form {
    background: var(--white);
    padding: 40px;
    border-radius: 20px;
}

.interviews-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   STREAMING PAGE (Live-Streaming)
   ================================ */

.streaming-page {
    background: var(--white);
}

/* Streaming Hero */
.streaming-hero {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.streaming-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.streaming-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.streaming-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.92) 0%, rgba(143, 1, 119, 0.85) 50%, rgba(222, 26, 88, 0.75) 100%);
    z-index: 2;
}

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

.streaming-hero-content {
    max-width: 700px;
}

.streaming-live-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 71, 87, 0.2);
    border: 1px solid rgba(255, 71, 87, 0.5);
    backdrop-filter: blur(10px);
    border-radius: 50px;
    padding: 10px 20px;
    font-size: 0.85rem;
    font-weight: 700;
    color: #FF4757;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 25px;
}

.streaming-live-dot {
    width: 10px;
    height: 10px;
    background: #FF4757;
    border-radius: 50%;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(1.2); }
}

.streaming-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.streaming-hero-subtitle {
    font-size: 1.25rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
    line-height: 1.7;
}

.streaming-hero-platforms {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 40px;
}

.streaming-hero-platforms span {
    color: rgba(255,255,255,0.7);
    font-size: 0.9rem;
}

.streaming-platform-icons {
    display: flex;
    gap: 15px;
}

.streaming-platform-icon {
    width: 45px;
    height: 45px;
    background: rgba(255,255,255,0.15);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.streaming-platform-icon:hover {
    background: rgba(255,255,255,0.25);
    transform: translateY(-3px);
}

.streaming-platform-icon svg {
    width: 24px;
    height: 24px;
    fill: var(--white);
}

/* Streaming Benefits */
.streaming-benefits {
    padding: 100px 0;
    background: var(--white);
}

.streaming-benefits-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.streaming-benefit-card {
    text-align: center;
    padding: 40px 25px;
    background: var(--light-gray);
    border-radius: 20px;
    transition: all 0.3s ease;
}

.streaming-benefit-card:hover {
    background: var(--white);
    box-shadow: var(--shadow-lg);
    transform: translateY(-10px);
}

.streaming-benefit-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
}

.streaming-benefit-icon svg {
    width: 40px;
    height: 40px;
    fill: var(--white);
}

.streaming-benefit-card h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 12px;
}

.streaming-benefit-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Streaming Use Cases */
.streaming-usecases {
    padding: 100px 0;
    background: var(--light-gray);
}

.streaming-usecases-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.streaming-usecase {
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
}

.streaming-usecase:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.streaming-usecase-image {
    height: 200px;
    overflow: hidden;
}

.streaming-usecase-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.streaming-usecase:hover .streaming-usecase-image img {
    transform: scale(1.1);
}

.streaming-usecase-content {
    padding: 30px;
}

.streaming-usecase-content h3 {
    font-size: 1.35rem;
    color: var(--black);
    margin-bottom: 12px;
}

.streaming-usecase-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Streaming Tech Specs */
.streaming-tech {
    padding: 100px 0;
    background: var(--gradient-primary);
}

.streaming-tech-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.streaming-tech-content h2 {
    font-size: 2.5rem;
    color: var(--white);
    margin-bottom: 20px;
}

.streaming-tech-content > p {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.streaming-tech-features {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.streaming-tech-list {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--white);
    font-size: 1rem;
}

.streaming-tech-list svg {
    width: 20px;
    height: 20px;
    fill: var(--highlight);
}

.streaming-tech-specs {
    background: rgba(255,255,255,0.1);
    border-radius: 20px;
    padding: 40px;
    backdrop-filter: blur(10px);
}

.streaming-tech-spec {
    display: flex;
    justify-content: space-between;
    padding: 20px 0;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}

.streaming-tech-spec:last-child {
    border-bottom: none;
}

.streaming-tech-spec-header {
    display: flex;
    align-items: center;
    gap: 12px;
}

.streaming-tech-spec-header svg {
    width: 24px;
    height: 24px;
    fill: var(--highlight);
}

.streaming-tech-spec-label {
    color: rgba(255,255,255,0.8);
    font-size: 0.9rem;
}

.streaming-tech-spec-value {
    color: var(--white);
    font-weight: 600;
    font-size: 1rem;
}

/* Streaming Process */
.streaming-process {
    padding: 100px 0;
    background: var(--white);
}

.streaming-process-timeline {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    margin-top: 50px;
    position: relative;
}

.streaming-process-timeline::before {
    content: '';
    position: absolute;
    top: 40px;
    left: 10%;
    right: 10%;
    height: 3px;
    background: var(--gradient-primary);
}

.streaming-process-step {
    text-align: center;
    position: relative;
}

.streaming-process-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    position: relative;
    z-index: 2;
}

.streaming-process-icon svg {
    width: 36px;
    height: 36px;
    fill: var(--white);
}

.streaming-process-step h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin-bottom: 8px;
}

.streaming-process-step p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Streaming Packages */
.streaming-packages {
    padding: 100px 0;
    background: var(--light-gray);
}

.streaming-packages-table {
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    margin-top: 50px;
}

.streaming-package-header {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    background: var(--gradient-primary);
    color: var(--white);
}

.streaming-package-tier {
    padding: 30px 20px;
    text-align: center;
    font-size: 1.25rem;
    font-weight: 700;
}

.streaming-package-tier:first-child {
    text-align: left;
}

.streaming-package-badge {
    display: inline-block;
    background: var(--highlight);
    color: var(--black);
    padding: 3px 10px;
    border-radius: 15px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-left: 10px;
}

.streaming-package-row {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    border-bottom: 1px solid var(--light-gray);
}

.streaming-package-row:last-child {
    border-bottom: none;
}

.streaming-package-feature {
    padding: 20px;
    display: flex;
    align-items: center;
}

.streaming-package-feature-label {
    color: var(--black);
    font-weight: 500;
}

.streaming-package-value {
    padding: 20px;
    text-align: center;
    color: var(--gray);
    display: flex;
    align-items: center;
    justify-content: center;
}

.streaming-package-value svg {
    width: 24px;
    height: 24px;
}

.streaming-package-value svg.check {
    fill: var(--primary);
}

/* Streaming Checkbox Form Elements */
.streaming-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin: 15px 0;
}

.streaming-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.streaming-checkbox input {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
}

/* Streaming Related */
.streaming-related {
    padding: 80px 0;
    background: var(--white);
}

.streaming-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.streaming-related-card {
    background: var(--light-gray);
    border-radius: 15px;
    padding: 40px 30px;
    text-align: center;
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
}

.streaming-related-card:hover {
    transform: translateY(-10px);
    background: var(--white);
    box-shadow: var(--shadow-lg);
}

.streaming-related-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.streaming-related-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.streaming-related-card h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 10px;
}

.streaming-related-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Streaming Contact */
.streaming-contact {
    padding: 100px 0;
    background: var(--gradient-primary);
}

.streaming-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.streaming-contact-info h2 {
    font-size: 2.5rem;
    color: var(--white);
    margin-bottom: 20px;
}

.streaming-contact-info > p {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.streaming-contact-stats {
    display: flex;
    gap: 40px;
}

.streaming-contact-stat {
    text-align: center;
}

.streaming-contact-stat span:first-child {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--highlight);
}

.streaming-contact-stat span:last-child {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.8);
}

.streaming-contact-form {
    background: var(--white);
    padding: 40px;
    border-radius: 20px;
}

.streaming-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   PHOTOGRAPHY PAGE
   ================================ */

.photography-page {
    background: var(--white);
}

/* Photography Hero */
.photography-hero {
    position: relative;
    min-height: 90vh;
    display: flex;
    align-items: center;
    padding: 0;
    overflow: hidden;
}

.photography-hero-mosaic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 5px;
}

.photography-mosaic-item {
    overflow: hidden;
}

.photography-mosaic-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photography-mosaic-item.large {
    grid-column: span 2;
    grid-row: span 2;
}

.photography-mosaic-item.tall {
    grid-row: span 2;
}

.photography-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.9) 0%, rgba(143, 1, 119, 0.8) 50%, rgba(222, 26, 88, 0.7) 100%);
    z-index: 2;
}

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

.photography-hero-content {
    max-width: 750px;
    margin: 0 auto;
    text-align: center;
    padding: 140px 0 80px;
}

.photography-hero-label {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.3);
    backdrop-filter: blur(10px);
    color: var(--white);
    padding: 10px 25px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 25px;
}

.photography-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.photography-hero-content p {
    font-size: 1.25rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
}

/* Photography Services */
.photography-services {
    padding: 100px 0;
    background: var(--white);
}

.photography-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.photography-service-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 4/5;
}

.photography-service-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.photography-service-card:hover .photography-service-image {
    transform: scale(1.1);
}

.photography-service-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 40px 30px 30px;
    background: linear-gradient(transparent, rgba(0,0,0,0.9));
}

.photography-service-overlay h3 {
    font-size: 1.5rem;
    color: var(--white);
    margin-bottom: 10px;
}

.photography-service-overlay p {
    color: rgba(255,255,255,0.8);
    font-size: 0.95rem;
    margin: 0;
}

/* Photography Why Section */
.photography-why {
    padding: 100px 0;
    background: var(--light-gray);
}

.photography-why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.photography-why-content h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.photography-why-text {
    color: var(--gray);
    font-size: 1.05rem;
    margin-bottom: 30px;
    line-height: 1.7;
}

.photography-why-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.photography-why-feature {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.photography-why-icon {
    width: 45px;
    height: 45px;
    background: var(--gradient-primary);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.photography-why-icon svg {
    width: 22px;
    height: 22px;
    fill: var(--white);
}

.photography-why-feature h4 {
    font-size: 1rem;
    color: var(--black);
    margin-bottom: 5px;
}

.photography-why-feature p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

.photography-why-stats {
    display: flex;
    gap: 30px;
    margin-top: 30px;
}

.photography-why-stat {
    text-align: center;
}

.photography-why-stat span:first-child {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.photography-why-stat span:last-child {
    font-size: 0.85rem;
    color: var(--gray);
}

/* Photography Portfolio */
.photography-portfolio {
    padding: 100px 0;
    background: var(--white);
}

.photography-portfolio-filter {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 50px;
    flex-wrap: wrap;
}

.photography-filter-btn {
    background: transparent;
    border: 2px solid var(--primary);
    color: var(--primary);
    padding: 10px 25px;
    border-radius: 30px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.photography-filter-btn:hover,
.photography-filter-btn.active {
    background: var(--gradient-primary);
    border-color: transparent;
    color: var(--white);
}

.photography-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.photography-portfolio-item {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 1;
    cursor: pointer;
}

.photography-portfolio-item.large {
    grid-column: span 2;
    grid-row: span 2;
}

.photography-portfolio-item.tall {
    grid-row: span 2;
}

.photography-portfolio-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.photography-portfolio-item:hover .photography-portfolio-image {
    transform: scale(1.1);
}

.photography-portfolio-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 50%, rgba(0,0,0,0.8));
    opacity: 0;
    transition: all 0.3s ease;
    display: flex;
    align-items: flex-end;
    padding: 20px;
}

.photography-portfolio-item:hover .photography-portfolio-overlay {
    opacity: 1;
}

.photography-portfolio-overlay span {
    color: var(--highlight);
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.photography-portfolio-overlay h4 {
    color: var(--white);
    font-size: 1.1rem;
    margin: 5px 0 0;
}

/* Photography Process */
.photography-process {
    padding: 100px 0;
    background: var(--light-gray);
}

.photography-process-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.photography-process-step {
    text-align: center;
    position: relative;
}

.photography-process-step::after {
    content: '';
    position: absolute;
    top: 40px;
    right: -15px;
    width: 30px;
    height: 2px;
    background: var(--primary);
}

.photography-process-step:last-child::after {
    display: none;
}

.photography-process-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.photography-process-icon svg {
    width: 36px;
    height: 36px;
    fill: var(--white);
}

.photography-process-content h4 {
    font-size: 1.15rem;
    color: var(--black);
    margin-bottom: 10px;
}

.photography-process-content p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Photography Packages */
.photography-packages {
    padding: 100px 0;
    background: var(--white);
}

.photography-packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.photography-package-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
    border: 2px solid transparent;
}

.photography-package-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.photography-package-card.featured {
    border-color: var(--primary);
    transform: scale(1.05);
}

.photography-package-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 25px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.photography-package-header h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.photography-package-price {
    margin-bottom: 30px;
}

.photography-package-amount {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary);
}

.photography-package-unit {
    font-size: 0.9rem;
    color: var(--gray);
}

.photography-package-features {
    list-style: none;
    padding: 0;
    margin: 0 0 30px;
    text-align: left;
}

.photography-package-features li {
    padding: 10px 0;
    border-bottom: 1px solid var(--light-gray);
    color: var(--gray);
    display: flex;
    align-items: center;
    gap: 10px;
}

.photography-package-features li::before {
    content: '✓';
    color: var(--primary);
    font-weight: 700;
}

.photography-packages-note {
    text-align: center;
    margin-top: 40px;
    color: var(--gray);
    font-size: 0.9rem;
}

/* Photography Related */
.photography-related {
    padding: 80px 0;
    background: var(--light-gray);
}

.photography-related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.photography-related-card {
    background: var(--white);
    border-radius: 15px;
    padding: 40px 30px;
    text-align: center;
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
}

.photography-related-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.photography-related-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.photography-related-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.photography-related-card h3 {
    font-size: 1.25rem;
    color: var(--black);
    margin-bottom: 10px;
}

.photography-related-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Photography Contact */
.photography-contact {
    padding: 100px 0;
    background: var(--white);
}

.photography-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.photography-contact-info h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.photography-contact-info > p {
    color: var(--gray);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.photography-contact-benefits {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.photography-contact-benefit {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--black);
    font-weight: 500;
}

.photography-contact-benefit svg {
    width: 24px;
    height: 24px;
    fill: var(--primary);
}

.photography-contact-form {
    background: var(--light-gray);
    padding: 40px;
    border-radius: 20px;
}

.photography-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   REAL ESTATE PAGE
   ================================ */

.realestate-page {
    background: var(--white);
}

/* Real Estate Hero */
.realestate-hero {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.realestate-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.realestate-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.realestate-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.9) 0%, rgba(143, 1, 119, 0.8) 50%, rgba(222, 26, 88, 0.7) 100%);
    z-index: 2;
}

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

.realestate-hero-content {
    max-width: 750px;
}

.realestate-hero-label {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.3);
    backdrop-filter: blur(10px);
    color: var(--white);
    padding: 10px 25px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 25px;
}

.realestate-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.realestate-hero-content p {
    font-size: 1.25rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
}

.realestate-hero-stats {
    display: flex;
    gap: 40px;
    margin-top: 40px;
}

.realestate-hero-stat {
    text-align: center;
}

.realestate-hero-stat span:first-child {
    display: block;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--highlight);
}

.realestate-hero-stat span:last-child {
    font-size: 0.9rem;
    color: rgba(255,255,255,0.8);
}

/* Real Estate Services */
.realestate-services {
    padding: 100px 0;
    background: var(--white);
}

.realestate-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 50px;
}

.realestate-service-box {
    text-align: center;
    padding: 40px 25px;
    background: var(--light-gray);
    border-radius: 20px;
    transition: all 0.3s ease;
}

.realestate-service-box:hover {
    background: var(--white);
    box-shadow: var(--shadow-lg);
    transform: translateY(-10px);
}

.realestate-service-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.realestate-service-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.realestate-service-box h3 {
    font-size: 1.15rem;
    color: var(--black);
    margin-bottom: 10px;
}

.realestate-service-box p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Real Estate Why Section */
.realestate-why {
    padding: 100px 0;
    background: var(--light-gray);
}

.realestate-why-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.realestate-why-content h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.realestate-why-content > p {
    color: var(--gray);
    font-size: 1.05rem;
    margin-bottom: 30px;
    line-height: 1.7;
}

.realestate-why-facts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.realestate-why-fact {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    background: var(--white);
    border-radius: 12px;
}

.realestate-why-fact-number {
    font-size: 1.75rem;
    font-weight: 700;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.realestate-why-fact p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

.realestate-why-image {
    position: relative;
}

.realestate-why-image-frame {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.realestate-why-image-frame img {
    width: 100%;
    display: block;
}

/* Real Estate Portfolio */
.realestate-portfolio {
    padding: 100px 0;
    background: var(--white);
}

.realestate-portfolio-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 50px;
}

.realestate-portfolio-item {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    aspect-ratio: 4/3;
    cursor: pointer;
}

.realestate-portfolio-item.large {
    grid-column: span 2;
}

.realestate-portfolio-item.tall {
    grid-row: span 2;
}

.realestate-portfolio-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.4s ease;
}

.realestate-portfolio-item:hover .realestate-portfolio-image {
    transform: scale(1.1);
}

.realestate-portfolio-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px 25px 25px;
    background: linear-gradient(transparent, rgba(0,0,0,0.85));
    opacity: 0;
    transition: all 0.3s ease;
}

.realestate-portfolio-item:hover .realestate-portfolio-overlay {
    opacity: 1;
}

.realestate-portfolio-type {
    display: inline-block;
    background: var(--gradient-primary);
    color: var(--white);
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.realestate-portfolio-overlay h4 {
    color: var(--white);
    font-size: 1.25rem;
    margin: 0;
}

/* Real Estate Packages */
.realestate-packages {
    padding: 100px 0;
    background: var(--light-gray);
}

.realestate-packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.realestate-package-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
    border: 2px solid transparent;
}

.realestate-package-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.realestate-package-card.featured {
    border-color: var(--primary);
    transform: scale(1.05);
}

.realestate-package-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 25px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.realestate-package-header h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.realestate-package-price {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 30px;
}

/* Real Estate Contact */
.realestate-contact {
    padding: 100px 0;
    background: var(--white);
}

.realestate-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.realestate-contact-info h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.realestate-contact-info > p {
    color: var(--gray);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.realestate-contact-features {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.realestate-contact-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--black);
    font-weight: 500;
}

.realestate-contact-feature svg {
    width: 24px;
    height: 24px;
    fill: var(--primary);
}

.realestate-contact-form {
    background: var(--light-gray);
    padding: 40px;
    border-radius: 20px;
}

.realestate-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   TIMELAPSE PAGE
   ================================ */

.timelapse-page {
    background: var(--white);
}

/* Timelapse Hero */
.timelapse-hero {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    padding: 140px 0 80px;
    overflow: hidden;
}

.timelapse-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.timelapse-hero-bg img,
.timelapse-hero-bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.timelapse-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.9) 0%, rgba(143, 1, 119, 0.8) 50%, rgba(222, 26, 88, 0.7) 100%);
    z-index: 2;
}

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

.timelapse-hero-content {
    max-width: 700px;
}

.timelapse-hero-label {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.3);
    backdrop-filter: blur(10px);
    color: var(--white);
    padding: 10px 25px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 25px;
}

.timelapse-hero h1 {
    font-size: 3.5rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.timelapse-hero-content p {
    font-size: 1.25rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
}

.timelapse-hero-cta {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* Timelapse Types */
.timelapse-types {
    padding: 100px 0;
    background: var(--white);
}

.timelapse-types-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.timelapse-type-card {
    text-align: center;
    padding: 40px 30px;
    background: var(--light-gray);
    border-radius: 20px;
    transition: all 0.3s ease;
}

.timelapse-type-card:hover {
    background: var(--white);
    box-shadow: var(--shadow-lg);
    transform: translateY(-10px);
}

.timelapse-type-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 25px;
}

.timelapse-type-icon svg {
    width: 40px;
    height: 40px;
    fill: var(--white);
}

.timelapse-type-card h3 {
    font-size: 1.35rem;
    color: var(--black);
    margin-bottom: 12px;
}

.timelapse-type-card p {
    color: var(--gray);
    font-size: 0.95rem;
    margin: 0;
}

/* Timelapse Specs */
.timelapse-specs {
    padding: 100px 0;
    background: var(--light-gray);
}

.timelapse-specs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.timelapse-specs-content h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.timelapse-specs-content > p {
    color: var(--gray);
    font-size: 1.05rem;
    margin-bottom: 30px;
}

.timelapse-specs-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.timelapse-spec-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 20px;
    background: var(--white);
    border-radius: 12px;
}

.timelapse-spec-item svg {
    width: 24px;
    height: 24px;
    fill: var(--primary);
}

.timelapse-spec-item span {
    color: var(--black);
    font-weight: 500;
}

.timelapse-specs-image {
    position: relative;
}

.timelapse-specs-image-frame {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.timelapse-specs-image-frame img {
    width: 100%;
    display: block;
}

/* Timelapse Process */
.timelapse-process {
    padding: 100px 0;
    background: var(--white);
}

.timelapse-process-circular {
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-top: 50px;
    flex-wrap: wrap;
}

.timelapse-process-step {
    text-align: center;
    max-width: 200px;
}

.timelapse-process-number {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: var(--white);
    font-size: 1.75rem;
    font-weight: 700;
}

.timelapse-process-step h4 {
    font-size: 1.15rem;
    color: var(--black);
    margin-bottom: 10px;
}

.timelapse-process-step p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Timelapse Pricing */
.timelapse-pricing {
    padding: 100px 0;
    background: var(--light-gray);
}

.timelapse-pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.timelapse-pricing-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
    border: 2px solid transparent;
}

.timelapse-pricing-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.timelapse-pricing-card.featured {
    border-color: var(--primary);
    transform: scale(1.05);
}

.timelapse-pricing-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 25px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.timelapse-pricing-card h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.timelapse-pricing-price {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 30px;
}

/* Timelapse Contact */
.timelapse-contact {
    padding: 100px 0;
    background: var(--white);
}

.timelapse-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

.timelapse-contact-info h2 {
    font-size: 2.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.timelapse-contact-info > p {
    color: var(--gray);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.timelapse-contact-form {
    background: var(--light-gray);
    padding: 40px;
    border-radius: 20px;
}

.timelapse-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   YACHTS PAGE
   ================================ */

.yachts-page {
    background: var(--white);
}

/* Yachts Hero */
.yachts-hero {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: 0;
    overflow: hidden;
}

.yachts-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.yachts-hero-bg img,
.yachts-hero-bg video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yachts-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(54, 1, 133, 0.7) 100%);
    z-index: 2;
}

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

.yachts-hero-content {
    max-width: 800px;
    padding: 140px 0 80px;
}

.yachts-hero-badge {
    display: inline-block;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    backdrop-filter: blur(10px);
    color: var(--white);
    padding: 10px 25px;
    border-radius: 50px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 25px;
}

.yachts-hero h1 {
    font-size: 4rem;
    color: var(--white);
    margin-bottom: 1.5rem;
    line-height: 1.05;
}

.yachts-hero-content p {
    font-size: 1.35rem;
    color: rgba(255,255,255,0.95);
    margin-bottom: 2rem;
    line-height: 1.7;
}

.yachts-hero-cta {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.yachts-hero-scroll {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    text-align: center;
    color: var(--white);
    font-size: 0.85rem;
    cursor: pointer;
}

.yachts-hero-scroll-line {
    width: 1px;
    height: 50px;
    background: linear-gradient(to bottom, var(--white), transparent);
    margin: 15px auto 0;
}

/* Yachts Services */
.yachts-services {
    padding: 100px 0;
    background: var(--white);
}

.yachts-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 50px;
}

.yachts-service-card {
    text-align: center;
    padding: 40px 25px;
    background: var(--light-gray);
    border-radius: 20px;
    transition: all 0.3s ease;
    position: relative;
}

.yachts-service-card:hover {
    background: var(--white);
    box-shadow: var(--shadow-lg);
    transform: translateY(-10px);
}

.yachts-service-tag {
    position: absolute;
    top: 15px;
    right: 15px;
    background: var(--highlight);
    color: var(--black);
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.yachts-service-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.yachts-service-icon svg {
    width: 35px;
    height: 35px;
    fill: var(--white);
}

.yachts-service-card h3 {
    font-size: 1.15rem;
    color: var(--black);
    margin-bottom: 10px;
}

.yachts-service-card p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Yachts Vessels */
.yachts-vessels {
    padding: 100px 0;
    background: var(--light-gray);
}

.yachts-vessels-showcase {
    margin-top: 50px;
}

.yachts-vessel-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    margin-bottom: 60px;
}

.yachts-vessel-item:nth-child(even) {
    direction: rtl;
}

.yachts-vessel-item:nth-child(even) > * {
    direction: ltr;
}

.yachts-vessel-image {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}

.yachts-vessel-image img {
    width: 100%;
    display: block;
}

.yachts-vessel-size {
    display: inline-block;
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 20px;
    border-radius: 30px;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 15px;
}

.yachts-vessel-content h3 {
    font-size: 2rem;
    color: var(--black);
    margin-bottom: 15px;
}

.yachts-vessel-content p {
    color: var(--gray);
    font-size: 1.05rem;
    margin-bottom: 25px;
    line-height: 1.7;
}

/* Yachts Process */
.yachts-process {
    padding: 100px 0;
    background: var(--white);
}

.yachts-process-timeline {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    margin-top: 50px;
    position: relative;
}

.yachts-process-timeline::before {
    content: '';
    position: absolute;
    top: 40px;
    left: 10%;
    right: 10%;
    height: 3px;
    background: var(--gradient-primary);
}

.yachts-process-step {
    text-align: center;
    position: relative;
}

.yachts-process-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    position: relative;
    z-index: 2;
}

.yachts-process-icon svg {
    width: 36px;
    height: 36px;
    fill: var(--white);
}

.yachts-process-number {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    color: var(--white);
    font-size: 1.75rem;
    font-weight: 700;
    position: relative;
    z-index: 2;
}

.yachts-process-content h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin-bottom: 8px;
}

.yachts-process-content p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

/* Yachts Packages */
.yachts-packages {
    padding: 100px 0;
    background: var(--light-gray);
}

.yachts-packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 50px;
}

.yachts-package-card {
    background: var(--white);
    border-radius: 20px;
    padding: 40px 30px;
    text-align: center;
    box-shadow: var(--shadow-md);
    transition: all 0.3s ease;
    position: relative;
    border: 2px solid transparent;
}

.yachts-package-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-lg);
}

.yachts-package-card.featured {
    border-color: var(--primary);
    transform: scale(1.05);
}

.yachts-package-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--gradient-primary);
    color: var(--white);
    padding: 8px 25px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
}

.yachts-package-header h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 20px;
}

.yachts-package-price {
    font-size: 3rem;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 30px;
}

/* Yachts Addons */
.yachts-packages-addons {
    margin-top: 60px;
}

.yachts-addons-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.yachts-addon {
    text-align: center;
    padding: 25px 20px;
    background: var(--white);
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
}

.yachts-addon h4 {
    font-size: 1rem;
    color: var(--black);
    margin-bottom: 8px;
}

.yachts-addon p {
    color: var(--primary);
    font-weight: 600;
    margin: 0;
}

/* Yachts Marinas */
.yachts-marinas {
    padding: 100px 0;
    background: var(--white);
}

.yachts-marinas-map {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 40px;
    margin-top: 50px;
}

.yachts-marina-visual {
    border-radius: 20px;
    overflow: hidden;
    height: 400px;
}

.yachts-marina-visual img,
.yachts-marina-visual iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.yachts-marina-locations {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.yachts-marina-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    padding: 20px;
    background: var(--light-gray);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.yachts-marina-item:hover {
    background: var(--white);
    box-shadow: var(--shadow-md);
}

.yachts-marina-marker {
    width: 40px;
    height: 40px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.yachts-marina-marker svg {
    width: 20px;
    height: 20px;
    fill: var(--white);
}

.yachts-marina-info h4 {
    font-size: 1.1rem;
    color: var(--black);
    margin-bottom: 5px;
}

.yachts-marina-info p {
    color: var(--gray);
    font-size: 0.9rem;
    margin: 0;
}

.yachts-marinas-note {
    text-align: center;
    margin-top: 30px;
    color: var(--gray);
    font-size: 0.9rem;
}

/* Yachts Contact */
.yachts-contact {
    padding: 100px 0;
    background: var(--gradient-primary);
}

.yachts-contact-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.yachts-contact-info h2 {
    font-size: 2.5rem;
    color: var(--white);
    margin-bottom: 20px;
}

.yachts-contact-info > p {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.yachts-contact-features {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.yachts-contact-feature {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--white);
    font-weight: 500;
}

.yachts-contact-feature svg {
    width: 24px;
    height: 24px;
    fill: var(--highlight);
}

.yachts-contact-form {
    background: var(--white);
    padding: 40px;
    border-radius: 20px;
}

.yachts-contact-form h3 {
    font-size: 1.5rem;
    color: var(--black);
    margin-bottom: 25px;
}

/* ================================
   RESPONSIVE STYLES FOR NEW SECTIONS
   ================================ */

@media (max-width: 1200px) {
    .streaming-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .events-services-circle-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .yachts-services-grid,
    .realestate-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .interviews-hero-split {
        grid-template-columns: 1fr;
    }

    .interviews-hero-right {
        height: 400px;
    }

    .streaming-tech-wrapper,
    .streaming-contact-wrapper,
    .photography-why-grid,
    .photography-contact-wrapper,
    .realestate-why-grid,
    .realestate-contact-wrapper,
    .timelapse-specs-grid,
    .timelapse-contact-wrapper,
    .yachts-contact-wrapper,
    .events-equipment-grid,
    .events-contact-wrapper,
    .interviews-setup-grid,
    .interviews-tips-wrapper,
    .interviews-contact-wrapper {
        grid-template-columns: 1fr;
    }

    .streaming-process-timeline,
    .yachts-process-timeline {
        grid-template-columns: repeat(3, 1fr);
    }

    .streaming-process-timeline::before,
    .yachts-process-timeline::before {
        display: none;
    }

    .events-timeline-line {
        left: 30px;
    }

    .events-timeline-item,
    .events-timeline-item:nth-child(odd) {
        flex-direction: column;
        padding-left: 90px;
    }

    .events-timeline-marker {
        left: 30px;
        transform: none;
    }

    .events-timeline-content,
    .events-timeline-item:nth-child(odd) .events-timeline-content {
        width: 100%;
        margin: 0;
        text-align: left;
    }

    .interviews-locations-grid,
    .interviews-related-grid,
    .events-related-grid,
    .streaming-related-grid,
    .streaming-usecases-grid,
    .photography-related-grid,
    .photography-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .interviews-process-steps,
    .photography-process-steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .interviews-process-step::after,
    .photography-process-step::after {
        display: none;
    }

    .streaming-packages-table {
        overflow-x: auto;
    }

    .photography-portfolio-grid,
    .events-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .yachts-vessel-item,
    .yachts-vessel-item:nth-child(even) {
        grid-template-columns: 1fr;
        direction: ltr;
    }

    .yachts-marinas-map {
        grid-template-columns: 1fr;
    }

    .yachts-packages-grid,
    .timelapse-pricing-grid,
    .realestate-packages-grid,
    .photography-packages-grid,
    .events-pricing-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .yachts-addons-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .events-hero h1,
    .interviews-hero-content h1,
    .streaming-hero h1,
    .photography-hero h1,
    .realestate-hero h1,
    .timelapse-hero h1,
    .yachts-hero h1 {
        font-size: 2.5rem;
    }

    .section-header h2 {
        font-size: 2rem;
    }

    .events-services-circle-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .events-service-icon-circle {
        width: 80px;
        height: 80px;
    }

    .events-service-icon-circle svg {
        width: 35px;
        height: 35px;
    }

    .streaming-benefits-grid,
    .timelapse-types-grid {
        grid-template-columns: 1fr;
    }

    .streaming-process-timeline,
    .yachts-process-timeline {
        grid-template-columns: repeat(2, 1fr);
    }

    .interviews-hero-left {
        padding: 120px 30px 60px;
    }

    .interviews-locations-grid,
    .interviews-related-grid,
    .events-related-grid,
    .streaming-related-grid,
    .streaming-usecases-grid,
    .photography-related-grid,
    .photography-services-grid,
    .realestate-portfolio-grid {
        grid-template-columns: 1fr;
    }

    .interviews-process-steps,
    .photography-process-steps {
        grid-template-columns: 1fr;
    }

    .yachts-services-grid,
    .realestate-services-grid {
        grid-template-columns: 1fr;
    }

    .yachts-packages-grid,
    .timelapse-pricing-grid,
    .realestate-packages-grid,
    .photography-packages-grid,
    .events-pricing-grid {
        grid-template-columns: 1fr;
    }

    .photography-why-features,
    .realestate-why-facts {
        grid-template-columns: 1fr;
    }

    .events-hero-stats,
    .realestate-hero-stats,
    .streaming-contact-stats {
        flex-direction: column;
        gap: 20px;
    }

    .photography-portfolio-grid,
    .events-gallery-grid {
        grid-template-columns: 1fr;
    }

    .photography-portfolio-item.large,
    .photography-portfolio-item.tall,
    .events-gallery-item.large,
    .events-gallery-item.tall {
        grid-column: span 1;
        grid-row: span 1;
    }
}

@media (max-width: 576px) {
    .events-hero h1,
    .interviews-hero-content h1,
    .streaming-hero h1,
    .photography-hero h1,
    .realestate-hero h1,
    .timelapse-hero h1,
    .yachts-hero h1 {
        font-size: 2rem;
    }

    .events-hero-badge,
    .streaming-live-badge,
    .photography-hero-label,
    .realestate-hero-label,
    .timelapse-hero-label,
    .yachts-hero-badge {
        font-size: 0.75rem;
        padding: 8px 15px;
    }

    .streaming-process-timeline,
    .yachts-process-timeline {
        grid-template-columns: 1fr;
    }

    .events-services-circle-grid {
        grid-template-columns: 1fr;
    }

    .yachts-addons-grid {
        grid-template-columns: 1fr;
    }

    .interviews-hero-features {
        flex-direction: column;
    }

    .streaming-hero-platforms {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* ==========================================
   ANIMATION PAGE STYLES
   ========================================== */

/* White text for section titles */
.section-title.white-text h2,
.section-title.white-text p {
    color: var(--white);
}

/* Animation Hero Background */
.animation-hero .service-hero-bg img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.animation-hero .service-hero-overlay {
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.85), rgba(143, 1, 119, 0.75), rgba(222, 26, 88, 0.65));
}

/* Equipment Hero Background */
.equipment-hero {
    background: linear-gradient(-45deg, #0a0a0a, #1a1a2e, #16213e, #0f0f23);
    background-size: 400% 400%;
    animation: equipmentGradient 20s ease infinite;
}

@keyframes equipmentGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.equipment-hero .service-hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.equipment-hero .service-hero-bg img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.equipment-hero .service-hero-overlay {
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.8), rgba(143, 1, 119, 0.7), rgba(10, 10, 10, 0.85));
}

/* What is Animation Visual */
.what-is-animation {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.what-is-animation-content h2 {
    font-size: 2.2rem;
    color: var(--primary);
    margin-bottom: 20px;
}

.what-is-animation-content p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: var(--dark-gray);
    margin-bottom: 15px;
}

.what-is-animation-visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(54, 1, 133, 0.2);
}

.what-is-animation-visual img {
    width: 100%;
    height: auto;
    display: block;
}

.what-is-animation-visual::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.1), transparent);
    pointer-events: none;
}

/* Animation Types with Images */
.animation-types-tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
    flex-wrap: wrap;
}

.animation-tab-btn {
    padding: 12px 24px;
    border: none;
    box-shadow: inset 0 0 0 2px var(--primary);
    background: transparent;
    color: var(--primary);
    border-radius: 30px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.animation-tab-btn:hover,
.animation-tab-btn.active {
    background: var(--gradient-primary);
    box-shadow: none;
    color: var(--white);
}

.animation-type-content {
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    animation: fadeIn 0.4s ease;
}

.animation-type-content.active {
    display: grid;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.animation-type-text h3 {
    font-size: 1.8rem;
    color: var(--primary);
    margin-bottom: 15px;
}

.animation-type-text p {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--dark-gray);
    margin-bottom: 15px;
}

.animation-type-visual {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.15);
}

.animation-type-visual img {
    width: 100%;
    height: 350px;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

.animation-type-content.active .animation-type-visual img {
    animation: imageSlideIn 0.5s ease;
}

@keyframes imageSlideIn {
    from { opacity: 0; transform: scale(1.05); }
    to { opacity: 1; transform: scale(1); }
}

/* New Related Services Design */
.related-services-new {
    padding: 80px 0;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
}

.related-services-grid-new {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

.related-service-card-new {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--white);
    padding: 25px 30px;
    border-radius: 16px;
    text-decoration: none;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid transparent;
}

.related-service-card-new:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(54, 1, 133, 0.15);
    border-color: rgba(54, 1, 133, 0.2);
}

.related-service-icon {
    width: 60px;
    height: 60px;
    min-width: 60px;
    background: var(--gradient-primary);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.related-service-card-new:hover .related-service-icon {
    transform: scale(1.1) rotate(5deg);
}

.related-service-icon svg {
    width: 28px;
    height: 28px;
    fill: var(--white);
}

.related-service-content {
    flex: 1;
}

.related-service-content h4 {
    font-size: 1.2rem;
    color: var(--primary);
    margin-bottom: 6px;
    transition: color 0.3s ease;
}

.related-service-card-new:hover .related-service-content h4 {
    color: var(--accent);
}

.related-service-content p {
    font-size: 0.9rem;
    color: var(--gray);
    line-height: 1.5;
    margin: 0;
}

.related-service-arrow {
    width: 40px;
    height: 40px;
    min-width: 40px;
    background: var(--light-gray);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.related-service-card-new:hover .related-service-arrow {
    background: var(--gradient-primary);
}

.related-service-arrow svg {
    width: 18px;
    height: 18px;
    fill: var(--primary);
    transition: all 0.3s ease;
}

.related-service-card-new:hover .related-service-arrow svg {
    fill: var(--white);
    transform: translateX(3px);
}

/* Animation Benefits Grid */
.animation-benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.animation-benefit-card {
    background: var(--white);
    padding: 35px 25px;
    border-radius: 16px;
    text-align: center;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.animation-benefit-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(54, 1, 133, 0.15);
}

.animation-benefit-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.animation-benefit-icon svg {
    width: 32px;
    height: 32px;
    fill: var(--white);
}

.animation-benefit-card h3 {
    font-size: 1.15rem;
    color: var(--primary);
    margin-bottom: 12px;
}

.animation-benefit-card p {
    font-size: 0.95rem;
    color: var(--gray);
    line-height: 1.6;
    margin: 0;
}

/* Animation Process Timeline */
.animation-process-timeline {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    position: relative;
}

.animation-process-timeline::before {
    content: '';
    position: absolute;
    top: 35px;
    left: 10%;
    right: 10%;
    height: 3px;
    background: rgba(255, 255, 255, 0.3);
}

.animation-process-step {
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 1;
}

.animation-process-number {
    width: 70px;
    height: 70px;
    background: var(--white);
    color: var(--primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 auto 20px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}

.animation-process-step h4 {
    color: var(--white);
    font-size: 1.1rem;
    margin-bottom: 8px;
}

.animation-process-step p {
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9rem;
    line-height: 1.5;
}

/* Animation Page Responsive */
@media (max-width: 992px) {
    .what-is-animation {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .animation-type-content {
        grid-template-columns: 1fr;
    }

    .animation-type-visual {
        order: -1;
    }

    .animation-benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .animation-process-timeline {
        flex-direction: column;
        gap: 30px;
    }

    .animation-process-timeline::before {
        display: none;
    }

    .animation-process-step {
        display: flex;
        align-items: center;
        text-align: left;
        gap: 20px;
    }

    .animation-process-number {
        margin: 0;
        min-width: 60px;
        width: 60px;
        height: 60px;
        font-size: 1.3rem;
    }

    .related-services-grid-new {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .animation-benefits-grid {
        grid-template-columns: 1fr;
    }

    .animation-types-tabs {
        flex-direction: column;
        align-items: center;
    }

    .animation-tab-btn {
        width: 100%;
        max-width: 300px;
    }

    .what-is-animation-content h2 {
        font-size: 1.8rem;
    }

    .animation-type-text h3 {
        font-size: 1.5rem;
    }

    .related-service-card-new {
        flex-direction: column;
        text-align: center;
        padding: 25px 20px;
    }

    .related-service-arrow {
        display: none;
    }
}

@media (max-width: 576px) {
    .animation-type-visual img {
        height: 250px;
    }

    .animation-process-step {
        flex-direction: column;
        text-align: center;
    }

    .animation-process-number {
        margin: 0 auto 15px;
    }
}

/* Corporate SEO Content Section */
.corporate-seo-content {
    padding: 80px 0;
    background: var(--light-gray);
}

.seo-content-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 60px;
    align-items: start;
}

.seo-content-main h2 {
    color: var(--primary);
    font-size: 1.75rem;
    margin-bottom: 20px;
}

.seo-content-main h3 {
    color: var(--primary);
    font-size: 1.25rem;
    margin: 30px 0 15px;
}

.seo-content-main p {
    color: var(--gray);
    line-height: 1.8;
    margin-bottom: 15px;
}

.seo-content-sidebar {
    background: var(--white);
    padding: 30px;
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
}

.seo-content-sidebar h4 {
    color: var(--primary);
    margin-bottom: 20px;
    font-size: 1.1rem;
}

.seo-content-sidebar ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.seo-content-sidebar li {
    padding: 8px 0;
    color: var(--gray);
    border-bottom: 1px solid var(--light-gray);
}

.seo-content-sidebar li:last-child {
    border-bottom: none;
}

/* Corporate Case Studies - Fix Positioning */
.corporate-case-card {
    display: none;
    background: var(--white);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.corporate-case-card.active {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.corporate-case-image {
    background: var(--gradient-primary);
    min-height: 300px;
}

.corporate-case-content {
    padding: 40px;
}

.corporate-case-industry {
    display: inline-block;
    background: var(--gradient-primary);
    color: var(--white);
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.8rem;
    margin-bottom: 15px;
}

.corporate-case-content h3 {
    color: var(--primary);
    margin-bottom: 15px;
}

.corporate-case-content > p {
    color: var(--gray);
    line-height: 1.7;
    margin-bottom: 20px;
}

.corporate-case-stats {
    display: flex;
    gap: 30px;
}

.corporate-case-stat strong {
    display: block;
    font-size: 1.5rem;
    color: var(--primary);
}

.corporate-case-stat span {
    color: var(--gray);
    font-size: 0.85rem;
}

/* Corporate Carousel SVG Fix */
.corporate-carousel-btn svg {
    width: 20px;
    height: 20px;
}

@media (max-width: 768px) {
    .seo-content-grid {
        grid-template-columns: 1fr;
    }

    .corporate-case-card.active {
        grid-template-columns: 1fr;
    }

    .corporate-case-image {
        min-height: 200px;
    }

    .corporate-case-content {
        padding: 25px;
    }
}

/* ===========================================
   CORPORATE PAGE - Custom Color Palette
   Colors: #050C9C, #3572EF, #3ABEF9, #A7E6FF, #00B7B5
   =========================================== */

/* Corporate Page Color Variables */
.corporate-page {
    --corp-primary: #050C9C;
    --corp-secondary: #3572EF;
    --corp-accent: #3ABEF9;
    --corp-light: #A7E6FF;
    --corp-teal: #00B7B5;
}

/* Corporate Hero with new colors */
.corporate-page .corporate-hero {
    background-color: var(--corp-primary);
}

.corporate-page .corporate-hero-video-bg {
    background: transparent;
}

.corporate-page .corporate-hero-overlay {
    background: linear-gradient(135deg, rgba(5, 12, 156, 0.88) 0%, rgba(53, 114, 239, 0.78) 100%);
}

.corporate-page .corporate-hero-badge {
    background: var(--corp-accent);
    color: #fff;
}

.corporate-page .highlight {
    color: var(--corp-accent);
}

/* Stats Bar */
.corporate-page .corporate-stats-bar {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
}

/* Services Section - New gradient and text colors */
.corporate-page .corporate-services-section {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
}

/* Fix text readability on gradient */
.corporate-page .corporate-services-section .section-label {
    color: var(--corp-light);
    background: rgba(167, 230, 255, 0.15);
}

.corporate-page .corporate-services-section h2 {
    color: #ffffff;
}

.corporate-page .corporate-services-section .section-header > p {
    color: rgba(255, 255, 255, 0.9);
}

/* Service Icons Centering Fix */
.corporate-page .corporate-service-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80px;
    height: 80px;
    margin: 0 auto 20px auto;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 16px;
}

.corporate-page .corporate-service-icon svg {
    width: 36px;
    height: 36px;
    stroke: var(--corp-accent);
}

.corporate-page .corporate-service-box {
    text-align: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(167, 230, 255, 0.2);
}

.corporate-page .corporate-service-box:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: var(--corp-accent);
}

.corporate-page .corporate-service-box h3 {
    color: #ffffff;
}

.corporate-page .corporate-service-box p {
    color: rgba(255, 255, 255, 0.85);
}

.corporate-page .corporate-service-features li::before {
    color: var(--corp-accent);
}

/* Process Section */
.corporate-page .corporate-process {
    background: var(--corp-light);
}

.corporate-page .corporate-process-number {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
    color: #fff;
}

.corporate-page .corporate-process-step h3 {
    color: var(--corp-primary);
}

/* Why Section */
.corporate-page .corporate-why-icon {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
}

.corporate-page .corporate-why-text h4 {
    color: var(--corp-primary);
}

/* Contact Section */
.corporate-page .corporate-contact {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
}

.corporate-page .corporate-contact .section-label {
    background: rgba(167, 230, 255, 0.15);
    color: var(--corp-light);
}

.corporate-page .corporate-contact h2 {
    color: #fff;
}

.corporate-page .corporate-contact-info > p {
    color: rgba(255, 255, 255, 0.9);
}

.corporate-page .corporate-contact-benefit {
    color: rgba(255, 255, 255, 0.9);
}

.corporate-page .corporate-contact-benefit svg {
    stroke: var(--corp-accent);
}

.corporate-page .btn-primary {
    background: var(--corp-teal);
    border-color: var(--corp-teal);
}

.corporate-page .btn-primary:hover {
    background: var(--corp-accent);
    border-color: var(--corp-accent);
}

/* Related Services */
.corporate-page .corporate-related-icon {
    background: linear-gradient(135deg, var(--corp-primary) 0%, var(--corp-secondary) 100%);
}

.corporate-page .corporate-related-card:hover {
    border-color: var(--corp-accent);
}

.corporate-page .corporate-related-card:hover .corporate-related-icon {
    background: linear-gradient(135deg, var(--corp-secondary) 0%, var(--corp-accent) 100%);
}

/* SEO Content Section */
.corporate-page .corporate-seo-content h2,
.corporate-page .corporate-seo-content h3 {
    color: var(--corp-primary);
}

.corporate-page .seo-content-full {
    max-width: 900px;
    margin: 0 auto;
}

/* Corporate Page - Section Headers (Light backgrounds) */
.corporate-page .section-header h2,
.corporate-page .section-header p {
    color: #1a1a2e;
}

.corporate-page .section-header.centered {
    text-align: center;
    margin-bottom: 50px;
}

.corporate-page .section-label {
    background: #3abef9 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 2px;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    margin-bottom: 15px;
}

.corporate-page .section-header h2 {
    font-size: 42px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
}

.corporate-page .section-header h2 .highlight {
    color: #F7B731;
}

.corporate-page .section-header p {
    color: #666;
    font-size: 18px;
}

/* Why Section - "The Power of Video" */
.corporate-page .corporate-why-content .section-label {
    background: #3abef9;
    color: #ffffff;
}

.corporate-page .corporate-why-content h2 {
    color: #1a1a2e;
}

.corporate-page .corporate-why-content h2 .highlight {
    color: #F7B731;
}

/* Services Section - "What We Offer" (Gradient background) */
.corporate-page .corporate-services-section .section-label {
    background: #3abef9;
    color: #ffffff;
}

.corporate-page .corporate-services-section .section-header h2 {
    color: #ffffff;
}

.corporate-page .corporate-services-section .section-header h2 .highlight {
    color: #A7E6FF;
}

.corporate-page .corporate-services-section .section-header p {
    color: rgba(255, 255, 255, 0.9);
}

/* Process Section - "How We Work" */
.corporate-page .corporate-process .section-label {
    background: #3abef9;
    color: #ffffff;
}

.corporate-page .corporate-process .section-header h2 {
    color: #1a1a2e;
}

.corporate-page .corporate-process .section-header h2 .highlight {
    color: #F7B731;
}

.corporate-page .corporate-process .section-header p {
    color: #666;
}

/* Contact Section - "Get Started" (Gradient background) */
.corporate-page .corporate-contact .section-label {
    background: #3abef9;
    color: #ffffff;
}

.corporate-page .corporate-contact h2 {
    color: #ffffff;
}

.corporate-page .corporate-contact h2 .highlight {
    color: #A7E6FF;
}

.corporate-page .corporate-contact-info > p {
    color: rgba(255, 255, 255, 0.9);
}

/* Related Services Section */
.corporate-page .corporate-related .section-label {
    background: #3abef9;
    color: #ffffff;
}

.corporate-page .corporate-related .section-header h2 {
    color: #1a1a2e;
}

.corporate-page .corporate-related .section-header h2 .highlight {
    color: #F7B731;
}

/* ================================
   EQUIPMENT PAGE STYLES
   ================================ */

/* Equipment Feature Grid */
.equipment-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

@media (max-width: 1024px) {
    .equipment-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

.equipment-feature-card {
    background: var(--white);
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.equipment-feature-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
    border-color: var(--primary);
}

.equipment-feature-icon {
    width: 50px;
    height: 50px;
    background: var(--gradient-primary);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
}

.equipment-feature-icon svg {
    width: 24px;
    height: 24px;
    fill: var(--white);
}

.equipment-feature-card h3 {
    font-size: 1.25rem;
    margin-bottom: 12px;
    color: var(--black);
}

.equipment-feature-card p {
    color: var(--gray);
    line-height: 1.6;
    font-size: 0.95rem;
}

/* Equipment Category Grid */
.equipment-category-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

@media (max-width: 900px) {
    .equipment-category-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

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

.equipment-brand-card {
    background: var(--white);
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    border-left: 4px solid var(--primary);
    transition: all 0.3s ease;
}

.equipment-brand-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
}

.equipment-brand-card h3 {
    font-size: 1.1rem;
    color: var(--primary);
    margin-bottom: 15px;
    font-weight: 700;
}

.equipment-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.equipment-list li {
    padding: 8px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    color: var(--gray);
    font-size: 0.95rem;
}

.equipment-list li:last-child {
    border-bottom: none;
}

/* Equipment Features List (GlamBot section) */
.equipment-features-list {
    list-style: none;
    padding: 0;
    margin: 25px 0 0;
}

.equipment-features-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    color: var(--gray);
}

.equipment-features-list li svg {
    width: 20px;
    height: 20px;
    fill: var(--primary);
    flex-shrink: 0;
}

/* Insurance Note */
.insurance-note {
    margin-top: 25px;
    padding: 15px;
    background: rgba(222, 26, 88, 0.1);
    border-radius: 8px;
    font-size: 0.9rem;
    color: var(--gray);
}

.insurance-note strong {
    color: var(--secondary);
}

/* SEO Content Block */
.seo-content-block {
    max-width: 900px;
    margin: 0 auto;
}

.seo-content-block h2 {
    font-size: 2rem;
    color: var(--primary);
    margin-bottom: 25px;
    text-align: center;
}

.seo-content-block p {
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--dark-gray);
    margin-bottom: 20px;
    text-align: justify;
}

.seo-content-block p:last-child {
    margin-bottom: 0;
}

.seo-content-block strong {
    color: var(--primary);
}

/* What is Animation Reverse Layout */
.what-is-animation.reverse {
    flex-direction: row-reverse;
}

@media (max-width: 900px) {
    .what-is-animation.reverse {
        flex-direction: column;
    }
}

/* ================================
   ABOUT PAGE STYLES
   ================================ */

/* About Hero */
.about-hero {
    background: linear-gradient(-45deg, #1a1a2e, #16213e, #0f3460, #FF3366);
    background-size: 400% 400%;
    animation: aboutGradient 20s ease infinite;
}

@keyframes aboutGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.about-hero .service-hero-bg img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.about-hero .service-hero-overlay {
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.8), rgba(143, 1, 119, 0.7), rgba(26, 26, 46, 0.85));
}

/* About Stats Grid */
.about-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

@media (max-width: 900px) {
    .about-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 500px) {
    .about-stats-grid {
        grid-template-columns: 1fr;
    }
}

.about-stat-card {
    text-align: center;
    padding: 40px 20px;
    background: var(--white);
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.about-stat-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(54, 1, 133, 0.15);
}

.about-stat-number {
    font-size: 3rem;
    font-weight: 700;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 10px;
}

.about-stat-label {
    font-size: 1rem;
    color: var(--gray);
    font-weight: 500;
}

/* ================================
   CONTACT PAGE STYLES
   ================================ */

/* Contact Hero */
.contact-hero {
    min-height: 50vh;
}

.contact-hero-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 50%, var(--accent) 100%);
}

.contact-hero .service-hero-content {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

/* Contact Page Grid */
.contact-page-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 60px;
    align-items: start;
}

/* Contact Form Styling */
.contact-page-form {
    background: var(--white);
    padding: 50px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.contact-page-form h2 {
    font-size: 1.75rem;
    color: var(--primary);
    margin-bottom: 10px;
}

.contact-page-form > p {
    color: var(--gray);
    margin-bottom: 30px;
}

.contact-page-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.contact-page-form .form-group {
    margin-bottom: 20px;
}

.contact-page-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--dark-gray);
    font-size: 0.95rem;
}

.contact-page-form input,
.contact-page-form select,
.contact-page-form textarea {
    width: 100%;
    padding: 14px 18px;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    font-size: 1rem;
    font-family: inherit;
    transition: all 0.3s ease;
    background: var(--light-gray);
}

.contact-page-form input:focus,
.contact-page-form select:focus,
.contact-page-form textarea:focus {
    outline: none;
    border-color: var(--primary);
    background: var(--white);
    box-shadow: 0 0 0 4px rgba(54, 1, 133, 0.1);
}

.contact-page-form textarea {
    min-height: 140px;
    resize: vertical;
}

.contact-page-form .btn-full {
    width: 100%;
    padding: 16px;
    font-size: 1.1rem;
}

/* Contact Info Sidebar */
.contact-page-info {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.contact-info-block {
    background: var(--light-gray);
    padding: 30px;
    border-radius: 15px;
}

.contact-info-block h3 {
    font-size: 1.25rem;
    color: var(--primary);
    margin-bottom: 20px;
}

.contact-info-block > p {
    color: var(--gray);
    line-height: 1.7;
    margin: 0;
}

.contact-page-info .contact-info-item {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
}

.contact-page-info .contact-info-item:last-child {
    margin-bottom: 0;
}

.contact-page-info .contact-info-icon {
    width: 45px;
    height: 45px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-page-info .contact-info-icon svg {
    width: 22px;
    height: 22px;
    fill: var(--white);
}

.contact-page-info .contact-info-item strong {
    display: block;
    color: var(--dark-gray);
    margin-bottom: 4px;
}

.contact-page-info .contact-info-item a {
    color: var(--primary);
}

.contact-page-info .contact-info-item a:hover {
    color: var(--accent);
}

.contact-page-info .contact-info-item address,
.contact-page-info .contact-info-item p {
    color: var(--gray);
    font-style: normal;
    line-height: 1.6;
    margin: 0;
}

/* Map Section */
.contact-map-section {
    padding: 0 0 80px;
}

.contact-map-wrapper {
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

/* Contact Page Responsive */
@media (max-width: 992px) {
    .contact-page-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .contact-page-form {
        padding: 40px 30px;
    }
}

@media (max-width: 768px) {
    .contact-hero {
        min-height: 40vh;
    }

    .contact-page-form .form-row {
        grid-template-columns: 1fr;
    }

    .contact-page-form {
        padding: 30px 20px;
    }

    .contact-info-block {
        padding: 25px 20px;
    }

    .contact-map-section {
        padding: 0 0 60px;
    }
}

@media (max-width: 480px) {
    .contact-hero {
        min-height: 35vh;
    }

    .contact-hero .service-hero-content h1 {
        font-size: 2rem;
    }
}

/* ================================
   SEO SECTION - MODERN MINIMALIST
   ================================ */
.seo-section-modern {
    padding: 120px 0;
    background: var(--white);
    position: relative;
    overflow: hidden;
}

.seo-section-modern::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(135deg, rgba(54, 1, 133, 0.02) 0%, rgba(222, 26, 88, 0.03) 100%);
    pointer-events: none;
}

.seo-modern-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 80px;
    align-items: start;
}

.seo-modern-content {
    position: relative;
}

.seo-modern-label {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--accent);
    margin-bottom: 20px;
}

.seo-modern-content h2 {
    font-size: 2.75rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.15;
    margin-bottom: 30px;
}

.seo-modern-divider {
    width: 60px;
    height: 4px;
    background: var(--gradient-primary);
    border-radius: 2px;
    margin-bottom: 35px;
}

.seo-modern-content p {
    font-size: 1.05rem;
    line-height: 1.85;
    color: var(--gray);
    margin-bottom: 20px;
}

.seo-modern-content p:last-child {
    margin-bottom: 0;
}

/* Highlight Cards */
.seo-modern-highlights {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.seo-highlight-card {
    background: var(--light-gray);
    border-radius: 16px;
    padding: 28px 24px;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.seo-highlight-card:hover {
    background: var(--white);
    border-color: rgba(54, 1, 133, 0.1);
    box-shadow: 0 10px 30px rgba(54, 1, 133, 0.08);
    transform: translateY(-3px);
}

.seo-highlight-card.featured {
    background: var(--primary);
    grid-column: span 2;
}

.seo-highlight-card.featured:hover {
    background: var(--primary);
    border-color: transparent;
    box-shadow: 0 15px 40px rgba(54, 1, 133, 0.25);
}

.seo-highlight-card.featured .seo-highlight-icon,
.seo-highlight-card.featured .seo-highlight-label,
.seo-highlight-card.featured .seo-highlight-detail {
    color: var(--white);
}

.seo-highlight-card.featured .seo-highlight-icon svg {
    fill: var(--white);
}

.seo-highlight-number {
    font-size: 2.5rem;
    font-weight: 800;
    background: var(--gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    line-height: 1;
    margin-bottom: 8px;
}

.seo-highlight-icon {
    width: 36px;
    height: 36px;
    margin-bottom: 12px;
}

.seo-highlight-icon svg {
    width: 100%;
    height: 100%;
    fill: var(--primary);
}

.seo-highlight-label {
    font-size: 1rem;
    font-weight: 700;
    color: var(--dark-gray);
    margin-bottom: 6px;
}

.seo-highlight-detail {
    font-size: 0.85rem;
    color: var(--gray);
    line-height: 1.4;
}

/* SEO Section Responsive */
@media (max-width: 1024px) {
    .seo-section-modern {
        padding: 90px 0;
    }

    .seo-modern-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .seo-modern-content h2 {
        font-size: 2.25rem;
    }

    .seo-section-modern::before {
        width: 100%;
        height: 50%;
        top: auto;
        bottom: 0;
    }
}

@media (max-width: 768px) {
    .seo-section-modern {
        padding: 70px 0;
    }

    .seo-modern-content h2 {
        font-size: 1.85rem;
    }

    .seo-modern-highlights {
        grid-template-columns: 1fr;
    }

    .seo-highlight-card.featured {
        grid-column: span 1;
    }

    .seo-highlight-card {
        padding: 24px 20px;
    }

    .seo-highlight-number {
        font-size: 2rem;
    }
}

@media (max-width: 480px) {
    .seo-section-modern {
        padding: 50px 0;
    }

    .seo-modern-content h2 {
        font-size: 1.6rem;
    }

    .seo-modern-divider {
        width: 50px;
        margin-bottom: 25px;
    }

    .seo-modern-content p {
        font-size: 1rem;
    }
}

/* SEO Section - Text Only Variant */
.seo-section-modern.seo-text-only {
    padding: 80px 0;
}

.seo-section-modern.seo-text-only::before {
    display: none;
}

.seo-section-modern.seo-text-only .seo-modern-content {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.seo-section-modern.seo-text-only .seo-modern-label {
    display: block;
    margin-bottom: 15px;
}

.seo-section-modern.seo-text-only h2 {
    font-size: 2.25rem;
    margin-bottom: 25px;
}

.seo-section-modern.seo-text-only .seo-modern-divider {
    margin: 0 auto 30px;
}

.seo-section-modern.seo-text-only p {
    text-align: left;
    font-size: 1rem;
    line-height: 1.8;
}

@media (max-width: 768px) {
    .seo-section-modern.seo-text-only {
        padding: 60px 0;
    }

    .seo-section-modern.seo-text-only h2 {
        font-size: 1.75rem;
    }
}

@media (max-width: 480px) {
    .seo-section-modern.seo-text-only {
        padding: 40px 0;
    }

    .seo-section-modern.seo-text-only h2 {
        font-size: 1.5rem;
    }
}