/* Artscape by Anisha - Joomla Template CSS *//* Reset and Base Styles */* {margin: 0;padding: 0;box-sizing: border-box;}body {font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;line-height: 1.6;color: #1f2937;background: linear-gradient(135deg, #fdf2f8 0%, #f3e8ff 50%, #eff6ff 100%);min-height: 100vh;}.container {max-width: 1200px;margin: 0 auto;padding: 0 1.5rem;}/* Typography */h1, h2, h3, h4, h5, h6 {font-weight: 600;line-height: 1.2;margin-bottom: 1rem;}h1 {font-size: 3.5rem;font-weight: 700;}h2 {font-size: 2.5rem;}h3 {font-size: 1.875rem;}p {margin-bottom: 1rem;color: #4b5563;}/* Gradients */.gradient-pink {background: linear-gradient(135deg, #ec4899 0%, #be185d 100%);}.gradient-purple {background: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);}.gradient-blue {background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);}.gradient-indigo {background: linear-gradient(135deg, #6366f1 0%, #4338ca 100%);}.gradient-pink-purple {background: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);}.gradient-blue-indigo {background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);}.gradient-orange {background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);}.gradient-yellow-orange {background: linear-gradient(135deg, #eab308 0%, #f97316 100%);}/* Buttons */.btn {display: inline-flex;align-items: center;padding: 0.75rem 1.5rem;border: none;border-radius: 0.5rem;font-weight: 500;text-decoration: none;cursor: pointer;transition: all 0.3s ease;font-size: 1rem;}.btn i {margin-right: 0.5rem;}.btn-primary {background: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);color: white;}.btn-primary:hover {background: linear-gradient(135deg, #be185d 0%, #7c3aed 100%);transform: translateY(-2px);}.btn-outline {border: 2px solid #a855f7;color: #a855f7;background: transparent;}.btn-outline:hover {background: #a855f7;color: white;}.btn-sm {padding: 0.5rem 1rem;font-size: 0.875rem;}.btn-full {width: 100%;justify-content: center;}/* Navigation */.artscape-nav {position: fixed;top: 0;left: 0;right: 0;z-index: 1000;background: rgba(255, 255, 255, 0.8);backdrop-filter: blur(12px);border-bottom: 1px solid rgba(167, 139, 250, 0.2);padding: 1rem 0;height: 80px;}.nav-content {display: flex;align-items: center;justify-content: space-between;}.nav-brand a {font-size: 1.5rem;font-weight: 700;background: linear-gradient(135deg, #ec4899 0%, #a855f7 50%, #3b82f6 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;text-decoration: none;}.nav-menu {display: flex;align-items: center;gap: 2rem;}.nav-links {display: flex;list-style: none;gap: 2rem;margin: 0;padding: 0;}.nav-links a {color: #4b5563;text-decoration: none;font-weight: 500;transition: color 0.3s ease;}.nav-links a:hover {color: #a855f7;}.desktop-cart {display: block;}.mobile-menu-toggle span {width: 25px;height: 3px;background: #a855f7;transition: all 0.3s ease;border-radius: 2px;}.mobile-menu-toggle.active span:nth-child(1) {transform: rotate(45deg) translate(5px, 5px);}.mobile-menu-toggle.active span:nth-child(2) {opacity: 0;}.mobile-menu-toggle.active span:nth-child(3) {transform: rotate(-45deg) translate(7px, -6px);}/* Hero Section *//* Navigation Logo *//* Hero Logo Styles - ADD THIS */.hero-logo {text-align: center;margin-bottom: 1rem;}.hero-logo-image {max-width: 180px;height: auto;border-radius: 1rem;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease;}.hero-logo-image:hover {transform: scale(1.05);}/* Responsive hero logo sizing */@media (max-width: 768px) {.hero-logo-image {max-width: 120px;}}@media (max-width: 480px) {.hero-logo-image {max-width: 100px;}}/* Fix Navigation Logo - UPDATE YOUR EXISTING CSS */.nav-logo {height: 40px; /* Changed from 5px */width: auto;border-radius: 0.25rem;}@media (max-width: 768px) {.nav-logo {height: 35px; /* Changed from 3px */}}.hero-section {padding: 2rem 0 2rem;text-align: center;margin-top: 60px;}.hero-title {font-size: 4rem;font-weight: 700;margin-bottom: 1.5rem;background: linear-gradient(135deg, #ec4899 0%, #a855f7 50%, #3b82f6 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;}.hero-subtitle {font-size: 0.9rem;color: #4b5563;margin-bottom: 2rem;max-width: 800px;margin-left: auto;margin-right: auto;}.hero-buttons {display: flex;gap: 1rem;justify-content: center;flex-wrap: wrap;}.featured-art {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1.5rem;max-width: 1000px;margin: 0 auto;}.art-card {background: white;border-radius: 0.75rem;overflow: hidden;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease;cursor: pointer;}.art-card:hover {transform: translateY(-5px);}.art-image {height: 200px;position: relative;overflow: hidden;}.art-image::after {content: '';position: absolute;inset: 0;background: rgba(0, 0, 0, 0.2);transition: background 0.3s ease;}.art-card:hover .art-image::after {background: rgba(0, 0, 0, 0.1);}.art-info {padding: 1rem;}.art-info h3 {font-size: 1.125rem;margin-bottom: 0.5rem;}.art-category {display: inline-block;background: rgba(167, 139, 250, 0.1);color: #7c3aed;padding: 0.25rem 0.75rem;border-radius: 1rem;font-size: 0.875rem;font-weight: 500;}/* Portfolio Section */.portfolio-section {padding: 1rem 0;background: linear-gradient(135deg, #f3e8ff 0%, #eff6ff 100%);}.section-title {text-align: center;margin-bottom: 1rem;background: linear-gradient(135deg, #ec4899 0%, #3b82f6 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;}.portfolio-tabs {display: flex;justify-content: center;margin-bottom: 3rem;background: white;border-radius: 0.5rem;padding: 0.25rem;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}.tab-btn {display: flex;align-items: center;gap: 0.5rem;padding: 0.75rem 1.5rem;background: transparent;border: none;border-radius: 0.375rem;font-weight: 500;cursor: pointer;transition: all 0.3s ease;color: #6b7280;}.tab-btn.active {background: rgba(167, 139, 250, 0.1);color: #7c3aed;}.tab-btn:hover {background: rgba(167, 139, 250, 0.05);color: #7c3aed;}.tab-content {display: none;}.tab-content.active {display: block;}.portfolio-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 1.5rem;}.portfolio-item {background: white;border-radius: 0.75rem;overflow: hidden;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);transition: transform 0.3s ease;}.portfolio-item:hover {transform: translateY(-5px);}.portfolio-image {height: 16rem;position: relative;overflow: hidden;}.portfolio-image::after {content: '';position: absolute;inset: 0;background: rgba(0, 0, 0, 0.2);opacity: 0;transition: opacity 0.3s ease;}.portfolio-item:hover .portfolio-image::after {opacity: 1;}.portfolio-info {padding: 1rem;}.portfolio-info h3 {font-size: 1.125rem;margin-bottom: 0.25rem;}.portfolio-info p {color: #6b7280;font-size: 0.875rem;}/* Instagram Section */.instagram-section {padding: 1rem 0;background: white;}.instagram-header {text-align: center;margin-bottom: 3rem;}.instagram-header h2 {background: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;margin-bottom: 1rem;}.instagram-header p {font-size: 1.125rem;color: #6b7280;margin-bottom: 1.5rem;}.instagram-handle {display: inline-flex;align-items: center;gap: 0.5rem;border: 2px solid rgba(236, 72, 153, 0.3);color: #ec4899;padding: 0.75rem 1.5rem;border-radius: 0.5rem;text-decoration: none;font-weight: 500;transition: all 0.3s ease;}.instagram-handle:hover {background: rgba(236, 72, 153, 0.05);}.instagram-grid {display: grid;grid-template-columns: repeat(6, 1fr);gap: 1rem;margin-bottom: 2rem;}/* This rule creates the rectangular container */.instagram-item {display: flex;justify-content: center;align-items: center;border-radius: 0.5rem;background: white;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);/* The aspect-ratio property is correctly removed */}/* This rule now SHRINKS the embed inside its container */.instagram-item .instagram-media {margin: 0 !important;width: 100% !important;transform: scale(1); /* Shrinks the embed to 80% of its container size */transform-origin: center center;}.instagram-item {background: white;border-radius: 0.5rem;overflow: hidden;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease;}.instagram-item:hover {transform: translateY(-2px);}.instagram-item:hover {color: #a855f7;}.instagram-footer {text-align: center;}/* Community Section */.community-section {padding: 1rem 0;background: white;}.community-content {max-width: 1000px;margin: 0 auto;text-align: center;}.community-content h2 {background: linear-gradient(135deg, #ec4899 0%, #3b82f6 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;margin-bottom: 1.5rem;}.community-content > p {font-size: 1.125rem;color: #6b7280;margin-bottom: 1rem;line-height: 1.7;}.community-features {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 0rem;margin-bottom: 0rem;}.feature-item {text-align: center;}.feature-icon {width: 4rem;height: 4rem;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin: 0 auto 1rem;font-size: 2rem;color: white;}.feature-icon.pink {background: linear-gradient(135deg, #ec4899 0%, #be185d 100%);}.feature-icon.purple {background: linear-gradient(135deg, #a855f7 0%, #7c3aed 100%);}.feature-icon.blue {background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);}.feature-item h3 {font-size: 1.25rem;margin-bottom: 0.5rem;}.feature-item p {color: #6b7280;}.newsletter-signup {max-width: 400px;margin: 0 auto;}.newsletter-form {display: flex;gap: 0.75rem;margin-bottom: 0.75rem;}.newsletter-form input[type="email"] {flex: 1;padding: 0.75rem 1rem;border: 2px solid rgba(167, 139, 250, 0.2);border-radius: 0.375rem;font-size: 1rem;outline: none;transition: border-color 0.3s ease;}.newsletter-form input[type="email"]:focus {border-color: #a855f7;}.newsletter-disclaimer {font-size: 0.875rem;color: #6b7280;}/* Contact Section */.contact-section {padding: 1rem 0;background: linear-gradient(135deg, #f3e8ff 0%, #eff6ff 100%);}.contact-header {text-align: center;margin-bottom: 3rem;}.contact-header h2 {background: linear-gradient(135deg, #a855f7 0%, #3b82f6 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;margin-bottom: 0rem;}.contact-header p {font-size: 1.125rem;color: #6b7280;}.contact-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 3rem;max-width: 1000px;margin: 0 auto;}.contact-info h3 {font-size: 1.5rem;margin-bottom: 1.5rem;}.contact-methods {margin-bottom: 0rem;}.contact-item {display: flex;align-items: center;gap: 1rem;margin-bottom: 1.5rem;}.contact-item i {font-size: 1.5rem;color: #a855f7;}.contact-label {font-weight: 500;color: #1f2937;}.contact-value {color: #6b7280;}.social-section h4 {font-size: 1.125rem;margin-bottom: 1rem;}/* Reviews Section */.reviews-section {padding: 2rem 0;background: linear-gradient(135deg, #f3e8ff 0%, #fdf2f8 100%);}.reviews-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));gap: 2rem;margin-bottom: 3rem;}.review-card {background: white;border-radius: 0.75rem;padding: 2rem;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease, box-shadow 0.3s ease;border: 0;}.review-card:hover {transform: translateY(-5px);box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);}.review-stars {display: flex;align-items: center;gap: 0.25rem;margin-bottom: 1rem;}.review-stars i {color: #fbbf24;font-size: 1.25rem;}.rating-number {margin-left: 0.75rem;font-weight: 600;color: #4b5563;}.review-text {font-style: italic;color: #4b5563;line-height: 1.6;margin-bottom: 1.5rem;font-size: 1rem;}.review-footer {border-top: 1px solid #e5e7eb;padding-top: 1rem;display: flex;justify-content: space-between;align-items: flex-start;flex-wrap: wrap;gap: 1rem;}.reviewer-info {flex: 1;}.reviewer-name {font-weight: 600;color: #1f2937;margin-bottom: 0.25rem;}.reviewer-location {display: flex;align-items: center;gap: 0.25rem;color: #6b7280;font-size: 0.875rem;}.reviewer-location i {color: #a855f7;font-size: 0.75rem;}.purchase-info {text-align: right;flex-shrink: 0;}.purchase-label {font-size: 0.75rem;color: #a855f7;font-weight: 500;margin-bottom: 0.125rem;}.purchase-item {font-size: 0.75rem;color: #6b7280;line-height: 1.2;}.reviews-summary {text-align: center;}.overall-rating {display: inline-flex;align-items: center;gap: 1rem;background: white;padding: 1rem 2rem;border-radius: 2rem;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}.rating-stars {display: flex;gap: 0.25rem;}.rating-stars i {color: #fbbf24;font-size: 1.25rem;}.rating-score {font-size: 1.125rem;font-weight: 700;color: #1f2937;}.rating-count {color: #6b7280;font-size: 0.875rem;}/* Footer */.artscape-footer {background: #1f2937;color: white;padding: 1rem 0 1.5rem;}.footer-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 0rem;margin-bottom: 1rem;}.footer-brand h3 {background: linear-gradient(135deg, #ec4899 0%, #a855f7 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;margin-bottom: 1rem;}.footer-brand p {color: #9ca3af;line-height: 1.6;}.footer-links h4,.footer-categories h4,.footer-newsletter h4 {font-size: 1.125rem;margin-bottom: 1rem;}.footer-links ul,.footer-categories ul {list-style: none;}.footer-links a,.footer-categories a {color: #9ca3af;text-decoration: none;transition: color 0.3s ease;line-height: 1.8;}.footer-links a:hover,.footer-categories a:hover {color: #a855f7;}.footer-newsletter p {color: #9ca3af;margin-bottom: 1rem;}.footer-newsletter-form {display: flex;gap: 0.5rem;}.footer-newsletter-form input {flex: 1;padding: 0.5rem 0.75rem;border: 1px solid #4b5563;border-radius: 0.375rem;background: #374151;color: white;outline: none;}.footer-newsletter-form input:focus {border-color: #a855f7;}.footer-bottom {text-align: center;padding-top: 2rem;border-top: 1px solid #374151;}.footer-bottom p {color: #9ca3af;}/* Forms */input, textarea, select {font-family: inherit;}input[type="email"],input[type="text"],textarea {width: 100%;}/* Responsive Design */@media (max-width: 768px) {/* Hide desktop navigation */.nav-links {display: none;}.desktop-cart {display: none !important;}/* Show mobile toggle button *//* --- Mobile Menu Visibility --- *//* On Desktop screens (larger than 768px), HIDE the hamburger button */.mobile-menu-toggle {display: none;}/* On Mobile screens (768px and smaller), SHOW the hamburger and HIDE the desktop menu */@media (max-width: 768px) {.nav-menu {display: none; /* Hide the main menu container */}.mobile-menu-toggle {display: flex; /* Show the hamburger button */}/* This rule makes the menu appear when the 'active' class is added by JavaScript */.nav-menu.active {display: flex;}}.mobile-menu-toggle span {width: 25px;height: 3px;background: #a855f7;transition: all 0.3s ease;border-radius: 2px;display: block;}/* Mobile menu container */.nav-menu {position: fixed;top: 80px;left: 0;right: 0;background: white;flex-direction: column;padding: 2rem;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);z-index: 1001;transform: translateY(-100%);transition: transform 0.3s ease;display: none;width: 100%;}/* Show mobile menu when active */.nav-menu.active {transform: translateY(0);display: flex !important;}.nav-menu.active .nav-links {display: flex !important;flex-direction: column;gap: 1rem;margin-bottom: 1rem;width: 100%;}.nav-menu.active .nav-links li {width: 100%;}.nav-menu.active .nav-links a {display: block;padding: 1rem 0;text-align: center;border-bottom: 1px solid #e5e7eb;font-size: 1.1rem;}/* Mobile cart */.mobile-cart {display: block !important;width: 100%;text-align: center;margin-top: 1rem;}/* Hamburger animation */.mobile-menu-toggle.active span:nth-child(1) {transform: rotate(45deg) translate(5px, 5px);}.mobile-menu-toggle.active span:nth-child(2) {opacity: 0;}.mobile-menu-toggle.active span:nth-child(3) {transform: rotate(-45deg) translate(7px, -6px);}/* Keep existing responsive styles */.hero-title {font-size: 2.5rem;}.hero-buttons {flex-direction: column;align-items: center;}.featured-art {grid-template-columns: repeat(2, 1fr);}.about-grid {grid-template-columns: 1fr;gap: 2rem;}.contact-grid {grid-template-columns: 1fr;gap: 2rem;}.form-row {grid-template-columns: 1fr;}.newsletter-form {flex-direction: column;}.footer-newsletter-form {flex-direction: column;}.reviews-grid {grid-template-columns: 1fr;gap: 1.5rem;}h1 {font-size: 2.5rem;}h2 {font-size: 2rem;}.container {padding: 0 1rem;}}@media (max-width: 480px) {.featured-art {grid-template-columns: 1fr;}.instagram-grid {grid-template-columns: repeat(2, 1fr);}.hero-title {font-size: 2rem;}.portfolio-tabs {flex-direction: column;}/* Reviews mobile */.reviews-grid {grid-template-columns: 1fr;gap: 1rem;}.review-card {padding: 1.5rem;}.overall-rating {padding: 1rem;}.rating-stars i {font-size: 1rem;}}/* Fix for elements disappearing - OVERRIDE ALL ANIMATIONS */.art-card,.portfolio-item,.product-card,.blog-card,.feature-item,.review-card {opacity: 1 !important;transform: none !important;visibility: visible !important;display: block !important;animation: none !important;}/* Ensure all sections are visible */.portfolio-section,.shop-section,.blog-section,.instagram-section,.reviews-section,.community-section,.contact-section {display: block !important;visibility: visible !important;}/* Fix portfolio tabs */.tab-content {display: none;}.tab-content.active {display: block !important;opacity: 1 !important;}/* Animation and Transitions */@keyframes fadeInUp {from {opacity: 0;transform: translateY(30px);}to {opacity: 1;transform: translateY(0);}}/* Utility Classes */.text-center {text-align: center;}.text-left {text-align: left;}.text-right {text-align: right;}.mb-0 {margin-bottom: 0;}.mb-1 {margin-bottom: 0.25rem;}.mb-2 {margin-bottom: 0.5rem;}.mb-3 {margin-bottom: 0.75rem;}.mb-4 {margin-bottom: 1rem;}.mt-0 {margin-top: 0;}.mt-1 {margin-top: 0.25rem;}.mt-2 {margin-top: 0.5rem;}.mt-3 {margin-top: 0.75rem;}.mt-4 {margin-top: 1rem;}/* Loading States */.loading {opacity: 0.6;pointer-events: none;}.loading::after {content: '';position: absolute;top: 50%;left: 50%;width: 20px;height: 20px;margin: -10px 0 0 -10px;border: 2px solid #a855f7;border-radius: 50%;border-top-color: transparent;animation: spin 1s linear infinite;}@keyframes spin {to {transform: rotate(360deg);}}/* Form Messages */.form-message {padding: 1rem;border-radius: 0.5rem;margin-top: 1rem;display: flex;align-items: center;gap: 0.5rem;font-weight: 500;}.form-message.success {background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);color: #065f46;border: 1px solid #10b981;}.form-message.error {background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);color: #991b1b;border: 1px solid #ef4444;}.form-message i {font-size: 1.125rem;}/* Leave a Review Section */.leave-review-section {padding: 0rem 0;background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);}.review-form-card {background: white;padding: 2rem;border-radius: 0.75rem;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);max-width: 600px;margin: 0 auto;text-align: center;}.review-form-card h3 {color: #1f2937;margin-bottom: 0.5rem;}.review-form-card p {color: #6b7280;margin-bottom: 2rem;}.review-form {display: flex;flex-direction: column;gap: 1rem;text-align: left;}.review-form select {padding: 0.75rem 1rem;border: 2px solid rgba(167, 139, 250, 0.2);border-radius: 0.375rem;font-size: 1rem;outline: none;transition: border-color 0.3s ease;font-family: inherit;background: white;}.review-form select:focus {border-color: #a855f7;}/* Shop Inquiry Section */.shop-inquiry-section {padding: 1rem 0;background: linear-gradient(135deg, #fdf2f8 0%, #f3e8ff 100%);}.shop-inquiry-content {display: grid;grid-template-columns: 1fr 1fr;gap: 3rem;align-items: start;}.inquiry-info h3 {font-size: 2rem;color: #1f2937;margin-bottom: 1rem;}.inquiry-info > p {font-size: 1.125rem;color: #6b7280;margin-bottom: 2rem;line-height: 1.7;}.inquiry-features {display: flex;flex-direction: column;gap: 1.5rem;}.inquiry-feature {display: flex;align-items: flex-start;gap: 1rem;}.inquiry-feature i {font-size: 1.5rem;color: #a855f7;margin-top: 0.25rem;flex-shrink: 0;}.inquiry-feature h4 {font-size: 1.125rem;color: #1f2937;margin-bottom: 0.25rem;}.inquiry-feature p {color: #6b7280;font-size: 0.875rem;line-height: 1.5;}.shop-inquiry-form-container {display: flex;justify-content: center;}.inquiry-form-card {background: white;padding: 2rem;border-radius: 0.75rem;box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);width: 100%;}.inquiry-form-card h3 {margin-bottom: 1.5rem;color: #1f2937;}.shop-inquiry-form {display: flex;flex-direction: column;gap: 1rem;}.shop-inquiry-form select {padding: 0.75rem 1rem;border: 2px solid rgba(167, 139, 250, 0.2);border-radius: 0.375rem;font-size: 1rem;outline: none;transition: border-color 0.3s ease;font-family: inherit;background: white;}.shop-inquiry-form select:focus {border-color: #a855f7;}/* Newsletter form improvements */.newsletter-form {display: flex;gap: 0.75rem;margin-bottom: 0.75rem;flex-wrap: wrap;}.newsletter-form input[name="name"] {margin-top: 0.5rem;width: 100%;}/* Responsive Design for New Forms */@media (max-width: 768px) {.shop-inquiry-content {grid-template-columns: 1fr;gap: 2rem;}.inquiry-features {gap: 1rem;}.inquiry-feature {flex-direction: column;text-align: center;gap: 0.5rem;}.review-form-card,.inquiry-form-card {padding: 1.5rem;}.newsletter-form {flex-direction: column;}.form-row {grid-template-columns: 1fr;}}/* Blog and Portfolio Images */.blog-image img,.portfolio-image img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.3s ease;}.blog-card:hover .blog-image img,.portfolio-item:hover .portfolio-image img {transform: scale(1.05);}.blog-image,.portfolio-image {position: relative;overflow: hidden;border-radius: 0.5rem 0.5rem 0 0;}.portfolio-overlay {position: absolute;inset: 0;background: rgba(167, 139, 250, 0.8);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.3s ease;}.portfolio-item:hover .portfolio-overlay {opacity: 1;}.portfolio-overlay i {font-size: 2rem;color: white;}/* Make entire cards clickable */.blog-card a,.portfolio-item a {text-decoration: none;color: inherit;display: block;}.blog-card a:hover,.portfolio-item a:hover {color: inherit;}/* Footer Bottom Layout */.footer-bottom-content {display: flex;justify-content: space-between;align-items: center;flex-wrap: wrap;gap: 1rem;}.footer-bottom p {margin: 0;flex: 1;}/* Footer Sponsor Box */.footer-sponsor {width: 140px;height: 60px;background: linear-gradient(135deg, #4b5563 0%, #6b7280 100%);border-radius: 0.5rem;border: 1px solid rgba(255, 255, 255, 0.1);transition: all 0.3s ease;flex-shrink: 0;}.footer-sponsor:hover {background: linear-gradient(135deg, #6b7280 0%, #9ca3af 100%);transform: translateY(-1px);}.footer-sponsor a {display: block;width: 100%;height: 100%;text-decoration: none;color: white;padding: 0.5rem;}.footer-sponsor .sponsor-content {display: flex;flex-direction: column;justify-content: center;height: 100%;text-align: center;}.footer-sponsor .sponsor-text {font-size: 0.7rem;color: #d1d5db;margin-bottom: 0.125rem;font-weight: 500;}.footer-sponsor .sponsor-name {font-size: 0.75rem;color: white;font-weight: 600;line-height: 1.2;}/* Mobile Footer Sponsor */@media (max-width: 768px) {.footer-bottom-content {flex-direction: column;text-align: center;gap: 1rem;}.footer-sponsor {width: 120px;height: 50px;}.footer-sponsor .sponsor-text {font-size: 0.65rem;}.footer-sponsor .sponsor-name {font-size: 0.7rem;}}/* ==========================================================================--- Final Article Custom Field Styles ---========================================================================== *//* Article Styling */.article-container {padding: 6rem 0 3rem;background: white;min-height: 100vh;}.article-container .article-header {text-align: center;margin-bottom: 3rem;max-width: 800px;margin-left: auto;margin-right: auto;}.article-container .article-title {font-size: 2.5rem;font-weight: 700;color: #1f2937;margin-bottom: 1rem;line-height: 1.2;}.article-container .article-meta {display: flex;justify-content: center;gap: 2rem;align-items: center;flex-wrap: wrap;}.article-container .article-date {color: #6b7280;font-size: 0.9rem;display: flex;align-items: center;gap: 0.5rem;}.article-container .article-category {background: linear-gradient(135deg, #a855f7 0%, #ec4899 100%);color: white;padding: 0.5rem 1rem;border-radius: 1rem;font-size: 0.875rem;font-weight: 500;}/* Article Gallery */.article-container .article-gallery {margin-bottom: 3rem;}.gallery-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 1rem;max-width: 600px;margin: 0 auto;}.gallery-item {position: relative;aspect-ratio: 1;border-radius: 0.5rem;overflow: hidden;cursor: pointer;transition: transform 0.3s ease;}.gallery-item:hover {transform: scale(1.05);}.gallery-item img {width: 100%;height: 100%;object-fit: cover;}.gallery-overlay {position: absolute;inset: 0;background: rgba(0, 0, 0, 0.5);display: flex;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.3s ease;}.gallery-item:hover .gallery-overlay {opacity: 1;}.gallery-overlay i {color: white;font-size: 1.5rem;}/* Article Content */.article-container .article-content {max-width: 800px;margin: 0 auto;line-height: 1.8;}.article-container .article-intro {margin-bottom: 2rem;padding: 2rem;background: linear-gradient(135deg, #f3e8ff 0%, #fdf2f8 100%);border-radius: 0.75rem;border-left: 4px solid #a855f7;}.article-container .article-intro .article-description {font-size: 1.125rem;color: #4b5563;margin: 0;font-style: italic;}.article-container .article-body {font-size: 1rem;color: #374151;}.article-container .article-body h2 {font-size: 1.75rem;color: #1f2937;margin: 2rem 0 1rem;border-bottom: 2px solid #e5e7eb;padding-bottom: 0.5rem;}.article-container .article-body h3 {font-size: 1.375rem;color: #374151;margin: 1.5rem 0 0.75rem;}.article-container .article-body h4 {font-size: 1.125rem;color: #4b5563;margin: 1rem 0 0.5rem;}.article-container .article-body p {margin-bottom: 1rem;}.article-container .article-body ul, .article-body ol {margin: 1rem 0;padding-left: 1.5rem;}.article-container .article-body li {margin-bottom: 0.5rem;}.article-container .article-content blockquote {background: #f9fafb;border-left: 4px solid #a855f7;padding: 1rem 1.5rem;margin: 2rem 0;font-style: italic;color: #4b5563;}.article-container .article-content blockquote footer {font-style: normal;font-weight: 600;color: #1f2937;margin-top: 0.5rem;display: block;}9/* Article Tips */.article-container .article-tips {display: grid;grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));gap: 1rem;margin: 2rem 0;}.article-container .tip-box {background: linear-gradient(135deg, #eff6ff 0%, #f0f9ff 100%);padding: 1.5rem;border-radius: 0.75rem;border: 1px solid #e0f2fe;}.article-container .tip-box h4 {color: #0369a1;margin-bottom: 0.5rem;}.article-container .tip-box p {color: #0f172a;margin: 0;}/* --- Mobile Product-Style Gallery --- *//* By default, hide the mobile gallery */.mobile-gallery {display: none;}/* On mobile screens, hide the desktop grid and show the mobile gallery */@media (max-width: 768px) {.gallery-grid {display: none;}.mobile-gallery {display: block;}}.gallery-main-image {width: 100%;margin-bottom: 1rem;border: 1px solid #eee;border-radius: 0.5rem;overflow: hidden;}.gallery-main-image img {width: 100%;height: auto;display: block;}.gallery-thumbnails {display: flex;gap: 0.5rem;flex-wrap: wrap;}.gallery-thumbnail-item {width: 60px;height: 60px;border: 2px solid transparent;border-radius: 0.5rem;cursor: pointer;overflow: hidden;transition: border-color 0.3s ease;}.gallery-thumbnail-item:hover {border-color: #ddd;}.gallery-thumbnail-item.active {border-color: #a855f7; /* Your template's primary color */}.gallery-thumbnail-item img {width: 100%;height: 100%;object-fit: cover;}/* Social Media Links */.article-social {text-align: center;margin-top: 3rem;padding: 2rem;background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%);border-radius: 0.75rem;}.article-social h3 {color: #1f2937;margin-bottom: 1.5rem;}.social-links {display: flex;justify-content: center;gap: 1.5rem;}.social-link {display: flex;align-items: center;gap: 0.5rem;padding: 0.75rem 1.5rem;border-radius: 0.5rem;text-decoration: none;font-weight: 500;transition: all 0.3s ease;}.social-link.instagram {background: linear-gradient(135deg, #f56565 0%, #ec4899 50%, #8b5cf6 100%);color: white;}.social-link.youtube {background: linear-gradient(135deg, #ff0000 0%, #cc0000 100%);color: white;}.social-link:hover {transform: translateY(-2px);box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);}/* Image Modal */.image-modal {display: none;position: fixed;inset: 0;background: rgba(0, 0, 0, 0.9);z-index: 9999;cursor: pointer;}.modal-content {position: relative;margin: auto;display: block;width: 90%;max-width: 800px;top: 50%;transform: translateY(-50%);}.modal-content img {width: 100%;height: auto;border-radius: 0.5rem;}.modal-close {position: absolute;top: -40px;right: 0;color: white;font-size: 2rem;font-weight: bold;cursor: pointer;background: rgba(0, 0, 0, 0.5);padding: 0.5rem;border-radius: 50%;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;}/* Responsive Design */@media (max-width: 768px) {.article-title {font-size: 2rem;}.article-meta {flex-direction: column;gap: 1rem;}.gallery-grid {grid-template-columns: repeat(2, 1fr);}.social-links {flex-direction: column;align-items: center;}.social-link {width: 200px;justify-content: center;}}@media (max-width: 480px) {.gallery-grid {grid-template-columns: 1fr;max-width: 300px;}.article-content {padding: 0 1rem;}}/* ==========================================================================--- Custom Blog Category Page Styling ---========================================================================== *//* Main container for the blog items */.com-content-category-blog__items.blog-items {display: grid;grid-template-columns: repeat(3, 1fr); /* Creates the 3-column layout */gap: 2rem;border-top: none; /* Removes default top border */}/* Individual blog item card */.com-content-category-blog__item.blog-item {display: flex;flex-direction: column;background: white;border-radius: 0.75rem;overflow: hidden;box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);transition: transform 0.3s ease;padding: 0; /* Removes default padding */border: none; /* Removes default border */}.com-content-category-blog__item.blog-item:hover {transform: translateY(-5px);}/* Hide all the default meta information */.com-content-category-blog__item .article-info {display: none;}/* Image container *//* --- Blog Category Page - Image Sizing --- *//* This targets the container OF the image */.com-content-category-blog__item .item-image {order: 1; /* Puts image at the top of the card */height: 220px !important; /* Sets a fixed height for the image area */margin: 0;float: none;border-bottom: 1px solid #eee;background-color: #f0f0f0; /* Fallback color while image loads */}/* This makes the image ITSELF fill that container without distortion */.com-content-category-blog__item .item-image img {width: 100%;height: 100%;object-fit: cover; /* This is the key: it crops the image to fit */}/* Content container */.com-content-category-blog__item .item-content {order: 2; /* Puts content second */padding: 1.5rem;display: flex;flex-direction: column;flex-grow: 1; /* Makes card same height */}/* Article Title */.com-content-category-blog__item .page-header {margin: 0 0 0.75rem 0;}.com-content-category-blog__item .page-header h2 {font-size: 1.2rem;font-weight: 600;line-height: 1.4;}.com-content-category-blog__item .page-header h2 a {color: #1f2937;text-decoration: none;}.com-content-category-blog__item .page-header h2 a:hover {color: #a855f7; /* Your template's primary color */}/* Read More Button Styling */.com-content-category-blog__item .readmore {margin-top: auto; /* Pushes the button to the bottom of the card */padding-top: 1rem;}.com-content-category-blog__item .readmore a.btn {display: inline-block;background: #a855f7;color: white;border-radius: 0.5rem;padding: 0.6rem 1.2rem;text-decoration: none;font-weight: 500;transition: background 0.3s ease;}.com-content-category-blog__item .readmore a.btn:hover {background: #7c3aed;}.com-content-category-blog__item .readmore .icon-chevron-right {display: none; /* Hide the default arrow icon */}/* Responsive adjustments for smaller screens */@media (max-width: 992px) {.com-content-category-blog__items.blog-items {grid-template-columns: repeat(2, 1fr); /* 2 columns on tablets */}}@media (max-width: 576px) {.com-content-category-blog__items.blog-items {grid-template-columns: 1fr; /* 1 column on phones */}}/* ==========================================================================--- Custom Blog Pagination Styling ---========================================================================== *//* This targets the main navigation container at the bottom of the blog */.com-content-category-blog__navigation {margin-top: 3rem;display: flex;flex-direction: column;align-items: center;}/* Style the 'Page 1 of 2' text */.com-content-category-blog__counter {order: 2; /* Move it below the pagination buttons */text-align: center;width: 100%;color: #6b7280;font-size: 0.9rem;padding: 0;margin-top: 1rem;float: none !important; /* Override Joomla's float class */}/* Center the pagination buttons */.com-content-category-blog__pagination .pagination__wrapper {order: 1; /* Move it above the counter text */display: flex;justify-content: center;}/* Style the main