/* ===================================================================
   CARRIER card game page: shell overrides so it matches the studio hub
   and the Unity pages. Loaded last. Only restyles chrome and type;
   the carousel, accordions, album, roadmap and modals keep their CSS.
   =================================================================== */

/* --- shell --- */
.hazard{height:8px;background:repeating-linear-gradient(-45deg,var(--hazard) 0 14px,#000 14px 28px);}
.site-header{z-index:10001;}
.site-nav a,.site-nav a:hover{margin-left:0;border-bottom:0;padding-bottom:0;}
@media (max-width:880px){
  nav.site-nav,.site-footer nav{display:flex;position:static;flex-direction:row;flex-wrap:nowrap;padding:0;background:none;border:0;gap:18px;}
  nav.site-nav{width:100%;overflow-x:auto;scrollbar-width:none;}
  nav.site-nav::-webkit-scrollbar{display:none;}
  nav.site-nav a,.site-footer nav a{padding:0;min-height:0;border-bottom:0;display:inline;white-space:nowrap;}
  .site-footer nav{flex-wrap:wrap;}
}
.site-footer{text-align:left;}
.site-footer img{margin-top:0;height:40px;}

/* --- column --- */
section{padding:clamp(72px,10vw,120px) max(var(--gutter), calc((100% - 980px) / 2));}
.hero{padding:40px max(var(--gutter), calc((100% - 1100px) / 2)) 64px;}

/* --- type --- */
.eyebrow{font-family:var(--f-term);font-size:1.15rem;letter-spacing:.12em;text-transform:uppercase;color:var(--hazard);display:flex;align-items:center;gap:12px;margin-bottom:18px;}
.eyebrow::before{content:"";width:28px;height:2px;background:currentColor;}
.eyebrow::after{display:none;content:none;}
.section-title{font-family:var(--f-display);font-weight:400;font-size:clamp(2.3rem,4.8vw,3.8rem);line-height:.95;letter-spacing:.01em;color:var(--paper);text-transform:uppercase;margin-bottom:16px;}
.section-sub{font-family:var(--f-read);font-size:clamp(1.02rem,1.4vw,1.15rem);color:var(--paper-2);max-width:60ch;margin-bottom:44px;line-height:1.7;}
.mq-caption{font-family:var(--f-term);font-size:1.1rem;letter-spacing:.16em;color:var(--mute);}

/* --- hero copy under the carousel --- */
.hero-copy{padding:40px var(--gutter) 54px;}
.banner-tag{animation:none;margin:0 auto 22px;display:inline-flex;font-family:var(--f-term);font-size:1.1rem;letter-spacing:.08em;padding:2px 12px 1px;border:1px solid rgba(242,193,78,.55);color:var(--hazard);}
.hero-tagline{font-family:var(--f-display);font-weight:400;font-size:clamp(2.3rem,5.6vw,4.8rem);line-height:.95;letter-spacing:.01em;text-transform:uppercase;max-width:980px;text-shadow:0 4px 30px rgba(0,0,0,.6);}
.hero-tagline em{color:var(--blood-hi);}
.stat-bar{margin-top:32px;gap:clamp(26px,5vw,64px);}
.stat b{font-family:var(--f-display);font-weight:400;font-size:clamp(2.2rem,4.4vw,3.4rem);line-height:1;color:var(--hazard);margin-bottom:4px;text-shadow:none;}
.stat span{font-family:var(--f-term);font-size:1.05rem;letter-spacing:.14em;color:var(--mute);}

/* --- buttons --- */
.btn,.btn.ghost,.btn.primary{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--f-term);font-size:1.25rem;letter-spacing:.06em;text-transform:uppercase;
  padding:10px 22px 9px;border:2px solid var(--hazard);background:var(--hazard);color:#000;
  box-shadow:none;transform:none;transition:background .2s,color .2s,filter .2s;
}
.btn:hover{transform:none;box-shadow:none;filter:brightness(1.12);background:var(--hazard);color:#000;}
.btn.ghost{background:transparent;color:var(--hazard);margin-left:0;}
.btn.ghost:hover{background:var(--hazard);color:#000;filter:none;}
.hero-actions{gap:14px;}
.topcar-arrow{border-color:rgba(242,193,78,.5);color:var(--hazard);}
.topcar-arrow:hover{background:var(--hazard);color:#000;border-color:var(--hazard);}

/* --- journal and album rows --- */
.entry-meta,.album-count{font-family:var(--f-term);font-size:1.02rem;letter-spacing:.1em;color:var(--mute);}
.entry-go,.album-go{font-family:var(--f-term);}

/* --- roadmap --- */
.timeline-year{font-family:var(--f-term);font-size:1.05rem;letter-spacing:.12em;color:var(--hazard);}
.t-item h4{font-family:var(--f-read);font-weight:600;font-size:1.12rem;color:var(--paper);}
.t-item p{font-family:var(--f-read);color:var(--paper-2);}
.phase-tag{font-family:var(--f-term);font-size:1rem;}

/* --- quote --- */
.quote{padding:clamp(40px,6vw,70px) var(--gutter);}
.quote p{font-family:var(--f-display);font-style:normal;font-size:clamp(1.8rem,3.6vw,3rem);line-height:1.05;letter-spacing:.01em;text-transform:uppercase;max-width:22ch;margin:0 auto 18px;}
.quote span{font-family:var(--f-term);font-size:1.05rem;letter-spacing:.14em;color:var(--mute);}

/* --- signal (hub layout) --- */
.signal{
  max-width:none;margin:0;text-align:left;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  padding:clamp(80px,12vw,150px) var(--gutter);
  background:radial-gradient(ellipse 60% 120% at 50% 120%,rgba(242,193,78,.12),transparent 70%),var(--ink-2);
  box-shadow:none;
}
.signal .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:center;max-width:var(--max);margin:0 auto;padding:0;}
.signal h2{font-family:var(--f-display);font-weight:400;font-size:clamp(2rem,4vw,3.1rem);line-height:.92;letter-spacing:.01em;text-transform:uppercase;color:var(--paper);margin:0 0 14px;}
.signal p{font-family:var(--f-read);color:var(--paper-2);max-width:52ch;margin:0;font-size:1.05rem;}
.signal form{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:14px;justify-content:flex-start;max-width:none;width:100%;}
.signal .sig-form .row{display:flex;flex-direction:row;}
@media (max-width:640px){.signal form{flex-direction:column;} .signal .sig-form .row{flex-direction:row;}}
.signal input[type=email]{flex:1;min-width:0;max-width:none;width:auto;background:#000;border:2px solid var(--line);border-right:0;color:var(--paper);padding:12px 16px;font:inherit;font-family:var(--f-read);font-size:1rem;}
.signal input[type=email]:focus{outline:none;border-color:var(--hazard);}
.signal .btn{width:auto;}
@media (max-width:820px){.signal .wrap{grid-template-columns:minmax(0,1fr);}}

/* --- misc --- */
#topBtn{font-family:var(--f-term);border-color:var(--hazard);color:var(--hazard);}
#topBtn:hover{background:var(--hazard);color:#000;}

/* the roadmap art slides sideways when a phase opens; keep it inside its section */
#roadmap{overflow:hidden;}