/*
Theme Name: Astra Child with Carousel
Description: Child theme of Astra with custom portfolio carousel functionality
Author: Your Name
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

/* Import parent theme styles */
@import url("../astra/style.css");

/* ===================================
   GOTHAM TYPOGRAPHY STYLES
   Add this to your child theme's style.css
   =================================== */

/* Base Typography */
body {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    line-height: 1.6;
    color: #333;
}

/* Header Styles */
h1, h2, h3, h4, h5, h6 {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
    
}
/* White H1 headings only on project pages */
.single-project h1,
.single-project .site-content h1,
.single-project .entry-content h1 {
    color: white !important;
}

/* Default H1 color for all other pages */
body:not(.single-project) h1,
body:not(.single-project) .site-content h1,
body:not(.single-project) .entry-content h1 {
    color: #1E242A !important;
}

/* Homepage H1 with Sail font - 100px */
.home h1.homepage-hero-title,
body.home h1.homepage-hero-title,
.page-template-default.home h1.homepage-hero-title {
    font-family: 'Sail', cursive !important;
    font-size: 100px !important;
    font-weight: 400 !important; /* Sail font typically looks better at normal weight */
    line-height: 1.1 !important;
    color: #1E242A !important;
    margin-bottom: 20px !important; /* Reduced from default spacing */
}

/* No margin version of homepage hero title */
.home h1.homepage-hero-title.no-margin,
body.home h1.homepage-hero-title.no-margin {
    margin-bottom: 0 !important;
}

/* Tight spacing version */
.home h1.homepage-hero-title.tight-spacing,
body.home h1.homepage-hero-title.tight-spacing {
    margin-bottom: 10px !important;
}

