/* ======= Tokens (tema claro + dourados do logotipo) ======= */
    :root{
      --ink:#0f1220; --ink-2:#2B2F36; --muted:#5E6773;
      --paper:#ffffff; --wash:#f6f8fb; --wash-2:#f1f3f7; --line:#e7eaf0;
      --gold:#C9A227; --gold-2:#E4C766; --gold-3:#8F6E2A;
      --radius:18px; --shadow:0 10px 30px rgba(16,18,22,.08); --container:1180px;
    }
    html{scroll-behavior:smooth}
    *{box-sizing:border-box}
    body{margin:0;font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans"; color:var(--ink); background:var(--paper)}
    a{color:inherit;text-decoration:none}
    img{max-width:100%;height:auto;display:block}
    .container{max-width:var(--container);margin-inline:auto;padding-inline:20px}
    .section{padding:72px 0}
    .alt{background:var(--wash)} /* alternância suave */
    .section-title{font-size:clamp(24px,2.6vw,32px);font-weight:900;text-align:center;margin:0 0 10px}
    .section-sub{color:var(--muted);text-align:center;}

    /* ===== Qualquer .section com imagem de fundo ===== */
    .section.has-bg{
      position: relative;
      overflow: hidden;
      color: #fff;                 /* texto claro por defeito */
      background: var(--bg, none) center/cover no-repeat;
      isolation: isolate;
    }
    .section.has-bg::before{
      content:"";
      position:absolute; inset:0; z-index:0;
      background:
        radial-gradient(120% 120% at 100% 0%, rgba(0,0,0,.22), transparent 60%),
        linear-gradient(180deg, rgba(0,0,0,.52), rgba(0,0,0,.35));
      opacity: var(--shade, .55);
    }
    .section.has-bg > *{ position: relative; z-index:1 }
    .section.has-bg .section-title,
    .section.has-bg .section-sub{ color:#fff }

    /* Se precisares de texto escuro em cima da imagem */
    .section.has-bg.light,
    .section.has-bg.light .section-title,
    .section.has-bg.light .section-sub{ color:#0f1220 }
    .section.has-bg.light::before{ opacity: var(--shade, .25) }

    /* Integra com o teu parallax existente nas alternadas */
    .section.alt.has-bg{ background-attachment: scroll } /* parallax já é handle pelo JS */


    /* ======= NAVBAR (sticky + hambúrguer + drawer) ======= */
    .nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line)}
    .nav-wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
    .brand{display:flex;gap:12px;align-items:center}
    .brand svg{width:40px;height:40px;flex:0 0 auto}
    .brand-name{line-height:1}
    .brand-name strong{display:block;font-weight:900}
    .brand-name small{display:block;color:var(--muted);font-weight:600}
    .menu{display:flex;gap:22px;align-items:center}
    .menu a{font-weight:800;color:var(--ink-2)}
    .cta{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#1a1a1a;font-weight:900;box-shadow:var(--shadow);border:1px solid rgba(0,0,0,.05)}
    .hamb{display:none}
    @media (max-width:900px){.menu{display:none}.hamb{display:inline-flex;gap:8px;align-items:center;color:var(--ink-2);background:transparent;border:1px solid var(--line);border-radius:12px;padding:8px 12px}}
    /* Drawer SEMPRE acima de tudo */
    .drawer{ 
      position:fixed; inset:0;
      background:rgba(0,0,0,.35);
      opacity:0; visibility:hidden; transition:.25s;
      z-index: 9999;            /* <— chave */
    }
    .drawer.open{ opacity:1; visibility:visible }

    .drawer .panel{
      position:absolute; right:0; top:0;
      width:min(86vw,380px); height:100%;
      background:#fff; box-shadow:var(--shadow); padding:20px;
      z-index: 10000;           /* por cima do overlay */
    }

    /* Evitar scroll do fundo quando o menu está aberto */
    body.drawer-open{ overflow:hidden; }

    .drawer .panel{ transform:translateX(8%); transition:transform .25s ease; }
    .drawer.open .panel{ transform:none; }

    .drawer .panel a{display:block;padding:14px 8px;border-bottom:1px solid var(--line);font-weight:800;color:var(--ink-2)}

    /* ===== SOBRE NÓS — split (logo esquerda, texto direita) ===== */
    .about-split{
      display:grid;
      grid-template-columns: 1fr 1.2fr;
      gap: clamp(20px, 3vw, 40px);
      align-items:center;
    }
    .about-logo{
      display:flex;
      align-items:center;
      justify-content:center;
      padding: clamp(10px, 2vw, 20px);
      background:#fff;
      border:1px solid var(--line);
      border-radius:16px;
      box-shadow:0 1px 0 rgba(0,0,0,.02);
    }
    .about-logo img{
      width:100%;
      max-width:420px;
      height:auto;
      object-fit:contain;
      filter:saturate(1.05) contrast(1.02);
    }
    .about-content .section-title{ margin:0 0 10px; }
    .about-content p{
      margin:0 0 12px;
      color:var(--muted);
      line-height:1.6;
    }

    /* ===== Valores — 3 cards centrados ===== */
    .values-row{
      display:flex;
      justify-content:center;
      align-items:stretch;
      gap: clamp(14px, 2.2vw, 22px);
      margin-top: clamp(20px, 3.5vw, 36px);
      flex-wrap: wrap; /* empilha no mobile */
    }
    .vcard{
      flex: 1 1 260px;           /* largura mínima por card */
      max-width: 360px;          /* não alarga demasiado em desktop largo */
      background:#fff;
      border:1px solid var(--line);
      border-radius:16px;
      padding: clamp(14px, 2.2vw, 20px);
      text-align:center;
      box-shadow: 0 1px 0 rgba(0,0,0,.02);
    }
    .vcard h3{
      margin:0 0 8px;
      font-size:18px;
      color:var(--ink);
    }
    .vcard p{
      margin:0;
      color:var(--ink-2);
      line-height:1.5;
    }

    /* Responsivo */
    @media (max-width:1024px){
      .about-split{ grid-template-columns:1fr 1fr; }
    }
    @media (max-width:820px){
      .about-split{ grid-template-columns:1fr; }
      .about-logo{ order:1; }
      .about-content{ order:2; }
    }
    /* ===========================
      SECTION: SOLUÇÕES (escopo completo)
      =========================== */

    #solucoes.section{
      padding:72px 0;
    }

    #solucoes .section-title{
      font-size:clamp(24px,2.6vw,32px);
      font-weight:900;
      text-align:center;
      margin:0 0 6px;
    }
    #solucoes .section-sub{
      color:#5E6773;
      text-align:center;
      margin:0 0 18px;
    }

    /* Grelha 4 colunas → 2 → 1 */
    #solucoes .grid-4{
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:14px;
    }
    @media (max-width:960px){
      #solucoes .grid-4{ grid-template-columns:repeat(2,1fr) }
    }
    @media (max-width:560px){
      #solucoes .grid-4{ grid-template-columns:1fr }
    }

    /* Base dos cartões (reseta estilos antigos que forçavam fundo branco) */
    #solucoes .tile{
      position:relative;
      display:block;
      border:1px solid #e7eaf0;
      border-radius:16px;
      padding:20px;
      background:#fff;               /* default sem imagem */
      box-shadow:0 6px 24px rgba(16,18,22,.06);
      transition:border-color .2s, box-shadow .2s, transform .2s;
    }
    #solucoes .tile:hover{
      border-color:#C9A227;
      box-shadow:0 0 0 6px rgba(201,162,39,.12);
      transform:translateY(-2px);
    }
    #solucoes .tile h4{
      margin:6px 0 6px;
      font-size:16px;
      color:#2B2F36;
    }
    #solucoes .tile p{
      margin:0;
      font-size:14px;
      color:#5E6773;
    }

    /* ===== Tiles com background (aceita --img OU background-image direta) ===== */
    #solucoes .tile.bg{
      overflow:hidden;
      isolation:isolate;
      color:#fff !important;
      background: var(--img, none) center/cover no-repeat; /* via var */
      /* Se usares background-image no elemento, também funciona porque o ::before herda */
      min-height:160px;
      aspect-ratio:5/4;
    }

    /* Texto claro em cima de imagem */
    #solucoes .tile.bg h4,
    #solucoes .tile.bg p{
      color:#fff !important;
      text-shadow:0 2px 12px rgba(0,0,0,.35);
    }

    /* Camada de imagem (herda o mesmo background do elemento para zoom suave) */
    #solucoes .tile.bg::before{
      content:"";
      position:absolute; inset:0; z-index:0;
      background:inherit;                /* herda --img ou background-image */
      transform:scale(1.03);
      transition:transform .45s ease;
    }

    /* Overlay para legibilidade (ajustável com --shade de 0 a 1) */
    #solucoes .tile.bg::after{
      content:"";
      position:absolute; inset:0; z-index:1;
      background:
        radial-gradient(120% 120% at 100% 0%, rgba(0,0,0,.25), transparent 60%),
        linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.35));
      opacity: var(--shade, .55);
    }

    /* Conteúdo sempre acima das camadas */
    #solucoes .tile.bg > *{ position:relative; z-index:2 }

    /* Hover */
    #solucoes .tile.bg:hover::before{ transform:scale(1.07) }

    /* Posições opcionais do foco da imagem */
    #solucoes .tile.bg.pos-top{  background-position:50% 20% }
    #solucoes .tile.bg.pos-left{ background-position:20% 50% }
    #solucoes .tile.bg.pos-right{background-position:80% 50% }

    /* Mobile: um pouco mais alto */
    @media (max-width:560px){
      #solucoes .tile.bg{ aspect-ratio:4/3; min-height:180px }
    }
    /* Base do card */
    .tile{
      position: relative;
      border-radius: 16px;
      overflow: hidden;
      min-height: var(--tile-h,170px);
    }

    /* NÃO anular o background! Garantir cover no bg clássico */
    .tile.bg{
      /* mantém qualquer background-image já definido (inline ou classe) */
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      color:#fff; /* texto legível sobre foto */
    }

    /* Camada de imagem quando usas --img (opcional) */
    .tile.bg::after{
      content:"";
      position:absolute;
      inset:0;
      /* só aparece se definires --img; caso contrário fica transparente */
      background-image: var(--img);
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      z-index:0;
    }

    /* Overlay (sombra) — semi-transparente */
    .tile.bg::before{
      content:"";
      position:absolute;
      inset:0;
      background: linear-gradient(
        180deg,
        rgba(0,0,0, calc(var(--shade, .40) * 0.15)) 0%,
        rgba(0,0,0, var(--shade, .40)) 100%
      );
      z-index:1;
    }

    /* Conteúdo por cima */
    .tile.bg > *{
      position:relative;
      z-index:2;
    }


    /* ===========================================
      HEADER (HERO) — Credível & Confiável
      =========================================== */

    /* Raiz do herói */
    header#inicio{
      position: relative;
      isolation: isolate;                 /* cria contexto próprio de empilhamento */
      height: 100vh;                      /* ocupa viewport */
      height: 100svh;                     /* iOS/Android seguro */
      height: 100dvh;                     /* moderno */
      display: grid;
      align-items: center;
      margin: 0;
      padding: 0;
      overflow: hidden;
      background: none;                   /* limpa qualquer herança */
    }

    /* Fundo (imagem) via CSS var --hero-img e posição --hero-pos */
    header#inicio.has-bg::before{
      content: "";
      position: absolute; inset: 0;
      z-index: 0;                         /* atrás de tudo */
      background-image: var(--hero-img, none);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: var(--hero-pos, 50% 50%);
      transform: none;
    }

    /* Overlay para legibilidade; intensidade em --shade (0–1) */
    header#inicio.has-bg::after{
      content: "";
      position: absolute; inset: 0;
      z-index: 1;
      background:
        radial-gradient(140% 100% at 100% 0%, rgba(0,0,0,.35), transparent 60%),
        linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.35));
      opacity: var(--shade, .45);
    }

    /* Grelha interna + contenção */
    header#inicio .container.hero-grid{
      position: relative;
      z-index: 5;                         /* acima do overlay */
      width: min(1180px, 92vw);
      margin-inline: auto;
      display: grid;
      grid-template-columns: 1.2fr 1fr;
      gap: 34px;
      align-items: center;
      padding-block: clamp(24px, 6vh, 80px);  /* respiro vertical */
    }

    /* Desativa qualquer reveal/transform herdado dentro do header */
    header#inicio .reveal,
    header#inicio .hero-grid > *,
    header#inicio .hero-grid *{
      will-change: opacity, transform;
      mix-blend-mode: normal;
      filter: none;
      visibility: visible;
    }

    /* Badge, títulos e parágrafo — sempre legíveis sobre o bg */
    header#inicio .badge{
      display:inline-block;
      background: rgba(255,255,255,.12);
      color:#fff;
      border:1px solid rgba(255,255,255,.28);
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 12px;
      letter-spacing:.2px;
      text-shadow: 0 2px 12px rgba(0,0,0,.35);
      margin-bottom: 10px;
    }

    header#inicio h1{
      margin: 6px 0 10px;
      font-weight: 900;
      font-size: clamp(28px, 4.2vw, 70px);
      line-height: 1.12;
      color: #fff;
      text-shadow: 0 2px 12px rgba(0,0,0,.35);
    }

    header#inicio p{
      margin: 20px 0 20px;
      color: #fff;
      text-shadow: 0 2px 12px rgba(0,0,0,.35);
      max-width: 60ch;
    }

    /* CTAs (dois botões) */
    header#inicio .cta{
      display:inline-flex; align-items:center; justify-content:center;
      gap:8px;
      padding: 10px 14px;
      border-radius: 12px;
      border: 1px solid #e7eaf0;
      background: #C9A227;            /* principal: dourado */
      color: #0f1220;
      font-weight: 800;
      text-decoration: none;
      box-shadow: 0 10px 30px rgba(16,18,22,.12);
      transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease, border-color .18s ease;
    }
    header#inicio .cta:hover{
      transform: translateY(-2px);
      box-shadow: 0 16px 36px rgba(16,18,22,.18);
    }
    header#inicio .cta:is([style*="background:#fff"]){
      /* variante secundária (link “Ver soluções” que já envias no inline) */
      background:#fff !important; color:#0f1220 !important; border-color:#e7eaf0 !important;
    }

    /* ===== Cards (brancos) com ícone dourado ===== */
    header#inicio .cards{
      display:flex; flex-wrap:wrap; gap:14px; margin-top:16px;
    }

    header#inicio .cards .card{
      display:flex; flex-direction:column; gap:8px;
      min-width:220px; flex:1 1 240px;
      background:#fff;                        /* fundo branco */
      color:#0f1220;                          /* texto escuro */
      text-decoration:none;
      border:1px solid #e7eaf0;
      border-radius:16px;
      padding:16px 14px;
      box-shadow:0 10px 30px rgba(16,18,22,.08);
      transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
      position:relative;
    }
    header#inicio .cards .card:hover{
      transform:translateY(-3px);
      box-shadow:0 16px 36px rgba(16,18,22,.14);
      border-color:#C9A227;
    }
    header#inicio .cards .card h3{
      margin:2px 0 2px; font-weight:800; color:#0b0b0b; letter-spacing:.1px;
    }
    header#inicio .cards .card .help{
      margin:0; color:#5E6773; text-shadow:none;
    }
    header#inicio .cards .card .ico{
      width:26px; height:26px; color:#C9A227;   /* ícone dourado */
    }

    /* ===== Shapes/parallax decorativos (círculos) ===== */
    header#inicio .parx{
      position: absolute; z-index: 3; pointer-events: none;
      opacity: .25; filter: blur(.2px); transform: translateZ(0);
    }
    header#inicio .p1{ top:-80px; right:-120px; width:520px; }
    header#inicio .p2{ bottom:-120px; left:-120px; width:420px; }
    header#inicio .p3{ top:40%; left:55%; width:260px; opacity:.18; }

    /* ===== Responsivo ===== */
    @media (max-width: 960px){
      header#inicio .container.hero-grid{ grid-template-columns: 1fr; gap: 22px; }
    }
    @media (max-width: 560px){
      header#inicio .badge{ font-size:11px; padding:5px 9px; }
      header#inicio .cards{ gap:12px; }
    }

    /* ===========================
   PARCEIROS — Card único (logo + nome)
   =========================== */

