/* ==========================================================================
   MASI JEWELLERS — v5: Approved final design implementation
   Loaded after masi-premium.css; overrides/extends toward pixel accuracy
   with the client-approved homepage mockup.
   ========================================================================== */

/* ---------- Top utility bar: Live Gold Rate ---------- */
.masi-topbar { background: var(--masi-maroon-deep); color: #fff; font-family: 'Jost', sans-serif; font-size: 12px; }
.masi-topbar-inner { max-width: 1320px; margin: 0 auto; padding: 9px 24px; display: flex; align-items: center; justify-content: center; }
.masi-topbar-rate { display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 6px 0; }
.masi-topbar-rate-label { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; letter-spacing: .04em; color: var(--masi-gold-bright); white-space: nowrap; }
.masi-topbar-rate-label .dashicons { font-size: 14px; width: 14px; height: 14px; }
.masi-topbar-rate-item { display: inline-block; color: rgba(255,255,255,.92); white-space: nowrap; letter-spacing: .01em; }
.masi-topbar-rate-item strong { color: #fff; font-weight: 600; }
.masi-topbar-rate-sep { width: 1px; height: 12px; background: rgba(255,255,255,.28); margin: 0 16px; }
.masi-topbar-rate-updated { color: rgba(255,255,255,.68); font-size: 11.5px; }
.masi-topbar-rate-unavailable { color: rgba(255,255,255,.6); font-style: italic; }
@media (max-width: 900px) { .masi-topbar-rate-updated { display: none; } .masi-topbar-rate-sep:last-of-type { display: none; } }
@media (max-width: 560px) { .masi-topbar-inner { padding: 8px 16px; } .masi-topbar-rate-sep { margin: 0 10px; } .masi-topbar-rate-label span:last-child, .masi-topbar-rate-label { font-size: 11px; } .masi-topbar-rate-item { font-size: 11px; } }

/* ---------- Back-to-top floating arrow ---------- */
.masi-scrolltop { position: fixed; right: 20px; bottom: 20px; z-index: 998; width: 46px; height: 46px; border-radius: 50%; background: var(--masi-maroon); color: #fff; border: 1px solid var(--masi-gold); display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 6px 18px rgba(33,29,25,.2); opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .3s ease, transform .3s ease, background .25s ease, visibility 0s linear .3s; }
.masi-scrolltop.is-visible { opacity: 1; visibility: visible; transform: translateY(0); transition: opacity .3s ease, transform .3s ease, background .25s ease; }
.masi-scrolltop:hover { background: var(--masi-maroon-deep); }
.masi-scrolltop .dashicons { font-size: 20px; width: 20px; height: 20px; }
@media (max-width: 600px) { .masi-scrolltop { width: 40px; height: 40px; right: 14px; bottom: 14px; } }

/* ---------- Header: icon-only WhatsApp, no phone/text CTA ---------- */
.masi-header-actions { display: flex; align-items: center; gap: 18px; }
/* Header quick-contact icons: Call / WhatsApp / Facebook / Instagram - each in its own
   brand color (filled circle) instead of the plain maroon-outline treatment, so they
   read instantly rather than blending into a generic ring icon. */
.masi-header-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; margin-left: 6px; transition: transform .2s ease, box-shadow .2s ease; box-shadow: 0 2px 6px rgba(33,29,25,.15); }
.masi-header-icon-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(33,29,25,.22); }
.masi-header-icon-btn .dashicons { font-size: 17px; width: 17px; height: 17px; }
.masi-header-icon-call { background: var(--masi-maroon); }
.masi-header-icon-whatsapp { background: #25D366; }
.masi-header-icon-facebook { background: #1877F2; }
.masi-header-icon-instagram { background: radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
@media (max-width: 480px) { .masi-header-icon-btn { width: 32px; height: 32px; margin-left: 4px; } .masi-header-icon-btn .dashicons { font-size: 15px; width: 15px; height: 15px; } }

/* ---------- Floating contact stack (Call / WhatsApp / Instagram), right edge ---------- */
.masi-float-contact { position: fixed; top: 68%; right: 20px; transform: translateY(-50%); z-index: 997; display: flex; flex-direction: column; align-items: center; }
.masi-float-contact a { position: relative; width: 52px; height: 52px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; box-shadow: 0 6px 16px rgba(33,29,25,.28); transition: transform .2s ease, box-shadow .2s ease; }
.masi-float-contact a:hover { transform: scale(1.08); box-shadow: 0 8px 20px rgba(33,29,25,.35); }
.masi-float-contact a + a { margin-top: 22px; }
.masi-float-contact a + a::before { content: ''; position: absolute; bottom: 100%; left: 50%; width: 2px; height: 22px; background: rgba(33,29,25,.18); transform: translateX(-50%); }
.masi-float-contact .dashicons { font-size: 24px; width: 24px; height: 24px; }
.masi-float-contact-call { background: #2E7DE1; }
.masi-float-contact-whatsapp { background: #25D366; }
.masi-float-contact-instagram { background: radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); }
.masi-float-contact a svg { width: 24px; height: 24px; }
@media (max-width: 600px) { .masi-float-contact { right: 10px; } .masi-float-contact a { width: 42px; height: 42px; } .masi-float-contact a + a { margin-top: 16px; } .masi-float-contact a + a::before { height: 16px; } .masi-float-contact .dashicons { font-size: 20px; width: 20px; height: 20px; } .masi-float-contact a svg { width: 20px; height: 20px; } }
.masi-nav a.is-active { color: var(--masi-maroon) !important; }
.masi-nav a.is-active::after { width: 100%; left: 0; }

/* ---------- Header nav: "Collections" dropdown (Gold Collection / Silver Collection) ---------- */
.masi-nav-dropdown-wrap { position: relative; display: inline-flex; align-items: center; }
.masi-nav-dropdown-toggle { display: inline-flex; align-items: center; gap: 4px; }
.masi-nav-caret { font-size: 11px; width: 11px; height: 11px; position: relative; top: 2px; color: var(--masi-gold-deep); }
.masi-nav-dropdown-panel {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translate(-50%, 6px);
  min-width: 190px;
  background: #fff;
  border: 1px solid var(--masi-gold-pale);
  border-radius: 8px;
  box-shadow: 0 16px 34px rgba(33,29,25,.14);
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
  z-index: 50;
}
.masi-nav-dropdown-wrap:hover .masi-nav-dropdown-panel,
.masi-nav-dropdown-wrap:focus-within .masi-nav-dropdown-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 2px);
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear;
}
.masi-nav-dropdown-panel a {
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  color: var(--masi-charcoal-soft) !important;
  padding: 9px 14px;
  border-radius: 5px;
  white-space: nowrap;
  transition: background .18s ease, color .18s ease;
}
.masi-nav-dropdown-panel a::after { content: none !important; }
.masi-nav-dropdown-panel a:hover { background: var(--masi-ivory); color: var(--masi-maroon) !important; }

/* Mobile menu: Gold/Silver Collection sub-links sit indented right under "Collections" */
.masi-mobile-subnav {
  padding-left: 28px !important;
  font-size: 13.5px !important;
  color: var(--masi-charcoal-soft) !important;
  position: relative;
}
.masi-mobile-subnav::before {
  content: '';
  position: absolute;
  left: 12px;
  top: 50%;
  width: 5px;
  height: 1px;
  background: var(--masi-gold);
}

/* ---------- Hero: left-aligned content, dual CTAs, arrow nav ---------- */
/* Only the active slide's text may ever be visible - the background photo still
   crossfades smoothly via opacity, but text switches instantly via visibility so two
   slides' headings/buttons can never be readable on screen at the same time. */
.masi-hero-slide .masi-hero-content { visibility: hidden; }
.masi-hero-slide.is-active .masi-hero-content { visibility: visible; }
.masi-hero-content { align-items: flex-start !important; text-align: left !important; padding-left: 8%; max-width: 620px; }
.masi-hero-content h1, .masi-hero-content h2 { text-align: left; }
.masi-hero-rule { margin: 22px 0 !important; }
.masi-hero-content p { text-align: left; margin-left: 0; }
.masi-hero-cta-row { display: flex; gap: 16px; flex-wrap: wrap; opacity: 0; transform: translateY(18px); animation: masiFadeUp 1s ease .65s forwards; }
.masi-btn-outline-light { background: transparent; border: 1px solid rgba(255,255,255,.6); color: #fff; }
.masi-btn-outline-light:hover { background: #fff; color: var(--masi-maroon); border-color: #fff; }
.masi-hero-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); background: rgba(0,0,0,.15); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .3s ease, border-color .3s ease; }
.masi-hero-arrow:hover { background: var(--masi-maroon); border-color: var(--masi-maroon); }
.masi-hero-arrow .dashicons { font-size: 20px; width: 20px; height: 20px; }
.masi-hero-prev { left: 28px; }
.masi-hero-next { right: 28px; }
.masi-hero-dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.45); }
.masi-hero-dot.is-active { width: 26px; border-radius: 5px; background: var(--masi-gold-bright); }
@media (max-width: 782px) {
  .masi-hero-content { padding-left: 6%; max-width: 90%; }
  .masi-hero-arrow { width: 36px; height: 36px; }
  .masi-hero-prev { left: 12px; }
  .masi-hero-next { right: 12px; }
}

/* ---------- Gold Rate: floating card overlapping hero ---------- */
.masi-rate-card { position: relative; z-index: 6; margin: -46px auto 0; max-width: 1240px; background: var(--masi-cream); border-radius: 10px; box-shadow: 0 20px 46px rgba(33,29,25,.14); }
.masi-rate-card-inner { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 0; padding: 22px 30px; }
.masi-rate-card-label { display: flex; align-items: center; gap: 12px; padding-right: 26px; }
.masi-rate-card-icon { flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%; background: var(--masi-gold-pale); color: var(--masi-maroon); display: flex; align-items: center; justify-content: center; }
.masi-rate-card-icon .dashicons { font-size: 22px; width: 22px; height: 22px; }
.masi-rate-card-title { font-family: 'Jost', sans-serif; font-size: 11.5px; font-weight: 600; letter-spacing: .06em; color: var(--masi-maroon); line-height: 1.5; }
.masi-rate-divider { width: 1px; align-self: stretch; background: var(--masi-hairline); margin: 4px 26px; }
.masi-rate-stat { display: flex; flex-direction: column; gap: 5px; }
.masi-rate-stat-label { font-family: 'Jost', sans-serif; font-size: 11px; letter-spacing: .08em; color: var(--masi-charcoal-soft); text-transform: uppercase; }
.masi-rate-stat-value { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 22px; font-weight: 600; color: var(--masi-charcoal); }
.masi-rate-stat-unavailable .masi-rate-stat-value { font-size: 14px; font-family: 'Jost', sans-serif; color: var(--masi-charcoal-soft); font-style: italic; }
.masi-rate-card-updated { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.masi-rate-card-updated .masi-rate-card-title { color: var(--masi-gold-deep); }
@media (max-width: 1024px) {
  .masi-rate-card { margin-top: -30px; border-radius: 8px; }
  .masi-rate-card-inner { justify-content: center; padding: 20px 22px; }
  .masi-rate-divider { margin: 4px 16px; }
  .masi-rate-card-updated { margin-left: 0; width: 100%; justify-content: center; padding-top: 6px; }
}
@media (max-width: 600px) {
  .masi-rate-card { margin-top: -22px; }
  .masi-rate-card-inner { flex-direction: column; align-items: flex-start; gap: 14px; }
  .masi-rate-divider { display: none; }
  .masi-rate-card-label, .masi-rate-stat, .masi-rate-card-updated { width: 100%; }
  .masi-rate-card-updated { margin-left: 0; }
}

/* ---------- Collections: responsive 4 / 2 / 1 grid, equal-size cards, premium hover ---------- */
.masi-collections-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; max-width: 1320px; }
.masi-collection-card { height: 300px; align-items: stretch; transition: transform .4s cubic-bezier(.4,0,.2,1), box-shadow .4s ease; }
.masi-collection-card::after { background: linear-gradient(180deg, rgba(15,12,9,.05) 30%, rgba(15,12,9,.85) 100%); transition: background .4s ease; }
.masi-collection-card:hover { transform: translateY(-6px) scale(1.015) !important; box-shadow: 0 22px 44px rgba(33,29,25,.22); }
.masi-collection-card:hover::after { background: linear-gradient(180deg, rgba(15,12,9,.15) 20%, rgba(110,16,18,.75) 100%); }
.masi-collection-overlay { position: relative; z-index: 2; width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; text-align: center; padding: 0 10px 20px; gap: 4px; }
.masi-collection-name { display: block; padding: 0; font-size: 16px; letter-spacing: .06em; text-transform: uppercase; color: #fff; font-family: 'Jost', sans-serif; font-weight: 600; }
.masi-collection-name::after { content: none; }
.masi-collection-view { display: block; font-size: 10.5px; letter-spacing: .04em; color: var(--masi-gold-bright); font-family: 'Jost', sans-serif; }
@media (max-width: 1024px) { .masi-collections-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; } .masi-collection-card { height: 260px; } }
@media (max-width: 560px) { .masi-collections-grid { grid-template-columns: 1fr; } .masi-collection-card { height: 220px; } }

/* ---------- Featured Products: wishlist icon + View All button, no per-card CTA, 3/2/1 grid ---------- */
.masi-products-grid { grid-template-columns: repeat(3, 1fr); gap: 28px; }
.masi-product-card { position: relative; background: #fff; }
.masi-product-wishlist { position: absolute; top: 12px; right: 12px; z-index: 3; width: 32px; height: 32px; border-radius: 50%; background: rgba(255,255,255,.92); border: 1px solid var(--masi-hairline); display: flex; align-items: center; justify-content: center; cursor: pointer; color: var(--masi-charcoal-soft); transition: color .25s ease, border-color .25s ease, transform .2s ease; }
.masi-product-wishlist .dashicons { font-size: 15px; width: 15px; height: 15px; }
.masi-product-wishlist:hover { color: var(--masi-maroon); border-color: var(--masi-maroon); }
.masi-product-wishlist.is-active { color: var(--masi-maroon); border-color: var(--masi-maroon); }
.masi-product-wishlist.is-active .dashicons { transform: scale(1.1); }
.masi-product-image { height: 280px; }
@media (max-width: 900px) { .masi-product-image { height: 240px; } }
@media (max-width: 560px) { .masi-product-image { height: 300px; } }
.masi-product-body { padding: 16px 18px 20px; text-align: center; }
.masi-product-body h3 { font-size: 15.5px; font-family: 'Jost', sans-serif; font-weight: 500; text-transform: uppercase; letter-spacing: .02em; color: var(--masi-charcoal); margin: 0; line-height: 1.4; }
.masi-products-viewall { text-align: center; margin-top: 44px; }
.masi-btn-viewall { background: var(--masi-maroon); border-color: var(--masi-maroon); color: #fff; }
.masi-btn-viewall:hover { background: var(--masi-maroon-deep); }
@media (max-width: 900px) { .masi-products-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .masi-products-grid { grid-template-columns: 1fr; } }

/* ---------- Trust & Certification: premium badge cards, just above the footer ---------- */
.masi-trust-grid { display: flex; align-items: stretch; justify-content: center; flex-wrap: wrap; gap: 22px; max-width: 1280px; margin: 0 auto; }
.masi-trust-card { flex: 1 1 190px; max-width: 220px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; padding: 30px 18px; background: #fff; border: 1px solid var(--masi-hairline); border-radius: 6px; box-shadow: 0 10px 26px rgba(33,29,25,.05); transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
.masi-trust-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(110,16,18,.14); border-color: var(--masi-gold); }
.masi-trust-badge { position: relative; width: 66px; height: 66px; display: flex; align-items: center; justify-content: center; }
.masi-trust-badge-ring { position: absolute; inset: 0; border: 1px solid var(--masi-gold); border-radius: 50%; }
.masi-trust-badge .dashicons { position: relative; z-index: 2; font-size: 28px; width: 28px; height: 28px; color: var(--masi-maroon); }
.masi-trust-title { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 18px; font-weight: 700; color: var(--masi-charcoal); letter-spacing: .01em; }
.masi-trust-sub { font-family: 'Jost', sans-serif; font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--masi-charcoal-soft); }
/* Featured badge: BIS Hallmarked 916 Gold - larger, seal-style double ring, maroon fill */
.masi-trust-card-featured { flex-basis: 240px; max-width: 260px; padding: 36px 22px; background: var(--masi-cream); border: 1px solid var(--masi-gold); box-shadow: 0 14px 34px rgba(110,16,18,.1); }
.masi-trust-card-featured .masi-trust-badge { width: 86px; height: 86px; }
.masi-trust-card-featured .masi-trust-badge-ring { border: 2px solid var(--masi-gold); background: var(--masi-maroon); }
.masi-trust-card-featured .masi-trust-badge-ring::after { content: ''; position: absolute; inset: 5px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; }
.masi-trust-card-featured .masi-trust-badge .dashicons { color: var(--masi-gold-bright); font-size: 34px; width: 34px; height: 34px; }
.masi-trust-badge-seal { position: relative; z-index: 2; width: 34px; height: 34px; color: var(--masi-gold-bright); }

/* Trust & Certification: flat row style (rounded-square icon badge, bold title,
   grey caption, no card borders), replacing the boxed-card layout per reference. */
.masi-trust-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 40px 48px; max-width: 1280px; margin: 0 auto; padding-bottom: 26px; border-bottom: 1px solid var(--masi-hairline); }
.masi-trust-item { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 10px; flex: 0 1 220px; }
.masi-trust-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 12px; background: var(--masi-maroon); color: #fff; }
.masi-trust-icon .dashicons { font-size: 22px; width: 22px; height: 22px; }
/* BIS Hallmarked badge: now matches the other 3 icons exactly (same rounded-square
   maroon box, same 48x48 size) instead of its previous distinct white circular
   treatment, so the whole row reads as one consistent icon set. */
.masi-trust-icon-image { background: var(--masi-maroon); border-radius: 12px; padding: 9px; box-shadow: none; overflow: hidden; }
.masi-trust-icon-image img { width: 100%; height: 100%; border-radius: 4px; object-fit: contain; display: block; }
.masi-trust-item .masi-trust-title { font-family: 'Jost', sans-serif; font-size: 16px; font-weight: 700; color: var(--masi-charcoal); letter-spacing: 0; text-transform: none; }
.masi-trust-item .masi-trust-sub { font-family: 'Jost', sans-serif; font-size: 13px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--masi-charcoal-soft); }
@media (max-width: 700px) { .masi-trust-row { justify-content: flex-start; gap: 28px 32px; } .masi-trust-item { flex: 0 1 45%; } }
@media (max-width: 460px) { .masi-trust-item { flex: 1 1 100%; } }
.masi-trust-card-featured .masi-trust-title { font-size: 21px; color: var(--masi-maroon); }
.masi-trust-card-featured .masi-trust-sub { color: var(--masi-gold-deep); font-weight: 600; }
@media (max-width: 900px) { .masi-trust-grid { gap: 18px; } .masi-trust-card { flex: 1 1 46%; max-width: none; } .masi-trust-card-featured { flex-basis: 100%; max-width: none; } }
@media (max-width: 480px) { .masi-trust-card { flex: 1 1 100%; } }

