@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Baskerville:wght@400;700&display=swap');

/* ==========================================================================
   IJILR — site-wide chrome, matched to the locked homepage design.
   Loaded by OJS as the journal stylesheet (STYLE_SEQUENCE_LATE).
   Palette and type come from IJILR_homepage_FINAL_LOCKED.html:
   navy #12385f · gold #b88922 · Libre Baskerville + DM Sans.
   The homepage design's own rules are scoped under .ijhome and appended below.
   ========================================================================== */

:root{
  --nv:#12385f; --nv-d:#0b2947; --nv-l:#1d507f; --nv-xl:#2c6aa8;
  --gd:#b88922; --gd-l:#d8b65a; --gd-d:#8f6a15; --gd-pale:#faf6ea;
  --ink:#172536; --ink-2:#4a5a6a; --ink-3:#77879a;
  --line:#dbe3ea; --line-2:#c3d0dc;
  --bg:#ffffff; --bg-2:#f0f3f8; --bg-3:#e4eaf2;
  --radius:6px; --radius-lg:8px;
  --serif:"Libre Baskerville",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  --shadow:0 2px 14px rgba(18,56,95,.05);
  --shadow-lg:0 14px 32px rgba(18,56,95,.12);
}

/* ------------------------------------------------------------------ base - */
body{color:var(--ink);background:var(--bg);font-family:var(--sans);
     line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--serif);color:var(--nv);line-height:1.2;font-weight:700}
a{color:var(--nv-l);text-underline-offset:2px}
a:hover,a:focus{color:var(--gd-d)}
html,body{overflow-x:hidden;max-width:100%}

/* ---------------------------------------------------------------- header - */
/* the locked design uses a white sticky header, not the navy bar */
.pkp_structure_head{background:#fff;border-bottom:1px solid var(--line);
     box-shadow:var(--shadow);position:sticky;top:0;z-index:50}
.pkp_head_wrapper{padding-left:28px;padding-right:28px;max-width:1180px;margin:0 auto}
.pkp_site_name_wrapper{padding:.9rem 0}
.pkp_site_name .is_text,.pkp_site_name a{font-family:var(--serif);color:var(--nv);
     font-weight:700;font-size:1.35rem;letter-spacing:-.01em}
.pkp_site_name .is_img img{max-height:52px;width:auto}

