@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Source+Sans+3:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400&display=swap');

/* =====================================================================
   APS v2 — COMPLETE STYLESHEET (replace the whole WA CSS with this file)
   The @import above MUST stay on the very first line.
   Order: old site > base > WA overrides > home > editor > popup > footer > events > about > account > membership > donations.
   ===================================================================== */

/* =====================================================================
   OLD SITE — theme customisations (keep until the old site is removed)
   ===================================================================== */
.menuStyle001 ul.firstLevel > li > .item > a > span {
color: #22346A;
text-transform: uppercase;
font-size: 100%;
font-family: 'Open Sans';
}

.menuStyle001 ul.secondLevel > li > .item > a > span {
color: #22346A;
font-size: 90%;
font-family: 'Open Sans';
}

.menuStyle001 ul.secondLevel > li > .item > a:hover > span {
color: #FFFFFF;
}

.gadgetStyle002 .gadgetStyleTitle {
background-color: #22346A;
color: #000000;
font-family: 'Open Sans';
font-size: 150%;
text-align: center;
}

.WaGadgetEventsStateList h3.sectionTitle {
font-size: 32px;
color: #22346A;
font-family: 'Open Sans';
}

.WaGadgetEventsStateList .boxOuterContainer .boxHeaderOuterContainer .boxHeaderContainer h4.boxHeaderTitle a {
font-size: 26px;
color: #22346A;
}

.WaGadgetBlog ul.boxesList li.boxesListItem .boxHeaderOuterContainer h4.boxHeaderTitle {
     font-size: 20px;
    color: #22346A;
}


/* ===== APS DRAFT — SCOPED STYLES ===== */
.aps2 {
  --ultramarine: #1e0f41;
  --parchment: #f5f5f0;
  --azulejo-blue: #8cb4dc;
  --azulejo-yellow: #f0b946;
  --crusader-red: #e65023;
  --esperanca-green: #00a55f;
  --white: #ffffff;

  --font-display: 'DM Serif Display', Georgia, serif;
  --font-body: 'Source Sans 3', sans-serif;

  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ultramarine);
  background: var(--parchment);
  overflow-x: hidden;
}

.aps2 *, .aps2 *::before, .aps2 *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ===== NAV ===== */
.aps2 nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  background: var(--ultramarine);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 48px;
  height: 72px;
  transition: var(--transition);
}

.aps2 nav.scrolled {
  height: 60px;
  box-shadow: 0 2px 24px rgba(30,15,65,0.25);
}

.aps2 .nav-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  text-decoration: none;
}

.aps2 .nav-logo-icon {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
}

.aps2 .nav-logo-text {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--parchment);
  line-height: 1.3;
}

.aps2 .nav-links {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
}

.aps2 .nav-links a {
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--parchment);
  opacity: 0.75;
  text-decoration: none;
  padding: 8px 14px;
  border-radius: 4px;
  transition: var(--transition);
  cursor: pointer;
}

.aps2 .nav-links a:hover,
.aps2 .nav-links a.active {
  opacity: 1;
  background: rgba(245,245,240,0.1) !important;
  color: var(--parchment);
}

.aps2 .nav-links a.active {
  color: var(--azulejo-yellow);
  opacity: 1;
}

.aps2 .nav-cta {
  background: var(--crusader-red) !important;
  color: var(--white) !important;
  opacity: 1 !important;
  padding: 8px 20px !important;
  border-radius: 4px !important;
}

.aps2 .nav-cta:hover {
  background: #c93e18 !important;
}

.aps2 .hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
}

.aps2 .hamburger span {
  width: 24px;
  height: 2px;
  background: var(--parchment);
  transition: var(--transition);
}

.aps2 .mobile-menu {
  display: none;
  position: fixed;
  top: 72px;
  left: 0; right: 0;
  background: var(--ultramarine);
  padding: 24px;
  z-index: 99;
  flex-direction: column;
  gap: 8px;
}

.aps2 .mobile-menu.open { display: flex; }

.aps2 .mobile-menu a {
  color: var(--parchment);
  text-decoration: none;
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(245,245,240,0.1);
  cursor: pointer;
}

/* ===== SHARED LAYOUT ===== */
.aps2 .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 48px;
}

.aps2 .section { padding: 96px 0; }
.aps2 .section-sm { padding: 64px 0; }

.aps2 .section-label {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--crusader-red);
  margin-bottom: 16px;
}

.aps2 h1, .aps2 h2, .aps2 h3 {
  font-family: var(--font-display);
  line-height: 1.15;
}

.aps2 h1 { font-size: clamp(36px, 5vw, 64px); }
.aps2 h2 { font-size: clamp(28px, 3.5vw, 44px); }
.aps2 h3 { font-size: clamp(20px, 2.5vw, 28px); }

.aps2 p { font-family: var(--font-body); font-size: 16px; line-height: 1.7; margin-bottom: 1em; }
.aps2 p:last-child { margin-bottom: 0; }

.aps2 .text-parchment { color: var(--parchment); }
.aps2 .text-yellow { color: var(--azulejo-yellow); }
.aps2 .text-red { color: var(--crusader-red); }
.aps2 .text-blue { color: var(--azulejo-blue); }

.aps2 .bg-dark { background: var(--ultramarine); }
.aps2 .bg-light { background: var(--parchment); }
.aps2 .bg-white { background: #ffffff; }

/* ===== BUTTONS ===== */
.aps2 .btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 14px 28px;
  border-radius: 4px;
  border: 2px solid transparent;
  cursor: pointer;
  transition: var(--transition);
  white-space: nowrap;
}

.aps2 .btn-primary {
  background: var(--crusader-red);
  color: var(--white);
  border-color: var(--crusader-red);
}
.aps2 .btn-primary:hover { background: #c93e18; border-color: #c93e18; transform: translateY(-2px); box-shadow: 0 8px 24px rgba(230,80,35,0.35); }

.aps2 .btn-secondary {
  background: transparent;
  color: var(--ultramarine);
  border-color: var(--ultramarine);
}
.aps2 .btn-secondary:hover { background: var(--ultramarine); color: var(--parchment); transform: translateY(-2px); }

.aps2 .btn-outline-light {
  background: transparent;
  color: var(--parchment);
  border-color: rgba(245,245,240,0.4);
}
.aps2 .btn-outline-light:hover { background: rgba(245,245,240,0.1); border-color: var(--parchment); transform: translateY(-2px); }

.aps2 .btn-yellow {
  background: var(--azulejo-yellow);
  color: var(--ultramarine);
  border-color: var(--azulejo-yellow);
}
.aps2 .btn-yellow:hover { background: #d9a530; border-color: #d9a530; transform: translateY(-2px); }

/* ===== DIVIDER ===== */
.aps2 .divider { width: 56px; height: 3px; background: var(--crusader-red); margin: 24px 0; }
.aps2 .divider-yellow { background: var(--azulejo-yellow); }

/* ===== CARDS ===== */
.aps2 .card { background: #fff; border-radius: 2px; overflow: hidden; transition: var(--transition); cursor: pointer; }
.aps2 .card:hover { transform: translateY(-6px); box-shadow: 0 20px 48px rgba(30,15,65,0.12); }

.aps2 .card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  background: var(--ultramarine);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.aps2 .card-body { padding: 28px 28px 32px; }

.aps2 .card-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--crusader-red);
  margin-bottom: 8px;
}

.aps2 .card h3 { font-size: 22px; margin-bottom: 12px; color: var(--ultramarine); }
.aps2 .card p { font-size: 14px; color: #555; line-height: 1.6; }

/* ===== GRID ===== */
.aps2 .grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.aps2 .grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 48px; }
.aps2 .grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }

/* ===== HERO ===== */
.aps2 .hero {
  min-height: 100vh;
  background: var(--ultramarine);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: 72px;
  position: relative;
  overflow: hidden;
}

.aps2 .hero-bg { position: absolute; inset: 0; z-index: 0; }

.aps2 .hero-pattern {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 70% 40%, rgba(140,180,220,0.12) 0%, transparent 50%),
    radial-gradient(circle at 20% 80%, rgba(230,80,35,0.08) 0%, transparent 40%);
}

.aps2 .hero-tiles {
  position: absolute;
  right: -40px;
  top: 72px;
  bottom: 0;
  width: 50%;
  opacity: 0.06;
  background-image: repeating-linear-gradient(
    0deg, transparent, transparent 48px, rgba(245,245,240,0.5) 48px, rgba(245,245,240,0.5) 50px
  ),
  repeating-linear-gradient(
    90deg, transparent, transparent 48px, rgba(245,245,240,0.5) 48px, rgba(245,245,240,0.5) 50px
  );
}

.aps2 .hero-content {
  position: relative;
  z-index: 1;
  padding: 80px 48px 96px;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

.aps2 .hero-eyebrow {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--azulejo-yellow);
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 16px;
}

.aps2 .hero-eyebrow::before {
  content: '';
  display: block;
  width: 32px;
  height: 2px;
  background: var(--azulejo-yellow);
}

.aps2 .hero h1 {
  font-size: clamp(44px, 6vw, 80px);
  color: var(--parchment);
  max-width: 760px;
  margin-bottom: 28px;
  line-height: 1.1;
}

.aps2 .hero h1 em { font-style: italic; color: var(--azulejo-yellow); }

.aps2 .hero-desc {
  color: rgba(245,245,240,0.75);
  font-size: 18px;
  max-width: 560px;
  line-height: 1.7;
  margin-bottom: 40px;
}

.aps2 .hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

.aps2 .hero-strip {
  background: rgba(245,245,240,0.05);
  border-top: 1px solid rgba(245,245,240,0.1);
  padding: 24px 48px;
  position: relative;
  z-index: 1;
}

