/*
Theme Name: Astra Child - WherePDF
Template: astra
Version: 1.0.0
Description: Custom styling for WherePDF site with modern SaaS polish
*/

/* ============================================
   1. HIDE PAGE TITLES ON MAIN PAGES
   ============================================ */

/* Hide page titles for Home (5), Pricing (6), Help Center (7), Blog (8) */
.page-id-5 .entry-header,
.page-id-6 .entry-header,
.page-id-7 .entry-header,
.page-id-8 .entry-header {
    display: none !important;
}

/* Ensure blog post titles still show on single posts */
.single-post .entry-header {
    display: block !important;
}

/* ============================================
   2. BACKGROUND & HERO CONTRAST IMPROVEMENTS
   ============================================ */

/* Global body/site background - subtle cool gray */
body,
.site {
    background-color: #F3F4F6 !important;
}

/* Hero section - vivid gradient with card-like appearance */
.wherepdf-hero,
.page-id-5 .wp-block-group.alignfull:first-of-type,
.page-id-5 > .ast-container > .entry-content > .wp-block-group.alignfull:first-child {
    background: radial-gradient(circle at top left, #4f46e5 0%, #6366f1 40%, #0ea5e9 100%) !important;
    border-radius: 32px !important;
    padding: 4rem 3rem !important;
    margin: 2rem auto !important;
    max-width: calc(100% - 4rem) !important;
    box-shadow: 0 32px 80px rgba(15, 23, 42, 0.35) !important;
    overflow: visible !important;
    position: relative !important;
}

/* Hero text - ensure legibility on gradient background */
.wherepdf-hero h1,
.wherepdf-hero h2,
.wherepdf-hero p:not(.has-background):not(.has-text-color),
.wherepdf-hero .wp-block-heading,
.wherepdf-hero li,
.page-id-5 .wp-block-group.alignfull:first-of-type > .wp-block-columns h1,
.page-id-5 .wp-block-group.alignfull:first-of-type > .wp-block-columns h2,
.page-id-5 .wp-block-group.alignfull:first-of-type > .wp-block-columns > .wp-block-column:first-child p:not(.has-background),
.page-id-5 .wp-block-group.alignfull:first-of-type > .wp-block-columns > .wp-block-column:first-child li {
    color: #ffffff !important;
}

/* Keep inner cards/containers white for contrast - right column mock UI */
.wherepdf-hero .wp-block-column:last-child .wp-block-group.has-background,
.wherepdf-hero .has-white-background-color,
.page-id-5 .wp-block-group.alignfull:first-of-type .wp-block-column:last-child .wp-block-group[style*="background-color:#ffffff"] {
    background-color: #ffffff !important;
    color: #1e293b !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25) !important;
}

/* Ensure text inside white card stays dark */
.wherepdf-hero .wp-block-column:last-child .wp-block-group.has-background *,
.page-id-5 .wp-block-group.alignfull:first-of-type .wp-block-column:last-child .wp-block-group * {
    color: inherit !important;
}

/* Alternating section backgrounds with subtle gradients */
.wp-block-group.has-background[style*="#f5f6fb"],
.has-pale-cyan-blue-background-color {
    background: linear-gradient(135deg, #f3f4ff 0%, #eef2ff 40%, #ffffff 100%) !important;
}

.wp-block-group.has-white-background-color {
    background: linear-gradient(to bottom, #ffffff 0%, #f9fafb 30%, #ffffff 100%) !important;
}

/* ============================================
   3. ANIMATIONS & HOVER EFFECTS
   ============================================ */

/* Card hover effects - feature cards, use case cards, pricing cards */
.wherepdf-feature-card,
.pricing-card,
.pricing-card-featured,
.wp-block-group.has-background.has-white-background-color[style*="border-radius"],
.wp-block-column > .wp-block-group.has-background,
.wp-block-columns .wp-block-column > .wp-block-group[style*="border-radius"] {
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease !important;
    will-change: transform, box-shadow;
    cursor: pointer;
}

.wherepdf-feature-card:hover,
.pricing-card:hover,
.pricing-card-featured:hover,
.wp-block-group.has-background.has-white-background-color[style*="border-radius"]:hover,
.wp-block-column > .wp-block-group.has-background:hover,
.wp-block-columns .wp-block-column > .wp-block-group[style*="border-radius"]:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.20) !important;
}

/* Button hover effects - primary CTAs */
.wp-block-button__link,
.wp-block-button .wp-block-button__link,
.wp-element-button,
a.wp-block-button__link {
    transition: background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease, border-color 180ms ease !important;
    will-change: transform, box-shadow;
}

/* Primary blue buttons */
.wp-block-button__link[style*="#627ae6"],
.wp-block-button__link[style*="rgb(98, 122, 230)"],
.has-vivid-cyan-blue-background-color {
    position: relative;
}

.wp-block-button__link[style*="#627ae6"]:hover,
.wp-block-button__link[style*="rgb(98, 122, 230)"]:hover,
.has-vivid-cyan-blue-background-color:hover {
    background-color: #4f46e5 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 16px 40px rgba(37, 99, 235, 0.45) !important;
}

/* White/outline buttons */
.wp-block-button__link.has-white-background-color:hover,
.wp-block-button__link[style*="background-color:#ffffff"]:hover,
.wp-block-button__link[style*="background-color: rgb(255, 255, 255)"]:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.15) !important;
    border-color: #627ae6 !important;
}

