/* GoldWorld / 金沃 - Premium Dog Gear Visual System */

:root {
  --gw-ink: #182018;
  --gw-ink-soft: #3e493d;
  --gw-green: #254b38;
  --gw-green-2: #37634b;
  --gw-sage: #e7efe5;
  --gw-cream: #fbf7ef;
  --gw-sand: #eadfcf;
  --gw-gold: #c89b4b;
  --gw-rust: #a85f3d;
  --gw-white: #ffffff;
  --gw-line: rgba(24,32,24,.12);
  --gw-shadow: 0 18px 45px rgba(24,32,24,.14);
  --gw-shadow-soft: 0 10px 28px rgba(24,32,24,.10);
  --gw-radius-lg: 28px;
  --gw-radius-md: 18px;
  --gw-radius-sm: 12px;
}

body {
  background:
    radial-gradient(circle at 20% 0%, rgba(200,155,75,.10), transparent 30%),
    linear-gradient(180deg, #fffaf2 0%, #f7f2e9 42%, #f9f7f1 100%);
  color: var(--gw-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Header polish */
header, #top {
  background: rgba(255,250,242,.92) !important;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--gw-line);
}

#logo, .gw-logo, .gw-brand {
  letter-spacing: -.03em;
}

#logo a, .gw-logo a, .gw-brand a {
  text-decoration: none !important;
}

.gw-brand-mark,
.gw-footer-brand {
  font-weight: 900;
  letter-spacing: -.045em;
}

.gw-brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--gw-ink);
}

.gw-brand-mark::before {
  content: "金";
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background:
    linear-gradient(145deg, var(--gw-green), #13271d 62%),
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.35), transparent 38%);
  box-shadow: 0 10px 22px rgba(37,75,56,.28);
  font-weight: 900;
}

/* Navigation */
.navbar, #menu {
  border: 0 !important;
  background: var(--gw-green) !important;
  border-radius: 0 0 22px 22px;
  box-shadow: 0 12px 26px rgba(37,75,56,.18);
}

.navbar a, #menu a {
  color: rgba(255,255,255,.92) !important;
  font-weight: 700;
  letter-spacing: .01em;
}

.navbar a:hover, #menu a:hover {
  color: #fff !important;
  background: rgba(255,255,255,.10) !important;
}

/* Search / buttons */
.btn, button, .button {
  border-radius: 999px !important;
  font-weight: 800 !important;
}

.btn-primary,
.gw-btn,
.gw-primary {
  background: linear-gradient(135deg, var(--gw-green), var(--gw-green-2)) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 14px 26px rgba(37,75,56,.22);
}

.btn-primary:hover,
.gw-btn:hover,
.gw-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 34px rgba(37,75,56,.28);
}

.btn-default,
.gw-secondary {
  background: rgba(255,255,255,.82) !important;
  border: 1px solid var(--gw-line) !important;
  color: var(--gw-ink) !important;
}

/* Homepage wrapper */
.gw-dog-home {
  max-width: 1240px;
  margin: 0 auto;
  padding: 22px 18px 56px;
}

/* Hero */
.gw-hero {
  position: relative;
  overflow: hidden;
  margin: 18px 0 34px;
  border-radius: var(--gw-radius-lg);
  background:
    linear-gradient(135deg, rgba(37,75,56,.96), rgba(24,32,24,.96) 58%, rgba(168,95,61,.88)),
    radial-gradient(circle at 15% 15%, rgba(255,255,255,.20), transparent 25%);
  box-shadow: var(--gw-shadow);
  color: #fff;
}

.gw-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(255,255,255,.14), transparent 42%),
    radial-gradient(circle at 78% 20%, rgba(200,155,75,.25), transparent 22%);
  pointer-events: none;
}

.gw-hero-content {
  position: relative;
  z-index: 2;
  padding: clamp(30px, 5vw, 68px);
  max-width: 660px;
}

.gw-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  color: #f7e7c6;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.gw-eyebrow::before {
  content: "●";
  color: var(--gw-gold);
  font-size: 10px;
}

.gw-hero h1 {
  color: #fff;
  font-size: clamp(38px, 6vw, 76px);
  line-height: .94;
  letter-spacing: -.075em;
  margin: 22px 0 18px;
  font-weight: 950;
}

.gw-hero p {
  color: rgba(255,255,255,.82);
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 1.65;
  max-width: 610px;
}

.gw-hero-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.gw-hero-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  font-weight: 900;
  text-decoration: none !important;
}

.gw-hero-actions a:first-child {
  background: var(--gw-gold);
  color: #1d1b14 !important;
  box-shadow: 0 16px 28px rgba(200,155,75,.30);
}

.gw-hero-actions a:last-child {
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.24);
  color: #fff !important;
}

/* Hero gallery */
.gw-hero-gallery {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.3fr .9fr;
  gap: 16px;
  padding: 0 clamp(20px, 3vw, 38px) clamp(20px, 3vw, 38px);
}

.gw-slide {
  position: relative;
  overflow: hidden;
  min-height: 230px;
  border-radius: 24px;
  background: #d7d0c3;
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}

.gw-slide:first-child {
  grid-row: span 2;
  min-height: 480px;
}

.gw-slide img,
.gw-cat img,
.gw-mini-product img,
.product-thumb img,
.image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gw-slide img {
  transition: transform .8s ease;
}

.gw-slide:hover img {
  transform: scale(1.045);
}

.gw-slide figcaption {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(24,32,24,.68);
  color: #fff;
  font-weight: 900;
  backdrop-filter: blur(10px);
}

/* Stats */
.gw-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: -12px 0 34px;
}

.gw-stat {
  background: rgba(255,255,255,.76);
  border: 1px solid var(--gw-line);
  border-radius: 22px;
  padding: 20px;
  box-shadow: var(--gw-shadow-soft);
}

.gw-stat strong {
  display: block;
  font-size: 32px;
  line-height: 1;
  letter-spacing: -.04em;
  color: var(--gw-green);
}

.gw-stat span {
  color: var(--gw-ink-soft);
  font-weight: 800;
}

/* Section titles */
.gw-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 36px 0 18px;
}

.gw-section-head h2 {
  margin: 0;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 1;
  letter-spacing: -.055em;
  font-weight: 950;
  color: var(--gw-ink);
}

