/* Murpo 3.0.1 public presentation — faithful to the approved cinematic demo. */

.public-view .site-header {
  z-index: 70;
  height: 96px;
  border-bottom: 1px solid rgba(111, 158, 175, .22);
  background: rgba(3, 9, 14, .94);
  backdrop-filter: blur(18px);
}
.public-view .site-header-overlay {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  background: linear-gradient(180deg, rgba(2, 8, 13, .94), rgba(2, 8, 13, .38) 72%, transparent);
  backdrop-filter: none;
}
.public-view .header-inner {
  display: flex;
  width: min(1420px, calc(100vw - 64px));
  height: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 34px;
}
.public-view .v3-wordmark {
  display: flex;
  width: max-content;
  flex: none;
  align-items: flex-start;
  flex-direction: column;
  gap: 7px;
  color: #f7f9f8;
  line-height: 1;
}
.public-view .v3-wordmark strong {
  font-family: var(--sans);
  font-size: 32px;
  font-weight: 800;
  letter-spacing: .31em;
  line-height: .82;
}
.public-view .v3-wordmark small {
  color: #9eacb2;
  font-family: var(--mono);
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .23em;
  line-height: 1;
  text-transform: uppercase;
}
.header-navigation {
  display: flex;
  min-width: 0;
  height: 100%;
  align-items: center;
  justify-content: flex-end;
  gap: 26px;
}
.public-view .main-nav { gap: clamp(20px, 2.5vw, 40px); }
.public-view .main-nav > a { font-size: 10px; letter-spacing: .12em; }
.public-view .main-nav > a::after { background: var(--cyan); }
.site-menu-toggle {
  display: none;
  width: 52px;
  height: 52px;
  flex: none;
  place-items: center;
  padding: 14px;
  border: 1px solid rgba(126, 169, 184, .55);
  border-radius: 3px;
  background: rgba(3, 11, 17, .72);
  color: #eff4f4;
  cursor: pointer;
}
.site-menu-toggle span { display: block; width: 24px; height: 1px; margin: 3px 0; background: currentColor; transition: transform 180ms ease, opacity 180ms ease; }
.site-menu-open .site-menu-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.site-menu-open .site-menu-toggle span:nth-child(2) { opacity: 0; }
.site-menu-open .site-menu-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.main-nav-more { position: relative; height: 100%; }
.main-nav-more summary {
  display: flex;
  height: 100%;
  align-items: center;
  gap: 7px;
  color: #cbd4d7;
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  list-style: none;
  text-transform: uppercase;
}
.main-nav-more summary::-webkit-details-marker { display: none; }
.main-nav-more summary span { color: var(--cyan); font-size: 12px; transition: transform 160ms ease; }
.main-nav-more[open] summary span { transform: rotate(180deg); }
.main-nav-more[data-has-active="true"] summary,
.main-nav-more[open] summary,
.main-nav-more summary:hover { color: var(--lime); }
.main-nav-more > div {
  position: absolute;
  top: calc(100% - 1px);
  right: 0;
  display: grid;
  width: 230px;
  padding: 8px;
  border: 1px solid var(--line-bright);
  background: rgba(5, 12, 17, .985);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .55);
}
.main-nav .main-nav-more > div a {
  display: flex;
  min-height: 42px;
  height: auto;
  justify-content: flex-start;
  padding: 0 12px;
  border-bottom: 1px solid rgba(74, 115, 133, .18);
  font-size: 10px;
}
.main-nav .main-nav-more > div a:last-child { border-bottom: 0; }
.main-nav .main-nav-more > div a::after { display: none; }
.main-nav .main-nav-more > div a[aria-current="page"] { background: rgba(36, 215, 237, .07); }

