/*
Theme Name: Space 2047 Official Pop Universe
Theme URI: https://space2047.com/
Author: Space 2047
Description: A bold image-led official WordPress theme for the Space 2047 comic sci-fi universe, inspired by premium editorial blog layouts with thick outlines, rounded cards and cinematic artwork.
Version: 2.0.6
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: space2047-pop
*/
:root{--ink:#111116;--paper:#fffbea;--muted:#f4f0dd;--purple:#6a3bc5;--yellow:#ffd400;--cyan:#5df6ff;--coral:#ff6259;--pink:#ff56a0;--line:4px;--radius:34px;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,Arial,sans-serif;font-size:18px;line-height:1.55;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.14;background-image:radial-gradient(var(--ink) 1.2px,transparent 1.2px);background-size:26px 26px;z-index:-1}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.wrap{width:min(var(--max),calc(100% - 36px));margin:auto}.topbar{position:sticky;top:0;z-index:1000;background:var(--ink);border-bottom:var(--line) solid var(--ink)}.topbar-inner{height:86px;display:grid;grid-template-columns:80px 1fr 80px;align-items:center}.logo{text-align:center;font-weight:950;letter-spacing:.15em;font-size:clamp(27px,5vw,48px);color:var(--paper);line-height:.9}.logo small{display:block;font-size:11px;letter-spacing:.55em;margin-top:7px;color:var(--cyan)}.hamb,.search-btn{border:0;background:transparent;color:var(--paper);font-size:34px;cursor:pointer}.search-btn{font-size:24px}.drawer{position:fixed;z-index:2000;top:0;left:-380px;width:min(360px,90vw);height:100vh;background:var(--yellow);border-right:6px solid var(--ink);transition:.28s;padding:28px}.drawer.open,body.menu-open .drawer{left:0}.drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1900;opacity:0;pointer-events:none;transition:.2s}body.menu-open .drawer-overlay{opacity:1;pointer-events:auto}.drawer-close{float:right;background:var(--paper);border:4px solid var(--ink);border-radius:999px;font-weight:900;font-size:20px;width:44px;height:44px}.drawer h2{font-size:34px;margin:52px 0 20px}.drawer ul{list-style:none;padding:0;margin:0}.drawer li{margin:12px 0}.drawer a{display:block;background:var(--paper);border:4px solid var(--ink);border-radius:999px;padding:13px 18px;font-weight:900;box-shadow:4px 4px 0 var(--ink)}.hero{background:var(--purple);border-bottom:6px solid var(--ink);padding:42px 0 64px;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:url(assets/images/hero-universe.jpg) center/cover no-repeat;opacity:.38}.hero .wrap{position:relative}.hero-card{border:6px solid var(--ink);border-radius:54px;background:var(--paper);padding:24px;box-shadow:12px 12px 0 var(--ink);display:grid;grid-template-columns:1.15fr .85fr;gap:24px}.hero-art{border:5px solid var(--ink);border-radius:38px;overflow:hidden;min-height:520px;background:var(--ink) url(assets/images/space2047-book-cover.png) center/contain no-repeat}.hero-copy{padding:20px 10px 14px}.eyebrow{display:inline-block;background:var(--cyan);border:4px solid var(--ink);border-radius:999px;padding:8px 14px;font-weight:950;text-transform:uppercase;font-size:13px;letter-spacing:.12em}.hero h1{font-size:clamp(62px,12vw,136px);line-height:.78;margin:24px 0 18px;letter-spacing:-.08em}.hero p{font-size:clamp(20px,2.3vw,29px);font-weight:800;max-width:560px}.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-block;border:5px solid var(--ink);border-radius:999px;padding:14px 22px;font-weight:950;background:var(--yellow);box-shadow:6px 6px 0 var(--ink)}.btn.alt{background:var(--paper)}.section{padding:72px 0}.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px}.section-title h2{font-size:clamp(38px,7vw,74px);line-height:.9;margin:0;letter-spacing:-.06em}.section-title p{font-weight:800;max-width:420px}.tile-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.tile,.post-card,.character-card,.feature{background:var(--paper);border:5px solid var(--ink);border-radius:var(--radius);overflow:hidden;box-shadow:7px 7px 0 var(--ink);transition:.2s}.tile:hover,.post-card:hover,.character-card:hover{transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--ink)}.tile img{height:260px;width:100%;object-fit:cover}.tile div,.post-card div,.character-card div{padding:18px}.label{display:inline-block;background:var(--yellow);border:3px solid var(--ink);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:950;text-transform:uppercase}.tile h3,.post-card h3,.character-card h3{font-size:28px;line-height:1;margin:12px 0 6px}.feature{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:var(--ink);color:var(--paper)}.feature img{height:100%;min-height:430px;width:100%;object-fit:contain;background:var(--ink)}.feature-copy{padding:44px}.feature h2{font-size:clamp(42px,8vw,86px);line-height:.88;margin:18px 0}.feature .label{color:var(--ink);background:var(--cyan)}.characters{background:var(--yellow);border-block:6px solid var(--ink)}.character-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.character-card img{height:290px;width:100%;object-fit:cover;object-position:center top}.strip-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}.post-card img{height:310px;width:100%;object-fit:cover}.post-card.big img{height:500px}.cta{background:var(--purple);color:var(--paper);border-block:6px solid var(--ink);text-align:center}.cta-box{background:var(--paper);color:var(--ink);border:6px solid var(--ink);border-radius:48px;padding:50px;box-shadow:10px 10px 0 var(--ink)}.cta h2{font-size:clamp(48px,10vw,104px);line-height:.85;margin:0 0 18px}.footer{background:var(--ink);color:var(--paper);padding:38px 0;text-align:center;font-weight:800}.content-page{padding:55px 0}.content-card{background:var(--paper);border:5px solid var(--ink);border-radius:var(--radius);padding:34px;box-shadow:8px 8px 0 var(--ink)}.content-card h1{font-size:clamp(45px,8vw,86px);line-height:.9}.wp-block-search__inside-wrapper{border:4px solid var(--ink);border-radius:999px;overflow:hidden;background:white}.wp-block-search__input{border:0;padding:14px 18px;font:inherit}.wp-block-search__button{border:0;background:var(--yellow);font-weight:900;padding:12px 18px}.gallery-band{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.gallery-band img{height:180px;width:100%;object-fit:cover;border:5px solid var(--ink);border-radius:26px;box-shadow:5px 5px 0 var(--ink)}@media(max-width:900px){.hero-card,.feature,.strip-grid{grid-template-columns:1fr}.tile-grid,.character-grid{grid-template-columns:1fr 1fr}.hero-art{min-height:360px;background-size:contain}.gallery-band{grid-template-columns:1fr 1fr}}@media(max-width:560px){.topbar-inner{height:72px;grid-template-columns:55px 1fr 55px}.logo{font-size:25px}.logo small{font-size:8px}.hero{padding:22px 0 36px}.hero-card{border-radius:35px;padding:12px;box-shadow:6px 6px 0 var(--ink)}.hero-art{min-height:280px}.tile-grid,.character-grid,.gallery-band{grid-template-columns:1fr}.section{padding:46px 0}.feature-copy,.cta-box{padding:25px}.tile img,.character-card img,.post-card img,.post-card.big img{height:250px}}


/* Space 2047 targeted update: book cover hero + centred website text */
main,
.section,
.hero-copy,
.tile,
.post-card,
.character-card,
.feature-copy,
.content-card,
.cta-box { text-align:center; }
.section-title { display:block; text-align:center; margin-left:auto; margin-right:auto; }
.section-title p,
.hero p,
.tile p,
.post-card p,
.character-card p,
.feature-copy p { margin-left:auto; margin-right:auto; }
.btns { justify-content:center; }
.hero-art { background-image:url(assets/images/space2047-book-cover.png); background-size:contain; background-position:center; background-repeat:no-repeat; }
.character-card div,
.tile div,
.post-card div { text-align:center; }
.drawer,
.drawer h2,
.drawer a { text-align:center; }

/* Space 2047 update: clean old-style pop background with no placeholder label text */
.hero-card{
  background:var(--paper) url(assets/images/clean-pop-space-background.png) center/cover no-repeat;
}
.hero-art{
  background-color:transparent;
  background-image:url(assets/images/space2047-book-cover.png);
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
.hero-copy{
  background:rgba(255,251,234,.88);
  border:5px solid var(--ink);
  border-radius:34px;
}


/* Space 2047 update: make right-side/action buttons match the slide-out menu buttons */
.hero-copy .btn,
.feature-copy .btn,
.cta-box .btn,
.wp-block-button__link{
  display:inline-block;
  background:var(--paper);
  color:var(--ink);
  border:4px solid var(--ink);
  border-radius:999px;
  padding:13px 18px;
  font-weight:900;
  line-height:1.15;
  box-shadow:4px 4px 0 var(--ink);
  text-transform:none;
  letter-spacing:0;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.hero-copy .btn:hover,
.feature-copy .btn:hover,
.cta-box .btn:hover,
.wp-block-button__link:hover{
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 var(--ink);
  background:#fff;
}
.hero-copy .btn.alt{
  background:var(--paper);
}

/* Space 2047 update: fixed drawer title/close with scrollable menu box and arrow controls */
.drawer{
  display:flex;
  flex-direction:column;
  padding:24px;
  overflow:hidden;
}
.drawer-close{
  position:absolute;
  top:22px;
  right:22px;
  float:none;
  z-index:3;
}
.drawer-fixed{
  flex:0 0 auto;
  position:relative;
  z-index:2;
  background:var(--yellow);
  padding-bottom:14px;
}
.drawer h2{
  margin:52px 54px 12px 0;
  line-height:.95;
}
.drawer-scroll-controls{
  display:flex;
  justify-content:center;
  gap:12px;
  margin:8px 0 4px;
}
.drawer-scroll-btn{
  width:52px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--paper);
  border:4px solid var(--ink);
  border-radius:999px;
  color:var(--ink);
  font-weight:950;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  box-shadow:4px 4px 0 var(--ink);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.drawer-scroll-btn:hover{
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 var(--ink);
}
.drawer-scroll-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  transform:none;
  box-shadow:4px 4px 0 var(--ink);
}
.drawer-menu-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:10px 8px 18px 0;
  margin-right:-8px;
  border-top:4px solid var(--ink);
  border-bottom:4px solid var(--ink);
  scrollbar-width:thin;
  scroll-behavior:smooth;
}
.drawer-menu-scroll::-webkit-scrollbar{width:10px;}
.drawer-menu-scroll::-webkit-scrollbar-track{background:rgba(17,17,22,.12);border-radius:999px;}
.drawer-menu-scroll::-webkit-scrollbar-thumb{background:var(--ink);border-radius:999px;}
.drawer-menu-scroll ul{margin:0;padding:10px 6px 10px 0;}
.drawer-menu-scroll li{margin:12px 0;}
@media(max-height:640px){
  .drawer h2{margin-top:34px;font-size:28px;}
  .drawer-scroll-btn{height:36px;width:48px;}
}


/* Space 2047 update: centre fixed menu title above arrows */
.drawer h2{
  margin:52px 54px 12px 54px;
  text-align:center;
  width:auto;
}
@media(max-height:640px){
  .drawer h2{margin:34px 54px 10px 54px;text-align:center;}
}

/* Space 2047 update: Galaxy guide destination scroller */
.galaxy-guide{
  background:var(--ink);
  color:var(--paper);
  border-block:6px solid var(--ink);
}
.galaxy-guide .section-title h2,
.galaxy-guide .section-title p{
  color:var(--paper);
}
.galaxy-destination-controls{
  display:flex;
  justify-content:center;
  gap:12px;
  margin:4px auto 18px;
}
.galaxy-scroll-btn{
  width:52px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--paper);
  border:4px solid var(--ink);
  border-radius:999px;
  color:var(--ink);
  font-weight:950;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  box-shadow:4px 4px 0 var(--cyan);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.galaxy-scroll-btn:hover{
  transform:translate(-2px,-2px);
  box-shadow:6px 6px 0 var(--cyan);
}
.galaxy-scroll-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  transform:none;
  box-shadow:4px 4px 0 var(--cyan);
}
.galaxy-destination-scroll{
  max-height:680px;
  overflow-y:auto;
  overflow-x:hidden;
  width:min(920px,100%);
  margin:0 auto;
  padding:10px 18px 18px 10px;
  border-top:4px solid var(--paper);
  border-bottom:4px solid var(--paper);
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:var(--cyan) rgba(255,255,255,.16);
}
.galaxy-destination-scroll::-webkit-scrollbar{width:10px;}
.galaxy-destination-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.16);border-radius:999px;}
.galaxy-destination-scroll::-webkit-scrollbar-thumb{background:var(--cyan);border-radius:999px;}
.galaxy-destination-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}
.destination-card{
  background:var(--paper);
  color:var(--ink);
  border:5px solid var(--ink);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:7px 7px 0 var(--cyan);
  text-align:center;
}
.destination-card img{
  height:230px;
  width:100%;
  object-fit:cover;
}
.destination-card div{padding:18px;}
.destination-card h3{font-size:28px;line-height:1;margin:12px 0 8px;}
.destination-card p{margin:0 auto;font-weight:750;}
@media(max-width:760px){
  .galaxy-destination-grid{grid-template-columns:1fr;}
  .galaxy-destination-scroll{max-height:560px;padding-right:12px;}
}