/* JT & Margaret Talkington College of Visual & Performing Arts - shared stylesheet
   One file for every college page built on this design. Live URL:
   https://www.depts.ttu.edu/visual-performing-arts/includes/css/styles-cvpa.css

   CONTENTS
     PART 1  SHARED          - fonts, tokens, page wrapper, reset, hero text, page hero,
                               icons, buttons, red call-to-action band, animations
     PART 2  HOMEPAGE        - /visual-performing-arts/index.php
     PART 3  PROGRAMS PAGE   - /visual-performing-arts/programs/undergraduate/index.php
     PART 4  PROGRAM PAGE    - single-degree pages (template: Claude Build/program page)
     PART 5  SCHOOL HOMEPAGES - art, music, theatre-dance, interdisciplinary-arts (also use PART 2 sections)
     PART 6  COMMUNITY PAGES  - community/music/string-project (built on the PART 4 program page)
     PART 7  HANDBOOKS        - handbook/<school> accordion pages (e.g. the Art MFA Handbook)
     PART 7b PLAIN PAGES      - .page--plain-cvpa: compact black header, then all white (FADP handbook)
     PART 8  EVENTS SECTION   - events by discipline; scoped to #disc-events-cvpa so it works on any page
     PART 9  ALUMNI PAGES     - alumni-give pages (e.g. How to get involved with TTUArtsAlumni)
     PART 9b ALUMNI HOME PAGE - extras for college/alumni-give/home
     PART 9c NEXT STAGE       - college/alumni-give/next-stage (alumni career panel)
     PART 10 REUNION / EVENTS - music/community/100-year-choir (reunion event page)
     PART 11 RESEARCH PAGES   - college/research (outreach & engagement)
     PART 12 CALENDAR PAGES   - <site>/calendar (college and school event calendars)
     PART 13 PHOTO REEL       - test: "social creatures" photo carousel on the college homepage
     PART 15 DEGREE PLANS     - <school>/degree-plans/<plan> (course lists with course codes)
     PART 16 PEOPLE PAGES     - <school>/about/our-people: faculty/staff directory (search, area filters) + bio pages
     LAST    SECTION COLOUR VERSIONS - red / white / black versions for the strict black, white, red order

   When adding styles: every class ends in -cvpa, every selector starts with
   #page-cvpa (PART 8 uses its section id instead), and anything used by only one page goes in that page's PART. */


/* ===========================================================================
   PART 1 - SHARED (all pages)
   Fonts, design tokens, the full-width page wrapper, the template reset and the
   building blocks several pages use. Changes here affect every page.
   =========================================================================== */


/* No fonts are set in this stylesheet: all text uses the page's global (template) stylesheet. */

#page-cvpa {
  /* Design tokens, scoped to this page's content so they never override template variables */
  /* Brand primitives */
  --red: #E90802;
  --black: #000000;
  --white: #FFFFFF;

  /* Semantic tokens */
  --bg: var(--black);
  --text: var(--white);
  --text-muted: rgba(255, 255, 255, 0.72);
  --surface: #111111;
  --rule: rgba(255, 255, 255, 0.14);
  --accent: var(--red);
  --accent-hover: #FF2A1F;
  --on-accent: var(--white);
  --focus: var(--white);

  /* Display sizes are scaled down by these factors: large headings, titles, small labels */
  --ds-l: 0.66; --ds-m: 0.8; --ds-s: 0.88;

  /* Paragraph text sizes, shared by every page that uses this stylesheet (homepage, programs list,
     program pages). Change these to resize paragraph text everywhere at once. */
  --fs-lede: clamp(1.15rem, 1.6vw, 1.35rem); /* section intros under a heading */
  --fs-body: 1.125rem;                      /* regular paragraphs */
  --fs-card: 1.05rem;                       /* text inside cards, captions and lists */
  --fs-small: 0.95rem;                      /* secondary lines (names, status messages) */

  --gutter: clamp(1rem, 4vw, 3.5rem);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Page wrapper ----------
   All homepage sections sit inside .page-cvpa. It breaks out of the TTU
   template's content column to span the full browser width, and base styles
   are scoped to it so the template's header and footer are not affected. */
#page-cvpa {
  position: relative;
  width: var(--page-w, 100vw); max-width: var(--page-w, 100vw);
  margin-left: calc(50% - var(--page-w, 100vw) / 2); margin-right: calc(50% - var(--page-w, 100vw) / 2);
  background: var(--bg);
  color: var(--text);
  font-size: 1rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
/* 100vw includes the scrollbar, so clip the few extra pixels (only on pages using this layout) */
html:has(.page-cvpa), body:has(.page-cvpa) { overflow-x: clip; }
/* Template columns must not clip or pad the full-width wrapper */
:has(> .page-cvpa) { overflow: visible; }
/* Start the page right under the template header: drop the content area's top padding
   and lay the TTU breadcrumb over the top of the hero, in white (this page only). */
.l-main-pagecontent:has(.page-cvpa) { padding-top: 0; }
/* ...and end it flush against the grey contact block (no white strip above the footer) */
.standard-content:has(.page-cvpa) { padding-bottom: 0; }
.l-main-pagecontent:has(.page-cvpa) + .l-contact { margin-top: 0; }
/* OmniUpdate's editor can insert empty <p>&nbsp;</p> around the content; hide them */
:has(> #page-cvpa) > p { display: none; }
.breadcrumb:has(~ * #page-cvpa) {
  position: absolute; top: 0; left: 0; right: 0; z-index: 5;
  background: none;
}
.breadcrumb:has(~ * #page-cvpa),
.breadcrumb:has(~ * #page-cvpa) *,
.breadcrumb:has(~ * #page-cvpa) *::before,
.breadcrumb:has(~ * #page-cvpa) *::after { color: rgba(255, 255, 255, 0.85); border-color: rgba(255, 255, 255, 0.4); }
.breadcrumb:has(~ * #page-cvpa) a { color: #fff; transition: none; } /* no black-to-white fade on load */
.breadcrumb:has(~ * #page-cvpa) a:hover { text-decoration: underline; }
.breadcrumb:has(~ * #page-cvpa) a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* Base + template reset. :where() keeps these at the lowest priority inside the
   page, so every component rule below still wins, while the #page-cvpa ID still
   beats the TTU template's element styles (.standard-content h2, ul li, a, p ...). */
#page-cvpa, #page-cvpa :where(*, *::before, *::after) { box-sizing: border-box; }
#page-cvpa :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, blockquote, figure, section, aside, footer, cite, time, strong, span, div, button) {
  margin: 0; padding: 0; border: 0; background: none; box-shadow: none;
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit;
  text-align: inherit; font-style: normal; word-spacing: normal; max-width: none;
}
#page-cvpa :where(h1, h2, h3, h4, h5, h6, p, ul, ol, li, blockquote, figure, section, aside, footer, div) { display: block; }
#page-cvpa :where(blockquote, button, figure)::before, #page-cvpa :where(blockquote, button, figure)::after { content: none; }
#page-cvpa :where(strong) { font-weight: 700; }
#page-cvpa :where(ul, ol) { list-style: none; }
#page-cvpa :where(li)::before, #page-cvpa :where(li)::after { content: none; }
#page-cvpa :where(a) { color: inherit; text-decoration: none; background: none; box-shadow: none; }
#page-cvpa :where(a)::before, #page-cvpa :where(a)::after { content: none; }
#page-cvpa :where(img) { display: block; max-width: 100%; height: auto; margin: 0; border: 0; }
#page-cvpa :where(button) { cursor: pointer; line-height: normal; }
/* Any paragraph without its own size uses the shared paragraph size (after the reset above) */
#page-cvpa :where(p) { font-size: var(--fs-body); }

#page-cvpa .visually-hidden-cvpa {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

#page-cvpa :focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}

/* Elements hidden by the page scripts (people filter, program filters, etc.) */
#page-cvpa [hidden] { display: none !important; }

/* ---------- Hero text (college name, headline, lede) - used by every page hero ---------- */
#page-cvpa .college__uni-cvpa { color: var(--white); }
#page-cvpa .college-cvpa {
  display: flex; flex-direction: column; gap: 0.5rem;
  margin: 0 0 clamp(0.75rem, 2.5vh, 1.75rem);
}
#page-cvpa .college__uni-cvpa {
  display: inline-flex; align-items: center; gap: 0.75rem;
  font-size: 0.8rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--text-muted);
}
#page-cvpa .college__uni-cvpa::before {
  content: ""; width: 2.5rem; height: 3px; background: var(--accent);
}
#page-cvpa .college__name-cvpa {
  font-weight: 800;
  font-size: calc((clamp(1.35rem, 2.4vw, 2.25rem)) * var(--ds-m)); line-height: 1.05;
  letter-spacing: 0.03em; text-transform: uppercase;
  color: var(--text);
}

#page-cvpa .headline-cvpa {
  display: block; margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3.4rem, min(9.2vw, 12vh), 9.5rem)) * var(--ds-l)); /* also scales with screen height */
  line-height: 0.86; letter-spacing: -0.005em; text-transform: uppercase;
}
#page-cvpa .headline-cvpa span { display: block; }
#page-cvpa .headline__solid-cvpa { color: var(--accent); }
#page-cvpa .headline__outline-cvpa {
  color: transparent;
  -webkit-text-stroke: clamp(1.5px, 0.22vw, 3px) var(--white);
}
@supports not (-webkit-text-stroke: 1px white) {
  #page-cvpa .headline__outline-cvpa { color: var(--white); }
}

#page-cvpa .lede-cvpa {
  max-width: 34rem; margin: clamp(0.75rem, 2.5vh, 1.75rem) 0 0;
  font-size: var(--fs-lede); line-height: 1.55;
  color: var(--text-muted);
}
#page-cvpa .lede-cvpa strong { color: var(--text); font-weight: 600; }

/* ---------- Icons ----------
   OmniUpdate strips inline <svg> from page content, so icons are empty
   <span class="icon-cvpa icon-NAME-cvpa"> tags drawn here with a CSS mask.
   They take the text colour (currentColor); size them with width/height. */
#page-cvpa .icon-cvpa {
  display: inline-block; flex: none; vertical-align: middle;
  width: 1em; height: 1em;
  background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}
#page-cvpa .icon-arrow-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='square'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
#page-cvpa .icon-pause-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 4h4v16H6zM14 4h4v16h-4z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-play-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 4l13 8-13 8z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-clock-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
#page-cvpa .icon-pin-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Cpath d='M12 21s-7-6.2-7-11a7 7 0 0 1 14 0c0 4.8-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
#page-cvpa .icon-quote-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35 26'%3E%3Cpath d='M0 26V15C0 6.7 4.6 1.6 13 0l1.6 3.6C9.8 5 7.4 8 7 12h6v14H0zm20 0V15c0-8.3 4.6-13.4 13-15l1.6 3.6C29.8 5 27.4 8 27 12h6v14H20z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-facebook-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 22v-8.2h2.8l.4-3.3h-3.2V8.4c0-.9.3-1.6 1.6-1.6h1.7V3.9c-.3 0-1.3-.1-2.5-.1-2.5 0-4.2 1.5-4.2 4.3v2.4H7.3v3.3h2.8V22h3.4z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-instagram-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Ccircle cx='17.4' cy='6.6' r='1.1' fill='black' stroke='none'/%3E%3C/svg%3E"); }
#page-cvpa .icon-youtube-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M21.6 7.2a2.5 2.5 0 0 0-1.8-1.8C18.2 5 12 5 12 5s-6.2 0-7.8.4A2.5 2.5 0 0 0 2.4 7.2C2 8.8 2 12 2 12s0 3.2.4 4.8a2.5 2.5 0 0 0 1.8 1.8C5.8 19 12 19 12 19s6.2 0 7.8-.4a2.5 2.5 0 0 0 1.8-1.8c.4-1.6.4-4.8.4-4.8s0-3.2-.4-4.8zM10 15.1V8.9l5.3 3.1L10 15.1z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-linkedin-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3.3a2.2 2.2 0 1 1 0 4.4 2.2 2.2 0 0 1 0-4.4zM3.1 9.2h3.8V21H3.1V9.2zm6.2 0h3.6v1.6h.1c.5-1 1.8-2 3.7-2 3.9 0 4.6 2.6 4.6 5.9V21h-3.8v-5.6c0-1.3 0-3-1.9-3s-2.2 1.5-2.2 3V21H9.3V9.2z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-mic-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='2.5' width='6' height='11' rx='3'/%3E%3Cpath d='M5.5 11a6.5 6.5 0 0 0 13 0M12 17.5V21M8.5 21h7'/%3E%3C/svg%3E"); }
#page-cvpa .icon-wave-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 12h2.5l2-5 3 10 3-14 3 12 2-3H21'/%3E%3C/svg%3E"); }
#page-cvpa .icon-mail-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='2.5' y='5' width='19' height='14'/%3E%3Cpath d='M2.5 5.5l9.5 7.5 9.5-7.5'/%3E%3C/svg%3E"); }
#page-cvpa .icon-phone-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M5 3h4l2 5-2.5 1.5a11 11 0 0 0 6 6L16 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 5a2 2 0 0 1 2-2z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-x-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.8 3h3.1l-6.8 7.8L22 21h-6.2l-4.9-6.4L5.3 21H2.2l7.3-8.3L2 3h6.4l4.4 5.8L17.8 3zm-1.1 16.2h1.7L7.4 4.7H5.6l11.1 14.5z'/%3E%3C/svg%3E"); }
#page-cvpa .icon-mappin-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 1.5a7.5 7.5 0 0 0-7.5 7.5c0 5.6 7.5 13.5 7.5 13.5s7.5-7.9 7.5-13.5A7.5 7.5 0 0 0 12 1.5zm0 10.3a2.8 2.8 0 1 1 0-5.6 2.8 2.8 0 0 1 0 5.6z'/%3E%3C/svg%3E"); }
/* Windows High Contrast: keep icons visible in the system text colour */
@media (forced-colors: active) {
  #page-cvpa .icon-cvpa { forced-color-adjust: none; background-color: CanvasText; }
}
#page-cvpa .icon-search-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='square'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.5 15.5L21 21'/%3E%3C/svg%3E"); }

/* ---------- Buttons ---------- */
#page-cvpa .actions-cvpa {
  display: flex; flex-wrap: wrap; gap: 0.85rem;
  margin-top: clamp(1rem, 3vh, 2.25rem);
}
#page-cvpa .btn-cvpa {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
  min-height: 52px; padding: 0 1.6rem;
  font-weight: 800; font-size: calc((1.15rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none;
  border: 2px solid transparent;
  background: transparent; cursor: pointer; /* reset native <button> styling */
  transition: background-color 200ms, color 200ms, border-color 200ms, transform 200ms var(--ease-out);
}
#page-cvpa .btn-cvpa .icon-cvpa { width: 18px; height: 18px; transition: transform 200ms var(--ease-out); }
#page-cvpa .btn-cvpa:hover .icon-cvpa { transform: translateX(4px); }
#page-cvpa .btn-cvpa:active { transform: scale(0.98); }
#page-cvpa .btn--primary-cvpa { background: var(--accent); color: var(--on-accent); }
#page-cvpa .btn--primary-cvpa:hover { background: var(--accent-hover); }
#page-cvpa .btn--ghost-cvpa { border-color: var(--white); color: var(--white); }
#page-cvpa .btn--ghost-cvpa:hover { background: var(--white); color: var(--black); }
/* on white or light grey sections the outline button is black (white on light grey fails contrast) */
#page-cvpa :is(.q-section--light-cvpa, .q-section--gray-cvpa) .btn--ghost-cvpa { border-color: var(--black); color: var(--black); }
#page-cvpa :is(.q-section--light-cvpa, .q-section--gray-cvpa) .btn--ghost-cvpa:hover { background: var(--black); color: var(--white); }

/* Entrance animation for hero text (.reveal-cvpa) */
#page-cvpa .reveal-cvpa { opacity: 0; transform: translateY(24px); animation: rise 900ms var(--ease-out) forwards; }
#page-cvpa .headline-cvpa.reveal-cvpa { animation-delay: 120ms; }
#page-cvpa .lede-cvpa.reveal-cvpa { animation-delay: 260ms; }
#page-cvpa .actions-cvpa.reveal-cvpa { animation-delay: 380ms; }
@keyframes rise { to { opacity: 1; transform: none; } }

/* ---------- Scroll fade-in (.fade-up-cvpa) - the page scripts add .js-cvpa and .is-visible-cvpa ---------- */
#page-cvpa.js-cvpa .fade-up-cvpa {
  opacity: 0; transform: translateY(20px);
  transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out);
}
#page-cvpa .fade-up-cvpa.is-visible-cvpa { opacity: 1; transform: none; }
/* Never let keyboard focus land on something still faded out */
#page-cvpa .fade-up-cvpa:focus-within { opacity: 1; transform: none; transition-duration: 0s; transition-delay: 0s; }


/* ---------- Page hero (inner pages: programs list, program pages) ----------
   Shorter than the homepage hero: one static photo on the right, text on the left. */
#page-cvpa .page-hero-cvpa {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--black);
  /* top keeps a clear strip for the TTU breadcrumb laid over the hero */
  /* the extra 1.7rem top and bottom makes the hero about 10% taller */
  padding: calc(clamp(4rem, 7vw, 6rem) + 1.7rem) var(--gutter) calc(clamp(3rem, 5vw, 4.5rem) + 1.7rem);
  --text-muted: rgba(255, 255, 255, 0.88);
}
/* Desktop: a further 25% taller (extra space split evenly above and below the text) */
@media (min-width: 901px) {
  #page-cvpa .page-hero-cvpa {
    padding-top: calc(clamp(4rem, 7vw, 6rem) + 6.3rem);
    padding-bottom: calc(clamp(3rem, 5vw, 4.5rem) + 6.3rem);
  }
}
#page-cvpa .page-hero__media-cvpa {
  position: absolute; top: 0; right: 0; bottom: 0; z-index: -2;
  width: 55%;
}
#page-cvpa .page-hero__media-cvpa img {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center);
  filter: saturate(0.95) contrast(1.05);
}
/* Legibility scrim: keeps all hero text at AA contrast over the photos */
#page-cvpa .page-hero-cvpa::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.95) 48%, rgba(0,0,0,0.55) 66%, rgba(0,0,0,0.15) 100%),
    linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 25%, rgba(0,0,0,0) 75%, rgba(0,0,0,0.6) 100%);
}
#page-cvpa .page-hero-cvpa::after {
  content: ""; position: absolute; z-index: -1;
  width: 60vmax; height: 60vmax; left: -18vmax; top: 10%;
  background: radial-gradient(circle, rgba(233, 8, 2, 0.22) 0%, rgba(233, 8, 2, 0) 60%);
  pointer-events: none;
}
#page-cvpa .page-hero__content-cvpa { position: relative; max-width: 72rem; }
#page-cvpa .page-hero__title-cvpa { margin: 0; font: inherit; }
#page-cvpa .page-hero-cvpa .headline-cvpa { font-size: calc((clamp(3.4rem, 9vw, 9rem)) * var(--ds-l)); }
/* Long names ("Composition."): smaller headline so it stays over the dark side of the hero */
#page-cvpa .page-hero-cvpa .headline--long-cvpa { font-size: calc((clamp(2.6rem, 6.2vw, 6.3rem)) * var(--ds-l)); }

/* ---------- Closing call to action (red band) - programs list + program pages ---------- */
#page-cvpa .cta-cvpa {
  background: var(--accent); color: var(--white);
  padding: clamp(4rem, 8vw, 6.5rem) var(--gutter);
  text-align: center;
}
#page-cvpa .cta__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3rem, 7vw, 6.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .cta__text-cvpa { max-width: 36rem; margin: 1.25rem auto 0; font-size: var(--fs-lede); line-height: 1.55; }
#page-cvpa .cta__actions-cvpa { justify-content: center; }
#page-cvpa .btn--light-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .btn--light-cvpa .icon-cvpa { color: var(--accent); }
#page-cvpa .btn--light-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .btn--light-cvpa:hover .icon-cvpa { color: var(--white); }

/* ---------- Shared responsive + reduced motion ---------- */
@media (max-width: 560px) {
  #page-cvpa .btn-cvpa { flex: 1 1 100%; }
}
@media (max-width: 900px) {
  /* Page hero: photo sits behind the text on narrow screens, under a heavier scrim */
  #page-cvpa .page-hero__media-cvpa { width: 100%; }
  #page-cvpa .page-hero-cvpa::before { background: rgba(0, 0, 0, 0.88); }
}
@media (max-width: 640px) {
  /* Page hero: TTU hides the breadcrumb on phones, so less top room is needed */
  #page-cvpa .page-hero-cvpa { padding-top: calc(2.5rem + 1.7rem); }
}
@media (prefers-reduced-motion: reduce) {
  #page-cvpa .reveal-cvpa { animation: none; opacity: 1; transform: none; }
  #page-cvpa .btn-cvpa { transition: none; }
  #page-cvpa .fade-up-cvpa { opacity: 1; transform: none; transition: none; }
}


/* ===========================================================================
   PART 2 - HOMEPAGE
   Only used by /visual-performing-arts/index.php: hero collage, who we are,
   schools, news, events, people, follow/listen.
   =========================================================================== */

/* ---------- Hero ---------- */
#page-cvpa .hero-cvpa {
  position: relative; isolation: isolate; overflow: hidden;
  /* Fill the visible screen below the template header (offset measured by the
     script); falls back to the full screen height without JavaScript. */
  min-height: max(28rem, calc(100vh - var(--hero-offset, 0px)));
  min-height: max(28rem, calc(100svh - var(--hero-offset, 0px)));
  display: flex; align-items: center;
  /* vertical padding shrinks on shorter screens so the whole hero fits;
     bottom keeps room for the pause button */
  /* top keeps a clear strip for the TTU breadcrumb laid over the hero */
  padding: clamp(3.5rem, 6vh, 5rem) var(--gutter) clamp(4rem, 8vh, 6rem);
}

/* Drifting collage */
#page-cvpa .collage-cvpa {
  position: absolute; inset: 0; z-index: -2;
  pointer-events: none;
}
#page-cvpa .col-cvpa {
  position: absolute; top: 0; height: 100%;
  width: var(--w);
  left: var(--x);
}
#page-cvpa .track-cvpa {
  display: flex; flex-direction: column;
  animation: drift var(--speed) linear infinite;
  animation-delay: var(--delay);
  will-change: transform;
}

#page-cvpa .tile-cvpa {
  margin: 0 0 var(--gap, 18vh);
  transform: translateX(var(--nudge, 0));
  overflow: hidden;
  background: #111;
}
#page-cvpa .tile-cvpa img {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center);
  filter: saturate(0.95) contrast(1.05);
}
#page-cvpa .tile--sq-cvpa { aspect-ratio: 1100 / 987; }
#page-cvpa .tile--land-cvpa { aspect-ratio: 3 / 2; }
#page-cvpa .tile--wide-cvpa { aspect-ratio: 2.16 / 1; }

@keyframes drift {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(0, -33.3333%, 0); }
}

/* Legibility scrim + stage-light glow */
#page-cvpa .hero-cvpa::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  /* Legibility scrim: the left-side band keeps text at WCAG AA contrast
     even when a bright photo drifts directly behind it. */
  background:
    linear-gradient(90deg, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.9) 50%, rgba(0,0,0,0.6) 62%, rgba(0,0,0,0) 78%),
    radial-gradient(ellipse 55% 60% at 22% 55%, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.7) 45%, rgba(0,0,0,0) 80%),
    linear-gradient(180deg, rgba(0,0,0,0.55) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 75%, rgba(0,0,0,0.7) 100%);
}
#page-cvpa .hero-cvpa { --text-muted: rgba(255, 255, 255, 0.88); }
#page-cvpa .hero-cvpa::after {
  content: ""; position: absolute; z-index: -1;
  width: 60vmax; height: 60vmax; left: -18vmax; top: 10%;
  background: radial-gradient(circle, rgba(233, 8, 2, 0.22) 0%, rgba(233, 8, 2, 0) 60%);
  pointer-events: none;
}

#page-cvpa .hero__content-cvpa { max-width: 72rem; }

/* One H1 holds the college name + tagline (SEO); reset browser heading styles */
#page-cvpa .hero__title-cvpa { margin: 0; font: inherit; }

#page-cvpa .disciplines-cvpa {
  display: flex; flex-wrap: wrap; gap: 0.4rem 1.25rem;
  margin: clamp(0.9rem, 3vh, 2.75rem) 0 0; padding: 0; list-style: none;
  font-weight: 700; font-size: calc((1.4rem) * var(--ds-s));
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted);
}
#page-cvpa .disciplines-cvpa li { display: flex; align-items: center; gap: 1.25rem; }
#page-cvpa .disciplines-cvpa li + li::before {
  content: ""; width: 6px; height: 6px; background: var(--accent); transform: rotate(45deg);
}

/* Pause motion control - small icon button (required for WCAG 2.2.2) */
#page-cvpa .motion-toggle-cvpa {
  position: absolute; right: var(--gutter); bottom: 1.25rem; z-index: 10;
  display: grid; place-items: center;
  width: 44px; height: 44px; padding: 0;
  background: rgba(0, 0, 0, 0.6); color: var(--white);
  border: 1px solid rgba(255, 255, 255, 0.55); border-radius: 50%; cursor: pointer;
  opacity: 0.8;
  transition: opacity 200ms, background-color 200ms;
}
#page-cvpa .motion-toggle-cvpa:hover, #page-cvpa .motion-toggle-cvpa:focus-visible { opacity: 1; background: rgba(0, 0, 0, 0.85); }
#page-cvpa .motion-toggle-cvpa .icon-cvpa { width: 14px; height: 14px; }
#page-cvpa .motion-toggle-cvpa .icon-play-cvpa { display: none; }
#page-cvpa .motion-toggle-cvpa[data-paused="true"] .icon-play-cvpa { display: block; }
#page-cvpa .motion-toggle-cvpa[data-paused="true"] .icon-pause-cvpa { display: none; }

/* Entrance delay for the homepage discipline list */
#page-cvpa .disciplines-cvpa.reveal-cvpa { animation-delay: 500ms; }

/* ---------- Who we are ---------- */
#page-cvpa .about-cvpa {
  --text: var(--black);
  --text-muted: #3d3d3d;
  --rule: rgba(0, 0, 0, 0.14);
  --focus: var(--black);
  background: var(--white); color: var(--text);
  padding: clamp(5rem, 11vw, 9rem) var(--gutter) clamp(4.5rem, 9vw, 7.5rem);
  text-align: center;
}
#page-cvpa .about__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(4.5rem, 14vw, 12rem)) * var(--ds-l));
  line-height: 0.85; letter-spacing: -0.01em;
}
#page-cvpa .about__title-cvpa span { color: var(--accent); }
#page-cvpa .about__lede-cvpa {
  max-width: 44rem; margin: 1.75rem auto 0;
  font-size: var(--fs-lede); line-height: 1.65;
  color: var(--text-muted);
}
#page-cvpa .about__lede-cvpa + .about__lede-cvpa { margin-top: 1.1rem; }

#page-cvpa .stats-cvpa {
  display: grid; grid-template-columns: repeat(3, 1fr);
  max-width: 78rem; margin: clamp(3.5rem, 7vw, 6rem) auto 0; padding: 0;
  list-style: none;
}
#page-cvpa .stat-cvpa { padding: 0.5rem 1.5rem; }
#page-cvpa .stat-cvpa + .stat-cvpa { border-left: 1px solid var(--rule); }
#page-cvpa .stat__value-cvpa {
  display: block;
  font-weight: 900;
  font-size: calc((clamp(3.5rem, 6vw, 5.5rem)) * var(--ds-l)); line-height: 1;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
}
#page-cvpa .stat__label-cvpa {
  display: block; max-width: 18rem; margin: 0.75rem auto 0;
  font-size: var(--fs-card); font-weight: 600; line-height: 1.4;
  color: var(--text);
}

/* Homepage fade-in stagger */
#page-cvpa .stat-cvpa.fade-up-cvpa:nth-child(2), #page-cvpa .school-cvpa.fade-up-cvpa:nth-child(3n+2) { transition-delay: 120ms; }
#page-cvpa .stat-cvpa.fade-up-cvpa:nth-child(3), #page-cvpa .school-cvpa.fade-up-cvpa:nth-child(3n) { transition-delay: 240ms; }

/* ---------- Find a career (red band under "who we are") ---------- */
#page-cvpa .find-career-cvpa {
  /* all text solid white: white on brand red is 4.65:1 (AA); any transparency would drop below 4.5 */
  --text: var(--white); --text-muted: var(--white); --rule: rgba(255, 255, 255, 0.35); --focus: var(--white);
  background: var(--accent); color: var(--text);
  padding: clamp(4.5rem, 9vw, 7rem) var(--gutter);
}
/* Left-aligned like "our people": same content width, heading + intro left, button right */
#page-cvpa .find-career__inner-cvpa { max-width: 84rem; margin: 0 auto; }
#page-cvpa .find-career__head-cvpa {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 1.5rem 2rem;
}
#page-cvpa .find-career__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3rem, 7vw, 6.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .find-career__title-cvpa span { color: var(--black); }
#page-cvpa .find-career__lede-cvpa { max-width: 30rem; margin: 1rem 0 0; font-size: var(--fs-lede); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .find-career__grid-cvpa {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .find-career__item-cvpa {
  padding: 1rem 0 1rem 1rem;
  border-left: 3px solid var(--white); border-bottom: 1px solid var(--rule);
  font-weight: 800; font-size: calc((1.4rem) * var(--ds-m)); line-height: 1.15;
  text-transform: uppercase; letter-spacing: 0.02em;
}
#page-cvpa .find-career__item-cvpa[hidden] { display: none; }
#page-cvpa .find-career__actions-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
/* School filter buttons on red: white outline; the selected one turns solid white */
#page-cvpa .find-career-cvpa .filter-cvpa { color: var(--white); border-color: var(--white); }
#page-cvpa .find-career-cvpa .filter-cvpa:hover { background: rgba(0, 0, 0, 0.18); }
#page-cvpa .find-career-cvpa .filter-cvpa[aria-pressed="true"] { background: var(--white); border-color: var(--white); color: var(--black); }
#page-cvpa .find-career-cvpa .btn--light-cvpa:hover { background: var(--black); color: var(--white); }

/* ---------- Schools ---------- */
/* White on top (title), black band behind the lower half of the dark cards */
#page-cvpa .schools-cvpa {
  --band-start: clamp(8rem, 12vw, 11rem);
  --focus: var(--black);
  background: var(--white); color: var(--black);
  padding-top: clamp(4.5rem, 9vw, 7rem);
}
#page-cvpa .schools__title-cvpa {
  max-width: 90rem; margin: 0 auto; padding: 0 var(--gutter);
  font-weight: 900;
  font-size: calc((clamp(3rem, 7vw, 6.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .schools__title-cvpa span { color: var(--accent); }
#page-cvpa .schools__band-cvpa {
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding: 0 max(1rem, calc(var(--gutter) / 2)) clamp(3.5rem, 6vw, 5.5rem);
  background: linear-gradient(180deg, transparent 0, transparent var(--band-start), var(--black) var(--band-start));
}
/* View all programs button under the school cards (on the black band): centred, white focus ring */
#page-cvpa .schools__actions-cvpa { --focus: var(--white); justify-content: center; margin-top: clamp(2rem, 4vw, 3rem); }
#page-cvpa .schools__grid-cvpa {
  --cols: 5; --gap: clamp(0.6rem, 0.9vw, 1.1rem);
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--gap);
  max-width: 96rem; margin: 0 auto; padding: 0; list-style: none;
}

#page-cvpa .school-cvpa {
  display: flex; flex-direction: column; min-width: 0;
  flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  background: var(--surface);
  /* dark cards keep white text inside the white section; a faint outline separates them from the black band */
  color: var(--white); --focus: var(--white);
  outline: 1px solid rgba(255, 255, 255, 0.16); outline-offset: -1px;
}
#page-cvpa .school__media-cvpa {
  aspect-ratio: 4 / 3; overflow: hidden; margin: 0;
  background: #1c1c1c;
}
#page-cvpa .school__media-cvpa img {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center);
  transition: transform 600ms var(--ease-out);
}
#page-cvpa .school-cvpa:hover .school__media-cvpa img { transform: scale(1.04); }
#page-cvpa .school__media--placeholder-cvpa {
  display: grid; place-items: center; text-align: center;
  border: 2px dashed var(--rule);
  color: var(--text-muted); font-size: 0.9rem; font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase;
}

