/*
 * North Production — sistema de design.
 * Recriação dos 17 ecrãs aprovados. Sem border-radius, sem sombras;
 * todos os separadores são hairlines de 1px (README §4).
 */

/* ── Fundações ──────────────────────────────────────────────────────── */

:root{
  --np-gut: clamp(20px, 7vw, 120px);      /* goteira lateral de todas as secções */
  --np-sec-y: clamp(90px, 16vh, 190px);   /* respiração vertical padrão */
  --np-ease: cubic-bezier(.19, 1, .22, 1);
  --vh100: 100vh;
}
@supports (height: 100svh){ :root{ --vh100: 100svh; } }

*,
*::before,
*::after{ box-sizing: border-box; }

html,
body.np-site{
  margin: 0;
  background: var(--np-preto);
  overflow-x: hidden;
}

body.np-site{
  color: var(--np-branco-quente);
  font-family: 'Archivo', system-ui, sans-serif;
}

body.np-site img{ display: block; max-width: 100%; }
/* `:where()` zera a especificidade: o reset não pode ganhar a `.np-btn`
   nem a `.np-nav a`, que definem cor própria. */
:where(body.np-site) a{ color: inherit; text-decoration: none; }

/* O Hello injecta um container próprio; aqui são as secções que controlam a largura. */
body.np-site .site-main,
body.np-site .page-content{ max-width: none; padding: 0; margin: 0; }

/* ── Temas de secção ────────────────────────────────────────────────── */

.np-s{
  padding: var(--np-sec-y) var(--np-gut);
  scroll-margin-top: 70px;
}
.np-s--flush{ padding-top: 0; }
.np-s--top{ padding: clamp(48px, 10vh, 120px) var(--np-gut) 0; }
.np-s--mid{ padding: clamp(40px, 7vh, 80px) var(--np-gut) 0; }

.np-s--preto{
  background: var(--np-preto);
  color: var(--np-branco-quente);
  --np-hair: #232322;
  --np-sec-txt: #9A9892;
  --np-label: #9A9892;
  --np-body-txt: #8C8A85;
  --np-ph: #141413;
  --np-rule: #232322;
  --np-under: #3A3A37;
  --np-arrow: #5F818C;
}
.np-s--claro{
  background: var(--np-branco-quente);
  color: var(--np-tinta);
  --np-hair: #D8D1C3;
  --np-sec-txt: #575146;
  --np-label: #726C5F;
  --np-body-txt: #3B3833;
  --np-ph: #E3DDD1;
  --np-rule: #D8D1C3;
  --np-under: #C9C2B4;
  --np-arrow: #8C8A85;
}
.np-s--areia{
  background: #E3D9C8;
  color: var(--np-tinta);
  --np-hair: rgba(20, 18, 15, .18);
  --np-sec-txt: #575146;
  --np-label: #726C5F;
  --np-body-txt: #3B3833;
  --np-ph: #D3C7B2;
  --np-rule: rgba(20, 18, 15, .18);
  --np-under: #BEB29C;
  --np-arrow: #8C8A85;
}
.np-s--azul{
  background: var(--np-azul);
  color: #EDE7DC;
  --np-hair: rgba(237, 231, 220, .16);
  --np-sec-txt: #8FA9B2;
  --np-label: #8FA9B2;
  --np-body-txt: #8FA9B2;
  --np-ph: #0E2E3A;
  --np-rule: rgba(237, 231, 220, .16);
  --np-under: rgba(237, 231, 220, .3);
  --np-arrow: #5F818C;
}

/* ── Tipografia ─────────────────────────────────────────────────────── */

.np-eyebrow{
  font: 500 11px/1.4 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
  margin: 0;
}
.np-eyebrow--tight{
  font-size: 10px;
  letter-spacing: .24em;
  line-height: 1;
}
.np-eyebrow--rule{
  border-top: 1px solid var(--np-rule);
  padding-top: 14px;
  display: block;
}

