/* Layout for the Silk design's subpages. Header, footer, buttons, type, and
   colours all come from the shared stylesheets; this only sizes each page's
   heading and its one piece of content. */
.subpage{padding-block:70px 110px;text-align:center}
.subpage h1{font-family:var(--display);font-size:clamp(58px,6.4vw,96px);line-height:.98;letter-spacing:-2px;margin-bottom:38px}

/* Events */
.calendar-embed{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}
.calendar-embed iframe{display:block;width:100%;height:min(74svh,720px);border:0}
.calendar-note{display:flex;justify-content:center;margin-top:30px}

/* Join */
.subpage-lede{font-size:16px;line-height:1.75;color:var(--muted);max-width:540px;margin:-18px auto 42px}
.subpage-action{display:flex;justify-content:center}
/* Shares the marquee photos' lift so the page does not end on a flat rectangle. */
.subpage-photo{margin:58px 0 0;border-radius:18px;overflow:hidden;box-shadow:0 14px 32px #17374917,0 2px 6px #17374910}
.subpage-photo img{display:block;width:100%;height:auto;aspect-ratio:1.85;object-fit:cover;object-position:center 62%}
.subpage-photo:has(.campaign-meeting){overflow:visible;box-shadow:none}
.subpage-photo img.campaign-meeting{aspect-ratio:auto;height:auto;object-fit:contain;border-radius:14px}
.subpage-photo figcaption{text-align:left;font-size:11px;line-height:1.6;color:var(--muted);margin-top:14px}

.subpage-action{align-items:center;gap:28px;flex-wrap:wrap}
.join-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;text-align:left;margin:66px auto 0;max-width:1100px;padding-top:32px;border-top:1px solid var(--line)}
.join-details h2,.intern-note h2{font:36px/1.1 var(--display);letter-spacing:-.5px;margin:14px 0}
.join-details p:not(.eyebrow),.intern-note p:not(.eyebrow){font-size:14px;line-height:1.8;color:var(--muted)}
.intern-note{display:flex;align-items:center;justify-content:space-between;gap:48px;text-align:left;border-top:1px solid var(--line);margin-top:58px;padding-top:32px}
.intern-note>div:first-child{max-width:620px}
.intern-links{display:flex;flex-direction:column;align-items:flex-start;gap:20px;flex-shrink:0}
.intern-links>a:last-child{font-size:12px;color:var(--muted);text-decoration:underline;text-underline-offset:4px}
.next-meeting{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;text-align:left;padding:38px 42px;border:1px solid #ffffffd9;border-radius:18px;background:linear-gradient(120deg,#ffffffb3,#dcebf066);margin:0 0 60px}
.next-meeting h2{font:42px/1.1 var(--display);letter-spacing:-.6px;margin:16px 0;max-width:520px}
.meeting-welcome,.meeting-details p{font-size:14px;line-height:1.7;color:var(--muted)}
.meeting-details{align-self:center;padding-left:38px;border-left:1px solid var(--line)}
.meeting-details .meeting-time{font-size:16px;color:var(--ink);margin-bottom:10px}
.meeting-details .text-link{margin-top:20px}
.calendar-heading{text-align:left;display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:22px}
.calendar-heading h2{font:32px/1.2 var(--display)}
.calendar-heading p{font-size:12px;color:var(--muted);line-height:1.6}

@media(max-width:1000px){
  .subpage{padding-block:55px 90px}
  .subpage h1{font-size:clamp(50px,7.4vw,74px);margin-bottom:30px}
  .calendar-embed iframe{height:min(70svh,620px)}
}
@media(max-width:700px){
  .subpage{padding-block:40px 70px}
  .subpage h1{font-size:52px;letter-spacing:-1px;margin-bottom:24px}
  .calendar-embed{border-radius:10px}
  .calendar-embed iframe{height:min(68svh,520px)}
  .calendar-note{margin-top:22px}
  .calendar-note .text-link{font-size:11px;gap:18px}
  .subpage-lede{font-size:13px;max-width:330px;margin:-10px auto 30px}
  .subpage-photo{margin-top:38px;border-radius:10px}
  .subpage-photo img{aspect-ratio:1.25}
  .subpage-action{gap:24px}
  .join-details{grid-template-columns:1fr;gap:28px;margin-top:42px;padding-top:28px}
  .join-details h2,.intern-note h2{font-size:32px;margin-block:10px}
  .join-details p:not(.eyebrow),.intern-note p:not(.eyebrow){font-size:13px}
  .intern-note{flex-direction:column;align-items:stretch;gap:24px;margin-top:36px;padding-top:28px}
  .intern-links{gap:18px}
  .next-meeting{grid-template-columns:1fr;gap:24px;padding:24px 22px;margin-bottom:38px;border-radius:14px}
  .next-meeting h2{font-size:34px;margin:14px 0}
  .meeting-details{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}
  .meeting-welcome,.meeting-details p{font-size:13px}
  .meeting-details .meeting-time{font-size:14px}
  .calendar-heading{display:block;margin-bottom:18px}
  .calendar-heading h2{font-size:30px;margin-bottom:10px}
}
