/* =================================================================
   The Finance Wall — main.css
   WSJ.com clone for thefinancewall.com
   ================================================================= */

/* ─── Design Tokens ──────────────────────────────────────────── */
:root {
  /* WSJ color palette */
  --tfw-navy:        #004785;
  --tfw-navy-dark:   #003566;
  --tfw-blue:        #0274b6;
  --tfw-blue-light:  #0286d4;
  --tfw-orange:      #e3820b;
  --tfw-red:         #c0392b;
  --tfw-text:        #1a1a1a;
  --tfw-text-muted:  #555555;
  --tfw-text-light:  #888888;
  --tfw-bg:          #ffffff;
  --tfw-bg-alt:      #f5f4f0;
  --tfw-bg-section:  #f0ede8;
  --tfw-border:      #d7d2cb;
  --tfw-border-dark: #b8b0a5;
  --tfw-rule:        #d7d2cb;
  --tfw-up:          #128a18;
  --tfw-up-bg:       #e8f5e9;
  --tfw-down:        #c0392b;
  --tfw-down-bg:     #fdf0ee;
  --tfw-flat:        #666666;
  --tfw-pro:         #004785;
  --tfw-plus:        #b8860b;
  --tfw-shadow:      0 1px 3px rgba(0,0,0,.08);
  --tfw-shadow-md:   0 3px 12px rgba(0,0,0,.10);

  /* Typography — WSJ uses Retina/Escrow; we replicate with Libre Baskerville */
  --tfw-font-headline: 'Libre Baskerville', 'Georgia', 'Times New Roman', serif;
  --tfw-font-serif:    'Source Serif 4', 'Georgia', serif;
  --tfw-font-ui:       'Roboto Condensed', 'Inter', -apple-system, sans-serif;
  --tfw-font-body:     'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Layout */
  --tfw-max-w:       1280px;
  --tfw-nav-h:       0px;
  --tfw-pad:         16px;
}

/* ─── Reset ──────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--tfw-font-body); font-size: 14px; line-height: 1.6; color: var(--tfw-text); background: var(--tfw-bg); -webkit-font-smoothing: antialiased; }
img  { max-width: 100%; height: auto; display: block; }
a    { color: inherit; text-decoration: none; }
a:hover { color: var(--tfw-blue); }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
ul, ol { list-style: none; }

/* ─── Container ──────────────────────────────────────────────── */
.tfw-container { max-width: var(--tfw-max-w); margin: 0 auto; padding: 0 var(--tfw-pad); }

/* ─── Utility Bar ────────────────────────────────────────────── */
.tfw-utility-bar { background: var(--tfw-bg); border-bottom: 1px solid var(--tfw-border); padding: 5px 0; font-size: 11px; font-family: var(--tfw-font-ui); }
.tfw-utility-bar__inner { display: flex; justify-content: space-between; align-items: center; }
.tfw-utility-bar__left { color: var(--tfw-text-muted); }
.tfw-utility-bar__right { display: flex; align-items: center; gap: 14px; }
.tfw-utility-bar__link { color: var(--tfw-text-muted); font-weight: 400; transition: color .15s; }
.tfw-utility-bar__link:hover { color: var(--tfw-blue); }

/* ─── Masthead ───────────────────────────────────────────────── */
.tfw-masthead { background: var(--tfw-bg); border-bottom: 3px solid var(--tfw-navy); padding: 16px 0 12px; }
.tfw-masthead__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