.np-h1{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .86;
  font-size: clamp(44px, 14vw, 285px);
  margin: clamp(28px, 6vh, 72px) 0 0;
  text-transform: uppercase;
}
.np-h1--home{
  font-size: clamp(40px, 12.4vw, 240px);
  line-height: .82;
  margin: auto 0;
  padding: clamp(24px, 5vh, 64px) 0;
}
/* Máscara de subida por linha: o texto sobe de dentro de um overflow oculto. */
.np-h1 .np-line{ display: block; overflow: hidden; padding: .22em 0; margin: -.22em 0; }
.np-h1 .np-line > span{
  display: inline-block;
  transform: translateY(160%);
  animation: np-rise-line 1s var(--np-ease) both;
}
.np-h1 .np-line:nth-child(1) > span{ animation-delay: .08s; }
.np-h1 .np-line:nth-child(2) > span{ animation-delay: .22s; }
@keyframes np-rise-line{ from{ transform: translateY(160%); } to{ transform: translateY(0); } }

.np-h2{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(30px, 5vw, 64px);
  letter-spacing: -.035em;
  line-height: 1;
  margin: 0;
}
.np-h2--xl{ font-weight: 900; font-size: clamp(40px, 9vw, 132px); line-height: .9; letter-spacing: -.045em; }
/* Título de peça (projecto, evento, artigo) no masthead */
.np-h2--peca{
  font-size: clamp(32px, 6vw, 86px);
  margin: clamp(20px, 3vh, 32px) 0 0;
  max-width: 18ch;
  text-wrap: balance;
}

.np-title{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 600;
  font-size: 20px;
  letter-spacing: -.02em;
  line-height: 1.2;
  margin: 0;
}
.np-title--md{ font-size: clamp(18px, 2vw, 26px); }
.np-title--lg{ font-size: clamp(19px, 2.2vw, 28px); }

.np-lead{
  font: 300 clamp(16px, 1.7vw, 22px)/1.5 'Archivo', sans-serif;
  color: var(--np-sec-txt);
  margin: 0;
  max-width: 42ch;
}
.np-lead--forte{ color: currentColor; }

.np-statement{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 500;
  font-size: clamp(24px, 3.6vw, 50px);
  line-height: 1.18;
  letter-spacing: -.025em;
  margin: 0;
  max-width: 20ch;
  text-wrap: balance;
}
.np-statement--curto{ max-width: 22ch; }

.np-p{
  font: 400 clamp(16px, 1.5vw, 19px)/1.62 'Archivo', sans-serif;
  color: var(--np-body-txt);
  margin: 0;
}
.np-p--sm{ font-size: clamp(15px, 1.4vw, 18px); line-height: 1.6; }
.np-meta{
  font: 400 12px/1.6 'Archivo', sans-serif;
  letter-spacing: .06em;
  color: var(--np-sec-txt);
  margin: 0;
}
.np-meta--lg{ font-size: 13px; }

/* Coluna de texto recuada à direita (Home "Quem somos", páginas de área) */
.np-col-dir{ display: flex; justify-content: flex-end; margin-top: clamp(44px, 7vh, 88px); }
.np-col-dir__inner{ max-width: 46ch; display: flex; flex-direction: column; gap: 22px; }

/* ── Ligações e botões ──────────────────────────────────────────────── */

.np-link{
  font: 500 11px/1 'Archivo', sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: currentColor;
  border-bottom: 1px solid var(--np-under);
  padding-bottom: 8px;
  display: inline-block;
  position: relative;
}
.np-link--sm{ font-size: 10px; letter-spacing: .2em; padding-bottom: 6px; color: var(--np-label); }

/* Alvo de toque ≥44px (README §8) sem mexer no desenho: a área clicável
   cresce por pseudo-elemento, a sublinha fica onde está. */
.np-link::after,
.np-header__logo::after,
.np-directo a::after,
.np-crumbs a::after{
  content: '';
  position: absolute;
  inset: -15px -10px;
}
.np-header__logo,
.np-directo a,
.np-crumbs a{ position: relative; }

.np-skip{ min-height: 44px; display: inline-flex; align-items: center; }

.np-btn{
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  background: var(--np-branco-quente);
  color: var(--np-preto);
  font: 500 12px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  padding: 18px 26px;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: opacity .25s;
}
.np-btn:hover{ opacity: .78; color: var(--np-preto); }
.np-btn--tinta{ background: var(--np-tinta); color: var(--np-branco-quente); }
.np-btn--tinta:hover{ color: var(--np-branco-quente); }

/* ── Média com proporção fixa ───────────────────────────────────────── */

