/*!
Theme Name: new-theme
Theme URI: https://underscores.me/
Author: Automattic
Author URI: https://automattic.com/
Description: Hi. I'm a starter theme called <code>new-theme</code>, or <em>underscores</em>, if you like. I'm a theme meant for hacking so don't use me as a <em>Parent Theme</em>. Instead try turning me into the next, most awesome, WordPress theme out there. That's what I'm here for.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: new-theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

new-theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

@import url("https://fonts.googleapis.com/css2?family=Assistant:wght@200..800&family=Karantina:wght@300;400;700&display=swap");

/* ============================================
   ROOT VARIABLES
   ============================================ */
:root {
    /* Font Families */
    --font-primary: "Assistant", sans-serif;
    --font-fallback: system-ui, -apple-system, sans-serif;
    --font-serif: Georgia, serif;

    /* Brand Colors */
    --primary-color: ;
    --secondary-color: ;

    /* Base Colors */
    --color-white: #ffffff;
    --color-black: #000000;
    --color-gray: #f6f4f7;
    --color-light-gray: #fafafa;

    /* Background Colors */
    --bg-color-white: ;
    --bg-color-black: ;

    /* Border Colors */
    --border-color: ;

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
    --transition-medium: 0.4s ease;
    --transition-slow: 0.6s ease;
    --transition-slower: 0.8s ease;

    /* Font Sizes - Fluid with clamp() */
    --font-2xs: clamp(0.625rem, 0.575rem + 0.25vw, 0.75rem);
    /* 10-12px */
    --font-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
    /* 12-14px */
    --font-sm: clamp(0.875rem, 0.825rem + 0.25vw, 1rem);
    /* 14-16px */
    --font-base: clamp(1rem, 0.925rem + 0.375vw, 1.125rem);
    /* 16-18px */
    --font-md: clamp(1.125rem, 1rem + 0.625vw, 1.375rem);
    /* 18-22px */
    --font-lg: clamp(1.25rem, 1.1rem + 0.75vw, 1.75rem);
    /* 20-28px */
    --font-xl: clamp(1.5rem, 1.25rem + 1.25vw, 2rem);
    /* 24-32px ✓ */
    --font-2xl: clamp(1.75rem, 1.5rem + 1.25vw, 2.5rem);
    /* 28-40px */
    --font-3xl: clamp(2rem, 1.75rem + 1.25vw, 3rem);
    /* 32-48px */
    --font-4xl: clamp(2.25rem, 2rem + 1.25vw, 3.5rem);
    /* 36-56px */
    --font-5xl: clamp(2.5rem, 2rem + 2.5vw, 4rem);
    /* 40-64px ✓ */
    --font-6xl: clamp(3rem, 2.5rem + 2.5vw, 5rem);
    /* 48-80px */
    --font-7xl: clamp(3.5rem, 3rem + 2.5vw, 6rem);
    /* 56-96px */

    /* Spacing - Fluid with clamp() */
    --space-3xs: clamp(0.25rem, 0.2rem + 0.25vw, 0.5rem);
    /* 4-8px */
    --space-2xs: clamp(0.375rem, 0.3rem + 0.375vw, 0.75rem);
    /* 6-12px */
    --space-xs: clamp(0.5rem, 0.4rem + 0.5vw, 1rem);
    /* 8-16px */
    --space-sm: clamp(0.75rem, 0.6rem + 0.75vw, 1.5rem);
    /* 12-24px */
    --space-base: clamp(0.875rem, 0.7rem + 0.875vw, 1.75rem);
    /* 14-28px */
    --space-md: clamp(1rem, 0.8rem + 1vw, 2rem);
    /* 16-32px ✓ */
    --space-lg: clamp(1.25rem, 1rem + 1.25vw, 2.5rem);
    /* 20-40px */
    --space-xl: clamp(1.5rem, 1.2rem + 1.5vw, 3rem);
    /* 24-48px */
    --space-2xl: clamp(2rem, 1.5rem + 2.5vw, 4rem);
    /* 32-64px ✓ */
    --space-3xl: clamp(2.5rem, 2rem + 2.5vw, 5rem);
    /* 40-80px */
    --space-4xl: clamp(3rem, 2.5rem + 2.5vw, 6rem);
    /* 48-96px */
    --space-5xl: clamp(4rem, 3rem + 5vw, 8rem);
    /* 64-128px */
    --space-6xl: clamp(5rem, 4rem + 5vw, 10rem);
    /* 80-160px */
    --space-7xl: clamp(6rem, 5rem + 5vw, 12rem);
    /* 96-192px */

    /* Container Sizes */
    --container-xs: 480px;
    --container-sm: 768px;
    --container-md: 1024px;
    --container-lg: 1240px;
    --container-xl: 1440px;
    --container-2xl: 1600px;

    /* Container Gutter */
    --container-gutter: var(--space-md);
}

/* ============================================
   RESET & BASE
   ============================================ */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: var(--font-primary), var(--font-fallback);
    font-size: var(--font-base);
    line-height: 1.5;
    color: var(--color-black);
    background-color: var(--color-white);
    overflow-x: hidden;
    direction: rtl;
}

a {
    text-decoration: none;
    color: inherit;
    transition: var(--transition-base);
}

ul {
    list-style: none;
}

button {
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
}

