/*
Theme Name: Youth For Bharat
Theme URI: https://youthforbharat.example
Author: Youth For Bharat
Author URI: https://youthforbharat.example
Description: A quiet, premium editorial theme for Youth For Bharat — a blog of essays on India's history, culture and the slow, patient work of building a country worth loving. Warm-paper palette, Newsreader + DM Sans typography, a tricolor identity, a rotating hero, and long-form article layout. Ships with self-hosted Anek Devanagari & Anek Kannada and automatic per-script fonts, so Hindi / Marathi and Kannada posts render in the correct Indic typeface.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: youth-for-bharat
Tags: blog, editorial, magazine, custom-logo, featured-images, translation-ready, threaded-comments, full-width-template
*/

/* ============ TOKENS ============ */
:root{
  --paper:#FBFAF7;
  --panel:#ffffff;
  --wash:#F4F1E9;
  --ink:#211d17;
  --ink-strong:#12100c;
  --ink-soft:#5c5546;
  --ink-mute:#8a8172;
  --line:rgba(33,29,23,.14);
  --navy:#0f1a2b;
  --navy-2:#141f31;
  --saffron:#FF9933;
  --orange:#c05f14;
  --green:#138808;
  --gold:#c99a1f;
  --f-serif:'Newsreader',Georgia,'Times New Roman',serif;
  --f-body:'DM Sans',system-ui,-apple-system,sans-serif;
  --f-label:'Inter',system-ui,sans-serif;
  --maxw:1200px;
}

/* ============ RESET ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
/* Full-bleed: neutralise WordPress' default content-width box so the site
   fills the screen. The masthead / footer / hero all span edge-to-edge; only
   the inner containers below re-introduce a max-width. */
html,body{width:100%!important;max-width:100%!important;margin:0!important;padding:0!important;overflow-x:hidden}
.wp-site-blocks,.is-layout-constrained,.entry-content,.site,#page,.site-content,.content-area,main.wp-block-group{max-width:none!important;width:auto!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);-webkit-font-smoothing:antialiased;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
::selection{background:var(--saffron);color:var(--ink-strong)}
h1,h2,h3,h4{margin:0;font-weight:400}
button,input,textarea{font-family:inherit}

/* ============ ANIMATIONS ============ */
@keyframes yfb-up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.yfb-rev{animation:yfb-up .8s cubic-bezier(.2,.6,.3,1) both}

/* ============ PER-SCRIPT INDIC FONTS ============ */
.lang-hi,.lang-hi :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Devanagari',var(--f-body)!important}
.lang-mr,.lang-mr :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Devanagari',var(--f-body)!important}
.lang-kn,.lang-kn :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Kannada',var(--f-body)!important}
.lang-ta,.lang-ta :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Tamil',var(--f-body)!important}
.lang-te,.lang-te :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Telugu',var(--f-body)!important}
.lang-ml,.lang-ml :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Malayalam',var(--f-body)!important}
.lang-bn,.lang-bn :is(h1,h2,h3,h4,p,span,a,li,input,button,figcaption,time,small,b,strong,em,blockquote){font-family:'Anek Bangla',var(--f-body)!important}

/* ============ UTILITIES ============ */
.yfb-serif{font-family:var(--f-serif)}
.yfb-wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px}
.yfb-narrow{max-width:720px;margin:0 auto;padding:0 40px}
.yfb-rule{height:1px;background:var(--line)}
.yfb-link{transition:color .25s}
.yfb-link:hover{color:var(--orange)}
.yfb-btn{transition:transform .2s,background .25s,color .25s,border-color .25s;cursor:pointer}
.yfb-btn:hover{transform:translateY(-1px)}
.yfb-btn:active{transform:translateY(0)}

.yfb-pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-label);font-weight:600;font-size:13px;background:var(--ink-strong);color:var(--paper);padding:12px 22px;border-radius:30px;border:none}
.yfb-pill i{color:var(--saffron);font-style:normal}