/* Force remove spacing after any H1 with homepage-hero-title class */
.homepage-hero-title,
h1.homepage-hero-title {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Remove top margin/padding from the next element after homepage hero */
.homepage-hero-title + *,
h1.homepage-hero-title + *,
.wp-block-group:has(.homepage-hero-title) + * {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Specific fix for WordPress block spacing */
.home .wp-block-heading.homepage-hero-title {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.home .wp-block-heading.homepage-hero-title + .wp-block-paragraph,
.home h1.homepage-hero-title + p {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Compact paragraph with tight line height */
p.compact,
.compact-text {
    line-height: 1.3 !important;
    margin-bottom: 1rem !important;
}

/* Extra tight line height for multi-line paragraphs */
p.tight-lines,
.tight-lines {
    line-height: 1.2 !important;
    margin-bottom: 1rem !important;
}

/* Very tight line height - use carefully */
p.very-tight,
.very-tight {
    line-height: 1.1 !important;
    margin-bottom: 0.75rem !important;
}

/* Two-line paragraph with no gap between lines */
.two-line-text {
    line-height: 1.3 !important;
    margin-bottom: 1rem !important;
}

.two-line-text br {
    line-height: 0.8 !important;
    display: block;
    content: "";
    margin: -0.5em 0;
}

/* Class to add to paragraph that comes after hero title */
.after-hero {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Alternative - add negative margin to pull it up */
.pull-up {
    margin-top: -30px !important;
}

.pull-up-more {
    margin-top: -50px !important;
}
/* Dark text for everything else */
h2, h3, h5, h6,
.site-content h2, .site-content h3, .site-content h4, .site-content h5, .site-content h6,
.entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6 {
    color: #2c3e50 !important;
}

p,
.site-content p,
.entry-content p,
body p {
    color: #555 !important;
}

h1 {
    font-size: 3.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 1.5rem;
	line-height: 1.0 !important;
}
h1 br {
    line-height: 0.1 !important;
    display: block;
    margin: -0.5em 0;
}

h2 {
    font-size: 2.5rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 1.25rem;

}

h3 {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 1rem;
	
}

h4 {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 0.875rem;
	
}

h5 {
    font-size: 1.25rem;
    font-weight: 500;
    margin-bottom: 0.75rem;

}

h6 {
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
	
}

/* Paragraph Styles */
p {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.7;
    margin-bottom: 1.5rem;
    color: #555;
}

/* Large paragraph (intro text) */
p.lead {
    font-size: 1.25rem;
    font-weight: 300;
    line-height: 1.6;
    color: #666;
    margin-bottom: 2rem;
}

/* Small paragraph */
p.small {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #777;
    margin-bottom: 1rem;
}

/* Responsive Typography */
@media (max-width: 768px) {
    h1 {
        font-size: 2.5rem;
    }
    
    h2 {
        font-size: 2rem;
    }
    
    h3 {
        font-size: 1.75rem;
    }
    
    h4 {
        font-size: 1.25rem;
    }
    
    p {
        font-size: 1rem;
    }
    
    p.lead {
        font-size: 1.125rem;
    }
}

@media (max-width: 480px) {
    h1 {
        font-size: 2rem;
    }
    
    h2 {
        font-size: 1.75rem;
    }
    
    h3 {
        font-size: 1.5rem;
    }
}

/* Special Text Styles */
.text-light {
    font-weight: 300 !important;
}

.text-normal {
    font-weight: 400 !important;
}

.text-medium {
    font-weight: 500 !important;
}

.text-bold {
    font-weight: 700 !important;
}

.text-black {
    font-weight: 800 !important;
}

/* Color Variations */
.text-primary {
    color: #2c5282 !important;
}

.text-secondary {
    color: #666 !important;
}

.text-muted {
    color: #888 !important;
}

.text-white {
    color: white !important;
}

/* Text Sizes */
.text-xs {
    font-size: 0.75rem !important;
}

.text-sm {
    font-size: 0.875rem !important;
}

.text-base {
    font-size: 1rem !important;
}

.text-lg {
    font-size: 1.125rem !important;
}

.text-xl {
    font-size: 1.25rem !important;
}

.text-2xl {
    font-size: 1.5rem !important;
}

.text-3xl {
    font-size: 1.875rem !important;
}

/* Links */
a {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    color: #2c5282;
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: #1a365d;
    text-decoration: underline;
}

/* Buttons */
button, .button, .btn {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-weight: 500;
    letter-spacing: 0.025em;
}

/* Form Elements */
input, textarea, select {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Lists */
ul, ol {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    line-height: 1.7;
    color: #555;
}

/* Blockquotes */
blockquote {
    font-family: 'gotham', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 1.25rem;
    font-weight: 300;
    font-style: italic;
    line-height: 1.6;
    color: #666;
    border-left: 4px solid #2c5282;
    padding-left: 1.5rem;
    margin: 2rem 0;
}
/* Make the blue hero section a flex container */
.hero-section,
.wp-block-cover,
.blue-section {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;
    padding-bottom: 40px !important;
}

/* Position the heading at the bottom */
.hero-section h1,
.wp-block-cover h1 {
    margin-top: auto !important;
    margin-bottom: 0 !important;
}
.hero-cover {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    margin-top: -100px !important; /* Adjust based on your nav height */
    padding-top: 150px !important; /* Add padding to account for nav */
}
.hero-cover-home {
    width: 100vw !important;
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    margin-top: 100px !important; /* Adjust based on your nav height */
    padding-top: 150px !important; /* Add padding to account for nav */
}
.client-logo {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
	width: 230px;
}

/* ===================================
   LOGO SWITCHING STYLES
   =================================== */

/* Ensure logo is visible and properly styled on all pages */
.site-header .custom-logo-link,
.site-header .ast-logo-title-inline,
header .custom-logo,
.ast-site-identity .custom-logo {
    opacity: 1 !important;
}

/* Optional: Add specific styling for the white logo on project pages */
.single-project .white-logo {
    /* Add any specific styling for the white logo here if needed */
}

/* Ensure proper logo sizing */
.custom-logo,
.ast-logo-title-inline .ast-site-logo-img img,
.ast-logo img {
    max-height: 50px; /* Adjust as needed */
    width: auto;
    height: auto;
}