/* inicio.css — apresentacao abaixo do carrossel, em destaque, na midia, em numeros, previa (carrossel: carrossel.css; moldura: .c-frame em base.css) */

/* Ritmo vertical da Início: ~1.5x o espaco padrao entre secoes (--hs), usando os tokens de base.css */
:root{--hs:calc(var(--space-xl)*1.5)}
.c-section{padding-block:var(--hs)}
.h-intro{padding-block:var(--hs)}
.h-intro__grid{display:grid;gap:calc(var(--space-m)*1.4);align-items:start}
.h-intro__fig{margin:0;max-width:16.5rem}
.h-intro__fig img{display:block;width:100%;height:auto;aspect-ratio:263/400}
@media (min-width:48rem){.h-intro__grid{grid-template-columns:minmax(0,1fr) 16.5rem;gap:calc(var(--space-xl)*1.3)}.h-intro__fig{order:2}}
.h-intro__line{font-size:var(--step-1);color:var(--text);max-width:48ch}
.h-intro__t{margin-top:calc(var(--space-l)*1.4);font-size:var(--step-2);font-weight:400}
.h-intro .c-lede{margin-top:var(--space-s)}

.h-nums{display:grid;gap:var(--space-m);margin-top:var(--space-l);border-top:1px solid var(--line)}
.h-num{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .4rem;padding-top:var(--space-s)}
.h-num__n{font-family:var(--font-display);font-size:var(--step-4);font-weight:300;line-height:1}
.h-num__pre,.h-num__unit{font-family:var(--font-sans);font-size:var(--step--1);color:var(--text-2)}
.h-num__unit{flex-basis:100%}
@media (min-width:40rem){.h-nums{grid-template-columns:repeat(2,1fr);gap:var(--space-m) var(--gutter)}}
@media (min-width:64rem){.h-nums{grid-template-columns:repeat(4,1fr)}}

.h-center{font-size:var(--step-3);font-weight:300;line-height:var(--lh-title);text-align:center}

/* Em destaque: faixa de fundo diferente, 4 colunas iguais, imagem emoldurada (passe-partout na cor da pagina para destacar da faixa) */
.h-dest{background:var(--surface);padding-block:var(--hs)}
.h-dest .c-frame{--frame-bg:transparent}
.h-dest__list{display:grid;gap:calc(var(--space-l)*1.3) calc(var(--gutter)*1.3);margin-top:calc(var(--space-l)*1.4)}
.h-dest__it{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-xs)}
.h-dest__it .c-frame{width:100%;margin-bottom:var(--space-2xs)}
.h-dest__t{font-family:var(--font-sans);font-size:var(--step-0);font-weight:400;letter-spacing:.06em;text-transform:uppercase;line-height:1.3}
.h-dest__p{flex:1;font-family:var(--font-sans);font-size:var(--step--1);color:var(--text-2);max-width:34ch}
.h-dest__a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--font-sans);font-size:var(--step--1);color:var(--text);text-decoration:underline;text-underline-offset:.25em}
.h-dest__a::after{content:"";position:absolute;inset:0}
.h-dest__it:hover .h-dest__a,.h-dest__a:hover{color:var(--accent)}
.h-dest__a:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
@media (min-width:40rem){.h-dest__list{grid-template-columns:repeat(2,1fr)}}
@media (min-width:64rem){.h-dest__list{grid-template-columns:repeat(4,1fr)}}

.h-galhead{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--space-xs) var(--space-m);margin-bottom:var(--space-l)}

.h-oncas .c-h2{margin-bottom:var(--space-l)}
.h-sci{font-style:italic;white-space:nowrap}
.h-oncas__grid{--row-h:22rem}
@media (min-width:64rem){.h-oncas__grid{--row-h:11.5rem}}
@media (min-width:90rem){.h-oncas__grid{--row-h:17rem}}
.h-oncas__t{margin:var(--space-l) 0 var(--space-m)}
.h-oncas{content-visibility:auto;contain-intrinsic-size:auto 76rem}

/* H1 visivel: a frase de abertura (antes um <p>) assume o H1 sem mudar o visual */
h1.h-intro__line{font-family:inherit;font-weight:inherit;line-height:inherit;text-wrap:wrap}

/* CTA: Na mídia / Exposições / Prêmios em cartões pequenos */
.h-cta{padding-block:calc(var(--hs)*.6)}
.h-cta__list{display:grid;gap:var(--space-xs);grid-template-columns:minmax(0,1fr)}
@media (min-width:48rem){.h-cta__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-s)}}
.h-cta__a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3xs) var(--space-xs);align-items:end;min-height:7.5rem;padding:var(--space-s);background:var(--surface);color:var(--text);text-decoration:none;transition:background-color var(--dur-base)}
.h-cta__a:hover{background:var(--line)}
.h-cta__a:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.h-cta__t{grid-column:1/-1;font:400 var(--step-1)/1.2 var(--font-display)}
.h-cta__p{font:var(--step--1)/1.45 var(--font-sans);color:var(--text-2)}
.h-cta__go{font:var(--step-1)/1 var(--font-sans);color:var(--accent);transition:transform var(--dur-base)}
.h-cta__a:hover .h-cta__go{transform:translateX(.25rem)}
@media (prefers-reduced-motion:reduce){.h-cta__go,.h-cta__a{transition:none}}

/* Fotografias: layout editorial, grade de 12 colunas, tamanhos e recuos variados, muito ar entre as fotos */
.h-ed{list-style:none;margin:calc(var(--space-l)*1.2) 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:calc(var(--space-l)*1.1) var(--space-xs);align-items:start}
.h-ed__i a{display:block}
.h-ed__i img{display:block;width:100%;height:auto;aspect-ratio:var(--ar)}
.h-ed__i:nth-child(1){grid-column:1/7}
.h-ed__i:nth-child(2){grid-column:4/7}
.h-ed__i:nth-child(3){grid-column:1/4}
.h-ed__i:nth-child(4){grid-column:2/7}
.h-ed__i:nth-child(5){grid-column:1/6}
.h-ed__i:nth-child(6){grid-column:3/7}
.h-ed__i:nth-child(7){grid-column:2/7}
.h-ed__i:nth-child(8){grid-column:1/4}
@media (min-width:64rem){
.h-ed{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gutter);row-gap:calc(var(--space-xl)*1.1)}
.h-ed__i:nth-child(1){grid-column:1/9;grid-row:1}
.h-ed__i:nth-child(2){grid-column:10/13;grid-row:1;align-self:end}
.h-ed__i:nth-child(3){grid-column:2/5;grid-row:2;margin-top:var(--space-xl)}
.h-ed__i:nth-child(4){grid-column:6/13;grid-row:2}
.h-ed__i:nth-child(5){grid-column:1/7;grid-row:3}
.h-ed__i:nth-child(6){grid-column:8/12;grid-row:3;align-self:center}
.h-ed__i:nth-child(7){grid-column:4/9;grid-row:4}
.h-ed__i:nth-child(8){grid-column:10/13;grid-row:4;align-self:end}
}
.h-dest__all{margin:var(--space-m) 0 0;text-align:center}