/* 480px */
.container--xs {
    width: 100%;
    max-width: var(--container-xs);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* 768px */
.container--sm {
    width: 100%;
    max-width: var(--container-sm);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* 1024px */
.container--md {
    width: 100%;
    max-width: var(--container-md);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* 1280px */
.container--lg {
    width: 100%;
    max-width: var(--container-lg);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* 1440px */
.container--xl {
    width: 100%;
    max-width: var(--container-xl);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* 1600px */
.container--2xl {
    width: 100%;
    max-width: var(--container-2xl);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* ============================================
   HEADER SECTION
   ============================================ */
.header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    padding: var(--space-3xs) 0;
    transition: var(--transition-medium);
    background-color: var(--color-white);
}
.header .header__container {
        display: flex;
        justify-content: space-between;
        flex-direction: row-reverse;
        align-items: center;

        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.header .header__logo {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: left;
    }
.header .header__logo img {
            width: 180px;
            /* Switch to fixed width for better control */
            height: auto;
            max-width: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            transition: var(--transition-medium);
        }
/* .header--scrolled & img {
            width: 180px;
        } */
.header .header__nav {
        display: flex;
        align-items: center;
    }
@media (max-width: 992px) {
.header .header__nav {
            display: none;
    }
        }
.header .header__toggle {
        display: none;
        /* Hidden on desktop */
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 5px;
        width: 42px;
        height: 42px;
        background-color: var(--color-black);
        border-radius: 0;
        z-index: 1100;
        transition: var(--transition-base);
    }
@media (max-width: 992px) {
.header .header__toggle {
            display: flex;
    }
        }
.header .header__toggle .header__toggle-line {
            width: 22px;
            height: 2px;
            /* Switch from 1.5px to 2px for crisp pixel alignment */
            background-color: var(--color-white);
            transition: var(--transition-medium);
            display: block;
        }
.header .header__toggle.header__toggle--active .header__toggle-line:nth-child(1) {
                transform: translateY(7px) rotate(45deg);
            }
.header .header__toggle.header__toggle--active .header__toggle-line:nth-child(2) {
                opacity: 0;
                transform: scaleX(0);
            }
.header .header__toggle.header__toggle--active .header__toggle-line:nth-child(3) {
                transform: translateY(-7px) rotate(-45deg);
            }
.header .header__drawer {
        position: fixed;
        top: 0;
        right: -110%;
        /* Slightly more off-screen for smoother entry */
        width: 100%;
        max-width: 400px;
        height: 100vh;
        background: var(--color-white);
        z-index: 1050;
        padding: 100px var(--space-2xl);

        /* Closing transition: slower and smoother */
        transition:
            right 1.2s cubic-bezier(0.4, 0, 0.2, 1),
            visibility 0s 1.2s,
            opacity 1.2s ease;

        display: flex;
        flex-direction: column;
        visibility: hidden;
        opacity: 0;
    }
@media (min-width: 993px) {
.header .header__drawer {
            display: none;
    }
        }
.header .header__drawer.header__drawer--open {
            right: 0;
            visibility: visible;
            opacity: 1;
            /* Opening transition: slightly faster for responsiveness */
            transition:
                right 0.8s cubic-bezier(0, 0, 0.2, 1),
                visibility 0s 0s,
                opacity 0.8s ease;
        }
.header .header__menu {
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0;
    }
.header__nav :is(.header .header__menu) {
            flex-direction: row;
            gap: var(--space-lg);
        }
.header__drawer :is(.header .header__menu) {
            flex-direction: column;
            gap: var(--space-md);
        }
.header .header__item {
        font-size: var(--font-base);
        font-weight: 300;
        position: relative;
        /* Essential for absolute dropdown */
    }
@media (max-width: 992px) {
.header .header__item {
            font-size: var(--font-lg);
    }
        }
.header .header__item.header__item--has-children .header__link {
                display: flex;
                align-items: center;
                gap: 5px;
            }
/* Plus/Minus Indicator for Mobile */
.header .header__item.header__item--has-children .header__link--toggle {

                display: flex;
                align-items: center;
                width: 100%;
            }
@media (min-width: 993px) {
.header .header__item.header__item--has-children .header__link--toggle {
                    pointer-events: none;
                    /* Only toggleable on mobile */
            }
                }
.header .header__item.header__item--has-children .header__link--toggle .header__dropdown-icon {
                    margin-left: 8px;
                    transition: transform var(--transition-base);
                }
.header .header__item.header__item--has-children .header__link--toggle .header__dropdown-icon .header__icon-v {
                        transition:
                            transform var(--transition-base),
                            opacity var(--transition-base);
                        transform-origin: center;
                    }
/* Desktop Specific Dropdown Trigger */
@media (min-width: 993px) {
.header .header__item.header__item--has-children:hover .header__dropdown {
                    opacity: 1;
                    visibility: visible;
            }
                }
.header .header__item.header__item--open .header__dropdown-icon .header__icon-v {
                    transform: scaleY(0);
                    opacity: 0;
                }
@media (max-width: 992px) {
.header .header__item.header__item--open .header__submenu-wrapper {
                    grid-template-rows: 1fr;
                    opacity: 1;
                    margin-top: var(--space-xs);
            }
                }
.header .header__link {
        width: 100%;
        display: block;
        text-align: right;
        /* Ensure button text matches links in RTL */
        padding: 0;
        font-size: inherit;
        font-weight: inherit;
        font-family: inherit;
        color: inherit;
        transition: var(--transition-base);

        /* &:hover {
            color: rgba(0, 0, 0, 0.5);
        } */
    }
.header .header__submenu-wrapper {
        display: grid;
        grid-template-rows: 0fr;
        transition:
            grid-template-rows 0.3s ease-out,
            opacity 0.3s ease-out,
            margin 0.3s ease-out;
        opacity: 0;
        overflow: hidden;
    }
@media (min-width: 993px) {
.header .header__submenu-wrapper {
            display: none;
            /* Only use accordion on mobile */
    }
        }
.header .header__submenu-wrapper .header__submenu {
            margin-top: 0;
            margin-right: var(--space-md);
            display: flex;
            flex-direction: column;
            min-height: 0;
            /* Important for grid-template-rows: 0fr to 1fr */
        }
@media (max-width: 992px) {
.header .header__submenu-wrapper .header__submenu {
                /* padding-bottom: var(--space-sm); */
        }
            }
.header .header__submenu-wrapper .header__submenu .header__submenu-item .header__submenu-link {
                    font-size: var(--font-md);
                    opacity: 0.9;
                }
.header .header__submenu-wrapper .header__submenu .header__submenu-item .header__submenu-link:hover {
                        color: rgba(0, 0, 0, 0.5);
                    }
/* Desktop dropdown */
@media (min-width: 993px) {
.header .header__dropdown {
            position: absolute;
            top: 10px;
            right: 0;
            background-color: transparent;
            min-width: 200px;
            padding: 0;
            padding-top: 36px;
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            transition: var(--transition-base);
            z-index: 1000;
            list-style: none;
            margin: 0;
            margin-top: var(--space-3xs);
            display: flex;
            flex-direction: column;
            gap: 5px;
    }
        }
@media (max-width: 992px) {
.header .header__dropdown {
            display: none;
    }
        }
.header .header__dropdown .header__dropdown-item {
            background-color: var(--color-white);
            text-align: right;
        }
.header .header__dropdown .header__dropdown-item .header__dropdown-link {
                display: block;
                padding: var(--space-xs) var(--space-base);
                color: var(--color-black);
                font-size: var(--font-base);
                font-weight: 300;
                transition: var(--transition-base);
            }
.header .header__dropdown .header__dropdown-item .header__dropdown-link:hover {
                    background-color: var(--color-gray);
                    color: var(--color-black);
                }

/* ============================================
   HERO COMPONENTS (Shared)
   ============================================ */
.hero {
    position: relative;
    width: 100%;
    overflow: hidden;
    background-color: var(--color-gray);
}
.hero.hero--front {
        height: 90vh;
    }
@media (max-width: 992px) {
.hero.hero--front {
            height: 70vh;
    }
        }
@media (max-width: 768px) {
.hero.hero--front {
            height: 60vh;
    }
        }
.hero.hero--page {
        height: 70vh;
    }
@media (max-width: 768px) {
.hero.hero--page {
            height: 60vh;
    }
        }
.hero .hero__image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        z-index: 1;
    }
.hero .hero__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.1);
        z-index: 2;
    }
.hero--page :is(.hero .hero__overlay) {
            background: rgba(0, 0, 0, 0.3);
        }
/* Slider Components */
.hero .hero__slider {
        width: 100%;
        height: 100%;
    }
.hero .hero__slider .hero__slide {
            position: relative;
            width: 100%;
            height: 100%;
        }

/* ============================================
   INTRO SECTION
   ============================================ */
.intro {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
    text-align: center;
}
@media (max-width: 576px) {
.intro {
        padding: var(--space-xl) 0 0;
}
    }
.intro .intro__container {
        width: 100%;
        max-width: var(--container-sm);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
        display: flex;
        flex-direction: column;
        align-items: center;
    }
.intro .intro__container .intro__title {
            font-size: var(--font-4xl);
            font-weight: 300;
            letter-spacing: 0.1em;
            line-height: 1.2;
        }
.intro .intro__container .intro__content {
            display: flex;
            flex-direction: column;
            gap: var(--space-xs);
        }
.intro .intro__container .intro__content .intro__text {
                font-size: var(--font-base);
                line-height: 1.7;
                font-weight: 200;
                opacity: 0.9;
            }
.intro .intro__container .intro__button {
            display: inline-block;
            padding: var(--space-xs) var(--space-md);
            background-color: var(--color-black);
            color: var(--color-white);
            font-size: var(--font-sm);
            letter-spacing: 0.1em;
            transition: var(--transition-base);
            margin-top: var(--space-xs);
        }
.intro .intro__container .intro__button:hover {
                background-color: rgba(0, 0, 0, 0.8);
                transform: translateY(-2px);
            }

/* ============================================
   VISUAL BREAK SECTION
   ============================================ */
.visual-break {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
@media (max-width: 576px) {
.visual-break {
        padding: var(--space-2xl) 0 0;
}
    }
.visual-break .visual-break__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.visual-break .visual-break__container .visual-break__image-wrapper {
            width: 100%;
            aspect-ratio: 21 / 9;
            /* Wide cinematic aspect ratio */
            overflow: hidden;
            border-radius: 2px;
            background-color: var(--color-gray);
        }
@media (max-width: 768px) {
.visual-break .visual-break__container .visual-break__image-wrapper {
                aspect-ratio: 16 / 9;
        }
            }
.visual-break .visual-break__container .visual-break__image-wrapper .visual-break__image {
                width: 100%;
                height: 100%;
                -o-object-fit: cover;
                   object-fit: cover;
                display: block;
            }

/* ============================================
   CATEGORY SECTION
   ============================================ */
.category {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
@media (max-width: 576px) {
.category {
        padding: var(--space-3xl) 0;
}
    }
.category .category__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.category .category__grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: var(--space-2xl) var(--space-lg);
    }
@media (max-width: 768px) {
.category .category__grid {
            grid-template-columns: 1fr 1fr;
            gap: var(--space-xl) var(--space-xs);
    }
        }
.category .category__item {
        position: relative;
        overflow: hidden;
        background-color: var(--color-white);
    }
.category .category__image-wrapper {
        position: relative;
        aspect-ratio: 2 / 3;
        overflow: hidden;
        background-color: var(--color-gray);
    }
.category .category__image-wrapper .category__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }
.category .category__content {
        display: flex;
        flex-direction: column;
    }
.category .category__content:hover {
            opacity: 0.9;
        }
.category .category__title {
        font-size: var(--font-base);
        font-weight: 300;
        text-align: center;
    }
.category .category-fallback {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: var(--space-4xl) var(--container-gutter);
        text-align: center;
    }
.category .category-fallback__title {
        font-size: var(--font-5xl);
        font-weight: 300;
        margin-bottom: var(--space-xs);
        color: var(--color-black);
        font-family: var(--font-primary);
    }

/* ============================================
   SHOP FALLBACK SECTION
   ============================================ */
.shop-fallback {
    padding: var(--space-6xl) 0;
    background-color: var(--color-white);
    text-align: center;
}
.shop-fallback .shop-fallback__container {
        width: 100%;
        max-width: var(--container-md);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.shop-fallback .shop-fallback__title {
        font-size: var(--font-6xl);
        font-weight: 300;
        margin-bottom: var(--space-md);
        color: var(--color-black);
    }

/* ============================================
   SERVICES SECTION
   ============================================ */
.services {
    padding-bottom: var(--space-5xl);
    background-color: var(--color-white);
}
.services .services__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.services .services__container .services__grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: var(--space-xl);
            max-width: var(--container-width);
            margin: 0 auto;
            padding: 0 var(--container-padding);
        }
@media (max-width: 992px) {
.services .services__container .services__grid {
                grid-template-columns: repeat(2, 1fr);
                gap: var(--space-xl) var(--space-xs);
        }
            }
.services .services__container .services__grid .services__item {
                display: flex;
                flex-direction: column;
            }
.services .services__container .services__grid .services__item .services__image-wrapper {
                    position: relative;
                    aspect-ratio: 2 / 3;
                    overflow: hidden;
                }
.services .services__container .services__grid .services__item .services__image-wrapper .services__image {
                        width: 100%;
                        height: 100%;
                        -o-object-fit: cover;
                           object-fit: cover;
                    }
.services .services__container .services__grid .services__item .services__link {
                    display: flex;
                    flex-direction: column;
                    height: 100%;
                    text-decoration: none;
                    color: inherit;
                }
.services .services__container .services__grid .services__item .services__link:hover .services__title {
                            color: rgba(0, 0, 0, 0.8);
                        }
.services .services__container .services__grid .services__item .services__content {
                    display: flex;
                    flex-direction: column;
                    text-align: center;
                }
.services .services__container .services__grid .services__item .services__content .services__title {
                        font-size: var(--font-lg);
                        font-weight: 300;
                    }
.services .services__container .services__grid .services__item .services__content .services__list {
                        display: flex;
                        flex-direction: column;
                    }
.services .services__container .services__grid .services__item .services__content .services__list .services__detail {
                            font-size: var(--font-sm);
                            font-weight: 300;
                        }
.services .services__container .services__grid .services__item .services__content .services__price {
                        font-size: var(--font-base);
                        font-weight: 400;
                    }
.services .services__container .services__grid .services__item:first-child {
                grid-column: 1 / -1;
            }
@media (max-width: 768px) {
.services .services__container .services__grid .services__item:first-child {
                    grid-column: initial;
            }
                }
.services .services__container .services__grid .services__item:first-child .services__image-wrapper {
                    aspect-ratio: 21 / 9;
                }
@media (max-width: 768px) {
.services .services__container .services__grid .services__item:first-child .services__image-wrapper {
                        aspect-ratio: 2 / 3;
                }
                    }

/* ============================================
   ABOUT SECTION
   ============================================ */
.about {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
.about .about__container {
        width: 100%;
        max-width: var(--container-md);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.about .about__inner {
        width: 100%;
        display: flex;
        gap: var(--space-4xl);
    }
@media (max-width: 992px) {
.about .about__inner {
            flex-direction: column-reverse;
            gap: var(--space-2xl);
    }
        }
.about .about__image-column {
        flex: 1;
        width: 100%;
        margin-inline: auto;
    }
@media (max-width: 992px) {
.about .about__image-column {
            max-width: 500px;
    }
        }
.about .about__image-wrapper {
        aspect-ratio: 3 / 4;
        overflow: hidden;
    }
.about .about__image-wrapper .about__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            display: block;
        }
.about .about__content {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        color: var(--color-black);
    }
.about .about__header {
        display: flex;
        flex-direction: column;
        gap: var(--space-xs);
    }
.about .about__title {
        font-size: var(--font-5xl);
        font-weight: 300;
        margin-bottom: var(--space-sm);
    }
.about .about__text-group {
        display: flex;
        flex-direction: column;
        gap: var(--space-md);
    }
.about .about__text {
        font-size: var(--font-base);
        line-height: 1.6;
        font-weight: 300;
        color: #333;
    }
.about .about__footer {
        margin-top: var(--space-lg);
    }
.about .about__button {
        display: inline-block;
        padding: var(--space-xs) var(--space-xl);
        background-color: var(--color-black);
        color: var(--color-white);
        font-size: var(--font-sm);
        font-weight: 400;
        text-decoration: none;
        transition: var(--transition-base);
    }
.about .about__button:hover {
            opacity: 0.8;
            transform: translateY(-2px);
        }

/* ============================================
   TESTIMONIALS SECTION
   ============================================ */
.testimonials {
    padding: var(--space-2xl) 0;
    background-color: var(--color-light-gray);
}
.testimonials .testimonials__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.testimonials .testimonials__title {
        font-size: var(--font-5xl);
        font-weight: 300;
        text-align: center;
        margin-bottom: var(--space-xl);
        color: var(--color-black);
    }
.testimonials .testimonials__slider {
        padding-bottom: var(--space-3xl);
    }
.testimonials .testimonials__item {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 0 var(--space-md);
    }
.testimonials .testimonials__image-wrapper {
        width: 180px;
        height: 180px;
        border-radius: 50%;
        overflow: hidden;
        margin-bottom: var(--space-xs);
        background-color: var(--color-gray);
    }
.testimonials .testimonials__image-wrapper .testimonials__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }
.testimonials .testimonials__name {
        font-size: var(--font-base);
        font-weight: 300;
        margin-bottom: var(--space-xs);
        color: var(--color-black);
    }
.testimonials .testimonials__text {
        font-size: var(--font-base);
        line-height: 1.2;
        font-weight: 300;
        max-width: 350px;
    }
.testimonials .testimonials__pagination {
        bottom: 0 !important;
    }
.testimonials .testimonials__pagination .swiper-pagination-bullet {
            background: var(--color-black);
            opacity: 0.2;
            width: 8px;
            height: 8px;
        }
.testimonials .testimonials__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                opacity: 1;
                background: var(--color-black);
            }

/* ============================================
   SHOP SECTION
   ============================================ */
.shop {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
.shop .shop__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.shop .shop__header {
        text-align: center;
        max-width: var(--container-xs);
        margin: 0 auto var(--space-md);
    }
.shop .shop__title {
        font-size: var(--font-5xl);
        font-weight: 300;
        color: var(--color-black);
    }
.shop .shop__subtitle {
        font-size: var(--font-base);
        line-height: 1.2;
        font-weight: 300;
    }
.shop .shop__grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-xl);
        margin-bottom: var(--space-xl);
    }
@media (max-width: 768px) {
.shop .shop__grid {
            grid-template-columns: 1fr;
    }
        }
.shop .shop__image-wrapper {
        aspect-ratio: 9 / 6;
        overflow: hidden;
        background-color: var(--color-gray);
        display: flex;
        align-items: center;
        justify-content: center;
    }
.shop .shop__image-wrapper .shop__fallback-text {
            font-size: var(--font-2xl);
            font-weight: 300;
            color: #999;
            letter-spacing: 0.1em;
        }
.shop .shop__image-wrapper .shop__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            display: block;
        }
