/* ==========================================================================
   ConjugaPrisma — paginas de conteudo
   Os componentes que vinham do WPBakery/Porto e a tipografia editorial.
   Tudo fluido: nada aqui tem largura fixa.
   ========================================================================== */

/* --- Medida de leitura ---------------------------------------------------- */
.cp-page{padding-block:clamp(2rem,5vw,4rem)}
.cp-content{font-size:clamp(.9375rem,.35vw + .85rem,1.0625rem);line-height:1.7;
  color:var(--cp-body)}
.cp-content>*+*{margin-top:clamp(.9rem,1.6vw,1.35rem)}
/* Texto corrido nao passa da medida legivel; blocos largos sao excepcao. */
.cp-content>p,.cp-content>ul,.cp-content>ol,.cp-content>h2,
.cp-content>h3,.cp-content>h4,.cp-content>blockquote{max-width:72ch}
.cp-content--centered>p{margin-inline:auto;text-align:center}

.cp-content h2{font-size:clamp(1.3rem,2.4vw,1.9rem);margin-top:clamp(2rem,4vw,3rem)}
.cp-content h3{font-size:clamp(1.1rem,1.8vw,1.4rem);margin-top:clamp(1.5rem,3vw,2.25rem)}
.cp-content h2:first-child,.cp-content h3:first-child{margin-top:0}
.cp-content a:not(.cp-btn){text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:rgba(51,185,191,.45)}
.cp-content a:not(.cp-btn):hover{text-decoration-color:currentColor}
.cp-content ul,.cp-content ol{padding-left:1.35rem}
.cp-content li+li{margin-top:.4rem}
.cp-content ul li::marker{color:var(--cp-primary)}
.cp-content figure{margin:clamp(1.5rem,3vw,2.5rem) 0}
.cp-content figcaption{font-size:var(--cp-fs-xs);color:var(--cp-muted);
  margin-top:var(--cp-2);text-align:center}
.cp-content img{border-radius:var(--cp-radius-lg)}
.cp-content hr{margin-block:clamp(2rem,4vw,3rem)}

/* Primeiro paragrafo com peso de entrada, como no site antigo (.lead). */
.cp-content>p:first-of-type{font-size:clamp(1rem,.5vw + .9rem,1.2rem);color:var(--cp-dark)}

/* --- Cartoes de servico ([porto_history]) --------------------------------- */
.cp-services{display:grid;gap:clamp(1rem,2.4vw,1.75rem);
  margin-block:clamp(1.75rem,4vw,2.75rem);max-width:none}
/* Quatro ou mais cartoes curtos (Sobre Nos) ganham duas colunas em ecra
   largo — empilhados a toda a largura desperdicavam metade da pagina. */
