@import url('https://fonts.googleapis.com/css2?family=Alata&family=Cantata+One&display=swap');

/* Reset and Base Styles */
/* Home critical – header, hero, explore by (match PNG) */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

:root {
  --home-dark: #2E3A59;
  --home-olive: #A2A089;
  --home-light: #F5F5F5;
  --home-text: #1a1a1a;
  --home-text-muted: #6b6b6b;
  --home-gold: #FFC107;
  --home-lightblue: #8fa2c0;
}


/* .home-layout {
  margin: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
} */

/* .home-layout .home-container {
  width: 100%;margin: 0 auto;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;background: var(--home-dark);
} */

/* Global img-wrap styles */
/* .home-layout .img-wrap {
  width: 100%;height: 100%;overflow: hidden;display: block;
}

.home-layout .img-wrap img {
  width: 100%;height: auto;display: block;-o-object-fit: cover;object-fit: cover;
}

.home-layout .home-wrap {
  width: 100%;max-width: 1440px;margin: 0 auto;font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;color: var(--home-text);
} */

/* 1. Header – dark blue */
.home-header {
  background: var(--home-dark);padding: 14px 40px;width: 100%;
}
.home-header-inner { max-width: 1440px; margin: 0 auto; height: 105px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 177px; }
.home-logo {display: flex;align-items: center;gap: 10px;text-decoration: none;flex-shrink: 0;}
.home-header .home-logo svg { display: block; width: 100%; max-width: 156px; height: auto; }
.home-logo-icon { width: 32px; height: 32px; background: var(--home-gold); border-radius: 4px; flex-shrink: 0; }
.home-logo-text {font-size: 17px;font-weight: 700;letter-spacing: 0.02em;}
.logo-global { color: var(--home-gold); }
.logo-horizon { color: var(--home-lightblue); }
.home-nav {display: flex;gap: 34px;align-items: center;}
.home-nav a { color: #fff; text-decoration: none; font-size: 20px; transition: color 0.2s ease; }
.home-nav a:hover { text-decoration: underline;opacity: 0.9;}
.home-search-wrap { flex-shrink: 0; display: flex; align-items: center; border-radius: 121px; background-color: var(--home-dark); border: 2px solid var(--home-light); width: 100%; max-width: 253px; height: 46px; padding: 10px; transition: border-color 0.2s ease; }
.home-search-wrap:focus-within {border-color: var(--home-gold);}
.home-search { width: 100%; max-width: 200px; padding: 10px 14px 10px 36px; font-size: 14px; border: none; border-radius: 8px; background-color: var(--home-dark); color: var(--home-light); outline: none; }
.home-search::placeholder { color: var(--home-light);opacity: 0.7;}

@media (max-width: 1440px){
  .home-header-inner { padding: 0 100px; }
  .home-layout .home-header-inner { padding: 0 100px; }
}
@media (max-width: 1200px){
  
  .home-header { padding: 14px 30px; }
  .home-header-inner { max-width: 100%; padding: 0 60px; height: 95px; }
  .home-layout .home-header-inner { max-width: 100%; padding: 0 60px; }
  .home-header .home-nav { gap: 28px; }
  .home-header  .home-nav a { font-size: 19px; }
  .home-header.home-search-wrap { max-width: 230px; height: 44px; }
}
@media (max-width: 992px){
  .home-header { padding: 12px 24px; }
  .home-header .home-header-inner { flex-wrap: wrap; height: auto; min-height: 95px; padding: 14px 40px; gap: 20px;}
  .home-header  .home-logo { order: 1; }
  .home-header.home-search-wrap { order: 2; max-width: 200px; height: 42px; }
  .home-header .home-nav { order: 3; justify-content: center; gap: 24px; margin-top: 10px;}
  .home-header .home-nav a { font-size: 18px; }
  .home-header .home-logo svg { max-width: 140px; }
}
@media (max-width: 768px){
  .home-header { padding: 12px 20px; }
  .home-header .home-header-inner { padding: 12px 20px; min-height: 80px; gap: 16px;flex-wrap: nowrap; justify-content: space-between;}
  .home-header .home-logo { order: 1; flex: 0 0 auto; }
  .home-header .home-search-wrap { order: 2; max-width: 160px; height: 40px; padding: 8px;margin-left: auto;}
  .home-header .home-search { max-width: 140px; font-size: 13px; padding: 8px 12px 8px 30px;}
  .home-header .home-nav { display: none; }
}
@media (max-width: 480px){
  .home-header { padding: 10px 16px; }
  .home-header-inner { padding: 10px 16px; min-height: 70px; gap: 12px;}
  .home-logo { flex: 0 0 auto; }
  .home-search-wrap { max-width: 140px; height: 36px; padding: 6px;border-width: 1.5px;}
  .home-search { max-width: 120px; font-size: 12px; padding: 6px 10px 6px 28px;}
  .home-search::placeholder { font-size: 12px; }
}
@media (max-width: 360px){
  .home-header { padding: 8px 12px; }
  .home-header .home-header-inner { padding: 8px 12px; min-height: 65px; gap: 10px;}
  .home-header .home-logo-icon { width: 26px; height: 26px; }
  .home-header .home-search-wrap { max-width: 120px; height: 34px; padding: 5px;border-width: 1px;}
  .home-header .home-search { max-width: 100px; font-size: 11px; padding: 5px 8px 5px 24px;}
  .home-header .home-search::placeholder { font-size: 11px; }
}
/* Header css ends here  */










                                         /* Home -page css Starts here  */



.home-layout .home-hero {background: #fff;}
.home-layout .home-hero-inner {max-width: 1220px;margin: 0 auto;display: -ms-grid;display: grid;-ms-grid-columns: 1fr 24px 1fr;grid-template-columns: 1fr 1fr;gap: 31px;padding: 61px 60px 61px;}
.home-layout .home-hero-card {position: relative;display: flex;flex-direction: column;align-items: center;justify-content: flex-end;border-radius: 14px;overflow: hidden;height: 495px;box-shadow: 0px 0px 16px 0px #00000040;
  text-decoration: none;color: inherit;}
.home-layout .home-hero-card:hover { box-shadow: 0 8px 28px rgba(0,0,0,0.12); }
.home-layout .home-hero-card-img {width: 100%;height: 100%;overflow: hidden;position: absolute;top: 0;left: 0;}
.home-layout .home-hero-card-img .img-wrap {width: 100%;height: 100%;}
.home-layout .home-hero-card-img .img-wrap img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; }
.home-layout .home-hero-card-overlay { position: absolute; bottom: 23px; left: 24px; right: 24px; background: rgba(255,255,255,0.98); padding: 22px 37px 28px 30px; border-radius: 14px; font-size: 24px; line-height: 1.4; z-index: 2; font-weight: 400; color: #3C3C3C; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }


 .section-header {border-bottom: 1px solid; padding-bottom: 34px;margin-bottom: 36px;font-size: 24px;line-height: 29px; text-transform: uppercase;}
 
.home-layout .explore-section {max-width: 1220px;margin: 0 auto;padding: 0 60px;}
.home-layout .explore-header {display: flex;justify-content: space-between;align-items: center; color: #344361;}
.home-layout .view-all {font-size: 21px;line-height: 26px;color: #344361;text-decoration: none;font-weight: 600;}
.home-layout .explore-list {list-style: none;display: flex;padding: 0;margin: 0;flex-wrap: wrap;justify-content: space-between;gap: 40px;}
.home-layout .explore-list li {text-align: center;cursor: pointer;margin-bottom: 59px;}
.home-layout .explore-list .explore-item {text-decoration: none;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.home-layout .circle {width: 152px;height: 152px;border-radius: 50%;overflow: hidden;margin-bottom: 27px;box-shadow: 0px 0px 16px 0px #00000040;}
.home-layout .circle img {width: 100%;height: 100%;object-fit: cover;}
.home-layout .explore-list span {display: block;font-size: 24px;line-height: 29px;font-weight: 500;color: #344361;}


/*  Hero Responsive */

/* Extra Large Screens - Desktop */

/* Large Screens - Desktop/Laptop */
@media (max-width: 1200px) {
  .home-layout .home-hero-inner { max-width: 100%; padding: 50px 60px; }
  .home-layout .home-hero-card { height: 420px; }
  .home-layout .home-hero-card-overlay { font-size: 20px; padding: 18px 28px 22px; bottom: 20px; left: 20px; right: 20px; }
  .section-header { font-size: 22px; padding-bottom: 28px; margin-bottom: 32px; }
  .home-layout .circle { width: 130px; height: 130px; margin-bottom: 22px; }
  .home-layout .explore-list span { font-size: 22px; }
}

/* Tablets Landscape */
@media (max-width: 992px) {
  
  
  /* .home-layout .home-header-inner { flex-wrap: wrap; height: auto; min-height: 105px; padding: 14px 40px; }
  .home-layout .home-nav { order: 3; justify-content: center; gap: 24px; width: 100%; }
  .home-layout .home-nav a { font-size: 18px; }
  .home-layout .home-search-wrap { max-width: 220px; } */
  .home-layout .home-hero-inner { grid-template-columns: 1fr; gap: 24px; padding: 32px 40px 40px; }
  .home-layout .home-hero-card { height: 380px; }
  .home-layout .home-hero-card-overlay { font-size: 18px; padding: 16px 24px 20px; }
  .home-layout .explore-section { padding: 0 40px; }
  .section-header { font-size: 20px; padding-bottom: 25px; margin-bottom: 28px; }
  .home-layout .explore-list { gap: 32px; justify-content: center; }
  .home-layout .circle { width: 120px; height: 120px; margin-bottom: 20px; }
  .home-layout .explore-list span { font-size: 20px; }
}

/* Tablets Portrait */
@media (max-width: 768px) {

  
  /* .home-layout .home-header { padding: 12px 20px; }
  .home-layout .home-header-inner { padding: 12px 20px; min-height: 80px; gap: 16px; }
  .home-layout .home-header .home-logo svg { max-width: 120px; }
  .home-layout .home-nav { display: none; }
  .home-layout .home-search-wrap { max-width: 180px; height: 40px; } */
  .home-layout .home-hero-inner { gap: 20px; padding: 24px 20px 32px;}
  .home-layout .home-hero-card { height: 320px; }
  .home-layout .home-hero-card-overlay { font-size: 16px; padding: 14px 18px 18px; bottom: 16px; left: 16px; right: 16px; }
  .home-layout .explore-section { padding: 0 20px; }
  .section-header { font-size: 18px; padding-bottom: 20px; margin-bottom: 24px; }
  .home-layout .view-all { font-size: 18px; }
  .home-layout .explore-list { gap: 24px; }
  .home-layout .explore-list li { margin-bottom: 40px; }
  .home-layout .circle { width: 100px; height: 100px; margin-bottom: 18px; }
  .home-layout .explore-list span { font-size: 18px; }
}

/* Mobile Phones */
@media (max-width: 480px) {

  
  /* .home-layout .home-header { padding: 10px 16px; }
  .home-layout .home-header-inner { padding: 10px 16px; min-height: 70px; gap: 12px; }
  .home-layout .home-header .home-logo svg { max-width: 100px; }
  .home-layout .home-search-wrap { max-width: 150px; height: 36px; } */
  .home-layout .home-hero-inner { gap: 16px; padding: 20px 16px 28px;}
  .home-layout .home-hero-card { height: 280px; border-radius: 12px; }
  .home-layout .home-hero-card-overlay { font-size: 14px; padding: 12px 16px 16px; bottom: 12px; left: 12px; right: 12px; border-radius: 12px; }
  .home-layout .explore-section { padding: 0 16px; }
  .section-header { font-size: 16px; padding-bottom: 18px; margin-bottom: 20px; }
  .home-layout .view-all { font-size: 16px; }
  .home-layout .explore-list { gap: 20px; }
  .home-layout .explore-list li { margin-bottom: 32px; }
  .home-layout .circle { width: 85px; height: 85px; margin-bottom: 16px; box-shadow: 0px 0px 12px 0px #00000040; }
  .home-layout .explore-list span { font-size: 16px; }
}

/* Small Mobile Phones */
@media (max-width: 360px) {
 
  
  /* .home-layout .home-header { padding: 8px 12px; }
  .home-layout .home-header-inner { padding: 8px 12px; min-height: 65px; }
  .home-layout .home-header .home-logo svg { max-width: 90px; }
  .home-layout .home-search-wrap { max-width: 130px; height: 34px; } */

  .home-layout .home-hero-inner {padding: 16px 12px 24px;}

  .home-layout .home-hero-card { height: 250px; }
  .home-layout .home-hero-card-overlay { font-size: 13px; padding: 10px 14px 14px; bottom: 10px; left: 10px; right: 10px; }
  .home-layout .explore-section { padding: 0 12px; }
  .section-header { font-size: 15px; }
  .home-layout .view-all { font-size: 15px; }
  .home-layout .circle { width: 75px; height: 75px; margin-bottom: 14px; }
  .home-layout .explore-list span { font-size: 15px; }
}

















/* 3. Explore By */
/* .home-layout .explore-by {background: #fff;padding: 0 40px 44px;}
.home-layout .explore-by-inner { max-width: 1200px; margin: 0 auto; }
.home-layout .explore-by-header {display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid var(--home-text);padding-bottom: 14px;margin-bottom: 28px;}
.home-layout .explore-by-title { font-size: 18px; font-weight: 700; letter-spacing: 0.08em; color: var(--home-text); margin: 0; }
.home-layout .explore-by-seeall { font-size: 15px; color: var(--home-text); text-decoration: none; }
.home-layout .explore-arrow { margin-left: 4px; }
.home-layout .explore-by-seeall:hover { text-decoration: underline; }
.home-layout .explore-by-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; }
.home-layout .explore-by-item { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: var(--home-text); }
.home-layout .explore-by-circle { width: 154px; height: 154px; border-radius: 50%; overflow: hidden; margin-bottom: 10px; border: 1px solid #e0e0e0; -webkit-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.25); box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.25);}
.home-layout .explore-by-circle .img-wrap { width: 100%; height: 100%; }
.home-layout .explore-by-circle .img-wrap img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; }
.home-layout .explore-by-list span { font-size: 15px; font-weight: 500; color: var(--home-text); } */



/* home css  */




/* Global img-wrap styles */
/* .img-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
}

.img-wrap img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
} */





/* home-layout .section-2 start */
.home-layout .section-2 {background: #A2A089;}
.home-layout .section-2 .ep-container {max-width: 1220px;height: 640px; margin: 0 auto;padding: 48px 60px 0;}
.home-layout .section-2 .ep-header {color: #ffffff;}
.home-layout .section-2 .ep-line {display: block;width: 100%; height: 1px; background: #fff;}
/* RESET */
.home-layout .section-2 .ep-row {list-style: none;padding: 0;margin: 0;}
/* ROW */
.home-layout .section-2 .ep-row {display: flex;gap: 40px;}
/* CARD */
.home-layout .section-2 .ep-card {background: #ffffff;border-radius: 18px;flex: 1;box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.251);position: relative;}
/* IMAGE */
.home-layout .section-2 .ep-card .img-wrap {position: relative;width: 100%;height: 299px;object-fit: cover;display: block;border-radius: 14px;}
.home-layout .section-2 .ep-card img {width: 100%; height: 100%;border-top-left-radius: 14px;border-top-right-radius: 14px;}

/* CONTENT */
.home-layout .section-2 .ep-content {position: absolute;padding: 24px 70px 28px 27px;margin: 0;height: 164px;border-radius: 14px;bottom: -137px;left: 0;right: 0;z-index: 10;background-color: #fff;overflow: hidden;word-break: break-word;}
.home-layout .section-2 .ep-card-link {text-decoration: none;display: block;}
.home-layout .section-2 .ep-card-link:hover {text-decoration: underline;}    
.home-layout .section-2 .ep-card-link:hover  .ep-content p{text-decoration: underline; text-decoration-color: #6B6849;}    
.home-layout .section-2 .ep-content p {display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; font-size: 24px;line-height: 32px;max-height: 96px;color: #3C3C3C;overflow: hidden;}   
/* NUMBER */
.home-layout .section-2 .ep-number {position: absolute ;bottom: 16px;right: 28px;font-size: 45px; line-height: 57px; font-weight: 700;color: #1f2b4d; font-family: "Cantata One", -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;}
.home-layout .section-2 .ep-card:hover  {text-decoration: underline;cursor: pointer;}

/* SECTION-2 RESPONSIVE */

@media (max-width: 1200px) {
  .home-layout .section-2 .ep-container {height: auto;padding-bottom: 180px;}
  .home-layout .section-2 .ep-row {gap: 30px;}
  .home-layout .section-2 .ep-card .img-wrap {height: 250px;}
  .home-layout .section-2 .ep-content {padding: 20px 50px 24px 20px;}
  .home-layout .section-2 .ep-content p {font-size: 20px;line-height: 30px;max-height: 90px;}
  .home-layout .section-2 .ep-number {bottom: 6px; right: 16px;}
}

@media (max-width: 992px) {
  .home-layout .section-2 .ep-container {padding: 40px 40px 0 40px;padding-bottom: 40px;}
  .home-layout .section-2 .ep-header p {font-size: 20px;line-height: 24px;margin-bottom: 25px;}
  .home-layout .section-2 .ep-row {flex-direction: column;gap: 40px;}
  .home-layout .section-2 .ep-card {width: 100%;}
  .home-layout .section-2 .ep-card .img-wrap {height: 280px;}
  .home-layout .section-2 .ep-content {position: relative;bottom: 0;height: auto;}
  .home-layout .section-2 .ep-number {font-size: 35px;}
}
/* home-layout .section-2 end */
@media (max-width: 768px) {
  .home-layout .section-2 .ep-container {padding: 30px 20px 0 20px;padding-bottom: 40px;margin-bottom: 30px;}
  .home-layout .section-2 .ep-header p {font-size: 18px;line-height: 22px;margin-bottom: 20px;}
  .home-layout .section-2 .ep-row {gap: 30px;}
  .home-layout .section-2 .ep-card .img-wrap {height: 220px;}
}

@media (max-width: 480px) {
  .home-layout .section-2 .ep-container {padding: 25px 16px 0 16px;padding-bottom: 30px;}
  .home-layout .section-2 .ep-header p {font-size: 16px;line-height: 20px;}
  .home-layout .section-2 .ep-row {gap: 25px;}
  .home-layout .section-2 .ep-card {border-radius: 14px;}
  .home-layout .section-2 .ep-card .img-wrap {height: 180px;border-radius: 12px;}
  .home-layout .section-2 .ep-card img {border-top-left-radius: 12px;border-top-right-radius: 12px;}
  .home-layout .section-2 .ep-content {padding: 15px 35px 18px 15px;font-size: 16px;line-height: 20px;border-radius: 12px;}
  .home-layout .section-2 .ep-content p {font-size: 16px;line-height: 20px;}
  .home-layout .section-2 .ep-number {font-size: 18px;}
}

@media (max-width: 360px) {
  .home-layout .section-2 .ep-container {padding: 25px 12px;}
}







 /* 4. Latest News / Blog (white) – two columns */
 .home-layout .section-3 {background: #fff;width: 100%;}
 .home-layout  .section-3 .blog-layout { background: #fff;}
 .home-layout .section-3 .blog-container {max-width: 1220px;margin: 0 auto;padding: 59px 60px 0; margin-bottom: 69px;}
 .home-layout  .section-3  .blog-layout .container {display: flex;}
 .home-layout  .section-3 .blog-header p {color: #344361;}
 .home-layout  .section-3 .blog-line {display: block;width: 100%; height: 1px; background: #344361;}
 
 /* LEFT CONTENT */
 .home-layout .section-3 .container .content {flex: 2;text-decoration: none;}
 .home-layout .section-3 .container .small-title {font-size: 14px;letter-spacing: 1px;color: #1f3c88;border-bottom: 1px solid #1f3c88;display: inline-block;margin-bottom: 20px;}
 .home-layout .section-3 .container .content h2 {font-size: 24px;line-height: 29px;max-height: 58px;margin-bottom: 20px;color: #3C3C3C;overflow: hidden;max-width: 512px;word-break: break-word;}
 .home-layout .section-3 .container .content p {font-size: 18px;line-height: 25px;max-height: 175px;color: #8B8B8B;margin-bottom: 30px;overflow: hidden;word-break: break-word;max-width: 576px;}
 .home-layout .section-3 .container .img-wrap{width: 100%;height: 330px;max-width: 591px;box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.251);border-radius: 14px;}
 .home-layout .section-3 .container .main-image { width: 100%;height: 100%;border-radius: 14px;object-fit: cover;}
 /* SIDEBAR */
 .home-layout .section-3 .sidebar {flex: 1.5;margin-left:67px;}
 .home-layout .section-3 .sidebar h4 {font-size: 24px;margin-bottom: 27px;line-height: 29px;max-height: 29px;color: #344361;}
 .home-layout .section-3 .tags {list-style: none;padding: 0;display: flex;flex-wrap: wrap;gap: 10px;margin-bottom: 35px;}
 
 .home-layout .section-3 .tags li {background: #8A9CBC;color: #fff;padding: 6px 12px;border-radius: 4px;font-size: 15px;line-height: 20px;cursor: pointer;}
 .home-layout .section-3 .related-post {display: block; border-radius: 10px;margin-top: 40px;}
 .home-layout .section-3 .related-post:first-child {margin-top: 0;}
 .home-layout .section-3 .related-post .img-wrap {height: 142px; width: 100%;overflow: hidden;margin-bottom: 21px; border-radius: 14px;box-shadow: 0px 0px 5.8px 0px rgba(0, 0, 0, 0.251);}
 .home-layout .section-3 .related-post img {width: 100%;height: 100%;border-radius: 14px;margin-bottom: 10px;}
 .home-layout .section-3 .related-post p {font-size: 21px;line-height: 26px;color: #3C3C3C;max-height: 52px;overflow: hidden;word-wrap: break-word;}
 
 /* RESPONSIVE */
 @media (max-width: 1440px) {
   /* .section-3 .blog-layout .container{
     padding: 59px 100px 0 100px;
   } */
 }
 
 @media (max-width: 1200px) {
   .home-layout .section-3 .blog-container{padding: 50px 60px 0 60px;}
   .home-layout .section-3 .sidebar {  margin-left: 40px;}
 }
 
 @media (max-width: 992px) {
   .home-layout .section-3 .blog-container {padding: 40px 40px 0 40px;}
   .home-layout .section-3 .blog-layout .container {flex-direction: column;}
   .home-layout .section-3 .sidebar {margin-left: 0;margin-top: 40px;}
   .home-layout .section-3 .container .content h2 {max-width: 100%;max-height: none;}
   .home-layout .section-3 .container .content p {max-width: 100%;max-height: none;}
   .home-layout .section-3 .container .img-wrap {max-width: 100%;}
 }
 
 @media (max-width: 768px) {
   .home-layout .section-3 .blog-container{padding: 30px 20px 0 20px;}
   .home-layout .section-3 .blog-header p {font-size: 20px;line-height: 24px;margin-bottom: 20px;}
   .home-layout .section-3 .container .content h2 {font-size: 20px;line-height: 24px;margin-bottom: 15px;}
   .home-layout .section-3 .container .content p {font-size: 16px;line-height: 22px;margin-bottom: 20px;}
   .home-layout .section-3 .container .img-wrap {height: 250px;margin-bottom: 20px;}
   .home-layout .section-3 .sidebar {margin-top: 30px;}
   .home-layout .section-3 .sidebar h4 {font-size: 20px;line-height: 24px;margin-bottom: 20px;}
   .home-layout .section-3 .tags {gap: 8px;margin-bottom: 25px;}
   .home-layout .section-3 .tags li {font-size: 14px;line-height: 18px;padding: 5px 10px;}
   .home-layout .section-3 .related-post {margin-bottom: 25px;}
   .home-layout .section-3 .related-post .img-wrap {height: 180px;margin-bottom: 15px;}
   .home-layout .section-3 .related-post p {font-size: 18px;line-height: 22px;max-height: none;}
 }
 
 @media (max-width: 480px) {
   .home-layout .section-3 .blog-container{padding: 25px 16px 0 16px;}
   
   .home-layout .section-3 .blog-header p {font-size: 18px;line-height: 22px;}
   .home-layout .section-3 .blog-container{margin-bottom: 0;}
   .home-layout .section-3 .container .content h2 {font-size: 18px;line-height: 22px;}
   .home-layout .section-3 .container .content p {font-size: 15px;line-height: 20px;}
   .home-layout .section-3 .container .img-wrap {height: 200px;}
   .home-layout .section-3 .sidebar h4 {font-size: 18px;line-height: 22px;}
   .home-layout .section-3 .tags li {font-size: 13px;padding: 4px 8px;}
   .home-layout .section-3 .related-post .img-wrap {height: 150px;}
   .home-layout .section-3 .related-post p {font-size: 16px;line-height: 20px;}
 }

 @media (max-width: 360px) {
  .home-layout .section-3 .blog-container {padding: 25px 12px 0 12px;}
 }
















 .home-layout .section-4 {background: #F5F5F5;}
 .home-layout .section-4-container {max-width: 1220px;margin: 0 auto;padding: 59px 60px 0;}
 .home-layout .section-4-header {color: #344361;}
 .home-layout .section-4-line {display: block;width: 100%;height: 1px;background: #344361;}
 .home-layout .section-4-cards {display: flex;flex-wrap: wrap;justify-content: space-between;padding-bottom: 45px;}
 .home-layout .section-4-card {display: flex;align-items: center; justify-content: space-between;margin-bottom: 30px; max-width: 528px;background: #fff;border-radius: 14px;padding: 18px;width: calc(50% - 12px);box-shadow: 0px 4px 16px 0px #90909040;}
 .home-layout .section-4 .card-img{max-width: 208px;height: 175px;overflow: hidden;border-radius: 10px;flex: 0 0 208px;}
 .home-layout .section-4 .card-img img {width: 100%;height: 100%;object-fit: cover;border-radius: 10px;}
 .home-layout .section-4 .card-content {display: flex;flex-direction: column;margin-left: 22px;max-width: 248px;}
 .home-layout .section-4 .card-number {font-size: 43px;font-weight: 700;color: #344054;border-bottom: 2px solid #E7E2E2; font-family: "Cantata One", -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;}
 .home-layout .section-4 .card-content p {font-size: 21px;line-height: 34px;max-height: 75px;margin-top: 8px;color: #475467;overflow: hidden;word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
 
 /* SECTION-4 RESPONSIVE */

 @media (max-width: 1200px) {
   .home-layout .section-4-container {padding: 50px 60px 0 60px;}
   .home-layout .section-4-cards {gap: 15px;}
   .home-layout .section-4-card {width: calc(50% - 8px);padding: 16px;}
   .home-layout .section-4 .card-img {max-width: 180px;height: 150px;flex: 0 0 180px;}
   .home-layout .section-4 .card-content {margin-left: 18px;max-width: 268px;}
   .home-layout .section-4 .card-number {font-size: 38px;}
   .home-layout .section-4 .card-content p {font-size: 19px;line-height: 30px;max-height: 60px;}
 }
 
 @media (max-width: 1100px) {
   .home-layout .section-4-card {width: 100%; max-width: none;}
   .home-layout .section-4 .card-img {max-width: 200px;height: 160px;flex: 0 0 200px;}
   
   .home-layout .section-4 .card-content {max-width: 100%;flex: 1;}
 }
 
 @media (max-width: 992px) {
   .home-layout .section-4-container {padding: 40px 40px 0 40px;}
   .home-layout .section-4-card {width: 100%;padding: 15px;}
   .home-layout .section-4 .card-img {max-width: 160px;height: 135px;flex: 0 0 160px;}
   .home-layout .section-4 .card-content { margin-left: 15px; max-width: 100%;flex: 1;}
   .home-layout .section-4 .card-number {font-size: 35px;}
   .home-layout .section-4 .card-content p {font-size: 18px;line-height: 28px;max-height: 56px;}
 }
 
 @media (max-width: 768px) {
   .home-layout .section-4-container {padding: 30px 20px 0 20px;}
   .home-layout .section-4-card {flex-direction: column;align-items: flex-start;padding: 15px;width: 100%;}
   .home-layout .section-4 .card-img {max-width: 100%;width: 100%;height: 200px;flex: 0 0 auto;margin-bottom: 15px;}
   .home-layout .section-4 .card-content {margin-left: 0;margin-top: 0;max-width: 100%;width: 100%;}
   .home-layout .section-4 .card-number {font-size: 32px;}
   .home-layout .section-4 .card-content p {font-size: 17px;line-height: 26px;max-height: 52px;margin-top: 6px;}
 }
 
 @media (max-width: 480px) {
   .home-layout .section-4-container {padding: 25px 16px 0 16px;} 
   .home-layout .section-4-cards {gap: 12px;}
   .home-layout .section-4-card {padding: 12px;border-radius: 12px;}
   .home-layout .section-4 .card-img {height: 180px;border-radius: 8px;margin-bottom: 12px;}
   .home-layout .section-4 .card-number {font-size: 28px;}
   .home-layout .section-4 .card-content p {font-size: 15px;line-height: 22px;max-height: 44px;margin-top: 5px;}
 }
 
 @media (max-width: 360px) {
   .home-layout .section-4-container {padding: 20px 12px 0 12px;}
   .home-layout .section-4-cards {gap: 10px;}
   .home-layout .section-4-card {padding: 10px;border-radius: 10px;}
   .home-layout .section-4 .card-img {height: 160px;border-radius: 6px;margin-bottom: 10px;}
   .home-layout .section-4 .card-number {font-size: 24px;}
   .home-layout .section-4 .card-content p {font-size: 14px;line-height: 20px;max-height: 40px;margin-top: 4px;}
 }
















  /* section-5  */
.home-layout  .carousel-section {background-color: #FFF;overflow: hidden;}
.home-layout .carousel-container {max-width: 1220px;margin: auto;text-align: center;padding: 61px 60px 61px;}
.home-layout .section-5-header {text-align: left;}
.home-layout .section-line {display: block;width: 100%;height: 1px;background: #aaa;margin: 12px 0 40px;}
.home-layout .carousel-wrapper {display: flex;align-items: center;justify-content: center;position: relative;overflow: hidden;}
.home-layout .carousel-track {display: flex;gap: 30px;overflow-x: auto;overflow-y: hidden;scroll-snap-type: x mandatory;-webkit-overflow-scrolling: touch;scroll-behavior: smooth;scrollbar-width: none;-ms-overflow-style: none;}
.home-layout .carousel-track::-webkit-scrollbar {display: none;}
.home-layout .carousel-section .card {scroll-snap-align: start;}
.home-layout .card {width: 369px;height:429px;padding: 44px 31px 18px 31px;border-radius: 10px;flex-shrink: 0;transition: all 0.4s ease;color: #fff;display: flex;flex-direction: column;align-items: center;}
.home-layout .card .img-wrap {height:94px; width:94px; border-radius: 50%;margin-bottom: 15px;overflow: hidden;margin-bottom: 14px;} 
.home-layout .card .img-wrap img {height: 100%;width: 100%;}
.home-layout .card h3 {font-size: 21px;line-height: 26px;max-height: 78px;margin-bottom: 10px;color: #fff;margin-bottom: 22px;}
.home-layout .card p {font-size: 16px;line-height:21px;max-height: 105px;color: #fff;overflow: hidden;}
.home-layout .card.light {background: #8fa2c0;}
.home-layout .card.dark {background: #2f3e5c;}
.home-layout .card.active {transform: scale(1.1);z-index: 2;}  
.home-layout .arrow {background: none;border: none;font-size: 28px;cursor: pointer;color: #999;padding: 10px;transition: color 0.2s, opacity 0.2s;}
.home-layout .arrow:hover:not(:disabled) {color: #555;}
.home-layout .arrow:focus {outline: none;}
.home-layout .carousel-section .arrow.carousel-arrow-disabled,
.home-layout .carousel-section .arrow:disabled {opacity: 0.35;cursor: not-allowed;}
.home-layout .dots {margin-top: 25px;}
.home-layout .dot {width: 8px;height: 8px;background: #bbb;border-radius: 50%;display: inline-block;margin: 0 4px;cursor: pointer;transition: background 0.2s;}
.home-layout .dot:hover {background: #888;}
.home-layout .dot.active {background: #555;}
/* Section 5 carousel responsive */

@media (max-width: 1200px) {
  .home-layout .carousel-container { padding: 50px 60px; }
  .home-layout .section-line { margin: 10px 0 36px; }
  .home-layout .card { width: 280px; height: 326px; padding: 24px 18px; }
  .home-layout .card h3 { font-size: 15px; }
  .home-layout .card p { font-size: 13px; }
}

@media (max-width: 992px) {
  .home-layout .carousel-container { padding: 40px 40px; }
  .home-layout .section-line { margin: 10px 0 32px; }
  .home-layout .carousel-wrapper { gap: 16px; }
  .home-layout .carousel-track { gap: 20px; }
  .home-layout .card { width: 260px; height: 302px; padding: 22px 16px; }
  .home-layout .card img { margin-bottom: 12px; }
  .home-layout .card h3 { font-size: 14px; margin-bottom: 8px; }
  .home-layout .card p { font-size: 12px; line-height: 1.5; }
  .home-layout .arrow { font-size: 24px; padding: 8px; }
  .home-layout .dots { margin-top: 20px; }
  .home-layout .dot { width: 6px; height: 6px; margin: 0 3px; }
}

@media (max-width: 768px) {
  .home-layout .carousel-container { padding: 32px 20px; }
  .home-layout .section-line { margin: 8px 0 24px; }
  .home-layout .carousel-track { gap: 16px; }
  .home-layout .card { width: 240px; padding: 20px 14px; }
  .home-layout .card.light, .home-layout .card.dark { padding: 20px 14px; }
  .home-layout .card.active { transform: scale(1.05); }
  .home-layout .card img { width: 50px; height: 50px; }
  .home-layout .card h3 { font-size: 13px; }
  .home-layout .card p { font-size: 11px; }
  .home-layout .arrow { font-size: 22px; padding: 6px; }
  .home-layout .dots { margin-top: 18px; }
}

@media (max-width: 480px) {
  .home-layout .carousel-container { padding: 28px 16px; }
  .home-layout .section-line { margin: 6px 0 20px; }
  .home-layout .carousel-track { gap: 12px; }
  .home-layout .card { width: 220px; padding: 18px 12px; border-radius: 8px; }
  .home-layout .card img { width: 45px; height: 45px; margin-bottom: 10px; }
  .home-layout .card h3 { font-size: 12px; margin-bottom: 6px; }
  .home-layout .card p { font-size: 10px; line-height: 1.4; }
  .home-layout .arrow { font-size: 20px; padding: 6px; }
  .home-layout .dots { margin-top: 16px; }
  .home-layout .dot { width: 5px; height: 5px; }
}

@media (max-width: 360px) {
  .home-layout .carousel-container { padding: 24px 12px; }
  .home-layout .card { width: 200px; padding: 16px 10px; }
  .home-layout .card img { width: 40px; height: 40px; }
  .home-layout .card h3 { font-size: 11px; }
  .home-layout .card p { font-size: 9px; }
}
/* section 5 css ends here  */







/* section-6 css starts here  */
.home-layout .featured-section {background-color: #A2A089;}
.home-layout .featured-container {max-width: 1220px;margin: auto;padding: 86px 60px;}
.home-layout .featured-header {color: #fff;}
.home-layout .featured-header .line {display: block;width: 100%;height: 1px;background: rgba(255,255,255,0.6);margin: 12px 0 40px;}
.home-layout .featured-cards {display: flex;gap: 40px;flex-wrap: wrap;}
.home-layout .featured-card {position: relative;flex: 1;min-width: 300px;min-height: 220px;aspect-ratio: 16/10;border-radius: 12px;overflow: hidden;box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.251);}
.home-layout .featured-card img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;display: block;}
.home-layout .card-text {position: absolute;bottom: 24px;left: 24px;right: 24px;background: #fff;padding: 14px 18px;border-radius: 8px;font-size: 15px;line-height: 1.4;color: #333;max-width: calc(100% - 48px);box-shadow: 0 6px 20px rgba(0,0,0,0.15);}

/* Section 6 featured responsive */
@media (max-width: 1440px) {.home-layout .featured-container { padding: 70px 60px; }}
@media (max-width: 1200px) {
 .home-layout .featured-cards { gap: 32px; }
 .home-layout .featured-card { min-width: 280px; }
 .home-layout .featured-header .featured-header-content { font-size: 15px; }
 .home-layout .card-text { font-size: 14px; padding: 12px 16px; }
}
@media (max-width: 992px) {
 .home-layout .featured-container { padding: 50px 40px 50px 40px; }
 .home-layout .featured-header .line { margin: 10px 0 32px; }
 .home-layout .featured-cards { gap: 28px; justify-content: center; }
 .home-layout .featured-card { flex: 1 1 100%; max-width: 520px; margin: 0 auto; min-width: 0; min-height: 200px; }
 .home-layout .card-text { font-size: 14px; bottom: 20px; left: 20px; right: 20px; max-width: none; }
}

@media (max-width: 768px) {
 .home-layout .featured-container { padding: 40px 20px 40px 20px; }
 .home-layout .featured-header h2 { font-size: 14px; letter-spacing: 0.5px; }
 .home-layout .featured-header .line { margin: 8px 0 24px; }
 .home-layout .featured-cards { gap: 24px; }
 .home-layout .featured-card { min-height: 180px; max-width: 100%; }
 .home-layout .card-text { font-size: 13px; padding: 12px 14px; bottom: 16px; left: 16px; right: 16px; }
}

@media (max-width: 480px) {
 .home-layout .featured-container { padding: 32px 16px 32px 16px; }
 .home-layout .featured-header .featured-header-content { font-size: 13px; }
 .home-layout .featured-header .line { margin-bottom: 20px; }
 .home-layout .featured-cards { gap: 20px; }
 .home-layout .featured-card { min-height: 160px; }
 .home-layout .card-text { font-size: 12px; padding: 10px 12px; bottom: 12px; left: 12px; right: 12px; }
}

@media (max-width: 360px) {
  .home-layout .featured-container { padding: 32px 12px;}
}

/* section 6 css ends here  */






















/* Section 7: LOREM IPSUM DOLOR SIT carousel – light grey bg full width, content max 1440px, height 625px */
.home-layout .section-7.section-7-lorem-carousel { background-color: #F8F8F8; width: 100%; overflow: hidden;}
.home-layout .section-7-inner { max-width: 1220px; margin: 0 auto; display: flex; flex-direction: column;padding: 67px 60px 68px; }
.home-layout .section-7-header { color: #333A56;}
.home-layout .section-7-line { display: block; width: 100%; height: 1px; background: #B0B0B0; margin-bottom: 32px; }
.home-layout .section-7-carousel { display: flex; align-items: center; gap: 20px; flex: 1; min-height: 0; }
.home-layout .section-7-arrow { width: 44px; height: 44px; flex-shrink: 0; border: none; background: #B6B2A8; color: #fff; border-radius: 4px; font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; transition: opacity 0.2s; }
.home-layout .section-7-arrow:hover { opacity: 0.9; }
.home-layout .section-7-arrow:focus { outline: none; }
.home-layout .section-7-arrow.section-7-arrow-disabled,
.home-layout .section-7-arrow:disabled { opacity: 0.4; cursor: not-allowed; }
.home-layout .section-7-track { flex: 1; display: flex; gap: 24px; overflow-x: auto; padding: 16px 0; scroll-snap-type: x mandatory; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; min-height: 0; scrollbar-width: none; -ms-overflow-style: none; }
.home-layout .section-7-track::-webkit-scrollbar { display: none; }
.home-layout .section-7-card { flex: 0 0 380px; scroll-snap-align: start; display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); text-decoration: none; color: inherit; transition: box-shadow 0.2s; }
.home-layout .section-7-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12); }
.home-layout .section-7-card-img { position: relative; width: 100%; height: 0; padding-bottom: 62%; overflow: hidden; border-radius: 12px 12px 0 0; flex-shrink: 0; }
.home-layout .section-7-card-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.home-layout .section-7-card-bar { padding: 24px 28px; font-size: 18px; line-height: 1.4; color: #333; font-weight: 500; }
.home-layout .section-7-card-bar p { margin: 0; }
.home-layout .section-7-card-bar p:last-child { margin-bottom: 0; }
.home-layout .section-7-track::-webkit-scrollbar { display: none; }
.home-layout .section-7-card { flex: 0 0 380px; scroll-snap-align: start; display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); text-decoration: none; color: inherit; transition: box-shadow 0.2s; }
.home-layout .section-7-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12); }
.home-layout .section-7-card-img { position: relative; width: 100%; height: 0; padding-bottom: 62%; overflow: hidden; border-radius: 12px 12px 0 0; flex-shrink: 0; }
.home-layout .section-7-card-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.home-layout .section-7-card-bar { background: #3F5076; color: #fff; padding: 22px 24px 26px; font-size: 19px; line-height: 1.4; font-weight: 500; border-radius: 0 0 12px 12px; flex: 1; min-height: 0; display: flex; align-items: center; border-radius: 14px; margin-top: -12px; position: relative;box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.251);}

/* Section 7 responsive */
@media (max-width: 1440px) {
  .home-layout .section-7-card {flex: 0 0 340px;}
}

@media (max-width: 1200px) {
  .home-layout .section-7-card {flex: 0 0 300px;}
  .home-layout .section-7-card-bar {font-size: 17px;padding: 18px 20px 22px;}
}

@media (max-width: 992px) {
  .home-layout .section-7-inner {padding: 67px 40px 68px;}
  .home-layout .section-7-title {font-size: 18px;}
  .home-layout .section-7-line {margin-bottom: 24px;}
  .home-layout .section-7-card {flex: 0 0 280px;}
  .home-layout .section-7-card-bar {font-size: 16px;padding: 16px 18px 20px;}
}

@media (max-width: 768px) {
  .home-layout .section-7-inner {padding: 32px 20px 40px;}
  .home-layout .section-7-title {font-size: 17px;margin-bottom: 8px;}
  .home-layout .section-7-line {margin-bottom: 20px;}
  .home-layout .section-7-carousel {gap: 12px;}
  .home-layout .section-7-arrow {width: 38px;height: 38px;font-size: 18px;}
  .home-layout .section-7-track {gap: 16px;}
  .home-layout .section-7-card {flex: 0 0 260px;}
  .home-layout .section-7-card-img {padding-bottom: 60%;}
  .home-layout .section-7-card-bar {font-size: 15px;line-height: 1.35;padding: 14px 16px 18px;}
}

@media (max-width: 480px) {
  .home-layout .section-7-inner {padding: 32px 16px 40px;}
  .home-layout .section-7-title {font-size: 16px;}
  .home-layout .section-7-card {flex: 0 0 240px;}
  .home-layout .section-7-card-bar {font-size: 14px;padding: 12px 14px 16px;}
}

@media (max-width: 360px) {
  .home-layout .section-7-inner {padding: 32px 12px 40px;}
}















/* Section 8: LOREM IPSUM DOLOR SIT – white bg full width, two cards (image left ~40–45%, content right), max-width 1440px */
.home-layout .section-8.section-8-two-cards { background-color: #fff; width: 100%; }

.home-layout .section-8-inner {max-width: 1220px; margin: 0 auto; padding: 69px 60px 53px;}
.home-layout .section-8-header {color: #333A56;}
.home-layout .section-8-line { display: block; width: 100%; height: 1px; background: #B0B0B0; margin-bottom: 48px; }
.home-layout .section-8-cards {display: flex;gap: 32px;flex-wrap: wrap;}
.home-layout .section-8-card { flex: 1 1 calc(50% - 16px); min-width: 0; display: flex; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); text-decoration: none; color: inherit; transition: box-shadow 0.2s; }
.home-layout .section-8-card:hover { box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12); }
.home-layout .section-8-card-img { flex: 0 0 42%; min-width: 0; position: relative; overflow: hidden; border-radius: 12px 0 0 12px; align-self: stretch; }
.home-layout .section-8-card-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.home-layout .section-8-card-content { flex: 1; min-width: 0; padding: 32px 28px 36px 28px; display: flex; flex-direction: column; justify-content: center; }
.home-layout .section-8-number { font-size: 42px; font-weight: 700; color: #333A56; line-height: 1; margin-bottom: 16px; font-family: "Cantata One", -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;}
.home-layout .section-8-card-title { font-size: 20px; font-weight: 600; line-height: 1.35; color: #333A56; margin: 0 0 14px 0; }
.home-layout .section-8-card-desc { font-size: 15px; line-height: 1.5; color: #666666; margin: 0; }

/* Section 8 responsive – stack cards on smaller screens */
@media (max-width: 1440px) {
  .home-layout .section-8-cards { gap: 28px; }
}

@media (max-width: 1200px) {
  .home-layout .section-8-inner { padding: 60px 60px 50px; }
  .home-layout .section-8-title { font-size: 26px; }
  .home-layout .section-8-line { margin-bottom: 40px; }
  .home-layout .section-8-cards { gap: 24px; }
  .home-layout .section-8-card-content { padding: 28px 24px 32px 24px; }
  .home-layout .section-8-number { font-size: 38px; }
  .home-layout .section-8-card-title { font-size: 19px; }
  .home-layout .section-8-card-desc { font-size: 14px; }
}

@media (max-width: 992px) {
  .home-layout .section-8-inner { padding: 44px 40px 52px; }
  .home-layout .section-8-title { font-size: 24px; }
  .home-layout .section-8-line { margin-bottom: 36px; }
  .home-layout .section-8-cards { gap: 24px; }
  .home-layout .section-8-card { flex: 1 1 100%; }
  .home-layout .section-8-card-img { flex: 0 0 40%; }
  .home-layout .section-8-card-content { padding: 28px 24px 32px 24px; }
  .home-layout .section-8-number { font-size: 36px; margin-bottom: 12px; }
  .home-layout .section-8-card-title { font-size: 18px; margin-bottom: 12px; }
  .home-layout .section-8-card-desc { font-size: 14px; }
}

@media (max-width: 768px) {
  .home-layout .section-8-inner { padding: 36px 20px 44px; }
  .home-layout .section-8-title { font-size: 22px; margin-bottom: 10px; }
  .home-layout .section-8-line { width: 60%; margin-bottom: 28px; }
  .home-layout .section-8-cards { gap: 20px; }
  .home-layout .section-8-card { flex-direction: column; border-radius: 10px; }
  .home-layout .section-8-card-img { flex: none; width: 100%; height: 0; padding-bottom: 56%; border-radius: 10px 10px 0 0; }
  .home-layout .section-8-card-content { padding: 24px 20px 28px 20px; }
  .home-layout .section-8-number { font-size: 32px; margin-bottom: 10px; }
  .home-layout .section-8-card-title { font-size: 17px; margin-bottom: 10px; }
  .home-layout .section-8-card-desc { font-size: 13px; line-height: 1.4; }
}

@media (max-width: 480px) {
  .home-layout .section-8-inner { padding: 28px 16px 36px; }
  .home-layout .section-8-title { font-size: 20px; margin-bottom: 8px; }
  .home-layout .section-8-line { width: 55%; margin-bottom: 24px; }
  .home-layout .section-8-cards { gap: 18px; }
  .home-layout .section-8-card { border-radius: 8px; }
  .home-layout .section-8-card-img { padding-bottom: 60%; border-radius: 8px 8px 0 0; }
  .home-layout .section-8-card-content { padding: 20px 16px 24px 16px; }
  .home-layout .section-8-number { font-size: 28px; margin-bottom: 8px; }
  .home-layout .section-8-card-title { font-size: 16px; margin-bottom: 8px; }
  .home-layout .section-8-card-desc { font-size: 13px; }
}

@media (max-width: 360px) {
  .home-layout .section-8-inner { padding: 28px 12px 36px; }
  .home-layout .section-8-title { font-size: 18px; }
  .home-layout .section-8-line { margin-bottom: 20px; }
  .home-layout .section-8-cards { gap: 16px; }
  .home-layout .section-8-card-content { padding: 18px 14px 20px 14px; }
  .home-layout .section-8-number { font-size: 24px; }
  .home-layout .section-8-card-title { font-size: 15px; }
  .home-layout .section-8-card-desc { font-size: 12px; }
}













/* Section 9: LOREM IPSUM DOLOR SIT – dark indigo #333A56 full width, large card left (~62%) + four small cards right (~38%), max-width 1440px */
.home-layout .section-9.section-9-feature-grid {background-color: #333A56;width: 100%;}
.home-layout .section-9-inner {max-width: 1220px;margin: 0 auto;padding: 56px 60px 56px;}
.home-layout .section-9-header {color: #FFFFFF;}
.home-layout .section-9-line { display: block; width: 100%;  height: 1px; background: #B0B0B0; margin-bottom: 48px; }
.home-layout .section-9-layout { display: flex; gap: 28px; align-items: stretch; }
.home-layout .section-9-large-card { flex: 0 0 62%; min-width: 0; display: flex; flex-direction: column; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15); text-decoration: none; color: inherit; transition: box-shadow 0.2s; }
.home-layout .section-9-large-card:hover { box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2); }
.home-layout .section-9-large-img { position: relative; width: 100%; height: 0; padding-bottom: 70%; overflow: hidden; border-radius: 12px 12px 0 0; flex-shrink: 0; }
.home-layout .section-9-large-img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.home-layout .section-9-large-bar { background: #FFFFFF; color: #333A56; padding: 28px 32px 32px; font-size: 22px; font-weight: 600; line-height: 1.35; border-radius: 0 0 12px 12px; flex: 1; min-height: 0; display: flex; align-items: center; }
.home-layout .section-9-small-cards {flex: 0 0 calc(38% - 28px);min-width: 0;display: flex;flex-direction: column;gap: 18px;}

.home-layout .section-9-small-card { display: flex; align-items: stretch; background: #FFFFFF; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 16px rgba(0, 0, 0, 0.1); text-decoration: none; color: inherit; transition: box-shadow 0.2s; flex: 1; min-height: 0; }
.home-layout .section-9-small-card:hover { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); }
.home-layout .section-9-small-thumb { flex: 0 0 28%; min-width: 0; position: relative; overflow: hidden; border-radius: 8px 0 0 8px; align-self: stretch; }
.home-layout .section-9-small-thumb img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }  
.home-layout .section-9-small-text { flex: 1; min-width: 0; padding: 18px 20px; font-size: 15px; font-weight: 500; line-height: 1.4; color: #333A56; display: flex; align-items: center; }

/* Section 9 responsive – stack large card then small cards on smaller screens */
@media (max-width: 1440px) {
  .home-layout .section-9-layout { gap: 24px; }
  .home-layout .section-9-small-cards { flex: 0 0 calc(38% - 24px); }
}

@media (max-width: 1200px) {
  .home-layout .section-9-inner { padding: 70px 60px 90px; }
  .home-layout .section-9-title { font-size: 26px; }
  .home-layout .section-9-line { width: 70%; margin-bottom: 40px; }
  .home-layout .section-9-large-bar { font-size: 20px; padding: 26px 30px 30px; }
  .home-layout .section-9-small-cards { gap: 16px; }
  .home-layout .section-9-small-thumb { flex: 0 0 30%; }
  .home-layout .section-9-small-text { font-size: 14px; padding: 16px 18px; }
}

@media (max-width: 992px) {
  .home-layout .section-9-inner { padding: 60px 40px 80px; }
  .home-layout .section-9-title { font-size: 24px; }
  .home-layout .section-9-line { margin-bottom: 36px; }
  .home-layout .section-9-layout { flex-direction: column; }
  .home-layout .section-9-large-card { flex: none; width: 100%; }
  .home-layout .section-9-large-img { padding-bottom: 58%; }
  .home-layout .section-9-large-bar { font-size: 20px; padding: 24px 28px 28px; }
  .home-layout .section-9-small-cards { flex: none; width: 100%; gap: 16px; }
  .home-layout .section-9-small-text { font-size: 14px; padding: 16px 18px; }
}

@media (max-width: 768px) {
  .home-layout .section-9-inner { padding: 48px 20px 64px; }
  .home-layout .section-9-title { font-size: 22px; margin-bottom: 10px; }
  .home-layout .section-9-line { width: 65%; margin-bottom: 28px; }
  .home-layout .section-9-large-card { border-radius: 10px; }
  .home-layout .section-9-large-img { padding-bottom: 60%; border-radius: 10px 10px 0 0; }
  .home-layout .section-9-large-bar { font-size: 18px; padding: 20px 22px 24px; border-radius: 0 0 10px 10px; }
  .home-layout .section-9-small-cards { gap: 14px; }
  .home-layout .section-9-small-card { flex-direction: column; border-radius: 8px; }
  .home-layout .section-9-small-thumb { flex: none; width: 100%; height: 0; padding-bottom: 50%; border-radius: 8px 8px 0 0; }
  .home-layout .section-9-small-text { padding: 14px 16px; font-size: 13px; line-height: 1.35; }
}

@media (max-width: 480px) {
  .home-layout .section-9-inner { padding: 36px 16px 52px; }
  .home-layout .section-9-title { font-size: 20px; margin-bottom: 8px; }
  .home-layout .section-9-line { width: 60%; margin-bottom: 24px; }
  .home-layout .section-9-large-img { padding-bottom: 65%; }
  .home-layout .section-9-large-bar { font-size: 16px; padding: 18px 18px 22px; }
  .home-layout .section-9-small-cards { gap: 12px; }
  .home-layout .section-9-small-thumb { padding-bottom: 55%; }
  .home-layout .section-9-small-text { font-size: 13px; padding: 12px 14px; }
}

@media (max-width: 360px) {
  .home-layout .section-9-inner { padding: 32px 12px 48px; }
  .home-layout .section-9-title { font-size: 18px; }
  .home-layout .section-9-line { width: 55%; margin-bottom: 20px; }
  .home-layout .section-9-large-card { border-radius: 8px; }
  .home-layout .section-9-large-img { border-radius: 8px 8px 0 0; }
  .home-layout .section-9-large-bar { font-size: 15px; padding: 16px 16px 20px; border-radius: 0 0 8px 8px; }
  .home-layout .section-9-small-cards { gap: 10px; }
  .home-layout .section-9-small-card { border-radius: 6px; }
  .home-layout .section-9-small-thumb { border-radius: 6px 6px 0 0; }
  .home-layout .section-9-small-text { font-size: 12px; padding: 10px 12px; }
}


























































/* 6. Insight grid – 4 cards, number top-left, white overlay bottom */

















 .article-show-more{display: block; font-weight: 500;font-size: 18px;line-height: 28px;color: #0066FF;padding: 14px 25px;border: none;background: #fff;border: 1px solid #0066FF;margin: 70px auto 0 auto;}
 .article-show-more.hide{display: none;}
 #show-more-loader{border-top: 3px solid #000;border-right: 3px solid #000;border-bottom-style: solid;border-radius: 99999px;border-bottom-width: 2px;border-left-width: 2px;border-bottom-color: transparent;border-left-color: transparent;animation: .5s linear 0s infinite normal none loader;width: 2.5rem;height: 2.5rem;margin: 70px auto;display: block;}


/* 10. Final CTA – dark blue */
@keyframes loader {
  0% {
      transform: rotate(0);
  }
  100% {
      transform: rotate(360deg);
  }
}


@media screen and (max-width:767px) {
  .section-3 .tabbed-nav-container .tabbed-nav p{font-weight: 700;font-size: 16px;line-height: 32px;}
  .section-3 .article-list {flex-direction: column;height: auto;}
  
  .section-3 .article-list:nth-child(2){flex-flow: column;}
 
  .section-3 .article-list .left-wrap .img-outer-container .img-container img{height: 100%;min-height: 278px;}
  .section-3 .article-list .right-wrap .divs{flex-direction: column;height: auto;box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.06);}
  .section-3 .article-list .right-wrap li{margin-top: 0;}
  .section-3 .article-list .right-wrap .left-wrap .img-container img{height: 85px;width: 85px;}
  .section-3 .article-list .right-wrap .divs .right-wrap{box-shadow: none;}
  .section-3 .article-list .right-wrap .divs .right-wrap .title{max-width: 100%;max-height:90px;font-weight: 600;font-size: 20px;line-height: 25px;}
  .section-3 .article-list .left-wrap .tips-container{padding: 16px;}
  .section-3 .article-list .left-wrap .tips-container .title{font-weight: 700;font-size: 20px;line-height: 24px;}
  /* Slick */
  .section-3 .article-list:nth-child(even){flex-flow: column;}
  .section-3 .slick-dots{bottom: -85px;z-index: 1;}
  .section-3 .slick-arrow{top: auto; bottom: -115px;z-index: 999;}

  /* Load Article */
  .load-articles{margin-top: 20px; margin-left: 0;}
}
@media screen and (max-width:400px){
  .section-3 .slick-dots{bottom: -78px;}
}
@media screen and (max-width:360px){
  .section-3 .article-list .left-wrap .tips-container{padding: 10px;}
  .section-3 .article-list .left-wrap .tips-container .title{margin-bottom: 10px;}
  /* .section-3 .article-list .left-wrap .img-outer-container .img-container{min-height: 278px;} */
  
}
















/* Footer start  */
.footer {background: #E7E2E2;}
.footer .footer-wrap {height: 110px; max-width: 1440px; margin: 0 auto ; display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;gap: 16px;padding: 24px 176px 24px 176px;}
.footer .home-footer-copy {font-size: 13px;color: var(--home-dark);}
.footer .home-footer-legal {font-size: 13px;}
.footer .home-footer-legal a {color: var(--home-dark);text-decoration: none;margin: 0 4px;}
.footer .home-footer-legal a:hover { color: var(--home-gold); }
.footer .home-footer-legal .sep {color: var(--home-dark);margin: 0 2px;}
/* Footer responsive – targets .footer, .footer-wrap, .home-footer-copy, .home-footer-legal */
@media (max-width: 1440px) {
  .footer .footer-wrap { padding-left: 100px; padding-right: 100px; }
}

@media (max-width: 1200px) {
  .footer .footer-wrap { padding-left: 60px; padding-right: 60px; }
}

@media (max-width: 992px) {
  .footer .footer-wrap { padding-left: 40px; padding-right: 40px; height: auto; min-height: 110px; }
  .footer .home-footer-copy, .home-footer-legal { font-size: 12px; }
}

@media (max-width: 768px) {
  .footer-wrap {flex-direction: column;align-items: center;text-align: center;padding: 24px 24px;gap: 16px;height: auto;min-height: auto;}
  .footer .home-footer-copy { order: 1; }
  .footer .home-footer-legal { order: 2; }
  .footer .home-footer-copy, .home-footer-legal { font-size: 12px; }
  .footer .home-footer-legal .sep { display: inline; }
}

@media (max-width: 480px) {
  .footer  .footer-wrap { padding: 20px 16px; gap: 12px; }
  .footer  .home-footer-copy, .home-footer-legal { font-size: 11px; }
  .footer  .home-footer-legal a { margin: 0 2px; }
  .footer  .home-footer-legal .sep { margin: 0 2px; }
}

@media (max-width: 360px) {
  .footer .footer-wrap { padding: 16px 12px; gap: 10px; }
  .footer .home-footer-copy, .home-footer-legal { font-size: 10px; }
  .footer .home-footer-legal a { margin: 0 1px; }
}
/* Footer css ends here  */

















































































/* new changed category pages css start here  */





/* Section Page v2 – Figma section-page-v2 (Website-design_Khushboo) */

:root {
--sp-olive: #A2A089;
--sp-dark: #344361;
--sp-dark-blue: #2b3252;
--sp-text: #3C3C3C;
--sp-text-light: rgba(255, 255, 255, 0.9);
--sp-bg-white: #ffffff;
--sp-bg-light: #F5F5F5;
--sp-border: #e0e0e0;
}

.category-layout.sp-body {margin: 0;color: var(--sp-text);line-height: 1.5;}
.category-layout.sp-page {min-height: 100vh;display: flex;flex-direction: column;}
/* ----- Image Wrapper Global Style ----- */
/* .category-layout.img-wrap {width: 100%;height: 100%;overflow: hidden}

.category-layout.img-wrap img {width: 100%;height: auto;display: block;object-fit: cover;} */


/* ----- Hero ----- */
.category-layout .sp-hero {position: relative;width: 100%;min-height: 474px;display: flex;align-items: flex-end;justify-content: center;padding: 0 24px 48px;box-sizing: border-box;}
.category-layout .sp-hero-bg {position: absolute;inset: 0;z-index: 0;}
.category-layout .sp-hero-bg .img-wrap {width: 100%;height: 100%;}
.category-layout .sp-hero-bg .img-wrap img {width: 100%;height: 100%;object-fit: cover;}
.category-layout .sp-hero-card {position: absolute;z-index: 1;max-width: 800px;width: 100%;background: var(--sp-bg-white);border-radius: 12px;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);padding: 32px 40px 36px; bottom: 0; transform: translateY(50%);}
.category-layout .sp-hero-title {font-size: 28px;line-height: 33px; max-height: 66px; overflow:hidden; font-weight: 400;color: var(--sp-text);text-align: center;}
.category-layout .sp-hero-desc {margin: 0;font-size: 16px;line-height: 1.6;color: var(--sp-text);opacity: 0.9;overflow: hidden;display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;text-align: center;}

/* ----- Section common ----- */
.category-layout .sp-section {padding: 100px 0 56px;}
.category-layout .sp-wrap {max-width: 1220px; padding: 0 60px; margin: 0 auto;}
.category-layout .sp-section-white {background: var(--sp-bg-white);}
/* .category-layout .sp-section-olive {background: var(--sp-olive);} */
.category-layout .sp-section-head {color: #344361;}

/* ----- MORE BLOG ----- */
.category-layout .sp-more-blog {display: grid;grid-template-columns: 1fr 1fr;gap: 40px;align-items: center;}
.category-layout .sp-more-blog-img {overflow: hidden; aspect-ratio: 4/3;}
.category-layout .sp-more-blog-img .img-wrap {width: 100%;height: 100%;border-radius: 14px;overflow: hidden;}
.category-layout .sp-more-blog-img .img-wrap img {width: 100%;height: 100%;object-fit: cover;}
.category-layout .sp-more-blog-label {margin: 0 0 41px 0;font-size: 24px;line-height: 33px;color: #344361;}
.category-layout .sp-more-blog-heading { margin: 0 0 41px 0; font-size: 33px; line-height: 40px;max-height: 120px; overflow:hidden; font-weight: 400; color: #3C3C3C; }
.category-layout .sp-more-blog-text { margin: 0; font-size: 16px; line-height: 21px; max-height: 105px;overflow:hidden; color: #7A7A7A; }

/* ----- ALSO READ / EDITORS' PICKS ----- */
.category-layout .sp-wrap-also-read {max-width: 1280px;}
/* Main Content Container - Using Flexbox */
.category-layout .sp-also-read {display: flex;gap: 24px;align-items: stretch;}
/* Left Main Column */
.category-layout  .sp-main-column {flex: 1;display: flex;flex-direction: column;gap: 16px;}
/* Top Row - Text Card + Large Image (Flexbox) */
.category-layout  .sp-top-row {display: flex;gap: 16px;min-height: 280px;}
/* Text Card */
.category-layout  .sp-card-text {flex: 0 0 calc(33.33% - 8px);background: var(--sp-bg-white);border-radius: 12px;padding: 32px 28px;text-decoration: none;
color: var(--sp-text);display: flex;flex-direction: column;justify-content: center;box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);transition: box-shadow 0.3s;
}
.category-layout  .sp-card-text:hover {box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);}

.category-layout  .sp-card-text h3 {margin: 0 0 12px 0;font-size: 24px;line-height: 1.3;font-weight: 700;color: var(--sp-text);}
.category-layout .sp-card-text p {margin: 0;font-size: 15px;line-height: 1.5;color: var(--sp-text);opacity: 0.8;}
/* Large Image Card */
.category-layout .sp-card-large-img {flex: 0 0 calc(66.67% - 8px);border-radius: 12px;overflow: hidden;display: block;text-decoration: none;min-height: 280px;}
.category-layout .sp-card-large-img .img-wrap {width: 100%;height: 100%;min-height: 280px;}
/* Bottom Row - Two Image Cards (Flexbox) */
.category-layout  .sp-bottom-row {display: flex;gap: 16px;}
/* Image + Text Cards */
.category-layout  .sp-card-img-text {flex: 1;background: rgba(255, 255, 255, 0.12);border-radius: 12px;overflow: hidden;text-decoration: none;display: flex;
flex-direction: column;transition: background 0.3s;}
.category-layout  .sp-card-img-text:hover {background: rgba(255, 255, 255, 0.16);}
.category-layout .sp-card-img {width: 100%;aspect-ratio: 4/3;overflow: hidden;}
.category-layout .sp-card-img .img-wrap {width: 100%;height: 100%;}
.category-layout .sp-card-img .img-wrap img { width: 100%; height: 100%; object-fit: cover;}
.category-layout .sp-card-content {padding: 20px;flex: 1;background: #fff;}
.category-layout .sp-card-content h4 {margin: 0;font-size: 15px;line-height: 1.4;font-weight: 600;color: #3C3C3C;}
/* Category layout responsive css starts here  */
/* Three Cards Row */
.category-layout .sp-three-cards-row {
display: flex;
gap: 16px;
min-height: 200px;
}

/* Combined CTA Container */
.category-layout .sp-cta-combined {
flex: 2;
display: flex;
gap: 16px;
}

/* CTA Cards */
.category-layout .sp-cta-card {
flex: 1;
border-radius: 12px;
padding: 28px 24px;
text-decoration: none;
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 200px;
transition: all 0.3s;
}

.category-layout .sp-cta-dark {
background: var(--sp-dark-blue);
color: #fff;
}

.category-layout .sp-cta-dark:hover {
background: #34405e;
}

.category-layout .sp-cta-dark h4 {
margin: 0 0 auto 0;
font-size: 18px;
line-height: 1.35;
font-weight: 700;
color: #fff;
}

.category-layout .sp-cta-light {
background: var(--sp-bg-white);
color: var(--sp-text);
}

.category-layout .sp-cta-light:hover {
background: #f8f8f8;
}

.category-layout .sp-cta-light h4 {
margin: 0 0 10px 0;
font-size: 18px;
line-height: 1.35;
font-weight: 700;
color: var(--sp-text);
}

.category-layout .sp-cta-light p {
margin: 0;
font-size: 13px;
line-height: 1.5;
color: var(--sp-text);
opacity: 0.75;
}

/* CTA Image Card */
.category-layout .sp-cta-img {
flex: 1;
border-radius: 12px;
overflow: hidden;
display: block;
text-decoration: none;
min-height: 200px;
}

.category-layout .sp-cta-img .img-wrap {
width: 100%;
height: 100%;
min-height: 200px;
}
.category-layout .sp-cta-img .img-wrap img{width: 100%; height: 100%; object-fit: cover;}
/* Buttons */
.category-layout .sp-btn {
display: inline-block;
padding: 11px 24px;
font-size: 13px;
font-weight: 500;
border-radius: 6px;
text-decoration: none;
border: none;
cursor: pointer;
transition: all 0.2s;
}

.category-layout .sp-btn-primary {
background: var(--sp-dark-blue);
color: #fff;
}

.category-layout .sp-btn-outline {
background: transparent;
color: #fff;
border: 1px solid rgba(255, 255, 255, 0.9);
align-self: flex-start;
}

.category-layout .sp-btn-outline:hover {
background: rgba(255, 255, 255, 0.1);
}

/* Sidebar */
.category-layout .sp-also-read-sidebar {
flex: 0 0 280px;
display: flex;
flex-direction: column;
gap: 0;
background: var(--sp-bg-white);
border-radius: 12px;
padding: 20px;
box-shadow: 0 2px 16px rgba(0, 0, 0, 0.08);
align-self: stretch;
/* margin-top: calc(280px + 16px); */
border-bottom: 11px solid #344361;
}

.category-layout .sp-sidebar-header {
margin-bottom: 20px;
}

.category-layout .sp-sidebar-header h3 {
margin: 0;
font-size: 18px;
font-weight: 600;
color: var(--sp-text);
}

.category-layout .sp-sidebar-card {
background: transparent;
border-radius: 0;
padding: 16px 0;
display: flex;
align-items: flex-start;
text-decoration: none;
color: var(--sp-text);
box-shadow: none;
border-bottom: 1px solid var(--sp-border);
}

.sp-sidebar-card:last-child {
border-bottom: none;
padding-bottom: 0;
}

.category-layout .sp-sidebar-card:first-of-type {
padding-top: 0;
}

.category-layout .sp-sidebar-card:hover {
box-shadow: none;
}

.category-layout  .sp-sidebar-card-content {
flex: 1;
}

.category-layout  .sp-sidebar-card-category {
display: inline-block;
font-size: 11px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--sp-text);
opacity: 0.5;
margin-bottom: 6px;
}

.category-layout  .sp-sidebar-card-title {
margin: 0;
font-size: 13px;
line-height: 1.4;
font-weight: 600;
color: var(--sp-text);
}

/* ----- TRENDING ----- */
.category-layout  .sp-trending-card {
display: block;
background: var(--sp-bg-white);
border-radius: 14px;
/* overflow: hidden; */
/* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); */
text-decoration: none;
color: var(--sp-text);
}

/* .category-layout  .sp-trending-card:hover {
box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
} */

.category-layout .sp-trending-card-img {
width: 100%;
aspect-ratio: 16/9;
overflow: hidden;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.category-layout  .sp-trending-card-img .img-wrap {
width: 100%;
height: 100%;
border-radius: 14px;
overflow: hidden;
}
.category-layout .sp-trending-card-img .img-wrap img { width: 100%; height: 100%; display: block; object-fit: cover;}
.category-layout .sp-trending-card-title {
margin: 0;
padding: 24px 28px 28px;
font-size: 36px;
line-height: 1.3;
font-weight: 400;
color: var(--sp-text);
}

/* ----- MORE TOPICS ----- */
.category-layout .sp-more-topics {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 32px 48px;
}

.category-layout  .sp-more-topics-col {
display: flex;
flex-direction: column;
gap: 24px;
}

.category-layout  .sp-topic-row {
display: grid;
grid-template-columns: 48px 80px 1fr;
gap: 20px;
align-items: center;
text-decoration: none;
color: #fff;
}

.category-layout  .sp-topic-num {
font-size: 28px;
font-weight: 700;
color: #fff;
line-height: 1;
}

.category-layout .sp-topic-thumb {
width: 80px;
height: 80px;
border-radius: 10px;
overflow: hidden;
flex-shrink: 0;
}

.category-layout  .sp-topic-thumb .img-wrap {
width: 100%;
height: 100%;
}

.category-layout .sp-topic-text h4 {
margin: 0 0 6px 0;
font-size: 16px;
line-height: 1.35;
font-weight: 600;
color: #fff;
}

.category-layout .sp-topic-text p {
margin: 0;
font-size: 13px;
line-height: 1.45;
color: var(--sp-text-light);
}











.category-layout .section-4 {background: #A2A089;}
.category-layout .section-4-container {padding: 59px 0 0;}
.category-layout .section-4-header {color: #ffffff;}
.category-layout .section-4-cards {display: flex;flex-wrap: wrap;justify-content: space-between;padding-bottom: 45px;}
.category-layout .section-4-card {display: flex;align-items: center; justify-content: space-between;margin-bottom: 30px; max-width: 528px;background: #fff;border-radius: 14px;padding: 18px;width: calc(50% - 12px);box-shadow: 0px 4px 16px 0px #90909040;}
.category-layout .section-4 .card-img{max-width: 208px;height: 175px;overflow: hidden;border-radius: 10px;flex: 0 0 208px;}
.category-layout .section-4 .card-img .img-wrap {height: 100%;}
.category-layout .section-4 .card-img img {width: 100%;height: 100%;object-fit: cover;border-radius: 10px;}
.category-layout .section-4 .card-content {display: flex;flex-direction: column;margin-left: 22px;max-width: 248px;}
.category-layout .section-4 .card-number {font-size: 43px;font-weight: 700;color: #344054;border-bottom: 2px solid #E7E2E2; font-family: "Cantata One", -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif; font-weight: 400;}
.category-layout .section-4 .card-content p {font-size: 21px;line-height: 34px;max-height: 75px;margin-top: 8px;color: #475467;overflow: hidden;word-wrap: break-word; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

/* SECTION-4 RESPONSIVE */


@media (max-width: 1200px) {
.category-layout .section-4-container {padding: 50px 0 0;}
.category-layout .section-4-cards {gap: 15px;}
.category-layout .section-4-card {width: calc(50% - 8px);padding: 16px;}
.category-layout .section-4 .card-img {max-width: 180px;height: 150px;flex: 0 0 180px;}
.category-layout .section-4 .card-content {margin-left: 18px;max-width: 268px;}
.category-layout .section-4 .card-number {font-size: 38px;}
.category-layout .section-4 .card-content p {font-size: 19px;line-height: 30px;max-height: 60px;}
}

@media (max-width: 1100px) {
.category-layout .section-4-card {width: 100%; max-width: none;}
.category-layout .section-4 .card-img {max-width: 200px;height: 160px;flex: 0 0 200px;}

.category-layout .section-4 .card-content {max-width: 100%;flex: 1;}
}

@media (max-width: 992px) {
.category-layout.section-4-container {padding: 40px 40px 0 40px;}
.category-layout.section-4-card {width: 100%;padding: 15px;}
.category-layout.section-4 .card-img {max-width: 160px;height: 135px;flex: 0 0 160px;}
.category-layout.section-4 .card-content { margin-left: 15px; max-width: 100%;flex: 1;}
.category-layout.section-4 .card-number {font-size: 35px;}
.category-layout.section-4 .card-content p {font-size: 18px;line-height: 28px;max-height: 56px;}
}

@media (max-width: 768px) {
.category-layout .section-4-container {padding: 30px 0 0;}
.category-layout .section-4-card {flex-direction: column;align-items: flex-start;padding: 15px;width: 100%;}
.category-layout .section-4 .card-img {max-width: 100%;width: 100%;height: 200px;flex: 0 0 auto;margin-bottom: 15px;}
.category-layout .section-4 .card-content {margin-left: 0;margin-top: 0;max-width: 100%;width: 100%;}
.category-layout .section-4 .card-number {font-size: 32px;}
.category-layout .section-4 .card-content p {font-size: 17px;line-height: 26px;max-height: 52px;margin-top: 6px;}
}

@media (max-width: 480px) {
.category-layout .section-4-container {padding: 25px 0 0;} 
.category-layout  .section-4-cards {gap: 12px;}
.category-layout  .section-4-card {padding: 12px;border-radius: 12px;}
.category-layout  .section-4 .card-img {height: 180px;border-radius: 8px;margin-bottom: 12px;}
.category-layout  .section-4 .card-number {font-size: 28px;}
.category-layout  .section-4 .card-content p {font-size: 15px;line-height: 22px;max-height: 44px;margin-top: 5px;}
}

@media (max-width: 360px) {
.category-layout .section-4-container {padding: 20px 0 0;}
.category-layout .section-4-cards {gap: 10px;}
.category-layout .section-4-card {padding: 10px;border-radius: 10px;}
.category-layout .section-4 .card-img {height: 160px;border-radius: 6px;margin-bottom: 10px;}
.category-layout .section-4 .card-number {font-size: 24px;}
.category-layout .section-4 .card-content p {font-size: 14px;line-height: 20px;max-height: 40px;margin-top: 4px;}
}



/* ----- PREVIOUS BLOGS (carousel) ----- */
.category-layout .sp-prev-blogs {
position: relative;
display: flex;
align-items: center;
gap: 16px;
}

.category-layout .sp-carousel-arrow {
flex-shrink: 0;
width: 44px;
height: 44px;
border: none;
background: var(--sp-olive);
color: #fff;
border-radius: 50%;
font-size: 20px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.2s;
}

.category-layout .sp-carousel-arrow:hover {
opacity: 0.9;
}

.category-layout .sp-carousel-arrow:disabled,
.category-layout .sp-carousel-arrow-disabled {
opacity: 0.4;
cursor: not-allowed;
}

.category-layout .sp-carousel-arrow:disabled:hover,
.category-layout .sp-carousel-arrow-disabled:hover {
opacity: 0.4;
}

.category-layout .sp-carousel-track {
flex: 1;
display: flex;
gap: 24px;
overflow-x: auto;
padding: 8px 0;
/* scroll-snap-type: x mandatory; */
-webkit-overflow-scrolling: touch;
}

.category-layout .sp-prev-card {
flex: 0 0 320px;
/* scroll-snap-align: start; */
background: var(--sp-bg-white);
border-radius: 14px;
overflow: hidden;
box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
text-decoration: none;
color: #fff;
display: flex;
flex-direction: column;
}

.category-layout .sp-prev-card:hover {
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.category-layout .sp-prev-card-img {
width: 100%;
aspect-ratio: 4/3;
overflow: hidden;
}

.category-layout  .sp-prev-card-img .img-wrap {
width: 100%;
height: 100%;
}

.category-layout  .sp-prev-card-bar {
background: var(--sp-dark-blue);
padding: 20px 22px;
flex: 1;
}

.category-layout .sp-prev-card-bar h4 {margin: 0;font-size: 16px;line-height: 1.35;font-weight: 400;color: #fff; }





/* ----- Responsive ----- */
@media (max-width: 1100px) {
.category-layout .sp-also-read {
  flex-direction: column;
}

.category-layout  .sp-also-read-sidebar {
  flex: 1;
  width: 100%;
  margin-top: 0;
}
}

@media (max-width: 992px) {
/* .category-layout  .sp-header-inner {
  flex-wrap: wrap;
}

.category-layout .sp-nav {
  order: 3;
  width: 100%;
  justify-content: center;
} */

.category-layout .sp-wrap {padding: 0 40px;}

.category-layout .sp-more-blog {
  grid-template-columns: 1fr;
}

.category-layout .sp-top-row {
  flex-direction: column;
  min-height: auto;
}

.category-layout .sp-card-text,
.category-layout .sp-card-large-img {flex: 1; width: 100%;}

.category-layout .sp-card-large-img {
  min-height: 250px;
}

.category-layout  .sp-card-large-img .img-wrap {
  min-height: 250px;
}

.category-layout  .sp-bottom-row {
  flex-direction: column;
}

.category-layout  .sp-three-cards-row {
  flex-direction: column;
}

.category-layout  .sp-cta-combined {
  flex-direction: column;
}

.category-layout  .sp-more-topics {
  grid-template-columns: 1fr;
}

.category-layout  .sp-footer-main {
  grid-template-columns: 1fr;
}

.category-layout  .sp-footer-links {
  flex-wrap: wrap;
}
}

@media (max-width: 768px) {
/* .category-layout .sp-header {
  padding: 12px 20px 0;
}

.sp-nav {
  display: none;
} */

.category-layout .sp-wrap {padding: 0 20px;}

.category-layout .sp-hero {
  min-height: 320px;
  padding: 0 16px 32px;
}

.category-layout  .sp-hero-card {
  padding: 24px 24px 28px;
}

.category-layout .sp-hero-title {
  font-size: 22px;
}

.category-layout .sp-hero-desc {
  font-size: 14px;
}

.category-layout .sp-section {
  padding: 68px 0 44px;
}

.category-layout .sp-more-blog-label {
  font-size: 15px;
  line-height: 20px;
  margin: 0 0 16px 0;
}

.category-layout .sp-more-blog-heading {
  font-size: 20px;
  line-height: 26px;
  margin: 0 0 16px 0;
}

.category-layout .sp-trending-card-title {
  font-size: 18px;
  padding: 20px 20px 24px;
}

.category-layout .sp-topic-row {
  grid-template-columns: 40px 64px 1fr;
  gap: 14px;
}

.category-layout  .sp-topic-num {
  font-size: 22px;
}

.category-layout .sp-topic-thumb {
  width: 64px;
  height: 64px;
}

.category-layout.sp-topic-text h4 {
  font-size: 14px;
}

.category-layout .sp-prev-card {
  flex: 0 0 280px;
}

.category-layout .sp-prev-card-bar h4 {
  font-size: 14px;
}

.category-layout .sp-carousel-arrow {
  display: none;
}

.category-layout .sp-prev-blogs {
  gap: 0;
}

.category-layout .sp-card-text {
  padding: 24px 20px;
}

.category-layout .sp-card-text h3 {
  font-size: 20px;
}

.category-layout .sp-card-text p {
  font-size: 14px;
}

.category-layout .sp-card-large-img {
  min-height: 200px;
}

.category-layout .sp-card-large-img .img-wrap {
  min-height: 200px;
}

.category-layout .sp-card-content {
  padding: 16px;
}

.category-layout .sp-card-content h4 {
  font-size: 14px;
}

.category-layout .sp-three-cards-row {
  gap: 12px;
}

.category-layout .sp-cta-combined {
  gap: 12px;
}

.category-layout  .sp-cta-card {
  padding: 20px 18px;
  min-height: 160px;
}

.category-layout .sp-cta-card h4 {
  font-size: 16px;
}

.category-layout  .sp-cta-light p {
  font-size: 12px;
}

.category-layout .sp-cta-img {
  min-height: 160px;
}

.category-layout  .sp-cta-img .img-wrap {
  min-height: 160px;
}

.category-layout  .sp-sidebar-card-title {
  font-size: 12px;
}

.category-layout  .sp-also-read-sidebar {
  margin-top: 0;
}

.category-layout .sp-topic-thumb {
  width: 64px;
  height: 64px;
}

.category-layout .sp-topic-thumb .img-wrap {
  width: 100%;
  height: 100%;
}
}

@media (max-width: 480px) {
  .category-layout .sp-wrap {padding: 0 16px;}
}
@media (max-width: 360px) {
  .category-layout .sp-wrap {padding: 0 12px;}
}



















/* new changed category pages css end here  */




















































































 
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Alata", -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 400;
  line-height: 1.6;
  color: #333;
  background-color: #fff;
}

/* Page Layout */
.page-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem;
}

/* Sidebar */
.page-wrapper .sidebar {
  flex: 0 0 240px;
  position: sticky;
  top: 2rem;
  height: fit-content;
  align-self: flex-start;
}

/* Align sidebar with section1 image-wrap */
@media (min-width: 769px) {
  .page-wrapper .sidebar {
      margin-top: 4rem;
  }
}

/* Responsive adjustments for sections wrapper */
@media (min-width: 769px) {
  .page-wrapper .sections-wrapper {
      display: flex;
      align-items: flex-start;
  }
}

.page-wrapper .toc-container {
  background-color: #F6F5EA;
  border-radius: 4px;
  padding: 21px 18px 23px 18px;
}

.page-wrapper .toc-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2d3436;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #dfe6e9;
}

.page-wrapper .toc-nav {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  border-left: 1px solid #A2A089;
}

.page-wrapper .toc-link {
  color: #636e72;
  text-decoration: none;
  font-size: 0.9rem;
  line-height: 1.4;
  padding: 0.5rem;
  border-radius: 4px;
  transition: all 0.2s ease;
  margin-top: 12px !important;
  margin-bottom: 12px !important;
}

.page-wrapper .toc-link:hover {
  background-color: #e9ecef;
  color: #2d3436;
}

/* Main Content */
.page-wrapper .main-content {
  width: 100%;
}

/* Hero Section */
.page-wrapper .article-hero {
  margin: 0 auto;
  margin-bottom: 3rem;
  max-width: 1171px;
}

.page-wrapper .article-title {
  font-size: 2.5rem;
  font-weight: 400;
  color: #2d3436;
  line-height: 1.2;
  margin-bottom: 1.5rem;
  letter-spacing: -0.02em;
}

.page-wrapper .article-meta {
  font-size: 20px;
  line-height: 25px;
  color: #7A7A7A;
  margin-bottom: 59px;
}

/* Image Wrapper */
.page-wrapper .image-wrap {
  width: 100%;
  height: 418px;
  overflow: hidden;
  border-radius: 12px;
  margin-bottom: 1.5rem;
}

.page-wrapper .image-wrap img {
  width: 100%;
  height: 100%;
  display: block;
}

/* Section Image Wrapper */
.content-section .image-wrap {
  width: 670px;
  max-width: 100%;
  height: 354px;
  border-radius: 12px;
}

.hero-image {
  width: 100%;
  height: 100%;
  display: block;
}


/* Sections Wrapper */
.sections-wrapper {
  max-width: 1129px;
  margin: 0 auto;
  display: flex;
  gap: 2rem;
  align-items: flex-start;
}

/* Sections Content Container */
.sections-content {
  flex: 1;
}

/* Content Sections */
.content-section {
  /* margin-bottom: 3rem;
  padding-bottom: 2rem; */
  border-bottom: 1px solid #e9ecef;
  /* max-width: 870px; */
}

.content-section:last-of-type {
  border-bottom: none;
}

.content-section .toc-container {position: sticky; top: 30px; float: right; width: 220px; background: #F6F5EA !important;}
.content-section .html-parser-wrapper {margin-right: 260px;}

@media (max-width: 992px) {
  .content-section .toc-container {position: static; top: 0; float: none; width: auto;}
  .content-section .html-parser-wrapper {margin-right: 0;}
}

.sections-wrapper h2 {
font-size: 1.75rem;
font-weight: 700;
color: #2d3436;
margin-bottom: 1.5rem;
line-height: 1.3;
}

.sections-wrapper img {
width: 100%;
height: 100%;
display: block;
}

.sections-wrapper p, .article-intro {
font-size: 1rem;
color: #636e72;
line-height: 1.7;
margin-bottom: 1.5rem;
}

.sections-wrapper ul {
list-style: none;
padding-left: 0;
max-width: 670px;
}

.sections-wrapper ul li {
position: relative;
padding-left: 1.5rem;
margin-bottom: 0.75rem;
font-size: 1rem;
color: #636e72;
line-height: 1.6;
}

.sections-wrapper ul li::before {
content: "";
position: absolute;
left: 0;
width: 8px;
height: 8px;
background-color: #A2A089;
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
}
.sections-wrapper .key-takeaways {
background-color: #ffffff;
border-radius: 0.65em;
padding: 1.5em;
margin: 0 260px 2em 0;
box-shadow: 0px 10px 0px #A2A089;
font-size: 0.95em;
border: 1px solid #BFBFBF;
}
.sections-wrapper .key-takeaways__title{
font-size:1.5rem;
font-weight: 400;
color: #344361;
margin-bottom: 2rem;
line-height: 1.3;
}
.sections-wrapper .key-takeaways__item::before{
content: "";
position: absolute;
left: 0;
width: 8px;
height: 8px;
background-color: #A2A089;
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
}
.sections-wrapper .key-takeaways__item{
position: relative;
padding-left: 1.5rem;
margin-bottom: 1.99rem;
font-size: 1.25rem;
color: #7A7A7A;
line-height: 1.6;
}
/* .sections-wrapper  .key-takeaways h2{
color: #344361;font-size: 1.1em; font-weight: 400; line-height: 1.1em; margin-bottom: 1.5em;
} */

.sections-wrapper  .key-takeaways__bullet{display: none;} 





@media (max-width: 992px) {
  .sections-wrapper .key-takeaways {margin-right: 0;}
}













/* 
.section-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #2d3436;
  margin-bottom: 1.5rem;
  line-height: 1.3;
}

.section-image {
  width: 100%;
  height: auto;
  display: block;
}

.section-text {
  font-size: 1rem;
  color: #636e72;
  line-height: 1.7;
  margin-bottom: 1.5rem;
  max-width: 670px;
}

.section-list {
  list-style: none;
  padding-left: 0;
  max-width: 670px;
}

.section-list li {
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 0.75rem;
  font-size: 1rem;
  color: #636e72;
  line-height: 1.6;
}

.section-list li::before {
  content: "";
  position: absolute;
  left: 0;
  width: 14px;
  height: 14px;
  background-color: #A2A089;
  border-radius: 50%;
  top: 0.3rem;
} */

/* Intro Text */
.intro-text {
  margin: 2rem 0 1.5rem 0;
  max-width: 670px;
}

.intro-text p {
  font-size: 1rem;
  color: #636e72;
  line-height: 1.7;
}

/* Related Topics Box */
.related-topics {
  background-color: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 1.5rem;
  margin-top: 1.5rem;
  max-width: 670px;
}

.related-topics-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #2d3436;
  margin-bottom: 1rem;
}

.related-topics-list {
  list-style: none;
  padding-left: 0;
}

.related-topics-list li {
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 0.75rem;
  font-size: 1rem;
  line-height: 1.6;
}

.related-topics-list li::before {
  content: "";
  position: absolute;
  left: 0;
  width: 14px;
  height: 14px;
  background-color: #A2A089;
  border-radius: 50%;
  top: 0.3rem;
}

.related-topics-list a {
  color: #636e72;
  text-decoration: none;
  transition: color 0.2s ease;
}

.related-topics-list a:hover {
  color: #2d3436;
}

/* Related Articles */
.related-articles {
  margin-top: 4rem;
  padding-top: 2rem;
  border-top: 2px solid #e9ecef;
  max-width: 1171px;
}

.related-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #2d3436;
  margin-bottom: 2rem;
}

.articles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.article-card {
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  border: 1px solid #e9ecef;
}

.article-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.card-image {
  width: 100%;
  height: 100%;
  display: block;
}

.article-card .image-wrap {
  height: 200px;
}

.card-title {
  padding: 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #2d3436;
  line-height: 1.4;
}

/* Responsive Design */

/* Tablets and smaller desktops */
@media (max-width: 1024px) {
  .page-wrapper {
      padding: 1.5rem;
  }

  .sidebar {
      flex: 0 0 240px;
  }

  .article-title {
      font-size: 2rem;
  }

  .section-title {
      font-size: 1.5rem;
  }

  .articles-grid {
      grid-template-columns: repeat(2, 1fr);
  }
  
  .section-text,
  .sections-wrapper ul,
  .intro-text,
  .related-topics {
      max-width: 100%;
  }
}

/* Tablets portrait */
@media (max-width: 768px) {
  .page-wrapper {
      padding: 1rem;
  }

  .sections-wrapper {
      flex-direction: column;
  }

  .sidebar {
      position: static;
      width: 100%;
      margin-bottom: 2rem;
  }

  .article-title {
      font-size: 1.75rem;
  }

  .section-title {
      font-size: 1.35rem;
  }

  .articles-grid {
      grid-template-columns: 1fr;
      gap: 1.25rem;
  }

  .image-wrap {
      border-radius: 8px;
      height: 300px;
  }
  
  .content-section .image-wrap {
      width: 100%;
      height: 280px;
  }
  
  .article-card .image-wrap {
      height: 220px;
  }
  
  .section-text,
  .sections-wrapper ul,
  .intro-text,
  .related-topics {
      max-width: 100%;
  }
}

/* Mobile devices */
@media (max-width: 480px) {
  .page-wrapper {
      padding: 0.75rem;
  }

  .toc-container {
      padding: 1rem;
  }

  .article-title {
      font-size: 1.5rem;
  }

  .article-meta {
      font-size: 0.85rem;
  }

  .section-title {
      font-size: 1.25rem;
  }

  .section-text,
  .article-intro {
      font-size: 0.95rem;
  }

  .sections-wrapper ul li {
      font-size: 0.95rem;
  }

  .hero-image,
  .section-image {
      border-radius: 8px;
  }

  .related-title {
      font-size: 1.5rem;
  }

  .image-wrap {
      height: 250px;
  }
  
  .content-section .image-wrap {
      width: 100%;
      height: 220px;
  }
  
  .article-card .image-wrap {
      height: 180px;
  }

  .card-title {
      font-size: 0.9rem;
      padding: 0.75rem;
  }
  
  .related-topics {
      padding: 1rem;
  }
  
  .related-topics-title {
      font-size: 1.1rem;
  }
  
  .related-topics-list li {
      font-size: 0.95rem;
  }
  
  .section-text,
  .sections-wrapper ul,
  .intro-text,
  .related-topics {
      max-width: 100%;
  }
}

/* Extra small devices */
@media (max-width: 360px) {
  .article-title {
      font-size: 1.25rem;
  }

  .section-title {
      font-size: 1.1rem;
  }

  .toc-link {
      font-size: 0.85rem;
  }
}

/* Cross-browser compatibility */
img {
  max-width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* Smooth scrolling for Safari */
@supports (-webkit-overflow-scrolling: touch) {
  html {
      -webkit-overflow-scrolling: touch;
  }
}

/* Fix for IE11 flexbox bugs */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .page-wrapper {
      display: -ms-flexbox;
  }
  
  .articles-grid {
      display: -ms-grid;
  }
}












   /* Scoped to .category-layout */
   .category-layout {
    --bg-color: #a4a58d;
    --card-bg: #ffffff;
    --text-main: #333333;
    --text-muted: #666666;
    --dark-accent: #374660;
    
    background-color: var(--bg-color);
    margin: 0;
    /* padding: 40px 20px; */
    color: var(--text-main);
}
.category-layout .sp-section-wrapper {background-color:#A2A089;}
.category-layout .container {
    max-width: 1220px;
    margin: 0 auto;
    padding: 100px 60px 56px;
}

.category-layout .ep-section-header {color: #ffffff;}

/* Grid Logic */
.category-layout .grid-layout {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
}

/* Card General Styles */
.category-layout .card {
    background: var(--card-bg);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.category-layout .card-vertical .card-content { padding: 16px;}

.category-layout .card h1, 
.category-layout .card h2, 
.category-layout .card h3 { 
    margin: 0 0 15px 0; 
    line-height: 1.2; 
    font-weight: 400; 
}

.category-layout .card h1 { font-size: 1.8rem; }
.category-layout .card h2 { font-size: 1.5rem; }
.category-layout .card h3 { font-size: 1.1rem; }
.category-layout .card p { color: var(--text-muted); font-size: 0.85rem; line-height: 1.6; }

/* Layout Variations */
.category-layout .card-horizontal {
    flex-direction: row;
    grid-column: span 2;
}

.category-layout .card-horizontal .card-content { flex: 1.2; padding: 49px 31px;}
.category-layout .card-horizontal .card-image { flex: 1; background-size: cover; background-position: center; }

.category-layout .sidebar-card {
    background: white;
    border-radius: 8px;
    grid-row: span 2;
    overflow: hidden;
}

.category-layout .sidebar-header-img { height: 130px; background-size: cover; margin: 15px; border-radius: 6px; }

.category-layout .article-list { list-style: none; padding: 0 20px; margin: 0; }
.category-layout .article-list li { padding: 15px 0; border-bottom: 1px solid #f0f0f0; }
.category-layout .article-list li:last-child { border-bottom: none; }
.category-layout .article-list small { text-transform: uppercase; color: #999; font-size: 0.65rem; display: block; margin-bottom: 4px;}
.category-layout .article-list h4 { margin: 0; font-size: 17px; line-height: 1.5; color: var(--text-main); font-weight: 400;}

.category-layout .card-image-top { height: 200px; background-size: cover; background-position: center; }

.category-layout .card-dark { 
    background: var(--dark-accent); 
    color: white; 
    padding: 40px 25px;
    justify-content: space-between;
}

.category-layout .card-dark h3 { font-size: 1.4rem; line-height: 1.3; }

.category-layout .btn-read-more {
    display: inline-block;
    background: white;
    color: var(--dark-accent);
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 2px;
    font-size: 0.75rem;
    font-weight: bold;
    text-align: center;
    width: fit-content;
}

/* Responsive Tweak */
@media (max-width: 900px) {
    .category-layout .grid-layout { grid-template-columns: 1fr 1fr; }
    .category-layout .sidebar-card { grid-column: span 2; grid-row: auto; }
    .category-layout .card-dark {grid-column: span 2;}
}

@media (max-width: 600px) {
    .category-layout .grid-layout { grid-template-columns: 1fr; }
    .category-layout .card-horizontal { flex-direction: column; grid-column: span 1; }
    .category-layout .card-horizontal .card-image { height: 200px; }
    .category-layout .sidebar-card { grid-column: span 1; }
    .category-layout .card-dark {grid-column: span 1;}
}

/* ================================================
   Mobile Nav Menu
   ================================================ */

/* Hamburger button – hidden on desktop, visible on mobile */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 4px;
  flex-shrink: 0;
}

.nav-hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}

/* Animate to X when open */
.nav-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Overlay backdrop */
.mobile-nav-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mobile-nav-overlay.is-open {
  display: block;
  opacity: 1;
}

/* Slide-in drawer */
.mobile-nav {
  position: fixed;
  top: 0;
  right: 0;
  width: 220px;
  height: 100%;
  background: var(--home-dark, #1a2744);
  z-index: 1001;
  display: flex;
  flex-direction: column;
  padding: 24px 32px;
  gap: 0;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
}

.mobile-nav.is-open {
  transform: translateX(0);
}

/* Close button inside drawer */
.mobile-nav-close {
  align-self: flex-end;
  background: transparent;
  border: none;
  color: #fff;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  margin-bottom: 32px;
  opacity: 0.8;
  transition: opacity 0.2s ease;
}

.mobile-nav-close:hover { opacity: 1; }

/* Nav links inside drawer */
.mobile-nav a {
  display: block;
  color: #fff;
  text-decoration: none;
  font-size: 18px;
  font-weight: 500;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  transition: color 0.2s ease, padding-left 0.2s ease;
}

.mobile-nav a:last-child { border-bottom: none; }

.mobile-nav a:hover {
  color: #FFF705;
  padding-left: 6px;
}

/* Prevent background scroll when drawer is open */
body.nav-open { overflow: hidden; }

/* Show hamburger only on mobile; keep desktop nav visible on desktop */
@media (max-width: 768px) {
  .nav-hamburger { display: flex; order: 2; }
}

@media (min-width: 769px) {
  .mobile-nav,
  .mobile-nav-overlay { display: none !important; }
}