/* ==========================================================================
   Adizza Prado Galeria — sistema visual v2
   Arquitetura de ghebaly.com (Artlogic); identidade da casa: papel quente,
   tinta grafite, acento oxblood do cartaz, serifa literária nos títulos.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;1,6..72,300;1,6..72,400&display=swap');

:root{
  /* --- cor ------------------------------------------------------------- */
  --paper:      #fbf9f6;
  --paper-2:    #f2ece3;
  --paper-3:    #ebe4d9;
  --ink:        #1b1917;
  --ink-soft:   #57514a;
  --ink-faint:  #9b9289;
  --accent:     #7b2e27;
  --accent-soft:#a8564c;
  --rule:       #e6dfd3;
  --rule-soft:  #efe9e0;

  /* --- tipografia ------------------------------------------------------ */
  --sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
  --serif:"Newsreader", ui-serif, Georgia, "Times New Roman", serif;

  --fs-base:    0.975rem;
  --fs-meta:    0.8125rem;
  --fs-micro:   0.72rem;
  --fs-lead:    clamp(1.25rem, 1.9vw, 1.6rem);
  --fs-display: clamp(2rem, 4.4vw, 3.4rem);
  --fs-title:   1.1875rem;

  --track-caps: .16em;

  /* --- métrica --------------------------------------------------------- */
  --gutter:     clamp(1.5rem, 4vw, 3.5rem);
  --header-h:   6.25rem;
  --measure:    38rem;

  --ease:       cubic-bezier(.22,.61,.36,1);
  --ease-out:   cubic-bezier(.16,1,.3,1);
}

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

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  min-height:100vh;
  display:flex; flex-direction:column;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:var(--fs-base);
  line-height:1.68;
  font-weight:400;
  font-feature-settings:"kern" 1, "liga" 1, "calt" 1;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-weight:500; margin:0; line-height:1.25; }
p{ margin:0 0 1.1em; }
p:last-child{ margin-bottom:0; }

::selection{ background:var(--accent); color:var(--paper); }

:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; border-radius:1px; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skiplink{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--ink); color:var(--paper); padding:.75rem 1.25rem;
}
.skiplink:focus{ left:0; }

/* --- sublinhado que cresce a partir da esquerda ------------------------ */
.u-link{
  background-image:linear-gradient(currentColor,currentColor);
  background-position:0 100%;
  background-repeat:no-repeat;
  background-size:0 1px;
  transition:background-size .38s var(--ease-out);
  padding-bottom:2px;
}
.u-link:hover,
.u-link:focus-visible,
.u-link.is-active,
.u-link[aria-current="page"]{ background-size:100% 1px; }

/* ---------------------------------------------------------------- header */

.site-header{
  position:fixed; inset:0 0 auto 0; z-index:100;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 var(--gutter);
  height:var(--header-h);
  border-bottom:1px solid var(--rule-soft);
}

.logo{ display:block; line-height:1; }
.logo-mark{
  display:block;
  font-size:1.3125rem; font-weight:500;
  letter-spacing:.245em; text-indent:.245em;
  text-transform:uppercase;
}
.logo-sub{
  display:block;
  font-size:.5rem; font-weight:400;
  letter-spacing:.44em; text-indent:.44em;
  text-transform:uppercase;
  color:var(--ink-faint);
  margin-top:.62em;
}

.nav-main ul{
  list-style:none; margin:0; padding:0;
  display:flex; align-items:center; gap:1.75rem;
}
.nav-main a{ font-size:var(--fs-meta); font-weight:500; letter-spacing:.02em; }

.nav-toggle{
  display:none;
  background:none; border:0; padding:.5rem 0; cursor:pointer;
  font:inherit; font-size:var(--fs-meta); font-weight:500; color:inherit;
  letter-spacing:.02em;
}

/* ---------------------------------------------------------------- layout */

main{ padding-top:var(--header-h); flex:1 0 auto; }

.wrap{ padding-left:var(--gutter); padding-right:var(--gutter); }
.section{ padding-top:clamp(2.5rem,5vw,4.5rem); padding-bottom:clamp(4rem,8vw,7rem); }
.measure{ max-width:var(--measure); }
.measure-wide{ max-width:58rem; }

/* rótulo de seção em versalete espaçado */
.eyebrow{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-faint);
  margin-bottom:1.5rem;
}

.page-title{ font-size:var(--fs-title); font-weight:500; margin-bottom:1.75rem; }

.rule{ border:0; border-top:1px solid var(--rule); margin:clamp(3rem,6vw,5rem) 0; }

/* --------------------------------------------------------- sub-navegação */

.subnav{ list-style:none; margin:0 0 clamp(2.5rem,5vw,4rem); padding:0; }
.subnav li{ margin-bottom:.3rem; }
.subnav a{ font-size:var(--fs-meta); font-weight:500; }

