
    :root {
        --primary-orange: #ff6c0e;
        --primary-purple: #33475B;
        --secondary-green: #b3d3b5;
        --primary-laranja: #FF8C42;
        --secondary-highlight: #33475B;
    }
    body {
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
        background-color: #fffdf8;
    }
    a{
        text-decoration: none;
    }
    #materias-destaques-home{
        overflow: hidden;
        
    }
    .header-top {
        background-color: var(--primary-purple);
        padding: 15px 0;
        color: white;
    }
    .header_social {
        list-style: none;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: flex-start;
    }
    .header_social li {
        margin-right: 15px;
    }
    .header_social a {
        color: white;
        font-size: 1.5em;
        text-decoration: none;
        transition: transform 0.3s ease;
    }
    .header_social a:hover {
        color: var(--secondary-green);
        transform: scale(1.1);
    }
    .logo img {
        max-height: 70px;
        transition: transform 0.3s ease;
    }
    .logo img:hover {
        transform: scale(1.05);
    }
    .right-button ul {
        list-style: none;
        padding: 0;
        margin: 0;
        text-align: right;
    }
    .right-button li {
        display: inline-block;
    }
    .right-button a {
        text-decoration: none;
        background-color: var(--secondary-highlight);
        color: var(--primary-purple);
        padding: 8px 15px;
        border-radius: 20px;
        font-weight: bold;
        color: white;
        transition: all 0.3s ease;
        box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    }
    .right-button a:hover {
        background-color: var(--primary-highlight);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 6px 8px rgba(0,0,0,0.15);
    }
    .main_menu {
        background-color: white;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }
    .menu_nav .nav-link {
        color: var(--primary-purple);
        padding: 15px 10px !important;
        font-weight: 600;
        position: relative;
        transition: color 0.3s ease;
    }
    .menu_nav .nav-link:hover, .menu_nav .nav-link.active {
        color: var(--primary-orange);
    }
    .menu_nav .nav-link::after {
        content: '';
        position: absolute;
        width: 0;
        height: 2px;
        bottom: 0;
        left: 50%;
        background-color: var(--primary-orange);
        transition: all 0.3s ease;
    }
    .menu_nav .nav-link:hover::after, .menu_nav .nav-link.active::after {
        width: 70%;
        left: 15%;
    }
    .single-blog {
        margin-bottom: 30px;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0 5px 15px rgba(0,0,0,0.08);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        background-color: white;
    }
    #materias-destaques-home .single-blog{
        margin-bottom:5px !important;    
    }
    .single-blog:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    }
    .thumb img {
        width: 100%;
        height: auto;
        border-radius: 8px 8px 0 0;
        transition: transform 0.3s ease;
        aspect-ratio: 1;
    }
    .single-blog:hover .thumb img {
        transform: scale(1.03);
    }
    .meta-top a, .meta-bottom a {
        color: var(--primary-purple);
        text-decoration: none;
        font-size: 0.9em;
        font-weight: 600;
        padding: 3px 8px;
        background-color: rgba(185, 148, 190, 0.1);
        border-radius: 10px;
    }
    .meta-top a:hover, .meta-bottom a:hover {
        color: var(--primary-orange);
        background-color: rgba(255, 108, 14, 0.1);
    }
    .short_details h4 {
        margin: 15px 0;
        color: var(--primary-laranja);
        font-size: 1.7em;
        transition: color 0.3s ease;
    }
   /* .single-blog:hover .short_details h4 {
        color: var(--primary-purple);  
    }*/ 
    @media (max-width: 991px) {
        .short_details h4 {
            font-size: 1.3rem !important;
        }
    }
    .area-heading {
        margin-bottom: 40px;
        text-align: center;
    }
    .area-heading h3 {
        font-size: 2.2em;
        color: var(--primary-purple);
        position: relative;
        display: inline-block;
        padding-bottom: 10px;
    }
    .area-heading h3::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        width: 80px;
        height: 4px;
        background: linear-gradient(to right, var(--primary-orange), var(--secondary-green));
        border-radius: 2px;
    }
    .area-heading p {
        color: #666;
        font-size: 1.1em;
        max-width: 800px;
        margin: 15px auto 0;
    }
    .pad_25 {
        padding: 25px;
    }
    .pad_25especial {
        padding-top: 15px;
    }
    .padd_left_0 {
        padding-left: 0;
    }
    .padd_right_0 {
        padding-right: 0;
    }
    .font-20 {
        font-size: 1.1em;
    }
    .addvertise {
        text-align: center;
        margin: 30px 0;
        animation: pulse 2s infinite;
    }
    @keyframes pulse {
        0% { transform: scale(1); }
        50% { transform: scale(1.02); }
        100% { transform: scale(1); }
    }
    .ads {
        max-width: 100%;
        height: auto;
        border-radius: 15px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }
    .dark_font {
        color: var(--primary-purple) !important;
        font-weight: 600;
    }
    .m_b_30 {
        margin-bottom: 30px;
    }
    .style_two .short_details, .style_three .short_details, .style_four .short_details {
        padding: 15px 0;
    }
    .style_three .thumb img, .style_four .thumb img {
        max-height: 150px;
        object-fit: cover;
    }
    .section-top-border {
        border-top: 2px dashed var(--secondary-green);
        padding-top: 40px;
    }
    .area-padding-menor {
        padding: 50px 0;
        background-color: #f9f9f9;
        background-image: radial-gradient(var(--secondary-green) 1px, transparent 1px);
        background-size: 20px 20px;
    }
    .area-padding-bottom-minima {
        padding-bottom: 30px;
    }
    .history-section {
        padding: 50px 0;
        background-color: white;
        overflow: hidden;
    }
    .history-section h3 {
        color: var(--primary-purple);
        text-align: center;
        margin-bottom: 30px;
        font-size: 2em;
    }
    .history-section .thumb{
        aspect-ratio: 1 / 1;
        justify-content: center;
        overflow: hidden;
    }
    .history-section .thumb img{
        aspect-ratio: 1/1;
        object-fit: cover;
        height: auto;
    }
    .history-section .card{
        min-height: 490px;
    }
    .card {
        border: none;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0 5px 15px rgba(0,0,0,0.08);
        transition: all 0.3s ease;
        background-color: #fff9f2;
    }
    .card:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 25px rgba(255, 108, 14, 0.15);
    }
    .card .card-img-top {
        height: 280px;
        object-fit: cover;
    }
    .card .card-title {
        color: var(--primary-purple);
    }
    .card .btn {
        background-color: var(--primary-orange);
        border: none;
        border-radius: 20px;
        padding: 5px 15px;
    }
    .card .btn:hover {
        background-color: var(--primary-purple);
    }
    .bounce {
        animation: bounce 2s infinite;
    }
    @keyframes bounce {
        0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
        40% {transform: translateY(-10px);}
        60% {transform: translateY(-5px);}
    }
    .fade-in {
        opacity: 0;
        transform: translateY(20px);
        animation: fadeInUp 0.6s forwards;
    }
    @keyframes fadeInUp {
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    .delay-1 { animation-delay: 0.1s; }
    .delay-2 { animation-delay: 0.2s; }
    .delay-3 { animation-delay: 0.3s; }
    .delay-4 { animation-delay: 0.4s; }
    .delay-5 { animation-delay: 0.5s; }
    .delay-6 { animation-delay: 0.6s; }
    .delay-7 { animation-delay: 0.7s; }
    .delay-8 { animation-delay: 0.8s; }
    .delay-9 { animation-delay: 0.9s; }
    .delay-10 { animation-delay: 1.0s; }

    /* POSTS */
    .post-header {
            background-color: white;
            padding: 40px 0;
            border-bottom: 1px solid #eee;
        }
        .post-title {
            color: var(--primary-purple);
            font-size: 2.5em;
            margin-bottom: 15px;
        }
        .post-meta {
            color: #666;
            margin-bottom: 20px;
        }
        .post-meta a {
            color: var(--primary-purple);
            text-decoration: none;
            font-weight: 600;
            padding: 3px 8px;
            background-color: rgba(185, 148, 190, 0.1);
            border-radius: 10px;
        }
        .post-image {
            width: 100%;
            aspect-ratio: 1 / 1;
            object-fit: cover;
            border-radius: 14px;
            margin-bottom: 22px;
            background-color: #faf7fa;
            box-shadow: 0 4px 20px rgba(174, 141, 188, 0.10), 0 1.5px 4px rgba(90, 11, 121, 0.04);
            display: block;
            max-width: 420px;
            max-height: 420px;
            margin-left: auto;
            margin-right: auto;
            transition: box-shadow 0.3s, transform 0.3s;
        }
        .post-image:hover {
            box-shadow: 0 10px 34px rgba(137,55,166,0.16), 0 3px 10px rgba(90,11,121,0.08);
            transform: scale(1.012);
        }
        .post-content {
            font-size: 1.1em;
            line-height: 1.8;
            color: #444;
            text-align: justify;
        }
        .post-content p {
            margin-bottom: 20px;
        }
        .related-posts {
            padding: 40px 0;
            background-color: #f9f9f9;
        }
        .related-posts h3 {
            color: var(--primary-purple);
            margin-bottom: 30px;
        }
     
      
        
        .meta-top a, .meta-bottom a {
            color: var(--primary-purple);
            text-decoration: none;
            font-size: 0.9em;
            font-weight: 600;
            padding: 3px 8px;
            background-color: rgba(185, 148, 190, 0.1);
            border-radius: 10px;
        }
        .meta-top a:hover, .meta-bottom a:hover {
            color: var(--primary-orange);
        }

    /* CATEGORIAS */
    .categories-section {
            padding: 50px 0;
            background-color: white;
        }
        .category-card {
            background-color: white;
            border-radius: 15px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.08);
            padding: 30px;
            margin-bottom: 30px;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: none;
        }
        .category-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 25px rgba(0,0,0,0.15);
        }
        .category-card h3 {
            color: var(--primary-purple);
            margin-bottom: 15px;
        }
        .category-card p {
            color: #666;
            margin-bottom: 20px;
        }
        .category-link {
            display: inline-block;
            background-color: var(--primary-orange);
            color: white;
            padding: 8px 20px;
            border-radius: 20px;
            text-decoration: none;
            font-weight: 600;
            transition: background-color 0.3s ease;
        }
        .category-link:hover {
            background-color: var(--primary-purple);
            color: white;
        }
        .category-icon {
            font-size: 3em;
            color: var(--primary-purple);
            margin-bottom: 15px;
        }

    /* Noticias e Historias */
    .news-section {
            padding: 50px 0;
            background-color: white;
        }
        .news-header {
            text-align: center;
            margin-bottom: 40px;
        }
        .news-header h2 {
            color: var(--primary-purple);
            font-size: 2.5em;
        }
        .news-header p {
            color: #666;
            font-size: 1.2em;
        }
       
        .short_details {
            padding: 20px;
        }
        .meta-top a, .meta-bottom a {
            color: var(--primary-purple);
            text-decoration: none;
            font-size: 0.9em;
            font-weight: 600;
            padding: 3px 8px;
            background-color: rgba(185, 148, 190, 0.1);
            border-radius: 10px;
        }
        .meta-top a:hover, .meta-bottom a:hover {
            color: var(--primary-orange);
            background-color: rgba(255, 108, 14, 0.1);
        }
       
        .short_details p {
            color: #666;
        }

    
        .stories-section {
            padding: 50px 0;
            background-color: white;
        }
        .stories-header {
            text-align: center;
            margin-bottom: 40px;
        }
        .stories-header h2 {
            color: var(--primary-purple);
            font-size: 2.5em;
        }
        .stories-header p {
            color: #666;
            font-size: 1.2em;
        }
      
        .short_details {
            padding: 20px;
        }
        .meta-top a, .meta-bottom a {
            color: var(--primary-purple);
            text-decoration: none;
            font-size: 0.9em;
            font-weight: 600;
            padding: 3px 8px;
            background-color: rgba(185, 148, 190, 0.1);
            border-radius: 10px;
        }
        .meta-top a:hover, .meta-bottom a:hover {
            color: var(--primary-orange);
            background-color: rgba(255, 108, 14, 0.1);
        }
     
        .short_details p {
            color: #666;
        }

    .news-section .single-blog{
        height: 650px;
    }

    .news-section .thumb {
        aspect-ratio: 1 / 1; /* largura igual à altura */
        justify-content: center;
        overflow: hidden;
    }
    .news-section .thumb img {
        aspect-ratio: 1/1;
        object-fit: cover;
        border-radius: 8px 8px 0 0;
    }
    @media (max-width: 991px) {
        .news-section .thumb {
            height: 50%;
        }
        
        .news-section .single-blog{
            height: 450px;
        }
    }

    /* Conte sua historia */

    .form-section {
            padding: 50px 0;
            background-color: white;
        }
        .form-header {
            text-align: center;
            margin-bottom: 40px;
        }
        .form-header h2 {
            color: var(--primary-purple);
            font-size: 2.5em;
        }
        .form-header p {
            color: #666;
            font-size: 1.2em;
        }
        .form-control, .form-select {
            border: 2px solid #ddd;
            border-radius: 10px;
            padding: 12px 15px;
            font-size: 1em;
        }
        .form-control:focus, .form-select:focus {
            border-color: var(--primary-orange);
            box-shadow: 0 0 0 0.25rem rgba(255, 108, 14, 0.25);
        }
        .btn-submit {
            background-color: var(--primary-orange);
            color: white;
            border: none;
            padding: 12px 30px;
            border-radius: 25px;
            font-size: 1.1em;
            font-weight: bold;
            width: 100%;
            transition: background-color 0.3s ease;
        }
        .btn-submit:hover {
            background-color: var(--primary-purple);
            color: white;
        }
        .form-group {
            margin-bottom: 25px;
        }
        label {
            font-weight: 600;
            color: var(--primary-purple);
            margin-bottom: 8px;
        }
        .preview-image {
            max-width: 100%;
            max-height: 200px;
            margin-top: 10px;
            border-radius: 10px;
            display: none; /* Oculto inicialmente */
        }

        .instagram {
            overflow: hidden;
        }
        .instagram img {
            display: block;
            width: 100%;
            height: auto;
        }


        