/* Design Tokens */
:root{
  --bg:#f0f4f8; --bg-soft:#e8f0f8; --card:#fff; --ink:#233042;
  --brand:#0a3d62; --brand-2:#0d63ff; --muted:#6b7a90;
  --shadow:0 10px 30px rgba(0,0,0,.08); --radius:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);background:linear-gradient(180deg,var(--bg-soft),var(--bg));}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{width:min(1200px,92vw);margin-inline:auto}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{position:fixed;left:16px;top:16px;background:#fff;color:#000;padding:.5rem .75rem;border-radius:8px;box-shadow:var(--shadow);z-index:10000}

/* Barra de progresso */
.progress{position:fixed;inset:0 0 auto 0;height:4px;background:transparent;z-index:1200}
.progress__bar{width:0;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-2))}

/* Topbar */
.topbar{position:fixed;inset:0 0 auto 0;background:rgba(255,255,255,.92);backdrop-filter:saturate(140%) blur(8px);box-shadow:0 4px 16px rgba(0,0,0,.06);z-index:1100}
.topbar__wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem 2rem}
.brand img{height:40px}
.menu-toggle{display:none;font-size:2rem;background:none;border:none;cursor:pointer}
.menu{display:flex;align-items:center;gap:1rem}
.menu a{font-weight:600;padding:.5rem .75rem;border-radius:12px;transition:transform .2s ease,background .2s ease,color .2s ease}
.menu a:hover{transform:translateY(-1px);background:#f1f6ff;color:var(--brand-2)}
.btn{display:inline-block;padding:.9rem 1.2rem;border-radius:14px;font-weight:700;user-select:none;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}
.btn--small{padding:.55rem .9rem;border-radius:12px}
.btn--primary{background:radial-gradient(100% 100% at 0% 0%,var(--brand) 0%,var(--brand-2) 100%);color:#fff;box-shadow:0 10px 24px rgba(13,99,255,.25)}
.btn--primary:hover{transform:translateY(-2px)}
.btn--ghost{border:2px solid var(--brand);color:var(--brand);background:#fff}
.btn--ghost:hover{background:var(--brand);color:#fff}

/* Hero */
.hero{padding-top:72px;text-align:center}
.hero__media{position:relative}
.hero__img{width:min(1200px,92vw);height:auto;border-radius:26px;box-shadow:var(--shadow);margin:24px auto}
.hero__overlay{margin-top:-6px}
.hero__overlay h1{font-size:clamp(1.6rem,3.2vw,3rem);color:#0a2540}
.hero__overlay .accent{color:var(--brand-2)}
.hero__cta{display:flex;gap:12px;justify-content:center;margin-top:10px}
.hero__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;width:min(1200px,92vw);margin:18px auto 0}
.stat{background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:14px;display:grid;place-items:center;gap:4px;box-shadow:var(--shadow)}
.stat img{width:36px;height:36px}
.stat div{display:flex;align-items:baseline;gap:6px;font-weight:800}
.counter{font-size:1.8rem;color:var(--brand-2)}

/* Sections */
.section{padding:48px 0}
.section__header{margin-bottom:18px}
.section__header.center{text-align:center}
.section__header h2{font-size:clamp(1.4rem,2.4vw,2.2rem);color:var(--brand)}

/* About */
.about__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.about__card{background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.about__card h3{margin:0 0 6px 0}
.about__card ul{margin:0;padding-left:18px}
.about__text{max-width:900px;margin:14px auto 0;background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:18px;box-shadow:var(--shadow);text-align:justify}

/* Áreas */
.areas__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.area{background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:18px;box-shadow:var(--shadow);text-align:center}
.area img{width:44px;height:44px;margin:auto}

/* Projetos */
.filters{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:12px}
.chip{border:1px solid #cfe0ff;background:#fff;border-radius:999px;padding:.4rem .9rem;cursor:pointer}
.chip.is-active{background:linear-gradient(90deg,#e9f0ff,#f3f7ff);border-color:#bcd1ff}
.chip--link{border-style:dashed}
.grid-projects{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card.project{background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:10px;box-shadow:var(--shadow);transition:transform .25s ease,box-shadow .25s ease,filter .25s ease;transform-style:preserve-3d}
.card.project img{width:100%;height:420px;object-fit:cover;border-radius:12px}
.card.project figcaption{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:8px}
.card.project h3{font-size:1rem;margin:0}
.card.project small{color:var(--muted)}
.card.project:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(0,0,0,.14)}

/* Lightbox */
.lightbox{border:none;border-radius:18px;box-shadow:0 24px 60px rgba(0,0,0,.4);padding:0;max-width:min(92vw,1100px)}
.lightbox::backdrop{background:rgba(0,0,0,.6)}
.lightbox img{max-width:100%;height:auto;border-radius:18px}
.lightbox__close{position:absolute;right:10px;top:8px;border:none;background:rgba(255,255,255,.85);border-radius:999px;padding:.35rem .6rem;cursor:pointer}

/* Depoimentos */
.testimonials{display:grid;grid-auto-flow:column;grid-auto-columns:min(280px,80%);gap:12px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}
.testimonial{scroll-snap-align:center;background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:16px;box-shadow:var(--shadow)}

/* Contacto */
.contact__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.contact__card{background:var(--card);border:1px solid #e6edf6;border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.contact__actions{display:flex;gap:10px;margin-top:10px}
.contact__map{min-height:280px}
.map__placeholder{display:grid;place-items:center;width:100%;height:100%;min-height:280px;border:2px dashed #cfe0ff;border-radius:16px;background:#fff;color:#2a3b55;gap:8px;cursor:pointer}
.map__placeholder img{width:36px;height:36px}

/* Footer */
.footer{background:radial-gradient(120% 120% at 0% 0%,#0a3d62 0%,#062a44 100%);color:#fff;padding:26px 0;margin-top:24px;text-align:center}

/* Top button */
.top-btn{position:fixed;right:20px;bottom:20px;border:none;background:#fff;color:#000;border-radius:999px;padding:.6rem .9rem;box-shadow:0 10px 24px rgba(0,0,0,.20);cursor:pointer}
.top-btn:hover{background:var(--brand-2);color:#fff}

/* Social (horizontal) */
.section--contact .social{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin-top:14px;
  flex-wrap:nowrap;
  overflow-x:auto;
  padding-bottom:6px;
}

.section--contact .social a{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e6edf6;
  background:#fff;
  border-radius:12px;
  padding:6px;
  box-shadow:var(--shadow);
  transition:transform .2s ease;
}

.section--contact .social a:hover{
  transform:translateY(-2px);
}

.section--contact .social img{
  width:36px;
  height:36px;
  display:block;
}


/* Reveals */
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
.reveal{opacity:0;transform:translateY(18px)}
.reveal.active{animation:fadeUp .7s cubic-bezier(.2,.8,.2,1) forwards}

/* Responsivo */
@media (max-width: 1024px){
  .grid-projects{grid-template-columns:repeat(2,1fr)}
  .about__grid{grid-template-columns:1fr 1fr}
  .areas__grid{grid-template-columns:1fr 1fr}
  .hero__stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 760px){
  .menu-toggle{display:block}
  .menu{position:absolute;top:64px;right:16px;display:none;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid #e6edf6;border-radius:14px;padding:.6rem;box-shadow:0 12px 28px rgba(0,0,0,.18)}
  .menu a{width:100%}
  .menu.active{display:flex}
  .grid-projects{grid-template-columns:1fr}
  .about__grid,.areas__grid,.contact__grid{grid-template-columns:1fr}
}

/* Acessibilidade e redução de movimento */
.card.project:focus{outline:3px solid #8ec5ff;outline-offset:4px}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal.active{animation:none;opacity:1;transform:none}
  .card.project,.btn,.area,.stat{transition:none !important}
}


/* CSS PARA O NATAL - COMENTAR RESTO DO ANO */
/* .snow {
  pointer-events: none;
  position: fixed;
  inset: 0;
  overflow: hidden;
  z-index: 9999;
}

.snowflake {
  position: absolute;
  top: -10px;
  font-size: 10px;
  opacity: 0.8;
  animation-name: fall;
  animation-timing-function: linear;
}

@keyframes fall {
  0% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(110vh);
  }
} */

/* Luzes de Natal no topo */
/* .xmas-lights {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  padding-top: 8px;
  display: flex;
  justify-content: center;
  gap: 10px;
  pointer-events: none;
  z-index: 1150;
}

.xmas-lights::before {
  content: '';
  position: absolute;
  top: 4px;
  left: 0;
  width: 100%;
  height: 2px;
  background: rgba(35,48,66,0.25);
}

.xmas-lights span {
  position: relative;
  width: 12px;
  height: 18px;
  border-radius: 50% 50% 60% 60%;
  background: #ff5252;
  box-shadow:
    0 4px 8px rgba(0,0,0,.25),
    0 0 12px rgba(255,82,82,.9);
  animation: xmasBlink 1.6s infinite alternate;
  transform-origin: top center;
}

.xmas-lights span::before {
  content: '';
  position: absolute;
  top: -4px;
  left: 50%;
  width: 10px;
  height: 6px;
  transform: translateX(-50%);
  border-radius: 3px;
  background: #555;
}

.xmas-lights span:nth-child(3n+1) {
  background: #ffeb3b;
  box-shadow:
    0 4px 8px rgba(0,0,0,.25),
    0 0 12px rgba(255,235,59,.9);
  animation-delay: .1s;
}

.xmas-lights span:nth-child(3n+2) {
  background: #4caf50;
  box-shadow:
    0 4px 8px rgba(0,0,0,.25),
    0 0 12px rgba(76,175,80,.9);
  animation-delay: .3s;
}

.xmas-lights span:nth-child(3n+3) {
  background: #03a9f4;
  box-shadow:
    0 4px 8px rgba(0,0,0,.25),
    0 0 12px rgba(3,169,244,.9);
  animation-delay: .5s;
}

@keyframes xmasBlink {
  0% {
    opacity: .35;
    transform: translateY(0) rotateZ(0deg);
  }
  100% {
    opacity: 1;
    transform: translateY(3px) rotateZ(5deg);
  }
} */

/* Contagem decrescente para o Natal */
/* .xmas-countdown {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.94);
  color: var(--ink);
  font-size: .85rem;
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
}

.xmas-countdown__time {
  font-weight: 700;
  color: var(--brand-2);
}

.xmas-countdown__label,
.xmas-countdown__suffix {
  opacity: .85;
} */

/* Banner de Boas Festas */
/* .xmas-banner {
  position: fixed;
  right: 16px;
  bottom: 16px;
  max-width: 320px;
  padding: 12px 14px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.26);
  display: flex;
  gap: 10px;
  align-items: flex-start;
  z-index: 1300;
  animation: xmasBannerIn .7s cubic-bezier(.2,.8,.2,1) both;
}

.xmas-banner__icon {
  font-size: 1.5rem;
  line-height: 1;
  margin-top: 2px;
}

.xmas-banner__text {
  font-size: .9rem;
}

.xmas-banner__text strong {
  display: block;
  margin-bottom: 2px;
  color: var(--brand);
}

.xmas-banner__close {
  margin-left: auto;
  border: none;
  background: transparent;
  font-size: 1rem;
  cursor: pointer;
  color: var(--muted);
}

.xmas-banner__close:hover {
  color: var(--brand-2);
}

@keyframes xmasBannerIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
} */

/* Botão compacto após fechar banner */
/* .xmas-banner__toggle {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: none;
  background: radial-gradient(100% 100% at 0% 0%, var(--brand) 0%, var(--brand-2) 100%);
  color: #fff;
  box-shadow: 0 16px 30px rgba(0,0,0,.25);
  cursor: pointer;
  z-index: 1300;
  display: grid;
  place-items: center;
}

.xmas-banner__toggle[hidden] {
  display: none;
} */

/* Ajustes para ecrãs pequenos */
/* @media (max-width: 760px){
  .xmas-banner{
    left: 12px;
    right: 12px;
  }
} */

/* Respeitar redução de movimento */
/* @media (prefers-reduced-motion: reduce){
  .snowflake{
    animation-duration: 0s !important;
  }
  .xmas-lights span,
  .xmas-banner{
    animation:none !important;
  }
} */

/* Botões em modo Natal – efeito bem visível */
/* .btn--primary,
.btn--ghost {
  position: relative;
  overflow: hidden;
} */

/* Glow forte ao passar o rato */
/* .btn--primary:hover,
.btn--ghost:hover {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.7),
    0 0 24px rgba(255,0,0,.45),
    0 0 40px rgba(13,99,255,.45);
} */

/* “Shine” a passar no hover */
/* .btn--primary::before,
.btn--ghost::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(255,255,255,.9) 50%,
    transparent 100%
  );
  transform: translateX(-130%);
  opacity: 0;
  pointer-events: none;
}

.btn--primary:hover::before,
.btn--ghost:hover::before {
  animation: xmasButtonShine 0.9s forwards;
}

@keyframes xmasButtonShine {
  0% {
    transform: translateX(-130%);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    transform: translateX(130%);
    opacity: 0;
  }
} */

/* Confetti que sai dos botões ao clicar */
/* .xmas-confetti {
  position: fixed;
  width: 7px;
  height: 10px;
  border-radius: 2px;
  background: #ff5252;
  pointer-events: none;
  z-index: 1400;
  animation: xmasConfetti 650ms ease-out forwards;
}

@keyframes xmasConfetti {
  0% {
    opacity: 1;
    transform: translate3d(0,0,0) rotate(0deg);
  }
  100% {
    opacity: 0;
    transform: translate3d(var(--tx, 0), var(--ty, -40px), 0) rotate(200deg);
  }
} */

/* ATÉ AQUI */