/* ---------- About: divider added before section (visual separation from Why Choose bar) ---------- */
.masi-about-grid { padding-top: 4px; }

/* ---------- Portrait-source photo crop fix (hero slides, collection & product cards) ----------
   The photos here render inside landscape/near-square boxes via background-size:cover with a
   dead-center crop. A few source photos are portrait-orientation (taller than wide), so a plain
   center crop was cutting off a lot more of the subject on those specific photos than on the
   landscape ones sitting right next to them in the same grid, making them look inconsistently
   zoomed-in. Biasing the crop toward the top instead keeps more of the jewellery/model in frame
   without needing new source photos. */
.masi-hero-slide-portrait-source { background-position: center 20% !important; }
.masi-collection-card-portrait-source { background-position: center 15% !important; }
.masi-product-image-portrait-source { background-position: center 15% !important; }

/* ---------- Section titles (Elementor heading widgets used for every section header:
   Our Collections / Featured Jewellery / About Us / Why Choose Us / Trust & Certification /
   Contact Us) - these were rendering completely unstyled (plain black, default sans-serif)
   because nothing in this stylesheet ever targeted Elementor's own heading class. Bringing
   them in line with the rest of the site's branded typography (maroon, serif, letter-spaced). */
.elementor-widget-heading .elementor-heading-title {
  /* !important here is required: Elementor's own per-page generated stylesheet
     (post-8.css) declares this exact same selector with equal specificity and
     loads AFTER this file, so without !important its default (plain black,
     theme sans-serif) silently wins on source order alone. */
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  font-size: clamp(28px, 3.4vw, 38px) !important;
  color: var(--masi-maroon) !important;
  letter-spacing: .01em;
  margin: 0 0 20px;
  line-height: 1.2;
}
@media (max-width: 600px) {
  .elementor-widget-heading .elementor-heading-title { margin-bottom: 14px; }
}

