/*==================================================
                    RESET
==================================================*/

*,
*::before,
*::after{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    direction:rtl;
    overflow-x:hidden;
    font-family:"Vazirmatn",sans-serif;
}

img{
    display:block;
    max-width:100%;
}

ul{
    list-style:none;
}

a{
    text-decoration:none;
    color:inherit;
}

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

input{
    font-family:inherit;
}



/*==================================================
                ROOT VARIABLES
==================================================*/
:root{

    --bg:#241813;

    --surface:#2F2019;

    --surface-light:#3A2821;

    --gold:#C6A15B;

    --gold-light:#D8B46D;

    --white:#F8F5F2;

    --text:#E7DDD2;

    --text-muted:#B7A89B;

    --border:#4A372E;

    --shadow:0 20px 50px rgba(0,0,0,.30);

    --transition:.35s ease;

    --container:1320px;

}


/*==================================================
                TYPOGRAPHY
==================================================*/



/*==================================================
                    GLOBAL
==================================================*/

body{

    background:var(--bg);

    color:var(--text);

}

.container{

    width:min(92%,var(--container));

    margin-inline:auto;

}

section{

    padding:120px 0;

}



/*==================================================
                UTILITIES
==================================================*/



/*==================================================
                BUTTONS
==================================================*/
.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    height:52px;

    padding-inline:30px;

    border-radius:999px;

    transition:var(--transition);

    font-size:15px;

    font-weight:600;

}

.btn--primary{

    background:var(--gold);

    color:#1B140F;

}

.btn--primary:hover{

    background:var(--gold-light);

    transform:translateY(-2px);

}


/*==================================================
                HEADER
==================================================*/

.header{

    position:fixed;

    inset:0 0 auto 0;

    height:90px;

    z-index:1000;

    background:rgba(36,24,19,.80);

    backdrop-filter:blur(16px);

    border-bottom:1px solid var(--border);
   
    transition:all .35s ease;

}

.header--scrolled{

    height:72px;

    background:rgba(36,24,19,.94);

    backdrop-filter:blur(20px);

    box-shadow:0 10px 40px rgba(0,0,0,.25);

}

.header__wrapper{

    display:flex;

    align-items:center;

    justify-content:space-between;

    height:90px;

}

.header--scrolled .header__wrapper{

    height:72px;

}

.header__logo img{

    height:85px;

    width:auto;

}

.header--scrolled .header__logo img{

    height:48px;

}

.header__nav{

    margin-inline:auto;

}

.header__menu{

    display:flex;

    align-items:center;

    gap:42px;

}

.header__link{

    position:relative;

    font-size:15px;

    font-weight:500;

    transition:var(--transition);

}

.header__link:hover{

    color:var(--gold);

}

.header__link::after{

    content:"";

    position:absolute;

    right:0;

    bottom:-10px;

    width:0;

    height:2px;

    background:var(--gold);

    transition:var(--transition);

}

.header__link:hover::after,

.header__link--active::after{

    width:100%;

}

.header__link--active{

    color:var(--gold);

}

.header__actions{

    display:flex;

    align-items:center;

    gap:18px;

}

.header__search{

    width:48px;

    height:48px;

    border-radius:50%;

    display:grid;

    place-items:center;

    color:var(--white);

    background:var(--surface);

    transition:var(--transition);

}

.header__search:hover{

    background:var(--gold);

    color:#241813;

}

.header__toggle{

    display:none;

    width:48px;

    height:48px;

    flex-direction:column;

    justify-content:center;

    gap:6px;

}

.header__toggle span{

    width:24px;

    height:2px;

    background:var(--white);

    transition:var(--transition);

}

.header__cta{

    white-space:nowrap;

}

/*================ Search Panel ================*/

.search-panel{

    position:fixed;

    inset:90px 0 auto 0;

    z-index:999;

    background:rgba(28,19,15,.98);

    border-bottom:1px solid var(--border);

    backdrop-filter:blur(20px);

    transform:translateY(-120%);

    opacity:0;

    transition:var(--transition);

    padding:26px 0;

}

.search-panel--active{

    transform:translateY(0);

    opacity:1;

}

.search-panel__form{

    display:flex;

    align-items:center;

    gap:16px;

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:16px;

    padding:0 22px;

    height:64px;

}

.search-panel__form i{

    color:var(--gold);

    font-size:18px;

}

.search-panel__form input{

    flex:1;

    height:100%;

    background:transparent;

    border:none;

    outline:none;

    color:var(--white);

    font-size:16px;

}

.search-panel__form input::placeholder{

    color:var(--text-muted);

}

.search-panel__close{

    width:36px;

    height:36px;

    display:grid;

    place-items:center;

    color:var(--text-muted);

    border-radius:50%;

    transition:var(--transition);

}

.search-panel__close:hover{

    background:var(--surface-light);

    color:var(--white);

}

/*================ Overlay ================*/

.overlay{

    position:fixed;

    inset:0;

    background:rgba(15,10,8,.7);

    z-index:1500;

    opacity:0;

    visibility:hidden;

    transition:var(--transition);

}

.overlay--active{

    opacity:1;

    visibility:visible;

}

/*================ Mobile Menu ================*/

.mobile-menu{

    position:fixed;

    top:0;

    right:-100%;

    width:320px;

    max-width:86%;

    height:100vh;

    background:var(--surface);

    border-left:1px solid var(--border);

    transition:.4s;

    z-index:2000;

    display:flex;

    flex-direction:column;

    padding:28px;

    overflow-y:auto;

}

.mobile-menu--active{

    right:0;

}

.mobile-menu__head{

    display:flex;

    align-items:center;

    justify-content:space-between;

    margin-bottom:36px;

}

