
body{background:#f6f8fa;color:#222;margin:0;font-family:'Roboto', 'Segoe UI',Arial,sans-serif;scroll-behavior:smooth;}
section{max-width:1460px;margin:36px auto 0;background:#fff;padding:32px 26px;border-radius:15px;box-shadow:0 3px 20px rgba(50,70,100,.11);}
section h2{margin:0;color:#175887;border-bottom:2px solid #e4eef7;padding-bottom:8px;font-size:1.5em;}


:root{--accent:#175887;--bar-height:80px;}

:root {

  --color-primary:   #4a3ff5; 
  --color-secondary: #4ce495; 


  --color-accent:    #30d2b3;  
  --color-bg-light:  #f6fbff; 
  --color-text:      #003c57; 
  --color-white:     #ffffff;
}

html{scroll-padding-top:var(--bar-height);} 

.site-header{position:fixed;inset:0 0 auto;height:var(--bar-height);padding:0 24px;display:flex;align-items:center;justify-content:space-between;z-index:1000;
             mix-blend-mode:normal;
             color:#222;
             background:#fff;
             transition:background .35s,box-shadow .35s;}
.site-header.scrolled{background:#fff;color:#222;mix-blend-mode:normal;box-shadow:0 2px 6px rgba(0,0,0,.08);}

.branding{display:flex;align-items:center;gap:.55rem;}

.site-header .logo{height:45px;width:auto;mix-blend-mode:normal;filter:none;flex-shrink:0;}

.site-header .brand-name{display:none!important;}

.menu-toggle{display:flex;flex-direction:column;justify-content:space-between;width:32px;height:22px;border:0;background:none;cursor:pointer;}
.menu-toggle span{height:3px;background:currentColor;border-radius:2px;transition:transform .3s,opacity .3s;}
.menu-toggle.open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
.menu-toggle.open span:nth-child(2){opacity:0;}
.menu-toggle.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}

.site-nav{position:fixed;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.8rem;background:#0c0c0c;
          opacity:0;pointer-events:none;transition:opacity .4s;}
.site-nav.open{opacity:1;pointer-events:auto;}
.site-nav ul{list-style:none;margin:0;padding:0;}
.site-nav a{color:#fff;text-decoration:none;font-size:clamp(3.2rem, 9vw, 8rem);font-weight:600;letter-spacing:.08em;text-transform:uppercase;}
@media(min-width:900px){
  .menu-toggle{display:none;}
  .site-nav{position:static;opacity:1;pointer-events:auto;flex-direction:row;background:none;height:var(--bar-height);}
  .site-nav ul{display:flex;gap:2rem;}
  .site-nav a{color:inherit;font-size:.95rem;letter-spacing:.07em;}
}


.hero{ min-height:20vh; padding:calc(var(--bar-height) + 2vh) 4vw 4vh;background:#0065BD;display:flex;flex-direction:column;justify-content:center;}
.hero-brand{font-size:clamp(3rem,4vw,6rem);font-weight:800;letter-spacing:.05em;text-transform:uppercase;line-height:.85;color:#fff; margin:0;
            animation:slideUp .8s cubic-bezier(.4,.8,.4,1) forwards;}
.hero-slogan{margin-top:1.2rem;font-size:clamp(1.1rem,2.4vw,1.8rem);max-width:38ch;letter-spacing:.04em;line-height:1.25;color:#fff;}
@keyframes slideUp{to{transform:translateY(0);}}


.topics{column-count:3;column-gap:1.5rem;margin:2rem 0;}
@media(max-width:900px){.topics{column-count:2;}}
@media(max-width:600px){.topics{column-count:1;}}
.topic{display:block;background:#e6f3ff;border:1px solid #c4e1ff;border-radius:12px;padding:1.25rem 1.5rem;margin-bottom:1.5rem;
      text-decoration:none;color:inherit;break-inside:avoid;transition:transform .15s,box-shadow .15s;}
.topic:hover,.topic:focus-visible{transform:translateY(-4px);box-shadow:0 8px 18px rgba(0,0,0,.10);outline:none;}
.topic h3{margin:0 0 .5rem;font-size:1.1em;}
.topic p{margin:0;font-size:.95em;line-height:1.4;}


.team-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem;}
@media(min-width:960px){.team-list{grid-template-columns:repeat(3,1fr);}}
.team-list .column{display:contents;}

.member{background:#f3f8fc;border-radius:13px;box-shadow:0 2px 7px #ecf1f9;padding:19px 10px;text-align:center;transition:transform .2s,box-shadow .2s,background .2s;}
.member:hover{box-shadow:0 6px 20px #bcd5ec;transform:translateY(-2px) scale(1.02);background:#eaf4fd;}
.member img{width:148px;height:148px;border-radius:50%;object-fit:cover;border:3px solid #bcd5ec;max-width:100%;}
.member h3{margin:10px 0 4px;font-size:1.13em;}
.member p{margin:0;font-size:.98em;color:#444;}


.member .bio{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;transition:max-height .3s;}
.member.expanded .bio{-webkit-line-clamp:unset;}
.member .toggle{display:block;margin-top:8px;font-size:.9em;color:#175887;cursor:pointer;text-decoration:underline;}


.contacts{background:#e6f9f0;padding:18px 22px;border-radius:10px;font-size:1.09em;}
footer{text-align:center;margin:35px 0 10px;color:#888;font-size:.97em;}


a[href^="mailto:"]{display:none!important;}
a[href^="mailto:"]+br,a[href^="mailto:"] strong{display:none!important;}

.site-header .logo{
  height:75px;
  width:auto;
  mix-blend-mode:normal;        
  filter:drop-shadow(0 0 2px rgba(0,0,0,.35));
}

.btn-back{
  display:inline-block;
  background:#e6f1fa;
  color:#175887;
  padding:6px 14px;
  border:1px solid #bcd5ec;
  border-radius:32px;
  font-weight:600;
  text-decoration:none;
  transition:background .15s,box-shadow .15s;
}
.btn-back:hover,
.btn-back:focus-visible{
  background:#d7e9fb;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
  outline:none;
}


.intro-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: flex-start;
  padding: 3rem 6vw;
  background: #f9fcff;
  border-radius: 16px;
  margin: 2rem auto;
  max-width: 1460px;
}

.intro-grid h2 {
  color: #175887;
  font-size: clamp(1.8rem, 4vw, 2.4rem);
  margin-top: 0;
}

.intro-grid p {
  font-size: 1.2rem;   
  line-height: 1.75;
}

.intro-right ul {
  font-size: 1.2rem;   
  line-height: 1.5;
  list-style: disc;
  margin-left: 1.5em;
  padding: 0;
}
@media (max-width: 900px) {
  .intro-grid {
    grid-template-columns: 1fr;
    text-align: left;
  }
}

.subheading {
  display: block;
  font-size: 0.82em;
  font-weight: 500;
  color: #175887;
  margin-top: 0.2em;
}

#topicos {
  background-color: #f4f9fd;
  padding: 60px 0;
}

.section-title {
  text-align: center;
  font-size: 2em;
  margin-bottom: 0.2em;
  color: #003c57;
}

.section-subtitle {
  text-align: left;
  font-size: 1em;
  color: #666;
  margin-bottom: 40px;
}

.topic-grid {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

.topic-card {
  background: white;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  transition: transform 0.2s ease;
}

.topic-card:hover {
  transform: translateY(-4px);
}

.topic-card img {
  width: 60px;
  height: auto;
  margin-bottom: 15px;
}

.topic-card h3 {
  color: #0065BD;
  font-size: 1.2em;
  margin: 0.5em 0;
}

.topic-card p {
  font-size: 0.95em;
  color: #333;
}

.topic-grid.grid-3plus2 {
  display: grid;
  gap: 30px;
  grid-template-columns: repeat(3, 1fr);
}

/* Cartões 1, 2 e 3 seguem o fluxo normal da grelha */
/* Cartões 4 e 5 são centrados individualmente */
.topic-grid.grid-3plus2 .topic-card:nth-child(4),
.topic-grid.grid-3plus2 .topic-card:nth-child(5) {
  grid-column: auto;
  margin: 0 auto;
  width: 100%;
  max-width: 320px;
}

/* Responsivo: 1 coluna em mobile */
@media (max-width: 768px) {
  .topic-grid.grid-3plus2 {
    grid-template-columns: 1fr;
  }

  .topic-grid.grid-3plus2 .topic-card:nth-child(4),
  .topic-grid.grid-3plus2 .topic-card:nth-child(5) {
    margin: 0;
    max-width: 100%;
  }
}

.site-nav a:hover,
.site-nav a:focus-visible {
  color: #175887;
  text-decoration: underline;
}

.menu-toggle:focus-visible,
.btn-back:focus-visible {
  outline: 2px solid #175887;
  outline-offset: 4px;
}

@media (max-width: 400px) {
  .hero-slogan {
    font-size: 1rem;
    margin-top: 0.8rem;
  }

  .intro-grid {
    padding: 1.5rem 4vw;
  }
}

#agenda .timeline {
  position: relative;
  margin: 2rem 0;
  padding-left: 2.5rem;
  list-style: none;
}

#agenda .timeline::before {
  content: '';
  position: absolute;
  left: 1rem;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--accent);
}

#agenda .timeline li {
  position: relative;
  margin-bottom: 2rem;
  padding-left: 1.5rem;
}

#agenda .timeline li::before {
  content: '';
  position: absolute;
  left: -0.5rem;
  top: 0.2rem;
  width: 12px;
  height: 12px;
  background: white;
  border: 3px solid var(--accent);
  border-radius: 50%;
}

#agenda .timeline .date {
  display: block;
  font-weight: bold;
  color: #175887;
  margin-bottom: 0.3rem;
}

#agenda .timeline p {
  margin: 0;
  line-height: 1.4;
}


.agenda-card,
#manifesto {
  background: var(--color-bg-light);
  border: 2px solid var(--color-secondary);
  border-radius: 0.5rem;
  padding: 1.5rem;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
}
.agenda-card h2,
#manifesto h2 {
  color: var(--color-primary);
}
.agenda-card p,
#manifesto p {
  color: var(--color-text);
}


#agenda .timeline {
  position: relative;
  margin: 2rem 0;
  padding-left: 2.5rem;
  list-style: none;
}
#agenda .timeline::before {
  content: '';
  position: absolute;
  left: 1rem; top: 0; bottom: 0;
  width: 4px;
  background: var(--color-primary);
}
#agenda .timeline li {
  position: relative;
  margin-bottom: 2rem;
  padding-left: 1.5rem;
}
#agenda .timeline li::before {
  content: '';
  position: absolute;
  left: -0.5rem; top: 0.2rem;
  width: 12px; height: 12px;
  background: var(--color-white);
  border: 3px solid var(--color-primary);
  border-radius: 50%;
}
#agenda .timeline .date {
  display: block;
  font-weight: bold;
  color: var(--color-secondary);
  margin-bottom: 0.3rem;
}
#agenda .timeline p {
  margin: 0;
  line-height: 1.4;
  color: var(--color-text);
}