/* ---------- Footer: 5-column layout matching approved design ---------- */
/* Root cause of the misaligned/wrapped footer: masi-frontend.css sets .masi-footer-inner
   to display:flex with flex-wrap, so the grid-template-columns below was being silently
   ignored and columns (esp. the wide "Visit Our Store" one) wrapped onto their own row.
   Force it back to a real grid here so every column sits in one aligned row. */
.masi-site-footer { border-top: 3px solid transparent; border-image: linear-gradient(90deg, var(--masi-maroon), var(--masi-gold), var(--masi-maroon)) 1; padding-top: 28px; background: var(--masi-cream); color: var(--masi-charcoal); }
.masi-footer-inner { display: grid; grid-template-columns: 1.2fr 0.9fr 1.2fr 1fr; gap: 24px; align-items: start; border-bottom: 1px solid var(--masi-hairline); padding-bottom: 20px; }
.masi-footer-tagline { color: var(--masi-charcoal-soft); font-size: 12.5px; line-height: 1.6; margin: 8px 0 10px; }
.masi-footer-col { min-width: 0; }
.masi-footer-col h4 { font-family: 'Cormorant Garamond', Georgia, serif; font-size: 15.5px; font-weight: 700; color: var(--masi-charcoal); letter-spacing: .02em; text-transform: none; margin: 0 0 12px; }
.masi-footer-links { display: flex; flex-direction: column; gap: 8px; }
.masi-footer-links a, .masi-footer-contact-col a, .masi-footer-hours-col span { color: var(--masi-charcoal-soft); font-size: 13px; }
.masi-footer-links a:hover { color: var(--masi-maroon); }
.masi-footer-row { display: flex !important; align-items: flex-start; gap: 8px; color: var(--masi-charcoal-soft); font-size: 12.5px; line-height: 1.5; margin: 0 0 9px !important; }
.masi-footer-row span:not(.dashicons) { color: var(--masi-charcoal-soft) !important; }
.masi-footer-row .dashicons { flex-shrink: 0; font-size: 15px; width: 15px; height: 15px; color: var(--masi-maroon); margin-top: 1px; }
.masi-footer-row a { color: var(--masi-charcoal-soft); text-decoration: none; }
.masi-footer-row a:hover { color: var(--masi-maroon); }
.masi-footer-store-photo { border-radius: 4px; overflow: hidden; margin-bottom: 14px; box-shadow: 0 8px 20px rgba(33,29,25,.1); }
.masi-footer-store-photo img { width: 100%; height: 110px; object-fit: cover; display: block; }
.masi-btn-outline-footer { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--masi-maroon); color: var(--masi-maroon); background: transparent; padding: 9px 18px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; border-radius: 0; transition: background .25s ease, color .25s ease; }
.masi-btn-outline-footer:hover { background: var(--masi-maroon); color: #fff; }
.masi-site-footer .masi-social-links a { border-color: var(--masi-hairline); color: var(--masi-maroon); }
.masi-site-footer .masi-social-links a:hover { background: var(--masi-maroon); color: #fff; }
.masi-footer-bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; font-size: 11.5px; color: var(--masi-charcoal-soft); opacity: 1; text-align: left; }
.masi-footer-bottom-legal a { color: var(--masi-charcoal-soft); text-decoration: none; transition: color .25s ease; }
.masi-footer-bottom-legal a:hover { color: var(--masi-maroon); text-decoration: underline; }
.masi-footer-bottom .dashicons { font-size: 12px; width: 12px; height: 12px; color: var(--masi-maroon); vertical-align: -1px; }
@media (max-width: 900px) { .masi-footer-inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .masi-footer-inner { grid-template-columns: 1fr; } .masi-footer-bottom { justify-content: center; text-align: center; } }

/* ---------- Brand name below logo (header + footer) ---------- */
.masi-brand-name-below { display: block; font-family: 'Cormorant Garamond', Georgia, serif; font-size: 15px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--masi-maroon); margin-top: 4px; text-align: center; }
.masi-site-header:not(.masi-scrolled) .masi-brand-name-below { color: var(--masi-maroon); }