.shop .shop__footer {
        display: flex;
        justify-content: center;
    }
.shop .shop__button {
        display: inline-block;
        padding: var(--space-3xs) var(--space-2xl);
        border: 1px solid var(--color-black);
        color: var(--color-black);
        font-size: var(--font-md);
        font-weight: 400;
        text-decoration: none;
        transition: var(--transition-base);
    }
.shop .shop__button:hover {
            background-color: var(--color-black);
            color: var(--color-white);
        }

/* ============================================
   GALLERY SECTION
   ============================================ */
.gallery {
    background-color: var(--color-white);
}
.gallery .gallery__container {
        width: 100%;
        max-width: var(--container-lg);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.gallery .gallery__grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-sm);
    }
@media (max-width: 600px) {
.gallery .gallery__grid {
            gap: var(--space-xs);
    }
        }
.gallery .gallery__item {
        overflow: hidden;
        border-radius: 2px;
        background-color: var(--color-gray);
    }
.gallery .gallery__image-wrapper {
        aspect-ratio: 4 / 5;
        /* Specific vertical aspect ratio */
        overflow: hidden;
    }
.gallery .gallery__image-wrapper .gallery__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            display: block;
        }

/* ============================================
   GALLERY NAVIGATION
   ============================================ */
.gallery-navigation {
    padding: var(--space-2xl);
}
.gallery-navigation .nav-links {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: var(--space-xl);
    }