.public-view .button-primary {
  border-color: var(--cyan);
  border-radius: 3px;
  background: var(--cyan);
  color: #051018;
  clip-path: none;
  font-family: var(--sans);
  letter-spacing: 0;
  text-transform: none;
}
.public-view .button-primary:hover { border-color: #65e8f5; background: #65e8f5; }

.public-view-home .v3-cinematic-hero {
  width: 100%;
  min-height: min(860px, 100svh);
  margin: 0;
  border: 0;
  border-bottom: 1px solid rgba(36, 215, 237, .5);
}
.public-view-home .v3-cinematic-hero::before,
.public-view-home .v3-cinematic-hero::after { display: none; }
.v3-cinematic-hero .hero-art { object-position: 57% center; }
.v3-cinematic-hero .hero-copy {
  width: min(790px, 62vw);
  padding-top: clamp(210px, 25vh, 270px);
  padding-bottom: 100px;
}
.v3-cinematic-hero .hero-shade {
  background:
    linear-gradient(90deg, rgba(2, 7, 11, .98) 0%, rgba(2, 8, 12, .91) 30%, rgba(3, 10, 15, .5) 62%, rgba(3, 9, 14, .1) 84%),
    linear-gradient(0deg, rgba(2, 8, 13, .97), transparent 55%);
}
.v3-cinematic-hero .hero-grid-overlay { opacity: .16; }
.v3-cinematic-hero .hero-copy .eyebrow { margin-bottom: 28px; font-size: 11px; letter-spacing: .24em; }
.v3-cinematic-hero .hero-copy .eyebrow > span { width: 10px; height: 10px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px rgba(211, 255, 37, .68); }
.v3-cinematic-hero .hero-copy h1 { max-width: 790px; font-size: clamp(78px, 8.5vw, 136px); letter-spacing: -.015em; line-height: .82; }
.v3-cinematic-hero .hero-summary { max-width: 620px; margin-top: 30px; color: #e0e7e8; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.55; }
.v3-cinematic-hero .hero-actions { margin-top: 36px; }
.v3-cinematic-hero .hero-actions .button { min-width: 245px; min-height: 60px; justify-content: space-between; padding: 0 28px; font-size: 16px; font-weight: 750; }
.v3-hero-meta { display: none; }
.v3-cinematic-hero .hero-index {
  bottom: 38px;
  left: max(6vw, calc((100vw - 1280px) / 2));
  display: flex;
  align-items: center;
  gap: 12px;
  color: #89989f;
  font-size: 10px;
  letter-spacing: .24em;
  writing-mode: horizontal-tb;
}
.v3-cinematic-hero .hero-index b { color: #bcc7cb; font-weight: 500; }
.v3-cinematic-hero .hero-index i { width: auto; height: auto; background: none; color: #61737c; font-style: normal; }

.v3-feature-row {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1.72fr) minmax(310px, .78fr);
  gap: 0;
  margin: 0;
  padding: 0;
}
.v3-feature-row.single-feature { grid-template-columns: minmax(0, 1fr); }
.v3-roundup-feature,
.v3-giveaway-feature {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 0;
  background: linear-gradient(145deg, #091720, #050b10);
  box-shadow: none;
}
.v3-roundup-feature { min-height: 430px; isolation: isolate; background: linear-gradient(118deg, #07567a, #05304a 56%, #061a28); }
.v3-roundup-feature > img { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; object-fit: cover; opacity: .16; mix-blend-mode: screen; }
.v3-feature-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(2, 39, 61, .35), rgba(2, 20, 33, .72)); }
.v3-roundup-copy { display: flex; min-height: 430px; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(38px, 5vw, 72px); }
.v3-roundup-copy .eyebrow > span { width: 10px; height: 10px; border-radius: 50%; background: var(--lime); }
.v3-roundup-copy h2 { max-width: 760px; margin: 0; font-family: var(--display); font-size: clamp(54px, 5.4vw, 82px); letter-spacing: .01em; line-height: .86; text-transform: uppercase; text-wrap: balance; }
.v3-roundup-copy > p:not(.eyebrow) { max-width: 680px; margin: 20px 0 0; color: #c4d2d7; font-size: 14px; line-height: 1.7; }
.v3-roundup-counts { display: grid; width: min(580px, 100%); grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 27px 0; background: rgba(115, 184, 211, .34); }
.v3-roundup-counts > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; background: rgba(3, 31, 47, .78); }
.v3-roundup-counts dt { color: #a8c1cb; font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.v3-roundup-counts dd { margin: 0; color: var(--lime); font-family: var(--display); font-size: 27px; line-height: .8; }
.v3-roundup-copy .button { min-height: 46px; }

.v3-giveaway-feature { display: flex; min-height: 430px; flex-direction: column; border-left: 1px solid rgba(88, 153, 176, .32); }
.v3-giveaway-feature > img { width: 100%; height: 168px; flex: none; object-fit: cover; }
.v3-giveaway-copy { display: flex; min-height: 0; flex: 1; flex-direction: column; padding: 27px; }
.v3-feature-status { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.v3-feature-status .eyebrow { margin: 0; font-size: 8px; }
.v3-feature-status > b { display: flex; align-items: center; gap: 7px; color: var(--lime); font-family: var(--mono); font-size: 7px; letter-spacing: .08em; text-transform: uppercase; }
.v3-giveaway-copy h2 { margin: 18px 0 0; font-family: var(--display); font-size: clamp(36px, 3.2vw, 50px); letter-spacing: .015em; line-height: .88; text-transform: uppercase; text-wrap: balance; }
.v3-giveaway-copy h2 a:hover { color: var(--lime); }
.v3-giveaway-prize { display: grid; gap: 5px; margin: 17px 0 0; }
.v3-giveaway-prize span,
.v3-giveaway-copy time span { color: var(--cyan); font-family: var(--mono); font-size: 7px; letter-spacing: .1em; text-transform: uppercase; }
.v3-giveaway-prize strong { font-size: 12px; line-height: 1.45; }
.v3-giveaway-copy time { display: grid; gap: 5px; margin: 18px 0 0; padding-top: 15px; border-top: 1px solid var(--line); }
.v3-giveaway-copy time strong { color: #e6edef; font-family: var(--mono); font-size: 10px; }
.v3-giveaway-actions { display: grid; gap: 11px; margin-top: auto; padding-top: 20px; }
.v3-giveaway-actions .button { width: 100%; min-height: 46px; padding: 0 16px; font-size: 13px; }
.v3-giveaway-actions > a:not(.button) { color: var(--cyan); font-family: var(--mono); font-size: 8px; text-align: center; text-transform: uppercase; }
.v3-giveaway-actions > a:not(.button):hover { color: var(--lime); }

.v3-news-section { padding-top: 82px; }
.v3-news-grid { gap: 18px; }
.v3-community-link { display: flex; align-items: center; justify-content: space-between; gap: 38px; margin-bottom: 40px; padding: 38px 42px; border: 1px solid var(--line); background: linear-gradient(100deg, rgba(9, 23, 32, .9), rgba(5, 11, 16, .96)); }
.v3-community-link h2 { margin: 0; font-family: var(--display); font-size: clamp(40px, 4.6vw, 66px); line-height: .85; text-transform: uppercase; }
.v3-community-link p:not(.eyebrow) { max-width: 700px; margin: 14px 0 0; color: var(--muted); }
.v3-community-link .eyebrow { margin-bottom: 11px; }
.v3-community-link .button { flex: none; }

.public-view .footer-wordmark { gap: 8px; }
.public-view .footer-wordmark strong { font-size: 25px; }
.public-view .footer-wordmark small { font-size: 7px; }

.community-hub-pulse { padding-top: 54px; padding-bottom: 28px; }
.community-directory { padding-top: 46px; }
.community-hub-links { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; padding-top: 24px; padding-bottom: 0; }
.community-hub-links a { display: flex; min-height: 72px; align-items: center; gap: 12px; padding: 14px 17px; border: 1px solid var(--line); background: rgba(7, 16, 23, .82); }
.community-hub-links a:hover { border-color: var(--cyan); background: rgba(36, 215, 237, .045); }
.community-hub-links span { color: var(--cyan); font-size: 18px; }
.community-hub-links strong { font-family: var(--mono); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }

.giveaway-page-tabs { display: flex; gap: 4px; padding: 26px 0 0; }
.giveaway-page-tabs a { display: inline-flex; min-height: 45px; align-items: center; gap: 8px; padding: 0 20px; border: 1px solid var(--line); color: #8da0a8; font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.giveaway-page-tabs a[aria-current="page"] { border-color: var(--cyan); background: rgba(36, 215, 237, .06); color: var(--lime); }
.giveaway-page-tabs a span { display: grid; min-width: 19px; height: 19px; place-items: center; border-radius: 50%; background: var(--lime); color: #071016; font-size: 8px; }
.giveaway-winner-stories { padding-top: 54px; }
.giveaway-winner-stories .section-heading > div > p:last-child { max-width: 720px; margin: 15px 0 0; color: var(--muted); }
.winner-story-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.winner-story-grid > article { display: flex; min-width: 0; flex-direction: column; padding: 25px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(11, 25, 35, .94), rgba(5, 11, 16, .98)); }
.winner-story-grid header { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 13px; align-items: center; }
.winner-story-avatar { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid var(--cyan); color: var(--lime); font-family: var(--display); font-size: 17px; }
.winner-story-grid header > div:nth-child(2) { display: grid; min-width: 0; gap: 3px; }
.winner-story-grid header strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.winner-story-grid header span,
.winner-story-grid header time { color: var(--muted); font-family: var(--mono); font-size: 7px; text-transform: uppercase; }
.winner-story-grid blockquote { flex: 1; margin: 25px 0; padding: 0; border: 0; color: #d2dadd; font-size: 16px; font-style: normal; line-height: 1.75; }
.winner-story-grid footer { display: flex; align-items: end; justify-content: space-between; gap: 18px; padding-top: 17px; border-top: 1px solid var(--line); }
.winner-story-grid footer > div { display: grid; gap: 4px; }
.winner-story-grid footer span { color: var(--cyan); font-family: var(--mono); font-size: 7px; text-transform: uppercase; }
.winner-story-grid footer strong { font-size: 11px; }
.winner-story-grid footer a { flex: none; color: var(--lime); font-family: var(--mono); font-size: 8px; text-transform: uppercase; }

.winner-public-list article blockquote { margin: 15px 0 0; padding: 14px; border-left: 2px solid var(--lime); background: rgba(211, 255, 37, .035); color: #c7d0d3; font-size: 12px; font-style: normal; line-height: 1.65; }
.winner-public-list article blockquote b { display: block; margin-bottom: 6px; color: var(--cyan); font-family: var(--mono); font-size: 7px; text-transform: uppercase; }
.winner-public-notice { margin: 16px 0; padding: 16px; border: 1px solid rgba(36, 215, 237, .35); background: rgba(36, 215, 237, .055); }
.winner-public-notice strong { color: var(--lime); }
.winner-public-notice p { margin: 7px 0 0; color: #aebcc1; font-size: 11px; line-height: 1.65; }
.winner-acceptance-form textarea { resize: vertical; }
.winner-acceptance-form .field > small { color: var(--muted); font-size: 9px; line-height: 1.5; }
.member-winner-statement { margin: 17px 0 0; padding: 16px; border-left: 2px solid var(--lime); background: rgba(211, 255, 37, .035); color: #c7d0d3; font-size: 12px; line-height: 1.7; }

@media (max-width: 1180px) {
  .public-view .header-inner { width: calc(100vw - 40px); gap: 24px; }
  .public-view .main-nav { gap: 20px; }
  .public-view .main-nav > a { font-size: 9px; }
  .v3-feature-row { grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); }
  .v3-roundup-copy { padding: 42px; }
  .v3-roundup-counts { grid-template-columns: 1fr; width: 320px; }
}

@media (max-width: 980px), (max-device-width: 980px), (hover: none) and (pointer: coarse) {
  .public-view .site-header { height: 92px; min-height: 92px; }
  .public-view .header-inner { display: flex; width: calc(100vw - 34px); min-height: 92px; }
  .public-view .v3-wordmark strong { font-size: 28px; }
  .public-view .v3-wordmark small { font-size: 7px; }
  .site-menu-toggle { display: grid; margin-left: auto; }
  .header-navigation {
    position: fixed;
    top: 82px;
    right: 14px;
    left: 14px;
    z-index: 100;
    display: none;
    width: auto;
    height: auto;
    max-height: calc(100dvh - 98px);
    overflow-y: auto;
    align-items: stretch;
    padding: 12px;
    border: 1px solid rgba(104, 158, 179, .48);
    background: rgba(3, 11, 17, .985);
    box-shadow: 0 30px 80px rgba(0, 0, 0, .68);
  }
  .site-menu-open { overflow: hidden; }
  .site-menu-open .header-navigation { display: grid; }
  .public-view .main-nav { display: grid; width: 100%; height: auto; gap: 0; overflow: visible; border: 0; }
  .public-view .main-nav > a { display: flex; min-height: 49px; height: auto; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid rgba(74, 115, 133, .2); font-size: 11px; }
  .public-view .main-nav > a::after { display: none; }
  .main-nav-more { height: auto; border-bottom: 1px solid rgba(74, 115, 133, .2); }
  .main-nav-more summary { min-height: 49px; height: auto; justify-content: space-between; padding: 0 14px; font-size: 11px; }
  .main-nav-more > div { position: static; width: 100%; padding: 0 8px 8px; border: 0; background: transparent; box-shadow: none; }
  .header-account { width: 100%; justify-content: stretch; gap: 8px; padding: 12px 4px 2px; }
  .header-account > * { flex: 1; }
  .header-account > .header-search-link { flex: 0 0 44px; width: 44px; height: 44px; }
  .header-account > .header-sign-in { display: flex; height: 44px; justify-content: center; }
  .member-menu > summary { width: 100%; justify-content: center; }
  .member-menu-popover { position: static; width: 100%; margin-top: 8px; }
  .v3-cinematic-hero .hero-copy { width: min(760px, 78vw); padding-top: 190px; }
  .v3-feature-row { grid-template-columns: 1fr; }
  .v3-roundup-feature,
  .v3-roundup-copy { min-height: 400px; }
  .v3-giveaway-feature { display: grid; min-height: 0; grid-template-columns: minmax(240px, .72fr) minmax(0, 1.28fr); border-top: 1px solid rgba(88, 153, 176, .32); border-left: 0; }
  .v3-giveaway-feature > img { width: 100%; height: 100%; min-height: 350px; }
  .v3-community-link { align-items: flex-start; flex-direction: column; }
  .community-hub-links { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 600px), (max-device-width: 600px) {
  .public-view .site-header { height: 86px; min-height: 86px; }
  .public-view .header-inner { width: calc(100vw - 32px); min-height: 86px; }
  .public-view .v3-wordmark { gap: 6px; }
  .public-view .v3-wordmark strong { font-size: 25px; letter-spacing: .29em; }
  .public-view .v3-wordmark small { max-width: 270px; font-size: 6.5px; letter-spacing: .18em; }
  .site-menu-toggle { width: 50px; height: 50px; padding: 13px; }
  .header-navigation { top: 78px; }
  .public-view-home .v3-cinematic-hero { min-height: 700px; }
  .v3-cinematic-hero .hero-art { object-position: 61% center; }
  .v3-cinematic-hero .hero-shade {
    background:
      linear-gradient(90deg, rgba(2, 7, 11, .82), rgba(2, 8, 12, .28)),
      linear-gradient(0deg, rgba(2, 8, 13, .99) 4%, rgba(2, 8, 13, .72) 44%, rgba(2, 8, 13, .08) 78%);
  }
  .v3-cinematic-hero .hero-copy { display: flex; width: auto; min-height: 700px; margin: 0; flex-direction: column; justify-content: flex-end; padding: 190px 20px 92px; }
  .v3-cinematic-hero .hero-copy .eyebrow { margin-bottom: 24px; font-size: 10px; }
  .v3-cinematic-hero .hero-copy h1 { max-width: 100%; font-size: clamp(58px, 16.4vw, 74px); line-height: .84; }
  .v3-cinematic-hero .hero-summary { max-width: 390px; margin-top: 24px; font-size: 16px; line-height: 1.55; }
  .v3-cinematic-hero .hero-actions { width: auto; margin-top: 27px; }
  .v3-cinematic-hero .hero-actions .button { width: min(255px, 100%); min-width: 0; min-height: 54px; padding: 0 22px; font-size: 15px; }
  .v3-cinematic-hero .hero-index { right: auto; bottom: 28px; left: 20px; }
  .v3-feature-row { width: 100%; gap: 0; }
  .v3-roundup-feature,
  .v3-roundup-copy { min-height: 390px; }
  .v3-roundup-copy { padding: 34px 20px; }
  .v3-roundup-copy h2 { font-size: 54px; }
  .v3-roundup-counts { width: 100%; grid-template-columns: repeat(3, 1fr); margin: 24px 0; }
  .v3-roundup-counts > div { align-items: flex-start; flex-direction: column; padding: 11px; }
  .v3-giveaway-feature { display: flex; }
  .v3-giveaway-feature > img { height: 165px; min-height: 165px; }
  .v3-giveaway-copy { padding: 24px 20px; }
  .v3-giveaway-copy h2 { font-size: 42px; }
  .v3-news-section { padding-top: 58px; }
  .v3-community-link { width: calc(100vw - 24px); gap: 25px; margin-bottom: 22px; padding: 28px 22px; }
  .v3-community-link .button { width: 100%; }
  .giveaway-page-tabs { padding-top: 18px; }
  .giveaway-page-tabs a { flex: 1; justify-content: center; padding: 0 10px; }
  .winner-story-grid { grid-template-columns: 1fr; }
  .winner-story-grid > article { padding: 20px; }
  .winner-story-grid header { grid-template-columns: 42px minmax(0, 1fr); }
  .winner-story-grid header time { grid-column: 2; }
  .winner-story-grid footer { align-items: flex-start; flex-direction: column; }
  .community-hub-links { grid-template-columns: repeat(2, 1fr); }
}

@media (max-height: 700px) and (min-width: 700px) and (hover: none) {
  .public-view-home .v3-cinematic-hero { min-height: 700px; }
  .v3-cinematic-hero .hero-copy { padding-top: 175px; padding-bottom: 92px; }
  .v3-cinematic-hero .hero-copy h1 { font-size: clamp(68px, 8vw, 106px); }
}
