/* ==========================================================================
   Superfície Genuína — a montra
   A página inicial, o topo das páginas de serviço e as peças de confiança e
   de contacto que aparecem em todo o site. Carrega depois de theme.css.
   ========================================================================== */

:root {
	--sg-noite: #0D0D0C;
	--sg-seccao: clamp(4.25rem, 8vw, 7.5rem);
	--sg-palco-tempo: 4.2s;
}

.sg-inicio { margin-top: 0 !important; }
/* Sem a folga do WordPress entre o cabeçalho e o conteúdo: as páginas que
   abrem com uma faixa escura ficavam com uma risca branca de 20 px por cima. */
.wp-site-blocks > main.sg-principal { margin-block-start: 0; }
/* As secções de largura total encostam umas às outras: a folga entre blocos
   do WordPress deixava riscas brancas entre faixas de cor. */
main.sg-servico > .alignfull, main.sg-principal--inicio > .alignfull { margin-block-start: 0; margin-block-end: 0; }
.sg-inicio > section { position: relative; }
.sg-inicio h2 {
	font-size: clamp(1.875rem, 3.5vw, 3rem); line-height: 1.07;
	letter-spacing: -.032em; font-weight: 600; margin: .35rem 0 0; max-width: 21ch;
}
.sg-inicio .sg-etiqueta { margin: 0; }

/* Interior comum: a mesma coluna do resto do site. */
.sg-contas__grelha, .sg-um__interior, .sg-indice__interior, .sg-iobras__interior,
.sg-passos__interior, .sg-ficha-empresa__interior, .sg-pedido__interior {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter));
	margin-inline: auto; padding-inline: var(--sg-gutter);
}

/* --------------------------------------------------------------------------
   O TOPO — o lema e a obra a acontecer
   -------------------------------------------------------------------------- */

