/* The Journal (blog) — Feet and Pedals brand. All selectors are prefixed .jn to stay clear of the theme CSS. */
.jn{--jn-red:#bb1b25;--jn-red-d:#8f151d;--jn-black:#0b0b0b;--jn-paper:#f7f6f4;--jn-line:#e6e4e0;--jn-muted:#6c6b68;--jn-disp:'Big Shoulders Display','Inter',sans-serif;background:var(--jn-paper);color:var(--jn-black);font-family:'Inter',system-ui,sans-serif;font-size:15px;line-height:1.55}
.jn *,.jn *::before,.jn *::after{box-sizing:border-box}
.jn a{text-decoration:none;color:inherit}
.jn img{display:block;max-width:100%}
.jn .jn-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.jn h1,.jn h2,.jn h3,.jn h4{font-family:var(--jn-disp) !important;text-transform:uppercase;line-height:1.02 !important;letter-spacing:.3px;color:var(--jn-black);margin:0}

/* masthead */
.jn .jn-mast{background:var(--jn-black);color:#fff;position:relative;overflow:hidden;border-bottom:6px solid var(--jn-red)}
.jn .jn-mast::after{content:"";position:absolute;right:0;bottom:0;width:38%;height:100%;background:repeating-linear-gradient(135deg,var(--jn-red) 0 14px,transparent 14px 46px);clip-path:polygon(100% 0,100% 100%,0 100%);opacity:.9}
.jn .jn-mast .jn-wrap{position:relative;z-index:2;padding-top:52px;padding-bottom:46px}
.jn .jn-kick{display:inline-block;background:var(--jn-red);color:#fff;font-weight:700;font-size:11px;letter-spacing:2px;text-transform:uppercase;padding:6px 12px;margin-bottom:16px}
.jn .jn-mast h1{font-weight:900;font-size:78px;max-width:720px;color:#fff}
.jn .jn-mast h1 em{font-style:normal;color:#ff5a63}
.jn .jn-mast p{color:#d9d5cc;max-width:560px;font-size:17px;margin:14px 0 0}

/* category chips */
.jn .jn-chips{background:#fff;border-bottom:1px solid var(--jn-line)}
.jn .jn-chips .jn-wrap{display:flex;gap:10px;padding-top:14px;padding-bottom:14px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
.jn .jn-chips .jn-wrap::-webkit-scrollbar{display:none}
.jn .jn-chip{font-size:13px;font-weight:600;padding:8px 16px;border:1px solid var(--jn-line);border-radius:999px;background:#fff;flex:none;transition:border-color .15s}
.jn .jn-chip:hover{border-color:var(--jn-black)}
.jn .jn-chip.on{background:var(--jn-black);color:#fff;border-color:var(--jn-black)}

/* featured */
.jn .jn-feat{display:grid;grid-template-columns:1.15fr 1fr;background:#fff;border:1px solid var(--jn-line);margin:34px 0 10px}
.jn .jn-feat-im{background:#fff;border-right:1px solid var(--jn-line);display:flex;align-items:center;justify-content:center;min-height:360px}
.jn .jn-feat-im img{height:360px;width:100%;object-fit:contain}
.jn .jn-feat-tx{padding:34px 36px;display:flex;flex-direction:column;justify-content:center}
.jn .jn-cat{font-size:11px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;color:var(--jn-red)}
.jn .jn-feat h2{font-weight:900;font-size:46px;margin:10px 0 12px}
.jn .jn-feat h2 a:hover{color:var(--jn-red)}
.jn .jn-feat p{color:#3b3b39;margin:0 0 16px}
.jn .jn-meta{font-size:12.5px;color:var(--jn-muted);font-weight:500}
.jn .jn-btn{display:inline-block;background:var(--jn-red);color:#fff !important;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;font-size:12.5px;padding:13px 22px;margin-top:18px;align-self:flex-start;transition:background .15s}
.jn .jn-btn:hover{background:var(--jn-red-d)}

/* section head */
.jn .jn-sec{display:flex;align-items:center;gap:14px;margin:34px 0 18px}
.jn .jn-sec h2{font-size:34px;font-weight:900}
.jn .jn-sec i{flex:1;height:2px;background:var(--jn-line)}
.jn .jn-sec b{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--jn-red)}

/* cards */
.jn .jn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.jn .jn-card{background:#fff;border:1px solid var(--jn-line);display:flex;flex-direction:column;transition:border-color .15s,transform .15s}
.jn .jn-card:hover{border-color:var(--jn-black);transform:translateY(-2px)}
.jn .jn-card-im{position:relative;background:#fff;border-bottom:1px solid var(--jn-line);height:210px}
.jn .jn-card-im img{width:100%;height:100%;object-fit:contain}
.jn .jn-tag{position:absolute;left:0;top:14px;background:var(--jn-black);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;padding:5px 11px}
.jn .jn-card-bd{padding:18px 20px 20px;display:flex;flex-direction:column;gap:10px;flex:1}
.jn .jn-card h3{font-weight:800;font-size:25px}
.jn .jn-card:hover h3{color:var(--jn-red)}
.jn .jn-ex{color:#4a4a47;font-size:14px;margin:0}
.jn .jn-card .jn-meta{margin-top:auto}
.jn .jn-empty{background:#fff;border:1px solid var(--jn-line);padding:56px 24px;text-align:center;margin:34px 0}
.jn .jn-empty h2{font-size:38px;margin-bottom:8px}
.jn .jn-empty p{color:var(--jn-muted);margin:0}

/* pagination */
.jn .jn-pager{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:36px 0 6px}
.jn .jn-pg{min-width:46px;height:46px;padding:0 14px;border:1px solid #d6d3cc;background:#fff;color:var(--jn-black) !important;font-weight:700;font-size:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:border-color .15s,background .15s,color .15s}
.jn a.jn-pg:hover{border-color:var(--jn-black)}
.jn .jn-pg.on{background:var(--jn-black);color:#fff !important;border-color:var(--jn-black);box-shadow:inset 0 -3px 0 var(--jn-red)}
.jn .jn-pg.off{opacity:.35;pointer-events:none}
.jn .jn-pg.gap{border-color:transparent;background:transparent;color:var(--jn-muted) !important;min-width:28px;padding:0}
.jn .jn-pg svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.jn .jn-pg.nav{padding:0 18px;letter-spacing:1.2px;text-transform:uppercase;font-size:12px}
.jn .jn-pager-cap{width:100%;text-align:center;font-size:12px;color:var(--jn-muted);margin-top:4px;letter-spacing:.4px}

/* bands */
.jn .jn-cta{background:var(--jn-black);color:#fff;margin-top:44px;position:relative;overflow:hidden}
.jn .jn-cta::after{content:"";position:absolute;right:0;bottom:0;width:30%;height:100%;background:repeating-linear-gradient(135deg,var(--jn-red) 0 12px,transparent 12px 40px);clip-path:polygon(100% 0,100% 100%,0 100%);opacity:.9}
.jn .jn-cta .jn-wrap{position:relative;z-index:2;padding-top:40px;padding-bottom:40px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.jn .jn-cta h2{font-size:44px;font-weight:900;color:#fff}
.jn .jn-cta h2 em{font-style:normal;color:#ff5a63}
.jn .jn-cta p{color:#cfcac0;margin:6px 0 0}
.jn .jn-cta .jn-btn{margin:0;position:relative;z-index:3}
.jn .jn-news{background:#fff;border-top:1px solid var(--jn-line)}
.jn .jn-news .jn-wrap{padding-top:34px;padding-bottom:34px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.jn .jn-news h3{font-size:30px;font-weight:900}
.jn .jn-news p{color:var(--jn-muted);margin:4px 0 0}
.jn .jn-form{display:flex;flex:none}
.jn .jn-form input{width:300px;height:48px;border:1px solid var(--jn-line);border-right:0;background:var(--jn-paper);padding:0 16px;font-size:14px;border-radius:0;outline:0}
.jn .jn-form input:focus{border-color:var(--jn-black);background:#fff}
.jn .jn-form button{height:48px;background:var(--jn-red);color:#fff;border:0;letter-spacing:1.4px;text-transform:uppercase;font-size:12px;font-weight:700;padding:0 22px;cursor:pointer;border-radius:0}
.jn .jn-form button:hover{background:var(--jn-red-d)}

/* article */
.jn .jn-art-head{background:var(--jn-black);color:#fff;border-bottom:6px solid var(--jn-red);position:relative;overflow:hidden}
.jn .jn-art-head::after{content:"";position:absolute;right:0;bottom:0;width:26%;height:100%;background:repeating-linear-gradient(135deg,var(--jn-red) 0 12px,transparent 12px 40px);clip-path:polygon(100% 0,100% 100%,0 100%);opacity:.75}
.jn .jn-art-head .jn-wrap{position:relative;z-index:2;padding-top:44px;padding-bottom:40px;max-width:900px;margin:0 auto}
.jn .jn-art-head h1{color:#fff;font-weight:900;font-size:60px;margin:14px 0 14px}
.jn .jn-art-head .jn-meta{color:#cfcac0;font-size:13.5px}
.jn .jn-crumb{font-size:12px;letter-spacing:1.4px;text-transform:uppercase;font-weight:700;color:#cfcac0}
.jn .jn-crumb a:hover{color:#fff}
.jn .jn-art{max-width:780px;margin:0 auto;padding:0 24px}
.jn .jn-cover{background:#fff;border:1px solid var(--jn-line);margin:-1px 0 30px}
.jn .jn-cover img{width:100%;max-height:420px;object-fit:contain}
.jn .jn-credit{font-size:12px;color:var(--jn-muted);padding:8px 14px;background:#fff;border-top:1px solid var(--jn-line);text-align:right}
.jn .jn-body{font-size:18px;line-height:1.75;color:#1d1d1b}
.jn .jn-body p{margin:0 0 1.15em}
.jn .jn-body p:not([style]),.jn .jn-body li:not([style]),.jn .jn-body td:not([style]){color:#1d1d1b !important;font-size:18px !important;line-height:1.75 !important;font-family:'Inter',system-ui,sans-serif !important}
.jn .jn-body td{font-size:15px !important;line-height:1.5 !important}
.jn .jn-body blockquote p{font-size:19px !important}
.jn .jn-body h2{font-size:38px;font-weight:900;margin:1.6em 0 .5em}
.jn .jn-body h3{font-size:28px;font-weight:800;margin:1.4em 0 .45em}
.jn .jn-body h4{font-size:22px;font-weight:800;margin:1.2em 0 .4em}
.jn .jn-body a{color:var(--jn-red);text-decoration:underline;text-underline-offset:3px}
.jn .jn-body ul,.jn .jn-body ol{margin:0 0 1.2em 1.3em;padding:0}
.jn .jn-body li{margin:.35em 0}
.jn .jn-body blockquote{border-left:5px solid var(--jn-red);background:#fff;padding:16px 22px;margin:1.4em 0;font-size:19px;font-style:italic}
.jn .jn-body img{max-width:100%;height:auto;margin:1.2em auto}
.jn .jn-body table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:15px}
.jn .jn-body th{background:var(--jn-black);color:#fff;text-align:left;padding:9px 12px;font-size:12px;letter-spacing:1.2px;text-transform:uppercase}
.jn .jn-body td{border-bottom:1px solid var(--jn-line);padding:9px 12px;vertical-align:top}
.jn .jn-body hr{border:0;border-top:1px solid var(--jn-line);margin:2em 0}
.jn .jn-body pre,.jn .jn-body code{background:#efece6;padding:2px 6px;font-size:.9em}
.jn .jn-tags{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 8px}
.jn .jn-tags span{border:1px solid var(--jn-line);background:#fff;font-size:12.5px;font-weight:600;padding:5px 12px;border-radius:999px}
.jn .jn-share{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-top:1px solid var(--jn-line);border-bottom:1px solid var(--jn-line);padding:16px 0;margin:22px 0 30px}
.jn .jn-share b{font-size:12px;letter-spacing:1.4px;text-transform:uppercase}
.jn .jn-share ul{display:flex;gap:8px;list-style:none;margin:0;padding:0}
.jn .jn-share li a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--jn-line);background:#fff;color:var(--jn-black);transition:background .15s,color .15s}
.jn .jn-share li a:hover{background:var(--jn-black);color:#fff}
.jn .jn-author{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--jn-line);padding:18px 20px;margin-bottom:10px}
.jn .jn-author img{width:56px;height:56px;border-radius:50%;object-fit:cover}
.jn .jn-author b{display:block;font-family:var(--jn-disp);font-size:22px;text-transform:uppercase}
.jn .jn-author span{font-size:13px;color:var(--jn-muted)}

/* responsive */
@media (max-width:991px){
  .jn .jn-mast h1{font-size:60px}
  .jn .jn-grid{grid-template-columns:repeat(2,1fr)}
  .jn .jn-feat{grid-template-columns:1fr}
  .jn .jn-feat-im{min-height:0;border-right:0;border-bottom:1px solid var(--jn-line)}
  .jn .jn-feat-im img{height:280px}
  .jn .jn-art-head h1{font-size:46px}
}
@media (max-width:640px){
  .jn .jn-wrap{padding:0 16px}
  .jn .jn-mast .jn-wrap{padding-top:32px;padding-bottom:28px}
  .jn .jn-mast h1{font-size:46px}
  .jn .jn-mast p{font-size:15px}
  .jn .jn-mast::after{width:34%;opacity:.55}
  .jn .jn-feat{margin-top:22px}
  .jn .jn-feat-tx{padding:20px}
  .jn .jn-feat h2{font-size:34px}
  .jn .jn-grid{grid-template-columns:1fr;gap:12px}
  .jn .jn-card{flex-direction:row}
  .jn .jn-card-im{width:112px;height:auto;min-height:112px;border-bottom:0;border-right:1px solid var(--jn-line);flex:none}
  .jn .jn-tag{display:none}
  .jn .jn-card-bd{padding:12px 14px;gap:6px}
  .jn .jn-card h3{font-size:21px}
  .jn .jn-ex{display:none}
  .jn .jn-sec h2{font-size:28px}
  .jn .jn-cta .jn-wrap,.jn .jn-news .jn-wrap{flex-direction:column;align-items:flex-start;padding-top:28px;padding-bottom:28px}
  .jn .jn-cta h2{font-size:34px}
  .jn .jn-cta::after{display:none}
  .jn .jn-form{width:100%}
  .jn .jn-form input{width:auto;flex:1;min-width:0}
  .jn .jn-pg{min-width:42px;height:42px}
  .jn .jn-pg.nav .lbl{display:none}
  .jn .jn-pg.nav{padding:0 12px}
  .jn .jn-art{padding:0 16px}
  .jn .jn-art-head .jn-wrap{padding-top:30px;padding-bottom:28px}
  .jn .jn-art-head h1{font-size:36px}
  .jn .jn-art-head::after{display:none}
  .jn .jn-body{font-size:16.5px}
  .jn .jn-body p,.jn .jn-body li{font-size:16.5px !important}
  .jn .jn-body h2{font-size:30px}
}
