/* =========================================================================
   Arte Minima — site.css
   Identidade gráfica do universo vicentelusitano.org: azul-noite, marfim,
   dourado; EB Garamond + DM Sans, auto-hospedadas.
   ========================================================================= */

/* ---------- fontes auto-hospedadas (sem dependência de CDN) ---------- */
@font-face{
  font-family:'EB Garamond';src:url('fonts/ebgaramond-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'EB Garamond';src:url('fonts/ebgaramond-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'EB Garamond';src:url('fonts/ebgaramond-400-italic.woff2') format('woff2');
  font-weight:400;font-style:italic;font-display:swap;
}
@font-face{
  font-family:'DM Sans';src:url('fonts/dmsans-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap;
}
@font-face{
  font-family:'DM Sans';src:url('fonts/dmsans-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap;
}

/* ---------- tokens ---------- */
:root{
  --bg:#101128;
  --bg-2:#171935;
  --bg-3:#1f2045;
  --ink:#efe9dc;
  --ink-2:#b6bad2;
  --ink-3:#7e83a6;
  --rule:rgba(239,233,220,0.13);
  --rule-2:rgba(239,233,220,0.26);
  --gold:#c2a15f;
  --gold-soft:rgba(194,161,95,0.5);
  --wine:#7d2b3e;

  --serif:'EB Garamond', Georgia, 'Times New Roman', serif;
  --sans:'DM Sans', -apple-system, Helvetica, Arial, sans-serif;

  --shell:1180px;
  --gutter:clamp(1.25rem, 4vw, 3rem);
  --label-col:13rem;
  --gap:clamp(2rem, 5vw, 4.5rem);
  --section:clamp(3.5rem, 7vw, 6rem);
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--serif);
  font-size:1.2rem;
  line-height:1.62;
  font-weight:400;
  font-synthesis:none;                 /* nunca sintetizar bold/itálico */
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{max-width:100%;display:block;}
strong,b{font-weight:500;}
em,i{font-style:italic;}
hr{border:0;border-top:1px solid var(--rule);margin:var(--section) 0;}

a{color:inherit;text-decoration:none;}
p a,li a,dd a{
  border-bottom:1px solid var(--gold-soft);
  transition:border-color .18s ease,color .18s ease;
}
p a:hover,li a:hover,dd a:hover{color:var(--gold);border-bottom-color:var(--gold);}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;}

/* ---------- estrutura ---------- */
.shell{max-width:var(--shell);margin:0 auto;padding:0 var(--gutter);}
.measure{max-width:66ch;}
.measure-tight{max-width:56ch;}

.split{
  display:grid;
  grid-template-columns:var(--label-col) minmax(0,1fr);
  gap:var(--gap);
  align-items:start;
}
.split + .split{margin-top:var(--section);}

.kicker{
  font-family:var(--sans);
  font-size:0.7rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-3);
  line-height:1.5;
  padding-top:0.5rem;
}
.kicker .note{
  display:block;margin-top:1.1rem;
  font-family:var(--serif);font-size:0.95rem;font-style:italic;
  letter-spacing:0;text-transform:none;color:var(--ink-2);line-height:1.5;
}
@media (max-width:860px){
  .split{grid-template-columns:1fr;gap:1.1rem;}
  .kicker{padding-top:0;}
  .kicker .note{margin-top:0.5rem;}
}

section{padding:var(--section) 0;}
section + section{border-top:1px solid var(--rule);}

/* ---------- cabeçalho ---------- */
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(16,17,40,0.9);
  backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--rule);
}
.site-header .bar{
  max-width:var(--shell);margin:0 auto;padding:0.85rem var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
}
.brand{display:flex;align-items:center;gap:0.75rem;}
.brand .hand{height:38px;width:auto;}
.brand .word{height:26px;width:auto;opacity:0.96;}
@media (max-width:520px){.brand .word{height:20px;}}
.nav{display:flex;flex-wrap:wrap;gap:1.35rem;}
.nav a{
  font-family:var(--sans);font-size:0.7rem;font-weight:400;
  letter-spacing:0.13em;text-transform:uppercase;color:var(--ink-2);
  padding:0.35rem 0;border-bottom:1px solid transparent;
  transition:color .18s ease,border-color .18s ease;
}
.nav a:hover{color:var(--ink);}
.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--gold);}
.nav .lang{color:var(--ink-3);}