/* The header's background is ALWAYS solid cream (masi-premium.css overrides the
   transparent default from masi-frontend.css, since this design has no dark hero
   image behind the header on any page). But masi-frontend.css still turns the nav
   links, hamburger, and "MASI JEWELLERS" wordmark white whenever the header hasn't
   been scrolled 60px yet - so on every page load, before any scrolling, it was
   near-invisible white text on a cream bar. Forcing these dark/maroon at all times,
   scrolled or not, since the header background never actually goes transparent. */
.masi-site-header:not(.masi-scrolled) .masi-nav a { color: var(--masi-charcoal) !important; }
.masi-site-header:not(.masi-scrolled) .masi-logo { color: var(--masi-maroon) !important; }
.masi-site-header:not(.masi-scrolled) .masi-hamburger span { background: var(--masi-charcoal) !important; }
.masi-site-header:not(.masi-scrolled) .masi-brand-text .masi-brand-name { color: var(--masi-maroon) !important; }
.masi-site-header:not(.masi-scrolled) .masi-brand-text .masi-brand-sub { color: var(--masi-charcoal-soft) !important; }
.masi-site-header:not(.masi-scrolled) .masi-brand-mark { color: var(--masi-maroon) !important; }
.masi-brand.masi-brand-has-logo { display: flex; flex-direction: column; align-items: center; gap: 0; }
.masi-brand.masi-brand-has-logo .masi-brand-name-below { text-align: center; font-size: 12px; margin-top: 2px; }
/* .masi-footer-col span/p (masi-frontend.css) is a near-white color meant for the old
   dark footer background, and its 2-class selector out-specifies these single-class
   color rules regardless of load order - so the brand name and tagline below the footer
   logo were rendering in near-invisible cream-on-cream, leaving what looked like a big
   blank gap. Re-declared here at matching specificity (2 classes) so they actually show,
   and spacing tightened at the same time. */