.subnav--inline{ display:flex; flex-wrap:wrap; gap:1.75rem; margin-bottom:3rem; }
.subnav--inline li{ margin:0; }

/* --------------------------------------------------------- hero / slides */

.hero{
  position:relative;
  height:calc(100vh - var(--header-h)); min-height:30rem;
  overflow:hidden; background:var(--paper-2);
}
.hero-slide{
  position:absolute; inset:0;
  opacity:0; visibility:hidden;
  transition:opacity 1.2s var(--ease), visibility 1.2s var(--ease);
}
.hero-slide.is-active{ opacity:1; visibility:visible; }
.hero-slide img{
  width:100%; height:100%; object-fit:cover; object-position:center;
  transform:scale(1.04);
  transition:transform 9s var(--ease-out);
}
.hero-slide.is-active img{ transform:scale(1); }
.hero-slide::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top,
    rgba(20,16,12,.52) 0%, rgba(20,16,12,.20) 26%, rgba(20,16,12,0) 55%);
}

.hero-caption{
  position:absolute; left:var(--gutter); bottom:clamp(2.25rem,5vw,3.75rem);
  z-index:3; color:#fff; max-width:min(36rem, 70vw);
}
.hero-caption .who{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  opacity:.9; margin-bottom:.7rem;
}
.hero-caption .what{
  font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:clamp(1.9rem,4vw,3rem); line-height:1.08;
  letter-spacing:-.01em; margin-bottom:.85rem;
}
.hero-caption .when,
.hero-caption .place{ font-size:var(--fs-meta); opacity:.86; line-height:1.6; }
.hero-caption a:hover .what{ color:#fff; opacity:.86; transition:opacity .3s var(--ease); }

.hero-nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:4;
  background:none; border:0; cursor:pointer;
  width:4.5rem; height:6rem; color:#fff;
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .35s var(--ease);
}
.hero:hover .hero-nav, .hero-nav:focus-visible{ opacity:.75; }
.hero-nav:hover{ opacity:1; }
.hero-nav--prev{ left:0; } .hero-nav--next{ right:0; }
.hero-nav svg{ width:1.4rem; height:1.4rem; }

.hero-dots{
  position:absolute; right:var(--gutter); bottom:clamp(2.5rem,5vw,4rem);
  z-index:4; display:flex; gap:.6rem;
}
.hero-dots button{
  width:6px; height:6px; padding:0; border-radius:50%;
  border:1px solid rgba(255,255,255,.9); background:none; cursor:pointer;
  transition:background .3s var(--ease);
}
.hero-dots button.is-active{ background:#fff; }

/* ------------------------------------------------------------ card grids */

.grid{ display:grid; gap:clamp(2.5rem,5vw,4.5rem) clamp(1.75rem,3.5vw,3rem); }
.grid--2{ grid-template-columns:repeat(2,1fr); }
.grid--3{ grid-template-columns:repeat(3,1fr); }

.card figure{ margin:0; }

/* convenção Artlogic: imagem contida, alinhada pela base */
.card .card-media{
  height:clamp(17rem,30vw,27rem);
  display:flex; align-items:flex-end; justify-content:flex-start;
  overflow:hidden;
}
.card .card-media img{
  width:auto; max-width:100%; height:auto; max-height:100%;
  object-fit:contain;
  transition:transform 1.4s var(--ease-out), opacity .6s var(--ease);
}
.card:hover .card-media img{ transform:scale(1.018); }

.card-body{ padding-top:1.15rem; }
.card-body .who{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:.45rem;
}
.card-body .what{
  font-family:var(--serif); font-style:italic; font-weight:400;
  font-size:1.3rem; line-height:1.2; margin-bottom:.5rem;
}
.card:hover .card-body .what{ color:var(--accent); transition:color .3s var(--ease); }
.card-body .when,
.card-body .where{ font-size:var(--fs-meta); color:var(--ink-soft); line-height:1.55; }

/* obras */
.work .card-media{
  height:clamp(15rem,26vw,23rem);
  align-items:center; justify-content:center;
}
.work-caption{ font-size:var(--fs-meta); color:var(--ink-soft); padding-top:1rem; line-height:1.6; }
.work-caption .work-title{
  display:block;
  font-family:var(--serif); font-style:italic; font-size:1.1rem;
  color:var(--ink); margin-bottom:.3rem; line-height:1.3;
}

/* ------------------------------------------------------- índice artistas */

.artist-index{ columns:3; column-gap:clamp(1.75rem,3.5vw,3rem); list-style:none; margin:0; padding:0; }
.artist-index li{ break-inside:avoid; margin-bottom:.85rem; }
.artist-index a{ font-size:1.0625rem; font-weight:400; }
.artist-index .is-represented::after{
  content:""; display:inline-block;
  width:4px; height:4px; border-radius:50%;
  background:var(--accent); vertical-align:.32em; margin-left:.55em;
}

/* ------------------------------------------------- cabeçalho secundário */

.subheader{
  position:sticky; top:var(--header-h); z-index:60;
  background:var(--paper);
  padding:1.15rem var(--gutter) 1.2rem;
  border-bottom:1px solid var(--rule-soft);
}
.subheader h1{ font-size:var(--fs-meta); font-weight:500; letter-spacing:.01em; }
.subheader h1 em{ font-family:var(--serif); font-size:1.05rem; font-weight:400; }
.subheader .sub{ font-size:var(--fs-micro); color:var(--ink-faint); margin-top:.2rem; }

.banner{
  width:100%; max-height:62vh; object-fit:cover; object-position:center;
  background:var(--paper-2);
}

/* ------------------------------------------------- cabeçalho de exposição */

.show-head{ margin-bottom:clamp(2.5rem,5vw,4rem); max-width:52rem; }
.show-head .who{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:1rem;
}
.show-head .display{
  font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:var(--fs-display); line-height:1.02; letter-spacing:-.015em;
  margin-bottom:1.15rem;
}
.show-head .meta{ font-size:var(--fs-meta); color:var(--ink-soft); line-height:1.7; }
.show-head .meta span+span::before{ content:" · "; color:var(--ink-faint); }

/* corpo em duas colunas: texto + ficha */
.cols{
  display:grid; grid-template-columns:minmax(0,var(--measure)) minmax(0,16rem);
  gap:clamp(2.5rem,6vw,5rem); align-items:start;
}
.ficha{ font-size:var(--fs-meta); color:var(--ink-soft); line-height:1.7; }
.ficha dt{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-faint); margin-bottom:.75rem;
}
.ficha ul{ list-style:none; margin:0; padding:0; }
.ficha li{ padding:.5rem 0; border-top:1px solid var(--rule-soft); }
.ficha li:first-child{ border-top:0; padding-top:0; }

