/* ==========================================================
   CREATIVE STORE MASTER — CENTERED SHOP GRID
   Flex layout centers incomplete final rows and equalizes cards.
========================================================== */
/*
Theme Name: Creative Store Luxury Master
Theme URI: https://example.com/
Author: Creative Store Master
Description: Reusable luxury storefront theme converted from the supplied custom PHP site.
Version: 1.6.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: creative-store-master
*/

/* ==========================================================
   YOUR BRAND - MASTER LUXURY DESIGN SYSTEM
   Typography: Cinzel (Serif) + Montserrat (Sans-Serif)
   Palette: Rich Black (#0B0B0B), Deep Charcoal (#141414), Metallic Gold (#D4AF37)
========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Montserrat:wght@300;400;500;600;700&display=swap');

:root {
  --brand-black: #0b0b0b;
  --brand-surface: #121212;
  --brand-card: #181818;
  --brand-card-hover: #1f1f1f;
  --brand-gold: #d4af37;
  --brand-gold-light: #f5e7b2;
  --brand-gold-dark: #9e7514;
  --brand-gold-glow: rgba(212, 175, 55, 0.25);
  --brand-border: rgba(212, 175, 55, 0.2);
  --brand-border-hover: rgba(212, 175, 55, 0.6);
  --brand-text: #f5f5f5;
  --brand-muted: #9e9e9e;
  --header-height: 76px;
}

/* Global Reset */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  background-color: var(--brand-black);
  color: var(--brand-text);
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  line-height: 1.6;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

/* Typography Hierarchy */
h1, h2, h3, h4, h5, h6, .brand-font {
  font-family: 'Cinzel', serif;
  color: #ffffff;
  letter-spacing: 0.5px;
  margin-top: 0;
}

.h1-fluid {
  font-size: clamp(2rem, 4.5vw + 0.5rem, 3.6rem);
  font-weight: 700;
  line-height: 1.2;
}

.h2-fluid {
  font-size: clamp(1.6rem, 2.5vw + 0.5rem, 2.4rem);
  font-weight: 700;
  line-height: 1.25;
}

.lead-fluid {
  font-size: clamp(0.95rem, 1vw + 0.4rem, 1.15rem);
  font-weight: 300;
  color: #d1d1d1;
  line-height: 1.7;
}

/* Metallic Gold Gradient Utilities */
.gold-gradient {
  background: linear-gradient(135deg, #ffffff 0%, #f7e7b4 25%, #d4af37 60%, #9e7514 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  font-weight: 700;
}

/* Top Announcement Banner */
.top-bar {
  background: #050505;
  border-bottom: 1px solid rgba(212, 175, 55, 0.15);
  font-size: 0.72rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--brand-gold-light);
  padding: 6px 0;
  text-align: center;
}

/* Luxury Sticky Navbar */
.navbar-custom {
  background: rgba(11, 11, 11, 0.96);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border-bottom: 1px solid var(--brand-border);
  min-height: var(--header-height);
  padding: 8px 0;
  z-index: 1050;
}

.navbar-brand {
  text-decoration: none;
  display: flex;
  align-items: center;
}

.nav-link {
  color: var(--brand-muted) !important;
  font-size: 0.8rem;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  font-weight: 500;
  padding: 8px 14px !important;
  transition: all 0.25s ease;
}

.nav-link:hover, .nav-link.active {
  color: var(--brand-gold) !important;
}

/* Bulletproof Logo Sizing & Alignment Locks */
.brand-logo-img {
  max-height: 44px !important;
  max-width: 200px !important;
  height: 44px !important;
  width: auto !important;
  object-fit: contain !important;
  display: inline-block !important;
}

.footer-logo-img {
  max-height: 48px !important;
  max-width: 220px !important;
  height: 48px !important;
  width: auto !important;
  object-fit: contain !important;
  display: inline-block !important;
  margin-bottom: 12px !important;
}

.admin-logo-img {
  max-height: 54px !important;
  max-width: 200px !important;
  height: 54px !important;
  width: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto 16px auto !important;
}