.mobile-menu__logo{

    height:40px;

    width:auto;

}

.mobile-menu__close{

    width:40px;

    height:40px;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:var(--surface-light);

    color:var(--white);

}

.mobile-menu__list{

    display:flex;

    flex-direction:column;

    gap:6px;

}

.mobile-menu__list a{

    display:block;

    padding:14px 4px;

    font-size:17px;

    font-weight:600;

    border-bottom:1px solid var(--border);

    transition:var(--transition);

}

.mobile-menu__list a:hover{

    color:var(--gold);

    padding-inline-start:10px;

}

.mobile-menu__btn{

    margin-top:28px;

    width:100%;

}

.mobile-menu__contact{

    margin-top:24px;

    display:flex;

    flex-direction:column;

    gap:14px;

}

.mobile-menu__contact a{

    display:flex;

    align-items:center;

    gap:10px;

    color:var(--text-muted);

    font-size:14px;

}

.mobile-menu__contact i{

    color:var(--gold);

}

/*================ Back to top ================*/

.back-to-top{

    position:fixed;

    bottom:32px;

    left:32px;

    width:50px;

    height:50px;

    border-radius:50%;

    background:var(--gold);

    color:#1B140F;

    display:grid;

    place-items:center;

    font-size:16px;

    box-shadow:var(--shadow);

    z-index:900;

    opacity:0;

    visibility:hidden;

    transform:translateY(10px);

    transition:var(--transition);

}

.back-to-top--visible{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

.back-to-top:hover{

    background:var(--gold-light);

}


/*==================================================
                    HERO
==================================================*/

.hero{

    position:relative;

    min-height:100vh;

    display:flex;

    align-items:center;

    overflow:hidden;

    background:url("../images/hero/hero-bg.jpg") center center / cover no-repeat;

}

/*================ Overlay ================*/

/* Content sits on the right in RTL, so the overlay is darkest on the
   right (behind the text) and eases toward the image on the left. */

.hero__overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        270deg,
        rgba(36,24,19,.94) 0%,
        rgba(36,24,19,.86) 35%,
        rgba(36,24,19,.55) 70%,
        rgba(36,24,19,.30) 100%
    );

    z-index:1;

}

/*================ Wrapper ================*/

.hero__wrapper{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:1.1fr .9fr;

    align-items:center;

    gap:80px;

    min-height:100vh;

}

/*================ Content ================*/

.hero__content{

    max-width:700px;

}

/*================ Subtitle ================*/

.hero__subtitle{

    display:inline-block;

    margin-bottom:22px;

    color:var(--gold);

    font-size:15px;

    font-weight:700;

    letter-spacing:4px;

    text-transform:uppercase;

}

/*================ Title ================*/

.hero__title{

    margin-bottom:28px;

    color:var(--white);

    font-size:64px;

    line-height:1.2;

    font-weight:800;

}

/*================ Text ================*/

.hero__text{

    max-width:620px;

    margin-bottom:30px;

    color:var(--text);

    font-size:18px;

    line-height:2;

}

/*================ Buttons ================*/

.hero__buttons{

    display:flex;

    align-items:center;

    gap:18px;

}

/*================ Meta ================*/

.hero__meta{

    display:flex;

    align-items:center;

    gap:36px;

    margin-top:56px;

    padding-top:32px;

    border-top:1px solid var(--border);

}

.hero__meta-item{

    display:flex;

    flex-direction:column;

    gap:4px;

}

.hero__meta-item strong{

    font-size:28px;

    font-weight:800;

    color:var(--gold-light);

}

.hero__meta-item span{

    font-size:13px;

    color:var(--text-muted);

}

/*================ Image ================*/

.hero__image{

    display:flex;

    justify-content:center;

    align-items:center;

}

.hero__image img{

    width:100%;

    max-width:560px;

    object-fit:contain;

    filter:drop-shadow(0 35px 60px rgba(0,0,0,.35));

}

/*================ Scroll ================*/

.hero__scroll{

    position:absolute;

    left:50%;

    bottom:40px;

    transform:translateX(-50%);

    z-index:2;

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:12px;

    color:var(--gold);

    font-size:13px;

    letter-spacing:2px;

    animation:scrollMove 2s infinite;

}

.hero__scroll::before{

    content:"";

    width:2px;

    height:45px;

    background:var(--gold);

}

/*==================================================
            SECONDARY BUTTON
==================================================*/

.btn--secondary{

    border:1px solid var(--gold);

    color:var(--white);

    background:transparent;

}

.btn--secondary:hover{

    background:var(--gold);

    color:#241813;

}

/*==================================================
            HERO ANIMATION
==================================================*/

@keyframes scrollMove{

    0%{

        transform:translate(-50%,0);

        opacity:1;

    }

    50%{

        transform:translate(-50%,10px);

    }

    100%{

        transform:translate(-50%,0);

        opacity:1;

    }

}



/*==================================================
            CATEGORIES
==================================================*/



/*==================================================
            PRODUCTS
==================================================*/



/*==================================================
            BANNER
==================================================*/



/*==================================================
            PROJECTS
==================================================*/



/*==================================================
                ABOUT
==================================================*/



/*==================================================
            STATISTICS
==================================================*/



/*==================================================
                CTA
==================================================*/



/*==================================================
                FOOTER
==================================================*/



/*==================================================
            ANIMATIONS
==================================================*/

/*==================================================
            SECTION HEAD (shared)
==================================================*/

.section-head{

    max-width:640px;

    margin-bottom:64px;

}