#parceiros.partners-section{
  --line: var(--line, #e7eaf0);
  --ink-2: var(--ink-2, #2B2F36);
  --gold: var(--gold, #C9A227);

  --card-h: 170px;     /* altura total do cartão */
  --slot-w: 140px;     /* largura do slot do logo */
  --slot-h: 64px;      /* altura do slot do logo */
}

#parceiros.partners-section .section-title{ margin-bottom:6px }
#parceiros.partners-section .section-sub{ margin:0 0 18px }

#parceiros.partners-section .partners-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(233px, 1fr));
  gap:18px;
  align-items:stretch;
  margin:8px 0 0;
  padding:0;
  list-style:none;
}
#parceiros.partners-section .partners-grid > li{
  list-style:none; margin:0; padding:0;
}
#parceiros.partners-section .partners-grid > li::marker{ content:"" }
#parceiros.partners-section .partners-grid > li::before{ content:none !important }

/* CARD ÚNICO */
#parceiros.partners-section .partner figure{
  height:var(--card-h);
  display:flex; flex-direction:column;
  justify-content:center; align-items:center;
  gap:10px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
  transition:border-color .2s, box-shadow .2s, transform .2s;
}
#parceiros.partners-section .partner figure:hover{
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(201,162,39,.12);
  transform:translateY(-2px);
}

