/* Abyssworks imprint page. Loaded only on /abyssworks and fully scoped to .aw, so the rest of Smee Comics keeps its look.
   Palette: black base, white text, silver accents/borders, purple + green highlights. */
@font-face{font-family:"Cinzel";src:url(/fonts/cinzel.woff) format("woff");font-weight:400 700;font-display:swap}
.aw{
  --aw-black:#0a0a0d; --aw-panel:#131318; --aw-panel-2:#1a1a21;
  --aw-white:#f5f5f7; --aw-muted:#b9bcc4; --aw-silver:#c7cad1; --aw-silver-dim:#5d6069;
  --aw-purple:#a78bfa; --aw-purple-deep:#6d28d9; --aw-green:#34d399; --aw-green-deep:#047857;
  --aw-serif:"Cinzel","Trajan Pro",Georgia,serif;
  background:var(--aw-black);color:var(--aw-white);font-family:var(--body);margin-bottom:-2rem;
  position:relative;isolation:isolate;overflow:hidden
}
.aw::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60rem 36rem at 12% -6%,rgba(139,92,246,.22),transparent 60%),
             radial-gradient(50rem 32rem at 100% 38%,rgba(16,185,129,.14),transparent 62%),
             radial-gradient(40rem 30rem at 0% 100%,rgba(139,92,246,.12),transparent 60%)}
.aw a{color:var(--aw-green)}
.aw a:hover{color:#6ee7b7}
.aw :focus-visible{outline:3px solid var(--aw-green);outline-offset:3px;border-radius:4px}
.aw h1,.aw h2,.aw h3{font-family:var(--aw-serif);font-weight:700;color:var(--aw-white);text-transform:none;letter-spacing:.04em;text-shadow:none;-webkit-text-stroke:0}
.aw .aw-eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-family:var(--body);font-weight:700;font-size:.78rem;letter-spacing:.22em;text-transform:uppercase;color:var(--aw-silver);margin:0 0 1rem}
.aw .aw-eyebrow::before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:var(--aw-green);box-shadow:0 0 0 3px rgba(52,211,153,.18)}

/* hero */
.aw-hero{border-bottom:1px solid var(--aw-silver-dim)}
.aw-hero .wrap{display:grid;grid-template-columns:minmax(0,22rem) minmax(0,1fr);gap:3.5rem;align-items:center;padding:4.5rem 0 4rem}
.aw-hero h1{font-size:clamp(2.6rem,6vw,4.6rem);line-height:1;margin:0;letter-spacing:.08em;text-transform:uppercase;
  background:linear-gradient(180deg,#ffffff 0%,#e6e7ea 45%,#a9acb4 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.aw-hero .aw-lede{font-size:1.15rem;line-height:1.65;color:var(--aw-muted);max-width:36rem;margin:0 0 1.8rem}
.aw-hero .aw-lede strong{color:var(--aw-white);font-weight:600}

/* buttons */
.aw .aw-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.aw .aw-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:2.85rem;padding:.65rem 1.25rem;border-radius:999px;
  font-family:var(--body);font-weight:700;font-size:.95rem;letter-spacing:.02em;text-decoration:none;border:1.5px solid transparent;transition:background .15s,border-color .15s,color .15s,transform .15s}
.aw .aw-btn:hover{transform:translateY(-1px)}
.aw .aw-btn-primary{background:var(--aw-purple-deep);color:#fff;border-color:#8b5cf6}
.aw .aw-btn-primary:hover{background:#7c3aed;color:#fff}
.aw .aw-btn-ghost{background:transparent;color:var(--aw-white);border-color:var(--aw-silver)}
.aw .aw-btn-ghost:hover{border-color:var(--aw-green);color:var(--aw-green)}
.aw .aw-btn-sm{min-height:2.4rem;padding:.45rem 1rem;font-size:.88rem}

/* sections */
.aw-section{padding:4rem 0}
.aw-section + .aw-section{border-top:1px solid #24242c}
.aw .aw-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:1rem 2rem;margin-bottom:2rem}
.aw .aw-head h2{font-size:clamp(1.7rem,3.2vw,2.4rem);margin:0}
.aw .aw-head p{color:var(--aw-muted);max-width:30rem;margin:0}

/* cards */
.aw-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.aw-card{display:flex;flex-direction:column;background:var(--aw-panel);border:1px solid #3a3c44;border-radius:14px;overflow:hidden;transition:border-color .15s,transform .15s,box-shadow .15s}
.aw-card:hover{border-color:var(--aw-silver);transform:translateY(-3px);box-shadow:0 14px 36px rgba(0,0,0,.5),0 0 0 1px rgba(167,139,250,.25)}
.aw-card .aw-cover{display:block;position:relative;aspect-ratio:2/3;background:#000;border-bottom:1px solid #3a3c44}
.aw-card .aw-cover img{width:100%;height:100%;object-fit:cover;display:block}
.aw-card .aw-tag{position:absolute;left:.75rem;top:.75rem;background:rgba(10,10,13,.85);color:var(--aw-white);border:1px solid var(--aw-silver);border-radius:999px;
  font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.3rem .7rem}
.aw-card .aw-tag.is-new{border-color:var(--aw-green);color:var(--aw-green)}
.aw-card .aw-body{display:flex;flex-direction:column;gap:.35rem;padding:1.2rem 1.25rem 1.35rem;flex:1}
.aw-card h3{font-size:1.25rem;line-height:1.25;margin:0}
.aw-card h3 a{color:var(--aw-white);text-decoration:none}
.aw-card h3 a:hover{color:var(--aw-purple)}
.aw-card .aw-meta{color:var(--aw-muted);font-size:.9rem;margin:0}
.aw-card .aw-price{font-family:var(--aw-serif);font-weight:700;font-size:1.5rem;color:var(--aw-white);margin:.2rem 0 .6rem}
.aw-card .aw-actions{margin-top:auto}


@media (max-width:900px){
  .aw-hero .wrap{grid-template-columns:1fr;gap:2rem;padding:3rem 0;text-align:center}
  .aw-hero .aw-lede{margin-inline:auto}
  .aw-hero .aw-actions{justify-content:center}
  .aw-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .aw-section{padding:3rem 0}
  .aw-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.aw .aw-btn:hover,.aw-card:hover{transform:none}}
.aw-card .aw-cover img.aw-contain{object-fit:contain}
/* hero: horizontal lockup (skull + wordmark) is the main spot; text sits centered below it */
.aw-hero .wrap{grid-template-columns:1fr;gap:1.6rem;text-align:center;justify-items:center;padding:4rem 0 3.6rem}
.aw-hero h1.aw-lockup{margin:0;width:100%;max-width:46rem;line-height:0;background:none;color:inherit}
.aw-hero h1.aw-lockup img{width:100%;height:auto;display:block;filter:drop-shadow(0 16px 36px rgba(0,0,0,.55))}
.aw-hero .aw-lede{margin-inline:auto}
.aw-hero .aw-actions{justify-content:center}

/* last section sits on the footer: matching bottom padding, no extra gap */
.aw-section:last-child{padding-bottom:4.5rem}
@media (max-width:560px){.aw-section:last-child{padding-bottom:3.2rem}}
/* closing band: wordmark centered, button under it */
.aw-closer .wrap{display:flex;flex-direction:column;align-items:center;gap:1.8rem;text-align:center}
.aw-closer .aw-closer-mark{width:100%;max-width:26rem;height:auto;display:block}
@media (max-width:560px){.aw-closer .aw-closer-mark{max-width:17rem}.aw-closer .wrap{gap:1.4rem}}