/* Jemma McColgan footer: the case file is closed, stamped and pinned to the cork board,
   with the links hung as exhibit tags on a red evidence string */
.jm-foot{
  --j-cork-1:#a97c4f; --j-cork-2:#8f6640; --j-folder:#e8d39f; --j-folder-2:#d9bf82; --j-ink:#2c2418; --j-soft:#4a4030;
  --j-red:#8c2027; --j-tag:#fbf7ec; --j-sticky:#f2e2a1;
  background:
    repeating-radial-gradient(circle at 0 0, rgba(0,0,0,.06) 0, rgba(0,0,0,.06) 1px, transparent 2px, transparent 6px),
    linear-gradient(160deg, var(--j-cork-1), var(--j-cork-2));
  padding:56px 22px 72px; text-align:left; font-family:Georgia,"Times New Roman",serif; color:var(--j-ink); line-height:1.55;
}
.jm-foot *{box-sizing:border-box;}
.jm-foot p{margin:0;}
.jm-foot a{color:var(--j-ink);}
.jm-foot a:focus-visible{outline:3px solid var(--j-red); outline-offset:3px;}
.jm-folder{
  position:relative; max-width:var(--jm-col,956px); margin:22px auto 0; padding:40px 34px 30px;
  background:linear-gradient(180deg, var(--j-folder), var(--j-folder-2));
  border:1px solid rgba(0,0,0,.18); border-radius:2px 6px 6px 6px;
  box-shadow:2px 10px 22px rgba(0,0,0,.38);
}
/* the folder spans the page's content column: .wrap is 1000px minus 2x22px padding on the home page,
   720px minus 2x24px on the privacy page */
body:has(> .wrap > .back) .jm-foot{--jm-col:672px; padding-left:24px; padding-right:24px;}
/* folder tab */
.jm-folder-tab{
  position:absolute; top:-26px; left:-1px; height:27px; padding:5px 22px 0;
  background:var(--j-folder); border:1px solid rgba(0,0,0,.18); border-bottom:0; border-radius:6px 14px 0 0;
  font-family:"Courier New",monospace; font-size:.72rem; letter-spacing:3px; color:var(--j-soft);
}
.jm-foot .stamp-closed{
  position:absolute; top:18px; right:26px; margin:0;
  border:3px solid var(--j-red); color:var(--j-red); padding:8px 18px; transform:rotate(-8deg);
  font-family:"Courier New",monospace; font-weight:bold; letter-spacing:3px; font-size:1.05rem;
  mix-blend-mode:multiply; background:rgba(255,255,255,.08);
}
.jm-subject{font-family:"Courier New",monospace; font-size:.9rem; letter-spacing:.5px; color:var(--j-ink); max-width:calc(100% - 210px); text-transform:uppercase;}
.jm-subject a{color:var(--j-red); font-weight:bold;}

/* exhibit tags on the red string */
.jm-exhibits{position:relative; list-style:none; margin:34px 0 30px; padding:18px 0 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:22px 26px;}
.jm-exhibits::before{content:""; position:absolute; top:4px; left:-12px; right:-12px; height:2px; background:var(--j-red);
  box-shadow:0 1px 1px rgba(0,0,0,.25); transform:rotate(-.6deg);}
.jm-exhibits li{position:relative;}
.jm-exhibits li::before{content:""; position:absolute; left:50%; top:-15px; width:2px; height:18px; background:var(--j-red); transform:translateX(-50%);}
.jm-exhibits li:nth-child(odd) .jm-tag{transform:rotate(-3deg);}
.jm-exhibits li:nth-child(even) .jm-tag{transform:rotate(2.5deg);}
.jm-tag{
  position:relative; display:flex; flex-direction:column; justify-content:center; min-width:0; min-height:64px; height:100%;
  padding:12px 18px 12px 34px; text-decoration:none; background:var(--j-tag);
  border:1px solid rgba(0,0,0,.2); box-shadow:2px 5px 10px rgba(0,0,0,.28);
  clip-path:polygon(14px 0, 100% 0, 100% 100%, 14px 100%, 0 50%);
  transition:transform .18s ease, box-shadow .18s ease;
}
.jm-tag::before{content:""; position:absolute; left:14px; top:50%; width:9px; height:9px; margin-top:-4.5px; border-radius:50%;
  background:var(--j-folder-2); box-shadow:inset 0 0 0 2px var(--j-red);}
.jm-ex{font-family:"Courier New",monospace; font-size:.68rem; letter-spacing:2px; text-transform:uppercase; color:var(--j-red); font-weight:bold;}
.jm-lbl{font-size:1.02rem; color:var(--j-ink); text-decoration:underline; text-decoration-color:rgba(44,36,24,.35); text-underline-offset:.2em;}
.jm-tag:hover{box-shadow:3px 9px 16px rgba(0,0,0,.35);}
.jm-exhibits li .jm-tag:hover{transform:rotate(0deg) translateY(-2px);}
.jm-tag[aria-current="page"] .jm-lbl{text-decoration-color:var(--j-red); text-decoration-thickness:2px;}

/* responsible gambling notice as a sticky note clipped to the folder */
.jm-sticky{
  position:relative; max-width:440px; margin:0 0 26px auto !important; padding:22px 20px 18px;
  background:var(--j-sticky); color:var(--j-soft); font-size:.9rem; transform:rotate(1.2deg);
  border:1px solid rgba(0,0,0,.1); box-shadow:3px 8px 16px rgba(0,0,0,.3);
}
.jm-sticky::before{content:""; position:absolute; top:-9px; left:50%; width:15px; height:15px; margin-left:-7px; border-radius:50%;
  background:radial-gradient(circle at 32% 30%, #ff8a8a, var(--j-red) 70%); box-shadow:0 3px 5px rgba(0,0,0,.45);}
.jm-filed{display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 20px; padding-top:14px; border-top:1px dashed rgba(0,0,0,.3);
  font-family:"Courier New",monospace; font-size:.78rem; color:var(--j-soft); letter-spacing:.5px;}
@media (max-width:640px){
  .jm-folder{padding:84px 18px 22px;}
  .jm-foot .stamp-closed{top:20px; right:auto; left:18px; font-size:.95rem;}
  .jm-subject{max-width:none;}
  .jm-exhibits{display:flex; flex-direction:column; padding:0 0 0 22px; gap:14px;}
  .jm-exhibits::before{top:-6px; bottom:-6px; left:4px; right:auto; width:2px; height:auto; transform:none;}
  .jm-exhibits li::before{left:-18px; top:50%; width:18px; height:2px; transform:none;}
  .jm-tag{min-width:0; width:100%;}
  .jm-sticky{margin:0 0 22px !important; transform:rotate(.8deg);}
}
@media (prefers-reduced-motion:reduce){ .jm-tag{transition:none;} .jm-exhibits li .jm-tag:hover{transform:none;} }
/* the 404 page centres its content in a flex row: stack the footer under it */
body:has(> footer.jm-foot):not(:has(.masthead)){flex-direction:column; align-items:stretch;}
body:has(> footer.jm-foot):not(:has(.masthead)) > .wrap{margin-left:auto; margin-right:auto;}