.sample-catalog-page-body {
  background:#f4f6f5;
  color:#202624;
}

.sample-catalog-main {
  width:100%;
  min-width:0;
}

.sample-catalog-page,
.sample-catalog-page * {
  box-sizing:border-box;
}

.sample-catalog-page {
  width:min(1200px, calc(100% - 48px));
  margin:0 auto;
  padding:48px 0 72px;
}

.sample-catalog-hero {
  max-width:780px;
  padding:24px 0 38px;
}

.sample-catalog-eyebrow,
.sample-catalog-section-heading > p {
  margin:0 0 10px;
  color:#b93424;
  font-size:.82rem;
  font-weight:800;
  line-height:1.4;
}

.sample-catalog-hero h1 {
  max-width:760px;
  margin:0;
  color:#17211f;
  font-size:3rem;
  line-height:1.12;
  letter-spacing:0;
}

.sample-catalog-hero > p:last-child {
  margin:20px 0 0;
  color:#56605d;
  font-size:1.06rem;
  line-height:1.75;
}

.sample-catalog-guide,
.sample-catalog-games {
  padding:34px 0 24px;
  border-top:1px solid #cfd6d3;
}

.sample-catalog-section-heading {
  margin-bottom:22px;
}

.sample-catalog-section-heading h2 {
  margin:0;
  color:#17211f;
  font-size:1.55rem;
  line-height:1.3;
  letter-spacing:0;
}

.sample-catalog-guide-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.sample-catalog-guide-item {
  display:grid;
  grid-template-columns:42px minmax(0, 1fr);
  gap:14px;
  min-width:0;
  padding:22px;
  border:1px solid #cfd6d3;
  border-top:4px solid #2f7367;
  border-radius:6px;
  background:#fff;
}

.sample-catalog-guide-item--luck {
  border-top-color:#d39a27;
}

.sample-catalog-guide-item--effort {
  border-top-color:#b93424;
}

.sample-catalog-guide-number {
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:50%;
  background:#e6efec;
  color:#235a51;
  font-size:.78rem;
  font-weight:900;
}

.sample-catalog-guide-item--luck .sample-catalog-guide-number {
  background:#fff1c9;
  color:#74510d;
}

.sample-catalog-guide-item--effort .sample-catalog-guide-number {
  background:#fde6e2;
  color:#8d291e;
}

