/* ====================================
   Premium Enhancements CSS
   Refined polish without glitchy animations
   ==================================== */

/* ===== GLOBAL ENHANCEMENTS ===== */

/* Smooth scrolling for the entire page */
html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Better text selection */
::selection {
    background: rgba(73, 40, 253, 0.15);
}

/* ===== TYPOGRAPHY REFINEMENTS ===== */

/* Improved line heights and letter spacing for body text */
p,
.text-block-6,
.text-block-5,
.paragraph-3 {
    letter-spacing: 0.01em;
}

/* Headings get subtle letter spacing */
h1,
h2,
h3,
h4,
h5,
h6,
.hero-heading-h1,
.home-heading-h2,
.our-work-heading,
.testimonial-heading-h2,
.achevement-heading-h2 {
    letter-spacing: -0.02em;
}

/* ===== SMOOTH TRANSITIONS ===== */

/* Specific transition for interactive elements - not using 'all' to avoid conflicts */
.c2a-button,
.let-s-collaborate,
.back-to-home-btn,
.button {
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.link-block-2 {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* ===== PREMIUM HOVER STATES ===== */

/* Cards get subtle lift effect on hover - only for desktop */
@media (hover: hover) and (pointer: fine) {

    .card-1:hover,
    .card-2:hover,
    .card-3:hover,
    .card-4:hover,
    .about-card-1:hover,
    .about-card-2:hover,
    .about-card-3:hover,
    .plan-1:hover,
    .div-block-34:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(27, 29, 30, 0.08);
    }

    /* Buttons get subtle scale on hover */
    .c2a-button:hover,
    .let-s-collaborate:hover,
    .back-to-home-btn:hover,
    .button:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(27, 29, 30, 0.12);
    }

    /* Chips/Tags get subtle hover */
    .link-block-2:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(27, 29, 30, 0.06);
    }

    /* Article cards hover */
    .article-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 40px rgba(27, 29, 30, 0.1);
    }

    /* Button icon slide */
    .btn-icon,
    .arrow-div,
    .div-block-21,
    .div-block-23 {
        transition: transform 0.25s ease;
    }

    .c2a-button:hover .btn-icon,
    .let-s-collaborate:hover .div-block-21,
    .back-to-home-btn:hover .div-block-23 {
        transform: translateX(3px);
    }
}

/* ===== FOCUS STATES FOR ACCESSIBILITY ===== */