.gw-section-head p {
  margin: 0;
  max-width: 560px;
  color: var(--gw-ink-soft);
  line-height: 1.65;
}

/* Categories */
.gw-category-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.gw-cat {
  position: relative;
  display: block;
  min-height: 190px;
  overflow: hidden;
  border-radius: 24px;
  background: #ddd;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: var(--gw-shadow-soft);
  isolation: isolate;
}

.gw-cat::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,.68));
  z-index: 1;
}

.gw-cat span {
  position: absolute;
  z-index: 2;
  left: 16px;
  right: 16px;
  bottom: 15px;
  font-size: 18px;
  font-weight: 950;
  letter-spacing: -.02em;
}

.gw-cat:hover img {
  transform: scale(1.06);
}

.gw-cat img {
  transition: transform .55s ease;
}

/* Featured products */
.gw-product-grid,
.gw-mini-products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.gw-mini-product,
.product-thumb {
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,.84) !important;
  border: 1px solid var(--gw-line) !important;
  border-radius: 24px !important;
  box-shadow: var(--gw-shadow-soft);
  transition: transform .22s ease, box-shadow .22s ease;
}

.gw-mini-product {
  display: block;
  color: var(--gw-ink) !important;
  text-decoration: none !important;
}

.gw-mini-product:hover,
.product-thumb:hover {
  transform: translateY(-4px);
  box-shadow: var(--gw-shadow);
}

.gw-mini-product img {
  aspect-ratio: 1 / .82;
  display: block;
}

.gw-mini-product div {
  padding: 16px;
}

.gw-mini-product strong {
  display: block;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: -.02em;
  color: var(--gw-ink);
}

.gw-mini-product small {
  display: inline-block;
  margin-top: 9px;
  color: var(--gw-rust);
  font-weight: 950;
}

/* OpenCart product cards */
.product-thumb .image {
  background: #f0eadf;
}

.product-thumb .caption {
  padding: 16px 18px !important;
  min-height: 128px;
}

.product-thumb h4,
.product-thumb h4 a {
  font-weight: 950 !important;
  letter-spacing: -.025em;
  color: var(--gw-ink) !important;
  line-height: 1.25;
}

.product-thumb .price {
  color: var(--gw-rust) !important;
  font-weight: 950 !important;
  font-size: 17px;
}

.product-thumb .button-group {
  border-top: 1px solid var(--gw-line) !important;
  background: rgba(251,247,239,.8) !important;
}

.product-thumb .button-group button {
  border: 0 !important;
  color: var(--gw-green) !important;
  font-weight: 900 !important;
}

/* Info panels */
.gw-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 24px;
}

.gw-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.66)),
    radial-gradient(circle at 20% 0%, rgba(200,155,75,.12), transparent 35%);
  border: 1px solid var(--gw-line);
  border-radius: 26px;
  padding: 28px;
  box-shadow: var(--gw-shadow-soft);
}

.gw-panel h3 {
  margin: 0 0 10px;
  font-size: 24px;
  letter-spacing: -.04em;
  font-weight: 950;
}

.gw-panel p {
  color: var(--gw-ink-soft);
  line-height: 1.7;
}

/* Language dropdown */
.gw-lang,
#form-language,
.language-select {
  border-radius: 999px !important;
}

.dropdown-menu {
  border: 1px solid var(--gw-line) !important;
  border-radius: 18px !important;
  box-shadow: var(--gw-shadow-soft) !important;
  overflow: hidden;
}

.dropdown-menu a,
.dropdown-menu button {
  font-weight: 800 !important;
}

/* Footer */
footer {
  margin-top: 46px;
  background:
    linear-gradient(135deg, #13271d, #254b38 58%, #1b1f18) !important;
  color: rgba(255,255,255,.82) !important;
  border-top: 0 !important;
}

footer h5,
footer a,
footer .gw-footer-brand {
  color: #fff !important;
}

footer a:hover {
  color: #f1cc78 !important;
}

/* Forms */
input, select, textarea, .form-control {
  border-radius: 14px !important;
  border-color: rgba(24,32,24,.16) !important;
  box-shadow: none !important;
}

input:focus, select:focus, textarea:focus, .form-control:focus {
  border-color: var(--gw-green) !important;
  box-shadow: 0 0 0 4px rgba(37,75,56,.12) !important;
}

/* Product detail */
#product-product h1,
#product-category h2 {
  font-weight: 950;
  letter-spacing: -.05em;
  color: var(--gw-ink);
}

.breadcrumb {
  background: transparent !important;
  padding-left: 0 !important;
}

.breadcrumb a {
  color: var(--gw-green) !important;
  font-weight: 800;
}

/* Responsive */
@media (max-width: 992px) {
  .gw-hero-gallery {
    grid-template-columns: 1fr;
  }

  .gw-slide:first-child {
    min-height: 360px;
  }

  .gw-category-grid,
  .gw-product-grid,
  .gw-mini-products {
    grid-template-columns: repeat(2, 1fr);
  }

  .gw-stats {
    grid-template-columns: 1fr;
  }

  .gw-section-head,
  .gw-info-grid {
    display: block;
  }

  .gw-panel {
    margin-top: 16px;
  }
}

@media (max-width: 560px) {
  .gw-dog-home {
    padding: 12px 10px 36px;
  }

  .gw-hero-content {
    padding: 28px 22px;
  }

  .gw-hero h1 {
    font-size: 38px;
  }

  .gw-hero-gallery {
    padding: 0 14px 14px;
  }

  .gw-slide,
  .gw-slide:first-child {
    min-height: 240px;
  }

  .gw-category-grid,
  .gw-product-grid,
  .gw-mini-products {
    grid-template-columns: 1fr;
  }
}

/* GoldWorld hero video replacement */
.gw-hero-video-wrap {
  position: relative;
  min-height: 620px;
  padding: 0 !important;
  overflow: hidden;
  border-radius: 28px;
  background: #071b13;
  box-shadow: 0 24px 60px rgba(10, 25, 18, .28);
}

.gw-hero-video {
  width: 100%;
  height: 100%;
  min-height: 620px;
  display: block;
  object-fit: cover;
  filter: saturate(1.04) contrast(1.02);
}