.section-head--split{

    max-width:none;

    display:flex;

    align-items:flex-end;

    justify-content:space-between;

    gap:24px;

    flex-wrap:wrap;

}

.section-head__eyebrow{

    display:inline-block;

    margin-bottom:14px;

    color:var(--gold);

    font-size:13px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

.section-head__title{

    margin-bottom:16px;

    color:var(--white);

    font-size:38px;

    line-height:1.35;

    font-weight:800;

}

.section-head--split .section-head__title{

    margin-bottom:0;

}

.section-head__text{

    color:var(--text-muted);

    font-size:16px;

    line-height:1.9;
}

/*==================================================
            CATEGORIES
==================================================*/

.categories{

    background:var(--bg);

}

.categories__grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;

}

.category-card{

    position:relative;

    display:flex;

    flex-direction:column;

    padding:38px 30px;

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:20px;

    overflow:hidden;

    transition:var(--transition);
}

.category-card::before{

    content:"";

    position:absolute;

    inset:auto -30% -60% auto;

    width:220px;

    height:220px;

    background:
        linear-gradient(var(--border) 1px,transparent 1px),
        linear-gradient(90deg,var(--border) 1px,transparent 1px);

    background-size:28px 28px;

    opacity:0;

    transform:rotate(12deg);

    transition:var(--transition);
}

.category-card:hover{

    background:var(--surface-light);

    border-color:var(--gold);

    transform:translateY(-6px);
}

.category-card:hover::before{

    opacity:.5;
}

.category-card__icon{

    position:relative;

    z-index:1;

    width:58px;

    height:58px;

    display:grid;

    place-items:center;

    margin-bottom:22px;

    border-radius:14px;

    background:rgba(198,161,91,.12);

    color:var(--gold);

    font-size:22px;

    transition:var(--transition);
}

.category-card:hover .category-card__icon{

    background:var(--gold);

    color:#1B140F;
}

.category-card__title{

    position:relative;

    z-index:1;

    margin-bottom:10px;

    font-size:19px;

    font-weight:700;

    color:var(--white);
}

.category-card__text{

    position:relative;

    z-index:1;

    margin-bottom:22px;

    color:var(--text-muted);

    font-size:14px;

    line-height:1.8;
}

.category-card__count{

    position:relative;

    z-index:1;

    display:inline-flex;

    align-items:center;

    gap:8px;

    font-size:13px;

    font-weight:600;

    color:var(--gold-light);
}

.category-card__arrow{

    position:absolute;

    z-index:1;

    left:30px;

    bottom:34px;

    width:34px;

    height:34px;

    display:grid;

    place-items:center;

    border-radius:50%;

    border:1px solid var(--border);

    color:var(--text-muted);

    transition:var(--transition);
}

.category-card:hover .category-card__arrow{

    background:var(--gold);

    border-color:var(--gold);

    color:#1B140F;

    transform:translateX(-4px);
}

/*==================================================
            PRODUCTS
==================================================*/

.products{

    background:var(--surface);

    border-top:1px solid var(--border);

    border-bottom:1px solid var(--border);
}

.products__tabs{

    display:flex;

    align-items:center;

    gap:8px;

    background:var(--bg);

    padding:6px;

    border-radius:999px;

    border:1px solid var(--border);
}

.products__tab{

    padding:10px 22px;

    border-radius:999px;

    font-size:14px;

    font-weight:600;

    color:var(--text-muted);

    transition:var(--transition);
}

.products__tab:hover{

    color:var(--white);
}

.products__tab--active{

    background:var(--gold);

    color:#1B140F;
}

.products__grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:26px;

    margin-top:52px;
}

.product-card{

    background:var(--bg);

    border:1px solid var(--border);

    border-radius:20px;

    overflow:hidden;

    transition:var(--transition);
}

.product-card:hover{

    transform:translateY(-6px);

    border-color:var(--gold);

    box-shadow:var(--shadow);
}

.product-card__media{

    position:relative;

    height:230px;

    background-size:16px 16px;

    background-image:

        linear-gradient(rgba(0,0,0,.12) 1px,transparent 1px),

        linear-gradient(90deg,rgba(0,0,0,.12) 1px,transparent 1px);
}

