/* =====================================================
   base.css
   BIG MOON Global Site - Base Styles
   ---------------------------------
   Purpose:
   - Common UI elements shared across all pages
   - breadcrumb / header / footer / typography (future)
   - Must be loaded BEFORE page-specific CSS
===================================================== */


/* =====================================================
   Breadcrumb
   -----------------------------------------------------
   Used on:
   - watches.php
   - product_view.php
   - brand landing pages
===================================================== */

.breadcrumb {
  max-width: 1200px;
  margin: 16px auto 24px;
  padding: 0 16px;

  border: none;

  font-size: 13px;
  line-height: 1.4;
  color: #666;
  white-space: nowrap;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
}

.breadcrumb a {
  color: #111;
  text-decoration: none;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

.breadcrumb span {
  margin: 0 6px;
  color: #999;
}

/* Mobile adjustment */
@media (max-width: 768px) {
  .breadcrumb {
    font-size: 12px;
    margin: 12px auto 16px;
  }
}


/* =====================================================
   Header (Future)
   -----------------------------------------------------
   - Global header
   - Logo / navigation / search
===================================================== */
/*
.site-header { }
.site-header .logo { }
.site-header nav { }
*/


/* =====================================================
   Footer (Future)
   -----------------------------------------------------
   - Global footer
   - Trust / company / legal
===================================================== */
/*
.site-footer { }
.site-footer a { }
*/


/* =====================================================
   Base Typography (Future)
   -----------------------------------------------------
   - body / headings / links
===================================================== */
/*
body { }
h1, h2, h3 { }
a { }
*/


/* =====================================================
   Layout Utilities (Future)
   -----------------------------------------------------
   - container
   - spacing helpers
===================================================== */
/*
.container { }
.mt-sm { }
.mt-md { }
.mt-lg { }
*/


/* =====================================================
   End of base.css
===================================================== */

/* =====================================================
   Brand.css
===================================================== */

.brand-intro {
  max-width: 1200px;
  margin: 40px auto 32px;
  padding: 0 20px;
}