/* =====================================================================
   MEET OUR TEACHERS  [gsc_teachers]

   A carousel of teacher cards: four visible on desktop, three on
   tablet, two on small tablet and one on a phone. The rest are a
   swipe or an arrow click away, so the section stays the same height
   whether the school has ten teachers or forty.
   ===================================================================== */

.gsc-tch{
  font-family:var(--sans,'DM Sans',system-ui,sans-serif);
  --tch-ease:cubic-bezier(0.16,1,0.3,1);
}
.gsc-tch__inner{padding-left: 5%;}

/* ── optional header (only renders if you pass the attributes) ── */
.gsc-tch__head{max-width:820px;margin:0 auto 2.6rem;text-align:center}
.gsc-tch__kick{
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold-d,#A07828);font-weight:600;margin-bottom:1rem;
}
.gsc-tch__head h2{
  font-family:var(--serif,'Cormorant',Georgia,serif);
  font-size:clamp(1.7rem,2.8vw,2.3rem);font-weight:400;
  color:var(--navy,#16255C);line-height:1.25;margin:0;
}
.gsc-tch__head h2 em{font-style:italic;color:var(--gold-d,#A07828)}
.gsc-tch__quote{
  position:relative;max-width:720px;margin:2rem auto 0;padding:1.4rem 0 0;
  font-family:var(--serif,'Cormorant',Georgia,serif);font-style:italic;
  font-size:clamp(1.05rem,1.9vw,1.35rem);line-height:1.6;color:var(--navy,#16255C);
}
.gsc-tch__quote::before{
  content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:46px;height:2px;background:var(--gold,#C6993A);
}
.gsc-tch__intro{
  max-width:820px;margin:1.8rem auto 0;text-align:center;
  font-size:.98rem;line-height:1.9;color:#4a5068;font-weight:300;
}

/* ── carousel ── */
.gsc-tch__wrap{position:relative}
.gsc-tch__track{
  display:flex;gap:1.2rem;overflow-x:auto;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:1rem;
}
.gsc-tch__track::-webkit-scrollbar{display:none}

/* ── card ── */
.gsc-tch__card{
  flex:0 0 calc((100% - 28rem)/5);scroll-snap-align:start;
  background:#fff;border:1px solid rgba(22,37,92,.09);
  transition:transform .5s var(--tch-ease),box-shadow .5s var(--tch-ease);
}
.gsc-tch__card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 48px -34px rgba(22,37,92,.5);
}
.gsc-tch__ph{
  position:relative;aspect-ratio:3/4;background:var(--paper-2,#F2EDE4);overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(22,37,92,.3);font-weight:600;
}
/* every portrait is cropped to the same frame, whatever is uploaded */
.gsc-tch__ph img{
  width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;
  transition:transform .8s var(--tch-ease);
}
.gsc-tch__card:hover .gsc-tch__ph img{transform:scale(1.05)}

.gsc-tch__body{padding:1.15rem 1.15rem 1.35rem}
.gsc-tch__body h3{
      font-family: var(--serif);
    font-size: 1.1rem;
    font-weight: 500;
    color: var(--navy, #16255C);
    line-height: 1.25;
    margin: 0;
    letter-spacing: 0.01px;
}
/* the role can be a long label such as
   "iPLS / Subjects (Visiting) - Art & Craft and Music",
   so it is allowed to wrap onto a second or third line */
.gsc-tch__role{
  display:block;font-size:0.8rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold-d,#A07828);font-weight:600;margin:.32rem 0 .65rem;
  line-height:1.55;overflow-wrap:break-word;
}
.gsc-tch__body p{    
	display: block;
    font-family: var(--sans);
    font-style: normal;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--mid);
	line-height: 1.8em;
    font-weight: 600;
    margin-top: 0;
    position: relative;
    z-index: 1;}

/* ── arrows ── */
.gsc-tch__nav{display:flex;gap:.6rem;justify-content:flex-end;margin-top:.6rem; margin-right:5%;}
.gsc-tch__nav button{
  width:44px;height:44px;border-radius:50%;border:1px solid rgba(22,37,92,.2);
  background:#fff;color:var(--navy,#16255C);cursor:pointer;font-size:1rem;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .3s var(--tch-ease),color .3s var(--tch-ease),
             border-color .3s var(--tch-ease),opacity .3s;
}
.gsc-tch__nav button:hover{background:var(--navy,#16255C);color:#fff;border-color:var(--navy,#16255C)}
.gsc-tch__nav button:disabled{opacity:.3;cursor:default}
.gsc-tch__nav button:disabled:hover{background:#fff;color:var(--navy,#16255C);border-color:rgba(22,37,92,.2)}
.gsc-tch__nav button:focus-visible{outline:2px solid var(--gold,#C6993A);outline-offset:3px}

/* ── responsive ── */
@media(max-width:1024px){
  .gsc-tch__card{flex:0 0 calc((100% - 2.4rem)/3)}
}
@media(max-width:760px){
  .gsc-tch__card{flex:0 0 calc((100% - 1.2rem)/2)}
  .gsc-tch__nav{justify-content:center}
}
@media(max-width:480px){
  .gsc-tch__card{flex:0 0 60%}
}

@media(prefers-reduced-motion:reduce){
  .gsc-tch__track{scroll-behavior:auto}
  .gsc-tch__card,.gsc-tch__ph img{transition-duration:.01ms}
}