.gallery-navigation .nav-previous,
    .gallery-navigation .nav-next {
        flex: 1;
    }
.gallery-navigation .nav-previous a, .gallery-navigation .nav-next a {
            display: flex;
            flex-direction: column;
            transition: var(--transition-base);
        }
.gallery-navigation .nav-previous a:hover, .gallery-navigation .nav-next a:hover {
                opacity: 0.7;
                transform: translateX(var(--hover-offset, 0));
            }
.gallery-navigation .nav-previous .nav-subtitle, .gallery-navigation .nav-next .nav-subtitle {
            font-size: var(--font-2xs);
            text-transform: uppercase;
            letter-spacing: 0.1em;
            opacity: 0.5;
            margin-bottom: var(--space-3xs);
        }
.gallery-navigation .nav-previous .nav-title, .gallery-navigation .nav-next .nav-title {
            font-size: var(--font-md);
            font-weight: 400;
        }
.gallery-navigation .nav-previous {
        text-align: left;
        --hover-offset: -5px;
    }
.gallery-navigation .nav-next {
        text-align: right;
        --hover-offset: 5px;
    }

/* ============================================
   BLOG ITEM COMPONENTS (SHARED)
   ============================================ */
.blog__item.swiper-slide {
        height: auto;
    }
.blog__item .blog__link {
        display: flex;
        flex-direction: column;
        text-decoration: none;
        color: inherit;
    }