.product-card__media--1{ background-color:#8C6A45; }
.product-card__media--2{ background-color:#B08968; }
.product-card__media--3{ background-color:#5C534A; }
.product-card__media--4{ background-color:#D8CFC2; }
.product-card__media--5{ background-color:#A78B6B; }
.product-card__media--6{ background-color:#6E5541; }

.product-card__media--4::after,
.product-card__media--4::before{

    content:"";
}

.product-card__tag{

    position:absolute;

    top:16px;

    right:16px;

    padding:6px 14px;

    border-radius:999px;

    background:var(--gold);

    color:#1B140F;

    font-size:12px;

    font-weight:700;
}

.product-card__body{

    padding:22px 24px 26px;
}

.product-card__cat{

    display:inline-block;

    margin-bottom:8px;

    font-size:12px;

    font-weight:600;

    color:var(--gold-light);
}

.product-card__title{

    margin-bottom:6px;

    font-size:17px;

    font-weight:700;

    color:var(--white);
}

.product-card__code{

    margin-bottom:18px;

    font-size:13px;

    color:var(--text-muted);
}

.product-card__foot{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding-top:16px;

    border-top:1px solid var(--border);
}

.product-card__price{

    font-size:14px;

    font-weight:600;

    color:var(--text);
}

.product-card__btn{

    width:38px;

    height:38px;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:var(--surface);

    color:var(--text-muted);

    transition:var(--transition);
}

.product-card__btn:hover{

    background:var(--gold);

    color:#1B140F;
}

.products__more{

    margin-top:50px;

    text-align:center;
}

/*==================================================
            BANNER
==================================================*/

.banner{

    background:
        linear-gradient(180deg,rgba(36,24,19,.90),rgba(36,24,19,.96)),
        url("../images/patterns/tile-grid.svg");

    background-size:auto,80px 80px;
}

.banner__wrapper{

    display:grid;

    grid-template-columns:1.2fr .8fr;

    gap:60px;

    align-items:center;

    padding:60px;

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:28px;
}

.banner__title{

    margin:16px 0 20px;

    font-size:36px;

    font-weight:800;

    line-height:1.35;

    color:var(--white);
}

.banner__text{

    margin-bottom:30px;

    color:var(--text-muted);

    font-size:16px;

    line-height:1.9;

    max-width:480px;
}

.banner__stats{

    display:flex;

    flex-direction:column;

    gap:22px;

    padding-inline-start:40px;

    border-inline-start:1px solid var(--border);
}

.banner__stat{

    display:flex;

    align-items:center;

    gap:16px;
}

.banner__stat i{

    width:48px;

    height:48px;

    display:grid;

    place-items:center;

    border-radius:14px;

    background:rgba(198,161,91,.12);

    color:var(--gold);

    font-size:18px;

    flex-shrink:0;
}

.banner__stat strong{

    display:block;

    font-size:16px;

    font-weight:700;

    color:var(--white);
}

.banner__stat span{

    font-size:13px;

    color:var(--text-muted);
}

/*==================================================
            PROJECTS
==================================================*/

.projects{

    background:var(--bg);
}

.projects__grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;
}

.project-card{

    position:relative;

    display:block;

    height:340px;

    border-radius:20px;

    overflow:hidden;

    border:1px solid var(--border);
}

.project-card__media{

    position:absolute;

    inset:0;

    background-image:url("../images/projects/project-placeholder.svg");

    background-size:cover;

    background-position:center;

    transition:transform .5s ease;
}

.project-card:hover .project-card__media{

    transform:scale(1.06);
}

.project-card--1 .project-card__media{ filter:sepia(.25) hue-rotate(-6deg) saturate(1.1); }
.project-card--2 .project-card__media{ filter:sepia(.4) hue-rotate(10deg) saturate(1.2); }
.project-card--3 .project-card__media{ filter:sepia(.15) saturate(1.3); }
.project-card--4 .project-card__media{ filter:sepia(.35) hue-rotate(-14deg) saturate(1.1); }
.project-card--5 .project-card__media{ filter:sepia(.2) hue-rotate(4deg) saturate(1.25); }
.project-card--6 .project-card__media{ filter:sepia(.3) hue-rotate(-2deg) saturate(1.15); }

.project-card::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(180deg,rgba(20,13,10,0) 40%,rgba(20,13,10,.92) 100%);

    z-index:1;
}

.project-card__info{

    position:absolute;

    z-index:2;

    right:26px;

    left:26px;

    bottom:24px;
}

.project-card__info span{

    display:inline-block;

    margin-bottom:8px;

    padding:4px 12px;

    border-radius:999px;

    background:rgba(198,161,91,.18);

    color:var(--gold-light);

    font-size:12px;

    font-weight:600;
}

.project-card__info h3{

    margin-bottom:4px;

    font-size:19px;

    font-weight:700;

    color:var(--white);
}

.project-card__info p{

    font-size:13px;

    color:var(--text-muted);
}

/*==================================================
                ABOUT
==================================================*/

.about{

    background:var(--surface);

    border-top:1px solid var(--border);

    border-bottom:1px solid var(--border);
}

.about__wrapper{

    display:grid;

    grid-template-columns:.85fr 1.15fr;

    gap:70px;

    align-items:center;
}

.about__media{

    position:relative;
}

.about__media-main{

    height:460px;

    border-radius:24px;

    background-image:url("../images/projects/project-placeholder.svg");

    background-size:cover;

    background-position:center;

    filter:sepia(.2) saturate(1.15);

    border:1px solid var(--border);
}

.about__media-badge{

    position:absolute;

    bottom:-28px;

    left:-28px;

    display:flex;

    align-items:center;

    gap:16px;

    max-width:260px;

    padding:22px 24px;

    background:var(--gold);

    border-radius:18px;

    box-shadow:var(--shadow);
}

.about__media-badge strong{

    font-size:30px;

    font-weight:800;

    color:#1B140F;
}

.about__media-badge span{

    font-size:12.5px;

    font-weight:600;

    line-height:1.5;

    color:#3B2C1B;
}

.about__features{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:16px;

    margin:28px 0 34px;
}

.about__features li{

    display:flex;

    align-items:center;

    gap:10px;

    font-size:14.5px;

    font-weight:600;

    color:var(--text);
}

.about__features i{

    width:26px;

    height:26px;

    flex-shrink:0;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:rgba(198,161,91,.15);

    color:var(--gold);

    font-size:12px;
}

/*==================================================
            STATISTICS
==================================================*/

.stats{

    padding:80px 0;

    background:
        linear-gradient(180deg,rgba(27,20,15,.95),rgba(27,20,15,.95)),
        url("../images/patterns/tile-grid.svg");

    background-size:auto,80px 80px;

    border-bottom:1px solid var(--border);
}

.stats__grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:24px;
}

.stat-item{

    text-align:center;

    padding:34px 20px;

    border-inline-end:1px solid var(--border);
}

.stat-item:last-child{

    border-inline-end:none;
}

.stat-item i{

    display:inline-grid;

    place-items:center;

    width:52px;

    height:52px;

    margin-bottom:18px;

    border-radius:50%;

    background:rgba(198,161,91,.12);

    color:var(--gold);

    font-size:20px;
}

.stat-item__number{

    display:block;

    margin-bottom:8px;

    font-size:44px;

    font-weight:800;

    color:var(--white);

    font-variant-numeric:tabular-nums;
}

.stat-item__label{

    font-size:14px;

    color:var(--text-muted);
}

/*==================================================
                CTA
==================================================*/

.cta{

    background:var(--bg);
}

.cta__wrapper{

    position:relative;

    text-align:center;

    max-width:720px;

    margin-inline:auto;

    padding:70px 40px;

    background:var(--surface);

    border:1px solid var(--border);

    border-radius:28px;

    overflow:hidden;
}

.cta__wrapper::before{

    content:"";

    position:absolute;

    inset:0;

    background:radial-gradient(circle at 50% 0%,rgba(198,161,91,.16),transparent 60%);
}

.cta__title{

    position:relative;

    margin-bottom:16px;

    font-size:32px;

    font-weight:800;

    color:var(--white);
}

.cta__text{

    position:relative;

    max-width:560px;

    margin:0 auto 34px;

    color:var(--text-muted);

    font-size:16px;

    line-height:1.9;
}

.cta__buttons{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:16px;
}

.cta__buttons .btn i{

    margin-inline-start:8px;
}

/*==================================================
                FOOTER
==================================================*/

.footer{

    padding-top:90px;

    background:var(--surface);

    border-top:1px solid var(--border);
}

.footer__top{

    display:grid;

    grid-template-columns:1.4fr 1fr 1fr 1.2fr;

    gap:40px;

    padding-bottom:60px;
}

.footer__logo{

    height:46px;

    width:auto;

    margin-bottom:20px;
}

.footer__col--about p{

    margin-bottom:24px;

    color:var(--text-muted);

    font-size:14px;

    line-height:1.9;

    max-width:320px;
}

.footer__social{

    display:flex;

    align-items:center;

    gap:12px;
}

.footer__social a{

    width:40px;

    height:40px;

    display:grid;

    place-items:center;

    border-radius:50%;

    background:var(--surface-light);

    color:var(--text);

    transition:var(--transition);
}

.footer__social a:hover{

    background:var(--gold);

    color:#1B140F;
}

.footer__title{

    margin-bottom:22px;

    font-size:16px;

    font-weight:700;

    color:var(--white);
}

.footer__links,
.footer__contact{

    display:flex;

    flex-direction:column;

    gap:14px;
}

.footer__links a{

    font-size:14px;

    color:var(--text-muted);

    transition:var(--transition);
}

.footer__links a:hover{

    color:var(--gold);

    padding-inline-start:4px;
}

.footer__contact li{

    display:flex;

    align-items:flex-start;

    gap:10px;

    font-size:13.5px;

    line-height:1.8;

    color:var(--text-muted);
}

.footer__contact a{

    color:var(--text-muted);

    transition:var(--transition);
}

.footer__contact a:hover{

    color:var(--gold);
}

.footer__contact i{

    margin-top:3px;

    color:var(--gold);

    font-size:13px;

    flex-shrink:0;
}

.footer__bottom{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:26px 0;

    border-top:1px solid var(--border);

    font-size:13px;

    color:var(--text-muted);
}

/*==================================================
            ANIMATIONS
==================================================*/

@media (prefers-reduced-motion:reduce){

    *,
    *::before,
    *::after{

        animation-duration:.001ms !important;

        animation-iteration-count:1 !important;

        transition-duration:.001ms !important;

        scroll-behavior:auto !important;
    }
}

/*================ Utilities ================*/

body.no-scroll{

    overflow:hidden;
}

/*================ Focus states ================*/

a:focus-visible,
button:focus-visible,
input:focus-visible{

    outline:2px solid var(--gold);

    outline-offset:3px;
}

/* WordPress integration */
.header__menu,.mobile-menu__list,.footer__links{list-style:none;margin:0;padding:0}.header__menu{display:flex}.header__menu>li{position:relative}.header__menu a{display:block}.page-content,.archive-products,.archive-projects,.single-project{padding:160px 0 100px;min-height:65vh}.entry-content{line-height:2}.product-card__title a{color:inherit}.single-project img,.project-gallery img{width:100%;height:auto;border-radius:4px}.project-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:30px}@media(max-width:768px){.project-gallery{grid-template-columns:1fr}.page-content,.archive-products,.archive-projects,.single-project{padding-top:120px}}


/* ==================================================
   Production animation resilience
   ================================================== */
.aos-native.aos-reveal-ready [data-aos] {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity .7s ease-out, transform .7s cubic-bezier(.22, 1, .36, 1);
    will-change: opacity, transform;
}
.aos-native.aos-reveal-ready [data-aos="fade-left"] { transform: translate3d(-34px, 0, 0); }
.aos-native.aos-reveal-ready [data-aos="fade-right"] { transform: translate3d(34px, 0, 0); }
.aos-native.aos-reveal-ready [data-aos].aos-native--visible { opacity: 1; transform: translate3d(0, 0, 0); }
.product-card { transition: opacity .25s ease, transform .35s ease, border-color .35s ease, box-shadow .35s ease; }
.product-card--filtered-out { opacity: 0; transform: translateY(12px) scale(.98); pointer-events: none; }
.header__menu > li { position: relative; }
.header__menu > li > a { position: relative; }
.header__toggle span { transition: transform .3s ease, opacity .3s ease; }
.header__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.header__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.header__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
}
.reduce-motion [data-aos] { opacity: 1 !important; transform: none !important; }

/* ==================================================
   Product showcase — v1.3.0
   One fitted image, arrow navigation, compact first view
   ================================================== */
body.single-product {
    padding: 0 !important;
    min-height: 100%;
}

body.product-dialog-open {
    overflow: hidden;
}

.product-page {
    min-height: 100svh;
}

.product-showcase {
    position: relative;
    min-height: 100svh;
    display: flex;
    align-items: center;
    padding: clamp(112px, 12vh, 142px) 0 42px;
    overflow: hidden;
    background:
        radial-gradient(circle at 18% 18%, rgba(198, 161, 91, .10), transparent 34%),
        radial-gradient(circle at 88% 80%, rgba(255, 255, 255, .035), transparent 35%),
        var(--bg);
}

.product-showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .18;
    background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 48px 48px;
    mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
}

