/* =========================================================
   CriAromas — estilos das páginas de Projetos
   Usado por projetos.html e por projetos/<slug>.html,
   ambos gerados por gerar_projetos.py
   ========================================================= */

/* ---------- capa ---------- */
.hero-int{position:relative;min-height:62vh;display:flex;align-items:center;
   background-position:center 55%;background-size:cover;background-repeat:no-repeat}
.hero-int::before{content:'';position:absolute;inset:0;background:
   linear-gradient(180deg,rgba(24,17,11,.76) 0%,rgba(24,17,11,.62) 42%,rgba(24,17,11,.72) 100%)}
.hero-int .interno{position:relative;z-index:3;max-width:min(920px,100%);margin:0 auto;text-align:center;
   padding:150px clamp(1.25rem,4vw,3rem) clamp(3rem,6vw,4.5rem)}
.hero-int h1{font-size:clamp(2rem,4.2vw,3.5rem);color:var(--color-cream-on-dark);text-wrap:normal;
   text-shadow:0 2px 24px rgba(20,14,9,.5)}
.hero-int h1 em{color:#fff;font-family:var(--font-display-italic);font-style:italic;font-weight:380}
.hero-int p{color:#efe6d6;font-size:var(--text-lead);max-width:52ch;margin:1.3rem auto 0;
   text-shadow:0 1px 14px rgba(20,14,9,.5)}

/* ---------- tradução em duas falas ---------- */
.duo-fala{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:1000px;margin:0 auto;
   padding:0 clamp(1.25rem,4vw,3rem)}
.duo-fala .caixa:first-child{border-radius:var(--radius-md) 0 0 var(--radius-md)}
.duo-fala .caixa:last-child{border-radius:0 var(--radius-md) var(--radius-md) 0}
.caixa{padding:clamp(2rem,4vw,3rem);display:flex;flex-direction:column;justify-content:center;gap:1.1rem;
   transition:background .55s cubic-bezier(.22,.61,.36,1)}
.caixa .rot{font-family:var(--font-interface);font-size:.75rem;font-weight:600;letter-spacing:.2em;
   text-transform:uppercase;transition:color .55s ease}
.caixa .fala{margin:0;font-family:var(--font-display);font-weight:400;letter-spacing:-.015em;
   font-size:clamp(1.7rem,2.6vw,2.3rem);line-height:1.14;transition:color .55s ease}
.caixa .apoio{margin:0;font-size:.95rem;line-height:1.65;transition:color .55s ease}
.caixa.pedido{background:var(--color-surface)}
.caixa.pedido .rot{color:var(--color-text-muted)}
.caixa.pedido .fala{color:var(--color-text)}
.caixa.pedido .apoio{color:#5c534a}
.caixa.leitura{background:var(--color-brand)}
.caixa.leitura .rot{color:#fff}
.caixa.leitura .fala{color:#fff;font-family:var(--font-display-italic);font-style:italic;font-weight:380}
.caixa.leitura .apoio{color:#fff}
.duo-fala:has(.pedido:hover) .pedido{background:var(--color-brand)}
.duo-fala:has(.pedido:hover) .pedido .rot{color:#fff}
.duo-fala:has(.pedido:hover) .pedido .fala{color:#fff}
.duo-fala:has(.pedido:hover) .pedido .apoio{color:#fff}
.duo-fala:has(.pedido:hover) .leitura{background:var(--color-surface)}
.duo-fala:has(.pedido:hover) .leitura .rot{color:var(--color-text-muted)}
.duo-fala:has(.pedido:hover) .leitura .fala{color:var(--color-text)}
.duo-fala:has(.pedido:hover) .leitura .apoio{color:#5c534a}

/* ---------- galeria ---------- */
.galeria{display:grid;grid-template-columns:2fr 1fr;gap:1rem;max-width:1000px;margin:2.2rem auto 0;
   padding:0 clamp(1.25rem,4vw,3rem)}
.galeria.sozinha{grid-template-columns:1fr}
.galeria .col{display:grid;gap:1.4rem;align-content:start}
.galeria img{width:100%;object-fit:cover;border-radius:var(--radius-md);display:block}
.galeria .grande img{aspect-ratio:4/3.2}
.galeria .col img{aspect-ratio:4/3}
.galeria figure{margin:0}
.galeria figcaption{margin-top:.9rem;font-size:.9rem;line-height:1.6;color:#5c534a}
.galeria .col figure{margin:0;display:flex;flex-direction:column}
.galeria .col figcaption{margin-top:.7rem;font-size:.82rem;line-height:1.55}

.case-dados{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,4vw,3rem);
   max-width:1000px;margin:2.4rem auto 0;padding:0 clamp(1.25rem,4vw,3rem)}
.case-dados span{font-family:var(--font-interface);font-size:.75rem;font-weight:600;letter-spacing:.2em;
   text-transform:uppercase;color:var(--color-brand)}
.case-dados p{margin-top:.5rem;font-size:1rem;line-height:1.65;color:var(--color-text-soft)}

/* ---------- grade de outros projetos ---------- */
.grade-proj{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem;
   max-width:var(--container);margin:0 auto;padding:0 clamp(1.25rem,4vw,3rem)}
.card-proj{background:var(--color-background);border-radius:var(--radius-md);overflow:hidden;
   text-decoration:none;color:inherit;display:block;transition:transform var(--transition-fast)}
.card-proj:hover{transform:translateY(-4px)}
.card-proj img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.card-proj .txt{padding:1.5rem 1.6rem 1.9rem}
.card-proj h3{font-size:1.25rem;margin-top:.5rem}
.card-proj p{margin-top:.5rem;font-size:.95rem;line-height:1.6;color:var(--color-text-soft)}

/* ---------- convite ---------- */
.convite{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(2rem,5vw,3.5rem);
   max-width:920px;margin:0 auto;padding:0 clamp(1.25rem,4vw,3rem)}
.convite div{padding-top:1.4rem;border-top:1px solid var(--color-border)}
.convite b{display:block;font-family:var(--font-display);font-weight:400;font-size:1.3rem}
.convite span{display:block;margin-top:.55rem;font-size:.95rem;line-height:1.65;color:var(--color-text-soft)}

@media(max-width:860px){
  .duo-fala{grid-template-columns:1fr}
  .duo-fala .caixa:first-child{border-radius:var(--radius-md) var(--radius-md) 0 0}
  .duo-fala .caixa:last-child{border-radius:0 0 var(--radius-md) var(--radius-md)}
  .galeria,.case-dados,.convite,.grade-proj{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.caixa,.caixa *,.card-proj{transition:none}}