/* =========================================================
   Student Leadership — light editorial layout (sl-*)
   Brand: ink #363587 · marigold #f5c307
   ========================================================= */

body.sl-page{ background:#fff; }

.sl-hero,
.sl-houses,
.sl-participate,
.sl-grid-sec,
.sl-beyond{
  position:relative;
  overflow:hidden;
  scroll-margin-top:96px;
}

.sl-copy h1,
.sl-copy h2,
.sl-duo-copy h2,
.sl-beyond .sl-copy h2{
  margin:0 0 12px;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
  font-weight:700;
  line-height:1.12;
  letter-spacing:-.015em;
}
.sl-copy h1{ font-size:clamp(2.2rem, 4.8vw, 3.55rem); }
.sl-copy h2,
.sl-duo-copy h2,
.sl-beyond .sl-copy h2{
  font-size:clamp(1.7rem, 3vw, 2.4rem);
}
.sl-lead{
  margin:0 0 18px !important;
  color:rgb(52, 50, 114) !important;
  font-family:Helvetica, Arial, sans-serif !important;
  font-size:clamp(1.15rem, 2vw, 1.45rem) !important;
  font-weight:700 !important;
  line-height:1.25 !important;
  width:fit-content;
  background-image:linear-gradient(var(--marigold), var(--marigold));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:72% 4px;
  padding-bottom:6px;
}
.sl-copy p,
.sl-duo-copy p{
  margin:0 0 14px;
  color:rgb(33, 37, 41);
  line-height:1.72;
  max-width:38rem;
}
.sl-copy p:last-child,
.sl-duo-copy p:last-child{ margin-bottom:0; }

.sl-split{
  display:grid;
  grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);
  gap:clamp(28px, 4.5vw, 64px);
  align-items:center;
}
.sl-split-media-first .sl-media{ order:1; }
.sl-split-media-first .sl-copy{ order:2; }
.sl-copy,
.sl-media{ min-width:0; }

.sl-hero{
  padding:42px 0 28px;
  background:#fff;
}
.sl-hero-photo,
.sl-frame,
.sl-duo-media{
  position:relative;
  margin:0;
  overflow:hidden;
  background:#eceaf5;
  border-radius:18px;
}
.sl-hero-photo{
  width:100%;
  margin-left:auto;
}
.sl-hero-photo img,
.sl-frame img,
.sl-duo-media img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}
.sl-hero-photo img,
.sl-frame img{
  aspect-ratio:3 / 2;
  object-position:center center;
}

.sl-script{
  margin:0;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
  font-weight:700;
  line-height:1.15;
}
.sl-script-hero-top{
  position:absolute;
  left:8%;
  top:10%;
  font-size:clamp(1.4rem, 2.3vw, 1.9rem);
  transform:rotate(-8deg);
  text-shadow:0 1px 0 rgba(255,255,255,.7);
}
.sl-script-hero-bottom{
  position:absolute;
  left:8%;
  right:8%;
  bottom:10%;
  font-size:clamp(1.35rem, 2.1vw, 1.75rem);
  text-align:center;
  transform:rotate(-2deg);
  text-shadow:0 1px 0 rgba(255,255,255,.7);
}
.sl-script-on-photo{
  position:absolute;
  left:10%;
  bottom:12%;
  font-size:clamp(1.4rem, 2.2vw, 1.85rem);
  transform:rotate(-5deg);
  text-shadow:0 1px 0 rgba(255,255,255,.75);
}