.product-showcase__container {
    position: relative;
    z-index: 1;
}

.product-showcase__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.16fr) minmax(340px, .84fr);
    grid-template-areas:
        "viewer summary"
        "viewer details";
    grid-template-rows: auto 1fr;
    column-gap: clamp(30px, 4vw, 64px);
    row-gap: 22px;
    align-items: start;
}

.product-summary {
    grid-area: summary;
    min-width: 0;
}

.product-summary__topline,
.product-summary__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
}

.product-summary__topline {
    margin-bottom: 14px;
}

.product-summary__category,
.product-summary__collection,
.product-summary__badge,
.product-summary__code {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    font-size: 12px;
    line-height: 1.5;
}

.product-summary__category a,
.product-summary__collection a {
    color: inherit;
}

.product-summary__category,
.product-summary__collection {
    color: var(--gold-light);
}

.product-summary__badge {
    min-height: 28px;
    padding: 4px 11px;
    border: 1px solid rgba(198, 161, 91, .48);
    border-radius: 999px;
    color: #21150f;
    background: linear-gradient(135deg, #b88c49, #dbbb79 52%, #a97e3e);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28);
    font-weight: 800;
}

.product-summary__title {
    margin: 0 0 15px;
    color: var(--white);
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.25;
    font-weight: 900;
    letter-spacing: -.025em;
}

.product-summary__excerpt {
    display: -webkit-box;
    max-width: 650px;
    margin: 0;
    overflow: hidden;
    color: var(--text);
    font-size: 15.5px;
    line-height: 1.95;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.product-summary__meta {
    margin-top: 15px;
    color: var(--text-muted);
}

.product-summary__code {
    direction: rtl;
}

.product-summary__code b {
    color: var(--text);
    font-weight: 600;
}

.product-summary__meta-icon {
    width: 18px;
    height: 18px;
    color: var(--gold);
}

.product-viewer-shell {
    grid-area: viewer;
    position: relative;
    min-width: 0;
    height: clamp(460px, calc(100svh - 182px), 700px);
    border: 1px solid rgba(198, 161, 91, .22);
    border-radius: 24px;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 50% 30%, rgba(255,255,255,.07), transparent 58%),
        linear-gradient(150deg, rgba(255,255,255,.035), rgba(198,161,91,.035)),
        #211612;
    box-shadow: 0 26px 70px rgba(0, 0, 0, .28);
}

.product-viewer-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05), inset 0 -1px 0 rgba(0,0,0,.25);
}