.nav-toggle{
  display:none;background:none;border:1px solid var(--rule-2);
  width:2.6rem;height:2.6rem;cursor:pointer;padding:0;
}
.nav-toggle span{display:block;width:1.15rem;height:1px;background:var(--ink);margin:0.3rem auto;}

@media (max-width:1040px){
  .nav{
    display:none;position:fixed;inset:64px 0 0;background:var(--bg);
    flex-direction:column;gap:0;padding:1.5rem var(--gutter) 3rem;overflow-y:auto;
  }
  .nav.open{display:flex;}
  .nav a{font-family:var(--serif);font-size:1.35rem;letter-spacing:0.02em;
         text-transform:none;padding:0.85rem 0;border-bottom:1px solid var(--rule);}
  .nav a[aria-current="page"]{color:var(--gold);border-bottom-color:var(--rule);}
  .nav-toggle{display:block;}
}

/* ---------- herói ---------- */
.hero{position:relative;width:100%;overflow:hidden;background:var(--bg-3);}
.hero-band{position:relative;width:100%;height:clamp(320px,58vh,600px);}
.hero-band img{width:100%;height:100%;object-fit:cover;object-position:center 42%;}
.hero-band::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(16,17,40,0.45) 0%,rgba(16,17,40,0.12) 42%,rgba(16,17,40,0.86) 100%);
}
.hero-title{
  position:absolute;left:0;right:0;bottom:clamp(1.5rem,4vw,3rem);z-index:2;
}
.hero-title .shell{display:block;}
.wordmark{margin:0;}
.wordmark img{
  width:min(40rem, 72%);height:auto;
  filter:drop-shadow(0 2px 24px rgba(0,0,0,0.55));
}
@media (max-width:700px){.wordmark img{width:88%;}}

/* herói interior (páginas sem banda de imagem) */
.page-head{padding:clamp(3rem,6vw,5rem) 0 0;}
.page-title{
  font-family:var(--serif);font-weight:400;font-variant:small-caps;
  font-size:clamp(2.1rem,4.6vw,3.4rem);line-height:1.05;letter-spacing:0.03em;
  margin:0 0 1.2rem;
}
.lede{
  font-size:clamp(1.25rem,2.2vw,1.5rem);line-height:1.5;color:var(--ink);
  max-width:58ch;margin:0 0 1.5rem;
}

/* ---------- tipografia de conteúdo ---------- */
h2,h3,h4{font-weight:400;margin:0 0 0.85rem;line-height:1.2;}
h2{font-family:var(--serif);font-variant:small-caps;font-size:1.85rem;letter-spacing:0.03em;}
h3{font-family:var(--serif);font-size:1.45rem;}
h4{font-family:var(--sans);font-size:0.78rem;font-weight:500;letter-spacing:0.14em;
   text-transform:uppercase;color:var(--ink-3);}
p{margin:0 0 1.15rem;}
p:last-child{margin-bottom:0;}
.eyebrow{
  display:block;font-family:var(--sans);font-size:0.7rem;font-weight:400;
  letter-spacing:0.16em;text-transform:uppercase;color:var(--ink-3);
  margin:0 0 0.6rem;
}
.small{font-size:0.98rem;color:var(--ink-2);}

/* ---------- citações ---------- */
.pullquote{
  margin:2.2rem 0 0;padding:0 0 0 1.6rem;border-left:1px solid var(--gold-soft);
  max-width:56ch;
}
.pullquote p{
  font-size:1.35rem;line-height:1.45;font-style:italic;color:var(--ink);margin:0 0 0.5rem;
}
.pullquote cite{
  font-family:var(--sans);font-style:normal;font-size:0.74rem;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--ink-3);
}

/* ---------- botões ---------- */
.btn{
  display:inline-block;font-family:var(--sans);font-size:0.72rem;font-weight:500;
  letter-spacing:0.14em;text-transform:uppercase;
  padding:0.85rem 1.6rem;border:1px solid var(--gold);color:var(--gold);
  background:transparent;transition:background .18s ease,color .18s ease;
}
.btn:hover{background:var(--gold);color:var(--bg);}
.btn-quiet{border-color:var(--rule-2);color:var(--ink-2);}
.btn-quiet:hover{background:var(--ink);border-color:var(--ink);color:var(--bg);}
.btn-row{display:flex;flex-wrap:wrap;gap:0.9rem;margin-top:1.8rem;}