/* primary navigation — white bar, navy links, gold underline on hover */
.pkp_navigation_primary_row,.pkp_navigation_primary_wrapper{background:#fff}
.pkp_navigation_primary_wrapper{max-width:1180px;margin:0 auto;
     padding-left:28px;padding-right:28px}
.pkp_navigation_primary>li>a{color:var(--nv);font-family:var(--sans);
     font-weight:700;font-size:.78rem;letter-spacing:.02em;text-transform:uppercase;
     padding:1rem .8rem;position:relative;border:0;transition:color .2s ease}
.pkp_navigation_primary>li>a::after{content:"";position:absolute;left:.8rem;
     right:.8rem;bottom:.55rem;height:2px;background:var(--gd);
     transform:scaleX(0);transition:transform .2s ease}
.pkp_navigation_primary>li>a:hover,
.pkp_navigation_primary>li>a:focus{color:var(--gd);background:transparent}
.pkp_navigation_primary>li>a:hover::after,
.pkp_navigation_primary>li>a:focus::after,
.pkp_navigation_primary>li.in_focus>a::after{transform:scaleX(1)}

/* dropdowns */
.pkp_navigation_primary li ul{background:#fff;border:1px solid var(--line);
     border-top:3px solid var(--gd);box-shadow:var(--shadow-lg);min-width:255px;
     border-radius:0 0 var(--radius) var(--radius);padding:.3rem 0}
.pkp_navigation_primary li ul li a{color:var(--ink);padding:.6rem 1.1rem;
     font-weight:500;font-size:.85rem;text-transform:none;letter-spacing:0;
     display:block;border-left:3px solid transparent}
.pkp_navigation_primary li ul li a::after{display:none}
.pkp_navigation_primary li ul li a:hover,
.pkp_navigation_primary li ul li a:focus{background:var(--gd-pale);
     color:var(--nv);border-left-color:var(--gd)}
.pkp_navigation_user>li>a{color:var(--ink-2);font-size:.8rem}
.pkp_navigation_user>li>a:hover{color:var(--gd)}

/* ------------------------------------------------------- homepage layout - */
/* the designed landing page replaces the default OJS index layout */
body.pkp_page_index .pkp_structure_sidebar{display:none!important}
body.pkp_page_index .pkp_structure_content.has_sidebar,
body.pkp_page_index .pkp_structure_content{width:100%!important;max-width:100%!important;
     padding-left:0!important;padding-right:0!important;float:none!important}
body.pkp_page_index .pkp_structure_main{width:100%!important;max-width:100%!important;
     padding:0!important;float:none!important;border:0}
/* the designed Current Issue + Recently Published sections carry these links
   already, with far better presentation than the raw table of contents */
body.pkp_page_index .page_index_journal>section.current_issue{display:none!important}
body.pkp_page_index .additional_content{padding:0!important;margin:0!important}
/* full-bleed: the design paints its own section backgrounds edge to edge */
.additional_content .ijhome{width:100vw;position:relative;left:50%;right:50%;
     margin-left:-50vw;margin-right:-50vw}

/* --------------------------------------------------------- inner content - */
.pkp_structure_main{background:var(--bg)}
body:not(.pkp_page_index) .pkp_structure_main{padding-top:1.5rem}
body:not(.pkp_page_index) .pkp_structure_sidebar{padding-top:1.5rem}
.page h1,.page h2,.pkp_page_index h2{color:var(--nv)}

.ijilr-page{font-size:1rem;line-height:1.72;color:var(--ink);max-width:74ch}
.ijilr-page .lead{font-size:1.08rem;line-height:1.65;color:var(--ink-2);
     border-left:4px solid var(--gd);padding:.15rem 0 .15rem 1.1rem;margin:0 0 1.8rem}
.ijilr-page h2{font-size:1.35rem;margin:2.2rem 0 .8rem;padding-bottom:.4rem;
     border-bottom:2px solid var(--gd-l)}
.ijilr-page h3{font-size:1.08rem;margin:1.6rem 0 .6rem;color:var(--nv-l)}
.ijilr-page p{margin:0 0 1.05rem}
.ijilr-page ul,.ijilr-page ol{margin:0 0 1.2rem;padding-left:1.4rem}
.ijilr-page li{margin-bottom:.5rem}
.ijilr-page strong{color:var(--nv)}

.ijilr-table{width:100%;border-collapse:collapse;margin:1.2rem 0 1.8rem;
     font-size:.94rem;box-shadow:var(--shadow);border-radius:var(--radius);
     overflow:hidden;display:table}
.ijilr-table th{background:var(--nv);color:#fff;text-align:left;padding:.7rem .9rem;
     font-family:var(--sans);font-weight:700;font-size:.78rem;letter-spacing:.05em;
     text-transform:uppercase}
.ijilr-table td{padding:.7rem .9rem;border-bottom:1px solid var(--line);vertical-align:top}
.ijilr-table tr:nth-child(even) td{background:var(--bg-2)}
.ijilr-table tr:last-child td{border-bottom:none}
.ijilr-table.ijilr-apc td:nth-child(2),.ijilr-table.ijilr-apc td:nth-child(3){
     font-variant-numeric:tabular-nums;white-space:nowrap}

.ijilr-steps{list-style:none;padding-left:0;counter-reset:s}
.ijilr-steps>li{counter-increment:s;position:relative;padding-left:2.6rem;margin-bottom:.85rem}
.ijilr-steps>li::before{content:counter(s);position:absolute;left:0;top:.05rem;
     width:1.8rem;height:1.8rem;border-radius:50%;background:var(--nv);color:#fff;
     font-family:var(--sans);font-weight:700;font-size:.8rem;display:flex;
     align-items:center;justify-content:center}

.ijilr-callout{background:linear-gradient(135deg,var(--gd-pale),#fff);
     border:1px solid var(--gd-l);border-left:5px solid var(--gd);
     border-radius:var(--radius);padding:1.3rem 1.5rem;margin:0 0 1.8rem;box-shadow:var(--shadow)}
.ijilr-note{background:var(--bg-2);border-left:3px solid var(--nv-xl);
     padding:.8rem 1.1rem;border-radius:0 var(--radius) var(--radius) 0;
     font-size:.92rem;color:var(--ink-2);margin:1.5rem 0 0}

.ijilr-btn{display:inline-block;background:var(--gd);color:#fff!important;
     padding:.7rem 1.35rem;border-radius:5px;font-weight:600;font-size:.88rem;
     text-decoration:none!important;border:1.5px solid var(--gd);
     margin:.25rem .4rem .25rem 0;transition:.25s ease}
.ijilr-btn:hover,.ijilr-btn:focus{background:var(--nv);border-color:var(--nv);
     color:#fff!important;transform:translateY(-1px)}
.ijilr-btn-alt{background:transparent;color:var(--nv)!important;border-color:var(--nv)}
.ijilr-btn-alt:hover,.ijilr-btn-alt:focus{background:var(--nv);color:#fff!important}

.ijilr-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
     gap:1.2rem;margin:1.5rem 0 2rem}
.ijilr-card{background:var(--bg-2);border:1px solid var(--line);
     border-top:3px solid var(--gd);border-radius:var(--radius);padding:1.3rem;
     transition:box-shadow .2s ease,transform .2s ease}
.ijilr-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px)}
.ijilr-card h3{margin-top:0}
.ijilr-cols{columns:2;column-gap:2rem}
@media(max-width:640px){.ijilr-cols{columns:1}}

/* ----------------------------------------------------------------- forms - */
.ijilr-form{background:var(--bg-2);border:1px solid var(--line);
     border-radius:var(--radius-lg);padding:1.6rem;margin:1.2rem 0 2rem}
.ijilr-field{margin-bottom:1.1rem}
.ijilr-field label{display:block;font-weight:600;font-size:.88rem;color:var(--nv);
     margin-bottom:.35rem}
.ijilr-form input[type=text],.ijilr-form input[type=email],
.ijilr-form select,.ijilr-form textarea{width:100%;padding:.6rem .8rem;
     border:1px solid var(--line-2);border-radius:5px;font-size:.95rem;
     font-family:inherit;background:#fff;color:var(--ink);transition:.16s ease}
.ijilr-form input:focus,.ijilr-form select:focus,.ijilr-form textarea:focus{
     outline:none;border-color:var(--nv-l);box-shadow:0 0 0 3px rgba(29,80,127,.13)}
.ijilr-form textarea{resize:vertical;min-height:6rem}
.ijilr-check{margin-bottom:.85rem;font-size:.9rem;line-height:1.5}
.ijilr-check label{display:flex;gap:.6rem;align-items:flex-start;font-weight:400;
     color:var(--ink-2)}
.ijilr-check input{margin-top:.25rem;flex-shrink:0}
.ijilr-hp{position:absolute!important;left:-9999px!important;width:1px!important;
     height:1px!important;overflow:hidden!important}

/* --------------------------------------------------------- sidebar block - */
.pkp_block{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gd);
     border-radius:var(--radius);padding:1.1rem 1.2rem;margin-bottom:1.4rem;
     box-shadow:var(--shadow)}
.pkp_block .title{font-family:var(--serif);color:var(--nv);font-size:1.02rem;
     font-weight:700;margin:0 0 .8rem;padding-bottom:.5rem;border-bottom:2px solid var(--gd-l)}
.ijilr-metrics .m{display:flex;gap:.7rem;align-items:flex-start;padding:.6rem 0;
     border-bottom:1px solid var(--line)}
.ijilr-metrics .m:last-child{border-bottom:none}
.ijilr-metrics .ic{flex:0 0 1.35rem;color:var(--gd);font-size:1rem;text-align:center}
.ijilr-metrics .k{flex:0 0 44%;font-weight:700;color:var(--nv);font-size:.8rem;line-height:1.4}
.ijilr-metrics .v{flex:1;color:var(--ink-2);font-size:.8rem;line-height:1.45}
.ijilr-metrics .v strong{color:var(--nv);white-space:nowrap}
.ijilr-metrics .cta{margin-top:.9rem;text-align:center}
.ijilr-metrics .cta a{display:block;background:var(--gd);color:#fff;padding:.6rem;
     border-radius:5px;font-weight:600;font-size:.84rem;text-decoration:none;transition:.25s}
.ijilr-metrics .cta a:hover{background:var(--nv)}

/* ----------------------------------------------------------------- footer */
.pkp_structure_footer_wrapper,.pkp_structure_footer{background:var(--nv-d);
     color:#ffffffc0;border-top:3px solid var(--gd)}
.ijilr-footer{max-width:1180px;margin:0 auto;padding:2.6rem 28px .8rem;
     font-family:var(--sans);font-size:.86rem;line-height:1.7;color:#ffffffc0}
.ijilr-footer a{color:#ffffffc0;text-decoration:none;transition:.15s}
.ijilr-footer a:hover,.ijilr-footer a:focus{color:#fff;padding-left:3px}
.ijilr-fhead{text-align:center;padding-bottom:1.5rem;margin-bottom:1.8rem;
     border-bottom:1px solid #ffffff17}
.ijilr-fhead .t{font-family:var(--serif);font-size:1.35rem;color:#fff;font-weight:700;
     margin:0 0 .35rem}
.ijilr-fhead .s{font-size:.8rem;color:#ffffff8f}
.ijilr-fchips{margin-top:.9rem;display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}
.ijilr-fchips span{background:rgba(184,137,34,.16);border:1px solid rgba(216,182,90,.4);
     color:var(--gd-l);padding:.22rem .7rem;border-radius:999px;font-size:.72rem;font-weight:600}
.ijilr-fcols{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:1.8rem 2rem;
     margin-bottom:2rem}
@media(max-width:820px){.ijilr-fcols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.ijilr-fcols{grid-template-columns:1fr}}
.ijilr-fcol h4{font-family:var(--sans);color:var(--gd-l);font-size:.72rem;
     letter-spacing:.1em;text-transform:uppercase;margin:0 0 .9rem;font-weight:700}
.ijilr-fcol ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.ijilr-fcol .cur{color:var(--gd-l);font-size:.7rem;font-weight:700;margin-left:.3rem}
.ijilr-fcta{display:inline-block!important;background:var(--gd);color:#fff!important;
     padding:.55rem 1.05rem;border-radius:5px;font-weight:700;font-size:.8rem;margin-top:.7rem}
.ijilr-fcta:hover{background:#a67816;padding-left:1.05rem!important}
.ijilr-flegal{border-top:1px solid #ffffff17;padding-top:1.2rem;display:flex;
     flex-wrap:wrap;gap:.5rem 1.4rem;justify-content:center;font-size:.8rem}
.ijilr-fbot{text-align:center;font-size:.76rem;color:#ffffff8f;padding:1rem 0 1.4rem}
.ijilr-fbot .cc{color:var(--gd-l)}

/* ------------------------------------------------------------ article page */
.obj_article_details .page_title{font-family:var(--serif);color:var(--nv)}
.obj_article_details .authors{color:var(--ink-2)}
.obj_article_details .item.abstract h2,.obj_article_details .main_entry h2{
     color:var(--nv);border-bottom:2px solid var(--gd-l);padding-bottom:.35rem}
.obj_article_details .galleys_links a.obj_galley_link{background:var(--gd);color:#fff;
     border-radius:5px;border:1.5px solid var(--gd);font-weight:600;transition:.25s}
.obj_article_details .galleys_links a.obj_galley_link:hover{background:var(--nv);
     border-color:var(--nv);color:#fff}
.obj_article_summary>.title a{color:var(--nv);font-family:var(--serif);font-weight:700}
.obj_article_summary>.title a:hover{color:var(--gd)}
.obj_article_summary .authors{color:var(--ink-3);font-size:.87rem}
.obj_issue_summary .title,.obj_issue_toc .title{font-family:var(--serif);color:var(--nv)}
.cmp_breadcrumbs{font-size:.84rem;color:var(--ink-3)}
.cmp_breadcrumbs a{color:var(--nv-l)}

/* ------------------------------------------------------------------ misc - */
:focus-visible{outline:3px solid var(--gd-l);outline-offset:3px;border-radius:4px}
@media(max-width:767px){
  .pkp_navigation_primary>li>a{padding:.7rem .6rem;font-size:.72rem}
  .pkp_site_name .is_img img{max-height:42px}
  .ijilr-page h2{font-size:1.2rem}
  .ijilr-table{font-size:.85rem;display:block;overflow-x:auto;white-space:nowrap}
}
@media print{
  .pkp_structure_head,.pkp_structure_footer_wrapper,.pkp_structure_sidebar,
  .ijilr-form{display:none!important}
  body{color:#000}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
}

/* ==========================================================================
   The locked homepage design, scoped under .ijhome — appended below.
   ========================================================================== */

.ijhome{--navy:#12385f;--navy2:#1d507f;--gold:#b88922;--gold2:#d8b65a;--ink:#172536;--muted:#4a5a6a;--line:#dbe3ea;--bg:#f0f3f8;--white:#fff;--green:#4e775f}
.ijhome *{box-sizing:border-box}
.ijhome{scroll-behavior:smooth}
.ijhome{margin:0;color:var(--ink);font-family:"DM Sans",Arial,sans-serif;line-height:1.55;background:#fff}
.ijhome a{text-decoration:none;color:inherit;cursor:pointer}
.ijhome .wrap{max-width:1180px;margin:auto;padding:0 28px}
.ijhome .hero{background:linear-gradient(112deg,var(--navy),var(--navy2));color:#fff;position:relative;overflow:hidden}
.ijhome .hero:after{content:"IJILR";position:absolute;right:-30px;bottom:-70px;font:700 240px/.8 "Libre Baskerville";color:rgba(255,255,255,.035);pointer-events:none}
.ijhome .hero-in{min-height:500px;display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center;position:relative;z-index:1}
.ijhome .eyebrow{font-size:8px;letter-spacing:1.7px;text-transform:uppercase;font-weight:800;color:var(--gold)}
.ijhome .hero h1{font:400 55px/1.07 "Libre Baskerville";margin:14px 0 20px;max-width:760px}
.ijhome .hero p{font-size:15px;color:#fffC;max-width:690px}
.ijhome .buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}
.ijhome .btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 20px;border-radius:5px;font-size:14px;font-weight:600;letter-spacing:.05px;transition:all .28s ease}
.ijhome .btn.gold{background:var(--gold);color:#fff;letter-spacing:.05px;box-shadow:0 5px 14px rgba(184,137,34,.28)}
.ijhome .btn.gold:hover{background:#a67816;color:#fff;transform:translateY(-2px);box-shadow:0 9px 22px rgba(184,137,34,.34)}
.ijhome .btn.outline{border:1px solid #ffffff55;color:#fff}
.ijhome .btn.outline:hover{border-color:#fff;background:#fff;color:var(--navy);transform:translateY(-2px)}
.ijhome .hero-side{border-left:1px solid #ffffff2e;padding-left:34px}
.ijhome .hero-side h2{font:400 30px/1.2 "Libre Baskerville";margin:8px 0 13px}
.ijhome .hero-side p{font-size:14px;color:#ffffffa8}
.ijhome .hero-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}
.ijhome .hero-meta span{font-size:10px;font-weight:800;color:#ffffffb8;padding:7px 9px;border:1px solid #ffffff22;border-radius:3px}
.ijhome .hero-meta span:hover{border-color:var(--gold2);color:#fff}
.ijhome .quick{border-bottom:1px solid var(--line);background:#fff}
.ijhome .quick-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.ijhome .quick-item{padding:19px 14px;border-right:1px solid var(--line);transition:background .2s}
.ijhome .quick-item:last-child{border:0}
.ijhome .quick-item:hover{background:#f8fafc}
.ijhome .quick-item small{display:block;color:var(--gold);font-size:7px;font-weight:800;letter-spacing:1px;text-transform:uppercase}
.ijhome .quick-item strong{display:block;font:700 17px "Libre Baskerville";margin-top:3px;color:var(--navy)}
.ijhome .section{padding:74px 0}
.ijhome .soft{background:var(--bg)}
.ijhome .white{background:#fff}
.ijhome .section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:28px}
.ijhome .section h2{font:400 36px/1.16 "Libre Baskerville";margin:6px 0}
.ijhome .intro{font-size:14px;color:var(--muted);max-width:720px}
.ijhome .rule{height:3px;width:42px;background:var(--gold);margin:15px 0 0}
.ijhome .feature{display:grid;grid-template-columns:1.55fr 1fr 1fr;gap:14px}
.ijhome .feature-card{background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;position:relative;transition:all .25s}
.ijhome .feature-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px rgba(18,56,95,.12);border-color:#c9a63f}
.ijhome .feature-card:first-child{background:var(--navy);color:#fff}
.ijhome .feature-top{height:8px;background:var(--gold)}
.ijhome .feature-body{padding:23px}
.ijhome .feature-card .type{font-size:7px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--gold)}
.ijhome .feature-card:first-child .type{color:var(--gold2)}
.ijhome .feature-card h3{font:700 21px/1.3 "Libre Baskerville";margin:9px 0 13px}
.ijhome .feature-card p{font-size:14px;color:var(--muted)}
.ijhome .feature-card:first-child p{color:#ffffffb8}
.ijhome .feature-card .article-meta{font-size:8px;color:var(--navy);font-weight:700}
.ijhome .feature-card:first-child .article-meta{color:#fff}
.ijhome .readlink{display:inline-block;margin-top:15px;font-size:8px;font-weight:800;color:var(--navy)}
.ijhome .feature-card:first-child .readlink{color:var(--gold2)}
.ijhome .readlink:hover{text-decoration:underline}
.ijhome .authors{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ijhome .author{background:#fff;border:1px solid var(--line);border-radius:7px;padding:20px;transition:all .28s ease}
.ijhome .author:hover{border-color:var(--gold2);transform:translateY(-3px);box-shadow:0 10px 25px rgba(18,56,95,.08)}
.ijhome .avatar{width:48px;height:48px;border-radius:50%;background:#eef3f7;border:1px solid #d4dfe8;display:grid;place-items:center;color:var(--navy);font:700 18px "Libre Baskerville"}
.ijhome .author strong{display:block;margin-top:13px;font-size:11px}
.ijhome .author small{display:block;font-size:12px;color:var(--muted);margin-top:2px}
.ijhome .issue{display:grid;grid-template-columns:.55fr 1.45fr;gap:18px}
.ijhome .cover{min-height:375px;border-radius:7px;background:linear-gradient(145deg,#0c3154,#1f5c8f);padding:29px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 15px 35px rgba(18,56,95,.12)}
.ijhome .cover h3{font:400 42px/1.05 "Libre Baskerville";margin:13px 0}
.ijhome .cover small{color:#ffffffb0}
.ijhome .contents{background:#fff;border:1px solid var(--line);border-radius:7px;padding:24px}
.ijhome .contents h3{font:700 25px "Libre Baskerville";margin:5px 0 16px}
.ijhome .toc{padding:14px 0;border-top:1px solid var(--line);transition:padding .2s}
.ijhome .toc:hover{padding-left:7px;background:#fbfcfd}
.ijhome .toc b{font:700 16px/1.3 "Libre Baskerville";display:block}
.ijhome .toc span{font-size:13px;color:var(--muted);display:block}
.ijhome .toc .doi{color:var(--gold);font-weight:700;margin-top:3px}
.ijhome .article-layout{display:grid;grid-template-columns:1fr 285px;gap:22px}
.ijhome .articles{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.ijhome .article{background:#fff;border:1px solid var(--line);border-radius:7px;padding:20px;transition:all .22s}
.ijhome .article:hover{transform:translateY(-4px);border-color:#c9a63f;box-shadow:0 14px 30px rgba(18,56,95,.1)}
.ijhome .article .type{font-size:7px;color:var(--gold);font-weight:800;text-transform:uppercase;letter-spacing:1px}
.ijhome .article h3{font:700 19px/1.3 "Libre Baskerville";margin:8px 0}
.ijhome .article p{font-size:14px;color:var(--muted)}
.ijhome .article .meta{font-size:8px;color:var(--navy);font-weight:700}
.ijhome .article .read{font-size:8px;font-weight:800;color:var(--navy)}
.ijhome .article .read:hover{color:var(--gold)}
.ijhome .sidebar{background:#fff;border:1px solid var(--line);border-radius:7px;overflow:hidden;height:max-content;position:sticky;top:112px}
.ijhome .side-head{padding:14px 17px;background:var(--navy);border-left:4px solid var(--gold2);color:#fff;font:700 19px "Libre Baskerville"}
.ijhome .side-row{padding:13px 17px;border-bottom:1px solid var(--line);transition:background .2s}
.ijhome .side-row:hover{background:#f7f9fb}
.ijhome .side-row small{font-size:7px;color:var(--gold);font-weight:800;text-transform:uppercase}
.ijhome .side-row strong{display:block;font:700 15px "Libre Baskerville";margin-top:2px}
.ijhome .side-row span{font-size:14px;color:var(--muted)}
.ijhome .side-link{display:block;margin:14px;background:var(--gold);color:#fff;padding:10px;text-align:center;font-size:8px;font-weight:800;border-radius:4px;transition:all .28s ease}
.ijhome .side-link:hover{background:var(--navy)}
.ijhome .metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.ijhome .metric{background:#fff;border:1px solid var(--line);border-radius:7px;padding:20px;transition:all .28s ease}
.ijhome .metric:hover{border-color:var(--gold2);transform:translateY(-3px)}
.ijhome .metric small{display:block;color:var(--gold);font-size:7px;text-transform:uppercase;font-weight:800}
.ijhome .metric strong{display:block;color:var(--navy);font:700 27px "Libre Baskerville";margin-top:5px}
.ijhome .areas{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ijhome .area{background:#fff;border:1px solid var(--line);border-radius:7px;padding:19px;min-height:115px;position:relative;overflow:hidden;transition:all .3s ease}
.ijhome .area:before{content:"";position:absolute;left:0;top:0;width:4px;height:100%;background:var(--gold);transform:scaleY(0);transform-origin:top;transition:all .3s ease}
.ijhome .area:hover{transform:translateY(-4px);border-color:#c9a63f;box-shadow:0 13px 30px rgba(18,56,95,.1)}
.ijhome .area:hover:before{transform:scaleY(1)}
.ijhome .area small{color:var(--gold);font-size:7px;font-weight:800}
.ijhome .area strong{display:block;font:700 17px/1.3 "Libre Baskerville";color:var(--navy);margin-top:8px}
.ijhome .area span{display:block;color:var(--muted);font-size:8px;margin-top:4px}
.ijhome .process{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.ijhome .step{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gold);padding:17px;border-radius:5px;transition:all .28s ease}
.ijhome .step:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(18,56,95,.1)}
.ijhome .step b{font-size:8px;color:var(--gold)}
.ijhome .step h3{font:700 19px "Libre Baskerville";margin:7px 0}
.ijhome .step p{font-size:14px;color:var(--muted)}
.ijhome .benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}
.ijhome .benefit{background:#fff;border:1px solid var(--line);border-radius:7px;padding:21px;min-height:145px;transition:all .28s ease}
.ijhome .benefit:hover{border-color:var(--gold2);transform:translateY(-3px)}
.ijhome .benefit .num{font-size:8px;color:var(--gold);font-weight:800}
.ijhome .benefit h3{font:700 20px "Libre Baskerville";margin:6px 0}
.ijhome .benefit p{font-size:14px;color:var(--muted)}
.ijhome .fee{display:grid;grid-template-columns:1fr .7fr;gap:35px;align-items:center}
.ijhome .fee-card{background:var(--navy);color:#fff;border-radius:8px;padding:28px;position:relative;overflow:hidden}
.ijhome .fee-card:after{content:"APC";position:absolute;right:-10px;bottom:-20px;font:700 110px "Libre Baskerville";color:#ffffff08}
.ijhome .fee-card h3{font:700 29px "Libre Baskerville";margin:6px 0 10px}
.ijhome .fee-card p{font-size:14px;color:#ffffffc0}
.ijhome .index{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ijhome .index-card{background:#fff;border:1px solid var(--line);border-radius:7px;padding:22px;transition:all .28s ease}
.ijhome .index-card:hover{border-color:var(--gold2);transform:translateY(-3px)}
.ijhome .index-card strong{display:block;color:var(--navy);font:700 23px "Libre Baskerville"}
.ijhome .index-card span{display:block;color:var(--muted);font-size:8px;margin-top:4px}
.ijhome .faqs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ijhome .faq{background:#fff;border:1px solid var(--line);border-radius:6px;padding:15px 18px;transition:all .28s ease}
.ijhome .faq:hover{border-color:var(--gold2)}
.ijhome .faq summary{font:700 16px "Libre Baskerville";cursor:pointer}
.ijhome .faq p{font-size:14px;color:var(--muted)}
.ijhome .final{background:var(--navy);color:#fff;padding:54px 0}
.ijhome .final-in{display:flex;align-items:center;justify-content:space-between;gap:25px}
.ijhome .final h2{font:700 35px "Libre Baskerville";margin:5px 0}
.ijhome .final p{font-size:10px;color:#ffffffc0}
@media(max-width:950px){.ijhome .hero-in,.ijhome .issue,.ijhome .article-layout,.ijhome .fee{grid-template-columns:1fr}.ijhome .feature{grid-template-columns:1fr 1fr}.ijhome .authors,.ijhome .areas{grid-template-columns:1fr 1fr}.ijhome .metrics{grid-template-columns:repeat(2,1fr)}.ijhome .process{grid-template-columns:repeat(3,1fr)}.ijhome .sidebar{position:static}}
@media(max-width:600px){.ijhome .wrap{padding:0 17px}.ijhome .quick-grid,.ijhome .feature,.ijhome .authors,.ijhome .areas,.ijhome .metrics,.ijhome .benefits,.ijhome .faqs{grid-template-columns:1fr}.ijhome .articles{grid-template-columns:1fr}.ijhome .process{grid-template-columns:1fr 1fr}.ijhome .hero h1{font-size:41px}.ijhome .section{padding:54px 0}.ijhome .section-head,.ijhome .final-in{align-items:flex-start;flex-direction:column}.ijhome .hero-in{min-height:auto;padding-top:60px;padding-bottom:60px}}
.ijhome /* Active navigation state + accessibility focus */
.nav>a:not(.cta).active{color:var(--navy)}
.ijhome .btn:focus-visible,.ijhome .feature-card a:focus-visible,.ijhome .article a:focus-visible,.ijhome .side-link:focus-visible,.ijhome .footer a:focus-visible,.ijhome .faq summary:focus-visible{outline:3px solid var(--gold2);
  outline-offset:3px;
  border-radius:4px;}
@media (prefers-reduced-motion: reduce){.ijhome *,.ijhome *::before,.ijhome *::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(max-width:600px){.ijhome .btn.gold{color:#fff;background:#a87916;text-shadow:0 1px 1px rgba(0,0,0,.18)}}
.ijhome /* IJILR FINAL LOCKED HOMEPAGE */
.btn{font-size:12px;font-weight:600}
.ijhome .btn.gold{color:#fff}
.ijhome .btn:focus-visible,.ijhome .faq summary:focus-visible{outline:3px solid var(--gold2);
  outline-offset:3px;}
@media(max-width:600px){.ijhome .btn{font-size:14px;min-height:46px;padding:0 18px}}

/* ==========================================================================
   IJILR — refinements on top of the locked design.
   Appended last, so these win over the scoped .ijhome rules.
   1. Hero right panel becomes a journal cover with the IJILR seal.
   2. Featured Research cards change background on hover.
   ========================================================================== */

/* ----------------------------------------------- 1. hero cover visual ---- */
/* A scholarly journal, not a product launch: the cover sits square and still.
   It is integrated by LIGHT and SHADOW alone — no tilt, no motion. */

.ijhome .hero{overflow:hidden}
.ijhome .hero:after{display:none}          /* drop the IJILR watermark — it collided */

.ijhome .hero-in{grid-template-columns:1.08fr .92fr;gap:clamp(28px,4vw,56px);
  align-items:center}

/* headline: open leading, as in the reference */
.ijhome .hero h1{
  font-family:"Libre Baskerville",Georgia,serif;font-weight:400;
  font-size:clamp(33px,4.3vw,54px);
  line-height:1.26;
  letter-spacing:-.004em;
  margin:16px 0 26px;
  max-width:14ch}
.ijhome .hero p{margin-bottom:6px;line-height:1.75}
.ijhome .buttons{margin-top:28px}
.ijhome .hero-meta{margin-top:28px}

.ijhome .hero-side{border-left:0;padding-left:0;display:block;position:relative}

/* the stage carries the light: a warm pool behind the object, so the cover
   sits *in* the navy rather than on top of it */
.ijhome .ij-cover-stage{position:relative;display:flex;justify-content:center;
  align-items:center;padding:clamp(18px,3vw,40px) 0}
.ijhome .ij-cover-stage::before{
  content:"";position:absolute;left:50%;top:50%;width:130%;aspect-ratio:1/1;
  transform:translate(-50%,-50%);pointer-events:none;z-index:0;
  background:radial-gradient(circle,
    rgba(216,182,90,.28) 0%,
    rgba(216,182,90,.12) 34%,
    rgba(184,137,34,.045) 56%,
    transparent 72%)}
/* a soft contact shadow beneath grounds it on the field */
.ijhome .ij-cover-stage::after{
  content:"";position:absolute;left:50%;bottom:7%;width:70%;height:30px;
  transform:translateX(-50%);pointer-events:none;z-index:0;border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(4,12,26,.55),transparent 72%);
  filter:blur(12px)}

.ijhome .ij-cover-img{
  position:relative;z-index:1;width:100%;max-width:340px;height:auto;display:block;
  border-radius:8px;border:0;
  box-shadow:
    0 26px 56px rgba(3,10,22,.5),
    0 8px 18px rgba(3,10,22,.34),
    0 0 0 1px rgba(216,182,90,.3)}

@media(max-width:950px){
  .ijhome .hero-in{grid-template-columns:1fr}
  .ijhome .hero h1{max-width:none}
  .ijhome .ij-cover-img{max-width:262px}
  .ijhome .ij-cover-stage::before{width:116%}
}
@media(max-width:600px){
  .ijhome .ij-cover-img{max-width:208px}
}

/* ------------------------------------- 2. featured cards: hover fill ----- */
/* white cards invert to navy; the already-navy lead card lifts to a
   lighter navy so every card responds to the pointer. */
.ijhome .feature-card{transition:background .28s ease,color .28s ease,
  transform .25s ease,box-shadow .25s ease,border-color .25s ease}

.ijhome .feature-card:hover{
  background:var(--navy);border-color:var(--gold);
  box-shadow:0 20px 40px rgba(11,41,71,.28)}
.ijhome .feature-card:hover h3{color:#fff}
.ijhome .feature-card:hover p{color:#ffffffc4}
.ijhome .feature-card:hover .type{color:var(--gold2)}
.ijhome .feature-card:hover .article-meta{color:#ffffffde}
.ijhome .feature-card:hover .readlink{color:var(--gold2)}

/* the lead card starts navy — give it its own hover so it is not inert */
.ijhome .feature-card:first-child:hover{
  background:linear-gradient(150deg,#1d507f,#12385f);border-color:var(--gold2)}
.ijhome .feature-card:first-child:hover .readlink{color:#fff}

/* keyboard parity: focusing the read link fills the card the same way */
.ijhome .feature-card:focus-within{
  background:var(--navy);border-color:var(--gold);transform:translateY(-5px)}
.ijhome .feature-card:focus-within h3{color:#fff}
.ijhome .feature-card:focus-within p{color:#ffffffc4}
.ijhome .feature-card:focus-within .type,
.ijhome .feature-card:focus-within .readlink{color:var(--gold2)}
.ijhome .feature-card:focus-within .article-meta{color:#ffffffde}

/* the gold top rule reads brighter once the card is filled */
.ijhome .feature-card:hover .feature-top,
.ijhome .feature-card:focus-within .feature-top{background:var(--gold2)}

@media (prefers-reduced-motion:reduce){
  .ijhome .feature-card{transition:background .01s linear,color .01s linear}
  .ijhome .feature-card:hover,
  .ijhome .feature-card:focus-within{transform:none}
}

/* ================= 3. corrections found in review ======================== */

/* (a) HEADING COLOUR — the site-wide `h1,h2,h3,h4{color:var(--nv)}` in the
   chrome block is a bare element selector, so it beat the design's inherited
   white and painted the hero headline navy-on-navy. Restoring inheritance
   fixes the hero and every other dark panel (issue cover, sidebar head,
   fee card, final CTA, lead feature card) in one rule. */
.ijhome h1,.ijhome h2,.ijhome h3,.ijhome h4{color:inherit}
.ijhome .hero h1{color:#fff}

/* (b) HERO HEADLINE — explicit breaks give the three lines asked for.
   They collapse on small screens so the text can wrap naturally. */
.ijhome .hero h1{max-width:none}
@media(max-width:600px){.ijhome .hero h1 br{display:none}}

/* (c) EYEBROW + CHIP ROW — 8px with 1.7px tracking was below a legible size
   and the rows were crowding each other. */
.ijhome .eyebrow{font-size:10px;letter-spacing:1.8px;line-height:1.7;
  display:inline-block}
.ijhome .hero .eyebrow{margin-bottom:4px}
.ijhome .hero-in{padding-top:clamp(34px,5vw,64px);
  padding-bottom:clamp(34px,5vw,64px)}
.ijhome .hero-meta{gap:11px;margin-top:30px;row-gap:11px}
.ijhome .hero-meta span{font-size:10.5px;padding:9px 12px;line-height:1.5;
  letter-spacing:.3px}

/* (d) NAVIGATION — no underline on menu items or dropdown items.
   The top-level gold rule is drawn with ::after, not text-decoration. */
.pkp_navigation_primary a,
.pkp_navigation_primary li ul li a,
.pkp_site_name a{text-decoration:none}
.pkp_navigation_primary a:hover,
.pkp_navigation_primary a:focus,
.pkp_navigation_primary li ul li a:hover,
.pkp_navigation_primary li ul li a:focus{text-decoration:none}

/* ================= 4. header layout + headline line control ============== */

/* (a) HEADLINE — each line is its own non-wrapping block, so the break is
   exactly "International Journal of / Integrated Law / Review" and never
   drops a stray "of". The size is capped so the longest line still fits
   its column; below 600px the lines revert to normal wrapping. */
.ijhome .hero h1{font-size:clamp(27px,3.4vw,44px);line-height:1.28;max-width:none}
.ijhome .hero h1 span{display:block;white-space:nowrap}
@media(max-width:600px){
  .ijhome .hero h1 span{display:inline;white-space:normal}
  .ijhome .hero h1{font-size:29px}
}

/* (b) HEADER — OJS stacks the logo above the navigation in two rows.
   The locked design puts them on one line, so the wrapper becomes a flex
   row: logo left, menu pushed right. Below 900px OJS's own mobile menu
   takes over, so the stacking is left alone there. */
@media(min-width:900px){
  .pkp_head_wrapper{display:flex;align-items:center;gap:1.75rem;flex-wrap:nowrap}
  .pkp_site_name_wrapper{flex:0 0 auto;padding:.55rem 0;margin:0}
  .pkp_site_nav_menu{flex:1 1 auto;min-width:0;display:flex;justify-content:flex-end}
  .pkp_navigation_primary_row{width:100%;background:transparent}
  .pkp_navigation_primary_wrapper{padding:0;margin:0;max-width:none;background:transparent}
  .pkp_navigation_primary{display:flex;flex-wrap:wrap;align-items:center;
    justify-content:flex-end;gap:0}
  .pkp_navigation_primary>li>a{padding:.9rem .62rem;font-size:.745rem}
  .pkp_navigation_primary>li>a::after{left:.62rem;right:.62rem;bottom:.45rem}
  .pkp_site_nav_toggle{display:none}
}
.pkp_site_name .is_img img,.pkp_site_name img{max-height:52px;width:auto}

/* (c) SUBMIT ARTICLE — the last primary item renders as the gold button at
   the right-hand end of the bar, not as another text link. */
.pkp_navigation_primary>li:last-child{margin-left:.75rem}
.pkp_navigation_primary>li:last-child>a{
  background:var(--gd);color:#fff;border-radius:5px;
  padding:.62rem 1.05rem;font-size:.72rem;letter-spacing:.04em;
  transition:background .25s ease,color .25s ease}
.pkp_navigation_primary>li:last-child>a::after{display:none}
.pkp_navigation_primary>li:last-child>a:hover,
.pkp_navigation_primary>li:last-child>a:focus{background:var(--nv);color:#fff}
@media(max-width:899px){
  .pkp_navigation_primary>li:last-child{margin-left:0}
  .pkp_navigation_primary>li:last-child>a{display:inline-block;margin:.4rem 0}
}

/* ================= 5. hero spacing + menu alignment + buttons ============ */

/* (a) HERO — the band was carrying a 500px floor plus 64px of padding at each
   end, which left dead space above the eyebrow and below the chip row. */
.ijhome .hero-in{min-height:0;
  padding-top:clamp(26px,3.2vw,42px);
  padding-bottom:clamp(26px,3.2vw,42px)}
.ijhome .hero .eyebrow{margin-bottom:2px}
.ijhome .hero h1{margin:10px 0 20px}
.ijhome .hero-meta{margin-top:22px}

/* (b) MENU ALIGNMENT — Home through Blog sit left, next to the logo.
   The three action items are pushed to the right as a group by giving the
   first of them the auto margin. */
@media(min-width:900px){
  .pkp_navigation_primary{justify-content:flex-start}
  .pkp_navigation_primary>li:nth-last-child(3){margin-left:auto}
  .pkp_navigation_primary>li>a{padding:.85rem .55rem;font-size:.715rem}
  .pkp_navigation_primary>li>a::after{left:.55rem;right:.55rem}
  .pkp_head_wrapper{gap:1.25rem}
}

/* (c) ACTION BUTTONS — Call for Papers and Track Paper are outlined so the
   bar does not end in three solid gold blocks; Submit Article stays solid. */
.pkp_navigation_primary>li:nth-last-child(3)>a,
.pkp_navigation_primary>li:nth-last-child(2)>a{
  border:1.5px solid var(--line-2);color:var(--nv);border-radius:5px;
  padding:.55rem .8rem;font-size:.7rem;margin-left:.4rem;
  transition:border-color .25s ease,color .25s ease,background .25s ease}
.pkp_navigation_primary>li:nth-last-child(3)>a::after,
.pkp_navigation_primary>li:nth-last-child(2)>a::after{display:none}
.pkp_navigation_primary>li:nth-last-child(3)>a:hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:hover,
.pkp_navigation_primary>li:nth-last-child(3)>a:focus,
.pkp_navigation_primary>li:nth-last-child(2)>a:focus{
  border-color:var(--gd);color:var(--gd);background:var(--gd-pale)}

.pkp_navigation_primary>li:last-child{margin-left:.4rem}
.pkp_navigation_primary>li:last-child>a{
  background:var(--gd);color:#fff;border:1.5px solid var(--gd);border-radius:5px;
  padding:.55rem .9rem;font-size:.7rem;letter-spacing:.03em}
.pkp_navigation_primary>li:last-child>a:hover,
.pkp_navigation_primary>li:last-child>a:focus{background:var(--nv);
  border-color:var(--nv);color:#fff}

@media(max-width:899px){
  .pkp_navigation_primary>li:nth-last-child(3){margin-left:0}
  .pkp_navigation_primary>li:nth-last-child(3)>a,
  .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_navigation_primary>li:last-child>a{display:inline-block;margin:.35rem 0}
}

/* (d) author experience quotes — styling ready for real, attributed accounts */
.ijilr-quotes{display:grid;gap:1.1rem;margin:1.6rem 0}
.ijilr-quotes blockquote{margin:0;background:var(--bg-2);border:1px solid var(--line);
  border-left:4px solid var(--gd);border-radius:var(--radius);padding:1.2rem 1.4rem}
.ijilr-quotes blockquote p{margin:0 0 .7rem;font-size:.98rem;line-height:1.7}
.ijilr-quotes cite{font-style:normal;font-size:.85rem;color:var(--ink-2);font-weight:600}

/* ================= 6. journal mark in header and footer ================== */

/* footer: the white line mark sits above the journal name */
.ijilr-flogo{display:block;margin:0 auto .9rem;width:76px;height:76px;opacity:.95}
@media(max-width:600px){.ijilr-flogo{width:62px;height:62px}}

/* header: OJS renders the logo from pageHeaderLogoImage. Cap its height so a
   large source file still sits correctly on one line beside the menu. */
.pkp_site_name .is_img{display:block}
.pkp_site_name .is_img img,.pkp_site_name img{max-height:54px;width:auto;
  height:auto;display:block}
@media(max-width:767px){.pkp_site_name .is_img img,.pkp_site_name img{max-height:44px}}

/* ================= 7. action button order ================================ */
/* Order is now  Call for Papers | Submit Article | Track Paper.
   Submit Article stays the solid gold primary, so the emphasis follows the
   button rather than its position: outline, GOLD, outline. */

.pkp_navigation_primary>li:nth-last-child(3)>a,
.pkp_navigation_primary>li:nth-last-child(2)>a,
.pkp_navigation_primary>li:last-child>a{
  border:1.5px solid var(--line-2);background:transparent;color:var(--nv);
  border-radius:5px;padding:.55rem .8rem;font-size:.7rem;margin-left:.4rem}
.pkp_navigation_primary>li:nth-last-child(3)>a::after,
.pkp_navigation_primary>li:nth-last-child(2)>a::after,
.pkp_navigation_primary>li:last-child>a::after{display:none}
.pkp_navigation_primary>li:nth-last-child(3)>a:hover,
.pkp_navigation_primary>li:nth-last-child(3)>a:focus,
.pkp_navigation_primary>li:last-child>a:hover,
.pkp_navigation_primary>li:last-child>a:focus{
  border-color:var(--gd);color:var(--gd);background:var(--gd-pale)}

/* the middle one is the primary action */
.pkp_navigation_primary>li:nth-last-child(2)>a{
  background:var(--gd);border-color:var(--gd);color:#fff;
  padding:.55rem .9rem;letter-spacing:.03em}
.pkp_navigation_primary>li:nth-last-child(2)>a:hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:focus{
  background:var(--nv);border-color:var(--nv);color:#fff}

/* ================= 8. header mark: navy, properly sized ================== */
/* Gold on a white header was low-contrast; navy reads cleanly.
   A circular mark needs to be smaller than a wordmark to sit right on a
   nav bar — 44px keeps the seal legible without dominating the row. */
.pkp_site_name{display:flex;align-items:center}
.pkp_site_name .is_img,.pkp_site_name a{display:flex;align-items:center}
.pkp_site_name .is_img img,.pkp_site_name img{
  max-height:44px;width:auto;height:44px;display:block}
@media(max-width:900px){
  .pkp_site_name .is_img img,.pkp_site_name img{max-height:38px;height:38px}
}
@media(max-width:600px){
  .pkp_site_name .is_img img,.pkp_site_name img{max-height:34px;height:34px}
}

/* ================= 9. brand amber ======================================== */
/* New brand fill sampled from the supplied button: #F0B23C, with navy text.
   Two tones are needed, not one:
     --gd      #F0B23C  fills, and accents on dark grounds (7.8:1 on navy)
     --gd-ink  #9A6E0C  the same hue darkened, for small TEXT on light grounds
   The bright amber as text on white measures 1.9:1 — illegible — so labels on
   pale bands use the ink tone. Navy on amber measures 6.3:1. */

:root{
  --gd:#F0B23C; --gd-l:#F7CE7A; --gd-d:#9A6E0C; --gd-pale:#FEF6E7;
  --gd-ink:#9A6E0C;
}
.ijhome{--gold:#F0B23C; --gold2:#F7CE7A; --gold-ink:#9A6E0C}

/* --- gold fills now carry navy text ------------------------------------- */
.ijilr-btn,
.ijilr-fcta,
.ijilr-metrics .cta a,
.ijhome .btn.gold,
.ijhome .side-link:not(.cfp-cta),
.pkp_navigation_primary>li:nth-last-child(2)>a{
  background:var(--gd);border-color:var(--gd);color:#12385f!important;
  font-weight:700}
.ijilr-btn:hover,.ijilr-btn:focus,
.ijilr-fcta:hover,.ijilr-fcta:focus,
.ijilr-metrics .cta a:hover,
.ijhome .btn.gold:hover,.ijhome .btn.gold:focus,
.ijhome .side-link:not(.cfp-cta):hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:focus{
  background:#DCA02B;border-color:#DCA02B;color:#12385f!important}

/* the outlined nav buttons pick up the amber on hover */
.pkp_navigation_primary>li:nth-last-child(3)>a:hover,
.pkp_navigation_primary>li:nth-last-child(3)>a:focus,
.pkp_navigation_primary>li:last-child>a:hover,
.pkp_navigation_primary>li:last-child>a:focus{
  border-color:var(--gd);color:var(--gd-ink);background:var(--gd-pale)}

/* --- small gold TEXT on pale bands uses the ink tone --------------------- */
.ijhome .eyebrow,
.ijhome .article .type,
.ijhome .feature-card .type,
.ijhome .readlink,
.ijhome .article .read,
.ijhome .side-row small,
.ijhome .metric small,
.ijhome .area small,
.ijhome .step b,
.ijhome .benefit .num,
.ijhome .news .k,
.ijhome .quick-item small,
.ijhome .toc .doi{color:var(--gold-ink)}

/* ...but on the dark panels it stays bright */
.ijhome .hero .eyebrow,
.ijhome .final .eyebrow,
.ijhome .fee-card .eyebrow,
.ijhome .cover .eyebrow,
.ijhome .feature-card:first-child .type,
.ijhome .feature-card:hover .type,
.ijhome .feature-card:focus-within .type,
.ijhome .feature-card:first-child .readlink,
.ijhome .feature-card:hover .readlink,
.ijhome .feature-card:focus-within .readlink{color:var(--gold2)}

/* rules, borders and marks that are decoration rather than text */
.ijhome .rule,.ijhome .feature-top,.ijhome .step{border-top-color:var(--gd)}
.ijhome .rule,.ijhome .feature-top{background:var(--gd)}
.ijhome .area:before{background:var(--gd)}
.ijhome .side-head{border-left-color:var(--gold2)}
.pkp_structure_footer_wrapper,.pkp_structure_footer{border-top-color:var(--gd)}
.ijilr-fcol h4,.ijilr-fchips span{color:var(--gd-l)}
.ijilr-fchips span{background:rgba(240,178,60,.15);border-color:rgba(240,178,60,.42)}
.pkp_navigation_primary>li>a::after{background:var(--gd)}
.ijilr-page h2{border-bottom-color:var(--gd-l)}
.ijilr-page .lead,.ijilr-callout{border-left-color:var(--gd)}
.pkp_block{border-top-color:var(--gd)}
.ijilr-metrics .ic{color:var(--gd-ink)}

/* ================= 10. header lockup: mark + journal title =============== */
/* A bare circular mark cannot carry identity at 44px, and the journal's name
   IS the brand. This restores the lockup the locked design specified:
   seal + IJILR + the full title on two lines. OJS renders either a logo image
   or the title text, never both, so the lockup ships as one image. */

.pkp_site_name .is_img img,.pkp_site_name img{
  height:50px;max-height:50px;width:auto;display:block}
@media(max-width:1100px){
  .pkp_site_name .is_img img,.pkp_site_name img{height:44px;max-height:44px}
}
@media(max-width:900px){
  .pkp_site_name .is_img img,.pkp_site_name img{height:42px;max-height:42px}
}
@media(max-width:600px){
  .pkp_site_name .is_img img,.pkp_site_name img{height:36px;max-height:36px}
}

/* the wider lockup needs the nav to give ground, so the row still fits */
@media(min-width:900px){
  .pkp_head_wrapper{gap:1rem}
  .pkp_navigation_primary>li>a{padding:.8rem .46rem;font-size:.69rem}
  .pkp_navigation_primary>li>a::after{left:.46rem;right:.46rem}
  .pkp_navigation_primary>li:nth-last-child(3)>a,
  .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_navigation_primary>li:last-child>a{
    padding:.5rem .72rem;font-size:.665rem;margin-left:.3rem}
}
/* if a narrower viewport still cannot fit it, the action buttons drop to a
   second line rather than the logo being squeezed */
.pkp_navigation_primary{row-gap:.25rem}

/* ================= 11. lockup without the repeated IJILR ================= */
/* The seal already reads "IJILR JOURNAL", so repeating IJILR beside it was
   redundant. The two title lines take its place at full weight. The lockup
   is wider as a result, so the nav gives back a little more padding. */
@media(min-width:900px){
  .pkp_navigation_primary>li>a{padding:.8rem .43rem;font-size:.685rem}
  .pkp_navigation_primary>li>a::after{left:.43rem;right:.43rem}
  .pkp_navigation_primary>li:nth-last-child(3)>a,
  .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_navigation_primary>li:last-child>a{
    padding:.5rem .7rem;font-size:.66rem;margin-left:.28rem}
  .pkp_head_wrapper{gap:.9rem}
}

/* ================= 12. lockup, active menu, spacing ===================== */

/* (a) LOCKUP — seal enlarged to 64px so it actually reads, title on three
   lines. The taller mark makes the header row taller, which also gives the
   menu the extra breathing room asked for. */
.pkp_site_name .is_img img,.pkp_site_name img{
  height:64px;max-height:64px;width:auto;display:block}
@media(max-width:1100px){.pkp_site_name .is_img img,.pkp_site_name img{height:56px;max-height:56px}}
@media(max-width:900px){ .pkp_site_name .is_img img,.pkp_site_name img{height:52px;max-height:52px}}
@media(max-width:600px){ .pkp_site_name .is_img img,.pkp_site_name img{height:44px;max-height:44px}}

/* (b) MENU SPACING — more room per item, now that the lockup is narrower */
@media(min-width:900px){
  .pkp_head_wrapper{gap:1.4rem;padding-top:.15rem;padding-bottom:.15rem}
  .pkp_site_name_wrapper{padding:.5rem 0}
  .pkp_navigation_primary>li>a{padding:.85rem .62rem;font-size:.70rem}
  .pkp_navigation_primary>li>a::after{left:.62rem;right:.62rem;bottom:.5rem}
  .pkp_navigation_primary>li:nth-last-child(3)>a,
  .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_navigation_primary>li:last-child>a{
    padding:.55rem .78rem;font-size:.67rem;margin-left:.34rem}
}

/* (c) ACTIVE MENU ITEM — OJS stamps `pkp_page_<path>` on <body>, so the
   current section can be marked gold with its indicator showing. Hover
   already turns gold; this makes the state persist on the chosen item. */
body.pkp_page_index      .pkp_navigation_primary>li:nth-child(1)>a,
body.pkp_page_about      .pkp_navigation_primary>li:nth-child(2)>a,
body.pkp_page_aims-scope .pkp_navigation_primary>li:nth-child(2)>a,
body.pkp_page_indexing   .pkp_navigation_primary>li:nth-child(2)>a,
body.pkp_page_issue      .pkp_navigation_primary>li:nth-child(3)>a,
body.pkp_page_article    .pkp_navigation_primary>li:nth-child(3)>a,
body.pkp_page_review-process              .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_publication-policy          .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_ethics                      .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_open-access-policy          .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_apc                         .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_article-processing-charges  .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_editorial-workflow          .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_responsibility-of-editors   .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_responsibility-of-reviewers .pkp_navigation_primary>li:nth-child(4)>a,
body.pkp_page_author-guidelines   .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_citation-style      .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_author-tools        .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_downloads           .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_certificates        .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_author-experiences  .pkp_navigation_primary>li:nth-child(5)>a,
body.pkp_page_online-submission   .pkp_navigation_primary>li:nth-child(6)>a,
body.pkp_page_pay-fees            .pkp_navigation_primary>li:nth-child(6)>a,
body.pkp_page_contact             .pkp_navigation_primary>li:nth-child(7)>a,
body.pkp_page_blogs               .pkp_navigation_primary>li:nth-child(8)>a{
  color:var(--gd)}
body.pkp_page_index      .pkp_navigation_primary>li:nth-child(1)>a::after,
body.pkp_page_about      .pkp_navigation_primary>li:nth-child(2)>a::after,
body.pkp_page_aims-scope .pkp_navigation_primary>li:nth-child(2)>a::after,
body.pkp_page_indexing   .pkp_navigation_primary>li:nth-child(2)>a::after,
body.pkp_page_issue      .pkp_navigation_primary>li:nth-child(3)>a::after,
body.pkp_page_article    .pkp_navigation_primary>li:nth-child(3)>a::after,
body.pkp_page_review-process              .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_publication-policy          .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_ethics                      .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_open-access-policy          .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_apc                         .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_article-processing-charges  .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_editorial-workflow          .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_responsibility-of-editors   .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_responsibility-of-reviewers .pkp_navigation_primary>li:nth-child(4)>a::after,
body.pkp_page_author-guidelines   .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_citation-style      .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_author-tools        .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_downloads           .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_certificates        .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_author-experiences  .pkp_navigation_primary>li:nth-child(5)>a::after,
body.pkp_page_online-submission   .pkp_navigation_primary>li:nth-child(6)>a::after,
body.pkp_page_pay-fees            .pkp_navigation_primary>li:nth-child(6)>a::after,
body.pkp_page_contact             .pkp_navigation_primary>li:nth-child(7)>a::after,
body.pkp_page_blogs               .pkp_navigation_primary>li:nth-child(8)>a::after{
  transform:scaleX(1)}

/* (d) HERO — tighter vertical rhythm top and bottom, and closer leading
   between the three headline lines */
.ijhome .hero-in{padding-top:clamp(18px,2.4vw,30px);
  padding-bottom:clamp(18px,2.4vw,30px)}
.ijhome .hero h1{line-height:1.16;margin:8px 0 18px}
.ijhome .hero .eyebrow{margin-bottom:0}
.ijhome .hero p{line-height:1.65}
.ijhome .buttons{margin-top:22px}
.ijhome .hero-meta{margin-top:22px;padding-bottom:0}

/* ---- header fit: menu keeps more air than before, row still one line ---- */
@media(min-width:900px){
  .pkp_head_wrapper{gap:1.1rem}
  .pkp_navigation_primary>li>a{padding:.85rem .52rem;font-size:.69rem}
  .pkp_navigation_primary>li>a::after{left:.52rem;right:.52rem}
  .pkp_navigation_primary>li:nth-last-child(3)>a,
  .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_navigation_primary>li:last-child>a{
    padding:.55rem .74rem;font-size:.665rem;margin-left:.3rem}
}

/* ---- subject cards: name only, so the grid reads as a clean index ------ */
.ijhome .area{min-height:0;padding:16px 18px;display:flex;flex-direction:column;
  justify-content:center}
.ijhome .area strong{margin-top:5px;font-size:15px;line-height:1.35}
.ijhome .area small{font-size:8px;letter-spacing:.9px}

/* ================= 13. archive: the Volume 4 gap, explained ============= */
/* A visible jump from Volume 3 (2023) to Volume 5 (2025) reads as an
   abandoned journal unless it is accounted for. OJS generates the archive
   listing, so the note is placed above it from the stylesheet. */
body.pkp_op_archive .pkp_structure_main::before{
  content:"Publication history: the journal published Volumes 1 to 3 between 2020 and 2023. No issues were published in Volume 4. Publication resumed with Volume 5 in 2025, which is the current volume.";
  display:block;max-width:1180px;margin:0 auto 1.6rem;
  background:var(--gd-pale);border:1px solid var(--gd-l);border-left:4px solid var(--gd);
  border-radius:var(--radius);padding:.95rem 1.2rem;
  font-family:var(--sans);font-size:.9rem;line-height:1.65;color:var(--ink-2)}
@media(max-width:767px){
  body.pkp_op_archive .pkp_structure_main::before{font-size:.85rem;padding:.8rem 1rem}
}

/* ================= 14. Call for Papers panel ============================ */
/* Replaces the Journal Information sidebar, whose facts already appear five
   times on this page. Rolls itself forward: quarterly issues, submissions
   considered if received by the 19th of the closing month, issue published at
   month end. The script recalculates in the reader's browser so it is never
   stale; the values baked into the HTML are the no-JavaScript fallback. */

.ijhome .ij-cfp .cfp-top{padding:15px 17px 13px;border-bottom:1px solid var(--line)}
.ijhome .cfp-vol{font:700 19px/1.25 "Libre Baskerville",Georgia,serif;color:var(--navy)}
.ijhome .cfp-per{font-size:12.5px;color:var(--muted);margin-top:3px}

.ijhome .ij-cfp .side-row small{display:block;font-size:8px;letter-spacing:.9px;
  text-transform:uppercase;color:var(--gold-ink);font-weight:800;line-height:1.5}
.ijhome .ij-cfp .side-row strong{display:block;font:600 13px/1.45 "DM Sans",Arial,sans-serif;
  color:var(--navy);margin-top:3px}

.ijhome .cfp-badge{display:inline-block;background:var(--gold);color:#12385f;
  font-family:"DM Sans",Arial,sans-serif;font-weight:800;font-size:12.5px;
  letter-spacing:.3px;padding:4px 10px;border-radius:4px}

.ijhome .cfp-types{padding:13px 17px;border-bottom:1px solid var(--line)}
.ijhome .cfp-types small{display:block;font-size:8px;letter-spacing:.9px;
  text-transform:uppercase;color:var(--gold-ink);font-weight:800;margin-bottom:7px}
.ijhome .cfp-types span{display:inline-block;font-size:10.5px;font-weight:600;
  color:var(--navy);background:#eef2f8;border:1px solid var(--line);
  border-radius:99px;padding:3px 9px;margin:0 3px 4px 0}

.ijhome .cfp-left{text-align:center;font-size:11.5px;font-weight:700;
  color:var(--gold-ink);padding:0 17px 6px}
.ijhome .cfp-alt{text-align:center;font-size:11.5px;color:var(--muted);padding:0 17px 10px}
.ijhome .cfp-alt a{color:var(--navy);font-weight:600;text-decoration:underline;
  text-underline-offset:2px}
.ijhome .cfp-alt a:hover{color:var(--gold-ink)}
.ijhome .cfp-note{font-size:10.5px;line-height:1.6;color:var(--muted);
  padding:11px 17px 15px;border-top:1px solid var(--line);background:#fafbfd}

@media(max-width:950px){
  .ijhome .ij-cfp{position:static}
  .ijhome .cfp-vol{font-size:21px}
}

/* ==========================================================================
   15. Homepage changes marked up in "ijilr changes in homepage"
       a  Featured cards: equal size, navy fill follows the pointer
       b  Call for Papers: detail table, moved beside Subjects Covered
       c  Current issue: a real journal front cover
       d  Recently published: full width, page one on hover
       e  Top Authors of IJILR: auto-advancing carousel
       f  Submission process: icons and a connected row
       g  Why publish with IJILR: six benefits around the journal mark
       h  APC: fee table, waiver wording removed
       i  Indexing: logo strip
       j  FAQ: two columns, accordion on the right
   ========================================================================== */

/* ------------------------------------- a. featured: equal, pointer-driven --- */
/* Three equal columns. The navy fill starts on the first card and hands over to
   whichever card the pointer (or keyboard focus) is on, so exactly one card is
   ever filled. */
.ijhome .feature{grid-template-columns:repeat(3,1fr);align-items:stretch;gap:16px}
.ijhome .feature-card{display:flex;flex-direction:column}
.ijhome .feature-body{display:flex;flex-direction:column;flex:1 1 auto}
.ijhome .feature-card p{flex:1 1 auto}
.ijhome .feature-card .readlink{margin-top:14px}

/* the resting state: card one filled */
.ijhome .feature-card:first-child{background:var(--navy);color:#fff}

/* pointer anywhere in the row: every card returns to white ... */
.ijhome .feature:hover .feature-card,
.ijhome .feature:focus-within .feature-card{
  background:#fff;color:var(--ink);border-color:var(--line);box-shadow:none;
  transform:none}
.ijhome .feature:hover .feature-card h3,
.ijhome .feature:focus-within .feature-card h3{color:var(--navy)}
.ijhome .feature:hover .feature-card p,
.ijhome .feature:focus-within .feature-card p{color:var(--muted)}
.ijhome .feature:hover .feature-card .type,
.ijhome .feature:focus-within .feature-card .type{color:var(--gold)}
.ijhome .feature:hover .feature-card .article-meta,
.ijhome .feature:focus-within .feature-card .article-meta{color:var(--navy)}
.ijhome .feature:hover .feature-card .readlink,
.ijhome .feature:focus-within .feature-card .readlink{color:var(--gold-ink,#9A6E0C)}
.ijhome .feature:hover .feature-card .feature-top,
.ijhome .feature:focus-within .feature-card .feature-top{background:var(--gold)}

/* ... except the one under the pointer, which takes the navy */
.ijhome .feature:hover .feature-card:hover,
.ijhome .feature:focus-within .feature-card:focus-within{
  background:var(--navy);color:#fff;border-color:var(--gold);
  transform:translateY(-5px);box-shadow:0 20px 40px rgba(11,41,71,.28)}
.ijhome .feature:hover .feature-card:hover h3,
.ijhome .feature:focus-within .feature-card:focus-within h3{color:#fff}
.ijhome .feature:hover .feature-card:hover p,
.ijhome .feature:focus-within .feature-card:focus-within p{color:#ffffffc4}
.ijhome .feature:hover .feature-card:hover .type,
.ijhome .feature:hover .feature-card:hover .readlink,
.ijhome .feature:focus-within .feature-card:focus-within .type,
.ijhome .feature:focus-within .feature-card:focus-within .readlink{color:var(--gold2)}
.ijhome .feature:hover .feature-card:hover .article-meta,
.ijhome .feature:focus-within .feature-card:focus-within .article-meta{color:#ffffffde}
.ijhome .feature:hover .feature-card:hover .feature-top,
.ijhome .feature:focus-within .feature-card:focus-within .feature-top{background:var(--gold2)}

/* the author line was too small to read */
.ijhome .feature-card .article-meta{font-size:12.5px;line-height:1.55;letter-spacing:.1px}
.ijhome .feature-card .type{font-size:9.5px;letter-spacing:1.3px}

@media(max-width:900px){
  .ijhome .feature{grid-template-columns:1fr}
  .ijhome .feature-card{transform:none !important}
}

/* ---------------------------- b. Call for Papers beside Subjects Covered --- */
.ijhome .subj-layout{display:grid;grid-template-columns:1fr 306px;gap:24px;
  align-items:start}
.ijhome .subj-layout .areas{grid-template-columns:repeat(3,1fr)}

.ijhome .ij-cfp{position:sticky;top:112px}
.ijhome .ij-cfp .cfp-top{padding:15px 17px 13px;border-bottom:1px solid var(--line);
  background:#fbfcfe}
.ijhome .cfp-vol{font:700 20px/1.25 "Libre Baskerville",Georgia,serif;color:var(--navy)}

.ijhome .cfp-tbl{display:grid;grid-template-columns:minmax(96px,.85fr) 1.15fr;
  margin:0;border-bottom:1px solid var(--line)}
.ijhome .cfp-tbl dt,
.ijhome .cfp-tbl dd{margin:0;padding:9px 12px;border-top:1px solid var(--line);
  display:flex;align-items:center}
.ijhome .cfp-tbl dt{background:#f6f8fb;color:var(--navy);font-size:10.5px;
  font-weight:800;letter-spacing:.5px;text-transform:uppercase;line-height:1.4}
.ijhome .cfp-tbl dd{font:600 13.5px/1.45 "Inter",system-ui,sans-serif;color:var(--ink);
  flex-direction:column;align-items:flex-start;justify-content:center}
.ijhome .cfp-tbl dt:first-of-type,
.ijhome .cfp-tbl dd:first-of-type{border-top:0}
.ijhome .cfp-sub{display:block;font-weight:500;font-size:12px;color:var(--muted)}
.ijhome .cfp-badge{display:inline-block;background:var(--gd,#F0B23C);
  color:var(--gd-ink,#5A3F05);font-weight:800;font-size:12.5px;letter-spacing:.2px;
  padding:5px 10px;border-radius:4px}

.ijhome .cfp-types{padding:13px 15px;border-bottom:1px solid var(--line)}
.ijhome .cfp-types small,
.ijhome .cfp-sbm small{display:block;font-size:10px;font-weight:800;letter-spacing:.9px;
  text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.ijhome .cfp-types span{display:inline-block;font-size:11.5px;color:var(--navy);
  background:#f2f6fb;border:1px solid #dde6f1;border-radius:99px;padding:4px 9px;
  margin:0 5px 5px 0;line-height:1.4}
.ijhome .cfp-sbm{padding:13px 15px;border-bottom:1px solid var(--line);font-size:13px;
  line-height:1.65;color:var(--muted)}
.ijhome .cfp-sbm a{color:var(--navy);font-weight:700}
.ijhome .cfp-sbm span{display:block}

/* the submit button alternates gold-on-navy and navy-on-gold */
.ijhome .cfp-cta{display:block;margin:15px;padding:14px 16px;text-align:center;
  border-radius:5px;font:800 15px/1.2 "Inter",system-ui,sans-serif;letter-spacing:.4px;
  text-decoration:none;border:2px solid var(--gd,#F0B23C);
  background:var(--gd,#F0B23C);color:var(--navy);
  animation:ij-cfp-blink 3.2s steps(1,end) infinite}
@keyframes ij-cfp-blink{
  0%,50%  {background:var(--gd,#F0B23C);color:#0B2947;border-color:var(--gd,#F0B23C)}
  50.01%,100%{background:#0B2947;color:var(--gd,#F0B23C);border-color:var(--gd,#F0B23C)}
}
.ijhome .cfp-cta:hover,.ijhome .cfp-cta:focus{animation-play-state:paused;
  background:#0B2947;color:var(--gd,#F0B23C)}
.ijhome .cfp-left{padding:0 15px 15px;text-align:center;font-size:12.5px;
  font-weight:700;color:var(--gold-ink,#9A6E0C)}

@media(prefers-reduced-motion:reduce){
  .ijhome .cfp-cta{animation:none;background:var(--gd,#F0B23C);color:#0B2947}
}
@media(max-width:950px){
  .ijhome .subj-layout{grid-template-columns:1fr}
  .ijhome .subj-layout .areas{grid-template-columns:repeat(2,1fr)}
  .ijhome .ij-cfp{position:static;max-width:420px}
}
@media(max-width:560px){.ijhome .subj-layout .areas{grid-template-columns:1fr}}

/* ------------------------------------------- c. current issue front cover --- */
.ijhome .ij-front{justify-content:flex-start;gap:0;padding:26px 24px 22px;
  background:linear-gradient(158deg,#0c3154 0%,#123f6b 46%,#0a2947 100%);
  border:1px solid rgba(216,182,90,.42);position:relative;overflow:hidden}
.ijhome .ij-front::before{content:"";position:absolute;inset:9px;border-radius:4px;
  border:1px solid rgba(216,182,90,.34);pointer-events:none}
.ijhome .ij-front-top{text-align:center;position:relative;z-index:1}
.ijhome .ij-front-seal{width:76px;height:76px;margin:0 auto 12px;display:block}
.ijhome .ij-front-name{font:700 12.5px/1.5 "Libre Baskerville",Georgia,serif;
  color:#fff;letter-spacing:.6px;text-transform:uppercase}
.ijhome .ij-front-issn{margin-top:6px;font-size:10px;letter-spacing:1.5px;
  color:var(--gold2);font-weight:800}
.ijhome .ij-front-mid{flex:1 1 auto;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;position:relative;z-index:1}
.ijhome .ij-front-rule{width:64px;height:2px;background:var(--gold2);opacity:.85}
.ijhome .ij-front .ij-front-mid h3{font:400 40px/1.08 "Libre Baskerville",Georgia,serif;
  color:#fff;margin:16px 0}
.ijhome .ij-front .ij-front-mid small{margin-top:12px;color:#ffffffb0;font-size:11.5px;
  letter-spacing:.6px}
.ijhome .ij-front-foot{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;
  margin-bottom:16px;position:relative;z-index:1}
.ijhome .ij-front-foot span{font-size:9.5px;font-weight:800;letter-spacing:.9px;
  text-transform:uppercase;color:#ffffffd0;border:1px solid rgba(255,255,255,.28);
  border-radius:99px;padding:5px 10px}
.ijhome .ij-front .btn.gold{position:relative;z-index:1}

/* ------------------------------- d. recently published: page one on hover --- */
.ijhome .articles-wide{grid-template-columns:repeat(3,1fr);gap:16px}
.ijhome .articles-wide .article{position:relative;overflow:hidden;display:flex;
  flex-direction:column;min-height:270px}
.ijhome .art-body{display:flex;flex-direction:column;flex:1 1 auto;
  transition:opacity .3s ease}
.ijhome .art-body .read{margin-top:auto;padding-top:12px}

.ijhome .art-thumb{position:absolute;inset:0;display:block;opacity:0;
  visibility:hidden;background:#fff;transition:opacity .3s ease,visibility .3s;
  border-radius:inherit;overflow:hidden}
.ijhome .art-thumb img{width:100%;height:100%;object-fit:cover;
  object-position:top center;display:block}
.ijhome .art-thumb::after{content:"READ ARTICLE \2192";position:absolute;left:0;right:0;
  bottom:0;padding:10px 14px;font:800 11px/1.4 "Inter",system-ui,sans-serif;
  letter-spacing:1px;color:#fff;background:linear-gradient(transparent,rgba(9,29,52,.94) 46%)}

@media(hover:hover){
  .ijhome .articles-wide .article.has-thumb:hover .art-body,
  .ijhome .articles-wide .article.has-thumb:focus-within .art-body{opacity:0}
  .ijhome .articles-wide .article.has-thumb:hover .art-thumb,
  .ijhome .articles-wide .article.has-thumb:focus-within .art-thumb{
    opacity:1;visibility:visible}
}
/* no hover on a touch screen: show the page permanently, beside the text */
@media(hover:none){
  .ijhome .articles-wide .article.has-thumb{flex-direction:row;gap:14px;
    align-items:flex-start}
  .ijhome .art-thumb{position:static;opacity:1;visibility:visible;flex:0 0 84px;
    width:84px;height:118px;border:1px solid var(--line);border-radius:4px}
  .ijhome .art-thumb::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .ijhome .art-body,.ijhome .art-thumb{transition:none}
}
@media(max-width:1000px){.ijhome .articles-wide{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.ijhome .articles-wide{grid-template-columns:1fr}}

/* -------------------------------------------- e. Top Authors of IJILR ------ */
.ijhome .au-carousel{display:grid;grid-template-columns:auto 1fr auto;gap:10px;
  align-items:center}
.ijhome .au-view{overflow:hidden;border:1px solid var(--line);border-radius:8px;
  background:#fff}
.ijhome .au-track{display:flex;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.ijhome .au-slide{flex:0 0 100%;min-width:100%;width:100%;box-sizing:border-box;
  display:flex;gap:22px;align-items:center;padding:26px 28px}
.ijhome .au-face{flex:0 0 78px;width:78px;height:78px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,#12385f,#1d507f);color:var(--gold2);
  border:2px solid var(--gold2);font:700 25px "Libre Baskerville",Georgia,serif;
  letter-spacing:.5px}
.ijhome .au-txt{min-width:0}
.ijhome .au-carousel h3{font:700 21px/1.35 "Libre Baskerville",Georgia,serif;
  color:var(--navy);margin:0 0 6px}
.ijhome .au-org{display:block;font:500 13.5px/1.55 "Inter",system-ui,sans-serif;
  color:var(--muted);margin-top:3px}
.ijhome .au-slide p{font-size:14px;line-height:1.68;color:var(--muted);margin:0 0 9px}
.ijhome .au-link{font:800 11px/1 "Inter",system-ui,sans-serif;letter-spacing:1px;
  text-transform:uppercase;color:var(--gold-ink,#9A6E0C);text-decoration:none}
.ijhome .au-link:hover{text-decoration:underline}
.ijhome .au-nav{width:38px;height:38px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line);background:#fff;color:var(--navy);font-size:21px;
  line-height:1;transition:all .2s}
.ijhome .au-nav:hover{background:var(--navy);color:#fff;border-color:var(--navy)}
.ijhome .au-dots{display:flex;gap:7px;justify-content:center;margin-top:14px}
.ijhome .au-dot{width:8px;height:8px;padding:0;border-radius:50%;cursor:pointer;
  border:0;background:#cbd6e3;transition:all .2s}
.ijhome .au-dot.is-on{background:var(--gold);width:22px;border-radius:99px}
@media(max-width:640px){
  .ijhome .au-slide{flex-direction:column;text-align:center;padding:22px 18px;gap:14px}
  .ijhome .au-nav{display:none}
}

/* ----------------------------------- f. submission process: one sequence --- */
.ijhome .process{position:relative;gap:20px}
/* a rule behind the row, visible in the gaps, so the six read as a sequence */
.ijhome .process::before{content:"";position:absolute;left:2%;right:2%;top:44px;
  height:2px;background:linear-gradient(90deg,transparent,var(--gold) 6%,
  var(--gold) 94%,transparent);opacity:.75;z-index:0}
.ijhome .step{position:relative;z-index:1;text-align:center;padding:20px 14px 18px}
.ijhome .step::after{content:"\203A";position:absolute;right:-14px;top:36px;
  width:20px;text-align:center;color:var(--gold);font:700 20px/1 "Inter",system-ui,sans-serif;
  z-index:2}
.ijhome .step:last-child::after{content:none}
.ijhome .step-mark{width:46px;height:46px;margin:0 auto 10px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:#fff;
  border:2px solid var(--gold);color:var(--navy);transition:all .28s ease}
.ijhome .step:hover .step-mark{background:var(--navy);border-color:var(--navy);
  color:var(--gold2)}
.ijhome .ij-ico{width:23px;height:23px;display:block}
.ijhome .step b{display:block;font-size:10px;letter-spacing:1.2px}
.ijhome .step h3{font-size:17px;margin:5px 0 7px}
@media(max-width:1050px){
  .ijhome .process{grid-template-columns:repeat(3,1fr)}
  .ijhome .process::before{display:none}
  .ijhome .step::after{display:none}
}
@media(max-width:620px){.ijhome .process{grid-template-columns:repeat(2,1fr)}}

/* ---------------------------- g. author benefits around the journal mark --- */
.ijhome .ben-orbit{position:relative;display:grid;
  grid-template-columns:1fr minmax(150px,190px) 1fr;gap:12px;align-items:center;
  padding:8px 0}
.ijhome .ben-wires{position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;z-index:0;stroke:var(--gold);stroke-width:1.4;fill:none;
  opacity:.42}
.ijhome .ben-col{display:flex;flex-direction:column;gap:22px;position:relative;z-index:1}
.ijhome .ben-node{display:flex;gap:14px;align-items:flex-start}
.ijhome .ben-l{flex-direction:row-reverse;text-align:right}
.ijhome .ben-ico{flex:0 0 52px;width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;background:#fff;
  border:2px solid var(--gold);color:var(--navy);
  box-shadow:0 6px 16px rgba(11,41,71,.12);transition:all .26s ease}
.ijhome .ben-node:hover .ben-ico{background:var(--navy);border-color:var(--navy);
  color:var(--gold2);transform:translateY(-3px)}
.ijhome .ben-ico .ij-ico{width:25px;height:25px}
.ijhome .ben-txt{min-width:0}
.ijhome .ben-n{font:800 10px/1 "Inter",system-ui,sans-serif;letter-spacing:1.3px;
  color:var(--gold)}
.ijhome .ben-orbit h3{font:700 17px/1.35 "Libre Baskerville",Georgia,serif;
  color:var(--navy);margin:6px 0 5px}
.ijhome .ben-node p{font-size:13px;line-height:1.62;color:var(--muted);margin:0}
.ijhome .ben-hub{position:relative;z-index:1;display:flex;align-items:center;
  justify-content:center;padding:14px}
.ijhome .ben-hub img{width:100%;max-width:150px;height:auto;display:block;
  position:relative;z-index:1}
.ijhome .ben-ring{position:absolute;left:50%;top:50%;width:190px;height:190px;
  transform:translate(-50%,-50%);border-radius:50%;
  border:1px solid rgba(216,182,90,.5);
  background:radial-gradient(circle,rgba(216,182,90,.16),transparent 68%)}
@media(max-width:900px){
  .ijhome .ben-orbit{grid-template-columns:1fr 1fr;gap:20px}
  .ijhome .ben-wires,.ijhome .ben-ring{display:none}
  .ijhome .ben-hub{grid-column:1 / -1;order:-1;padding:0 0 6px}
  .ijhome .ben-hub img{max-width:104px}
  .ijhome .ben-l{flex-direction:row;text-align:left}
}
@media(max-width:560px){.ijhome .ben-orbit{grid-template-columns:1fr}}

/* -------------------------------------------------------- h. APC table ----- */
.ijhome .fee-tbl{display:grid;grid-template-columns:auto 1fr;column-gap:22px;
  row-gap:0;margin:14px 0 0;position:relative;z-index:1}
.ijhome .fee-tbl dt,
.ijhome .fee-tbl dd{margin:0;padding:9px 0;border-top:1px solid rgba(255,255,255,.14);
  font-size:14px;line-height:1.5}
.ijhome .fee-tbl dt{font-weight:700;color:#fff;white-space:nowrap}
.ijhome .fee-tbl dd{color:var(--gold2);font-weight:600}
.ijhome .fee-tbl dt:first-of-type,
.ijhome .fee-tbl dd:first-of-type{border-top:0}
.ijhome .fee-note{margin-top:14px;font-size:13px;color:#ffffffb0;position:relative;z-index:1}
@media(max-width:520px){
  .ijhome .fee-tbl{grid-template-columns:1fr}
  .ijhome .fee-tbl dd{padding-top:0;border-top:0}
}

/* --------------------------------------------------- i. indexing marks ----- */
.ijhome .ix-strip{overflow:hidden;background:#fff;border:1px solid var(--line);
  border-radius:8px;padding:20px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.ijhome .ix-track{display:flex;align-items:center;gap:56px;width:max-content;
  animation:ij-ix-scroll 46s linear infinite}
.ijhome .ix-strip:hover .ix-track{animation-play-state:paused}
.ijhome .ix-logo{flex:0 0 auto;display:flex;align-items:center;
  filter:grayscale(1);opacity:.72;transition:all .3s ease}
.ijhome .ix-logo:hover{filter:none;opacity:1}
.ijhome .ix-logo img{height:52px;width:auto;display:block}
@keyframes ij-ix-scroll{from{transform:translateX(0)}
                        to{transform:translateX(-50%)}}
/* until there are enough marks to loop, the strip simply sits still */
.ijhome .ix-still{-webkit-mask-image:none;mask-image:none}
.ijhome .ix-still .ix-track{animation:none;width:100%;justify-content:center}
.ijhome .ix-still .ix-logo{filter:none;opacity:1}
.ijhome .ix-foot{margin-top:16px;font-size:14px;line-height:1.7;color:var(--muted);
  max-width:74ch}
@media(prefers-reduced-motion:reduce){.ijhome .ix-track{animation:none}}

/* --------------------------------------------------------- j. FAQ ---------- */
.ijhome .faq-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:40px;
  align-items:start}
.ijhome .faq-aside h2{margin:8px 0 0}
.ijhome .faq-more{margin-top:56px}
.ijhome .faq-more h3{font:400 26px/1.25 "Libre Baskerville",Georgia,serif;
  color:var(--navy);margin:0 0 14px}
.ijhome .faq-layout .faqs{grid-template-columns:1fr;gap:10px}
.ijhome .faq{padding:0;border-radius:7px}
.ijhome .faq summary{display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:16px 18px;font:700 16px/1.45 "Libre Baskerville",Georgia,serif;
  color:var(--navy);list-style:none}
.ijhome .faq summary::-webkit-details-marker{display:none}
.ijhome .faq summary::after{content:"+";flex:0 0 26px;width:26px;height:26px;
  border-radius:50%;border:1px solid var(--line);color:var(--navy);
  font:400 17px/24px "Inter",system-ui,sans-serif;text-align:center;
  transition:all .2s ease}
.ijhome .faq[open] summary::after{content:"\2212";background:var(--navy);color:#fff;
  border-color:var(--navy)}
.ijhome .faq p{margin:0;padding:0 18px 17px}
@media(max-width:860px){
  .ijhome .faq-layout{grid-template-columns:1fr;gap:22px}
  .ijhome .faq-more{margin-top:8px}
}

/* ==========================================================================
   16. Second review pass
       a  Hero: journal name above the hook
       b  About IJILR + Journal Metrics, one section with two elements
       c  Subjects: no kicker line, panel and grid end level
       d  Submission process: five stages, no numbering
       e  Author benefits: filled icons, connectors drawn to them
   ========================================================================== */

/* ------------------------------------------------- a. hero, two lines ----- */
/* The hook is two long lines rather than three short ones, so it can run wider
   before it has to shrink. */
.ijhome .hero h1{font-size:clamp(29px,3.9vw,50px);line-height:1.2;letter-spacing:-.01em}
/* On a narrow screen the earlier rule turned the two lines into inline spans,
   which glued "Research" to "Cited" into one unbreakable word and pushed the
   whole hero wider than the viewport. Each line stays its own block and wraps. */
@media(max-width:600px){
  .ijhome .hero h1{font-size:31px}
  .ijhome .hero h1 span{display:block;white-space:normal}
}
.ijhome .hero .eyebrow{margin-bottom:6px;color:var(--gold2);opacity:.95}
.ijhome .hero p{font-size:16.5px;line-height:1.7;max-width:46ch}

/* --------------------------------- b. About IJILR + Journal Metrics ------- */
.ijhome .about-layout{display:grid;grid-template-columns:1fr 340px;gap:38px;
  align-items:start}
.ijhome .about-main p{font-size:15.5px;line-height:1.78;color:var(--muted);
  margin:0 0 14px;max-width:64ch}
.ijhome .about-main p b{color:var(--navy);font-weight:700}
.ijhome .about-main .rule{margin:14px 0 20px}
.ijhome .about-btns{display:flex;gap:11px;flex-wrap:wrap;margin-top:20px}

/* A quieter surface than the Call for Papers panel: no navy header bar, a pale
   tint instead of white rows, and a gold rule down the left. */
.ijhome .jm{background:#F4F7FB;border:1px solid #E2EAF3;border-left:4px solid var(--gold);
  border-radius:7px;overflow:hidden}
.ijhome .jm-head{padding:14px 18px 12px;font:700 18px "Libre Baskerville",Georgia,serif;
  color:var(--navy);border-bottom:1px solid #E2EAF3;background:#EDF2F9}
.ijhome .jm-tbl{display:grid;grid-template-columns:auto 1fr;margin:0}
.ijhome .jm-tbl dt,
.ijhome .jm-tbl dd{margin:0;padding:12px 18px;border-top:1px solid #E2EAF3;
  display:flex;align-items:center;line-height:1.45}
.ijhome .jm-tbl dt{font:600 12.5px/1.45 "Inter",system-ui,sans-serif;color:var(--muted);
  white-space:nowrap}
.ijhome .jm-tbl dd{font:700 13.5px/1.45 "Inter",system-ui,sans-serif;color:var(--navy);
  justify-content:flex-end;text-align:right}
.ijhome .jm-tbl dt:first-of-type,
.ijhome .jm-tbl dd:first-of-type{border-top:0}
@media(max-width:900px){
  .ijhome .about-layout{grid-template-columns:1fr;gap:26px}
  .ijhome .jm{max-width:440px}
}

/* -------------------------------------- c. subjects and the CFP panel ----- */
/* The two columns end level: the panel stretches to the height of the grid and
   the formats block takes up any slack, so no empty rail is left over. */
.ijhome .subj-layout{grid-template-columns:1fr 340px;align-items:stretch}
.ijhome .subj-layout .ij-cfp{position:static;display:flex;flex-direction:column;
  height:100%}
/* the chips stay inline; the slack is taken below them so the button sits on
   the panel's bottom edge and the two columns finish level */
.ijhome .ij-cfp .cfp-types{flex:0 0 auto}
.ijhome .ij-cfp .cfp-cta{margin-top:auto}

/* with the kicker gone the cards are a single line of type, so they can be
   shorter and set on a tighter grid */
.ijhome .area{display:flex;align-items:center;min-height:0;padding:15px 16px}
.ijhome .area strong{font:700 15.5px/1.4 "Libre Baskerville",Georgia,serif;
  color:var(--navy)}
/* the grid stretches to the panel's height and shares it out between the six
   rows, so the two columns finish level with no rail of empty space */
.ijhome .subj-layout .areas{grid-template-columns:repeat(2,1fr);gap:11px;
  align-content:stretch;grid-auto-rows:1fr}
@media(max-width:950px){
  .ijhome .subj-layout{grid-template-columns:1fr}
  .ijhome .subj-layout .areas{grid-template-columns:repeat(2,1fr)}
  .ijhome .subj-layout .ij-cfp{max-width:none;height:auto}
}
@media(max-width:560px){.ijhome .subj-layout .areas{grid-template-columns:1fr}}

/* ------------------------------------------ d. five-stage process --------- */
.ijhome .process-5{grid-template-columns:repeat(5,1fr)}
.ijhome .process-5 .step{padding-top:22px}
.ijhome .process-5 .step h3{margin:2px 0 7px;font-size:16px;min-height:2.6em;
  display:flex;align-items:center;justify-content:center}
.ijhome .process-5 .step::after{top:34px}
@media(max-width:1050px){
  .ijhome .process-5{grid-template-columns:repeat(3,1fr)}
  .ijhome .process-5 .step h3{min-height:0}
}
@media(max-width:620px){.ijhome .process-5{grid-template-columns:repeat(2,1fr)}}

/* --------------------------------------------- e. author benefits --------- */
/* The icons carry the navy at rest, so the six read as one set with the mark in
   the middle rather than as six outlines. */
.ijhome .ben-ico{background:var(--navy);border-color:var(--navy);color:var(--gold2);
  box-shadow:0 8px 20px rgba(11,41,71,.22)}
.ijhome .ben-node:hover .ben-ico{background:var(--gold);border-color:var(--gold);
  color:var(--navy);transform:translateY(-3px)}
.ijhome .ben-orbit h3{margin:0 0 5px}
.ijhome .ben-wires{stroke:var(--gold);stroke-width:1.5;opacity:.55;
  stroke-linecap:round}
@media(max-width:900px){.ijhome .ben-wires{display:none}}

/* ==========================================================================
   17. Third review pass
   ========================================================================== */

/* --------------------------------- a. recently published: readable byline -- */
/* 8px was below a legible size for a name; the type chip goes with it. */
.ijhome .article .meta{font-size:12.5px;line-height:1.55;letter-spacing:.1px;
  font-weight:700}
.ijhome .article .type{font-size:9.5px;letter-spacing:1.3px}
.ijhome .article .read{font-size:10.5px;letter-spacing:1.1px}

/* six cards fill the three-column grid exactly */
.ijhome .articles-wide{grid-auto-rows:1fr}

/* ------------------------------------ b. process arrows sit on the rule ---- */
/* The chevron is centred in the gap between two cards and on the same line as
   the icons, so the row reads as one continuous sequence. */
.ijhome .process{gap:22px}
.ijhome .process::before{top:45px}
.ijhome .step::after{content:"→";top:22px;right:-22px;width:22px;height:46px;
  display:flex;align-items:center;justify-content:center;
  font:700 15px/1 "Inter",system-ui,sans-serif;color:var(--gold-ink,#9A6E0C)}
.ijhome .process-5 .step::after{top:22px}
@media(max-width:1050px){
  .ijhome .process::before{display:none}
  .ijhome .step::after{display:none}
}

/* ==========================================================================
   18. Hero ground
   ========================================================================== */

/* A flat, very dark navy rather than the earlier two-tone gradient. Only the
   hero takes it; --navy stays as it was for buttons, cards and the footer. */
.ijhome .hero{background:#0F1130}

/* The cover was lit for a lighter ground: warm the pool behind it a little and
   deepen the contact shadow so the object still sits in the field. */
.ijhome .ij-cover-stage::before{
  background:radial-gradient(circle,
    rgba(216,182,90,.32) 0%,
    rgba(216,182,90,.14) 34%,
    rgba(184,137,34,.05) 56%,
    transparent 72%)}
.ijhome .ij-cover-stage::after{
  background:radial-gradient(ellipse at center,rgba(0,0,0,.62),transparent 72%)}

/* ==========================================================================
   19. #0F1130 as the theme colour
       a  the palette, everywhere the old mid navy was used
       b  dark bands: Subjects covered, Top Authors, Submission process
       c  the submission process, restyled to the reference
       d  the watermarked seal
   ========================================================================== */

/* --------------------------------------------------------- a. palette ----- */
/* One deep navy across the site. The lighter steps are derived from it rather
   than from the old mid blue, so gradients and hovers stay in the same family. */
:root{
  --nv:#0F1130; --nv-d:#080A22; --nv-l:#1E2154; --nv-xl:#2E3273;
}
.ijhome{
  --navy:#0F1130; --navy2:#1E2154;
  --gold:#F0B23C; --gold2:#F7CE7A; --gold-ink:#9A6E0C;
  --dark-card:#191C45;          /* card fill on a dark band */
  --dark-line:rgba(255,255,255,.16);
  --dark-text:#C9CCE6;          /* body copy on a dark band */
}

/* the places that hard-coded the old navy */
.ijhome .cover{background:linear-gradient(145deg,#0F1130,#242A63)}
.ijhome .ij-front{background:linear-gradient(158deg,#12143A 0%,#1E2154 46%,#0B0D28 100%)}
.ijhome .au-face{background:linear-gradient(150deg,#1E2154,#2E3273)}
.ijhome .cfp-badge{color:#0F1130}
.ijhome .art-thumb::after{background:linear-gradient(transparent,rgba(9,10,34,.94) 46%)}
.ijilr-btn,.ijilr-fcta,.ijilr-metrics .cta a,
.ijhome .btn.gold,.ijhome .side-link:not(.cfp-cta),
.pkp_navigation_primary>li:nth-last-child(2)>a{color:#0F1130!important}
.ijilr-btn:hover,.ijilr-btn:focus,.ijilr-fcta:hover,.ijilr-fcta:focus,
.ijilr-metrics .cta a:hover,
.ijhome .btn.gold:hover,.ijhome .btn.gold:focus,
.ijhome .side-link:not(.cfp-cta):hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:focus{color:#0F1130!important}
@keyframes ij-cfp-blink{
  0%,50%     {background:var(--gd,#F0B23C);color:#0F1130;border-color:var(--gd,#F0B23C)}
  50.01%,100%{background:#0F1130;color:var(--gd,#F0B23C);border-color:var(--gd,#F0B23C)}
}
.ijhome .cfp-cta:hover,.ijhome .cfp-cta:focus{background:#0F1130}
@media(prefers-reduced-motion:reduce){
  .ijhome .cfp-cta{background:var(--gd,#F0B23C);color:#0F1130}
}

/* ------------------------------------------------------ b. dark bands ----- */
.ijhome .ij-dark{background:#0F1130;color:var(--dark-text);position:relative;
  overflow:hidden;isolation:isolate}
.ijhome .ij-dark>*{position:relative;z-index:1}
.ijhome .ij-dark .eyebrow{color:var(--gold)}
.ijhome .ij-dark h2,
.ijhome .ij-dark h3{color:#fff}
.ijhome .ij-dark .intro,
.ijhome .ij-dark p{color:var(--dark-text)}
.ijhome .ij-dark .rule{background:var(--gold)}
/* the outlined button in a dark section head inverts */
.ijhome .ij-dark .section-head .btn:not(.gold){border:1px solid var(--dark-line)!important;
  color:#fff!important;background:transparent}
.ijhome .ij-dark .section-head .btn:not(.gold):hover,
.ijhome .ij-dark .section-head .btn:not(.gold):focus{border-color:var(--gold)!important;
  color:var(--gold)!important}
/* the solid amber call to action keeps its fill on the dark band */
.ijhome .ij-dark .btn.gold{background:var(--gd,#F0B23C)!important;
  border-color:var(--gd,#F0B23C)!important;color:#0F1130!important}

/* subject cards become translucent panels with a hairline edge */
.ijhome .ij-dark .area{background:rgba(255,255,255,.045);
  border:1px solid var(--dark-line);border-radius:10px;transition:all .24s ease}
.ijhome .ij-dark .area:hover{background:rgba(255,255,255,.08);
  border-color:var(--gold);transform:translateY(-2px)}
.ijhome .ij-dark .area strong{color:#fff}

/* the call for papers panel joins the band instead of sitting on it */
.ijhome .ij-dark .ij-cfp{background:var(--dark-card);border:1px solid var(--dark-line)}
.ijhome .ij-dark .ij-cfp .side-head{background:transparent;
  border-bottom:1px solid var(--dark-line);border-left:4px solid var(--gold);color:#fff}
.ijhome .ij-dark .cfp-top{background:transparent;border-bottom-color:var(--dark-line)}
.ijhome .ij-dark .cfp-vol{color:#fff}
.ijhome .ij-dark .cfp-tbl{border-bottom-color:var(--dark-line)}
.ijhome .ij-dark .cfp-tbl dt{background:rgba(255,255,255,.04);color:var(--gold2);
  border-top-color:var(--dark-line)}
.ijhome .ij-dark .cfp-tbl dd{color:#fff;border-top-color:var(--dark-line)}
.ijhome .ij-dark .cfp-sub{color:var(--dark-text)}
.ijhome .ij-dark .cfp-types{border-bottom-color:var(--dark-line)}
.ijhome .ij-dark .cfp-types span{background:rgba(255,255,255,.06);
  border-color:var(--dark-line);color:#fff}
.ijhome .ij-dark .cfp-left{color:var(--gold2)}

/* the author carousel */
.ijhome .ij-dark .au-view{background:var(--dark-card);border-color:var(--dark-line)}
.ijhome .ij-dark .au-carousel h3{color:#fff}
.ijhome .ij-dark .au-org,
.ijhome .ij-dark .au-slide p{color:var(--dark-text)}
.ijhome .ij-dark .au-link{color:var(--gold2)}
.ijhome .ij-dark .au-face{border-color:var(--gold);color:var(--gold2)}
.ijhome .ij-dark .au-nav{background:transparent;border-color:var(--dark-line);color:#fff}
.ijhome .ij-dark .au-nav:hover{background:var(--gold);border-color:var(--gold);
  color:#0F1130}
.ijhome .ij-dark .au-dot{background:rgba(255,255,255,.28)}
.ijhome .ij-dark .au-dot.is-on{background:var(--gold)}

/* ------------------------------------- c. submission process, restyled ---- */
/* Cards step up and down the row, the way the reference sets them out, and the
   connecting rule is dropped: the stagger carries the sequence instead. */
.ijhome .ij-dark .process{align-items:start;gap:18px}
.ijhome .ij-dark .process::before{display:none}
.ijhome .ij-dark .step::after{display:none}
.ijhome .ij-dark .step{background:rgba(255,255,255,.05);
  border:1px solid var(--dark-line);border-top:1px solid var(--dark-line);
  border-radius:14px;text-align:left;padding:24px 20px 26px;
  transition:all .26s ease}
.ijhome .ij-dark .step:nth-child(even){transform:translateY(34px)}
.ijhome .ij-dark .step:hover{background:rgba(255,255,255,.09);
  border-color:var(--gold);transform:translateY(-4px)}
.ijhome .ij-dark .step:nth-child(even):hover{transform:translateY(30px)}
.ijhome .ij-dark .step-mark{margin:0 0 16px;background:transparent;
  border-color:var(--gold);color:var(--gold)}
.ijhome .ij-dark .step:hover .step-mark{background:var(--gold);border-color:var(--gold);
  color:#0F1130}
.ijhome .ij-dark .step b{display:block;font:400 26px/1 "Libre Baskerville",Georgia,serif;
  color:var(--gold);letter-spacing:0;margin-bottom:4px}
.ijhome .ij-dark .step h3{font:400 22px/1.25 "Libre Baskerville",Georgia,serif;
  color:var(--gold);margin:0 0 18px;min-height:0;display:block;text-align:left}
.ijhome .ij-dark .step p{font-size:13.5px;line-height:1.7;color:var(--dark-text);
  text-align:left}
/* the row ends level again once the stagger is dropped */
@media(max-width:1050px){
  .ijhome .ij-dark .step:nth-child(even),
  .ijhome .ij-dark .step:nth-child(even):hover{transform:none}
  .ijhome .ij-dark .step:hover{transform:translateY(-4px)}
}

/* ---------------------------------------------------- d. the watermark ---- */
/* The seal bleeds off the right edge at a whisper of opacity: texture on the
   navy, never anything the eye has to read past. */
.ijhome .ij-wm::before{
  content:"";position:absolute;z-index:0;pointer-events:none;
  right:-6%;top:50%;transform:translateY(-50%);
  width:min(560px,52vw);aspect-ratio:1/1;
  background:url("/ojs/public/journals/1/ijilr-mark-white-512.webp") no-repeat center/contain;
  opacity:.05}
/* Subjects has an opaque panel down its right side, so its seal sits on the
   left, showing through the translucent cards; the process row is open across
   its whole width, so that one keeps the right. */
.ijhome #subjects.ij-wm::before{right:auto;left:-9%}
@media(max-width:900px){.ijhome .ij-wm::before{width:340px;opacity:.035}}

/* Top Authors and the submission process sit next to each other; a hairline
   keeps them reading as two sections rather than one long slab. */
.ijhome .ij-dark + .ij-dark{border-top:1px solid rgba(255,255,255,.09)}

/* ==========================================================================
   20. Lifted ground, white subject cards, four-stage process
       The dark navy is raised from #0F1130 to #1A1C42 — the depth the
       reference template sits at. Change the two values in :root and .ijhome
       below to move it again; everything else is derived from them.
   ========================================================================== */

:root{
  --nv:#1A1C42; --nv-d:#12142F; --nv-l:#2A2D5E; --nv-xl:#3A3E78;
}
.ijhome{
  --navy:#1A1C42; --navy2:#2A2D5E;
  --dark-card:#252863;
  --dark-line:rgba(255,255,255,.18);
  --dark-text:#CFD2EA;
  --blue-band:#E7ECF9;          /* the light blue band */
}

.ijhome .hero{background:#1A1C42}
.ijhome .ij-dark{background:#1A1C42}
.ijhome .cover{background:linear-gradient(145deg,#1A1C42,#31376F)}
.ijhome .ij-front{background:linear-gradient(158deg,#1E2049 0%,#2A2D5E 46%,#14162F 100%)}
.ijhome .au-face{background:linear-gradient(150deg,#2A2D5E,#3A3E78)}
.ijhome .cfp-badge{color:#1A1C42}
.ijhome .art-thumb::after{background:linear-gradient(transparent,rgba(18,20,47,.94) 46%)}
.ijilr-btn,.ijilr-fcta,.ijilr-metrics .cta a,
.ijhome .btn.gold,.ijhome .side-link:not(.cfp-cta),
.ijhome .ij-dark .btn.gold,
.pkp_navigation_primary>li:nth-last-child(2)>a{color:#1A1C42!important}
.ijilr-btn:hover,.ijilr-btn:focus,.ijilr-fcta:hover,.ijilr-fcta:focus,
.ijilr-metrics .cta a:hover,
.ijhome .btn.gold:hover,.ijhome .btn.gold:focus,
.ijhome .side-link:not(.cfp-cta):hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:hover,
.pkp_navigation_primary>li:nth-last-child(2)>a:focus{color:#1A1C42!important}
@keyframes ij-cfp-blink{
  0%,50%     {background:var(--gd,#F0B23C);color:#1A1C42;border-color:var(--gd,#F0B23C)}
  50.01%,100%{background:#1A1C42;color:var(--gd,#F0B23C);border-color:var(--gd,#F0B23C)}
}
.ijhome .cfp-cta:hover,.ijhome .cfp-cta:focus{background:#1A1C42}
@media(prefers-reduced-motion:reduce){
  .ijhome .cfp-cta{background:var(--gd,#F0B23C);color:#1A1C42}
}

/* ------------------------------------------ white subject cards ----------- */
/* The twelve areas go back to white, so they read as buttons against the band
   rather than as panels cut out of it. */
.ijhome .ij-dark .area{background:#fff;border:1px solid transparent}
.ijhome .ij-dark .area strong{color:var(--navy)}
.ijhome .ij-dark .area:hover{background:#fff;border-color:var(--gold);
  transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.28)}

/* ---------------------------------------- Top Authors, light blue band ---- */
/* Between the grey of Recently published and the navy of the process, so the
   three sections stay distinct. Its components keep their light styling. */
.ijhome .ij-blue{background:var(--blue-band);position:relative}
.ijhome .ij-blue .au-view{background:#fff;border-color:#D4DCF0}
.ijhome .ij-blue .au-nav{background:#fff;border-color:#D4DCF0;color:var(--navy)}
.ijhome .ij-blue .au-nav:hover{background:var(--navy);border-color:var(--navy);color:#fff}
.ijhome .ij-blue .au-dot{background:#BDC7E4}
.ijhome .ij-blue .au-dot.is-on{background:var(--gold-ink,#9A6E0C)}

/* ------------------------------------------------ four-stage process ------ */
.ijhome .process-4{grid-template-columns:repeat(4,1fr)}
.ijhome .ij-dark .process-4 .step h3{margin:0 0 14px}
@media(max-width:1050px){.ijhome .process-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.ijhome .process-4{grid-template-columns:1fr}}

/* ==========================================================================
   21. Final pass
       a  hero: ticked assurances, then the two buttons
       b  subject buttons on a soft blue rather than plain white
       c  the closing line, at a readable size
   ========================================================================== */

/* ------------------------------------------------- a. hero assurances ----- */
/* No boxes: each claim is a ticked circle and its label, so the three read as
   assurances rather than tags. The buttons now sit under them. */
.ijhome .hero-meta{gap:10px 24px;margin-top:26px;row-gap:10px}
.ijhome .hero-meta span{display:inline-flex;align-items:center;gap:9px;
  border:0;background:transparent;padding:0;border-radius:0;
  font:600 13.5px/1.4 "Inter",system-ui,sans-serif;letter-spacing:.2px;
  color:#fff;text-transform:none}
.ijhome .hero-meta span:hover{border-color:transparent;color:#fff}
.ijhome .ij-tick{flex:0 0 19px;width:19px;height:19px;color:var(--gold2)}
.ijhome .hero .buttons{margin-top:28px;margin-bottom:0}
@media(max-width:600px){
  .ijhome .hero-meta{flex-direction:column;align-items:flex-start;gap:9px}
}

/* --------------------------------------------- b. soft blue subject tiles -- */
/* Plain white glared against the navy; this is the same family as the Top
   Authors band, so the twelve read comfortably. */
.ijhome .ij-dark .area{background:#DDE6F5;border:1px solid #C7D4EC}
.ijhome .ij-dark .area strong{color:var(--navy)}
.ijhome .ij-dark .area:hover{background:#EAF0FA;border-color:var(--gold);
  transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.3)}

/* --------------------------------------------------- c. the closing line -- */
.ijhome .final p{font-size:16px;line-height:1.7;color:#ffffffd6}

/* ==========================================================================
   22. Subject icons, and the Call for Papers panel made legible
   ========================================================================== */

/* ------------------------------------------------- a. subject tile icons -- */
/* the design stacks these in a column; a leading bullet needs a row */
.ijhome .ij-dark .area{flex-direction:row;align-items:center;justify-content:flex-start;
  gap:12px;padding:14px 16px;text-align:left}
.ijhome .ij-dark .area strong{flex:1 1 auto;text-align:left}
.ijhome .area-ico{flex:0 0 22px;width:22px;height:22px;color:var(--gold-ink,#9A6E0C)}
.ijhome .ij-dark .area:hover .area-ico{color:var(--navy)}
.ijhome .ij-dark .area strong{font-size:15px;line-height:1.35}
@media(max-width:420px){
  .ijhome .area-ico{flex:0 0 19px;width:19px;height:19px}
  .ijhome .ij-dark .area strong{font-size:14px}
}

/* ------------------------------------- b. the Call for Papers panel ------- */
/* This is the page's primary call to action, so it stops being a dark card on a
   dark band and becomes the brightest object in the section: a white panel that
   advances while the navy recedes. Everything in it is a step larger and the
   label/value contrast is the same as a printed form. */
.ijhome .ij-dark .ij-cfp{background:#fff;border:1px solid rgba(255,255,255,.22);
  box-shadow:0 26px 54px rgba(0,0,0,.42)}

.ijhome .ij-dark .ij-cfp .side-head{background:var(--navy);color:#fff;
  border-left:5px solid var(--gold);border-bottom:0;
  padding:16px 18px;font:700 20px/1.25 "Libre Baskerville",Georgia,serif}

.ijhome .ij-dark .cfp-top{background:#F6F8FC;border-bottom:1px solid #DEE5F1;
  padding:15px 18px}
.ijhome .ij-dark .cfp-vol{color:var(--navy);font-size:21px}

.ijhome .ij-dark .cfp-tbl{border-bottom:1px solid #DEE5F1}
.ijhome .ij-dark .cfp-tbl dt{background:#F6F8FC;border-top:1px solid #DEE5F1;
  color:#4C5A75;font:700 11px/1.4 "Inter",system-ui,sans-serif;letter-spacing:.6px;
  padding:11px 14px}
.ijhome .ij-dark .cfp-tbl dd{background:#fff;border-top:1px solid #DEE5F1;
  color:var(--navy);font:700 14.5px/1.45 "Inter",system-ui,sans-serif;padding:11px 14px}
.ijhome .ij-dark .cfp-sub{color:#6B7891;font-weight:500;font-size:12.5px}
.ijhome .ij-dark .cfp-badge{background:var(--gd,#F0B23C);color:var(--navy);
  font-size:14px;font-weight:800;padding:6px 12px}

.ijhome .ij-dark .cfp-types{border-bottom:1px solid #DEE5F1;padding:14px 16px}
.ijhome .ij-dark .cfp-types small{color:var(--gold-ink,#9A6E0C);font-size:10.5px}
.ijhome .ij-dark .cfp-types span{background:#F1F5FB;border:1px solid #DEE5F1;
  color:var(--navy);font-size:12px;font-weight:600;padding:5px 10px}

.ijhome .ij-dark .cfp-cta{font-size:16px;padding:15px 16px;margin:16px}
.ijhome .ij-dark .cfp-left{color:var(--gold-ink,#9A6E0C);font-size:13.5px;
  font-weight:800;padding-bottom:16px}

/* ==========================================================================
   23. Kill the OJS column guides on the homepage
   ========================================================================== */

/* The default theme draws two 1px #ddd column rules with
   `.pkp_structure_main:before/:after { position:absolute; top:0; bottom:0 }`,
   the second pinned at `left:860px`. They are guides for its two-column
   layout. The designed homepage is full-bleed and single-column, so that
   second guide landed mid-page and ran the whole height as a stray vertical
   line over every section. Inner pages keep the theme's own layout, so the
   guides stay there. */
body.pkp_page_index .pkp_structure_main:before,
body.pkp_page_index .pkp_structure_main:after{content:none!important;display:none!important}

/* ==========================================================================
   24. Header: let the navigation have room
   ========================================================================== */

/* The default theme gives every one of these a fixed width at each breakpoint
   (728 / 952 / 1160px):
       .pkp_site_name_wrapper, .pkp_navigation_primary_wrapper, ... {width:1160px}
   In the flex header of section 4 that made the logo block claim the whole row,
   leaving the menu zero-width and collapsed onto the off-canvas mobile styles.
   The widths have to be released explicitly; `flex:0 0 auto` resolves its basis
   from `width`, so setting flex alone was never enough. */
@media(min-width:900px){
  .pkp_head_wrapper .pkp_site_name_wrapper{width:auto!important;flex:0 0 auto}
  .pkp_head_wrapper .pkp_navigation_primary_wrapper{width:auto!important;
    max-width:none!important;padding:0;margin:0}
  .pkp_head_wrapper .pkp_site_nav_menu{flex:1 1 auto;min-width:0;width:auto!important;
    position:static;padding:0;background:transparent!important;z-index:auto}
  .pkp_head_wrapper .pkp_navigation_primary_row{width:auto;background:transparent}
  .pkp_head_wrapper .pkp_site_name{width:auto}
  /* the theme centres the row and colours it for its own blue bar */
  .pkp_head_wrapper .pkp_navigation_primary{text-align:right}
}

/* The theme lays the menu out as inline-block list items, so with eleven
   entries it simply wrapped onto a second row. Making it an explicit
   non-wrapping flex row, with the labels held on one line and the logo capped,
   keeps all eleven on a single line from 900px up. */
@media(min-width:900px){
  .pkp_head_wrapper .pkp_navigation_primary{display:flex;flex-wrap:nowrap;
    align-items:center;justify-content:flex-end;gap:0;margin:0;padding:0;
    text-align:right}
  .pkp_head_wrapper .pkp_navigation_primary>li{flex:0 0 auto;display:block}
  .pkp_head_wrapper .pkp_navigation_primary>li>a{white-space:nowrap;
    padding-left:.5rem;padding-right:.5rem;font-size:.715rem;margin-left:0;margin-right:0}
  .pkp_head_wrapper .pkp_navigation_primary>li>a::after{left:.5rem;right:.5rem}
  /* the three action buttons carry their own box, so they need a little air */
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(-n+3){margin-left:.34rem}
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(-n+3)>a{
    padding-left:.6rem;padding-right:.6rem}
  /* the lockup is three lines tall; cap it so the row has room for the menu */
  .pkp_head_wrapper .pkp_site_name .is_img img{max-height:56px;width:auto}
  .pkp_head_wrapper{gap:1.1rem}
}
@media(min-width:900px) and (max-width:1400px){
  .pkp_head_wrapper .pkp_navigation_primary>li>a{padding-left:.36rem;
    padding-right:.36rem;font-size:.665rem}
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(-n+3)>a{
    padding-left:.48rem;padding-right:.48rem}
  .pkp_head_wrapper .pkp_site_name .is_img img{max-height:48px}
  .pkp_head_wrapper{gap:.7rem}
}

/* ==========================================================================
   25. One action button, and left-aligned dropdowns
   ========================================================================== */

/* Call for Papers and Track Paper are gone from the bar, so the button styling
   — which the chrome CSS keys off nth-last-child(2) and (3) — now lands on
   Blog and Contact. Reset those two back to plain links and give the amber
   fill to the last item, which is Submit Article. */
@media(min-width:900px){
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(2)>a,
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(3)>a{
    background:transparent!important;border:0!important;border-radius:0;
    color:var(--nv)!important;box-shadow:none}
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(2)>a::after,
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(3)>a::after{display:block}
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(2),
  .pkp_head_wrapper .pkp_navigation_primary>li:nth-last-child(3){margin-left:0}

  .pkp_head_wrapper .pkp_navigation_primary>li:last-child{margin-left:.7rem}
  .pkp_head_wrapper .pkp_navigation_primary>li:last-child>a{
    background:var(--gd)!important;border:1px solid var(--gd)!important;
    color:var(--nv)!important;border-radius:4px;font-weight:800;
    padding:.55rem .9rem}
  .pkp_head_wrapper .pkp_navigation_primary>li:last-child>a::after{display:none}
  .pkp_head_wrapper .pkp_navigation_primary>li:last-child>a:hover,
  .pkp_head_wrapper .pkp_navigation_primary>li:last-child>a:focus{
    background:#DCA02B!important;border-color:#DCA02B!important;color:var(--nv)!important}
}

/* The bar is right-aligned, and the dropdowns were inheriting that. Menu items
   read left to right. */
.pkp_navigation_primary li ul,
.pkp_navigation_primary li ul li,
.pkp_navigation_primary li ul li a{text-align:left}

/* ==========================================================================
   26. Critical audit fixes
   ========================================================================== */
/* #7 The theme's two 1px column guides on .pkp_structure_main are for a
   two-column page; they appear as stray lines whenever the sidebar is absent.
   Off everywhere; the archive note below re-declares its own content. */
.pkp_structure_main:before,.pkp_structure_main:after{content:none!important}
/* main takes the full width when it is the only column */
.pkp_structure_content>.pkp_structure_main:last-child{width:100%!important;
  max-width:100%!important;float:none!important}
/* #3 The archive note must not inherit the guide's absolute 1px box */
body.pkp_op_archive .pkp_structure_main::before{
  content:"Publication history: the journal published Volumes 1 to 3 between 2020 and 2023. No issues were published in Volume 4. Publication resumed with Volume 5 in 2025, which is the current volume."!important;
  position:static!important;width:auto!important;height:auto!important;
  top:auto;left:auto;bottom:auto}

/* ==========================================================================
   27. Static pages: one H1, OJS's duplicate title hidden (not removed)
   ========================================================================== */
body.pkp_page_pages .page>h2:first-child{display:none}
body.pkp_page_pages .page h1{font:400 34px/1.2 var(--serif);color:var(--nv);margin:0 0 .9rem}
@media(max-width:600px){body.pkp_page_pages .page h1{font-size:27px}}

/* ==========================================================================
   28. About the Journal and Editorial Board
   ========================================================================== */
/* About: long-form editorial page. Serif headings on a measured column,
   rules as section breaks, tables and lists in the house style. */
.page_about{max-width:860px}
.page_about h2{font:400 26px/1.25 var(--serif);color:var(--nv);margin:2.2rem 0 .7rem}
.page_about h3{font:600 17px/1.4 var(--sans);color:var(--nv);margin:1.4rem 0 .4rem}
.page_about p,.page_about li{font-size:15.5px;line-height:1.75;color:var(--ink-2)}
.page_about ul{padding-left:1.2rem}
.page_about hr{border:0;border-top:1px solid var(--line);margin:2rem 0}
.page_about table{width:100%;border-collapse:collapse;margin:1rem 0 1.4rem;font-size:14.5px}
.page_about th,.page_about td{padding:.6rem .8rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.page_about th{background:var(--bg-2);color:var(--nv);font-weight:600;white-space:nowrap}
/* questions read as a Q&A list */
.page_about h3:has(+p){padding-left:1rem;border-left:3px solid var(--gd)}

/* Board: sections in alternating bands, one card per person */
.ij-board .bd-intro p{font-size:15.5px;line-height:1.75;color:var(--ink-2);max-width:72ch}
.ij-board .bd-sec{margin:2.2rem -1.43rem 0;padding:2rem 1.43rem 2.2rem}
.ij-board .bd-alt{background:var(--bg-2)}
.ij-board .bd-k{font:600 10.5px/1 var(--sans);letter-spacing:1.6px;text-transform:uppercase;color:var(--gd)}
.ij-board .bd-sec h2{font:400 26px/1.25 var(--serif);color:var(--nv);margin:.5rem 0 .6rem}
.ij-board .bd-sec>p{font-size:15px;line-height:1.7;color:var(--ink-2);max-width:72ch;margin:0 0 1.2rem}
.ij-board .bd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;margin-top:1.2rem}
.ij-board .bd-card{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-top:3px solid var(--gd);border-radius:6px;padding:16px 16px 14px}
.ij-board .bd-alt .bd-card{background:#fff}
.ij-board .bd-face{flex:0 0 52px;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(150deg,var(--nv-l),var(--nv-xl));color:var(--gd-l);font:700 18px var(--serif);border:2px solid var(--gd-l)}
.ij-board .bd-role{font:700 10px/1.3 var(--sans);letter-spacing:1.2px;text-transform:uppercase;color:var(--gd-d)}
.ij-board .bd-name{font:700 17px/1.3 var(--serif);color:var(--nv);margin:.25rem 0 .3rem}
.ij-board .bd-desig{font-size:13px;line-height:1.5;color:var(--ink)}
.ij-board .bd-qual{font-size:12.5px;line-height:1.5;color:var(--ink-3);margin-top:.15rem}
.ij-board .bd-bio{font-size:13px;line-height:1.6;color:var(--ink-2);margin:.55rem 0 0}
@media(max-width:640px){.ij-board .bd-sec{margin-left:-1rem;margin-right:-1rem;padding-left:1rem;padding-right:1rem}}

/* board: prose sections and FAQ */
.ij-board .bd-prose p,.ij-board .bd-prose li{font-size:15px;line-height:1.72;color:var(--ink-2);max-width:72ch}
.ij-board .bd-prose h2{margin-bottom:.8rem}
.ij-board .bd-faq{background:#fff;border:1px solid var(--line);border-radius:6px;padding:0;margin:0 0 8px;max-width:72ch}
.ij-board .bd-faq summary{cursor:pointer;padding:12px 16px;font:600 15px/1.45 var(--serif);color:var(--nv);list-style:none;display:flex;justify-content:space-between;gap:12px}
.ij-board .bd-faq summary::-webkit-details-marker{display:none}
.ij-board .bd-faq summary::after{content:"+";color:var(--gd-d);font:400 18px/1 var(--sans)}
.ij-board .bd-faq[open] summary::after{content:"\2212"}
.ij-board .bd-faq p{padding:0 16px 12px;margin:0}

/* 29. one title per page, in the house serif, whatever the body class */
.page:has(h1)>h2:first-child{display:none}
.page h1,.page_about h1,.page_masthead h1{font:400 34px/1.2 var(--serif);color:var(--nv);margin:0 0 .9rem}
.page_about h1+h2{font-size:20px;color:var(--ink-2);margin-top:0}
@media(max-width:600px){.page h1{font-size:27px}}

/* 30. About page: the design's colours, not OJS defaults */
.page_about a{color:var(--gd-d);text-decoration:underline;text-underline-offset:2px}
.page_about a:hover{color:var(--nv)}
.page_about strong{color:var(--nv)}
.page_about h2,.page_about h3{color:var(--nv)}
.page_about th{background:var(--nv);color:#fff;border-bottom:0}
.page_about tr:nth-child(even) td{background:var(--bg-2)}
.page_about ul li::marker{color:var(--gd)}
.page_about hr{border-top:2px solid var(--gd-pale)}
.page_about h1{border-bottom:2px solid var(--gd);padding-bottom:.6rem}
/* form: file fields */
.ijilr-form input[type=file]{display:block;width:100%;padding:.55rem;border:1px dashed var(--line-2);border-radius:var(--radius);background:var(--bg-2);font-size:.9rem}
.ijilr-form .ijilr-field small{display:block;margin-top:.3rem;color:var(--ink-3);font-size:.8rem}

/* ==========================================================================
   31. Page title from OJS · sidebar CTA · mobile menu button · scope grid ·
       author experiences (9 Sep 2026)
   ========================================================================== */
/* (a) One heading per static page: OJS's own title, styled as the page title.
   The page body no longer repeats it; the head script promotes it to <h1>. */
/* OJS 3.5 names the body after the page path (pkp_page_author-guidelines…),
   so the static-page wrapper is matched by its exact class instead. */
div.page[class="page"]>h2:first-child,.page:has(h1)>h2:first-child{display:block}
div.page[class="page"]>h2:first-child,div.page[class="page"]>h1.ij-title{
  font:400 34px/1.2 var(--serif)!important;color:var(--nv);margin:0 0 1.2rem;padding-bottom:.6rem;
  border-bottom:2px solid var(--gd)}
@media(max-width:600px){div.page[class="page"]>h2:first-child,div.page[class="page"]>h1.ij-title{font-size:27px!important}}

/* (b) Sidebar call to action: navy with white text on every inner page */
.ijilr-metrics .cta a{background:var(--nv)!important;color:#fff!important;border:1px solid var(--nv)}
.ijilr-metrics .cta a:hover,.ijilr-metrics .cta a:focus{background:var(--gd)!important;color:var(--nv)!important;border-color:var(--gd)}

/* (c) Mobile menu: the theme's toggle button rendered with no visible icon, so
   phones had no way into the navigation. Draw the three bars ourselves. */
@media(max-width:899px){
  .pkp_site_nav_toggle{display:block!important;position:absolute;top:12px;left:12px;width:42px;height:42px;
    background:#fff;border:1px solid var(--line);border-radius:6px;padding:0;cursor:pointer;z-index:1001;
    box-shadow:0 1px 3px rgba(26,28,66,.12)}
  .pkp_site_nav_toggle span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .pkp_site_nav_toggle::before{content:"";position:absolute;left:10px;right:10px;top:11px;height:18px;
    background:linear-gradient(var(--nv) 0 2px,transparent 2px 8px,var(--nv) 8px 10px,transparent 10px 16px,var(--nv) 16px 18px)}
  .pkp_site_nav_menu{background:var(--nv)!important}
  .pkp_site_nav_menu .pkp_navigation_primary>li>a{color:#fff}
  /* the lockup is taller than the theme's 40px bar: give the bar its height back */
  .pkp_head_wrapper{min-height:78px!important;height:auto!important}
  .pkp_site_name_wrapper{padding-bottom:8px}
}

/* (d) About page: Scope of the Journal as a column grid — one column per
   field, an italic serif heading over a gold rule, dotted list items with
   hairline dividers and a closing "allied areas" line. */
.page_about .ij-scope{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 2.4rem;margin:1.4rem 0 .6rem}
.page_about .ij-scope>div{padding:0 0 1.7rem;min-width:0}
.page_about .ij-scope h2{font:italic 400 22px/1.25 var(--serif);color:var(--nv);margin:0;padding-bottom:.55rem;border-bottom:2px solid var(--gd)}
.page_about .ij-scope .sc-lead{font-size:13.5px;line-height:1.5;color:var(--ink-3);margin:.55rem 0 0}
.page_about .ij-scope ul{list-style:none;padding:0;margin:.35rem 0 0}
.page_about .ij-scope li{margin:0;padding:.55rem 0 .55rem 1rem;border-bottom:1px solid var(--line);font-size:15px;line-height:1.45;color:var(--ink-2);position:relative}
.page_about .ij-scope li::marker{content:none}
.page_about .ij-scope li::before{content:"";position:absolute;left:0;top:1.05rem;width:5px;height:5px;border-radius:50%;background:var(--gd)}
.page_about .ij-scope li p{margin:0;font-size:inherit;line-height:inherit;color:inherit}
.page_about .ij-scope .sc-more{margin:.6rem 0 0;padding-left:1rem;font:italic 500 14.5px/1.5 var(--sans);position:relative}
.page_about .ij-scope .sc-more::before{content:"";position:absolute;left:0;top:.65rem;width:5px;height:5px;border-radius:50%;background:var(--gd)}
.page_about .ij-scope .sc-more a{color:var(--nv);text-decoration:none}
.page_about .ij-scope .sc-more a:hover{color:var(--gd-d);text-decoration:underline}

/* (e) Author Experiences: hero, submission form, star rating, review cards */
.ij-exp .ex-intro{font-size:15.5px;line-height:1.75;color:var(--ink-2);max-width:72ch}
.ij-exp .ex-hero{background:var(--nv);color:#fff;border-radius:8px;padding:2rem 1.7rem;margin:1.2rem 0 1.8rem;position:relative;overflow:hidden}
.ij-exp .ex-hero::after{content:"\201C";position:absolute;right:1.2rem;top:-1.6rem;font:400 180px/1 var(--serif);color:rgba(240,178,60,.16);pointer-events:none}
.ij-exp .ex-hero .k{font:600 10.5px/1 var(--sans);letter-spacing:1.6px;text-transform:uppercase;color:var(--gd)}
.ij-exp .ex-hero h2{font:400 28px/1.2 var(--serif);color:#fff;margin:.55rem 0 .5rem}
.ij-exp .ex-hero p{color:#dfe3f5;max-width:60ch;margin:0 0 1.1rem;font-size:15.5px;line-height:1.6}
.ij-exp .ex-hero .ijilr-btn{position:relative;z-index:1}
.ij-exp .ex-form{background:var(--bg-2);border:1px solid var(--line);border-top:3px solid var(--gd);border-radius:8px;padding:1.6rem;margin:1.6rem 0 2.2rem}
.ij-exp .ex-form h2{font:400 24px/1.25 var(--serif);color:var(--nv);margin:0 0 .35rem}
.ij-exp .ex-form .ex-sub{font-size:14.5px;line-height:1.6;color:var(--ink-3);margin:0 0 1.2rem;max-width:70ch}
.ij-exp .ex-form label{display:block;font:600 13.5px/1.4 var(--sans);color:var(--nv);margin:0 0 .3rem}
.ij-exp .ex-form input[type=text],.ij-exp .ex-form input[type=url],.ij-exp .ex-form textarea{display:block;width:100%;box-sizing:border-box;padding:.6rem .7rem;border:1px solid var(--line-2);border-radius:var(--radius);background:#fff;font:15px/1.5 var(--sans);color:var(--ink)}
.ij-exp .ex-form input:focus,.ij-exp .ex-form textarea:focus{outline:2px solid var(--gd);outline-offset:1px;border-color:var(--gd)}
.ij-exp .ex-form textarea{min-height:120px;resize:vertical}
.ij-exp .ex-field{margin:0 0 1rem}
.ij-exp .ex-field small{display:block;margin-top:.3rem;color:var(--ink-3);font-size:12.5px;line-height:1.5}
.ij-exp .ex-count{text-align:right}
.ij-exp .ex-hp{position:absolute;left:-9999px;top:-9999px;height:1px;overflow:hidden}
.ij-exp .ex-anti{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.ij-exp .ex-anti label{margin:0}
.ij-exp .ex-anti input{width:90px!important;display:inline-block!important}
.ij-exp .ex-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:13.5px;line-height:1.55;color:var(--ink-2);margin:0 0 .8rem;font-weight:400;text-transform:none}
.ij-exp .ex-consent input{margin:.25rem 0 0;flex:0 0 auto;width:auto}
.ij-exp .ex-form .ijilr-btn{margin-top:.4rem}
/* star rating: five radios painted right-to-left so the row fills up to the pick */
.ij-exp .ex-form .ij-stars{display:inline-flex;flex-direction:row-reverse;gap:2px;position:relative}
.ij-exp .ex-form .ij-stars input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ij-exp .ex-form .ij-stars label{cursor:pointer;font:400 34px/1 var(--serif);color:#c9cbd8;margin:0;padding:0 3px;transition:color .15s}
.ij-exp .ex-form .ij-stars label::before{content:"\2606"}
.ij-exp .ex-form .ij-stars input:checked~label::before,.ij-exp .ex-form .ij-stars label:hover::before,.ij-exp .ex-form .ij-stars label:hover~label::before{content:"\2605"}
.ij-exp .ex-form .ij-stars input:checked~label,.ij-exp .ex-form .ij-stars label:hover,.ij-exp .ex-form .ij-stars label:hover~label{color:var(--gd)}
.ij-exp .ex-form .ij-stars input:focus-visible+label{outline:2px solid var(--nv);outline-offset:2px;border-radius:3px}
.ij-exp .ex-rate-row{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}
.ij-exp .ex-rate-row small{margin:0}
/* cards */
.ij-exp .ex-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin:1.2rem 0 1.6rem}
.ij-exp .ex-card{background:#fff;border:1px solid var(--line);border-top:3px solid var(--gd);border-radius:8px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:.45rem}
.ij-exp .ex-card.is-featured{border-top-color:var(--nv);box-shadow:0 6px 18px rgba(26,28,66,.08)}
.ij-exp .ex-card .ex-feat{font:700 10px/1 var(--sans);letter-spacing:1.2px;text-transform:uppercase;color:var(--gd-d)}
.ij-exp .ex-card .ex-name{font:700 16px/1.3 var(--serif);color:var(--nv);margin:0}
.ij-exp .ex-card .ex-rate{color:var(--gd);font-size:18px;letter-spacing:2px;line-height:1}
.ij-exp .ex-card .ex-rate span{color:#c9cbd8}
.ij-exp .ex-card .ex-paper{font:600 13.5px/1.45 var(--sans);color:var(--ink);margin:0}
.ij-exp .ex-card .ex-paper a{color:var(--ink);text-decoration:none}
.ij-exp .ex-card .ex-paper a:hover{color:var(--gd-d)}
.ij-exp .ex-card .ex-text{font-size:14px;line-height:1.65;color:var(--ink-2);margin:0;flex:1 1 auto}
.ij-exp .ex-card .ex-link{font:600 13px/1.4 var(--sans);color:var(--nv);text-decoration:none;margin-top:.2rem}
.ij-exp .ex-card .ex-link:hover{color:var(--gd-d)}
.ij-exp .ex-card .ex-date{font-size:12px;color:var(--ink-3)}
.ij-exp .ex-empty{background:var(--bg-2);border:1px dashed var(--line-2);border-radius:8px;padding:1.2rem 1.4rem;font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.ij-exp .ex-why{max-width:72ch}