.product-viewer,
.product-viewer__track,
.product-viewer__slide {
    width: 100%;
    height: 100%;
}

.product-viewer {
    direction: ltr;
    overflow: hidden;
    touch-action: pan-y;
    cursor: grab;
}

.product-viewer:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: -4px;
}

.product-viewer__track {
    display: flex;
    will-change: transform;
    transition: transform .46s cubic-bezier(.22, 1, .36, 1);
}

.product-viewer__slide {
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(10px, 1.7vw, 22px);
}

.product-viewer--dragging {
    cursor: grabbing;
}

.product-viewer--dragging .product-viewer__track,
.product-viewer--no-motion .product-viewer__track {
    transition: none;
}

.product-viewer__image {
    display: block;
    width: 100%;
    height: 100% !important;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
    object-position: center;
    border-radius: 15px !important;
    user-select: none;
    -webkit-user-drag: none;
}

.product-viewer__nav {
    position: absolute;
    top: 50%;
    z-index: 8;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(216, 180, 109, .58);
    border-radius: 50%;
    color: var(--white);
    background: rgba(36, 24, 19, .86);
    box-shadow: 0 10px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transform: translateY(-50%);
    transition: transform .22s ease, color .22s ease, background-color .22s ease, border-color .22s ease;
}

.product-viewer__nav svg {
    width: 22px;
    height: 22px;
    stroke-width: 2.25;
}

.product-viewer__nav--next {
    left: 17px;
}

.product-viewer__nav--prev {
    right: 17px;
}

.product-viewer__nav:disabled {
    opacity: .35;
    pointer-events: none;
}

.product-viewer__status {
    position: absolute;
    inset: auto 50% 17px auto;
    z-index: 8;
    min-width: 74px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    direction: ltr;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    color: var(--white);
    background: rgba(25, 17, 14, .78);
    box-shadow: 0 8px 24px rgba(0,0,0,.22);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transform: translateX(50%);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}

.product-viewer__status-divider {
    color: var(--gold);
}

.product-viewer__progress {
    position: absolute;
    right: 22px;
    left: 22px;
    bottom: 0;
    z-index: 7;
    height: 2px;
    overflow: hidden;
    background: rgba(255,255,255,.10);
}

.product-viewer__progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--gold-light));
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform .4s ease;
}

.product-viewer__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 24px;
    color: var(--text-muted);
    text-align: center;
}

