/* Mobile first: base móvil; ampliaciones con min-width. */

.manifesto-note {
  font-size: 13px;
  border-top: 1px solid #d0d0d0;
  padding-top: 20px;
  margin-top: 25px;
  max-width: 720px;
}

.support {
  background: #151515;
  color: #eee;
}

.support .section-heading>p {
  color: #aaa;
}

.support .eyebrow {
  color: #b0b0b0;
}

.support h2 em {
  color: #bfbfbf;
}

.support-grid article {
  padding: 28px 23px 28px 0;
  display: flex;
  flex-direction: column;
}

.support-grid p {
  font-size: 13px;
  color: #bdbdbd;
  margin-bottom: 28px;
}

.support-grid .eyebrow {
  font-size: 8px;
  letter-spacing: .1em;
}

.support-foot {
  font-size: 10px;
  color: #e1e1e1;
  margin-top: auto;
}

.support-bottom p {
  font-size: 11px;
  color: #ababab;
  max-width: 640px;
  margin: 0;
}

.support-bottom a {
  flex-shrink: 0;
}

.ecosystem-row .eyebrow {
  color: #6a6a6a;
  font-size: 8px;
  margin-bottom: 12px;
}

.ecosystem-row h3 {
  font-size: 25px;
  margin: 0;
}

.ecosystem-row p {
  font-size: 13px;
  color: #595959;
  margin: 0;
}

.festival-feature {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 12%;
  background: #000;
  color: #eee;
}

.festival-feature em {
  color: #b6b6b6;
}

.festival-feature p {
  color: #b5b5b5;
  font-size: 14px;
  max-width: 470px;
}

.festival-feature .festival-conditions {
  font-size: 10px;
  margin-top: 18px;
}

.festival-date .eyebrow {
  color: #bcbcbc;
  font-size: 8px;
}

.festival-date>span:last-child {
  font-size: 8px;
  letter-spacing: .12em;
}

.platform {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 12%;
  border-bottom: 1px solid #d2d2d2;
}

.development-badge {
  display: inline-block;
  border: 1px solid #adadad;
  font-size: 8px;
  letter-spacing: .12em;
  padding: 4px 8px;
  margin-top: 23px;
}

.platform h2 {
  margin-top: 25px;
}

.platform h2>span {
  color: #777;
}

.platform p {
  font-size: 14px;
  color: #555;
  max-width: 470px;
}

.platform .caption {
  font-size: 11px;
  max-width: 420px;
  margin-top: 20px;
}

.platform-vision {
  padding-top: 8px;
}

.community-types {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin: 25px 0 32px;
}

.community-types span {
  border: 1px solid #bcbcbc;
  padding: 7px 12px;
  font-size: 12px;
}

.vision-item {
  display: flex;
  gap: 22px;
  padding: 18px 0;
  border-top: 1px solid #cecece;
}

.vision-item>span {
  font-size: 10px;
  color: #727272;
  padding-top: 4px;
}

.vision-item p {
  font-size: 12px;
  margin: 0;
}

.vision-item strong {
  display: block;
  color: #111;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -.02em;
  margin-bottom: 4px;
}

.platform-vision>a {
  margin-top: 25px;
}

.connect {
  background: #e5e5e5;
  text-align: center;
}

.connect h2 {
  font-size: clamp(44px,5.5vw,78px);
  margin: 30px 0 40px;
}

.connect em {
  color: #676767;
}

.connect-columns h3 {
  font-size: 21px;
  margin-bottom: 10px;
}

.connect-columns p {
  font-size: 13px;
  color: #555;
}

.connect>.caption {
  margin: 15px 0 0;
}

.support-grid article:nth-child(3) {
  border-left: 0;
  padding-left: 0;
}

.support-grid article:nth-child(n+3) {
  border-top: 1px solid #444;
}

.ecosystem-row a {
  font-size: 11px;
  align-self: center;
  grid-column: 3;
  justify-self: start;
}

.header {
  flex-wrap: wrap;
  gap: 12px;
}

.header nav>a:not(.nav-cta) {
  display: inline-block;
  font-size: 10px;
}

.header .nav-cta span {
  margin-left: 10px;
}

.header .brand-logo {
  width: 54px;
  height: 54px;
}

.support-bottom {
  display: flex;
  justify-content: space-between;
  margin-top: 25px;
  align-items: flex-start;
  flex-direction: column;
  gap: 20px;
}

.ecosystem-row {
  display: grid;
  align-items: start;
  border-top: 1px solid #ccc;
  padding: 30px 0;
  grid-template-columns: 24px 1fr;
  gap: 16px;
}

.ecosystem-row p,.ecosystem-row a {
  grid-column: 2;
}

.festival-feature,.platform {
  gap: 40px;
  grid-template-columns: 1fr;
}

.festival-date {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid #353535;
  justify-content: center;
  padding: 26px;
  min-height: 280px;
}

.festival-date strong {
  letter-spacing: -.09em;
  line-height: .95;
  font-weight: 500;
  font-size: 95px;
  display: flex;
  gap: 20px;
  align-items: baseline;
  margin-top: 25px;
}

.festival-date strong span {
  display: block;
  letter-spacing: -.06em;
  font-size: 62px;
}

.festival-year {
  color: #949494;
  letter-spacing: -.05em;
  line-height: 1.2;
  margin-top: 12px;
  font-size: 26px;
}

.festival-date-line {
  height: 1px;
  background: #444;
  width: 100%;
  margin: 20px 0 12px;
}

.festival-feature h2 {
  margin: 25px 0;
  font-size: 45px;
}

.brand-hero .hero-copy .brand-lead {
  line-height: 1.35;
  letter-spacing: -.03em;
  color: #eee;
  margin: 0 0 20px;
  font-size: 21px;
}

.brand-baseline>span {
  font-size: 8px;
}

.header nav {
  flex: 1;
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 265px;
  gap: 9px 12px;
}

.header .nav-cta {
  font-size: 10px;
  padding: 5px 8px;
}

.brand-hero .hero-grid {
  padding-top: 30px;
  padding-bottom: 35px;
}

.brand-hero .hero-copy>p:not(.brand-lead) {
  max-width: 510px;
  font-size: 13px;
}

.brand-hero .button {
  font-size: 12px;
  gap: 16px;
}

.brand-baseline {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  border-top: 1px solid #303030;
  padding: 24px 0;
  color: #b5b5b5;
  font-size: 9px;
  letter-spacing: .12em;
  line-height: 1.8;
  align-items: flex-start;
}

.brand-baseline a {
  letter-spacing: 0;
  color: #eee;
  font-size: 10px;
}

.manifesto-lead {
  line-height: 1.55;
  letter-spacing: -.02em;
  margin: 32px 0 0;
  font-size: 18px;
}

.support-grid {
  display: grid;
  border-top: 1px solid #444;
  border-bottom: 1px solid #444;
  margin-top: 45px;
  grid-template-columns: 1fr;
}

.support-grid article+article {
  border-left: 0;
  border-top: 1px solid #444;
  padding-left: 0;
}

.support-grid h3 {
  font-size: 27px;
  margin: 35px 0 17px;
  margin-top: 22px;
}

.connect-columns {
  display: grid;
  max-width: 800px;
  margin: 0 auto 35px;
  text-align: left;
  grid-template-columns: 1fr;
  gap: 10px;
}