/* ----------------------------------------------------
	You can put your custom css code here: 
-------------------------------------------------------*/

/* ========================================= SECTION =========================================*/

.llabc-news { width: 100%; padding: 90px 5%; background: radial-gradient( circle at 50% 0%, rgba(35, 95, 180, 0.16), transparent 45% ), #070b12; color: #ffffff; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; }

.llabc-news * { box-sizing: border-box; }

/* ========================================= HEADER ========================================= */

.llabc-news-header { max-width: 1400px; margin: 0 auto 45px; display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; } 

.llabc-kicker { display: inline-block; margin-bottom: 12px; font-size: 16px; font-weight: 100; letter-spacing: 0px; color: #5ca8ff; } 

.llabc-news-header h2 { margin: 0 0 12px; font-size: clamp(36px, 5vw, 68px); line-height: 0.95; font-weight: 900; text-transform: uppercase; letter-spacing: -2px; } 

.llabc-news-header p { margin: 0; max-width: 650px; color: #9ca8b8; font-size: 16px; line-height: 1.6; }

/* ========================================= VIEW ALL BUTTON ========================================= */

.llabc-view-all { display: inline-flex; align-items: center; gap: 15px; padding: 15px 22px; border: 1px solid rgba(255,255,255,0.2); color: #ffffff; text-decoration: none; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; transition: all 0.3s ease; white-space: nowrap; } 

.llabc-view-all span { font-size: 20px; transition: transform 0.3s ease; }

.llabc-view-all:hover { background: #ffffff; color: #070b12; } .llabc-view-all:hover span { transform: translateX(5px); }

/* ========================================= GRID ========================================= */

.llabc-news-grid
	{
		max-width: 1400px;
		margin: 0 auto;
		display: grid;
		gap: 25px;
}

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

.llabc-card
 {
	  position: relative;
	  min-width: 0;
	  background: #0e141e; 
	  border: 1px solid rgba(255,255,255,0.08); 
	  overflow: hidden; 
	  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; } .llabc-card:hover { transform: translateY(-8px); 
	  border-color: rgba(92,168,255,0.5); 
	  box-shadow: 0 20px 50px rgba(0,0,0,0.35);
}
	
	/* ========================================= IMAGE ========================================= */ 
	
	.llabc-card-image { position: relative; width: 100%; height: 260px; overflow: hidden; background: #151c27; } .llabc-card-image img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform 0.6s ease; } .llabc-card:hover .llabc-card-image img { transform: scale(1.06); } /* Image overlay */ .llabc-card-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient( to bottom, transparent 35%, rgba(0,0,0,0.7) 100% ); pointer-events: none; }
	
	/* ========================================= DATE BADGE ========================================= */
	
	.llabc-date { position: absolute; left: 18px; bottom: 18px; z-index: 2; padding: 7px 11px; background: #ffffff; color: #070b12; font-size: 11px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; }
	
	
/* ========================================= CARD CONTENT ========================================= */

.llabc-card-content { padding: 25px; } .llabc-card-title { margin: 0 0 13px; font-size: 22px; line-height: 1.2; font-weight: 850; color: #ffffff; } .llabc-card-excerpt { margin: 0 0 22px; color: #9ca8b8; font-size: 14px; line-height: 1.65; } .llabc-read-more { display: inline-flex; align-items: center; gap: 8px; color: #5ca8ff; text-decoration: none; font-size: 12px; font-weight: 900; letter-spacing: 1.2px; text-transform: uppercase; } .llabc-read-more span { transition: transform 0.25s ease; } .llabc-read-more:hover span { transform: translateX(5px); } 

/* ========================================= LOADING ========================================= */ 

.llabc-loading { grid-column: 1 / -1; min-height: 220px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 15px; color: #9ca8b8; } .llabc-spinner { width: 35px; height: 35px; border: 3px solid rgba(255,255,255,0.12); border-top-color: #5ca8ff; border-radius: 50%; animation: llabc-spin 0.8s linear infinite; } @keyframes llabc-spin { to { transform: rotate(360deg); } } 

/* ========================================= ERROR ========================================= */ 

.llabc-error { grid-column: 1 / -1; padding: 40px; text-align: center; color: #9ca8b8; border: 1px solid rgba(255,255,255,0.08); } 

/* ========================================= TABLET ========================================= */

@media (max-width: 1000px) { .llabc-news { padding: 70px 4%; } .llabc-news-grid { grid-template-columns: repeat(2, 1fr); } .llabc-news-header { align-items: flex-start; flex-direction: column; } } 

/* ========================================= MOBILE ========================================= */

@media (max-width: 650px) { .llabc-news { padding: 60px 20px; } .llabc-news-header h2 { font-size: 42px; } .llabc-news-header p { font-size: 14px; } .llabc-news-grid { grid-template-columns: 1fr; gap: 20px; } .llabc-card-image { height: 230px; } .llabc-card-content { padding: 22px; } }

/* ========================================= REDUCED MOTION ========================================= */

@media (prefers-reduced-motion: reduce) { .llabc-card, .llabc-card-image img, .llabc-view-all span, .llabc-read-more span { transition: none; } .llabc-spinner { animation: none; } }