:root {
    --orange: #173b2a;
    --brown: #173b2a;
    --brown-dark: #102b1e;
    --beige: #f5ebe2;
    --text: #292929;
    --muted: #666;
    --line: #dce7df;
    --white: #fff
}

.news-page {
    margin: 0;
    background: #edf3ee;
    color: var(--text);
    font-family: Montserrat, Arial, sans-serif
}

.newsletter {
    width: min(920px, 100%);
    margin: auto;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 20px 80px rgba(45, 28, 18, .12)
}

.news-header {
    position: relative;
    padding: 44px 9% 42px;
    min-height: 244px;
    box-sizing: border-box;
    text-align: center;
    background-color: #102b1e;
    background-image: linear-gradient(rgba(16,43,30,.82), rgba(16,43,30,.82)), url("https://images.unsplash.com/photo-1589829545856-d10d557cf95f?q=82&w=1600&auto=format&fit=crop");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    overflow: hidden
}


.news-logo {
    width: 300px;
    max-width: 78%;
    height: auto;
    display: block;
    margin: 0 auto 26px
}

.news-kicker {
    width: fit-content;
    margin: 0 auto;
    font-size: 24px;
    line-height: 30px;
    letter-spacing: .04em;
    font-weight: 400;
    text-align: center;
    color: #fff
}

.news-date {
    display: inline-block;
    width: auto;
    margin-top: 16px;
    padding: 8px 18px;
    border-radius: 20px;
    background: #173b2a;
    color: #fff;
    font-size: 12px;
    line-height: 15px;
    font-weight: 700;
    letter-spacing: 0
}

.news-logo,
.news-kicker,
.news-date {
    position: relative;
    z-index: 2
}

.news-body {
    padding: 48px 10% 36px;
    text-align: left
}

.intro {
    display: grid;
    text-align: left;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0;
    align-items: center;
    padding-bottom: 34px;
    border-bottom: 1px solid var(--line)
}

.intro h1 {
    margin: 0;
    font-size: 25px;
    line-height: 1.08;
    letter-spacing: -.04em;
    padding-right: 36px
}

.intro h1 span {
    color: var(--orange)
}

.intro-author {
    display: block;
    margin-top: 10px;
    font-size: 11px;
    line-height: 1.45;
    font-weight: 600;
    letter-spacing: .035em;
    color: #4d2c1d;
    text-align: left
}


.intro p {
    margin: 0;
    padding-left: 36px;
    border-left: 2px solid var(--orange);
    line-height: 1.65;
    color: #444
}

.items {
    counter-reset: item;
    text-align: left
}

.news-item {
    counter-increment: item;
    text-align: left;
    display: grid;
    grid-template-columns: 110px 1fr;
    gap: 28px;
    padding: 26px 0;
    border-bottom: 1px solid var(--line)
}

.number:before {
    content: counter(item, decimal-leading-zero);
    font-size: 48px;
    color: var(--orange);
    font-weight: 300
}

.content {
    border-left: 1px solid #7e9e89;
    text-align: left;
    padding-left: 34px;
    position: relative
}

.content:before {
    content: "";
    position: absolute;
    left: -5px;
    top: 23px;
    width: 9px;
    height: 9px;
    background: var(--orange);
    border-radius: 50%
}

.source {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: #eaf3ed;
    color: #173b2a;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase
}

.news-item h2 {
    font-size: 18px;
    text-align: left;
    line-height: 1.35;
    margin: 8px 0 7px
}

.news-item p {
    margin: 0 0 10px;
    text-align: left;
    line-height: 1.55;
    color: #555;
    font-size: 14px
}

.read-more {
    color: var(--orange);
    font-weight: 700;
    font-size: 13px;
    text-decoration: none
}