.aps2 .hero-strip-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  gap: 48px;
  align-items: center;
}

.aps2 .hero-stat { display: flex; flex-direction: column; }

.aps2 .hero-stat-number {
  font-family: var(--font-display);
  font-size: 32px;
  color: var(--azulejo-yellow);
  line-height: 1;
}

.aps2 .hero-stat-label {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(245,245,240,0.5);
  margin-top: 4px;
}

.aps2 .hero-strip-divider { width: 1px; height: 40px; background: rgba(245,245,240,0.15); }

/* ===== PAGE HEROES ===== */
.aps2 .page-hero {
  background: var(--ultramarine);
  padding: 144px 0 80px;
  position: relative;
  overflow: hidden;
}

.aps2 .page-hero::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--crusader-red), var(--azulejo-yellow), var(--esperanca-green), var(--azulejo-blue));
}

.aps2 .page-hero-content { position: relative; z-index: 1; }

.aps2 .page-hero h1 { color: var(--parchment); max-width: 640px; margin-bottom: 20px; }

.aps2 .page-hero p {
  color: rgba(245,245,240,0.7);
  font-size: 18px;
  max-width: 560px;
  margin-bottom: 0;
}

/* ===== EVENTS PAGE ===== */
.aps2 .event-card {
  display: grid;
  grid-template-columns: 200px 1fr;
  background: #fff;
  border-radius: 2px;
  overflow: hidden;
  transition: var(--transition);
  margin-bottom: 24px;
  border-left: 4px solid var(--crusader-red);
}

.aps2 .event-card:hover { transform: translateX(6px); box-shadow: 0 8px 32px rgba(30,15,65,0.1); }

.aps2 .event-card-date {
  background: var(--ultramarine);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
  text-align: center;
}

.aps2 .event-card-day { font-family: var(--font-display); font-size: 48px; color: var(--azulejo-yellow); line-height: 1; }

.aps2 .event-card-month {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(245,245,240,0.6);
  margin-top: 4px;
}

.aps2 .event-card-body { padding: 32px; }
.aps2 .event-card-body h3 { font-size: 22px; margin-bottom: 8px; color: var(--ultramarine); }

.aps2 .event-card-meta { display: flex; gap: 20px; margin-bottom: 12px; flex-wrap: wrap; }

.aps2 .event-meta-item { font-size: 13px; color: #666; display: flex; align-items: center; gap: 6px; }
.aps2 .event-meta-item svg { width: 14px; height: 14px; flex-shrink: 0; opacity: 0.6; }

.aps2 .event-card-body p { font-size: 14px; color: #555; margin-bottom: 20px; }

/* ===== MEMBERSHIP ===== */
.aps2 .membership-tier {
  background: #fff;
  border-radius: 2px;
  padding: 40px 36px;
  position: relative;
  transition: var(--transition);
  border-top: 4px solid var(--azulejo-blue);
}

.aps2 .membership-tier:hover { transform: translateY(-8px); box-shadow: 0 24px 56px rgba(30,15,65,0.12); }

.aps2 .membership-tier.featured {
  background: var(--ultramarine);
  color: var(--parchment);
  border-top-color: var(--azulejo-yellow);
}

.aps2 .membership-tier-badge {
  position: absolute;
  top: -1px;
  right: 24px;
  background: var(--azulejo-yellow);
  color: var(--ultramarine);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: 0 0 4px 4px;
}

.aps2 .membership-price {
  font-family: var(--font-display);
  font-size: 52px;
  line-height: 1;
  color: var(--crusader-red);
  margin: 16px 0 4px;
}

.aps2 .membership-tier.featured .membership-price { color: var(--azulejo-yellow); }

.aps2 .membership-price-period { font-size: 13px; color: #888; margin-bottom: 24px; }
.aps2 .membership-tier.featured .membership-price-period { color: rgba(245,245,240,0.5); }

.aps2 .membership-tier h3 { font-size: 22px; margin-bottom: 8px; }

.aps2 .membership-features { list-style: none; margin: 24px 0 32px; }

.aps2 .membership-features li {
  font-size: 14px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(30,15,65,0.08);
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #444;
}

.aps2 .membership-tier.featured .membership-features li {
  border-bottom-color: rgba(245,245,240,0.1);
  color: rgba(245,245,240,0.8);
}

.aps2 .membership-features li::before {
  content: '✓';
  color: var(--esperanca-green);
  font-weight: 700;
  flex-shrink: 0;
}

/* ===== ABOUT ===== */
.aps2 .timeline { position: relative; padding-left: 32px; }

.aps2 .timeline::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--crusader-red), var(--azulejo-blue));
}

.aps2 .timeline-item { position: relative; margin-bottom: 40px; padding-left: 24px; }

.aps2 .timeline-item::before {
  content: '';
  position: absolute;
  left: -38px; top: 6px;
  width: 12px; height: 12px;
  background: var(--azulejo-yellow);
  border-radius: 50%;
  border: 2px solid var(--ultramarine);
}

.aps2 .timeline-year { font-family: var(--font-display); font-size: 20px; color: var(--crusader-red); margin-bottom: 4px; }
.aps2 .timeline-item h4 { font-family: var(--font-body); font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.aps2 .timeline-item p { font-size: 14px; color: #555; margin: 0; }

/* ===== COMMITTEE ===== */
.aps2 .committee-member { text-align: center; padding: 24px 16px; }

.aps2 .committee-avatar {
  width: 80px; height: 80px;
  border-radius: 50%;
  background: var(--ultramarine);
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-size: 28px;
  color: var(--azulejo-yellow);
}

.aps2 .committee-member h4 { font-family: var(--font-body); font-weight: 700; font-size: 15px; margin-bottom: 4px; }

.aps2 .committee-member p {
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--crusader-red);
  font-weight: 600;
  margin: 0;
}

/* ===== STUDENT AWARD ===== */
.aps2 .award-highlight {
  background: var(--ultramarine);
  padding: 56px;
  border-radius: 2px;
  position: relative;
  overflow: hidden;
}

.aps2 .award-highlight::before {
  content: '£';
  position: absolute;
  right: -20px; top: -40px;
  font-family: var(--font-display);
  font-size: 240px;
  color: rgba(240,185,70,0.06);
  line-height: 1;
}

.aps2 .award-amount { font-family: var(--font-display); font-size: 80px; color: var(--azulejo-yellow); line-height: 1; margin-bottom: 8px; }

/* ===== FOOTER ===== */
.aps2 footer { background: var(--ultramarine); color: var(--parchment); padding: 64px 0 32px; }

.aps2 .footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; margin-bottom: 48px; }

.aps2 .footer-brand p { font-size: 14px; color: rgba(245,245,240,0.55); line-height: 1.7; max-width: 280px; }

.aps2 .footer-col h4 {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--azulejo-yellow);
  margin-bottom: 20px;
}

.aps2 .footer-col ul { list-style: none; }
.aps2 .footer-col ul li { margin-bottom: 10px; }

.aps2 .footer-col ul li a {
  font-size: 14px;
  color: rgba(245,245,240,0.55);
  text-decoration: none;
  transition: var(--transition);
  cursor: pointer;
}

.aps2 .footer-col ul li a:hover { color: var(--parchment); }

