
/* =========================================================
   HERU: Health Empowerment and Research Universe
   Custom OJS Theme — Base Visual Design
   ========================================================= */

:root{
  --heru-primary:#0b8f83;
  --heru-primary-dark:#06665f;
  --heru-navy:#0b3550;
  --heru-teal:#14b8a6;
  --heru-mint:#eaf8f5;
  --heru-bg:#f4f8f8;
  --heru-text:#173042;
  --heru-muted:#68808e;
  --heru-border:#dce9e8;
  --heru-white:#ffffff;
  --heru-shadow:0 12px 30px rgba(10,53,80,.10);
}

/* GLOBAL */
html,body{
  background:var(--heru-bg);
}
body{
  color:var(--heru-text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65;
}

a{
  color:var(--heru-primary-dark);
}
a:hover,
a:focus{
  color:var(--heru-primary);
}

.pkp_structure_page{
  max-width:1380px;
  margin:0 auto;
  background:var(--heru-white);
  box-shadow:0 0 38px rgba(7,57,77,.10);
  overflow:hidden;
}

/* TOP USER BAR */
.pkp_structure_head{
  background:var(--heru-white);
}

.pkp_navigation_user_wrapper{
  background:var(--heru-navy);
  color:#fff;
  padding-left:4%;
  padding-right:4%;
}

.pkp_navigation_user>li>a,
.pkp_navigation_user>li.in_focus>a{
  color:#fff;
  font-weight:600;
  font-size:13px;
}

.pkp_navigation_user>li>a:hover{
  color:#bdf5ec;
}

/* JOURNAL HEADER */
.pkp_site_name_wrapper{
  position:relative;
  overflow:hidden;
  padding:0;
  background:
    radial-gradient(circle at 82% 20%, rgba(255,255,255,.28) 0 4px, transparent 5px),
    radial-gradient(circle at 86% 63%, rgba(255,255,255,.18) 0 5px, transparent 6px),
    linear-gradient(120deg,#ffffff 0%,#f2fffc 48%,#c9f4ee 100%);
  border-bottom:1px solid rgba(11,143,131,.18);
}

.pkp_site_name_wrapper:before{
  content:"";
  position:absolute;
  right:-60px;
  top:-90px;
  width:470px;
  height:300px;
  border-radius:50%;
  background:
    repeating-linear-gradient(
      135deg,
      rgba(11,143,131,.06) 0 16px,
      rgba(20,184,166,.12) 16px 32px
    );
  transform:rotate(-8deg);
}

.pkp_site_name{
  position:relative;
  z-index:2;
  padding:38px 52px 34px;
}

.pkp_site_name .is_text{
  display:block;
  max-width:900px;
  color:var(--heru-navy);
  font-size:34px;
  font-weight:800;
  letter-spacing:-.5px;
  line-height:1.2;
  text-shadow:none;
}

.pkp_site_name .is_text:after{
  content:"Advancing Health Research, Empowering Communities";
  display:block;
  margin-top:9px;
  color:var(--heru-primary);
  font-size:15px;
  font-weight:600;
  font-style:italic;
  letter-spacing:.1px;
}

/* NAVIGATION */
.pkp_navigation_primary_wrapper{
  background:linear-gradient(90deg,var(--heru-primary-dark),var(--heru-primary),#087f88);
  padding-left:34px;
  padding-right:34px;
  box-shadow:0 5px 18px rgba(6,102,95,.18);
}

#navigationPrimary{
  margin:0;
}

#navigationPrimary>li>a{
  color:#fff;
  font-size:14px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.25px;
  padding:16px 17px;
  border-bottom:3px solid transparent;
}

#navigationPrimary>li>a:hover,
#navigationPrimary>li>a:focus{
  color:#fff;
  background:rgba(255,255,255,.10);
  border-bottom-color:#7ff4df;
}

#navigationPrimary ul{
  border:0;
  border-radius:10px;
  box-shadow:0 14px 30px rgba(9,53,80,.18);
  overflow:hidden;
}

#navigationPrimary ul a{
  padding:11px 16px;
}

.pkp_navigation_search_wrapper a{
  color:#fff;
  font-weight:700;
}

/* PAGE CONTENT */
.pkp_structure_content{
  padding:34px 34px 48px;
}

.pkp_structure_main{
  padding-right:28px;
}

.page,
.obj_issue_toc,
.obj_article_details,
.cmp_form{
  color:var(--heru-text);
}

.page h1,
.page h2,
.page h3,
.obj_issue_toc .heading,
.obj_article_details .page_title{
  color:var(--heru-navy);
}

.page h1{
  font-weight:800;
  letter-spacing:-.4px;
}

.page h2{
  font-weight:750;
}

/* ARTICLE / ISSUE CARDS */
.obj_issue_summary,
.obj_article_summary{
  border:1px solid var(--heru-border);
  border-radius:12px;
  padding:18px;
  margin-bottom:18px;
  background:#fff;
  box-shadow:0 7px 20px rgba(12,72,83,.06);
}

.obj_issue_summary:hover,
.obj_article_summary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(12,72,83,.10);
  transition:.2s ease;
}