#page-cvpa .school__body-cvpa {
  display: flex; flex-direction: column; flex: 1;
  padding: clamp(1.1rem, 1.5vw, 1.6rem);
  container-type: inline-size;
}
#page-cvpa .school__name-cvpa {
  margin: 0;
  font-weight: 800;
  /* Sized from the card's width (cqi) so the longest word, "Interdisciplinary"
     (about 9.7em wide), always fits on one line inside its card */
  font-size: clamp(1.1rem, 1.35vw, 1.5rem);
  font-size: min(clamp(1.1rem, 1.35vw, 1.5rem), 9.5cqi);
  overflow-wrap: break-word;
  line-height: 1.02;
  text-transform: uppercase; letter-spacing: 0.02em;
  min-height: 2.04em; /* two lines, so dividers align across cards */
}
#page-cvpa .school__name-cvpa::after {
  content: ""; display: block; width: 2rem; height: 3px; margin-top: 0.7rem;
  background: var(--accent);
}
#page-cvpa .school__programs-cvpa {
  margin: 1.4rem 0 1.25rem; padding: 0; list-style: none;
  color: var(--text-muted); font-size: var(--fs-card); font-weight: 500;
}
#page-cvpa .school__programs-cvpa li {
  display: flex; align-items: baseline; gap: 0.6rem;
  padding: 0.25rem 0; line-height: 1.35;
}
/* cards without a program list: space between the school name and its links */
#page-cvpa .school__name-cvpa + .school__links-cvpa { margin-top: 1.25rem; }
/* no markers in front of the program names */
#page-cvpa .school__programs-cvpa li::before { content: none; display: none; }
#page-cvpa .school__links-cvpa {
  display: flex; flex-direction: column;
  margin-top: auto;
  border-bottom: 1px solid var(--rule);
}
#page-cvpa .school__link-cvpa {
  display: flex; align-items: center; justify-content: space-between; gap: 0.5rem;
  min-height: 44px;
  border-top: 1px solid var(--rule);
  color: var(--white); text-decoration: none;
  font-weight: 800; font-size: calc((1rem) * var(--ds-s));
  letter-spacing: 0.05em; text-transform: uppercase;
  transition: color 200ms;
}
#page-cvpa .school__link-cvpa .icon-cvpa {
  width: 16px; height: 16px; flex: none; color: var(--accent);
  transition: transform 200ms var(--ease-out);
}
#page-cvpa .school__link-cvpa:hover span { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
#page-cvpa .school__link-cvpa:hover .icon-cvpa { transform: translateX(4px); }

/* ---------- Research & creative activity (black, under "create your future") ---------- */
#page-cvpa .research-cvpa {
  background: var(--black); color: var(--white);
  padding: clamp(4.5rem, 9vw, 7rem) var(--gutter);
}
#page-cvpa .research__inner-cvpa { max-width: 96rem; margin: 0 auto; }
/* Heading + intro use the same box as the "create your future" title, so the two headings line up at every width */
#page-cvpa .research__head-cvpa { max-width: calc(90rem - 2 * var(--gutter)); margin: 0 auto; }
#page-cvpa .research__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3rem, 7vw, 6.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .research__title-cvpa span { color: var(--accent); }
#page-cvpa .research__lede-cvpa { max-width: 44rem; margin: 1.25rem 0 0; font-size: var(--fs-lede); line-height: 1.6; color: var(--text-muted); }
/* One card per school; 5 across, wrapping to centred rows like the school cards */
#page-cvpa .research__grid-cvpa {
  --cols: 5; --gap: clamp(0.75rem, 1.2vw, 1.25rem);
  display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .research-card-cvpa {
  display: flex; flex-direction: column; min-width: 0;
  flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  background: var(--surface);
}
#page-cvpa .research-card__media-cvpa { aspect-ratio: 4 / 3; margin: 0; overflow: hidden; background: #1c1c1c; border-bottom: 4px solid var(--accent); }
#page-cvpa .research-card__media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); transition: transform 600ms var(--ease-out); }
#page-cvpa .research-card-cvpa:hover .research-card__media-cvpa img { transform: scale(1.04); }
#page-cvpa .research-card__body-cvpa { display: flex; flex-direction: column; flex: 1; padding: clamp(1.1rem, 1.5vw, 1.5rem); }
#page-cvpa .research-card__school-cvpa {
  align-self: flex-start; padding: 0.4rem 0.75rem; border-radius: 4px;
  background: var(--accent); color: var(--white);
  font-size: 1rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
#page-cvpa .research-card__title-cvpa {
  margin: 0.9rem 0 0;
  font-weight: 800;
  font-size: calc((clamp(1.4rem, 1.6vw, 1.7rem)) * var(--ds-m)); line-height: 1.1;
  text-transform: uppercase; letter-spacing: 0.01em;
}
#page-cvpa .research-card__text-cvpa { margin: 0.6rem 0 0; font-size: var(--fs-card); line-height: 1.5; color: var(--text-muted); }
#page-cvpa .research-card__who-cvpa { margin: auto 0 0; padding-top: 1rem; font-size: var(--fs-small); font-weight: 700; }
#page-cvpa .research__actions-cvpa { justify-content: center; margin-top: clamp(2.5rem, 5vw, 3.5rem); }
/* Black version: red "learn more" text on the dark cards is only 4.05:1, so the text is white (AA) and the arrow stays red */
#page-cvpa .research-cvpa:not(.research--light-cvpa):not(.research--red-cvpa) .card__more-cvpa { color: var(--white); }
#page-cvpa .research-cvpa:not(.research--light-cvpa):not(.research--red-cvpa) .card__more-cvpa .icon-cvpa { color: var(--accent); }

/* ---------- News & Events (card styles shared by both feeds) ---------- */
#page-cvpa .feed-cvpa { padding: clamp(4.5rem, 9vw, 7rem) var(--gutter); }
#page-cvpa .feed__inner-cvpa { max-width: 84rem; margin: 0 auto; }
#page-cvpa .feed__head-cvpa {
  display: flex; align-items: center; gap: clamp(1rem, 3vw, 2.5rem);
  margin: 0 0 clamp(2.5rem, 5vw, 4rem);
}
#page-cvpa .feed__head-cvpa::before, #page-cvpa .feed__head-cvpa::after {
  content: ""; flex: 1; height: 3px; background: var(--accent);
}
#page-cvpa .feed__title-cvpa {
  margin: 0; text-align: center;
  font-weight: 900;
  font-size: calc((clamp(3rem, 6.5vw, 5.75rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .feed__title-cvpa span { color: var(--accent); }
#page-cvpa .feed__grid-cvpa {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.25rem, 2.5vw, 2.5rem);
  margin: 0; padding: 0; list-style: none;
}
#page-cvpa .feed__cta-cvpa { display: flex; justify-content: center; margin-top: clamp(2.5rem, 5vw, 4rem); }

#page-cvpa .card-cvpa { position: relative; display: flex; flex-direction: column; }
#page-cvpa .card__link-cvpa { text-decoration: none; }
#page-cvpa .card__link-cvpa::after { content: ""; position: absolute; inset: 0; z-index: 1; }
#page-cvpa .card__link-cvpa:focus-visible { outline: none; }
#page-cvpa .card-cvpa:has(.card__link-cvpa:focus-visible) { outline: 3px solid var(--focus); outline-offset: 4px; }
#page-cvpa .card__more-cvpa {
  display: inline-flex; align-items: center; gap: 0.45rem;
  margin-top: auto; padding-top: 1.25rem;
  font-weight: 800; font-size: calc((1.05rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent);
}
#page-cvpa .card__more-cvpa .icon-cvpa { width: 16px; height: 16px; transition: transform 200ms var(--ease-out); }
#page-cvpa .card-cvpa:hover .card__more-cvpa .icon-cvpa { transform: translateX(4px); }
#page-cvpa .card__excerpt-cvpa {
  margin: 0.9rem 0 0; font-size: var(--fs-card); line-height: 1.6;
}
#page-cvpa .news-card-cvpa.fade-up-cvpa:nth-child(2), #page-cvpa .event-card-cvpa.fade-up-cvpa:nth-child(3n+2) { transition-delay: 120ms; }
#page-cvpa .news-card-cvpa.fade-up-cvpa:nth-child(3), #page-cvpa .event-card-cvpa.fade-up-cvpa:nth-child(3n) { transition-delay: 240ms; }
#page-cvpa .news-card-cvpa.fade-up-cvpa:nth-child(4) { transition-delay: 360ms; }

/* News: 4 across on desktop */
#page-cvpa .news-cvpa .feed__grid-cvpa { grid-template-columns: repeat(4, 1fr); gap: clamp(1.25rem, 2vw, 2rem); }

/* News - red. All text is solid white (4.65:1 on brand red, AA); red accents switch to white or black */
#page-cvpa .news-cvpa {
  --focus: var(--white);
  background: var(--accent); color: var(--white);
}
#page-cvpa .news-cvpa .feed__head-cvpa::before, #page-cvpa .news-cvpa .feed__head-cvpa::after { background: var(--white); }
#page-cvpa .news-cvpa .feed__title-cvpa span { color: var(--black); }
#page-cvpa .news-cvpa .card__more-cvpa { color: var(--white); }
#page-cvpa .news-cvpa .btn--primary-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .news-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--accent); }
#page-cvpa .news-cvpa .btn--primary-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .news-cvpa .btn--primary-cvpa:hover .icon-cvpa { color: var(--white); }
#page-cvpa .news-card__media-cvpa { aspect-ratio: 3 / 2; margin: 0; overflow: hidden; background: #eee; }
#page-cvpa .news-card__media-cvpa img {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center);
  transition: transform 600ms var(--ease-out);
}
#page-cvpa .news-card-cvpa:hover .news-card__media-cvpa img { transform: scale(1.04); }
#page-cvpa .news-card__body-cvpa { display: flex; flex-direction: column; flex: 1; padding: 1.5rem 0.25rem 0; }
#page-cvpa .card__meta-cvpa {
  font-size: 0.78rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
}
#page-cvpa .news-cvpa .card__meta-cvpa { color: var(--white); }
#page-cvpa .news-card__title-cvpa {
  margin: 0.6rem 0 0;
  font-weight: 800;
  font-size: calc((clamp(1.6rem, 2.1vw, 2rem)) * var(--ds-m)); line-height: 1.05;
  text-transform: uppercase; letter-spacing: 0.01em;
}
/* on red, hover underlines the title instead of turning it red */
#page-cvpa .news-card-cvpa:hover .news-card__title-cvpa { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 4px; }
#page-cvpa .news-cvpa .card__excerpt-cvpa { color: var(--white); }

/* Events - black */
#page-cvpa .events-cvpa { background: var(--black); color: var(--black); }
#page-cvpa .events-cvpa .feed__title-cvpa { color: var(--white); }
#page-cvpa .event-card-cvpa {
  background: var(--white);
  padding: clamp(1.5rem, 2.4vw, 2.25rem);
  border-top: 6px solid var(--accent);
  transition: transform 250ms var(--ease-out);
}
#page-cvpa .event-card-cvpa:hover { transform: translateY(-4px); }
#page-cvpa .event-card-cvpa { --focus: var(--white); }
#page-cvpa .event-card__date-cvpa {
  display: inline-flex; flex-direction: column; align-items: center; align-self: flex-start;
  min-width: 5rem; padding: 0.55rem 0.9rem 0.5rem;
  border: 2px solid var(--accent);
  line-height: 1;
}
#page-cvpa .event-card__month-cvpa { font-weight: 800; font-size: 1.15rem; letter-spacing: 0.08em; color: var(--accent); text-transform: uppercase; }
#page-cvpa .event-card__day-cvpa { font-weight: 900; font-size: 2.9rem; }
#page-cvpa .event-card__school-cvpa {
  align-self: flex-start;
  margin-bottom: 0.9rem; padding: 0.4rem 0.75rem;
  border-radius: 4px;
  background: var(--accent); color: var(--white);
  font-weight: 800; font-size: calc((1.75rem) * var(--ds-m)); line-height: 1.1;
  letter-spacing: 0.08em; text-transform: uppercase;
}
#page-cvpa .event-card__title-cvpa {
  margin: 1.4rem 0 0;
  font-weight: 800;
  font-size: calc((clamp(1.5rem, 1.9vw, 1.8rem)) * var(--ds-m)); line-height: 1.05;
  text-transform: uppercase; letter-spacing: 0.01em;
}
#page-cvpa .event-card-cvpa:hover .event-card__title-cvpa { color: var(--accent); }
#page-cvpa .event-card__info-cvpa {
  display: flex; flex-direction: column; gap: 0.35rem;
  margin: 0.9rem 0 0; padding: 0; list-style: none;
  font-size: var(--fs-card); font-weight: 600; color: #3d3d3d;
}
#page-cvpa .event-card__info-cvpa li { display: flex; align-items: center; gap: 0.5rem; }
#page-cvpa .event-card__info-cvpa .icon-cvpa { width: 16px; height: 16px; flex: none; color: var(--accent); }
#page-cvpa .events-cvpa .card__excerpt-cvpa { color: #3d3d3d; }

/* ---------- People ---------- */
/* White section (red band behind the cards) so the homepage alternates:
   black, white, red, black, red, black, WHITE, black */
#page-cvpa .people-cvpa {
  --band-start: clamp(8rem, 12vw, 11rem);
  --focus: var(--black);
  background: var(--white); color: var(--black);
  padding-top: clamp(4.5rem, 9vw, 7rem);
}
#page-cvpa .people__inner-cvpa { max-width: calc(84rem + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }
#page-cvpa .people__band-cvpa {
  padding: 0 var(--gutter) clamp(3.5rem, 6vw, 5.5rem);
  background: linear-gradient(180deg, transparent 0, transparent var(--band-start), var(--accent) var(--band-start));
}
#page-cvpa .people__head-cvpa {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 1.5rem 2rem; margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
}
#page-cvpa .people__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3rem, 7vw, 6.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .people__title-cvpa span { color: var(--accent); }
#page-cvpa .people__intro-cvpa { max-width: 30rem; margin: 1rem 0 0; font-size: var(--fs-lede); line-height: 1.55; color: #3d3d3d; }

#page-cvpa .filters-cvpa { display: flex; flex-wrap: wrap; gap: 0.5rem; }
#page-cvpa .filter-cvpa {
  min-height: 44px; padding: 0 1.1rem; cursor: pointer;
  background: transparent; color: var(--black);
  border: 2px solid var(--black);
  font-weight: 800; font-size: calc((1.05rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase;
  transition: background-color 200ms, color 200ms;
}
#page-cvpa .filter-cvpa:hover { background: rgba(0, 0, 0, 0.08); }
#page-cvpa .filter-cvpa[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--white); }

#page-cvpa .people__grid-cvpa {
  --cols: 3; --gap: clamp(1.25rem, 2.5vw, 2rem);
  max-width: 84rem; margin: 0 auto; padding: 0; list-style: none;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--gap);
}
#page-cvpa .person-cvpa {
  display: flex; flex-direction: column;
  flex: 0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  background: var(--surface);
  /* the cards stay dark, so their text stays white inside the now-white section */
  color: var(--white); --text-muted: rgba(255, 255, 255, 0.72); --focus: var(--white);
}
#page-cvpa .person-cvpa[hidden] { display: none; }
#page-cvpa .person__media-cvpa { position: relative; aspect-ratio: 1 / 1; margin: 0; overflow: hidden; background: #1c1c1c; }
#page-cvpa .person__media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); }
#page-cvpa .person__tag-cvpa {
  /* rounded badge set just inside the photo's bottom-left corner */
  position: absolute; left: 0.75rem; bottom: 0.75rem;
  padding: 0.45rem 0.9rem; border-radius: 4px;
  background: var(--accent); color: var(--white);
  font-weight: 800; font-size: calc((1rem) * var(--ds-s));
  letter-spacing: 0.1em; text-transform: uppercase;
}
#page-cvpa .person__body-cvpa {
  display: flex; flex-direction: column; flex: 1;
  margin: 0; padding: clamp(1.5rem, 2.2vw, 2rem);
}
/* Attribution first, then the quote */
#page-cvpa .person__who-cvpa { padding-bottom: 1.25rem; }
#page-cvpa .person__who-cvpa::after {
  content: ""; display: block; width: 2.5rem; height: 3px; margin-top: 1rem;
  background: var(--accent);
}
#page-cvpa .person__name-cvpa {
  margin: 0;
  font-weight: 800;
  font-size: calc((1.6rem) * var(--ds-m)); line-height: 1.05; text-transform: uppercase; letter-spacing: 0.02em;
}
#page-cvpa .person__degree-cvpa { margin: 0.35rem 0 0; font-size: var(--fs-card); color: var(--text-muted); font-weight: 500; }
#page-cvpa .person__quote-cvpa {
  margin: 0;
  font-size: var(--fs-body); line-height: 1.55; font-weight: 500;
}
#page-cvpa .person__mark-cvpa { display: block; width: 34px; height: 26px; margin-bottom: 0.75rem; color: var(--accent); }
#page-cvpa .person__quote-cvpa p { margin: 0; }
/* ---------- Connect (Follow / Listen) ---------- */
#page-cvpa .connect-cvpa {
  background: var(--bg);
  padding: clamp(4.5rem, 9vw, 7rem) var(--gutter);
}
#page-cvpa .connect__inner-cvpa {
  max-width: 84rem; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 6vw, 6rem);
}
#page-cvpa .connect__col-cvpa + .connect__col-cvpa {
  border-left: 1px solid var(--rule);
  padding-left: clamp(3rem, 6vw, 6rem);
}
#page-cvpa .connect__title-cvpa {
  margin: 0;
  font-weight: 900;
  font-size: calc((clamp(3rem, 6vw, 5.5rem)) * var(--ds-l)); line-height: 0.9;
}
#page-cvpa .connect__title-cvpa span { color: var(--accent); }
#page-cvpa .connect__intro-cvpa { max-width: 28rem; margin: 1rem 0 2.25rem; color: var(--text-muted); font-size: var(--fs-lede); }

#page-cvpa .socials-cvpa {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.85rem;
  margin: 0; padding: 0; list-style: none;
}
#page-cvpa .social-cvpa {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem;
  aspect-ratio: 1 / 1; min-height: 44px;
  border: 2px solid var(--white); color: var(--white); text-decoration: none;
  font-weight: 800; font-size: calc((0.95rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase;
  transition: background-color 200ms, border-color 200ms, transform 200ms var(--ease-out);
}
#page-cvpa .social-cvpa .icon-cvpa { width: clamp(28px, 3vw, 38px); height: clamp(28px, 3vw, 38px); }
#page-cvpa .social-cvpa:hover { background: var(--accent); border-color: var(--accent); transform: translateY(-3px); }

#page-cvpa .podcasts-cvpa { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
#page-cvpa .podcast-cvpa {
  position: relative;
  display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 1.25rem;
  padding: 1.25rem;
  background: var(--surface);
  transition: background-color 200ms;
}
#page-cvpa .podcast-cvpa:hover { background: #1b1b1b; }
#page-cvpa .podcast-cvpa:has(.card__link-cvpa:focus-visible) { outline: 3px solid var(--focus); outline-offset: 4px; }
#page-cvpa .podcast__icon-cvpa {
  display: grid; place-items: center;
  width: clamp(64px, 6vw, 84px); aspect-ratio: 1 / 1;
  background: var(--accent); color: var(--white);
}
#page-cvpa .podcast__icon-cvpa .icon-cvpa { width: 55%; height: 55%; }
#page-cvpa .podcast__label-cvpa {
  font-size: 0.75rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--text-muted);
}
#page-cvpa .podcast__name-cvpa {
  margin: 0.2rem 0 0;
  font-weight: 800;
  font-size: calc((clamp(1.6rem, 2.2vw, 2rem)) * var(--ds-m)); line-height: 1; text-transform: uppercase;
}
#page-cvpa .podcast__name-cvpa a { color: var(--white); }
#page-cvpa .podcast__desc-cvpa { margin: 0.4rem 0 0; color: var(--text-muted); font-size: var(--fs-card); line-height: 1.45; }
#page-cvpa .podcast__play-cvpa {
  display: inline-flex; align-items: center; gap: 0.4rem; margin-top: 0.6rem;
  font-weight: 800; font-size: calc((1rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--white);
}
#page-cvpa .podcast__play-cvpa .icon-cvpa { width: 14px; height: 14px; color: var(--accent); }

#page-cvpa .person-cvpa.fade-up-cvpa:nth-child(3n+2) { transition-delay: 120ms; }
#page-cvpa .person-cvpa.fade-up-cvpa:nth-child(3n) { transition-delay: 240ms; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  #page-cvpa .col--4-cvpa { left: -3%; width: 36vw; }
  #page-cvpa .col--5-cvpa { left: 35%; width: 32vw; }
  #page-cvpa .col--6-cvpa { left: 69%; width: 34vw; }
  #page-cvpa .hero-cvpa::before {
    background: rgba(0,0,0,0.88);
  }
}
/* Tall, narrow screens (phones, portrait tablets, narrow windows): filling the whole
   screen leaves a big empty area above the text, so start the text at the top and
   let the hero be as tall as its content */
@media (orientation: portrait) {
  #page-cvpa .hero-cvpa { align-items: flex-start; min-height: 0; }
}
@media (max-width: 560px) {
  /* TTU hides the breadcrumb on phones, so the hero needs less top room */
  #page-cvpa .hero-cvpa { padding-top: 2rem; padding-bottom: 4.75rem; }
  #page-cvpa .disciplines-cvpa { flex-direction: row; gap: 0.3rem 1rem; font-size: calc((1.2rem) * var(--ds-s)); }
  #page-cvpa .disciplines-cvpa li + li::before { display: none; }
}
@media (max-width: 1180px) {
  #page-cvpa .find-career__grid-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .schools__grid-cvpa, #page-cvpa .research__grid-cvpa { --cols: 3; }
  #page-cvpa .news-cvpa .feed__grid-cvpa { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 960px) {
  #page-cvpa .schools__grid-cvpa, #page-cvpa .research__grid-cvpa { --cols: 2; }
  #page-cvpa .feed__grid-cvpa { grid-template-columns: 1fr; max-width: 34rem; margin: 0 auto; }
  #page-cvpa .events-cvpa .feed__grid-cvpa, #page-cvpa .news-cvpa .feed__grid-cvpa { grid-template-columns: repeat(2, 1fr); max-width: none; }
  #page-cvpa .people__grid-cvpa { --cols: 2; }
  #page-cvpa .connect__inner-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .connect__col-cvpa + .connect__col-cvpa { border-left: 0; padding-left: 0; border-top: 1px solid var(--rule); padding-top: clamp(3rem, 6vw, 4rem); }
}
@media (max-width: 480px) {
  #page-cvpa .find-career__grid-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .socials-cvpa { grid-template-columns: repeat(2, 1fr); }
  #page-cvpa .social-cvpa { aspect-ratio: 3 / 2; }
  #page-cvpa .podcast-cvpa { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  #page-cvpa .events-cvpa .feed__grid-cvpa, #page-cvpa .news-cvpa .feed__grid-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .people__grid-cvpa { --cols: 1; }
}
@media (max-width: 720px) {
  #page-cvpa .schools__grid-cvpa, #page-cvpa .research__grid-cvpa { --cols: 1; }
  #page-cvpa .feed__head-cvpa::before, #page-cvpa .feed__head-cvpa::after { flex-basis: 1.5rem; }
  #page-cvpa .stats-cvpa { grid-template-columns: 1fr; gap: 0; }
  #page-cvpa .stat-cvpa { padding: 2rem 0; }
  #page-cvpa .stat-cvpa + .stat-cvpa { border-left: 0; border-top: 1px solid var(--rule); }
}

@media (prefers-reduced-motion: reduce) {
  #page-cvpa .track-cvpa { animation-play-state: paused; }
  #page-cvpa .school__media-cvpa img, #page-cvpa .news-card__media-cvpa img, #page-cvpa .event-card-cvpa { transition: none; }
  #page-cvpa .event-card-cvpa:hover { transform: none; }
  #page-cvpa .filter-cvpa, #page-cvpa .social-cvpa, #page-cvpa .podcast-cvpa { transition: none; }
  #page-cvpa .social-cvpa:hover { transform: none; }
}


/* ===========================================================================
   PART 3 - UNDERGRADUATE PROGRAMS PAGE
   Only used by /visual-performing-arts/programs/undergraduate/index.php: sticky filter
   bar, school heading bands, program tiles, no-results message.
   (Its page hero and red closing band are shared - see PART 1.)
   =========================================================================== */

/* ---------- Sticky toolbar ----------
   White, so it reads as its own bar under the dark hero (top of the program list). */
#page-cvpa .toolbar-cvpa {
  --text: var(--black);
  --text-muted: #4a4a4a;
  --rule: rgba(0, 0, 0, 0.14);
  --focus: var(--black);
  /* --sticky-top = height of TTU's header while the template pins it (#nav.is_stuck),
     set by programs-cvpa.js, so the bar sits just below it instead of behind it */
  position: sticky; top: var(--sticky-top, 0px); z-index: 20;
  background: var(--white); color: var(--text);
  border-bottom: 3px solid var(--accent);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  padding: 0.5rem var(--gutter) 0;
}
#page-cvpa .toolbar__inner-cvpa { max-width: 84rem; margin: 0 auto; }

/* School tabs */
#page-cvpa .tabs-cvpa {
  display: flex; gap: clamp(1rem, 2.5vw, 2.25rem);
  border-bottom: 1px solid var(--rule);
  overflow-x: auto; scrollbar-width: none;
}
#page-cvpa .tabs-cvpa::-webkit-scrollbar { display: none; }
#page-cvpa .tab-cvpa {
  flex: none; display: inline-flex; align-items: center; gap: 0.45rem;
  min-height: 56px; padding: 0;
  border-bottom: 4px solid transparent;
  color: var(--text-muted);
  font-weight: 800; font-size: calc((1.2rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap;
  transition: color 200ms, border-color 200ms;
}
#page-cvpa .tab-cvpa:hover { color: var(--black); }
#page-cvpa .tab-cvpa[aria-pressed="true"] { color: var(--black); border-bottom-color: var(--accent); }
#page-cvpa .tab-cvpa:focus-visible { outline-offset: -3px; }
#page-cvpa .tab__count-cvpa {
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0;
  padding: 0.15rem 0.45rem; border-radius: 999px;
  background: #ececec; color: var(--black);
}
#page-cvpa .tab-cvpa[aria-pressed="true"] .tab__count-cvpa { background: var(--accent); color: var(--white); }

/* Type switch + search + count */
#page-cvpa .toolbar__row-cvpa {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem;
  padding: 0.85rem 0;
}
#page-cvpa .types-cvpa { display: flex; border: 2px solid var(--black); }
#page-cvpa .type-cvpa {
  min-height: 40px; padding: 0 0.9rem;
  color: var(--black);
  font-size: 0.9rem; font-weight: 700;
  transition: background-color 200ms;
}
#page-cvpa .type-cvpa + .type-cvpa { border-left: 1px solid rgba(0, 0, 0, 0.3); }
#page-cvpa .type-cvpa:hover { background: #ececec; }
#page-cvpa .type-cvpa[aria-pressed="true"] { background: var(--black); color: var(--white); }
#page-cvpa .type-cvpa:focus-visible { outline-offset: 2px; }

#page-cvpa .search-cvpa { position: relative; flex: 1 1 16rem; max-width: 26rem; }
#page-cvpa .search-cvpa .icon-cvpa {
  position: absolute; left: 0.85rem; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; color: #4a4a4a; pointer-events: none;
}
#page-cvpa .search__input-cvpa {
  width: 100%; min-height: 44px; margin: 0; padding: 0 1rem 0 2.6rem;
  background: var(--white); color: var(--black);
  border: 2px solid #767676; border-radius: 0;
  font: inherit; font-weight: 500; font-size: 1rem; line-height: 1.2;
}
#page-cvpa .search__input-cvpa::placeholder { color: #595959; opacity: 1; }
#page-cvpa .search__input-cvpa:focus { border-color: var(--black); }
#page-cvpa .search__input-cvpa:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
#page-cvpa .toolbar__status-cvpa {
  margin-left: auto;
  font-size: var(--fs-small); font-weight: 600; color: var(--text-muted); white-space: nowrap;
}

/* ---------- Program directory (one white section) ---------- */
#page-cvpa .directory-cvpa {
  --text: var(--black);
  --text-muted: #4a4a4a;
  --rule: rgba(0, 0, 0, 0.14);
  --focus: var(--black);
  background: var(--white); color: var(--text);
  padding: clamp(2.5rem, 5vw, 4rem) var(--gutter) clamp(4rem, 8vw, 6rem);
}
#page-cvpa .area-cvpa {
  max-width: 84rem; margin: 0 auto;
  /* clear the sticky toolbar when jumping to a school */
  scroll-margin-top: 9rem;
}
#page-cvpa .area-cvpa + .area-cvpa { margin-top: clamp(3rem, 6vw, 4.5rem); }

/* School colours: only the brand red, black and white, alternating so neighbouring
   schools always look different. --school fills the heading band and the row markers;
   --school-mark is the contrasting colour used on top of the band. */
#page-cvpa .area--black-cvpa { --school: var(--black); --school-mark: var(--accent); }
#page-cvpa .area--red-cvpa   { --school: var(--accent); --school-mark: var(--black); }

#page-cvpa .area__head-cvpa {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 0.5rem clamp(1rem, 2vw, 1.5rem);
  padding: clamp(1.4rem, 2.5vw, 2rem) clamp(1.25rem, 2.5vw, 2rem);
  background: var(--school); color: var(--white);
  --focus: var(--white);
}
#page-cvpa .area__title-cvpa {
  flex: 1 1 auto; margin: 0;
  font-weight: 900;
  font-size: calc((clamp(2.75rem, 5vw, 4.5rem)) * var(--ds-l)); line-height: 0.95;
}
#page-cvpa .area__title-cvpa span { color: var(--school-mark); }
#page-cvpa .area__link-cvpa {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px;
  color: var(--white); text-decoration: none;
  font-weight: 800; font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  letter-spacing: 0.06em; text-transform: uppercase;
}
#page-cvpa .area__link-cvpa .icon-cvpa { width: 20px; height: 20px; color: var(--white); transition: transform 200ms var(--ease-out); }
#page-cvpa .area__link-cvpa:hover span:first-child { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
#page-cvpa .area__link-cvpa:hover .icon-cvpa { transform: translateX(4px); }
/* Optional short intro under the school's heading band, above the program tiles */
#page-cvpa .area__lede-cvpa {
  max-width: 46rem; margin: clamp(1.25rem, 2.5vw, 1.75rem) 0 0;
  color: var(--text-muted); font-size: var(--fs-lede); font-weight: 400; line-height: 1.55;   /* section-intro size */
}

/* Programs: a grid of tiles - photo on top, program name and degree links underneath.
   At most 4 per row; on narrower screens tiles stay at least 15rem wide, so it
   steps down to 3, 2, then 1 on phones. */
#page-cvpa .programs__grid-cvpa {
  --col-gap: clamp(1.25rem, 2.5vw, 2rem);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, max(15rem, (100% - 3 * var(--col-gap)) / 4)), 1fr));
  gap: clamp(2rem, 3vw, 2.5rem) var(--col-gap);
  margin: clamp(1.5rem, 3vw, 2rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .program-cvpa {
  display: flex; flex-direction: column; gap: 0.8rem;
  min-width: 0;
}
#page-cvpa .program__media-cvpa {
  aspect-ratio: 640 / 380; overflow: hidden; margin: 0 0 0.2rem;
  background: #eee;
  border-bottom: 4px solid var(--school);
}
#page-cvpa .program__media-cvpa img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 600ms var(--ease-out);
}
#page-cvpa .program-cvpa:hover .program__media-cvpa img { transform: scale(1.05); }
#page-cvpa .program__name-cvpa {
  margin: 0;
  hyphens: auto;
  font-weight: 800;
  font-size: calc((1.3rem) * var(--ds-m)); line-height: 1.15;
  text-transform: uppercase; letter-spacing: 0.02em;
  overflow-wrap: break-word;
}
#page-cvpa .credentials-cvpa {
  display: flex; flex-wrap: wrap; gap: 0.5rem;
  margin: 0; padding: 0; list-style: none;
}
#page-cvpa .credential-cvpa {
  display: inline-flex; align-items: center;
  min-height: 40px; padding: 0.35rem 0.8rem;
  border: 2px solid var(--black);
  color: var(--black); text-decoration: none;
  font-size: var(--fs-card); font-weight: 700; line-height: 1.25;
  transition: background-color 150ms, color 150ms, border-color 150ms;
}
#page-cvpa .credential__note-cvpa { font-weight: 500; color: var(--text-muted); transition: color 150ms; }
#page-cvpa .credential-cvpa:hover { background: var(--school); border-color: var(--school); color: var(--white); }
#page-cvpa .credential-cvpa:hover .credential__note-cvpa { color: var(--white); }
/* Instrument pages are info, not programs: quieter dashed outline */
#page-cvpa .credentials-cvpa li[data-type="info"] .credential-cvpa { border-style: dashed; border-color: #767676; font-weight: 600; }

