/*
Theme Name: SEJ Journal
Theme URI: https://sej.so/
Author: SERDEC Education Journal
Author URI: https://sej.so/
Description: A refined, professional theme for academic journals — deep navy and gold, editorial typography and a comfortable reading measure. Built for the SERDEC Education Journal and pairs with the SEJ Author Portal plugin. Switching to this theme does not change or delete any of your content.
Version: 1.1.0
Requires at least: 5.6
Tested up to: 6.6
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sej-journal
Tags: two-columns, right-sidebar, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, editor-style
*/

/* ============ TOKENS ============ */
:root{
  --ink:#13233B; --ink-2:#1C3050; --ink-soft:#39496179; --text:#22303F;
  --paper:#FBF8F2; --paper-2:#F3ECDF; --card:#FFFFFF;
  --gold:#A8791E; --gold-2:#C6A24A; --gold-ink:#8A6216;
  --sky:#2C6AA0; --muted:#6A7385; --muted-2:#8A93A3;
  --line:#E7DFCF; --line-2:#D8CDB6; --hair:#EDE6D6;
  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --body:'Newsreader',Georgia,serif;
  --ui:'Inter',system-ui,-apple-system,sans-serif;
  --wrap:1200px; --measure:74ch;
  --sh-sm:0 1px 2px rgba(19,35,59,.05);
  --sh:0 2px 4px rgba(19,35,59,.05),0 18px 40px -26px rgba(19,35,59,.45);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--text);font-family:var(--body);font-size:18px;line-height:1.72;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,h5{font-family:var(--display);font-weight:600;line-height:1.14;color:var(--ink);margin:0 0 .45em;letter-spacing:-.01em}