@media (max-width: 575.98px) {
  .brand-logo-img {
    max-height: 36px !important;
    height: 36px !important;
    max-width: 160px !important;
  }
}

/* Luxury Buttons */
.btn-gold {
  background: linear-gradient(135deg, var(--brand-gold) 0%, #e8c763 100%);
  color: #0b0b0b !important;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.78rem;
  letter-spacing: 1.5px;
  border: none;
  border-radius: 3px;
  padding: 12px 24px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.25s ease;
  cursor: pointer;
}

.btn-gold:hover {
  background: linear-gradient(135deg, #e8c763 0%, var(--brand-gold) 100%);
  transform: translateY(-2px);
  box-shadow: 0 8px 25px var(--brand-gold-glow);
  color: #000000 !important;
}

.btn-outline-gold {
  border: 1px solid var(--brand-gold);
  color: var(--brand-gold-light) !important;
  background: transparent;
  font-size: 0.78rem;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 600;
  border-radius: 3px;
  padding: 12px 24px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: all 0.25s ease;
  cursor: pointer;
}

.btn-outline-gold:hover {
  background-color: var(--brand-gold);
  color: #0b0b0b !important;
  box-shadow: 0 4px 15px var(--brand-gold-glow);
}

/* Badges */
.badge-gold {
  background: rgba(212, 175, 55, 0.12);
  color: var(--brand-gold);
  border: 1px solid var(--brand-border);
  font-size: 0.68rem;
  letter-spacing: 1px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 3px;
  display: inline-block;
}

/* Product Cards & Container Alignment (Fixed Footer Overlap Bug) */
.luxury-card {
  background: var(--brand-card);
  border: 1px solid var(--brand-border);
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: auto; /* Fixed: Prevents footer overlap bug */
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.luxury-card.h-100 {
  height: 100%;
}

.luxury-card:hover {
  border-color: var(--brand-border-hover);
  background: var(--brand-card-hover);
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.7), 0 0 20px var(--brand-gold-glow);
}

.card-img-wrap {
  position: relative;
  width: 100%;
  height: 210px;
  background: #0d0d0d;
  overflow: hidden;
  border-bottom: 1px solid var(--brand-border);
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.luxury-card:hover .product-card-img {
  transform: scale(1.04);
}

.card-body-content {
  padding: 20px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: space-between;
}

.card-title-clamp {
  font-size: 1.05rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 8px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card-desc-clamp {
  font-size: 0.84rem;
  color: var(--brand-muted);
  line-height: 1.5;
  margin-bottom: 16px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.card-footer-row {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Detail Hero Image */
.product-hero-img {
  width: 100%;
  max-height: 440px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--brand-border);
  background: #111111;
}

.product-table-thumb {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--brand-border);
}

.product-placeholder-box {
  width: 100%;
  height: 200px;
  background: #111111;
  border: 1px solid var(--brand-border);
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Inputs & Form Controls */
.form-control-luxury, .form-select-luxury {
  background-color: #121212 !important;
  border: 1px solid var(--brand-border) !important;
  color: #ffffff !important;
  border-radius: 4px;
  font-size: 15px !important;
  min-height: 48px;
  padding: 10px 14px;
}

.form-control-luxury:focus, .form-select-luxury:focus {
  border-color: var(--brand-gold) !important;
  box-shadow: 0 0 0 3px var(--brand-gold-glow) !important;
  outline: none;
}

.form-control-luxury::placeholder {
  color: #666666;
}

/* Hero Background Glow */
.hero-glow-bg {
  background: radial-gradient(circle at 50% 35%, rgba(212, 175, 55, 0.12) 0%, rgba(11, 11, 11, 1) 75%);
  padding: 70px 0 50px 0;
}

/* Pillars Grid */
.pillar-card {
  background: #151515;
  border: 1px solid var(--brand-border);
  border-radius: 4px;
  padding: 18px;
  height: 100%;
}

/* Responsive Table / Mobile Reflow */
.table-luxury {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.table-luxury th {
  background: #121212;
  color: var(--brand-gold);
  font-size: 0.72rem;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 14px 16px;
  border-bottom: 1px solid var(--brand-border);
}

.table-luxury td {
  background: #171717;
  color: #dddddd;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  vertical-align: middle;
}

@media (max-width: 767.98px) {
  .mobile-table-card thead { display: none; }
  .mobile-table-card tr {
    display: block;
    margin-bottom: 1rem;
    background: #171717;
    border: 1px solid var(--brand-border);
    border-radius: 6px;
    padding: 14px;
  }
  .mobile-table-card td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  .mobile-table-card td:last-child {
    border-bottom: none;
  }
  .mobile-table-card td::before {
    content: attr(data-label);
    font-size: 0.72rem;
    text-transform: uppercase;
    color: var(--brand-gold);
    font-weight: 600;
  }
}

/* ==========================================================
   WORDPRESS / WOOCOMMERCE CONVERSION OVERRIDES
   Master storefront — larger, clearer logo + WP-native controls
========================================================== */
:root { --csm-logo-height: 70px; --csm-logo-max-width: 300px; }
body { min-height: 100vh; }
.navbar-custom .custom-logo-link { display:flex; align-items:center; text-decoration:none; }
.navbar-custom .custom-logo { width:auto; height:var(--csm-logo-height); max-width:var(--csm-logo-max-width); object-fit:contain; display:block; }
.navbar-brand-fallback { font-family:'Cinzel', serif; color:var(--brand-gold); text-decoration:none; font-size:1.45rem; letter-spacing:1.5px; font-weight:700; }
.navbar-custom .nav-menu, .navbar-custom .nav-menu ul { list-style:none; margin:0; padding:0; }
.navbar-custom .nav-menu { display:flex; align-items:center; justify-content:center; gap:.15rem; }
.navbar-custom .nav-menu li { position:relative; }
.navbar-custom .nav-menu a { color:var(--brand-muted); text-decoration:none; font-size:.8rem; letter-spacing:1.2px; text-transform:uppercase; font-weight:500; padding:8px 14px; display:block; }
.navbar-custom .nav-menu a:hover, .navbar-custom .nav-menu .current-menu-item > a { color:var(--brand-gold); }
.mobile-toggle { background:none; border:0; color:var(--brand-gold); font-size:2rem; line-height:1; }
.nav-cart-link { position:relative; }
/* WooCommerce storefront grid — V5: true 3-column layout */
.woocommerce ul.products {
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:28px 24px !important;
  align-items:stretch !important;
}
.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content:none !important;
  display:none !important;
}
.woocommerce ul.products li.product {
  float:none !important;
  clear:none !important;
  width:auto !important;
  min-width:0 !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  background:linear-gradient(145deg,rgba(24,24,24,.98),rgba(15,15,15,.98)) !important;
  border:1px solid rgba(212,175,55,.18) !important;
  border-radius:8px !important;
  overflow:hidden !important;
  padding:0 0 20px !important;
  box-shadow:0 12px 30px rgba(0,0,0,.22) !important;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}
.woocommerce ul.products li.product:hover {
  transform:translateY(-5px) !important;
  border-color:rgba(212,175,55,.42) !important;
  box-shadow:0 18px 38px rgba(0,0,0,.34) !important;
}
.woocommerce ul.products li.product a img {
  width:100% !important;
  height:260px !important;
  object-fit:cover !important;
  margin:0 0 18px !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color:#fff !important;
  font-family:'Cinzel',serif !important;
  font-size:1.02rem !important;
  line-height:1.45 !important;
  padding:0 22px !important;
  margin-bottom:10px !important;
}
.woocommerce ul.products li.product .price {
  padding:0 22px !important;
  color:var(--brand-gold)!important;
  font-weight:700 !important;
  font-size:1.05rem !important;
  margin-top:auto !important;
  margin-bottom:14px !important;
}
.woocommerce ul.products li.product a.button {
  margin:0 22px !important;
  align-self:flex-start !important;
}

.woocommerce span.onsale { background:var(--brand-gold); color:#0b0b0b; }
.woocommerce div.product { color:var(--brand-text); }
.woocommerce div.product .product_title, .woocommerce div.product .price { color:#fff; font-family:'Cinzel',serif; }
.woocommerce div.product .price { color:var(--brand-gold)!important; }
.woocommerce div.product form.cart .button, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { background:linear-gradient(135deg,var(--brand-gold) 0%,#e8c763 100%); color:#0b0b0b!important; border-radius:3px; text-transform:uppercase; letter-spacing:1px; font-weight:700; }
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt { background:linear-gradient(135deg,var(--brand-gold) 0%,#e8c763 100%); color:#0b0b0b!important; }
.woocommerce-message, .woocommerce-info, .woocommerce-error { background:#141414; color:#f5f5f5; border-top-color:var(--brand-gold); }
.woocommerce table.shop_table { background:#171717; border-color:var(--brand-border); color:#ddd; }
.woocommerce table.shop_table th { color:var(--brand-gold); }
.woocommerce input.input-text, .woocommerce textarea, .woocommerce select, .select2-container--default .select2-selection--single { background:#121212!important; color:#fff!important; border:1px solid var(--brand-border)!important; border-radius:4px; }
.csm-wp-page { padding:60px 0; }
.csm-commission-form input, .csm-commission-form select, .csm-commission-form textarea, .csm-track-form input { width:100%; }
.csm-track-result { margin-top:24px; }
.csm-admin-card { background:#141414; border:1px solid var(--brand-border); padding:24px; border-radius:6px; }
@media (max-width: 991.98px) {
  .navbar-custom .nav-menu { display:none; flex-direction:column; align-items:stretch; margin-top:15px; }
  .navbar-custom .nav-menu.is-open { display:flex; }
  .navbar-custom .nav-menu a { text-align:center; padding:10px 12px; }
  .navbar-custom .custom-logo { height:54px; max-width:230px; }
}
@media (max-width: 991.98px) {
  .woocommerce ul.products {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:22px 18px !important;
  }
}
@media (max-width: 575.98px) {
  :root { --csm-logo-height: 52px; --csm-logo-max-width:220px; }
  .woocommerce ul.products {
    grid-template-columns:1fr !important;
    gap:18px !important;
  }
  .woocommerce ul.products li.product a img {
    height:220px !important;
  }
}


/* ==========================================================
   CREATIVE STORE MASTER — CENTERED LOGO HEADER — TRUE CENTERED LOGO HEADER
   Uses dedicated header slots instead of nested anchor markup.
========================================================== */

.navbar-custom .csm-header-inner {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important;
  grid-template-rows: 150px 58px !important;
  grid-template-areas:
    "brand brand brand"
    "nav nav actions" !important;
  align-items: center !important;
  min-height: 218px !important;
  padding-top: 6px !important;
  padding-bottom: 10px !important;
}

.navbar-custom .csm-brand-slot {
  grid-area: brand !important;
  justify-self: center !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navbar-custom .csm-brand-slot .custom-logo-link {
  display: block !important;
  line-height: 0 !important;
}

.navbar-custom .csm-brand-slot .custom-logo {
  height: 150px !important;
  width: auto !important;
  max-width: 500px !important;
  object-fit: contain !important;
  display: block !important;
}

.navbar-custom .csm-nav-slot {
  grid-area: nav !important;
  justify-self: center !important;
  align-self: center !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navbar-custom .csm-nav-slot .nav-menu {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

.navbar-custom .csm-actions-slot {
  grid-area: actions !important;
  justify-self: end !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

.navbar-custom .csm-mobile-slot {
  display: none !important;
}

@media (max-width: 991.98px) {
  .navbar-custom .csm-header-inner {
    display: flex !important;
    min-height: 105px !important;
    padding: 8px 0 !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
  }

  .navbar-custom .csm-brand-slot {
    justify-self: auto !important;
    order: 1 !important;
  }

  .navbar-custom .csm-brand-slot .custom-logo {
    height: 88px !important;
    max-width: 300px !important;
  }

  .navbar-custom .csm-mobile-slot {
    display: flex !important;
    order: 2 !important;
    align-items: center !important;
    gap: 8px !important;
  }

  .navbar-custom .csm-nav-slot {
    order: 3 !important;
    width: 100% !important;
    margin-top: 8px !important;
  }

  .navbar-custom .csm-actions-slot {
    display: none !important;
  }
}


/* ==========================================================
   CREATIVE STORE MASTER — FOOTER LOGO LOCK — FOOTER LOGO LOCK
   Dedicated footer class prevents oversized logo overlap.
========================================================== */
.csm-site-footer {
  position: relative !important;
  overflow: hidden !important;
}
.csm-site-footer .csm-footer-logo-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  min-height: 140px !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}
.csm-site-footer .csm-footer-logo-wrap .custom-logo-link {
  display: block !important;
  width: auto !important;
  max-width: 280px !important;
  line-height: 0 !important;
}
.csm-site-footer .csm-footer-logo-wrap .custom-logo {
  display: block !important;
  width: auto !important;
  height: 120px !important;
  max-width: 260px !important;
  max-height: 120px !important;
  object-fit: contain !important;
  margin: 0 !important;
}
.csm-site-footer .container,
.csm-site-footer .row,
.csm-site-footer .col-12,
.csm-site-footer .col-6 {
  position: relative !important;
  z-index: 2 !important;
}
@media (max-width: 991.98px) {
  .csm-site-footer .csm-footer-logo-wrap {
    justify-content: center !important;
    min-height: 125px !important;
    text-align: center !important;
  }
  .csm-site-footer .csm-footer-logo-wrap .custom-logo {
    height: 105px !important;
    max-height: 105px !important;
    max-width: 230px !important;
  }
}


/* ==========================================================
   CREATIVE STORE MASTER — LUXURY BRAND PILLARS — LUXURY BRAND PILLARS
   Refined four-card feature section.
========================================================== */
.hero-glow-bg .row.g-3.pt-5.mt-4 {
  margin-top: 3.6rem !important;
}

.hero-glow-bg .pillar-card {
  position: relative !important;
  min-height: 158px !important;
  padding: 28px 24px 24px !important;
  border: 1px solid rgba(212,175,55,.28) !important;
  border-radius: 6px !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(212,175,55,.085), transparent 34%),
    linear-gradient(145deg, rgba(27,27,27,.98), rgba(13,13,13,.98)) !important;
  box-shadow:
    0 12px 34px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  overflow: hidden !important;
  transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease !important;
}

.hero-glow-bg .pillar-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 18px !important;
  right: 18px !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, rgba(240,200,75,.9), transparent) !important;
}

.hero-glow-bg .pillar-card::after {
  content: "" !important;
  position: absolute !important;
  width: 120px !important;
  height: 120px !important;
  right: -65px !important;
  bottom: -65px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(212,175,55,.10) !important;
  box-shadow: 0 0 30px rgba(212,175,55,.04) !important;
  pointer-events: none !important;
}

.hero-glow-bg .pillar-card strong {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  margin-bottom: 11px !important;
  color: #f0c84b !important;
  font-size: 1.04rem !important;
  line-height: 1.35 !important;
  letter-spacing: .25px !important;
}

.hero-glow-bg .pillar-card .small {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  color: #b9b1a3 !important;
  font-size: .9rem !important;
  line-height: 1.75 !important;
}

.hero-glow-bg .pillar-card:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(240,200,75,.52) !important;
  box-shadow:
    0 18px 42px rgba(0,0,0,.36),
    0 0 28px rgba(212,175,55,.065) !important;
}

@media (max-width: 991.98px) {
  .hero-glow-bg .row.g-3.pt-5.mt-4 {
    margin-top: 2.4rem !important;
  }
  .hero-glow-bg .pillar-card {
    min-height: 145px !important;
    padding: 24px 20px 22px !important;
  }
}


/* ==========================================================
   CREATIVE STORE MASTER — FEATURED CREATIONS GALLERY — FEATURED CREATIONS GALLERY
   Full titles, equal-height cards, consistent image framing.
========================================================== */
.featured-creations-section .row.g-4 {
  align-items: stretch !important;
}

.featured-creations-section .row.g-4 > [class*="col-"] {
  display: flex !important;
}

.featured-creations-section .luxury-card {
  width: 100% !important;
  height: 100% !important;
  min-height: 520px !important;
}

.featured-creations-section .card-img-wrap {
  height: 250px !important;
  flex: 0 0 250px !important;
}

.featured-creations-section .card-body-content {
  min-height: 270px !important;
  padding: 22px !important;
}

.featured-creations-section .card-title-clamp {
  display: block !important;
  overflow: visible !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: initial !important;
  min-height: 2.6em !important;
  line-height: 1.3 !important;
  margin-bottom: 10px !important;
}

.featured-creations-section .card-desc-clamp {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  overflow: hidden !important;
  min-height: 4.5em !important;
  line-height: 1.5 !important;
}

.featured-creations-section .card-footer-row {
  margin-top: auto !important;
}

@media (max-width: 991.98px) {
  .featured-creations-section .luxury-card {
    min-height: 0 !important;
  }

  .featured-creations-section .card-img-wrap {
    height: 220px !important;
    flex-basis: 220px !important;
  }

  .featured-creations-section .card-body-content {
    min-height: 0 !important;
  }
}


/* ==========================================================
   CREATIVE STORE MASTER — SIGNATURE COMMISSION INVITATION — SIGNATURE COMMISSION INVITATION
   Elegant centered logo watermark + refined CTA panel.
========================================================== */

/* Keep the commission panel clear of the sticky site header when navigating/scrolling. */
.csm-vision-cta {
  scroll-margin-top: 230px !important;
}
.csm-vision-cta {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(212,175,55,.08), transparent 46%),
    #0b0b0b !important;
  padding: 78px 0 58px !important;
}

.csm-vision-panel {
  position: relative !important;
  min-height: 400px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border: 1px solid rgba(212,175,55,.24) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(145deg, rgba(27,27,27,.97), rgba(14,14,14,.98)) !important;
  box-shadow:
    0 16px 42px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.03) !important;
}

.csm-vision-panel::before,
.csm-vision-panel::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  border: 1px solid rgba(212,175,55,.08) !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.csm-vision-panel::before {
  width: 430px !important;
  height: 430px !important;
}

.csm-vision-panel::after {
  width: 300px !important;
  height: 300px !important;
}

.csm-vision-watermark {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 360px !important;
  height: 360px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: .045 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  filter: drop-shadow(0 0 28px rgba(212,175,55,.09)) !important;
}

.csm-vision-watermark .custom-logo-link {
  display: block !important;
  line-height: 0 !important;
}

.csm-vision-watermark .custom-logo {
  width: 300px !important;
  height: 300px !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: contain !important;
}

.csm-vision-content {
  position: relative !important;
  z-index: 3 !important;
  width: min(860px, 88%) !important;
  text-align: center !important;
}

.csm-section-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 16px !important;
  margin-bottom: 18px !important;
  border: 1px solid rgba(212,175,55,.34) !important;
  background: rgba(212,175,55,.055) !important;
  color: #f5e7b2 !important;
  border-radius: 999px !important;
  font-size: .68rem !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
}

.csm-vision-content .h2-fluid {
  margin: 0 auto !important;
  max-width: 820px !important;
  font-size: clamp(2rem, 3.6vw, 3.25rem) !important;
  line-height: 1.12 !important;
}

.csm-vision-content .lead-fluid {
  max-width: 760px !important;
  line-height: 1.85 !important;
}

.csm-vision-content .btn-gold {
  min-width: 245px !important;
}

@media (max-width: 767.98px) {
  .csm-vision-cta {
    padding: 52px 0 38px !important;
  }

  .csm-vision-panel {
    min-height: 390px !important;
    padding: 72px 18px !important;
  }

  .csm-vision-watermark {
    width: 260px !important;
    height: 260px !important;
  }

  .csm-vision-watermark .custom-logo {
    width: 220px !important;
    height: 220px !important;
  }
}