/* ---------- No results ---------- */
#page-cvpa .empty-cvpa {
  display: flex; flex-direction: column; align-items: center; gap: 1.5rem;
  max-width: 84rem; margin: 0 auto; padding: clamp(2rem, 5vw, 4rem) 0;
  text-align: center;
}
#page-cvpa .empty__text-cvpa {
  font-weight: 800;
  font-size: calc((clamp(1.8rem, 3vw, 2.6rem)) * var(--ds-m)); text-transform: uppercase;
}

/* ---------- Responsive ---------- */
@media (max-width: 640px) {
  /* On phones the toolbar scrolls with the page instead of covering a third of the screen */
  #page-cvpa .toolbar-cvpa { position: static; }
  #page-cvpa .types-cvpa { flex: 1 1 100%; }
  #page-cvpa .type-cvpa { flex: 1 1 auto; padding: 0 0.5rem; }
  #page-cvpa .search-cvpa { flex-basis: 100%; max-width: none; }
  #page-cvpa .toolbar__status-cvpa { margin-left: 0; }
  #page-cvpa .area-cvpa { scroll-margin-top: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  #page-cvpa .tab-cvpa, #page-cvpa .type-cvpa, #page-cvpa .credential-cvpa,
  #page-cvpa .credential__note-cvpa, #page-cvpa .area__link-cvpa .icon-cvpa { transition: none; }
  #page-cvpa .area__link-cvpa:hover .icon-cvpa { transform: none; }
  #page-cvpa .program__media-cvpa img { transition: none; }
  #page-cvpa .program-cvpa:hover .program__media-cvpa img { transform: none; }
}


/* ===========================================================================
   PART 4 - PROGRAM PAGE (one degree / area of study)
   Template built in "Claude Build/program page". Uses the shared page hero and
   red call-to-action band from PART 1, plus: sticky "on this page" bar, question
   sections (overview, why TTU, highlights, facilities, production spaces,
   careers, past graduates, faculty, how to apply + advisor). Sections alternate
   white / black.
   =========================================================================== */

/* ---------- Sticky "on this page" bar ----------
   Same look as the programs list filter bar; sits under TTU's pinned header
   (--sticky-top, set by programs-cvpa.js). */
#page-cvpa .jumpnav-cvpa {
  --text: var(--black);
  --text-muted: #4a4a4a;
  --focus: var(--black);
  position: sticky; top: var(--sticky-top, 0px); z-index: 20;
  background: var(--white); color: var(--text);
  border-bottom: 3px solid var(--accent);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  padding: 0 var(--gutter);
}
#page-cvpa .jumpnav__list-cvpa {
  /* spacing sized so 9 links fit across a typical desktop; narrower screens scroll the bar sideways */
  display: flex; gap: clamp(1rem, 1.8vw, 2rem);
  max-width: 84rem; margin: 0 auto; padding: 0; list-style: none;
  overflow-x: auto; scrollbar-width: none;
}
#page-cvpa .jumpnav__list-cvpa::-webkit-scrollbar { display: none; }
#page-cvpa .jumpnav__link-cvpa {
  display: inline-flex; align-items: center;
  min-height: 56px; white-space: nowrap;
  border-bottom: 4px solid transparent;
  color: var(--text-muted); text-decoration: none;
  font-weight: 800; font-size: calc((1.1rem) * var(--ds-s));
  letter-spacing: 0.06em; text-transform: uppercase;
  transition: color 200ms, border-color 200ms;
}
#page-cvpa .jumpnav__link-cvpa:hover { color: var(--black); }
#page-cvpa .jumpnav__link-cvpa[aria-current="true"] { color: var(--black); border-bottom-color: var(--accent); }
#page-cvpa .jumpnav__link-cvpa:focus-visible { outline-offset: -3px; }

/* ---------- Question sections ---------- */
#page-cvpa .q-section-cvpa {
  padding: clamp(4.5rem, 9vw, 7rem) var(--gutter);
  /* clear TTU's pinned header + the jump bar when a link scrolls here */
  scroll-margin-top: 11rem;
}
#page-cvpa .q-section--light-cvpa {
  --text: var(--black); --text-muted: #3d3d3d; --rule: rgba(0, 0, 0, 0.14); --focus: var(--black);
  --card: #f4f4f4;
  background: var(--white); color: var(--text);
}
#page-cvpa .q-section--dark-cvpa { --card: var(--surface); background: var(--black); color: var(--text); }
#page-cvpa .q-inner-cvpa { max-width: 84rem; margin: 0 auto; }

/* Small label naming the topic, then the question as the heading */
#page-cvpa .q-eyebrow-cvpa {
  display: inline-flex; align-items: center; gap: 0.75rem;
  margin: 0 0 1.1rem;
  font-size: clamp(0.95rem, 1.1vw, 1.1rem); font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--text-muted);
}
#page-cvpa .q-eyebrow-cvpa::before { content: ""; width: 3rem; height: 3px; background: var(--accent); }
/* On any red section the red line would blend in, so the eyebrow line turns black */
#page-cvpa :is(.q-section--red-cvpa, .find-career-cvpa, .cta-cvpa, .research--red-cvpa, .people--red-cvpa, .events--red-cvpa, .connect--red-cvpa, .area--red-cvpa, .news-cvpa:not(.news--dark-cvpa)) .q-eyebrow-cvpa::before { background: var(--black); }
#page-cvpa .q-title-cvpa {
  /* Full questions in sentence case, shown as written (no case change since 2026-10-07);
     slightly smaller and wider than the homepage's one-line titles */
  margin: 0; max-width: 34ch;
  text-wrap: balance; /* even line lengths, no one-word last line */
  font-weight: 900;
  font-size: calc((clamp(2.4rem, 4.8vw, 4.6rem)) * var(--ds-l)); line-height: 1;
}
#page-cvpa .q-title-cvpa span { color: var(--accent); }
/* Older pages wrap words such as "I" in .q-keepcase-cvpa; headings are no longer lowercased, so it only keeps the text colour */
#page-cvpa .q-title-cvpa .q-keepcase-cvpa { color: inherit; text-transform: none; }
#page-cvpa .q-lede-cvpa {
  max-width: 44rem; margin: 1.25rem 0 0;
  font-size: var(--fs-lede); line-height: 1.6; color: var(--text-muted);
}
#page-cvpa .q-body-cvpa p { margin: 0 0 1rem; max-width: 40rem; font-size: var(--fs-body); line-height: 1.65; color: var(--text-muted); }
#page-cvpa .q-body-cvpa p:last-child { margin-bottom: 0; }
/* separate paragraphs and list items never run together (global rule, 2026-10-21): each list item gets space like a
   paragraph; lines split with <br> inside one paragraph stay tight */
#page-cvpa .q-body-cvpa :is(ul, ol) { margin: 0 0 1rem; }
#page-cvpa .q-body-cvpa :is(ul, ol):last-child { margin-bottom: 0; }
#page-cvpa .q-body-cvpa :is(ul, ol) > li { max-width: 40rem; font-size: var(--fs-body); line-height: 1.65; color: var(--text-muted); }
#page-cvpa .q-body-cvpa :is(ul, ol) > li + li { margin-top: 0.75rem; }
/* text straight under the question heading (no intro line): the same gap as an intro */
#page-cvpa .q-title-cvpa + .q-body-cvpa { margin-top: 1.25rem; }
/* Program highlights: the text right after the intro continues it, so it uses the intro size (the course cards now come last) */
#page-cvpa :is(#highlights, #classes) .q-lede-cvpa + .q-body-cvpa p { max-width: 44rem; font-size: var(--fs-lede); line-height: 1.6; }
#page-cvpa :is(#highlights, #classes) .q-lede-cvpa + .q-body-cvpa { margin-top: 0.75rem; }

/* Photo with a red bar along the bottom (same as the program tiles) */
#page-cvpa .q-media-cvpa { margin: 0; overflow: hidden; background: #1c1c1c; border-bottom: 4px solid var(--accent); }
#page-cvpa .q-media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); }

/* Field trips (Studio Art B.A., under "What sets us apart"): the next trip in a card with a red edge,
   then recent trips in two columns. Colours follow the section (light or dark). */
#page-cvpa .trips-cvpa { margin-top: clamp(1.25rem, 2.5vw, 1.75rem); }
#page-cvpa .q-title-cvpa + .trips-cvpa { margin-top: clamp(2rem, 4vw, 3rem); }   /* own section: space under the question heading */
#page-cvpa .trip-next-cvpa {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: stretch;
  max-width: 72rem; background: var(--card); border-left: 6px solid var(--accent);
}
#page-cvpa .trip-next__media-cvpa { margin: 0; min-height: 100%; overflow: hidden; }
#page-cvpa .trip-next__media-cvpa img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
#page-cvpa .trip-next__body-cvpa { padding: clamp(1.5rem, 3vw, 2.25rem); }
@media (max-width: 720px) { #page-cvpa .trip-next-cvpa { grid-template-columns: 1fr; } }
#page-cvpa .trip-next-cvpa p { margin: 0.75rem 0 0; font-size: var(--fs-body); line-height: 1.6; color: var(--text-muted); }
#page-cvpa .trip__tag-cvpa { margin: 0 0 0.6rem; font-weight: 800; font-size: 0.8rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); }
#page-cvpa .trip-next-cvpa .trip__tag-cvpa { margin-top: 0; color: var(--text); }
#page-cvpa .trip__title-cvpa { margin: 0; font-weight: 800; font-size: calc((clamp(1.75rem, 2.4vw, 2.2rem)) * var(--ds-m)); line-height: 1.15; }
#page-cvpa .trip__when-cvpa { margin: 0 0 0.4rem; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
#page-cvpa .trip-next-cvpa .trip__when-cvpa { margin: 0.6rem 0 0; }
#page-cvpa .trips__heading-cvpa { margin: clamp(2rem, 4vw, 2.75rem) 0 0; font-weight: 800; font-size: var(--fs-lede); }
#page-cvpa .trips__list-cvpa {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem) clamp(1.5rem, 3vw, 2.5rem);
  margin: 1.25rem 0 0; padding: 0; list-style: none;
}
#page-cvpa .trip-cvpa { margin: 0; padding-top: 1rem; border-top: 1px solid var(--rule); }
#page-cvpa .trip-cvpa::before { content: none; }
#page-cvpa .trip-cvpa .trip__title-cvpa { font-size: calc((clamp(1.45rem, 1.9vw, 1.7rem)) * var(--ds-m)); }
#page-cvpa .trip-cvpa p:not(.trip__when-cvpa) { margin: 0.5rem 0 0; font-size: var(--fs-card); line-height: 1.6; color: var(--text-muted); }
#page-cvpa .trips__more-cvpa { margin: clamp(1.5rem, 3vw, 2rem) 0 0; font-size: var(--fs-body); }
@media (max-width: 720px) { #page-cvpa .trips__list-cvpa { grid-template-columns: 1fr; } }
/* Recent trips in one accordion item (PART 7 accordion): "Recent trips" opens to the two-column trip list */
#page-cvpa .trips__accordion-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }
#page-cvpa .trips__accordion-cvpa .hb-item__body-cvpa > * { max-width: none; }
#page-cvpa .trips__accordion-cvpa .trips__list-cvpa { margin-top: 0; }
#page-cvpa .trips__accordion-cvpa .trip-cvpa .trip__when-cvpa { margin: 0 0 0.4rem; font-size: 0.8rem; line-height: 1.4; }
#page-cvpa .trips__accordion-cvpa .trip-cvpa .trip__title-cvpa { margin: 0; font-size: calc((clamp(1.45rem, 1.9vw, 1.7rem)) * var(--ds-m)); letter-spacing: 0; text-transform: none; line-height: 1.15; }

/* 1. Overview: text beside a photo, then quick facts */
#page-cvpa .overview-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem); align-items: center;
  margin-top: clamp(2rem, 4vw, 3rem);
}
#page-cvpa .overview-cvpa .q-media-cvpa { aspect-ratio: 4 / 3; }
/* all program pages (since 2026-10-14): the heading sits in the text column, so the text starts right
   under it and the photo stands beside both */
#page-cvpa .overview--head-cvpa { margin-top: 0; align-items: start; }   /* photo starts level with the heading, however long the text */
#page-cvpa .overview__text-cvpa .q-body-cvpa { margin-top: clamp(1.75rem, 3.5vw, 2.5rem); }
/* a logo beside the text (overview--logo-cvpa, e.g. Medici Circle): shown whole, no frame, its white background
   blended into the section colour */
#page-cvpa .overview--logo-cvpa { margin-top: 0; }
#page-cvpa .overview--logo-cvpa .q-media-cvpa { aspect-ratio: auto; max-width: 24rem; justify-self: center; background: none; border-bottom: 0; }
#page-cvpa .overview--logo-cvpa .q-media-cvpa img { height: auto; object-fit: contain; mix-blend-mode: multiply; }
#page-cvpa .overview--logo-cvpa .overview__text-cvpa .q-subtitle-cvpa + .q-body-cvpa { margin-top: 1rem; }
@media (max-width: 720px) { #page-cvpa .overview--logo-cvpa .q-media-cvpa { max-width: 14rem; } }
#page-cvpa .facts-cvpa {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem;
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0;
}
#page-cvpa .fact-cvpa { padding-top: 1rem; border-top: 3px solid var(--black); }
#page-cvpa .fact__label-cvpa {
  display: block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted);
}
#page-cvpa .fact__value-cvpa {
  display: block; margin: 0.4rem 0 0;
  font-weight: 800; font-size: calc((1.6rem) * var(--ds-m)); line-height: 1.1;
  text-transform: uppercase;
}

/* 2. Why TTU: three reasons */
#page-cvpa .reasons-cvpa {
  /* 3 or 4 reasons fill one row on desktop */
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: clamp(1rem, 2vw, 1.5rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .reason-cvpa { --pad: clamp(1.5rem, 2.4vw, 2.25rem); background: var(--card); border-top: 6px solid var(--accent); padding: var(--pad); }
/* Optional photo at the top of a card (e.g. composition tracks): runs edge to edge under the red bar */
#page-cvpa .reason__media-cvpa {
  margin: calc(var(--pad) * -1) calc(var(--pad) * -1) 1.25rem;
  aspect-ratio: 16 / 10; overflow: hidden; background: #1c1c1c;
}
#page-cvpa .reason__media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); }
/* five or more cards (music Instruments sections): three per row on wide screens instead of 4 + 2 */
@media (min-width: 900px) { #page-cvpa .reasons--three-cvpa { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* a link line under chips (music Instruments sections: in a card, or under a plain chip list) */
#page-cvpa .reason-cvpa .chips-cvpa + p, #page-cvpa #instruments .chips-cvpa + p { margin-top: 1.5rem; }
#page-cvpa .reason__title-cvpa, #page-cvpa .card__title-cvpa {
  margin: 0;
  font-weight: 800;
  font-size: calc((clamp(1.5rem, 1.9vw, 1.8rem)) * var(--ds-m)); line-height: 1.1;
  text-transform: uppercase; letter-spacing: 0.01em;
}
#page-cvpa .reason-cvpa p, #page-cvpa .hl-card-cvpa p, #page-cvpa .feature__text-cvpa p, #page-cvpa .space__caption-cvpa p {
  margin: 0.75rem 0 0; line-height: 1.6; color: var(--text-muted);
}

/* 3. Highlights: photo cards (class, club, performances) */
#page-cvpa .highlights-cvpa {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .hl-card-cvpa { display: flex; flex-direction: column; }
/* Popular course cards with a black border (courses-panel-cvpa, e.g. art M.A./M.A.E. Classes): each card is a box
   outlined in the section's text colour (black on white or grey, white on black) */
#page-cvpa .courses-panel-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .courses-panel-cvpa .highlights-cvpa { margin-top: 0; }
#page-cvpa .courses-panel-cvpa .hl-card-cvpa { padding: clamp(1.25rem, 2.5vw, 1.75rem); border: 2px solid var(--text); }   /* black on white/grey, white on black sections */
#page-cvpa .hl-card-cvpa .q-media-cvpa { aspect-ratio: 640 / 380; margin-bottom: 1.1rem; }
#page-cvpa .tag-cvpa {
  display: inline-block; align-self: flex-start; margin-bottom: 0.6rem; padding: 0.3rem 0.65rem;
  background: var(--accent); color: var(--white);
  font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
}

/* 4. Facilities: alternating photo / text rows, then technology chips */
#page-cvpa .features-cvpa { display: grid; gap: clamp(2.5rem, 5vw, 4rem); margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .feature-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(1.5rem, 4vw, 4rem); align-items: center;
}
#page-cvpa .feature-cvpa:nth-child(even) .q-media-cvpa { order: 2; }
#page-cvpa .feature-cvpa .q-media-cvpa { aspect-ratio: 16 / 10; }
/* Artwork (exhibition pages, features--art-cvpa): the whole work is shown, never cropped or enlarged past its size */
#page-cvpa .features--art-cvpa .q-media-cvpa { aspect-ratio: auto; display: flex; align-items: center; justify-content: center; }
#page-cvpa .features--art-cvpa .q-media-cvpa img { width: auto; max-width: 100%; height: auto; max-height: 32rem; object-fit: contain; }
/* Artwork in a card grid (highlights--art-cvpa, e.g. previous exhibitions): even frames, the whole work shown inside them */
#page-cvpa .highlights--art-cvpa .q-media-cvpa { aspect-ratio: 4 / 3; }
#page-cvpa .highlights--art-cvpa .q-media-cvpa img { object-fit: contain; }
#page-cvpa .highlights--art-cvpa .hl-card-cvpa p { margin: 0.25rem 0 0; }
#page-cvpa .highlights--art-cvpa .hl-card-cvpa p:last-child:has(> a) { margin-top: 0.6rem; }
#page-cvpa .chips-cvpa { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .chips__label-cvpa { flex: 1 1 100%; margin-bottom: 0.25rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
#page-cvpa .chip-cvpa {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0.35rem 0.85rem;
  border: 2px solid currentColor; font-size: var(--fs-card); font-weight: 700;
}

/* 5. Production spaces: photo gallery, first photo large */
#page-cvpa .spaces-cvpa {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .space-cvpa { display: flex; flex-direction: column; }
#page-cvpa .space-cvpa .q-media-cvpa { aspect-ratio: 4 / 3; }
#page-cvpa .space-cvpa:first-child { grid-column: span 2; grid-row: span 2; }
#page-cvpa .space-cvpa:first-child .q-media-cvpa { aspect-ratio: auto; flex: 1; min-height: 18rem; }
#page-cvpa .space__caption-cvpa { padding-top: 0.9rem; }
#page-cvpa .space__caption-cvpa p { margin-top: 0.35rem; font-size: var(--fs-card); }

/* 6. Careers: job titles in a grid, then where graduates work */
#page-cvpa .careers-cvpa {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .career-cvpa {
  padding: 1rem 0 1rem 1rem; border-bottom: 1px solid var(--rule); border-left: 3px solid var(--accent);
  font-weight: 800; font-size: calc((1.3rem) * var(--ds-m)); line-height: 1.15;
  text-transform: uppercase; letter-spacing: 0.02em;
}
#page-cvpa .career-cvpa + .career-cvpa { margin-top: 0; }
#page-cvpa .employers-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .employers__title-cvpa {
  margin: 0; font-weight: 800;
  font-size: calc((clamp(1.6rem, 2.2vw, 2rem)) * var(--ds-m)); text-transform: uppercase;
}

/* Photo carousel (program highlights). A sideways-scrolling strip with snap points;
   programs-cvpa.js adds previous/next buttons and a "1 / 6" counter. No autoplay. */
#page-cvpa .carousel-cvpa { margin-top: 1.25rem; }
#page-cvpa .carousel__track-cvpa {
  position: relative; /* slides measure their offsets from the track */
  display: flex; gap: clamp(0.75rem, 1.5vw, 1.25rem);
  margin: 0; padding: 0 0 0.75rem; list-style: none;
  overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: thin; scrollbar-color: var(--accent) transparent;
}
#page-cvpa .carousel__track-cvpa:focus-visible { outline-offset: 4px; }
#page-cvpa .carousel__slide-cvpa { flex: 0 0 min(85%, 52rem); scroll-snap-align: start; }
#page-cvpa .carousel__figure-cvpa { margin: 0; }
#page-cvpa .carousel__figure-cvpa img {
  width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: var(--pos, center);
  border-bottom: 4px solid var(--accent); background: #1c1c1c;
}
#page-cvpa .carousel__caption-cvpa { margin-top: 0.7rem; font-size: var(--fs-card); font-weight: 600; color: var(--text-muted); }
#page-cvpa .carousel__controls-cvpa { display: flex; align-items: center; gap: 1rem; margin-top: 1rem; }
#page-cvpa .carousel__btn-cvpa {
  display: grid; place-items: center; width: 48px; height: 48px;
  background: var(--white); color: var(--black); border: 2px solid var(--black);
  transition: background-color 200ms, color 200ms;
}
#page-cvpa .carousel__btn-cvpa .icon-cvpa { width: 18px; height: 18px; }
#page-cvpa .carousel__btn--prev-cvpa .icon-cvpa { transform: rotate(180deg); }
#page-cvpa .carousel__btn-cvpa:hover:not(:disabled) { background: var(--black); color: var(--white); }
#page-cvpa .carousel__btn-cvpa:disabled { opacity: 0.35; cursor: default; }
#page-cvpa .carousel__count-cvpa { min-width: 4ch; font-size: var(--fs-small); font-weight: 700; font-variant-numeric: tabular-nums; }

/* Underlined text link inside body copy */
#page-cvpa .text-link-cvpa {
  color: inherit; font-weight: 700;
  text-decoration: underline; text-decoration-color: var(--accent);
  text-decoration-thickness: 2px; text-underline-offset: 4px;
}
#page-cvpa .text-link-cvpa:hover { color: var(--accent); }
#page-cvpa .q-section--dark-cvpa .text-link-cvpa:hover { color: var(--white); text-decoration-color: var(--white); }

/* Sub-heading inside a section (e.g. "Upper-level courses at Texas Tech") */
#page-cvpa .q-subtitle-cvpa {
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0;
  font-weight: 800;
  font-size: calc((clamp(1.6rem, 2.2vw, 2rem)) * var(--ds-m)); line-height: 1.1; text-transform: uppercase;
}
#page-cvpa .q-subtitle-cvpa + .chips-cvpa { margin-top: 1rem; }
/* text under a small heading (h3) gets room to breathe (global rule, 2026-10-21) */
#page-cvpa .q-subtitle-cvpa + :is(.q-body-cvpa, .q-lede-cvpa) { margin-top: 1rem; }
/* Extra breathing room when a sub-heading follows the quick facts (e.g. "Composition tracks") */
#page-cvpa .facts-cvpa + .q-subtitle-cvpa { margin-top: clamp(4.5rem, 9vw, 7rem); }
/* "Find a career" band reused on program pages (careers list only, no school buttons) */
#page-cvpa .q-section-cvpa ~ .find-career-cvpa { scroll-margin-top: 11rem; }
#page-cvpa .find-career__lede-cvpa + .find-career__lede-cvpa { margin-top: 0.75rem; }
#page-cvpa ul.find-career__lede-cvpa { list-style: disc; padding-left: 1.25rem; }
#page-cvpa ul.find-career__lede-cvpa li + li { margin-top: 0.4rem; }
/* Program pages: Find a career heading set like an ordinary section (eyebrow, question H2, q-lede intro); black accents on red */
#page-cvpa .find-career-cvpa .q-title-cvpa span { color: var(--black); }
#page-cvpa .find-career-cvpa .q-title-cvpa .q-keepcase-cvpa { color: inherit; }
#page-cvpa ul.q-lede-cvpa { list-style: disc; padding-left: 1.25rem; }
/* an intro of several paragraphs or a list: same size and colour as the first, a little space between */
#page-cvpa .q-lede-cvpa + .q-lede-cvpa { margin-top: 0.75rem; }
#page-cvpa ul.q-lede-cvpa li + li { margin-top: 0.4rem; }
/* Art program pages: lists in the Classes section (4-year plan / checklist links, course lists) show bullets */
#page-cvpa #classes .q-body-cvpa ul { list-style: disc; padding-left: 1.25rem; margin-bottom: 1.25rem; }
#page-cvpa #classes .q-body-cvpa ul:last-child { margin-bottom: 0; }
#page-cvpa #classes .q-body-cvpa:has(> ul:last-child) + .q-body-cvpa { margin-top: 1.25rem; }
#page-cvpa #classes .q-body-cvpa ul li { display: list-item; }
#page-cvpa #classes .q-body-cvpa ul li + li { margin-top: 0.4rem; }
/* Small heading inside running text (e.g. "Online catalog information" above several catalog links) */
#page-cvpa .q-body-cvpa h3 {
  margin: 2rem 0 0.5rem;
  font-weight: 800; font-size: 1.25rem; line-height: 1.25;
}
#page-cvpa .q-body-cvpa h3:first-child { margin-top: 0; }

/* 7. Past graduates: featured graduate cards (photo, name, quote) + notable alumni list */
#page-cvpa .grads-cvpa {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
/* graduate cards: one column on small screens, two across from 900px (like the acting page) */
#page-cvpa .grads-cvpa { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { #page-cvpa .grads-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
#page-cvpa .q-subtitle-cvpa + .grads-cvpa { margin-top: 1.25rem; } /* cards grouped under a small heading */
#page-cvpa .grads-cvpa + .q-subtitle-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .grad-cvpa { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1.25rem; align-items: start; background: var(--card); padding: 1.25rem; border-top: 6px solid var(--accent); }
/* Grey stand-in until a real graduate photo is added */
#page-cvpa .photo-ph-cvpa {
  display: grid; place-items: center; aspect-ratio: 1 / 1;
  background: #e2e2e2; border: 2px dashed #8a8a8a; color: #4a4a4a;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; text-align: center;
}
#page-cvpa .grad__name-cvpa { margin: 0; font-weight: 800; font-size: calc((1.5rem) * var(--ds-m)); line-height: 1.1; text-transform: uppercase; }
#page-cvpa .grad__meta-cvpa { margin: 0.3rem 0 0; font-size: var(--fs-small); font-weight: 600; color: var(--text-muted); }
#page-cvpa .grad__quote-cvpa { margin: 0.75rem 0 0; font-size: var(--fs-body); line-height: 1.55; }
#page-cvpa .alumni-cvpa {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: 0 clamp(1.25rem, 2.5vw, 2rem);
  margin: 1rem 0 0; padding: 0; list-style: none;
}
#page-cvpa .alum-cvpa { padding: 0.9rem 0; border-bottom: 1px solid var(--rule); }
#page-cvpa .alum__name-cvpa { display: block; font-weight: 800; font-size: calc((1.3rem) * var(--ds-m)); text-transform: uppercase; }
#page-cvpa .alum__role-cvpa { display: block; margin-top: 0.15rem; font-size: var(--fs-card); color: var(--text-muted); }

/* 8. Faculty: compact cards (headshot beside name + title), each linking to the
   faculty profile. Three per row on desktop, so any number of faculty lays out evenly. */
#page-cvpa .faculty-cvpa {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
/* Contact us with more than one person: small photo cards like the faculty cards, plus an email link
   (one person uses the advisor-cvpa Questions box instead) */
#page-cvpa .contact-cards-cvpa {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: clamp(1.25rem, 2.5vw, 2rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .contact-card-cvpa { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 1.1rem; align-items: center; margin: 0; padding: 1rem; background: var(--card); }
#page-cvpa .contact-card__photo-cvpa { margin: 0; aspect-ratio: 5 / 6; overflow: hidden; }
#page-cvpa .contact-card__photo-cvpa img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
#page-cvpa .contact-card__name-cvpa { margin: 0; font-weight: 800; font-size: clamp(1.3rem, 1.7vw, 1.5rem); line-height: 1.25; }
#page-cvpa .contact-card__role-cvpa { margin: 0.35rem 0 0; font-weight: 600; font-size: var(--fs-body); color: var(--text-muted); }
#page-cvpa .contact-card__email-cvpa { margin: 0.5rem 0 0; font-size: var(--fs-body); overflow-wrap: anywhere; }
#page-cvpa .person-link-cvpa {
  display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 1.1rem; align-items: center;
  height: 100%; padding: 1rem; background: var(--card);
  color: inherit; text-decoration: none;
}
#page-cvpa .person-link-cvpa .q-media-cvpa { aspect-ratio: 5 / 6; }
#page-cvpa .person-link-cvpa .q-media-cvpa img { object-position: 50% 20%; transition: transform 600ms var(--ease-out); }
#page-cvpa .person-link-cvpa:hover .q-media-cvpa img { transform: scale(1.04); }
#page-cvpa .person__title-cvpa { margin: 0.4rem 0 0; font-size: var(--fs-card); line-height: 1.45; color: var(--text-muted); }
/* TTU's template underlines text inside links; no line under the name or title on faculty / advisory cards */
#page-cvpa .person-link-cvpa .card__title-cvpa, #page-cvpa .person-link-cvpa .person__title-cvpa { text-decoration: none; }
#page-cvpa .person-link-cvpa:hover .card__title-cvpa { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* 9. How to apply: numbered steps + audition requirements, advisor card */
#page-cvpa .apply-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: start;
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
}
#page-cvpa .steps-cvpa { margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none; counter-reset: step; } /* same gap under the question as the facts block */
#page-cvpa .step-cvpa {
  position: relative; counter-increment: step;
  padding: 0 0 1.75rem 4rem; min-height: 3rem;
}
#page-cvpa .step-cvpa::before {
  content: counter(step); position: absolute; left: 0; top: 0;
  display: grid; place-items: center; width: 2.75rem; height: 2.75rem;
  background: var(--accent); color: var(--white);
  font-weight: 900; font-size: 1.3rem;
}
#page-cvpa .step-cvpa:not(:last-child)::after {
  content: ""; position: absolute; left: calc(1.375rem - 1px); top: 3rem; bottom: 0.4rem; width: 2px; background: var(--rule);
}
#page-cvpa .step-cvpa p { margin: 0.4rem 0 0; line-height: 1.6; color: var(--text-muted); }
#page-cvpa .audition-cvpa { background: var(--card); border-top: 6px solid var(--accent); padding: clamp(1.5rem, 2.4vw, 2.25rem); }
#page-cvpa .audition-cvpa p, #page-cvpa .audition-cvpa li { line-height: 1.6; color: var(--text-muted); }
#page-cvpa .audition-cvpa p { margin: 0.75rem 0 0; }
#page-cvpa .audition__list-cvpa { margin: 0.75rem 0 0; padding: 0; list-style: none; }
#page-cvpa .audition__list-cvpa li { padding: 0.6rem 0; border-top: 1px solid var(--rule); }
#page-cvpa .audition__list-cvpa strong { color: var(--text); }
/* Questions section (black, its own section after "how do I apply"): centred advisor block. Portrait with a red bracket behind it;
   heading with a red question mark, a short red bar, name, title and a
   red button; a large outlined question mark sits behind the text.
   --gap = the even space between the photo and the bracket (left and below); --w = bar thickness. */