/* placeholder image */
.yfb-ph{background:#EBE6DB;position:relative;overflow:hidden}
.yfb-ph::after{content:attr(data-cap);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--f-label);font-size:9.5px;letter-spacing:.24em;color:#b3a992;text-transform:uppercase}

.yfb-avatar{border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--f-label);font-weight:600;color:var(--ink-strong);flex:none;background:#f0c04a}

/* ============ MASTHEAD ============ */
.yfb-tricolor{position:absolute;top:0;left:0;right:0;height:3px;display:flex;z-index:2}
.yfb-tricolor span{flex:1}
.yfb-tricolor span:nth-child(1){background:var(--saffron)}
.yfb-tricolor span:nth-child(2){background:#f0ece1}
.yfb-tricolor span:nth-child(3){background:var(--green)}

.yfb-masthead{background:var(--navy);position:relative}
.yfb-masthead__inner{max-width:var(--maxw);margin:0 auto;padding:38px 40px 20px;text-align:center;position:relative}
.yfb-logo img{height:52px;width:auto;display:inline-block}
.yfb-masthead__controls{position:absolute;right:40px;top:40px;display:flex;align-items:center;gap:18px;font-family:var(--f-label);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.yfb-masthead__controls a,.yfb-masthead__controls button{color:#cdd8e4;background:none;border:none;display:flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;letter-spacing:.08em;text-transform:uppercase;transition:color .25s}
.yfb-masthead__controls a:hover,.yfb-masthead__controls button:hover{color:var(--orange)}
.yfb-langwrap{position:relative}
.yfb-langmenu{position:absolute;top:30px;right:0;z-index:60;width:190px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 24px 50px -18px rgba(20,15,8,.4);padding:6px;text-transform:none;letter-spacing:0;display:none}
.yfb-langmenu.is-open{display:block}
.yfb-langmenu button{display:flex;justify-content:space-between;width:100%;color:var(--ink)!important;font-family:var(--f-body);font-size:13px;padding:8px 10px;border-radius:7px;text-transform:none;letter-spacing:0;transition:background .2s}
.yfb-langmenu button:hover{background:var(--wash)}
.yfb-langmenu button.is-active{color:var(--orange)!important;font-weight:700}
.yfb-langmenu button span:last-child{font-size:10px;color:#a49b8b}

.yfb-nav{margin-top:16px}
.yfb-nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:wrap;font-family:var(--f-label);font-size:12.5px;font-weight:500;letter-spacing:.02em}
.yfb-nav a{color:#9fb0c4;padding-bottom:4px;border-bottom:1.5px solid transparent;transition:color .25s,border-color .25s}
.yfb-nav a:hover{color:#fff}
.yfb-nav .current-menu-item>a,.yfb-nav .current_page_item>a{color:#fff;border-color:var(--saffron)}

/* search overlay */
.yfb-search{position:fixed;inset:0;z-index:70;background:rgba(20,15,8,.4);backdrop-filter:blur(4px);display:none;justify-content:center;padding-top:16vh}
.yfb-search.is-open{display:flex}
.yfb-search__box{width:min(640px,92vw);height:max-content;background:var(--paper);border-radius:14px;box-shadow:0 30px 80px -20px rgba(20,15,8,.5);overflow:hidden}
.yfb-search__box form{display:flex;align-items:center;gap:12px;padding:20px 22px;margin:0}
.yfb-search__box input{flex:1;border:none;outline:none;background:transparent;font-family:var(--f-serif);font-size:22px;color:var(--ink)}
.yfb-search__box .esc{font-family:var(--f-label);font-size:11px;color:var(--ink-mute);border:1px solid var(--line);border-radius:6px;padding:3px 7px}

/* ============ MAIN ============ */
.yfb-main{max-width:var(--maxw);margin:0 auto;padding:0 40px}

/* ============ HERO SLIDER ============ */
.yfb-hero{padding:48px 0 8px}
.yfb-hero__viewport{overflow:hidden}
.yfb-hero__track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.yfb-slide{flex:0 0 100%;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:0 2px}
.yfb-slide__body h2{font-family:var(--f-serif);font-size:54px;font-weight:400;line-height:1.03;letter-spacing:-.025em;color:var(--ink-strong);margin-bottom:20px;text-wrap:balance}
.yfb-slide__body h2 a{color:inherit}
.yfb-slide__dek{font-family:var(--f-serif);font-size:20px;font-weight:300;line-height:1.5;color:#4a4437;margin-bottom:24px;max-width:52ch;text-wrap:pretty}
.yfb-slide__foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.yfb-slide__foot .yfb-avatar{width:40px;height:40px;font-size:13px}
.yfb-slide__byline{font-family:var(--f-label);font-size:13px;color:var(--ink-mute)}
.yfb-slide__byline b{color:var(--ink)}
.yfb-slide__cat{font-weight:600}
.yfb-slide__cta{margin-left:auto}
.yfb-slide__media{position:relative}
.yfb-slide__media a{display:block;aspect-ratio:5/4;border-radius:4px;box-shadow:0 30px 60px -30px rgba(20,15,8,.4);overflow:hidden}
.yfb-slide__media img{width:100%;height:100%;object-fit:cover}
.yfb-slide__caption{font-family:var(--f-serif);font-style:italic;font-size:13.5px;color:var(--ink-mute);margin-top:12px;padding-left:2px}
.yfb-hero__controls{display:flex;align-items:center;justify-content:space-between;margin-top:26px}
.yfb-dots{display:flex;gap:9px;align-items:center}
.yfb-dots button{height:8px;width:8px;border-radius:5px;background:rgba(33,29,23,.2);border:none;padding:0;cursor:pointer;transition:all .35s}
.yfb-dots button.is-active{width:28px;background:var(--orange)}
.yfb-arrows{display:flex;gap:10px}
.yfb-arrows button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(33,29,23,.18);background:#fff;cursor:pointer;font-size:16px;color:var(--ink-strong)}

/* ============ MANIFESTO ============ */
.yfb-manifesto{margin:64px 0;background:var(--navy);border-radius:8px;padding:52px 56px;text-align:center;position:relative;overflow:hidden}
.yfb-manifesto p{font-family:var(--f-serif);font-size:30px;font-weight:300;line-height:1.4;color:#f4f1ea;max-width:46ch;margin:0 auto;font-style:italic;text-wrap:balance}

/* ============ LATEST FEED ============ */
.yfb-section-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:10px}
.yfb-section-head h2{font-family:var(--f-serif);font-size:30px;font-weight:400;letter-spacing:-.01em;color:var(--ink-strong)}
.yfb-section-head a{font-family:var(--f-label);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-mute)}
.yfb-feed{padding-bottom:20px}
.yfb-feed .yfb-rule{background:rgba(33,29,23,.22)}
.yfb-post{display:grid;grid-template-columns:64px 1fr 132px;gap:26px;align-items:start;padding:26px 20px;margin:0 -20px;border-bottom:1px solid rgba(33,29,23,.12);transition:background .3s}
.yfb-post:hover{background:var(--wash)}
.yfb-post:hover h3{color:var(--orange)}
.yfb-post__num{font-family:var(--f-serif);font-size:26px;font-weight:300;color:#c4baa6;line-height:1.2}
.yfb-post__body{min-width:0}
.yfb-post__body h3{font-family:var(--f-serif);font-size:29px;font-weight:400;line-height:1.12;letter-spacing:-.01em;color:var(--ink-strong);margin-bottom:11px;text-wrap:pretty;transition:color .25s}
.yfb-post__body p{font-size:14.5px;line-height:1.6;color:var(--ink-soft);max-width:64ch;text-wrap:pretty;margin:0}
.yfb-post__meta{text-align:right;font-family:var(--f-label);font-size:12px;color:var(--ink-mute);padding-top:2px}
.yfb-post__meta b{color:var(--ink);font-weight:500;display:block;margin-bottom:2px}

/* ============ TOPICS + CONTRIBUTORS ============ */
.yfb-columns{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;padding:56px 0;border-top:1px solid var(--line);margin-top:36px}
.yfb-columns h2{font-family:var(--f-serif);font-size:26px;font-weight:400;color:var(--ink-strong);margin-bottom:22px}
.yfb-topics{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.yfb-topic{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid rgba(33,29,23,.1);border-radius:10px;padding:16px 18px;transition:transform .35s cubic-bezier(.2,.6,.3,1),border-color .35s}
.yfb-topic:hover{transform:translateY(-3px);border-color:var(--gold)}
.yfb-topic .n{font-family:var(--f-serif);font-size:20px;color:var(--ink-strong);display:block}
.yfb-topic .c{font-family:var(--f-label);font-size:11.5px;color:var(--ink-mute)}
.yfb-topic .arw{color:var(--orange);font-size:15px}
.yfb-contribs{display:flex;flex-direction:column;gap:2px}
.yfb-contrib{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid rgba(33,29,23,.1)}
.yfb-contrib .yfb-avatar{width:40px;height:40px;font-size:13px}
.yfb-contrib .n{font-family:var(--f-serif);font-size:17px;color:var(--ink-strong)}
.yfb-contrib .b{font-family:var(--f-label);font-size:11.5px;color:var(--ink-mute)}

/* ============ NEWSLETTER ============ */
.yfb-newsletter{max-width:1000px;margin:56px auto 0;padding:0 40px}
.yfb-newsletter__inner{text-align:center;padding:52px 24px;background:radial-gradient(circle at 50% -10%,#fff3e3,var(--paper) 62%);border:1px solid rgba(255,153,51,.24);border-radius:12px}
.yfb-newsletter .kicker{font-family:var(--f-label);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange);margin-bottom:14px}
.yfb-newsletter h2{font-family:var(--f-serif);font-size:34px;font-weight:400;line-height:1.08;letter-spacing:-.02em;color:var(--ink-strong);margin:0 auto 12px;max-width:20ch;text-wrap:balance}
.yfb-newsletter p{font-size:14.5px;color:var(--ink-soft);margin:0 auto 26px;max-width:44ch}
.yfb-newsletter form{display:flex;gap:10px;max-width:400px;margin:0 auto}
.yfb-newsletter input{flex:1;background:#fff;border:1px solid rgba(33,29,23,.18);border-radius:30px;padding:13px 20px;font-family:var(--f-body);font-size:15px;outline:none}
.yfb-newsletter button{font-family:var(--f-label);font-weight:600;font-size:14px;background:var(--ink-strong);color:var(--paper);border:none;padding:0 24px;border-radius:30px;cursor:pointer}

/* ============ FOOTER ============ */
.yfb-footer{background:var(--navy);color:#e7ecf3;margin-top:64px;padding:52px 0 30px}
.yfb-footer__cols{max-width:var(--maxw);margin:0 auto;padding:0 40px 36px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:44px}
.yfb-footer img{height:42px;width:auto;display:block;margin-bottom:16px}
.yfb-footer__about{font-family:var(--f-serif);font-style:italic;font-size:16px;font-weight:300;line-height:1.55;color:#9fb0c4;margin:0;max-width:32ch}
.yfb-footer__col h4{font-family:var(--f-label);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--saffron);margin-bottom:14px}
.yfb-footer__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.yfb-footer__col a{font-family:var(--f-body);font-size:13.5px;color:#a9b6c6}
.yfb-footer__col a:hover{color:#fff}
.yfb-footer__bottom{max-width:var(--maxw);margin:0 auto;padding:22px 40px 0;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-family:var(--f-label);font-size:11.5px;color:#7688a0}
.yfb-footer__bottom .satya{letter-spacing:.14em}

/* ============ SINGLE / ARTICLE ============ */
.yfb-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:transparent}
.yfb-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--saffron),var(--green));transition:width .1s linear}
.yfb-article-mast{max-width:1180px;margin:0 auto;padding:20px 40px;display:flex;align-items:center;justify-content:space-between}
.yfb-article-mast .brand{display:inline-flex;align-items:center;gap:11px}
.yfb-article-mast .brand .bars{display:flex;gap:2.5px}
.yfb-article-mast .brand .bars span{width:6px;height:22px;border-radius:2px}
.yfb-article-mast .brand .wm{font-family:var(--f-serif);font-size:25px;font-weight:500;letter-spacing:-.01em;color:var(--ink-strong)}
.yfb-article-mast .brand .wm em{font-style:italic;font-weight:400;color:var(--orange)}
.yfb-article-mast__actions{display:flex;align-items:center;gap:20px}
.yfb-article-mast__actions .back{font-family:var(--f-label);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}

.yfb-article-head{max-width:720px;margin:0 auto;padding:52px 40px 0;text-align:center}
.yfb-article-head .kicker{font-family:var(--f-label);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--orange);font-weight:600;margin-bottom:20px}
.yfb-article-head h1{font-family:var(--f-serif);font-size:52px;font-weight:400;line-height:1.04;letter-spacing:-.02em;color:var(--ink-strong);margin-bottom:22px;text-wrap:balance}
.yfb-article-head .dek{font-family:var(--f-serif);font-size:22px;font-weight:300;font-style:italic;line-height:1.5;color:var(--ink-soft);margin:0 auto 30px;max-width:34ch;text-wrap:pretty}
.yfb-article-head .short-rule{max-width:80px;margin:0 auto 26px;height:1px;background:rgba(33,29,23,.3)}
.yfb-article-head .byline{display:inline-flex;align-items:center;gap:14px}
.yfb-article-head .byline .yfb-avatar{width:44px;height:44px;font-size:14px}
.yfb-article-head .byline .meta{text-align:left;font-family:var(--f-label);font-size:13px;color:var(--ink-mute)}
.yfb-article-head .byline .meta b{color:var(--ink);font-weight:500}

.yfb-figure{max-width:1200px;margin:40px auto 0;padding:0 40px}
.yfb-figure .frame{aspect-ratio:16/8;border-radius:5px;box-shadow:0 30px 60px -34px rgba(20,15,8,.4);overflow:hidden}
.yfb-figure .frame img{width:100%;height:100%;object-fit:cover}
.yfb-figure figcaption{font-family:var(--f-serif);font-style:italic;font-size:13.5px;color:var(--ink-mute);margin-top:12px;text-align:center}

.yfb-article-grid{max-width:1200px;margin:0 auto;padding:44px 40px 0;display:grid;grid-template-columns:56px minmax(0,1fr) 260px;gap:56px;align-items:start}
.yfb-share{position:sticky;top:90px;display:flex;flex-direction:column;gap:10px;align-items:center}
.yfb-share button,.yfb-share a{width:42px;height:42px;border-radius:50%;border:1px solid rgba(33,29,23,.16);background:#fff;color:var(--ink-strong);display:flex;align-items:center;justify-content:center;font-size:15px}

.yfb-prose{min-width:0;font-size:21px}
.yfb-prose p{font-family:var(--f-serif);font-size:1em;font-weight:400;line-height:1.66;color:#2b271f;margin:0 0 26px}
.yfb-prose>p:first-of-type::first-letter{font-size:64px;font-weight:500;float:left;line-height:.82;padding:6px 12px 0 0;color:var(--orange);font-family:var(--f-serif)}
.yfb-prose h2{font-family:var(--f-serif);font-size:30px;font-weight:500;letter-spacing:-.01em;color:var(--ink-strong);margin:44px 0 16px;line-height:1.15}
.yfb-prose h3{font-family:var(--f-serif);font-size:23px;font-weight:500;color:var(--ink-strong);margin:32px 0 12px}
.yfb-prose a{color:var(--orange);border-bottom:1px solid rgba(192,95,20,.35)}
.yfb-prose blockquote{margin:40px 0;padding:4px 0 4px 26px;border-left:3px solid var(--saffron)}
.yfb-prose blockquote p{font-family:var(--f-serif);font-size:27px;font-weight:400;font-style:italic;line-height:1.35;color:var(--ink-strong);margin:0}
.yfb-prose img{border-radius:6px;margin:12px 0}
.yfb-prose ul,.yfb-prose ol{font-family:var(--f-serif);font-size:19px;line-height:1.6;color:#2b271f;margin:0 0 26px;padding-left:24px}
.yfb-prose li{margin-bottom:8px}

.yfb-tags{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 34px}
.yfb-tags a{font-family:var(--f-label);font-size:12.5px;color:var(--ink-soft);border:1px solid var(--line);padding:6px 13px;border-radius:20px}
.yfb-authorcard{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid rgba(33,29,23,.1);border-radius:12px;padding:24px}
.yfb-authorcard .yfb-avatar{width:60px;height:60px;font-size:19px}
.yfb-authorcard .n{font-family:var(--f-serif);font-size:20px;color:var(--ink-strong);margin-bottom:4px}
.yfb-authorcard .beat{font-family:var(--f-label);font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--orange);margin-bottom:9px}
.yfb-authorcard p{font-size:14px;line-height:1.6;color:var(--ink-soft);margin:0 0 12px;max-width:52ch}
.yfb-authorcard .links{display:flex;gap:14px;font-family:var(--f-label);font-size:12.5px;font-weight:600}

.yfb-rail{position:sticky;top:90px;display:flex;flex-direction:column;gap:26px}
.yfb-rail__label{font-family:var(--f-label);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:14px}
.yfb-tools__row{display:flex;gap:8px;margin-bottom:9px}
.yfb-tools__row button{flex:1;height:38px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;font-family:var(--f-serif);color:var(--ink-strong)}
.yfb-listen{width:100%;height:40px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;font-family:var(--f-label);font-weight:600;font-size:12.5px;color:var(--ink-strong);display:flex;align-items:center;justify-content:center;gap:8px}
.yfb-listen.is-on{background:#fff3e3;color:var(--orange)}
.yfb-listen i{width:7px;height:7px;border-radius:50%;background:currentColor;font-style:normal}
.yfb-related__item{display:block;padding:13px 0;border-top:1px solid rgba(33,29,23,.1)}
.yfb-related__item .cat{font-family:var(--f-label);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:600}
.yfb-related__item h4{font-family:var(--f-serif);font-size:16px;font-weight:400;line-height:1.22;color:var(--ink-strong);margin-top:5px;text-wrap:pretty}

/* more from journal */
.yfb-more{max-width:1200px;margin:64px auto 0;padding:44px 40px 0;border-top:1px solid var(--line)}
.yfb-more h2{font-family:var(--f-serif);font-size:28px;font-weight:400;color:var(--ink-strong);margin-bottom:22px}
.yfb-more__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:32px}
.yfb-more__item .frame{aspect-ratio:3/2;border-radius:5px;margin-bottom:14px;overflow:hidden}
.yfb-more__item .frame img{width:100%;height:100%;object-fit:cover}
.yfb-more__item .cat{font-family:var(--f-label);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin-bottom:7px;display:block}
.yfb-more__item h3{font-family:var(--f-serif);font-size:21px;font-weight:400;line-height:1.18;color:var(--ink-strong);margin-bottom:7px;text-wrap:pretty}
.yfb-more__item .m{font-family:var(--f-label);font-size:12px;color:var(--ink-mute)}

/* ============ ARCHIVE / CATEGORY ============ */
.yfb-archive{padding:48px 0 20px;min-height:60vh}
.yfb-archive__back{font-family:var(--f-label);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute);display:inline-flex;align-items:center;gap:7px;margin-bottom:30px}
.yfb-archive__back span{color:var(--orange)}
.yfb-archive__head{text-align:center;max-width:640px;margin:0 auto 46px}
.yfb-archive__head h1{font-family:var(--f-serif);font-size:60px;font-weight:400;line-height:1;letter-spacing:-.02em;color:var(--ink-strong);margin-bottom:18px}
.yfb-archive__head p{font-family:var(--f-serif);font-size:19px;font-style:italic;font-weight:300;line-height:1.5;color:var(--ink-soft)}
.yfb-archive__grid{display:grid;grid-template-columns:1fr 1fr;gap:2px 48px}
.yfb-archive__post{display:block;padding:26px 20px;border-top:1px solid var(--line);margin:0 -20px;transition:background .3s}
.yfb-archive__post:hover{background:var(--wash)}
.yfb-archive__post:hover h3{color:var(--orange)}
.yfb-archive__post h3{font-family:var(--f-serif);font-size:27px;font-weight:400;line-height:1.14;letter-spacing:-.01em;color:var(--ink-strong);margin-bottom:12px;text-wrap:pretty;transition:color .25s}
.yfb-archive__post p{font-size:14.5px;line-height:1.6;color:var(--ink-soft);margin-bottom:14px;text-wrap:pretty}
.yfb-archive__post .m{font-family:var(--f-label);font-size:12px;color:var(--ink-mute)}
.yfb-archive__post .m b{color:var(--ink);font-weight:500}
.yfb-pagination{display:flex;gap:8px;justify-content:center;margin:44px 0 0;flex-wrap:wrap}
.yfb-pagination .page-numbers{font-family:var(--f-label);font-weight:600;font-size:14px;color:var(--ink-strong);background:#fff;border:1px solid rgba(33,29,23,.14);padding:9px 15px;border-radius:10px}
.yfb-pagination .current{background:var(--ink-strong);color:var(--paper);border-color:var(--ink-strong)}

/* ============ COMMENTS ============ */
.yfb-comments{margin-top:38px}
.yfb-comments h2,.yfb-comments h3{font-family:var(--f-serif);font-weight:500;font-size:22px;color:var(--ink-strong);margin-bottom:16px}
.yfb-comments .comment-list{list-style:none;padding:0;margin:0 0 24px}
.yfb-comments .comment-body{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
.yfb-comments input[type=text],.yfb-comments input[type=email],.yfb-comments input[type=url],.yfb-comments textarea{width:100%;border:1px solid rgba(33,29,23,.16);border-radius:10px;padding:12px;font-size:14px;margin-bottom:12px;background:#fff;font-family:var(--f-body)}
.yfb-comments .submit{background:var(--ink-strong);color:var(--paper);border:none;border-radius:30px;padding:12px 26px;font-family:var(--f-label);font-weight:600;cursor:pointer}

/* ============ RESPONSIVE ============ */
@media(max-width:960px){
  .yfb-slide{grid-template-columns:1fr;gap:28px}
  .yfb-slide__media{order:-1}
  .yfb-article-grid{grid-template-columns:1fr;gap:8px;padding-top:34px}
  .yfb-share,.yfb-rail{position:static}
  .yfb-rail{flex-direction:column;gap:8px}
  .yfb-share{flex-direction:row;justify-content:center;order:3;gap:12px;margin-top:6px}
  .yfb-prose{order:1}
  .yfb-rail{order:2}
  .yfb-more__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .yfb-columns{grid-template-columns:1fr}
  .yfb-post{grid-template-columns:1fr}
  .yfb-post__num,.yfb-post__meta{display:none}
  .yfb-masthead__controls .label{display:none}
}
@media(max-width:760px){
  .yfb-nav{display:none}
  .yfb-footer__cols{grid-template-columns:1fr 1fr;gap:28px}
}
@media(max-width:620px){
  .yfb-wrap,.yfb-main,.yfb-narrow{padding-left:20px;padding-right:20px}
  .yfb-slide__body h2{font-size:38px}
  .yfb-post__body h3{font-size:26px}
  .yfb-topics{grid-template-columns:1fr}
  .yfb-article-head{padding:40px 22px 0}
  .yfb-article-head h1{font-size:34px}
  .yfb-figure,.yfb-article-grid,.yfb-more,.yfb-newsletter{padding-left:22px;padding-right:22px}
  .yfb-more__grid{grid-template-columns:1fr}
  .yfb-archive__head h1{font-size:40px}
  .yfb-archive__grid{grid-template-columns:1fr}
  .yfb-prose{font-size:19px}
}