/* ══════════════════════════════════════════════════════════ Fábrica de Sites Vistorix — bundle base v1 (imutável). Compartilhado por todos os hotéis: reset, layout, ritmo, componentes. O que varia por hotel são as custom properties do tema (/{slug}/site.css) e os data-attributes de composição no — que trocam GRID e PROPORÇÃO, não só cor. Diferenciar apenas por cor+logo+foto é reprovado pela skill vertical (§6). ══════════════════════════════════════════════════════════ */ *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body,h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0} ul[class],ol[class]{list-style:none;padding:0} img,picture{max-width:100%;display:block} /* Sem `height:auto`, o atributo height do resolve a altura e todo `aspect-ratio` do CSS é ignorado. Com ele, width/height continuam reservando a caixa contra CLS e o layout mantém o controle. */ img{height:auto} input,button,select,textarea{font:inherit;color:inherit} button{background:none;border:0;cursor:pointer} :where(a){color:inherit} /* ── Escala tipográfica ───────────────────────────────── */ :root{ --t-eyebrow:.72rem; --t-small:.875rem; --t-body:clamp(1rem,.965rem + .17vw,1.09rem); --t-lead:clamp(1.08rem,1rem + .35vw,1.28rem); --t-h3:clamp(1.15rem,1.05rem + .5vw,1.45rem); --t-h2:clamp(1.7rem,1.28rem + 1.9vw,2.75rem); --t-display:clamp(2.4rem,1.5rem + 4vw,4.4rem); --lh-display:1.06; --lh-h2:1.12; --lh-body:1.62; --track-eyebrow:.14em; --w-page:min(100% - 2.5rem,74rem); --w-narrow:min(100% - 2.5rem,58rem); --w-text:62ch; --w-bleed:min(100% - 3rem,82rem); --gap-tight:clamp(1.25rem,.9rem + 1.4vw,2rem); --gap-base:clamp(2.5rem,1.6rem + 3.6vw,4.5rem); --gap-pause:clamp(4rem,2.4rem + 6.4vw,8rem); --gap-breath:clamp(5.5rem,3rem + 10vw,11rem); --r-btn:0;--r-img:0;--r-field:0; --ease:cubic-bezier(.2,.6,.25,1); } :root[data-scale="compacta"]{ --t-display:clamp(2rem,1.4rem + 2.7vw,3.2rem); --t-h2:clamp(1.5rem,1.2rem + 1.4vw,2.2rem); --lh-display:1.12; } :root[data-scale="ampla"]{ --t-display:clamp(2.7rem,1.4rem + 6vw,6.2rem); --t-h2:clamp(1.9rem,1.3rem + 2.6vw,3.4rem); --lh-display:1.02; } :root[data-rhythm="compacto"]{ --gap-base:clamp(2rem,1.4rem + 2.4vw,3.2rem); --gap-pause:clamp(2.8rem,1.9rem + 4vw,5rem); --gap-breath:clamp(3.6rem,2.4rem + 5.4vw,6.5rem); } :root[data-rhythm="contemplativo"]{ --gap-base:clamp(3rem,1.8rem + 4.6vw,5.6rem); --gap-pause:clamp(5rem,2.8rem + 8.4vw,10rem); --gap-breath:clamp(7rem,3.4rem + 13vw,14rem); } :root[data-radius="sutil"]{--r-btn:3px;--r-field:3px} :root[data-radius="suave"]{--r-btn:8px;--r-field:8px;--r-img:6px} /* ── Base ─────────────────────────────────────────────── */ body{ background:var(--paper); color:var(--ink); font-family:var(--font-body); font-size:var(--t-body); line-height:var(--lh-body); font-synthesis-weight:none; text-rendering:optimizeLegibility; } h1,h2,h3,.display{ font-family:var(--font-display); font-weight:var(--w-display,500); letter-spacing:-.015em; text-wrap:balance; } h1,.display{font-size:var(--t-display);line-height:var(--lh-display)} h2{font-size:var(--t-h2);line-height:var(--lh-h2)} h3{font-size:var(--t-h3);line-height:1.24} p{text-wrap:pretty} ::selection{background:var(--accent);color:var(--on-accent)} :focus-visible{ outline:2px solid var(--accent); outline-offset:3px; } .sr{ position:absolute;width:1px;height:1px;padding:0;margin:-1px; overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0; } .pular{ position:absolute;left:.75rem;top:-4rem;z-index:60; background:var(--paper);color:var(--ink); padding:.7rem 1.1rem;border-radius:var(--r-btn); transition:top .18s var(--ease); } .pular:focus{top:.75rem} .page{width:var(--w-page);margin-inline:auto} .narrow{width:var(--w-narrow);margin-inline:auto} .bleed{width:var(--w-bleed);margin-inline:auto} .prosa{max-width:var(--w-text)} .prosa p + p{margin-top:1em} .prosa a{text-decoration:underline;text-underline-offset:.18em} .eyebrow{ font-family:var(--font-body); font-size:var(--t-eyebrow); letter-spacing:var(--track-eyebrow); color:var(--accent); font-weight:600; margin-bottom:.9rem; } :root[data-eyebrow="caps"] .eyebrow{text-transform:uppercase} .lead{font-size:var(--t-lead);color:var(--muted);line-height:1.5} .mut{color:var(--muted)} /* ── Ações ────────────────────────────────────────────── */ .btn{ display:inline-flex;align-items:center;justify-content:center; gap:.5rem;min-height:2.9rem;padding:.75rem 1.5rem; background:var(--accent);color:var(--on-accent); border-radius:var(--r-btn);font-size:var(--t-small); font-weight:600;letter-spacing:.01em;text-decoration:none; transition:filter .2s var(--ease); } .btn:hover{filter:brightness(1.09)} .btn--linha{ background:none;color:var(--ink); box-shadow:inset 0 0 0 1px var(--line); } .btn--linha:hover{box-shadow:inset 0 0 0 1px var(--accent);filter:none} .link-seta{ display:inline-flex;align-items:center;gap:.5rem; font-size:var(--t-small);font-weight:600;text-decoration:none; padding-bottom:.22rem; border-bottom:1px solid var(--line); transition:border-color .2s var(--ease),gap .2s var(--ease); } .link-seta:hover{border-color:var(--accent);gap:.75rem} .link-seta svg{width:.95em;height:.95em;flex:none} /* ── Cabeçalho ────────────────────────────────────────── */ .topo{ position:sticky;top:0;z-index:40; background:var(--paper); border-bottom:1px solid var(--line); transition:background .3s var(--ease),border-color .3s var(--ease); } .topo__in{ width:var(--w-page);margin-inline:auto; display:flex;align-items:center;gap:1.5rem; min-height:4.6rem; } .marca{ font-family:var(--font-display); font-size:1.06rem;line-height:1.15;font-weight:600; letter-spacing:-.01em;text-decoration:none; margin-right:auto; } .marca img{max-height:2.6rem;width:auto} .nav{display:flex;gap:1.6rem;align-items:center} .nav a{ font-size:var(--t-small);text-decoration:none; padding-block:.35rem;border-bottom:1px solid transparent; } .nav a:hover,.nav a[aria-current]{border-color:currentColor} .topo .btn{min-height:2.5rem;padding:.55rem 1.15rem} /* Header sobreposto ao hero fotográfico da home. */ .topo[data-sobre="1"]{ position:fixed;left:0;right:0; background:transparent;border-bottom-color:transparent; color:#fff; } .topo[data-sobre="1"] .btn{ background:rgb(255 255 255 / .13); color:#fff; backdrop-filter:blur(3px); box-shadow:inset 0 0 0 1px rgb(255 255 255 / .5); } .topo[data-fixo="1"]{ position:fixed;background:var(--paper);color:var(--ink); border-bottom-color:var(--line); box-shadow:0 1px 24px rgb(0 0 0 / .06); } .topo[data-fixo="1"] .btn{ background:var(--accent);color:var(--on-accent); backdrop-filter:none;box-shadow:none; } .menu{display:none} .menu summary{ list-style:none;cursor:pointer; display:flex;align-items:center;gap:.5rem; font-size:var(--t-small);padding:.6rem .2rem; } .menu summary::-webkit-details-marker{display:none} .menu summary::after{ content:"";width:1.1rem;height:1px;background:currentColor; box-shadow:0 5px 0 currentColor,0 -5px 0 currentColor; } .menu[open] summary::after{box-shadow:0 5px 0 currentColor} @media (max-width:60rem){ .nav{display:none} .menu{display:block} .topo__in>.btn{display:none} .marca{font-size:1rem} .topo__in{min-height:3.9rem;gap:1rem} .menu__lista{ position:absolute;left:0;right:0;top:100%; background:var(--paper);color:var(--ink); border-bottom:1px solid var(--line); padding:1rem var(--pad-bleed,1.25rem) 1.75rem; display:grid;gap:.15rem; } .menu__lista a{ text-decoration:none;padding:.7rem 0; border-bottom:1px solid var(--line); } } /* ── Hero ─────────────────────────────────────────────── */ .hero{position:relative;isolation:isolate} .hero__foto{ position:absolute;inset:0;z-index:-1; width:100%;height:100%;object-fit:cover; } .hero__veu{ position:absolute;inset:0;z-index:-1; background:linear-gradient( to bottom, rgb(0 0 0 / .48) 0%, rgb(0 0 0 / .22) 38%, rgb(0 0 0 / .12) 62%, rgb(0 0 0 / .55) 100%); } .hero__txt{max-width:min(100%,34ch)} .hero__txt p{margin-top:1.5rem;max-width:46ch;font-size:var(--t-lead)} .hero[data-layout="full"]{ min-height:clamp(32rem,88svh,54rem); display:flex;align-items:flex-end; color:#fff; padding-block:9rem clamp(6rem,12vh,9rem); } .hero[data-layout="full"] .hero__txt p{color:rgb(255 255 255 / .9)} .hero[data-layout="split"]{ display:grid;grid-template-columns:1fr; align-items:stretch;padding-top:0; } .hero[data-layout="split"] .hero__foto{position:relative;z-index:0} .hero[data-layout="split"] .hero__veu{display:none} .hero[data-layout="split"] .hero__corpo{ display:flex;align-items:center; padding:clamp(3.5rem,9vw,7rem) clamp(1.25rem,5vw,4.5rem); } @media (min-width:60rem){ .hero[data-layout="split"]{ grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); min-height:min(84svh,46rem); } .hero[data-layout="split"] .hero__foto{height:100%} } .hero[data-layout="stage"]{ padding-block:clamp(6rem,14vh,9rem) 0; text-align:left; } .hero[data-layout="stage"] .hero__veu{display:none} .hero[data-layout="stage"] .hero__foto{ position:relative;z-index:0; margin-top:clamp(2.5rem,5vw,4rem); aspect-ratio:16/7;border-radius:var(--r-img); } /* ── Busca de datas ───────────────────────────────────── */ .busca{ background:var(--paper); box-shadow:0 2px 40px rgb(0 0 0 / .1); border-radius:var(--r-img); display:grid;gap:0; grid-template-columns:1fr; } .busca-wrap{ width:var(--w-page);margin-inline:auto; position:relative;z-index:5; } @media (min-width:48rem){ .busca-wrap{margin-top:-3.4rem} .busca{grid-template-columns:repeat(2,1fr) auto} } .busca__campo{ display:flex;flex-direction:column;gap:.3rem; padding:.95rem 1.25rem; border-bottom:1px solid var(--line); } @media (min-width:48rem){ .busca__campo{border-bottom:0;border-right:1px solid var(--line)} } .busca__campo label{ font-size:var(--t-eyebrow);letter-spacing:.08em; color:var(--muted);font-weight:600; } :root[data-eyebrow="caps"] .busca__campo label{text-transform:uppercase} .busca__campo input{ border:0;background:none;padding:0; font-size:var(--t-small);color:var(--ink); min-height:1.6rem;width:100%; } .busca__campo input::-webkit-calendar-picker-indicator{ opacity:.45;cursor:pointer; } .busca .btn{border-radius:0;min-height:100%;padding-inline:1.9rem} @media (max-width:47.99rem){ .busca .btn{border-radius:0 0 var(--r-img) var(--r-img);padding-block:1rem} } /* ── Seções ───────────────────────────────────────────── */ .sec{padding-block:var(--gap-pause)} .sec--tight{padding-block:var(--gap-base)} .sec--breath{padding-block:var(--gap-breath)} .sec--surface{background:var(--surface)} .sec--deep{background:var(--deep);color:var(--paper)} .sec--deep .mut,.sec--deep .lead{color:rgb(255 255 255 / .72)} .sec--deep .eyebrow{color:rgb(255 255 255 / .62)} .sec--deep .link-seta{border-color:rgb(255 255 255 / .3)} .sec__cab{margin-bottom:var(--gap-tight)} .sec__cab h2{max-width:22ch} .sec__cab .lead{margin-top:1rem;max-width:52ch} /* Apresentação: texto e foto em proporção desigual de propósito. */ .intro{display:grid;gap:var(--gap-tight)} @media (min-width:60rem){ .intro{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2.5rem,5vw,5rem);align-items:start} .intro__midia{margin-top:.6rem} } .intro__txt h2{margin-bottom:1.4rem} .intro__txt .prosa p + p{margin-top:1.15em} .intro__acao{margin-top:1.9rem} .intro__midia img{ width:100%;aspect-ratio:4/3;object-fit:cover; border-radius:var(--r-img); } .fatos{ display:grid;gap:1.1rem 2rem;margin-top:2rem; grid-template-columns:repeat(auto-fit,minmax(9rem,1fr)); border-top:1px solid var(--line);padding-top:1.6rem; } .fatos div{display:flex;flex-direction:column-reverse;gap:.2rem} .fatos dt{font-size:var(--t-small);color:var(--muted)} .fatos dd{ font-family:var(--font-display);font-size:1.32rem; line-height:1.15;font-weight:600; } /* Acomodações na home: uma em destaque + as demais em coluna. Evita o grid de 3 colunas iguais (tell #5 da skill). */ .acoms{display:grid;gap:var(--gap-tight)} .acoms__resto{display:grid;gap:1.6rem} @media (min-width:60rem){ .acoms{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:clamp(2rem,4vw,3.5rem);align-items:start} .acoms__resto{display:grid;gap:2.2rem} } .acom{display:grid;gap:1rem} .acom img{ width:100%;object-fit:cover;border-radius:var(--r-img); } @media (min-width:60rem){ [data-itens="poucas"] .acoms{grid-template-columns:1fr} [data-itens="poucas"] .acom--destaque{ grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(2rem,4vw,4rem);align-items:center; } [data-itens="poucas"] .acom--destaque img{aspect-ratio:3/2} } .acom--destaque img{aspect-ratio:5/6} @media (min-width:60rem){.acom--destaque img{aspect-ratio:4/5}} .acom--lista{grid-template-columns:minmax(0,7.5rem) minmax(0,1fr); gap:1.1rem;align-items:start} .acom--lista img{aspect-ratio:1;height:auto;align-self:start} @media (min-width:34rem){ .acom--lista{grid-template-columns:minmax(0,10rem) minmax(0,1fr)} } .acom h3{margin-bottom:.35rem} .acom__meta{ display:flex;flex-wrap:wrap;gap:.4rem 1.1rem; font-size:var(--t-small);color:var(--muted);margin-top:.6rem; } .acom__meta span{display:inline-flex;align-items:center;gap:.35rem} .acom__meta span + span::before{ content:"";width:3px;height:3px;border-radius:50%; background:var(--line);margin-right:.55rem;flex:none; } .acom__acao{margin-top:.9rem} /* Lista completa: alternância de lado cria ritmo (§7.3 skill). */ .acom-linha{ display:grid;gap:1.5rem; padding-block:var(--gap-base); border-top:1px solid var(--line); } .acom-linha:first-child{border-top:0;padding-top:var(--gap-tight)} @media (min-width:56rem){ .acom-linha{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(2rem,4vw,4rem);align-items:center} .acom-linha:nth-child(even) .acom-linha__midia{order:2} } .acom-linha img{ width:100%;aspect-ratio:3/2;object-fit:cover; border-radius:var(--r-img); } .acom-linha h2{font-size:var(--t-h2);margin-bottom:.8rem} .acom-linha .prosa{margin-top:.9rem} .itens{ display:flex;flex-wrap:wrap;gap:.45rem .9rem; font-size:var(--t-small);color:var(--muted);margin-top:1.1rem; } .itens li{display:flex;align-items:center;gap:.45rem} .itens li::before{ content:"";width:4px;height:4px;background:var(--accent); border-radius:50%;flex:none; } /* Experiências: primeira maior, resto menor — sem ícone de enchimento. */ .exps{display:grid;gap:var(--gap-tight)} @media (min-width:60rem){ .exps{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(2rem,4vw,4rem);align-items:start} } .exps__grade{display:grid;gap:1.75rem 1.6rem; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr))} .exps__grade>.exp{max-width:26rem} /* Uma ou duas experiências não sustentam a grade ao lado do título: viram foto solta num vazio. O bloco passa a ser faixa horizontal. */ @media (min-width:60rem){ [data-itens="poucas"] .exps{grid-template-columns:1fr} [data-itens="poucas"] .exps__grade{ grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start;gap:clamp(2rem,4vw,3.5rem); margin-top:var(--gap-tight); } [data-itens="poucas"] .exps__grade>.exp{max-width:none} [data-itens="poucas"] .exp img{aspect-ratio:3/2} [data-itens="poucas"] .exps__grade>.exp:first-child img{aspect-ratio:3/2} [data-itens="poucas"] .exp h3{font-size:var(--t-h3)} [data-itens="poucas"] .exps__grade>.exp:only-child{ display:grid;grid-column:1/-1; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); grid-template-rows:auto auto; column-gap:clamp(1.75rem,3.5vw,3rem); align-content:center; } [data-itens="poucas"] .exps__grade>.exp:only-child img{ grid-column:1;grid-row:1/3;margin-bottom:0;align-self:center} [data-itens="poucas"] .exps__grade>.exp:only-child h3{ grid-column:2;grid-row:1;align-self:end;margin-bottom:.5rem} [data-itens="poucas"] .exps__grade>.exp:only-child p{ grid-column:2;grid-row:2;align-self:start} } .exp img{ width:100%;aspect-ratio:5/4;object-fit:cover; border-radius:var(--r-img);margin-bottom:.95rem; } .exps__grade>.exp:first-child img{aspect-ratio:4/5} .exp h3{font-size:1.06rem;margin-bottom:.35rem} .exp p{font-size:var(--t-small);color:var(--muted);line-height:1.55} /* Galeria: três formatos reais, escolhidos pelo acervo. */ .gal{display:grid;gap:.65rem} .gal img{ width:100%;height:100%;object-fit:cover; border-radius:var(--r-img); } .gal[data-layout="grid"]{ grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); } .gal[data-layout="grid"] figure{aspect-ratio:4/3} .gal[data-layout="sequencia"] figure{aspect-ratio:3/2} @media (min-width:48rem){ .gal[data-layout="sequencia"]{grid-template-columns:repeat(6,1fr)} .gal[data-layout="sequencia"] figure{grid-column:span 3} .gal[data-layout="sequencia"] figure:nth-child(3n+1){ grid-column:span 6;aspect-ratio:16/7} } .gal[data-layout="mosaico"] figure{aspect-ratio:4/3} @media (min-width:48rem){ .gal[data-layout="mosaico"]{ grid-template-columns:repeat(4,1fr); grid-auto-rows:clamp(8rem,13vw,12rem); grid-auto-flow:dense; } .gal[data-layout="mosaico"] figure{ grid-column:span 1;grid-row:span 1;aspect-ratio:auto} .gal[data-layout="mosaico"] figure:nth-child(10n+1), .gal[data-layout="mosaico"] figure:nth-child(10n+8){ grid-column:span 2;grid-row:span 2} } .gal figure{margin:0;overflow:hidden;border-radius:var(--r-img)} /* Localização */ .local{display:grid;gap:var(--gap-tight)} @media (min-width:60rem){ .local{grid-template-columns:minmax(0,1fr) minmax(0,.85fr); gap:clamp(2.5rem,5vw,5rem);align-items:start} } .local__refs{ display:grid;gap:.9rem;margin-top:1.9rem; border-top:1px solid var(--line);padding-top:1.6rem; } .local__refs div{display:grid;gap:.15rem} .local__refs dt{font-weight:600;font-size:var(--t-small)} .local__refs dd{font-size:var(--t-small);color:var(--muted)} .contatos{display:grid;gap:.8rem;font-size:var(--t-small)} .contatos a{ display:inline-flex;align-items:center;gap:.6rem; text-decoration:none;border-bottom:1px solid transparent; } .contatos a:hover{border-color:var(--line)} .endereco{font-style:normal;line-height:1.7;margin-bottom:1.6rem} /* Rodapé */ .rodape{ background:var(--deep);color:var(--paper); padding-block:var(--gap-base) 2.5rem; } .rodape a{color:inherit;text-decoration:none} .rodape a:hover{text-decoration:underline;text-underline-offset:.2em} .rodape__grade{ display:grid;gap:2.5rem; grid-template-columns:repeat(auto-fit,minmax(12rem,1fr)); } .rodape__marca{font-family:var(--font-display);font-size:1.15rem; font-weight:600;margin-bottom:.9rem} .rodape h2{ font-family:var(--font-body);font-size:var(--t-eyebrow); letter-spacing:var(--track-eyebrow);font-weight:600; color:rgb(255 255 255 / .55);margin-bottom:1.1rem; } :root[data-eyebrow="caps"] .rodape h2{text-transform:uppercase} .rodape ul{display:grid;gap:.55rem;font-size:var(--t-small); list-style:none;padding:0;margin:0} .rodape__fim{ margin-top:3rem;padding-top:1.5rem; border-top:1px solid rgb(255 255 255 / .16); display:flex;flex-wrap:wrap;gap:.6rem 1.5rem; justify-content:space-between; font-size:.8rem;color:rgb(255 255 255 / .6); } /* Página de leitura (políticas) */ .leitura{padding-block:var(--gap-base) var(--gap-pause)} .leitura h1{font-size:var(--t-h2);margin-bottom:1.6rem} .leitura .prosa{font-size:var(--t-body)} .leitura .prosa h2{font-size:var(--t-h3);margin:2rem 0 .8rem} .leitura .prosa ul,.leitura .prosa ol{margin:1em 0;padding-left:1.4em} .leitura .prosa li{margin-bottom:.4em} .migalhas{ font-size:var(--t-small);color:var(--muted); display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.6rem; } .migalhas a{text-decoration:none} .migalhas a:hover{text-decoration:underline} .migalhas li + li::before{content:"/";margin-right:.5rem;opacity:.5} .migalhas ol{ display:flex;flex-wrap:wrap;gap:.5rem; padding:0;margin:0;list-style:none; } .aviso{ background:var(--surface);border-left:3px solid var(--accent); padding:1rem 1.25rem;font-size:var(--t-small); margin-top:1.5rem; } /* ── Espaçamentos que eram atributo `style` ──────────────── A CSP do host é `style-src 'self'` sem 'unsafe-inline': todo atributo style era BLOQUEADO em produção, silenciosamente — o espaçamento não aplicava e o console acusava violação em cada página. Descoberto pelo gate de browser, não pelos testes. */ .busca__nota{margin-top:.75rem;font-size:.8rem} .acao-secao{margin-top:1.5rem} .pagina__lead{margin-top:1rem;max-width:52ch} .pagina__lista{margin-top:var(--gap-base)} .pagina__galeria{margin-top:var(--gap-base)} .detalhe__midia{margin-top:var(--gap-tight);margin-bottom:var(--gap-base)} .detalhe__midia img{width:100%} .detalhe__titulo{font-size:var(--t-h2)} .detalhe__resumo{margin-top:.9rem} .detalhe__texto{margin-top:1.4rem} .detalhe__itens{margin-top:1.4rem} .detalhe__acao{margin-top:1.8rem} .detalhe__galeria{margin-top:var(--gap-base)} .local__prosa{margin-top:1.2rem} .local__acao{margin-top:1.4rem} @media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; } }