/* =============================================================
   CALI CUSTOM FURNITURE — theme-modern.css
   Brand refresh based on the gold palm & sunset logo.
   Loaded after style.css; overrides colors, type & components.
   ============================================================= */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400;500;600&family=Great+Vibes&family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&display=swap');

:root{
  --black:#0D0B09; --dark:#14110E; --dark-mid:#1C1814; --dark-alt:#231E18;
  --gold:#D4AE68; --gold-lt:#EBCB8B; --gold-dk:#A97C3A;
  --cream:#F4EDE1; --cream-dk:#E2D7C6; --warm-grey:#A39785; --light-txt:#6E6455;
  --g-grad:linear-gradient(135deg,#F6E0A6 0%,#D9B36C 38%,#B8873F 70%,#E9C985 100%);
  --g-line:linear-gradient(90deg,transparent,rgba(217,179,108,.55),transparent);
  --font-display:'Jost',sans-serif; --font-body:'Jost',sans-serif;
  --font-script:'Great Vibes',cursive; --font-serif:'Cormorant Garamond',serif;
  --radius:16px; --radius-sm:10px;
  --shadow:0 24px 60px rgba(0,0,0,.45);
  --glow:0 0 0 1px rgba(217,179,108,.28),0 18px 50px rgba(184,135,63,.18);
  --transition:.45s cubic-bezier(.22,.61,.36,1);
}

/* ── Base ── */
body{background:var(--black);color:var(--cream);font-family:var(--font-body);font-weight:300;letter-spacing:.01em;
  background-image:radial-gradient(1200px 600px at 85% -10%,rgba(212,174,104,.07),transparent 60%),radial-gradient(900px 500px at -10% 40%,rgba(212,174,104,.05),transparent 60%);background-attachment:fixed}
::selection{background:rgba(212,174,104,.35);color:#fff}
::-webkit-scrollbar{width:6px}::-webkit-scrollbar-thumb{background:var(--g-grad);border-radius:6px}
h1,h2,h3,h4{font-family:var(--font-display)}
h1 em,h2 em,h3 em,.hero-title span,.section-title em,.page-header h1 em,.cta-banner h2 em,.craft-text h2 em,.intro-text h2 em,.contact-info h2 em,.about-story-text h2 em{
  font-family:var(--font-script)!important;font-style:normal!important;font-weight:400!important;letter-spacing:0!important;
  background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent!important;
  font-size:1.18em;line-height:.9;padding:0 .08em .06em;display:inline-block}
.gold{background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ── Labels ── */
.label,.hero-eyebrow,.collection-cat,.modal-cat,.product-cat-badge{font-family:var(--font-body)!important;font-weight:500!important;letter-spacing:.38em!important;text-transform:uppercase}
.label{color:var(--gold);font-size:.7rem}
.label::before{background:var(--g-grad)!important;height:1px;width:34px}

/* ── Buttons ── */
.btn{border-radius:999px!important;font-family:var(--font-body);font-weight:500;letter-spacing:.22em;font-size:.74rem;padding:1.05rem 2.3rem;position:relative;overflow:hidden}
.btn-gold,.nav-cta,.modal-cta{background:var(--g-grad)!important;color:#1A140C!important;border:none!important;box-shadow:0 10px 30px rgba(184,135,63,.28)}
.btn-gold:hover,.nav-cta:hover,.modal-cta:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(212,174,104,.42);filter:brightness(1.06)}
.btn-gold::after,.nav-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s ease}
.btn-gold:hover::after,.nav-cta:hover::before{transform:translateX(120%)}
.btn-outline,.btn-ghost{background:rgba(255,255,255,.03)!important;border:1px solid rgba(217,179,108,.45)!important;color:var(--cream)!important;backdrop-filter:blur(8px)}
.btn-outline:hover,.btn-ghost:hover{border-color:var(--gold)!important;color:var(--gold-lt)!important;background:rgba(212,174,104,.08)!important;transform:translateY(-2px)}

/* ── Navigation (glass) ── */
.nav{background:rgba(13,11,9,.55)!important;backdrop-filter:blur(18px) saturate(140%)!important;-webkit-backdrop-filter:blur(18px) saturate(140%)!important;border-bottom:1px solid rgba(217,179,108,.10)}
.nav.at-top{background:linear-gradient(to bottom,rgba(13,11,9,.75),rgba(13,11,9,0))!important;backdrop-filter:none!important;border-bottom-color:transparent}
.nav.scrolled{background:rgba(13,11,9,.82)!important;border-bottom:1px solid rgba(217,179,108,.18)!important}
.nav-topbar{background:transparent!important;border-bottom:1px solid rgba(217,179,108,.08)!important}
.nav-topbar-item{font-size:.72rem;letter-spacing:.14em;color:var(--cream-dk)}
.nav-topbar-item svg{fill:var(--gold)}
.nav-logo img{height:118px!important;width:auto;filter:drop-shadow(0 4px 18px rgba(212,174,104,.25))!important}
.nav.scrolled .nav-logo img{height:64px!important}
.nav-links{gap:2.4rem}
.nav-links a{font-family:var(--font-body);font-weight:400;font-size:.74rem;letter-spacing:.24em;color:var(--cream-dk)}
.nav-links a::after{background:var(--g-grad)!important;height:1px}
.nav-links a:hover,.nav-links a.active{color:var(--gold-lt)!important}
.nav-cta{padding:.8rem 1.6rem!important;border-radius:999px!important;position:relative;overflow:hidden}
.nav-cta::after{display:none!important}
.nav-hamburger span{background:var(--gold)!important}

/* ── Hero ── */
.hero{min-height:100vh}
.hero-left{padding-top:220px!important;padding-left:clamp(1.5rem,5vw,5rem)!important}
.hero-eyebrow{color:var(--gold-lt);font-size:.72rem;display:flex;align-items:center;gap:.9rem}
.hero-eyebrow::before{content:"";width:40px;height:1px;background:var(--g-grad)}
.hero-title{font-family:var(--font-display)!important;font-style:normal!important;font-weight:300!important;letter-spacing:-.025em!important;line-height:.98!important;font-size:clamp(3.4rem,6.6vw,7.4rem)!important}
.hero-title span{font-size:1.25em}
.hero-desc{color:var(--cream-dk);font-size:1.08rem;max-width:460px;line-height:1.85}
.hero-scroll-line{background:var(--g-grad)!important}
.hero-scroll span{letter-spacing:.35em;color:var(--gold)}

/* ── Marquee ── */
.marquee-strip{background:linear-gradient(90deg,#120F0C,#1B1610,#120F0C)!important;border-top:1px solid rgba(217,179,108,.16);border-bottom:1px solid rgba(217,179,108,.16)}
.marquee-item{font-family:var(--font-body)!important;font-weight:300!important;font-style:normal!important;letter-spacing:.32em;text-transform:uppercase;font-size:.95rem!important;color:var(--cream-dk)!important}
.marquee-item::after{content:"✦"!important;color:var(--gold)!important;background:none!important;width:auto!important;height:auto!important;margin:0 2.2rem!important;font-size:.7rem}

/* ── Section headings ── */
.section-title,.intro-text h2,.craft-text h2,.contact-info h2,.cta-banner h2,.page-header h1,.about-story-text h2{font-family:var(--font-display)!important;font-weight:300!important;letter-spacing:-.02em;line-height:1.04!important}
.section-num{font-family:var(--font-serif)!important;color:transparent!important;-webkit-text-stroke:1px rgba(217,179,108,.45)}
.stat-num{font-family:var(--font-display)!important;font-weight:300!important;background:var(--g-grad);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.stat-label{letter-spacing:.24em;text-transform:uppercase;font-size:.66rem;color:var(--warm-grey)}

/* ── Images & media ── */
.intro-img-main,.intro-img-accent,.craft-img,.about-img,.collection-card,.product-main-img,.modal-img{border-radius:var(--radius)!important;overflow:hidden}
.intro-img-accent{box-shadow:var(--shadow);border:1px solid rgba(217,179,108,.25)}
.intro-badge{border-radius:999px!important;background:rgba(13,11,9,.7)!important;backdrop-filter:blur(10px);border:1px solid rgba(217,179,108,.35)!important;color:var(--gold-lt)!important;letter-spacing:.3em}

/* ── Category tabs ── */
.cat-tabs{gap:.6rem!important;border:none!important;flex-wrap:wrap}
.cat-tab{border:1px solid rgba(217,179,108,.22)!important;border-radius:999px!important;padding:.7rem 1.4rem!important;font-family:var(--font-body);letter-spacing:.2em;font-size:.7rem;text-transform:uppercase;color:var(--cream-dk);background:rgba(255,255,255,.02)!important;transition:var(--transition)}
.cat-tab:hover{border-color:var(--gold)!important;color:var(--gold-lt)}
.cat-tab.active{background:var(--g-grad)!important;color:#1A140C!important;border-color:transparent!important;font-weight:500}

/* ── Product cards ── */
.products-grid{gap:1.6rem!important;background:none!important}
.product-card{background:linear-gradient(180deg,#191510,#120F0C)!important;border:1px solid rgba(217,179,108,.12);border-radius:var(--radius)!important;overflow:hidden;transition:var(--transition)}
.product-card:hover{transform:translateY(-6px);box-shadow:var(--glow);border-color:rgba(217,179,108,.35)}
.product-img{height:320px!important;background:#0F0D0A!important}
.product-img img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1)!important}
.product-card:hover .product-img img{transform:scale(1.06)}
.product-cat-badge{border-radius:999px!important;background:rgba(13,11,9,.65)!important;backdrop-filter:blur(8px);border:1px solid rgba(217,179,108,.35)!important;color:var(--gold-lt)!important;font-size:.58rem!important;padding:.4rem .9rem!important}
.product-arrow{border-radius:50%!important;background:var(--g-grad)!important;color:#1A140C!important}
.product-info h3{font-family:var(--font-display)!important;font-weight:400!important;letter-spacing:.01em}
.product-info p{color:var(--warm-grey)}
.product-material{color:var(--gold)!important;letter-spacing:.22em}
.product-inquire{color:var(--cream-dk)}
.product-card:hover .product-inquire{color:var(--gold-lt)}

/* ── Collections ── */
.collections-grid{gap:1.2rem!important;padding:0 clamp(1rem,3vw,2.5rem)}
.collection-card{border:1px solid rgba(217,179,108,.14)}
.collection-card::after{background:linear-gradient(to top,rgba(13,11,9,.92) 5%,rgba(13,11,9,.15) 60%,transparent)!important}
.collection-name{font-family:var(--font-display)!important;font-weight:300!important;letter-spacing:-.01em}
.collection-cat{color:var(--gold)!important}
.collection-link{color:var(--gold-lt)!important;letter-spacing:.24em}

/* ── Craft / features / testimonials ── */
.craft-feature{border-radius:var(--radius-sm);transition:var(--transition)}
.craft-feature-icon{border-radius:50%!important;background:rgba(212,174,104,.1)!important;border:1px solid rgba(217,179,108,.3)!important}
.testimonial-card{border-radius:var(--radius)!important;background:linear-gradient(180deg,#1A1611,#13100D)!important;border:1px solid rgba(217,179,108,.14)!important;transition:var(--transition)}
.testimonial-card:hover{box-shadow:var(--glow);transform:translateY(-4px)}
.testimonial-stars span{color:var(--gold)!important}
.testimonial-text{font-family:var(--font-serif)!important;font-style:italic;font-size:1.2rem!important;color:var(--cream)}
.testimonial-avatar{background:var(--g-grad)!important;color:#1A140C!important}

/* ── CTA banner ── */
.cta-banner{background:radial-gradient(800px 300px at 50% 0%,rgba(246,224,166,.35),transparent 70%),var(--g-grad)!important;border-radius:0}
.cta-banner h2,.cta-banner p,.cta-banner .label{color:#1A140C!important}
.cta-banner h2 em{background:none!important;color:#1A140C!important;-webkit-text-fill-color:#1A140C}
.cta-banner .btn-dark{border-radius:999px!important;background:#120F0C!important;color:var(--gold-lt)!important}

/* ── Forms ── */
.contact-form{border-radius:var(--radius)!important;border:1px solid rgba(217,179,108,.16)!important;background:linear-gradient(180deg,#191510,#120F0C)!important}
.form-group input,.form-group select,.form-group textarea{border-radius:var(--radius-sm)!important;background:rgba(255,255,255,.03)!important;border:1px solid rgba(217,179,108,.2)!important;font-family:var(--font-body)!important;color:var(--cream)!important}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--gold)!important;box-shadow:0 0 0 4px rgba(212,174,104,.12)!important;outline:none}
.contact-icon{border-radius:50%!important;background:rgba(212,174,104,.1)!important;border:1px solid rgba(217,179,108,.3)!important}

/* ── Page header (inner pages) ── */
.page-header{padding:13rem 0 5rem!important;background:radial-gradient(900px 400px at 80% 0%,rgba(212,174,104,.10),transparent 60%),var(--dark)!important;border-bottom:1px solid rgba(217,179,108,.12)!important;position:relative}
body.nav-scrolled .page-header{padding-top:11rem!important}
.page-header::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--g-line)}

/* ── Modal ── */
.modal{border-radius:var(--radius)!important;overflow:hidden;border:1px solid rgba(217,179,108,.2)}
.modal-name{font-family:var(--font-display)!important;font-weight:300!important}
.modal-feature::before{background:var(--g-grad)!important}

/* ── Footer ── */
footer,.footer{position:relative}
.footer-brand img{height:110px!important;filter:drop-shadow(0 4px 16px rgba(212,174,104,.2))!important}
.footer-col h4{font-family:var(--font-body)!important;letter-spacing:.3em;text-transform:uppercase;font-size:.72rem;color:var(--gold)!important;font-weight:500}
.footer-col a{color:var(--warm-grey)}
.footer-col a:hover{color:var(--gold-lt)!important}

/* ── Admin login logo ── */
.admin-login-box img,.admin-sidebar img{filter:none!important;height:auto!important;max-width:220px}

/* ── Motion ── */
.fade-in{transition:opacity .9s ease,transform .9s cubic-bezier(.22,.61,.36,1)!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── Responsive ── */
@media (max-width:1024px){
  .hero-left{padding-top:170px!important}
  .nav-logo img{height:72px!important}
}
@media (max-width:768px){
  .nav-logo img{height:58px!important}
  .nav.scrolled .nav-logo img{height:48px!important}
  .hero-left{padding:150px 1.4rem 4rem!important}
  .hero-title{font-size:clamp(2.8rem,12vw,4rem)!important}
  .page-header{padding:9rem 0 3.5rem!important}
  body.nav-scrolled .page-header{padding-top:8rem!important}
  .product-img{height:260px!important}
  .btn{padding:.95rem 1.8rem}
}

/* ── v2 tweaks ── */
.collections-grid{grid-template-columns:repeat(4,1fr)!important}
.collection-card{height:460px!important}
.collection-img{transition:transform 1.2s cubic-bezier(.22,.61,.36,1)!important}
.collection-card:hover .collection-img{transform:scale(1.06)}
@media (max-width:1024px){.collections-grid{grid-template-columns:repeat(2,1fr)!important}.collection-card{height:380px!important}}
@media (max-width:600px){.collections-grid{grid-template-columns:1fr!important}}

/* ── v2.1 bigger logo, menu & top bar ── */
.nav-logo img{height:150px!important}
.nav.scrolled .nav-logo img{height:82px!important}
.nav-inner{max-width:1600px!important}
.nav-topbar-inner{max-width:1600px!important}
.nav-links{gap:2.8rem!important}
.nav-links a{font-size:.92rem!important;letter-spacing:.2em!important;font-weight:500!important}
.nav-cta{font-size:.82rem!important;padding:1rem 2rem!important}
.nav-topbar{padding:.65rem 0!important}
.nav-topbar-item{font-size:.95rem!important;letter-spacing:.1em!important;font-weight:500;gap:.6rem}
.nav-topbar-item svg{width:18px!important;height:18px!important}
.nav-topbar{max-height:80px}
.hero-left{padding-top:260px!important}
.page-header{padding-top:16rem!important}
body.nav-scrolled .page-header{padding-top:12rem!important}
@media (max-width:1280px){.nav-links{gap:1.8rem!important}.nav-links a{font-size:.82rem!important}}
@media (max-width:1024px){.nav-logo img{height:96px!important}.nav.scrolled .nav-logo img{height:70px!important}.hero-left{padding-top:200px!important}.nav-links a{font-size:1rem!important}}
@media (max-width:768px){.nav-logo img{height:70px!important}.nav.scrolled .nav-logo img{height:56px!important}.hero-left{padding-top:160px!important}.page-header{padding-top:10rem!important}}