.np-media{
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--np-ph);
  aspect-ratio: var(--np-ratio, 4 / 3);
}
.np-media > img,
.np-media > video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s var(--np-ease);
}
.np-media--21x9{ --np-ratio: 21 / 9; }
.np-media--16x9{ --np-ratio: 16 / 9; }
.np-media--16x10{ --np-ratio: 16 / 10; }
.np-media--4x3{ --np-ratio: 4 / 3; }
.np-media--4x5{ --np-ratio: 4 / 5; }

a.np-media:hover > img{ transform: scale(1.035); }
a:hover > .np-media > img{ transform: scale(1.035); }
.np-card:hover .np-media > img{ transform: scale(1.04); }
.np-row:hover .np-media > img{ transform: scale(1.05); }

.np-caption{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
  margin: 16px 0 0;
}
.np-caption-row{
  display: flex;
  flex-wrap: wrap;
  gap: 16px 32px;
  justify-content: space-between;
  margin-top: 16px;
}

@media (prefers-reduced-motion: reduce){
  .np-media > img,
  .np-media > video{ transition: none; }
  .np-h1 .np-line > span{ animation: none; transform: none; }
}

/* ── Cabeçalhos de secção ───────────────────────────────────────────── */

.np-s-head{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: clamp(40px, 6vh, 72px);
}
.np-s-head--rule{
  border-top: 1px solid var(--np-rule);
  padding-top: clamp(32px, 5vh, 56px);
}
.np-s-head--end{ align-items: flex-end; gap: 24px; }

/* ── Grelhas ────────────────────────────────────────────────────────── */

.np-grid{ display: grid; gap: clamp(28px, 3.5vw, 48px); }
.np-grid--2{ grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 56px); }
.np-grid--3{ grid-template-columns: repeat(3, 1fr); }
.np-grid--4{ grid-template-columns: repeat(4, 1fr); gap: clamp(24px, 3vw, 48px); }
.np-grid__offset{ padding-top: 14vh; }   /* desencontro da grelha de projectos na Home */

@media (max-width: 999px){
  .np-grid--3{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 899px){
  .np-grid--2,
  .np-grid--4{ grid-template-columns: 1fr; }
  .np-grid__offset{ padding-top: 0; }
}
@media (max-width: 639px){
  .np-grid--3{ grid-template-columns: 1fr; }
}

/* ── Linhas hairline (índices, agenda, "já aconteceu") ──────────────── */

.np-rows{
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--np-rule);
}
.np-row{
  display: grid;
  align-items: center;
  gap: 18px clamp(24px, 4vw, 56px);
  padding: clamp(24px, 3.5vh, 40px) 0;
  border-bottom: 1px solid var(--np-rule);
}

/* Índice de áreas: título · descrição · seta */
.np-row--indice{
  grid-template-columns: minmax(0, .62fr) minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 10px 32px;
  padding: clamp(22px, 3vh, 34px) 0;
  transition: padding-left .35s var(--np-ease);
}
.np-row--indice:hover{ padding-left: 14px; }

/* Área ainda sem página publicada: continua a anunciar-se, porque a
   descrição é conteúdo real, mas não se comporta como link — sem seta,
   sem deslize, sem cursor de mão. */
.np-row--inactiva{
  grid-template-columns: minmax(0, .62fr) minmax(0, 1fr);
  cursor: default;
}
.np-row--inactiva:hover{ padding-left: 0; }

.np-row__area{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(24px, 3.4vw, 42px);
  letter-spacing: -.03em;
  line-height: 1;
}
.np-row__desc{ font: 400 clamp(14px, 1.3vw, 17px)/1.5 'Archivo', sans-serif; color: var(--np-sec-txt); }
.np-row__arrow{ font: 400 15px/1 'Archivo', sans-serif; color: var(--np-arrow); }

/* Agenda: data · título · imagem · acção */
.np-row--agenda{ grid-template-columns: minmax(180px, .9fr) minmax(200px, 1.4fr) minmax(160px, 1fr) auto; }
.np-row--passado{ grid-template-columns: minmax(90px, .4fr) minmax(200px, 1.4fr) minmax(0, 1fr); }

.np-date{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 900;
  font-size: clamp(40px, 6.5vw, 86px);
  letter-spacing: -.045em;
  line-height: .85;
}
.np-date small{
  font-weight: 400;
  font-size: .3em;
  letter-spacing: .16em;
  vertical-align: top;
  margin-left: .4em;
}
.np-date--hero{ font-size: clamp(52px, 10vw, 170px); line-height: .85; margin-top: clamp(28px, 6vh, 72px); }
.np-date--hero small{ font-size: .28em; }
.np-ano{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(20px, 2.2vw, 28px);
  letter-spacing: -.02em;
  line-height: 1;
}