p{margin:0 0 1.15em}
a{color:var(--sky);text-decoration:none;transition:color .15s}
a:hover{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
img{max-width:100%;height:auto;display:block}
hr{border:none;border-top:1px solid var(--line);margin:2em 0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 30px}
:focus-visible{outline:2.5px solid var(--sky);outline-offset:3px;border-radius:2px}
.kicker{font-family:var(--ui);font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}

/* ============ TOP UTILITY BAR ============ */
.topbar{background:var(--ink);color:#C9D3E1;font-family:var(--ui);font-size:12.5px;border-bottom:1px solid rgba(255,255,255,.08)}
.tb-inner{display:flex;align-items:center;justify-content:space-between;height:40px;gap:16px}
.tb-left{letter-spacing:.02em}
.tb-left b{color:var(--gold-2);font-weight:600}
.tb-right{display:flex;gap:22px;color:#AEB9CA;letter-spacing:.04em}
.tb-right a{color:#C9D3E1}
.tb-right a:hover{color:#fff;text-decoration:none}

/* ============ MASTHEAD ============ */
.site-header{background:linear-gradient(180deg,#fff, var(--paper));border-bottom:1px solid var(--line)}
.sh-inner{display:flex;align-items:center;gap:26px;padding:30px 0 28px}
.sh-logo{flex:none;display:flex;align-items:center;gap:20px}
.sh-seal{width:92px;height:92px;flex:none}
.custom-logo{max-height:92px;width:auto}
.sh-title{font-family:var(--display);font-weight:900;font-size:clamp(26px,4vw,40px);line-height:.98;color:var(--ink);text-decoration:none;letter-spacing:-.02em}
.sh-title:hover{color:var(--ink);text-decoration:none}
.sh-desc{font-family:var(--ui);font-size:13.5px;color:var(--muted);margin-top:11px;letter-spacing:.01em}
.sh-cta{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.sh-cta .chip{font-family:var(--ui);font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--gold-ink);border:1px solid var(--line-2);border-radius:100px;padding:6px 15px;background:#fff}

/* ============ NAV ============ */
.main-nav{background:var(--ink);position:sticky;top:0;z-index:50;box-shadow:0 10px 30px -20px rgba(0,0,0,.7)}
.main-nav .wrap{display:flex;align-items:center;min-height:54px}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.main-nav li{position:relative}
.main-nav a{font-family:var(--ui);color:#CAD4E2;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:0 18px;height:54px;display:inline-flex;align-items:center;text-decoration:none;transition:.15s}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,.05)}
.main-nav .current-menu-item>a,.main-nav .current_page_item>a,.main-nav .current-menu-ancestor>a{color:#fff;box-shadow:inset 0 -3px 0 var(--gold)}
.main-nav ul ul{display:none;position:absolute;top:54px;left:0;background:var(--ink-2);min-width:225px;flex-direction:column;box-shadow:0 18px 34px -12px rgba(0,0,0,.55);z-index:60;padding:6px 0}
.main-nav li:hover>ul{display:flex}
.main-nav ul ul a{height:auto;padding:11px 18px;width:100%;text-transform:none;letter-spacing:0;font-size:14px;font-weight:500}
.main-nav ul ul a:hover{background:rgba(255,255,255,.06)}
.menu-toggle{display:none;margin-left:auto;background:none;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:5px;padding:8px 12px;font-size:18px}

/* ============ LAYOUT ============ */
.site-main{padding:52px 0 64px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:52px;align-items:start}
.layout.full{grid-template-columns:1fr}
.page-title-band{border-bottom:2px solid var(--ink);padding-bottom:18px;margin-bottom:34px}
.page-title-band .kicker{display:block;margin-bottom:10px}
.page-title-band h1{font-size:clamp(28px,4.4vw,44px)}

/* ============ ARTICLE LIST (home / archive) ============ */
.entry{padding:30px 0;border-bottom:1px solid var(--line);position:relative}
.entry:first-child{border-top:1px solid var(--line)}
.entry-tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.tag{font-family:var(--ui);font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--gold-ink);background:var(--paper-2);border:1px solid var(--line);border-radius:100px;padding:4px 11px}
.tag.oa{color:#2f7d55;background:#eef7f1;border-color:#cbe6d6}
.entry-title{font-size:24px;line-height:1.24;margin:0 0 10px;letter-spacing:-.015em}
.entry-title a{color:var(--ink);background-image:linear-gradient(var(--gold),var(--gold));background-size:0% 1.5px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .3s}
.entry-title a:hover{color:var(--ink);text-decoration:none;background-size:100% 1.5px}
.entry-meta{font-family:var(--ui);font-size:13.5px;color:var(--muted);margin-bottom:12px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}
.entry-meta .author{color:var(--ink);font-weight:600}
.entry-meta .doi a{color:var(--sky)}
.entry-content{font-size:17.5px}
.entry-content p{margin:0 0 1.15em}
.read-more{font-family:var(--ui);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:6px}
.read-more:hover{color:var(--gold-ink);text-decoration:none;gap:9px}
.featured{border-radius:8px;margin-bottom:18px;overflow:hidden;border:1px solid var(--line)}

/* ============ SINGLE ARTICLE ============ */
.single-head{border-bottom:1px solid var(--line);padding-bottom:26px;margin-bottom:30px}
.single-head .kicker{display:block;margin-bottom:12px}
.single-head h1{font-size:clamp(28px,4.4vw,46px);line-height:1.08;letter-spacing:-.02em}
.single-article .entry-content{max-width:var(--measure)}
.single-article .entry-content{font-size:19px;line-height:1.78}
.single-article .entry-content>p:first-of-type::first-letter{font-family:var(--display);font-weight:600;float:left;font-size:4.4em;line-height:.82;padding:.02em .12em 0 0;color:var(--gold)}
.entry-content h2{font-size:27px;margin:1.6em 0 .5em}
.entry-content h3{font-size:21px;margin:1.4em 0 .4em}
.entry-content a{text-decoration:underline;text-decoration-color:rgba(44,106,160,.35);text-underline-offset:2px}
.entry-content a:hover{text-decoration-color:var(--gold)}
.entry-content ul,.entry-content ol{padding-left:1.3em;margin:0 0 1.15em}
.entry-content li{margin:.35em 0}
.entry-content blockquote{border-left:3px solid var(--gold);margin:1.6em 0;padding:.4em 1.2em;background:var(--paper-2);border-radius:0 8px 8px 0;font-style:italic;color:var(--ink-2)}
.entry-content img,.entry-content figure{border-radius:8px;margin:1.4em 0}
.entry-content figcaption,.wp-caption-text{font-family:var(--ui);font-size:13px;color:var(--muted);margin-top:8px;text-align:center}
.entry-content table{width:100%;border-collapse:collapse;font-family:var(--ui);font-size:14.5px;margin:1.4em 0}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.entry-content thead th{background:var(--paper-2);color:var(--ink);font-weight:600}
.entry-content code{background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:.1em .4em;font-size:.9em}

/* ============ BUTTONS & FORMS ============ */
.btn,button,input[type=submit],.wp-block-button__link{font-family:var(--ui);font-weight:600;font-size:14px;letter-spacing:.02em;background:var(--ink);color:#fff;border:none;border-radius:5px;padding:12px 24px;cursor:pointer;text-decoration:none;display:inline-block;transition:.18s}
.btn:hover,button:hover,input[type=submit]:hover{background:var(--ink-2);color:#fff;text-decoration:none;transform:translateY(-1px)}
.btn-gold{background:var(--gold)}
.btn-gold:hover{background:var(--gold-ink)}
.btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line-2)}
.btn-ghost:hover{background:#fff;border-color:var(--ink);transform:translateY(-1px)}
input[type=text],input[type=email],input[type=password],input[type=search],input[type=url],input[type=tel],textarea,select{font-family:var(--ui);font-size:15px;width:100%;max-width:100%;background:#fff;border:1px solid var(--line-2);border-radius:5px;padding:12px 14px;color:var(--ink)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 3px rgba(44,106,160,.12)}

/* ============ SIDEBAR ============ */
.sidebar{position:sticky;top:74px}
.sidebar .widget{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:22px 24px;margin-bottom:24px;box-shadow:var(--sh-sm)}
.sidebar .widget-title{font-family:var(--display);font-size:19px;font-weight:600;margin:0 0 16px;padding-left:13px;border-left:3px solid var(--gold);line-height:1.1}
.sidebar ul{list-style:none;margin:0;padding:0}
.sidebar li{padding:10px 0;border-top:1px solid var(--hair);font-family:var(--ui);font-size:14.5px}
.sidebar li:first-child{border-top:none}
.sidebar a{color:var(--sky)}
.sidebar a:hover{color:var(--gold)}
.sidebar .widget_search .search-form{display:flex;gap:8px}
.sidebar .widget_search button{padding:12px 16px}

/* ============ PAGINATION ============ */
.pagination{display:flex;gap:8px;flex-wrap:wrap;margin-top:36px;font-family:var(--ui)}
.pagination .page-numbers{padding:10px 16px;border:1px solid var(--line-2);border-radius:5px;color:var(--ink);text-decoration:none;font-size:14px;font-weight:500}
.pagination .current{background:var(--ink);color:#fff;border-color:var(--ink)}
.pagination a:hover{border-color:var(--gold);color:var(--gold);text-decoration:none}

/* ============ FOOTER ============ */
.site-footer{background:var(--ink);color:#C4CEDD;padding:56px 0 28px;margin-top:10px}
.footer-widgets{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:38px}
.site-footer .widget-title{font-family:var(--ui);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);border:none;padding:0;margin-bottom:16px}
.site-footer a{color:#C4CEDD;font-family:var(--ui);font-size:14px}
.site-footer a:hover{color:#fff}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{padding:5px 0}
.colophon{border-top:1px solid rgba(255,255,255,.12);margin-top:40px;padding-top:22px;font-family:var(--ui);font-size:12.5px;color:#8593A8;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* ============ RESPONSIVE ============ */
@media(max-width:920px){
  .layout{grid-template-columns:1fr;gap:40px}
  .sidebar{position:static}
}
@media(max-width:680px){
  body{font-size:17px}
  .topbar .tb-right{display:none}
  .sh-inner{flex-wrap:wrap;gap:16px;padding:22px 0}
  .sh-cta{display:none}
  .sh-seal,.custom-logo{width:70px;height:70px;max-height:70px}
  .menu-toggle{display:inline-block}
  .main-nav ul.nav-menu{display:none;flex-direction:column;width:100%}
  .main-nav ul.nav-menu.open{display:flex}
  .main-nav a{width:100%;height:auto;padding:14px 4px;border-top:1px solid rgba(255,255,255,.08)}
  .main-nav .current-menu-item>a{box-shadow:none}
  .main-nav ul ul{position:static;box-shadow:none}
  .single-article .entry-content>p:first-of-type::first-letter{font-size:3.4em}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* WP core helpers */
.alignleft{float:left;margin:6px 26px 14px 0}
.alignright{float:right;margin:6px 0 14px 26px}
.aligncenter{display:block;margin:14px auto}
.wp-caption{max-width:100%}
.gallery-caption{font-family:var(--ui);font-size:13px;color:var(--muted)}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
