@import url("font-source.css");

:root{
  --ink:#343743; --ink-soft:#50566a; --blue:#122d6a; --blue-mid:#204cb1;
  --blue-bright:#2f59bd; --blue-soft:#e8ecff; --line:#9aa8c5; --paper:#fff;
  --ground:#f6f4f2; --red:#ff2638; --max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.58;background:var(--ground);font-size:15px;-webkit-font-smoothing:antialiased}
a{color:var(--blue-mid);text-decoration:none;transition:.2s ease}a:hover{opacity:.72}
button,input{font:inherit}.wrap{width:min(calc(100% - 48px),var(--max));margin:auto}

/* Header for inside pages */
.site-header{background:var(--blue);color:#fff;position:relative;z-index:10}
.header-row{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.brand{font-size:22px;color:#fff;line-height:1.15;white-space:nowrap}.brand span{display:block;font-size:11px;margin-top:7px;font-weight:400}.brand .issn{margin-top:3px}
.nav{display:flex;align-items:center;gap:22px;text-transform:uppercase;font-size:12px;font-weight:700}.nav a{color:#fff}.nav a[aria-current="page"]{border-bottom:2px solid #fff;padding-bottom:4px}
.menu-btn{display:none;border:1px solid rgba(255,255,255,.55);background:transparent;color:#fff;border-radius:4px;padding:8px 11px}

/* Home background: user-supplied image (v59, assets/home-background.jpg) on a near-black fallback */
.home{background:#05070d;color:var(--ink)}
.home-stage{position:relative;overflow:hidden;min-height:880px;padding:0 0 56px;background:#000 url("home-background.jpg") center center/cover no-repeat}
.home-wrap{width:min(calc(100% - 60px),1280px);margin:auto;position:relative;z-index:1;display:grid;grid-template-columns:400px 1fr;gap:110px;align-items:start}

/* Left home card */
.top-lead{background:#fff;border-radius:0 0 12px 12px;overflow:hidden;box-shadow:0 16px 42px rgba(0,0,0,.18)}
/* One continuous blue gradient behind BOTH the content and the curve.
   The SVG below contains only the red accent and the white cut-out. */
.top-lead-top{background:linear-gradient(to top,#204cb1,#0e2457)}
.top-lead-head{background:transparent;color:#fff;padding:52px 38px 18px;position:relative}
/* Keep decoration in its own flow box BELOW the search form. This prevents
   the curve from moving up when the title or navigation wraps on narrow screens.
   Header bottom padding keeps at least 16px of blue clear of the search field. */
.top-lead-curve{height:78px;background:url("header-panel.svg") no-repeat center bottom;background-size:100% 100%;margin-top:0;pointer-events:none}
.home-brand{font-size:24px;line-height:1.2;color:#fff;display:block;border-bottom:1px solid rgba(255,255,255,.65);padding-bottom:18px}.home-brand small{font-size:11px;display:block;margin-top:8px}.top-issn{font-size:12px;margin:13px 0 24px}.home-nav{display:flex;gap:24px;flex-wrap:wrap;margin:0 0 20px;padding:0;position:relative;z-index:2}.home-nav li{list-style:none}.home-nav a{color:#fff;font-size:12px;text-transform:uppercase;font-weight:700;display:flex;gap:7px;align-items:center}.nav-symbol{width:16px;height:16px;border:1.6px solid #fff;display:inline-grid;place-items:center;transform:rotate(45deg);font-size:8px}.nav-symbol.round{border-radius:50%;transform:none}.nav-symbol.tri{border-radius:0;clip-path:polygon(0 0,100% 50%,0 100%);background:#fff;border:none;width:15px;height:15px;transform:none}
.search-box{height:34px;background:#fff;border-radius:4px;display:flex;align-items:center;padding:0 12px;position:relative;z-index:2}.search-mark{width:13px;height:13px;border:2px solid #c2c7d3;border-radius:50%;position:relative;margin-right:9px;flex:none}.search-mark:after{content:"";position:absolute;width:6px;height:2px;background:#c2c7d3;right:-5px;bottom:-2px;transform:rotate(45deg)}.search-box input{border:0;outline:0;width:100%;color:#777}.search-box input::placeholder{color:#b1b5c0}
.lead-body{padding:22px 38px 34px;background:#fff;position:relative;z-index:2}.lead-body h2{color:#001e80;font-size:20px;margin:0 0 14px}.lead-body p{font-size:13px;color:#4e5565;margin:0 0 24px}.board-inline{display:flex;flex-wrap:wrap;gap:2px 14px;margin:0;padding:0}.board-inline li{list-style:none;font-size:12px;color:#50586d}.source-note{font-size:10px!important;color:#81899a!important;margin-top:12px!important}

/* Right home volume card */
.top-main{padding-top:76px}.volume-card{display:grid;grid-template-columns:108px 1fr;background:#fff;border-radius:11px;overflow:hidden;box-shadow:0 20px 54px rgba(0,0,0,.32)}
.volume-rail{background:linear-gradient(180deg,#2e58bd 0%,#4155aa 33%,#9a3b7d 65%,#ff2638 100%);color:#fff;text-align:center;padding-top:16px}.volume-number{font-size:64px;line-height:1;font-weight:300;border-bottom:1px solid rgba(255,255,255,.75);display:inline-block;padding:0 2px 5px}.volume-year{font-size:13px;font-weight:700;margin-top:7px}.volume-content{padding:24px 24px 10px}.paper-row{padding:0 0 20px;margin:0 0 19px;border-bottom:1px solid #aeb8cf}.paper-row:last-child{margin-bottom:4px}.paper-row h3{font-size:15px;line-height:1.3;color:#1645bd;margin:0 0 8px;font-weight:500}.paper-row p{font-size:12px;margin:0 0 8px;color:#333}.pdf-chip{display:inline-block;background:#2e59bd;color:#fff;font-size:9px;font-weight:bold;padding:3px 6px;border-radius:1px;text-transform:uppercase}.back-link{text-align:right;color:#fff;text-transform:uppercase;font-weight:700;font-size:11px;margin:22px 0 0}.back-link a{color:#fff}
.placeholder-note{font-size:11px;color:#697086;background:#f3f5fa;border:1px dashed #bcc5d7;padding:10px 12px;margin-bottom:18px}

/* Inner pages */
.page-bg{background:#f6f4f2;min-height:55vh}.page-head{padding:46px 0 24px}.page-head h1{font-size:34px;color:#001e80;margin:0}.page-head p{margin:6px 0 0;color:#6b7180}.content{padding:0 0 62px}.panel,.volume{background:#fff;border-radius:8px;padding:28px 32px;box-shadow:0 6px 24px rgba(20,35,80,.08);margin-bottom:20px}.panel h2,.panel h3{color:#001e80}.editable{border-left:6px solid #2e58bd}.notice{background:#fff;border:1px solid #cdd4e3;padding:14px 17px;margin-bottom:20px;font-size:13px}.volume{padding:0;overflow:hidden}.volume-head{background:linear-gradient(90deg,#2e58bd,#4656aa);color:#fff;padding:18px 25px}.volume-head h2{margin:0}.volume .paper{padding:22px 25px;border-bottom:1px solid #cdd4e3}.volume .paper:last-child{border-bottom:0}.volume .paper h3{color:#1645bd;font-size:17px;margin:0 0 6px}.meta{font-size:13px;color:#565d6e}.pdf{display:inline-block;background:#2e58bd;color:#fff;padding:4px 8px;font-size:11px;font-weight:bold;border-radius:2px}.address{font-style:normal}

/* Footer */
.site-footer{background:#173875;color:#fff}.footer-row{min-height:150px;display:flex;justify-content:space-between;align-items:center;gap:50px}.footer-brand{font-size:20px;line-height:1.2}.footer-brand small{font-size:10px;display:block;margin-top:8px}.footer-contact{border-left:1px solid rgba(255,255,255,.45);padding-left:24px;font-size:11px;line-height:1.55}.site-footer a{color:#fff}.copyright{background:#2858be;color:#fff;font-size:10px;padding:14px 0}
.home-footer{margin-top:0}

@media(max-width:1000px){.home-wrap{grid-template-columns:350px 1fr;gap:50px}.volume-card{grid-template-columns:90px 1fr}.volume-number{font-size:54px}}
@media(max-width:780px){.wrap{width:min(calc(100% - 28px),var(--max))}.header-row{min-height:72px}.brand{font-size:18px}.menu-btn{display:block}.nav{display:none;position:absolute;left:14px;right:14px;top:66px;background:#122d6a;padding:18px;flex-direction:column;align-items:flex-start;box-shadow:0 12px 30px rgba(0,0,0,.25)}.nav.open{display:flex}.home-stage{padding-bottom:30px}.home-wrap{width:min(calc(100% - 28px),600px);grid-template-columns:1fr;gap:28px}.top-lead{border-radius:0 0 10px 10px}.top-main{padding-top:0}.volume-card{grid-template-columns:78px 1fr}.volume-number{font-size:46px}.top-lead-head{padding:36px 26px 16px}.top-lead-curve{height:68px}.lead-body{padding:20px 26px 28px}.footer-row{align-items:flex-start;flex-direction:column;padding:32px 0}.footer-contact{border-left:0;border-top:1px solid rgba(255,255,255,.35);padding:18px 0 0;width:100%}}
@media(max-width:470px){.home-nav{gap:12px}.home-nav a{font-size:10px}.volume-card{grid-template-columns:62px 1fr}.volume-content{padding:18px 15px 6px}.paper-row h3{font-size:14px}.volume-number{font-size:37px}.volume-year{font-size:10px}.home-brand{font-size:21px}.page-head h1{font-size:30px}.panel{padding:22px 20px}}

/* =====================================================================
   v8: typography recovered from themes/ymj_theme/style.css.
   Text: Roboto. Display: Futura PT. Local fallbacks are NOT exact copies.
   Optional approved Adobe hosting is configured in font-source.css.
   The v5 curve and the v6/v7 card geometry are deliberately left unchanged.
   ===================================================================== */
:root {
  --ymj-font-text: "roboto", "Roboto", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --ymj-font-display: "futura-pt", "Futura PT", Futura, "Century Gothic", "Avenir Next", Avenir, "Jost", "Lato", "URW Gothic", "Trebuchet MS", sans-serif;
}
body {
  font-family: var(--ymj-font-text);
  font-size: clamp(14px, 1.7vw, 16px);
  font-weight: 400;
  letter-spacing: .02em;
  line-height: 1.65;
  font-kerning: normal;
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}
button, input, select, textarea { font: inherit; letter-spacing: inherit; }

/* The original identity and volume figures used the light (300) cut. */
.home-brand, .brand, .footer-brand {
  font-family: var(--ymj-font-display);
  font-size: 25px;
  font-weight: 300;
  line-height: 1.3;
  letter-spacing: .02em;
}
.brand { min-width: 0; white-space: normal; }
.home-brand small, .brand span, .footer-brand small {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 300;
}
.top-issn, .brand .issn, .footer-brand small:nth-of-type(2) {
  font-family: var(--ymj-font-text);
  font-size: 13px;
  font-weight: 400;
}
.home-nav a, .nav, .menu-btn {
  font-family: var(--ymj-font-display);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .02em;
}
.home-nav a { white-space: nowrap; }
.home-nav { column-gap: 18px; row-gap: 12px; }
.nav-symbol { flex-shrink: 0; }
.search-box input { min-width: 0; font-family: var(--ymj-font-text); font-size: 13px; }

/* Keep prose and article titles in the text family, not the display face. */
.lead-body h2 {
  font-family: var(--ymj-font-text);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.45;
}
.lead-body p, .board-inline li { font-size: 13px; line-height: 1.65; }
.paper-row h3, .paper-row p, .archive-panel, .panel, .footer-contact {
  font-family: var(--ymj-font-text);
}
.home .top-main .paper-row h3, .volumes-page .paper-row h3 {
  font-weight: 500;
  letter-spacing: .02em;
}
.page-head h1, .volumes-page .volumes-title {
  font-family: var(--ymj-font-display);
  font-weight: 500;
  letter-spacing: .02em;
  line-height: 1.2;
}
.home .top-main .volume-number, .volumes-page .volume-number {
  font-family: var(--ymj-font-display);
  font-weight: 300;
  letter-spacing: .02em;
}
.home .top-main .volume-year, .volumes-page .volume-year {
  font-family: var(--ymj-font-text);
  font-weight: 400;
}
.home .top-main .back-link a {
  font-family: var(--ymj-font-display);
  font-weight: 700;
  letter-spacing: .02em;
}
.footer-contact { font-size: 13px; font-style: normal; line-height: 1.65; }

/* Accommodate fallback metrics without touching the approved accent curve. */
@media (max-width: 1000px) and (min-width: 781px) {
  body:not(.home):not(.volumes-page) .menu-btn { display: block; flex: none; }
  body:not(.home):not(.volumes-page) .nav {
    display: none;
    position: absolute;
    left: 24px;
    right: 24px;
    top: 100%;
    padding: 18px;
    background: #122d6a;
    flex-direction: column;
    align-items: flex-start;
    box-shadow: 0 12px 30px rgba(0,0,0,.25);
  }
  body:not(.home):not(.volumes-page) .nav.open { display: flex; }
}
@media (max-width: 780px) {
  .brand, .volumes-page .brand { font-size: 21px; line-height: 1.3; }
  .header-row { padding-top: 14px; padding-bottom: 14px; }
  .nav { top: 100%; }
  .menu-btn { flex-shrink: 0; }
  .footer-brand { font-size: 23px; }
}
@media (max-width: 470px) {
  .home-brand { font-size: 23px; }
  .home-nav { column-gap: 14px; }
  .home-nav a { font-size: 11px; }
  .home-brand small, .brand span, .footer-brand small { font-size: 12px; }
  .brand, .volumes-page .brand { font-size: 19px; }
}

/* =====================================================================
   v9: keep the journal title on one line, matching the original theme.
   The size eases down on narrow screens instead of wrapping.
   ===================================================================== */
.home-brand,
.brand {
  white-space: nowrap;
}
.home-brand {
  font-size: 25px;
}
.brand {
  font-size: clamp(18px, 2.1vw, 25px);
  flex: 1 1 auto;
}
.footer-brand {
  white-space: nowrap;
}
@media (max-width: 780px) {
  .brand, .volumes-page .brand {
    font-size: clamp(18px, 4.4vw, 21px);
  }
  .footer-brand {
    font-size: clamp(19px, 4.8vw, 23px);
  }
}
@media (max-width: 470px) {
  .home-brand {
    font-size: clamp(17px, 5.5vw, 22px);
    letter-spacing: .01em;
  }
  .brand, .volumes-page .brand {
    font-size: clamp(17px, 4.8vw, 19px);
    letter-spacing: .01em;
  }
  .footer-brand {
    font-size: clamp(18px, 5vw, 21px);
    letter-spacing: .01em;
  }
}

/* v9 final fit: preserve a single-line journal title even on narrow screens. */
.home-brand {
  white-space: nowrap;
  font-size: clamp(16px, 5.2vw, 25px);
  letter-spacing: .01em;
}
.brand, .volumes-page .brand {
  white-space: nowrap;
  font-size: clamp(14px, 4.6vw, 25px);
  letter-spacing: .01em;
}
.footer-brand {
  white-space: nowrap;
  font-size: clamp(16px, 5vw, 23px);
  letter-spacing: .01em;
}
