@charset "utf-8";
/* CSS Document */

@media (max-width: 1200px) {
    h2 { font-size: 2.4rem; }
    .slide-content h2 { font-size: 3.4rem; }
    .why-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 992px) {
    .section-padding { padding: 80px 0; }
    .about-grid, .contact-grid { grid-template-columns: 1fr; gap: 48px; }
    .slide-image-wrapper { width: 100%; opacity: 1.0; }
    .slide-image-wrapper::after { display: none; }
    .slide-content { width: 80%; padding-left: 40px; }
    .products-grid, .products-grid.col-4 { grid-template-columns: repeat(2, 1fr); }
    .why-grid { grid-template-columns: repeat(2, 1fr); }
    .order-actions-container { flex-direction: column; padding: 32px; gap: 32px; }
    .qr-card { border-left: none; border-top: 1px solid var(--soft-beige); padding-left: 0; padding-top: 32px; width: 100%; 
	.logo-brand img {height: 48px; /* Slightly scales down the logo to save vertical screen space */
    }
}

@media (max-width: 768px) {
    .container { padding: 0 24px; }
    .menu-toggle { display: block; background: none; border: none; cursor: pointer; padding: 10px; z-index: 1100; }
    .hamburger { display: block; width: 24px; height: 2px; background: var(--text-dark); position: relative; transition: background 0.3s ease; }
    .hamburger::before, .hamburger::after { content: ''; position: absolute; width: 24px; height: 2px; background: var(--text-dark); transition: transform 0.3s ease; }
    .hamburger::before { top: -6px; }
    .hamburger::after { bottom: -6px; }
    
    .menu-toggle[aria-expanded="true"] .hamburger { background: transparent; }
    .menu-toggle[aria-expanded="true"] .hamburger::before { transform: rotate(45deg) translate(4px, 4px); }
    .menu-toggle[aria-expanded="true"] .hamburger::after { transform: rotate(-45deg) translate(4px, -4px); }
    
    .nav-menu { position: fixed; top: 0; right: -100%; width: 80%; max-width: 300px; height: 100vh; background: var(--warm-white); box-shadow: -10px 0 30px rgba(0,0,0,0.05); padding: 100px 40px; transition: right 0.4s var(--transition-smooth); }
    .nav-menu.open { right: 0; }
    .nav-menu ul { flex-direction: column; gap: 30px; }
    
    .slide-content h2 { font-size: 2.6rem; }
    .slide-content { padding-left: 20px; width: 90%; }
    .slider-btn { display: none; }
    
    .products-grid, .products-grid.col-4, .why-grid, .steps-grid { grid-template-columns: 1fr; }
    .artisan-form { padding: 24px; }
    .footer-top { flex-direction: column; gap: 40px; 
	
	/* Ensures the logo scales down cleanly for mobile viewports */
    .logo-brand img {
        height: 42px; 
    }

    /* Centers the logo image perfectly between the left edge and the mobile menu trigger */
    .header-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 12px 24px; /* Tighter padding for mobile screen edges */
    }
    
/* Tweaks the footer logo presentation for centered mobile stack layouts */
    .footer-logo {
        height: 60px;
        margin: 0 auto 24px auto; /* Centers the logo in the mobile footer view */
        background: none;         /* Ensures background box is gone on mobile too */
        padding: 0;
    }
	
/* Optimization layer for compact smartphone screens */
@media (max-width: 380px) {
    .logo-brand img {
        height: 36px; /* Safeguards layout integrity on tiny viewports */
    }
}