.product-viewer__placeholder svg {
    width: 54px;
    height: 54px;
    color: var(--gold);
}

.product-primary-details {
    grid-area: details;
    min-width: 0;
}

.product-spec-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.product-spec-card {
    min-width: 0;
    min-height: 102px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    column-gap: 9px;
    align-content: center;
    padding: 12px 11px;
    border: 1px solid rgba(198, 161, 91, .16);
    border-radius: 15px;
    background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}

.product-spec-card__icon {
    grid-row: 1 / 3;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    align-self: center;
    border: 1px solid rgba(216,180,109,.44);
    border-radius: 11px;
    color: #231710;
    background: linear-gradient(135deg, #ad8242, #d8b46d 55%, #a77839);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 7px 18px rgba(0,0,0,.15);
}

.product-spec-card__icon svg {
    width: 20px;
    height: 20px;
    stroke-width: 1.9;
}

.product-spec-card dt {
    min-width: 0;
    color: var(--text-muted);
    font-size: 10.5px;
    line-height: 1.4;
}

.product-spec-card dd {
    display: -webkit-box;
    min-width: 0;
    margin: 2px 0 0;
    overflow: hidden;
    color: var(--white);
    font-size: 12.5px;
    line-height: 1.55;
    font-weight: 700;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    gap: 10px;
    margin-top: 13px;
}

.product-action {
    min-width: 0;
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 12px;
    border: 1px solid rgba(198, 161, 91, .42);
    border-radius: 14px;
    color: var(--white);
    background: linear-gradient(145deg, rgba(198,161,91,.10), rgba(255,255,255,.025));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
    font-family: inherit;
    font-size: 12.5px;
    line-height: 1.35;
    font-weight: 700;
    text-align: center;
    transition: transform .22s ease, border-color .22s ease, background-color .22s ease;
}

.product-action svg {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    color: var(--gold-light);
}

.product-action--contact {
    border-color: rgba(216, 180, 109, .62);
    color: #21150f;
    background: linear-gradient(135deg, #aa7f3e, #d8b46d 52%, #aa7e3d);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 8px 20px rgba(0,0,0,.14);
}

.product-action--contact svg {
    color: #21150f;
}

.product-details-dialog {
    width: min(760px, calc(100% - 32px));
    max-width: 760px;
    max-height: 86dvh;
    margin: auto;
    padding: 0;
    border: 0;
    border-radius: 22px;
    color: var(--text);
    background: transparent;
    overflow: visible;
}

.product-details-dialog:not([open]) {
    display: none;
}

.product-details-dialog::backdrop {
    background: rgba(12, 8, 6, .76);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.product-details-dialog__panel {
    max-height: 86dvh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(198, 161, 91, .28);
    border-radius: 22px;
    background: linear-gradient(150deg, #35241c, #261914 62%);
    box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);
    animation: nikanDialogIn .26s cubic-bezier(.22, 1, .36, 1);
}

.product-details-dialog__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    border-bottom: 1px solid rgba(198,161,91,.18);
}

.product-details-dialog__header span {
    color: var(--gold);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
}

.product-details-dialog__header h2 {
    margin: 3px 0 0;
    color: var(--white);
    font-size: 24px;
    line-height: 1.4;
}

.product-details-dialog__close {
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 50%;
    color: var(--white);
    background: rgba(255,255,255,.045);
}

.product-details-dialog__close svg {
    width: 21px;
    height: 21px;
}

.product-details-dialog__body {
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 22px;
    scrollbar-width: thin;
    scrollbar-color: var(--gold) transparent;
}

.product-details-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin: 0 0 24px;
}

.product-details-list > div {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 13px;
    border: 1px solid rgba(198,161,91,.14);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
}

.product-details-list dt {
    color: var(--text-muted);
    font-size: 12px;
}

.product-details-list dd {
    min-width: 0;
    margin: 0;
    color: var(--white);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    overflow-wrap: anywhere;
}

.product-details-dialog__section + .product-details-dialog__section {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid rgba(198,161,91,.16);
}

.product-details-dialog__section h3 {
    margin: 0 0 11px;
    color: var(--gold-light);
    font-size: 17px;
}

.product-details-dialog__section p,
.product-details-dialog__section .entry-content {
    color: var(--text);
    font-size: 14px;
    line-height: 2;
}

@keyframes nikanDialogIn {
    from { opacity: 0; transform: translateY(18px) scale(.985); }
    to { opacity: 1; transform: none; }
}

@media (hover: hover) and (pointer: fine) {
    .product-viewer__nav:hover {
        color: #21150f;
        border-color: var(--gold-light);
        background: var(--gold-light);
        transform: translateY(-50%) scale(1.055);
    }

    .product-action:hover {
        border-color: var(--gold);
        background-color: rgba(198,161,91,.13);
        transform: translateY(-2px);
    }

    .product-action--contact:hover {
        background: linear-gradient(135deg, #b88b48, #e0c080 52%, #b48847);
    }
}

@media (max-width: 1100px) {
    .product-showcase__layout {
        grid-template-columns: minmax(0, 1.02fr) minmax(320px, .98fr);
        column-gap: 28px;
    }

    .product-summary__title {
        font-size: clamp(32px, 4vw, 45px);
    }

    .product-viewer-shell {
        height: clamp(430px, calc(100svh - 175px), 620px);
    }
}

@media (max-width: 900px) {
    .product-showcase {
        min-height: auto;
        align-items: flex-start;
        padding: 102px 0 32px;
        overflow: visible;
    }

    .product-showcase__layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "summary"
            "viewer"
            "details";
        gap: 16px;
    }

    .product-summary__title {
        margin-bottom: 10px;
        font-size: clamp(30px, 6vw, 40px);
    }

    .product-summary__excerpt {
        max-width: none;
        font-size: 14.5px;
        line-height: 1.85;
        -webkit-line-clamp: 3;
    }

    .product-viewer-shell {
        height: clamp(320px, 50vw, 510px);
        border-radius: 20px;
    }

    .product-spec-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .product-showcase {
        padding: 88px 0 25px;
    }

    .product-showcase__layout {
        gap: 12px;
    }

    .product-summary__topline {
        margin-bottom: 8px;
    }

    .product-summary__title {
        margin-bottom: 7px;
        font-size: clamp(26px, 7.2vw, 34px);
        line-height: 1.3;
    }

    .product-summary__excerpt {
        font-size: 13.5px;
        line-height: 1.75;
        -webkit-line-clamp: 2;
    }

    .product-summary__meta {
        margin-top: 9px;
    }

    .product-viewer-shell {
        height: clamp(250px, 38dvh, 365px);
        border-radius: 17px;
    }

    .product-viewer__slide {
        padding: 8px;
    }

    .product-viewer__image {
        border-radius: 11px !important;
    }

    .product-viewer__nav {
        width: 42px;
        height: 42px;
    }

    .product-viewer__nav--next {
        left: 9px;
    }

    .product-viewer__nav--prev {
        right: 9px;
    }

    .product-viewer__status {
        bottom: 10px;
        height: 30px;
        min-width: 68px;
    }

    .product-spec-grid {
        gap: 7px;
    }

    .product-spec-card {
        min-height: 83px;
        grid-template-columns: 31px minmax(0, 1fr);
        column-gap: 6px;
        padding: 8px 7px;
        border-radius: 12px;
    }

    .product-spec-card__icon {
        width: 31px;
        height: 31px;
        border-radius: 9px;
    }

    .product-spec-card__icon svg {
        width: 17px;
        height: 17px;
    }

    .product-spec-card dt {
        font-size: 9.5px;
    }

    .product-spec-card dd {
        font-size: 11.5px;
        line-height: 1.45;
    }

    .product-actions {
        gap: 7px;
        margin-top: 9px;
    }

    .product-action {
        min-height: 46px;
        padding: 7px 8px;
        border-radius: 12px;
        font-size: 11.5px;
    }

    .product-action svg {
        width: 18px;
        height: 18px;
    }

    .product-details-dialog {
        width: 100%;
        max-width: none;
        max-height: 88dvh;
        margin: auto 0 0;
        border-radius: 22px 22px 0 0;
    }

    .product-details-dialog__panel {
        max-height: 88dvh;
        border-radius: 22px 22px 0 0;
        animation-name: nikanSheetIn;
    }

    .product-details-dialog__panel::before {
        content: "";
        width: 42px;
        height: 4px;
        flex: 0 0 auto;
        margin: 9px auto 0;
        border-radius: 999px;
        background: rgba(255,255,255,.24);
    }

    .product-details-dialog__header {
        padding: 12px 16px 14px;
    }

    .product-details-dialog__header h2 {
        font-size: 20px;
    }

    .product-details-dialog__body {
        padding: 16px;
    }

    .product-details-list {
        grid-template-columns: 1fr;
    }
}

@keyframes nikanSheetIn {
    from { opacity: 0; transform: translateY(100%); }
    to { opacity: 1; transform: none; }
}

@media (max-width: 480px) {
    .product-showcase {
        padding-top: 84px;
    }

    .product-summary__category,
    .product-summary__collection,
    .product-summary__badge,
    .product-summary__code {
        font-size: 10.5px;
    }

    .product-summary__badge {
        min-height: 25px;
        padding: 3px 9px;
    }

    .product-viewer-shell {
        height: clamp(225px, 35dvh, 325px);
    }

    .product-viewer__nav {
        width: 39px;
        height: 39px;
    }

    .product-viewer__nav svg {
        width: 19px;
        height: 19px;
    }

    .product-spec-card {
        min-height: 78px;
    }

    .product-action {
        gap: 5px;
        font-size: 10.5px;
    }
}

@media (max-width: 360px) {
    .product-spec-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-viewer-shell {
        height: 230px;
    }
}

@media (max-width: 768px) and (max-height: 720px) {
    .product-showcase {
        padding-top: 82px;
    }

    .product-summary__excerpt {
        -webkit-line-clamp: 2;
    }

    .product-viewer-shell {
        height: clamp(215px, 32dvh, 270px);
    }

    .product-spec-card {
        min-height: 74px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .product-viewer__progress span,
    .product-viewer__nav,
    .product-action,
    .product-details-dialog__panel {
        transition: none !important;
        animation: none !important;
    }
}


/* Compact landscape/short desktop screens without hiding primary information. */
@media (min-width: 901px) and (max-height: 700px) {
    .product-showcase {
        padding-top: 98px;
        padding-bottom: 24px;
    }

    .product-showcase__layout {
        row-gap: 13px;
    }

    .product-summary__topline {
        margin-bottom: 8px;
    }

    .product-summary__title {
        margin-bottom: 8px;
        font-size: clamp(30px, 3.2vw, 42px);
    }

    .product-summary__excerpt {
        line-height: 1.75;
        -webkit-line-clamp: 3;
    }

    .product-summary__meta {
        margin-top: 8px;
    }

    .product-viewer-shell {
        height: calc(100svh - 122px);
        min-height: 430px;
    }

    .product-spec-card {
        min-height: 88px;
        padding-block: 9px;
    }

    .product-actions {
        margin-top: 9px;
    }
}

@media (max-width: 768px) {
    .product-actions {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(0, 1fr);
    }
}