/*
Theme Name: Astra Child - The Fotoshop
Template: astra
Version: 1.1
*/

/* === THE FOTOSHOP — Black & White Elegant === */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=Lato:wght@300;400&display=swap');

/* === GLOBAL === */
body { font-family: 'Lato', sans-serif !important; font-weight: 300; color: #333; }
h1, h2, h3, h4, h5, h6 { font-family: 'Playfair Display', serif !important; font-weight: 400; color: #000; }

/* === HEADER === */
.ast-main-header-wrap .main-header-bar,
.site-primary-header-wrap,
.main-header-bar-wrap { background-color: #000 !important; }
.main-header-menu .menu-link,
.ast-header-break-point .main-header-menu .menu-link { color: #fff !important; font-family: 'Playfair Display', serif !important; text-transform: uppercase; letter-spacing: 0.15em; font-size: 13px !important; }
.main-header-menu .menu-link:hover { opacity: 0.7; }
.site-title, .site-title a { color: #fff !important; font-family: 'Playfair Display', serif !important; letter-spacing: 0.1em; }

/* === HERO SECTION === */
.hero-section { background: #000; color: #fff; padding: 100px 20px 60px; text-align: center; }
.hero-section h1 { color: #fff !important; font-size: 2.8rem; letter-spacing: 0.08em; margin-bottom: 15px; line-height: 1.3; }
.hero-section p { font-family: 'Lato', sans-serif; font-weight: 300; font-size: 1.1rem; color: #ccc; max-width: 600px; margin: 0 auto; letter-spacing: 0.05em; }

/* === PORTFOLIO GRID === */
.portfolio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; max-width: 1200px; margin: 0 auto; padding: 0 10px; }
.portfolio-item { position: relative; overflow: hidden; aspect-ratio: 4/3; background: #111; }
.portfolio-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease, filter 0.6s ease; }
.portfolio-item:hover img { transform: scale(1.08); filter: brightness(0.5); }
.portfolio-item .overlay { position: absolute; bottom: 0; left: 0; right: 0; top: 0; display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.4s; }
.portfolio-item:hover .overlay { opacity: 1; }
.portfolio-item .overlay h3 { color: #fff; font-size: 1.3rem; margin: 0; letter-spacing: 0.15em; text-transform: uppercase; text-align: center; }

/* === DIVIDER === */
.elegant-divider { width: 60px; height: 1px; background: #000; margin: 40px auto; }

/* === FOOTER === */
.site-footer, .ast-footer-bg { background-color: #000 !important; }
footer .widget-title { color: #fff !important; font-family: 'Playfair Display', serif; text-transform: uppercase; letter-spacing: 0.1em; }
footer, footer .widget, footer p, footer span { color: #999 !important; }
footer a { color: #999 !important; transition: color 0.3s; }
footer a:hover { color: #fff !important; }

/* === BUTTONS === */
.tf-btn { display: inline-block; background-color: #000; color: #fff; border: 1px solid #fff; font-family: 'Playfair Display', serif; text-transform: uppercase; letter-spacing: 0.15em; padding: 14px 36px; text-decoration: none; transition: all 0.3s; font-size: 14px; }
.tf-btn:hover { background-color: #fff; color: #000; border-color: #000; }

/* === AWARDS BAR === */
.awards-bar { text-align: center; padding: 60px 20px; background: #fafafa; }
.awards-bar h3 { font-size: 1.5rem; letter-spacing: 0.1em; margin-bottom: 10px; }
.awards-bar p { color: #666; letter-spacing: 0.05em; }

/* === BLOG === */
.entry-title { font-family: 'Playfair Display', serif !important; }
.entry-title a { color: #000; text-decoration: none; }
.entry-title a:hover { color: #666; }

/* === RESPONSIVE === */
@media (max-width: 768px) {
    .hero-section h1 { font-size: 1.8rem; }
    .hero-section { padding: 60px 15px 40px; }
    .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
    .portfolio-grid { grid-template-columns: 1fr; }
}