/* Logo — WSJ blackletter-inspired wordmark */
.tfw-logo { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1; text-decoration: none; }
.tfw-logo__the { font-family: var(--tfw-font-ui); font-size: 10px; font-weight: 400; letter-spacing: .25em; text-transform: uppercase; color: var(--tfw-text-muted); margin-bottom: 1px; }
.tfw-logo__name { font-family: var(--tfw-font-headline); font-size: 32px; font-weight: 700; color: var(--tfw-text); letter-spacing: -.5px; line-height: 1; }
.tfw-logo--white .tfw-logo__the  { color: rgba(255,255,255,.6); }
.tfw-logo--white .tfw-logo__name { color: #fff; }

.tfw-masthead__logo { flex: 1; display: flex; justify-content: flex-start; align-items: flex-start; }

.tfw-masthead__actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.tfw-masthead__btn { display: flex; align-items: center; gap: 5px; color: var(--tfw-text-muted); font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 500; transition: color .15s; }
.tfw-masthead__btn:hover { color: var(--tfw-blue); }
.tfw-masthead__subscribe { background: var(--tfw-navy); color: #fff; padding: 8px 20px; font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; transition: background .15s; border-radius: 0; }
.tfw-masthead__subscribe:hover { background: var(--tfw-navy-dark); color: #fff; }
.tfw-hamburger { display: none; flex-direction: column; gap: 5px; padding: 5px; align-items: center; justify-content: center; width: 36px; height: 36px; }
.tfw-hamburger span { display: block; width: 20px; height: 2px; background: var(--tfw-text); border-radius: 2px; transition: transform .2s, opacity .2s; }

/* ─── Search Overlay ─────────────────────────────────────────── */
.tfw-search-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 9999; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; display: flex; align-items: flex-start; }
.tfw-search-overlay.is-open { opacity: 1; visibility: visible; }
.tfw-search-overlay__inner { background: var(--tfw-bg); width: 100%; padding: 28px 0 24px; }
.tfw-search-overlay__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.tfw-search-overlay__label { font-family: var(--tfw-font-ui); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-text-muted); }
.tfw-search-overlay__close { color: var(--tfw-text-muted); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; transition: color .15s; }
.tfw-search-overlay__close:hover { color: var(--tfw-text); }
.tfw-search-overlay__hints { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.tfw-search-hint { font-size: 12px; padding: 3px 9px; background: var(--tfw-bg-section); border: 1px solid var(--tfw-border); font-family: var(--tfw-font-ui); color: var(--tfw-text-muted); border-radius: 2px; transition: background .1s, color .1s; }
.tfw-search-hint:hover { background: var(--tfw-navy); color: #fff; border-color: var(--tfw-navy); }

/* Search form */
.tfw-search-form { display: flex; align-items: center; border: 1px solid var(--tfw-border-dark); border-radius: 0; background: var(--tfw-bg); }
.tfw-search-form__input { flex: 1; height: 44px; padding: 0 14px; font-family: var(--tfw-font-body); font-size: 15px; border: none; outline: none; background: transparent; color: var(--tfw-text); }
.tfw-search-form__input::placeholder { color: var(--tfw-text-light); }
.tfw-search-form__btn { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: var(--tfw-navy); color: #fff; flex-shrink: 0; transition: background .15s; }
.tfw-search-form__btn:hover { background: var(--tfw-navy-dark); }

/* ─── Primary Nav — WSJ full-width dark navy ─────────────────── */
.tfw-nav-wrap { background: var(--tfw-navy); position: sticky; top: 0; z-index: 100; }
.tfw-nav__inner { display: flex; align-items: stretch; height: 40px; justify-content: space-between; }
.tfw-nav__list { display: flex; align-items: stretch; overflow-x: auto; scrollbar-width: none; flex: 1; }
.tfw-nav__list::-webkit-scrollbar { display: none; }
.tfw-nav__item { display: flex; align-items: stretch; }
.tfw-nav__link {
  display: flex; align-items: center;
  padding: 0 13px;
  font-size: 12.5px;
  font-family: var(--tfw-font-ui);
  font-weight: 600;
  letter-spacing: .02em;
  color: #c8d8e8;
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  transition: color .15s, border-color .15s;
}
.tfw-nav__link:hover { color: #fff; border-bottom-color: rgba(255,255,255,.4); }
.tfw-nav__item--plus .tfw-nav__link { color: #fcd34d; }
.tfw-nav__item--plus .tfw-nav__link:hover { color: #fbbf24; }
.tfw-nav__item.is-current .tfw-nav__link { color: #fff; border-bottom-color: #fff; }
.tfw-nav__actions { display: flex; align-items: center; }
.tfw-nav__btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; color: #9bafc0; transition: color .15s; }
.tfw-nav__btn:hover { color: #fff; }

/* ─── Markets Ticker Bar ─────────────────────────────────────── */
.tfw-markets-bar { background: var(--tfw-bg-section); border-bottom: 1px solid var(--tfw-border); overflow: hidden; position: relative; height: 32px; }
.tfw-markets-bar__inner { display: flex; align-items: center; height: 100%; }
.tfw-markets-bar__track { display: flex; align-items: center; gap: 0; animation: tfw-ticker 70s linear infinite; white-space: nowrap; height: 100%; }
.tfw-markets-bar__track:hover { animation-play-state: paused; }
@keyframes tfw-ticker {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.tfw-ticker-item { display: inline-flex; align-items: center; gap: 6px; padding: 0 16px; height: 100%; border-right: 1px solid var(--tfw-border); font-family: var(--tfw-font-ui); font-size: 12px; }
.tfw-ticker-item__symbol { font-weight: 700; color: var(--tfw-text); }
.tfw-ticker-item__price { color: var(--tfw-text-muted); }
.tfw-ticker-item__change { display: flex; align-items: center; gap: 2px; font-size: 11px; font-weight: 600; }
.tfw-ticker-item--up    .tfw-ticker-item__change { color: var(--tfw-up); }
.tfw-ticker-item--down  .tfw-ticker-item__change { color: var(--tfw-down); }
.tfw-ticker-item--flat  .tfw-ticker-item__change { color: var(--tfw-flat); }
.tfw-ticker-item__arrow { font-size: 9px; }
.tfw-markets-bar__more { position: absolute; right: 0; top: 0; height: 100%; padding: 0 12px; background: linear-gradient(to right, transparent, var(--tfw-bg-section) 30%); display: flex; align-items: center; font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 600; color: var(--tfw-navy); white-space: nowrap; padding-left: 30px; }
.tfw-markets-bar__more:hover { color: var(--tfw-blue); }

/* ─── Badges ─────────────────────────────────────────────────── */
.tfw-badges { display: inline-flex; gap: 3px; }
.tfw-badge { display: inline-flex; align-items: center; padding: 1px 6px; font-size: 10px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-radius: 2px; line-height: 1.6; }
.tfw-badge--breaking  { background: var(--tfw-orange); color: #fff; }
.tfw-badge--exclusive { background: var(--tfw-navy);   color: #fff; }
.tfw-badge--pro       { background: var(--tfw-pro);    color: #fff; }
.tfw-badge--plus      { background: var(--tfw-plus);   color: #fff; }

/* ─── Labels ─────────────────────────────────────────────────── */
.tfw-label { display: inline-block; font-family: var(--tfw-font-ui); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--tfw-navy); text-decoration: none; margin-bottom: 4px; }
.tfw-label:hover { text-decoration: underline; text-underline-offset: 2px; color: var(--tfw-blue); }
.tfw-label--sm { font-size: 10px; }
.tfw-label--article { font-size: 12px; color: var(--tfw-orange); }

/* ─── Section Head ───────────────────────────────────────────── */
.tfw-section-head { display: flex; justify-content: space-between; align-items: baseline; border-top: 3px solid var(--tfw-navy); border-bottom: 1px solid var(--tfw-border); padding: 8px 0; margin-bottom: 14px; }
.tfw-section-head__kicker { font-size: 10px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-orange); margin-bottom: 2px; display: block; }
.tfw-section-head__title { font-family: var(--tfw-font-ui); font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--tfw-text); }
.tfw-section-head__more { font-size: 12px; font-family: var(--tfw-font-ui); color: var(--tfw-blue); font-weight: 600; }
.tfw-section-head__more:hover { text-decoration: underline; }

/* ─── Horizontal rule ────────────────────────────────────────── */
.tfw-rule { border: none; border-top: 1px solid var(--tfw-rule); margin: 16px 0; }
.tfw-rule--sm { margin: 10px 0; }
.tfw-rule--thick { border-top: 3px solid var(--tfw-navy); margin: 24px 0; }

/* ─── Byline ─────────────────────────────────────────────────── */
.tfw-byline { display: inline-flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.tfw-byline__by { font-size: 12px; color: var(--tfw-text-muted); font-family: var(--tfw-font-body); }
.tfw-byline__name { font-size: 12px; font-weight: 600; color: var(--tfw-navy); font-family: var(--tfw-font-body); transition: color .15s; }
.tfw-byline__name:hover { color: var(--tfw-blue); text-decoration: underline; }
.tfw-byline__sep { color: var(--tfw-border-dark); font-size: 11px; }
.tfw-byline__date { font-size: 12px; color: var(--tfw-text-muted); font-family: var(--tfw-font-body); }
.tfw-time { font-size: 11px; color: var(--tfw-text-light); font-family: var(--tfw-font-body); }
.tfw-meta-sep { color: var(--tfw-border-dark); font-size: 11px; }

/* ─── Homepage Grid — WSJ 3-column newspaper layout ─────────── */
.tfw-homepage { padding: 16px 0 48px; }
.tfw-homepage-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(0,1.1fr) 280px; gap: 0; border-top: 3px solid var(--tfw-navy); margin-bottom: 0; }
.tfw-col-main,
.tfw-col-center,
.tfw-col-sidebar { padding-top: 14px; }
.tfw-col-main   { padding-right: 20px; border-right: 1px solid var(--tfw-border); }
.tfw-col-center { padding: 14px 20px 0; border-right: 1px solid var(--tfw-border); }
.tfw-col-sidebar{ padding-left: 20px; }

/* Column header labels */
.tfw-col-main__header { border-bottom: 1px solid var(--tfw-border); padding-bottom: 6px; margin-bottom: 14px; }
.tfw-col-main__label { font-family: var(--tfw-font-ui); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-text-muted); }

/* ─── Hero Story ─────────────────────────────────────────────── */
.tfw-hero-story { margin-bottom: 16px; }
.tfw-hero-story__img-wrap { display: block; overflow: hidden; margin-bottom: 12px; position: relative; }
.tfw-hero-story__img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.tfw-hero-story__title { font-family: var(--tfw-font-headline); font-size: 28px; font-weight: 700; line-height: 1.2; color: var(--tfw-text); margin: 6px 0 8px; }
.tfw-hero-story__title a:hover { color: var(--tfw-blue); }
.tfw-hero-story__deck { font-family: var(--tfw-font-serif); font-size: 15px; color: var(--tfw-text-muted); line-height: 1.5; margin-bottom: 8px; }
.tfw-hero-story__meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

/* ─── Secondary story row ────────────────────────────────────── */
.tfw-secondary-row { display: grid; grid-template-columns: 1fr 1fr 200px; gap: 14px; align-items: start; }
.tfw-secondary-story {}
.tfw-secondary-story__img-wrap { display: block; overflow: hidden; margin-bottom: 8px; aspect-ratio: 3/2; }
.tfw-secondary-story__img { width: 100%; height: 100%; object-fit: cover; }
.tfw-secondary-story__title { font-family: var(--tfw-font-headline); font-size: 17px; font-weight: 700; line-height: 1.3; margin: 4px 0 6px; }
.tfw-secondary-story__title a:hover { color: var(--tfw-blue); }
.tfw-secondary-story__deck { font-size: 13px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.45; margin-bottom: 6px; }
.tfw-secondary-story__meta { font-size: 11px; }

/* ─── Text stack (right col) ─────────────────────────────────── */
.tfw-text-stack { border-left: 1px solid var(--tfw-border); padding-left: 14px; display: flex; flex-direction: column; gap: 12px; }
.tfw-stack-story {}
.tfw-stack-story__title { font-family: var(--tfw-font-headline); font-size: 14px; font-weight: 700; line-height: 1.35; margin: 3px 0 4px; }
.tfw-stack-story__title a:hover { color: var(--tfw-blue); }
.tfw-stack-story__deck { font-size: 12px; color: var(--tfw-text-muted); line-height: 1.4; }
.tfw-stack-story__meta { font-size: 11px; color: var(--tfw-text-light); margin-top: 3px; }

/* ─── Latest Strip ───────────────────────────────────────────── */
.tfw-latest-strip { margin-top: 14px; }
.tfw-latest-strip__head { display: flex; justify-content: space-between; align-items: center; border-top: 2px solid var(--tfw-navy); padding: 6px 0; margin-bottom: 8px; }
.tfw-latest-strip__label { font-family: var(--tfw-font-ui); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--tfw-text); }
.tfw-latest-strip__more { font-size: 11px; font-family: var(--tfw-font-ui); color: var(--tfw-blue); font-weight: 600; }
.tfw-latest-strip__more:hover { text-decoration: underline; }

/* ─── What's News column ─────────────────────────────────────── */
.tfw-whats-news__header { border-top: 3px solid var(--tfw-navy); border-bottom: 1px solid var(--tfw-border); padding: 8px 0; margin-bottom: 12px; }
.tfw-whats-news__title { font-family: var(--tfw-font-ui); font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--tfw-text); }
.tfw-whats-news__subtitle { font-family: var(--tfw-font-ui); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-navy); margin-bottom: 8px; padding-bottom: 4px; border-bottom: 1px solid var(--tfw-border); }
.tfw-whats-news__list { display: flex; flex-direction: column; gap: 0; }
.tfw-whats-news__section { margin-bottom: 12px; }

/* ─── Briefing item (What's News style) ─────────────────────── */
.tfw-briefing-item { display: flex; gap: 6px; align-items: flex-start; padding: 7px 0; border-bottom: 1px dotted var(--tfw-border); }
.tfw-briefing-item:last-child { border-bottom: none; }
.tfw-briefing-item__bullet { color: var(--tfw-navy); font-size: 7px; margin-top: 5px; flex-shrink: 0; }
.tfw-briefing-item__body { flex: 1; min-width: 0; font-family: var(--tfw-font-body); font-size: 13px; line-height: 1.5; color: var(--tfw-text); }
.tfw-briefing-item__text { color: var(--tfw-text); }
.tfw-briefing-item__title { color: var(--tfw-text); font-weight: 600; }
.tfw-briefing-item__title:hover { color: var(--tfw-blue); }
.tfw-briefing-item__more { color: var(--tfw-blue); font-weight: 600; margin-left: 4px; }
.tfw-briefing-item__more:hover { text-decoration: underline; }
.tfw-briefing-item__time { display: block; font-size: 11px; color: var(--tfw-text-light); margin-top: 2px; font-family: var(--tfw-font-body); }

/* ─── Markets Panel ──────────────────────────────────────────── */
.tfw-markets-panel { border: 1px solid var(--tfw-border); margin-bottom: 20px; overflow: hidden; }
.tfw-markets-panel__header { display: flex; justify-content: space-between; align-items: center; background: var(--tfw-navy); padding: 8px 12px; }
.tfw-markets-panel__title { font-family: var(--tfw-font-ui); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #fff; }
.tfw-markets-panel__status { font-size: 10px; color: rgba(255,255,255,.65); font-family: var(--tfw-font-ui); }
.tfw-markets-panel__grid { padding: 4px 0; }
.tfw-market-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; border-bottom: 1px solid var(--tfw-border); font-family: var(--tfw-font-ui); font-size: 12px; transition: background .1s; }
.tfw-market-row:last-child { border-bottom: none; }
.tfw-market-row:hover { background: var(--tfw-bg-section); }
.tfw-market-row__left { display: flex; flex-direction: column; gap: 1px; }
.tfw-market-row__symbol { font-weight: 700; color: var(--tfw-navy); font-size: 12px; }
.tfw-market-row__name { font-size: 10px; color: var(--tfw-text-light); }
.tfw-market-row__right { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.tfw-market-row__price { font-weight: 600; color: var(--tfw-text); font-size: 13px; }
.tfw-market-row__change { display: flex; align-items: center; gap: 2px; font-size: 11px; font-weight: 600; }
.tfw-market-row--up   .tfw-market-row__change { color: var(--tfw-up); }
.tfw-market-row--down .tfw-market-row__change { color: var(--tfw-down); }
.tfw-market-row--flat .tfw-market-row__change { color: var(--tfw-flat); }
.tfw-market-row__pct { opacity: .75; }
.tfw-markets-panel__more { display: block; text-align: center; padding: 8px; font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 600; color: var(--tfw-blue); border-top: 1px solid var(--tfw-border); transition: background .1s; background: var(--tfw-bg-section); }
.tfw-markets-panel__more:hover { background: #e8e4df; color: var(--tfw-navy); }

/* ─── Most Read Widget ───────────────────────────────────────── */
.tfw-most-read { border: 1px solid var(--tfw-border); margin-bottom: 20px; overflow: hidden; }
.tfw-widget-head { background: var(--tfw-navy); color: #fff; padding: 8px 12px; font-family: var(--tfw-font-ui); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.tfw-most-read__list {}
.tfw-most-read__item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-bottom: 1px solid var(--tfw-border); background: var(--tfw-bg); transition: background .1s; }
.tfw-most-read__item:last-child { border-bottom: none; }
.tfw-most-read__item:hover { background: var(--tfw-bg-section); }
.tfw-most-read__num { font-family: var(--tfw-font-headline); font-size: 20px; font-weight: 700; color: var(--tfw-border-dark); width: 20px; flex-shrink: 0; line-height: 1; text-align: right; }
.tfw-most-read__body { flex: 1; min-width: 0; }
.tfw-most-read__title { font-family: var(--tfw-font-headline); font-size: 13px; font-weight: 700; line-height: 1.35; color: var(--tfw-text); display: block; margin-top: 2px; }
.tfw-most-read__title:hover { color: var(--tfw-blue); }

/* ─── News Item ──────────────────────────────────────────────── */
.tfw-news-item { display: flex; gap: 12px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--tfw-border); }
.tfw-news-item:last-child { border-bottom: none; }
.tfw-news-item__body { flex: 1; min-width: 0; }
.tfw-news-item__labels { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 3px; }
.tfw-news-item__title { font-family: var(--tfw-font-headline); font-size: 15px; font-weight: 700; line-height: 1.3; color: var(--tfw-text); margin-bottom: 4px; }
.tfw-news-item__title a:hover { color: var(--tfw-blue); }
.tfw-news-item__deck { font-size: 13px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.4; margin-bottom: 5px; }
.tfw-news-item__meta { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.tfw-news-item__thumb-wrap { flex-shrink: 0; width: 96px; }
.tfw-news-item__thumb { width: 100%; aspect-ratio: 3/2; object-fit: cover; }

/* ─── Horizontal Card ────────────────────────────────────────── */
.tfw-card { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--tfw-border); }
.tfw-card__thumb-wrap { flex-shrink: 0; width: 120px; overflow: hidden; position: relative; }
.tfw-card__thumb { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.tfw-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.tfw-card__title { font-family: var(--tfw-font-headline); font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--tfw-text); }
.tfw-card__title a:hover { color: var(--tfw-blue); }
.tfw-card__deck { font-size: 13px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.4; }
.tfw-card__meta { display: flex; align-items: center; gap: 5px; margin-top: auto; flex-wrap: wrap; }

/* ─── Vertical Card ──────────────────────────────────────────── */
.tfw-card-v { background: var(--tfw-bg); }
.tfw-card-v__img-wrap { display: block; overflow: hidden; margin-bottom: 8px; position: relative; }
.tfw-card-v__img { width: 100%; aspect-ratio: 3/2; object-fit: cover; transition: opacity .2s; }
.tfw-card-v:hover .tfw-card-v__img { opacity: .9; }
.tfw-card-v__body { display: flex; flex-direction: column; gap: 4px; }
.tfw-card-v__title { font-family: var(--tfw-font-headline); font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--tfw-text); }
.tfw-card-v__title a:hover { color: var(--tfw-blue); }
.tfw-card-v__deck { font-size: 13px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.4; }
.tfw-card-v__meta { font-size: 11px; margin-top: 4px; }

/* ─── Section Row (vertical sections) ───────────────────────── */
.tfw-section-row { padding: 16px 0; border-bottom: 1px solid var(--tfw-border); }
.tfw-section-row--alt { background: var(--tfw-bg-alt); padding: 16px; margin: 0 calc(-1 * var(--tfw-pad)); padding-left: var(--tfw-pad); padding-right: var(--tfw-pad); }
.tfw-section-row__header { display: flex; justify-content: space-between; align-items: center; border-top: 3px solid var(--tfw-navy); border-bottom: 1px solid var(--tfw-border); padding: 8px 0; margin-bottom: 14px; }
.tfw-section-row__title { font-family: var(--tfw-font-ui); font-size: 16px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--tfw-text); }
.tfw-section-row__more { font-size: 12px; font-family: var(--tfw-font-ui); color: var(--tfw-blue); font-weight: 600; }
.tfw-section-row__more:hover { text-decoration: underline; }
.tfw-section-row__grid { display: grid; grid-template-columns: minmax(0,1.8fr) minmax(0,1fr); gap: 20px; align-items: start; }
.tfw-section-lead { }
.tfw-section-lead__img-wrap { display: block; overflow: hidden; margin-bottom: 10px; position: relative; }
.tfw-section-lead__img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.tfw-section-lead__title { font-family: var(--tfw-font-headline); font-size: 20px; font-weight: 700; line-height: 1.3; margin: 4px 0 6px; }
.tfw-section-lead__title a:hover { color: var(--tfw-blue); }
.tfw-section-lead__deck { font-size: 14px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.5; margin-bottom: 6px; }
.tfw-section-lead__meta { font-size: 11px; }
.tfw-section-list { border-left: 1px solid var(--tfw-border); padding-left: 16px; display: flex; flex-direction: column; }

/* ─── Ad placeholders ────────────────────────────────────────── */
.tfw-ad-placeholder { background: var(--tfw-bg-section); border: 1px dashed var(--tfw-border-dark); display: flex; align-items: center; justify-content: center; color: var(--tfw-text-light); font-size: 10px; font-family: var(--tfw-font-ui); letter-spacing: .08em; text-transform: uppercase; }
.tfw-ad-placeholder--rect { height: 250px; margin-bottom: 16px; }
.tfw-ad-placeholder--leaderboard { height: 90px; margin: 10px 0; }

/* ─── Single Article ─────────────────────────────────────────── */
.tfw-single-wrap { padding: 20px 0 60px; }
.tfw-single-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 40px; align-items: start; }
.tfw-single__main { min-width: 0; }
.tfw-single__sidebar { position: sticky; top: calc(var(--tfw-nav-h) + 12px); }

.tfw-breaking-badge { display: inline-flex; align-items: center; gap: 6px; background: var(--tfw-orange); color: #fff; padding: 4px 10px; font-family: var(--tfw-font-ui); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 10px; }
.tfw-breaking-dot { width: 7px; height: 7px; background: #fff; border-radius: 50%; animation: tfw-pulse 1.2s infinite; }
@keyframes tfw-pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.4;transform:scale(.7)} }

/* Breadcrumb */
.tfw-breadcrumb { margin-bottom: 10px; }
.tfw-breadcrumb__list { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.tfw-breadcrumb__list li { display: flex; align-items: center; gap: 4px; font-size: 11px; font-family: var(--tfw-font-ui); color: var(--tfw-text-muted); }
.tfw-breadcrumb__list li:not(:last-child)::after { content: '>'; color: var(--tfw-border-dark); margin-left: 4px; font-size: 10px; }
.tfw-breadcrumb__list a { color: var(--tfw-navy); }
.tfw-breadcrumb__list a:hover { text-decoration: underline; color: var(--tfw-blue); }

.tfw-single__labels { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }

/* Article headline — WSJ's condensed serif style */
.tfw-single__title { font-family: var(--tfw-font-headline); font-size: 34px; font-weight: 700; line-height: 1.15; color: var(--tfw-text); margin-bottom: 12px; letter-spacing: -.3px; }

.tfw-single__deck { font-family: var(--tfw-font-serif); font-size: 18px; font-weight: 300; color: var(--tfw-text-muted); line-height: 1.5; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--tfw-border); }
.tfw-single__byline-row { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--tfw-border); margin-bottom: 14px; }
.tfw-single__author-info { display: flex; align-items: center; gap: 10px; }
.tfw-single__avatar { border-radius: 50%; }
.tfw-single__updated { display: block; font-size: 11px; color: var(--tfw-text-light); margin-top: 2px; font-family: var(--tfw-font-body); }

/* What to Know bullets */
.tfw-bullets-box { background: var(--tfw-bg-section); border: 1px solid var(--tfw-border); border-left: 3px solid var(--tfw-navy); margin-bottom: 18px; overflow: hidden; }
.tfw-bullets-box__header { display: flex; align-items: center; gap: 6px; background: var(--tfw-navy); color: #fff; padding: 8px 14px; font-family: var(--tfw-font-ui); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
.tfw-bullets-box__list { list-style: none; padding: 10px 14px; display: flex; flex-direction: column; gap: 6px; }
.tfw-bullets-box__item { font-size: 14px; font-family: var(--tfw-font-body); line-height: 1.5; color: var(--tfw-text); padding-left: 14px; position: relative; }
.tfw-bullets-box__item::before { content: '▸'; position: absolute; left: 0; color: var(--tfw-navy); font-size: 11px; top: 2px; }

/* Hero image */
.tfw-single__hero { margin-bottom: 20px; }
.tfw-single__hero-img { width: 100%; }
.tfw-single__hero-caption { font-size: 12px; color: var(--tfw-text-light); margin-top: 6px; font-family: var(--tfw-font-body); line-height: 1.4; }

/* Article body — WSJ editorial narrow column feel */
.tfw-article-body { font-family: var(--tfw-font-serif); font-size: 17px; line-height: 1.85; color: var(--tfw-text); }
.tfw-article-body p { margin-bottom: 22px; }
.tfw-article-body h2 { font-family: var(--tfw-font-headline); font-size: 22px; font-weight: 700; margin: 30px 0 12px; color: var(--tfw-text); }
.tfw-article-body h3 { font-family: var(--tfw-font-headline); font-size: 19px; font-weight: 700; margin: 26px 0 10px; }
.tfw-article-body a { color: var(--tfw-blue); text-decoration: underline; text-underline-offset: 2px; }
.tfw-article-body a:hover { color: var(--tfw-navy); }
/* WSJ's signature blockquote: bold, large, centered with left border */
.tfw-article-body blockquote {
  margin: 28px 0;
  padding: 16px 20px;
  border-left: 4px solid var(--tfw-navy);
  background: var(--tfw-bg-section);
  font-family: var(--tfw-font-headline);
  font-size: 20px;
  font-style: italic;
  font-weight: 700;
  color: var(--tfw-text);
  line-height: 1.5;
}
.tfw-article-body blockquote cite { display: block; font-size: 13px; font-style: normal; font-weight: 400; color: var(--tfw-text-muted); margin-top: 8px; font-family: var(--tfw-font-body); }
.tfw-article-body ul, .tfw-article-body ol { padding-left: 20px; margin-bottom: 22px; }
.tfw-article-body ul li { list-style: disc; margin-bottom: 6px; }
.tfw-article-body ol li { list-style: decimal; margin-bottom: 6px; }
.tfw-article-body figure { margin: 24px 0; }
.tfw-article-body figcaption { font-size: 12px; color: var(--tfw-text-light); font-family: var(--tfw-font-body); margin-top: 5px; line-height: 1.4; }
.tfw-article-body table { width: 100%; border-collapse: collapse; margin-bottom: 22px; font-size: 14px; font-family: var(--tfw-font-body); }
.tfw-article-body th, .tfw-article-body td { padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--tfw-border); vertical-align: top; }
.tfw-article-body th { font-weight: 700; background: var(--tfw-bg-section); border-bottom: 2px solid var(--tfw-navy); }
.tfw-article-body tr.tfw-up   td { background: var(--tfw-up-bg); }
.tfw-article-body tr.tfw-down td { background: var(--tfw-down-bg); }

/* ─── Paywall Gate — WSJ's very prominent wall ───────────────── */
.tfw-paywall { position: relative; }
.tfw-paywall__teaser { max-height: 200px; overflow: hidden; mask-image: linear-gradient(to bottom, black 60%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, black 60%, transparent 100%); }
.tfw-paywall__gate { position: relative; padding-top: 20px; }
.tfw-paywall__overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, transparent, var(--tfw-bg) 35%); pointer-events: none; }
.tfw-paywall__cta { position: relative; z-index: 2; border: 1px solid var(--tfw-border); padding: 36px 40px; text-align: center; background: var(--tfw-bg); box-shadow: 0 4px 20px rgba(0,0,0,.08); }
.tfw-paywall__logo { margin-bottom: 14px; display: flex; justify-content: center; }
.tfw-paywall__logo .tfw-logo__the  { color: var(--tfw-text-muted); }
.tfw-paywall__logo .tfw-logo__name { color: var(--tfw-text); font-size: 24px; }
.tfw-paywall__badge { font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-plus); margin-bottom: 10px; }
.tfw-paywall__headline { font-family: var(--tfw-font-headline); font-size: 24px; font-weight: 700; margin-bottom: 10px; line-height: 1.25; }
.tfw-paywall__copy { font-size: 15px; color: var(--tfw-text-muted); max-width: 420px; margin: 0 auto 20px; font-family: var(--tfw-font-serif); line-height: 1.6; }
.tfw-paywall__actions { display: flex; justify-content: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.tfw-paywall__note { font-size: 12px; color: var(--tfw-text-muted); font-family: var(--tfw-font-body); }

/* Buttons */
.tfw-btn-primary { display: inline-flex; align-items: center; padding: 11px 28px; background: var(--tfw-navy); color: #fff; font-size: 13px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; transition: background .15s; text-decoration: none; border-radius: 0; }
.tfw-btn-primary:hover { background: var(--tfw-navy-dark); color: #fff; }
.tfw-btn-ghost { display: inline-flex; align-items: center; padding: 11px 28px; background: transparent; color: var(--tfw-navy); border: 2px solid var(--tfw-navy); font-size: 13px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; transition: background .15s, color .15s; text-decoration: none; border-radius: 0; }
.tfw-btn-ghost:hover { background: var(--tfw-navy); color: #fff; }

/* Share */
.tfw-share { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.tfw-share__btn { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; transition: filter .15s; }
.tfw-share__btn:hover { filter: brightness(1.15); }
.tfw-share__btn--tw   { background: #000; }
.tfw-share__btn--fb   { background: #1877f2; }
.tfw-share__btn--li   { background: #0a66c2; }
.tfw-share__btn--em   { background: #6b7280; }
.tfw-share__btn--copy { background: var(--tfw-bg-section); color: var(--tfw-text-muted); border: 1px solid var(--tfw-border-dark); }
.tfw-share__btn--copy:hover { background: var(--tfw-navy); color: #fff; }
.tfw-share__btn--copy.is-copied { background: var(--tfw-up) !important; color: #fff !important; }
.tfw-share__btn--print{ background: var(--tfw-bg-section); color: var(--tfw-text-muted); border: 1px solid var(--tfw-border-dark); }
.tfw-share__btn--gift { background: var(--tfw-bg-section); color: var(--tfw-text-muted); border: 1px solid var(--tfw-border-dark); }

.tfw-single__footer { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 14px; padding: 16px 0; border-top: 1px solid var(--tfw-border); border-bottom: 1px solid var(--tfw-border); margin-top: 28px; margin-bottom: 24px; }
.tfw-sticky-share { background: var(--tfw-bg); border: 1px solid var(--tfw-border); padding: 12px; margin-bottom: 16px; }

/* Author box */
.tfw-author-box { display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-top: 1px solid var(--tfw-border); border-bottom: 1px solid var(--tfw-border); margin: 16px 0; }
.tfw-author-box__avatar { border-radius: 50%; flex-shrink: 0; }
.tfw-author-box__name { display: block; font-family: var(--tfw-font-headline); font-size: 16px; font-weight: 700; color: var(--tfw-navy); margin-bottom: 4px; }
.tfw-author-box__name:hover { color: var(--tfw-blue); text-decoration: underline; }
.tfw-author-box__bio { font-size: 13px; color: var(--tfw-text-muted); line-height: 1.5; font-family: var(--tfw-font-body); }

/* Related */
.tfw-related { margin-top: 28px; padding-top: 20px; border-top: 3px solid var(--tfw-navy); }
.tfw-related__list { display: flex; flex-direction: column; margin-top: 12px; }

/* Tags */
.tfw-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.tfw-tags__label { font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--tfw-text-muted); margin-right: 4px; }
.tfw-tag { display: inline-block; padding: 3px 10px; font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 500; color: var(--tfw-navy); border: 1px solid var(--tfw-navy); transition: background .12s, color .12s; }
.tfw-tag:hover { background: var(--tfw-navy); color: #fff; }

/* ─── Sidebar Newsletter ─────────────────────────────────────── */
.tfw-sidebar-nl { border: 1px solid var(--tfw-border); margin-bottom: 16px; overflow: hidden; }
.tfw-sidebar-nl__body { padding: 12px; }
.tfw-sidebar-nl__text { font-size: 13px; color: var(--tfw-text-muted); line-height: 1.5; margin-bottom: 10px; font-family: var(--tfw-font-body); }
.tfw-sidebar-nl__form { display: flex; flex-direction: column; gap: 6px; position: relative; }
.tfw-sidebar-nl__input { height: 36px; padding: 0 10px; border: 1px solid var(--tfw-border-dark); font-size: 13px; font-family: var(--tfw-font-body); outline: none; color: var(--tfw-text); }
.tfw-sidebar-nl__input:focus { border-color: var(--tfw-navy); }
.tfw-sidebar-nl__btn { height: 36px; background: var(--tfw-navy); color: #fff; font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: background .15s; border: none; }
.tfw-sidebar-nl__btn:hover { background: var(--tfw-navy-dark); }
.tfw-newsletter__msg { font-size: 12px; color: var(--tfw-up); }

/* ─── Archive ────────────────────────────────────────────────── */
.tfw-archive-header { padding: 20px 0; border-bottom: 3px solid var(--tfw-navy); background: var(--tfw-bg); }
.tfw-archive-header__section { display: block; font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--tfw-navy); margin-bottom: 4px; }
.tfw-archive-header__title { font-family: var(--tfw-font-headline); font-size: 30px; font-weight: 700; color: var(--tfw-text); margin-bottom: 6px; }
.tfw-archive-header__desc { font-size: 15px; color: var(--tfw-text-muted); font-family: var(--tfw-font-serif); line-height: 1.5; }
.tfw-archive-header__count { font-size: 12px; color: var(--tfw-text-light); font-family: var(--tfw-font-ui); margin-top: 4px; }
.tfw-archive-header .tfw-search-form { max-width: 480px; margin-top: 12px; }
.tfw-archive-author-row { display: flex; align-items: center; gap: 16px; }
.tfw-archive-author__avatar { border-radius: 50%; }
.tfw-archive__body { padding: 20px 0 48px; }
.tfw-archive__grid-sidebar { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 32px; align-items: start; }
.tfw-archive__main {}
.tfw-archive__sidebar { position: sticky; top: calc(var(--tfw-nav-h) + 12px); }
.tfw-archive-list { display: flex; flex-direction: column; }

/* ─── Load More ──────────────────────────────────────────────── */
.tfw-load-more-wrap { text-align: center; padding: 24px 0; }
.tfw-load-more-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 28px; background: transparent; color: var(--tfw-navy); border: 2px solid var(--tfw-navy); font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; transition: background .15s, color .15s; }
.tfw-load-more-btn:hover { background: var(--tfw-navy); color: #fff; }
.tfw-load-more-btn:disabled { opacity: .4; cursor: not-allowed; }

/* ─── No Results / 404 ───────────────────────────────────────── */
.tfw-no-results { text-align: center; padding: 60px 20px; }
.tfw-no-results__title { font-family: var(--tfw-font-headline); font-size: 24px; font-weight: 700; margin-bottom: 8px; }
.tfw-no-results__text { font-size: 15px; color: var(--tfw-text-muted); margin-bottom: 18px; font-family: var(--tfw-font-serif); }
.tfw-no-results .tfw-search-form { max-width: 480px; margin: 0 auto 18px; }
.tfw-no-results__tags { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.tfw-error-page { padding: 80px 0; }
.tfw-error-page__inner { text-align: center; max-width: 520px; margin: 0 auto; }
.tfw-error-page__code { font-family: var(--tfw-font-headline); font-size: 100px; font-weight: 700; color: var(--tfw-bg-section); display: block; line-height: 1; border-bottom: 3px solid var(--tfw-navy); padding-bottom: 16px; margin-bottom: 16px; }
.tfw-error-page__title { font-family: var(--tfw-font-headline); font-size: 28px; font-weight: 700; margin-bottom: 10px; }
.tfw-error-page__text { font-size: 15px; color: var(--tfw-text-muted); margin-bottom: 24px; font-family: var(--tfw-font-serif); }
.tfw-error-page .tfw-search-form { max-width: 480px; margin: 0 auto 20px; }
.tfw-error-page__links { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }

/* ─── Footer Newsletter ──────────────────────────────────────── */
.tfw-footer-nl { background: var(--tfw-navy); padding: 32px 0; }
.tfw-footer-nl__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.tfw-footer-nl__title { font-family: var(--tfw-font-headline); font-size: 20px; font-weight: 700; color: #fff; margin-bottom: 4px; }
.tfw-footer-nl__sub { font-size: 13px; color: rgba(255,255,255,.7); font-family: var(--tfw-font-serif); font-style: italic; }
.tfw-footer-nl__form { display: flex; flex: 0 0 380px; max-width: 380px; overflow: visible; position: relative; }
.tfw-footer-nl__input { flex: 1; height: 44px; padding: 0 12px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.3); border-right: none; color: #fff; font-size: 14px; outline: none; }
.tfw-footer-nl__input::placeholder { color: rgba(255,255,255,.5); }
.tfw-footer-nl__btn { height: 44px; padding: 0 18px; background: #fff; color: var(--tfw-navy); font-size: 12px; font-family: var(--tfw-font-ui); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; flex-shrink: 0; border: none; cursor: pointer; transition: background .15s; }
.tfw-footer-nl__btn:hover { background: var(--tfw-bg-alt); }
.tfw-newsletter__msg { position: absolute; bottom: -20px; left: 0; font-size: 12px; color: rgba(255,255,255,.85); }

/* ─── Footer ─────────────────────────────────────────────────── */
.tfw-footer { background: #111; color: #9ca3af; }
.tfw-footer__top { padding: 40px 0; border-bottom: 1px solid #2a2a2a; }
.tfw-footer__top-inner { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: 28px; }
.tfw-footer__logo { display: block; margin-bottom: 12px; }
.tfw-footer__logo .tfw-logo__the  { color: rgba(255,255,255,.4); font-size: 9px; }
.tfw-footer__logo .tfw-logo__name { color: #fff; font-size: 22px; }
.tfw-footer__about { font-size: 13px; color: #9ca3af; line-height: 1.7; margin-bottom: 14px; }
.tfw-footer__social { display: flex; gap: 8px; flex-wrap: wrap; }
.tfw-footer__social-link { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.07); border-radius: 50%; color: #9ca3af; transition: background .15s, color .15s; }
.tfw-footer__social-link:hover { background: var(--tfw-blue); color: #fff; }
.tfw-footer__col-title { font-size: 11px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: #fff; margin-bottom: 12px; padding-bottom: 6px; border-bottom: 1px solid #2a2a2a; }
.tfw-footer__list { display: flex; flex-direction: column; gap: 8px; }
.tfw-footer__list a { font-size: 13px; color: #9ca3af; transition: color .15s; }
.tfw-footer__list a:hover { color: #fff; }
.tfw-footer__bottom { padding: 16px 0; border-top: 1px solid #2a2a2a; }
.tfw-footer__bottom-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
.tfw-footer__copyright { font-size: 12px; color: #6b7280; font-family: var(--tfw-font-ui); }
.tfw-footer__legal { display: flex; gap: 14px; flex-wrap: wrap; }
.tfw-footer__legal a { font-size: 12px; color: #6b7280; font-family: var(--tfw-font-ui); transition: color .15s; }
.tfw-footer__legal a:hover { color: #fff; }
.tfw-footer__disclaimer { font-size: 11px; color: #6b7280; padding-top: 10px; line-height: 1.6; }

/* ─── Mobile Menu ────────────────────────────────────────────── */
.tfw-mobile-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 500; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.tfw-mobile-overlay.is-open { opacity: 1; visibility: visible; }
.tfw-mobile-menu { position: fixed; top: 0; left: 0; width: 290px; height: 100%; background: #fff; z-index: 600; transform: translateX(-100%); transition: transform .28s ease; overflow-y: auto; display: flex; flex-direction: column; }
.tfw-mobile-menu.is-open { transform: none; }
.tfw-mobile-menu__header { display: flex; justify-content: space-between; align-items: center; padding: 14px; border-bottom: 1px solid var(--tfw-border); background: var(--tfw-navy); }
.tfw-mobile-menu__close { color: rgba(255,255,255,.8); width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; }
.tfw-mobile-menu__close:hover { color: #fff; }
.tfw-mobile-menu__search { padding: 10px; border-bottom: 1px solid var(--tfw-border); }
.tfw-mobile-nav { flex: 1; }
.tfw-mobile-nav__item { border-bottom: 1px solid var(--tfw-border); }
.tfw-mobile-nav__link { display: block; padding: 12px 16px; font-size: 14px; font-family: var(--tfw-font-ui); font-weight: 600; color: var(--tfw-text); transition: background .1s, color .1s; }
.tfw-mobile-nav__link:hover { background: var(--tfw-bg-section); color: var(--tfw-navy); }
.tfw-mobile-nav__link--plus { color: var(--tfw-plus); }
.tfw-mobile-menu__footer { padding: 14px; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid var(--tfw-border); }
.tfw-mobile-btn { display: block; text-align: center; padding: 10px; font-size: 13px; font-family: var(--tfw-font-ui); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; border: 2px solid var(--tfw-border-dark); color: var(--tfw-text); transition: background .15s; }
.tfw-mobile-btn--primary { background: var(--tfw-navy); color: #fff; border-color: var(--tfw-navy); }
.tfw-mobile-btn--primary:hover { background: var(--tfw-navy-dark); color: #fff; }

/* ─── Page / Comments ────────────────────────────────────────── */
.tfw-page-wrap { padding: 24px 0 60px; }
.tfw-page-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 32px; align-items: start; }
.tfw-page-sidebar { position: sticky; top: calc(var(--tfw-nav-h) + 12px); }
.tfw-page-article__title { font-family: var(--tfw-font-headline); font-size: 28px; font-weight: 700; margin-bottom: 20px; line-height: 1.25; }
.tfw-page-article__hero { margin-bottom: 20px; }
.tfw-page-article__hero-img { width: 100%; }
.tfw-comments { padding: 24px 0; border-top: 1px solid var(--tfw-border); margin-top: 24px; }
.tfw-comments__title { font-family: var(--tfw-font-headline); font-size: 20px; font-weight: 700; margin-bottom: 16px; }
.tfw-comment-list { list-style: none; }
.tfw-page-links { display: flex; gap: 6px; margin-top: 20px; flex-wrap: wrap; }
.tfw-page-links span, .tfw-page-links a { padding: 4px 12px; font-size: 12px; font-family: var(--tfw-font-ui); border: 1px solid var(--tfw-border-dark); color: var(--tfw-text); }
.tfw-page-links a:hover, .tfw-page-links .current { background: var(--tfw-navy); color: #fff; border-color: var(--tfw-navy); }

/* ─── Back to Top ────────────────────────────────────────────── */
.tfw-back-top { position: fixed; bottom: 24px; right: 20px; width: 38px; height: 38px; background: var(--tfw-navy); color: #fff; display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s, background .15s; z-index: 300; box-shadow: var(--tfw-shadow-md); border-radius: 0; }
.tfw-back-top.is-visible { opacity: 1; visibility: visible; }
.tfw-back-top:hover { background: var(--tfw-blue); }

/* Read progress */
.tfw-read-progress { position: fixed; top: 0; left: 0; height: 2px; width: 0; background: var(--tfw-orange); z-index: 9999; transition: width .1s linear; pointer-events: none; }

/* Reveal */
.reveal { opacity: 0; transform: translateY(10px); transition: opacity .3s ease, transform .3s ease; }
.reveal.is-revealed { opacity: 1; transform: none; }

/* Widget */
.tfw-widget { margin-bottom: 20px; }
.tfw-widget__title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--tfw-text-muted); margin-bottom: 10px; border-bottom: 1px solid var(--tfw-border); padding-bottom: 5px; font-family: var(--tfw-font-ui); }

/* ─── Responsive ─────────────────────────────────────────────── */
@media ( max-width: 1100px ) {
  .tfw-homepage-grid { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); }
  .tfw-col-sidebar { display: none; }
  .tfw-footer__top-inner { grid-template-columns: 1fr 1fr 1fr; }
}
@media ( max-width: 900px ) {
  .tfw-homepage-grid { grid-template-columns: 1fr; }
  .tfw-col-center { border-right: none; border-top: 1px solid var(--tfw-border); padding: 16px 0 0; }
  .tfw-col-main { border-right: none; padding-right: 0; }
  .tfw-secondary-row { grid-template-columns: 1fr 1fr; }
  .tfw-text-stack { display: none; }
  .tfw-single-layout,
  .tfw-archive__grid-sidebar,
  .tfw-page-layout { grid-template-columns: 1fr; }
  .tfw-single__sidebar, .tfw-archive__sidebar, .tfw-page-sidebar { position: static; }
  .tfw-section-row__grid { grid-template-columns: 1fr; }
  .tfw-section-list { border-left: none; padding-left: 0; border-top: 1px solid var(--tfw-border); padding-top: 10px; }
  .tfw-footer__top-inner { grid-template-columns: 1fr 1fr; }
}
@media ( max-width: 700px ) {
  :root { --tfw-pad: 12px; }
  .tfw-utility-bar { display: none; }
  .tfw-hamburger { display: flex; }
  .tfw-masthead__logo .tfw-logo__name { font-size: 24px; }
  .tfw-masthead__btn span { display: none; }
  .tfw-nav__list { display: none; }
  .tfw-single__title { font-size: 26px; }
  .tfw-article-body { font-size: 16px; }
  .tfw-secondary-row { grid-template-columns: 1fr; }
  .tfw-footer__top-inner { grid-template-columns: 1fr; }
  .tfw-footer__bottom-inner { flex-direction: column; align-items: flex-start; }
  .tfw-footer-nl__inner { flex-direction: column; }
  .tfw-footer-nl__form { flex: 0 0 100%; max-width: 100%; }
  .tfw-paywall__cta { padding: 24px 16px; }
  .tfw-archive-header__title { font-size: 24px; }
}
@media ( max-width: 480px ) {
  .tfw-single__byline-row { flex-direction: column; align-items: flex-start; }
  .tfw-hero-story__title { font-size: 22px; }
  .tfw-paywall__headline { font-size: 20px; }
}