.aps2 .footer-bottom {
  border-top: 1px solid rgba(245,245,240,0.1);
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.aps2 .footer-bottom p { font-size: 13px; color: rgba(245,245,240,0.35); margin: 0; }
.aps2 .footer-charity { font-size: 12px; color: rgba(245,245,240,0.25); margin: 0; }

.aps2 .footer-newsletter {
  background: rgba(245,245,240,0.05);
  border-radius: 2px;
  padding: 40px;
  margin-bottom: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

.aps2 .footer-newsletter-text h4 { font-family: var(--font-display); font-size: 22px; color: var(--parchment); margin-bottom: 6px; }
.aps2 .footer-newsletter-text p { font-size: 14px; color: rgba(245,245,240,0.55); margin: 0; }

.aps2 .newsletter-form { display: flex; gap: 0; flex-shrink: 0; }

.aps2 .newsletter-form input {
  background: rgba(245,245,240,0.1);
  border: 1px solid rgba(245,245,240,0.2);
  border-right: none;
  color: var(--parchment);
  font-family: var(--font-body);
  font-size: 14px;
  padding: 12px 20px;
  outline: none;
  width: 240px;
  border-radius: 4px 0 0 4px;
}

.aps2 .newsletter-form input::placeholder { color: rgba(245,245,240,0.35); }

.aps2 .newsletter-form button {
  background: var(--crusader-red);
  color: var(--white);
  border: none;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 12px 20px;
  cursor: pointer;
  border-radius: 0 4px 4px 0;
  transition: var(--transition);
}

.aps2 .newsletter-form button:hover { background: #c93e18; }

/* ===== SPONSORS STRIP ===== */
.aps2 .sponsors-strip {
  background: rgba(245,245,240,0.03);
  border-top: 1px solid rgba(245,245,240,0.08);
  border-bottom: 1px solid rgba(245,245,240,0.08);
  padding: 24px 0;
  margin-bottom: 48px;
}

.aps2 .sponsors-strip-inner { display: flex; align-items: center; gap: 48px; flex-wrap: wrap; justify-content: center; }

.aps2 .sponsor-logo {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(245,245,240,0.3);
  padding: 8px 16px;
  border: 1px solid rgba(245,245,240,0.1);
  border-radius: 2px;
}

/* ===== ACCENT BAR ===== */
.aps2 .accent-bar {
  height: 4px;
  background: linear-gradient(90deg, var(--crusader-red) 0%, var(--azulejo-yellow) 33%, var(--esperanca-green) 66%, var(--azulejo-blue) 100%);
}

/* ===== PULL QUOTE ===== */
.aps2 .pull-quote { border-left: 4px solid var(--azulejo-yellow); padding: 24px 32px; background: rgba(30,15,65,0.04); margin: 40px 0; }

.aps2 .pull-quote p {
  font-family: var(--font-display);
  font-size: 22px;
  line-height: 1.5;
  font-style: italic;
  color: var(--ultramarine);
  margin: 0;
}

.aps2 .pull-quote cite {
  display: block;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--crusader-red);
  margin-top: 12px;
  font-style: normal;
}

/* ===== DECORATIVE AZULEJO ===== */
.aps2 .azulejo-accent { width: 40px; height: 40px; margin-bottom: 20px; }

/* ===== TABS ===== */
.aps2 .tabs { display: flex; gap: 0; border-bottom: 2px solid rgba(30,15,65,0.1); margin-bottom: 48px; }

.aps2 .tab-btn {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #888;
  background: none;
  border: none;
  padding: 14px 24px;
  cursor: pointer;
  position: relative;
  transition: var(--transition);
}

.aps2 .tab-btn::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0; right: 0;
  height: 2px;
  background: var(--crusader-red);
  transform: scaleX(0);
  transition: var(--transition);
}

.aps2 .tab-btn.active { color: var(--ultramarine); }
.aps2 .tab-btn.active::after { transform: scaleX(1); }
.aps2 .tab-btn:hover { color: var(--ultramarine); }

.aps2 .tab-panel { display: none; }
.aps2 .tab-panel.active { display: block; }

/* ===== BANNER ===== */
.aps2 .banner { background: var(--azulejo-yellow); padding: 20px 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.aps2 .banner p { font-size: 15px; font-weight: 600; color: var(--ultramarine); margin: 0; }

/* ===== SVG ICON SYSTEM ===== */
.aps2 .icon { display: inline-block; vertical-align: middle; }

/* ===== ANIMATIONS ===== */
@keyframes aps2FadeUp {
  from { opacity: 0; transform: translateY(32px); }
  to { opacity: 1; transform: translateY(0); }
}

.aps2 .animate { opacity: 0; animation: aps2FadeUp 0.7s ease forwards; }
.aps2 .delay-1 { animation-delay: 0.1s; }
.aps2 .delay-2 { animation-delay: 0.2s; }
.aps2 .delay-3 { animation-delay: 0.3s; }
.aps2 .delay-4 { animation-delay: 0.4s; }
.aps2 .delay-5 { animation-delay: 0.5s; }

/* ===== FULL BLEED (Wild Apricot container fix) ===== */
.aps2 .full-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* ===== RESPONSIVE ===== */
@media (max-width: 900px) {
  .aps2 .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .aps2 .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .aps2 .footer-grid { grid-template-columns: 1fr 1fr; }
  .aps2 nav { padding: 0 24px; }
  .aps2 .container { padding: 0 24px; }
  .aps2 .hero-content { padding: 60px 24px 80px; }
  .aps2 .hero-strip { padding: 24px; }
  .aps2 .hero-strip-inner { gap: 28px; flex-wrap: wrap; }
  .aps2 .footer-newsletter { flex-direction: column; align-items: flex-start; }
  .aps2 .award-highlight { padding: 36px; }
}

@media (max-width: 768px) {
  .aps2 .nav-links { display: none; }
  .aps2 .hamburger { display: flex; }
  .aps2 .grid-3, .aps2 .grid-2 { grid-template-columns: 1fr; }
  .aps2 .grid-4 { grid-template-columns: 1fr 1fr; }
  .aps2 .event-card { grid-template-columns: 1fr; }
  .aps2 .event-card-date { padding: 20px; flex-direction: row; gap: 12px; justify-content: flex-start; }
  .aps2 .event-card-day { font-size: 32px; }
  .aps2 .footer-grid { grid-template-columns: 1fr; }
  .aps2 .banner { flex-direction: column; align-items: flex-start; padding: 20px 24px; }
  .aps2 .footer-bottom { flex-direction: column; gap: 12px; text-align: center; }
  .aps2 .membership-tier { margin-bottom: 24px; }
  .aps2 .newsletter-form { flex-direction: column; width: 100%; }
  .aps2 .newsletter-form input { border-right: 1px solid rgba(245,245,240,0.2); border-radius: 4px; width: 100%; }
  .aps2 .newsletter-form button { border-radius: 4px; }
}

@media (max-width: 480px) {
  .aps2 .grid-4 { grid-template-columns: 1fr; }
  .aps2 .hero h1 { font-size: 36px; }
  .aps2 .award-amount { font-size: 60px; }
}

/* ===== AZULEJO TILE SVG bg ===== */
.aps2 .tile-bg { position: absolute; top: 0; right: 0; width: 40%; height: 100%; opacity: 0.04; pointer-events: none; }

/* =====================================================================
   APS v2 — WA OVERRIDES
   Must stay at the END of the stylesheet so it wins over the theme.
   ===================================================================== */

/* --- WA layout: full-width content, only on pages containing .aps2 --- */
body:has(.aps2) .zoneContent { padding: 0 !important; }
body:has(.aps2) .WaPlaceHolderContent { max-width: none !important; }
body:has(.aps2) .WaPlaceHolderContent > div { padding: 0 !important; }
body:has(.aps2) .WaGadgetCustomHTML { overflow: visible !important; margin: 0 !important; }
body:has(.aps2) { overflow-x: hidden; }

/* --- Headings: the theme forces uppercase, bold and grey --- */
.aps2 h1, .aps2 h2, .aps2 h3 {
  text-transform: none !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  font-family: var(--font-display) !important;
}
.aps2 h4 { text-transform: none !important; letter-spacing: normal; }
.aps2 .hero h1, .aps2 .page-hero h1 { color: var(--parchment) !important; }
.aps2 .hero h1 em { color: var(--azulejo-yellow) !important; font-style: italic; }

/* --- Links: the theme colours every <a> dark navy --- */
.aps2 a, .aps2 a:hover, .aps2 a:visited { text-decoration: none !important; }

.aps2 .nav-links a, .aps2 .nav-links a:link, .aps2 .nav-links a:visited,
.aps2 .nav-links a:hover,
.aps2 .mobile-menu a, .aps2 .mobile-menu a:link, .aps2 .mobile-menu a:visited { color: var(--parchment) !important; }
.aps2 .nav-links a.active, .aps2 .mobile-menu a.active { color: var(--azulejo-yellow) !important; }
.aps2 .nav-links a.nav-cta { color: var(--white) !important; }
.aps2 .nav-links li { list-style: none; margin: 0; }
.aps2 nav.scrolled ~ .mobile-menu { top: 60px; }

.aps2 a.btn-primary, .aps2 a.btn-primary:link, .aps2 a.btn-primary:visited, .aps2 a.btn-primary:hover { color: var(--white) !important; }
.aps2 a.btn-outline-light, .aps2 a.btn-outline-light:link, .aps2 a.btn-outline-light:visited, .aps2 a.btn-outline-light:hover { color: var(--parchment) !important; }
.aps2 a.btn-secondary, .aps2 a.btn-secondary:link, .aps2 a.btn-secondary:visited { color: var(--ultramarine) !important; }
.aps2 a.btn-secondary:hover { color: var(--parchment) !important; }
.aps2 a.btn-yellow, .aps2 a.btn-yellow:link, .aps2 a.btn-yellow:visited, .aps2 a.btn-yellow:hover { color: var(--ultramarine) !important; }

/* --- HERO: background photo --- */
.aps2 .hero-photo {
  position: absolute;
  inset: 0;
  background-image: url('/resources/HomepageV2/hero-image.jpeg');
  background-size: cover;
  background-position: center 30%;
}
.aps2 .hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(30,15,65,0.85) 0%, rgba(30,15,65,0.70) 55%, rgba(30,15,65,0.40) 100%);
}
.aps2 .hero-desc { color: rgba(245,245,240,0.75) !important; }

@media (max-width: 768px) {
  .aps2 .hero-overlay { background: rgba(30,15,65,0.78); }
  .aps2 .hero-strip-divider { display: none; }
  .aps2 .hero-strip-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 24px; }
}

/* =====================================================================
   APS v2 — HOME SECTIONS
   Paste AFTER the "WA OVERRIDES" block.
   ===================================================================== */

/* --- Brand typography: H3 is Source Sans 3 Bold (H1/H2 stay DM Serif) --- */
.aps2 h3 {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
}

/* --- Theme safety: paragraphs and labels keep our colours --- */
.aps2 p { color: inherit; }
.aps2 .section-label { color: var(--crusader-red); }
.aps2 .section-label.text-yellow { color: var(--azulejo-yellow); }
.aps2 .section-label.text-blue { color: var(--azulejo-blue); }
.aps2 .text-parchment { color: var(--parchment) !important; }

/* --- Shared helpers --- */
.aps2 .btn-spaced { margin-top: 16px; }
.aps2 .welcome-grid { align-items: center; gap: 80px; }
.aps2 .section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;
}

/* --- Welcome: azulejo panel --- */
.aps2 .azulejo-panel {
  background: var(--ultramarine);
  padding: 48px;
  border-radius: 2px;
  overflow: hidden;
}
.aps2 .azulejo-panel svg { width: 100%; display: block; opacity: 0.9; }