.blog__item .blog__link:hover .blog__title {
                opacity: 0.5;
            }
.blog__item .blog__image-wrapper {
        width: 100%;
        aspect-ratio: 1 / 1;
        overflow: hidden;
        background-color: var(--color-gray);
    }
.blog__item .blog__image-wrapper .blog__image {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            display: block;
        }
.blog__item .blog__title {
        font-size: var(--font-md);
        font-weight: 300;
        letter-spacing: 0.05em;
    }

/* ============================================
   BLOG SECTION (Front Page Slider)
   ============================================ */
.blog-section {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
    text-align: center;
}
.blog-section .blog__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.blog-section .blog__section-title {
        font-size: var(--font-5xl);
        font-weight: 300;
        margin-bottom: var(--space-sm);
        letter-spacing: 0.1em;
    }
.blog-section .blog__slider {
        position: relative;
        padding: 0 var(--space-xl) var(--space-2xl);
        /* Bottom padding for pagination */
    }
/* Swiper Navigation */
.blog-section .blog__nav-prev,
    .blog-section .blog__nav-next {
        color: var(--color-black);
        width: 30px;
        height: 30px;
        top: 40%;

        display: flex;
        /* Position relative to images */
    }
.blog-section .blog__nav-prev::after, .blog-section .blog__nav-next::after {
            font-size: 20px;
            font-weight: bold;
        }