#page-cvpa .advisor-cvpa {
  --w: clamp(10px, 1vw, 15px); --gap: calc(clamp(2rem, 4.5vw, 4.25rem) - var(--w));
  position: relative; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 21rem) minmax(0, 1fr); align-items: center;
  gap: clamp(2.5rem, 6vw, 5.5rem);
  max-width: 62rem; margin: 0 auto;
  padding: 0 0 calc(var(--gap) + var(--w)) calc(var(--gap) + var(--w));
}
#page-cvpa .advisor__photo-cvpa { position: relative; isolation: isolate; }
#page-cvpa .advisor__photo-cvpa::before {
  /* Red bracket: left and bottom bars, a short tick at the top and an upturned end at the bottom right.
     Both bars sit the same distance (--gap) from the photo. */
  content: ""; position: absolute; z-index: -1;
  top: 9%; right: 16%;
  bottom: calc(-1 * (var(--gap) + var(--w))); left: calc(-1 * (var(--gap) + var(--w)));
  background:
    linear-gradient(var(--accent), var(--accent)) left top / var(--w) 100% no-repeat,
    linear-gradient(var(--accent), var(--accent)) left bottom / 100% var(--w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) left top / calc(var(--w) * 3.5) var(--w) no-repeat,
    linear-gradient(var(--accent), var(--accent)) right bottom / var(--w) calc(var(--w) * 2.2) no-repeat;
}
#page-cvpa .advisor__photo-cvpa img, #page-cvpa .advisor__photo-cvpa .photo-ph-cvpa {
  display: block; width: 100%; height: auto; aspect-ratio: 5 / 6;
}
#page-cvpa .advisor__photo-cvpa img { object-fit: cover; object-position: 50% 20%; }
#page-cvpa .advisor__title-cvpa {
  margin: 0; font-weight: 900; line-height: 1;
  font-size: calc((clamp(3rem, 6.5vw, 6rem)) * var(--ds-l));
}
#page-cvpa .advisor__title-cvpa span { color: var(--accent); }
#page-cvpa .advisor__details-cvpa { margin-top: clamp(1.5rem, 3vw, 2.25rem); }
#page-cvpa .advisor__details-cvpa::before {
  content: ""; display: block; width: 3.5rem; height: 6px; margin-bottom: clamp(1.25rem, 2.5vw, 1.75rem);
  background: var(--accent);
}
#page-cvpa .advisor__name-cvpa {
  margin: 0; font-weight: 800; letter-spacing: 0.04em; line-height: 1.1; text-transform: uppercase;
  font-size: calc((clamp(1.6rem, 2.4vw, 2.2rem)) * var(--ds-m));
}
#page-cvpa .advisor__role-cvpa { margin: 0.5rem 0 0; font-size: var(--fs-body); line-height: 1.5; color: var(--text-muted); }
/* Global rule (user, 2026-10-21): people text is the same size everywhere (faculty cards, Questions box, contact
   cards): the name clamp(1.3rem, 1.7vw, 1.5rem), a little larger than the title and email at the body size */
#page-cvpa .advisor__name-cvpa,
#page-cvpa .person-link-cvpa .card__title-cvpa { font-size: clamp(1.3rem, 1.7vw, 1.5rem); line-height: 1.25; }
#page-cvpa .person__title-cvpa { font-size: var(--fs-body); }
#page-cvpa .advisor__btn-cvpa { margin-top: clamp(1.5rem, 3vw, 2rem); }
/* Large outlined question mark behind the text (decorative) */
#page-cvpa .advisor__mark-cvpa {
  position: absolute; z-index: -1; right: calc(-1 * clamp(0rem, 4vw, 4rem)); top: 50%; transform: translateY(-55%);
  font-weight: 900; line-height: 1; font-size: clamp(14rem, 30vw, 26rem);
  /* Stroke painted under a black fill: only the outer outline shows, even with fonts whose
     letter shapes overlap inside (TTU's font drew extra inner lines with a plain outline) */
  color: var(--black); -webkit-text-stroke: clamp(4px, 0.5vw, 6px) var(--accent); paint-order: stroke fill;
  opacity: 0.5; pointer-events: none; user-select: none;
}
@supports not (-webkit-text-stroke: 1px red) {
  #page-cvpa .advisor__mark-cvpa { display: none; }
}
@media (max-width: 900px) {
  #page-cvpa .advisor-cvpa { grid-template-columns: 1fr; max-width: 30rem; }
  #page-cvpa .advisor__photo-cvpa { max-width: 18rem; }
  #page-cvpa .advisor__mark-cvpa { display: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  #page-cvpa .careers-cvpa { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #page-cvpa .facts-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  #page-cvpa .overview-cvpa, #page-cvpa .feature-cvpa, #page-cvpa .apply-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .feature-cvpa:nth-child(even) .q-media-cvpa { order: 0; }
  #page-cvpa .reasons-cvpa, #page-cvpa .highlights-cvpa { grid-template-columns: 1fr; max-width: 40rem; }
  #page-cvpa .spaces-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .space-cvpa:first-child { grid-column: span 2; grid-row: auto; }
  #page-cvpa .space-cvpa:first-child .q-media-cvpa { aspect-ratio: 16 / 10; min-height: 0; }
  #page-cvpa .careers-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .q-section-cvpa { scroll-margin-top: 8rem; }
}
@media (max-width: 560px) {
  #page-cvpa .spaces-cvpa, #page-cvpa .careers-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .space-cvpa:first-child { grid-column: auto; }
  #page-cvpa .grad-cvpa { grid-template-columns: 5.5rem minmax(0, 1fr); }
  /* keep longer eyebrows ("Facilities & technologies") on one line */
  #page-cvpa .q-eyebrow-cvpa { gap: 0.6rem; letter-spacing: 0.1em; }
  #page-cvpa .q-eyebrow-cvpa::before { width: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  #page-cvpa .jumpnav__link-cvpa { transition: none; }
  #page-cvpa .carousel__track-cvpa { scroll-behavior: auto; }
  #page-cvpa .carousel__btn-cvpa { transition: none; }
  #page-cvpa .person-link-cvpa .q-media-cvpa img { transition: none; }
  #page-cvpa .person-link-cvpa:hover .q-media-cvpa img { transform: none; }
}

/* ===========================================================================
   PART 5 - SCHOOL HOMEPAGES (Art, Music, Theatre & Dance, Interdisciplinary Arts)
   Each school homepage is built from the PART 2 homepage sections (hero, who we are, find a career,
   program cards, studio cards, news, follow us). Only the extras live here:
   the jump target for "Explore programs", a white version of the studio cards
   (summer camps & outreach) and the contact block in "visit us".
   =========================================================================== */

/* Hero name block on school homepages: Texas Tech University / the college / the school (three lines) */
#page-cvpa .college__parent-cvpa {
  display: inline-flex; align-items: center; gap: 0.75rem;
  font-weight: 700; font-size: clamp(0.82rem, 1vw, 0.95rem); line-height: 1.3;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--white);
}

/* "Explore programs" in the hero jumps to the program cards; clear TTU's pinned header */
#page-cvpa .art-anchor-cvpa { scroll-margin-top: 8rem; }

/* Studio cards on white (summer camps & outreach): light colours, 3 cards across */
#page-cvpa .research--light-cvpa {
  --text: var(--black); --text-muted: #3d3d3d; --rule: rgba(0, 0, 0, 0.14); --focus: var(--black);
  --surface: #f4f4f4;
  background: var(--white); color: var(--text);
}
#page-cvpa .research--light-cvpa .research__grid-cvpa { --cols: 3; }

/* Clickable cards (studios, outreach): the whole card is the link, so lift the image on hover */
#page-cvpa .research-card-cvpa.card-cvpa .research-card__title-cvpa a { color: inherit; }
#page-cvpa .research-card-cvpa.card-cvpa:hover .research-card__title-cvpa a {
  text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px;
}

/* "Visit us": address, phone and email rows with red icons */
#page-cvpa .contact-cvpa { margin: clamp(1.5rem, 3vw, 2rem) 0 0; font-style: normal; }
#page-cvpa .contact__row-cvpa {
  display: flex; align-items: flex-start; gap: 0.9rem;
  margin: 0; padding: 0.85rem 0; border-top: 1px solid var(--rule);
  font-size: var(--fs-body); line-height: 1.5;
}
#page-cvpa .contact__row-cvpa:last-child { border-bottom: 1px solid var(--rule); }
#page-cvpa .contact__row-cvpa .icon-cvpa { width: 1.15em; height: 1.15em; margin-top: 0.2em; color: var(--accent); }
#page-cvpa .contact-cvpa .text-link-cvpa:hover { color: var(--white); text-decoration-color: var(--white); }

@media (max-width: 1080px) {
  #page-cvpa .research--light-cvpa .research__grid-cvpa { --cols: 2; }
}
@media (max-width: 720px) {
  #page-cvpa .research--light-cvpa .research__grid-cvpa { --cols: 1; }
}

/* Round headshots in studio-style cards (Interdisciplinary Arts doctoral spotlight) */
#page-cvpa .research-card__media--portrait-cvpa {
  display: grid; place-items: center; padding: clamp(1.25rem, 2vw, 1.75rem);
  background: var(--surface);
}
#page-cvpa .research-card__media--portrait-cvpa img {
  width: min(70%, 11rem); height: auto; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 50%;
}
#page-cvpa .research-card-cvpa:hover .research-card__media--portrait-cvpa img { transform: none; }

/* Four cards across (Interdisciplinary Arts graduate certificates) */
#page-cvpa .research__grid--four-cvpa { --cols: 4; }
#page-cvpa .research--light-cvpa .research__grid--four-cvpa { --cols: 4; }
@media (max-width: 1180px) {
  #page-cvpa .research__grid--four-cvpa, #page-cvpa .research--light-cvpa .research__grid--four-cvpa { --cols: 2; }
}
@media (max-width: 720px) {
  #page-cvpa .research__grid--four-cvpa, #page-cvpa .research--light-cvpa .research__grid--four-cvpa { --cols: 1; }
}

/* Five cards across on white (college homepage outreach: one program per area) */
#page-cvpa .research--light-cvpa .research__grid--five-cvpa { --cols: 5; }
@media (max-width: 1180px) {
  #page-cvpa .research--light-cvpa .research__grid--five-cvpa { --cols: 3; }
}
@media (max-width: 960px) {
  #page-cvpa .research--light-cvpa .research__grid--five-cvpa { --cols: 2; }
}
@media (max-width: 720px) {
  #page-cvpa .research--light-cvpa .research__grid--five-cvpa { --cols: 1; }
}


/* Season posters (Theatre & Dance): white section with a red band behind the lower part of the
   show cards (the same band idea as "explore programs" and "our people"). Card text sits on
   white panels; the buttons sit on the red band, so they use the white versions. */
#page-cvpa .season-cvpa {
  --band-start: clamp(5rem, 9vw, 8rem);
  --focus: var(--black);
  background: var(--white); color: var(--black);
  padding-top: clamp(4.5rem, 9vw, 7rem);
}
#page-cvpa .season__inner-cvpa { max-width: 84rem; margin: 0 auto; padding: 0 var(--gutter); }
#page-cvpa .season__band-cvpa {
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
  padding-bottom: clamp(3.5rem, 6vw, 5.5rem);
  background: linear-gradient(180deg, transparent 0, transparent var(--band-start), var(--accent) var(--band-start));
}
/* Heading uses the news/events style (centered between two red rules); the intro sits centered under it */
#page-cvpa .season__lede-cvpa { max-width: 46rem; margin: calc(-1 * clamp(1rem, 2.5vw, 2rem)) auto 0; text-align: center; font-size: var(--fs-lede); line-height: 1.6; color: #3d3d3d; }
#page-cvpa .season__lede-cvpa .icon-mappin-cvpa { width: 1.1em; height: 1.1em; margin-right: 0.3em; vertical-align: -0.18em; color: var(--accent); }
#page-cvpa .season__grid-cvpa {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 2.5rem);
  margin: 0; padding: 0; list-style: none;
}
#page-cvpa .show-cvpa { --focus: var(--black); display: flex; flex-direction: column; background: var(--white); border: 1px solid rgba(0, 0, 0, 0.14); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12); }
#page-cvpa .show__art-cvpa { aspect-ratio: 16 / 9; margin: 0; overflow: hidden; background: var(--black); border-bottom: 4px solid var(--accent); }
#page-cvpa .show__art-cvpa img { width: 100%; height: 100%; object-fit: cover; transition: transform 600ms var(--ease-out); }
#page-cvpa .show-cvpa:hover .show__art-cvpa img { transform: scale(1.04); }
#page-cvpa .show__body-cvpa { display: flex; flex-direction: column; flex: 1; padding: clamp(1.25rem, 2vw, 1.75rem); }
#page-cvpa .show__title-cvpa { margin: 0; font-weight: 600; line-height: 1.15; font-size: calc((clamp(1.7rem, 2.1vw, 2.1rem)) * var(--ds-m)); }
#page-cvpa .show__title-cvpa a {
  color: inherit; text-decoration: underline; text-decoration-color: var(--accent);
  text-decoration-thickness: 2px; text-underline-offset: 5px;
}
#page-cvpa .show__title-cvpa a:hover { color: var(--accent); }
#page-cvpa .show__dates-cvpa { margin: 0.9rem 0 0; font-size: var(--fs-body); font-weight: 800; }
#page-cvpa .show__credit-cvpa { margin: 0.3rem 0 0; font-size: var(--fs-card); line-height: 1.45; color: #3d3d3d; }
#page-cvpa .show__links-cvpa { display: flex; flex-wrap: wrap; gap: 0 1.5rem; margin-top: auto; padding-top: 1rem; }
#page-cvpa .show__links-cvpa a {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--black); font-weight: 700; font-size: 0.92rem; letter-spacing: 0.06em; text-transform: uppercase;
  text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 4px;
}
#page-cvpa .show__links-cvpa a:hover { color: var(--accent); }
#page-cvpa .season__actions-cvpa { justify-content: center; margin-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .season__band-cvpa { --focus: var(--white); }
#page-cvpa .season__band-cvpa .btn--primary-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .season__band-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--accent); }
#page-cvpa .season__band-cvpa .btn--primary-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .season__band-cvpa .btn--primary-cvpa:hover .icon-cvpa { color: var(--white); }
@media (max-width: 960px) {
  #page-cvpa .season__lede-cvpa .icon-mappin-cvpa { width: 1.1em; height: 1.1em; margin-right: 0.3em; vertical-align: -0.18em; color: var(--accent); }
#page-cvpa .season__grid-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  #page-cvpa .season__lede-cvpa .icon-mappin-cvpa { width: 1.1em; height: 1.1em; margin-right: 0.3em; vertical-align: -0.18em; color: var(--accent); }
#page-cvpa .season__grid-cvpa { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  #page-cvpa .show__art-cvpa img { transition: none; }
  #page-cvpa .show-cvpa:hover .show__art-cvpa img { transform: none; }
}

/* ---------- Studios & galleries (a list, so it looks different from the research cards) ----------
   Heading, intro and buttons stay in a sticky column on the left; on the right each studio or gallery is
   one row (wide photo, tag, name with arrow, text). The whole row is the link. */
#page-cvpa .studios__inner-cvpa {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start;
  max-width: calc(90rem - 2 * var(--gutter));
}
#page-cvpa .studios__head-cvpa { position: sticky; top: calc(var(--sticky-top, 0px) + 2rem); }
#page-cvpa .studios__actions-cvpa { justify-content: flex-start; margin-top: clamp(1.75rem, 3vw, 2.25rem); }
#page-cvpa .studios__list-cvpa { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
#page-cvpa .studio-cvpa { border-bottom: 1px solid var(--rule); }
#page-cvpa .studio__link-cvpa {
  display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: clamp(1.25rem, 2.5vw, 2rem); align-items: center;
  padding: clamp(1.25rem, 2.5vw, 1.75rem) 0; color: inherit; text-decoration: none;
}
#page-cvpa .studio__link-cvpa:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
#page-cvpa .studio__media-cvpa { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; }
#page-cvpa .studio__media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); transition: transform 600ms var(--ease-out); }
#page-cvpa .studio__link-cvpa:hover .studio__media-cvpa img { transform: scale(1.05); }
#page-cvpa .studio__tag-cvpa { display: block; font-size: 0.78rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent); }
#page-cvpa .studio__title-cvpa {
  display: flex; align-items: center; gap: 0.6rem; margin: 0.35rem 0 0;
  font-weight: 900; font-size: calc((clamp(1.6rem, 2.2vw, 2.1rem)) * var(--ds-m)); line-height: 1.3; text-transform: none;
}
#page-cvpa .studio__title-cvpa .icon-arrow-cvpa { flex: none; width: 1.1rem; height: 1.1rem; color: var(--accent); transition: transform 200ms var(--ease-out); }
#page-cvpa .studio__text-cvpa { margin: 0.5rem 0 0; font-size: var(--fs-card); line-height: 1.55; color: var(--text-muted); }
/* TTU's template underlines text inside links: only the red line on the name on hover */
#page-cvpa .studio__title-cvpa, #page-cvpa .studio__text-cvpa, #page-cvpa .studio__tag-cvpa { text-decoration: none; }
#page-cvpa .studio__link-cvpa:hover .studio__title-cvpa { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 5px; }
#page-cvpa .studio__link-cvpa:hover .icon-arrow-cvpa { transform: translateX(4px); }
/* On red (e.g. Theatre & Dance performance spaces): red tag and arrows would vanish, so text, tags, arrows and the
   hover line are white (white on brand red is 4.65:1, AA) */
#page-cvpa .research--red-cvpa.studios-cvpa { --rule: rgba(255, 255, 255, 0.45); --focus: var(--white); }
#page-cvpa .research--red-cvpa .studio__tag-cvpa, #page-cvpa .research--red-cvpa .studio__text-cvpa,
#page-cvpa .research--red-cvpa .studio__title-cvpa .icon-arrow-cvpa { color: var(--white); }
#page-cvpa .research--red-cvpa .studio__link-cvpa:hover .studio__title-cvpa { text-decoration-color: var(--white); }
#page-cvpa .research--red-cvpa .studios__actions-cvpa .btn--primary-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .research--red-cvpa .studios__actions-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--accent); }
/* Two-column version for longer lists (e.g. Music's eight ensembles): heading on top, rows in two columns */
#page-cvpa .studios--two-cvpa .studios__inner-cvpa { grid-template-columns: 1fr; row-gap: clamp(2rem, 4vw, 3rem); }
#page-cvpa .studios--two-cvpa .studios__head-cvpa { position: static; }
#page-cvpa .studios--two-cvpa .studios__list-cvpa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 4vw, 3.5rem); }
#page-cvpa .studios--two-cvpa .studio__link-cvpa { grid-template-columns: minmax(0, 12rem) minmax(0, 1fr); }
@media (max-width: 960px) {
  #page-cvpa .studios__inner-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .studios__head-cvpa { position: static; }
  #page-cvpa .studios--two-cvpa .studios__list-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .studios--two-cvpa .studio__link-cvpa { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); }
}
@media (max-width: 560px) {
  #page-cvpa .studio__link-cvpa, #page-cvpa .studios--two-cvpa .studio__link-cvpa { grid-template-columns: minmax(0, 7.5rem) minmax(0, 1fr); align-items: start; }
}
@media (prefers-reduced-motion: reduce) {
  #page-cvpa .studio__media-cvpa img, #page-cvpa .studio__title-cvpa .icon-arrow-cvpa { transition: none; }
  #page-cvpa .studio__link-cvpa:hover .studio__media-cvpa img, #page-cvpa .studio__link-cvpa:hover .icon-arrow-cvpa { transform: none; }
}
/* ===========================================================================
   PART 6 - COMMUNITY PAGES (e.g. TTU String Project: community/music/string-project)
   Built on the PART 4 program page (page hero, sticky bar, question sections).
   Extras: links to sibling pages in the sticky bar, a notice line, registration
   form links, start dates, a class-times table, the former-teachers list with a
   "see all" panel, page-link cards, a smaller contact photo, and instrument cards
   with artist video links.
   =========================================================================== */

/* Links to the other pages of the program, after the in-page links in the sticky bar */
#page-cvpa .jumpnav__link--page-cvpa { gap: 0.4rem; color: var(--accent); }
#page-cvpa .jumpnav__list-cvpa li:has(> .jumpnav__link--page-cvpa):not(:has(+ li > .jumpnav__link--page-cvpa)) { margin-right: 0; }
#page-cvpa .jumpnav__list-cvpa li:not(:has(> .jumpnav__link--page-cvpa)) + li:has(> .jumpnav__link--page-cvpa) { margin-left: auto; padding-left: clamp(1rem, 1.8vw, 2rem); border-left: 1px solid var(--rule); }
#page-cvpa .jumpnav__link--page-cvpa .icon-cvpa { width: 14px; height: 14px; }
#page-cvpa .jumpnav__link--page-cvpa:hover { color: var(--black); }

/* Notice line (e.g. "Registration is now open") */
#page-cvpa .sp-notice-cvpa {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem 0.75rem;
  margin: 1.5rem 0 0; padding: 0.9rem 1.1rem;
  border-left: 6px solid var(--accent); background: var(--card);
  font-size: var(--fs-body); font-weight: 600;
}
#page-cvpa .sp-notice-cvpa .icon-cvpa { width: 1em; height: 1em; color: var(--accent); }

/* Registration form links inside a numbered step */
#page-cvpa .sp-forms-cvpa { margin: 0.6rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.35rem; }

/* Start dates */
#page-cvpa .sp-dates-cvpa { margin: clamp(2rem, 4vw, 2.75rem) 0 0; padding: 0; list-style: none; display: grid; gap: 0.75rem; }
#page-cvpa .sp-dates-cvpa li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 1rem; font-size: var(--fs-body); }
#page-cvpa .sp-dates__day-cvpa {
  min-width: 9.5rem; padding: 0.35rem 0.75rem; background: var(--accent); color: var(--white);
  font-weight: 800; font-size: 0.9rem; letter-spacing: 0.06em; text-transform: uppercase;
}

/* Class-times table (scrolls sideways inside its box on narrow screens) */
#page-cvpa .sp-table-wrap-cvpa { margin: clamp(2rem, 4vw, 2.75rem) 0 0; overflow-x: auto; }
#page-cvpa .sp-table-cvpa { width: 100%; min-width: 34rem; border-collapse: collapse; font-size: var(--fs-card); }
#page-cvpa .sp-table-cvpa th, #page-cvpa .sp-table-cvpa td { padding: 0.9rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--rule); }
#page-cvpa .sp-table-cvpa th { font-size: 0.8rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); border-bottom: 3px solid var(--accent); }
#page-cvpa .sp-table-cvpa td:nth-child(2) { font-weight: 800; white-space: nowrap; }

/* Former teachers: two-column list, with the full list in a "see all" panel */
#page-cvpa .sp-alumni-cvpa {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 4vw, 3rem);
  margin: clamp(2rem, 4vw, 2.75rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .sp-alumni-cvpa li { padding: 0.85rem 0; border-top: 1px solid var(--rule); font-size: var(--fs-card); line-height: 1.5; color: var(--text-muted); }
#page-cvpa .sp-alumni-cvpa strong { color: var(--text); }
#page-cvpa .sp-more-cvpa { margin-top: 1.5rem; }
#page-cvpa .sp-more-cvpa > summary {
  display: inline-flex; align-items: center; gap: 0.6rem; min-height: 44px; padding: 0 1.25rem;
  border: 2px solid currentColor; cursor: pointer; list-style: none;
  font-weight: 800; font-size: calc((1.05rem) * var(--ds-s)); letter-spacing: 0.06em; text-transform: uppercase;
}
#page-cvpa .sp-more-cvpa > summary::-webkit-details-marker { display: none; }
#page-cvpa .sp-more-cvpa > summary::after { content: "+"; font-size: 1.3em; line-height: 1; color: var(--accent); }
#page-cvpa .sp-more-cvpa[open] > summary::after { content: "\2212"; }
#page-cvpa .sp-more-cvpa > summary:hover { background: var(--white); color: var(--black); }

/* Cards that link to the program's other pages: the whole card is the link */
#page-cvpa .sp-pages-cvpa .card__title-cvpa a { color: inherit; }
#page-cvpa .sp-pages-cvpa .hl-card-cvpa:hover .card__title-cvpa a { color: var(--accent); }

/* Contact block with a small headshot */
#page-cvpa .sp-contact-cvpa { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); }
#page-cvpa .sp-contact-cvpa .advisor__photo-cvpa img { aspect-ratio: 2 / 3; }
#page-cvpa .sp-contact-cvpa .advisor__role-cvpa { line-height: 1.6; }

/* Instrument cards: artist video links, and a placeholder when there is no photo yet */
#page-cvpa .sp-instruments-cvpa .reason__media-cvpa .photo-ph-cvpa { width: 100%; height: 100%; aspect-ratio: auto; border: 0; }
#page-cvpa .sp-listen-cvpa { margin: 1.1rem 0 0; font-size: 0.8rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
#page-cvpa .sp-videos-cvpa { margin: 0.5rem 0 0; padding: 0; list-style: none; display: grid; gap: 0.3rem; font-size: var(--fs-card); }
#page-cvpa .sp-chips-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }
#page-cvpa .sp-chip-link-cvpa { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: inherit; transition: background-color 200ms, color 200ms; }
#page-cvpa .sp-chip-link-cvpa:hover { background: var(--white); color: var(--black); }
#page-cvpa .sp-warning-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }
#page-cvpa .sp-list-cvpa { margin: 0.75rem 0 0; padding-left: 1.2rem; line-height: 1.55; color: var(--text-muted); }
#page-cvpa .sp-list-cvpa li { margin: 0.3rem 0; }
#page-cvpa .sp-list-cvpa li::marker { color: var(--accent); }

@media (max-width: 900px) {
  #page-cvpa .sp-contact-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .sp-contact-cvpa .advisor__photo-cvpa { max-width: 11rem; }
  #page-cvpa .jumpnav__list-cvpa li:not(:has(> .jumpnav__link--page-cvpa)) + li:has(> .jumpnav__link--page-cvpa) { margin-left: 0; }
}
@media (max-width: 720px) {
  #page-cvpa .sp-alumni-cvpa { grid-template-columns: 1fr; }
}

/* ===========================================================================
   PART 7 - HANDBOOKS (e.g. School of Art MFA Handbook: handbook/art)
   Built on the PART 4 program page (page hero, sticky bar, white/black sections).
   Each handbook section is a heading followed by an accordion of its numbered
   items, using native <details>/<summary> (keyboard and screen-reader friendly,
   works without JavaScript).
   =========================================================================== */
#page-cvpa .hb-accordion-cvpa { margin: clamp(2rem, 4vw, 3rem) 0 0; border-top: 3px solid var(--accent); }
#page-cvpa .hb-item-cvpa { border-bottom: 1px solid var(--rule); scroll-margin-top: 11rem; }
#page-cvpa .hb-item__summary-cvpa {
  display: flex; align-items: center; gap: clamp(0.9rem, 2vw, 1.5rem);
  min-height: 44px; padding: 1.15rem 0.25rem;
  list-style: none; cursor: pointer;
}
#page-cvpa .hb-item__summary-cvpa::-webkit-details-marker { display: none; }
#page-cvpa .hb-item__summary-cvpa:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
#page-cvpa .hb-item__num-cvpa {
  flex: none; display: inline-grid; place-items: center;
  width: 2.6rem; height: 2.6rem;
  background: var(--accent); color: var(--white);
  font-weight: 900; font-size: 1.05rem; line-height: 1;
}
#page-cvpa .hb-item__title-cvpa {
  flex: 1; min-width: 0;
  font-weight: 800; font-size: calc((clamp(1.3rem, 1.7vw, 1.6rem)) * var(--ds-m)); line-height: 1.2;
  text-transform: uppercase; letter-spacing: 0.02em;
}
#page-cvpa .hb-item__summary-cvpa:hover .hb-item__title-cvpa {
  text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 5px;
}
/* plus sign that turns into a minus when the item is open */
#page-cvpa .hb-item__icon-cvpa { position: relative; flex: none; width: 1.4rem; height: 1.4rem; }
#page-cvpa .hb-item__icon-cvpa::before, #page-cvpa .hb-item__icon-cvpa::after {
  content: ""; position: absolute; left: 0; top: 50%; width: 100%; height: 3px; margin-top: -1.5px;
  background: var(--accent); transition: transform 250ms var(--ease-out);
}
#page-cvpa .hb-item__icon-cvpa::after { transform: rotate(90deg); }
#page-cvpa .hb-item-cvpa[open] .hb-item__icon-cvpa::after { transform: rotate(0deg); }

/* open panel: text lines up with the item title */
#page-cvpa .hb-item__body-cvpa { padding: 0.25rem 0.25rem 2.25rem calc(2.6rem + clamp(0.9rem, 2vw, 1.5rem)); }
#page-cvpa .hb-item__body-cvpa > * { max-width: 52rem; }
/* panel text is reading text: same size as program page paragraphs (--fs-body); cards inside a panel use the card size */
#page-cvpa .hb-item__body-cvpa p, #page-cvpa .hb-item__body-cvpa li, #page-cvpa .hb-item__body-cvpa dd {
  font-size: var(--fs-body); line-height: 1.65; color: var(--text-muted);
}
#page-cvpa .hb-grid-cvpa p, #page-cvpa .hb-grid-cvpa li { font-size: var(--fs-card); }
#page-cvpa .hb-item__body-cvpa p { margin: 0 0 1rem; }
#page-cvpa .hb-item__body-cvpa strong { color: var(--text); }
#page-cvpa .hb-item__body-cvpa h4 {
  margin: 1.75rem 0 0.6rem; font-weight: 800; font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text);
}
#page-cvpa .hb-item__body-cvpa > h4:first-child { margin-top: 0.5rem; }
/* third heading level inside a panel (e.g. "Procedures" under a track's exam guidelines) */
#page-cvpa .hb-item__body-cvpa h5 { margin: 1.4rem 0 0.4rem; font-weight: 800; font-size: 1.05rem; line-height: 1.3; color: var(--text); }
#page-cvpa .hb-item__body-cvpa h4 + h5 { margin-top: 0.6rem; }
/* text that introduces a section before its accordion */
#page-cvpa .hb-intro-cvpa { margin-top: clamp(1.25rem, 2.5vw, 1.75rem); }
#page-cvpa .hb-intro-cvpa h4 { margin: 1.5rem 0 0.6rem; font-weight: 800; font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text); }
#page-cvpa .hb-intro-cvpa ul { margin: 0 0 1rem; padding-left: 1.3rem; max-width: 40rem; }
#page-cvpa .hb-intro-cvpa li { margin: 0.35rem 0; font-size: var(--fs-body); line-height: 1.65; color: var(--text-muted); }
#page-cvpa .hb-intro-cvpa li::marker { color: var(--accent); }
#page-cvpa .hb-item__body-cvpa ul, #page-cvpa .hb-item__body-cvpa ol { margin: 0 0 1rem; padding-left: 1.3rem; }
#page-cvpa .hb-item__body-cvpa li { margin: 0.35rem 0; }
#page-cvpa .hb-item__body-cvpa li::marker { color: var(--accent); font-weight: 700; }
#page-cvpa .hb-item__body-cvpa li > ul, #page-cvpa .hb-item__body-cvpa li > ol { margin: 0.35rem 0 0.5rem; }
#page-cvpa .hb-item__body-cvpa ol[type="a"] { list-style-type: lower-alpha; }
#page-cvpa .hb-item__body-cvpa blockquote {
  margin: 0 0 1.25rem; padding: 0.25rem 0 0.25rem 1.25rem; border-left: 4px solid var(--accent);
}
#page-cvpa .hb-item__body-cvpa blockquote p { font-style: italic; }
/* definition lists: term in bold, explanation under it */
#page-cvpa .hb-defs-cvpa { margin: 0 0 1rem; }
#page-cvpa .hb-defs-cvpa dt { margin: 1rem 0 0.25rem; font-weight: 800; color: var(--text); }
#page-cvpa .hb-defs-cvpa dd { margin: 0; }
/* note box (e.g. "this is a sample only") */
#page-cvpa .hb-note-cvpa { margin: 0 0 1.25rem; padding: 1rem 1.25rem; background: var(--card); border-left: 4px solid var(--accent); }
#page-cvpa .hb-note-cvpa p:last-child { margin-bottom: 0; }
/* small cards in a grid (degree requirements, sample semesters) */
#page-cvpa .hb-item__body-cvpa > .hb-grid-cvpa { max-width: none; }
#page-cvpa .hb-grid-cvpa {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: clamp(0.75rem, 1.4vw, 1.1rem);
  margin: 0 0 1.25rem; padding: 0; list-style: none;
}
#page-cvpa .hb-grid-cvpa > li { margin: 0; padding: 1.1rem 1.2rem 1.25rem; background: var(--card); border-top: 4px solid var(--accent); }
#page-cvpa .hb-grid-cvpa > li::marker { content: none; }
#page-cvpa .hb-grid-cvpa .hb-card__tag-cvpa { margin: 0 0 0.4rem; font-size: var(--fs-small); font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text); }
#page-cvpa .hb-grid-cvpa .hb-card__title-cvpa { margin: 0 0 0.5rem; font-weight: 800; font-size: 1.1rem; line-height: 1.25; text-transform: uppercase; color: var(--text); }
#page-cvpa .hb-grid-cvpa ul { margin: 0; padding-left: 1.1rem; }
#page-cvpa .hb-grid-cvpa p:last-child { margin-bottom: 0; }
/* sample title page */
#page-cvpa .hb-titlepage-cvpa { max-width: 34rem; margin: 0 0 1rem; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--white); color: var(--black); text-align: center; border: 1px solid var(--rule); }
#page-cvpa .hb-item__body-cvpa .hb-titlepage-cvpa p { color: var(--black); margin: 0 0 0.85rem; }
#page-cvpa .hb-titlepage__big-cvpa { font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }

@media (max-width: 720px) {
  #page-cvpa .hb-item__body-cvpa { padding-left: 0.25rem; }
  #page-cvpa .hb-item__num-cvpa { width: 2.2rem; height: 2.2rem; font-size: 0.95rem; }
}

/* PART 7b - PLAIN PAGES (.page--plain-cvpa on the page wrapper; first used on the FADP handbook,
   which sits behind the firewall). A compact black header band (the usual hero look, about 280px
   tall instead of the full hero), then everything on white: no dark sections, no lines between
   them, tight spacing, and plain black accordion numbers. */
#page-cvpa.page--plain-cvpa { --text: var(--black); --text-muted: #3d3d3d; --rule: rgba(0, 0, 0, 0.14); --focus: var(--black); background: var(--white); color: var(--text); }
#page-cvpa.page--plain-cvpa .page-hero-cvpa {
  --text: var(--white); --text-muted: rgba(255, 255, 255, 0.88); --focus: var(--white);
  color: var(--text);
  padding: clamp(2.5rem, 5vw, 4rem) var(--gutter) clamp(2rem, 4vw, 3rem);
}
#page-cvpa.page--plain-cvpa .page-hero-cvpa .headline-cvpa { font-size: calc((clamp(3.2rem, 7.5vw, 6.5rem)) * var(--ds-l)); line-height: 0.95; }
#page-cvpa.page--plain-cvpa .headline-cvpa span { display: inline; }
#page-cvpa.page--plain-cvpa .q-section-cvpa { padding-top: clamp(1.75rem, 3.9vw, 3.15rem); padding-bottom: clamp(1.75rem, 3.9vw, 3.15rem); }
#page-cvpa.page--plain-cvpa .q-eyebrow-cvpa { margin-bottom: 0.75rem; }
#page-cvpa.page--plain-cvpa .hb-accordion-cvpa { margin-top: clamp(1.25rem, 2.5vw, 1.75rem); }
#page-cvpa.page--plain-cvpa .hb-intro-cvpa { margin-top: 0.75rem; }
#page-cvpa.page--plain-cvpa .hb-item__summary-cvpa { padding-top: 1.4rem; padding-bottom: 1.4rem; }
#page-cvpa.page--plain-cvpa .hb-item__num-cvpa { width: auto; min-width: 2.6rem; height: auto; place-items: center start; background: none; color: var(--black); }
@media (min-width: 901px) {
  #page-cvpa.page--plain-cvpa .page-hero-cvpa { padding-top: clamp(3rem, 5vw, 4.5rem); padding-bottom: clamp(2.5rem, 4vw, 3.5rem); }
}
/* Compact black header on its own (page-hero--compact-cvpa, e.g. degree plans): the plain pages' short header band,
   while the sections below keep the usual white / grey / black / red colours */
#page-cvpa .page-hero--compact-cvpa { min-height: 0; padding: clamp(2.5rem, 5vw, 4rem) var(--gutter) clamp(2rem, 4vw, 3rem); }
#page-cvpa .page-hero--compact-cvpa .headline-cvpa { font-size: calc((clamp(3.2rem, 7.5vw, 6.5rem)) * var(--ds-l)); line-height: 0.95; }
#page-cvpa .page-hero--compact-cvpa .headline-cvpa span { display: inline; }
@media (min-width: 901px) {
  #page-cvpa .page-hero--compact-cvpa { padding-top: clamp(3rem, 5vw, 4.5rem); padding-bottom: clamp(2.5rem, 4vw, 3.5rem); }
}
/* ===========================================================================
   PART 8 - EVENTS BY DISCIPLINE SECTION (events section/events-section.html)
   A section that can be dropped onto any page, inside or outside #page-cvpa:
   four columns (Art, Music, Theatre, Dance), each a red or black tinted photo
   header with its events below. Every rule starts with #disc-events-cvpa (the
   section's id) and it carries its own tokens and reset, so it does not depend
   on the page wrapper. No fonts are set: it uses the page's global fonts.
   =========================================================================== */
/* ---------- Tokens (scoped to the section) ---------- */
#disc-events-cvpa {
  --red: #E90802;
  --black: #000000;
  --white: #FFFFFF;
  --accent: var(--red);
  --text: var(--black);
  --text-muted: #4a4a4a;
  --rule: rgba(0, 0, 0, 0.12);
  --focus: var(--black);
  /* Neue Plak is wide, so display sizes are scaled down (same factors as the homepage) */
  --ds-l: 0.66; --ds-m: 0.8;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ---------- Reset (lowest priority via :where, so the rules below always win) ---------- */
#disc-events-cvpa, #disc-events-cvpa :where(*, *::before, *::after) { box-sizing: border-box; }
#disc-events-cvpa :where(h2, h3, h4, p, ul, li, time, span, div, a) {
  margin: 0; padding: 0; border: 0; background: none; box-shadow: none;
  font: inherit; color: inherit; letter-spacing: inherit; text-transform: inherit; max-width: none;
}
#disc-events-cvpa :where(ul) { list-style: none; }
#disc-events-cvpa :where(li)::before, #disc-events-cvpa :where(li)::after,
#disc-events-cvpa :where(a)::before, #disc-events-cvpa :where(a)::after { content: none; }
#disc-events-cvpa :where(a) { text-decoration: none; }
#disc-events-cvpa :where(img) { display: block; max-width: 100%; margin: 0; border: 0; }
#disc-events-cvpa :focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
#disc-events-cvpa .visually-hidden-cvpa {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* Arrow icon: drawn with a CSS mask (OmniUpdate strips inline <svg>) */
#disc-events-cvpa .icon-cvpa {
  display: inline-block; width: 1em; height: 1em; background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat;
}
#disc-events-cvpa .icon-arrow-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='square'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
@media (forced-colors: active) {
  #disc-events-cvpa .icon-cvpa { forced-color-adjust: none; background-color: CanvasText; }
}

/* ---------- Section + grid ---------- */
#disc-events-cvpa {
  background: var(--white); color: var(--text);
  font-size: 1rem; line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  padding: clamp(2.5rem, 5vw, 4rem) 0;
}
#disc-events-cvpa .disc-events__grid-cvpa {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 1.8vw, 1.5rem);
  max-width: 84rem; margin: 0 auto; align-items: start;
}
#disc-events-cvpa .disc-col-cvpa { display: flex; flex-direction: column; background: #f4f4f4; }

/* ---------- Tinted photo header (--tint: red or black per column) ---------- */
#disc-events-cvpa .disc-col--red-cvpa { --tint: var(--accent); }
#disc-events-cvpa .disc-col--black-cvpa { --tint: var(--black); }
#disc-events-cvpa .disc-head-cvpa {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: clamp(9.5rem, 13vw, 12rem); padding: 1.1rem 1.1rem 1rem;
  background: var(--tint); color: var(--white);
  --focus: var(--white);
}
/* Photo shows through the tint in greyscale */
#disc-events-cvpa .disc-head-cvpa img {
  position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%;
  object-fit: cover; object-position: var(--pos, center);
  filter: grayscale(1) contrast(1.2) brightness(1.15); opacity: 0.95; mix-blend-mode: multiply;
  transition: transform 600ms var(--ease-out);
}
#disc-events-cvpa .disc-col--black-cvpa .disc-head-cvpa img { mix-blend-mode: normal; opacity: 0.6; }
/* Solid tint behind the text so the white text always meets WCAG AA contrast */
#disc-events-cvpa .disc-head-cvpa::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(0deg, var(--tint) 0%, var(--tint) 30%, color-mix(in srgb, var(--tint) 75%, transparent) 52%, transparent 88%);
}
#disc-events-cvpa .disc-head-cvpa:hover img { transform: scale(1.05); }
#disc-events-cvpa .disc-head__name-cvpa {
  font-weight: 900;
  font-size: calc((clamp(2.6rem, 3.6vw, 3.6rem)) * var(--ds-l)); line-height: 0.9;
  text-transform: uppercase; letter-spacing: 0.01em;
}
#disc-events-cvpa .disc-head__tag-cvpa {
  display: block; margin-top: 0.55rem;
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1.35; text-transform: uppercase;
}
/* Circled arrow on the right, level with the discipline name */
#disc-events-cvpa .disc-head__arrow-cvpa {
  position: absolute; right: 1.1rem; bottom: calc(1rem + 0.55rem + 0.95rem + 0.35rem);
  display: grid; place-items: center; width: 1.9rem; height: 1.9rem;
  border: 2px solid var(--white); border-radius: 50%;
  transition: background-color 200ms, color 200ms;
}
#disc-events-cvpa .disc-head__arrow-cvpa .icon-cvpa { width: 0.85rem; height: 0.85rem; }
#disc-events-cvpa .disc-head-cvpa:hover .disc-head__arrow-cvpa { background: var(--white); color: var(--tint); }

/* ---------- Event list ---------- */
#disc-events-cvpa .disc-events__list-cvpa { padding: 0.4rem 1.1rem 0.8rem; }
#disc-events-cvpa .disc-event-cvpa {
  display: grid; grid-template-columns: 4.1rem minmax(0, 1fr); gap: 0.9rem; align-items: start;
  padding: 0.95rem 0;
}
#disc-events-cvpa .disc-event-cvpa + .disc-event-cvpa { border-top: 1px solid var(--rule); }
#disc-events-cvpa .disc-date-cvpa {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 3.6rem; padding: 0.35rem 0.25rem;
  background: var(--white); border: 1px solid rgba(0, 0, 0, 0.18);
  text-align: center; line-height: 1;
}
#disc-events-cvpa .disc-date__month-cvpa { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
#disc-events-cvpa .disc-date__day-cvpa {
  margin-top: 0.2rem;
  font-weight: 900; font-size: calc((2.1rem) * var(--ds-m));
}
/* Ranges like "27 & 28" or "30 & Feb 1" */
#disc-events-cvpa .disc-date__day--range-cvpa { font-size: calc((1.15rem) * var(--ds-m)); line-height: 1.1; }
#disc-events-cvpa .disc-event__title-cvpa { font-size: 0.98rem; font-weight: 700; line-height: 1.3; }
#disc-events-cvpa .disc-event__sub-cvpa, #disc-events-cvpa .disc-event__when-cvpa { margin-top: 0.2rem; font-size: 0.88rem; line-height: 1.4; color: var(--text-muted); }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  #disc-events-cvpa .disc-events__grid-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  #disc-events-cvpa .disc-events__grid-cvpa { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  #disc-events-cvpa .disc-head-cvpa img, #disc-events-cvpa .disc-head__arrow-cvpa { transition: none; }
  #disc-events-cvpa .disc-head-cvpa:hover img { transform: none; }
}
/* ===========================================================================
   PART 9 - ALUMNI PAGES (alumni-give/college/how-to-get-involved)
   Built on the PART 4 program page sections. Adds: icons for the alumni cards
   (drawn with CSS masks, like every icon here), a light grey section, photo
   cards, clickable cards, a text-and-poster layout and the community banner.
   The contact uses the PART 4 "questions?" advisor block.
   =========================================================================== */
/* Light grey section: the OFFICIAL FOURTH SECTION COLOUR (#EDEDED), alongside black, white and red.
   Neighbouring sections never share a colour. Text stays at AA contrast (#3d3d3d on #EDEDED is 9.3:1). */