.obj_galley_link{
  border:0;
  border-radius:8px;
  background:var(--heru-primary);
  color:#fff !important;
  font-weight:700;
  padding:7px 13px;
}

.obj_galley_link:hover{
  background:var(--heru-primary-dark);
}

/* BUTTONS */
.cmp_button,
button,
input[type="submit"],
.pkp_button,
a.pkp_button{
  border-radius:8px !important;
}

.cmp_button,
.pkp_button,
a.pkp_button{
  background:var(--heru-primary);
  color:#fff;
  border:1px solid var(--heru-primary);
  font-weight:700;
}

.cmp_button:hover,
.pkp_button:hover,
a.pkp_button:hover{
  background:var(--heru-primary-dark);
  border-color:var(--heru-primary-dark);
  color:#fff;
}

/* SIDEBAR */
.pkp_structure_sidebar{
  padding-left:20px;
}

.pkp_block{
  background:#fff;
  border:1px solid var(--heru-border);
  border-radius:13px;
  margin-bottom:19px;
  overflow:hidden;
  box-shadow:var(--heru-shadow);
}

.pkp_block .title{
  display:block;
  margin:0 !important;
  padding:12px 16px;
  background:linear-gradient(90deg,var(--heru-primary-dark),var(--heru-primary));
  color:#fff !important;
  font-weight:800;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.35px;
}

.pkp_block .content{
  padding:14px 16px;
}

.pkp_block ul{
  margin:0;
  padding:0;
  list-style:none;
}

.pkp_block li{
  border-bottom:1px solid #edf3f2;
}

.pkp_block li:last-child{
  border-bottom:0;
}

.pkp_block li a{
  display:block;
  padding:10px 4px;
  color:var(--heru-text);
  font-weight:600;
  text-decoration:none;
}

.pkp_block li a:hover{
  color:var(--heru-primary);
  padding-left:8px;
  transition:.18s ease;
}

/* SEARCH */
.cmp_notification,
.cmp_form .fields>div,
.cmp_form fieldset{
  border-radius:10px;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="url"],
textarea,
select{
  border:1px solid #cfe0df !important;
  border-radius:8px !important;
}

input:focus,
textarea:focus,
select:focus{
  border-color:var(--heru-primary) !important;
  box-shadow:0 0 0 3px rgba(11,143,131,.12) !important;
}

/* BREADCRUMBS */
.cmp_breadcrumbs{
  font-size:13px;
  color:var(--heru-muted);
}

/* FOOTER */
.pkp_structure_footer_wrapper{
  margin-top:0;
  background:linear-gradient(115deg,#07354a,#075a61 55%,#08766e);
  border-top:5px solid var(--heru-teal);
}

.pkp_structure_footer{
  padding:35px 45px;
  color:rgba(255,255,255,.88);
}

.pkp_structure_footer a{
  color:#baf6ec;
}

.pkp_structure_footer a:hover{
  color:#fff;
}

.pkp_brand_footer{
  filter:brightness(0) invert(1);
  opacity:.82;
}

/* TABLES */
table{
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border:1px solid var(--heru-border);
  border-radius:10px;
}

thead th{
  background:var(--heru-mint);
  color:var(--heru-navy);
}

/* MOBILE */
@media (max-width:991px){
  .pkp_site_name{
    padding:26px 24px;
  }

  .pkp_site_name .is_text{
    font-size:25px;
  }

  .pkp_navigation_primary_wrapper{
    padding-left:18px;
    padding-right:18px;
  }

  .pkp_structure_content{
    padding:24px 18px 38px;
  }

  .pkp_structure_main{
    padding-right:0;
  }

  .pkp_structure_sidebar{
    padding-left:0;
    margin-top:28px;
  }
}

@media (max-width:575px){
  .pkp_site_name .is_text{
    font-size:21px;
  }

  .pkp_site_name .is_text:after{
    font-size:12px;
  }
}


/* =========================================================
   HERU V2 — HEADER / NAV / FOOTER REFINEMENT
   ========================================================= */

/* Make the top layout cleaner */
.pkp_head_wrapper{
  max-width:none !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Medical identity mark beside the journal title */
.pkp_site_name{
  display:flex;
  align-items:center;
  gap:22px;
}

.pkp_site_name:before{
  content:"H";
  flex:0 0 86px;
  width:86px;
  height:86px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.35), transparent 28%),
    linear-gradient(145deg,#0b3550 0%,#0b8f83 58%,#20c9b4 100%);
  color:#fff;
  font-size:48px;
  font-weight:900;
  line-height:1;
  box-shadow:
    0 12px 28px rgba(11,53,80,.16),
    inset 0 0 0 5px rgba(255,255,255,.92),
    inset 0 0 0 7px rgba(11,143,131,.22);
}

.pkp_site_name .is_text{
  flex:1 1 auto;
}

/* Remove blue strips at both sides of navbar */
.pkp_navigation_primary_row{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:linear-gradient(90deg,#075f59 0%,#0b8f83 52%,#087f88 100%) !important;
  border:0 !important;
}

.pkp_navigation_primary_wrapper{
  max-width:1280px !important;
  width:calc(100% - 64px) !important;
  margin:0 auto !important;
  padding:0 18px !important;
  background:transparent !important;
  box-shadow:none !important;
}

#navigationPrimary>li>a{
  position:relative;
  border-bottom:0 !important;
}

#navigationPrimary>li>a:after{
  content:"";
  position:absolute;
  left:17px;
  right:17px;
  bottom:8px;
  height:2px;
  border-radius:2px;
  background:#8af4e3;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
}