@media (min-width: 992px) {
.blog-section .blog__nav-prev,
    .blog-section .blog__nav-next {
            display: none;
    }
        }
.blog-section .blog__nav-prev {
        right: 0 !important;
    }
.blog-section .blog__nav-prev::after {
            content: "next";
        }
.blog-section .blog__nav-next {
        left: 0 !important;
    }
.blog-section .blog__nav-next::after {
            content: "prev";
        }
/* Swiper Pagination */
.blog-section .blog__pagination {
        bottom: 0 !important;
    }
.blog-section .blog__pagination .swiper-pagination-bullet {
            background: var(--color-black);
            opacity: 0.2;
        }
.blog-section .blog__pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                opacity: 1;
                background: var(--color-black);
            }
.blog-section .blog__footer {
        margin-top: var(--space-xl);
    }
.blog-section .blog__button {
        display: inline-block;
        padding: var(--space-3xs) var(--space-xl);
        border: 1px solid var(--color-black);
        color: var(--color-black);
        font-size: var(--font-md);
        font-weight: 400;
        text-decoration: none;
        transition: var(--transition-base);
    }
.blog-section .blog__button:hover {
            background-color: var(--color-black);
            color: var(--color-white);
        }

/* ============================================
   BLOG LISTING PAGE
   ============================================ */
.blog-listing {
    padding: var(--space-3xl) 0;
}
.blog-listing .blog-listing__container {
        width: 100%;
        max-width: var(--container-lg);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.blog-listing .blog-listing__grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--space-xl);
        margin-bottom: var(--space-4xl);
    }
@media (max-width: 992px) {
.blog-listing .blog-listing__grid {
            grid-template-columns: repeat(2, 1fr);
            gap: var(--space-xs);
    }
        }
.blog-listing .blog-listing__pagination {
        display: flex;
        justify-content: center;
        margin-top: var(--space-4xl);
    }
.blog-listing .blog-listing__pagination .page-numbers {
            display: flex;
            gap: var(--space-xs);
            list-style: none;
            padding: 0;
            margin: 0;
        }
.blog-listing .blog-listing__pagination .page-numbers li a,
                .blog-listing .blog-listing__pagination .page-numbers li span {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 40px;
                    height: 40px;
                    border: 1px solid #eee;
                    text-decoration: none;
                    color: var(--color-black);
                    font-size: var(--font-sm);
                    transition: var(--transition-base);
                }
.blog-listing .blog-listing__pagination .page-numbers li a.current,
                    .blog-listing .blog-listing__pagination .page-numbers li span.current,
                    .blog-listing .blog-listing__pagination .page-numbers li a:hover,
                    .blog-listing .blog-listing__pagination .page-numbers li span:hover {
                        background-color: var(--color-black);
                        color: var(--color-white);
                        border-color: var(--color-black);
                    }
.blog-listing .blog-listing__pagination .page-numbers li span.dots {
                    border: none;
                }
.blog-listing .blog-listing__pagination .page-numbers li span.dots:hover {
                        background: none;
                        color: var(--color-black);
                    }

/* ============================================
   FAQ SECTION
   ============================================ */
