:root{
  --black:#060604;
  --black2:#0b0906;
  --gold:#d99a27;
  --gold2:#f0b84d;
  --cream:#f4ecdf;
  --brown:#1d0d03;
  --white:#fffaf2;
  --line:rgba(217,154,39,.32);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--white);font-family:Montserrat,Arial,sans-serif}
a{color:inherit;text-decoration:none}
.container{width:min(1180px,calc(100% - 48px));margin:auto}
.eyebrow{margin:0 0 18px;color:var(--gold2);font-size:12px;font-weight:700;letter-spacing:.35em}

/* Cabeçalho controlado exclusivamente por header.css */


.hero{position:relative;overflow:hidden;background:
radial-gradient(circle at 88% 45%,rgba(106,50,8,.32),transparent 30%),
linear-gradient(110deg,#050504 0%,#080604 66%,#1c0d03 100%);border-bottom:1px solid var(--line)}
.hero-grid{position:relative;min-height:575px;display:grid;grid-template-columns:1.05fr .78fr;align-items:center;gap:100px}
.hero-copy{position:relative;z-index:3;padding:70px 0}
.hero h1{margin:0;font-family:"Cormorant Garamond",serif;font-size:100px;font-weight:600;line-height:.75;letter-spacing:-.04em}
.hero h1 em{display:block;color:var(--gold);font-weight:500;margin-top:25px}
.hero-subtitle{max-width:650px;margin:38px 0 30px;font-family:"Cormorant Garamond",serif;font-size:39px;font-style:italic;line-height:1.05}
.gold-line{width:78px;height:1px;background:var(--gold);margin:0 0 28px}
.hero-text{font-size:13px;margin:0 0 30px}
.outline-btn{display:inline-block;padding:17px 22px}
.photo-frame{position:relative;z-index:3;width:390px;aspect-ratio:4/5;justify-self:center;padding:6px;border:2px solid var(--gold);box-shadow:0 0 24px rgba(217,154,39,.16),inset 0 0 22px rgba(217,154,39,.08)}
.frame-inner{height:100%;border:1px solid rgba(240,184,77,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,rgba(32,19,10,.95),rgba(13,10,7,.85));text-align:center}
.photo-symbol{font-family:serif;color:#c58c3b;font-size:55px;line-height:1}
.frame-inner strong{margin-top:14px;color:#e3ad5d;font-size:15px;letter-spacing:.2em}
.frame-inner small{margin-top:11px;color:#b98545;font-size:8px;letter-spacing:.3em}
.lion{
  position:absolute;
  right:-40px;
  top:0;
  width:58%;
  height:100%;
  background:
    linear-gradient(90deg,rgba(5,5,4,1) 0%,rgba(5,5,4,.45) 24%,rgba(5,5,4,.04) 58%),
    url("leao.jpg") 62% center/cover no-repeat;
  opacity:.88;
  z-index:1;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.55) 18%,#000 42%);
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.55) 18%,#000 42%);
}
.hero:after{content:"";position:absolute;width:560px;height:560px;border:1px solid rgba(217,154,39,.12);border-radius:50%;right:-220px;top:-170px;box-shadow:0 0 0 80px rgba(217,154,39,.025)}

.about{background:var(--cream);color:#17110d}
.about-inner{max-width:1040px;text-align:center;padding:60px 0 70px}
.about .eyebrow{margin-bottom:24px}
.about h2{margin:0 auto 30px;font-family:"Cormorant Garamond",serif;font-size:60px;font-weight:500;line-height:1}
.about p{max-width:900px;margin:0 auto 20px;font-size:16px;line-height:1.8}
.about blockquote{position:relative;max-width:720px;margin:38px auto 0;padding:5px 25px;font-family:"Cormorant Garamond",serif;font-size:23px;font-style:italic}
.about blockquote:before{content:"";position:absolute;left:0;top:-4px;width:1px;height:40px;background:var(--gold)}

.journey,.pillars{background:#070604}
.journey{padding:72px 0 60px;border-bottom:1px solid var(--line)}
.section-heading{text-align:center}
.section-heading h2{margin:0 0 52px;font-family:"Cormorant Garamond",serif;font-size:46px;font-weight:500}
.timeline{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.timeline:before{content:"";position:absolute;left:9%;right:9%;top:34px;height:1px;background:var(--gold)}
.milestone{text-align:center;position:relative;z-index:2}
.icon-circle{width:68px;height:68px;margin:0 auto 17px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;background:#070604}
.icon-circle svg,.pillar svg{fill:none;stroke:var(--gold2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-circle svg{width:37px;height:37px}
.milestone h3,.pillar h3{font-size:11px;line-height:1.35;letter-spacing:.04em}
.milestone p{max-width:150px;margin:10px auto 0;color:#ddd2c6;font-size:9px;line-height:1.55}

.pillars{padding:45px 0 55px}
.pillars-title{margin-bottom:26px}
.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr) 1.05fr}
.pillar{min-height:175px;text-align:center;padding:10px 35px;border-right:1px solid var(--line)}
.pillar svg{width:43px;height:43px;margin-bottom:8px;stroke-width:2}
.pillar p{font-size:10px;line-height:1.55;color:#ddd2c6}
.pillar-quote{margin:0;padding:0 0 0 55px;display:flex;align-items:center;border-left:1px solid var(--gold);font-family:"Cormorant Garamond",serif;font-size:37px;font-style:italic;line-height:.95}

.courses-banner{position:relative;min-height:350px;display:flex;align-items:center;overflow:hidden;background:#180b03 url("biblia-cursos.png") center right/cover no-repeat;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.courses-banner:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,7,2,.99) 0%,rgba(19,8,2,.94) 31%,rgba(20,9,2,.50) 56%,rgba(10,5,2,.03) 100%)}
.banner-content{position:relative;z-index:2;padding:70px 0}
.banner-content h2{margin:0 0 15px;font-family:"Cormorant Garamond",serif;font-size:55px;font-weight:500;line-height:.92}
.banner-content>p:not(.eyebrow){font-size:11px;margin-bottom:27px}
.gold-btn{display:inline-block;background:#eab04c;color:#130b05;padding:18px 27px;font-size:9px;font-weight:700;letter-spacing:.06em}

.footer{background:#050504}
.footer-inner{min-height:112px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:42px}
.footer-brand{margin:0}
.socials{display:flex;gap:12px;align-items:center;font-size:9px;letter-spacing:.08em}
.footer blockquote{margin:0;padding-left:30px;border-left:1px solid var(--gold);font-family:"Cormorant Garamond",serif;font-size:19px;font-style:italic;color:#f2d7ad}

@media(max-width:900px){
 .container{width:min(100% - 34px,680px)}
 
 
 .hero-grid{min-height:auto;grid-template-columns:1fr;gap:10px;padding:55px 0 65px}.hero-copy{padding:0;text-align:center}.hero .eyebrow{text-align:center}.hero h1{font-size:68px;line-height:.8}.hero h1 em{margin-top:17px}.hero-subtitle{font-size:29px;margin:32px auto 25px}.gold-line{margin:0 auto 25px}.hero-text{line-height:1.6}.photo-frame{width:min(78vw,330px);margin:20px auto 0}.lion{right:-30%;width:100%;opacity:.16}
 .about-inner{padding:58px 0}.about h2{font-size:43px}.about p{font-size:13px}.about blockquote{font-size:21px}
 .journey{padding:55px 0}.section-heading h2{font-size:37px;margin-bottom:38px}.timeline{grid-template-columns:1fr 1fr;gap:35px 18px}.timeline:before{display:none}.milestone:last-child{grid-column:1/-1}
 .pillars-grid{grid-template-columns:1fr}.pillar{border-right:0;border-bottom:1px solid var(--line);padding:28px 10px;min-height:auto}.pillar-quote{border-left:0;padding:38px 0 0;justify-content:center;text-align:center;font-size:34px}
 .courses-banner{min-height:470px;align-items:flex-start;background-position:62% center}.courses-banner:before{background:linear-gradient(180deg,rgba(15,7,2,.98) 0%,rgba(15,7,2,.87) 47%,rgba(15,7,2,.28) 100%)}.banner-content{padding:55px 0}.banner-content h2{font-size:43px}
 .footer-inner{grid-template-columns:1fr;justify-items:center;text-align:center;padding:35px 0;gap:24px}.footer blockquote{border-left:0;border-top:1px solid var(--gold);padding:18px 0 0}.socials{flex-wrap:wrap;justify-content:center}
}
@media(max-width:480px){
 .container{width:calc(100% - 28px)}
 

.brand-copy small{
  display:block;
  margin-top:5px;
  font-size:5.5px;
  line-height:1;
  letter-spacing:.16em;
  white-space:nowrap;
}.hero h1{font-size:58px}.hero-subtitle{font-size:26px}.photo-frame{width:86vw}
 .about h2{font-size:37px}.section-heading h2{font-size:32px}.timeline{grid-template-columns:1fr}.milestone:last-child{grid-column:auto}
 .banner-content h2{font-size:38px}
}
/* AJUSTE FINAL DO HERO — LEÃO MAIS PRESENTE */
@media (min-width:901px){
  .hero-grid{grid-template-columns:1fr .70fr;gap:65px}
  .photo-frame{width:365px;justify-self:start}
}
@media (max-width:900px){
  .lion{
    right:-22%;
    width:115%;
    opacity:.38;
    background:
      linear-gradient(90deg,rgba(5,5,4,.92),rgba(5,5,4,.18)),
      url("leao.jpg") 68% center/cover no-repeat;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 38%);
    mask-image:linear-gradient(to right,transparent 0%,#000 38%);
  }
}


/* ===== HERO FINAL: LEÃO À ESQUERDA + MOLDURA À DIREITA ===== */
@media (min-width:901px){
  .hero{
    background:#050504;
  }

  .hero-grid{
    min-height:575px;
    grid-template-columns:1fr 365px;
    gap:70px;
  }

  .hero-copy{
    position:relative;
    z-index:4;
  }

  .lion{
    left:27%;
    right:auto;
    top:0;
    width:43%;
    height:100%;
    opacity:.68;
    background:url("leao.jpg") center center/cover no-repeat;
    mix-blend-mode:normal;
    -webkit-mask-image:linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.75) 18%,
      #000 45%,
      #000 72%,
      transparent 100%
    );
    mask-image:linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.75) 18%,
      #000 45%,
      #000 72%,
      transparent 100%
    );
  }

  .photo-frame{
    position:relative;
    z-index:5;
    width:365px;
    justify-self:end;
    background:rgba(10,7,4,.84);
  }

  .frame-inner{
    background:rgba(16,10,6,.88);
  }

  .hero:after{
    display:none;
  }
}

@media (max-width:900px){
  .hero{
    background:#050504;
  }

  .lion{
    left:-15%;
    right:auto;
    width:85%;
    opacity:.42;
    background:url("leao.jpg") center/cover no-repeat;
    mix-blend-mode:normal;
    -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 60%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 0%,#000 60%,transparent 100%);
  }

  .hero:after{
    display:none;
  }
}


/* ===== AJUSTE DEFINITIVO DO LEÃO =====
   Leão menor, discreto e parcialmente atrás da moldura */
@media (min-width:901px){
  .hero{
    background:#050504 !important;
  }

  .hero-grid{
    grid-template-columns:1fr 365px;
    gap:70px;
  }

  .lion{
    left:auto !important;
    right:245px !important;
    top:6% !important;
    width:34% !important;
    height:88% !important;
    opacity:.50 !important;
    background:url("leao.jpg") 54% center/cover no-repeat !important;
    mix-blend-mode:normal !important;
    z-index:2 !important;

    -webkit-mask-image:
      linear-gradient(to right,
        transparent 0%,
        rgba(0,0,0,.70) 20%,
        #000 46%,
        #000 76%,
        transparent 100%) !important;
    mask-image:
      linear-gradient(to right,
        transparent 0%,
        rgba(0,0,0,.70) 20%,
        #000 46%,
        #000 76%,
        transparent 100%) !important;
  }

  .hero-copy{
    position:relative;
    z-index:4;
  }

  .photo-frame{
    position:relative;
    z-index:5 !important;
    width:365px;
    justify-self:end;
    background:rgba(10,7,4,.93);
  }

  .frame-inner{
    background:rgba(15,10,6,.94);
  }

  .hero:after{
    display:none !important;
  }
}

@media (max-width:900px){
  .lion{
    left:auto !important;
    right:-8% !important;
    top:8% !important;
    width:72% !important;
    height:70% !important;
    opacity:.28 !important;
    background:url("leao.jpg") center/cover no-repeat !important;
    z-index:1 !important;
    -webkit-mask-image:linear-gradient(to right,transparent,#000 35%,#000 72%,transparent) !important;
    mask-image:linear-gradient(to right,transparent,#000 35%,#000 72%,transparent) !important;
  }
  .photo-frame{z-index:5 !important}
}


/* =========================================================
   HERO — LEÃO DISCRETO ATRÁS DA MOLDURA
   Referência final aprovada
   ========================================================= */
@media (min-width: 901px) {
  .hero {
    background: #050504 !important;
    overflow: hidden;
  }

  .hero-grid {
    position: relative;
    grid-template-columns: 1fr 390px !important;
    gap: 72px !important;
  }

  /* Leão: apenas uma parte do rosto aparece antes da moldura */
  .lion {
    left: auto !important;
    right: 315px !important;
    top: 3% !important;
    width: 31% !important;
    height: 94% !important;
    opacity: .34 !important;
    z-index: 2 !important;

    background-image: url("leao.jpg") !important;
    background-position: 48% center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    mix-blend-mode: normal !important;

    -webkit-mask-image: linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.42) 25%,
      #000 55%,
      #000 78%,
      transparent 100%
    ) !important;

    mask-image: linear-gradient(
      90deg,
      transparent 0%,
      rgba(0,0,0,.42) 25%,
      #000 55%,
      #000 78%,
      transparent 100%
    ) !important;
  }

  /* Texto sempre acima do leão */
  .hero-copy {
    position: relative;
    z-index: 4 !important;
  }

  /* Moldura cobre parte do leão */
  .photo-frame {
    position: relative;
    z-index: 6 !important;
    width: 390px !important;
    justify-self: end !important;
    background: #100a06 !important;
    box-shadow:
      0 0 18px rgba(217,154,39,.12),
      inset 0 0 20px rgba(217,154,39,.05) !important;
  }

  .frame-inner {
    background:
      radial-gradient(circle at center,
        rgba(54,30,12,.22),
        rgba(14,9,6,.98) 68%) !important;
  }

  /* Remove qualquer faixa/arco decorativo lateral */
  .hero::after {
    display: none !important;
  }
}

/* Celular/tablet */
@media (max-width: 900px) {
  .hero {
    background: #050504 !important;
  }

  .lion {
    left: auto !important;
    right: 17% !important;
    top: 18% !important;
    width: 54% !important;
    height: 55% !important;
    opacity: .20 !important;
    background: url("leao.jpg") center/cover no-repeat !important;
    z-index: 1 !important;

    -webkit-mask-image: linear-gradient(
      90deg,
      transparent,
      #000 40%,
      #000 70%,
      transparent
    ) !important;

    mask-image: linear-gradient(
      90deg,
      transparent,
      #000 40%,
      #000 70%,
      transparent
    ) !important;
  }

  .photo-frame {
    position: relative;
    z-index: 5 !important;
  }

  .hero::after {
    display: none !important;
  }
}

/* ÍCONE CHAMADO — POMBA SVG */
.pillar .chamado-pomba{
  width:58px;
  height:58px;
  display:block;
  margin:0 auto 8px;
  object-fit: contain;
  filter: brightness(1.15) saturate(0.85);
}


/* =========================================================
   MOBILE DEFINITIVO - PÁGINA SOBRE
   Não altera o desktop
========================================================= */

@media (max-width: 650px) {

    /* ================= HERO ================= */

    .hero {
        position: relative !important;
        overflow: hidden !important;
        background: #050504 !important;
    }

    .hero-grid {
        position: relative !important;
        z-index: 1 !important;

        display: flex !important;
        flex-direction: column !important;

        padding: 48px 0 60px !important;
        gap: 28px !important;
    }

    .hero-copy {
        position: relative !important;
        z-index: 5 !important;
        text-align: center !important;
    }

    /* LEÃO ATRÁS DA MOLDURA */

    .lion {
        display: block !important;
        position: absolute !important;

        left: -2% !important;
        right: auto !important;
        top: 48% !important;

        width: 72% !important;
        height: 48% !important;

        background-image: url("leao.jpg") !important;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        background-position: 48% center !important;

        opacity: .42 !important;

        z-index: 2 !important;

        -webkit-mask-image:
            linear-gradient(
                90deg,
                transparent 0%,
                #000 22%,
                #000 70%,
                transparent 100%
            ) !important;

        mask-image:
            linear-gradient(
                90deg,
                transparent 0%,
                #000 22%,
                #000 70%,
                transparent 100%
            ) !important;

        pointer-events: none !important;
    }

    /* MOLDURA NA FRENTE DO LEÃO */

    .photo-frame {
        position: relative !important;
        z-index: 4 !important;

        width: 84vw !important;
        max-width: 330px !important;

        margin: 15px auto 0 !important;
    }


    /* ================= TRAJETÓRIA ================= */

    .journey {
        padding: 50px 0 !important;
    }

    .timeline {
        display: grid !important;

        /* força 2 por linha até em celulares pequenos */
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 38px 16px !important;
    }

    .timeline::before {
        display: none !important;
    }

    .milestone,
    .milestone:last-child {
        width: 100% !important;
        grid-column: auto !important;
        padding: 0 4px !important;
        text-align: center !important;
    }

    .icon-circle {
        width: 62px !important;
        height: 62px !important;

        margin: 0 auto 13px !important;
    }

    .icon-circle svg {
        width: 31px !important;
        height: 31px !important;
    }

    .milestone h3 {
        margin: 0 !important;
        font-size: 11px !important;
        line-height: 1.35 !important;
    }

    .milestone p {
        max-width: 145px !important;

        margin: 8px auto 0 !important;

        font-size: 9px !important;
        line-height: 1.5 !important;
    }


    /* ================= PILARES ================= */

    .pillars {
        padding: 42px 0 48px !important;
    }

    .pillars-title {
        margin-bottom: 30px !important;
        text-align: center !important;
    }

    .pillars-grid {
        display: grid !important;

        /* 3 pilares lado a lado */
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 8px !important;
        align-items: start !important;
    }

    .pillar {
        min-height: 0 !important;

        padding: 12px 5px !important;

        border-right: 0 !important;
        border-bottom: 0 !important;

        text-align: center !important;
    }

    .pillar svg {
        width: 36px !important;
        height: 36px !important;

        margin: 0 auto 10px !important;
    }

    .pillar .chamado-pomba {
        width: 44px !important;
        height: 44px !important;

        margin: -4px auto 6px !important;
    }

    .pillar h3 {
        margin: 0 0 8px !important;

        font-size: 10px !important;
        line-height: 1.25 !important;
    }

    .pillar p {
        margin: 0 auto !important;

        max-width: 115px !important;

        font-size: 8px !important;
        line-height: 1.5 !important;
    }

    /* FRASE ABAIXO DOS 3 PILARES */

    .pillar-quote {
        grid-column: 1 / -1 !important;

        margin: 22px auto 0 !important;
        padding: 24px 15px 0 !important;

        width: 90% !important;

        border-left: 0 !important;
        border-top: 1px solid var(--gold) !important;

        justify-content: center !important;
        text-align: center !important;

        font-size: 30px !important;
        line-height: 1 !important;
    }
}

/* =========================================================
   AJUSTE FINAL MOBILE — LEÃO + BANNER BÍBLIA
========================================================= */

@media (max-width: 650px) {

    /* ---------- LEÃO ---------- */

    .hero {
        position: relative !important;
        overflow: hidden !important;
    }

    .lion {
        display: block !important;
        visibility: visible !important;

        position: absolute !important;

        /* aparece atrás e ao lado esquerdo da moldura */
        left: -8% !important;
        right: auto !important;
        top: 46% !important;

        width: 82% !important;
        height: 48% !important;

        background-image: url("leao.jpg") !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: 45% center !important;

        opacity: .55 !important;

        z-index: 2 !important;

        -webkit-mask-image: linear-gradient(
            90deg,
            transparent 0%,
            #000 18%,
            #000 72%,
            transparent 100%
        ) !important;

        mask-image: linear-gradient(
            90deg,
            transparent 0%,
            #000 18%,
            #000 72%,
            transparent 100%
        ) !important;
    }

    .hero-copy {
        position: relative !important;
        z-index: 5 !important;
    }

    .photo-frame {
        position: relative !important;
        z-index: 4 !important;
    }


    /* ---------- BANNER DA BÍBLIA ---------- */

    .courses-banner {
        min-height: 430px !important;

        background-image: url("biblia-cursos.png") !important;
        background-size: cover !important;

        /* sobe a Bíblia e mostra melhor o livro */
        background-position: 64% 62% !important;

        align-items: center !important;
    }

    /* deixa o fundo escuro principalmente atrás do texto */
    .courses-banner::before {
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;

        background:
            linear-gradient(
                90deg,
                rgba(12, 6, 2, .90) 0%,
                rgba(12, 6, 2, .72) 48%,
                rgba(12, 6, 2, .22) 100%
            ) !important;
    }

    .banner-content {
        position: relative !important;
        z-index: 2 !important;

        padding: 48px 0 !important;
    }

    .banner-content h2 {
        max-width: 520px !important;
        font-size: 43px !important;
        line-height: .98 !important;
    }

    .banner-content > p:not(.eyebrow) {
        max-width: 520px !important;
        line-height: 1.45 !important;
    }
}


/* ==========================================================
   MOBILE FINAL — PÁGINA SOBRE
========================================================== */

@media (max-width: 650px) {

    /* ---------- HERO ---------- */

    .hero {
        position: relative !important;
        overflow: hidden !important;
    }

    .hero-grid {
        position: relative !important;
        z-index: 1 !important;
    }

    /* LEÃO MAIS VISÍVEL */
    .lion {
        display: block !important;
        visibility: visible !important;

        position: absolute !important;

        left: -12% !important;
        right: auto !important;
        top: 47% !important;

        width: 88% !important;
        height: 48% !important;

        background-image: url("leao.jpg") !important;
        background-size: cover !important;
        background-position: 45% center !important;
        background-repeat: no-repeat !important;

        opacity: .58 !important;
        z-index: 3 !important;

        -webkit-mask-image: linear-gradient(
            90deg,
            transparent 0%,
            #000 12%,
            #000 72%,
            transparent 100%
        ) !important;

        mask-image: linear-gradient(
            90deg,
            transparent 0%,
            #000 12%,
            #000 72%,
            transparent 100%
        ) !important;

        pointer-events: none !important;
    }

    .hero-copy {
        position: relative !important;
        z-index: 5 !important;
    }

    .photo-frame {
        position: relative !important;
        z-index: 4 !important;

        width: min(82vw, 320px) !important;
        margin: 24px auto 0 !important;
    }


    /* ---------- TRAJETÓRIA ---------- */

    .timeline {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

        gap: 34px 16px !important;
    }

    .timeline::before {
        display: none !important;
    }

    .milestone,
    .milestone:last-child {
        grid-column: auto !important;
        width: 100% !important;

        padding: 0 4px !important;
        text-align: center !important;
    }

    .icon-circle {
        width: 60px !important;
        height: 60px !important;

        margin: 0 auto 12px !important;
    }

    .icon-circle svg {
        width: 30px !important;
        height: 30px !important;
    }

    .milestone h3 {
        font-size: 11px !important;
        line-height: 1.3 !important;
    }

    .milestone p {
        max-width: 145px !important;

        margin: 8px auto 0 !important;

        font-size: 9px !important;
        line-height: 1.5 !important;
    }


    /* ---------- PILARES ---------- */

    .pillars {
        padding: 42px 0 !important;
    }

    .pillars-title {
        margin-bottom: 25px !important;
    }

    .pillars-grid {
        display: grid !important;

        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 8px !important;
    }

    .pillar {
        min-height: 0 !important;

        padding: 12px 4px !important;

        border-right: 0 !important;
        border-bottom: 0 !important;

        text-align: center !important;
    }

    .pillar svg {
        width: 34px !important;
        height: 34px !important;

        margin: 0 auto 9px !important;
    }

    .pillar .chamado-pomba {
        width: 42px !important;
        height: 42px !important;

        margin: -4px auto 5px !important;
    }

    .pillar h3 {
        margin-bottom: 7px !important;

        font-size: 10px !important;
    }

    .pillar p {
        max-width: 110px !important;

        margin: 0 auto !important;

        font-size: 8px !important;
        line-height: 1.45 !important;
    }

    .pillar-quote {
        grid-column: 1 / -1 !important;

        width: 90% !important;

        margin: 20px auto 0 !important;
        padding: 22px 10px 0 !important;

        border-left: 0 !important;
        border-top: 1px solid var(--gold) !important;

        justify-content: center !important;
        text-align: center !important;

        font-size: 28px !important;
    }


    /* ---------- BÍBLIA / CURSOS ---------- */

    .courses-banner {
        position: relative !important;

        min-height: 390px !important;

        background-image: url("biblia-cursos.png") !important;
        background-size: cover !important;
        background-position: 68% center !important;

        align-items: center !important;
    }

    .courses-banner::before {
        content: "" !important;

        position: absolute !important;
        inset: 0 !important;

        background: linear-gradient(
            90deg,
            rgba(11, 6, 2, .94) 0%,
            rgba(11, 6, 2, .78) 48%,
            rgba(11, 6, 2, .25) 100%
        ) !important;
    }

    .banner-content {
        position: relative !important;
        z-index: 2 !important;

        padding: 42px 0 !important;
    }

    .banner-content h2 {
        font-size: 38px !important;
        line-height: 1 !important;
    }
}

/* SOBRE — COMPACTAR ÁREA CLARA NO CELULAR */
@media (max-width: 650px) {

    .about-inner {
        padding: 38px 0 36px !important;
    }

    .about .eyebrow {
        margin-bottom: 18px !important;
    }

    .about h2 {
        margin-bottom: 22px !important;
    }

    .about p {
        margin-bottom: 16px !important;
        line-height: 1.6 !important;
    }

    .about blockquote {
        margin-top: 24px !important;
        padding-top: 8px !important;
        padding-bottom: 0 !important;
    }
}


.footer-logo-link{
  display:block;
  flex:0 0 auto;
  line-height:0;
  padding-top:25px;
}

.footer-logo-img{
  display:block;
  width:230px;
  max-width:100%;
  height:auto;
  object-fit:contain;
}

/* =========================================
   CORREÇÃO DO RODAPÉ NA PÁGINA SOBRE
   Mantém o mesmo tamanho das outras páginas
========================================= */

.footer-premium .footer-brand-center .footer-logo-img {
    display: block;
    width: 320px !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    object-fit: contain;
}

.footer-premium .footer-logo-link {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: -12px auto 0;
}


/* TABLET */

@media (max-width: 900px) {

    .footer-premium .footer-brand-center .footer-logo-img {
        width: 320px !important;
        max-width: 90% !important;
    }

}


/* CELULAR */

@media (max-width: 620px) {

    .footer-premium .footer-brand-center .footer-logo-img {
        width: 280px !important;
        max-width: 90% !important;
    }

}


/* CELULAR PEQUENO */

@media (max-width: 420px) {

    .footer-premium .footer-brand-center .footer-logo-img {
        width: 245px !important;
        max-width: 90% !important;
    }

}