.sg-topo { background: var(--sg-noite); color: #fff; overflow: hidden; }
.sg-topo__grelha {
	display: grid;
	grid-template-columns: max(var(--sg-gutter), calc((100% - var(--sg-max)) / 2)) minmax(0, 1fr) 52%;
	grid-template-rows: 1fr auto;
	grid-template-areas: ". texto palco" ". accoes palco";
	/* Cabe no primeiro ecrã: tira-se o cabeçalho e a barra de confiança. */
	min-height: min(calc(100svh - var(--sg-cabecalho) - 36px), 940px);
}
/* O botão flutuante do WhatsApp sai do caminho enquanto o topo está à vista:
   o topo já tem os seus botões, e o flutuante tapava o fio da obra. */
.sg-whatsapp { transition: opacity .25s ease, transform .25s ease; }
body.sg-topo-a-vista .sg-whatsapp, body.sg-tempo-a-vista .sg-whatsapp { opacity: 0; transform: translateY(12px); pointer-events: none; }
.sg-topo__texto {
	grid-area: texto; align-self: end;
	padding: clamp(3rem, 6vw, 5rem) clamp(2rem, 4.5vw, 4.5rem) 0 0;
}
.sg-topo__accoes { grid-area: accoes; padding: 2rem clamp(2rem, 4.5vw, 4.5rem) clamp(2.5rem, 5vw, 4rem) 0; }

.sg-topo__olho {
	display: flex; align-items: center; gap: .75em; margin: 0 0 1.5rem;
	font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #B9B9B2;
}
.sg-topo__titulo {
	margin: 0; color: #fff;
	font-size: clamp(2.6rem, 5.1vw, 5rem); line-height: .98; letter-spacing: -.045em; font-weight: 700;
}
.sg-topo__titulo span { display: block; color: var(--sg-laranja); }
.sg-topo__lead {
	margin: 1.6rem 0 0; max-width: 40ch;
	font-size: clamp(1.0625rem, 1.25vw, 1.1875rem); line-height: 1.6; color: #C9C9C2;
}
.sg-topo__botoes { display: flex; flex-wrap: wrap; gap: .7rem; }
.sg-botao--grande { padding: 1.1rem 1.6rem !important; font-size: 1.0625rem !important; }
.sg-topo__gratis { margin: .9rem 0 0; font-size: .875rem; color: #9C9C95; }
.sg-topo__selos {
	list-style: none; margin: 2rem 0 0; padding: 1.4rem 0 0; border-top: 1px solid #2A2A27;
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem;
	font-size: .8125rem; line-height: 1.45; color: #A3A39C;
}
.sg-topo__selos strong { display: block; color: #fff; font-family: Outfit, sans-serif; font-size: .9375rem; font-weight: 600; letter-spacing: -.01em; }

/* O palco ----------------------------------------------------------------- */

.sg-palco {
	grid-area: palco; position: relative; margin: 0; min-height: 560px;
	background: #000; overflow: hidden; isolation: isolate; color: #fff;
}
.sg-palco__ecra { position: absolute; inset: 0; }
.sg-palco__quadro {
	position: absolute; inset: 0; opacity: 0;
	transition: opacity .9s cubic-bezier(.4,0,.2,1);
}
.sg-palco__quadro[hidden] { display: none; }
.sg-palco__quadro.is-actual { opacity: 1; z-index: 1; }
.sg-palco__quadro.is-saida { opacity: 0; z-index: 0; }

.sg-encaixe { position: absolute; inset: 0; display: block; overflow: hidden; }
.sg-encaixe picture { display: block; width: 100%; height: 100%; position: relative; }
.sg-encaixe img { width: 100%; height: 100%; object-fit: cover; }
.sg-encaixe.is-inteira img { object-fit: contain; }
.sg-encaixe__fundo {
	position: absolute; inset: -48px; background-size: cover; background-position: center;
	filter: blur(30px) brightness(.5) saturate(1.15);
}
/* Um zoom lento na fotografia que está a passar: dá vida sem distrair. */
@media (prefers-reduced-motion: no-preference) {
	.sg-palco__quadro.is-actual .sg-encaixe.is-enche img { animation: sg-aproxima calc(var(--sg-palco-tempo) + 1.2s) ease-out both; }
}
@keyframes sg-aproxima { from { transform: scale(1.001); } to { transform: scale(1.06); } }

.sg-palco__ecra::before, .sg-palco__ecra::after {
	content: ""; position: absolute; left: 0; right: 0; z-index: 2; pointer-events: none;
}
.sg-palco__ecra::before { top: 0; height: 38%; background: linear-gradient(to bottom, rgba(0,0,0,.78), rgba(0,0,0,.35) 45%, rgba(0,0,0,0)); }
.sg-palco__ecra::after { bottom: 0; height: 42%; background: linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0)); }

.sg-palco__barras {
	position: absolute; z-index: 4; top: 1.1rem; left: 1.25rem; right: 4rem;
	display: flex; gap: 4px;
}
.sg-palco__barra { flex: 1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.28); overflow: hidden; }
.sg-palco__barra i { display: block; height: 100%; width: 0; background: var(--sg-laranja); }
.sg-palco__barra.is-feita i { width: 100%; background: #fff; }
.sg-palco__barra.is-actual i { width: 100%; }
.sg-js .sg-palco__barra.is-actual i { width: 0; animation: sg-enche var(--sg-palco-tempo) linear forwards; }
.sg-palco.is-parado .sg-palco__barra.is-actual i { animation-play-state: paused; }
.sg-palco.is-manual .sg-palco__barra.is-actual i { animation: none; width: 100%; }
@keyframes sg-enche { from { width: 0; } to { width: 100%; } }

.sg-palco__rotulo {
	position: absolute; z-index: 4; top: 2.1rem; left: 1.25rem; right: 1.25rem;
	display: flex; flex-direction: column; gap: .3rem; pointer-events: none;
	text-shadow: 0 1px 12px rgba(0,0,0,.45);
}
.sg-palco__conta { font-family: Outfit, sans-serif; font-weight: 600; font-size: .875rem; letter-spacing: .02em; font-variant-numeric: tabular-nums; color: var(--sg-laranja); }
.sg-palco__conta i { font-style: normal; color: rgba(255,255,255,.6); }
.sg-palco__frente { font-family: Outfit, sans-serif; font-weight: 600; font-size: clamp(1.25rem, 1.9vw, 1.75rem); letter-spacing: -.02em; line-height: 1.15; max-width: 22ch; }

.sg-palco__toque {
	position: absolute; z-index: 3; top: 5rem; bottom: 8.5rem; border: 0; padding: 0;
	background: transparent; cursor: pointer;
}
.sg-palco__toque--ant { left: 0; width: 30%; cursor: w-resize; }
.sg-palco__toque--seg { right: 0; width: 70%; cursor: e-resize; }
.sg-palco__toque:focus-visible { outline: 2px solid var(--sg-laranja); outline-offset: -4px; }

.sg-palco__pausa {
	position: absolute; z-index: 5; top: .55rem; right: .9rem; width: 2.25rem; height: 2.25rem;
	display: grid; place-items: center; border: 0; border-radius: 50%; cursor: pointer;
	background: rgba(0,0,0,.35); color: #fff; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
}
.sg-palco__pausa .pl { display: none; }
.sg-palco.is-parado .sg-palco__pausa .pl { display: block; }
.sg-palco.is-parado .sg-palco__pausa .p1, .sg-palco.is-parado .sg-palco__pausa .p2 { display: none; }
.sg-palco__pausa:not(.sg-js *) { display: none; }

.sg-palco__fio {
	position: absolute; z-index: 4; left: 1.25rem; right: 1.25rem; bottom: 4.6rem;
	display: flex; gap: 6px;
}
.sg-palco__passo {
	position: relative; flex: 1 1 0; max-width: 72px; aspect-ratio: 1; overflow: hidden;
	outline: 2px solid transparent; outline-offset: 1px; opacity: .62;
	transition: opacity .25s ease, outline-color .25s ease;
}
.sg-palco__passo picture, .sg-palco__passo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-palco__passo:hover, .sg-palco__passo:focus-visible { opacity: 1; }
.sg-palco__passo.is-actual { opacity: 1; outline-color: var(--sg-laranja); }

.sg-palco__legenda {
	position: absolute; z-index: 4; left: 1.25rem; right: 1.25rem; bottom: 1.25rem;
	display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem;
	font-size: .875rem; line-height: 1.35;
}
.sg-palco__obra { display: flex; flex-direction: column; min-width: 0; }
.sg-palco__obra strong { font-family: Outfit, sans-serif; font-weight: 600; font-size: 1rem; }
.sg-palco__obra span { color: rgba(255,255,255,.7); }
.sg-palco__legenda .sg-ligacao { color: #fff; }
.sg-palco__legenda .sg-ligacao svg { color: var(--sg-laranja); }

/* --------------------------------------------------------------------------
   NÚMEROS CONTADOS
   -------------------------------------------------------------------------- */

.sg-contas { background: #fff; border-bottom: 1px solid var(--sg-linha); }
.sg-contas__grelha {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem;
	padding-top: clamp(2.5rem, 4.5vw, 3.75rem); padding-bottom: clamp(2.5rem, 4.5vw, 3.75rem);
}
.sg-contas__item { display: flex; flex-direction: column; gap: .55rem; }
.sg-contas__valor {
	font-family: Outfit, sans-serif; font-weight: 700; line-height: .95;
	font-size: clamp(2.5rem, 4.6vw, 4.25rem); letter-spacing: -.045em; font-variant-numeric: tabular-nums;
}
.sg-contas__item:first-child .sg-contas__valor { color: var(--sg-laranja-escuro); }
.sg-contas__texto { font-size: .9375rem; line-height: 1.45; color: var(--sg-cinza); max-width: 26ch; }

/* --------------------------------------------------------------------------
   UM SÓ INTERLOCUTOR
   -------------------------------------------------------------------------- */

.sg-um { background: var(--sg-areia); padding-block: var(--sg-seccao); }
.sg-um__cabeca h2 { max-width: 26ch; }
.sg-um__duas {
	margin-top: clamp(2.25rem, 4vw, 3.5rem);
	display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(1rem, 2vw, 1.5rem);
}
.sg-um__sem, .sg-um__com { padding: clamp(1.6rem, 3vw, 2.6rem); }
.sg-um__sem { border: 1px solid #DCDCD7; color: var(--sg-cinza); }
.sg-um__com { background: var(--sg-preto); color: #fff; }
.sg-um__rotulo {
	margin: 0 0 1.25rem; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}
.sg-um__com .sg-um__rotulo { color: var(--sg-laranja); }
.sg-um__pecas { display: flex; gap: 6px; margin-bottom: 1.6rem; height: 10px; }
.sg-um__pecas i { flex: 1; background: #C9C9C3; }
.sg-um__pecas i:nth-child(2) { background: #B3B3AC; flex: .6; }
.sg-um__pecas i:nth-child(3) { background: #D5D5D0; flex: 1.3; }
.sg-um__pecas i:nth-child(4) { background: #BDBDB6; flex: .8; }
.sg-um__pecas--uma i { background: var(--sg-laranja); }
.sg-um ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1.05rem; }
.sg-um li { position: relative; padding-left: 1.75rem; line-height: 1.5; }
.sg-um__sem li::before { content: ""; position: absolute; left: 0; top: .72em; width: .8rem; height: 2px; background: #B3B3AC; }
.sg-um__com li { color: #C9C9C2; font-size: 1.0625rem; }
.sg-um__com li strong { color: #fff; font-family: Outfit, sans-serif; font-weight: 600; }
.sg-um__com li::before {
	content: ""; position: absolute; left: 0; top: .32em; width: 1.05rem; height: 1.05rem;
	background: var(--sg-laranja);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --------------------------------------------------------------------------
   ÍNDICE DE SERVIÇOS
   -------------------------------------------------------------------------- */

.sg-indice { background: #fff; padding-block: var(--sg-seccao); }
.sg-indice__cabeca {
	display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem 3rem; flex-wrap: wrap;
	margin-bottom: clamp(1.75rem, 3.5vw, 3rem);
}
.sg-indice__lista { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid var(--sg-linha); }
.sg-indice__linha {
	display: grid; align-items: center; gap: 1.5rem;
	grid-template-columns: 3.25rem minmax(0, 1fr) auto 9.5rem 2rem;
	padding: 1.15rem 0; border-top: 1px solid var(--sg-linha); color: var(--sg-preto);
	transition: background-color .25s ease;
}
.sg-indice__n { font-family: Outfit, sans-serif; font-weight: 600; font-size: .875rem; color: var(--sg-cinza-claro); font-variant-numeric: tabular-nums; }
.sg-indice__corpo { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.sg-indice__nome {
	font-family: Outfit, sans-serif; font-weight: 600; letter-spacing: -.03em; line-height: 1.05;
	font-size: clamp(1.4rem, 2.7vw, 2.375rem); transition: color .2s ease;
}
.sg-indice__filhos {
	font-size: .875rem; line-height: 1.45; color: var(--sg-cinza);
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sg-indice__conta { font-size: .8125rem; color: var(--sg-cinza); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sg-indice__foto { display: block; aspect-ratio: 4/3; overflow: hidden; background: var(--sg-areia); }
.sg-indice__foto picture, .sg-indice__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-indice__foto img { filter: saturate(.85); transition: transform .5s cubic-bezier(.2,.7,.3,1), filter .3s ease; }
.sg-indice__seta { color: var(--sg-laranja); transition: transform .25s ease; }
.sg-indice__linha:hover .sg-indice__nome { color: var(--sg-laranja-escuro); }
.sg-indice__linha:hover .sg-indice__seta { transform: translateX(4px); }
.sg-indice__linha:hover .sg-indice__foto img { transform: scale(1.06); filter: none; }

/* --------------------------------------------------------------------------
   OBRAS COM O FIO
   -------------------------------------------------------------------------- */

.sg-iobras { background: var(--sg-noite); color: #fff; padding-block: var(--sg-seccao); }
.sg-iobras h2 { color: #fff; }
.sg-iobras .sg-etiqueta { color: var(--sg-laranja); }
.sg-iobras .sg-ligacao { color: var(--sg-laranja); }
.sg-iobras__nota { margin: 1rem 0 0; max-width: 56ch; color: #A3A39C; font-size: .9375rem; line-height: 1.55; }
.sg-iobras__grelha { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 2.2vw, 2rem); }

.sg-cfio { display: flex; flex-direction: column; min-width: 0; }
.sg-cfio__capa { display: block; aspect-ratio: 4/5; overflow: hidden; background: #1A1A18; }
.sg-cfio__capa picture, .sg-cfio__capa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-cfio__capa img { transition: transform .7s cubic-bezier(.2,.7,.3,1); }
.sg-cfio:hover .sg-cfio__capa img { transform: scale(1.04); }
.sg-cfio__fio { display: flex; gap: 3px; margin-top: 3px; }
.sg-cfio__fio a { position: relative; flex: 1 1 0; aspect-ratio: 1; overflow: hidden; opacity: .7; transition: opacity .2s ease; }
.sg-cfio__fio a:hover, .sg-cfio__fio a:focus-visible { opacity: 1; }
.sg-cfio__fio picture, .sg-cfio__fio img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-cfio__titulo { margin: 1.1rem 0 0; font-size: 1.3125rem; letter-spacing: -.02em; line-height: 1.2; }
.sg-cfio__titulo a { color: #fff; }
.sg-cfio__titulo a:hover { color: var(--sg-laranja); }
.sg-cfio__linha { margin: .4rem 0 0; font-size: .875rem; color: #A3A39C; display: flex; flex-direction: column; gap: .15rem; }
.sg-cfio__linha span { color: #75756F; font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------------
   COMO TRABALHAMOS
   -------------------------------------------------------------------------- */

.sg-passos { background: #fff; padding-block: var(--sg-seccao); }
.sg-passos__lista {
	list-style: none; margin: clamp(2rem, 4vw, 3.25rem) 0 0; padding: 0;
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem;
	position: relative;
}
.sg-passos__lista::before {
	content: ""; position: absolute; left: 0; right: 0; top: 7px; height: 2px;
	background: linear-gradient(to right, var(--sg-laranja), var(--sg-laranja) 75%, var(--sg-linha));
}
.sg-passos__item { position: relative; padding-top: 2.1rem; }
.sg-passos__item::before {
	content: ""; position: absolute; left: 0; top: 0; width: 16px; height: 16px; border-radius: 50%;
	background: #fff; border: 2px solid var(--sg-laranja);
}
.sg-passos__item:last-child::before { background: var(--sg-laranja); }
.sg-passos__n { font-family: Outfit, sans-serif; font-weight: 600; font-size: .875rem; color: var(--sg-laranja-escuro); }
.sg-passos__item h3 { margin: .4rem 0 .55rem; font-size: 1.375rem; }
.sg-passos__item p { margin: 0; color: var(--sg-cinza); line-height: 1.6; max-width: 32ch; }

/* --------------------------------------------------------------------------
   A FICHA DA EMPRESA
   -------------------------------------------------------------------------- */

.sg-ficha-empresa { background: var(--sg-areia); padding-block: var(--sg-seccao); }
.sg-ficha-empresa__interior { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.sg-ficha-empresa__texto p { color: var(--sg-texto); line-height: 1.65; max-width: 50ch; font-size: 1.0625rem; }
.sg-ficha-empresa__texto h2 { margin-bottom: 1.25rem; }
.sg-ficha-empresa__ligacoes { display: flex; flex-wrap: wrap; gap: .75rem 1.75rem; margin-top: 1.5rem; }

.sg-placa {
	position: relative; background: #fff; padding: clamp(1.5rem, 3vw, 2.5rem);
	box-shadow: 0 1px 0 rgba(17,17,17,.04), 0 24px 60px -24px rgba(17,17,17,.22);
	border-top: 4px solid var(--sg-laranja);
}
.sg-placa__topo {
	display: flex; align-items: center; gap: .9rem; padding-bottom: 1.25rem; margin-bottom: .5rem;
	border-bottom: 1px solid var(--sg-linha);
	font-family: Outfit, sans-serif; font-weight: 600; font-size: 1.1875rem; letter-spacing: -.015em;
}
.sg-placa__dados { margin: 0; }
.sg-placa__dados > div {
	display: grid; grid-template-columns: 11.5rem minmax(0, 1fr); gap: 1rem;
	padding: .9rem 0; border-bottom: 1px dashed var(--sg-linha);
}
.sg-placa__dados > div:last-child { border-bottom: 0; padding-bottom: 0; }
.sg-placa__dados dt { font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--sg-cinza); padding-top: .2rem; }
.sg-placa__dados dd { margin: 0; font-family: Outfit, sans-serif; font-weight: 500; font-size: 1.0625rem; color: var(--sg-preto); font-variant-numeric: tabular-nums; }
.sg-placa__dados > div:first-child dd { font-weight: 700; font-size: 1.25rem; letter-spacing: -.01em; }

/* --------------------------------------------------------------------------
   O PEDIDO DE ORÇAMENTO
   -------------------------------------------------------------------------- */

.sg-pedido { background: var(--sg-noite); color: #fff; padding-block: var(--sg-seccao); scroll-margin-top: var(--sg-cabecalho); }
.sg-pedido__interior { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); }
.sg-pedido h2 { color: #fff; font-size: clamp(2.25rem, 4.5vw, 3.75rem); }
.sg-pedido .sg-etiqueta { color: var(--sg-laranja); }
.sg-pedido__texto > p { color: #B9B9B2; line-height: 1.6; max-width: 40ch; margin: 1.25rem 0 0; }
.sg-pedido__vias { list-style: none; margin: 2rem 0 0; padding: 0; border-top: 1px solid #2A2A27; }
.sg-pedido__vias a {
	display: flex; align-items: center; gap: .9rem; padding: 1rem 0; border-bottom: 1px solid #2A2A27;
	color: #fff; font-family: Outfit, sans-serif; font-size: 1.1875rem; font-weight: 500; letter-spacing: -.01em;
}
.sg-pedido__vias a svg { color: var(--sg-laranja); flex-shrink: 0; }
.sg-pedido__vias a:hover { color: var(--sg-laranja); }
.sg-pedido__horario { display: flex; align-items: center; gap: .5rem; margin: 1.25rem 0 0; color: #8E8E88; font-size: .875rem; }
.sg-pedido__horario svg { color: #8E8E88; }

/* --------------------------------------------------------------------------
   FORMULÁRIO: tipo de obra com um toque
   -------------------------------------------------------------------------- */

.sg-form__tipos { display: flex; flex-wrap: wrap; gap: .4rem; margin: -.15rem 0 .35rem; }
.sg-form__tipo {
	font: inherit; font-size: .8125rem; font-weight: 500; cursor: pointer;
	padding: .45rem .8rem; border-radius: 999px; border: 1px solid var(--sg-linha);
	background: #fff; color: var(--sg-preto); transition: border-color .15s ease, background-color .15s ease;
}
.sg-form__tipo:hover { border-color: var(--sg-preto); }
.sg-form__tipo[aria-pressed="true"] { background: var(--sg-preto); border-color: var(--sg-preto); color: #fff; }
.sg-form--escuro .sg-form__tipo { background: transparent; color: #fff; border-color: #3A3A36; }
.sg-form--escuro .sg-form__tipo:hover { border-color: #fff; }
.sg-form--escuro .sg-form__tipo[aria-pressed="true"] { background: var(--sg-laranja); border-color: var(--sg-laranja); color: var(--sg-preto); }
.sg-form__falta { margin: .25rem 0 0; font-size: .875rem; color: var(--sg-laranja-escuro); }
.sg-form--escuro .sg-form__falta { color: var(--sg-laranja); }
.sg-form__ou { font-weight: 400; opacity: .7; }

/* --------------------------------------------------------------------------
   CONFIANÇA NO TOPO DE TODAS AS PÁGINAS (computador)
   -------------------------------------------------------------------------- */

.sg-confianca { background: var(--sg-noite); color: #A3A39C; font-size: .8125rem; line-height: 1; }
.sg-confianca__interior {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin: 0 auto; padding: 0 var(--sg-gutter);
	height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 2rem;
}
.sg-confianca ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 1.5rem; white-space: nowrap; }
.sg-confianca li { display: flex; align-items: center; gap: .45rem; }
.sg-confianca li + li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: #3F3F3B; margin-right: 1.05rem; }
.sg-confianca strong { color: #fff; font-weight: 600; }
.sg-confianca a { color: #fff; font-weight: 600; }
.sg-confianca a:hover { color: var(--sg-laranja); }
.sg-confianca svg { color: var(--sg-laranja); }

/* --------------------------------------------------------------------------
   BARRA DE CONTACTO NO TELEMÓVEL
   -------------------------------------------------------------------------- */

.sg-barra-movel { display: none; }

/* --------------------------------------------------------------------------
   TOPO DAS PÁGINAS DE SERVIÇO
   -------------------------------------------------------------------------- */

.sg-stopo { background: var(--sg-noite); color: #fff; }
.sg-stopo__grelha {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin: 0 auto;
	padding: clamp(2rem, 4.5vw, 3.75rem) var(--sg-gutter) clamp(2.5rem, 5vw, 4rem);
	display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
}
.sg-stopo .sg-caminho { color: #8E8E88; margin-bottom: 1.4rem; }
.sg-stopo h1 {
	margin: 0; color: #fff; font-size: clamp(2.25rem, 4.6vw, 4.25rem); line-height: 1; letter-spacing: -.042em; font-weight: 700;
}
.sg-stopo__lead { margin: 1.25rem 0 0; color: #C9C9C2; font-size: clamp(1.0625rem, 1.25vw, 1.1875rem); line-height: 1.6; max-width: 46ch; }
.sg-stopo__botoes { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.9rem; }
.sg-stopo__provas {
	list-style: none; margin: 1.9rem 0 0; padding: 1.25rem 0 0; border-top: 1px solid #2A2A27;
	display: flex; flex-wrap: wrap; gap: .9rem 1.75rem; font-size: .8125rem; color: #A3A39C; line-height: 1.4;
}
.sg-stopo__provas strong { color: #fff; font-family: Outfit, sans-serif; font-weight: 600; font-size: .9375rem; display: block; }

/* O mosaico: a fotografia principal e a sequência do trabalho ao lado. */
/* overflow escondido: sem ele, uma fotografia muito alta (há-as a 9:20) esticava
   a moldura em vez de caber nela — a proporção da caixa cede ao conteúdo. */
.sg-mosaico { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 6px; aspect-ratio: 7 / 5; overflow: hidden; }
.sg-mosaico--3 { grid-template-rows: repeat(2, minmax(0, 1fr)); }
.sg-mosaico--1 { grid-template-columns: 1fr; grid-template-rows: 1fr; aspect-ratio: 4 / 3; }
.sg-mosaico--2 { grid-template-rows: 1fr; }
.sg-mosaico__foto { position: relative; margin: 0; overflow: hidden; background: #1A1A18; min-height: 0; }
.sg-mosaico__foto:first-child { grid-row: 1 / -1; }
/* Principal deitada: vai em cima, a toda a largura; a sequência fica por baixo. */
.sg-mosaico--deitada { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto; aspect-ratio: auto; }
.sg-mosaico--deitada .sg-mosaico__foto:first-child { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 16 / 10; }
.sg-mosaico--deitada .sg-mosaico__foto:not(:first-child) { aspect-ratio: 1; }
.sg-mosaico--deitada.sg-mosaico--3 { grid-template-columns: 1fr 1fr; }
.sg-mosaico--deitada.sg-mosaico--2 .sg-mosaico__foto:nth-child(2) { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
.sg-mosaico__foto a { display: block; width: 100%; height: 100%; }
.sg-mosaico__foto picture, .sg-mosaico__foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-mosaico__foto img { transition: transform .6s cubic-bezier(.2,.7,.3,1); }
.sg-mosaico__foto:hover img { transform: scale(1.04); }
.sg-mosaico__estado {
	position: absolute; left: .6rem; top: .6rem; z-index: 1;
	font-size: .6875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
	padding: .3rem .55rem; background: rgba(13,13,12,.78); color: #fff; -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
}
.sg-mosaico__estado--depois { background: var(--sg-laranja); color: var(--sg-preto); }
.sg-mosaico__legenda {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 2.5rem .9rem .8rem;
	font-size: .8125rem; line-height: 1.35; color: #fff;
	background: linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0));
}
.sg-mosaico__legenda span { color: rgba(255,255,255,.7); display: block; }
.sg-stopo__mais { margin: .9rem 0 0; font-size: .875rem; color: #A3A39C; }
.sg-stopo__mais a { color: var(--sg-laranja); font-weight: 600; }

/* --------------------------------------------------------------------------
   APARECER AO DESCER (só com JavaScript e só se a pessoa não pediu menos movimento)
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
	.sg-js [data-sg-revela] { opacity: 0; transform: translateY(22px); transition: opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1); }
	.sg-js [data-sg-revela].is-visto { opacity: 1; transform: none; }
}

/* ==========================================================================
   ECRÃS MÉDIOS E TELEMÓVEL
   ========================================================================== */

@media (max-width: 1200px) {
	.sg-topo__selos { grid-template-columns: 1fr 1fr; }
	.sg-topo__selos li:last-child { display: none; }
}
/* A barra de confiança tira o que é opcional antes de se apertar: em inglês
   («Monday to Friday…») não cabia inteira a 1280 px. */
@media (max-width: 1380px) {
	.sg-confianca li.sg-confianca__opcional { display: none; }
}

@media (max-width: 980px) {
	.sg-confianca { display: none; }

	.sg-topo__grelha {
		grid-template-columns: minmax(0, 1fr); grid-template-rows: none;
		grid-template-areas: "texto" "palco" "accoes"; min-height: 0;
	}
	.sg-topo__texto { padding: 2.25rem var(--sg-gutter) 1.75rem; }
	.sg-topo__olho { margin-bottom: 1.1rem; }
	.sg-topo__lead { margin-top: 1.1rem; }
	.sg-topo__accoes { padding: 1.75rem var(--sg-gutter) 2.5rem; }
	.sg-palco { min-height: 0; aspect-ratio: 4 / 5; max-height: 82svh; width: 100%; }

	.sg-contas__grelha { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 1.25rem; }
	.sg-um__duas { grid-template-columns: 1fr; }
	.sg-indice__linha { grid-template-columns: 2.25rem minmax(0, 1fr) 6.5rem; gap: .9rem; }
	.sg-indice__conta, .sg-indice__seta { display: none; }
	.sg-iobras__grelha {
		grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%;
		overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
		margin-inline: calc(var(--sg-gutter) * -1); padding-inline: var(--sg-gutter);
		scroll-padding-inline: var(--sg-gutter);
	}
	.sg-iobras__grelha::-webkit-scrollbar { display: none; }
	.sg-cfio { scroll-snap-align: start; }
	.sg-passos__lista { grid-template-columns: 1fr 1fr; row-gap: 2.5rem; }
	.sg-passos__lista::before { display: none; }
	.sg-ficha-empresa__interior, .sg-pedido__interior { grid-template-columns: 1fr; }

	.sg-stopo__grelha { grid-template-columns: 1fr; }
	.sg-stopo__media { margin-inline: calc(var(--sg-gutter) * -1); }
	.sg-stopo__mais { padding-inline: var(--sg-gutter); }

	/* A barra de contacto: sempre à mão, no fundo do ecrã. */
	.sg-barra-movel {
		display: grid; grid-template-columns: 1fr 1fr 1.35fr; gap: 6px;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 95;
		padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
		background: rgba(255,255,255,.96); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
		border-top: 1px solid var(--sg-linha); box-shadow: 0 -8px 24px rgba(17,17,17,.08);
		transition: transform .3s cubic-bezier(.2,.7,.3,1);
	}
	.sg-barra-movel.is-escondida { transform: translateY(110%); }
	.sg-barra-movel a {
		display: flex; align-items: center; justify-content: center; gap: .45rem;
		min-height: 48px; padding: 0 .5rem; font-weight: 600; font-size: .9375rem;
		border: 1px solid var(--sg-linha); color: var(--sg-preto); background: #fff; border-radius: 2px;
	}
	.sg-barra-movel a.is-orc { background: var(--sg-laranja); border-color: var(--sg-laranja); }
	.sg-barra-movel a.is-wa svg { color: #1FA855; }
	body.sg-tem-barra { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
	body.sg-tem-barra .sg-whatsapp { display: none; }
}

@media (max-width: 640px) {
	.sg-inicio h2 { font-size: clamp(1.75rem, 7.6vw, 2.25rem); }
	.sg-topo__titulo { font-size: clamp(2.45rem, 11.4vw, 3.25rem); }
	.sg-topo__lead { font-size: 1.0625rem; }
	.sg-topo__botoes .sg-botao { flex: 1 1 100%; justify-content: space-between; }
	.sg-topo__selos { grid-template-columns: 1fr 1fr; gap: 1rem; }
	.sg-palco__frente { font-size: 1.1875rem; }
	.sg-palco__fio { bottom: 4.2rem; gap: 4px; }
	.sg-palco__legenda { flex-direction: column; align-items: flex-start; gap: .35rem; bottom: 1rem; }
	/* No telemóvel o fio de miniaturas sai: as barras em cima já dizem onde se
	   está, e eram nove imagens (uns 370 KB) a competir com a primeira. */
	.sg-palco__fio { display: none; }
	.sg-palco__toque { bottom: 10rem; }

	.sg-contas__valor { font-size: 2.6rem; }
	.sg-contas__texto { font-size: .875rem; }
	.sg-indice__n { display: none; }
	.sg-indice__linha { grid-template-columns: minmax(0, 1fr) 5.5rem; padding: 1rem 0; }
	.sg-indice__nome { font-size: 1.375rem; }
	.sg-passos__lista { grid-template-columns: 1fr; padding-left: 1.75rem; }
	.sg-passos__lista::before { display: block; left: 7px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: linear-gradient(to bottom, var(--sg-laranja) 75%, var(--sg-linha)); }
	.sg-passos__item { padding-top: 0; }
	.sg-passos__item::before { left: -1.75rem; top: .15rem; }
	.sg-placa__dados > div { grid-template-columns: 1fr; gap: .25rem; }
	.sg-pedido__vias a { font-size: 1.0625rem; }

	.sg-stopo__botoes .sg-botao { flex: 1 1 100%; justify-content: space-between; }
	.sg-stopo__botoes .sg-botao--contorno-claro, .sg-topo__botoes .sg-botao--contorno-claro { justify-content: center; }
	.sg-mosaico { aspect-ratio: auto; grid-template-columns: 1fr 1fr; grid-template-rows: auto; gap: 4px; }
	.sg-mosaico__foto:first-child { grid-column: 1 / -1; grid-row: auto; aspect-ratio: 4 / 3; }
	.sg-mosaico__foto:not(:first-child) { aspect-ratio: 1; }
	.sg-mosaico__foto:nth-child(4) { display: none; }
	.sg-mosaico--2 .sg-mosaico__foto:not(:first-child) { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
}

/* --------------------------------------------------------------------------
   CABEÇALHO FIXO
   O cabeçalho dizia «sticky» mas não ficava: estava dentro da moldura do
   WordPress (o <header> da parte do modelo), que tem a mesma altura que ele —
   e um elemento sticky não sai da caixa onde está. Fica fixa a moldura; a
   barra de confiança, que vai dentro dela, sai por cima ao descer (top
   negativo) e o cabeçalho fica.
   -------------------------------------------------------------------------- */
header.wp-block-template-part:has(> .sg-cabecalho) { position: sticky; top: -36px; z-index: 90; }
header.wp-block-template-part > .sg-cabecalho { position: relative; top: auto; }
@media (max-width: 980px) {
	header.wp-block-template-part:has(> .sg-cabecalho) { top: 0; }
}

/* --------------------------------------------------------------------------
   O FILME DA OBRA
   Todas as fotografias de uma obra, pela ordem em que foi feita, a seis por
   segundo. Abre por cima da página, em fundo negro, como um filme.
   -------------------------------------------------------------------------- */

.sg-filme-botao {
	display: inline-flex; align-items: center; gap: .6rem; cursor: pointer;
	font: inherit; font-size: .875rem; font-weight: 600; line-height: 1;
	padding: .55rem .9rem .55rem .55rem; border-radius: 999px; border: 0;
	background: rgba(255,255,255,.14); color: #fff; -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
	transition: background-color .2s ease, transform .2s ease;
}
.sg-filme-botao:hover { background: rgba(255,255,255,.24); }
.sg-filme-botao__play {
	display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%;
	background: var(--sg-laranja); color: var(--sg-preto); flex-shrink: 0;
	box-shadow: 0 0 0 0 rgba(255,102,0,.55); animation: sg-pulsa 2.4s ease-out infinite;
}
.sg-filme-botao__play svg { margin-left: 2px; }
@keyframes sg-pulsa { 0% { box-shadow: 0 0 0 0 rgba(255,102,0,.55); } 70% { box-shadow: 0 0 0 12px rgba(255,102,0,0); } 100% { box-shadow: 0 0 0 0 rgba(255,102,0,0); } }
@media (prefers-reduced-motion: reduce) { .sg-filme-botao__play { animation: none; } }

.sg-filme-botao--palco { position: absolute; z-index: 5; right: 1.25rem; top: 4.4rem; }
.sg-filme-linha { margin: -.6rem 0 1.4rem; }
.sg-filme-botao--claro { background: var(--sg-preto); color: #fff; }
.sg-filme-botao--claro:hover { background: var(--sg-preto-suave); }

html.sg-filme-aberto, html.sg-filme-aberto body { overflow: hidden; }
.sg-filme {
	position: fixed; inset: 0; z-index: 1000; background: #050505; color: #fff;
	display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
	animation: sg-filme-entra .35s ease-out;
}
.sg-filme[hidden] { display: none; }
@keyframes sg-filme-entra { from { opacity: 0; } to { opacity: 1; } }
.sg-filme__topo {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: max(1rem, env(safe-area-inset-top)) clamp(1rem, 3vw, 2rem) .75rem;
}
.sg-filme__obra { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.sg-filme__obra strong { font-family: Outfit, sans-serif; font-size: 1.0625rem; font-weight: 600; }
.sg-filme__obra span { font-size: .8125rem; color: rgba(255,255,255,.6); }
.sg-filme__fechar {
	width: 2.75rem; height: 2.75rem; display: grid; place-items: center; flex-shrink: 0;
	border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: transparent; color: #fff; cursor: pointer;
}
.sg-filme__fechar:hover { background: rgba(255,255,255,.1); }

.sg-filme__palco { position: relative; min-height: 0; overflow: hidden; }
.sg-filme__img {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
	opacity: 0; transition: opacity 110ms linear;
}
.sg-filme__img.is-on { opacity: 1; }
.sg-filme__carregar {
	position: absolute; left: 50%; bottom: 1rem; transform: translateX(-50%); z-index: 2;
	display: flex; align-items: center; gap: .6rem; padding: .5rem .9rem; border-radius: 999px;
	background: rgba(0,0,0,.6); font-size: .8125rem; color: rgba(255,255,255,.85);
}
.sg-filme__carregar[hidden] { display: none; }
.sg-filme__carregar span { width: .9rem; height: .9rem; border-radius: 50%; border: 2px solid rgba(255,255,255,.25); border-top-color: var(--sg-laranja); animation: sg-roda .8s linear infinite; }
@keyframes sg-roda { to { transform: rotate(360deg); } }
.sg-filme__fim {
	position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 1.25rem; padding: 1.5rem; text-align: center; background: rgba(5,5,5,.72); -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
}
.sg-filme__fim[hidden] { display: none; }
.sg-filme__fim p { margin: 0; max-width: 24ch; font-family: Outfit, sans-serif; font-weight: 600; font-size: clamp(1.5rem, 3vw, 2.25rem); line-height: 1.15; letter-spacing: -.02em; }
.sg-filme__fim-botoes { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; align-items: center; }
.sg-filme__denovo { background: none; border: 0; color: rgba(255,255,255,.7); font: inherit; font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; padding: .5rem; }

.sg-filme__baixo {
	display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "info controlos" "linha linha";
	gap: .75rem 1rem; align-items: center;
	padding: .9rem clamp(1rem, 3vw, 2rem) max(1.1rem, env(safe-area-inset-bottom));
}
.sg-filme__info { grid-area: info; display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.sg-filme__frente { font-family: Outfit, sans-serif; font-weight: 600; font-size: clamp(1.0625rem, 2vw, 1.375rem); letter-spacing: -.015em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sg-filme__conta { font-size: .8125rem; color: rgba(255,255,255,.55); font-variant-numeric: tabular-nums; }
.sg-filme__controlos { grid-area: controlos; display: flex; gap: .5rem; }
.sg-filme__btn {
	width: 2.9rem; height: 2.9rem; display: grid; place-items: center; cursor: pointer;
	border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: transparent; color: #fff;
}
.sg-filme__btn:hover { background: rgba(255,255,255,.1); }
.sg-filme__btn--tocar { background: var(--sg-laranja); border-color: var(--sg-laranja); color: var(--sg-preto); }
.sg-filme__btn--tocar:hover { background: #ff7a22; }
.sg-filme__linha { grid-area: linha; position: relative; height: 26px; cursor: pointer; touch-action: none; }
.sg-filme__frentes { position: absolute; left: 0; right: 0; top: 10px; height: 6px; display: flex; gap: 3px; }
.sg-filme__seg { display: block; flex-basis: 0; background: rgba(255,255,255,.2); border-radius: 2px; transition: background-color .2s ease; }
.sg-filme__seg.is-feita { background: rgba(255,255,255,.55); }
.sg-filme__seg.is-actual { background: var(--sg-laranja); }
.sg-filme__cabeca {
	position: absolute; top: 4px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%;
	background: #fff; box-shadow: 0 0 0 4px rgba(255,102,0,.35); pointer-events: none;
}
.sg-filme__linha:focus-visible { outline: 2px solid var(--sg-laranja); outline-offset: 4px; border-radius: 4px; }

@media (max-width: 640px) {
	.sg-filme-botao--palco { top: auto; bottom: 5.2rem; right: auto; left: 1.25rem; font-size: .8125rem; }
	.sg-filme__btn { width: 2.6rem; height: 2.6rem; }
}

/* --------------------------------------------------------------------------
   EM OBRA AGORA e CONFIRMAR NO IMPIC
   -------------------------------------------------------------------------- */
.sg-agora {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin: 0 auto; padding: 1.1rem var(--sg-gutter) 0;
	display: flex; align-items: center; flex-wrap: wrap; gap: .35rem .55rem; font-size: .9375rem; color: var(--sg-cinza);
}
.sg-agora strong { color: var(--sg-preto); font-weight: 600; }
.sg-agora a { color: var(--sg-preto); text-decoration: underline; text-decoration-color: var(--sg-linha); text-underline-offset: 3px; }
.sg-agora a:hover { color: var(--sg-laranja-escuro); text-decoration-color: currentColor; }
.sg-agora__ponto { position: relative; width: 10px; height: 10px; border-radius: 50%; background: #1FA855; flex-shrink: 0; }
.sg-agora__ponto::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #1FA855; opacity: .5; animation: sg-agora 2s ease-out infinite; }
@keyframes sg-agora { from { transform: scale(.6); opacity: .7; } to { transform: scale(1.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .sg-agora__ponto::after { animation: none; } }
.sg-placa__confirmar { margin: 1.25rem 0 0; padding-top: 1.1rem; border-top: 1px solid var(--sg-linha); font-size: .8125rem; line-height: 1.5; color: var(--sg-cinza); }
.sg-placa__confirmar a { display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; font-weight: 600; color: var(--sg-laranja-escuro); }

/* --------------------------------------------------------------------------
   O MAPA DAS OBRAS — desenhado como uma planta: traço fino, papel quadriculado
   -------------------------------------------------------------------------- */
.sg-mapa { background: var(--sg-areia); padding-block: var(--sg-seccao); }
.sg-mapa__interior {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin-inline: auto; padding-inline: var(--sg-gutter);
	display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
}
.sg-mapa__nota { margin: 1rem 0 0; color: var(--sg-cinza); line-height: 1.6; max-width: 44ch; }
.sg-mapa__lista { list-style: none; margin: 1.75rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; max-width: 26rem; }
.sg-mapa__lista li { display: grid; grid-template-columns: 7rem minmax(0, 1fr) 2rem; align-items: center; gap: .75rem; font-size: .9375rem; }
.sg-mapa__lista b { font-family: Outfit, sans-serif; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.sg-mapa__barra { display: block; height: 6px; background: linear-gradient(to right, var(--sg-laranja) var(--n), #E2E1DB var(--n)); border-radius: 3px; }
.sg-mapa__desenho { margin: 0; color: #C9C8C0; }
.sg-mapa__desenho svg { display: block; width: 100%; height: auto; max-height: 78vh; overflow: hidden; }
.sg-mapa__mar { color: #CFCEC6; }
.sg-mapa__concelho { fill: #FBFBF9; stroke: #B9B8B0; stroke-width: .9; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: fill .2s ease; }
.sg-mapa__concelho.is-com-obra { fill: #fff; stroke: #8F8E86; }
.sg-mapa__concelho:hover { fill: #FFF3EA; }
.sg-mapa__sede rect { fill: var(--sg-preto); }
.sg-mapa__sede text { font: 600 11px Outfit, sans-serif; fill: var(--sg-preto); }
.sg-mapa__ponto { cursor: pointer; }
.sg-mapa__ponto > circle:not(.sg-mapa__halo) { fill: var(--sg-laranja); stroke: #fff; stroke-width: 2; vector-effect: non-scaling-stroke; transition: transform .2s ease; }
.sg-mapa__halo { fill: rgba(255,102,0,.18); opacity: 0; transition: opacity .2s ease; }
.sg-mapa__ponto > text { font: 700 8px Outfit, sans-serif; fill: var(--sg-preto); pointer-events: none; }
.sg-mapa__rotulo { opacity: 0; transition: opacity .15s ease; pointer-events: none; }
.sg-mapa__rotulo text { font: 600 12px Outfit, sans-serif; fill: var(--sg-preto); paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; }
.sg-mapa__ponto:hover .sg-mapa__halo, .sg-mapa__ponto:focus-visible .sg-mapa__halo { opacity: 1; }
.sg-mapa__ponto:hover .sg-mapa__rotulo, .sg-mapa__ponto:focus-visible .sg-mapa__rotulo { opacity: 1; }
.sg-mapa__ponto:focus-visible { outline: none; }
@media (prefers-reduced-motion: no-preference) {
	.sg-js .sg-mapa__ponto > circle:not(.sg-mapa__halo) { transform: scale(0); transform-box: fill-box; transform-origin: center; }
	.sg-js .sg-mapa.is-visto .sg-mapa__ponto > circle:not(.sg-mapa__halo) { transform: scale(1); transition: transform .5s cubic-bezier(.3,1.6,.5,1) calc(var(--i, 0) * 40ms); }
}
@media (max-width: 980px) {
	.sg-mapa__interior { grid-template-columns: 1fr; }
	.sg-mapa__desenho { order: -1; margin-inline: calc(var(--sg-gutter) * -.5); }
}

/* --------------------------------------------------------------------------
   SETE PERGUNTAS A FAZER A QUALQUER EMPREITEIRO
   -------------------------------------------------------------------------- */
.sg-perguntas { background: var(--sg-noite); color: #fff; padding-block: var(--sg-seccao); }
.sg-perguntas__interior {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin-inline: auto; padding-inline: var(--sg-gutter);
	display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start;
}
.sg-perguntas__cabeca { position: sticky; top: calc(var(--sg-cabecalho) + 2rem); }
.sg-perguntas h2 { color: #fff; }
.sg-perguntas .sg-etiqueta { color: var(--sg-laranja); }
.sg-perguntas__cabeca > p:not(.sg-etiqueta) { color: #B9B9B2; line-height: 1.6; margin: 1.1rem 0 1.6rem; max-width: 42ch; }
.sg-perguntas__imprimir.sg-botao--contorno { color: #fff; border-color: rgba(255,255,255,.35); }
.sg-perguntas__imprimir.sg-botao--contorno:hover { background: #fff; color: var(--sg-preto); }
.sg-perguntas__lista { list-style: none; margin: 0; padding: 0; counter-reset: p; border-top: 1px solid #2A2A27; }
.sg-perguntas__lista li {
	display: grid; grid-template-columns: 2.75rem minmax(0, 1fr) minmax(0, 1.15fr); gap: .5rem 1.5rem;
	padding: 1.4rem 0; border-bottom: 1px solid #2A2A27;
}
.sg-perguntas__n { font-family: Outfit, sans-serif; font-weight: 600; font-size: .875rem; color: var(--sg-laranja); padding-top: .2rem; font-variant-numeric: tabular-nums; }
.sg-perguntas__p { margin: 0; font-family: Outfit, sans-serif; font-weight: 600; font-size: 1.1875rem; line-height: 1.3; letter-spacing: -.015em; }
.sg-perguntas__r { margin: 0; color: #C9C9C2; line-height: 1.55; font-size: .9375rem; }
.sg-perguntas__nos { display: block; font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #75756F; margin-bottom: .25rem; }
.sg-perguntas__r a { display: inline-block; margin-top: .35rem; color: var(--sg-laranja); font-weight: 600; }
.sg-perguntas__caixa, .sg-perguntas__rodape { display: none; }
@media (max-width: 980px) {
	.sg-perguntas__interior { grid-template-columns: 1fr; }
	.sg-perguntas__cabeca { position: static; }
	.sg-perguntas__lista li { grid-template-columns: 2.25rem minmax(0, 1fr); }
	.sg-perguntas__r { grid-column: 2; }
}

/* A lista impressa: só ela, a preto e branco, com uma caixa para assinalar
   ao lado de cada pergunta — para levar aos outros orçamentos. */
@media print {
	html.sg-imprimir body * { visibility: hidden !important; }
	html.sg-imprimir .sg-perguntas, html.sg-imprimir .sg-perguntas * { visibility: visible !important; }
	html.sg-imprimir .sg-perguntas { position: absolute; left: 0; top: 0; width: 100%; background: #fff !important; color: #000 !important; padding: 0 !important; }
	html.sg-imprimir .sg-perguntas__interior { display: block; padding: 0; max-width: none; }
	html.sg-imprimir .sg-perguntas__cabeca { position: static; }
	html.sg-imprimir .sg-perguntas h2, html.sg-imprimir .sg-perguntas__p { color: #000 !important; }
	html.sg-imprimir .sg-perguntas__cabeca > p, html.sg-imprimir .sg-perguntas__r { color: #333 !important; }
	html.sg-imprimir .sg-perguntas__imprimir { display: none !important; }
	html.sg-imprimir .sg-perguntas__lista { border-color: #999; margin-top: 1rem; }
	html.sg-imprimir .sg-perguntas__lista li { grid-template-columns: 1.8rem 1fr 1.2fr 1.6rem; border-color: #bbb; padding: .7rem 0; break-inside: avoid; }
	html.sg-imprimir .sg-perguntas__caixa { display: block; width: 1.1rem; height: 1.1rem; border: 1.5px solid #000; }
	html.sg-imprimir .sg-perguntas__rodape { display: block; margin-top: 1rem; font-size: 9pt; color: #555 !important; }
	html.sg-imprimir .sg-perguntas__r a { color: #000 !important; }
	html.sg-imprimir .sg-perguntas__r a[href^="http"]::after { content: " (" attr(href) ")"; font-weight: 400; font-size: 8pt; word-break: break-all; }
}

/* Fotografias do espaço, no formulário */
.sg-form__fotos { display: flex; flex-direction: column; gap: .45rem; }
.sg-form__largar {
	position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-areas: "ic t" "ic a"; gap: .1rem .85rem; align-items: center;
	padding: 1rem 1.1rem; border: 1.5px dashed var(--sg-linha); cursor: pointer; transition: border-color .2s ease, background-color .2s ease;
}
.sg-form__largar:hover, .sg-form__largar:focus-within { border-color: var(--sg-laranja); }
.sg-form__largar input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.sg-form__largar svg { grid-area: ic; color: var(--sg-laranja); }
.sg-form__largar-texto { grid-area: t; font-weight: 600; }
.sg-form__largar-ajuda { grid-area: a; font-size: .8125rem; color: var(--sg-cinza); }
.sg-form--escuro .sg-form__largar { border-color: #3A3A36; }
.sg-form--escuro .sg-form__largar-ajuda { color: #8E8E88; }
.sg-form__miniaturas { display: flex; flex-wrap: wrap; gap: .4rem; }
.sg-form__miniaturas:empty { display: none; }
.sg-form__miniaturas span { width: 64px; height: 64px; overflow: hidden; display: grid; place-items: center; background: #2A2A27; color: #fff; font-size: .6875rem; font-weight: 600; }
.sg-form__miniaturas img { width: 100%; height: 100%; object-fit: cover; }

/* Topo de cada obra: os factos e o filme */
.sg-obra-topo-extra { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid #2A2A27; }
.sg-obra-factos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; color: #A3A39C; font-size: .875rem; }
.sg-obra-factos b { color: #fff; font-family: Outfit, sans-serif; font-weight: 600; font-size: 1.125rem; margin-right: .2rem; font-variant-numeric: tabular-nums; }
.sg-obra-topo-extra .sg-filme-botao { margin-left: auto; }
@media (max-width: 640px) { .sg-obra-topo-extra .sg-filme-botao { margin-left: 0; } }

/* --------------------------------------------------------------------------
   PROJETO 3D ↔ OBRA FEITA
   -------------------------------------------------------------------------- */
.sg-tres { background: #fff; padding-block: var(--sg-seccao); }
.sg-tres__interior {
	max-width: calc(var(--sg-max) + 2 * var(--sg-gutter)); margin-inline: auto; padding-inline: var(--sg-gutter);
	display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
}
.sg-tres__texto p:not(.sg-etiqueta) { color: var(--sg-texto); line-height: 1.65; margin: 1.1rem 0 1.4rem; max-width: 44ch; }
.sg-comparador--3d .sg-comparador__palco { aspect-ratio: 4 / 3; cursor: ew-resize; }
.sg-comparador--3d picture { display: block; width: 100%; height: 100%; }
.sg-comparador--3d .sg-comparador__etiqueta--antes { background: var(--sg-preto); color: #fff; }
.sg-comparador--3d .sg-comparador__etiqueta--depois { background: var(--sg-laranja); color: var(--sg-preto); }
.sg-obra-3d { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 3rem; }
.sg-obra-3d .sg-comparador__palco { aspect-ratio: 16 / 10; max-height: 76vh; }
@media (max-width: 980px) { .sg-tres__interior { grid-template-columns: 1fr; } .sg-tres__comparador { margin-inline: calc(var(--sg-gutter) * -1); } }

/* --------------------------------------------------------------------------
   AVISO DE COOKIES — pequeno, num canto, sem tapar nada
   -------------------------------------------------------------------------- */
.sg-cookies {
	position: fixed; left: 1rem; bottom: 1rem; z-index: 96; width: min(23rem, calc(100vw - 2rem));
	display: flex; flex-direction: column; gap: .75rem; padding: 1rem 1.1rem;
	background: rgba(17,17,17,.94); color: #E6E6E1; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
	font-size: .8125rem; line-height: 1.5; border-radius: 4px; box-shadow: 0 12px 36px rgba(0,0,0,.22);
	opacity: 0; transform: translateY(10px); transition: opacity .3s ease, transform .3s ease;
}
.sg-cookies[hidden] { display: none; }
.sg-cookies.is-visivel { opacity: 1; transform: none; }
.sg-cookies p { margin: 0; }
.sg-cookies a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.sg-cookies__botoes { display: flex; gap: .5rem; justify-content: flex-end; }
.sg-cookies button { font: inherit; font-weight: 600; cursor: pointer; padding: .5rem .95rem; border-radius: 2px; border: 1px solid rgba(255,255,255,.28); background: transparent; color: #fff; }
.sg-cookies button:hover { border-color: #fff; }
.sg-cookies .sg-cookies__sim { background: var(--sg-laranja); border-color: var(--sg-laranja); color: var(--sg-preto); }
.sg-cookies .sg-cookies__sim:hover { background: #fff; border-color: #fff; }
@media (max-width: 980px) {
	/* No telemóvel fica por cima da barra de contacto, sem a tapar. */
	body.sg-tem-barra .sg-cookies { bottom: calc(72px + env(safe-area-inset-bottom)); left: .5rem; width: calc(100vw - 1rem); flex-direction: row; align-items: center; padding: .7rem .8rem; }
	body.sg-tem-barra .sg-cookies p { flex: 1; }
	body.sg-tem-barra .sg-cookies__botoes { flex-shrink: 0; }
}

/* --------------------------------------------------------------------------
   MUDAR DE PÁGINA SEM PISCAR
   O browser faz uma transição suave entre páginas do site, e o cabeçalho
   fica quieto no sítio — parece uma aplicação, não um site a recarregar.
   Onde o browser não sabe fazer isto, nada muda.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
	@view-transition { navigation: auto; }
	.sg-cabecalho { view-transition-name: sg-cabecalho; }
	.sg-confianca { view-transition-name: sg-confianca; }
	::view-transition-old(root) { animation: 160ms ease-out both sg-vt-sai; }
	::view-transition-new(root) { animation: 260ms cubic-bezier(.2,.7,.3,1) both sg-vt-entra; }
}
@keyframes sg-vt-sai { to { opacity: 0; } }
@keyframes sg-vt-entra { from { opacity: 0; transform: translateY(8px); } }

/* --------------------------------------------------------------------------
   HISTÓRIAS DAS OBRAS (o topo da página inicial)
   Uma fila de círculos, um por obra, como nas redes sociais. O da obra que
   está a passar tem o anel laranja; os já vistos ficam apagados.
   -------------------------------------------------------------------------- */
.sg-palco__barras[hidden], .sg-palco__legenda-obra[hidden] { display: none; }
.sg-palco__historias {
	position: absolute; z-index: 4; left: 1.25rem; right: 1.25rem; bottom: 4.7rem;
	display: flex; gap: .8rem; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 0;
	-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
	mask-image: linear-gradient(to right, #000 calc(100% - 28px), transparent);
}
.sg-palco__historias::-webkit-scrollbar { display: none; }
.sg-palco__historia {
	flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: .3rem;
	background: none; border: 0; padding: 0; color: #fff; cursor: pointer; font: inherit;
}
.sg-palco__avatar {
	display: block; width: 54px; height: 54px; border-radius: 50%; padding: 2.5px;
	background: linear-gradient(135deg, rgba(255,255,255,.75), rgba(255,255,255,.35));
	transition: transform .2s ease, background .2s ease;
}
.sg-palco__avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid #0D0D0C; background: #2A2A27; display: block; }
.sg-palco__historia.is-vista .sg-palco__avatar { background: rgba(255,255,255,.22); }
.sg-palco__historia.is-actual .sg-palco__avatar { background: conic-gradient(from 200deg, var(--sg-laranja), #FFB067, var(--sg-laranja)); transform: scale(1.06); }
.sg-palco__historia:hover .sg-palco__avatar { transform: scale(1.08); }
.sg-palco__historia:focus-visible { outline: none; }
.sg-palco__historia:focus-visible .sg-palco__avatar { box-shadow: 0 0 0 3px #fff; }
.sg-palco__nome { font-family: Outfit, sans-serif; font-size: .6875rem; font-weight: 600; letter-spacing: .01em; max-width: 4.5rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 1px 8px rgba(0,0,0,.6); opacity: .85; }
.sg-palco__historia.is-actual .sg-palco__nome { opacity: 1; }
.sg-palco__legenda { display: block; }
.sg-palco__legenda-obra { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; }
@media (max-width: 640px) {
	.sg-palco__historias { left: 1rem; right: 0; bottom: 5.6rem; gap: .65rem; }
	.sg-palco__avatar { width: 50px; height: 50px; }
	.sg-palco__legenda-obra { flex-direction: column; align-items: flex-start; gap: .3rem; }
	.sg-palco__toque { bottom: 11.5rem; }
}

/* «Desça, e a obra acontece» dentro da página de cada obra: continua a
   faixa escura do topo, de ponta a ponta do ecrã. */
/* !important: a moldura «constrained» do WordPress força margens automáticas
   e largura máxima em tudo o que está dentro dela. */

/* --------------------------------------------------------------------------
   A OBRA CONTADA
   -------------------------------------------------------------------------- */
.sg-contada__pedido { margin: 0 0 .5rem !important; }
.sg-contada { margin-top: clamp(2rem, 4vw, 3rem); padding-top: clamp(1.75rem, 3vw, 2.5rem); border-top: 1px solid #DCDCD7; }
.sg-contada__titulo { margin: 0 0 1.5rem; font-size: var(--wp--preset--font-size--titulo-3); }
.sg-contada__par { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem; }
.sg-contada__bloco { background: #fff; padding: clamp(1.25rem, 2.5vw, 1.75rem); }
.sg-contada__bloco p:not(.sg-olho) { margin: .4rem 0 0; line-height: 1.6; color: var(--sg-texto); }
.sg-contada__bloco--solucao { background: var(--sg-preto); }
.sg-contada__bloco--solucao p:not(.sg-olho) { color: #E6E6E1; }
.sg-contada__bloco--solucao .sg-olho { color: var(--sg-laranja); }
.sg-contada__baixo { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1rem; }
.sg-contada__lado { display: flex; flex-direction: column; gap: 1rem; }
.sg-contada__passos { list-style: none; margin: .6rem 0 0; padding: 0; counter-reset: passo; }
.sg-contada__passos li { counter-increment: passo; border-top: 1px solid var(--sg-linha); }
.sg-contada__passos li:first-child { border-top: 0; }
.sg-contada__passos a { display: grid; grid-template-columns: 2rem 1fr auto; align-items: baseline; gap: .5rem; padding: .6rem 0; color: var(--sg-preto); }
.sg-contada__passos a::before { content: counter(passo, decimal-leading-zero); font-family: Outfit, sans-serif; font-weight: 600; font-size: .8125rem; color: var(--sg-laranja-escuro); }
.sg-contada__passos a span { font-weight: 500; }
.sg-contada__passos a b { font-weight: 400; font-size: .8125rem; color: var(--sg-cinza); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sg-contada__passos a:hover span { color: var(--sg-laranja-escuro); }
.sg-contada__materiais { list-style: none; margin: .6rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.sg-contada__materiais li { font-size: .8125rem; padding: .35rem .7rem; border: 1px solid var(--sg-linha); border-radius: 999px; }
.sg-contada__duracao { font-family: Outfit, sans-serif; font-size: 1.5rem; font-weight: 600; color: var(--sg-preto) !important; }
@media (max-width: 780px) { .sg-contada__par, .sg-contada__baixo { grid-template-columns: 1fr; } }


/* --------------------------------------------------------------------------
   O VISOR DA OBRA — a obra frente a frente, fotografia a fotografia
   Quem manda é a pessoa: setas, toque, deslizar, teclado. As frentes são
   capítulos; as miniaturas dizem onde se está. O texto da obra vive aqui.
   -------------------------------------------------------------------------- */
.sg-visor {
	margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; max-width: none !important; width: 100vw;
	margin-top: 2rem; margin-bottom: calc(-1 * var(--wp--preset--spacing--50, 2.5rem));
	background: #0B0B0A; color: #fff; padding: clamp(1.75rem, 3.5vw, 3rem) 0 clamp(2rem, 4vw, 3.25rem);
	border-top: 1px solid #2A2A27;
}
.sg-visor__interior { width: min(100% - 2 * var(--sg-gutter), 1328px); margin-inline: auto; }
.sg-visor__cab { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; margin-bottom: 1.4rem; }
.sg-visor__cab .sg-olho { color: var(--sg-laranja); margin: 0 0 .5rem; }
.sg-visor__titulo { margin: 0 !important; font-size: clamp(1.25rem, 2.2vw, 1.75rem) !important; line-height: 1.2 !important; letter-spacing: -.02em; max-width: 32ch !important; color: #fff; }
.sg-visor__accoes { display: flex; gap: .5rem; flex-wrap: wrap; }
.sg-visor__accao {
	display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border-radius: 999px;
	background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); color: #fff;
	font: 600 .875rem/1 var(--wp--preset--font-family--texto, sans-serif); cursor: pointer; transition: background .2s ease, border-color .2s ease;
}
.sg-visor__accao { text-decoration: none; white-space: nowrap; }
.sg-visor__accao:hover, .sg-visor__accao:focus-visible { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.3); }

.sg-visor__corpo { display: grid; grid-template-columns: minmax(0, 1fr) clamp(18rem, 26vw, 23rem); gap: clamp(1.25rem, 2.5vw, 2.25rem); align-items: stretch; }
.sg-visor__palco {
	position: relative; height: clamp(420px, calc(100svh - var(--sg-cabecalho) - 15rem), 720px); background: #151513;
	display: grid; place-items: center; overflow: hidden; cursor: pointer; outline-offset: 4px; -webkit-tap-highlight-color: transparent;
	user-select: none; -webkit-user-select: none;
}
.sg-visor__palco:focus-visible { outline: 2px solid var(--sg-laranja); }
.sg-visor__img { width: 100%; height: 100%; object-fit: contain; display: block; }
.sg-visor__seta {
	position: absolute; top: 50%; transform: translateY(-50%); width: 3.25rem; height: 3.25rem; border-radius: 50%;
	display: grid; place-items: center; border: 0; cursor: pointer; color: #111; background: rgba(255,255,255,.92);
	box-shadow: 0 8px 24px rgba(0,0,0,.35); transition: background .2s ease, transform .2s ease, opacity .2s ease;
}
.sg-visor__seta--ant { left: 1rem; }
.sg-visor__seta--seg { right: 1rem; }
.sg-visor__seta:hover { background: var(--sg-laranja); color: #fff; }
.sg-visor__seta:active { transform: translateY(-50%) scale(.94); }
.sg-visor__conta {
	position: absolute; left: 1rem; bottom: 1rem; padding: .35rem .65rem; border-radius: 999px; background: rgba(0,0,0,.62);
	font-size: .8125rem; color: rgba(255,255,255,.75); font-variant-numeric: tabular-nums; pointer-events: none;
}
.sg-visor__conta b { color: #fff; font-weight: 600; }

.sg-visor__painel { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; }
.sg-visor__onde { padding-bottom: 1.15rem; border-bottom: 1px solid #2A2A27; }
.sg-visor__passo { margin: 0; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--sg-laranja); font-variant-numeric: tabular-nums; }
.sg-visor__frente { margin: .35rem 0 0 !important; font-size: clamp(1.25rem, 1.8vw, 1.625rem) !important; line-height: 1.15 !important; letter-spacing: -.02em; color: #fff; }
.sg-visor__legenda { margin: .6rem 0 0; color: rgba(255,255,255,.72); line-height: 1.5; font-size: .9375rem; min-height: 3em; }
.sg-visor__bloco .sg-olho { color: rgba(255,255,255,.5); margin: 0 0 .45rem; }
.sg-visor__bloco p:not(.sg-olho) { margin: 0; color: #E6E6E1; line-height: 1.6; font-size: .9375rem; }
.sg-visor__bloco--fim { display: flex; flex-direction: column; gap: .9rem; align-items: flex-start; }
.sg-visor__bloco[hidden] { display: none; }
.sg-visor__duracao { font-family: Outfit, sans-serif; font-weight: 600; font-size: 1.25rem !important; color: #fff !important; }
.sg-visor__duracao span { display: block; font-family: var(--wp--preset--font-family--texto, sans-serif); font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.sg-visor__proxima {
	width: 100%; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .15rem 1rem; text-align: left;
	padding: 1rem 1.1rem; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); color: #fff; cursor: pointer;
	transition: background .2s ease, border-color .2s ease;
}
.sg-visor__proxima .sg-olho { grid-column: 1; margin: 0; color: rgba(255,255,255,.5); }
.sg-visor__proxima strong { grid-column: 1; font-family: Outfit, sans-serif; font-weight: 600; font-size: 1.0625rem; }
.sg-visor__proxima svg { grid-column: 2; grid-row: 1 / 3; color: var(--sg-laranja); }
.sg-visor__proxima:hover { background: rgba(255,255,255,.1); border-color: var(--sg-laranja); }

/* As frentes: um capítulo cada, com a barra a encher. */
.sg-visor__frentes { position: relative; display: flex; gap: 4px; margin-top: 1.25rem; }
.sg-visor__fr {
	flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: .5rem; padding: 0 0 .25rem; background: none; border: 0;
	color: rgba(255,255,255,.5); text-align: left; cursor: pointer; font: inherit;
}
.sg-visor__fr-barra { display: block; height: 4px; border-radius: 2px; background: rgba(255,255,255,.16); overflow: hidden; }
.sg-visor__fr-barra i { display: block; height: 100%; background: var(--sg-laranja); transform-origin: left; transform: scaleX(0); transition: transform .25s ease; }
.sg-visor__fr-nome { font-size: .75rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sg-visor__fr-nome b { font-variant-numeric: tabular-nums; margin-right: .2rem; }
.sg-visor__fr:hover, .sg-visor__fr.is-actual { color: #fff; }
.sg-visor__fr.is-actual .sg-visor__fr-nome b { color: var(--sg-laranja); }

/* As miniaturas. */
.sg-visor__tira {
	position: relative; display: flex; gap: 6px; align-items: center; margin-top: 1rem; padding-bottom: .5rem;
	overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: #3A3A36 transparent;
}
.sg-visor__tira:empty { display: none; }
.sg-visor__mini { flex: 0 0 auto; width: 4.25rem; height: 4.25rem; padding: 0; border: 0; background: #1C1C1A; cursor: pointer; opacity: .55; position: relative; transition: opacity .15s ease; }
.sg-visor__mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sg-visor__mini:hover { opacity: .9; }
.sg-visor__mini.is-actual { opacity: 1; box-shadow: 0 0 0 2px var(--sg-laranja); }
.sg-visor__tira-fr { flex: 0 0 auto; align-self: stretch; display: grid; place-items: center; width: 1.9rem; font-size: .75rem; font-weight: 700; color: var(--sg-laranja); border-left: 1px solid #2A2A27; font-variant-numeric: tabular-nums; }
.sg-visor__tira-fr:first-child { border-left: 0; }

/* Sem JavaScript: a fotografia de capa e o texto todo, sem controlos. */
.sg-visor:not(.is-vivo) .sg-visor__seta, .sg-visor:not(.is-vivo) .sg-visor__accoes, .sg-visor:not(.is-vivo) .sg-visor__bloco[data-quando="meio"] { display: none; }
.sg-visor:not(.is-vivo) .sg-visor__bloco[hidden]:not([data-quando="meio"]) { display: block; }

@media (hover: none) {
	.sg-visor__seta { opacity: .92; }
}
@media (max-width: 980px) {
	.sg-visor { margin-top: 1.5rem; }
	.sg-visor__corpo { grid-template-columns: 1fr; gap: 1rem; }
	.sg-visor__interior { width: 100%; }
	.sg-visor__cab, .sg-visor__painel, .sg-visor__frentes, .sg-visor__tira { padding-inline: var(--sg-gutter); }
	.sg-visor__palco { height: min(118vw, 62svh); min-height: 320px; }
	.sg-visor__seta { width: 2.75rem; height: 2.75rem; top: auto; bottom: .75rem; transform: none; }
	.sg-visor__seta:active { transform: scale(.94); }
	.sg-visor__seta--ant { left: auto; right: 4rem; }
	.sg-visor__seta--seg { right: .75rem; }
	.sg-visor__conta { left: .75rem; bottom: 1.2rem; }
	/* No telemóvel as frentes correm para o lado, como separadores. */
	.sg-visor__frentes { order: -1; overflow-x: auto; gap: .4rem; margin: 0 0 .85rem; padding-bottom: .25rem; scrollbar-width: none; }
	.sg-visor__frentes::-webkit-scrollbar { display: none; }
	.sg-visor__fr { flex: 0 0 auto; flex-direction: row; align-items: center; gap: 0; padding: .5rem .8rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; }
	.sg-visor__fr-barra { display: none; }
	.sg-visor__fr.is-actual { background: #fff; color: #111; border-color: #fff; }
	.sg-visor__fr.is-actual .sg-visor__fr-nome b { color: var(--sg-laranja); }
	.sg-visor__fr-nome { font-size: .8125rem; font-weight: 600; }
	.sg-visor__interior { display: flex; flex-direction: column; }
	.sg-visor__cab { order: -2; }
	.sg-visor__mini { width: 3.5rem; height: 3.5rem; }
	.sg-visor__accoes { width: 100%; flex-wrap: nowrap; }
	.sg-visor__accao { padding: .6rem .85rem; font-size: .8125rem; }
}
@media (max-width: 480px) {
	.sg-visor__accao[data-a="filme"] span { display: none; }
	.sg-visor__accao[data-a="filme"] { margin-left: auto; }
}