.faq {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
@media (max-width: 576px) {
.faq {
        padding: var(--space-sm) 0;
}
    }
.faq .faq__container {
        width: 100%;
        max-width: var(--container-sm);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.faq .faq__title {
        text-align: center;
        font-size: var(--font-4xl);
        font-weight: 300;
        margin-bottom: var(--space-sm);
        letter-spacing: 0.05em;
    }
.faq .faq__list {
        display: flex;
        flex-direction: column;
    }
/* Borders moved to header for "under question" alignment */
.faq .faq__item.faq__item--active .faq__icon {
                transform: rotate(180deg);
            }
.faq .faq__item.faq__item--active .faq__body {
                grid-template-rows: 1fr;
                opacity: 1;
                margin-bottom: var(--space-base);
            }
.faq .faq__header {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        gap: var(--space-md);
        align-items: center;
        padding: var(--space-3xs) 0;
        background: none;
        border: none;
        border-bottom: 1px solid #f2f2f2;
        cursor: pointer;
        text-align: right;
        color: var(--color-black);
        transition: var(--transition-base);
    }
.faq .faq__header:hover {
            opacity: 0.6;
        }
.faq .faq__question {
        font-size: var(--font-md);
        font-weight: 300;
        letter-spacing: 0.02em;
    }
.faq .faq__icon {
        display: flex;
        align-items: center;
        transition: var(--transition-base);
        opacity: 0.4;
    }
.faq .faq__body {
        display: grid;
        grid-template-rows: 0fr;
        transition:
            grid-template-rows 0.3s ease-out,
            opacity 0.3s ease-out;
        opacity: 0;
        overflow: hidden;
        padding: calc(var(--space-3xs) / 2);
        margin-right: var(--space-lg);
    }
.faq .faq__answer {
        min-height: 0;
        font-size: var(--font-sm);
        font-weight: 300;
        color: #666;
        line-height: 1.6;
    }

/* ============================================
   INSTAGRAM SECTION
   ============================================ */
.instagram {
    padding: var(--space-4xl) 0;
    background-color: var(--color-white);
}
.instagram .instagram__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }

/* ============================================
   FOOTER SECTION
   ============================================ */
.footer {
    padding: var(--space-4xl) 0;
    background-color: var(--color-black);
    color: var(--color-white);
}
.footer .footer__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: row-reverse;
    }
@media (max-width: 992px) {
.footer .footer__container {
            flex-direction: column;
            gap: var(--space-4xl);
            text-align: center;
    }
        }
/* Brand Section (Left Side) */
.footer .footer__brand {
        display: flex;
        flex-direction: column;
        align-items: center;
        /* flex: 1; */
    }
@media (max-width: 992px) {
.footer .footer__brand {
            width: 100%;
    }
        }
.footer .footer__logo img {
            width: 280px;
            height: auto;
            max-width: 100%;
            display: block;
        }
@media (max-width: 576px) {
.footer .footer__logo img {
                width: 100%;
        }
            }
.footer .footer__socials {
        display: flex;
        gap: var(--space-md);
        margin-top: var(--space-md);
    }
@media (max-width: 576px) {
.footer .footer__socials {
            margin-top: var(--space-xs);
    }
        }
.footer .footer__social-link {
        color: var(--color-white);
        transition: var(--transition-base);
        display: flex;
        align-items: center;
        justify-content: center;
    }
.footer .footer__social-link svg {
            width: 32px;
            height: 32px;
        }
.footer .footer__social-link:hover {
            opacity: 0.7;
        }
/* Navigation (Right Side) */
.footer .footer__nav {
        display: flex;
        gap: var(--space-5xl);
        flex: 2;
        justify-content: flex-start;
    }
@media (max-width: 992px) {
.footer .footer__nav {
            gap: var(--space-2xl);
            width: 100%;
            justify-content: space-evenly;
    }
        }
@media (max-width: 576px) {
.footer .footer__nav {
            justify-content: space-between;
    }
        }
.footer .footer__column {
        display: flex;
        flex-direction: column;
        text-align: right;
    }
.footer .footer__list {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        flex-direction: column;
        gap: var(--space-xs);
    }
.footer .footer__divider {
        height: 1px;
        margin: var(--space-xs) 0;
        width: 100%;
    }
.footer .footer__link {
        color: var(--color-white);
        text-decoration: none;
        font-size: var(--font-base);
        font-weight: 300;
        transition: var(--transition-base);
        white-space: nowrap;
    }
.footer .footer__link:hover {
            opacity: 0.7;
        }

/* Swiper Fade Optimization */
.swiper-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
}

.swiper-fade .swiper-slide-active {
    pointer-events: auto;
}

/* ============================================
   CONTACT FORM SECTION
   ============================================ */
.contact {
    background-color: var(--color-white);
    text-align: center;
}
.contact .contact__container {
        width: 100%;
        max-width: var(--container-sm);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }
.contact .contact__header {
        margin-bottom: var(--space-lg);
    }
.contact .contact__title {
        font-size: var(--font-3xl);
        font-weight: 300;
        letter-spacing: 0.02em;
    }
.contact .contact__subtitle {
        font-size: var(--font-sm);
        font-weight: 300;
        opacity: 0.8;
    }
.contact .contact__form {
        display: flex;
        flex-direction: column;
        gap: var(--space-xs);
    }
.contact .contact__field {
        position: relative;
        display: flex;
        flex-direction: column;
    }
.contact .contact__field p {
            margin-top: var(--space-3xs);
        }
.contact .contact__input {
        width: 100%;
        border: none;
        border-bottom: 1px solid var(--color-black);
        padding: 5px 0;
        font-family: inherit;
        font-size: var(--font-base);
        font-weight: 300;
        background: transparent;
        color: var(--color-black);
        transition: border-color 0.3s ease;
        outline: none;
        text-align: right;
    }