/* SLOT DO LOGO — tudo cabe aqui */
#parceiros.partners-section .partner .logo{
  width:var(--slot-w);
  height:var(--slot-h);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;          /* nunca sai fora */
  padding:6px;
}
#parceiros.partners-section .partner .logo img,
#parceiros.partners-section .partner .logo svg{
  width:100%; height:100%;
  max-width:100%; max-height:100%;
  object-fit:contain; object-position:center;
  display:block;
}

/* NOME — dentro do MESMO card (sem borda própria) */
#parceiros.partners-section .partner figcaption{
  width:var(--slot-w);
  margin:0;
  padding:0;
  background:transparent; border:0;
  text-align:center;
  font-size:13px; font-weight:800; color:var(--ink-2);
  line-height:1.2;
}

/* Responsivo */
@media (max-width:520px){
  #parceiros.partners-section{ --card-h:160px; --slot-w:120px; --slot-h:56px }
}


    /* ===========================
      SECTION: CONTACTOS — NOVA ESTRUTURA
      Escopo exclusivo desta secção para evitar conflitos
      =========================== */

    #contactos.contact-pro{
      --ink:#0f1220; --ink-2:#2B2F36; --muted:#5E6773;
      --paper:#ffffff; --wash:#f6f8fb; --line:#e7eaf0;
      --gold:#C9A227; --gold-2:#E4C766; --gold-3:#8F6E2A;
      --radius:18px; --shadow:0 10px 30px rgba(16,18,22,.08);
      background:var(--wash);
      padding:72px 0;
      color:var(--ink);
    }
    #contactos.contact-pro .cp-container{max-width:1180px;margin-inline:auto;padding-inline:20px}
    #contactos.contact-pro .cp-head{text-align:center;margin-bottom:28px}
    #contactos.contact-pro .cp-title{font-size:clamp(24px,2.6vw,32px);font-weight:900;margin:0 0 6px}
    #contactos.contact-pro .cp-sub{color:var(--muted);margin:0}

    /* GRID 3 colunas: Ações (esq) · Formulário (centro, maior) · Info+Mapa (dir)  */
    #contactos.contact-pro .cp-grid{
      display:grid; gap:22px;
      grid-template-columns: 0.9fr 1.4fr 1fr;
      align-items:start;
    }

    /* Cartões base */
    #contactos.contact-pro .cp-card{
      background:#fff; border:1px solid var(--line);
      border-radius:16px; padding:20px; box-shadow:var(--shadow);
    }

    /* AÇÕES RÁPIDAS (coluna esquerda) */
    #contactos.contact-pro .cp-actions{display:grid; gap:12px}
    #contactos.contact-pro .cp-actions a{
      display:flex; align-items:center; gap:10px; justify-content:center;
      padding:12px 16px; border-radius:999px;
      background:linear-gradient(135deg,var(--gold),var(--gold-2));
      color:#1a1a1a; font-weight:900; border:1px solid rgba(0,0,0,.04);
      box-shadow:0 8px 24px rgba(201,162,39,.25); text-decoration:none;
    }
    #contactos.contact-pro .cp-actions small{display:block;color:var(--muted);text-align:center;margin-top:6px}
    #contactos.contact-pro .cp-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
    #contactos.contact-pro .cp-badge{
      font-size:12px; font-weight:800; padding:6px 10px; border-radius:999px;
      border:1px dashed var(--gold); background:#fff; color:var(--ink-2);
    }

    /* FORM (coluna central) */
    #contactos.contact-pro form{display:block}
    #contactos.contact-pro .cp-form grid{display:grid}
    #contactos.contact-pro .cp-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
    #contactos.contact-pro .cp-row-1{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}

    #contactos.contact-pro label{font-weight:800; color:var(--ink-2); font-size:14px}
    #contactos.contact-pro input,
    #contactos.contact-pro select,
    #contactos.contact-pro textarea{
      appearance:none; width:100%;
      padding:12px 14px; border:1px solid var(--line); border-radius:12px;
      background:#fff; color:var(--ink); font-size:15px; outline:none; transition:.2s;
    }
    #contactos.contact-pro textarea{min-height:140px; resize:vertical}
    #contactos.contact-pro input:focus,
    #contactos.contact-pro select:focus,
    #contactos.contact-pro textarea:focus{border-color:var(--gold); box-shadow:0 0 0 4px rgba(201,162,39,.14)}

    #contactos.contact-pro .cp-help{font-size:12px; color:var(--muted)}
    #contactos.contact-pro .cp-submit{
      display:flex; gap:10px; align-items:center; margin-top:6px;
    }
    #contactos.contact-pro .cp-btn{
      display:inline-flex; align-items:center; gap:8px;
      padding:12px 18px; border-radius:999px;
      background:linear-gradient(135deg,var(--gold),var(--gold-2));
      color:#1a1a1a; font-weight:900; border:1px solid rgba(0,0,0,.04); cursor:pointer;
    }
    #contactos.contact-pro .cp-status{font-size:14px}

    /* Chips/segmented para Método Preferido e Horário (nova disposição horizontal) */
    #contactos.contact-pro .cp-segmented{display:flex; gap:8px; flex-wrap:wrap}
    #contactos.contact-pro .cp-segmented input{position:absolute; opacity:0; pointer-events:none}
    #contactos.contact-pro .cp-segmented label{
      padding:10px 14px; border-radius:999px; border:1px solid var(--line);
      background:#fff; color:var(--ink-2); cursor:pointer; font-weight:700;
    }
    #contactos.contact-pro .cp-segmented input:checked + label{
      border-color:var(--gold); box-shadow:0 0 0 4px rgba(201,162,39,.12); color:#0B0C10;
    }

    /* INFO + MAPA (coluna direita) */
    #contactos.contact-pro .cp-info h3{margin:0 0 8px}
    #contactos.contact-pro .cp-map{
      position:relative; overflow:hidden; border-radius:14px; margin-top:10px;
      background: radial-gradient(100% 100% at 0% 0%, rgba(201,162,39,.18), transparent 60%),
                  radial-gradient(100% 100% at 100% 100%, rgba(228,199,102,.22), transparent 60%),
                  linear-gradient(180deg,#fff,#f2f4f8);
      border:1px solid var(--line); height:220px;
    }
    #contactos.contact-pro .cp-map a{
      position:absolute; inset:0; display:grid; place-items:center; text-align:center;
      color:var(--ink-2); font-weight:800; text-decoration:none;
    }
    #contactos.contact-pro .cp-legal{margin-top:12px; font-size:12px; color:var(--muted); line-height:1.5}

    /* Responsivo */
    @media (max-width:1020px){
      #contactos.contact-pro .cp-grid{grid-template-columns:1fr; gap:18px}
      #contactos.contact-pro .cp-actions{order:2}
      #contactos.contact-pro .cp-info{order:3}
      #contactos.contact-pro .cp-form{order:1}
      #contactos.contact-pro .cp-row{grid-template-columns:1fr}
    }

    /* Corrigir estilos: só estilizar inputs de texto, email, tel */
    #contactos.contact-pro input[type="text"],
    #contactos.contact-pro input[type="email"],
    #contactos.contact-pro input[type="tel"],
    #contactos.contact-pro select,
    #contactos.contact-pro textarea{
      appearance:none;width:100%;padding:12px 14px;border:1px solid var(--line);
      border-radius:12px;background:#fff;color:var(--ink);font-size:15px;outline:none;transition:.2s;
    }
    #contactos.contact-pro input[type="text"]:focus,
    #contactos.contact-pro input[type="email"]:focus,
    #contactos.contact-pro input[type="tel"]:focus,
    #contactos.contact-pro select:focus,
    #contactos.contact-pro textarea:focus{
      border-color:var(--gold); box-shadow:0 0 0 4px rgba(201,162,39,.14);
    }

    /* Checkbox de consentimento visível e bonito */
    #contactos.contact-pro .cp-consent{display:flex;align-items:flex-start;gap:10px;font-weight:800;color:var(--ink-2)}
    #contactos.contact-pro .cp-consent input[type="checkbox"]{
      appearance:auto; width:18px; height:18px; min-width:18px; margin-top:2px;
      accent-color: var(--gold); /* cor do visto nos browsers modernos */
      box-shadow:none; border:none; padding:0;
    }
    #contactos.contact-pro .cp-consent span{line-height:1.35}



    /* ============== FOOTER v2 (limpo) ============== */
