/*==================================================
DIAMOND AREA CDC
NEWSROOM
PART 1
==================================================*/



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

.news-hero{

padding:110px 0;

background:linear-gradient(180deg,#F8FCF8,#EDF8F1);

position:relative;

overflow:hidden;

}



.news-hero::before{

content:"";

position:absolute;

left:-220px;

top:-220px;

width:600px;

height:600px;

border-radius:50%;

background:

radial-gradient(circle,

rgba(217,181,74,.18),

transparent 70%);

}



.news-hero::after{

content:"";

position:absolute;

right:-260px;

bottom:-260px;

width:700px;

height:700px;

border-radius:50%;

background:

radial-gradient(circle,

rgba(11,110,62,.08),

transparent 70%);

}



.news-hero .container{

position:relative;

z-index:2;

}



.news-hero-grid{

display:grid;

grid-template-columns:56% 44%;

gap:60px;

align-items:center;

}



/*==================================================
LEFT
==================================================*/

.news-intro h1{

font-size:72px;

font-weight:800;

line-height:1.05;

color:#0B6E3E;

margin:25px 0;

}



.news-intro p{

font-size:18px;

line-height:2;

color:#555;

max-width:650px;

margin-bottom:45px;

}



/*==================================================
BUTTONS
==================================================*/

.news-buttons{

display:flex;

gap:18px;

flex-wrap:wrap;

}



.btn-primary{

background:#0B6E3E;

color:#fff;

padding:16px 34px;

border-radius:50px;

text-decoration:none;

font-weight:600;

transition:.35s;

}



.btn-primary:hover{

background:#095C34;

transform:translateY(-4px);

}



.btn-outline{

border:2px solid #0B6E3E;

color:#0B6E3E;

padding:16px 34px;

border-radius:50px;

text-decoration:none;

font-weight:600;

transition:.35s;

}



.btn-outline:hover{

background:#0B6E3E;

color:#fff;

transform:translateY(-4px);

}



/*==================================================
HERO NEWS CARD
==================================================*/

.hero-news-card{

background:#fff;

border-radius:28px;

overflow:hidden;

box-shadow:

0 25px 60px rgba(0,0,0,.08);

transition:.4s;

}



.hero-news-card:hover{

transform:translateY(-10px);

}



.breaking-tag{

background:#D9B54A;

color:#fff;

padding:14px 22px;

font-size:13px;

font-weight:700;

letter-spacing:1px;

display:flex;

align-items:center;

gap:10px;

}



.hero-news-image{

height:270px;

overflow:hidden;

}



.hero-news-image img{

width:100%;

height:100%;

object-fit:cover;

transition:.45s;

}



.hero-news-card:hover img{

transform:scale(1.08);

}



.hero-news-content{

padding:35px;

}



.hero-news-content span{

display:block;

font-size:14px;

color:#777;

margin-bottom:12px;

}



.hero-news-content h3{

font-size:28px;

line-height:1.3;

color:#0B6E3E;

margin-bottom:18px;

}



.hero-news-content p{

line-height:1.9;

color:#666;

}



/*==================================================
FEATURED STORY
==================================================*/

.featured-news{

padding:120px 0;

background:#fff;

}



.featured-layout{

display:grid;

grid-template-columns:48% 52%;

gap:60px;

align-items:center;

}



.featured-image{

border-radius:28px;

overflow:hidden;

box-shadow:

0 25px 60px rgba(0,0,0,.08);

}



.featured-image img{

width:100%;

height:100%;

display:block;

object-fit:cover;

transition:.45s;

}



.featured-image:hover img{

transform:scale(1.08);

}



.news-category{

display:inline-block;

background:#0B6E3E;

color:#fff;

padding:8px 20px;

border-radius:30px;

font-size:13px;

font-weight:600;

margin-bottom:25px;

}



.featured-content h2{

font-size:48px;

font-weight:800;

color:#0B6E3E;

line-height:1.2;

margin-bottom:20px;

}



.story-meta{

display:flex;

gap:30px;

flex-wrap:wrap;

margin-bottom:30px;

color:#666;

font-weight:500;

}



.story-meta i{

color:#D9B54A;

margin-right:8px;

}



.featured-content p{

line-height:2;

color:#555;

margin-bottom:20px;

}



.read-story{

display:inline-flex;

align-items:center;

gap:12px;

color:#0B6E3E;

font-weight:700;

text-decoration:none;

transition:.35s;

}



.read-story:hover{

gap:20px;

color:#D9B54A;

}
/*==================================================
LATEST NEWS
==================================================*/

.latest-news{

padding:120px 0;

background:#F8FCF9;

position:relative;

overflow:hidden;

}



.latest-news::before{

content:"";

position:absolute;

left:-220px;

bottom:-220px;

width:550px;

height:550px;

border-radius:50%;

background:

radial-gradient(circle,

rgba(217,181,74,.10),

transparent 70%);

}



.latest-news .container{

position:relative;

z-index:2;

}



.news-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

margin-top:60px;

}