.contact .contact__input::-moz-placeholder {
            color: #4b4b4b;
            opacity: 1;
        }
.contact .contact__input::placeholder {
            color: #4b4b4b;
            opacity: 1;
        }
.contact .contact__input:focus {
            border-bottom-color: var(--color-black);
        }
.contact .contact__input.contact__input--textarea {
            resize: none;
            min-height: 40px;
        }
.contact .contact__consent p {
        margin-top: var(--space-3xs);
        display: flex;
        justify-content: flex-end;
    }
.contact .contact__checkbox-wrapper {
        display: flex;
        align-items: center;
        cursor: pointer;
        font-size: var(--font-sm);
        font-weight: 300;
        color: var(--color-black);
        direction: rtl;
    }
.contact .contact__checkbox-wrapper:hover {
            color: var(--color-black);
        }
.contact .contact__checkbox {
        width: 16px;
        height: 16px;
        cursor: pointer;
        accent-color: var(--color-black);
        margin-left: var(--space-xs);
    }
.contact .contact__footer {
        margin-top: var(--space-md);
    }
.contact .contact__button {
        background-color: var(--color-black);
        color: var(--color-white);
        border: none;
        padding: var(--space-3xs) var(--space-xl);
        font-size: var(--font-lg);
        font-family: var(--font-primary);
        font-weight: 300;
        cursor: pointer;
        transition: var(--transition-base);
    }
.contact .contact__button:hover {
            opacity: 0.8;
        }

/* ============================================
   MODAL SECTION
   ============================================ */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2000;
    display: none;
    /* Hidden by default */
    align-items: center;
    justify-content: center;
    padding: var(--space-md);
}
.modal.modal--open {
        display: flex;
    }
.modal .modal__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.4);
        backdrop-filter: blur(5px);
    }
.modal .modal__content {
        position: relative;
        background-color: var(--color-white);
        width: 100%;
        max-width: 720px;
        padding: var(--space-3xl) var(--space-xl);
        z-index: 10;
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
        border-radius: 2px;
        animation: modalFadeIn 0.3s ease-out;
    }
.modal .modal__close {
        position: absolute;
        top: 3px;
        right: 3px;
        background: none;
        border: none;
        cursor: pointer;
        color: var(--color-black);
        padding: 5px;
        transition: var(--transition-base);
        z-index: 11;
    }
.modal .modal__close:hover {
            opacity: 0.6;
            transform: rotate(90deg);
        }
.modal .modal__close svg {
            display: block;
        }

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ============================================
   CONTACT FORM
   ============================================ */
.wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}
.wpcf7-form-control-wrap .wpcf7-list-item {
        margin: 0 !important;
    }
.wpcf7-form-control-wrap .wpcf7-list-item label {
            display: flex;
            align-items: center;
        }

.wpcf7-spinner {
    display: none !important;
}

/* ============================================
   POST OVERRIDE
   ============================================ */
.post-thumbnail img {
        width: 100%;
        height: 100%;
    }

/* ============================================
   PORTFOLIO GALLERY
   ============================================ */
.portfolio-gallery {
    /*padding: var(--space-4xl) 0;
    background-color: var(--color-white);

    .portfolio-gallery__container {
        width: 100%;
        max-width: var(--container-2xl);
        margin: 0 auto;
        padding: 0 var(--container-gutter);
    }

    .portfolio-gallery__grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
        gap: var(--space-lg);
        max-width: var(--container-width);
        margin: 0 auto;
        padding: 0 var(--container-padding);

        @media (max-width: 768px) {
            grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
            gap: var(--space-md);
        }
    }

    .portfolio-gallery__item {
        position: relative;
        overflow: hidden;
        background-color: var(--color-white);
        transition: var(--transition-medium);

        &:hover {
            transform: translateY(-5px);

            .portfolio-gallery__image img {
                transform: scale(1.05);
            }

            .portfolio-gallery__content {
                background: rgba(0, 0, 0, 0.7);
                opacity: 1;
            }
        }
    }

    .portfolio-gallery__link {
        display: block;
        height: 100%;
    }

    .portfolio-gallery__image {
        position: relative;
        aspect-ratio: 4 / 5;
        overflow: hidden;

        & img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: var(--transition-slow);
        }
    }

    .portfolio-gallery__content {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: var(--space-lg);
        background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
        color: var(--color-white);
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        transition: var(--transition-medium);
    }

    .portfolio-gallery__title {
        font-family: var(--font-primary);
        font-size: var(--font-xl);
        font-weight: 500;
        margin-bottom: var(--space-xs);
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }

    .portfolio-gallery__types {
        display: flex;
        flex-wrap: wrap;
        gap: var(--space-2xs);
    }

    .portfolio-gallery__type {
        font-size: var(--font-2xs);
        text-transform: uppercase;
        letter-spacing: 0.1em;
        opacity: 0.8;
    }*/

    /* Navigation */
    /*.navigation.posts-navigation {
        margin-top: var(--space-4xl);
        text-align: center;

        .nav-links {
            display: flex;
            justify-content: center;
            gap: var(--space-md);
        }

        a {
            padding: var(--space-xs) var(--space-lg);
            border: 1px solid var(--color-black);
            font-size: var(--font-xs);
            text-transform: uppercase;
            letter-spacing: 0.1em;
            transition: var(--transition-base);

            &:hover {
                background-color: var(--color-black);
                color: var(--color-white);
            }
        }
    }*/
}