.np-action{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (max-width: 899px){
  .np-row--indice,
  .np-row--agenda,
  .np-row--passado{ grid-template-columns: 1fr; }
  .np-row--indice:hover{ padding-left: 0; }
}

/* ── Cartões ────────────────────────────────────────────────────────── */

.np-card{ display: block; }
.np-card__body{ margin-top: 14px; }
.np-card__kicker{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
  margin: 16px 0 0;
}
.np-card__title{ margin-top: 10px; }
.np-card__foot{
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
  justify-content: space-between;
  margin-top: 14px;
}
.np-card__excerpt{ margin-top: 10px; }

/* ── Ficha de 4 colunas (projecto / evento) ─────────────────────────── */

.np-ficha{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(28px, 4vw, 56px);
  border-top: 1px solid var(--np-rule);
  padding-top: clamp(28px, 4vh, 48px);
}
.np-ficha__label{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
  margin-bottom: 10px;
}
.np-ficha__value{
  font: 400 clamp(14px, 1.3vw, 17px)/1.5 'Archivo', sans-serif;
  color: currentColor;
}
@media (max-width: 899px){ .np-ficha{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 519px){ .np-ficha{ grid-template-columns: 1fr; } }

/* ── Migalhas (breadcrumb do masthead) ──────────────────────────────── */

.np-crumbs{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  border-top: 1px solid var(--np-rule);
  padding-top: 14px;
  font: 500 11px/1.4 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
}
.np-crumbs a{ color: var(--np-sec-txt); transition: color .25s; }
.np-crumbs a:hover{ color: currentColor; }

/* ── Corpo editorial (artigo) ───────────────────────────────────────── */

.np-prose{
  display: flex;
  flex-direction: column;
  gap: 22px;
  max-width: 62ch;
}
.np-prose p{
  font: 400 clamp(16px, 1.5vw, 19px)/1.75 'Archivo', sans-serif;
  color: var(--np-body-txt);
  margin: 0;
}
.np-prose a{ border-bottom: 1px solid var(--np-under); }
.np-prose blockquote{
  margin: 10px 0;
  padding-left: clamp(20px, 3vw, 36px);
  border-left: 1px solid var(--np-rule);
}
.np-prose blockquote p{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 500;
  font-size: clamp(20px, 2.4vw, 30px);
  line-height: 1.3;
  letter-spacing: -.02em;
  color: currentColor;
}
.np-prose h2,
.np-prose h3{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 600;
  letter-spacing: -.02em;
  margin: 14px 0 0;
}
.np-prose ul,
.np-prose ol{ margin: 0; padding-left: 1.2em; }
.np-prose li{ font: 400 clamp(16px, 1.5vw, 19px)/1.75 'Archivo', sans-serif; color: var(--np-body-txt); }
.np-prose img{ width: 100%; height: auto; }

.np-measure{ max-width: 1100px; margin-inline: auto; }

/* ── Filtros do arquivo de projectos ────────────────────────────────── */

.np-filters{
  display: flex;
  flex-wrap: wrap;
  gap: 6px 28px;
  border-top: 1px solid var(--np-rule);
  border-bottom: 1px solid var(--np-rule);
  padding: 4px 0;
}
.np-filter{
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  background: none;
  border: none;
  cursor: pointer;
  font: 500 11px/1 'Archivo', sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--np-sec-txt);
  padding: 0;
  transition: color .25s;
}
.np-filter:hover,
.np-filter.is-active{ color: currentColor; }
.np-hidden{ display: none !important; }

/* ── Passos numerados ("Como trabalhamos") ──────────────────────────── */

.np-steps{ display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 4vw, 64px); }
.np-step__num{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 900;
  font-size: clamp(32px, 4vw, 56px);
  letter-spacing: -.04em;
  line-height: 1;
  color: var(--np-label);
}
.np-step__title{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 600;
  font-size: clamp(19px, 2vw, 26px);
  letter-spacing: -.02em;
  margin: 16px 0 10px;
}
@media (max-width: 899px){ .np-steps{ grid-template-columns: 1fr; } }

/* ── Parceiros / mercados ───────────────────────────────────────────── */

