/* Artwork Empire — design tokens & shared primitives
 * Loaded on every page. Page-specific styles live alongside in front-page.css, product.css, etc.
 */

:root{
    --col-primary:#2C3A2E;
    --col-lite:#FAF7F0;
    --col-parchment:#F2E8C9;
    --col-green-deep:#3D6B4A;
    --col-green-mid:#6A9F6E;
    --col-sienna:#B85C2A;
    --col-grey:#8A9188;
    --col-border:#DFD9CC;
    --col-white:#FFFFFF;
    --cta-primary:#3D6B4A;
    --cta-primary-h:#2e5339;
    --cta-secondary:#B85C2A;
    --outer:clamp(24px,5vw,80px);
    --section-py:clamp(80px,9vw,128px);
    --content:1320px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'DM Sans',sans-serif;background:var(--col-lite);color:var(--col-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased;}
img{display:block;max-width:100%;}
a{text-decoration:none;color:inherit;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}

/* Typography primitives */
.lbl{font-size:12px;font-weight:500;letter-spacing:0.14em;text-transform:uppercase;color:var(--col-grey);}
.t-display{font-family:'Cormorant Garamond',serif;font-size:clamp(44px,7vw,92px);font-weight:400;line-height:1.0;letter-spacing:-0.025em;}
.t-display em{font-style:italic;color:var(--col-parchment);}
.t-h2{font-family:'Cormorant Garamond',serif;font-size:clamp(28px,3.5vw,48px);font-weight:400;line-height:1.12;}
.t-h2 em{font-style:italic;color:var(--col-sienna);}
.t-body{font-size:15px;line-height:1.82;color:rgba(44,58,46,0.82);}
.t-sm{font-size:13px;color:var(--col-grey);}

/* Section heading wrapper */
.sh{margin-bottom:clamp(36px,5vw,60px);}
.sh .lbl{display:block;margin-bottom:14px;}
.sh-row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;padding:0 32px;height:52px;border:1.5px solid transparent;transition:all 0.22s ease;cursor:pointer;}
.btn-green{background:var(--cta-primary);color:#fff;border-color:var(--cta-primary);}
.btn-green:hover{background:var(--cta-primary-h);}
.btn-outline{background:transparent;color:var(--col-primary);border-color:var(--col-primary);}
.btn-outline:hover{background:var(--col-primary);color:var(--col-lite);}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,0.5);}
.btn-ghost:hover{background:#fff;color:var(--col-primary);}
.btn-sienna{background:var(--cta-secondary);color:#fff;border-color:var(--cta-secondary);}
.btn-sienna:hover{background:#9a4a20;}

/* Arrow link */
.arr{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--col-primary);transition:gap 0.2s;}
.arr::after{content:'→';font-family:'Cormorant Garamond',serif;font-size:16px;}
.arr:hover{gap:14px;}

/* Reveal-on-scroll primitive (paired with av-front-page.js IntersectionObserver) */
.rv{opacity:0;transform:translateY(28px);transition:opacity 0.75s ease,transform 0.75s ease;}
.rv.in{opacity:1;transform:none;}
.rv-d1{transition-delay:.1s;}
.rv-d2{transition-delay:.2s;}
.rv-d3{transition-delay:.3s;}
.rv-d4{transition-delay:.4s;}

@keyframes fadeUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}

/* ───── NAV (header.php) ───── */
.site-nav{position:fixed;top:0;left:0;right:0;z-index:900;background:rgba(250,247,240,0.95);backdrop-filter:blur(16px);border-bottom:1px solid var(--col-border);transition:box-shadow 0.3s;}
.site-nav.scrolled{box-shadow:0 2px 24px rgba(44,58,46,0.08);}
.nav-inner{max-width:var(--content);margin:0 auto;padding:0 var(--outer);height:72px;display:flex;align-items:center;justify-content:space-between;gap:32px;}
.nav-logo{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.nav-logo img{height:46px;width:auto;}
.nav-wordmark{font-family:'Cormorant Garamond',serif;font-size:18px;font-weight:500;color:var(--col-primary);line-height:1.1;}
.nav-wordmark small{display:block;font-family:'DM Sans',sans-serif;font-size:9px;font-weight:400;letter-spacing:0.18em;text-transform:uppercase;color:var(--col-grey);margin-top:2px;}
.nav-links{display:flex;gap:28px;list-style:none;}
.nav-links a{font-size:12px;font-weight:400;letter-spacing:0.08em;text-transform:uppercase;opacity:0.6;transition:opacity 0.2s;}
.nav-links a:hover{opacity:1;}
.nav-right{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.nav-lang-wrap{position:relative;}
.nav-lang-btn{display:flex;align-items:center;gap:5px;padding:6px 10px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;color:var(--col-primary);background:none;border:none;cursor:pointer;opacity:0.6;transition:opacity 0.2s;}
.nav-lang-btn:hover{opacity:1;}
.nav-lang-flag{font-size:16px;line-height:1;}
.nav-lang-code{letter-spacing:0.06em;text-transform:uppercase;}
.nav-lang-caret{transition:transform 0.2s;}
.nav-lang-wrap.open .nav-lang-caret{transform:rotate(180deg);}
.nav-lang-dd{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--col-white);border:1px solid var(--col-border);border-radius:4px;box-shadow:0 4px 20px rgba(44,58,46,0.1);min-width:148px;z-index:1000;padding:4px 0;}
.nav-lang-wrap.open .nav-lang-dd{display:block;}
.nav-lang-dd a{display:flex;align-items:center;gap:10px;padding:9px 16px;font-size:13px;color:var(--col-primary);transition:background 0.15s;}
.nav-lang-dd a:hover,.nav-lang-dd a.current{background:var(--col-lite);}
.nav-icon-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;opacity:0.55;transition:opacity 0.2s;color:var(--col-primary);}
.nav-icon-btn:hover{opacity:1;}
.nav-cart-wrap{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;opacity:0.65;transition:opacity 0.2s;color:var(--col-primary);}
.nav-cart-wrap:hover{opacity:1;}
.nav-cart-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;background:var(--cta-secondary);color:#fff;font-size:10px;font-weight:700;border-radius:9px;letter-spacing:0;}
.nav-cart-count:empty{display:none;}

/* ───── MARQUEE (used on front-page) ───── */
.marquee{background:var(--col-green-deep);padding:14px 0;overflow:hidden;}
.marquee:hover .marquee-track{animation-play-state:paused;}
.marquee-track{display:inline-flex;animation:marqueeScroll 28s linear infinite;white-space:nowrap;}
.marquee-item{font-size:11px;letter-spacing:0.15em;text-transform:uppercase;color:rgba(242,232,201,0.6);padding:0 30px;display:inline-flex;align-items:center;gap:30px;}
.marquee-dot{width:3px;height:3px;background:rgba(242,232,201,0.4);border-radius:50%;}
@keyframes marqueeScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ───── FOOTER (footer.php) ───── */
.site-footer{background:var(--col-primary);padding:72px var(--outer) 40px;}
.footer-inner{max-width:var(--content);margin:0 auto;}
.footer-grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:64px;padding-bottom:56px;border-bottom:1px solid rgba(255,255,255,0.07);margin-bottom:36px;}
.footer-brand{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:400;color:var(--col-lite);margin-bottom:14px;}
.footer-tag{font-size:13px;color:rgba(250,247,240,0.36);line-height:1.7;max-width:270px;margin-bottom:26px;}
.footer-socials{display:flex;gap:18px;}
.footer-socials a{font-size:12px;color:rgba(250,247,240,0.36);transition:color 0.2s;}
.footer-socials a:hover{color:var(--col-parchment);}
.footer-col-title{font-size:10px;font-weight:600;letter-spacing:0.15em;text-transform:uppercase;color:rgba(250,247,240,0.28);margin-bottom:18px;}
.footer-ul{list-style:none;display:flex;flex-direction:column;gap:12px;}
.footer-ul a{font-size:13px;color:rgba(250,247,240,0.52);transition:color 0.2s;}
.footer-ul a:hover{color:var(--col-parchment);}
.footer-payment{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap;}
.footer-payment span{font-size:11px;font-weight:600;padding:4px 8px;background:rgba(255,255,255,0.06);color:rgba(250,247,240,0.35);letter-spacing:0.04em;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;}
.footer-copy{font-size:11px;color:rgba(250,247,240,0.22);}
.footer-langs{display:flex;gap:14px;}
.footer-langs a{font-size:11px;color:rgba(250,247,240,0.22);transition:color 0.2s;}
.footer-langs a:hover,.footer-langs a.current{color:rgba(250,247,240,0.65);}