/* ═══════════════════════════════════════════════════════════════════
   Cabeçalho e rodapé do site (site-shell, 2026-11)
   Tudo com prefixo .sh- : não toca no conteúdo das páginas.
   Tokens iguais aos da página de terraços (css/terracos.css), com prefixo --sh-.
   Ponto de quebra: < 900 px = telemóvel.
   ═══════════════════════════════════════════════════════════════════ */

@font-face { font-family: "Manrope"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/manrope-latin-700.woff2") format("woff2"); }

/* Valores: css/ds/tokens.css (DS v1). --sh-* ficam como pseudónimos dos tokens. */
.sh, .sh-panel, .sh-foot, .sh-skip {
  --sh-ink: var(--pom-color-ink);
  --sh-text: var(--pom-color-text);
  --sh-mute: var(--pom-color-text-muted);
  --sh-muted: var(--pom-color-bg-muted);
  --sh-line: var(--pom-color-line);
  --sh-yellow: var(--pom-color-cta);
  --sh-yellow-d: var(--pom-color-cta-hover);
  --sh-blue: var(--pom-color-accent);          /* só linhas/marcas */
  --sh-blue-txt: var(--pom-color-accent-text); /* texto e foco */
  --sh-dark: var(--pom-color-dark-2);          /* grafite do rodapé */
  --sh-dark-text: var(--pom-color-on-dark-text);
  --sh-dark-mute: #a9aeb6;     /* próprio do rodapé (7,6:1); etapa 2 → --pom-color-on-dark-muted */
  --sh-dark-link: #eceef1;
  --sh-font-h: var(--pom-font-heading);
  --sh-font-b: var(--pom-font-body);
  --sh-font-num: var(--pom-font-num);
  --sh-pad: var(--pom-gutter); /* 24 → 40 ≥900: o mesmo bordo do conteúdo (era 20 no telemóvel) */
  --sh-max: var(--pom-container);
  --sh-h: var(--pom-header-h);
  --sh-ease: var(--pom-ease);
}

html { scroll-padding-top: 80px; }
html.sh-lock, html.sh-lock body { overflow: hidden !important; }

.sh *, .sh-panel *, .sh-foot * { box-sizing: border-box; }
:where(.sh, .sh-panel, .sh-foot) ul { list-style: none; margin: 0; padding: 0; }
:where(.sh, .sh-panel, .sh-foot) li { margin: 0; }
.sh-foot__line > span { display: block; }
.sh-chev { flex: none; transition: transform .18s var(--sh-ease); }

/* Saltar para o conteúdo */
.sh-skip { position: fixed; left: 8px; top: -100px; z-index: 1300; padding: 12px 16px; border-radius: 8px; background: var(--sh-ink); color: #fff !important; font: 600 15px/1.2 var(--sh-font-b); text-decoration: none; }
.sh-skip:focus { top: 8px; }
#sh-main { outline: none; }

/* Foco visível */
.sh a:focus-visible, .sh button:focus-visible, .sh-panel a:focus-visible, .sh-panel button:focus-visible {
  outline: var(--pom-focus); outline-offset: var(--pom-focus-offset);
}

/* ── Cabeçalho ─────────────────────────────────────────────────────── */
.sh { position: relative; height: var(--sh-h); margin: 0; padding: 0; color: var(--sh-ink); font-family: var(--sh-font-b); line-height: 1.2; }
.sh__bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1100; height: var(--sh-h);
  background: rgba(255,255,255,0); box-shadow: 0 1px 0 rgba(227,224,218,0);
  transition: height .2s var(--sh-ease), background-color .2s ease, box-shadow .2s ease;
}
.sh.is-compact .sh__bar, .sh.is-solid .sh__bar { background: #fff; box-shadow: 0 1px 0 var(--sh-line); }
.sh.is-compact .sh__bar { height: 64px; }
.sh__in { display: flex; align-items: center; gap: 24px; height: 100%; max-width: calc(var(--sh-max) + 2 * var(--sh-pad)); margin: 0 auto; padding: 0 var(--sh-pad); }

.sh-logo { display: inline-flex; align-items: center; flex: none; min-height: 44px; }
.sh-logo img { display: block; width: auto; height: 36px; transition: height .2s var(--sh-ease); }
@media (min-width: 900px) {
  .sh-logo img { height: 44px; }
  .sh.is-compact .sh-logo img { height: 36px; }
}

/* Menu (computador) */
.sh-nav { display: none; margin-left: auto; }
.sh-nav__list { display: flex; align-items: center; gap: 2px; }
.sh-nav__item { position: relative; }
.sh-nav__btn, .sh-nav__link {
  position: relative; display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 12px; margin: 0;
  border: 0; border-radius: 999px; background: transparent; cursor: pointer;
  font: 600 16px/1 var(--sh-font-h); color: var(--sh-ink) !important; text-decoration: none !important; white-space: nowrap;
  transition: background-color .15s ease;
}
.sh-nav__btn:hover, .sh-nav__link:hover, .sh-nav__item.is-open > .sh-nav__btn { background: var(--sh-muted); }
.sh-nav__item.is-current > .sh-nav__btn::after, .sh-nav__item.is-current > .sh-nav__link::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 2px; border-radius: 2px; background: var(--sh-blue);
}
.sh-nav__item.has-drop.is-current > .sh-nav__btn::after { right: 30px; }
.sh-nav__item.is-open > .sh-nav__btn .sh-chev { transform: rotate(180deg); }

.sh-drop {
  position: absolute; top: calc(100% + 10px); left: 0; z-index: 2; min-width: 300px; padding: 8px;
  background: #fff; border: 1px solid var(--sh-line); border-radius: 12px; box-shadow: 0 16px 40px rgba(20,24,31,.14);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .16s ease, transform .16s var(--sh-ease), visibility 0s linear .16s;
}
.sh-drop::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.sh-nav__item.is-open > .sh-drop,
html:not(.sh-js) .sh-nav__item:hover > .sh-drop,
html:not(.sh-js) .sh-nav__item:focus-within > .sh-drop { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.sh-drop a {
  display: flex; align-items: center; min-height: 44px; padding: 10px 14px; border-radius: 8px;
  font: 500 15px/1.3 var(--sh-font-b); color: var(--sh-ink) !important; text-decoration: none !important;
}
.sh-drop a:hover { background: var(--sh-muted); }
.sh-drop a[aria-current="page"] { color: var(--sh-blue-txt) !important; box-shadow: inset 2px 0 0 var(--sh-blue); border-radius: 0 8px 8px 0; }
.sh-drop .sh-drop__all { font-weight: 700; font-family: var(--sh-font-h); }
.sh-drop li:has(.sh-drop__all) { margin-bottom: 4px; padding-bottom: 4px; border-bottom: 1px solid var(--sh-line); }

/* Ações à direita */
.sh__act { display: flex; align-items: center; gap: 4px; margin-left: auto; }
.sh-tel { display: none; }
.sh-cta {
  display: none; align-items: center; justify-content: center; min-height: 44px; padding: 0 22px; border-radius: 999px;
  background: var(--sh-yellow); color: var(--sh-ink) !important; text-decoration: none !important; white-space: nowrap;
  font: 700 16px/1 var(--sh-font-h); transition: background-color .15s ease;
}
.sh-cta:hover { background: var(--sh-yellow-d); }
.sh-ic {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; margin: 0;
  border: 0; border-radius: 999px; background: transparent; color: var(--sh-ink) !important; cursor: pointer;
}
.sh-ic:hover { background: var(--sh-muted); }

@media (min-width: 900px) {
  .sh-nav { display: block; }
  .sh-m { display: none; }
  .sh__act { margin-left: 8px; gap: 20px; }
  .sh-cta { display: inline-flex; }
  .sh-tel { display: none; flex-direction: column; gap: 3px; text-decoration: none !important; }
  .sh-tel__n { font: 700 17px/1 var(--sh-font-num); color: var(--sh-ink); letter-spacing: .01em; font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
  .sh-tel__note { font: 400 11px/1.2 var(--sh-font-b); color: var(--sh-mute); white-space: nowrap; }
  .sh-tel:hover .sh-tel__n { color: var(--sh-blue-txt); }
}
@media (min-width: 900px) and (max-width: 1199px) {
  .sh__in { gap: 12px; }
  .sh-logo img, .sh.is-compact .sh-logo img { height: 34px; }
  .sh-nav__btn, .sh-nav__link { padding: 0 9px; font-size: 15px; }
  .sh-nav__item.is-current > .sh-nav__link::after { left: 9px; right: 9px; }
  .sh-nav__item.has-drop.is-current > .sh-nav__btn::after { left: 9px; right: 27px; }
  .sh-cta { padding: 0 18px; font-size: 15px; }
}
@media (min-width: 1200px) {
  .sh-tel { display: flex; }
}

/* ── Menu de telemóvel (painel de ecrã inteiro) ────────────────────── */
.sh-panel {
  position: fixed; inset: 0; z-index: 1200; display: flex; flex-direction: column;
  background: #fff; color: var(--sh-ink); overflow-y: auto; overscroll-behavior: contain;
  font-family: var(--sh-font-b); line-height: 1.3;
  animation: sh-in .2s var(--sh-ease);
}
.sh-panel[hidden] { display: none; }
@keyframes sh-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.sh-panel__top { display: flex; align-items: center; justify-content: space-between; flex: none; height: 64px; padding: 0 var(--sh-pad); border-bottom: 1px solid var(--sh-line); }
.sh-panel__top .sh-logo img { height: 36px; }
.sh-panel__nav { padding: 8px 0 24px; }
.sh-acc > li { border-bottom: 1px solid var(--sh-line); }
.sh-acc__btn, .sh-acc__link {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 64px; padding: 0 var(--sh-pad); margin: 0;
  border: 0; background: transparent; text-align: left; cursor: pointer;
  font: 700 22px/1.2 var(--sh-font-h); letter-spacing: -0.01em; color: var(--sh-ink) !important; text-decoration: none !important;
}
.sh-acc__btn .sh-chev { width: 16px; height: 16px; }
.sh-acc__btn[aria-expanded="true"] .sh-chev { transform: rotate(180deg); }
.sh-acc__link[aria-current="page"] { color: var(--sh-blue-txt) !important; }
.sh-acc__list { padding: 0 var(--sh-pad) 16px; }
.sh-acc__list a {
  display: flex; align-items: center; min-height: 48px; padding: 8px 0 8px 16px; border-left: 2px solid var(--sh-line);
  font: 500 17px/1.3 var(--sh-font-b); color: var(--sh-text) !important; text-decoration: none !important;
}
.sh-acc__list a[aria-current="page"] { color: var(--sh-blue-txt) !important; border-left-color: var(--sh-blue); }
.sh-panel__sec { display: flex; gap: 8px 24px; flex-wrap: wrap; padding: 16px var(--sh-pad) 0; }
.sh-panel__sec a { display: inline-flex; align-items: center; min-height: 48px; font: 600 18px/1.2 var(--sh-font-h); color: var(--sh-ink) !important; text-decoration: underline !important; text-decoration-color: var(--sh-line) !important; text-underline-offset: 6px; }
.sh-panel__foot {
  display: grid; gap: 8px; margin-top: auto; padding: 20px var(--sh-pad) calc(20px + env(safe-area-inset-bottom));
  background: var(--sh-muted);
}
.sh-panel__tel, .sh-panel__wa { display: flex; align-items: center; gap: 12px; min-height: 48px; color: var(--sh-ink) !important; text-decoration: none !important; }
.sh-panel__tel span { display: grid; gap: 2px; font: 700 22px/1.1 var(--sh-font-num); letter-spacing: .01em; font-variant-numeric: tabular-nums lining-nums; }
.sh-panel__tel small { font: 400 12px/1.2 var(--sh-font-b); color: var(--sh-mute); letter-spacing: 0; }
.sh-panel__wa span { font: 600 16px/1.2 var(--sh-font-h); }
.sh-cta--block { display: flex; width: 100%; min-height: 56px; margin-top: 8px; font-size: 17px; }

/* ── Rodapé ────────────────────────────────────────────────────────── */
footer.sh-foot {
  margin: 0; padding: 64px 0 32px; background: var(--sh-dark); color: var(--sh-dark-text);
  font: 400 15px/1.6 var(--sh-font-b); font-family: var(--sh-font-b) !important;
}
.sh-foot span, .sh-foot p, .sh-foot address { font-size: inherit; font-weight: inherit; }
.sh-foot p, .sh-foot address { margin: 0; font-style: normal; }
.sh-foot a { font-size: inherit; color: var(--sh-dark-link); text-decoration: none; }
.sh-foot a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--sh-yellow); text-underline-offset: 4px; }
.sh-foot a:focus-visible { outline: var(--pom-focus-on-dark); outline-offset: var(--pom-focus-offset); border-radius: 4px; }
.sh-foot__in { max-width: calc(var(--sh-max) + 2 * var(--sh-pad)); margin: 0 auto; padding: 0 var(--sh-pad); }

.sh-foot__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px 24px; }
@media (min-width: 600px) { .sh-foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) {
  .sh-foot__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .sh-foot__col--id  { grid-column: span 4; }
  .sh-foot__col--srv { grid-column: span 3; }
  .sh-foot__col--zon { grid-column: span 2; }
  .sh-foot__col--emp { grid-column: span 3; }
}