.masi-footer-brand-col .masi-brand-name-below { text-align: left; font-size: 15px; margin: 4px 0 6px; color: var(--masi-maroon); }
.masi-footer-brand-col .masi-footer-tagline { color: var(--masi-charcoal-soft); margin: 0 0 4px; }
.masi-footer-logo-img { margin-bottom: 2px; }
.masi-footer-brand-col .masi-brand-name-below { margin-bottom: 0; }

/* Store Hours: day and time now stack (instead of one run-on line), and the time
   itself never wraps mid-string ("10:00 AM –" / "8:30 PM" splitting across two lines). */
.masi-footer-hours-row { align-items: flex-start; }
.masi-hours-block { display: flex; flex-direction: column; gap: 1px; }
.masi-hours-day { font-weight: 600; color: var(--masi-charcoal); }
.masi-hours-time { white-space: nowrap; color: var(--masi-charcoal-soft); font-size: 12.5px; }

/* ---------- About Us image: constrain height so it doesn't dwarf the short text column ----------
   The image widget was rendering at its full native aspect ratio in a 32%-wide column, which
   made it very tall next to the much shorter About text, leaving a lot of empty space beside it. */
.elementor-element-df3efe4 .elementor-widget-image img { max-height: 320px; width: 100%; object-fit: cover; border-radius: 8px; box-shadow: 0 18px 40px rgba(33,29,25,.16); }
@media (max-width: 767px) {
  .elementor-element-df3efe4 .elementor-widget-image img { max-height: 240px; }
}

