/*
Theme Name: Gallows West
Theme URI: https://gallowswest.com/
Author: Gallows West
Description: Custom Gothic Western WordPress + WooCommerce theme for Gallows West.
Version: 2.4.0
Text Domain: gallows-west
*/

    :root {
      --ink: #21110d;
      --ink-soft: #402116;
      --brown: #652410;
      --rust: #9c3825;
      --blood: #b33527;
      --gold: #d6ad6b;
      --parchment: #edd39a;
      --bone: #f5e5bb;
      --shadow: rgba(12, 6, 3, .76);
      --line: rgba(214, 173, 107, .28);
      --max: 1180px;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--bone);
      background:
        radial-gradient(circle at 20% -10%, rgba(177, 74, 42, .22), transparent 34rem),
        radial-gradient(circle at 90% 10%, rgba(214, 173, 107, .16), transparent 30rem),
        linear-gradient(180deg, #120a07 0%, #1a0d09 42%, #0d0807 100%);
      font-family: Georgia, 'Times New Roman', serif;
      overflow-x: hidden;
    }
    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .13;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
      background-size: 38px 38px;
      mix-blend-mode: screen;
      z-index: 20;
    }
    a { color: inherit; }
    .grain {
      position: fixed;
      inset: 0;
      z-index: 21;
      pointer-events: none;
      opacity: .18;
      background-image: radial-gradient(circle at 50% 50%, rgba(255,255,255,.16) 0 1px, transparent 1px);
      background-size: 5px 5px;
      mix-blend-mode: overlay;
    }
    .topbar {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 30;
      display: flex;
      justify-content: center;
      padding: 14px 18px;
      background: linear-gradient(180deg, rgba(16,8,5,.82), rgba(16,8,5,.18));
      backdrop-filter: blur(10px);
    }
    .nav {
      width: min(var(--max), 100%);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }
    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      letter-spacing: .22em;
      text-transform: uppercase;
      font-size: 13px;
      color: var(--gold);
      text-decoration: none;
      white-space: nowrap;
    }
    .brand img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; border: 1px solid rgba(214,173,107,.3); }
    .links { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
    .links a {
      text-decoration: none;
      text-transform: uppercase;
      letter-spacing: .13em;
      font-size: 11px;
      color: rgba(245,229,187,.86);
      border: 1px solid transparent;
      padding: 9px 11px;
      border-radius: 999px;
    }
    .links a:hover { border-color: rgba(214,173,107,.35); background: rgba(245,229,187,.06); }
    .hero {
      min-height: 100svh;
      display: grid;
      place-items: center;
      position: relative;
      padding: 104px 20px 64px;
      overflow: hidden;
      isolation: isolate;
    }
    .hero::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(14,8,6,.96), rgba(26,13,9,.74), rgba(14,8,6,.58)),
        url('assets/images/gallows-west-duo.jpg') center / cover no-repeat;
      filter: saturate(.84) contrast(1.08);
      transform: scale(1.02);
      z-index: -3;
    }
    .hero::after {
      content: "";
      position: absolute; inset: 0;
      background: radial-gradient(circle at 50% 45%, transparent 0 28%, rgba(0,0,0,.42) 72%, rgba(0,0,0,.72) 100%);
      z-index: -2;
    }
    .hero-inner {
      width: min(var(--max), 100%);
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      align-items: center;
      gap: clamp(28px, 5vw, 70px);
    }
    .sigil-frame {
      position: relative;
      width: min(468px, 86vw);
      margin: -6px 0 42px -6px;
      padding: 28px;
      border-radius: 38px 24px 40px 26px;
      background:
        linear-gradient(145deg, rgba(165,119,82,.22), rgba(34,19,14,.54) 24%, rgba(69,40,27,.72) 58%, rgba(22,12,9,.62));
      border: 2px solid rgba(224,182,132,.24);
      box-shadow:
        inset 0 0 0 1px rgba(255,234,204,.14),
        inset 0 0 0 10px rgba(255,233,204,.05),
        inset 0 0 0 18px rgba(72,43,28,.22),
        inset 0 0 46px rgba(0,0,0,.36),
        0 0 0 1px rgba(255,220,184,.06),
        -12px 16px 0 rgba(12,7,5,.22),
        0 24px 58px rgba(0,0,0,.36);
      transform: rotate(-6.4deg);
      isolation: isolate;
      backdrop-filter: blur(3px);
      -webkit-backdrop-filter: blur(3px);
    }
    .sigil-frame::before {
      content: "";
      position: absolute;
      inset: 9px;
      border-radius: 31px 19px 33px 20px;
      border: 2px solid rgba(255,239,214,.18);
      box-shadow:
        inset 0 0 0 1px rgba(255,225,190,.10),
        inset 0 0 28px rgba(255,255,255,.04);
      background:
        linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.01) 18%, rgba(0,0,0,.02) 72%, rgba(0,0,0,.12));
      pointer-events: none;
      z-index: 2;
    }
    .sigil-frame::after {
      content: "";
      position: absolute;
      inset: -16px 16px 18px -20px;
      border-radius: 44px 27px 46px 29px;
      border: 3px solid rgba(120,78,52,.36);
      background:
        linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.015) 24%, rgba(0,0,0,.08) 76%),
        linear-gradient(145deg, rgba(176,122,82,.16), rgba(22,12,9,.22));
      box-shadow:
        inset 0 0 0 1px rgba(255,236,210,.10),
        10px 12px 0 rgba(10,5,4,.18),
        0 18px 38px rgba(0,0,0,.22);
      pointer-events: none;
      z-index: -1;
      transform: rotate(-3.3deg);
      opacity: .98;
    }
    .sigil {
      width: 100%;
      display: block;
      margin: 0;
      border-radius: 11px 8px 13px 9px;
      filter: sepia(.08) contrast(1.03) saturate(.9);
      opacity: .96;
      box-shadow: inset 0 0 24px rgba(64,32,18,.2);
    }
    .eyebrow {
      color: var(--gold);
      text-transform: uppercase;
      letter-spacing: .24em;
      font-size: 12px;
      margin: 0 0 14px;
    }
    h1 {
      font-size: clamp(46px, 8vw, 118px);
      line-height: .86;
      margin: 0 0 22px;
      letter-spacing: -.05em;
      color: var(--bone);
      text-shadow: 0 10px 32px rgba(0,0,0,.58);
      max-width: 760px;
    }
    .subtitle {
      font-size: clamp(18px, 2.2vw, 27px);
      line-height: 1.36;
      margin: 0 0 28px;
      max-width: 720px;
      color: rgba(245,229,187,.88);
    }
    .buttons { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 48px;
      padding: 0 18px;
      text-decoration: none;
      border-radius: 999px;
      border: 1px solid rgba(214,173,107,.45);
      background: rgba(245,229,187,.08);
      color: var(--bone);
      text-transform: uppercase;
      letter-spacing: .13em;
      font-size: 12px;
      box-shadow: 0 12px 28px rgba(0,0,0,.22);
      transition: transform .2s ease, background .2s ease, border-color .2s ease;
    }
    .btn:hover { transform: translateY(-2px); background: rgba(245,229,187,.13); border-color: rgba(245,229,187,.6); }
    .btn.primary { background: linear-gradient(135deg, var(--blood), #6d2219); border-color: rgba(255,180,120,.52); }
    .hero-card {
      position: relative;
      border: 1px solid rgba(214,173,107,.34);
      background: rgba(18,9,6,.52);
      padding: clamp(12px, 2vw, 18px);
      border-radius: 28px;
      box-shadow: 0 34px 88px rgba(0,0,0,.52);
      transform: rotate(1.2deg);
    }
    .hero-card img { width: 100%; border-radius: 18px; display: block; }
    .hero-card::before {
      content: "Where The River Turns Red";
      position: absolute;
      right: 18px; bottom: 18px;
      max-width: 260px;
      color: rgba(245,229,187,.88);
      background: rgba(0,0,0,.52);
      border: 1px solid rgba(214,173,107,.25);
      padding: 12px 14px;
      border-radius: 16px;
      text-transform: uppercase;
      letter-spacing: .18em;
      font-size: 10px;
    }
    section { padding: 88px 20px; position: relative; }
    .wrap { width: min(var(--max), 100%); margin: 0 auto; }
    .section-title {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 28px;
      margin-bottom: 30px;
      border-bottom: 1px solid var(--line);
      padding-bottom: 18px;
    }
    h2 {
      margin: 0;
      color: var(--bone);
      font-size: clamp(34px, 5vw, 64px);
      line-height: .95;
      letter-spacing: -.035em;
    }
    .kicker { margin: 0; color: var(--gold); text-transform: uppercase; letter-spacing: .2em; font-size: 12px; }
    .two { display: grid; grid-template-columns: .92fr 1.08fr; gap: clamp(24px, 5vw, 64px); align-items: center; }
    .photo-frame {
      border: 1px solid rgba(214,173,107,.32);
      padding: 12px;
      border-radius: 28px;
      background: linear-gradient(180deg, rgba(245,229,187,.08), rgba(245,229,187,.02));
      box-shadow: 0 26px 70px rgba(0,0,0,.36);
    }
    .photo-frame img { width: 100%; display: block; border-radius: 18px; filter: contrast(1.05) saturate(.9); }
    .copy { color: rgba(245,229,187,.84); font-size: clamp(17px, 1.6vw, 21px); line-height: 1.65; }
    .copy p { margin: 0 0 18px; }
    .ornament {
      color: var(--gold);
      letter-spacing: .38em;
      margin: 18px 0;
      opacity: .9;
    }
    .release {
      background:
        radial-gradient(circle at 20% 10%, rgba(179,53,39,.16), transparent 34rem),
        linear-gradient(180deg, rgba(245,229,187,.035), rgba(0,0,0,.08));
      border-top: 1px solid rgba(214,173,107,.16);
      border-bottom: 1px solid rgba(214,173,107,.16);
    }
    .release-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(24px, 5vw, 60px); align-items: center; }
    .cover { border-radius: 28px; overflow: hidden; box-shadow: 0 26px 70px rgba(0,0,0,.45); border: 1px solid rgba(214,173,107,.3); }
    .cover img { width: 100%; display: block; }
    .track-title { font-size: clamp(38px, 5vw, 70px); line-height: .96; margin: 0 0 18px; color: var(--bone); letter-spacing: -.04em; }
    .red { color: #ff654f; text-shadow: 0 0 24px rgba(179,53,39,.25); }
    .listen-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
    .listen-grid a {
      text-decoration: none;
      min-height: 86px;
      border: 1px solid rgba(214,173,107,.32);
      border-radius: 18px;
      padding: 16px;
      background: rgba(245,229,187,.06);
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 6px;
      transition: transform .2s ease, background .2s ease;
    }
    .listen-grid a:hover { transform: translateY(-3px); background: rgba(245,229,187,.1); }
    .listen-grid strong { text-transform: uppercase; letter-spacing: .16em; font-size: 12px; color: var(--gold); }
    .listen-grid span { color: rgba(245,229,187,.82); font-size: 15px; }
    .gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .gallery figure { margin: 0; position: relative; overflow: hidden; border-radius: 28px; border: 1px solid rgba(214,173,107,.24); box-shadow: 0 24px 60px rgba(0,0,0,.28); background: rgba(245,229,187,.05); }
    .gallery img { width: 100%; height: 100%; min-height: 460px; display: block; object-fit: cover; filter: saturate(.92) contrast(1.04); }
    .gallery figcaption {
      position: absolute; left: 14px; bottom: 14px;
      background: rgba(12,6,3,.65);
      border: 1px solid rgba(214,173,107,.24);
      color: rgba(245,229,187,.88);
      border-radius: 999px;
      padding: 10px 14px;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .16em;
    }
    /* ===== Homepage shop feature ===== */
    .gw-home-shop {
      overflow: hidden;
      isolation: isolate;
      padding-top: 100px;
      padding-bottom: 100px;
      background:
        radial-gradient(circle at 18% 36%, rgba(179,53,39,.13), transparent 29rem),
        radial-gradient(circle at 82% 45%, rgba(214,173,107,.09), transparent 27rem),
        linear-gradient(180deg, rgba(4,3,3,.22), rgba(0,0,0,.42));
      border-top: 1px solid rgba(214,173,107,.18);
      border-bottom: 1px solid rgba(214,173,107,.18);
    }
    .gw-home-shop::before,
    .gw-home-shop::after {
      content: "";
      position: absolute;
      pointer-events: none;
      z-index: -1;
    }
    .gw-home-shop::before {
      inset: 0;
      opacity: .25;
      background:
        repeating-linear-gradient(0deg, transparent 0 34px, rgba(214,173,107,.018) 35px),
        repeating-linear-gradient(90deg, transparent 0 34px, rgba(214,173,107,.012) 35px);
      mask-image: linear-gradient(90deg, #000, transparent 72%);
    }
    .gw-home-shop::after {
      width: 460px;
      height: 460px;
      right: -150px;
      bottom: -250px;
      border: 1px solid rgba(214,173,107,.13);
      border-radius: 50%;
      box-shadow: 0 0 0 30px rgba(214,173,107,.025), 0 0 0 64px rgba(214,173,107,.018);
    }
    .gw-shop-panel {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1.62fr) minmax(300px, .78fr);
      gap: clamp(34px, 5vw, 68px);
      align-items: center;
      padding: clamp(22px, 3vw, 38px);
      border: 1px solid rgba(214,173,107,.38);
      outline: 1px solid rgba(214,173,107,.12);
      outline-offset: -10px;
      border-radius: 3px;
      background:
        linear-gradient(135deg, rgba(245,229,187,.025), transparent 35%),
        linear-gradient(180deg, rgba(9,6,5,.88), rgba(15,9,7,.94));
      box-shadow: 0 34px 90px rgba(0,0,0,.48), inset 0 0 80px rgba(0,0,0,.28);
    }
    .gw-shop-panel::before,
    .gw-shop-panel::after {
      position: absolute;
      color: rgba(214,173,107,.68);
      font-size: 28px;
      line-height: 1;
      text-shadow: 0 0 18px rgba(214,173,107,.18);
    }
    .gw-shop-panel::before { content: "❦"; top: 12px; left: 16px; transform: rotate(-24deg); }
    .gw-shop-panel::after { content: "❦"; right: 16px; bottom: 12px; transform: rotate(156deg); }
    .gw-shop-collage {
      position: relative;
      min-height: 660px;
      display: grid;
      grid-template-columns: repeat(12, minmax(0,1fr));
      grid-template-rows: repeat(12, 1fr);
      gap: 12px;
      perspective: 1000px;
    }
    .gw-shop-card {
      position: relative;
      overflow: hidden;
      min-width: 0;
      border: 1px solid rgba(214,173,107,.42);
      background: #160f0c;
      box-shadow: 0 18px 42px rgba(0,0,0,.45);
      transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease, z-index .01s linear;
      text-decoration: none;
    }
    .gw-shop-card::before {
      content: "";
      position: absolute;
      inset: 6px;
      z-index: 2;
      pointer-events: none;
      border: 1px solid rgba(245,229,187,.15);
      box-shadow: inset 0 0 0 1px rgba(0,0,0,.22);
    }
    .gw-shop-card::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(214,173,107,.035), transparent 30%, rgba(0,0,0,.14));
      mix-blend-mode: soft-light;
    }
    .gw-shop-card img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
      filter: saturate(.84) contrast(1.04) sepia(.06);
      transition: transform .55s ease, filter .35s ease;
    }
    .gw-shop-card:hover {
      z-index: 5;
      transform: translateY(-7px) rotate(0deg) scale(1.018);
      border-color: rgba(237,211,154,.72);
      box-shadow: 0 28px 58px rgba(0,0,0,.58);
    }
    .gw-shop-card:hover img { transform: scale(1.028); filter: saturate(.98) contrast(1.04); }
    .gw-shop-card-hoodie { grid-column: 1 / 6; grid-row: 1 / 9; transform: rotate(-1.6deg); }
    .gw-shop-card-shirt-flat { grid-column: 6 / 10; grid-row: 1 / 6; transform: rotate(.9deg); }
    .gw-shop-card-shirt-model { grid-column: 9 / 13; grid-row: 2 / 8; transform: rotate(1.8deg); }
    .gw-shop-card-portrait { grid-column: 5 / 9; grid-row: 7 / 13; transform: rotate(-.9deg); }
    .gw-shop-card-sigil { grid-column: 1 / 5; grid-row: 9 / 13; transform: rotate(.8deg); }
    .gw-shop-card-tote { grid-column: 9 / 13; grid-row: 8 / 13; transform: rotate(-1.2deg); }
    .gw-shop-card-shirt-flat img,
    .gw-shop-card-sigil img { object-position: center; }
    .gw-shop-card-shirt-model img { object-position: center 38%; }
    .gw-shop-card-portrait img { object-position: center 22%; }
    .gw-shop-card-tote img { object-position: center 58%; }
    .gw-shop-copy {
      position: relative;
      text-align: center;
      padding: 30px 6px;
    }
    .gw-shop-copy::before,
    .gw-shop-copy::after {
      content: "";
      display: block;
      width: min(270px, 80%);
      height: 1px;
      margin: 0 auto 25px;
      background: linear-gradient(90deg, transparent, rgba(214,173,107,.68), transparent);
    }
    .gw-shop-copy::after { margin: 28px auto 0; }
    .gw-shop-flourish {
      color: var(--gold);
      font-size: 16px;
      letter-spacing: .5em;
      margin-bottom: 16px;
      opacity: .82;
    }
    .gw-shop-copy h2 {
      max-width: 440px;
      margin: 0 auto;
      font-size: clamp(42px, 5.1vw, 74px);
      line-height: .88;
      letter-spacing: -.045em;
      text-shadow: 0 12px 34px rgba(0,0,0,.52);
    }
    .gw-shop-copy h2 .gw-shop-the {
      display: block;
      margin: 0 0 12px;
      color: var(--gold);
      font-size: .34em;
      line-height: 1;
      letter-spacing: .28em;
      text-transform: uppercase;
    }
    .gw-shop-copy h2 .gw-shop-word {
      display: block;
      margin-top: 12px;
      color: var(--bone);
      font-size: .72em;
      line-height: 1;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .gw-shop-tagline {
      max-width: 360px;
      margin: 24px auto 28px;
      color: rgba(245,229,187,.82);
      font-size: clamp(18px, 1.8vw, 22px);
      line-height: 1.5;
      font-style: italic;
    }
    .gw-shop-cta {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 13px;
      min-height: 54px;
      padding: 0 28px;
      color: var(--bone);
      border: 1px solid rgba(214,173,107,.62);
      background: rgba(214,173,107,.055);
      text-decoration: none;
      text-transform: uppercase;
      letter-spacing: .19em;
      font-size: 12px;
      box-shadow: inset 0 0 0 4px rgba(0,0,0,.2), 0 14px 34px rgba(0,0,0,.26);
      transition: background .25s ease, color .25s ease, transform .25s ease, border-color .25s ease;
    }
    .gw-shop-cta span { font-size: 19px; line-height: 1; transition: transform .25s ease; }
    .gw-shop-cta:hover {
      transform: translateY(-2px);
      background: var(--gold);
      color: #1a0d09;
      border-color: var(--parchment);
    }
    .gw-shop-cta:hover span { transform: translateX(4px); }

    .contact {
      text-align: center;
      background:
        linear-gradient(rgba(9,5,4,.72), rgba(9,5,4,.92)),
        url('assets/images/gallows-west-portrait.jpg') center 32% / cover no-repeat;
      border-top: 1px solid rgba(214,173,107,.16);
    }
    .contact .wrap { max-width: 850px; }
    .contact h2 { margin-bottom: 18px; }
    .contact p { color: rgba(245,229,187,.82); font-size: 20px; line-height: 1.55; margin: 0 auto 24px; }
    footer {
      padding: 28px 20px 40px;
      text-align: center;
      color: rgba(245,229,187,.54);
      font-size: 12px;
      letter-spacing: .12em;
      text-transform: uppercase;
    }
    .small-sigil { width: 86px; height: 86px; object-fit: cover; border-radius: 50%; display: block; margin: 0 auto 14px; opacity: .86; }
    @media (max-width: 900px) {
      .topbar { position: absolute; background: linear-gradient(180deg, rgba(16,8,5,.76), rgba(16,8,5,0)); }
      .nav { align-items: flex-start; }
      .links { gap: 4px; }
      .links a { padding: 7px 8px; font-size: 10px; }
      .hero { padding-top: 110px; min-height: auto; }
      .hero-inner, .two, .release-grid { grid-template-columns: 1fr; }
      .hero-card { transform: none; max-width: 520px; margin: 0 auto; }
      .sigil-frame { width: min(366px, 80vw); margin-left: auto; margin-right: auto; padding: 20px; transform: rotate(-5.4deg); }
      .section-title { display: block; }
      .section-title .kicker { margin-bottom: 12px; }
      .listen-grid { grid-template-columns: 1fr; }
      .gallery { grid-template-columns: 1fr; }
      .gallery img { min-height: auto; }
    }
    @media (max-width: 560px) {
      .brand span { display: none; }
      .links a:nth-child(2), .links a:nth-child(3) { display: none; }
      h1 { font-size: 54px; }
      section { padding: 64px 18px; }
      .subtitle, .copy { font-size: 17px; }
      .btn { width: 100%; }
      .buttons { width: 100%; }
      .hero-card::before { left: 14px; right: 14px; bottom: 14px; max-width: none; text-align: center; }
    }
  

/* ===== WordPress / WooCommerce integration ===== */
body.admin-bar .topbar { top: 32px; }
.gw-shop-main { min-height: 80vh; padding: 130px 20px 80px; }
.gw-shop-main .wrap { width: min(var(--max), 100%); margin: 0 auto; }
.gw-page-title { margin: 0 0 28px; font-size: clamp(38px, 7vw, 74px); line-height: .95; color: var(--bone); }
.woocommerce, .woocommerce-page { color: var(--bone); }
.woocommerce .woocommerce-breadcrumb { color: rgba(245,229,187,.58); margin-bottom: 26px; }
.woocommerce .woocommerce-breadcrumb a { color: var(--gold); }
.woocommerce ul.products { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none;}
.woocommerce ul.products li.product { width:auto!important; margin:0!important; float:none!important; padding:14px; border:1px solid var(--line); border-radius:18px; background:rgba(245,229,187,.035); }
.woocommerce ul.products li.product a img { border-radius:12px; margin-bottom:16px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title { color:var(--bone); font-family:Georgia,'Times New Roman',serif; font-size:22px; }
.woocommerce ul.products li.product .price, .woocommerce div.product p.price, .woocommerce div.product span.price { color:var(--gold); font-weight:700; }
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
  background:transparent; color:var(--bone); border:1px solid rgba(214,173,107,.48); border-radius:999px; padding:13px 18px; text-transform:uppercase; letter-spacing:.12em; font-size:11px; transition:.2s ease;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover { background:var(--blood); border-color:var(--blood); color:white; }
.woocommerce div.product { display:block; }
.woocommerce div.product .product_title { color:var(--bone); font-size:clamp(34px,5vw,58px); }
.woocommerce div.product div.images img { border-radius:16px; }
.woocommerce div.product form.cart .variations select, .woocommerce select, .woocommerce input.input-text, .woocommerce textarea, .woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
  background:#140b08; color:var(--bone); border:1px solid rgba(214,173,107,.34); border-radius:8px; padding:11px;
}
.woocommerce table.shop_table { border-color:var(--line); background:rgba(245,229,187,.025); }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-color:var(--line); }
.woocommerce-info, .woocommerce-message { background:rgba(245,229,187,.055); color:var(--bone); border-top-color:var(--gold); }
.woocommerce-info::before, .woocommerce-message::before { color:var(--gold); }
.woocommerce-error { background:rgba(179,53,39,.12); color:var(--bone); border-top-color:var(--blood); }
.woocommerce-error::before { color:var(--blood); }
.woocommerce-cart table.cart img { width:90px; border-radius:10px; }
.woocommerce-checkout #payment { background:rgba(245,229,187,.055); }
.woocommerce-checkout #payment div.payment_box { background:#21110d; color:var(--bone); }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color:#21110d; }
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style:none; padding:0; }
.woocommerce-account .woocommerce-MyAccount-navigation a { display:block; padding:10px 0; color:var(--gold); }
.gw-cart-link { border-color:rgba(214,173,107,.35)!important; }
.gw-cart-count { display:inline-grid; place-items:center; min-width:18px; height:18px; margin-left:5px; padding:0 5px; border-radius:999px; background:var(--blood); color:white; font-size:9px; letter-spacing:0; }
@media (max-width: 860px){
  body.admin-bar .topbar { top:46px; }
  .woocommerce ul.products { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px){
  .woocommerce ul.products { grid-template-columns:1fr; }
  .gw-shop-main { padding-top:150px; }
}

/* ===== Shop feature responsive + size-chart polish (v1.7) ===== */
@media (max-width: 980px) {
  .gw-shop-panel { grid-template-columns: 1fr; }
  .gw-shop-collage { min-height: 620px; }
  .gw-shop-copy { max-width: 650px; margin: 0 auto; padding-top: 12px; }
  .gw-shop-copy h2 { max-width: 620px; }
}
@media (max-width: 680px) {
  .gw-home-shop { padding: 70px 14px; }
  .gw-shop-panel { padding: 16px; outline-offset: -7px; gap: 28px; }
  .gw-shop-collage {
    min-height: 720px;
    grid-template-columns: repeat(2, minmax(0,1fr));
    grid-template-rows: repeat(8, minmax(0,1fr));
    gap: 9px;
  }
  .gw-shop-card { transform: none!important; }
  .gw-shop-card-hoodie { grid-column: 1; grid-row: 1 / 4; }
  .gw-shop-card-shirt-flat { grid-column: 2; grid-row: 1 / 3; }
  .gw-shop-card-shirt-model { grid-column: 2; grid-row: 3 / 6; }
  .gw-shop-card-sigil { grid-column: 1; grid-row: 4 / 6; }
  .gw-shop-card-portrait { grid-column: 1; grid-row: 6 / 9; }
  .gw-shop-card-tote { grid-column: 2; grid-row: 6 / 9; }
  .gw-shop-copy { padding: 18px 8px 22px; }
  .gw-shop-copy h2 { font-size: clamp(40px, 14vw, 62px); }
  .gw-shop-cta { width: 100%; }
}

/* Size-chart links/buttons: keep them visible, on-brand, and directly below size choices. */
.gw-size-chart-trigger,
.woocommerce div.product .gw-size-chart-trigger,
.woocommerce div.product a.gw-size-chart-trigger,
.woocommerce div.product button.gw-size-chart-trigger {
  display: inline-flex!important;
  align-items: center;
  width: auto!important;
  margin: 6px 0 16px!important;
  padding: 0 0 4px!important;
  border: 0!important;
  border-bottom: 1px solid rgba(214,173,107,.52)!important;
  border-radius: 0!important;
  background: transparent!important;
  color: var(--gold)!important;
  font-family: Georgia,'Times New Roman',serif!important;
  font-size: 14px!important;
  font-weight: 700!important;
  line-height: 1.35!important;
  letter-spacing: .06em!important;
  text-transform: none!important;
  box-shadow: none!important;
  cursor: pointer;
}
.woocommerce div.product .gw-size-chart-trigger:hover {
  color: var(--bone)!important;
  border-bottom-color: var(--bone)!important;
  transform: none!important;
}
.gw-size-chart-row {
  display: block;
  width: 100%;
  margin: -4px 0 2px;
  clear: both;
}

/* Common size-chart modal/plugin surfaces inherit the Gallows West palette cleanly. */
body .md-size-chart-modal,
body .size-chart-modal,
body .woo-size-chart-modal,
body [class*="size-chart-modal"] {
  color: var(--bone)!important;
  background: #140b08!important;
}
body .md-size-chart-modal table,
body .size-chart-modal table,
body .woo-size-chart-modal table,
body [class*="size-chart-modal"] table {
  color: var(--bone)!important;
  background: rgba(245,229,187,.025)!important;
  border-color: rgba(214,173,107,.28)!important;
}
body .md-size-chart-modal th,
body .size-chart-modal th,
body .woo-size-chart-modal th,
body [class*="size-chart-modal"] th {
  color: var(--gold)!important;
  background: rgba(214,173,107,.09)!important;
}
body .md-size-chart-modal td,
body .size-chart-modal td,
body .woo-size-chart-modal td,
body [class*="size-chart-modal"] td {
  color: var(--bone)!important;
  border-color: rgba(214,173,107,.22)!important;
}



/* ===== Product detail + shop image polish (v1.8) ===== */
/* Printify/WooCommerce product-description tables can arrive with their own dark text colors.
   Force readable Gallows West colors without changing the source product description. */
.woocommerce div.product .woocommerce-product-details__short-description table,
.woocommerce div.product .woocommerce-Tabs-panel table,
.woocommerce div.product .woocommerce-product-details__short-description table th,
.woocommerce div.product .woocommerce-product-details__short-description table td,
.woocommerce div.product .woocommerce-Tabs-panel table th,
.woocommerce div.product .woocommerce-Tabs-panel table td {
  color: var(--bone)!important;
  border-color: rgba(214,173,107,.28)!important;
}
.woocommerce div.product .woocommerce-product-details__short-description table th,
.woocommerce div.product .woocommerce-Tabs-panel table th {
  color: var(--gold)!important;
}

/* Keep wide Printify specification/size tables inside the product panel on phones.
   The table itself scrolls when necessary instead of pushing the whole page sideways. */
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel {
  max-width: 100%;
  overflow-wrap: break-word;
}
.woocommerce div.product .woocommerce-product-details__short-description table,
.woocommerce div.product .woocommerce-Tabs-panel table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  white-space: nowrap;
}

