/*
 * Ewe Association of Colorado — Royal Earth visual refresh
 * A final, non-destructive presentation layer shared by the home and event pages.
 */

:root {
  --royal-gold: #efc332;
  --royal-gold-deep: #c99412;
  --royal-indigo: #071538;
  --royal-indigo-soft: #142653;
  --royal-terracotta: #b94f31;
  --royal-ivory: #fffdf8;
  --royal-line: rgba(229, 182, 34, .32);
  --royal-glow: 0 24px 70px rgba(5, 16, 45, .16);
}

::selection {
  color: var(--royal-indigo);
  background: var(--royal-gold);
}

body {
  background-image:
    radial-gradient(circle at 5% 20%, rgba(239, 195, 50, .055), transparent 25%),
    radial-gradient(circle at 95% 72%, rgba(185, 79, 49, .045), transparent 28%);
  background-attachment: fixed;
}

/* A more polished, jewel-like navigation treatment. */
.site-header,
.event-header {
  border-top-color: var(--royal-gold);
}

.site-header.scrolled,
.event-header {
  background: rgba(255, 253, 248, .92);
  box-shadow: 0 14px 44px rgba(5, 16, 45, .105);
  backdrop-filter: blur(22px) saturate(1.2);
}

.site-header .nav,
.event-header .header-inner {
  position: relative;
}

.site-header .nav::after,
.event-header .header-inner::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(239, 195, 50, .6), transparent);
  pointer-events: none;
}

.brand img,
.event-brand img {
  filter: drop-shadow(0 8px 15px rgba(5, 16, 45, .2));
  transition: transform .45s cubic-bezier(.2, .75, .2, 1), filter .45s ease;
}

.brand b,
.event-brand strong { letter-spacing: -.02em; }

.nav-menu a,
.event-nav a { text-underline-offset: 7px; }

/* Cinematic first impression with a crisp editorial frame. */
.hero,
.event-hero { isolation: isolate; }

.hero::before,
.event-hero::before {
  position: absolute;
  z-index: 4;
  inset: clamp(13px, 1.6vw, 24px);
  content: "";
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 2px;
  pointer-events: none;
}

.hero-shade,
.event-hero-shade {
  background:
    linear-gradient(180deg, rgba(2, 7, 24, .58), transparent 26%),
    linear-gradient(90deg, rgba(3, 9, 31, .91) 0%, rgba(7, 16, 43, .7) 44%, rgba(7, 16, 43, .2) 79%),
    linear-gradient(0deg, rgba(2, 8, 27, .86), transparent 59%);
}

.hero-copy > .overline,
.event-hero .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  padding: 8px 13px;
  border: 1px solid rgba(239, 195, 50, .44);
  border-radius: 999px;
  color: #f9dc75;
  background: rgba(4, 13, 38, .38);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035);
  backdrop-filter: blur(11px);
}

.hero-copy h1,
.event-hero h1 {
  text-shadow: 0 12px 36px rgba(0, 0, 0, .3);
}

.hero-copy h1 em,
.event-hero h1 em {
  color: #efc332;
  text-shadow: 0 0 46px rgba(239, 195, 50, .16);
}

.hero-stats div {
  border-color: rgba(239, 195, 50, .26);
  background: linear-gradient(145deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .045));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 13px 38px rgba(0, 0, 0, .16);
  backdrop-filter: blur(15px);
}

.hero-emblem {
  filter: drop-shadow(0 28px 48px rgba(0, 0, 0, .4));
}

.hero-emblem img { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6); }

.pill.gold,
.button.gold,
.event-donate {
  border: 1px solid rgba(255, 255, 255, .18);
  background: linear-gradient(135deg, #f5cf45, #e4ad18);
  box-shadow: 0 14px 34px rgba(218, 164, 18, .25), inset 0 1px 0 rgba(255, 255, 255, .45);
}

/* Layered paper and card surfaces. */
.welcome-ribbon {
  border-block: 1px solid rgba(239, 195, 50, .22);
}

.welcome-facts article,
.purpose-grid article,
.history-card,
.mission-grid article,
.belong-card,
.board-grid article:not(.board-card-photo),
.questions details,
.source-card,
.facts-grid,
.highlights-grid article {
  box-shadow: 0 18px 52px rgba(5, 16, 45, .085);
}

.purpose-grid article,
.history-card,
.belong-card:not(.belong-serve),
.board-grid article:not(.board-card-photo):not(.board-card-president),
.questions details,
.highlights-grid article {
  border-color: rgba(12, 25, 64, .12);
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .94), rgba(255, 253, 248, .78));
}

.welcome-facts article {
  background: linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .018));
}

.story.paper,
.leadership.paper,
.event-intro,
.events-directory,
.ceana-event-segment {
  background:
    radial-gradient(circle at 92% 8%, rgba(239, 195, 50, .09), transparent 25%),
    radial-gradient(circle at 8% 92%, rgba(185, 79, 49, .055), transparent 26%),
    #fffdf8;
}

.purpose-grid article,
.history-card,
.board-grid article:not(.board-card-photo),
.events-card,
.highlights-grid article { position: relative; overflow: hidden; }

.purpose-grid article::before,
.history-card::before,
.board-grid article:not(.board-card-photo)::before,
.highlights-grid article::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  content: "";
  background: linear-gradient(90deg, var(--royal-gold), var(--royal-terracotta), transparent 82%);
  opacity: .78;
}

.history-dot {
  box-shadow: 0 0 0 7px rgba(239, 195, 50, .1), 0 12px 30px rgba(5, 16, 45, .2);
}