/* Better focus outlines */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.c2a-button:focus-visible {
    outline: 2px solid var(--violet-100, #4928fd);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ===== FORM ENHANCEMENTS ===== */

/* Inputs get better focus states */
input:focus,
textarea:focus,
select:focus {
    box-shadow: 0 0 0 3px rgba(73, 40, 253, 0.1);
}

/* ===== RESPONSIVE IMPROVEMENTS ===== */

/* Tablet (991px) */
@media screen and (max-width: 991px) {

    /* Better spacing on tablet */
    .container-4,
    .container-5,
    .container-6,
    .container-7,
    .container-8,
    .container-main {
        padding-left: 30px;
        padding-right: 30px;
    }

    /* Cards stack better */
    .card-1,
    .card-2,
    .card-3,
    .card-4 {
        margin-bottom: 16px;
    }

    /* Headings scale down gracefully */
    .hero-heading-h1 {
        font-size: clamp(2.5rem, 6vw, 4rem);
        line-height: 1.1;
    }

    .home-heading-h2,
    .our-work-heading,
    .testimonial-heading-h2,
    .creative-mind-heading {
        font-size: clamp(2rem, 5vw, 3rem);
    }

    /* Touch-friendly button sizes */
    .c2a-button,
    .let-s-collaborate,
    .back-to-home-btn {
        min-height: 48px;
        padding: 12px 20px;
    }

    /* Article grid */
    .articles-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Mobile (767px) */
@media screen and (max-width: 767px) {

    /* More compact containers */
    .container-4,
    .container-5,
    .container-6,
    .container-7,
    .container-8,
    .container-main {
        padding-left: 20px;
        padding-right: 20px;
    }

    /* Section spacing tightens */
    .home-about-section,
    .home-our-work-section,
    .home-our-team-sec,
    .section-6,
    .section-7 {
        padding-top: 80px;
    }

    /* Headings continue to scale */
    .hero-heading-h1 {
        font-size: clamp(2rem, 8vw, 3rem);
    }

    .home-heading-h2,
    .our-work-heading {
        font-size: clamp(1.75rem, 6vw, 2.5rem);
    }

    /* CTA buttons become full width on mobile */
    .call-to-action {
        padding: 24px 20px;
    }

    .collabrator-wrapper {
        flex-direction: column;
        align-items: stretch;
    }

    .let-s-collaborate,
    .back-to-home-btn {
        width: 100%;
        justify-content: center;
    }

    /* Team grid becomes single column */
    .creative-mind-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
        margin-top: 40px;
    }

    /* Profile cards center align */
    .profile-card {
        align-items: center;
        text-align: center;
    }

    /* Navigation improvements */
    .navbar-wrapper-3 {
        padding: 12px 16px;
    }

    /* Innovation grid */
    .innovation-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}

/* Small Mobile (479px) */
@media screen and (max-width: 479px) {

    /* Even tighter containers */
    .container-4,
    .container-5,
    .container-6,
    .container-7,
    .container-8,
    .container-main {
        padding-left: 16px;
        padding-right: 16px;
    }

    /* Ultra-compact sections */
    .home-about-section,
    .home-our-work-section,
    .home-our-team-sec,
    .section-6,
    .section-7 {
        padding-top: 60px;
    }

    /* Typography scales for small screens */
    .hero-heading-h1 {
        font-size: 1.75rem;
        line-height: 1.2;
    }

    .home-heading-h2,
    .our-work-heading {
        font-size: 1.5rem;
    }

    .heading-7,
    .creative-block-title {
        font-size: 1.1rem;
    }

    /* Cards get full width */
    .card-1,
    .card-2,
    .card-3,
    .card-4 {
        width: 100%;
    }

    /* CTA simplifies */
    .call-to-action {
        padding: 20px 16px;
        border-radius: 16px;
    }

    .title-1,
    .title-2 {
        font-size: 1.1rem;
        text-align: center;
    }

    /* Buttons stack */
    .collabrator-btn-div {
        flex-direction: column;
        width: 100%;
    }

    /* Chips wrap better */
    .chips {
        justify-content: center;
    }

    .link-block-2 {
        padding: 8px 14px;
        font-size: 12px;
    }

    /* Footer improvements */
    .footer-div-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-list {
        align-items: center;
    }

    /* Article grid single column */
    .articles-grid {
        grid-template-columns: 1fr;
    }

    /* Innovation grid single column */
    .innovation-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

/* Smaller mobiles for article grid */
@media screen and (max-width: 600px) {
    .articles-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== PRINT STYLES ===== */
@media print {

    .c2a-button,
    .back-to-home-btn,
    .navbar-logo-left-container,
    footer {
        display: none !important;
    }

    * {
        background: white !important;
        color: black !important;
        box-shadow: none !important;
    }
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    html {
        scroll-behavior: auto;
    }
}

/* ===== HIGH CONTRAST MODE ===== */
@media (prefers-contrast: high) {
    .link-block-2 {
        border-width: 2px;
    }

    a:focus-visible,
    button:focus-visible {
        outline-width: 3px;
    }
}

/* ===== TOUCH DEVICE OPTIMIZATIONS ===== */
@media (pointer: coarse) {

    /* Larger touch targets on touch devices */
    .navigation-link,
    .nav-link-4,
    .footer-link-block {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
}

/* ===== LANDSCAPE MOBILE ===== */
@media screen and (max-width: 767px) and (orientation: landscape) {

    .section,
    .home-about-section {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .hero-heading-h1 {
        font-size: 2rem;
    }
}