.vision {
    margin-top: 26px;
    padding: 24px;
    border: 1px solid #eed7c6;
    border-radius: 14px;
    background: linear-gradient(90deg, #fbf4ef, #fff);
    display: grid;
    grid-template-columns: 75px 1fr;
    gap: 20px;
    align-items: center
}

.vision-mark {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 1px solid #e5c9b6;
    display: grid;
    place-items: center;
    font-size: 30px;
    color: var(--orange)
}

.vision h3 {
    margin: 0 0 6px
}

.vision p {
    margin: 0;
    line-height: 1.55;
    color: #555;
    font-size: 13px
}

.news-footer {
    padding: 34px 10%;
    background: linear-gradient(115deg, #98532b, #102b1e);
    color: #fff;
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: 35px;
    align-items: center
}

.news-footer img {
    width: 210px;
    filter: brightness(0) invert(1);
    opacity: .95
}

.footer-copy {
    border-left: 1px solid rgba(255, 255, 255, .4);
    padding-left: 35px
}

.footer-copy strong {
    font-size: 13px;
    letter-spacing: .03em
}

.footer-contacts {
    margin-top: 13px;
    display: flex;
    flex-direction: column;
    gap: 9px;
    font-size: 13px;
    line-height: 1.45
}

.footer-contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0
}

.footer-icon {
    width: 17px;
    height: 17px;
    flex: 0 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.footer-icon svg {
    width: 17px;
    height: 17px;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round
}

.footer-copy a {
    color: #fff;
    text-decoration: none
}

.footer-copy a:hover {
    text-decoration: underline
}

.web-link {
    text-align: center;
    padding: 12px;
    background: #eef4ef;
    color: #173b2a;
    font-size: 11px
}

.dots {
    position: absolute;
    width: 82px;
    height: 82px;
    background-image: radial-gradient(#8f5435 1.15px, transparent 1.15px);
    background-size: 9px 9px;
    opacity: .42;
    z-index: 1
}

.dots.left {
    left: 4%;
    top: 78px
}

.dots.right {
    right: 4%;
    bottom: 58px
}

@media(max-width:700px) {
    .dots {
        width: 42px;
        height: 42px;
        background-size: 8px 8px;
        opacity: .30
    }

    .dots.left {
        left: 14px;
        top: 72px
    }

    .dots.right {
        right: 14px;
        bottom: 44px
    }

    .newsletter {
        box-shadow: none
    }

    .news-header {
        padding: 34px 24px 30px
    }

    .news-kicker {
        font-size: 17px;
        letter-spacing: .2em
    }

    .news-date {
        font-size: 10px;
        padding: 7px 16px
    }

    .news-body {
        padding: 35px 24px
    }

    .intro {
        grid-template-columns: 1fr;
        gap: 20px
    }

    .intro h1 {
        font-size: 29px;
        padding-right: 0
    }

    .intro p {
        padding-left: 18px
    }

    .news-item {
        grid-template-columns: 58px 1fr;
        gap: 12px
    }

    .number:before {
        font-size: 34px
    }

    .content {
        padding-left: 18px
    }

    .news-item h2 {
        font-size: 16px
    }

    .news-footer {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 30px 24px
    }

    .footer-copy {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, .35);
        padding: 20px 0 0
    }

    .footer-contacts {
        width: fit-content;
        max-width: 100%;
        margin: 14px auto 0;
        text-align: left
    }

    .intro-author {
        font-size: 10px
    }


    .news-footer img {
        margin: auto;
        width: 180px
    }

    .vision {
        grid-template-columns: 1fr;
        text-align: center
    }

    .vision-mark {
        margin: auto
    }
}

/* Hero web espelhada com o SMTP aprovado */
.news-header .dots { display:none; }
@media(max-width:700px){
 .news-header{padding:34px 24px 32px;min-height:0;}
 .news-logo{width:235px;max-width:82%;margin-bottom:24px;}
 .news-kicker{font-size:20px;line-height:25px;letter-spacing:.03em;font-weight:400;}
 .news-date{font-size:10px;line-height:13px;padding:7px 15px;margin-top:16px;}
}