:root{
    --front-bg:#ffffff;
    --front-paper:#f8f5f0;
    --front-black:#111111;
    --front-gold:#d7a84c;
    --front-gold-dark:#ad7922;
    --front-text:#211e1b;
    --front-muted:#746d66;
    --front-border:#e8dfd4;
    --front-shadow:0 16px 42px rgba(53,34,17,.09);
    --front-radius:16px
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    overflow-x:hidden;
    background:var(--front-bg);
    color:var(--front-text);
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased
}
img{max-width:100%}
a{-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit}
main{min-height:45vh}

.page-progress{
    position:fixed;
    left:0;
    top:0;
    width:0;
    height:3px;
    z-index:9999;
    background:linear-gradient(90deg,var(--front-gold-dark),var(--front-gold));
    box-shadow:0 0 12px rgba(215,168,76,.55);
    pointer-events:none
}

/* Header */
.site-header{
    transition:box-shadow .2s ease,transform .2s ease
}
.site-header.is-scrolled{
    box-shadow:0 8px 30px rgba(0,0,0,.1)
}
.main-header{
    transition:min-height .2s ease,padding .2s ease
}
.site-header.is-scrolled .main-header{
    min-height:80px
}
.site-header.is-scrolled .logo-with-image img{
    width:58px;
    height:58px
}
.logo-with-image img{
    border:1px solid #ece6de;
    box-shadow:0 5px 18px rgba(0,0,0,.07)
}
.nav-inner{
    scrollbar-width:none
}
.nav-inner::-webkit-scrollbar{display:none}
.nav-inner a{
    font-weight:700;
    letter-spacing:.1px
}

/* Page heroes */
.page-hero,
.content-page-hero,
.article-detail-hero{
    position:relative;
    overflow:hidden
}
.page-hero::after,
.content-page-hero::after,
.article-detail-hero::after{
    content:"";
    position:absolute;
    width:340px;
    height:340px;
    right:-110px;
    top:-130px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(215,168,76,.22),rgba(215,168,76,0) 68%);
    pointer-events:none
}
.page-hero .wrap,
.content-page-hero .wrap,
.article-detail-hero .wrap{
    position:relative;
    z-index:2
}

/* Cards and content sections */
.section,
.content-page-section,
.article-section,
.price-section{
    position:relative
}
.service-card,
.article-card,
.dynamic-video-card,
.content-admin-card,
.contact-map-info,
.contact-map-frame,
.checkout-card,
.checkout-order{
    box-shadow:var(--front-shadow)
}
.service-card,
.article-card,
.dynamic-video-card{
    overflow:hidden;
    transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease
}
.service-card:hover,
.article-card:hover,
.dynamic-video-card:hover{
    transform:translateY(-5px);
    border-color:#dac69f!important;
    box-shadow:0 22px 48px rgba(53,34,17,.14)
}
.service-card h3,
.article-card h2,
.article-card h3{
    line-height:1.3
}
.service-card p,
.article-card p{
    line-height:1.7
}

/* Image presentation */
.dynamic-gallery-item,
.article-image,
.video-embed,
.dynamic-video-card>img{
    background:
        linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,0)),
        #181818
}
.dynamic-gallery-item img,
.article-image img,
.dynamic-video-card>img{
    display:block;
    width:100%;
    object-fit:cover
}
.dynamic-gallery-item::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 48%,rgba(0,0,0,.67));
    pointer-events:none
}
.dynamic-gallery-item>span{
    z-index:2
}

/* Buttons */
.btn,
.admin-btn,
.checkout-submit,
.map-direction-btn,
.footer-book-button{
    transition:transform .18s ease,box-shadow .18s ease,filter .18s ease
}
.btn:hover,
.checkout-submit:hover,
.map-direction-btn:hover,
.footer-book-button:hover{
    transform:translateY(-2px);
    filter:brightness(1.03);
    box-shadow:0 12px 28px rgba(0,0,0,.16)
}
.btn:active,
.checkout-submit:active,
.map-direction-btn:active{
    transform:translateY(0)
}

/* Footer */
.site-footer{
    position:relative;
    overflow:hidden
}
.site-footer::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    left:-180px;
    bottom:-250px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(215,168,76,.14),transparent 68%)
}
.footer-grid-v220,
.footer-grid.modern{
    position:relative;
    z-index:2
}
.footer-grid h4{
    color:#fff;
    margin-bottom:18px;
    font-size:15px
}
.footer-grid p,
.footer-grid a{
    line-height:1.65
}
.footer-social a{
    transition:border-color .2s,background .2s,color .2s
}
.footer-social a:hover{
    border-color:var(--front-gold);
    background:rgba(215,168,76,.09);
    color:#fff
}