#page-cvpa .q-section--gray-cvpa {
  --text: var(--black); --text-muted: #3d3d3d; --rule: rgba(0, 0, 0, 0.14); --focus: var(--black); --card: var(--white);
  background: #EDEDED; color: var(--text);
}
/* Card icons (red, drawn with a CSS mask) */
#page-cvpa .al-icon-cvpa { width: 2.75rem; height: 2.75rem; color: var(--accent); }
#page-cvpa .al-icon--mic-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M51 86 51 73.8C62.3 72.3 71 62.7 71 51L71 41 65 41 65 51C65 60.4 57.4 68 48 68 38.6 68 31 60.4 31 51L31 41 25 41 25 51C25 62.7 33.7 72.3 45 73.8L45 86 24 86 24 92 72 92 72 86 51 86Z'/%3E%3Cpath d='M48 64C55.2 64 61 58.2 61 51L51 51 51 47 61 47 61 41 51 41 51 37 61 37 61 31 51 31 51 27 61 27 61 21 51 21 51 17 61 17C61 9.8 55.2 4 48 4 40.8 4 35 9.8 35 17L35 51C35 58.2 40.8 64 48 64Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--lecturer-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 19.5C52.4 19.5 56 15.9 56 11.5 56 7.1 52.4 3.5 48 3.5 43.6 3.5 40 7.1 40 11.5 40 15.9 43.6 19.5 48 19.5'/%3E%3Cpath d='M68 49.5 72 37.5 24 37.5 28 49.5 34 49.5 38 88.5 32 88.5 32 92.5 64 92.5 64 88.5 58 88.5 62 49.5Z'/%3E%3Cpath d='M64.2 28.9C64 28.1 63.6 27.3 63 26.7 60.6 24.7 57.8 23.3 54.6 22.3 52.4 21.9 50.2 21.5 48 21.5 45.8 21.5 43.6 21.9 41.4 22.5 38.2 23.3 35.4 24.9 33 26.9 32.4 27.5 32 28.3 31.8 29.1L30.8 33.5 65.3 33.5 64.2 28.9Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--thought-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M48.941 13C53.4601 12.9725 57.351 16.1837 58.181 20.626 58.181 20.633 58.19 20.637 58.196 20.632 59.8758 19.3587 61.9242 18.6666 64.032 18.66 69.2349 18.6765 73.4482 22.8911 73.463 28.094 73.4681 28.8213 73.3746 29.5459 73.185 30.248 73.1838 30.2534 73.1871 30.2588 73.1925 30.26 73.194 30.2603 73.1955 30.2603 73.197 30.26 73.9396 30.0651 74.7053 29.9715 75.473 29.982 80.6827 30.0575 84.8448 34.342 84.7693 39.5517 84.6947 44.7028 80.5016 48.8415 75.35 48.849 74.0539 48.8138 72.777 48.5275 71.59 48.006 71.5856 48.0038 71.5801 48.0055 71.5779 48.01 71.5771 48.0115 71.5768 48.0133 71.577 48.015L71.577 48.651C71.6179 53.6248 67.8384 57.7991 62.885 58.251 59.6486 58.5166 56.5097 57.0665 54.614 54.43 54.6109 54.4261 54.6052 54.4255 54.6013 54.4286 54.5994 54.4302 54.5982 54.4325 54.598 54.435 54.1065 59.632 49.4951 63.4466 44.2981 62.9551 39.4507 62.4967 35.7447 58.431 35.736 53.562 35.7352 53.2216 35.7654 52.8819 35.826 52.547 35.8282 52.5431 35.8269 52.5382 35.823 52.536 35.8191 52.5338 35.8142 52.5351 35.812 52.539 31.7223 55.7107 25.8358 54.9665 22.6641 50.8768 21.5751 49.4727 20.9078 47.7879 20.74 46.019L20.645 46.019C15.4348 46.0114 11.2171 41.7816 11.2247 36.5713 11.2322 31.4197 15.3709 27.2266 20.522 27.152 21.2897 27.1414 22.0554 27.235 22.798 27.43 22.8039 27.4312 22.8098 27.4274 22.811 27.4215 22.8113 27.42 22.8113 27.4185 22.811 27.417 22.6438 26.7785 22.5509 26.1228 22.534 25.463 22.4076 20.2731 26.5124 15.9633 31.7024 15.8369 34.9439 15.758 37.9972 17.3553 39.781 20.063 39.7833 20.0674 39.7887 20.0692 39.7931 20.0669 39.7948 20.066 39.7961 20.0647 39.797 20.063 40.9261 15.9311 44.6579 13.0486 48.941 13M48.941 11C44.9736 11.0269 41.2993 13.0936 39.216 16.47 37.1826 14.7676 34.616 13.8332 31.964 13.83 25.6963 13.8378 20.6004 18.8847 20.532 25.152 14.217 25.2199 9.15274 30.3943 9.22069 36.7094 9.28142 42.3546 13.4529 47.1106 19.042 47.907 20.568 53.9954 26.7407 57.6939 32.8291 56.1679 33.2118 56.072 33.5893 55.9562 33.96 55.821 35.2143 62.0196 41.2561 66.0277 47.4546 64.7734 51.0771 64.0404 54.1231 61.604 55.634 58.231 57.5376 59.5766 59.8139 60.294 62.145 60.283 67.7591 60.2762 72.5401 56.1995 73.434 50.657 74.065 50.7823 74.7067 50.8466 75.35 50.849 81.6648 50.8301 86.7686 45.6956 86.7497 39.3808 86.7309 33.1368 81.7065 28.0624 75.463 27.982 75.3946 21.7151 70.2993 16.6684 64.032 16.66 62.418 16.6627 60.822 17.0002 59.345 17.651 57.4911 13.5771 53.4168 10.9725 48.941 11Z'/%3E%3Cpath d='M29 65.018C31.2091 65.018 33 66.8089 33 69.018 33 71.2271 31.2091 73.018 29 73.018 26.7909 73.018 25 71.2271 25 69.018 25.0033 66.8102 26.7922 65.0213 29 65.018M29 63.018C25.6863 63.018 23 65.7043 23 69.018 23 72.3317 25.6863 75.018 29 75.018 32.3137 75.018 35 72.3317 35 69.018 35 65.7043 32.3137 63.018 29 63.018Z'/%3E%3Cpath d='M17 77.021C18.3807 77.021 19.5 78.1403 19.5 79.521 19.5 80.9017 18.3807 82.021 17 82.021 15.6193 82.021 14.5 80.9017 14.5 79.521 14.5 78.1403 15.6193 77.021 17 77.021M17 75.021C14.5147 75.021 12.5 77.0357 12.5 79.521 12.5 82.0063 14.5147 84.021 17 84.021 19.4853 84.021 21.5 82.0063 21.5 79.521 21.5 77.0357 19.4853 75.021 17 75.021Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--handshake-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M44.9 72.4C44.4 72.4 43.8 72.3 43.4 71.9 42.6 71.2 42.5 69.9 43.2 69.1L47.1 64.6C47.8 63.8 49.1 63.7 49.9 64.4 50.7 65.1 50.8 66.4 50.1 67.2L46.2 71.7C45.9 72.1 45.4 72.3 44.9 72.4Z'/%3E%3Cpath d='M38.8 70.1C38.1 70.2 37.5 70 36.9 69.5 35.9 68.6 35.8 67 36.7 66L41.3 60.7C42.2 59.7 43.8 59.6 44.8 60.5 45.8 61.4 45.9 63 45 64L40.4 69.3C40 69.8 39.4 70.1 38.8 70.1Z'/%3E%3Cpath d='M32.5 66.4C31.7 66.5 30.9 66.2 30.3 65.7 29.1 64.6 28.9 62.7 30 61.5L34.6 56.2C35.7 55 37.6 54.8 38.8 55.9 40 57 40.2 58.9 39.1 60.1L34.5 65.4C34 66 33.2 66.4 32.5 66.4Z'/%3E%3Cpath d='M25.2 62.7C24.4 62.8 23.6 62.5 23 62 21.8 60.9 21.6 59 22.7 57.8L28 51.8C29.1 50.6 31 50.4 32.2 51.5 33.4 52.6 33.6 54.5 32.5 55.7L27.2 61.7C26.6 62.3 25.9 62.6 25.2 62.7Z'/%3E%3Cpath d='M4.6 40.7 12.3 45.4C13.2 46 14.5 45.7 15 44.7L24.3 29.3C24.9 28.4 24.6 27.1 23.6 26.6L16 21.9 4.6 40.7Z'/%3E%3Cpath d='M69.4 53.8 53.3 40 52.2 39 45.3 46.9C44.3 48.1 42.9 48.8 41.3 48.9 41.1 48.9 40.9 48.9 40.8 48.9 39.3 48.9 37.9 48.4 36.9 47.4 34.4 45.2 34.2 41.4 36.3 38.9L42.2 32.1C37.6 31.5 31.7 33.9 25.6 30.9L16.9 45.3 23.7 53.2 26.3 50.2C27.2 49.1 28.6 48.5 30.1 48.5L30.1 48.5C31.3 48.5 32.5 48.9 33.4 49.7 34.5 50.6 35 51.9 35.1 53.3 35.6 53.1 36.2 53 36.8 53 38 53 39.2 53.4 40.1 54.2 41.2 55.2 41.8 56.5 41.8 57.9 42.2 57.8 42.7 57.7 43.1 57.7L43.1 57.7C44.2 57.7 45.2 58.1 46.1 58.8 47 59.6 47.5 60.7 47.6 61.9 47.9 61.8 48.3 61.7 48.7 61.7L48.7 61.7C49.7 61.7 50.6 62 51.3 62.7 52.1 63.4 52.6 64.4 52.7 65.4 52.8 66.5 52.4 67.5 51.7 68.3L48.3 72.2 49.7 73.3C50.4 73.7 51.2 74 52.1 73.9 54.3 73.7 55.9 71.8 55.7 69.6 55.7 69.6 55.7 69.5 55.7 69.5 56 69.6 56.4 69.6 56.7 69.6 58.9 69.4 60.5 67.5 60.3 65.3 60.3 65.3 60.3 65.2 60.3 65.2 60.6 65.3 61 65.3 61.3 65.3 63.5 65.1 65.1 63.2 64.9 61 64.9 60.8 64.8 60.6 64.8 60.4 65.4 60.7 66.1 60.9 66.9 60.8 69.1 60.6 70.7 58.7 70.5 56.5 70.6 55.4 70.1 54.5 69.4 53.8Z'/%3E%3Cpath d='M91.4 40.7 83.7 45.4C82.8 46 81.5 45.7 81 44.7L71.7 29.3C71.1 28.4 71.4 27.1 72.4 26.6L80.1 21.9 91.4 40.7Z'/%3E%3Cpath d='M70.5 31.3C62.2 34.3 56.2 31.4 49.5 30.1 49.4 30.1 49 30 49 30 47.8 29.9 46.5 30.3 45.6 31.3L37.7 40.3C36.2 42 36.4 44.5 38.1 45.9 39 46.6 40 47 41.1 46.9 42.1 46.8 43.1 46.4 43.8 45.5 43.8 45.5 52 36.1 52 36.1L70.7 52.2 70.7 52.2 70.7 52.2C71.2 52.7 71.4 52.9 71.8 53.5L79 45.2 70.5 31.3Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--lights-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M56.471 74.792 39.26 74.792C37.6683 74.792 36.378 76.0823 36.378 77.674 36.378 79.2657 37.6683 80.556 39.26 80.556L56.471 80.556C58.0627 80.556 59.353 79.2657 59.353 77.674 59.353 76.0823 58.0627 74.792 56.471 74.792Z'/%3E%3Cpath d='M47.866 90.328C51.1343 90.3276 53.8528 87.8142 54.109 84.556L41.622 84.556C41.8783 87.8146 44.5974 90.3281 47.866 90.328Z'/%3E%3Cpath d='M72.839 44.474 72.839 43.61C72.5897 29.9692 61.5087 19.0156 47.866 18.924L47.866 18.924C34.2223 19.0145 23.1398 29.9683 22.89 43.61L22.89 44.474C22.9832 47.4325 23.571 50.3546 24.629 53.119 25.6414 55.7278 27.1115 58.1349 28.97 60.227 31.256 62.727 33.763 67.575 34.82 69.727 35.144 70.38 35.81 70.793 36.539 70.793L59.19 70.793C59.9191 70.7927 60.5853 70.3798 60.91 69.727 61.966 67.576 64.473 62.727 66.759 60.227 68.6175 58.1349 70.0876 55.7278 71.1 53.119 72.1576 50.3544 72.7453 47.4325 72.839 44.474ZM67.076 44.374C66.9891 46.6763 66.5243 48.9486 65.7 51.1 64.938 53.0389 63.8387 54.8275 62.453 56.383 60.2514 59.0369 58.3658 61.9377 56.834 65.027L38.892 65.027C37.3606 61.9375 35.4749 59.0367 33.273 56.383 31.8872 54.8277 30.7882 53.039 30.027 51.1 29.2032 48.9492 28.739 46.6775 28.653 44.376L28.653 43.656C28.8471 33.167 37.3734 24.7482 47.864 24.687L47.864 24.687C58.3554 24.7477 66.882 33.1682 67.074 43.658Z'/%3E%3Cpath d='M48.062 15C49.1666 15 50.062 14.1046 50.062 13L50.062 6C50.062 4.89543 49.1666 4 48.062 4 46.9574 4 46.062 4.89543 46.062 6L46.062 13C46.062 14.1046 46.9574 15 48.062 15Z'/%3E%3Cpath d='M24.326 23.8C25.0934 24.5945 26.3595 24.6165 27.154 23.8492 27.9485 23.0818 27.9705 21.8157 27.2032 21.0212 27.1871 21.0045 27.1707 20.9881 27.154 20.972L22.2 16.018C21.4055 15.2506 20.1394 15.2726 19.372 16.0672 18.6234 16.8422 18.6234 18.071 19.372 18.846Z'/%3E%3Cpath d='M70.411 24.761C70.9414 24.7609 71.45 24.5501 71.825 24.175L76.774 19.225C77.5253 18.4153 77.4779 17.1498 76.6681 16.3986 75.9003 15.6862 74.713 15.6868 73.946 16.4L69 21.347C68.2191 22.1282 68.2193 23.3945 69.0004 24.1754 69.3754 24.5503 69.8838 24.7609 70.414 24.761Z'/%3E%3Cpath d='M17 41.5 10 41.5C8.89543 41.5 8 42.3954 8 43.5 8 44.6046 8.89543 45.5 10 45.5L17 45.5C18.1046 45.5 19 44.6046 19 43.5 19 42.3954 18.1046 41.5 17 41.5Z'/%3E%3Cpath d='M24.326 63.136 19.376 68.086C18.5627 68.8335 18.5094 70.0987 19.2569 70.9119 20.0043 71.7252 21.2695 71.7785 22.0828 71.0311 22.1235 70.9937 22.1626 70.9546 22.2 70.914L27.15 65.964C27.9445 65.1966 27.9665 63.9305 27.1992 63.136 26.4318 62.3415 25.1657 62.3195 24.3712 63.0868 24.3545 63.1029 24.3381 63.1193 24.322 63.136Z'/%3E%3Cpath d='M71.825 62.757C71.0729 61.9481 69.8074 61.902 68.9984 62.6541 68.1895 63.4062 68.1434 64.6717 68.8956 65.4807 68.9291 65.5167 68.9639 65.5515 69 65.585L73.949 70.534C74.7435 71.3014 76.0096 71.2794 76.777 70.4848 77.5256 69.7098 77.5256 68.481 76.777 67.706Z'/%3E%3Cpath d='M85.75 41.432 78.75 41.432C77.6454 41.432 76.75 42.3274 76.75 43.432 76.75 44.5366 77.6454 45.432 78.75 45.432L85.75 45.432C86.8546 45.432 87.75 44.5366 87.75 43.432 87.75 42.3274 86.8546 41.432 85.75 41.432Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--briefcase-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M56 50.5C56 52.7 54.2 54.5 52 54.5L48 54.5C45.8 54.5 44 52.7 44 50.5L44 48.5 10 48.5 10 76.5C10 78.7 11.8 80.5 14 80.5L86 80.5C88.2 80.5 90 78.7 90 76.5L90 48.5 56 48.5 56 50.5Z'/%3E%3Cpath d='M86 24.5 66 24.5 66 18C66 14.1 62.9 11 59 11L41 11C37.1 11 34 14.1 34 18L34 24.5 14 24.5C11.8 24.5 10 26.3 10 28.5L10 44.5 44 44.5 44 42.5 56 42.5 56 44.5 90 44.5 90 28.5C90 26.3 88.2 24.5 86 24.5M40 24.5 40 18C40 17.4 40.4 17 41 17L59 17C59.6 17 60 17.4 60 18L60 24.5 40 24.5Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--openbook-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Crect x='56' y='32' width='15' height='2'/%3E%3Crect x='56' y='38' width='15' height='2'/%3E%3Crect x='56' y='44' width='10' height='2'/%3E%3Cpath d='M87 24 81 24 81 19.6C81.0001 19.1729 80.7289 18.7928 80.325 18.654 69.8402 15.154 58.5083 15.1154 48 18.544 37.4918 15.1151 26.1599 15.1533 15.675 18.653 15.2707 18.7919 14.9994 19.1725 15 19.6L15 24 9 24C8.44771 24 8 24.4477 8 25L8 73C8 73.5523 8.44771 74 9 74L41.1 74C41.5195 75.7591 43.0916 77.0002 44.9 77L51.1 77C52.9084 77.0002 54.4805 75.7591 54.9 74L87 74C87.5523 74 88 73.5523 88 73L88 25C88 24.4477 87.5523 24 87 24ZM79 20.32 79 66.22C69.2196 63.256 58.7804 63.256 49 66.22L49 20.32C58.7608 17.2266 69.2392 17.2266 79 20.32ZM17 20.32C26.7608 17.2266 37.2392 17.2266 47 20.32L47 66.22C37.2196 63.256 26.7804 63.256 17 66.22ZM86 72 54 72C53.4477 72 53 72.4477 53 73L53 73.1C53 74.1493 52.1493 75 51.1 75L44.9 75C43.8507 75 43 74.1493 43 73.1L43 73C43 72.4477 42.5523 72 42 72L10 72 10 26 15 26 15 67.6C14.9998 68.1523 15.4474 68.6001 15.9997 68.6003 16.1104 68.6003 16.2203 68.582 16.325 68.546 26.4995 65.1527 37.5005 65.1527 47.675 68.546 47.6915 68.5497 47.7082 68.5524 47.725 68.554 47.7989 68.5757 47.8751 68.5885 47.952 68.592 47.968 68.592 47.984 68.6 48 68.6 48.016 68.6 48.025 68.595 48.037 68.594 48.1131 68.5916 48.1886 68.5802 48.262 68.56 48.278 68.56 48.295 68.554 48.312 68.549L48.325 68.549C58.4995 65.1557 69.5005 65.1557 79.675 68.549 79.7798 68.5836 79.8896 68.6008 80 68.6 80.5523 68.6 81 68.1523 81 67.6L81 26 86 26Z'/%3E%3C/g%3E%3C/svg%3E"); }
/* Card grids: four photo cards, three link cards */
#page-cvpa .al-cards-cvpa {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 1.8vw, 1.5rem);
  margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .al-cards--three-cvpa { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#page-cvpa .al-card-cvpa { display: flex; flex-direction: column; margin: 0; background: var(--card); border-top: 4px solid var(--accent); }
#page-cvpa .al-card-cvpa .q-media-cvpa { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; }
#page-cvpa .al-card-cvpa .q-media-cvpa img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); }
#page-cvpa .al-card-cvpa .photo-ph-cvpa { aspect-ratio: 4 / 3; }
#page-cvpa .al-card__body-cvpa { display: flex; flex-direction: column; gap: 0.6rem; flex: 1; padding: clamp(1.1rem, 1.6vw, 1.5rem); }
#page-cvpa .al-card__body-cvpa p { margin: 0; font-size: var(--fs-card); line-height: 1.55; color: var(--text-muted); }
/* the whole card is the link; the title gets the arrow and the underline on hover */
#page-cvpa .al-card-link-cvpa { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
#page-cvpa .al-card-link-cvpa:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }
#page-cvpa .al-card-link-cvpa .card__title-cvpa { display: inline-flex; align-items: center; gap: 0.5rem; }
/* TTU's template underlines text inside links: no line on the card text, only the red one on the title on hover */
#page-cvpa .al-card-link-cvpa .card__title-cvpa, #page-cvpa .al-card-link-cvpa p { text-decoration: none; }
/* a little more line height on titles underlined on hover, so the line clears a wrapped second line */
#page-cvpa .al-card-link-cvpa .card__title-cvpa, #page-cvpa .person-link-cvpa .card__title-cvpa { line-height: 1.3; }
#page-cvpa .al-card__text-cvpa { display: block; font-size: var(--fs-card); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .al-card-link-cvpa .icon-arrow-cvpa { width: 1rem; height: 1rem; color: var(--accent); transition: transform 200ms var(--ease-out); }
#page-cvpa .al-card-link-cvpa:hover .card__title-cvpa { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 5px; }
#page-cvpa .al-card-link-cvpa:hover .icon-arrow-cvpa { transform: translateX(4px); }
/* page introduction at the top of the first section, before its heading */
#page-cvpa .al-intro-cvpa { margin-bottom: clamp(3rem, 6vw, 4.5rem); }
#page-cvpa .al-intro-cvpa p { max-width: 46rem; font-size: var(--fs-lede); line-height: 1.6; }
/* buttons under a section's text */
#page-cvpa .al-actions-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }
/* text beside the Next Stage poster */
#page-cvpa .al-feature-cvpa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
/* shown up to the graphic's own width (548px) so it stays sharp */
#page-cvpa .al-feature__media-cvpa { margin: 0; width: 100%; max-width: 34.25rem; justify-self: center; }
#page-cvpa .al-feature__media-cvpa img { width: 100%; height: auto; }
/* a button that shows an email address keeps it in lowercase */
#page-cvpa .btn--email-cvpa { text-transform: none; letter-spacing: 0.02em; }
/* an email button with a label (e.g. "Ask a question") instead of the address: capitals like other buttons */
#page-cvpa .btn--email-cvpa.btn--label-cvpa { text-transform: uppercase; letter-spacing: 0.06em; }
/* "Our community is everything!" banner */
#page-cvpa .al-banner-cvpa { margin: 0 auto; max-width: 52rem; }
#page-cvpa .al-banner-cvpa img { width: 100%; height: auto; }
@media (max-width: 1000px) {
  #page-cvpa .al-cards-cvpa, #page-cvpa .al-cards--three-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .al-feature-cvpa { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  #page-cvpa .al-cards-cvpa, #page-cvpa .al-cards--three-cvpa { grid-template-columns: 1fr; }
}
/* ===========================================================================
   PART 9b - ALUMNI HOME PAGE (college/alumni-give/home)
   Extra pieces for the alumni home page, alongside PART 9: icons, a red section,
   the big alumni number, square alumni
   portraits, the impact numbers, the student-to-alumni journey, a photo-and-text
   layout and the social links.
   =========================================================================== */
#page-cvpa .al-icon--user-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Ccircle cx='48' cy='30' r='16'/%3E%3Cpath d='M80 82 80 66C80 63.6 78.8 61.2 76.8 59.6 72.4 56 66.8 53.6 61.2 52 57.2 50.8 52.8 50 48 50 43.6 50 39.2 50.8 34.8 52 29.2 53.6 23.6 56.4 19.2 59.6 17.2 61.2 16 63.6 16 66L16 82 80 82Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--calendar-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M29 26C30.7 26 32 24.7 32 23L32 17C32 15.3 30.7 14 29 14 27.3 14 26 15.3 26 17L26 23C26 24.7 27.3 26 29 26Z'/%3E%3Cpath d='M20 68 36 68 36 76 20 76 20 68ZM20 56 36 56 36 64 20 64 20 56ZM20 44 36 44 36 52 20 52 20 44ZM56 44 56 52 40 52 40 44 56 44ZM76 44 76 52 60 52 60 44 76 44ZM76 64 60 64 60 56 76 56 76 64ZM76 76 60 76 60 68 76 68 76 76ZM40 64 40 56 56 56 56 64 40 64ZM40 76 40 68 56 68 56 76 40 76ZM14 82 82 82 82 38 14 38 14 82Z'/%3E%3Cpath d='M67 26C68.7 26 70 24.7 70 23L70 17C70 15.3 68.7 14 67 14 65.3 14 64 15.3 64 17L64 23C64 24.7 65.3 26 67 26Z'/%3E%3Cpath d='M74 20 74 23C74 26.9 70.9 30 67 30 63.1 30 60 26.9 60 23L60 20 36 20 36 23C36 26.9 32.9 30 29 30 25.1 30 22 26.9 22 23L22 20 14 20 14 34 82 34 82 20 74 20Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--star-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M88 38 58 38 48 8 38 38 8 38 31 58 22 88 48 70 74 88 65 58Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--gradcap-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M91.612 39.7 48.006 24.1 4.4 39.7 13 42.719 13 60.1C13 60.6523 13.4477 61.1 14 61.1 14.5523 61.1 15 60.6523 15 60.1L15 43.42 22.038 45.89 22.038 60.29C22.038 66.15 33.93 71.1 48.006 71.1 62.082 71.1 73.975 66.15 73.975 60.292L73.975 45.89ZM48.006 26.225 85.6 39.674C85.615 39.679 85.615 39.687 85.6 39.692L48.006 52.882 10.416 39.692C10.401 39.687 10.401 39.679 10.416 39.674ZM71.975 60.292C71.975 64.365 61.505 69.1 48.006 69.1 34.507 69.1 24.038 64.365 24.038 60.292L24.038 46.592 48.006 55 71.975 46.59Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--group-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='71' cy='66.5' r='2.5'/%3E%3Ccircle cx='82' cy='66.5' r='2.5'/%3E%3Ccircle cx='49' cy='66.5' r='2.5'/%3E%3Ccircle cx='60' cy='66.5' r='2.5'/%3E%3Ccircle cx='27' cy='66.5' r='2.5'/%3E%3Ccircle cx='38' cy='66.5' r='2.5'/%3E%3Ccircle cx='16' cy='66.5' r='2.5'/%3E%3Cpath d='M88.47 79.66 86.54 72.38C86.4808 72.1742 86.3786 71.9833 86.24 71.82 85.5821 71.1344 84.7694 70.6165 83.87 70.31 83.2729 70.0854 82.6376 69.9801 82 70 81.367 69.9988 80.7383 70.1036 80.14 70.31 79.2335 70.6128 78.416 71.135 77.76 71.83 77.6354 71.9993 77.5406 72.1887 77.48 72.39L76.48 76.11 75.48 72.42C75.4265 72.214 75.3274 72.0226 75.19 71.86 74.5278 71.1748 73.712 70.6572 72.81 70.35 72.2349 70.1177 71.6203 69.9989 71 70 70.3672 70.0005 69.7388 70.1052 69.14 70.31 68.2353 70.6105 67.4205 71.1331 66.77 71.83 66.6384 71.9964 66.54 72.1865 66.48 72.39L65.5 76 64.5 72.38C64.4408 72.1742 64.3386 71.9833 64.2 71.82 63.5421 71.1344 62.7294 70.6165 61.83 70.31 61.2454 70.0905 60.6242 69.9853 60 70 59.367 69.9988 58.7383 70.1036 58.14 70.31 57.2335 70.6128 56.416 71.135 55.76 71.83 55.6354 71.9993 55.5406 72.1887 55.48 72.39L54.48 76.11 53.48 72.42C53.4265 72.214 53.3274 72.0226 53.19 71.86 52.5278 71.1748 51.712 70.6572 50.81 70.35 50.2349 70.1177 49.6203 69.9989 49 70 48.3672 70.0005 47.7388 70.1052 47.14 70.31 46.2353 70.6105 45.4205 71.1331 44.77 71.83 44.6384 71.9964 44.54 72.1865 44.48 72.39L43.5 76 42.5 72.38C42.4408 72.1742 42.3386 71.9833 42.2 71.82 41.5421 71.1344 40.7294 70.6165 39.83 70.31 39.2455 70.0905 38.6242 69.9853 38 70 37.367 69.9988 36.7383 70.1036 36.14 70.31 35.2336 70.6128 34.416 71.135 33.76 71.83 33.6354 71.9993 33.5407 72.1887 33.48 72.39L32.48 76.11 31.48 72.42C31.4265 72.214 31.3274 72.0226 31.19 71.86 30.5278 71.1748 29.712 70.6572 28.81 70.35 28.2349 70.1177 27.6203 69.9989 27 70 26.3672 70.0005 25.7388 70.1052 25.14 70.31 24.2353 70.6105 23.4205 71.1331 22.77 71.83 22.6384 71.9964 22.54 72.1865 22.48 72.39L21.5 76 20.5 72.38C20.4408 72.1742 20.3386 71.9833 20.2 71.82 19.5421 71.1344 18.7294 70.6165 17.83 70.31 17.2454 70.0905 16.6242 69.9853 16 70 15.367 69.9988 14.7384 70.1036 14.14 70.31 13.2336 70.6128 12.416 71.135 11.76 71.83 11.6354 71.9993 11.5407 72.1887 11.48 72.39L9.55 79.66C9.44187 80.2016 9.79325 80.7283 10.3349 80.8364 10.8301 80.9353 11.3213 80.6494 11.48 80.17L13 74.44 13 77.58 11.28 84 13 84 13 92 15 92 15 84 17 84 17 92 19 92 19 84 20.72 84 19 77.58 19 74.37 20.53 80.17C20.6643 80.7057 21.2074 81.0312 21.7431 80.8969 22.1009 80.8072 22.3803 80.5278 22.47 80.17L24 74.37 24 92 26 92 26 81 28 81 28 92 30 92 30 74.43 31.52 80.17C31.52 80.7223 31.9677 81.17 32.52 81.17 33.0723 81.17 33.52 80.7223 33.52 80.17L35 74.43 35 77.58 33.28 84 35 84 35 92 37 92 37 84 39 84 39 92 41 92 41 84 42.72 84 41 77.58 41 74.37 42.53 80.17C42.6643 80.7057 43.2074 81.0312 43.7431 80.8969 44.1009 80.8072 44.3803 80.5278 44.47 80.17L46 74.37 46 92 48 92 48 81 50 81 50 92 52 92 52 74.43 53.52 80.17C53.52 80.7223 53.9677 81.17 54.52 81.17 55.0723 81.17 55.52 80.7223 55.52 80.17L57 74.43 57 77.58 55.28 84 57 84 57 92 59 92 59 84 61 84 61 92 63 92 63 84 64.72 84 63 77.58 63 74.37 64.53 80.17C64.6643 80.7057 65.2074 81.0312 65.7431 80.8969 66.1009 80.8072 66.3803 80.5278 66.47 80.17L68 74.37 68 92 70 92 70 81 72 81 72 92 74 92 74 74.43 75.52 80.17C75.52 80.7223 75.9677 81.17 76.52 81.17 77.0723 81.17 77.52 80.7223 77.52 80.17L79 74.43 79 77.58 77.28 84 79 84 79 92 81 92 81 84 83 84 83 92 85 92 85 84 86.72 84 85 77.58 85 74.37 86.53 80.17C86.6507 80.6192 87.0651 80.9259 87.53 80.91 88.0821 80.8945 88.517 80.4343 88.5015 79.8822 88.4993 79.8072 88.4888 79.7327 88.47 79.66Z'/%3E%3Cpath d='M71 39C72.3807 39 73.5 37.8807 73.5 36.5 73.5 35.1193 72.3807 34 71 34 69.6193 34 68.5 35.1193 68.5 36.5 68.5 37.8807 69.6193 39 71 39Z'/%3E%3Cpath d='M49 39C50.3807 39 51.5 37.8807 51.5 36.5 51.5 35.1193 50.3807 34 49 34 47.6193 34 46.5 35.1193 46.5 36.5 46.5 37.8807 47.6193 39 49 39Z'/%3E%3Cpath d='M60 39C61.3807 39 62.5 37.8807 62.5 36.5 62.5 35.1193 61.3807 34 60 34 58.6193 34 57.5 35.1193 57.5 36.5 57.5 37.8807 58.6193 39 60 39Z'/%3E%3Cpath d='M27 39C28.3807 39 29.5 37.8807 29.5 36.5 29.5 35.1193 28.3807 34 27 34 25.6193 34 24.5 35.1193 24.5 36.5 24.5 37.8807 25.6193 39 27 39Z'/%3E%3Cpath d='M38 39C39.3807 39 40.5 37.8807 40.5 36.5 40.5 35.1193 39.3807 34 38 34 36.6193 34 35.5 35.1193 35.5 36.5 35.5 37.8807 36.6193 39 38 39Z'/%3E%3Cpath d='M77.45 49.66 75.52 42.38C75.4665 42.174 75.3674 41.9826 75.23 41.82 74.5678 41.1348 73.752 40.6172 72.85 40.31 72.2597 40.0863 71.631 39.9809 71 40 70.3672 40.0005 69.7388 40.1052 69.14 40.31 68.2353 40.6105 67.4205 41.1331 66.77 41.83 66.6384 41.9964 66.54 42.1865 66.48 42.39L65.5 46 64.5 42.38C64.4408 42.1742 64.3386 41.9833 64.2 41.82 63.5421 41.1343 62.7294 40.6165 61.83 40.31 61.2454 40.0905 60.6242 39.9853 60 40 59.367 39.9988 58.7383 40.1036 58.14 40.31 57.2335 40.6128 56.416 41.135 55.76 41.83 55.6354 41.9993 55.5406 42.1887 55.48 42.39L54.48 46.11 53.48 42.42C53.4265 42.214 53.3274 42.0226 53.19 41.86 52.5278 41.1748 51.712 40.6572 50.81 40.35 50.2349 40.1177 49.6203 39.9989 49 40 48.3672 40.0005 47.7388 40.1052 47.14 40.31 46.2353 40.6105 45.4205 41.1331 44.77 41.83 44.6384 41.9964 44.54 42.1865 44.48 42.39L43.5 46 42.5 42.38C42.4408 42.1742 42.3386 41.9833 42.2 41.82 41.5421 41.1343 40.7294 40.6165 39.83 40.31 39.2455 40.0905 38.6242 39.9853 38 40 37.367 39.9988 36.7383 40.1036 36.14 40.31 35.2336 40.6128 34.416 41.135 33.76 41.83 33.6354 41.9993 33.5407 42.1887 33.48 42.39L32.48 46.11 31.48 42.42C31.4265 42.214 31.3274 42.0226 31.19 41.86 30.5278 41.1748 29.712 40.6572 28.81 40.35 28.2349 40.1177 27.6203 39.9989 27 40 26.3672 40.0005 25.7388 40.1052 25.14 40.31 24.2353 40.6105 23.4205 41.1331 22.77 41.83 22.6384 41.9964 22.54 42.1865 22.48 42.39L20.54 49.7C20.4003 50.2328 20.7177 50.7783 21.25 50.92L21.51 50.92C21.9749 50.9359 22.3893 50.6292 22.51 50.18L24 44.37 24 62 26 62 26 51 28 51 28 62 30 62 30 44.43 31.52 50.17C31.52 50.7223 31.9677 51.17 32.52 51.17 33.0723 51.17 33.52 50.7223 33.52 50.17L35 44.43 35 47.58 33.28 54 35 54 35 62 37 62 37 54 39 54 39 62 41 62 41 54 42.72 54 41 47.58 41 44.37 42.53 50.17C42.6643 50.7057 43.2074 51.0312 43.7431 50.8969 44.1009 50.8072 44.3803 50.5278 44.47 50.17L46 44.37 46 62 48 62 48 51 50 51 50 62 52 62 52 44.43 53.52 50.17C53.52 50.7223 53.9677 51.17 54.52 51.17 55.0723 51.17 55.52 50.7223 55.52 50.17L57 44.43 57 47.58 55.28 54 57 54 57 62 59 62 59 54 61 54 61 62 63 62 63 54 64.72 54 63 47.58 63 44.37 64.53 50.17C64.6643 50.7057 65.2074 51.0312 65.7431 50.8969 66.1009 50.8072 66.3803 50.5278 66.47 50.17L68 44.37 68 62 70 62 70 51 72 51 72 62 74 62 74 44.43 75.52 50.17C75.6407 50.6192 76.0551 50.9259 76.52 50.91 76.6064 50.9198 76.6936 50.9198 76.78 50.91 77.3091 50.7518 77.6098 50.1946 77.4516 49.6655 77.4511 49.6636 77.4506 49.6618 77.45 49.66Z'/%3E%3Cpath d='M49 9C50.3807 9 51.5 7.88071 51.5 6.5 51.5 5.11929 50.3807 4 49 4 47.6193 4 46.5 5.11929 46.5 6.5 46.5 7.88071 47.6193 9 49 9Z'/%3E%3Cpath d='M60 9C61.3807 9 62.5 7.88071 62.5 6.5 62.5 5.11929 61.3807 4 60 4 58.6193 4 57.5 5.11929 57.5 6.5 57.5 7.88071 58.6193 9 60 9Z'/%3E%3Cpath d='M38 9C39.3807 9 40.5 7.88071 40.5 6.5 40.5 5.11929 39.3807 4 38 4 36.6193 4 35.5 5.11929 35.5 6.5 35.5 7.88071 36.6193 9 38 9Z'/%3E%3Cpath d='M66.47 19.66 64.54 12.38C64.4808 12.1742 64.3786 11.9833 64.24 11.82 63.5821 11.1344 62.7694 10.6165 61.87 10.31 61.2729 10.0854 60.6376 9.98012 60 10 59.367 9.99879 58.7383 10.1036 58.14 10.31 57.2336 10.6128 56.416 11.135 55.76 11.83 55.6354 11.9993 55.5407 12.1887 55.48 12.39L54.48 16.11 53.48 12.42C53.4265 12.214 53.3274 12.0226 53.19 11.86 52.5278 11.1748 51.712 10.6572 50.81 10.35 50.2349 10.1177 49.6203 9.99887 49 10 48.3672 10.0005 47.7388 10.1052 47.14 10.31 46.2353 10.6105 45.4205 11.1331 44.77 11.83 44.6384 11.9964 44.54 12.1865 44.48 12.39L43.5 16 42.5 12.38C42.4408 12.1742 42.3386 11.9833 42.2 11.82 41.5421 11.1344 40.7294 10.6165 39.83 10.31 39.2455 10.0905 38.6242 9.98531 38 10 37.367 9.99879 36.7383 10.1036 36.14 10.31 35.2336 10.6128 34.416 11.135 33.76 11.83 33.6354 11.9993 33.5407 12.1887 33.48 12.39L31.54 19.7C31.4003 20.2328 31.7177 20.7783 32.25 20.92 32.3364 20.9298 32.4236 20.9298 32.51 20.92 32.9749 20.9359 33.3893 20.6292 33.51 20.18L35 14.43 35 17.58 33.28 24 35 24 35 32 37 32 37 24 39 24 39 32 41 32 41 24 42.72 24 41 17.58 41 14.37 42.53 20.17C42.6643 20.7057 43.2074 21.0312 43.7431 20.8969 44.1009 20.8072 44.3803 20.5278 44.47 20.17L46 14.37 46 32 48 32 48 21 50 21 50 32 52 32 52 14.43 53.52 20.17C53.52 20.7223 53.9677 21.17 54.52 21.17 55.0723 21.17 55.52 20.7223 55.52 20.17L57 14.43 57 17.58 55.28 24 57 24 57 32 59 32 59 24 61 24 61 32 63 32 63 24 64.72 24 63 17.58 63 14.37 64.53 20.17C64.6507 20.6192 65.0651 20.9259 65.53 20.91L65.79 20.91C66.3206 20.7569 66.6267 20.2026 66.4735 19.6719 66.4724 19.668 66.4712 19.664 66.47 19.66Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--users-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Ccircle cx='24' cy='30.8' r='9'/%3E%3Ccircle cx='72' cy='30.8' r='9'/%3E%3Cpath d='M66 74.2 66 65.2C66 63.8 65.4 62.4 64.2 61.6 61.8 59.6 58.6 58.2 55.4 57.4 53.2 56.8 50.6 56.2 48 56.2 45.6 56.2 43 56.6 40.6 57.4 37.4 58.2 34.4 59.8 31.8 61.6 30.6 62.6 30 63.8 30 65.2L30 74.2 66 74.2Z'/%3E%3Ccircle cx='48' cy='44.8' r='9'/%3E%3Cpath d='M88.2 47.6C85.8 45.6 82.6 44.2 79.4 43.4 77.2 42.8 74.6 42.2 72 42.2 69.6 42.2 67 42.6 64.6 43.4 63.4 43.8 62.2 44.2 61 44.8L61 45C61 48.4 59.6 51.6 57.4 53.8 61.2 55 64.2 56.6 66.6 58.4 67.2 59 67.8 59.4 68.2 60.2L90 60.2 90 51.2C90 49.8 89.4 48.4 88.2 47.6Z'/%3E%3Cpath d='M29.4 58.4 29.4 58.4C32.2 56.4 35.4 54.8 38.6 53.8 36.4 51.4 35 48.4 35 45 35 44.8 35 44.8 35 44.6 33.8 44.2 32.6 43.6 31.4 43.4 29.2 42.8 26.6 42.2 24 42.2 21.6 42.2 19 42.6 16.6 43.4 13.4 44.4 10.4 45.8 7.8 47.6 6.6 48.4 6 49.8 6 51.2L6 60.2 27.6 60.2C28.2 59.4 28.6 59 29.4 58.4Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--backpack-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M48 10C53 10 57 14 57 19L39 19C39 14 43 10 48 10ZM28 38C28 39.1 28.9 40 30 40L44 40 44 38C44 36.9 44.9 36 46 36L50 36C51.1 36 52 36.9 52 38L52 40 66 40C67.1 40 68 39.1 68 38L68 19 63 19C63 10.7 56.3 4 48 4 39.7 4 33 10.7 33 19L28 19 28 38Z'/%3E%3Cpath d='M62.7 69 33.3 69C32.6 69 32 69.6 32 70.3L32 84 64 84 64 70.3C64 69.6 63.4 69 62.7 69L62.7 69Z'/%3E%3Cpath d='M78 51 76 51 76 27C76 24.1 74.5 21.5 72 20.1L72 38C72 41.3 69.3 44 66 44L52 44 52 46C52 47.1 51.1 48 50 48L46 48C44.9 48 44 47.1 44 46L44 44 30 44C26.7 44 24 41.3 24 38L24 20.1C21.5 21.5 20 24.2 20 27L20 51 18 51C15.8 51 14 52.8 14 55L14 71C14 73.2 15.8 75 18 75L20 75 20 80C20 82.2 21.8 84 24 84L28 84 28 70.3C28 67.4 30.4 65 33.3 65L62.8 65C65.7 65 68.1 67.4 68.1 70.3L68.1 84 72.1 84C74.3 84 76.1 82.2 76.1 80L76.1 75 78.1 75C80.3 75 82.1 73.2 82.1 71L82.1 55C82 52.8 80.2 51 78 51Z'/%3E%3C/svg%3E"); }
/* Red section (impact numbers): white text on brand red is 4.65:1 (AA) */
#page-cvpa .q-section--red-cvpa { --text: var(--white); --text-muted: var(--white); --rule: rgba(255, 255, 255, 0.35); --focus: var(--white); background: var(--accent); color: var(--white); }
#page-cvpa .q-section--red-cvpa .q-title-cvpa span { color: var(--black); }
/* Photo cards on red: white cards with dark text and a black top bar (red would vanish on red) */
#page-cvpa .q-section--red-cvpa .al-card-cvpa { --text: var(--black); --text-muted: #3d3d3d; --focus: var(--black); background: var(--white); color: var(--text); border-top-color: var(--black); }
#page-cvpa .q-section--red-cvpa .al-card-link-cvpa:focus-visible { outline-color: var(--white); }
/* The big alumni number and the line under it */
#page-cvpa .al-stat-cvpa { margin: 0 auto clamp(2.5rem, 5vw, 3.5rem); text-align: center; }
#page-cvpa .al-stat__number-cvpa { display: block; font-weight: 900; font-size: calc((clamp(3.6rem, 8vw, 6.5rem)) * var(--ds-l)); line-height: 1; color: var(--accent); }
#page-cvpa .al-stat__label-cvpa { display: block; margin-top: 0.4rem; font-weight: 800; font-size: 1.15rem; letter-spacing: 0.12em; text-transform: uppercase; }
#page-cvpa .al-stat__note-cvpa { margin: 0.6rem auto 0; max-width: 40rem; font-style: italic; font-size: var(--fs-lede); color: var(--text-muted); }
#page-cvpa .al-community-cvpa { margin: 0 auto; max-width: 40rem; text-align: center; font-weight: 700; font-size: var(--fs-lede); line-height: 1.5; }
/* Alumni in action: square portraits across the top of each card (alumni photos are always square, never round) */
#page-cvpa .al-people-cvpa { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .al-person-cvpa { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; margin: 0; padding: clamp(1.5rem, 2.5vw, 2rem) 1.25rem; background: var(--card); border-top: 4px solid var(--accent); text-align: center; }
#page-cvpa .al-person__photo-cvpa { margin: 0 0 0.75rem; width: 100%; aspect-ratio: 1 / 1; overflow: hidden; }
#page-cvpa .al-person__photo-cvpa img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 25%); }
#page-cvpa .al-person__name-cvpa { margin: 0; font-weight: 800; font-size: 1.2rem; }
#page-cvpa .al-person__degree-cvpa { margin: 0; font-weight: 700; font-size: var(--fs-card); color: var(--text-muted); }
#page-cvpa .al-person-cvpa .text-link-cvpa { margin-top: 0.6rem; }
/* Impact by the numbers */
#page-cvpa .al-numbers-cvpa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; list-style: none; text-align: center; }
#page-cvpa .al-number-cvpa { margin: 0; padding: 1.25rem 0.75rem; border-top: 3px solid var(--white); }
#page-cvpa .al-number__value-cvpa { display: block; font-weight: 900; font-size: calc((clamp(3rem, 6vw, 5rem)) * var(--ds-l)); line-height: 1; }
#page-cvpa .al-number__label-cvpa { display: block; margin-top: 0.6rem; font-weight: 800; font-size: 0.95rem; letter-spacing: 0.1em; text-transform: uppercase; }
#page-cvpa .al-period-cvpa { margin: 0.5rem 0 0; font-style: italic; font-size: var(--fs-lede); }
/* A connection that continues: four steps joined by a line */
#page-cvpa .al-journey-cvpa { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none; text-align: center; }
#page-cvpa .al-journey-cvpa::before { content: ""; position: absolute; top: 3rem; left: 12.5%; right: 12.5%; height: 3px; background: var(--accent); }
#page-cvpa .al-step-cvpa { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1rem; margin: 0; }
#page-cvpa .al-step__icon-cvpa { display: grid; place-items: center; width: 6rem; height: 6rem; border-radius: 50%; background: var(--black); border: 3px solid var(--accent); }
#page-cvpa .al-step__icon-cvpa .al-icon-cvpa { width: 3rem; height: 3rem; }
#page-cvpa .al-step__label-cvpa { font-weight: 800; font-size: 1.1rem; letter-spacing: 0.06em; text-transform: uppercase; }
/* Photo beside text (Just graduated?) */
#page-cvpa .al-split-cvpa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
#page-cvpa .al-split__media-cvpa { margin: 0; max-width: 37.375rem; border-bottom: 4px solid var(--accent); }
#page-cvpa .al-split__media-cvpa img { display: block; width: 100%; height: auto; }
/* Photo on the right instead (text first): Connect with us */
#page-cvpa .al-split--reverse-cvpa { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); }
#page-cvpa .al-split--reverse-cvpa .al-split__media-cvpa { justify-self: end; }
#page-cvpa .al-subtitle-cvpa { margin: 1.25rem 0 0; font-weight: 800; font-size: 1.25rem; line-height: 1.3; }
/* Social links */
#page-cvpa .al-social-cvpa { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: clamp(1.75rem, 3.5vw, 2.5rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .al-social-cvpa .icon-cvpa { width: 1.15rem; height: 1.15rem; }
@media (max-width: 1000px) {
  #page-cvpa .al-split-cvpa, #page-cvpa .al-split--reverse-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .al-split--reverse-cvpa .al-split__media-cvpa { justify-self: start; }
  #page-cvpa .al-people-cvpa { grid-template-columns: 1fr; max-width: 26rem; }
  #page-cvpa .al-numbers-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .al-journey-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem; }
  #page-cvpa .al-journey-cvpa::before { display: none; }
}
/* ===========================================================================
   PART 9c - NEXT STAGE (college/alumni-give/next-stage)
   The alumni career panel page, built from the PART 9 and 9b alumni pieces.
   Adds: four icons from the Next Stage document, the event details, the early RSVP perk, panelist job lines, the
   student questions, the five student years and the "coming soon" guide.
   =========================================================================== */
#page-cvpa .al-icon--usersline-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M24 40.005C28.9706 40.005 33 35.9756 33 31.005 33 26.0344 28.9706 22.005 24 22.005 19.0294 22.005 15 26.0344 15 31.005 15 35.9756 19.0294 40.005 24 40.005ZM24 24C27.866 24 31 27.134 31 31 31 34.866 27.866 38 24 38 20.134 38 17 34.866 17 31 17.005 27.1361 20.1361 24.005 24 24Z'/%3E%3Cpath d='M72 40.005C76.9706 40.005 81 35.9756 81 31.005 81 26.0344 76.9706 22.005 72 22.005 67.0294 22.005 63 26.0344 63 31.005 63 35.9756 67.0294 40.005 72 40.005ZM72 24C75.866 24 79 27.134 79 31 79 34.866 75.866 38 72 38 68.134 38 65 34.866 65 31 65.005 27.1361 68.1361 24.005 72 24Z'/%3E%3Cpath d='M87.9 47.489C85.3512 45.5014 82.4007 44.0918 79.253 43.358 76.8966 42.6543 74.4582 42.2616 72 42.19 69.5433 42.1925 67.1026 42.5851 64.769 43.353 63.1098 43.7825 61.5034 44.3946 59.979 45.178 59.9545 46.0005 59.8446 46.8182 59.651 47.618 61.4293 46.5838 63.3393 45.7947 65.329 45.272 67.4823 44.5645 69.7334 44.1994 72 44.19 74.2861 44.2637 76.553 44.6334 78.744 45.29 81.6246 45.9523 84.3251 47.2374 86.656 49.055L86.742 49.119C87.5645 49.712 88.0365 50.6767 88 51.69L88 59.19 90 59.19 90 51.69C90.0365 50.0288 89.2506 48.4567 87.9 47.489Z'/%3E%3Cpath d='M36.307 47.463C36.125 46.6727 36.0244 45.8658 36.007 45.055 34.481 44.3345 32.888 43.7651 31.251 43.355 28.8951 42.6525 26.4574 42.2608 24 42.19 21.5433 42.1925 19.1026 42.5851 16.769 43.353 13.6391 44.2064 10.6892 45.6188 8.062 47.522 6.76825 48.5178 6.00955 50.0574 6.008 51.69L6.008 59.19 8.008 59.19 8.008 51.69C8.00987 50.681 8.47789 49.7294 9.276 49.112 11.7094 47.3588 14.4386 46.058 17.333 45.272 19.4851 44.5649 21.7348 44.1998 24 44.19 26.2861 44.2637 28.553 44.6335 30.744 45.29 32.686 45.766 34.5565 46.4967 36.307 47.463Z'/%3E%3Cpath d='M63.9 61.3C61.3514 59.3121 58.4008 57.9025 55.253 57.169 52.8965 56.4654 50.4582 56.0725 48 56 45.544 56.0024 43.1039 56.395 40.771 57.163 37.6408 58.0158 34.6909 59.4282 32.064 61.332 30.7661 62.3255 30.0035 63.8655 30 65.5L30 73 32 73 32 65.5C32.0018 64.4907 32.4703 63.539 33.269 62.922 35.7018 61.1684 38.4308 59.8676 41.325 59.082 43.4796 58.3741 45.7321 58.009 48 58 50.2865 58.0733 52.5537 58.443 54.745 59.1 57.6254 59.7614 60.3258 61.0462 62.656 62.864L62.742 62.928C63.5647 63.5214 64.0366 64.4864 64 65.5L64 73 66 73 66 65.5C66.0362 63.8392 65.2504 62.2675 63.9 61.3Z'/%3E%3Cpath d='M48 53.815C52.9706 53.815 57 49.7856 57 44.815 57 39.8444 52.9706 35.815 48 35.815 43.0294 35.815 39 39.8444 39 44.815 39 49.7856 43.0294 53.815 48 53.815ZM48 37.815C51.866 37.815 55 40.949 55 44.815 55 48.681 51.866 51.815 48 51.815 44.134 51.815 41 48.681 41 44.815 41.0028 40.9493 44.1343 37.8155 48 37.81Z'/%3E%3C/g%3E%3C/svg%3E"); }
#page-cvpa .al-icon--stairs-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M70.347 53.073 70.347 59.073 77.105 59.073 59.226 76.951 63.468 81.194 81.347 63.315 81.347 70.073 87.347 70.073 87.347 53.073 70.347 53.073Z'/%3E%3Cpath d='M71.006 26.001 87.006 26.001 87.006 16.001 61.006 16.001 61.006 34.001 43.006 34.001 43.006 52.001 25.006 52.001 25.006 70.001 9.006 70.001 9.006 80.001 35.006 80.001 35.006 62.001 53.006 62.001 53.006 44.001 71.006 44.001 71.006 26.001Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--chat-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M84 31.009 58 31.009 58 24.009C57.9934 21.8026 56.2064 20.0156 54 20.009L12 20.009C9.7936 20.0156 8.00659 21.8026 8 24.009L8 51.017C8.00659 53.2234 9.7936 55.0104 12 55.017L18 55.017 18 65.017 28 55.017 38 55.017 38 62.017C38.0066 64.2234 39.7936 66.0104 42 66.017L68 66.017 78 76.017 78 66.017 84 66.017C86.2064 66.0104 87.9934 64.2234 88 62.017L88 35.01C87.994 32.8032 86.2068 31.0156 84 31.009ZM38 35.009 38 53.018 27.174 53.018 26.588 53.604 20 60.192 20 53.018 12 53.018C10.8954 53.018 10 52.1226 10 51.018L10 24.01C10 22.9054 10.8954 22.01 12 22.01L54 22.01C55.1046 22.01 56 22.9054 56 24.01L56 31.01 42 31.01C39.7936 31.0166 38.0066 32.8036 38 35.01ZM86 62.017C86 63.1216 85.1046 64.017 84 64.017L76 64.017 76 71.191 69.418 64.6 68.832 64.014 42 64.014C40.8954 64.014 40 63.1186 40 62.014L40 35.01C40 33.9054 40.8954 33.01 42 33.01L84 33.01C85.1046 33.01 86 33.9054 86 35.01Z'/%3E%3C/svg%3E"); }
#page-cvpa .al-icon--handshakeline-cvpa { --icon: url("data:image/svg+xml,%3Csvg viewBox='0 0 96 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M93.1 39.7 81.8 20.9 80.8 19.2 79.1 20.3 71.5 25C70.6 25.5 69.9 26.4 69.6 27.4 69.4 28.1 69.4 28.9 69.7 29.6 67.6 30.3 65.5 30.7 63.3 30.7 60.3 30.6 57.3 30.1 54.4 29.2 53 28.8 51.5 28.5 50 28.2L49.8 28.2 49.8 28.2C49.7 28.2 49.6 28.2 49.6 28.2L49.4 28.2 49.2 28.2C49 28.2 48.9 28.2 48.7 28.2L48.7 28.2C47 28.2 45.3 28.9 44.2 30.2L43.4 31.1C42.1 30.6 40.7 30.3 39.3 30.3 39 30.3 38.8 30.3 38.5 30.3 37.9 30.3 37.4 30.4 36.8 30.4 35.5 30.5 34.2 30.6 32.9 30.6 30.7 30.7 28.5 30.2 26.5 29.3 26.6 28.7 26.6 28.1 26.5 27.4 26.2 26.4 25.5 25.5 24.6 25L17.1 20.3 15.4 19.2 14.4 20.9 2.9 39.7 1.9 41.4 3.6 42.4 11.3 47.1C12.7 48 14.4 47.9 15.7 46.9L22.2 54.5 22.3 54.7 22.5 54.8 22.5 54.8 21.1 56.4C19.3 58.5 19.5 61.6 21.5 63.4L21.5 63.4 21.5 63.4C22.4 64.2 23.5 64.6 24.7 64.6 24.9 64.6 25.1 64.6 25.3 64.6 26 64.5 26.6 64.3 27.2 63.9 27.3 65.1 27.9 66.3 28.8 67.1L28.8 67.1 28.8 67.1C29.7 67.9 30.8 68.3 32 68.3 32.1 68.3 32.3 68.3 32.4 68.3 32.9 68.3 33.4 68.2 33.9 68 34 69.1 34.5 70.2 35.4 70.9L35.4 70.9 35.4 70.9C36.2 71.6 37.2 72 38.2 72 38.4 72 38.5 72 38.7 72 39.4 72 40 71.7 40.6 71.4 40.8 72.1 41.2 72.8 41.8 73.3 42.6 74 43.6 74.4 44.7 74.3L44.9 74.3 45.1 74.3C45.7 74.2 46.3 73.9 46.8 73.6L46.9 73.7 48.3 74.8 48.4 74.9 48.5 75C49.4 75.6 50.5 75.9 51.5 75.9 51.7 75.9 51.9 75.9 52.1 75.9 54.6 75.7 56.6 73.9 57.3 71.5 59.5 71.1 61.3 69.4 61.9 67.2 64.2 66.7 66 65 66.5 62.8 66.6 62.8 66.8 62.8 66.9 62.8 70.1 62.5 72.5 59.7 72.3 56.5 72.3 56.3 72.3 56 72.3 55.8L73.1 54.8 80 46.8C81.3 47.9 83.1 47.9 84.6 47L92.3 42.3 94 41.3 93.1 39.7ZM12.3 45.4 4.6 40.7 16 21.9 23.6 26.6C24.4 27 24.8 28 24.5 28.8L23.9 29.8 15.2 44.2 14.6 45.1C14.3 45.4 13.8 45.6 13.3 45.6 13 45.7 12.6 45.6 12.3 45.4ZM25.1 62.6C25 62.6 24.9 62.6 24.8 62.6 23.2 62.6 21.9 61.2 21.9 59.6 21.9 58.9 22.2 58.2 22.6 57.7L27.9 51.7C28.5 51.1 29.3 50.7 30.2 50.7 30.9 50.7 31.6 51 32.1 51.4 33.3 52.5 33.5 54.4 32.4 55.6L27.1 61.6C26.6 62.2 25.9 62.5 25.1 62.6ZM32.5 66.4C32.4 66.4 32.3 66.4 32.2 66.4 30.6 66.4 29.3 65 29.3 63.4 29.3 62.7 29.6 62 30 61.5L34.6 56.2C35.2 55.6 36 55.2 36.9 55.2 37.6 55.2 38.3 55.5 38.8 55.9 40 57 40.2 58.9 39.1 60.1L34.5 65.4C34 66 33.3 66.4 32.5 66.4L32.5 66.4ZM38.8 70.1C38.7 70.1 38.6 70.1 38.5 70.1 37.9 70.1 37.4 69.9 36.9 69.5 35.9 68.6 35.8 67 36.7 66L41.3 60.7C41.8 60.2 42.5 59.9 43.2 59.9 43.8 59.9 44.4 60.1 44.8 60.5 45.8 61.4 45.9 63 45 64L40.4 69.3C40 69.8 39.4 70.1 38.8 70.1L38.8 70.1ZM44.9 72.5C44.4 72.5 43.8 72.4 43.4 72 42.6 71.3 42.5 70 43.2 69.2L47.1 64.7C47.5 64.3 48 64 48.6 64 49.1 64 49.5 64.2 49.9 64.5 50.7 65.2 50.8 66.5 50.1 67.3L46.2 71.8C45.9 72.2 45.4 72.4 44.9 72.5L44.9 72.5ZM66.9 60.8C66.8 60.8 66.6 60.8 66.5 60.8 65.9 60.8 65.3 60.6 64.8 60.4 64.8 60.6 64.9 60.8 64.9 61 65.1 63.2 63.5 65.1 61.3 65.3 61.3 65.3 61.3 65.3 61.3 65.3 61 65.3 60.6 65.3 60.3 65.2L60.3 65.3C60.5 67.5 58.9 69.4 56.7 69.6 56.7 69.6 56.7 69.6 56.7 69.6 56.4 69.6 56 69.6 55.7 69.5L55.7 69.6C55.9 71.8 54.3 73.7 52.1 73.9 52.1 73.9 52.1 73.9 52.1 73.9 52 73.9 51.9 73.9 51.8 73.9 51.1 73.9 50.4 73.7 49.7 73.3L48.4 72.3 51.6 68.6C53 66.9 52.8 64.4 51.2 63 50.5 62.4 49.6 62 48.6 62 48.3 62 47.9 62 47.6 62.1 47.5 60.9 47 59.8 46.1 59 45.3 58.3 44.2 57.9 43.1 57.9L43.1 57.9C42.6 57.9 42.2 58 41.7 58.1 41.7 56.7 41.1 55.4 40 54.4 39.1 53.6 38 53.1 36.8 53.2L36.8 53.2C36.2 53.2 35.6 53.3 35 53.5 34.9 52.1 34.3 50.8 33.3 49.9 32.4 49.1 31.3 48.6 30.1 48.7L30.1 48.7C28.7 48.7 27.3 49.3 26.3 50.4L23.7 53.4 23.6 53.3 16.8 45.4 25.5 31C27.7 32.1 30.2 32.6 32.7 32.5 34.7 32.5 36.7 32.3 38.5 32.1 38.7 32.1 38.9 32.1 39.1 32.1 40 32.1 40.9 32.2 41.7 32.5L36.2 39C35.1 40.2 34.6 41.8 34.7 43.4 34.8 45 35.6 46.4 36.8 47.5L36.8 47.5 36.8 47.5C37.9 48.4 39.3 48.9 40.7 48.9 40.9 48.9 41 48.9 41.2 48.9 42.8 48.8 44.3 48 45.3 46.8L52.1 39 52.1 39 53.2 40 69.3 53.8C70 54.4 70.4 55.4 70.4 56.3 70.4 56.4 70.4 56.7 70.4 56.7 70.6 58.8 69 60.6 66.9 60.8 66.9 60.8 66.9 60.8 66.9 60.8ZM71.8 53.5C71.5 53 71.1 52.6 70.7 52.2L52 36.1 43.8 45.5C43.1 46.3 42.2 46.8 41.1 46.9 41 46.9 40.9 46.9 40.8 46.9 39.8 46.9 38.9 46.5 38.1 45.9 36.4 44.5 36.2 42.1 37.6 40.4 37.6 40.4 37.7 40.3 37.7 40.3L45.6 31.3C46.4 30.4 47.5 30 48.6 30 48.7 30 48.8 30 49 30 49.2 30 49.3 30.1 49.5 30.1 54.1 31 58.3 32.6 63.2 32.6 65.7 32.6 68.2 32.2 70.5 31.3L76.3 40.7 79 45.2 71.8 53.5ZM83.7 45.4C83.4 45.6 83 45.7 82.7 45.7 82.2 45.7 81.7 45.5 81.3 45.1L80.7 44.1 78 39.7 71.7 29.3C71.1 28.4 71.4 27.3 72.2 26.7 72.3 26.7 72.3 26.6 72.4 26.6L80.1 21.9 91.4 40.7 83.7 45.4Z'/%3E%3C/svg%3E"); }
/* Hero: two introduction paragraphs */
#page-cvpa .page-hero-cvpa .lede-cvpa + .lede-cvpa { margin-top: 1rem; }
/* Date, time and place */
#page-cvpa .ns-event-cvpa { display: flex; flex-wrap: wrap; gap: 0.6rem 1.75rem; margin: clamp(1.25rem, 3vh, 1.75rem) 0 0; padding: 0; list-style: none; font-weight: 800; font-size: 1.1rem; letter-spacing: 0.04em; text-transform: uppercase; }
#page-cvpa .ns-event-cvpa li { display: inline-flex; align-items: center; gap: 0.55rem; }
#page-cvpa .ns-event-cvpa .icon-cvpa { width: 1.3rem; height: 1.3rem; color: var(--accent); }
/* Early RSVP perk */
#page-cvpa .ns-perk-cvpa { max-width: 34rem; margin: 1.5rem 0 0; padding: 0.15rem 0 0.15rem 1rem; border-left: 4px solid var(--accent); font-size: var(--fs-card); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .ns-perk-cvpa strong { color: var(--text); }
/* Panelists: job, employer and career path under the degree */
#page-cvpa .ns-person__role-cvpa { margin: 0.5rem 0 0; font-weight: 700; }
#page-cvpa .ns-person__org-cvpa { margin: 0; color: var(--text-muted); }
#page-cvpa .ns-person__path-cvpa { margin: 0.75rem 0 0; padding-top: 0.75rem; border-top: 2px solid var(--accent); font-style: italic; color: var(--text-muted); }
/* Student questions (red section): black quote cards */
#page-cvpa .ns-questions-cvpa { display: grid; gap: 0.75rem; max-width: 52rem; margin: clamp(2rem, 4vw, 2.75rem) 0; padding: 0; list-style: none; }
#page-cvpa .ns-questions-cvpa li { display: flex; align-items: flex-start; gap: 1rem; margin: 0; padding: 1.1rem 1.4rem; background: var(--black); color: var(--white); font-weight: 800; font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.35; }
#page-cvpa .ns-questions-cvpa .icon-cvpa { width: 1.6rem; height: 1.2rem; margin-top: 0.2rem; color: var(--accent); }
/* Your career doesn't start senior year: five steps joined by a red line */
#page-cvpa .ns-years-cvpa { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .ns-years-cvpa li { display: flex; flex-direction: column; gap: 0.6rem; margin: 0; padding: 1.25rem 0 0; border-top: 4px solid var(--accent); }
#page-cvpa .ns-year__label-cvpa { font-weight: 900; font-size: 1.15rem; letter-spacing: 0.06em; text-transform: uppercase; }
#page-cvpa .ns-year__text-cvpa { font-size: var(--fs-card); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .ns-closing-cvpa { margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; font-style: italic; font-weight: 700; font-size: var(--fs-lede); }
/* Coming soon: the TCVPA Career Resource Guide */
#page-cvpa .ns-soon-cvpa { display: flex; align-items: center; gap: clamp(1rem, 2.5vw, 1.75rem); max-width: 46rem; margin: clamp(2rem, 4vw, 2.75rem) 0 0; padding: clamp(1.5rem, 3vw, 2rem); background: var(--card); border-left: 6px solid var(--accent); }
#page-cvpa .ns-soon-cvpa .al-icon-cvpa { width: 3.5rem; height: 3.5rem; }
#page-cvpa .ns-soon__label-cvpa { margin: 0; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: var(--accent-text, #c40600); }
#page-cvpa .ns-soon__title-cvpa { margin: 0.35rem 0 0; font-weight: 900; font-size: clamp(1.35rem, 2.4vw, 1.8rem); line-height: 1.15; }
#page-cvpa .ns-soon__text-cvpa { margin: 0.4rem 0 0; color: var(--text-muted); }
/* RSVP band: label above the title, event details and perk centred in white */
#page-cvpa .ns-cta__eyebrow-cvpa { margin: 0 0 1rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
#page-cvpa .ns-cta-cvpa .cta__title-cvpa span { color: var(--black); }
#page-cvpa .ns-cta-cvpa .ns-event-cvpa { justify-content: center; margin-top: 1.5rem; }
#page-cvpa .ns-cta-cvpa .ns-event-cvpa .icon-cvpa { color: var(--white); }
#page-cvpa .ns-cta-cvpa .ns-perk-cvpa { margin: 1.75rem auto 0; padding: 0; border: 0; color: var(--white); }
#page-cvpa .ns-cta-cvpa .ns-perk-cvpa strong { color: var(--white); }
@media (max-width: 1000px) {
  #page-cvpa .ns-years-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem; }
}
@media (max-width: 600px) {
  #page-cvpa .ns-years-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .ns-soon-cvpa { flex-direction: column; align-items: flex-start; }
}/* ===========================================================================
   PART 10 - REUNION / EVENT PAGES (e.g. music/community/100-year-choir)
   Built on PART 4 (page hero, sections, photo carousel, advisor block), PART 7
   (accordion, used here for the FAQs) and PART 9 (alumni cards, split layout,
   social links); the hero date and place reuse the PART 9c event line. Adds:
   jump buttons, a carousel that shows archive photos whole, director
   portraits, the three-day schedule, the registration fees and checklist, hotel
   cards and the closing photo band.
   =========================================================================== */
/* Hero: jump buttons to the main sections */
#page-cvpa .ev-jump-cvpa { gap: 0.6rem; }
#page-cvpa .ev-jump-cvpa .btn-cvpa { min-height: 44px; padding: 0 1.1rem; font-size: 0.95rem; }
#page-cvpa .ev-text-cvpa { margin-top: 1.5rem; }
/* archive photos come in many shapes: the carousel shows each one whole in a 3:2 frame on the black section (no cropping) */
#page-cvpa .ev-carousel-cvpa .carousel__figure-cvpa img { aspect-ratio: 3 / 2; object-fit: contain; background: var(--black); }
#page-cvpa .ev-crop-cvpa img { aspect-ratio: 3 / 2; object-fit: cover; object-position: var(--pos, center); }
#page-cvpa .ev-carousel-cvpa .carousel__btn-cvpa { border-color: var(--white); }
/* Directors: square portraits */
#page-cvpa .ev-directors-cvpa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .ev-director-cvpa { margin: 0; }
#page-cvpa .ev-director__photo-cvpa { margin: 0 0 0.9rem; aspect-ratio: 1 / 1; overflow: hidden; border-bottom: 4px solid var(--accent); background: #1c1c1c; }
#page-cvpa .ev-director__photo-cvpa img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
#page-cvpa .ev-director__name-cvpa { margin: 0; font-weight: 800; font-size: 1.2rem; }
#page-cvpa .ev-director__years-cvpa { margin: 0.2rem 0 0; font-weight: 700; color: var(--text-muted); }
/* Weekend at a glance (red section): black day cards */
#page-cvpa .ev-days-cvpa { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin: clamp(2rem, 4vw, 3rem) 0; padding: 0; list-style: none; }
#page-cvpa .ev-day-cvpa { margin: 0; padding: clamp(1.4rem, 2.5vw, 2rem); background: var(--black); color: var(--white); }
#page-cvpa .ev-day__title-cvpa { display: flex; align-items: center; gap: 0.7rem; margin: 0 0 1.1rem; padding-bottom: 1rem; border-bottom: 3px solid var(--accent); font-weight: 900; font-size: 1.25rem; letter-spacing: 0.06em; text-transform: uppercase; }
#page-cvpa .ev-day__title-cvpa .icon-cvpa { width: 1.6rem; height: 1.6rem; color: var(--accent); }
#page-cvpa .ev-day__date-cvpa { white-space: nowrap; }
#page-cvpa .ev-day__list-cvpa { margin: 0; padding: 0; list-style: none; }
#page-cvpa .ev-day__list-cvpa li { margin: 0; padding: 0.7rem 0; border-top: 1px solid rgba(255, 255, 255, 0.18); font-size: var(--fs-card); line-height: 1.5; }
#page-cvpa .ev-day__list-cvpa li:first-child { border-top: 0; padding-top: 0; }
/* Registration: the fee beside what registration includes */
#page-cvpa .ev-register-cvpa { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); margin-top: clamp(2rem, 4vw, 3rem); }
#page-cvpa .ev-price__amount-cvpa { margin: 0; font-weight: 900; font-size: calc((clamp(4rem, 9vw, 7rem)) * var(--ds-l)); line-height: 1; color: var(--accent); }
#page-cvpa .ev-tiers-cvpa { margin: 1.5rem 0 0; }
#page-cvpa .ev-tier-cvpa { padding: 0.9rem 0; border-top: 1px solid var(--rule); }
#page-cvpa .ev-tier-cvpa dt { font-weight: 800; }
#page-cvpa .ev-tier-cvpa dd { margin: 0.2rem 0 0; color: var(--text-muted); }
/* tier typed as plain text in OU's editor (label<br>dates, no dl): first line bold, dates muted */
#page-cvpa div.ev-price-cvpa > div.ev-tier-cvpa { margin-top: 1.5rem; color: var(--text-muted); line-height: 1.7; }
#page-cvpa div.ev-price-cvpa > div.ev-tier-cvpa::first-line { font-weight: 800; color: var(--text); }
#page-cvpa .ev-price__note-cvpa { margin: 0.75rem 0 0; font-size: var(--fs-small); font-style: italic; color: var(--text-muted); }
#page-cvpa .ev-deadline-cvpa { max-width: 30rem; margin: 1.25rem 0 0; padding-left: 1rem; border-left: 4px solid var(--accent); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .ev-deadline-cvpa strong { color: var(--text); }
#page-cvpa .ev-includes-cvpa { padding: clamp(1.5rem, 3vw, 2.25rem); background: var(--card); border-top: 4px solid var(--accent); }
#page-cvpa .ev-includes__title-cvpa, #page-cvpa .ev-guest__title-cvpa, #page-cvpa .ev-extra__title-cvpa { margin: 0; font-weight: 900; font-size: 1.2rem; letter-spacing: 0.04em; text-transform: uppercase; }
#page-cvpa .ev-checklist-cvpa { margin: 1rem 0 0; padding: 0; list-style: none; }
#page-cvpa .ev-checklist-cvpa li { position: relative; margin: 0; padding: 0.45rem 0 0.45rem 2rem; line-height: 1.5; }
#page-cvpa .ev-checklist-cvpa li::before { content: ""; position: absolute; left: 0.35rem; top: 0.6rem; width: 0.45rem; height: 0.85rem; border: solid var(--accent); border-width: 0 3px 3px 0; transform: rotate(45deg); }
#page-cvpa .ev-guest-cvpa { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--rule); }
#page-cvpa .ev-guest-cvpa p, #page-cvpa .ev-extra-cvpa p { margin: 0.4rem 0 0; line-height: 1.6; color: var(--text-muted); }
/* Plan your stay: two hotel cards */
#page-cvpa .ev-hotels-cvpa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); max-width: 60rem; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 0; list-style: none; }
#page-cvpa .ev-hotel-cvpa .q-media-cvpa { aspect-ratio: 800 / 475; }
#page-cvpa .al-card__body-cvpa .ev-hotel__rates-cvpa { font-weight: 800; color: var(--text); }
#page-cvpa .ev-hotel-cvpa .actions-cvpa { margin-top: auto; padding-top: 0.75rem; }
#page-cvpa .ev-extra-cvpa { max-width: 46rem; margin-top: clamp(2rem, 4vw, 2.75rem); padding-left: 1rem; border-left: 4px solid var(--accent); }
/* FAQs: the PART 7 accordion without item numbers, questions in sentence case */
#page-cvpa .ev-faq-cvpa .hb-item__title-cvpa { text-transform: none; letter-spacing: 0; font-size: calc((clamp(1.4rem, 2.2vw, 1.85rem)) * var(--ds-m)); line-height: 1.25; }
#page-cvpa .ev-faq-cvpa .hb-item__body-cvpa { padding-left: 0.25rem; }
/* Closing band: photo above the line and the Register now button */
#page-cvpa .ev-closing__media-cvpa { max-width: 52rem; margin: 0 auto clamp(2rem, 4vw, 3rem); border-bottom: 4px solid var(--black); }
#page-cvpa .ev-closing__media-cvpa img { display: block; width: 100%; height: auto; }
#page-cvpa .ev-closing__title-cvpa { max-width: 22ch; margin: 0 auto; font-size: calc((clamp(2.2rem, 4.8vw, 4.2rem)) * var(--ds-l)); line-height: 1; text-wrap: balance; }
@media (max-width: 1000px) {
  #page-cvpa .ev-days-cvpa { grid-template-columns: 1fr; max-width: 34rem; }
  #page-cvpa .ev-register-cvpa { grid-template-columns: 1fr; }
}
@media (max-width: 800px) {
  #page-cvpa .ev-directors-cvpa, #page-cvpa .ev-hotels-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  #page-cvpa .ev-hotels-cvpa { grid-template-columns: 1fr; }
}
/* ===========================================================================
   PART 11 - RESEARCH PAGES (college/research, e.g. outreach-engagement)
   Built from PART 4 (sections, faculty cards, advisor block), PART 8 (events by
   discipline) and PART 9 (photo cards). Adds: a short heading band that leads
   straight into the events section below it.
   =========================================================================== */
#page-cvpa .ro-band-cvpa { padding-top: clamp(3rem, 6vw, 4.5rem); padding-bottom: clamp(2.25rem, 4.5vw, 3.25rem); }
/* Arts in action as ONE section (red): the events grid sits inside it on the same background, and a thin white
   border around each calendar column keeps the red-headed columns from blending into the background */
#page-cvpa .ro-action-cvpa #disc-events-cvpa { background: transparent; padding: 0; max-width: 84rem; margin: clamp(2rem, 4vw, 3rem) auto 0; }
#page-cvpa .ro-action-cvpa #disc-events-cvpa .disc-col-cvpa { box-shadow: 0 0 0 1px var(--white); }

/* ===========================================================================
   PART 12 - CALENDAR PAGES (<site>/calendar: the college and each school)
   Page hero, a school filter bar (college page), then one events section per month
   using the homepage event cards. main-cvpa.js sorts and groups the cards, drops past
   events, adds the live music feed and alternates the months white / light grey.
   =========================================================================== */
#page-cvpa .icon-calendar-cvpa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5'%3E%3Crect x='3.5' y='5' width='17' height='15.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E"); }
/* alumni events: black tag */
#page-cvpa .event-card__school--alumni-cvpa { background: var(--black); }
/* hidden cards and months stay hidden (cards are display: flex) */
#page-cvpa .event-card-cvpa[hidden], #page-cvpa .cal-month-cvpa[hidden], #page-cvpa .cal__empty-cvpa[hidden] { display: none; }

/* School icons on the event card tags (college calendar: .cal--icons-cvpa; homepage Upcoming events: .events-cvpa). Decorative: drawn with a CSS mask in
   the tag's text colour, so screen readers still read only the school name. One icon per school, the same on every card. */
#page-cvpa .cal--icons-cvpa .event-card__school-cvpa, #page-cvpa .events-cvpa .event-card__school-cvpa { display: inline-flex; align-items: center; gap: 0.45em; }
#page-cvpa .cal--icons-cvpa .event-card__school-cvpa::before, #page-cvpa .events-cvpa .event-card__school-cvpa::before {
  content: ""; flex: none; width: 1.3em; height: 1.3em;
  background: currentColor;
  -webkit-mask: var(--school-icon) center / contain no-repeat; mask: var(--school-icon) center / contain no-repeat;
}
@media (forced-colors: active) { #page-cvpa .cal--icons-cvpa .event-card__school-cvpa::before, #page-cvpa .events-cvpa .event-card__school-cvpa::before { background: CanvasText; } }
/* Art: palette */
#page-cvpa .event-card__school--art-cvpa { --school-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 3a9 9 0 0 0 0 18c.83 0 1.5-.67 1.5-1.5 0-.39-.15-.74-.39-1.01-.23-.26-.38-.61-.38-.99 0-.83.67-1.5 1.5-1.5H16c2.76 0 5-2.24 5-5 0-4.42-4.03-8-9-8zM6.5 12a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm3-4a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm5 0a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zm3 4a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3z'/%3E%3C/svg%3E"); }
/* Music: eighth note */
#page-cvpa .event-card__school--music-cvpa { --school-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3v10.55A4 4 0 1 0 14 17V7h4V3h-6z'/%3E%3C/svg%3E"); }
/* Theatre: drama mask */
#page-cvpa .event-card__school--theatre-cvpa { --school-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M4 3h16v8a8 8 0 0 1-16 0V3zm3.5 5.5a1.75 1.25 0 1 0 3.5 0 1.75 1.25 0 1 0-3.5 0zm5.5 0a1.75 1.25 0 1 0 3.5 0 1.75 1.25 0 1 0-3.5 0zM8 12.5h8a4 4 0 0 1-8 0z'/%3E%3C/svg%3E"); }
/* Dance: dancer in a leap (split jump, arms raised) */
#page-cvpa .event-card__school--dance-cvpa { --school-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='14.5' cy='3.6' r='2.1' fill='black' stroke='none'/%3E%3Cpath d='M13.6 7 11.2 12.4'/%3E%3Cpath d='M13.4 7.6 19.5 5.2M13.4 7.6 7.5 4.8'/%3E%3Cpath d='M11.2 12.4 16.8 13.6 22 12.2M11.2 12.4 6.4 15.6 2 15'/%3E%3C/svg%3E"); }
/* Alumni: graduation cap */
#page-cvpa .event-card__school--alumni-cvpa { --school-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 13.18v4L12 21l7-3.82v-4L12 17l-7-3.82zM12 3 1 9l11 6 9-4.91V17h2V9L12 3z'/%3E%3C/svg%3E"); }

/* filter bar under the hero: white */
#page-cvpa .cal-bar-cvpa { padding: clamp(2rem, 4vw, 3rem) var(--gutter) 0; background: var(--white); }
#page-cvpa .cal-bar__inner-cvpa {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem;
  max-width: 84rem; margin: 0 auto;
}
#page-cvpa .cal-bar__intro-cvpa { margin: 0; max-width: 46rem; font-size: var(--fs-lede); line-height: 1.55; color: var(--text-muted); }
#page-cvpa .cal__status-cvpa { margin: 0; font-size: var(--fs-small); font-weight: 700; color: var(--text-muted); }