/*==================================================
NEWS CARD
==================================================*/

.news-card{

background:#fff;

border-radius:24px;

overflow:hidden;

box-shadow:

0 20px 50px rgba(0,0,0,.08);

transition:.4s;

}



.news-card:hover{

transform:translateY(-12px);

box-shadow:

0 35px 70px rgba(11,110,62,.15);

}



.news-image{

position:relative;

height:240px;

overflow:hidden;

}



.news-image img{

width:100%;

height:100%;

object-fit:cover;

transition:.45s;

}



.news-card:hover img{

transform:scale(1.08);

}



.news-badge{

position:absolute;

top:18px;

left:18px;

background:#0B6E3E;

color:#fff;

padding:8px 18px;

border-radius:30px;

font-size:12px;

font-weight:700;

letter-spacing:1px;

}



.news-body{

padding:30px;

}



.news-meta{

font-size:14px;

color:#888;

margin-bottom:15px;

}



.news-meta i{

color:#D9B54A;

margin-right:8px;

}



.news-body h3{

font-size:26px;

line-height:1.35;

color:#0B6E3E;

margin-bottom:18px;

}



.news-body p{

line-height:1.9;

color:#666;

margin-bottom:25px;

}



.news-body a{

display:inline-flex;

align-items:center;

gap:12px;

font-weight:700;

color:#0B6E3E;

text-decoration:none;

transition:.35s;

}



.news-body a:hover{

gap:18px;

color:#D9B54A;

}



/*==================================================
UPCOMING EVENTS
==================================================*/

.events-section{

padding:120px 0;

background:#fff;

}



.events-wrapper{

display:grid;

grid-template-columns:40% 60%;

gap:60px;

align-items:flex-start;

}



.events-left h2{

font-size:52px;

font-weight:800;

color:#0B6E3E;

margin:20px 0;

}



.events-left p{

line-height:2;

color:#666;

}



.event-item{

display:flex;

align-items:center;

gap:25px;

background:#F7FAF8;

padding:28px;

border-radius:22px;

margin-bottom:22px;

transition:.35s;

}



.event-item:hover{

background:#fff;

transform:translateX(10px);

box-shadow:

0 18px 45px rgba(11,110,62,.12);

}



.event-date{

width:95px;

height:95px;

border-radius:18px;

background:#0B6E3E;

color:#fff;

display:flex;

align-items:center;

justify-content:center;

font-size:22px;

font-weight:700;

text-align:center;

flex-shrink:0;

}



.event-item h4{

font-size:24px;

color:#0B6E3E;

margin-bottom:10px;

}



.event-item p{

color:#666;

}



/*==================================================
NEWS CATEGORIES
==================================================*/

.news-categories{

padding:110px 0;

background:#F8FCF9;

}



.category-heading{

text-align:center;

margin-bottom:60px;

}



.category-heading h2{

font-size:48px;

font-weight:800;

color:#0B6E3E;

}



.category-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}



.category-box{

background:#fff;

padding:35px;

border-radius:22px;

display:flex;

align-items:center;

gap:20px;

text-decoration:none;

font-size:20px;

font-weight:700;

color:#0B6E3E;

box-shadow:

0 18px 45px rgba(0,0,0,.06);

transition:.35s;

}