/* --------------------------------------------------------- listas texto */

.stack{ list-style:none; margin:0; padding:0; }
.stack li{ border-bottom:1px solid var(--rule-soft); }
.stack li:first-child{ border-top:1px solid var(--rule-soft); }
.stack a, .stack > li > span{ display:block; padding:1.35rem 0; }
.stack a{ transition:padding-left .4s var(--ease-out); }
.stack a:hover{ padding-left:.65rem; }
.stack .who{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-soft);
}
.stack .what{
  display:block; font-family:var(--serif); font-style:italic;
  font-size:1.25rem; line-height:1.25; margin-top:.35rem;
}
.stack a:hover .what{ color:var(--accent); }
.stack .meta{ font-size:var(--fs-meta); color:var(--ink-soft); margin-top:.3rem; }

.lead{
  font-family:var(--serif); font-weight:300;
  font-size:var(--fs-lead); line-height:1.42; letter-spacing:-.005em;
}
.quote{
  font-family:var(--serif); font-style:italic; font-weight:300;
  font-size:var(--fs-lead); line-height:1.4;
  color:var(--accent);
  margin:clamp(2.5rem,5vw,4rem) 0; padding-left:1.5rem;
  border-left:1px solid var(--accent-soft);
  max-width:36rem;
}

.back-link{ display:inline-block; font-size:var(--fs-meta); color:var(--ink-soft); }
.back-link:hover{ color:var(--ink); }

/* ------------------------------------------------------------ formulário */

.form{ max-width:30rem; }
.form-row{ margin-bottom:1.5rem; }
.form label{
  display:block; font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-faint); margin-bottom:.5rem;
}
.form input, .form textarea{
  width:100%; font:inherit; color:inherit; background:transparent;
  border:0; border-bottom:1px solid var(--rule); border-radius:0;
  padding:.5rem 0;
  transition:border-color .3s var(--ease);
}
.form input:focus, .form textarea:focus{ border-bottom-color:var(--ink); outline:none; }

.btn{
  display:inline-block; font:inherit; font-size:var(--fs-meta); font-weight:500;
  letter-spacing:.02em; cursor:pointer;
  background:var(--ink); color:var(--paper);
  border:1px solid var(--ink); border-radius:0;
  padding:.85rem 1.75rem;
  transition:background .35s var(--ease), color .35s var(--ease);
}
.btn:hover{ background:transparent; color:var(--ink); }
.btn--ghost{ background:transparent; color:var(--ink); }
.btn--ghost:hover{ background:var(--ink); color:var(--paper); }

.form-note .dot{
  display:inline-block; width:4px; height:4px; border-radius:50%;
  background:var(--accent); vertical-align:.28em; margin-right:.35em;
}
.form-note{ font-size:var(--fs-meta); color:var(--ink-faint); margin-top:1.15rem; line-height:1.6; }