.manifesto-summary {
  background: var(--color-white);
  border-left: 6px solid var(--color-secondary);
  padding: 1.5rem 1.25rem;
  border-radius: 0.375rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  margin-top: 1rem;
}
.manifesto-summary p {
  font-size: 1.05rem;
  line-height: 1.5;
  color: var(--color-text);
}
.manifesto-slogan h3 {
  color: var(--color-primary);
  font-size: 1.5rem;
  margin: 0.25rem 0;
  text-align: center;
}


#programa-completo {
  background: var(--color-bg-light);
  border-bottom: 4px solid var(--color-primary);
  padding: 2rem 1rem;
  text-align: center;
}
#programa-completo h1 {
  color: var(--color-primary);
  margin: 0;
  font-size: 2rem;
}
#programa-completo .btn-pdf {
  display: inline-block;
  margin-top: 0.5rem;
  background: var(--color-secondary);
  color: var(--color-white);
  padding: 0.5rem 1rem;
  border: 2px solid var(--color-secondary);
  border-radius: 0.375rem;
  text-decoration: none;
  font-weight: bold;
  transition: background 0.2s, border-color 0.2s;
}
#programa-completo .btn-pdf:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
}


section h2 {
  color: var(--color-primary);
  border-left: 4px solid var(--color-secondary);
  padding-left: 0.5rem;
  margin: 2rem 1rem 1rem;
  font-size: 1.75rem;
}
section p {
  color: var(--color-text);
  line-height: 1.6;
  margin: 0 1rem 1rem;
  max-width: 800px;
}


.back-to-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 44px;
  height: 44px;
  background: var(--color-primary);
  color: var(--color-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2em;
  text-decoration: none;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  transition: background 0.2s;
}

.back-to-top:hover {
  background: var(--color-secondary);
}


footer {
  text-align: center;
  padding: 1rem;
  background: var(--color-bg-light);
  color: var(--color-text);
  font-size: 0.9rem;
  margin-top: 2rem;
}

.pdf-button {
  display: inline-block;
  background-color: #e6f1fa;
  color: #175887;
  padding: 10px 20px;
  border: 1px solid #bcd5ec;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  font-size: 1.1rem;
  transition: background 0.2s, box-shadow 0.2s;
}

.pdf-button:hover,
.pdf-button:focus-visible {
  background-color: #d7e9fb;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
  outline: none;
}

@media (max-width: 600px) {
  .pdf-button {
    font-size: 1rem;
    padding: 8px 16px;
  }
}