.sh-foot__logo { display: inline-flex; margin-bottom: 24px; }
.sh-foot__logo img { display: block; width: 180px; height: auto; }
.sh-foot .tel-f.sh-foot__phones { display: grid; gap: 2px; }
.sh-foot .tel-f a.sh-foot__tel {
  justify-self: start; margin: 0; font-family: var(--sh-font-num) !important; font-weight: 700; font-size: 24px; line-height: 1.35;
  color: #fff; letter-spacing: .01em; font-variant-numeric: tabular-nums lining-nums; white-space: nowrap;
}
.sh-foot__note { margin-top: 2px !important; font-size: 13px !important; color: var(--sh-dark-mute); }
.sh-foot__line { margin-top: 16px !important; }
.sh-foot__soc { display: flex; gap: 8px; margin-top: 24px !important; }
.sh-foot__soc a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.40); border-radius: 999px; color: var(--sh-dark-link); } /* contorno ≈3,3:1 no fundo (WCAG 1.4.11) */
.sh-foot__soc a:hover { border-color: var(--sh-yellow); color: var(--sh-yellow); }

.sh-foot__h { margin: 0 0 12px; font: 700 17px/1.3 var(--sh-font-h); color: #fff; letter-spacing: 0; text-transform: none; }
.sh-foot__h--sub { margin-top: 28px; font-size: 15px; color: var(--sh-dark-text); }
.sh-foot__list a { display: inline-flex; align-items: center; min-height: 40px; padding: 4px 0; line-height: 1.35; }
@media (min-width: 900px) { .sh-foot__list a { min-height: 34px; } }
.sh-foot__lead { margin-bottom: 8px !important; color: var(--sh-dark-mute); font-size: 14px !important; }
.sh-foot__zones { line-height: 1.75; }
.sh-foot__zones li { display: inline; }
.sh-foot__zones li:not(:last-child)::after { content: ", "; }

.sh-foot__base { display: grid; gap: 12px; margin-top: 56px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.12); font-size: 14px; }
.sh-foot__copy { color: var(--sh-dark-text); }
.sh-foot__nif { margin-left: 12px; white-space: nowrap; }
.sh-foot__legal { display: flex; flex-wrap: wrap; gap: 0 24px; }
.sh-foot__legal a { display: inline-flex; align-items: center; min-height: 44px; }
.sh-foot__ral { max-width: 80ch; font-size: 13px !important; color: var(--sh-dark-mute); }
.sh-foot__ral a { color: var(--sh-dark-text); text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 900px) {
  .sh-foot__base { grid-template-columns: auto 1fr; align-items: center; column-gap: 32px; }
  .sh-foot__legal { justify-content: flex-end; }
  .sh-foot__ral { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .sh__bar, .sh-logo img, .sh-chev, .sh-drop, .sh-nav__btn, .sh-cta { transition: none !important; }
  .sh-panel { animation: none; }
}

/* Voltar ao topo: canto inferior ESQUERDO (o direito fica livre para o WhatsApp/chat), círculo grafite 48 px, seta branca */
.cd-top { left: 24px !important; right: auto !important; bottom: 24px !important; width: 48px !important; height: 48px !important; border-radius: 999px;
  background: #16191e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E") no-repeat center / 22px 22px !important;
  box-shadow: 0 4px 14px rgba(20,24,31,.18); z-index: 60; }
.cd-top.cd-fade-out { opacity: .85; }
.no-touch .cd-top:hover, .cd-top:hover { background-color: #2a303a !important; opacity: 1; }
.cd-top:focus-visible { outline: var(--pom-focus); outline-offset: var(--pom-focus-offset); opacity: 1; visibility: visible; }
/* telemóvel: por cima da barra fixa de contacto da página de terraços */
@media (max-width: 899px) {
  .cd-top { left: 16px !important; bottom: 16px !important; }
  body.page-template-page-impermeabilizacao-dos-terracos .cd-top { bottom: 96px !important; }
}

/* v8: em fundo escuro (secção «Sistema», rodapé) o círculo grafite desaparecia — aro claro fino */
.cd-top { box-shadow: 0 0 0 1px rgba(255,255,255,.28), 0 4px 14px rgba(20,24,31,.18); }