.more{
  font-family:var(--sans);font-size:0.72rem;font-weight:500;letter-spacing:0.13em;
  text-transform:uppercase;color:var(--gold);border-bottom:1px solid var(--gold-soft);
  padding-bottom:0.15rem;display:inline-block;
}
.more:hover{border-bottom-color:var(--gold);}

/* ---------- entradas (projectos, discos, agenda) ---------- */
.entries{margin:0;}
.entry{
  display:grid;grid-template-columns:var(--label-col) minmax(0,1fr);
  gap:var(--gap);
  padding:2.6rem 0;border-top:1px solid var(--rule);
}
.entry:first-child{border-top:1px solid var(--rule-2);}
.entry .side{
  font-family:var(--sans);font-size:0.72rem;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-3);line-height:1.6;padding-top:0.45rem;
}
.entry .side .year{display:block;color:var(--gold);letter-spacing:0.1em;}
.entry h3{margin-bottom:0.6rem;}
.entry h3 .alt-title{
  display:block;font-family:var(--sans);font-size:0.7rem;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--ink-3);margin-top:0.35rem;
}
.entry .body{max-width:66ch;}
.entry.has-media{grid-template-columns:var(--label-col) minmax(0,1fr) 21rem;}
.entry .media{padding-top:0.4rem;}
.entry .media figure{margin:0;}
.entry .media img{width:100%;height:auto;border:1px solid var(--rule);}
.entry .media .video .cap{font-size:0.92rem;line-height:1.35;}
@media (max-width:1100px){
  .entry.has-media{grid-template-columns:var(--label-col) minmax(0,1fr);}
  .entry.has-media .media{grid-column:2;max-width:26rem;}
}
@media (max-width:860px){
  .entry{grid-template-columns:1fr;gap:0.9rem;padding:2rem 0;}
  .entry .side{padding-top:0;}
  .entry.has-media{grid-template-columns:1fr;}
  .entry.has-media .media{grid-column:1;max-width:none;}
}

/* ---------- discografia ---------- */
.discs .disc{padding:2.8rem 0;border-top:1px solid var(--rule);}
.discs .disc:first-child{border-top:1px solid var(--rule-2);padding-top:2.2rem;}
.disc h3{font-size:1.7rem;margin-bottom:0.35rem;}
.disc .disc-sub{
  font-family:var(--sans);font-size:0.74rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--ink-2);margin:0 0 0.35rem;
}
.disc .disc-meta{
  font-family:var(--sans);font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--gold);margin:0 0 1.3rem;
}
.player{margin-top:1.4rem;max-width:620px;}
.player iframe{width:100%;height:152px;border:0;border-radius:2px;display:block;}
.player.tall iframe{height:352px;}
.album-feature{display:grid;grid-template-columns:190px minmax(0,1fr);gap:1.8rem;align-items:start;margin-top:1.6rem;}
.album-feature img{width:100%;height:auto;border:1px solid var(--rule-2);}
.album-feature .player{margin-top:0;}
@media (max-width:700px){.album-feature{grid-template-columns:1fr;gap:1.2rem;}
  .album-feature img{max-width:200px;}}
.disc .links{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:1.1rem;}
.disc .links a{
  font-family:var(--sans);font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--ink-2);border-bottom:1px solid var(--rule-2);padding-bottom:0.12rem;
}
.disc .links a:hover{color:var(--gold);border-bottom-color:var(--gold);}

/* ---------- agenda ---------- */
.agenda{border-top:1px solid var(--rule-2);}
.agenda .row{
  display:grid;grid-template-columns:var(--label-col) minmax(0,1fr);
  gap:var(--gap);padding:1.6rem 0;border-bottom:1px solid var(--rule);
}
.agenda .when{
  font-family:var(--sans);font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--gold);padding-top:0.3rem;
}
.agenda .what h3{font-size:1.3rem;margin-bottom:0.25rem;}
.agenda .where{font-size:1rem;color:var(--ink-2);}
.agenda.past .when{color:var(--ink-3);}
.agenda.past .what h3{font-size:1.15rem;}
@media (max-width:860px){
  .agenda .row{grid-template-columns:1fr;gap:0.35rem;}
  .agenda .when{padding-top:0;}
}