/* months: white or light grey (the page script alternates them) */
#page-cvpa .cal-month-cvpa { padding-top: clamp(3rem, 6vw, 4.5rem); padding-bottom: clamp(3rem, 6vw, 4.5rem); }
#page-cvpa .events--white-cvpa { background: var(--white); }
#page-cvpa .events--gray-cvpa { background: #EDEDED; }
#page-cvpa .events--white-cvpa .feed__title-cvpa, #page-cvpa .events--gray-cvpa .feed__title-cvpa { color: var(--black); }
/* no rules beside the month name */
#page-cvpa .cal-month-cvpa .feed__head-cvpa::before, #page-cvpa .cal-month-cvpa .feed__head-cvpa::after { content: none; display: none; }
#page-cvpa .cal-month-cvpa .feed__head-cvpa { justify-content: center; }
#page-cvpa .events--white-cvpa .event-card-cvpa { box-shadow: 0 0 0 1px #d4d4d4; }
#page-cvpa .events--white-cvpa .event-card-cvpa, #page-cvpa .events--gray-cvpa .event-card-cvpa { --focus: var(--black); }
#page-cvpa .cal__empty-cvpa { margin: 0; padding: clamp(3rem, 6vw, 4.5rem) var(--gutter); text-align: center; font-size: var(--fs-lede); color: var(--text-muted); }

/* ===========================================================================
   PART 13 - PHOTO REEL (test on the college homepage, 2026-10-15)
   Black band: centred heading and intro with a short red bar, then five photo tiles.
   Each tile holds a few photos stacked on top of each other; main-cvpa.js fades one
   tile at a time to its next photo every few seconds. A Pause photos button stops it
   (WCAG 2.2.2), and with reduced motion turned on the photos never change.
   =========================================================================== */
