/* ==========================================================================
   CARTA PARA O BRASIL - Custom Styles
   Movimento Pró-Brasil
   ========================================================================== */

/* Font Faces */
@font-face {
  font-family: 'MathaVariable';
  src: url('../assets/fonts/mathavariable-semibold.otf') format('opentype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* AcuminVariable substituída por Adobe Typekit (acumin-pro-condensed) via link no HTML */

@font-face {
  font-family: 'GothamOffice';
  src: url('../assets/fonts/GothamOffice-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GothamSSm';
  src: url('../assets/fonts/GothamSSm-Book.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Design Tokens */
:root {
  --color-bg: #1a3d7a;
  --color-green: #009739;
  --color-gold: #ffc429;
  --color-text: #ffffff;
  --color-green-section: #009739;

  --font-display: 'MathaVariable', Georgia, serif;
  --font-body: 'acumin-pro-condensed', 'Helvetica Neue', Arial, sans-serif;
  --font-logo-bold: 'GothamOffice', 'Arial Black', sans-serif;
  --font-logo-book: 'GothamSSm', 'Helvetica Neue', sans-serif;
}

/* Base */
html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-style: normal !important;
  line-height: 1.6;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
}

 

/* Manifesto Container */
.manifesto {
  max-width: 720px;
  margin: 0 auto;
  padding: 30px 24px 80px;
}

/* Title */
.manifesto__title {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-gold);
  font-size: clamp(2.4rem, 6vw, 3.8rem);
  line-height: 1.1;
  margin-bottom: 48px;
  text-transform: uppercase;

  
}

.manifesto__title::before {
  content: "";
  display: block;
  width: 200px;
  height: 4px;
  margin-bottom: 50px;
  border-bottom: 10px solid var(--color-green);
}

/* Body Paragraphs */
.manifesto__body p {
  font-size: clamp(1.2rem, 2.2vw, 1.35rem);
  line-height: 1.1;
  /* margin-bottom: 1em; */
  margin-left: 20px;
  color: var(--color-text);
}

.manifesto__body p strong {
  font-weight: 700;
}

/* Green Section (Highlight) - alinhada à esquerda, margem à direita */
.manifesto__green-section {
  background-color: var(--color-green-section);
  margin: 24px 0 48px calc(-50vw + 50%);
  padding: 24px 24px 24px calc(50vw - 50%);
  margin-right: 0px;
  border-radius: 0;
}

.manifesto__green-section p {
  font-size: clamp(1.2rem, 2.2vw, 1.35rem);
  line-height: 1.1;
  /* margin-bottom: 1.2em; */
  margin-left: 20px;
  color: var(--color-text);
}

.manifesto__green-section .cta-text {
  font-weight: 700;
  font-size: clamp(1.2rem, 2.2vw, 1.35rem);
  line-height: 1.1;
  text-transform: uppercase;
  margin-bottom: 0;
}

/* Organizations */
.manifesto__orgs {
  margin-top: 24px;
  margin-left: 20px;
  padding-top: 0;
}

.manifesto__orgs ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.manifesto__orgs li {
  font-size: clamp(1rem, 2.2vw, 1.35rem);
  line-height: 1.1;
  color: var(--color-text);
  opacity: 0.9;
}

/* Organizations Full List */
.manifesto__orgs-list {
  margin-top: 32px;
  /* margin-left: 70px; */
}

.manifesto__orgs-list .orgs-list-text {
  font-size: clamp(0.77rem, 1.4vw, 0.86rem);
  line-height: 1.15;
  color: var(--color-text);
  opacity: 0.75;
  text-align: justify;
}

/* Footer / Logo */
.manifesto__footer {
  margin-top: 64px;
  padding-top: 24px;
  text-align: center;
  border-top: 1px solid var(--color-green);
}

.manifesto__footer img {
  width: 140px;
  height: auto;
}

/* Animations */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

/* Tablet */
@media (min-width: 768px) {
  .manifesto {
    padding: 30px 40px 100px;
  }

  .manifesto__title {
    margin-bottom: 56px;
  }

  .manifesto__green-section {
    margin: 24px 40px 56px calc(-50vw + 50%);
    padding: 22px 40px 22px calc(50vw - 50%);
    margin-right: -50px;
  }

  .manifesto__footer img {
    width: 160px;
  }
}

/* Desktop */
@media (min-width: 1024px) {
  .top-bar {
    height: 16px;
  }

  .manifesto {
    max-width: 720px;
    padding: 30px 0 120px;
  }

  .manifesto__title {
    margin-bottom: 64px;
  }

  .manifesto__body p {
    font-size: clamp(1rem, 2.2vw, 1.25rem);
    line-height: 1.1;
    /* margin-bottom: 1em; */
    margin-left: 70px;
    color: var(--color-text);
  }
  
  .manifesto__green-section {
    margin: 24px -130px 64px calc(-50vw + 50%);
    padding: 20px 60px 20px calc(50vw - 50%);
  }

  .manifesto__green-section p {
    font-size: clamp(1rem, 2.2vw, 1.25rem);
    line-height: 1.1;
    /* margin-bottom: 1.2em; */
    margin-left: 70px;
    color: var(--color-text);
  }

  .manifesto__orgs {
    margin-top: 56px;
    margin-left: 70px;
  } 

  .manifesto__footer {
    margin-top: 80px;
  }

  .manifesto__footer img {
    width: 180px;
  }
}

/* Large Screens */
@media (min-width: 1400px) {
  .manifesto {
    max-width: 800px;
  }
}