/* ---------- equipa ---------- */
.roster{border-top:1px solid var(--rule-2);margin:0;padding:0;list-style:none;}
.roster li{
  display:grid;grid-template-columns:var(--label-col) minmax(0,1fr);
  gap:var(--gap);padding:1.15rem 0;border-bottom:1px solid var(--rule);
}
.roster .role{
  font-family:var(--sans);font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--ink-3);padding-top:0.4rem;
}
.roster .who{font-size:1.25rem;}
.roster .who span{display:block;font-size:1rem;color:var(--ink-2);margin-top:0.15rem;}
@media (max-width:860px){
  .roster li{grid-template-columns:1fr;gap:0.2rem;}
  .roster .role{padding-top:0;order:2;}
  .roster .who{order:1;}
}

/* ---------- imagens ---------- */
.plate{margin:var(--section) 0;background:var(--bg-3);}
.plate img{width:100%;height:auto;}
.plate figcaption{
  font-family:var(--sans);font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink-3);padding:0.7rem 0 0;
}
.poster{margin:0;max-width:620px;}
.poster.center{margin-left:auto;margin-right:auto;}
.poster img{width:100%;height:auto;border:1px solid var(--rule);}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;}
.gallery .frame{
  aspect-ratio:3/2;background:var(--bg-3);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.gallery .frame img{width:100%;height:100%;object-fit:contain;}
@media (max-width:820px){.gallery{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.gallery{grid-template-columns:1fr;}}

/* ---------- vídeo ---------- */
.videos{display:grid;grid-template-columns:1fr 1fr;gap:2.2rem 1.8rem;}
@media (max-width:820px){.videos{grid-template-columns:1fr;}}
.video .facade{
  position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;cursor:pointer;
  border:1px solid var(--rule);
}
.video .facade img{width:100%;height:100%;object-fit:cover;opacity:0.82;transition:opacity .25s ease;}
.video .facade:hover img{opacity:1;}
.video .facade .play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;}
.video .facade .play::before{
  content:"";width:0;height:0;margin-left:0.32rem;
  border-top:0.95rem solid transparent;border-bottom:0.95rem solid transparent;
  border-left:1.55rem solid #fff;
}
.video .facade .play::after{
  content:"";position:absolute;width:4.2rem;height:4.2rem;border-radius:50%;
  border:1px solid rgba(255,255,255,0.8);
}
.video .facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video .cap{margin-top:0.75rem;font-size:1.05rem;line-height:1.4;}
.video .cap a{font-family:var(--sans);font-size:0.68rem;letter-spacing:0.12em;
  text-transform:uppercase;color:var(--ink-3);display:inline-block;margin-top:0.35rem;
  border-bottom:1px solid var(--rule-2);padding-bottom:0.1rem;}
.video .cap a:hover{color:var(--gold);border-bottom-color:var(--gold);}

/* ---------- destaque / faixa de notícia ---------- */
.feature{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--gap);
  align-items:center;
  border:1px solid var(--rule-2);background:var(--bg-2);
  padding:clamp(1.5rem,3vw,2.2rem) clamp(1.5rem,3vw,2.4rem);
}
.feature h3{margin-bottom:0.4rem;}
@media (max-width:820px){.feature{grid-template-columns:1fr;gap:1.4rem;}}

/* ---------- listas simples ---------- */
.plain{list-style:none;margin:0;padding:0;}
.plain li{padding:0.45rem 0;border-bottom:1px solid var(--rule);}
.plain li:last-child{border-bottom:0;}

/* ---------- rodapé ---------- */
.site-footer{border-top:1px solid var(--rule-2);padding:var(--section) 0 3rem;}
.foot{display:grid;grid-template-columns:var(--label-col) minmax(0,1fr);gap:var(--gap);}
.foot .mark img{height:64px;width:auto;opacity:0.9;}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;}
.foot-cols h4{margin-bottom:0.7rem;}
.foot-cols p,.foot-cols li{font-family:var(--sans);font-size:0.9rem;line-height:1.7;color:var(--ink-2);margin:0;}
.foot-cols a{color:var(--ink-2);}
.foot-cols a:hover{color:var(--gold);}
.support{
  margin-top:var(--section);padding-top:1.6rem;border-top:1px solid var(--rule);
  font-family:var(--sans);font-size:0.72rem;line-height:1.9;letter-spacing:0.03em;color:var(--ink-3);
}
@media (max-width:860px){
  .foot{grid-template-columns:1fr;gap:2rem;}
  .foot-cols{grid-template-columns:1fr;gap:1.6rem;}
}

/* ---------- utilitários ---------- */
.stack-sm > * + *{margin-top:1rem;}
.stack > * + *{margin-top:1.8rem;}
.center{text-align:center;}
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