.gw-hero-video-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(7,27,19,.28), transparent 45%),
    linear-gradient(180deg, transparent 55%, rgba(7,27,19,.55));
  pointer-events: none;
}

.gw-video-badge {
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 22px;
  z-index: 3;
  padding: 18px 20px;
  border-radius: 22px;
  background: rgba(8, 29, 20, .68);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  backdrop-filter: blur(14px);
}

.gw-video-badge strong {
  display: block;
  font-size: 18px;
  font-weight: 950;
  letter-spacing: -.02em;
}

.gw-video-badge span {
  display: block;
  margin-top: 4px;
  color: rgba(255,255,255,.78);
  font-weight: 700;
}

@media (max-width: 992px) {
  .gw-hero-video-wrap,
  .gw-hero-video {
    min-height: 360px;
  }
}

@media (max-width: 560px) {
  .gw-hero-video-wrap,
  .gw-hero-video {
    min-height: 260px;
  }
}

/* GoldWorld full-width hero video replacement */
.gw-hero-fullvideo {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  border-radius: 34px;
  background: #081c14;
  box-shadow: 0 28px 70px rgba(8, 28, 20, .26);
  isolation: isolate;
}

.gw-hero-fullvideo-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 760px;
  object-fit: cover;
  z-index: 0;
  background: #081c14;
}

.gw-hero-fullvideo-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(5, 23, 16, .86) 0%, rgba(5, 23, 16, .58) 42%, rgba(5, 23, 16, .18) 100%),
    linear-gradient(180deg, rgba(5, 23, 16, .28) 0%, rgba(5, 23, 16, .22) 48%, rgba(5, 23, 16, .70) 100%);
  pointer-events: none;
}

.gw-hero-fullvideo-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  padding: clamp(34px, 6vw, 88px);
  color: #fff;
}

.gw-hero-fullvideo-content h1 {
  margin: 22px 0 18px;
  color: #fff;
  font-size: clamp(42px, 7vw, 88px);
  line-height: .92;
  letter-spacing: -.075em;
  font-weight: 950;
  text-shadow: 0 18px 44px rgba(0,0,0,.36);
}

.gw-hero-fullvideo-content p {
  max-width: 640px;
  color: rgba(255,255,255,.88);
  font-size: clamp(16px, 1.7vw, 21px);
  line-height: 1.68;
  text-shadow: 0 8px 24px rgba(0,0,0,.34);
}

.gw-hero-video-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 14px;
  margin-top: 34px;
  max-width: 560px;
}

.gw-hero-video-stats div {
  padding: 18px 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.20);
  backdrop-filter: blur(14px);
}

.gw-hero-video-stats strong {
  display: block;
  color: #fff;
  font-size: 34px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: -.04em;
}

.gw-hero-video-stats span {
  display: block;
  margin-top: 6px;
  color: rgba(255,255,255,.82);
  font-weight: 800;
}

.gw-hero-fullvideo .gw-hero-actions a:first-child {
  background: #ffffff;
  color: #123323 !important;
}

.gw-hero-fullvideo .gw-hero-actions a:last-child {
  background: rgba(255,255,255,.14);
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.28);
}

@media (max-width: 992px) {
  .gw-hero-fullvideo {
    min-height: 620px;
    border-radius: 28px;
  }

  .gw-hero-fullvideo-media {
    min-height: 620px;
  }

  .gw-hero-fullvideo-shade {
    background:
      linear-gradient(90deg, rgba(5,23,16,.84), rgba(5,23,16,.40)),
      linear-gradient(180deg, rgba(5,23,16,.16), rgba(5,23,16,.72));
  }

  .gw-hero-fullvideo-content {
    padding: 42px 30px;
  }
}

@media (max-width: 560px) {
  .gw-hero-fullvideo {
    min-height: 560px;
    border-radius: 22px;
  }

  .gw-hero-fullvideo-media {
    min-height: 560px;
    object-fit: cover;
  }

  .gw-hero-fullvideo-shade {
    background:
      linear-gradient(180deg, rgba(5,23,16,.64) 0%, rgba(5,23,16,.54) 42%, rgba(5,23,16,.84) 100%);
  }

  .gw-hero-fullvideo-content {
    padding: 32px 22px;
  }

  .gw-hero-fullvideo-content h1 {
    font-size: 42px;
    line-height: .96;
  }

  .gw-hero-fullvideo-content p {
    font-size: 15px;
    line-height: 1.58;
  }

  .gw-hero-video-stats {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 24px;
  }

  .gw-hero-video-stats div {
    padding: 14px 16px;
  }

  .gw-hero-video-stats strong {
    font-size: 28px;
  }
}

/* iOS Safari / mobile autoplay note:
   autoplay works only when muted + playsinline are present. */

/* GoldWorld video ratio fix: full browser width, no distortion */
.gw-dog-home {
  overflow: visible;
}

.gw-hero-video-widepage {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  border-radius: 0 !important;
  min-height: unset !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  max-height: 820px;
  overflow: hidden !important;
  position: relative !important;
  background: #071b13 !important;
  box-shadow: none !important;
}

.gw-hero-video-widepage .gw-hero-fullvideo-media {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: unset !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #071b13 !important;
}

.gw-hero-video-widepage .gw-hero-fullvideo-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(90deg, rgba(5,23,16,.82) 0%, rgba(5,23,16,.52) 42%, rgba(5,23,16,.18) 100%),
    linear-gradient(180deg, rgba(5,23,16,.18) 0%, rgba(5,23,16,.20) 48%, rgba(5,23,16,.62) 100%) !important;
}

.gw-hero-video-widepage .gw-hero-fullvideo-content {
  position: absolute !important;
  z-index: 2 !important;
  left: max(24px, calc((100vw - 1240px) / 2 + 24px));
  top: 50%;
  transform: translateY(-50%);
  max-width: 720px !important;
  padding: 0 !important;
  color: #fff !important;
}

.gw-hero-video-widepage .gw-hero-fullvideo-content h1 {
  font-size: clamp(42px, 5.5vw, 86px) !important;
  line-height: .92 !important;
  color: #fff !important;
  max-width: 760px;
}

.gw-hero-video-widepage .gw-hero-fullvideo-content p {
  max-width: 620px !important;
  color: rgba(255,255,255,.88) !important;
}