/* ---------------------------------------------------------------- footer */

.site-footer{
  flex-shrink:0;
  background:var(--paper-2);
  padding:clamp(3rem,6vw,5rem) var(--gutter) 2.5rem;
  border-top:1px solid var(--rule);
}
.footer-grid{
  display:grid; grid-template-columns:1.15fr 1fr 1fr;
  gap:clamp(2rem,4vw,3.5rem); align-items:start;
}
.footer-grid h2{
  font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-faint); margin-bottom:1.15rem;
}
.site-footer address{ font-style:normal; font-size:var(--fs-meta); line-height:1.9; }
.site-footer p{ font-size:var(--fs-meta); line-height:1.7; }

.footer-bottom{
  display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between;
  font-size:var(--fs-micro); color:var(--ink-faint);
  letter-spacing:.03em;
  border-top:1px solid var(--rule);
  margin-top:clamp(2.5rem,5vw,4rem); padding-top:1.6rem;
}
.footer-bottom ul{ list-style:none; display:flex; gap:1.75rem; margin:0; padding:0; }

/* ---------------------------------------------------------------- busca */

.search-overlay{
  position:fixed; inset:0; z-index:150;
  background:var(--paper);
  padding:var(--header-h) var(--gutter) 3rem;
  overflow-y:auto; display:none;
}
.search-overlay.is-open{ display:block; animation:fade .35s var(--ease); }
@keyframes fade{ from{opacity:0} to{opacity:1} }
.search-overlay input[type="search"]{
  width:100%; max-width:46rem;
  font-family:var(--serif); font-weight:300; font-size:var(--fs-lead);
  background:transparent; border:0; border-bottom:1px solid var(--rule);
  padding:.85rem 0; color:inherit; border-radius:0;
}
.search-overlay input[type="search"]::placeholder{ color:var(--ink-faint); }
.search-overlay input[type="search"]:focus{ outline:none; border-bottom-color:var(--ink); }
.search-close{
  position:absolute; top:2.25rem; right:var(--gutter);
  background:none; border:0; cursor:pointer; color:inherit;
  font:inherit; font-size:var(--fs-meta); font-weight:500;
}
.search-results{ list-style:none; padding:0; margin:2.75rem 0 0; max-width:46rem; }
.search-results li{ border-bottom:1px solid var(--rule-soft); }
.search-results a{ display:block; padding:1.15rem 0; transition:padding-left .4s var(--ease-out); }
.search-results a:hover{ padding-left:.65rem; }
.search-results .kind{
  display:block; font-size:var(--fs-micro); font-weight:500;
  letter-spacing:var(--track-caps); text-transform:uppercase;
  color:var(--ink-faint); margin-bottom:.3rem;
}
.search-results .title{ font-family:var(--serif); font-size:1.2rem; }
.search-results a:hover .title{ color:var(--accent); }
.search-empty{ color:var(--ink-faint); font-size:var(--fs-meta); margin-top:2rem; }

/* ------------------------------------------------------- revelar ao rolar */

.reveal{ opacity:0; transform:translateY(14px); }
.reveal.is-in{
  opacity:1; transform:none;
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}

/* ------------------------------------------------------------ responsivo */

@media (max-width:1023px){
  :root{ --header-h:5rem; }

  .nav-toggle{ display:block; }
  .nav-main{
    position:fixed; inset:var(--header-h) 0 0 0;
    background:var(--paper);
    padding:2.5rem var(--gutter);
    transform:translateY(-102%);
    transition:transform .5s var(--ease-out);
    visibility:hidden;
  }
  .nav-main.is-open{ transform:translateY(0); visibility:visible; }
  .nav-main ul{ flex-direction:column; align-items:flex-start; gap:1.35rem; }
  .nav-main a{ font-family:var(--serif); font-size:1.75rem; font-weight:300; letter-spacing:0; }

  .grid--3{ grid-template-columns:repeat(2,1fr); }
  .artist-index{ columns:2; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .cols{ grid-template-columns:1fr; }
  .hero-nav{ opacity:.8; width:3rem; }
}

@media (max-width:639px){
  .grid--2,.grid--3{ grid-template-columns:1fr; }
  .artist-index{ columns:1; }
  .footer-grid{ grid-template-columns:1fr; }
  .hero-caption{ right:var(--gutter); max-width:none; }
  .hero-dots{ display:none; }
  .card .card-media{ height:auto; max-height:70vh; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; }
  .hero-slide img{ transform:none; }
}

@media print{
  .site-header,.site-footer,.hero-nav,.search-overlay{ display:none !important; }
  main{ padding-top:0; }
  .reveal{ opacity:1; transform:none; }
}