.np-parceiro__nome{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(24px, 3vw, 40px);
  letter-spacing: -.03em;
  line-height: 1;
}
.np-parceiro__tipo{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
  margin: 12px 0 16px;
}
.np-mercados{ display: flex; flex-wrap: wrap; gap: 14px 40px; align-items: baseline; }
.np-mercados span{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(22px, 3vw, 44px);
  letter-spacing: -.03em;
}
.np-marcas{ display: flex; flex-wrap: wrap; gap: 14px 36px; align-items: baseline; }
.np-marcas span{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(20px, 2.4vw, 30px);
  letter-spacing: -.02em;
}
.np-rede{
  display: flex;
  flex-wrap: wrap;
  gap: 32px 56px;
  align-items: baseline;
  justify-content: space-between;
  border-top: 1px solid var(--np-rule);
  padding-top: clamp(32px, 5vh, 56px);
}

/* ── Reveal on scroll (README §8) ───────────────────────────────────── */

[data-reveal]{
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s var(--np-ease), transform .9s var(--np-ease);
  will-change: opacity, transform;
}
[data-reveal].is-in{ opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce){
  [data-reveal]{ opacity: 1; transform: none; transition: none; }
}
/* Sem JS o conteúdo tem de continuar visível. */
.no-js [data-reveal]{ opacity: 1; transform: none; }

/* ── Marcador de conteúdo por escrever ──────────────────────────────── */
/* Torna visível, sem ser feio, o que ainda falta de copy da cliente.    */
.np-por-escrever{
  font: 400 clamp(15px, 1.4vw, 18px)/1.6 'Archivo', sans-serif;
  color: var(--np-body-txt);
  margin: 0;
  opacity: .62;
  font-style: italic;
}

/* Ligação inline sublinhada (email do CTA) — mesma regra de alvo de toque. */
.np-inline-link{ position: relative; display: inline-block; }
.np-inline-link::after{ content: ''; position: absolute; inset: -14px -10px; }

/* ── Classes aplicadas a widgets do Elementor ───────────────────────────
 * Quando uma classe do desenho é posta num widget (heading, text-editor,
 * button), o Elementor coloca-a no wrapper e o texto fica num elemento
 * interior — que apanha a tipografia do kit em vez da nossa. Fazer o
 * interior herdar resolve, sem duplicar valores.
 * ───────────────────────────────────────────────────────────────────── */

.np-h1 .elementor-heading-title,
.np-h2 .elementor-heading-title,
.np-title .elementor-heading-title,
.np-statement .elementor-heading-title,
.np-lead .elementor-heading-title,
.np-eyebrow .elementor-heading-title,
.np-reserva__titulo .elementor-heading-title{
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: inherit;
  text-transform: inherit;
  margin: 0;
}

/* O text-editor embrulha os parágrafos num container próprio. */
.np-lead .elementor-widget-container > p,
.np-p .elementor-widget-container > p,
.np-statement .elementor-widget-container > p,
.np-meta .elementor-widget-container > p{
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: inherit;
  margin: 0;
}
.np-lead .elementor-widget-container > p:last-child,
.np-p .elementor-widget-container > p:last-child{ margin-bottom: 0; }

/* O lead do hero da Home é meio ponto menor do que o das páginas interiores. */
body.np-site .np-hero .np-lead{ font-size: clamp(15px, 1.6vw, 21px); }