.gw-hero-video-widepage .gw-hero-video-stats {
  grid-template-columns: repeat(3, minmax(100px, 1fr)) !important;
  max-width: 520px !important;
}

/* Tablet */
@media (max-width: 992px) {
  .gw-hero-video-widepage {
    aspect-ratio: 16 / 9 !important;
    max-height: none !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content {
    left: 28px !important;
    right: 28px !important;
    max-width: 620px !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content h1 {
    font-size: clamp(34px, 6vw, 58px) !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content p {
    font-size: 15px !important;
  }

  .gw-hero-video-widepage .gw-hero-video-stats {
    display: none !important;
  }
}

/* Mobile: keep full phone width, keep 16:9 video ratio, no stretching */
@media (max-width: 560px) {
  .gw-hero-video-widepage {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    aspect-ratio: 16 / 9 !important;
    min-height: unset !important;
    height: auto !important;
    border-radius: 0 !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-media {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-shade {
    background:
      linear-gradient(90deg, rgba(5,23,16,.70), rgba(5,23,16,.22)),
      linear-gradient(180deg, rgba(5,23,16,.10), rgba(5,23,16,.48)) !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content {
    left: 18px !important;
    right: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    max-width: calc(100vw - 36px) !important;
  }

  .gw-hero-video-widepage .gw-eyebrow {
    font-size: 10px !important;
    padding: 5px 9px !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content h1 {
    font-size: clamp(24px, 8vw, 34px) !important;
    line-height: .95 !important;
    margin: 10px 0 8px !important;
  }

  .gw-hero-video-widepage .gw-hero-fullvideo-content p {
    display: none !important;
  }

  .gw-hero-video-widepage .gw-hero-actions {
    margin-top: 12px !important;
    gap: 8px !important;
  }

  .gw-hero-video-widepage .gw-hero-actions a {
    min-height: 34px !important;
    padding: 0 13px !important;
    font-size: 12px !important;
  }

  .gw-hero-video-widepage .gw-hero-video-stats {
    display: none !important;
  }
}

/* GoldWorld final video hero: full browser width, complete video, no crop */
.gw-hero-clean-video {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  background: #081c14 !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative !important;
}

.gw-video-stage {
  width: 100vw !important;
  background: #081c14 !important;
  line-height: 0 !important;
  overflow: hidden !important;
}

.gw-video-full {
  width: 100vw !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  display: block !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #081c14 !important;
}

/* Text overlay on desktop */
.gw-video-copy {
  position: absolute !important;
  z-index: 3 !important;
  left: max(24px, calc((100vw - 1240px) / 2 + 24px)) !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  max-width: 680px !important;
  color: #fff !important;
  padding: 0 !important;
  pointer-events: none !important;
}

.gw-video-copy .gw-hero-actions,
.gw-video-copy .gw-hero-actions a {
  pointer-events: auto !important;
}

.gw-video-copy h1 {
  color: #fff !important;
  font-size: clamp(42px, 5.4vw, 82px) !important;
  line-height: .92 !important;
  letter-spacing: -.075em !important;
  margin: 18px 0 16px !important;
  text-shadow: 0 18px 45px rgba(0,0,0,.50) !important;
}

.gw-video-copy p {
  color: rgba(255,255,255,.92) !important;
  max-width: 600px !important;
  font-size: clamp(16px, 1.5vw, 20px) !important;
  line-height: 1.62 !important;
  text-shadow: 0 10px 28px rgba(0,0,0,.52) !important;
}

.gw-video-copy .gw-eyebrow {
  background: rgba(0,0,0,.34) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  color: #fff !important;
  backdrop-filter: blur(10px);
}

.gw-video-copy .gw-hero-video-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(100px, 1fr)) !important;
  gap: 12px !important;
  max-width: 520px !important;
  margin-top: 26px !important;
}

.gw-video-copy .gw-hero-video-stats div {
  background: rgba(0,0,0,.30) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  backdrop-filter: blur(12px);
}

/* Tablet: keep complete video, reduce overlay */
@media (max-width: 992px) {
  .gw-video-copy {
    left: 24px !important;
    right: 24px !important;
    max-width: 560px !important;
  }

  .gw-video-copy h1 {
    font-size: clamp(32px, 6vw, 56px) !important;
  }

  .gw-video-copy p {
    font-size: 15px !important;
    max-width: 520px !important;
  }

  .gw-video-copy .gw-hero-video-stats {
    display: none !important;
  }
}

/* Mobile: video full width complete, text below video */
@media (max-width: 560px) {
  .gw-hero-clean-video {
    background: #081c14 !important;
  }

  .gw-video-stage {
    width: 100vw !important;
    background: #081c14 !important;
  }

  .gw-video-full {
    width: 100vw !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .gw-video-copy {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    max-width: none !important;
    padding: 22px 18px 26px !important;
    background:
      radial-gradient(circle at 20% 0%, rgba(200,155,75,.16), transparent 32%),
      linear-gradient(135deg, #081c14, #143525) !important;
    color: #fff !important;
  }

  .gw-video-copy h1 {
    font-size: 34px !important;
    line-height: .96 !important;
    margin: 12px 0 10px !important;
  }

  .gw-video-copy p {
    display: block !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: rgba(255,255,255,.86) !important;
  }

  .gw-video-copy .gw-hero-actions {
    margin-top: 16px !important;
  }

  .gw-video-copy .gw-hero-actions a {
    min-height: 38px !important;
    padding: 0 15px !important;
    font-size: 12px !important;
  }

  .gw-video-copy .gw-hero-video-stats {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    margin-top: 18px !important;
  }

  .gw-video-copy .gw-hero-video-stats div {
    padding: 10px 8px !important;
    border-radius: 14px !important;
  }

  .gw-video-copy .gw-hero-video-stats strong {
    font-size: 22px !important;
  }

  .gw-video-copy .gw-hero-video-stats span {
    font-size: 10px !important;
  }
}

/* GoldWorld - Ruffwear-style full video background hero */
.gw-ruffwear-video-hero {
  position: relative !important;
  width: 100vw !important;
  height: 78vh !important;
  min-height: 620px !important;
  max-height: 920px !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: #071b13 !important;
  box-shadow: none !important;
  isolation: isolate !important;
}

.gw-ruffwear-video-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #071b13 !important;
}

.gw-ruffwear-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(90deg, rgba(4, 20, 14, .82) 0%, rgba(4, 20, 14, .52) 42%, rgba(4, 20, 14, .16) 100%),
    linear-gradient(180deg, rgba(4, 20, 14, .22) 0%, rgba(4, 20, 14, .14) 46%, rgba(4, 20, 14, .72) 100%) !important;
  pointer-events: none !important;
}

.gw-ruffwear-video-content {
  position: relative !important;
  z-index: 2 !important;
  height: 100% !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: clamp(38px, 6vw, 92px) 24px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  color: #fff !important;
}

.gw-ruffwear-video-content h1 {
  max-width: 760px !important;
  margin: 22px 0 18px !important;
  color: #fff !important;
  font-size: clamp(46px, 6.8vw, 96px) !important;
  line-height: .9 !important;
  letter-spacing: -.078em !important;
  font-weight: 950 !important;
  text-shadow: 0 22px 58px rgba(0,0,0,.55) !important;
}

.gw-ruffwear-video-content p {
  max-width: 640px !important;
  color: rgba(255,255,255,.90) !important;
  font-size: clamp(16px, 1.55vw, 21px) !important;
  line-height: 1.65 !important;
  text-shadow: 0 12px 32px rgba(0,0,0,.52) !important;
}

.gw-ruffwear-video-content .gw-eyebrow {
  background: rgba(0,0,0,.34) !important;
  border: 1px solid rgba(255,255,255,.26) !important;
  color: #fff !important;
  backdrop-filter: blur(12px) !important;
}

.gw-ruffwear-video-content .gw-hero-actions {
  margin-top: 28px !important;
}

.gw-ruffwear-video-content .gw-hero-actions a:first-child {
  background: #fff !important;
  color: #143525 !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.25) !important;
}

.gw-ruffwear-video-content .gw-hero-actions a:last-child {
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  backdrop-filter: blur(10px) !important;
}

.gw-ruffwear-video-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  gap: 14px !important;
  max-width: 560px !important;
  margin-top: 36px !important;
}

.gw-ruffwear-video-stats div {
  padding: 17px 18px !important;
  border-radius: 20px !important;
  background: rgba(0,0,0,.28) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  backdrop-filter: blur(12px) !important;
}

.gw-ruffwear-video-stats strong {
  display: block !important;
  color: #fff !important;
  font-size: 34px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.04em !important;
}

.gw-ruffwear-video-stats span {
  display: block !important;
  margin-top: 6px !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 800 !important;
}

/* Tablet */
@media (max-width: 992px) {
  .gw-ruffwear-video-hero {
    height: 72vh !important;
    min-height: 560px !important;
  }

  .gw-ruffwear-video-content {
    padding: 42px 28px !important;
  }

  .gw-ruffwear-video-content h1 {
    font-size: clamp(38px, 7vw, 68px) !important;
    max-width: 640px !important;
  }

  .gw-ruffwear-video-content p {
    max-width: 560px !important;
    font-size: 15px !important;
  }

  .gw-ruffwear-video-stats {
    display: none !important;
  }
}

/* Mobile: video still behaves as background, autoplay-friendly */
@media (max-width: 560px) {
  .gw-ruffwear-video-hero {
    height: 72vh !important;
    min-height: 520px !important;
    max-height: none !important;
  }

  .gw-ruffwear-video-bg {
    object-fit: cover !important;
    object-position: center center !important;
  }

  .gw-ruffwear-video-overlay {
    background:
      linear-gradient(180deg, rgba(4,20,14,.52) 0%, rgba(4,20,14,.42) 40%, rgba(4,20,14,.86) 100%),
      linear-gradient(90deg, rgba(4,20,14,.36), rgba(4,20,14,.16)) !important;
  }

  .gw-ruffwear-video-content {
    justify-content: flex-end !important;
    padding: 32px 18px 42px !important;
  }

  .gw-ruffwear-video-content h1 {
    max-width: 100% !important;
    font-size: clamp(34px, 11vw, 46px) !important;
    line-height: .94 !important;
    margin: 14px 0 10px !important;
  }

  .gw-ruffwear-video-content p {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.52 !important;
    color: rgba(255,255,255,.86) !important;
  }

  .gw-ruffwear-video-content .gw-eyebrow {
    font-size: 10px !important;
    padding: 6px 10px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions {
    margin-top: 16px !important;
    gap: 8px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions a {
    min-height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }

  .gw-ruffwear-video-stats {
    display: none !important;
  }
}

/* Respect users who disable motion */
@media (prefers-reduced-motion: reduce) {
  .gw-ruffwear-video-bg {
    animation: none !important;
  }
}

/* =========================================================
   GoldWorld final layout fix
   Fixes: hero/video width mismatch, horizontal overflow,
   OpenCart container conflict, desktop/mobile layout.
   ========================================================= */

/* 1. Kill horizontal overflow caused by 100vw + scrollbar */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* 2. Make OpenCart homepage container truly full width */
#common-home.gw-dog-home,
.gw-dog-home {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* 3. Video hero must match actual page width, not 100vw overflow width */
.gw-ruffwear-video-hero {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  border-radius: 0 !important;
  height: 78vh !important;
  min-height: 620px !important;
  max-height: 900px !important;
  overflow: hidden !important;
  position: relative !important;
  background: #071b13 !important;
  box-shadow: none !important;
}

/* 4. Video background fills the hero, no layout overflow */
.gw-ruffwear-video-bg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #071b13 !important;
}

/* 5. Overlay and content fixed inside hero */
.gw-ruffwear-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(90deg, rgba(4, 20, 14, .84) 0%, rgba(4, 20, 14, .54) 42%, rgba(4, 20, 14, .16) 100%),
    linear-gradient(180deg, rgba(4, 20, 14, .16) 0%, rgba(4, 20, 14, .12) 48%, rgba(4, 20, 14, .70) 100%) !important;
  pointer-events: none !important;
}

.gw-ruffwear-video-content {
  position: relative !important;
  z-index: 2 !important;
  width: min(1240px, calc(100% - 48px)) !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  color: #fff !important;
  box-sizing: border-box !important;
}

/* 6. Re-center all non-hero homepage sections */
.gw-dog-home > *:not(.gw-ruffwear-video-hero) {
  width: min(1240px, calc(100% - 36px)) !important;
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* 7. Remove ugly blank strip and normalize spacing after header/nav */
.gw-dog-home > .gw-ruffwear-video-hero:first-child {
  margin-top: 0 !important;
}

.gw-section-head {
  margin-top: 54px !important;
}

/* 8. Header/search/cart layout polish */
header .container,
#top .container {
  max-width: 1240px !important;
  width: min(1240px, calc(100% - 36px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#search {
  max-width: 560px !important;
}

#cart {
  max-width: 320px !important;
}

#cart > .btn,
#cart button {
  width: 100% !important;
  border-radius: 16px !important;
}

/* 9. Menu/nav full-width but inner content clean */
#menu,
.navbar {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

#menu .container,
.navbar .container {
  max-width: 1240px !important;
  width: min(1240px, calc(100% - 36px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 10. Hero typography adjusted */
.gw-ruffwear-video-content h1 {
  max-width: 760px !important;
  margin: 20px 0 18px !important;
  color: #fff !important;
  font-size: clamp(46px, 6.4vw, 92px) !important;
  line-height: .91 !important;
  letter-spacing: -.078em !important;
  font-weight: 950 !important;
  text-shadow: 0 24px 60px rgba(0,0,0,.56) !important;
}

.gw-ruffwear-video-content p {
  max-width: 640px !important;
  color: rgba(255,255,255,.90) !important;
  font-size: clamp(16px, 1.5vw, 21px) !important;
  line-height: 1.64 !important;
  text-shadow: 0 12px 34px rgba(0,0,0,.52) !important;
}

/* 11. Product/category grid safety */
.gw-category-grid,
.gw-product-grid,
.gw-mini-products {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 12. Tablet */
@media (max-width: 992px) {
  .gw-ruffwear-video-hero {
    height: 72vh !important;
    min-height: 560px !important;
  }

  .gw-ruffwear-video-content {
    width: calc(100% - 40px) !important;
  }

  .gw-ruffwear-video-content h1 {
    font-size: clamp(38px, 7vw, 66px) !important;
    max-width: 650px !important;
  }

  .gw-ruffwear-video-content p {
    max-width: 560px !important;
    font-size: 15px !important;
  }

  .gw-ruffwear-video-stats {
    display: none !important;
  }

  header .container,
  #top .container,
  #menu .container,
  .navbar .container {
    width: calc(100% - 28px) !important;
  }
}

/* 13. Mobile */
@media (max-width: 560px) {
  .gw-ruffwear-video-hero {
    height: 72vh !important;
    min-height: 520px !important;
    max-height: none !important;
  }

  .gw-ruffwear-video-bg {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  .gw-ruffwear-video-overlay {
    background:
      linear-gradient(180deg, rgba(4,20,14,.40) 0%, rgba(4,20,14,.46) 42%, rgba(4,20,14,.88) 100%),
      linear-gradient(90deg, rgba(4,20,14,.22), rgba(4,20,14,.08)) !important;
  }

  .gw-ruffwear-video-content {
    width: calc(100% - 28px) !important;
    justify-content: flex-end !important;
    padding-bottom: 38px !important;
  }

  .gw-ruffwear-video-content h1 {
    max-width: 100% !important;
    font-size: clamp(34px, 11vw, 46px) !important;
    line-height: .94 !important;
    margin: 12px 0 10px !important;
  }

  .gw-ruffwear-video-content p {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.52 !important;
  }

  .gw-ruffwear-video-content .gw-eyebrow {
    font-size: 10px !important;
    padding: 6px 10px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions {
    margin-top: 16px !important;
    gap: 8px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions a {
    min-height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }

  .gw-dog-home > *:not(.gw-ruffwear-video-hero) {
    width: calc(100% - 24px) !important;
  }

  header .container,
  #top .container,
  #menu .container,
  .navbar .container {
    width: calc(100% - 20px) !important;
  }

  #search,
  #cart {
    max-width: 100% !important;
  }
}

/* =========================================================
   GoldWorld nav/video overlap fix
   Fixes hero video overlapping the menu/header area.
   ========================================================= */

/* Header and nav must stay above the video */
#top,
header,
#menu,
.navbar {
  position: relative !important;
  z-index: 50 !important;
}

/* Prevent the menu from floating over the hero */
#menu,
.navbar {
  margin-bottom: 0 !important;
  border-radius: 0 !important;
}

/* Main homepage starts cleanly below nav */
#common-home.gw-dog-home {
  padding-top: 0 !important;
}

/* Hero video must begin AFTER nav, not under it */
.gw-ruffwear-video-hero {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 0 !important;
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Add clean visual separation between nav and video */
#menu + #common-home,
.navbar + #common-home,
#common-home.gw-dog-home {
  margin-top: 0 !important;
}

/* If OpenCart puts hero directly after nav, force a clean break */
.gw-dog-home > .gw-ruffwear-video-hero:first-child {
  margin-top: 0 !important;
}

/* Fix giant headline: still bold, but not absurdly oversized */
.gw-ruffwear-video-content h1 {
  font-size: clamp(40px, 5.2vw, 76px) !important;
  line-height: .94 !important;
  max-width: 820px !important;
  letter-spacing: -.065em !important;
}

/* Better vertical placement */
.gw-ruffwear-video-content {
  justify-content: center !important;
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}

/* Video hero height adjusted so it does not feel jammed */
.gw-ruffwear-video-hero {
  height: calc(100vh - 170px) !important;
  min-height: 560px !important;
  max-height: 780px !important;
}

/* Desktop nav row cleanup */
@media (min-width: 993px) {
  #menu .navbar-nav,
  .navbar .navbar-nav {
    min-height: 58px !important;
    display: flex !important;
    align-items: center !important;
  }

  #menu .navbar-nav > li > a,
  .navbar .navbar-nav > li > a {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }
}

/* Tablet */
@media (max-width: 992px) {
  .gw-ruffwear-video-hero {
    height: 68vh !important;
    min-height: 520px !important;
  }

  .gw-ruffwear-video-content {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }

  .gw-ruffwear-video-content h1 {
    font-size: clamp(34px, 6.2vw, 58px) !important;
    max-width: 680px !important;
  }
}

/* Mobile */
@media (max-width: 560px) {
  .gw-ruffwear-video-hero {
    height: 68vh !important;
    min-height: 500px !important;
  }

  .gw-ruffwear-video-content {
    justify-content: flex-end !important;
    padding-top: 24px !important;
    padding-bottom: 36px !important;
  }

  .gw-ruffwear-video-content h1 {
    font-size: clamp(30px, 10vw, 42px) !important;
    line-height: .96 !important;
    max-width: 100% !important;
  }

  .gw-ruffwear-video-content p {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
}

/* =========================================================
   GoldWorld Human Visual Fix
   Final override for header, logo, nav, hero video and layout.
   ========================================================= */

/* Global safety */
html,
body {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  background: #fbf7ef !important;
}

body * {
  box-sizing: border-box;
}

/* Top utility bar */
#top {
  position: relative !important;
  z-index: 1000 !important;
  background: #092518 !important;
  color: rgba(255,255,255,.86) !important;
  border: 0 !important;
  min-height: 42px !important;
}

#top .container {
  width: min(1240px, calc(100% - 36px)) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#top a,
#top button,
#top .btn-link {
  color: rgba(255,255,255,.86) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

#top a:hover,
#top button:hover {
  color: #fff !important;
}

/* Main header: make logo/search/cart one clean row */
header {
  position: relative !important;
  z-index: 999 !important;
  background: #fffaf2 !important;
  border-bottom: 1px solid rgba(9,37,24,.10) !important;
  box-shadow: 0 8px 24px rgba(9,37,24,.06) !important;
}

header .container {
  width: min(1240px, calc(100% - 36px)) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 22px 0 !important;
}

header .row {
  display: grid !important;
  grid-template-columns: 320px minmax(360px, 1fr) 280px !important;
  gap: 24px !important;
  align-items: center !important;
  margin: 0 !important;
}

header .row::before,
header .row::after {
  display: none !important;
}

header .row > [class*="col-"] {
  width: auto !important;
  max-width: none !important;
  float: none !important;
  padding: 0 !important;
}

/* Restore and beautify GoldWorld logo */
#logo {
  margin: 0 !important;
  min-width: 0 !important;
}

#logo a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #103625 !important;
  text-decoration: none !important;
  font-size: 20px !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
  letter-spacing: -.035em !important;
  white-space: nowrap !important;
}

#logo a::before {
  content: "金";
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display: inline-grid;
  place-items: center;
  border-radius: 16px;
  background:
    radial-gradient(circle at 32% 24%, rgba(255,255,255,.28), transparent 36%),
    linear-gradient(145deg, #174833, #071f15 72%);
  color: #fff;
  font-size: 22px;
  font-weight: 950;
  box-shadow: 0 14px 30px rgba(9,37,24,.22);
}

/* If the template already outputs a leading 金, reduce duplicate visual damage */
#logo img {
  max-height: 52px !important;
}

/* Search */
#search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

#search .input-group {
  width: 100% !important;
  display: flex !important;
}

#search input,
#search .form-control {
  height: 58px !important;
  border-radius: 22px 0 0 22px !important;
  border: 1px solid rgba(9,37,24,.16) !important;
  background: #fff !important;
  font-size: 18px !important;
  padding-left: 22px !important;
}

#search button,
#search .btn {
  height: 58px !important;
  min-width: 64px !important;
  border-radius: 0 22px 22px 0 !important;
  border: 1px solid rgba(9,37,24,.16) !important;
  background: #fff !important;
  color: #092518 !important;
  box-shadow: none !important;
}

/* Cart */
#cart {
  width: 100% !important;
  max-width: 280px !important;
  margin-left: auto !important;
}

#cart > .btn,
#cart button {
  width: 100% !important;
  height: 58px !important;
  border-radius: 18px !important;
  background: #16231d !important;
  color: #fff !important;
  border: 0 !important;
  font-weight: 900 !important;
  box-shadow: 0 14px 28px rgba(9,37,24,.18) !important;
}

/* Navigation clean bar */
#menu,
.navbar {
  position: relative !important;
  z-index: 998 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #174833 !important;
  box-shadow: none !important;
}

#menu .container,
.navbar .container {
  width: min(1240px, calc(100% - 36px)) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

#menu .navbar-nav,
.navbar .navbar-nav {
  display: flex !important;
  align-items: center !important;
  min-height: 64px !important;
  gap: 6px !important;
}

#menu .navbar-nav > li > a,
.navbar .navbar-nav > li > a {
  color: #fff !important;
  font-weight: 900 !important;
  font-size: 16px !important;
  padding: 22px 22px !important;
  border-radius: 14px !important;
  line-height: 1 !important;
}

#menu .navbar-nav > li > a:hover,
.navbar .navbar-nav > li > a:hover {
  background: rgba(255,255,255,.12) !important;
}

/* Homepage container should not fight the full-width hero */
#common-home.gw-dog-home,
.gw-dog-home {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
}

/* Hero video: start after nav, never overlap header */
.gw-ruffwear-video-hero {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 0 !important;
  height: calc(100vh - 164px) !important;
  min-height: 560px !important;
  max-height: 780px !important;
  overflow: hidden !important;
  background: #071b13 !important;
  box-shadow: none !important;
  clear: both !important;
}

.gw-ruffwear-video-bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #071b13 !important;
}

.gw-ruffwear-video-overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background:
    linear-gradient(90deg, rgba(4,20,14,.78) 0%, rgba(4,20,14,.50) 44%, rgba(4,20,14,.18) 100%),
    linear-gradient(180deg, rgba(4,20,14,.10) 0%, rgba(4,20,14,.20) 48%, rgba(4,20,14,.72) 100%) !important;
  pointer-events: none !important;
}

.gw-ruffwear-video-content {
  position: relative !important;
  z-index: 2 !important;
  width: min(1240px, calc(100% - 48px)) !important;
  height: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  color: #fff !important;
}

/* Reduce headline size so it no longer collides visually */
.gw-ruffwear-video-content h1 {
  max-width: 820px !important;
  margin: 18px 0 16px !important;
  color: #fff !important;
  font-size: clamp(40px, 5vw, 72px) !important;
  line-height: .95 !important;
  letter-spacing: -.06em !important;
  font-weight: 950 !important;
  text-shadow: 0 22px 54px rgba(0,0,0,.58) !important;
}

.gw-ruffwear-video-content p {
  max-width: 640px !important;
  color: rgba(255,255,255,.90) !important;
  font-size: clamp(16px, 1.45vw, 20px) !important;
  line-height: 1.62 !important;
  text-shadow: 0 12px 32px rgba(0,0,0,.54) !important;
}

.gw-ruffwear-video-content .gw-eyebrow {
  background: rgba(0,0,0,.36) !important;
  border: 1px solid rgba(255,255,255,.26) !important;
  color: #fff !important;
  backdrop-filter: blur(12px) !important;
}

.gw-ruffwear-video-content .gw-hero-actions {
  margin-top: 26px !important;
}

.gw-ruffwear-video-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(110px, 1fr)) !important;
  gap: 12px !important;
  max-width: 520px !important;
  margin-top: 28px !important;
}