/* ---------- About Us: extra breathing room between the photo column and the text column ----------
   The section's column gap was set to "narrow", which put the photo and the About text almost
   touching. The Elementor gap setting was widened to "default" for a base improvement, and this
   adds explicit left padding on the text column (removed on mobile, where columns stack) so the
   two never crowd each other regardless of Elementor's own gap presets. */
.elementor-element-df3efe4 .elementor-element-2c673aa { padding-left: 36px; }
@media (max-width: 1024px) {
  .elementor-element-df3efe4 .elementor-element-2c673aa { padding-left: 26px; }
}
@media (max-width: 767px) {
  .elementor-element-df3efe4 .elementor-element-2c673aa { padding-left: 0; margin-top: 26px; }
  .elementor-element-df3efe4 .elementor-element-9d276c9 { max-width: 420px; margin: 0 auto; }
}

/* ---------- Gold Rate strip, homepage placement below the hero: premium contained card ----------
   Site-wide (other pages) the topbar stays the original edge-to-edge maroon bar right under the
   header, which is fine there. On the homepage it now sits in its own section below the hero, so
   it reads much better as a framed, inset card (rounded corners, gold border/shadow, richer
   typography) instead of a plain full-bleed strip - scoped to this one section only. */
.elementor-element-79c77e6 { padding: 0 24px; }
.elementor-element-79c77e6 .masi-topbar {
  position: relative;
  max-width: 1240px;
  margin: 16px auto 0;
  border-radius: 12px;
  background: linear-gradient(180deg, #fff 0%, var(--masi-ivory) 100%);
  box-shadow: 0 16px 40px rgba(110,16,18,.1);
  border: 1px solid var(--masi-gold-pale);
}
.elementor-element-79c77e6 .masi-topbar-inner {
  padding: 14px 22px;
  gap: 10px 0;
}
.elementor-element-79c77e6 .masi-topbar-rate { gap: 10px 12px; }
.elementor-element-79c77e6 .masi-topbar-rate-label {
  background: var(--masi-maroon);
  color: #fff;
  font-size: 12.5px;
  gap: 8px;
  padding: 9px 16px 9px 10px;
  border-radius: 30px;
  box-shadow: 0 6px 14px rgba(110,16,18,.25);
}
.elementor-element-79c77e6 .masi-topbar-rate-label .dashicons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--masi-gold-bright);
  color: var(--masi-maroon-deep);
  font-size: 13px;
}
.elementor-element-79c77e6 .masi-topbar-rate-item {
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #fff;
  background: var(--masi-maroon);
  border: none;
  border-radius: 30px;
  padding: 9px 18px;
  box-shadow: 0 6px 14px rgba(110,16,18,.22);
}
.elementor-element-79c77e6 .masi-topbar-rate-item strong {
  font-family: 'Jost', sans-serif;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--masi-gold-bright);
  margin-left: 2px;
}
.elementor-element-79c77e6 .masi-topbar-rate-sep { display: none; }
.elementor-element-79c77e6 .masi-topbar-rate-updated {
  color: #fff;
  background: var(--masi-maroon);
  border-radius: 30px;
  padding: 9px 18px;
  box-shadow: 0 6px 14px rgba(110,16,18,.22);
  font-style: italic;
  font-size: 11.5px;
}
@media (max-width: 900px) {
  .elementor-element-79c77e6 { padding: 0 16px; }
  .elementor-element-79c77e6 .masi-topbar-inner { padding: 14px 16px; justify-content: center; }
}
@media (max-width: 560px) {
  .elementor-element-79c77e6 .masi-topbar { margin-top: 18px; border-radius: 10px; }
  .elementor-element-79c77e6 .masi-topbar-rate-item { padding: 7px 12px; font-size: 12px; }
  .elementor-element-79c77e6 .masi-topbar-rate-label { padding: 8px 14px 8px 8px; }
}