.site-footer{background:#fff;color:var(--muted, #4b5563);border-top:1px solid var(--line, #e5e7eb)}
.site-footer .container.foot{padding-top:26px;padding-bottom:18px}

/* Tipografia compacta e consistente */
.site-footer{--foot-size: clamp(12px, 1.05vw, 14px);--foot-h4: clamp(14px,1.25vw,16px);--foot-h3: clamp(15px,1.45vw,18px)}
.site-footer p, .site-footer li, .site-footer small{font-size:var(--foot-size);line-height:1.5}
.foot-title{margin:0 0 6px;color:var(--ink, #111827);font-size:var(--foot-h3)}
.site-footer h4{margin:0 0 6px;color:var(--ink, #111827);font-size:var(--foot-h4);font-weight:700}
.site-footer a{color:inherit;text-decoration:none;border-bottom:1px dashed transparent;text-underline-offset:2px}
.site-footer a:hover{color:var(--ink, #111827);border-color:var(--line, #e5e7eb)}
.foot-address{font-style:normal;line-height:1.45;margin:.2rem 0 .35rem}
.foot-contact{line-height:1.5;margin:.2rem 0 .45rem}

/* GRID: 3→2→1 colunas */
.foot-grid{
  display:grid;
  grid-template-columns:minmax(280px,1.1fr) minmax(240px,1fr) minmax(240px,1fr);
  gap:22px 24px;
  align-items:start;
}
@media (max-width:1100px){ .foot-grid{grid-template-columns:1fr 1fr} }
@media (max-width:720px){ .foot-grid{grid-template-columns:1fr} }

/* Links legais */
.foot-links{display:flex;flex-wrap:wrap;gap:6px 12px;margin:.5rem 0 0;padding:0;list-style:none}
.foot-links a{border-bottom:1px dashed var(--line, #e5e7eb)}
.foot-links a:hover{color:var(--gold, #b98a1f);border-color:var(--gold, #b98a1f)}

/* Lista de mutuantes: grelha com bullets normais */
.mutuantes{
  columns:2;           /* duas colunas automáticas em desktop */
  gap:14px;
  margin:.45rem 0 .35rem;
  padding-left:18px;   /* mantém o bullet padrão */
}
@media (max-width:900px){ .mutuantes{columns:1} }
.mutuantes li{break-inside:avoid;margin:0 0 .25rem}

/* Notas legais */
.legal{font-size:calc(var(--foot-size) - 1px);color:#5E6773}
.legal-note{background:#fafafa;border:1px dashed var(--line, #e5e7eb);padding:8px 10px;border-radius:10px;margin-top:6px}

/* Barra inferior */
.foot-bottom{
  margin-top:14px;border-top:1px solid var(--line, #e5e7eb);padding-top:10px;
  display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap
}
.foot-bottom .credit{opacity:.9}
.foot-bottom .credit a{font-weight:800;border-bottom:1px dashed var(--line, #e5e7eb)}
.foot-bottom .credit a:hover{color:var(--gold, #b98a1f);border-color:var(--gold, #b98a1f)}



    /* Acessibilidade */
    .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* ===== FIX HARD — Vantagens & Soluções em cartões ===== */
/* Grelhas */
#vantagens .grid-3{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:18px !important;
}
#solucoes .grid-4{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:14px !important;
}
/* ===== Tiles com background (Soluções) ===== */
#solucoes .tile.bg{
  position: relative;
  overflow: hidden;
  color: #fff;
  isolation: isolate; /* garante stacking limpo */
  min-height: 160px;           /* altura mínima */
  aspect-ratio: 5 / 4;         /* mantém proporção bonita */
}
#solucoes .tile.bg > *{ position: relative; z-index: 2 }
#solucoes .tile.bg h4,
#solucoes .tile.bg p{
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.35);
}

/* Imagem */
#solucoes .tile.bg::before{
  content:"";
  position:absolute; inset:0;
  background: var(--img, none) center/cover no-repeat;
  transform: scale(1.03);
  transition: transform .45s ease;
  z-index: 0;
}

/* Overlay — controla-se por --shade (0–1) */
#solucoes .tile.bg::after{
  content:"";
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(0,0,0,.25), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.45), rgba(0,0,0,.35));
  opacity: var(--shade, .55);
}

/* Hover subtil */
#solucoes .tile.bg:hover::before{ transform: scale(1.07) }

/* Ajustes por posição (opcionais) */
#solucoes .tile.bg.pos-top::before{ background-position: 50% 20% }
#solucoes .tile.bg.pos-left::before{ background-position: 20% 50% }
#solucoes .tile.bg.pos-right::before{ background-position: 80% 50% }

/* Mobile: altura um pouco maior para composição */
@media (max-width:560px){
  #solucoes .tile.bg{ aspect-ratio: 4 / 3; min-height: 180px }
}

/* Cartões: forçar aspeto mesmo que algo tenha sobrescrito antes */
#vantagens .feature,
#solucoes .tile{
  display:block !important;
  border:1px solid var(--line, #e7eaf0) !important;
  border-radius:16px !important;
  padding:20px !important;
  background-color: #fff;
  box-shadow:0 6px 24px rgba(16,18,22,.06) !important;
  transition:border-color .2s, box-shadow .2s, transform .2s !important;
}
#vantagens .feature:hover,
#solucoes .tile:hover{
  border-color:var(--gold, #C9A227) !important;
  box-shadow:0 0 0 6px rgba(201,162,39,.12) !important;
  transform:translateY(-2px) !important;
}

/* Tipografia dentro dos cartões */
#vantagens .feature h4,
#solucoes .tile h4{
  margin:6px 0 6px !important;
  font-size:16px !important;
  color:var(--ink-2, #2B2F36) !important;
}
#vantagens .feature p,
#solucoes .tile p{
  margin:0 !important;
  font-size:14px !important;
  color:var(--muted, #5E6773) !important;
}

/* Ícone pequeno, consistente (o teu <svg class="ico">) */
#vantagens .feature .ico,
#solucoes .tile .ico{
  width:22px !important;
  height:22px !important;
  margin-bottom:8px !important;
  color:var(--gold-3, #8F6E2A) !important;
}

/* Responsivo */
@media (max-width:960px){
  #vantagens .grid-3{ grid-template-columns:1fr !important; }
  #solucoes .grid-4{ grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:560px){
  #solucoes .grid-4{ grid-template-columns:1fr !important; }
}

    /* ===== SOBRE NÓS — grid e cartões ===== */
.about{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.box{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:20px;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
.box h3{ margin:0 0 8px; font-size:18px; color:var(--ink); }
.box h4{ margin:10px 0 6px; font-size:16px; color:var(--ink-2); }
.box p{ margin:0 0 10px; color:var(--muted); }
.box ul{ margin:8px 0 0; padding-left:18px; }
.box li{ margin:4px 0; }
@media (max-width:900px){ .about{ grid-template-columns:1fr } }

/* prevenir scroll horizontal causado por parallax/anim */
html, body{ overflow-x:hidden; }


/* Nav com sombra quando se faz scroll */
.nav.scrolled{
  box-shadow: 0 8px 24px rgba(16,18,22,.08);
}

/* Suavidade/perf: dica ao browser que estes elementos animam */
.reveal, .card, .feature, .tile, .box,
#parceiros .partner figure, #contactos .cp-card, #contactos .cp-map,
.section-title, .section-sub, .cta, .cp-btn { will-change: transform, opacity; }

/* Parallax subtil nos fundos alternados (visível com o JS abaixo) */
.section.alt{ background-position: 50% 0; background-repeat:no-repeat; }

/* Respeitar utilizadores que preferem menos movimento */
@media (prefers-reduced-motion: reduce){
  .nav.scrolled{ box-shadow:none; }
}