.gw-ruffwear-video-stats div {
  padding: 15px 16px !important;
  border-radius: 18px !important;
  background: rgba(0,0,0,.30) !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  backdrop-filter: blur(12px) !important;
}

/* All content after hero returns to centered layout */
.gw-dog-home > *:not(.gw-ruffwear-video-hero) {
  width: min(1240px, calc(100% - 36px)) !important;
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.gw-section-head {
  margin-top: 56px !important;
}

/* Tablet */
@media (max-width: 992px) {
  header .row {
    grid-template-columns: 240px 1fr !important;
    gap: 16px !important;
  }

  #cart {
    grid-column: 1 / -1 !important;
    max-width: 100% !important;
  }

  .gw-ruffwear-video-hero {
    height: 70vh !important;
    min-height: 540px !important;
  }

  .gw-ruffwear-video-content {
    width: calc(100% - 40px) !important;
  }

  .gw-ruffwear-video-content h1 {
    font-size: clamp(36px, 6.5vw, 58px) !important;
    max-width: 680px !important;
  }

  .gw-ruffwear-video-stats {
    display: none !important;
  }
}

/* Mobile */
@media (max-width: 560px) {
  #top .container {
    width: calc(100% - 20px) !important;
  }

  header .container {
    width: calc(100% - 20px) !important;
    padding: 16px 0 !important;
  }

  header .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  #logo a {
    font-size: 17px !important;
  }

  #logo a::before {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
    border-radius: 14px !important;
  }

  #search input,
  #search .form-control,
  #search button,
  #search .btn,
  #cart > .btn,
  #cart button {
    height: 48px !important;
  }

  #menu .container,
  .navbar .container {
    width: calc(100% - 20px) !important;
  }

  #menu .navbar-nav,
  .navbar .navbar-nav {
    min-height: auto !important;
    display: block !important;
  }

  #menu .navbar-nav > li > a,
  .navbar .navbar-nav > li > a {
    padding: 14px 12px !important;
    font-size: 15px !important;
  }

  .gw-ruffwear-video-hero {
    height: 72vh !important;
    min-height: 520px !important;
  }

  .gw-ruffwear-video-content {
    width: calc(100% - 28px) !important;
    justify-content: flex-end !important;
    padding-bottom: 36px !important;
  }

  .gw-ruffwear-video-content h1 {
    max-width: 100% !important;
    font-size: clamp(30px, 10vw, 42px) !important;
    line-height: .96 !important;
    margin: 12px 0 10px !important;
  }

  .gw-ruffwear-video-content p {
    max-width: 100% !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  .gw-ruffwear-video-content .gw-eyebrow {
    font-size: 10px !important;
    padding: 6px 10px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions {
    margin-top: 16px !important;
    gap: 8px !important;
  }

  .gw-ruffwear-video-content .gw-hero-actions a {
    min-height: 38px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }

  .gw-dog-home > *:not(.gw-ruffwear-video-hero) {
    width: calc(100% - 24px) !important;
  }
}

/* GoldWorld language switcher fix */
.gw-language-form {
  display: inline-block !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 9999 !important;
}

.gw-language-details {
  position: relative !important;
  display: inline-block !important;
}

.gw-language-summary {
  list-style: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: inherit !important;
  font-weight: 800 !important;
  user-select: none !important;
}

.gw-language-summary::-webkit-details-marker {
  display: none !important;
}

.gw-language-summary::after {
  content: "▾";
  font-size: 12px;
  opacity: .8;
}

.gw-language-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  min-width: 168px !important;
  padding: 8px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(16,43,31,.14) !important;
  box-shadow: 0 18px 38px rgba(16,43,31,.18) !important;
  z-index: 10000 !important;
}