/* ---------- Eyebrow/kicker label (small uppercase text above a section heading) ---------- */
.masi-eyebrow { display: block; font-family: 'Jost', sans-serif; font-size: 12.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--masi-maroon); margin-bottom: 10px; text-align: center; }

/* ---------- Legal pages (Privacy Policy / Terms & Conditions) ---------- */
.masi-legal-page { max-width: 820px; margin: 0 auto; padding: 64px 24px 100px; font-family: var(--masi-font-sans); color: var(--masi-charcoal-soft); }
.masi-legal-header { text-align: center; margin-bottom: 40px; padding-bottom: 26px; border-bottom: 1px solid var(--masi-hairline, #E6DCCB); }
.masi-legal-title { font-family: var(--masi-font-serif); font-size: clamp(30px, 4vw, 42px); font-weight: 500; color: var(--masi-maroon); margin: 0; letter-spacing: .02em; }
.masi-legal-body { line-height: 1.85; font-size: 16px; }
.masi-legal-body > p:first-child { text-align: center; color: var(--masi-charcoal-soft); font-style: italic; opacity: .85; margin-bottom: 36px; font-size: 14px; }
.masi-legal-body h2 { font-family: var(--masi-font-serif); font-size: 24px; font-weight: 600; color: var(--masi-maroon); margin: 42px 0 14px; padding-bottom: 8px; border-bottom: 1px solid var(--masi-gold-pale, #E6D5B8); }
.masi-legal-body h2:first-of-type { margin-top: 30px; }
.masi-legal-body h3 { font-family: var(--masi-font-serif); font-size: 19px; font-weight: 600; color: var(--masi-charcoal); margin: 26px 0 10px; }
.masi-legal-body p { margin: 0 0 16px; }
.masi-legal-body ul, .masi-legal-body ol { margin: 0 0 18px; padding-left: 22px; }
.masi-legal-body li { margin-bottom: 8px; }
.masi-legal-body li strong { color: var(--masi-charcoal); }
.masi-legal-body a { color: var(--masi-maroon); text-decoration: underline; text-decoration-color: var(--masi-gold); text-underline-offset: 2px; }
.masi-legal-body a:hover { color: var(--masi-maroon-deep); }
.masi-legal-body strong { color: var(--masi-charcoal); }
@media (max-width: 600px) { .masi-legal-page { padding: 44px 18px 70px; } .masi-legal-body { font-size: 15px; } .masi-legal-body h2 { font-size: 21px; margin-top: 34px; } }