@media (min-width:1000px){
  .cp-services:has(> :nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
}
.cp-service{display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:clamp(1rem,2.5vw,2rem);align-items:start;
  background:#fff;border:1px solid var(--cp-line-soft);
  border-radius:var(--cp-radius-xl);padding:clamp(1.1rem,2.5vw,1.75rem);
  box-shadow:var(--cp-shadow-sm);position:relative;overflow:hidden;
  transition:box-shadow .35s var(--cp-ease),transform .35s var(--cp-ease)}
.cp-service::before{content:"";position:absolute;inset-inline:0;top:0;height:3px;
  background:var(--cp-gradient)}
.cp-service:hover{box-shadow:var(--cp-shadow);transform:translateY(-2px)}
.cp-service__media{flex:none;width:clamp(72px,12vw,132px);aspect-ratio:1;
  border-radius:50%;overflow:hidden;background:var(--cp-bg-alt);
  border:3px solid #fff;box-shadow:0 0 0 1px var(--cp-line-soft)}
.cp-service__media img{width:100%;height:100%;object-fit:cover;border-radius:0;
  transition:transform .6s var(--cp-ease)}
.cp-service:hover .cp-service__media img{transform:scale(1.06)}
.cp-service__body{min-width:0}
.cp-service__body>*+*{margin-top:var(--cp-3)}
.cp-service__body p{margin:0;max-width:66ch}
.cp-service__title{font-size:clamp(1rem,1.5vw,1.25rem);margin:0;
  color:var(--cp-dark);letter-spacing:.02em}
.cp-service__body a{font-weight:600}

@media (max-width:575px){
  .cp-service{grid-template-columns:1fr;justify-items:center;text-align:center}
  .cp-service__body p{text-align:left}
  .cp-service__media{width:96px}
}

/* --- Botoes vindos do conteudo -------------------------------------------- */
.cp-btn-wrap{margin:0}
.cp-content .cp-btn{width:100%;justify-content:center;
  padding-block:clamp(.85rem,1.8vw,1.15rem)}
/* Cor propria do botao, preservada da pagina antiga. */
.cp-btn--custom{background:var(--cp-btn-bg,var(--cp-primary));
  border-color:var(--cp-btn-bg,var(--cp-primary));
  color:var(--cp-btn-fg,#fff)}
.cp-btn--custom:hover{background:var(--cp-btn-bg,var(--cp-primary));
  border-color:var(--cp-btn-bg,var(--cp-primary));color:var(--cp-btn-fg,#fff);
  filter:brightness(1.08)}

/* Botoes seguidos = grelha que respira, em vez de uma pilha. */
.cp-content .cp-vc-col>.cp-btn-wrap+.cp-btn-wrap{margin-top:var(--cp-3)}
.cp-btn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:var(--cp-3);margin-block:clamp(1.5rem,3vw,2.25rem);max-width:none}
.cp-btn-grid .cp-btn-wrap{margin:0}

/* --- Linhas e colunas herdadas -------------------------------------------- */
.cp-content .cp-vc-row{display:grid;gap:clamp(1rem,2.4vw,1.75rem);
  margin-block:clamp(1.5rem,3vw,2.25rem);max-width:none;align-items:start}
.cp-content .cp-vc-row[data-cols="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.cp-content .cp-vc-row[data-cols="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.cp-content .cp-vc-row[data-cols="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}
.cp-content .cp-vc-col{min-width:0}
.cp-content .cp-vc-col>*+*{margin-top:var(--cp-3)}
@media (max-width:900px){
  .cp-content .cp-vc-row[data-cols="3"],
  .cp-content .cp-vc-row[data-cols="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:575px){
  .cp-content .cp-vc-row[data-cols]{grid-template-columns:1fr}
}

/* --- Blocos de produtos dentro de conteudo -------------------------------- */
/* As regras editoriais acima nao podem tocar nos componentes da loja. */
.cp-content .cp-products,.cp-content .cp-carousel,
.cp-content .cp-services,.cp-content .cp-cat-tiles{max-width:none}
.cp-content .cp-product,.cp-content .cp-product *{max-width:none}
.cp-content .cp-product img{border-radius:0}
.cp-content .cp-product__title{max-width:none}
.cp-content .cp-carousel__track>*{margin-top:0}
.cp-content .cp-products>*{margin-top:0}

/* --- Faixa de destaque ---------------------------------------------------- */
/* UM componente, usado em todas as paginas. Foto em parallax com veu por
   cima, como no site antigo. O veu e' regulavel por linha
   (--cp-band-overlay) porque o Ultimate Addons guardava a cor em cada uma. */
.cp-band{position:relative;isolation:isolate;overflow:hidden;
  margin-block:clamp(2.5rem,6vw,4.5rem);display:grid;place-items:center;
  min-height:clamp(260px,32vw,440px);background:var(--cp-dark)}

/* A sangria so faz sentido DENTRO do contentor editorial, que esta limitado a
   1200px. Na homepage a faixa ja e' filha directa do <main> — sangra-la ali
   era esticar 100vw contra um pai que ja tinha a largura toda, e `100vw` conta
   a barra de scroll vertical (1280) enquanto a area util nao a conta (1265).
   Sobravam 15px, centrados, e o site ganhava scroll lateral. */
.cp-content .cp-band{margin-inline:calc(50% - 50vw);width:100vw;max-width:100vw}
.cp-band>img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;border-radius:0;z-index:-2}
.cp-band::after{content:"";position:absolute;inset:0;z-index:-1;
  background:var(--cp-band-overlay,linear-gradient(180deg,rgba(16,20,24,.42),rgba(16,20,24,.68)))}
/* Sem foto, a marca em gradiente — nunca um azul chapado. */
.cp-band:not(:has(>img)){background:var(--cp-gradient)}
.cp-band:not(:has(>img))::after{background:linear-gradient(180deg,transparent,rgba(16,20,24,.22))}

/* Parallax: a foto move-se mais devagar do que a pagina. Feito com transform
   na propria <img> — `background-attachment:fixed` parte no iOS. */
.cp-band--parallax>img{height:130%;top:-15%;will-change:transform}
@media (prefers-reduced-motion:reduce){
  .cp-band--parallax>img{height:100%;top:0;transform:none!important}
}

.cp-band__inner{position:relative;text-align:center;
  padding:clamp(2.5rem,6vw,4.5rem) var(--cp-5);max-width:var(--cp-container);width:100%;
  display:grid;justify-items:center;gap:clamp(1.25rem,3vw,2rem)}
.cp-band__inner>*{margin:0;max-width:none}
.cp-band h1,.cp-band h2,.cp-band h3{color:#fff;margin:0;max-width:26ch;
  font-size:clamp(1.4rem,3.6vw,2.75rem);line-height:1.12;letter-spacing:.01em;
  text-shadow:0 2px 28px rgba(0,0,0,.35)}
.cp-band p{color:rgba(255,255,255,.9);max-width:56ch;margin:0}
.cp-band .cp-btn{width:auto;min-width:min(240px,80vw);background:#fff;
  border-color:#fff;color:var(--cp-dark);box-shadow:0 8px 28px rgba(0,0,0,.22)}
.cp-band .cp-btn:hover{background:var(--cp-primary);border-color:var(--cp-primary);color:#fff}
.cp-band .cp-btn-wrap{margin:0}
.cp-band .cp-btn-grid{display:flex;gap:var(--cp-3);flex-wrap:wrap;
  justify-content:center;margin:0;grid-template-columns:none}

/* --- Mapas embutidos ------------------------------------------------------ */
.cp-content iframe[src*="google.com/maps"],.cp-map-embed iframe{
  width:100%;aspect-ratio:16/10;height:auto;border:0;display:block}
.cp-content iframe[src*="google.com/maps"]{border-radius:var(--cp-radius-lg);
  box-shadow:var(--cp-shadow-sm)}
.cp-content iframe[src*="youtube"],.cp-content iframe[src*="vimeo"]{
  width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--cp-radius-lg)}

/* --- Tabelas de dados (fichas tecnicas) ----------------------------------- */
.cp-table-scroll{overflow-x:auto;margin-block:clamp(1.5rem,3vw,2.25rem);
  border:1px solid var(--cp-line);border-radius:var(--cp-radius-lg);
  max-width:none;-webkit-overflow-scrolling:touch}
.cp-table-scroll table{margin:0;border:0;white-space:nowrap;min-width:100%}

/* --- Contactos ------------------------------------------------------------ */
.cp-content .cp-contact{max-width:none;padding-block:0}

/* --- Downloads / ficheiros ------------------------------------------------ */
.cp-content .cp-downloads{max-width:none}

/* --- Acessibilidade e impressao ------------------------------------------- */
@media print{
  .cp-service{break-inside:avoid;box-shadow:none;border:1px solid #ccc}
  .cp-content a::after{content:" (" attr(href) ")";font-size:.8em;color:#666}
}

/* --- Layout das paginas --------------------------------------------------- */
.cp-page__layout{display:grid;gap:clamp(1.5rem,4vw,3rem)}
.cp-page__layout--sidebar{grid-template-columns:minmax(0,1fr) 280px;align-items:start}
.cp-page__aside{position:sticky;top:var(--cp-5)}
@media (max-width:900px){
  .cp-page__layout--sidebar{grid-template-columns:1fr}
  .cp-page__aside{position:static}
}

/* --- Convite a accao no fim da pagina ------------------------------------- */
.cp-pagecta{display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(1.25rem,3vw,2.5rem);align-items:center;
  margin-top:clamp(2.5rem,6vw,4.5rem);padding:clamp(1.5rem,3.5vw,2.75rem);
  border-radius:var(--cp-radius-xl);background:var(--cp-bg-alt);
  border:1px solid var(--cp-line-soft)}
.cp-pagecta h2{margin:var(--cp-2) 0 var(--cp-2);font-size:clamp(1.2rem,2.2vw,1.7rem)}
.cp-pagecta p{margin:0;color:var(--cp-muted);max-width:52ch}
.cp-pagecta__actions{display:flex;gap:var(--cp-3);flex-wrap:wrap}
@media (max-width:767px){
  .cp-pagecta{grid-template-columns:1fr}
  .cp-pagecta__actions .cp-btn{width:100%}
}

/* --- Embeds (mapas e video) ----------------------------------------------- */
.cp-embed{position:relative;margin-block:clamp(1.5rem,3vw,2.5rem);max-width:none;
  border-radius:var(--cp-radius-lg);overflow:hidden;background:var(--cp-bg-alt);
  border:1px solid var(--cp-line-soft)}
.cp-embed iframe{display:block;width:100%;height:100%;border:0}
.cp-embed--map{aspect-ratio:16/10}
.cp-embed--video{aspect-ratio:16/9}
@media (max-width:575px){ .cp-embed--map{aspect-ratio:4/3} }

/* --- Fichas de contacto ([bsf-info-box]) ---------------------------------- */
.cp-infoboxes{display:grid;gap:var(--cp-2);margin-block:clamp(1.25rem,2.5vw,2rem);
  max-width:none;padding:clamp(1rem,2.5vw,1.75rem);
  border:1px solid var(--cp-line-soft);border-radius:var(--cp-radius-xl);
  background:#fff;box-shadow:var(--cp-shadow-sm)}
.cp-infobox{display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:var(--cp-3);align-items:start;padding:var(--cp-2) 0}
.cp-infobox+.cp-infobox{border-top:1px solid var(--cp-line-soft);padding-top:var(--cp-3)}
.cp-infobox__icon{display:grid;place-items:center;width:38px;height:38px;flex:none;
  border-radius:var(--cp-radius-lg);background:var(--cp-primary-tint);
  color:var(--cp-primary-dark)}
.cp-infobox__icon svg{width:19px;height:19px}
.cp-infobox__body{min-width:0}
.cp-infobox__body>*{margin:0;max-width:60ch}
.cp-infobox__body>*+*{margin-top:var(--cp-1)}
.cp-infobox__title{color:var(--cp-dark);font-weight:600;line-height:1.45}
.cp-infobox__title a{color:inherit;text-decoration:none;font-weight:inherit}
.cp-infobox__title a:hover{color:var(--cp-primary);text-decoration:underline}

/* Duas delegacoes lado a lado quando ha espaco. */
@media (min-width:900px){
  .cp-content .cp-vc-row[data-cols="2"] .cp-infoboxes{height:100%}
}

/* --- Entrada ao rolar ----------------------------------------------------- */
/* O site antigo tinha `data-appear-animation="fadeInUp"` nos blocos. Isto faz
   o mesmo, mas so quando o elemento entra no ecra e nunca com movimento
   reduzido activo. Sem JS, tudo fica visivel — nada depende da animacao. */
@media (prefers-reduced-motion:no-preference){
  .cp-reveal{opacity:0;transform:translateY(18px);
    transition:opacity .6s var(--cp-ease),transform .6s var(--cp-ease)}
  .cp-reveal.is-visible{opacity:1;transform:none}
  /* Elementos irmaos entram em cascata. */
  .cp-reveal:nth-child(2){transition-delay:.08s}
  .cp-reveal:nth-child(3){transition-delay:.16s}
  .cp-reveal:nth-child(4){transition-delay:.24s}
  .cp-reveal:nth-child(5){transition-delay:.32s}
  .cp-reveal:nth-child(6){transition-delay:.4s}
}

.cp-contact-form{padding:clamp(1.25rem,3vw,2rem);border:1px solid var(--cp-line-soft);
  border-radius:var(--cp-radius-xl);background:#fff;box-shadow:var(--cp-shadow-sm);
  max-width:none}
.cp-contact-form__title{margin:0 0 var(--cp-4);font-size:clamp(1.1rem,2vw,1.5rem)}
/* Grelha de duas colunas: os campos declaram a largura que querem, em vez de
   nth-of-type a contar posicoes (que falhava por causa do bloco de mensagens
   antes deles, e deixava so o Nome estreito). */
.cp-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--cp-3) var(--cp-4)}
.cp-form>*{grid-column:1/-1;margin:0}
@media (min-width:560px){
  .cp-form .cp-field--half{grid-column:span 1}
}
.cp-form .cp-field{min-width:0}
/* Os campos de texto ocupam a coluna toda. As caixas de seleccao NAO:
   um checkbox a 100% desenha-se centrado numa caixa de meia pagina e
   empurra o texto da etiqueta — e o asterisco — para a linha de baixo. */
.cp-form input:not([type=checkbox]):not([type=radio]),
.cp-form textarea,.cp-form select{width:100%}

/* ==========================================================================
   PAGINA DE CONTACTOS
   Desenhada de raiz: dados das opcoes, nao do conteudo importado.
   ========================================================================== */
.cp-contacts{display:grid;gap:clamp(1.75rem,4vw,3.5rem);align-items:start}
@media (min-width:940px){
  .cp-contacts{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
  .cp-contacts__form{position:sticky;top:calc(var(--cp-header-h-sticky) + 1.5rem)}
}

.cp-contacts__offices{display:grid;gap:clamp(1.25rem,3vw,2rem)}

.cp-office{border:1px solid var(--cp-line-soft);border-radius:var(--cp-radius-xl);
  overflow:hidden;background:#fff;box-shadow:var(--cp-shadow-sm)}
.cp-office__name{margin:0;padding:clamp(1rem,2.2vw,1.35rem) clamp(1.1rem,2.5vw,1.6rem);
  font-size:clamp(1rem,1.7vw,1.2rem);color:#fff;background:var(--cp-gradient);
  letter-spacing:.04em}
.cp-office__map{aspect-ratio:16/9;background:var(--cp-bg-alt);position:relative}
.cp-office__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  display:block;filter:saturate(.9)}
@media (max-width:575px){ .cp-office__map{aspect-ratio:4/3} }

.cp-office__details{list-style:none;margin:0;padding:clamp(1.1rem,2.5vw,1.6rem);
  display:grid;gap:var(--cp-4)}
.cp-office__details li{display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:var(--cp-3);align-items:start;margin:0}
.cp-office__details address{font-style:normal;margin:0;line-height:1.55}
.cp-office__details a{color:var(--cp-dark);text-decoration:none;font-weight:600}
.cp-office__details a:hover{color:var(--cp-primary);text-decoration:underline}
.cp-office__details small{display:block;font-size:var(--cp-fs-xs);
  color:var(--cp-muted);font-weight:400;margin-top:2px}
.cp-office__icon{display:grid;place-items:center;width:36px;height:36px;flex:none;
  border-radius:var(--cp-radius-lg);background:var(--cp-primary-tint);
  color:var(--cp-primary-dark)}
.cp-office__hours{display:flex;gap:var(--cp-2);flex-wrap:wrap;align-items:baseline}
.cp-office__hours strong{color:var(--cp-dark)}

.cp-contacts__legal{margin-top:clamp(2rem,5vw,3.5rem);max-width:none}
.cp-contacts__legal .cp-accordion__panel p{max-width:80ch}