@media (max-width: 680px) {
  .woocommerce div.product .woocommerce-product-details__short-description,
  .woocommerce div.product .woocommerce-Tabs-panel,
  .woocommerce div.product .woocommerce-Tabs-panel--description {
    width: 100%!important;
    max-width: 100%!important;
    min-width: 0!important;
    overflow-x: hidden!important;
  }
  .woocommerce div.product .woocommerce-product-details__short-description table,
  .woocommerce div.product .woocommerce-Tabs-panel table {
    font-size: 14px;
  }
  .woocommerce div.product .woocommerce-product-details__short-description table th,
  .woocommerce div.product .woocommerce-product-details__short-description table td,
  .woocommerce div.product .woocommerce-Tabs-panel table th,
  .woocommerce div.product .woocommerce-Tabs-panel table td {
    padding: 8px 10px!important;
  }
}

/* Preserve crisp shop-card images when WooCommerce supplies a larger source. */
.woocommerce ul.products li.product a img {
  width: 100%;
  height: auto;
  image-rendering: auto;
}


/* ===== Stable compact single-product gallery (v2.4) =====
   Keep WooCommerce's native gallery alive off-screen for variation switching,
   while presenting a predictable main image + horizontal thumbnail rail. */
.single-product .gw-native-gallery-hidden {
  position: absolute!important;
  left: -10000px!important;
  top: auto!important;
  width: 1px!important;
  height: 1px!important;
  overflow: hidden!important;
  opacity: 0!important;
  pointer-events: none!important;
}
.single-product .gw-product-gallery-ui {
  width: 100%;
  max-width: 100%;
  margin: 0 0 28px;
}
.single-product .gw-product-gallery-stage {
  width: 100%;
  max-width: 100%;
  min-height: 0;
}
.single-product .gw-product-gallery-main {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 760px;
  object-fit: contain;
  border-radius: 16px;
}
.single-product .gw-product-gallery-thumbs {
  display: flex;
  gap: 9px;
  width: 100%;
  max-width: 100%;
  margin: 12px 0 0;
  padding: 2px 1px 7px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.single-product .gw-product-gallery-thumb {
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  padding: 0;
  border: 1px solid rgba(214,173,107,.28);
  border-radius: 10px;
  overflow: hidden;
  background: #140b08;
  opacity: .68;
  cursor: pointer;
}
.single-product .gw-product-gallery-thumb.is-active {
  opacity: 1;
  border-color: rgba(214,173,107,.82);
}
.single-product .gw-product-gallery-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 680px) {
  .single-product .gw-product-gallery-ui { margin-bottom: 20px; }
  .single-product .gw-product-gallery-main { max-height: 68vh; }
  .single-product .gw-product-gallery-thumbs { gap: 7px; margin-top: 9px; }
  .single-product .gw-product-gallery-thumb {
    flex-basis: 58px;
    width: 58px;
    height: 58px;
    border-radius: 8px;
  }
}

/* ===== Desktop single-product two-column layout (v2.6) =====
   Keep the proven mobile presentation unchanged. On desktop, place the compact
   custom gallery beside the product information so variation controls and the
   selected image stay visible in the same viewport. */
@media (min-width: 981px) {
  .single-product div.product .gw-product-gallery-ui {
    float: left;
    width: 46%;
    max-width: 540px;
    margin: 0 5% 34px 0;
  }

  .single-product div.product .gw-product-gallery-main {
    width: 100%;
    max-height: 560px;
    object-fit: contain;
  }

  .single-product div.product div.summary {
    float: right;
    width: 49%;
    margin-bottom: 34px;
  }

  .single-product div.product .product_title {
    margin-top: 0;
    font-size: clamp(34px, 3.7vw, 52px);
    line-height: .96;
  }

  .single-product div.product .woocommerce-tabs,
  .single-product div.product .related,
  .single-product div.product .upsells {
    clear: both;
  }
}