#navigationPrimary>li>a:hover:after,
#navigationPrimary>li>a:focus:after{
  transform:scaleX(1);
}

/* Search stays visually aligned with the menu */
.pkp_navigation_search_wrapper{
  margin-left:auto;
}
.pkp_navigation_search_wrapper a{
  color:#fff !important;
}

/* Reduce the oversized empty default footer for now */
.pkp_structure_footer_wrapper{
  min-height:0 !important;
}

.pkp_structure_footer{
  min-height:0 !important;
  padding:24px 38px !important;
}

.pkp_brand_footer{
  float:none !important;
  text-align:right;
  margin:0 !important;
}

.pkp_brand_footer img{
  max-height:58px !important;
  width:auto !important;
}

/* Slightly tighter content area until homepage blocks are added */
.pkp_structure_content{
  min-height:260px;
}

/* Tablet / mobile refinements */
@media (max-width:991px){
  .pkp_site_name{
    gap:15px;
  }

  .pkp_site_name:before{
    flex-basis:66px;
    width:66px;
    height:66px;
    font-size:36px;
  }

  .pkp_navigation_primary_wrapper{
    width:100% !important;
    padding:0 14px !important;
  }
}

@media (max-width:575px){
  .pkp_site_name{
    align-items:flex-start;
  }

  .pkp_site_name:before{
    flex-basis:52px;
    width:52px;
    height:52px;
    font-size:29px;
  }
}


/* =========================================================
   HERU V3 — HOMEPAGE HERO & FEATURE CARDS
   ========================================================= */

.heru-home{
  width:100%;
}

.heru-hero{
  position:relative;
  min-height:410px;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  align-items:center;
  gap:30px;
  padding:52px 54px;
  margin:0 0 24px;
  overflow:hidden;
  border:1px solid #d9eeee;
  border-radius:18px;
  background:
    radial-gradient(circle at 78% 35%, rgba(23,190,172,.16), transparent 27%),
    radial-gradient(circle at 93% 72%, rgba(10,105,99,.12), transparent 22%),
    linear-gradient(120deg,#ffffff 0%,#f6fffd 50%,#e4f9f5 100%);
  box-shadow:0 14px 38px rgba(8,65,83,.09);
}

.heru-hero:before{
  content:"";
  position:absolute;
  left:-60px;
  bottom:-95px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(20,184,166,.06);
}

.heru-hero__content{
  position:relative;
  z-index:3;
}

.heru-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
  padding:7px 12px;
  border-radius:999px;
  background:#e6f8f4;
  color:#08766e;
  font-size:12px;
  font-weight:800;
  letter-spacing:1px;
}

.heru-eyebrow:before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:#10a995;
  box-shadow:0 0 0 5px rgba(16,169,149,.12);
}

.heru-hero h1{
  margin:0;
  max-width:720px;
  color:#0b3550;
  font-size:43px;
  line-height:1.08;
  font-weight:850;
  letter-spacing:-1px;
}

.heru-hero h1 span{
  color:#0b8f83;
}

.heru-hero p{
  margin:20px 0 0;
  max-width:610px;
  color:#526d7a;
  font-size:16px;
  font-weight:600;
}

.heru-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:30px;
}

.heru-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 21px;
  border-radius:9px;
  text-decoration:none !important;
  font-size:13px;
  font-weight:800;
  letter-spacing:.25px;
  transition:.2s ease;
}