/* Feature icons - enhanced glow and polish */
.wherepdf-feature-icon {
    width: 56px !important;
    height: 56px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%) !important;
    border: 2px solid #bae6fd !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15), inset 0 1px 3px rgba(255, 255, 255, 0.8) !important;
    transition: transform 200ms ease, box-shadow 200ms ease !important;
    margin: 0 auto 1rem auto !important;
}

.wherepdf-feature-icon:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25), inset 0 1px 3px rgba(255, 255, 255, 0.9) !important;
}

/* Icon emoji styling */
.wherepdf-feature-icon span {
    font-size: 24px !important;
    line-height: 1 !important;
}

/* ============================================
   4. SUBTLE SCROLL/FADE ANIMATIONS
   ============================================ */

/* Fade-in animation for sections */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Initial state for elements waiting to animate */
.wherepdf-animate-wait {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* Animated-in state */
.wherepdf-animate-in {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* Fallback CSS animations for non-JS scenarios */
.page-id-5 .wp-block-group:not(.wherepdf-hero):not(:first-of-type) {
    animation: fadeInUp 0.8s ease-out;
    animation-fill-mode: both;
}

.page-id-5 .wp-block-group:nth-of-type(2) {
    animation-delay: 0.1s;
}

.page-id-5 .wp-block-group:nth-of-type(3) {
    animation-delay: 0.2s;
}

.page-id-5 .wp-block-group:nth-of-type(4) {
    animation-delay: 0.3s;
}

.page-id-5 .wp-block-group:nth-of-type(5) {
    animation-delay: 0.4s;
}

.wp-block-columns .wp-block-column {
    animation: fadeInUp 0.6s ease-out;
    animation-fill-mode: both;
}

.wp-block-columns .wp-block-column:nth-child(1) {
    animation-delay: 0.1s;
}

.wp-block-columns .wp-block-column:nth-child(2) {
    animation-delay: 0.2s;
}

.wp-block-columns .wp-block-column:nth-child(3) {
    animation-delay: 0.3s;
}

/* Button ripple effect */
.wp-block-button__link,
.wp-element-button {
    position: relative;
    overflow: hidden;
}

@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 0.6;
    }
    100% {
        transform: scale(4);
        opacity: 0;
    }
}

.wherepdf-ripple {
    position: absolute;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.6);
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    animation: ripple 600ms ease-out;
    pointer-events: none;
}

/* ============================================
   5. RESPONSIVE ADJUSTMENTS
   ============================================ */

@media (max-width: 768px) {
    .wherepdf-hero,
    .page-id-5 .wp-block-group.alignfull:first-of-type {
        border-radius: 20px !important;
        padding: 2.5rem 1.5rem !important;
        margin: 1rem !important;
        max-width: calc(100% - 2rem) !important;
    }

    .wherepdf-feature-icon {
        width: 48px !important;
        height: 48px !important;
    }

    .wherepdf-feature-icon span {
        font-size: 20px !important;
    }
}

@media (max-width: 480px) {
    .wherepdf-hero,
    .page-id-5 .wp-block-group.alignfull:first-of-type {
        border-radius: 16px !important;
        padding: 2rem 1.25rem !important;
    }
}

/* ============================================
   6. ADDITIONAL POLISH
   ============================================ */

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Enhanced focus states for accessibility */
.wp-block-button__link:focus,
.wp-element-button:focus {
    outline: 3px solid #627ae6 !important;
    outline-offset: 3px !important;
}

/* Pricing card featured state enhancement */
.pricing-card-featured {
    border: 2px solid #627ae6 !important;
    box-shadow: 0 16px 48px rgba(98, 122, 230, 0.25) !important;
}

.pricing-card-featured:hover {
    box-shadow: 0 24px 60px rgba(98, 122, 230, 0.35) !important;
}

/* Content section spacing consistency */
.wp-block-group.alignfull {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
}

@media (min-width: 769px) {
    .wp-block-group.alignfull {
        padding-top: 5rem !important;
        padding-bottom: 5rem !important;
    }
}

/* Improve text readability on colored backgrounds */
.has-background p,
.has-background h1,
.has-background h2,
.has-background h3,
.has-background h4,
.has-background h5,
.has-background h6 {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* Loading performance - reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .wherepdf-feature-card:hover,
    .pricing-card:hover,
    .wp-block-button__link:hover {
        transform: none !important;
    }
}