/* A secção azul tem branco próprio (#EDE7DC), não o branco quente. */
body.np-site .np-s--azul,
body.np-site .np-s--azul .np-row__area,
body.np-site .np-s--azul .np-h2{ color: #EDE7DC; }

/* ── Vídeo do hero ──────────────────────────────────────────────────── */

.np-video{ position: relative; }
.np-video__el{ width: 100%; height: 100%; object-fit: cover; display: block; }

/* Controlo discreto, no canto, na linguagem das etiquetas do site. */
/* Os dois controlos vivem juntos no canto. */
.np-video__controlos{
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;
  display: flex;
  gap: 8px;
  /* Sempre visíveis, não só no hover: em ecrã táctil não há hover, e um
     controlo de som que ninguém encontra não é um controlo. */
  opacity: .85;
  transition: opacity .25s;
}
.np-video:hover .np-video__controlos,
.np-video__controlos:focus-within{ opacity: 1; }

.np-video__toggle{
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  background: rgba(11, 11, 11, .72);
  color: var(--np-branco-quente);
  border: none;
  border-radius: 0;
  cursor: pointer;
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
}

/* Mostra "Pausa" enquanto toca e "Reproduzir" quando está parado. */
.np-video__toggle .np-video__toggle-play{ display: none; }
.np-video__toggle[aria-pressed="false"] .np-video__toggle-pausa{ display: none; }
.np-video__toggle[aria-pressed="false"] .np-video__toggle-play{ display: inline; }

/* Mostra "Activar som" enquanto está mudo e "Desligar som" com som. */
.np-video__som-desligar{ display: none; }
[data-np-video-som][aria-pressed="true"] .np-video__som-ligar{ display: none; }
[data-np-video-som][aria-pressed="true"] .np-video__som-desligar{ display: inline; }

/* Sem movimento: o vídeo fica parado no poster e o botão sempre visível. */
@media (prefers-reduced-motion: reduce){
  .np-video__controlos{ opacity: 1; }
}

/* ── Tira de logótipos de parceiros ─────────────────────────────────────
 * Vive sempre em secção clara: os logótipos dos parceiros são arte escura
 * sobre fundo claro e ficariam ilegíveis sobre o preto da marca.
 * ───────────────────────────────────────────────────────────────────── */

.np-logos{
  /* Fonte unica da altura dos logotipos: o np-chrome.css tambem precisa
     dela para vencer o `.elementor img{height:auto}`, e duas constantes
     separadas ja se desencontraram uma vez. */
  --np-logo-h: clamp(46px, 4.8vw, 64px);
  --np-logo-h-placa: clamp(36px, 3.8vw, 50px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: clamp(32px, 4vw, 64px) clamp(28px, 4vw, 56px);
  align-items: start;
  border-top: 1px solid var(--np-rule);
  padding-top: clamp(36px, 5vh, 64px);
}

.np-logo{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
}

/* Altura comum para os logótipos ficarem opticamente equilibrados,
   independentemente das proporções de cada ficheiro. */
.np-logo__img{
  height: var(--np-logo-h);
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: left center;
}

/* Parceiro sem logótipo: fica pelo nome, na tipografia do desenho. */
.np-logo__texto{
  font-family: 'Libre Franklin', sans-serif;
  font-weight: 800;
  font-size: clamp(20px, 2.2vw, 28px);
  letter-spacing: -.02em;
  line-height: var(--np-logo-h);
}

.np-logo__nome{
  font: 500 10px/1 'Archivo', sans-serif;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--np-label);
}

/* Na Home a tira entra logo a seguir ao bloco da rede, que ja traz hairline:
   uma segunda linha a 40px da primeira leria como erro de desenho. */
.np-logos--sem-linha{
  border-top: 0;
  padding-top: 0;
  margin-top: clamp(40px, 6vh, 72px);
}

@media (max-width: 519px){
  .np-logos{ grid-template-columns: 1fr 1fr; }
}

/* ── Evento com cartaz (ex.: estreia de cinema) ─────────────────────────
 * Cartaz numa coluna estreita à esquerda, texto à direita — em vez da
 * coluna recuada que os outros eventos usam.
 * ───────────────────────────────────────────────────────────────────── */

.np-media--2x3{ --np-ratio: 2 / 3; }

.np-evento-corpo{
  display: grid;
  grid-template-columns: minmax(200px, 0.42fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
  margin-top: clamp(44px, 7vh, 88px);
}
.np-evento-texto{ max-width: 56ch; }

@media (max-width: 899px){
  .np-evento-corpo{ grid-template-columns: 1fr; }
  .np-evento-cartaz{ max-width: 300px; }
}

.np-creditos{
  font: 400 11px/1.6 'Archivo', sans-serif;
  letter-spacing: .06em;
  color: var(--np-label);
  margin: clamp(36px, 5vh, 64px) 0 0;
  border-top: 1px solid var(--np-rule);
  padding-top: 16px;
}

/* Logótipo de arte clara na tira clara: assenta numa placa do preto da marca,
   em vez de se inverterem as cores de uma marca alheia. */
.np-logo--placa{
  background: var(--np-preto);
  padding: 14px 18px;
  align-self: start;
}
.np-logo--placa .np-logo__img{ height: var(--np-logo-h-placa); }
.np-logo--placa .np-logo__texto{ color: var(--np-branco-quente); line-height: var(--np-logo-h-placa); }