.heru-btn--primary{
  color:#fff !important;
  background:linear-gradient(90deg,#08766e,#0ba48f);
  box-shadow:0 9px 20px rgba(11,143,131,.2);
}

.heru-btn--primary:hover{
  transform:translateY(-2px);
  color:#fff !important;
  box-shadow:0 13px 26px rgba(11,143,131,.26);
}

.heru-btn--outline{
  color:#08766e !important;
  background:rgba(255,255,255,.75);
  border:1px solid #79cfc3;
}

.heru-btn--outline:hover{
  transform:translateY(-2px);
  background:#fff;
}

.heru-hero__visual{
  position:relative;
  min-height:290px;
}

.heru-medical-mark{
  position:absolute;
  left:50%;
  top:50%;
  width:150px;
  height:150px;
  transform:translate(-50%,-50%);
  border-radius:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(145deg,#0b8f83,#14b8a6);
  box-shadow:
    0 24px 50px rgba(11,143,131,.23),
    inset 0 0 0 12px rgba(255,255,255,.14);
}

.heru-medical-mark:before{
  content:"+";
  color:#fff;
  font-size:112px;
  line-height:1;
  font-weight:300;
  transform:translateY(-5px);
}

.heru-pulse{
  position:absolute;
  color:#fff;
  font-size:64px;
  font-weight:300;
  transform:rotate(-8deg);
  opacity:.95;
}

.heru-orbit{
  position:absolute;
  left:50%;
  top:50%;
  border:1px solid rgba(11,143,131,.20);
  border-radius:50%;
  transform:translate(-50%,-50%);
}

.heru-orbit--1{
  width:235px;
  height:235px;
}

.heru-orbit--2{
  width:310px;
  height:310px;
  border-style:dashed;
}

.heru-dna{
  position:absolute;
  right:1%;
  bottom:5%;
  width:120px;
  height:150px;
  opacity:.32;
  transform:rotate(10deg);
}

.heru-dna span{
  position:relative;
  display:block;
  height:25px;
  border-top:2px solid #0b8f83;
  border-bottom:2px solid #14b8a6;
  border-radius:50%;
  transform:skewY(-18deg);
}

.heru-feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin:0 0 28px;
}

.heru-feature-card{
  display:flex;
  align-items:center;
  gap:15px;
  min-height:116px;
  padding:20px;
  border:1px solid #deecea;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 22px rgba(11,53,80,.07);
}

.heru-feature-icon{
  flex:0 0 58px;
  width:58px;
  height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#0b8f83,#15bda8);
  font-size:26px;
  font-weight:700;
}

.heru-feature-card h3{
  margin:0 0 5px;
  color:#0b3550;
  font-size:16px;
}

.heru-feature-card p{
  margin:0;
  color:#71848d;
  font-size:13px;
  line-height:1.45;
}

.heru-section{
  margin-top:24px;
}

.heru-section-heading{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}

.heru-section-heading span{
  width:22px;
  height:3px;
  border-radius:99px;
  background:#0b8f83;
}

.heru-section-heading h2{
  margin:0;
  color:#0b6f68;
  font-size:18px;
  font-weight:850;
  letter-spacing:.2px;
}

.heru-placeholder-box{
  display:flex;
  flex-direction:column;
  gap:5px;
  padding:22px;
  border:1px dashed #b8deda;
  border-radius:12px;
  background:#f9fdfc;
  color:#617985;
}

.heru-placeholder-box strong{
  color:#0b3550;
}

@media (max-width:1000px){
  .heru-hero{
    grid-template-columns:1fr;
    padding:38px 32px;
  }

  .heru-hero__visual{
    min-height:230px;
  }

  .heru-feature-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:575px){
  .heru-hero{
    padding:28px 20px;
    border-radius:12px;
  }

  .heru-hero h1{
    font-size:31px;
  }

  .heru-hero__visual{
    min-height:205px;
  }

  .heru-medical-mark{
    width:118px;
    height:118px;
    border-radius:30px;
  }

  .heru-medical-mark:before{
    font-size:86px;
  }

  .heru-orbit--1{
    width:185px;
    height:185px;
  }

  .heru-orbit--2{
    width:235px;
    height:235px;
  }
}


/* =========================================================
   HERU V4 — FIX HEADER CONTRAST + SPACING
   ========================================================= */

/* Force journal title to stay visible on the light medical header */
.pkp_site_name .is_text,
.pkp_site_name a.is_text,
.pkp_site_name .is_text a,
.pkp_site_name a{
  color:#0b3550 !important;
  text-shadow:none !important;
}

.pkp_site_name .is_text:hover,
.pkp_site_name a.is_text:hover,
.pkp_site_name a:hover{
  color:#08766e !important;
}

/* Keep the tagline green */
.pkp_site_name .is_text:after,
.pkp_site_name a.is_text:after{
  color:#0b8f83 !important;
}

/* Make the journal header feel like one intentional block */
.pkp_structure_head{
  background:linear-gradient(115deg,#0a2f4a 0%,#0d5c73 58%,#0a8890 100%) !important;
}

.pkp_site_name_wrapper{
  max-width:1240px !important;
  margin:30px auto 0 !important;
  border-radius:0 !important;
  background:
    radial-gradient(circle at 82% 20%, rgba(255,255,255,.30) 0 4px, transparent 5px),
    radial-gradient(circle at 88% 62%, rgba(255,255,255,.18) 0 5px, transparent 6px),
    linear-gradient(120deg,#ffffff 0%,#f3fffc 50%,#cdf6ef 100%) !important;
}

/* Prevent the title from washing out */
.pkp_site_name{
  opacity:1 !important;
}

.pkp_site_name .is_text{
  font-weight:850 !important;
}

/* Navbar centered to the same width as the header */
.pkp_navigation_primary_row{
  margin-top:0 !important;
}

.pkp_navigation_primary_wrapper{
  max-width:1240px !important;
}

/* Reduce the large empty gap between navbar and homepage hero */
.pkp_structure_content{
  padding-top:28px !important;
}

/* Let the homepage design use the available main column cleanly */
.page_index_journal .pkp_structure_main{
  padding-top:0 !important;
}

/* Hero spacing refinement */
.heru-hero{
  margin-top:0 !important;
}

/* Keep mobile header readable */
@media (max-width:991px){
  .pkp_site_name_wrapper{
    margin-top:0 !important;
    max-width:none !important;
  }

  .pkp_site_name .is_text,
  .pkp_site_name a.is_text{
    color:#0b3550 !important;
  }
}


/* =========================================================
   HERU V5 — REMOVE DEFAULT OJS GRID / BORDER LINES
   ========================================================= */

/* Remove thin structural lines from OJS default layout */
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
.page_index_journal .pkp_structure_content,
.page_index_journal .pkp_structure_main,
.page_index_journal .pkp_structure_sidebar{
  border:0 !important;
  outline:0 !important;
}

/* Some OJS themes draw column guides with pseudo-elements */
.pkp_structure_content:before,
.pkp_structure_content:after,
.pkp_structure_main:before,
.pkp_structure_main:after,
.pkp_structure_sidebar:before,
.pkp_structure_sidebar:after{
  content:none !important;
  display:none !important;
  border:0 !important;
}

/* Remove remaining default divider on content wrapper */
.pkp_page_index .pkp_structure_content,
.page_index_journal .pkp_structure_content{
  box-shadow:none !important;
}

/* Keep only the intentional HERU card borders */
.heru-hero,
.heru-feature-card,
.heru-placeholder-box,
.pkp_block{
  position:relative;
  z-index:1;
}


/* =========================================================
   HERU V6 — REMOVE HOMEPAGE ADDITIONAL CONTENT TOP LINE
   ========================================================= */

/* OJS adds a separator above Homepage Additional Content */
.page_index_journal .additional_content,
.page_index_journal .homepage_about,
.page_index_journal .homepage_image,
.pkp_page_index .additional_content,
.additional_content{
  border-top:0 !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}

/* Remove the extra top spacing that belonged to that separator */
.page_index_journal .additional_content,
.pkp_page_index .additional_content,
.additional_content{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* Defensive: hide any direct HR accidentally created by the editor */
.page_index_journal .additional_content > hr:first-child,
.pkp_page_index .additional_content > hr:first-child{
  display:none !important;
}


/* =========================================================
   HERU V7 — SIDEBAR CUSTOM BLOCKS
   ========================================================= */

.heru-side-menu,
.heru-template-box,
.heru-tools-grid,
.heru-visitor-box{
  width:100%;
}

.heru-side-menu a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 4px;
  border-bottom:1px solid #edf3f2;
  color:#18394a !important;
  font-size:13px;
  font-weight:650;
  text-decoration:none !important;
  transition:.18s ease;
}

.heru-side-menu a:last-child{
  border-bottom:0;
}

.heru-side-menu a:after{
  content:"›";
  color:#0b8f83;
  font-size:20px;
  line-height:1;
}

.heru-side-menu a:hover{
  color:#0b8f83 !important;
  padding-left:7px;
}

.heru-template-box{
  text-align:center;
}

.heru-template-icon{
  width:68px;
  height:68px;
  margin:2px auto 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:16px;
  background:linear-gradient(145deg,#1264a3,#2d8bd4);
  color:#fff;
  font-size:28px;
  font-weight:900;
  box-shadow:0 9px 18px rgba(18,100,163,.18);
}

.heru-template-box p{
  margin:0 0 12px;
  color:#637985;
  font-size:12px;
  line-height:1.5;
}

.heru-template-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border-radius:8px;
  background:linear-gradient(90deg,#08766e,#0ba48f);
  color:#fff !important;
  font-size:12px;
  font-weight:800;
  text-decoration:none !important;
}

.heru-template-btn:hover{
  background:#06665f;
}

.heru-tools-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}

.heru-tool{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 6px;
  border:1px solid #e2eceb;
  border-radius:10px;
  background:#fff;
  color:#173042 !important;
  text-align:center;
  font-size:12px;
  font-weight:800;
  text-decoration:none !important;
  box-shadow:0 5px 14px rgba(11,53,80,.05);
}

.heru-tool:hover{
  border-color:#9bd8d1;
  color:#0b8f83 !important;
  transform:translateY(-2px);
}

.heru-visitor-box{
  display:grid;
  gap:8px;
}

.heru-visitor-row{
  display:flex;
  justify-content:space-between;
  gap:14px;
  padding:7px 0;
  border-bottom:1px solid #edf3f2;
  font-size:12px;
}

.heru-visitor-row:last-child{
  border-bottom:0;
}

.heru-visitor-row strong{
  color:#0b3550;
}

@media (max-width:991px){
  .heru-tools-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (max-width:575px){
  .heru-tools-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* =========================================================
   HERU V8 — SIDEBAR TITLE CONTRAST
   ========================================================= */
.pkp_block .title,
.pkp_block .title a,
.pkp_block h2.title,
.pkp_block h3.title{
  color:#ffffff !important;
  text-shadow:none !important;
}

.pkp_block .title:after{
  content:"";
  display:block;
  width:34px;
  height:3px;
  margin-top:7px;
  border-radius:999px;
  background:#7ff4df;
}


/* =========================================================
   HERU V9 — LOCK MAIN + SIDEBAR INTO TWO-COLUMN LAYOUT
   ========================================================= */

/* Force a stable 2-column journal homepage layout */
.pkp_structure_content{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 290px !important;
  column-gap:24px !important;
  align-items:start !important;
  max-width:1240px !important;
  margin:0 auto !important;
  padding:32px 30px 50px !important;
}

/* Main journal area */
.pkp_structure_main{
  grid-column:1 !important;
  float:none !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}

/* Sidebar must begin at the top, next to the hero */
.pkp_structure_sidebar{
  grid-column:2 !important;
  float:none !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  align-self:start !important;
  border:0 !important;
}

/* Prevent custom blocks from dropping below floated content */
.pkp_structure_sidebar .pkp_block{
  clear:none !important;
  float:none !important;
  width:100% !important;
  margin-top:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Keep homepage custom content entirely inside the main column */
.page_index_journal .additional_content,
.pkp_page_index .additional_content,
.additional_content{
  width:100% !important;
  max-width:none !important;
  float:none !important;
  clear:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* Hero adapts to the narrower main column */
.heru-hero{
  width:100% !important;
  box-sizing:border-box !important;
  grid-template-columns:minmax(0,1.05fr) minmax(245px,.95fr) !important;
  min-height:390px !important;
  padding:42px 38px !important;
}

.heru-hero h1{
  font-size:38px !important;
}

.heru-feature-grid{
  width:100% !important;
}

/* Remove any legacy floating behavior */
.pkp_page_index:after,
.page_index_journal:after,
.pkp_structure_content:after{
  content:none !important;
  display:none !important;
}

/* Tablet */
@media (max-width:991px){
  .pkp_structure_content{
    display:block !important;
    max-width:none !important;
    padding:24px 18px 40px !important;
  }

  .pkp_structure_sidebar{
    width:100% !important;
    margin-top:28px !important;
  }

  .heru-hero{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   HERU V10 — FULL HOMEPAGE MATCHING THE INITIAL CONCEPT
   ========================================================= */

.heru-hero--full{
  min-height:360px !important;
}

.heru-health-panel{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.heru-health-cross{
  width:120px;
  height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:28px;
  background:linear-gradient(145deg,#0b8f83,#18b7aa);
  color:#fff;
  font-size:84px;
  font-weight:250;
  box-shadow:0 18px 40px rgba(11,143,131,.22);
}

.heru-health-icons{
  position:absolute;
  inset:0;
}

.heru-health-icons span{
  position:absolute;
  width:56px;
  height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  border:1px solid rgba(11,143,131,.18);
  background:rgba(255,255,255,.72);
  color:#0b8f83;
  font-size:13px;
  font-weight:800;
  box-shadow:0 8px 18px rgba(11,53,80,.06);
}

.heru-health-icons span:nth-child(1){left:12%;top:17%;}
.heru-health-icons span:nth-child(2){right:12%;top:16%;}
.heru-health-icons span:nth-child(3){left:5%;top:45%;}
.heru-health-icons span:nth-child(4){right:5%;top:45%;}
.heru-health-icons span:nth-child(5){left:18%;bottom:8%;}
.heru-health-icons span:nth-child(6){right:18%;bottom:8%;}

.heru-about-box{
  display:grid;
  grid-template-columns:minmax(0,1fr) 180px;
  gap:24px;
  align-items:center;
  padding:20px 0 12px;
  border-top:1px solid #dcebea;
}

.heru-about-text p{
  margin:0 0 10px;
  font-size:13px;
  line-height:1.65;
  color:#405a69;
}

.heru-about-visual{
  min-height:130px;
  position:relative;
  border-radius:16px;
  background:linear-gradient(145deg,#f2fffc,#dff8f3);
  overflow:hidden;
}

.heru-microscope{
  position:absolute;
  left:28px;
  bottom:18px;
  font-size:72px;
  color:#0b8f83;
}

.heru-dna-label{
  position:absolute;
  right:20px;
  top:22px;
  padding:9px 10px;
  border:1px solid #9fdad2;
  border-radius:10px;
  color:#0b8f83;
  font-size:12px;
  font-weight:900;
}

.heru-mini-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  margin-top:8px;
  padding:0 13px;
  border:1px solid #78cfc3;
  border-radius:7px;
  color:#08766e !important;
  background:#fff;
  font-size:11px;
  font-weight:800;
  text-decoration:none !important;
}

.heru-mini-btn:hover{
  background:#eaf8f5;
}

.heru-scope-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:0;
  margin-bottom:10px;
  border-top:1px solid #dcebea;
}

.heru-scope-grid div{
  min-height:50px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 8px;
  border-bottom:1px solid #edf3f2;
  color:#0b8f83;
  font-weight:800;
  font-size:15px;
}

.heru-scope-grid span{
  color:#334f5e;
  font-size:11px;
  font-weight:600;
}

.heru-issue-box{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:22px;
  margin:4px 0 10px;
  padding-top:16px;
  border-top:1px solid #dcebea;
}

.heru-cover-placeholder{
  min-height:230px;
  padding:18px 15px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  border-radius:4px;
  background:
    linear-gradient(rgba(5,91,83,.1),rgba(4,83,74,.12)),
    linear-gradient(145deg,#0a6c65,#0b8f83 45%,#154b66);
  color:#fff;
  box-shadow:0 8px 16px rgba(11,53,80,.16);
}

.heru-cover-mark{
  width:38px;
  height:38px;
  margin-bottom:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  border:2px solid #fff;
  font-size:20px;
  font-weight:900;
}

.heru-cover-placeholder strong{
  font-size:24px;
  letter-spacing:.8px;
}

.heru-cover-placeholder small{
  margin-top:4px;
  font-size:10px;
  line-height:1.3;
}

.heru-cover-placeholder span{
  margin-top:auto;
  font-size:8px;
  letter-spacing:.6px;
}

.heru-issue-content h3{
  margin:0 0 4px;
  color:#0b3550;
  font-size:16px;
}

.heru-muted{
  margin:0 0 8px;
  color:#78909a;
  font-size:11px;
}

.heru-article-line{
  padding:8px 0;
  border-top:1px solid #e4eeee;
}

.heru-article-line strong,
.heru-article-line span,
.heru-article-line small{
  display:block;
}

.heru-article-line strong{
  color:#0b3550;
  font-size:11px;
}

.heru-article-line span{
  margin:2px 0;
  color:#627984;
  font-size:10px;
}

.heru-article-line small{
  color:#0b8f83;
  font-size:9px;
  font-weight:700;
}

.heru-index-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  padding-top:14px;
  border-top:1px solid #dcebea;
}

.heru-index-grid div{
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:8px;
  border:1px solid #dfeaea;
  border-radius:8px;
  background:#fff;
  color:#345362;
  font-size:12px;
  font-weight:800;
  text-align:center;
  box-shadow:0 5px 14px rgba(11,53,80,.04);
}

.heru-index-note{
  margin:9px 0 0;
  color:#8798a0;
  font-size:9px;
  font-style:italic;
}

@media (max-width:1100px){
  .heru-scope-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .heru-index-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:700px){
  .heru-about-box{
    grid-template-columns:1fr;
  }
  .heru-about-visual{
    display:none;
  }
  .heru-scope-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .heru-issue-box{
    grid-template-columns:1fr;
  }
  .heru-cover-placeholder{
    max-width:180px;
  }
  .heru-index-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* =========================================================
   HERU V11 — HERO REFINEMENT TO MATCH INITIAL MOCKUP
   ========================================================= */

.heru-hero--full{
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr) !important;
  min-height:330px !important;
  padding:34px 34px !important;
}

.heru-hero__content{
  max-width:620px;
}

.heru-hero h1{
  font-size:32px !important;
  line-height:1.12 !important;
  letter-spacing:-.5px !important;
  margin-bottom:14px !important;
}

.heru-hero p{
  max-width:560px !important;
  margin-top:0 !important;
  color:#314d5c !important;
  font-size:13px !important;
  line-height:1.65 !important;
  font-weight:500 !important;
}

.heru-hero__actions{
  flex-direction:row !important;
  align-items:center !important;
  margin-top:22px !important;
}

.heru-btn{
  min-height:44px !important;
  padding:0 18px !important;
  font-size:12px !important;
}

.heru-hero__visual{
  min-height:250px !important;
}

.heru-health-panel{
  background:
    radial-gradient(circle at 50% 50%, rgba(20,184,166,.12), transparent 46%);
}

/* Replace unsupported/odd symbols with clean medical hexagon cards */
.heru-health-icons{
  inset:14px !important;
}

.heru-health-icons span{
  width:58px !important;
  height:58px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.88) !important;
  font-size:11px !important;
  letter-spacing:.2px;
  box-shadow:0 8px 18px rgba(11,53,80,.07) !important;
}

.heru-health-icons span:nth-child(1){left:14%;top:16%;}
.heru-health-icons span:nth-child(2){right:14%;top:16%;}
.heru-health-icons span:nth-child(3){left:7%;top:45%;}
.heru-health-icons span:nth-child(4){right:7%;top:45%;}
.heru-health-icons span:nth-child(5){left:20%;bottom:8%;}
.heru-health-icons span:nth-child(6){right:20%;bottom:8%;}

.heru-health-cross{
  width:108px !important;
  height:108px !important;
  border-radius:26px !important;
  font-size:74px !important;
}

/* Keep information cards compact like the initial concept */
.heru-feature-grid{
  gap:12px !important;
}

.heru-feature-card{
  min-height:100px !important;
  padding:16px !important;
}

.heru-feature-icon{
  flex-basis:52px !important;
  width:52px !important;
  height:52px !important;
  font-size:18px !important;
}

.heru-feature-card h3{
  font-size:14px !important;
}

.heru-feature-card p{
  font-size:11px !important;
}

/* Sidebar slightly tighter */
.pkp_structure_content{
  grid-template-columns:minmax(0,1fr) 280px !important;
  column-gap:20px !important;
}

.pkp_block .content{
  padding:12px 14px !important;
}

/* Desktop target similar to reference */
@media (min-width:1200px){
  .pkp_structure_content{
    max-width:1240px !important;
  }
}

@media (max-width:991px){
  .heru-hero--full{
    grid-template-columns:1fr !important;
  }
  .heru-hero__actions{
    flex-wrap:wrap !important;
  }
}


/* =========================================================
   HERU V12 — HERO VISUAL CLEANUP + CUSTOM FOOTER
   ========================================================= */

/* Remove text fragments from the right-side hero decoration */
.heru-health-icons{
  display:none !important;
}

.heru-health-panel{
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(20,184,166,.18) 0 18%, transparent 19% 33%, rgba(11,143,131,.10) 34% 34.5%, transparent 35% 48%, rgba(11,143,131,.08) 49% 49.5%, transparent 50%),
    linear-gradient(135deg, transparent 0 48%, rgba(20,184,166,.05) 49% 51%, transparent 52% 100%) !important;
}

.heru-health-panel:before,
.heru-health-panel:after{
  content:"" !important;
  position:absolute !important;
  width:54px !important;
  height:54px !important;
  border-radius:15px !important;
  border:1px solid rgba(11,143,131,.18) !important;
  background:rgba(255,255,255,.86) !important;
  box-shadow:0 8px 20px rgba(11,53,80,.06) !important;
}

.heru-health-panel:before{
  left:18% !important;
  top:20% !important;
  transform:rotate(12deg) !important;
}

.heru-health-panel:after{
  right:17% !important;
  bottom:18% !important;
  transform:rotate(-10deg) !important;
}

.heru-health-cross{
  position:relative !important;
  z-index:2 !important;
}

/* Footer */
.pkp_structure_footer_wrapper{
  background:linear-gradient(115deg,#07354a 0%,#075a61 58%,#08766e 100%) !important;
  border-top:4px solid #14b8a6 !important;
}

.pkp_structure_footer{
  max-width:1240px !important;
  margin:0 auto !important;
  padding:0 !important;
  color:#fff !important;
}

.heru-footer{
  display:grid;
  grid-template-columns:1.15fr 1fr 1fr 1.05fr;
  gap:28px;
  padding:34px 38px 26px;
}

.heru-footer h3{
  margin:0 0 12px !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:850 !important;
  letter-spacing:.35px;
  text-transform:uppercase;
}

.heru-footer p,
.heru-footer li{
  margin:0 0 5px;
  color:rgba(255,255,255,.86) !important;
  font-size:11px;
  line-height:1.55;
}

.heru-footer ul{
  margin:0;
  padding:0;
  list-style:none;
}

.heru-footer a{
  color:#baf6ec !important;
  text-decoration:none !important;
}

.heru-footer a:hover{
  color:#fff !important;
}

.heru-footer__brand{
  font-size:20px;
  font-weight:900;
  letter-spacing:.6px;
}

.heru-footer__tagline{
  display:block;
  margin-top:5px;
  color:#9fe7dc !important;
  font-size:11px;
  font-style:italic;
}

.heru-footer__bottom{
  grid-column:1/-1;
  margin-top:8px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.14);
  text-align:center;
  color:rgba(255,255,255,.72);
  font-size:10px;
}

.pkp_brand_footer{
  padding:10px 38px 16px !important;
  opacity:.7 !important;
}

.pkp_brand_footer img{
  max-height:42px !important;
}

@media (max-width:900px){
  .heru-footer{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:560px){
  .heru-footer{
    grid-template-columns:1fr;
    padding:28px 22px 20px;
  }
  .heru-footer__bottom{
    grid-column:1;
  }
}

/* =========================================================
   HERU JOURNAL MENU V2
   ========================================================= */

.heru-journal-menu-v2{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.heru-journal-menu-v2 a{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:14px;
  background:#ffffff;
  border:1px solid #e2efed;
  text-decoration:none !important;
  color:#173042 !important;
  box-shadow:0 6px 16px rgba(11,53,80,.05);
  transition:all .2s ease;
  position:relative;
  overflow:hidden;
}

.heru-journal-menu-v2 a::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#0b8f83,#14b8a6);
  opacity:0;
  transition:opacity .2s ease;
}

.heru-journal-menu-v2 a:hover{
  transform:translateX(4px);
  border-color:#9edcd4;
  box-shadow:0 10px 20px rgba(11,53,80,.10);
  background:linear-gradient(90deg,#f9fffe 0%,#f1fcfa 100%);
  color:#0b3550 !important;
}

.heru-journal-menu-v2 a:hover::before{
  opacity:1;
}

.heru-journal-menu-v2 a:visited{
  color:#173042 !important;
}

.heru-journal-menu-v2 .jm-icon{
  flex:0 0 36px;
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:linear-gradient(145deg,#0b8f83,#18b7aa);
  color:#fff;
  font-size:11px;
  font-weight:800;
  box-shadow:0 6px 14px rgba(11,143,131,.18);
}

.heru-journal-menu-v2 .jm-text{
  flex:1;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
  color:#173042;
}

.heru-journal-menu-v2 .jm-arrow{
  flex:0 0 auto;
  color:#0b8f83;
  font-size:24px;
  font-weight:700;
  line-height:1;
  transition:transform .2s ease;
}

.heru-journal-menu-v2 a:hover .jm-arrow{
  transform:translateX(3px);
}

.pkp_block:has(.heru-journal-menu-v2) .content{
  padding:14px !important;
}

.pkp_block:has(.heru-journal-menu-v2){
  border-radius:18px !important;
  overflow:hidden;
}

.pkp_block:has(.heru-journal-menu-v2) .title{
  padding:16px 18px !important;
  font-size:15px !important;
  letter-spacing:.6px !important;
  background:linear-gradient(90deg,#08766e,#0ba48f) !important;
}

.pkp_block:has(.heru-journal-menu-v2) .title:after{
  width:52px !important;
  height:4px !important;
  margin-top:8px !important;
  background:#baf6ec !important;
  border-radius:99px !important;
}