.gw-language-option {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  border: 0 !important;
  background: transparent !important;
  color: #102b1f !important;
  padding: 9px 10px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  text-align: left !important;
  cursor: pointer !important;
}

.gw-language-option:hover,
.gw-language-option.active {
  background: #e8efe6 !important;
  color: #174833 !important;
}

@media (max-width: 560px) {
  .gw-language-menu {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: 46px !important;
    min-width: auto !important;
  }
}


/* GoldWorld language direct-link fix */
.gw-language-form {
  display: inline-block !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 9999 !important;
}

.gw-language-details {
  position: relative !important;
  display: inline-block !important;
}

.gw-language-summary {
  list-style: none !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: inherit !important;
  font-weight: 800 !important;
  user-select: none !important;
}

.gw-language-summary::-webkit-details-marker {
  display: none !important;
}

.gw-language-summary::after {
  content: "▾";
  font-size: 12px;
  opacity: .8;
}

.gw-language-menu {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  min-width: 168px !important;
  padding: 8px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(16,43,31,.14) !important;
  box-shadow: 0 18px 38px rgba(16,43,31,.18) !important;
  z-index: 10000 !important;
}

.gw-language-option {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #102b1f !important;
  padding: 9px 10px !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
  text-align: left !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.gw-language-option:hover,
.gw-language-option.active {
  background: #e8efe6 !important;
  color: #174833 !important;
}

@media (max-width: 560px) {
  .gw-language-menu {
    position: fixed !important;
    left: 12px !important;
    right: 12px !important;
    top: 46px !important;
    min-width: auto !important;
  }
}