.sample-catalog-guide-item h3,
.sample-catalog-guide-item p {
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-guide-item h3 {
  margin:0 0 8px;
  font-size:1.04rem;
  line-height:1.35;
}

.sample-catalog-guide-item strong {
  display:block;
  margin:13px 0 6px;
  color:#17211f;
}

.sample-catalog-guide-item p {
  margin:0;
  color:#5b6562;
  font-size:.9rem;
  line-height:1.55;
}

.sample-catalog-guide-item .sample-catalog-guide-target {
  color:#7a8380;
  font-size:.8rem;
  font-weight:700;
}

.sample-catalog-games {
  margin-top:28px;
}

.sample-catalog-grid {
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  align-items:stretch;
  gap:20px;
}

.sample-catalog-card {
  display:flex;
  min-width:0;
  overflow:hidden;
  flex-direction:column;
  border:1px solid #c8d0cd;
  border-radius:8px;
  background:#fff;
  box-shadow:0 12px 28px rgba(23, 33, 31, .08);
}

.sample-catalog-preview {
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  min-height:0;
  overflow:hidden;
  border-bottom:1px solid rgba(23, 33, 31, .16);
}

.sample-catalog-preview--paper-draw {
  display:grid;
  place-items:center;
  background:#1f4a6e;
}

.sample-catalog-paper-frame {
  width:78%;
  padding:9px;
  border:5px solid #4a2a1c;
  border-radius:4px;
  background:#785039;
  box-shadow:0 5px 0 #2b1711;
}

.sample-catalog-paper-board {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:7px;
  padding:12px;
  background:#d6a62e;
}

.sample-catalog-paper-ticket {
  display:grid;
  aspect-ratio:1;
  place-items:center;
  border:1px solid rgba(55, 39, 20, .3);
  background:#fff4d4;
  color:#255eaa;
  font-size:.86rem;
  box-shadow:0 2px 0 rgba(64, 38, 23, .26);
}

.sample-catalog-paper-ticket:nth-child(3n) {
  color:#c44437;
}

.sample-catalog-paper-ticket--raised {
  transform:translateY(-5px) rotate(-4deg);
  box-shadow:0 7px 6px rgba(47, 28, 16, .3);
}

.sample-catalog-preview--roulette {
  display:grid;
  place-items:center;
  background:#173e38;
}

.sample-catalog-roulette-wheel {
  position:relative;
  width:65%;
  max-width:190px;
  aspect-ratio:1;
  border:9px solid #b78122;
  border-radius:50%;
  background:conic-gradient(
    #c74234 0 45deg,
    #e7b640 45deg 90deg,
    #fff0c3 90deg 135deg,
    #2f7367 135deg 180deg,
    #c74234 180deg 225deg,
    #e7b640 225deg 270deg,
    #fff0c3 270deg 315deg,
    #2f7367 315deg 360deg
  );
  box-shadow:0 0 0 4px #f4d37b, 0 10px 18px rgba(0, 0, 0, .28);
}

.sample-catalog-roulette-wheel::after {
  position:absolute;
  inset:9%;
  border:1px solid rgba(63, 42, 14, .35);
  border-radius:50%;
  content:"";
}

.sample-catalog-roulette-hub {
  position:absolute;
  top:50%;
  left:50%;
  width:24%;
  aspect-ratio:1;
  transform:translate(-50%, -50%);
  border:4px solid #efd27d;
  border-radius:50%;
  background:#8e2a22;
  box-shadow:0 3px 6px rgba(0, 0, 0, .25);
}

.sample-catalog-roulette-pointer {
  position:absolute;
  z-index:2;
  top:8%;
  left:50%;
  width:0;
  height:0;
  transform:translateX(-50%);
  border-right:14px solid transparent;
  border-left:14px solid transparent;
  border-top:28px solid #fff2bd;
  filter:drop-shadow(0 3px 1px rgba(0, 0, 0, .35));
}

.sample-catalog-preview--grill {
  background:#181b1a;
}

.sample-catalog-grill-embers {
  position:absolute;
  inset:52% 8% 8%;
  border-radius:50%;
  background:radial-gradient(circle at 20% 40%, #ffb13b 0 4%, transparent 14%),
    radial-gradient(circle at 50% 60%, #d33b24 0 7%, transparent 20%),
    radial-gradient(circle at 80% 35%, #ff812a 0 5%, transparent 18%),
    #3a1711;
  filter:blur(2px);
}

.sample-catalog-grill-grate {
  position:absolute;
  inset:16% 7%;
  transform:skewX(-8deg);
  border:5px solid #4d514e;
  border-radius:8px;
  background:repeating-linear-gradient(90deg, #4d514e 0 4px, transparent 4px 30px),
    repeating-linear-gradient(0deg, #3b3f3d 0 3px, transparent 3px 26px);
  box-shadow:inset 0 0 25px rgba(0, 0, 0, .7);
}

.sample-catalog-meat {
  position:absolute;
  width:24%;
  aspect-ratio:1.45;
  border:3px solid #4e2119;
  border-radius:45% 55% 42% 58%;
  box-shadow:0 6px 8px rgba(0, 0, 0, .35);
}

.sample-catalog-meat::after {
  position:absolute;
  inset:24% 10%;
  transform:rotate(-8deg);
  border-top:3px solid rgba(70, 29, 19, .6);
  border-bottom:3px solid rgba(70, 29, 19, .6);
  content:"";
}

.sample-catalog-meat--raw {
  top:25%;
  left:14%;
  transform:rotate(-9deg);
  background:#d87565;
}

.sample-catalog-meat--ready {
  top:48%;
  left:39%;
  transform:rotate(7deg);
  background:#a94d37;
}

.sample-catalog-meat--cooked {
  top:20%;
  right:12%;
  transform:rotate(13deg);
  background:#6f3123;
}

.sample-catalog-preview--generic {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  background:#dfe9e6;
}

.sample-catalog-generic-token {
  width:22%;
  aspect-ratio:.78;
  border:2px solid #35645b;
  border-radius:5px;
  background:#fff;
  box-shadow:0 7px 12px rgba(35, 74, 65, .15);
}

.sample-catalog-generic-token--one {
  transform:rotate(-7deg);
}

.sample-catalog-generic-token--three {
  transform:rotate(7deg);
}

.sample-catalog-card-body {
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:24px;
}

.sample-catalog-badge {
  align-self:flex-start;
  margin:0 0 12px;
  padding:5px 9px;
  border:1px solid #9ab7b0;
  border-radius:4px;
  background:#e7f0ed;
  color:#275d53;
  font-size:.76rem;
  font-weight:800;
  line-height:1.3;
}

.sample-catalog-card:nth-child(2) .sample-catalog-badge {
  border-color:#d7b052;
  background:#fff3cf;
  color:#6c4b0c;
}

.sample-catalog-card:nth-child(3) .sample-catalog-badge {
  border-color:#d69a91;
  background:#fde9e5;
  color:#842c22;
}

.sample-catalog-card h3 {
  margin:0;
  color:#17211f;
  font-size:1.34rem;
  line-height:1.35;
  letter-spacing:0;
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-description {
  min-height:4.7em;
  margin:12px 0 20px;
  color:#56605d;
  line-height:1.58;
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-meta {
  display:grid;
  gap:0;
  margin:0 0 24px;
  border-top:1px solid #dce2df;
}

.sample-catalog-meta > div {
  display:grid;
  grid-template-columns:76px minmax(0, 1fr);
  gap:10px;
  padding:10px 0;
  border-bottom:1px solid #e5e9e7;
}

.sample-catalog-meta dt,
.sample-catalog-meta dd {
  min-width:0;
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-meta dt {
  color:#737d79;
  font-size:.78rem;
  font-weight:800;
}

.sample-catalog-meta dd {
  margin:0;
  color:#2f3936;
  font-size:.86rem;
  line-height:1.5;
}

.sample-catalog-actions {
  display:grid;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:auto;
}

.sample-catalog-button {
  display:inline-flex;
  min-width:0;
  min-height:46px;
  align-items:center;
  justify-content:center;
  padding:10px 16px;
  border:2px solid transparent;
  border-radius:6px;
  font-weight:800;
  line-height:1.35;
  text-align:center;
  text-decoration:none;
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-button--primary {
  background:#b93424;
  color:#fff;
}

.sample-catalog-button--primary:hover {
  background:#92271d;
}

.sample-catalog-button--secondary {
  border-color:#52625e;
  background:#fff;
  color:#283632;
}

.sample-catalog-button--secondary:hover {
  border-color:#b93424;
  color:#92271d;
}

.sample-catalog-button:focus-visible {
  outline:3px solid #8c281f;
  outline-offset:3px;
}

.sample-catalog-empty {
  grid-column:1 / -1;
  padding:48px 24px;
  border:1px dashed #aeb9b5;
  border-radius:6px;
  background:#fff;
  text-align:center;
}

.sample-catalog-empty h3,
.sample-catalog-empty p {
  margin:0;
}

.sample-catalog-empty p {
  margin-top:10px;
  color:#67716e;
}

.sample-catalog-trust {
  margin-top:48px;
  padding:26px 0;
  border-top:1px solid #cfd6d3;
  border-bottom:1px solid #cfd6d3;
}

.sample-catalog-trust h2 {
  margin:0 0 16px;
  font-size:1.05rem;
  letter-spacing:0;
}

.sample-catalog-trust ul {
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}

.sample-catalog-trust li {
  position:relative;
  min-width:0;
  padding-left:18px;
  color:#42504c;
  font-size:.88rem;
  line-height:1.5;
  overflow-wrap:break-word;
  word-break:keep-all;
}

.sample-catalog-trust li::before {
  position:absolute;
  top:.55em;
  left:0;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#2f7367;
  content:"";
}

.sample-catalog-final {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  margin-top:48px;
  padding:34px;
  border-radius:8px;
  background:#183f39;
  color:#fff;
}

.sample-catalog-final h2,
.sample-catalog-final p {
  margin:0;
}

.sample-catalog-final h2 {
  max-width:680px;
  font-size:1.45rem;
  line-height:1.35;
  letter-spacing:0;
}

.sample-catalog-final p {
  margin-top:10px;
  color:#d9e6e2;
  line-height:1.6;
}

.sample-catalog-button--light {
  flex:0 0 auto;
  border-color:#f1c75b;
  background:#f1c75b;
  color:#2d2718;
}

.sample-catalog-final .sample-catalog-button:focus-visible {
  outline-color:#f5d77f;
}

@media (max-width: 960px) {
  .sample-catalog-hero h1 {
    font-size:2.55rem;
  }

  .sample-catalog-guide-grid,
  .sample-catalog-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .sample-catalog-guide-item:last-child,
  .sample-catalog-card:last-child:nth-child(odd) {
    grid-column:1 / -1;
  }

  .sample-catalog-card:last-child:nth-child(odd) {
    width:calc((100% - 20px) / 2);
    justify-self:center;
  }

  .sample-catalog-trust ul {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .sample-catalog-page {
    width:calc(100% - 32px);
    padding:28px 0 48px;
  }

  .sample-catalog-hero {
    padding:18px 0 30px;
  }

  .sample-catalog-hero h1 {
    font-size:2rem;
  }

  .sample-catalog-desktop-break {
    display:none;
  }

  .sample-catalog-guide-grid,
  .sample-catalog-grid,
  .sample-catalog-trust ul {
    grid-template-columns:1fr;
  }

  .sample-catalog-guide-item:last-child,
  .sample-catalog-card:last-child:nth-child(odd) {
    grid-column:auto;
  }

  .sample-catalog-card:last-child:nth-child(odd) {
    width:100%;
    justify-self:stretch;
  }

  .sample-catalog-guide-item {
    grid-template-columns:36px minmax(0, 1fr);
    padding:18px;
  }

  .sample-catalog-guide-number {
    width:36px;
    height:36px;
  }

  .sample-catalog-card-body {
    padding:20px;
  }

  .sample-catalog-description {
    min-height:0;
  }

  .sample-catalog-preview {
    max-height:230px;
  }

  .sample-catalog-final {
    align-items:stretch;
    flex-direction:column;
    padding:26px 22px;
  }

  .sample-catalog-button--light {
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sample-catalog-page *,
  .sample-catalog-page *::before,
  .sample-catalog-page *::after {
    scroll-behavior:auto !important;
    transition:none !important;
    animation:none !important;
  }
}

/* Warm Local Play brand layer */
.sample-catalog-page-body {
  background:var(--cg-cream);
  color:var(--cg-navy);
}

.sample-catalog-page-body .sample-catalog-page {
  padding-top:36px;
}

.sample-catalog-page-body .sample-catalog-hero {
  display:grid;
  max-width:none;
  grid-template-columns:minmax(0, .92fr) minmax(420px, 1.08fr);
  gap:32px;
  align-items:center;
  padding:34px 38px;
  border:1px solid var(--cg-border);
  border-radius:24px;
  background:#fff1e5;
  overflow:hidden;
}

.sample-catalog-page-body .sample-catalog-hero h1 {
  max-width:620px;
  color:var(--cg-navy);
  font-size:46px;
}

.sample-catalog-page-body .sample-catalog-hero-copy > p:last-child {
  margin:20px 0 0;
  color:var(--cg-navy-soft);
  font-size:1.06rem;
  line-height:1.75;
}

.sample-catalog-page-body .sample-catalog-eyebrow,
.sample-catalog-page-body .sample-catalog-section-heading > p {
  color:var(--cg-coral-dark);
}

.sample-catalog-page-body .sample-catalog-brand-visual {
  margin:0;
}

.sample-catalog-page-body .sample-catalog-brand-visual img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:contain;
  filter:drop-shadow(0 18px 24px rgba(23,42,67,.11));
}

.sample-catalog-page-body .sample-catalog-guide,
.sample-catalog-page-body .sample-catalog-games {
  border-top-color:var(--cg-border);
}

.sample-catalog-page-body .sample-catalog-section-heading h2,
.sample-catalog-page-body .sample-catalog-guide-item strong {
  color:var(--cg-navy);
}

.sample-catalog-page-body .sample-catalog-guide-item {
  border-color:var(--cg-border);
  border-top-color:var(--cg-green);
  border-radius:18px;
  background:var(--cg-surface);
  box-shadow:var(--cg-shadow-soft);
}

.sample-catalog-page-body .sample-catalog-guide-item--luck {
  border-top-color:var(--cg-gold);
}

.sample-catalog-page-body .sample-catalog-guide-item--effort {
  border-top-color:var(--cg-coral);
}

.sample-catalog-page-body .sample-catalog-card {
  border-color:var(--cg-border);
  border-radius:22px;
  background:var(--cg-surface);
  box-shadow:var(--cg-shadow-soft);
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.sample-catalog-page-body .sample-catalog-card:hover {
  border-color:rgba(242,101,69,.3);
  box-shadow:var(--cg-shadow);
  transform:translateY(-3px);
}

.sample-catalog-page-body .sample-catalog-card-body {
  background:var(--cg-surface);
}

.sample-catalog-page-body .sample-catalog-badge {
  background:var(--cg-peach);
  color:var(--cg-coral-dark);
}

.sample-catalog-page-body .sample-catalog-button {
  min-height:46px;
  border-radius:13px;
}

.sample-catalog-page-body .sample-catalog-button--primary {
  border-color:var(--cg-coral);
  background:var(--cg-coral);
}

.sample-catalog-page-body .sample-catalog-trust {
  border-color:var(--cg-border);
  border-radius:20px;
  background:#fff7ef;
}

.sample-catalog-page-body .sample-catalog-final {
  border-radius:22px;
  background:var(--cg-navy);
}

@media (max-width:1024px) {
  .sample-catalog-page-body .sample-catalog-hero {
    grid-template-columns:1fr 1fr;
  }

  .sample-catalog-page-body .sample-catalog-grid {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:760px) {
  .sample-catalog-page-body .sample-catalog-hero {
    grid-template-columns:1fr;
    gap:18px;
    padding:28px 24px;
  }

  .sample-catalog-page-body .sample-catalog-hero h1 {
    font-size:38px;
  }

  .sample-catalog-page-body .sample-catalog-brand-visual {
    max-width:620px;
  }
}

@media (max-width:640px) {
  .sample-catalog-page-body .sample-catalog-page {
    width:calc(100% - 32px);
  }

  .sample-catalog-page-body .sample-catalog-hero {
    padding:24px 18px;
    border-radius:18px;
  }

  .sample-catalog-page-body .sample-catalog-hero h1 {
    font-size:33px;
  }

  .sample-catalog-page-body .sample-catalog-grid {
    grid-template-columns:1fr;
  }
}