.social-links--centered{margin-top:20px}

/* ── Guardians colour tokens ── */
:root{
  --g-teal:#2fb89a;
  --g-green:#5bb85d;
  --g-amber:#d4783a;
  --g-gold:#f4c42a;
  --g-blue:#6b82f0;
  --g-rose:#e04d6e;
}

/* Hero ambient override — warmer, forest world tones */
.guardians-hero .hero-ambient::before{
  background:radial-gradient(ellipse at 20% 55%,rgba(47,184,154,.22) 0%,transparent 55%);
}
.guardians-hero .hero-ambient::after{
  background:radial-gradient(ellipse at 78% 25%,rgba(107,130,240,.14) 0%,transparent 48%);
}
.guardians-hero .hero-tagline{color:var(--g-teal)}

/* Section kicker overrides for Guardians sections */
.guardians-kicker{color:var(--g-teal) !important}

/* ── Guardian character cards ── */
.guardian-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:1px;
  background:var(--ink-ghost);
  border:1px solid var(--ink-ghost);
  margin-top:64px;
}
.guardian-card{
  background:var(--black);
  position:relative;
  overflow:hidden;
  padding:clamp(36px,4.5vw,64px);
  display:flex;
  flex-direction:column;
  min-height:clamp(260px,28vw,360px);
  transition:transform .5s cubic-bezier(.16,1,.3,1);
}
.guardian-card:hover{transform:translateY(-4px)}
/* coloured top accent bar */
.guardian-card::after{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:3px;
}
.guardian-card--feathers::after{background:var(--g-teal)}
.guardian-card--leaf::after{background:var(--g-green)}
.guardian-card--rocco::after{background:var(--g-amber)}
.guardian-card--sparky::after{background:var(--g-gold)}
/* subtle colour wash on hover */
.guardian-card::before{
  content:'';
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .5s cubic-bezier(.16,1,.3,1);
}
.guardian-card--feathers::before{background:radial-gradient(ellipse at 10% 10%,rgba(47,184,154,.06) 0%,transparent 60%)}
.guardian-card--leaf::before{background:radial-gradient(ellipse at 10% 10%,rgba(91,184,93,.06) 0%,transparent 60%)}
.guardian-card--rocco::before{background:radial-gradient(ellipse at 10% 10%,rgba(212,120,58,.06) 0%,transparent 60%)}
.guardian-card--sparky::before{background:radial-gradient(ellipse at 10% 10%,rgba(244,196,42,.06) 0%,transparent 60%)}
.guardian-card:hover::before{opacity:1}

.guardian-name{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(1.8rem,3vw,2.6rem);
  font-weight:400;
  letter-spacing:-.01em;
  margin-bottom:12px;
  position:relative;z-index:1;
}
.guardian-role-wrap{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  position:relative;z-index:1;
}
.guardian-logo{
  width:120px;
  height:120px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
  margin-left:-20px;
}
.guardian-role{
  font-family:'Syne',-apple-system,sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:.32em;
  text-transform:uppercase;
  position:relative;z-index:1;
  transition:color .4s;
  margin-bottom:28px;
}
.guardian-role-wrap .guardian-role{margin-bottom:0}
.guardian-card--feathers .guardian-role{color:var(--g-teal)}
.guardian-card--leaf .guardian-role{color:var(--g-green)}
.guardian-card--rocco .guardian-role{color:var(--g-amber)}
.guardian-card--sparky .guardian-role{color:var(--g-gold)}
.guardian-text{
  color:rgba(232,230,225,.6);
  font-size:15px;
  line-height:1.85;
  margin-top:auto;
  max-width:360px;
  position:relative;z-index:1;
}

/* ── Pipeline steps ── */
.pipeline-steps{margin-top:64px}
.pipeline-step{
  display:grid;
  grid-template-columns:88px 1fr;
  gap:40px;
  padding:44px 0;
  border-bottom:1px solid rgba(232,230,225,.06);
  align-items:start;
}
.pipeline-step:first-child{border-top:1px solid rgba(232,230,225,.06)}
.pipeline-num{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2.8rem,4.5vw,3.8rem);
  font-weight:300;
  line-height:1;
  padding-top:.1em;
}
.pipeline-step--01 .pipeline-num{color:var(--g-teal)}
.pipeline-step--02 .pipeline-num{color:var(--g-blue)}
.pipeline-step--03 .pipeline-num{color:var(--g-gold)}
.pipeline-step--04 .pipeline-num{color:var(--g-rose)}
.pipeline-label{
  font-family:'Syne',-apple-system,sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:.32em;
  text-transform:uppercase;
  color:rgba(232,230,225,.4);
  margin-bottom:14px;
}
.pipeline-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(1.3rem,2.2vw,1.8rem);
  font-weight:400;
  letter-spacing:-.01em;
  margin-bottom:16px;
}
.pipeline-desc{
  color:rgba(232,230,225,.6);
  font-size:15px;
  line-height:1.85;
  max-width:540px;
}

/* ── Watch CTA ── */
.watch-block{
  text-align:center;
  padding:clamp(64px,8vw,120px) 0 clamp(40px,5vw,80px);
}
.watch-note{
  font-size:16px;
  color:rgba(232,230,225,.6);
  line-height:1.85;
  margin-bottom:44px;
  max-width:520px;
  margin-left:auto;
  margin-right:auto;
}
.btn-guardians{
  background:var(--g-teal);
  color:#050608;
  border-color:var(--g-teal);
  transition:background .4s,border-color .4s,transform .3s;
}
.btn-guardians::before{background:#050608}
.btn-guardians:hover{background:transparent;border-color:var(--g-teal)}
.btn-guardians:hover span{color:var(--g-teal)}

/* ── Episode 1 button (hero CTA) ── */
.btn-ep1{border-color:rgba(47,184,154,.5)}
.btn-ep1 span{color:var(--g-teal)}
.btn-ep1:hover{border-color:var(--g-teal)}
.btn-ep1:hover span{color:var(--g-teal)}

/* ── Episode section ── */
.ep-header{margin-bottom:clamp(32px,4vw,52px)}
.ep-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2rem,4vw,3rem);
  font-weight:400;
  letter-spacing:-.01em;
  margin:0 0 8px;
}
.ep-subtitle{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-style:italic;
  font-size:clamp(1.2rem,2.2vw,1.6rem);
  font-weight:300;
  color:rgba(232,230,225,.65);
  margin:0;
}

/* ── Episode player (uses shared .video-wrapper system from script.js) ── */
.ep-video{width:100%;aspect-ratio:16/9}

/* Guardians play button — teal accent via custom properties set on the section */
#episode-1{
  --play-border:var(--g-teal);
  --play-bg:rgba(47,184,154,.12);
  --play-ring:rgba(47,184,154,.3);
  --play-fill:var(--g-teal);
  --play-border-hover:var(--g-teal);
  --play-bg-hover:rgba(47,184,154,.22);
}
#episode-1 .video-placeholder:hover .play-icon,
#episode-1 .video-placeholder:focus-visible .play-icon{
  box-shadow:0 0 28px rgba(47,184,154,.35),0 0 56px rgba(47,184,154,.12);
}

/* ── Responsive ── */
@media(max-width:768px){
  .guardian-grid{grid-template-columns:1fr}
  .guardian-card{min-height:0}
  .pipeline-step{grid-template-columns:60px 1fr;gap:24px}
}
@media(max-width:480px){
  .pipeline-step{grid-template-columns:1fr;gap:12px}
  .pipeline-num{font-size:2rem}
}