.category-box i{

font-size:30px;

color:#D9B54A;

transition:.35s;

}



.category-box:hover{

background:#0B6E3E;

color:#fff;

transform:translateY(-8px);

}



.category-box:hover i{

color:#fff;

transform:rotate(15deg);

}
/*==================================================
STAY INFORMED BANNER
==================================================*/

.news-banner{

padding:130px 0;

background:linear-gradient(135deg,#0B6E3E,#107545);

position:relative;

overflow:hidden;

color:#fff;

}



.news-banner::before{

content:"";

position:absolute;

left:-180px;

top:-180px;

width:520px;

height:520px;

border-radius:50%;

background:rgba(255,255,255,.05);

}



.news-banner::after{

content:"";

position:absolute;

right:-250px;

bottom:-250px;

width:650px;

height:650px;

border-radius:50%;

background:rgba(255,255,255,.04);

}



.news-banner-wrapper{

display:grid;

grid-template-columns:58% 42%;

gap:60px;

align-items:center;

position:relative;

z-index:2;

}



.banner-left h2{

font-size:64px;

font-weight:800;

line-height:1.1;

margin:20px 0;

}



.banner-left p{

font-size:18px;

line-height:2;

max-width:650px;

opacity:.95;

}



.banner-box{

background:rgba(255,255,255,.12);

backdrop-filter:blur(12px);

padding:45px;

border-radius:28px;

text-align:center;

border:1px solid rgba(255,255,255,.15);

transition:.35s;

}



.banner-box:hover{

transform:translateY(-10px);

background:rgba(255,255,255,.18);

}



.banner-box i{

font-size:52px;

color:#D9B54A;

margin-bottom:25px;

}



.banner-box h3{

font-size:30px;

margin-bottom:18px;

}



.banner-box p{

line-height:1.9;

}



/*==================================================
FOOTER
==================================================*/

.news-footer{

background:#F8FAF8;

padding:80px 0 30px;

border-top:5px solid #D9B54A;

}



.news-footer-grid{

display:grid;

grid-template-columns:2fr 1fr 1fr;

gap:60px;

margin-bottom:40px;

}



.footer-logo{

width:90px;

margin-bottom:18px;

}



.footer-brand h3{

font-size:30px;

color:#0B6E3E;

margin-bottom:15px;

}



.footer-brand p{

line-height:1.9;

color:#666;

}



.footer-links h4,

.footer-contact h4{

font-size:20px;

margin-bottom:20px;

color:#0B6E3E;

}



.footer-links ul{

list-style:none;

padding:0;

margin:0;

}



.footer-links li{

margin-bottom:14px;

}



.footer-links a{

text-decoration:none;

color:#666;

transition:.3s;

}



.footer-links a:hover{

color:#0B6E3E;

padding-left:8px;

}



.footer-contact p{

line-height:2;

color:#666;

}



.footer-contact i{

color:#D9B54A;

margin-right:10px;

width:18px;

}



.news-footer hr{

margin:40px 0 20px;

border:none;

height:1px;

background:#DFE6E1;

}



.footer-bottom{

text-align:center;

color:#777;

font-size:14px;

}



/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:1200px){

.news-grid{

grid-template-columns:repeat(2,1fr);

}

}



@media(max-width:991px){

.news-hero-grid,

.featured-layout,

.events-wrapper,

.news-banner-wrapper,

.news-footer-grid{

grid-template-columns:1fr;

}



.news-intro{

text-align:center;

}



.news-buttons{

justify-content:center;

}

}



@media(max-width:768px){

.news-grid{

grid-template-columns:1fr;

}



.category-grid{

grid-template-columns:repeat(2,1fr);

}



.news-intro h1{

font-size:46px;

}



.featured-content h2{

font-size:36px;

}



.events-left h2{

font-size:40px;

}



.banner-left h2{

font-size:42px;

}

}



@media(max-width:480px){

.category-grid{

grid-template-columns:1fr;

}



.news-intro h1{

font-size:36px;

}



.hero-news-content h3{

font-size:24px;

}



.news-body h3{

font-size:22px;

}



.featured-content h2{

font-size:30px;

}

}