/* Back to top */
.back-to-top{
    position:fixed;
    right:22px;
    bottom:105px;
    z-index:170;
    width:44px;
    height:44px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:50%;
    background:#17120d;
    color:#fff;
    font-size:20px;
    box-shadow:0 12px 30px rgba(0,0,0,.25);
    opacity:0;
    visibility:hidden;
    transform:translateY(12px);
    transition:.2s;
    cursor:pointer
}
.back-to-top.visible{
    opacity:1;
    visibility:visible;
    transform:translateY(0)
}

/* Mobile quick bar */
.mobile-quick-bar{
    display:none
}

/* Scroll reveal */
[data-reveal]{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .6s ease,transform .6s ease
}
[data-reveal].revealed{
    opacity:1;
    transform:none
}

/* Better empty states */
.article-empty,
.map-not-configured{
    border:1px dashed #d9ccbb;
    background:linear-gradient(180deg,#fff,#fbf7f1)
}

@media(max-width:980px){
    .wrap{
        padding-left:18px!important;
        padding-right:18px!important
    }
    .footer-grid.modern,
    .footer-grid-v220{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:30px!important
    }
}

@media(max-width:700px){
    body{
        padding-bottom:72px
    }
    .site-header.is-scrolled .main-header{
        min-height:68px
    }
    .site-header.is-scrolled .logo-with-image img{
        width:46px;
        height:46px
    }
    .main-nav.open{
        box-shadow:0 20px 30px rgba(0,0,0,.08)
    }
    .nav-inner{
        max-height:65vh;
        overflow-y:auto
    }
    .section,
    .content-page-section,
    .article-section,
    .price-section{
        padding-top:42px!important;
        padding-bottom:42px!important
    }
    .page-hero,
    .content-page-hero,
    .article-detail-hero{
        padding-top:48px!important;
        padding-bottom:48px!important
    }
    .page-hero h1,
    .content-page-hero h1,
    .article-detail-hero h1{
        font-size:34px!important;
        line-height:1.14!important
    }
    .page-hero p,
    .content-page-hero p,
    .article-detail-hero p{
        font-size:14px!important
    }
    .footer-grid.modern,
    .footer-grid-v220{
        grid-template-columns:1fr!important;
        gap:25px!important
    }
    .footer-grid>div{
        padding-bottom:18px;
        border-bottom:1px solid rgba(255,255,255,.08)
    }
    .footer-grid>div:last-child{
        border-bottom:0
    }
    .copyright{
        text-align:center;
        align-items:center
    }
    .support-widget{
        right:14px!important;
        bottom:82px!important
    }
    .support-main-button{
        width:54px!important;
        height:54px!important;
        font-size:11px!important
    }
    .back-to-top{
        right:16px;
        bottom:146px;
        width:40px;
        height:40px
    }
    .mobile-quick-bar{
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        z-index:165;
        display:grid;
        grid-template-columns:repeat(4,1fr);
        min-height:66px;
        padding:6px 8px calc(6px + env(safe-area-inset-bottom));
        background:rgba(17,17,17,.97);
        border-top:1px solid rgba(255,255,255,.12);
        box-shadow:0 -8px 24px rgba(0,0,0,.17);
        backdrop-filter:blur(12px)
    }
    .mobile-quick-bar a{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:3px;
        color:#fff;
        border-radius:8px;
        text-decoration:none
    }
    .mobile-quick-bar a:active{
        background:rgba(255,255,255,.09)
    }
    .mobile-quick-bar span{
        display:grid;
        place-items:center;
        min-width:23px;
        height:23px;
        color:var(--front-gold);
        font-size:17px;
        font-weight:900
    }
    .mobile-quick-bar small{
        font-size:9px;
        font-weight:800
    }
    .mobile-cart-link{
        position:relative
    }
}

@media(prefers-reduced-motion:reduce){
    *,
    *::before,
    *::after{
        scroll-behavior:auto!important;
        animation-duration:.01ms!important;
        animation-iteration-count:1!important;
        transition-duration:.01ms!important
    }
}


/* V3.1.2 - Footer gọn, chuyên nghiệp */
.copyright-centered{
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
}
.copyright-centered span{
    width:100%;
    line-height:1.6;
}