.motto,
.gallery,
.about,
.event-memories,
.event-next {
  background-image:
    radial-gradient(circle at 84% 8%, rgba(239, 195, 50, .13), transparent 25%),
    radial-gradient(circle at 12% 88%, rgba(185, 79, 49, .1), transparent 28%),
    linear-gradient(145deg, #101f4d, #061231 72%);
}

.mission-grid article {
  border-color: rgba(239, 195, 50, .2);
  background: linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .035));
  backdrop-filter: blur(12px);
}

.portrait-track figure,
.gallery-card,
.gathering-photo,
.legacy-photo,
.ceana-segment-image,
.events-card,
.slideshow-viewport {
  box-shadow: 0 28px 74px rgba(3, 11, 34, .2);
}

.portrait-track figure,
.gallery-card,
.events-card { border: 1px solid rgba(239, 195, 50, .18); }

.gallery-card::after,
.events-card::after {
  position: absolute;
  inset: 0;
  content: "";
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: inherit;
  pointer-events: none;
}

.events-portal-card {
  border-color: rgba(239, 195, 50, .48);
  box-shadow: 0 36px 100px rgba(3, 11, 34, .3), 0 0 0 8px rgba(239, 195, 50, .045);
}

.ceana-timer-card,
.contact form {
  border-color: rgba(239, 195, 50, .24);
  box-shadow: 0 28px 80px rgba(5, 16, 45, .14);
}

.board-profile-photo {
  box-shadow: 0 18px 42px rgba(5, 16, 45, .24), 0 0 0 5px rgba(239, 195, 50, .08);
}

.questions details[open] {
  border-color: rgba(239, 195, 50, .55);
  box-shadow: 0 22px 60px rgba(5, 16, 45, .11);
}

.about .tags span,
.events-portal-tags > span {
  border-color: rgba(239, 195, 50, .34);
}

.facebook-button { box-shadow: 0 16px 42px rgba(24, 77, 71, .13); }

.event-facts { filter: drop-shadow(0 20px 32px rgba(5, 16, 45, .08)); }
.facts-grid article strong { color: var(--royal-indigo); }

.slideshow-viewport {
  border-color: rgba(239, 195, 50, .28);
  outline: 1px solid rgba(255, 255, 255, .07);
  outline-offset: -12px;
}

.slide-arrow {
  border-color: rgba(239, 195, 50, .48);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
}

.event-footer,
.footer {
  background-image: radial-gradient(circle at 50% -20%, rgba(239, 195, 50, .13), transparent 42%);
}

@media (hover: hover) {
  .brand:hover img,
  .event-brand:hover img {
    transform: translateY(-2px) rotate(-2deg) scale(1.04);
    filter: drop-shadow(0 12px 18px rgba(5, 16, 45, .26));
  }

  .purpose-grid article:hover,
  .history-card:hover,
  .board-grid article:hover,
  .highlights-grid article:hover {
    box-shadow: 0 28px 70px rgba(5, 16, 45, .14);
  }

  .pill.gold:hover,
  .button.gold:hover,
  .event-donate:hover {
    box-shadow: 0 20px 46px rgba(218, 164, 18, .34), inset 0 1px 0 rgba(255, 255, 255, .5);
  }
}

@media (max-width: 760px) {
  body { background-attachment: scroll; }
  .hero::before,
  .event-hero::before { inset: 9px; }
  .hero-copy > .overline,
  .event-hero .eyebrow { padding: 7px 10px; }
  .hero-stats div { backdrop-filter: blur(9px); }
  .slideshow-viewport { outline-offset: -7px; }
}

@media (prefers-reduced-motion: reduce) {
  .brand img,
  .event-brand img { transition: none; }
}

/* CEANA 2026 photo collection */
.ceana-photo-album{padding-top:3rem;padding-bottom:4rem;scroll-margin-top:6rem}
.ceana-photo-album h3,.ceana-memory-card h3{font-family:var(--display);font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.2;margin:0 0 1.5rem}
.ceana-photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.25rem}
.ceana-photo-grid .gallery-card{width:100%;height:350px;min-height:0}
.gallery-card.ceana-photo-card{background:#101b29}
.gallery-card.ceana-photo-card img{object-fit:contain;object-position:center;width:100%;height:100%}
.ceana-photo-card .gallery-card-copy{background:linear-gradient(transparent,rgba(0,0,0,.9));padding-top:3rem}
.ceana-memory-card p{font-size:1rem}
@media(max-width:980px){.ceana-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ceana-photo-grid{grid-template-columns:1fr}.ceana-photo-grid .gallery-card{height:420px}}

.ceana-photo-grid .gallery-card.ceana-photo-card{grid-column:auto;grid-row:auto}


#ceana-2027{scroll-margin-top:5rem}
#ceana-2027 .ceana-details span,#ceana-2027 .ceana-details b{font-size:1rem}
#ceana-2027 .ceana-timer-card>p{font-size:.9rem;letter-spacing:.08em}
#ceana-2027 .ceana-timer span{font-size:.875rem;letter-spacing:0}
#ceana-2027 .ceana-timer-card small{font-size:.875rem;line-height:1.6;display:block;margin-top:1rem;text-align:center}
#ceana-2027 .ceana-timer strong{font-size:clamp(1.6rem,4vw,3.4rem)}
#ceana-2027 .ceana-registration-note{margin:.9rem 0 0;color:#d7dbea;font-size:.9rem;line-height:1.55}
#ceana-2027::after{content:"2027"}
@media(max-width:620px){
  #ceana-2027 .ceana-actions{display:grid;grid-template-columns:1fr}
  #ceana-2027 .ceana-actions .pill{width:100%;justify-content:center;text-align:center}
}