.sl-houses{
  padding:36px 0 28px;
  background:#fcfcfe;
}
.sl-houses-grid{
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  gap:clamp(24px, 4vw, 48px);
  align-items:center;
}
.sl-house-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
}
.sl-house{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
}
.sl-house-ic,
.sl-house-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:96px;
  height:96px;
  border-radius:0;
  font-size:1.35rem;
  box-shadow:none;
  overflow:visible;
  background:transparent !important;
}
.sl-house-logo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.sl-house strong{
  font-size:.92rem;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.sl-house span:last-child{
  font-size:.82rem;
  font-weight:600;
  color:rgb(33, 37, 41);
}
.sl-house-gagan .sl-house-ic{ background:#cfe4f8; color:#2f6fad; }
.sl-house-prithvi .sl-house-ic{ background:#c8ecd4; color:#2f7a4a; }
.sl-house-tejas .sl-house-ic{ background:#f8e39a; color:#9a7400; }
.sl-house-vayu .sl-house-ic{ background:#f7c9d8; color:#a63d63; }

.sl-participate{
  padding:48px 0;
  background:#fff;
}
.sl-skills{
  list-style:none;
  margin:22px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:12px;
}
.sl-skills li{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  text-align:center;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
  font-size:.78rem;
  font-weight:700;
  line-height:1.25;
}
.sl-skill-ic{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:50%;
  background:#eef2fb;
  color:rgb(52, 50, 114);
  font-size:.95rem;
}
.sl-skills li:nth-child(1) .sl-skill-ic{ background:#cfe4f8; }
.sl-skills li:nth-child(2) .sl-skill-ic{ background:#c8ecd4; }
.sl-skills li:nth-child(3) .sl-skill-ic{ background:#f8e39a; }
.sl-skills li:nth-child(4) .sl-skill-ic{ background:#f7c9d8; }
.sl-skills li:nth-child(5) .sl-skill-ic{ background:#e4d8f7; }

.sl-opps,
.sl-video-gallery{
  margin-top:clamp(36px, 5vw, 56px);
}
.sl-opps h3,
.sl-video-gallery h3{
  margin:0 0 10px;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
  font-size:clamp(1.25rem, 2.2vw, 1.55rem);
  font-weight:700;
}
.sl-opps-intro{
  margin:0 0 22px;
  max-width:46rem;
  color:rgb(33, 37, 41);
  line-height:1.65;
}
.sl-opp-grid{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}
.sl-opp-card{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:16px;
  background:#1c1b4a;
  text-decoration:none;
  color:#fff;
  box-shadow:0 12px 26px -20px rgba(54, 53, 135, .5);
  transition:transform .25s ease;
}
.sl-opp-card:hover{ transform:translateY(-3px); color:#fff; }
.sl-opp-card img{
  display:block;
  width:100%;
  aspect-ratio:16 / 11;
  object-fit:cover;
  opacity:.92;
}
.sl-opp-card span{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:14px 14px 12px;
  background:linear-gradient(180deg, transparent, rgba(28, 27, 74, .88));
  font-family:Helvetica, Arial, sans-serif;
  font-size:.92rem;
  font-weight:700;
}

.sl-video-row{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
  margin-top:18px;
}
.sl-video-card{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:16px;
  background:#1c1b4a;
  text-decoration:none;
  color:#fff;
  box-shadow:0 12px 26px -20px rgba(54, 53, 135, .5);
}
.sl-video-card img{
  display:block;
  width:100%;
  aspect-ratio:16 / 10;
  object-fit:cover;
}
.sl-play{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(28, 27, 74, .22);
  color:#f5c307;
  font-size:1.35rem;
  transition:background .2s ease;
}
.sl-video-card:hover .sl-play{ background:rgba(28, 27, 74, .38); }
.sl-video-label{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:12px 12px 10px;
  background:linear-gradient(180deg, transparent, rgba(28, 27, 74, .9));
  font-family:Helvetica, Arial, sans-serif;
  font-size:.82rem;
  font-weight:700;
}

.sl-lead-soft{
  background-image:none !important;
  padding-bottom:0 !important;
  font-style:italic !important;
  width:auto !important;
}

.sl-grid-sec{
  padding:28px 0 48px;
  background:#fff;
}
.sl-duo-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:clamp(22px, 3.5vw, 40px);
  align-items:center;
}
.sl-duo-media img{
  aspect-ratio:3 / 2;
  object-position:center center;
}
.sl-photo-card{
  position:absolute;
  left:14px;
  bottom:14px;
  margin:0;
  max-width:10rem;
  padding:12px 14px;
  background:rgb(52, 50, 114);
  color:#fff;
  font-family:Helvetica, Arial, sans-serif;
  font-size:.95rem;
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.01em;
  box-shadow:0 10px 24px -14px rgba(54, 53, 135, .45);
}
.sl-photo-card-light{
  background:#fff;
  color:rgb(52, 50, 114);
}
.sl-text-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:14px;
  color:rgb(52, 50, 114);
  font-family:Helvetica, Arial, sans-serif;
  font-size:.95rem;
  font-weight:700;
  text-decoration:none;
}
.sl-text-link:hover{ color:var(--marigold); }
.sl-text-link i{ font-size:.85rem; transition:transform .2s ease; }
.sl-text-link:hover i{ transform:translateX(3px); }

.sl-beyond{
  padding:72px 0;
  background:
    radial-gradient(ellipse 55% 70% at 10% 30%, rgba(186, 214, 242, .7), transparent 62%),
    radial-gradient(ellipse 50% 60% at 92% 70%, rgba(186, 230, 210, .45), transparent 58%),
    linear-gradient(180deg, #e7f1fa 0%, #eef6fc 55%, #f3f8fc 100%);
}
.sl-beyond-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(280px, .95fr);
  gap:clamp(28px, 4vw, 56px);
  align-items:stretch;
}
.sl-beyond .sl-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.sl-beyond .sl-copy p{ max-width:34rem; }
.sl-beyond-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:20px;
}
.sl-beyond-aside{
  position:relative;
  display:block;
  min-height:280px;
  padding:0;
  border-radius:24px;
  background:#d9e8f6;
  border:1px solid rgba(54, 53, 135, .08);
  overflow:hidden;
}
.sl-beyond-photo{
  display:block;
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
  object-position:center 30%;
}
.sl-beyond-leaf{
  position:absolute;
  border-radius:60% 40% 55% 45%;
  pointer-events:none;
  opacity:.55;
}
.sl-beyond-leaf.a{
  width:140px;
  height:90px;
  right:-20px;
  top:18px;
  background:rgba(120, 170, 220, .28);
  transform:rotate(18deg);
}
.sl-beyond-leaf.b{
  width:160px;
  height:110px;
  left:-24px;
  bottom:24px;
  background:rgba(120, 190, 160, .22);
  transform:rotate(-24deg);
}
.sl-beyond-leaf.c{
  width:90px;
  height:70px;
  right:18%;
  bottom:14%;
  background:rgba(120, 170, 220, .2);
  transform:rotate(40deg);
}
.sl-script-cta{
  position:absolute;
  left:18px;
  top:50%;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  margin:0;
  max-width:11ch;
  padding:14px 16px;
  border-radius:14px;
  background:rgba(255,255,255,.82);
  box-shadow:0 10px 24px -16px rgba(54, 53, 135, .45);
  font-size:clamp(1.7rem, 2.8vw, 2.35rem);
  transform:translateY(-50%) rotate(-4deg);
  line-height:1.05;
  text-shadow:none;
}
.sl-script-cta span{ display:block; }

@media (max-width:980px){
  .sl-split,
  .sl-houses-grid,
  .sl-duo-grid,
  .sl-beyond-grid{
    grid-template-columns:1fr;
    gap:28px;
  }
  .sl-hero .sl-media{ order:2; }
  .sl-hero .sl-copy{ order:1; }
  .sl-split-media-first .sl-media{ order:1; }
  .sl-split-media-first .sl-copy{ order:2; }
  .sl-hero-photo{ margin-left:0; }
  .sl-skills{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .sl-house-list{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sl-opp-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sl-video-row{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width:640px){
  .sl-hero{ padding:28px 0 16px; }
  .sl-participate,
  .sl-beyond{ padding:36px 0; }
  .sl-skills{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .sl-opp-grid,
  .sl-video-row{ grid-template-columns:1fr; }
}