@charset "utf-8";

/* ===== Global Defaults ===== */
:root {
  --g73-lightframe-img:   url("/images/frames/lightframe.png");
  --g73-lightframe-slice: 60;
  --g73-lightframe-repeat: round;

  --artwork-gold: #d4af37; /* keep */
}

/* ===== Base Light Frame (scoped to artwork pages) ===== */
.artwork-page .light-frame {
  --imgw: 800px;   /* default image width */
  --frame: 20px;

  display: inline-block;
  border: var(--frame) solid transparent;
  border-image-source: var(--g73-lightframe-img);
  border-image-slice: var(--g73-lightframe-slice);
  border-image-repeat: var(--g73-lightframe-repeat);
  border-image-width: var(--frame);
  background: transparent; /* set to #f9f9f9 for a light “mat” if desired */
  box-shadow: 0 6px 24px rgba(0,0,0,.25), 0 2px 8px rgba(0,0,0,.2);
}

/* image inside the light frame */
.artwork-page .light-frame img {
  width: var(--imgw);
  max-width: 100%;
  height: auto;
  display: block;
}

/* ===== Utilities for quick widths ===== */
/* These override --imgw on the SAME element that has .light-frame */
.artwork-page .light-frame.imgw-400  { --imgw: 400px; }
.artwork-page .light-frame.imgw-500  { --imgw: 500px; }
.artwork-page .light-frame.imgw-600  { --imgw: 600px; }
.artwork-page .light-frame.imgw-700  { --imgw: 700px; }
.artwork-page .light-frame.imgw-800  { --imgw: 800px; }
.artwork-page .light-frame.imgw-1000 { --imgw: 1000px; }

/* ===== Responsiveness ===== */
@media (max-width: 1024px) {
  .artwork-page .light-frame { --frame: 18px; }
}

@media (max-width: 640px)  {
  .artwork-page .light-frame { --frame: 16px; }
}

/* ===== Typography for artwork pages ===== */
body.artwork-page .heading-2,
body.artwork-page figure .paragraph-price-desc {
  font-family: "Fredericka the Great", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--artwork-gold) !important;
  letter-spacing: .2px;
  text-rendering: optimizeLegibility;
}