/*==================================================
FINAL EFFECTS
==================================================*/

.news-card,

.hero-news-card,

.featured-image,

.banner-box{

transition:all .35s ease;

}



::selection{

background:#0B6E3E;

color:#fff;

}



html{

scroll-behavior:smooth;

}
/*=========================================
NEWS PAGE IMPROVEMENTS
Paste below your current CSS
==========================================*/

/* Hide all news images */
.hero-news-image,
.featured-image,
.news-image{

    display:none;

}

/* Hero layout becomes text + bulletin card */
.news-hero-grid{

    grid-template-columns:55% 45%;
    align-items:center;
    gap:40px;

}

/* Make the hero bulletin more compact */
.hero-news-card{

    min-height:420px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;

}

.hero-news-content{

    padding:40px;

}

.hero-news-content h3{

    font-size:34px;

}

.hero-news-content p{

    margin-top:18px;
    line-height:1.9;

}

/* Featured story becomes full text layout */
.featured-layout{

    display:block;

}

.featured-content{

    max-width:850px;
    margin:auto;
    text-align:left;

}

.featured-content h2{

    font-size:54px;

}

/* Remove the empty image space */
.featured-news{

    padding-top:90px;

}

/* News cards become official notices */
.news-card{

    padding:30px;
    position:relative;

}

.news-body{

    padding:0;

}

/* Remove reserved image height */
.news-image{

    height:0;
    padding:0;
    margin:0;

}

/* Category badge becomes header */
.news-badge{

    position:relative;
    top:auto;
    left:auto;
    display:inline-block;
    margin-bottom:18px;

}

/* Add coloured top border */
.news-card::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:100%;
    height:6px;

    background:#D9B54A;

}

/* Better spacing */
.news-body h3{

    margin-top:10px;

}

/* Featured bulletin look */
.featured-content{

    background:#fff;

    padding:60px;

    border-radius:25px;

    box-shadow:0 20px 60px rgba(0,0,0,.08);

}

/* Hero bulletin shadow */
.hero-news-card{

    box-shadow:0 30px 70px rgba(0,0,0,.12);

}

/* Larger breaking tag */
.breaking-tag{

    justify-content:center;
    font-size:14px;
    letter-spacing:2px;

}

/* Timeline stays exactly as it is */
.events-section{

    background:#fff;

}

/* Better spacing before categories */
.news-categories{

    padding-top:80px;

}

/* Mobile */
@media(max-width:991px){

.news-hero-grid{

grid-template-columns:1fr;

}

.featured-content{

padding:35px;

}

.featured-content h2{

font-size:40px;

}

}
/*==================================================
NEWS LUXURY FINISH
==================================================*/

/* Elegant page fade */

body{

    animation:newsFade .8s ease;

}

@keyframes newsFade{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}

/* Hero */

.news-intro h1{

    text-shadow:
        0 12px 24px rgba(11,110,62,.08);

}

.news-intro p{

    text-wrap:pretty;

}

/* Hero card */

.hero-news-card{

    transition:.45s;

}

.hero-news-card:hover{

    transform:
        translateY(-10px);

}

/* Featured Story */

.featured-content{

    transition:.4s;

}

.featured-content:hover{

    box-shadow:
        0 30px 70px rgba(11,110,62,.12);

}

/* News Cards */

.news-card{

    transition:.4s ease;

}

.news-card:hover{

    transform:
        translateY(-10px);

}

/* Category Cards */

.category-box{

    transition:.35s;

}

.category-box:hover{

    box-shadow:
        0 22px 50px rgba(11,110,62,.18);

}

/* Events */

.event-item{

    transition:.35s;

}

.event-item:hover{

    transform:
        translateX(8px);

}

/* Banner */

.banner-box{

    transition:.45s;

}

.banner-box:hover{

    transform:
        translateY(-8px);

}

/* Read Story */

.read-story{

    transition:.35s;

}

.read-story:hover{

    letter-spacing:.5px;

}