/* --- Home events: cards built from the WA events module --- */
.aps2 .events-head { margin-bottom: 48px; }
.aps2 a.card, .aps2 a.card:visited, .aps2 a.card:hover { display: block; color: inherit !important; text-decoration: none !important; }
.aps2 .event-thumb {
  height: 220px;
  background-color: var(--ultramarine);
  background-image: linear-gradient(135deg, #1e0f41, #2d1a5e);
  background-size: cover;
  background-position: center;
}
.aps2 .card h3 { font-size: 20px; line-height: 1.3; }
.aps2 a.card:hover h3 { color: var(--crusader-red); }
.aps2 .card p.card-location { font-size: 14px; color: #555555; margin-bottom: 0; }
.aps2 .card-meta { margin-top: 16px; font-size: 13px; color: #666666; }
.aps2 .card.is-past .card-tag { color: #888888; }
.aps2 .events-empty { grid-column: 1 / -1; color: #666666; }

/* Loading placeholders */
.aps2 .card.is-loading { cursor: default; }
.aps2 .card.is-loading:hover { transform: none; box-shadow: none; }
.aps2 .card.is-loading .event-thumb { background-image: none; background-color: #e8e6ee; }
.aps2 .skeleton-line { height: 14px; background: #eeedf2; border-radius: 2px; margin-bottom: 12px; }
.aps2 .skeleton-line.short { width: 60%; }
.aps2 .card.is-loading .event-thumb,
.aps2 .skeleton-line { animation: aps2Pulse 1.4s ease-in-out infinite; }
@keyframes aps2Pulse { 50% { opacity: 0.55; } }

/* --- Membership CTA band --- */
.aps2 .cta-band {
  background: var(--ultramarine);
  padding: 96px 0;
  position: relative;
  overflow: hidden;
}
.aps2 .cta-band::before,
.aps2 .cta-band::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}
.aps2 .cta-band::before { right: -60px; top: -60px; width: 400px; height: 400px; background: rgba(140,180,220,0.07); }
.aps2 .cta-band::after { left: -40px; bottom: -60px; width: 280px; height: 280px; background: rgba(230,80,35,0.06); }
.aps2 .cta-band .container { position: relative; z-index: 1; }
.aps2 .cta-band-inner { max-width: 640px; margin: 0 auto; text-align: center; }
.aps2 .cta-band-inner h2 { margin-bottom: 20px; }
.aps2 .cta-band-inner .divider { margin: 24px auto; }
.aps2 .cta-band-text { color: rgba(245,245,240,0.7) !important; font-size: 17px; margin-bottom: 36px !important; }

/* --- Student award card --- */
.aps2 .award-kicker {
  color: rgba(245,245,240,0.5) !important;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.aps2 .award-title { color: var(--parchment) !important; font-size: 26px; margin: 16px 0 20px; }
.aps2 .award-text { color: rgba(245,245,240,0.65) !important; font-size: 15px; margin-bottom: 28px !important; }

/* --- Responsive --- */
@media (max-width: 900px) {
  .aps2 .welcome-grid { gap: 48px; }
}
@media (max-width: 768px) {
  .aps2 .section { padding: 72px 0; }
  .aps2 .events-head { margin-bottom: 32px; }
  .aps2 .azulejo-panel { padding: 32px; }
  .aps2 .cta-band { padding: 72px 0; }
}

/* =====================================================================
   APS v2 — EDITOR MODE FIXES
   Only applies inside the WA page editor (the live site has body.publicContentView).
   Makes every gadget easy to click and edit. Paste at the END of the stylesheet.
   ===================================================================== */
body:not(.publicContentView) .aps2 nav { position: relative !important; }
body:not(.publicContentView) .aps2 .mobile-menu { position: static !important; }
body:not(.publicContentView) .aps2 .hero { min-height: 640px !important; padding-top: 0 !important; }
body:not(.publicContentView) .aps2 .page-hero { padding-top: 80px !important; }
body:not(.publicContentView) .aps2 .animate { opacity: 1 !important; animation: none !important; }
body:not(.publicContentView) .WaGadgetCustomHTML { overflow: hidden !important; }

/* Editor-only gadget labels, taken from data-label="..." on the .aps2 wrapper */
body:not(.publicContentView) .aps2[data-label] { position: relative; }
body:not(.publicContentView) .aps2[data-label]::before {
  content: attr(data-label);
  position: absolute;
  top: 36px;
  left: 12px;
  z-index: 50;
  background: #f0b946;
  color: #1e0f41;
  font: 700 12px/1 'Source Sans 3', sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 3px;
  pointer-events: none;
}

/* =====================================================================
   APS v2 — EVENT DETAIL POPUP
   Paste at the END of the stylesheet (after the home CSS).
   ===================================================================== */

html.aps2-modal-open { overflow: hidden; }

.aps2.ev-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  background: transparent;
  overflow: visible;
}
.aps2.ev-modal[hidden] { display: none; }

.aps2 .ev-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(30,15,65,0.72);
  backdrop-filter: blur(3px);
  opacity: 0;
  transition: opacity 0.25s ease;
}

.aps2 .ev-modal-panel {
  position: relative;
  width: 100%;
  max-width: 980px;
  max-height: calc(100vh - 64px);
  overflow-y: auto;
  background: var(--parchment);
  border-radius: 4px;
  box-shadow: 0 32px 80px rgba(10,5,30,0.45);
  outline: none;
  opacity: 0;
  transform: translateY(24px) scale(0.98);
  transition: opacity 0.25s ease, transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.aps2.ev-modal.is-open .ev-modal-backdrop { opacity: 1; }
.aps2.ev-modal.is-open .ev-modal-panel { opacity: 1; transform: none; }

.aps2 .ev-modal-close {
  position: sticky;
  top: 16px;
  float: right;
  margin: 16px 16px -56px 0;
  z-index: 3;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: rgba(245,245,240,0.92);
  color: var(--ultramarine);
  font-size: 26px;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
  transition: var(--transition);
}
.aps2 .ev-modal-close:hover { background: var(--azulejo-yellow); transform: rotate(90deg); }

/* --- Header with photo --- */
.aps2 .ev-modal-hero {
  position: relative;
  min-height: 300px;
  display: flex;
  align-items: flex-end;
  background-color: var(--ultramarine);
  background-image: linear-gradient(135deg, #1e0f41, #2d1a5e);
  background-size: cover;
  background-position: center;
}
.aps2 .ev-modal-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(30,15,65,0.95) 0%, rgba(30,15,65,0.55) 55%, rgba(30,15,65,0.15) 100%);
}
.aps2 .ev-modal-hero-inner {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  gap: 24px;
  padding: 40px 48px 36px;
}
.aps2 .ev-date-badge {
  flex-shrink: 0;
  width: 84px;
  padding: 12px 0 10px;
  background: var(--ultramarine);
  border-top: 4px solid var(--crusader-red);
  text-align: center;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
.aps2 .ev-date-day { display: block; font-family: var(--font-display); font-size: 40px; line-height: 1; color: var(--azulejo-yellow); }
.aps2 .ev-date-month {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(245,245,240,0.7);
}
.aps2 .ev-modal-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--azulejo-yellow) !important;
  margin-bottom: 8px !important;
}
.aps2 .ev-modal-hero h2 { color: var(--parchment) !important; font-size: clamp(26px, 3.4vw, 40px); max-width: 640px; }

/* --- Body --- */
.aps2 .ev-modal-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 48px;
  padding: 40px 48px 48px;
}

.aps2 .ev-desc { font-size: 16px; line-height: 1.7; color: #333333; }
.aps2 .ev-desc p, .aps2 .ev-desc div { margin-bottom: 1em; }
.aps2 .ev-desc strong { color: var(--ultramarine); }
.aps2 .ev-desc ul, .aps2 .ev-desc ol { padding-left: 22px; margin-bottom: 1em; }
.aps2 .ev-desc li { margin-bottom: 4px; }
.aps2 .ev-desc img { max-width: 100%; height: auto; display: block; margin: 20px 0; border-radius: 2px; }
.aps2 .ev-desc a, .aps2 .ev-desc a:link, .aps2 .ev-desc a:visited {
  color: var(--crusader-red) !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
.aps2 .ev-desc a.stylizedButton {
  display: inline-block;
  padding: 12px 24px;
  border: 2px solid var(--ultramarine);
  border-radius: 4px;
  color: var(--ultramarine) !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none !important;
}
.aps2 .ev-desc a.stylizedButton:hover { background: var(--ultramarine); color: var(--parchment) !important; }

/* Descriptions pasted from emails use layout tables: flatten them so they fit the column */
.aps2 .ev-desc { min-width: 0; overflow-wrap: break-word; }
.aps2 .ev-desc table, .aps2 .ev-desc tbody, .aps2 .ev-desc tr, .aps2 .ev-desc td, .aps2 .ev-desc th {
  display: block;
  width: auto !important;
  max-width: 100%;
  border: 0 !important;
}
.aps2 .ev-desc * { max-width: 100%; }
.aps2 .ev-desc h3 { font-size: 20px; margin: 1.2em 0 0.5em; color: var(--ultramarine); }
.aps2 .ev-desc h4 { font-size: 16px; margin: 1em 0 0.4em; color: var(--ultramarine); }
.aps2 .ev-desc blockquote { border-left: 4px solid var(--azulejo-yellow); padding: 4px 0 4px 20px; margin: 1em 0; }

/* --- Sidebar --- */
.aps2 .ev-side { align-self: start; position: sticky; top: 24px; }
.aps2 .ev-facts { background: #ffffff; border-top: 4px solid var(--azulejo-blue); padding: 8px 24px; margin-bottom: 20px; }
.aps2 .ev-fact { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(30,15,65,0.08); }
.aps2 .ev-fact:last-child { border-bottom: 0; }
.aps2 .ev-fact-icon { flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; color: var(--crusader-red); }
.aps2 .ev-fact-icon svg { width: 18px; height: 18px; display: block; }
.aps2 .ev-fact-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #888888;
}
.aps2 .ev-fact-value { display: block; font-size: 15px; color: var(--ultramarine); line-height: 1.45; }

.aps2 .ev-tickets { background: #ffffff; padding: 20px 24px; margin-bottom: 20px; }
.aps2 .ev-tickets h4 {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--crusader-red);
  margin-bottom: 8px;
}
.aps2 .ev-tickets ul { list-style: none; }
.aps2 .ev-tickets li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(30,15,65,0.08);
  font-size: 14px;
}
.aps2 .ev-tickets li:last-child { border-bottom: 0; }
.aps2 .ev-ticket-name { color: #444444; }
.aps2 .ev-ticket-name small { display: block; font-size: 12px; color: #888888; }
.aps2 .ev-ticket-price { font-family: var(--font-display); font-size: 20px; color: var(--ultramarine); white-space: nowrap; }

.aps2 .ev-actions { display: flex; flex-direction: column; gap: 12px; }
.aps2 .ev-actions .btn { justify-content: center; width: 100%; }
.aps2 .ev-past-note { font-size: 14px; color: #888888; font-style: italic; margin: 0 0 4px !important; }

/* --- Responsive: full-screen sheet on phones --- */
@media (max-width: 860px) {
  .aps2 .ev-modal-body { grid-template-columns: 1fr; gap: 32px; padding: 32px 24px 40px; }
  .aps2 .ev-side { position: static; order: -1; }
  .aps2 .ev-modal-hero-inner { padding: 32px 24px 28px; }
}
@media (max-width: 600px) {
  .aps2.ev-modal { padding: 0; }
  .aps2 .ev-modal-panel { max-height: 100%; height: 100%; border-radius: 0; }
  .aps2 .ev-modal-hero { min-height: 240px; }
  .aps2 .ev-date-badge { width: 64px; }
  .aps2 .ev-date-day { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .aps2 .ev-modal-backdrop, .aps2 .ev-modal-panel { transition: none; }
}

/* =====================================================================
   APS v2 — FOOTER
   Paste at the END of the stylesheet.
   ===================================================================== */

.aps2 .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.aps2 footer h4 { font-family: var(--font-body) !important; }
.aps2 .footer-newsletter-text h4 { font-family: var(--font-display) !important; font-weight: 400; }
.aps2 .footer-newsletter-text p,
.aps2 .footer-brand p { color: rgba(245,245,240,0.55) !important; }

.aps2 .footer-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}
.aps2 .footer-logo span {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1.3;
  color: var(--parchment);
}
.aps2 .footer-brand-note { margin-top: 16px; }

.aps2 .sponsors-label {
  flex-shrink: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(245,245,240,0.25);
}

/* Theme colours every link dark navy: restore footer link colours */
.aps2 footer a, .aps2 footer a:link, .aps2 footer a:visited { text-decoration: none !important; }
.aps2 .footer-col ul li a, .aps2 .footer-col ul li a:link, .aps2 .footer-col ul li a:visited { color: rgba(245,245,240,0.55) !important; }
.aps2 .footer-col ul li a:hover { color: var(--parchment) !important; }
.aps2 .footer-col ul li { list-style: none; }

.aps2 .footer-social { display: flex; gap: 12px; margin-top: 24px; }
.aps2 .footer-social a {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  background: rgba(245,245,240,0.08);
  color: rgba(245,245,240,0.6) !important;
  transition: var(--transition);
}
.aps2 .footer-social a:hover { background: var(--azulejo-yellow); color: var(--ultramarine) !important; }
.aps2 .footer-social svg { width: 16px; height: 16px; }

/* Newsletter field: override theme input styling */
.aps2 .newsletter-form input[type="email"] {
  height: auto !important;
  margin: 0 !important;
  box-shadow: none !important;
  background: rgba(245,245,240,0.1) !important;
  color: var(--parchment) !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
}
.aps2 .newsletter-form input[type="email"]:focus { border-color: var(--azulejo-yellow) !important; }
.aps2 .newsletter-form button { margin: 0 !important; }

/* WA branding line: blended into the footer (kept visible, as WA requires on most plans) */
body:has(.aps2) .zoneWAbranding {
  background: #1e0f41;
  padding: 0 0 20px;
  margin: 0;
}
body:has(.aps2) #idFooterPoweredByContainer {
  text-align: center;
  font-family: 'Source Sans 3', sans-serif;
  font-size: 11px;
  letter-spacing: 0.04em;
  color: rgba(245,245,240,0.25);
}
body:has(.aps2) #idFooterPoweredByContainer a,
body:has(.aps2) #idFooterPoweredByContainer a:link,
body:has(.aps2) #idFooterPoweredByContainer a:visited {
  color: rgba(245,245,240,0.35) !important;
  text-decoration: none !important;
}
body:has(.aps2) #idFooterPoweredByContainer a:hover { color: var(--azulejo-yellow, #f0b946) !important; }

/* =====================================================================
   APS v2 — EVENTS PAGE
   Paste at the END of the stylesheet.
   ===================================================================== */

/* --- Views: the script sets data-state on #aps2EventsPage --- */
#aps2EventsPage [data-view] { display: none; }
#aps2EventsPage[data-state="list"] [data-view="list"],
#aps2EventsPage[data-state="registration"] [data-view="compact"],
#aps2EventsPage[data-state="other"] [data-view="compact"] { display: block; }

/* The native Event calendar is the data source: hidden once our view has loaded */
html.aps2-hide-native-events .WaGadgetEvents { display: none !important; }

/* --- Page hero --- */
.aps2 .page-hero .tile-bg { position: absolute; top: 0; right: 0; width: 40%; height: 100%; opacity: 0.06; pointer-events: none; }
.aps2 .page-hero .section-label.text-blue { color: var(--azulejo-blue); }
.aps2 .page-hero-compact { padding: 128px 0 56px; }
.aps2 .page-hero-compact h1 { font-size: clamp(30px, 4vw, 44px); margin-bottom: 12px; }
.aps2 a.page-hero-back, .aps2 a.page-hero-back:visited {
  color: var(--azulejo-yellow) !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* --- Tabs --- */
.aps2 .tab-btn { display: inline-flex; align-items: center; gap: 8px; }
.aps2 .tab-count {
  min-width: 22px;
  padding: 2px 7px;
  border-radius: 11px;
  background: rgba(30,15,65,0.08);
  color: var(--ultramarine);
  font-size: 11px;
  letter-spacing: 0;
  line-height: 1.4;
}
.aps2 .tab-count:empty { display: none; }
.aps2 .tab-btn.active .tab-count { background: var(--crusader-red); color: var(--white); }

/* --- Upcoming: wide cards --- */
.aps2 .event-card { cursor: pointer; }
.aps2 .event-card.has-thumb { grid-template-columns: 160px 1fr 300px; }
.aps2 .event-card-thumb { background-size: cover; background-position: center; min-height: 100%; }
.aps2 .event-card-body h3 { font-size: 22px; line-height: 1.3; }
.aps2 .event-card:hover .event-card-body h3 { color: var(--crusader-red); }
.aps2 .event-meta-item svg { color: var(--crusader-red); opacity: 1; }
.aps2 .event-card-body p { color: #555555; }
.aps2 .event-card-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.aps2 .event-card.is-loading { cursor: default; min-height: 180px; }
.aps2 .event-card.is-loading:hover { transform: none; box-shadow: none; }
.aps2 .event-card.is-loading .event-card-date { background: #e8e6ee; }

/* Empty state */
.aps2 .events-empty-box {
  background: #ffffff;
  border-top: 4px solid var(--azulejo-yellow);
  padding: 48px;
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}
.aps2 .events-empty-box h3 { font-size: 24px; margin-bottom: 12px; color: var(--ultramarine); }
.aps2 .events-empty-box p { color: #555555; max-width: 520px; margin-left: auto; margin-right: auto; }
.aps2 .events-empty-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }

/* --- Past: grid + load more --- */
.aps2 .events-more { text-align: center; margin-top: 40px; }
.aps2 .events-more .btn[disabled] { opacity: 0.6; cursor: wait; }

/* --- Fundraising --- */
.aps2 .fundraising-grid { align-items: center; gap: 64px; }
.aps2 .fundraising-list { list-style: none; margin-top: 20px; }
.aps2 .fundraising-list li {
  padding: 16px 0;
  border-bottom: 1px solid rgba(245,245,240,0.1);
  color: rgba(245,245,240,0.65);
  font-size: 15px;
}
.aps2 .fundraising-list li:last-child { border-bottom: 0; }
.aps2 .fundraising-list strong { display: block; color: var(--azulejo-yellow); font-size: 16px; margin-bottom: 2px; }

/* --- Native WA registration steps, restyled (shown under the compact header) --- */
body:has(#aps2EventsPage) .WaGadgetEventsStateRegistration,
body:has(#aps2EventsPage) .WaGadgetPublicWizard {
  max-width: 1104px;
  margin: 0 auto !important;
  padding: 56px 48px 96px !important;
  font-family: 'Source Sans 3', sans-serif;
  color: #1e0f41;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard .pageTitle { display: none; }
body:has(#aps2EventsPage) .WaGadgetPublicWizard .infoOuterContainer {
  background: #ffffff;
  border-top: 4px solid #8cb4dc;
  padding: 24px 28px;
  margin-bottom: 32px;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard .infoTitle {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #888888;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard .stepTitle,
body:has(#aps2EventsPage) .WaGadgetPublicWizard .formTitle {
  font-family: 'DM Serif Display', Georgia, serif !important;
  font-weight: 400 !important;
  text-transform: none !important;
  color: #1e0f41 !important;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="text"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="email"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="tel"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="password"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard select,
body:has(#aps2EventsPage) .WaGadgetPublicWizard textarea {
  border: 1px solid rgba(30,15,65,0.2) !important;
  border-radius: 4px !important;
  padding: 10px 14px !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-size: 15px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard input:focus,
body:has(#aps2EventsPage) .WaGadgetPublicWizard select:focus,
body:has(#aps2EventsPage) .WaGadgetPublicWizard textarea:focus { border-color: #e65023 !important; outline: none; }
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="submit"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard input[type="button"],
body:has(#aps2EventsPage) .WaGadgetPublicWizard .stylizedButton {
  background: #e65023 !important;
  border: 2px solid #e65023 !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 12px 28px !important;
  cursor: pointer;
}
body:has(#aps2EventsPage) .WaGadgetPublicWizard .navigationContainer .left input {
  background: transparent !important;
  color: #1e0f41 !important;
  border-color: #1e0f41 !important;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
  .aps2 .event-card.has-thumb { grid-template-columns: 140px 1fr; }
  .aps2 .event-card-thumb { display: none; }
}
@media (max-width: 860px) {
  body:has(#aps2EventsPage) .WaGadgetPublicWizard { padding: 40px 24px 72px !important; }
}
@media (max-width: 768px) {
  .aps2 .event-card.has-thumb { grid-template-columns: 1fr; }
  .aps2 .event-card-thumb { display: block; min-height: 180px; order: -1; }
  .aps2 .events-empty-box { padding: 36px 24px; }
  .aps2 .tabs { overflow-x: auto; }
  .aps2 .tab-btn { padding: 14px 16px; white-space: nowrap; }
}

/* =====================================================================
   APS v2 — ABOUT PAGE
   ===================================================================== */

.aps2 .about-intro { align-items: start; gap: 80px; }

.aps2 .about-stats { display: flex; gap: 40px; flex-wrap: wrap; margin-top: 36px; }
.aps2 .about-stat-number { display: block; font-family: var(--font-display); font-size: 36px; line-height: 1; color: var(--crusader-red); }
.aps2 .about-stat-label {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #888888;
}

/* Treaty of Windsor card (as in the draft) */
.aps2 .treaty-card {
  position: relative;
  overflow: hidden;
  background: var(--parchment);
  padding: 48px;
  border-radius: 2px;
}
.aps2 .treaty-card-motif {
  position: absolute;
  right: -20px;
  bottom: -20px;
  width: 200px;
  height: 200px;
  opacity: 0.07;
  pointer-events: none;
}
.aps2 .treaty-card > *:not(.treaty-card-motif) { position: relative; }
.aps2 .treaty-card .section-label { color: var(--crusader-red); }
.aps2 .treaty-card h3 {
  font-family: var(--font-display) !important;
  font-weight: 400 !important;
  font-size: 22px;
  margin-bottom: 16px;
  color: var(--ultramarine);
}
.aps2 .treaty-card p:not(.section-label) { font-size: 15px; color: #555555; }
.aps2 .treaty-quote { margin-top: 24px; padding-top: 24px; border-top: 2px solid var(--azulejo-yellow); }
.aps2 .treaty-quote p { font-family: var(--font-display) !important; font-style: italic; font-size: 18px !important; line-height: 1.5; color: var(--ultramarine) !important; margin: 0; }
.aps2 .treaty-quote cite {
  display: block;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--crusader-red);
}

/* Timeline */
.aps2 .timeline-wrap { max-width: 720px; margin: 0 auto; }
.aps2 .timeline-wrap > .section-label,
.aps2 .timeline-wrap > h2 { text-align: center; }
.aps2 .timeline-wrap > .divider { margin: 24px auto 48px; }
/* Theme greys out every h4: keep ours */
.aps2 .timeline-item h4, .aps2 .committee-member h4 { color: var(--ultramarine) !important; }

/* Committee */
.aps2 .committee-intro { max-width: 560px; color: #555555; margin-bottom: 48px !important; }
.aps2 .committee-leads { display: flex; justify-content: center; gap: 48px; flex-wrap: wrap; margin-bottom: 24px; }
.aps2 .committee-leads .committee-avatar { width: 104px; height: 104px; font-size: 34px; border: 3px solid var(--azulejo-yellow); }
.aps2 .committee-leads .committee-member h4 { font-size: 18px; }
.aps2 .committee-grid { padding-top: 24px; border-top: 1px solid rgba(30,15,65,0.08); }
.aps2 .committee-grid .committee-member p { color: #888888; }

/* Get involved */
.aps2 .get-involved {
  max-width: 640px;
  margin: 56px auto 0;
  padding: 40px;
  background: var(--parchment);
  border-radius: 2px;
  text-align: center;
}
.aps2 .get-involved h3 { font-size: 22px; margin-bottom: 12px; color: var(--ultramarine); }
.aps2 .get-involved p { font-size: 15px; color: #555555; margin-bottom: 24px !important; }

@media (max-width: 900px) {
  .aps2 .about-intro { gap: 48px; }
}
@media (max-width: 768px) {
  .aps2 .treaty-card { padding: 32px; }
  .aps2 .about-stats { gap: 28px; }
  .aps2 .committee-leads { gap: 24px; }
  .aps2 .get-involved { padding: 32px 24px; }
}

/* =====================================================================
   APS v2 — ACCOUNT (Log in / My account in the menu + login popup)
   ===================================================================== */

/* The native WA Login gadget is the engine: hidden on the live site, visible in the editor */
body.publicContentView:has(.aps2-navwrap) .WaGadgetLoginForm {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Show "Log in" or "My account" depending on the visitor */
/* Members are already logged in: no "Log in" and no "Join Us"; My account takes the last spot */
html.aps2-member .aps2 .nav-login,
html.aps2-member .aps2 .nav-join-li,
html.aps2-member .aps2 .mobile-anon { display: none !important; }
html:not(.aps2-member) .aps2 .nav-account,
html:not(.aps2-member) .aps2 .mobile-member { display: none !important; }

.aps2 .nav-account-li { position: relative; }
.aps2 .nav-links a.nav-login { opacity: 1; }

.aps2 .nav-links .nav-account-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  background: none;
  border: 0;
  padding: 6px 12px;
  border-radius: 4px;
  cursor: pointer;
  color: var(--parchment) !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: var(--transition);
}
.aps2 .nav-account-label { color: var(--parchment) !important; }
.aps2 .nav-account-toggle:hover,
.aps2 .nav-account.open .nav-account-toggle { background: rgba(245,245,240,0.1); }
.aps2 .nav-account-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--azulejo-yellow);
  color: var(--ultramarine);
  font-family: var(--font-display);
  font-size: 15px;
  letter-spacing: 0;
}

.aps2 .nav-account-dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 240px;
  background: var(--parchment);
  border-top: 4px solid var(--azulejo-yellow);
  border-radius: 4px;
  box-shadow: 0 20px 48px rgba(10,5,30,0.3);
  padding: 8px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: var(--transition);
}
.aps2 .nav-account.open .nav-account-dropdown { opacity: 1; visibility: visible; transform: none; }
.aps2 .nav-account-hello {
  padding: 10px 20px 12px;
  margin: 0 0 4px !important;
  border-bottom: 1px solid rgba(30,15,65,0.08);
  font-size: 12px !important;
  color: #888888 !important;
}
.aps2 .nav-account-hello strong { display: block; font-size: 15px; color: var(--ultramarine); }
/* Stronger than the white ".nav-links a" rule so dropdown links stay readable */
.aps2 .nav-links .nav-account-dropdown a,
.aps2 .nav-links .nav-account-dropdown a:link,
.aps2 .nav-links .nav-account-dropdown a:visited,
.aps2 .nav-links .nav-account-dropdown a.active,
.aps2 .nav-links .nav-account-dropdown button {
  display: block;
  width: 100%;
  text-align: left;
  padding: 10px 20px !important;
  background: none !important;
  border: 0;
  border-radius: 0 !important;
  color: var(--ultramarine) !important;
  opacity: 1 !important;
  font-family: var(--font-body);
  font-size: 14px !important;
  font-weight: 600;
  letter-spacing: 0 !important;
  text-transform: none !important;
  cursor: pointer;
}
.aps2 .nav-links .nav-account-dropdown a:hover,
.aps2 .nav-links .nav-account-dropdown button:hover { background: rgba(30,15,65,0.05) !important; color: var(--crusader-red) !important; }
.aps2 .nav-links .nav-account-dropdown button { border-top: 1px solid rgba(30,15,65,0.08) !important; margin-top: 4px; }

/* --- Login popup (reuses the event popup frame) --- */
.aps2 .acc-panel { max-width: 460px; padding: 48px 44px 36px; }
.aps2 .acc-panel .ev-modal-close { margin: -32px -28px 0 0; background: rgba(30,15,65,0.06); }
.aps2 .acc-head { margin-bottom: 28px; }
.aps2 .acc-head h2 { font-size: 32px; margin-bottom: 8px; color: var(--ultramarine); }
.aps2 .acc-head p:not(.section-label) { font-size: 15px; color: #555555; }

/* WA's own form, restyled */
.aps2 .acc-form .loginContainerForm,
.aps2 .acc-form .loginContainerFormInner { display: flex; flex-direction: column; gap: 0; visibility: visible !important; opacity: 1 !important; position: static !important; }
.aps2 .acc-form .openAuthFormContainer { order: 2; margin-top: 24px; padding-top: 24px; border-top: 1px solid rgba(30,15,65,0.1); }
.aps2 .acc-form .oAuthButtonsContainer { display: flex; flex-direction: column; gap: 10px; }
.aps2 .acc-form .wa-authenticateLoginLink {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 16px;
  border: 1px solid rgba(30,15,65,0.18);
  border-radius: 4px;
  background: #ffffff;
  color: var(--ultramarine) !important;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: var(--transition);
}
.aps2 .acc-form .wa-authenticateLoginLink:hover { border-color: var(--ultramarine); }
.aps2 .acc-form .loginUserName,
.aps2 .acc-form .loginPassword { margin-bottom: 14px; }
.aps2 .acc-form .loginUserName label,
.aps2 .acc-form .loginPassword label { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #888888; }
.aps2 .acc-form input.emailTextBoxControl,
.aps2 .acc-form input.passwordTextBoxControl {
  width: 100% !important;
  height: auto !important;
  padding: 13px 16px !important;
  border: 1px solid rgba(30,15,65,0.2) !important;
  border-radius: 4px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  font-family: var(--font-body) !important;
  font-size: 15px !important;
  color: var(--ultramarine) !important;
}
.aps2 .acc-form input.emailTextBoxControl:focus,
.aps2 .acc-form input.passwordTextBoxControl:focus { border-color: var(--crusader-red) !important; outline: none; }
.aps2 .acc-form .password-wrapper { position: relative; }
.aps2 .acc-form .toggle-password { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: #888888; cursor: pointer; }
.aps2 .acc-form .loginActionRememberMe { display: flex; align-items: center; gap: 8px; margin: 4px 0 20px; font-size: 14px; color: #555555; }
.aps2 .acc-form input.loginButtonControl {
  width: 100%;
  padding: 14px 28px !important;
  border: 2px solid var(--crusader-red) !important;
  border-radius: 4px !important;
  background: var(--crusader-red) !important;
  color: #ffffff !important;
  font-family: var(--font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  cursor: pointer;
  transition: var(--transition);
}
.aps2 .acc-form input.loginButtonControl:hover { background: #c93e18 !important; border-color: #c93e18 !important; }
.aps2 .acc-form .loginPasswordForgot { margin-top: 14px; text-align: center; }
.aps2 .acc-form .loginPasswordForgot a,
.aps2 .acc-join a { color: var(--crusader-red) !important; font-weight: 600; font-size: 14px; }
.aps2 .acc-join { margin-top: 24px !important; padding-top: 20px; border-top: 1px solid rgba(30,15,65,0.08); text-align: center; font-size: 14px !important; color: #555555 !important; }

@media (max-width: 600px) {
  .aps2 .acc-panel { padding: 40px 24px 28px; }
  .aps2 .acc-panel .ev-modal-close { margin: -24px -8px 0 0; }
}

/* =====================================================================
   APS v2 — MEMBERSHIP PAGE
   ===================================================================== */

/* --- Guest vs member views (class set on <html> by the shared script) --- */
html.aps2-member #aps2Membership .for-guests,
html:not(.aps2-member) #aps2Membership .for-members { display: none !important; }
html.aps2-member body:has(#aps2Membership) .WaGadgetMembershipApplication { display: none !important; }

/* After "Next", WA reloads on the next step: show only the form */
html.aps2-apply-step .aps2 .hide-on-step { display: none !important; }
html.aps2-apply-step .aps2 .apply-head { padding-top: 120px; }
html:not(.aps2-apply-step) .aps2 .show-on-step,
html.aps2-apply-step .aps2 .show-on-select { display: none; }

/* --- Banner --- */
.aps2 .banner .btn { padding: 10px 20px; }

/* --- Levels --- */
.aps2 .membership-head { text-align: center; max-width: 560px; margin: 0 auto 56px; }
.aps2 .membership-head .divider { margin: 24px auto; }
.aps2 .membership-head p { color: #555555; }
.aps2 .membership-tiers {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 360px));
  justify-content: center;
  gap: 32px;
  align-items: start;
}
.aps2 .membership-tier h3 { font-family: var(--font-display) !important; font-weight: 400 !important; font-size: 26px; color: var(--ultramarine); }
.aps2 .membership-tier.featured h3 { color: var(--parchment) !important; }
.aps2 .membership-tier.featured .membership-features li { color: rgba(245,245,240,0.85); }
.aps2 .membership-tier[hidden] { display: none; }
.aps2 .btn-block { width: 100%; justify-content: center; }

/* --- Application heading (sits right above WA's form) --- */
.aps2 .apply-head { background: var(--parchment); padding: 24px 0 8px; }
.aps2 .apply-head h2 { margin-bottom: 20px; }
.aps2 .apply-steps { display: flex; flex-wrap: wrap; gap: 12px; list-style: none; counter-reset: step; }
.aps2 .apply-steps li {
  counter-increment: step;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px 8px 8px;
  background: #ffffff;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ultramarine);
}
.aps2 .apply-steps li::before {
  content: counter(step);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ultramarine);
  color: var(--azulejo-yellow);
  font-family: var(--font-display);
  font-size: 13px;
}

/* --- WA's forms (membership application + donation), restyled as one centred card --- */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) {
  background: #f5f5f0;
  margin: 0 !important;
  padding: 8px 24px 96px !important;
  font-family: 'Source Sans 3', sans-serif !important;
  color: #1e0f41;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .generalFormOuterContainer { max-width: 820px; margin: 0 auto; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .generalFormContainer {
  background: #ffffff;
  border-top: 4px solid #e65023;
  border-radius: 2px;
  box-shadow: 0 12px 40px rgba(30,15,65,0.06);
  padding: 40px 44px 36px !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formOuterContainer,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formContainer { background: none !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }

/* Step title on the left, small "* Mandatory fields" note on the right */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleOuterContainer {
  padding-bottom: 16px;
  margin-bottom: 28px;
  border-bottom: 1px solid rgba(30,15,65,0.1);
  text-align: left !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleContainer, :is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleOuterContainer * { border: 0 !important; background: none !important; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleContainer,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleContainer .inner { width: 100% !important; float: none !important; box-sizing: border-box; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitleContainer .inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 0;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .formTitle,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .stepTitle {
  font-family: 'DM Serif Display', Georgia, serif !important;
  font-weight: 400 !important;
  font-size: 26px !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  text-align: left !important;
  color: #1e0f41 !important;
  margin: 0 24px 0 0 !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .mandatoryFieldsTitle {
  float: none !important;
  margin-left: auto !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 12px;
  background: #f5f5f0 !important;
  font-size: 12px !important;
  color: #888888 !important;
  white-space: nowrap;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .mandatoryFieldsTitle strong { font-weight: 600 !important; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .mandatorySymbol { color: #e65023 !important; font-weight: 700; }

/* Labels above their fields instead of in a narrow left column */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .fieldSubContainer { display: flow-root; margin-bottom: 20px; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .fieldLabel {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 0 10px !important;
  text-align: left !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #888888 !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .fieldBody { float: none !important; width: auto !important; margin: 0 !important; }

/* Level choices as selectable cards (first step only) */
html body:has(#aps2Membership) .WaGadgetMembershipApplicationStateSelectLevel .fieldItem {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  width: auto !important;
  padding: 18px 20px;
  margin-bottom: 12px;
  border: 1px solid rgba(30,15,65,0.15);
  border-radius: 4px;
  background: #ffffff;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
html body:has(#aps2Membership) .WaGadgetMembershipApplicationStateSelectLevel .fieldItem:hover { border-color: rgba(30,15,65,0.4); }
html body:has(#aps2Membership) .WaGadgetMembershipApplicationStateSelectLevel .fieldItem:has(input:checked) { border-color: #e65023; box-shadow: 0 0 0 1px #e65023; background: #fffaf8; }
html body:has(#aps2Membership) .WaGadgetMembershipApplicationStateSelectLevel .fieldItem label { cursor: pointer; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="radio"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="checkbox"] { accent-color: #e65023; width: 18px; height: 18px; margin: 3px 0 0 !important; flex-shrink: 0; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .labelTitle { font-weight: 700; color: #1e0f41; letter-spacing: 0.04em; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .levelPrice { color: #e65023; font-weight: 700; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .labelSubTitle,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .typeInstruction,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .levelRenewal,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .levelRecurring,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .levelBundle { font-size: 13px; color: #666666; font-style: normal; }

/* Text fields on the following steps */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="text"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="email"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="tel"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="password"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) select,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) textarea {
  width: 100% !important;
  max-width: 520px;
  border: 1px solid rgba(30,15,65,0.2) !important;
  border-radius: 4px !important;
  padding: 11px 14px !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-size: 15px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input:focus,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) select:focus,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) textarea:focus { border-color: #e65023 !important; outline: none; }

/* Other steps: compact checkboxes / radios (Gift Aid, privacy policy...) */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .fieldItem { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; font-size: 14px; color: #444444; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .typeInstruction { display: block; margin-top: 6px; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="file"] { font-size: 14px; }

/* Summary of the chosen level at the top of the details step */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .infoOuterContainer,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .membershipLevelInfo {
  background: #f5f5f0 !important;
  border-left: 3px solid #e65023;
  border-radius: 2px;
  padding: 16px 20px !important;
  margin-bottom: 28px;
  font-size: 14px;
  color: #1e0f41;
}

/* Buttons: bottom of the card, Back on the left, Next on the right */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .navigationOuterContainer { margin-top: 8px; padding-top: 24px; border-top: 1px solid rgba(30,15,65,0.1); }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .navigationContainer { display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .navigationContainer .left { margin-right: auto; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="submit"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="button"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .stylizedButton {
  background: #e65023 !important;
  border: 2px solid #e65023 !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  font-family: 'Source Sans 3', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding: 14px 36px !important;
  height: auto !important;
  width: auto !important;
  cursor: pointer;
  transition: background 0.2s ease;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[type="submit"]:hover { background: #c93e18 !important; border-color: #c93e18 !important; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .navigationContainer .left input {
  background: transparent !important;
  color: #1e0f41 !important;
  border-color: #1e0f41 !important;
}

/* Back and Cancel are secondary; only Next / Pay stand out */
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_prev"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_prevTop"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_cancel"],
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_cancelTop"] {
  background: transparent !important;
  color: #1e0f41 !important;
  border-color: rgba(30,15,65,0.35) !important;
}
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_prev"]:hover,
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_cancel"]:hover { border-color: #1e0f41 !important; background: rgba(30,15,65,0.04) !important; }
:is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) input[id$="_cancel"] { border-color: transparent !important; padding-left: 0 !important; padding-right: 0 !important; text-decoration: underline; }

/* The heading above the form lines up with the card */
.aps2 .apply-head .container { max-width: 916px; }

/* --- Members view --- */
.aps2 .member-actions { align-items: stretch; }
.aps2 a.member-action {
  display: flex;
  flex-direction: column;
  padding: 36px 32px;
  background: #ffffff;
  border-top: 4px solid var(--azulejo-blue);
  border-radius: 2px;
  color: var(--ultramarine) !important;
  transition: var(--transition);
}
.aps2 a.member-action:hover { transform: translateY(-6px); box-shadow: 0 20px 48px rgba(30,15,65,0.12); }
.aps2 .member-action-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 20px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(230,80,35,0.08);
  color: var(--crusader-red);
}
.aps2 .member-action-icon svg { width: 22px; height: 22px; }
.aps2 .member-action h3 { font-size: 20px; margin-bottom: 10px; color: var(--ultramarine); }
.aps2 .member-action p { font-size: 14px; color: #555555; flex: 1; }
.aps2 .member-action-link { margin-top: 20px; font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--crusader-red); }

/* --- Benefits --- */
.aps2 .benefits-grid { margin-top: 24px; }
.aps2 .benefit h4 { font-size: 16px; font-weight: 700; margin-bottom: 8px; color: var(--ultramarine) !important; }
.aps2 .benefit p { font-size: 14px; color: #666666; margin: 0; }
.aps2 .benefit-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.aps2 .benefit-icon svg { width: 22px; height: 22px; }
.aps2 .benefit-red { background: rgba(230,80,35,0.08); color: var(--crusader-red); }
.aps2 .benefit-blue { background: rgba(140,180,220,0.18); color: #3a6ea5; }
.aps2 .benefit-green { background: rgba(0,165,95,0.1); color: var(--esperanca-green); }
.aps2 .benefit-yellow { background: rgba(240,185,70,0.18); color: #b07d12; }

/* --- Use of fees + cheques --- */
.aps2 .fees-grid { align-items: start; gap: 64px; }
.aps2 .check-list { list-style: none; margin-top: 8px; }
.aps2 .check-list li { position: relative; padding: 8px 0 8px 28px; font-size: 15px; color: #444444; border-bottom: 1px solid rgba(30,15,65,0.06); }
.aps2 .check-list li::before { content: '\2713'; position: absolute; left: 0; top: 8px; color: var(--esperanca-green); font-weight: 700; }
.aps2 .pay-card { background: #ffffff; border-top: 4px solid var(--azulejo-yellow); padding: 40px; border-radius: 2px; }
.aps2 .pay-card h3 { font-size: 22px; margin-bottom: 12px; color: var(--ultramarine); }
.aps2 .pay-card p { font-size: 15px; color: #555555; }
.aps2 .pay-card address {
  font-style: normal;
  margin: 16px 0 20px;
  padding: 16px 20px;
  background: var(--parchment);
  border-left: 3px solid var(--crusader-red);
  font-size: 15px;
  line-height: 1.7;
  color: var(--ultramarine);
}
.aps2 .pay-card-contact a { color: var(--crusader-red) !important; font-weight: 600; }

/* --- Corporate + donations --- */
.aps2 .support-grid { gap: 32px; align-items: stretch; }
.aps2 .corporate-card,
.aps2 .donate-card { padding: 48px; border-radius: 2px; display: flex; flex-direction: column; align-items: flex-start; }
.aps2 .corporate-card { background: var(--ultramarine); position: relative; overflow: hidden; }
.aps2 .corporate-card::before { content: ''; position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: rgba(240,185,70,0.07); pointer-events: none; }
.aps2 .corporate-card h2 { color: var(--parchment) !important; font-size: 30px; margin-bottom: 16px; }
.aps2 .corporate-card p:not(.section-label) { color: rgba(245,245,240,0.7) !important; font-size: 15px; margin-bottom: 28px !important; flex: 1; }
.aps2 .donate-card { background: var(--parchment); border-top: 4px solid var(--esperanca-green); }
.aps2 .donate-card h2 { font-size: 30px; margin-bottom: 16px; color: var(--ultramarine); }
.aps2 .donate-card p:not(.section-label) { font-size: 15px; color: #555555; margin-bottom: 28px !important; flex: 1; }

/* --- Terms & Conditions accordion --- */
.aps2 .terms { background: #ffffff; border-radius: 2px; border: 1px solid rgba(30,15,65,0.08); }
.aps2 .terms summary {
  cursor: pointer;
  list-style: none;
  padding: 20px 28px;
  font-weight: 700;
  font-size: 15px;
  color: var(--ultramarine);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.aps2 .terms summary::-webkit-details-marker { display: none; }
.aps2 .terms summary::after { content: '+'; font-size: 22px; color: var(--crusader-red); transition: var(--transition); }
.aps2 .terms[open] summary::after { transform: rotate(45deg); }
.aps2 .terms-body { padding: 0 28px 28px; border-top: 1px solid rgba(30,15,65,0.08); }
.aps2 .terms-body h4 { font-size: 15px; font-weight: 700; margin: 20px 0 6px; color: var(--ultramarine) !important; }
.aps2 .terms-body p { font-size: 14px; color: #555555; }
.aps2 .terms-body > p:first-child { margin-top: 20px; }

@media (max-width: 900px) {
  .aps2 .fees-grid { gap: 40px; }
}
@media (max-width: 768px) {
  .aps2 .corporate-card, .aps2 .donate-card, .aps2 .pay-card { padding: 32px 24px; }
  :is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) { padding: 8px 16px 72px !important; }
  :is(body:has(#aps2Membership) .WaGadgetMembershipApplication, body:has(#aps2Donate) .WaGadgetDonationForm) .generalFormContainer { padding: 28px 20px 24px !important; }
}

/* =====================================================================
   APS v2 — DONATIONS PAGE
   The WA donation form itself shares the form styles from the MEMBERSHIP block.
   ===================================================================== */

.aps2 .donate-intro { align-items: start; gap: 64px; }

/* Amount picker */
.aps2 .amount-card {
  background: #ffffff;
  border-top: 4px solid var(--crusader-red);
  border-radius: 2px;
  padding: 40px;
  box-shadow: 0 12px 40px rgba(30,15,65,0.06);
}
.aps2 .amount-card h2 { font-size: clamp(26px, 3vw, 34px); margin-bottom: 24px; color: var(--ultramarine); }
.aps2 .amount-chips { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); gap: 10px; margin-bottom: 20px; }
.aps2 .amount-chip {
  padding: 14px 10px;
  border: 1px solid rgba(30,15,65,0.2);
  border-radius: 4px;
  background: #ffffff;
  color: var(--ultramarine);
  font-family: var(--font-display);
  font-size: 22px;
  cursor: pointer;
  transition: var(--transition);
}
.aps2 .amount-chip[data-amount="other"] { font-family: var(--font-body); font-size: 14px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.aps2 .amount-chip:hover { border-color: var(--ultramarine); }
.aps2 .amount-chip.active { background: var(--ultramarine); border-color: var(--ultramarine); color: var(--azulejo-yellow); }
.aps2 .giftaid-preview {
  min-height: 48px;
  padding: 12px 16px;
  margin-bottom: 20px !important;
  background: rgba(0,165,95,0.08);
  border-left: 3px solid var(--esperanca-green);
  border-radius: 2px;
  font-size: 14px !important;
  color: #2d4a3a !important;
}
.aps2 .giftaid-preview strong { color: var(--esperanca-green); }
.aps2 .amount-note { margin-top: 14px !important; font-size: 13px !important; color: #888888 !important; text-align: center; }

/* Gift Aid explainer */
.aps2 .giftaid-box {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-top: 28px;
  padding: 20px 24px;
  background: #ffffff;
  border-radius: 2px;
}
.aps2 .giftaid-badge {
  flex-shrink: 0;
  padding: 8px 12px;
  border: 2px solid var(--ultramarine);
  border-radius: 4px;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ultramarine);
}
.aps2 .giftaid-box p { font-size: 14px; color: #555555; margin: 0; }

/* WA donation form lays each field out as a 2-column table: stack label above field */
body:has(#aps2Donate) .WaGadgetDonationForm .fieldSubContainer > table,
body:has(#aps2Donate) .WaGadgetDonationForm .fieldSubContainer > table > tbody,
body:has(#aps2Donate) .WaGadgetDonationForm .fieldSubContainer > table > tbody > tr,
body:has(#aps2Donate) .WaGadgetDonationForm .fieldSubContainer > table > tbody > tr > td {
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  border: 0 !important;
}
body:has(#aps2Donate) .WaGadgetDonationForm .fieldSubContainer td.left .fieldLabel { width: auto !important; }
body:has(#aps2Donate) .WaGadgetDonationForm .donationAmountContainer input[type="text"] {
  max-width: 220px;
  font-family: 'DM Serif Display', Georgia, serif !important;
  font-size: 22px !important;
}
body:has(#aps2Donate) .WaGadgetDonationForm .g-recaptcha { margin: 8px 0 16px; }

@media (max-width: 900px) {
  .aps2 .donate-intro { gap: 40px; }
}
@media (max-width: 768px) {
  .aps2 .amount-card { padding: 28px 20px; }
  .aps2 .giftaid-box { flex-direction: column; align-items: flex-start; }
}