#page-cvpa .reel-cvpa {
  --focus: var(--white);
  padding: clamp(4.5rem, 9vw, 7rem) var(--gutter);
  background: var(--black); color: var(--white);
}
#page-cvpa .reel__head-cvpa { max-width: 52rem; margin: 0 auto; text-align: center; }
#page-cvpa .reel__title-cvpa {
  margin: 0; font-weight: 900; line-height: 0.95;
  font-size: calc((clamp(3rem, 6.5vw, 5.75rem)) * var(--ds-l));
}
#page-cvpa .reel__title-cvpa span { color: var(--accent); }
#page-cvpa .reel__lede-cvpa {
  max-width: 40rem; margin: 1.25rem auto 0;
  font-size: var(--fs-lede); line-height: 1.6; color: rgba(255, 255, 255, 0.85);
}
/* short red bar under the intro */
#page-cvpa .reel__lede-cvpa::after { content: ""; display: block; width: 4.5rem; height: 4px; margin: 1.75rem auto 0; background: var(--accent); }
#page-cvpa .reel__grid-cvpa { max-width: 96rem; margin: clamp(2.5rem, 5vw, 3.5rem) auto 0; }
/* five tiles across; three on tablets, two on phones (the extra tiles are hidden there) */
#page-cvpa .reel__tiles-cvpa {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(0.5rem, 1vw, 1rem);
  margin: 0; padding: 0; list-style: none;
}
#page-cvpa .reel__tile-cvpa { margin: 0; }
#page-cvpa .reel__tile-cvpa::before { content: none; }
#page-cvpa .reel__media-cvpa { position: relative; margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: #1c1c1c; }
/* the photos in a tile sit on top of each other; only the current one shows */
#page-cvpa .reel__img-cvpa {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transition: opacity 1.2s ease;
}
#page-cvpa .reel__img-cvpa.is-on-cvpa { opacity: 1; }
#page-cvpa .reel__controls-cvpa { display: flex; justify-content: center; margin-top: clamp(1.25rem, 2.5vw, 1.75rem); }
#page-cvpa .reel__pause-cvpa {
  display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; padding: 0 1.1rem; cursor: pointer;
  background: transparent; color: var(--white); border: 2px solid var(--white);
  /* capitals like the other buttons, so no descenders pull the label down; centred on the capital height */
  font-weight: 800; font-size: var(--fs-small); letter-spacing: 0.06em; text-transform: uppercase; line-height: 1;
}
#page-cvpa .reel__pause-label-cvpa { display: block; line-height: 1; text-box: trim-both cap alphabetic; }
/* browsers without text-box: the template font (Neue Plak) sits about 0.1em low, so lift the label by that much */
@supports not (text-box: trim-both cap alphabetic) {
  #page-cvpa .reel__pause-label-cvpa { position: relative; top: -0.1em; }
}
#page-cvpa .reel__pause-cvpa[hidden] { display: none; }
#page-cvpa .reel__pause-cvpa:hover { background: var(--white); color: var(--black); }
#page-cvpa .reel__pause-cvpa:focus-visible { outline: 3px solid var(--white); outline-offset: 3px; }
#page-cvpa .reel__pause-cvpa .icon-cvpa { width: 14px; height: 14px; }
#page-cvpa .reel__cta-cvpa { display: flex; justify-content: center; margin-top: clamp(2rem, 4vw, 3rem); }
#page-cvpa .reel__cta-cvpa .icon-instagram-cvpa { width: 20px; height: 20px; }
/* Slightly rounded buttons (college homepage only: its wrapper has .page--round-cvpa): the buttons that
   link to other pages, and the photo reel's Pause photos button */
#page-cvpa.page--round-cvpa a.btn-cvpa, #page-cvpa.page--round-cvpa .reel__pause-cvpa { border-radius: 6px; }
/* Follow us / Listen to us on red (college homepage, below the black photo reel): white text, black accents */
#page-cvpa .connect-cvpa.connect--red-cvpa { --focus: var(--white); --rule: rgba(255, 255, 255, 0.45); background: var(--accent); color: var(--white); }
#page-cvpa .connect--red-cvpa .connect__title-cvpa span { color: var(--black); }
#page-cvpa .connect--red-cvpa .connect__intro-cvpa { color: var(--white); }
#page-cvpa .connect--red-cvpa .social-cvpa:hover { background: var(--black); border-color: var(--black); }
#page-cvpa .connect--red-cvpa .podcast-cvpa { background: var(--black); }
#page-cvpa .connect--red-cvpa .podcast-cvpa:hover { background: #1b1b1b; }
/* light grey version of the photo reel (not in use; kept for other placements) */
#page-cvpa .reel--gray-cvpa { --focus: var(--black); background: #EDEDED; color: var(--black); }
#page-cvpa .reel--gray-cvpa .reel__lede-cvpa { color: #3d3d3d; }
#page-cvpa .reel--gray-cvpa .reel__pause-cvpa { color: var(--black); border-color: var(--black); }
#page-cvpa .reel--gray-cvpa .reel__pause-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .reel--gray-cvpa .reel__pause-cvpa:focus-visible { outline-color: var(--black); }
@media (max-width: 900px) {
  #page-cvpa .reel__tiles-cvpa { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #page-cvpa .reel__tile-cvpa:nth-child(n + 4) { display: none; }
}
@media (max-width: 640px) {
  #page-cvpa .reel__tiles-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .reel__tile-cvpa:nth-child(n + 3) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #page-cvpa .reel__img-cvpa { transition: none; }
}
/* ===========================================================================
   SECTION COLOUR VERSIONS (all homepages; kept last so they override the section defaults)
   Homepage sections use the four official colours (black, white, red and light grey #EDEDED),
   never the same colour twice in a row. These versions let a section take the colour its place needs.
   All text on red is solid white (AA); red accents on red switch to black or white.
   =========================================================================== */

/* Studio-style cards on white: dark-outline buttons instead of white ones */
#page-cvpa .research--light-cvpa .btn--ghost-cvpa { border-color: var(--black); color: var(--black); }
#page-cvpa .research--light-cvpa .btn--ghost-cvpa:hover { background: var(--black); color: var(--white); }

/* Studio-style cards on red: white cards with dark text */
#page-cvpa .research--red-cvpa { --focus: var(--white); background: var(--accent); color: var(--white); }
#page-cvpa .research--red-cvpa .research__title-cvpa span { color: var(--black); }
#page-cvpa .research--red-cvpa .research__lede-cvpa { color: var(--white); }
#page-cvpa .research--red-cvpa .research-card-cvpa {
  --text-muted: #3d3d3d; --focus: var(--black);
  background: var(--white); color: var(--black);
}
#page-cvpa .research--red-cvpa .btn--primary-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .research--red-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--accent); }
#page-cvpa .research--red-cvpa .btn--primary-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .research--red-cvpa .btn--primary-cvpa:hover .icon-cvpa { color: var(--white); }

/* Events on red: white rules and button, black card tops */
#page-cvpa .events--red-cvpa { --focus: var(--white); background: var(--accent); }
#page-cvpa .events--red-cvpa .feed__head-cvpa::before, #page-cvpa .events--red-cvpa .feed__head-cvpa::after { background: var(--white); }
#page-cvpa .events--red-cvpa .feed__title-cvpa span { color: var(--black); }
#page-cvpa .events--red-cvpa .event-card-cvpa { border-top-color: var(--black); }
#page-cvpa .events--red-cvpa .btn--primary-cvpa { background: var(--white); color: var(--black); }
#page-cvpa .events--red-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--accent); }
#page-cvpa .events--red-cvpa .btn--primary-cvpa:hover { background: var(--black); color: var(--white); }
#page-cvpa .events--red-cvpa .btn--primary-cvpa:hover .icon-cvpa { color: var(--white); }

/* News on black: red rules, accents and button */
#page-cvpa .news-cvpa.news--dark-cvpa { background: var(--black); color: var(--white); }
#page-cvpa .news--dark-cvpa .feed__head-cvpa::before, #page-cvpa .news--dark-cvpa .feed__head-cvpa::after { background: var(--accent); }
#page-cvpa .news--dark-cvpa .feed__title-cvpa span { color: var(--accent); }
#page-cvpa .news--dark-cvpa .card__meta-cvpa, #page-cvpa .news--dark-cvpa .card__excerpt-cvpa { color: rgba(255, 255, 255, 0.78); }
#page-cvpa .news--dark-cvpa .card__more-cvpa { color: var(--white); }
#page-cvpa .news--dark-cvpa .btn--primary-cvpa { background: var(--accent); color: var(--white); }
#page-cvpa .news--dark-cvpa .btn--primary-cvpa .icon-cvpa { color: var(--white); }
#page-cvpa .news--dark-cvpa .btn--primary-cvpa:hover { background: var(--accent-hover); color: var(--white); }

/* Our people on red: white band behind the dark cards, white filter buttons */
#page-cvpa .people-cvpa.people--red-cvpa { --focus: var(--white); background: var(--accent); color: var(--white); }
#page-cvpa .people--red-cvpa .people__band-cvpa { background: linear-gradient(180deg, transparent 0, transparent var(--band-start), var(--white) var(--band-start)); }
#page-cvpa .people--red-cvpa .people__title-cvpa span { color: var(--black); }
#page-cvpa .people--red-cvpa .people__intro-cvpa { color: var(--white); }
#page-cvpa .people--red-cvpa .filter-cvpa { color: var(--white); border-color: var(--white); }
#page-cvpa .people--red-cvpa .filter-cvpa:hover { background: rgba(0, 0, 0, 0.18); }
#page-cvpa .people--red-cvpa .filter-cvpa[aria-pressed="true"] { background: var(--white); border-color: var(--white); color: var(--black); }

/* Light grey versions (#EDEDED, the fourth official colour): same dark text as the white versions */
#page-cvpa .about-cvpa.about--gray-cvpa { background: #EDEDED; }
#page-cvpa .schools-cvpa.schools--gray-cvpa { background: #EDEDED; }
#page-cvpa .research-cvpa.research--gray-cvpa { --surface: var(--white); background: #EDEDED; }

/* =====================================================================
   PART 14 - NEWSLETTER (college/ttuarts: TTU Arts)
   No photo hero: a black magazine masthead (college lines, TTU Arts wordmark,
   red issue badge, print version button, cover story photo) with an
   "In this issue" contents list. Sections are the PART 4 question sections
   (white / grey / black / red) holding newsletter pieces: dean's letter with
   a drop cap, faculty profiles, articles with a side column of captioned
   figures, pull quotes, donor circle cards, alumni notes and bonus stories.
   ===================================================================== */

/* ---------- Masthead ---------- */
#page-cvpa .nl-mast-cvpa {
  --text: var(--white); --text-muted: rgba(255, 255, 255, 0.72); --focus: var(--white);
  padding: clamp(3rem, 6vw, 5rem) var(--gutter) 0;
  background: var(--black); color: var(--white);
}
#page-cvpa .nl-mast__inner-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  gap: clamp(2rem, 4vw, 4rem); align-items: center;
  max-width: 84rem; margin: 0 auto;
}
#page-cvpa .nl-mast__text-cvpa { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: clamp(1.25rem, 2.5vw, 2rem); }
#page-cvpa .nl-mast__title-cvpa { grid-column: 1 / -1; margin: 0; font: inherit; }
#page-cvpa .nl-wordmark-cvpa {
  display: block; margin: clamp(0.5rem, 1.5vw, 1rem) 0 0;
  font-weight: 900; font-size: clamp(4.25rem, 11vw, 10rem); line-height: 0.82;
  letter-spacing: -0.01em; text-transform: uppercase;
}
#page-cvpa .nl-wordmark-cvpa span { display: block; }
#page-cvpa .nl-wordmark__solid-cvpa { color: var(--accent); }
#page-cvpa .nl-wordmark__outline-cvpa { color: transparent; -webkit-text-stroke: clamp(2px, 0.28vw, 4px) var(--white); }
@supports not (-webkit-text-stroke: 1px white) {
  #page-cvpa .nl-wordmark__outline-cvpa { color: var(--white); }
}
/* Red issue badge, like the print cover */
#page-cvpa .nl-issue-cvpa {
  display: grid; place-content: center; justify-items: center;
  width: clamp(7rem, 11vw, 8.75rem); aspect-ratio: 1 / 1; margin: clamp(1.5rem, 3vw, 2.25rem) 0 0;
  border-radius: 50%; background: var(--accent); color: var(--white);
  box-shadow: 0 0 0 4px var(--black), 0 0 0 7px var(--white);
  text-align: center; text-transform: uppercase; line-height: 1; transform: rotate(-8deg);
}
#page-cvpa .nl-issue__season-cvpa { display: block; max-width: 6ch; font-weight: 900; font-size: clamp(1.1rem, 1.7vw, 1.4rem); }
#page-cvpa .nl-issue__word-cvpa { display: block; margin-top: 0.4rem; font-weight: 800; font-size: 0.75rem; letter-spacing: 0.22em; }
#page-cvpa .nl-mast__actions-cvpa { margin: clamp(1.5rem, 3vw, 2.25rem) 0 0; }
/* Cover story photo with a dark caption panel */
#page-cvpa .nl-cover-cvpa { position: relative; margin: 0; overflow: hidden; background: #1c1c1c; border-bottom: 6px solid var(--accent); }
#page-cvpa .nl-cover-cvpa img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
#page-cvpa .nl-cover__caption-cvpa {
  position: absolute; left: 0; bottom: 0; max-width: min(100%, 30rem);
  padding: 1rem 1.25rem; background: rgba(0, 0, 0, 0.82);
}
#page-cvpa .nl-cover__kicker-cvpa {
  display: inline-block; margin-bottom: 0.5rem; padding: 0.3rem 0.65rem; border-radius: 4px;
  background: var(--accent); color: var(--white);
  font-weight: 800; font-size: 0.8rem; letter-spacing: 0.14em; text-transform: uppercase;
}
#page-cvpa .nl-cover__link-cvpa {
  display: block; color: var(--white); text-decoration: none;
  font-weight: 900; font-size: calc((clamp(1.35rem, 2.2vw, 1.9rem)) * var(--ds-m)); line-height: 1.15; text-transform: uppercase;
}
#page-cvpa .nl-cover__link-cvpa:hover { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 3px; text-underline-offset: 5px; }
/* In this issue */
#page-cvpa .nl-toc-cvpa {
  max-width: 84rem; margin: clamp(2.5rem, 5vw, 4rem) auto 0;
  padding: clamp(1.5rem, 3vw, 2rem) 0 clamp(2.5rem, 5vw, 3.5rem);
  border-top: 1px solid rgba(255, 255, 255, 0.22);
}
#page-cvpa .nl-toc__title-cvpa {
  display: flex; align-items: center; gap: 0.75rem; margin: 0 0 1rem;
  font-weight: 700; font-size: clamp(0.95rem, 1.1vw, 1.1rem); letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted);
}
#page-cvpa .nl-toc__title-cvpa::before { content: ""; width: 3rem; height: 3px; background: var(--accent); }
#page-cvpa .nl-toc__list-cvpa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 clamp(1rem, 2.5vw, 2rem); margin: 0; padding: 0; list-style: none; }
#page-cvpa .nl-toc__list-cvpa a {
  display: flex; align-items: baseline; gap: 0.75rem; padding: 0.85rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  color: var(--white); text-decoration: none;
  font-weight: 800; font-size: calc((1.15rem) * var(--ds-s)); letter-spacing: 0.05em; text-transform: uppercase;
}
#page-cvpa .nl-toc__list-cvpa a:hover { color: var(--accent); }
#page-cvpa .nl-toc__num-cvpa { color: var(--accent); font-weight: 900; font-size: 1.15em; font-variant-numeric: tabular-nums; }

/* ---------- Shared newsletter pieces ---------- */
#page-cvpa .nl-narrow-cvpa { max-width: 54rem; }
#page-cvpa .nl-back-cvpa { margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; font-size: 0.85rem; letter-spacing: 0.12em; text-transform: uppercase; }
#page-cvpa .nl-dek-cvpa { max-width: 46rem; margin: 1.25rem 0 0; font-weight: 600; font-size: var(--fs-lede); line-height: 1.55; color: var(--text); }
#page-cvpa .nl-byline-cvpa { margin: 1rem 0 0; font-weight: 800; font-size: 0.85rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
/* Figures: photo with a red bar, caption under it */
#page-cvpa .nl-fig-cvpa { margin: 0; }
#page-cvpa .nl-fig-cvpa img { display: block; width: 100%; height: auto; border-bottom: 4px solid var(--accent); }
#page-cvpa .nl-fig-cvpa figcaption { margin: 0.65rem 0 0; font-size: var(--fs-small); line-height: 1.5; color: var(--text-muted); }
#page-cvpa .nl-fig__pair-cvpa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
#page-cvpa .nl-fig--pair-cvpa .nl-fig__pair-cvpa img { aspect-ratio: 1 / 1; object-fit: cover; }
#page-cvpa .nl-fig--wide-cvpa { max-width: 56rem; margin-top: clamp(2rem, 4vw, 3rem); }
#page-cvpa .nl-fig--logo-cvpa img { aspect-ratio: 3 / 2; object-fit: contain; background: var(--white); }

/* ---------- Dean's letter ---------- */
#page-cvpa .nl-letter-cvpa { margin: clamp(2rem, 4vw, 3rem) 0 0; }
#page-cvpa .nl-letter-cvpa p { max-width: 44rem; margin: 0 0 1.2rem; font-size: var(--fs-body); line-height: 1.8; color: var(--text-muted); }
#page-cvpa .nl-letter-cvpa > p:first-child::first-letter {
  float: left; margin: 0.06em 0.12em 0 0;
  font-weight: 900; font-size: 4.6em; line-height: 0.8; color: var(--accent);
}
#page-cvpa .nl-letter-cvpa .nl-sign-cvpa { margin: 2rem 0 0; padding-left: 1rem; border-left: 4px solid var(--accent); line-height: 1.5; }
#page-cvpa .nl-sign__name-cvpa { display: block; font-weight: 900; font-size: 1.15rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text); }

/* ---------- Faculty profiles ---------- */
#page-cvpa .nl-profile-cvpa {
  display: grid; grid-template-columns: minmax(0, 17rem) minmax(0, 1fr); gap: clamp(1.5rem, 3vw, 3rem);
  padding: clamp(2rem, 4vw, 3rem) 0; border-top: 1px solid var(--rule);
}
#page-cvpa .q-title-cvpa + .nl-profile-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .nl-profile__media-cvpa { display: grid; gap: 1.25rem; align-content: start; margin: 0; }
#page-cvpa figure.nl-profile__media-cvpa img { display: block; width: 100%; height: auto; border-bottom: 4px solid var(--accent); }
#page-cvpa .nl-profile__title-cvpa { margin: 0 0 1rem; font-weight: 900; font-size: calc((clamp(1.6rem, 2.6vw, 2.25rem)) * var(--ds-m)); line-height: 1.1; }
#page-cvpa .nl-profile__body-cvpa p { max-width: 46rem; margin: 0 0 1rem; font-size: var(--fs-body); line-height: 1.7; color: var(--text-muted); }
#page-cvpa .nl-links-cvpa { display: grid; gap: 0.6rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
#page-cvpa .nl-said-cvpa { margin: 0; padding-left: 1.25rem; border-left: 4px solid var(--accent); }

/* ---------- Articles: text column + a side column of figures ---------- */
#page-cvpa .nl-article-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 22rem); gap: clamp(2rem, 5vw, 5rem);
  align-items: start; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0;
}
#page-cvpa .nl-article__body-cvpa p { max-width: 44rem; margin: 0 0 1.1rem; font-size: var(--fs-body); line-height: 1.75; color: var(--text-muted); }
#page-cvpa .nl-article__body-cvpa .nl-fig-cvpa { max-width: 44rem; margin: 2rem 0; }
#page-cvpa .nl-article__side-cvpa { display: grid; gap: 2rem; }
#page-cvpa .nl-subhead-cvpa { margin: 2.25rem 0 1rem; font-weight: 900; font-size: calc((clamp(1.45rem, 2.3vw, 2rem)) * var(--ds-m)); line-height: 1.15; }
/* Pull quote */
#page-cvpa .nl-quote-cvpa { margin: 2rem 0; padding: 1.25rem 0 0; border-top: 6px solid var(--accent); }
#page-cvpa .nl-quote-cvpa p, #page-cvpa .nl-article__body-cvpa .nl-quote-cvpa p {
  max-width: none; margin: 0; font-weight: 900; font-size: clamp(1.3rem, 2.1vw, 1.75rem); line-height: 1.25; color: var(--text);
}
#page-cvpa .nl-quote-cvpa .nl-quote__by-cvpa, #page-cvpa .nl-article__body-cvpa .nl-quote-cvpa .nl-quote__by-cvpa {
  margin: 0.9rem 0 0; font-weight: 800; font-size: 0.85rem; line-height: 1.4; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted);
}
#page-cvpa .nl-article__side-cvpa .nl-quote-cvpa { margin: 0; }
/* "About the artist" box */
#page-cvpa .nl-box-cvpa { padding: 1.5rem; background: var(--card); border-top: 6px solid var(--accent); }
#page-cvpa .nl-box-cvpa img { display: block; width: 9rem; height: auto; }
#page-cvpa .nl-box__title-cvpa { margin: 1rem 0 0.5rem; font-weight: 900; font-size: 1.3rem; line-height: 1.2; }
#page-cvpa .nl-box-cvpa p { margin: 0; font-size: var(--fs-card); line-height: 1.6; color: var(--text-muted); }

/* ---------- Donor spotlight (black) ---------- */
#page-cvpa .nl-contact-cvpa { padding: 1.75rem; background: var(--surface); border-top: 6px solid var(--accent); }
#page-cvpa .nl-contact__label-cvpa { margin: 0; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
#page-cvpa .nl-contact__name-cvpa { margin: 0.5rem 0 0; font-weight: 900; font-size: 1.6rem; line-height: 1.1; }
#page-cvpa .nl-contact__role-cvpa { margin: 0.35rem 0 0; font-size: var(--fs-card); color: var(--text-muted); }
#page-cvpa .nl-contact__list-cvpa { display: grid; gap: 0.75rem; margin: 1.25rem 0 0; padding: 0; list-style: none; font-size: var(--fs-card); line-height: 1.5; }
#page-cvpa .nl-contact__list-cvpa li { display: flex; gap: 0.65rem; align-items: flex-start; overflow-wrap: anywhere; }
#page-cvpa .nl-contact__list-cvpa .icon-cvpa { width: 1.15em; height: 1.15em; margin-top: 0.2em; color: var(--accent); }
#page-cvpa .nl-circles__title-cvpa { margin-top: clamp(3rem, 6vw, 4.5rem); }
#page-cvpa .nl-circles-cvpa { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.5rem); margin: 1.5rem 0 0; padding: 0; list-style: none; }
#page-cvpa .nl-circle-cvpa {
  --text: var(--black); --text-muted: #3d3d3d; --focus: var(--black);
  display: flex; flex-direction: column; padding: 1.5rem;
  background: var(--white); color: var(--text); border-top: 6px solid var(--accent);
}
#page-cvpa .nl-circle__logo-cvpa { display: flex; align-items: center; height: 7rem; margin: 0 0 1.25rem; }
#page-cvpa .nl-circle__logo-cvpa img { width: auto; max-width: 100%; max-height: 100%; }
#page-cvpa .nl-circle__name-cvpa { margin: 0; font-weight: 900; font-size: 1.35rem; line-height: 1.15; }
#page-cvpa .nl-circle__name-cvpa span { display: block; margin-top: 0.35rem; font-weight: 700; font-size: 0.8rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); }
#page-cvpa .nl-circle-cvpa p { flex: 1; margin: 0.9rem 0 1.1rem; font-size: var(--fs-card); line-height: 1.6; color: var(--text-muted); }
#page-cvpa .q-section--dark-cvpa .nl-circle-cvpa .text-link-cvpa:hover { color: var(--accent); text-decoration-color: var(--accent); }
#page-cvpa .nl-join-cvpa {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem;
  margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 1.5rem 1.75rem; border: 1px solid rgba(255, 255, 255, 0.22);
}
#page-cvpa .nl-join-cvpa p { max-width: 42rem; margin: 0; font-size: var(--fs-body); line-height: 1.6; color: var(--text-muted); }
#page-cvpa .nl-join-cvpa strong { color: var(--text); }

/* ---------- Alumni updates ---------- */
#page-cvpa .nl-alumni-cvpa {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: 0 clamp(1.5rem, 3vw, 2.5rem);
  margin: clamp(2.5rem, 5vw, 3.5rem) 0 0; padding: 0; list-style: none;
}
#page-cvpa .nl-alum-cvpa { padding: 1.25rem 0 1.5rem; border-top: 3px solid var(--accent); }
#page-cvpa .nl-alum__name-cvpa { margin: 0; font-weight: 900; font-size: 1.2rem; line-height: 1.2; }
#page-cvpa .nl-alum__name-cvpa span { display: block; margin-top: 0.35rem; font-weight: 700; font-size: 0.85rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }
#page-cvpa .nl-alum-cvpa p { margin: 0.65rem 0 0; font-size: var(--fs-card); line-height: 1.6; color: var(--text-muted); }
#page-cvpa .nl-alumni__actions-cvpa { margin-top: clamp(2rem, 4vw, 3rem); }

/* ---------- Bonus content (black) ---------- */
#page-cvpa .nl-bonus__title-cvpa { margin: 1.25rem 0 0.75rem; font-weight: 900; font-size: calc((clamp(1.45rem, 2.3vw, 2rem)) * var(--ds-m)); line-height: 1.15; }
#page-cvpa .nl-bonus-cvpa p { margin: 0 0 0.9rem; font-size: var(--fs-card); line-height: 1.65; color: var(--text-muted); }
#page-cvpa .nl-bonus--lead-cvpa {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 3.5rem);
  align-items: start; margin: clamp(2.5rem, 5vw, 3.5rem) 0 0;
}
#page-cvpa .nl-bonus--lead-cvpa .nl-bonus__title-cvpa { margin-top: 0; }
#page-cvpa .nl-bonus__media-cvpa img { aspect-ratio: 3 / 2; object-fit: cover; }
#page-cvpa .nl-bonus__grid-cvpa { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 2.5rem); margin: clamp(3rem, 6vw, 4.5rem) 0 0; }
#page-cvpa .nl-bonus__grid-cvpa .nl-bonus-cvpa { padding-bottom: 0.75rem; background: var(--surface); }
#page-cvpa .nl-bonus__grid-cvpa .nl-bonus-cvpa > :not(figure) { margin-left: 1.5rem; margin-right: 1.5rem; }
#page-cvpa .nl-bonus__grid-cvpa .nl-fig-cvpa img { aspect-ratio: 3 / 2; object-fit: cover; }
#page-cvpa .nl-bonus__grid-cvpa .nl-fig-cvpa figcaption { margin: 0.65rem 1.5rem 0; }
#page-cvpa .nl-bonus__grid-cvpa .nl-fig--logo-cvpa img { object-fit: contain; }

/* ---------- On the red section: black or white accents instead of red ---------- */
#page-cvpa .q-section--red-cvpa .text-link-cvpa { text-decoration-color: var(--white); }
#page-cvpa .q-section--red-cvpa .text-link-cvpa:hover { color: var(--black); text-decoration-color: var(--black); }
#page-cvpa .q-section--red-cvpa .nl-fig-cvpa img { border-bottom-color: var(--black); }
#page-cvpa .q-section--red-cvpa .nl-quote-cvpa { border-top-color: var(--black); }

/* ---------- Responsive ---------- */
@media (max-width: 1000px) {
  #page-cvpa .nl-mast__inner-cvpa, #page-cvpa .nl-article-cvpa, #page-cvpa .nl-bonus--lead-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .nl-article__side-cvpa { grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); }
}
@media (max-width: 900px) {
  #page-cvpa .nl-toc__list-cvpa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-cvpa .nl-circles-cvpa { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  #page-cvpa .nl-profile-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .nl-profile__media-cvpa { max-width: 18rem; }
  #page-cvpa .nl-bonus__grid-cvpa { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  #page-cvpa .nl-toc__list-cvpa { grid-template-columns: 1fr; }
  #page-cvpa .nl-cover__caption-cvpa { position: static; max-width: none; }
}

/* ===========================================================================
   PART 15 - DEGREE PLANS (<school>/degree-plans/<plan>, e.g. theatre-dance M.A. in Theatre Arts)
   Built on PART 4 sections and cards with the compact header (page-hero--compact-cvpa, PART 7b).
   Course lists: the course code in bold on its own line above the title, so codes line up.
   =========================================================================== */
#page-cvpa .plan-courses-cvpa { margin: 1.25rem 0 0; padding: 0 0 0 1.25rem; list-style: disc; }
#page-cvpa .plan-courses-cvpa li { display: list-item; margin: 0; font-size: var(--fs-card); line-height: 1.45; color: var(--text-muted); }
#page-cvpa .plan-courses-cvpa li + li { margin-top: 0.6rem; }
#page-cvpa .plan-courses-cvpa li::marker { color: var(--accent); }
#page-cvpa .plan-course__code-cvpa { font-weight: 800; color: var(--text); white-space: nowrap; }
#page-cvpa .plan-course__note-cvpa { font-style: italic; }
/* card headings sized to fit three across without breaking a word (e.g. ADMINISTRATION) */
#page-cvpa .reasons-cvpa .reason__title-cvpa:has(+ .plan-courses-cvpa) { font-size: clamp(1.2rem, 1.5vw, 1.45rem); line-height: 1.15; overflow-wrap: normal; word-break: normal; hyphens: manual; }
#page-cvpa .q-lede-cvpa + .reasons-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }
/* five elective groups: three across, then two */
@media (min-width: 900px) { #page-cvpa .plan-groups-cvpa { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
#page-cvpa .plan-updated-cvpa { font-size: var(--fs-small); font-style: italic; }

/* ===========================================================================
   PART 16 - PEOPLE PAGES (<school>/about/our-people/<faculty|staff>: directory + bio pages; test: art faculty)
   Compact black header (page-hero--compact-cvpa). The directory reuses the faculty cards (PART 4), the search box
   (PART 3) and the filter buttons (PART 2); programs-cvpa.js builds the cards from OU's bio database and runs the
   search and area filters. Bio pages read the bio record OU prints above the body and show it in this design.
   =========================================================================== */
/* Directory: the question, search + area filters and a live count on white (dir-head-cvpa), then the cards on black
   (dir-people-cvpa, the dark section's white text and dark cards); the two bands sit a little closer than usual sections */
#page-cvpa .dir-head-cvpa { padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .dir-people-cvpa { padding-top: clamp(2.5rem, 5vw, 3.5rem); }
#page-cvpa .dir-people-cvpa .dir-list-cvpa { margin-top: 0; }
#page-cvpa .dir-tools-cvpa { display: flex; flex-direction: column; gap: 1rem; margin-top: clamp(2rem, 4vw, 2.75rem); }
#page-cvpa .dir-tools-cvpa .search-cvpa { flex: none; width: 100%; max-width: 30rem; }
#page-cvpa .dir-status-cvpa { margin: 0; font-size: var(--fs-small); font-weight: 700; color: var(--text-muted); }
#page-cvpa .dir-list-cvpa { margin-top: clamp(1.5rem, 3vw, 2rem); }
#page-cvpa .dir-list-cvpa > li { display: flex; flex-direction: column; background: var(--card); }
#page-cvpa .dir-list-cvpa .person-link-cvpa { height: auto; padding-bottom: 0.5rem; }
#page-cvpa .dir-list-cvpa .person__email-cvpa { margin: 0; padding: 0 1rem 1rem calc(6.5rem + 2.1rem); font-size: var(--fs-body); overflow-wrap: anywhere; }
#page-cvpa .dir-empty-cvpa { margin: 0; font-size: var(--fs-body); }
#page-cvpa .dir-more-cvpa { margin: clamp(2rem, 4vw, 2.75rem) 0 0; font-size: var(--fs-body); font-weight: 700; }
@media (max-width: 520px) {
  #page-cvpa .dir-list-cvpa .person__email-cvpa { padding-left: 1rem; }
}
/* Bio page: headshot beside the facts (title, education, email, phone), then the bio text */
#page-cvpa .bio-profile-cvpa { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
@media (min-width: 760px) { #page-cvpa .bio-profile-cvpa { grid-template-columns: minmax(12rem, 20rem) minmax(0, 1fr); } }
#page-cvpa .bio-photo-cvpa { margin: 0; aspect-ratio: 5 / 6; overflow: hidden; background: var(--card); border-bottom: 6px solid var(--accent); }
#page-cvpa .bio-photo-cvpa img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
#page-cvpa .q-title-cvpa + .bio-profile-cvpa { margin-top: clamp(2rem, 4vw, 2.75rem); }   /* never tight under the heading */
#page-cvpa .bio-profile-cvpa .facts-cvpa { margin-top: 0; }
/* email, phone and links: normal case and a smaller size, so an address fits its column without breaking mid-word */
#page-cvpa .bio-profile-cvpa .fact__value-cvpa a { text-transform: none; font-size: var(--fs-body); overflow-wrap: break-word; }
#page-cvpa .bio-profile-cvpa + .q-subtitle-cvpa { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
/* Artwork in the carousel (carousel--art-cvpa, e.g. a faculty portfolio): the whole work, never cropped */
#page-cvpa .carousel--art-cvpa .carousel__figure-cvpa img { aspect-ratio: 4 / 3; object-fit: contain; background: var(--black); }