/* ═══════════════════════════════════════════════
   STYLE.CSS — Foglio di stile condiviso
   Stile editoriale professionale · Studio Commercialista
   ═══════════════════════════════════════════════ */

/* ─── Token di design ─── */
:root {
  --ink:       #111111;
  --ink-mid:   #333333;
  --ink-soft:  #555555;
  --ink-muted: #888888;
  --ink-faint: #aaaaaa;
  --rule:      #d4d0c8;
  --rule-soft: #e8e4dc;
  --bg:        #ffffff;
  --bg-warm:   #f9f7f4;
  --bg-tint:   #f3f0ea;
  --bg-tint2:  #ede9e2;
  --accent:    #8b1a2e;
  --accent-h:  #a32035;
  --accent-pale:  #f5e8eb;
  --accent-faint: #fdf1f3;
  --blue:   #1a3a6e;  --blue-pale:   #eaeff8;
  --green:  #1a5c36;  --green-pale:  #e7f2ec;
  --amber:  #7a4a10;  --amber-pale:  #fdf3e3;
  --violet: #4a2070;  --violet-pale: #f0eaf8;
  --brown:  #5a3a1a;  --brown-pale:  #f5ede3;

  --fd: 'Playfair Display', Georgia, serif;
  --fs: 'Source Serif 4', Georgia, serif;
  --fn: 'IBM Plex Sans', sans-serif;
  --fm: 'IBM Plex Mono', monospace;

  --r: 3px;
  --t: .22s ease;

  --shadow-sm: 0 2px 8px rgba(17,17,17,.07);
  --shadow-md: 0 8px 28px rgba(17,17,17,.11);
  --shadow-lg: 0 20px 60px rgba(17,17,17,.16);
}

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

/* ══════════════════════════════════════
   TOP STRIP
══════════════════════════════════════ */
.topstrip {
  background: var(--accent);
  padding: .28rem 2rem;
  display: flex; align-items: center; justify-content: space-between;
}
.ts-left {
  font-size: .62rem; color: rgba(255,255,255,.7);
  font-family: var(--fm); letter-spacing: .05em;
}
.ts-right { display: flex; gap: 1.1rem; }
.ts-right a {
  font-size: .62rem; color: rgba(255,255,255,.65);
  font-weight: 500; letter-spacing: .04em;
  transition: color var(--t);
}
.ts-right a:hover { color: #fff; }

/* ══════════════════════════════════════
   HEADER
══════════════════════════════════════ */
.site-header {
  background: var(--bg);
  border-bottom: 3px solid var(--ink);
  position: sticky; top: 0; z-index: 100;
}
.hinner {
  max-width: 1300px; margin: 0 auto;
  padding: 0 2rem;
  display: flex; align-items: stretch; min-height: 62px;
}

/* Logo */
.logo {
  display: flex; flex-direction: column; justify-content: center;
  padding: .6rem 1.75rem .6rem 0;
  border-right: 1px solid var(--rule);
  margin-right: 1.75rem; flex-shrink: 0;
}
.logo-n   { font-family: var(--fd); font-size: 1.16rem; font-weight: 800; color: var(--ink); letter-spacing: -.01em; line-height: 1; }
.logo-s   { font-size: .6rem; color: var(--ink-muted); letter-spacing: .1em; text-transform: uppercase; margin-top: .2rem; }
.logo-tags { display: flex; gap: .3rem; margin-top: .28rem; }
.logo-tags span {
  font-size: .58rem; color: var(--accent);
  border: 1px solid var(--accent); padding: .08rem .35rem;
  border-radius: 2px; font-weight: 600; letter-spacing: .06em;
}

/* Nav principale */
.main-nav { display: flex; align-items: center; flex: 1; }
.nav-list  { display: flex; align-items: center; height: 100%; list-style: none; gap: 0; }

/* Nav item base */
.nav-item {
  position: relative; height: 100%;
  display: flex; align-items: center;
}
.nav-item > a {
  font-size: .82rem; font-weight: 500; color: var(--ink-soft);
  padding: 0 .95rem; height: 100%;
  display: flex; align-items: center; gap: .28rem;
  border-bottom: 3px solid transparent; margin-bottom: -3px;
  letter-spacing: .01em; white-space: nowrap;
  transition: color var(--t), border-color var(--t);
}
.nav-item > a:hover,
.nav-item:hover > a { color: var(--ink); }
.nav-item > a.active { color: var(--accent); border-bottom-color: var(--accent); }
.nav-item > a .arrow {
  font-size: .58rem; opacity: .5;
  transition: transform var(--t), opacity var(--t);
}
.nav-item:hover > a .arrow { transform: rotate(180deg); opacity: .9; }

/* Dropdown */
.nav-dropdown {
  position: absolute; top: calc(100% + 3px); left: 0;
  background: var(--bg);
  border: 1px solid var(--rule);
  border-top: 2px solid var(--accent);
  min-width: 230px;
  box-shadow: var(--shadow-md);
  opacity: 0; pointer-events: none;
  transform: translateY(5px);
  transition: opacity .18s ease, transform .18s ease;
  z-index: 200;
}
.nav-item:hover .nav-dropdown,
.nav-item:focus-within .nav-dropdown {
  opacity: 1; pointer-events: all; transform: translateY(0);
}
.nav-dropdown .dd-head {
  font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-muted); padding: .55rem 1rem .3rem;
  font-family: var(--fm); border-bottom: 1px solid var(--rule-soft);
}
.nav-dropdown a {
  display: block; padding: .52rem 1rem;
  font-size: .82rem; color: var(--ink-mid);
  border-bottom: 1px solid var(--rule-soft);
  transition: background var(--t), color var(--t);
  font-family: var(--fn);
}
.nav-dropdown a:last-child { border-bottom: none; }
.nav-dropdown a:hover { background: var(--bg-warm); color: var(--accent); }
.nav-dropdown a .dd-sub {
  font-size: .7rem; color: var(--ink-faint); display: block; margin-top: .05rem;
}

/* CTA nav */
.h-cta { display: flex; align-items: center; margin-left: auto; padding-left: 1.5rem; }
.btn-cta {
  font-size: .78rem; font-weight: 600; letter-spacing: .04em;
  background: var(--accent); color: #fff;
  padding: .45rem 1rem; border-radius: var(--r);
  transition: background var(--t), transform var(--t);
  white-space: nowrap;
}
.btn-cta:hover { background: var(--accent-h); transform: translateY(-1px); }

/* Burger mobile */
.burger { display: none; flex-direction: column; gap: 5px; padding: 6px; margin-left: 1rem; }
.burger span { display: block; width: 22px; height: 1.5px; background: var(--ink); }

/* ══════════════════════════════════════
   MASTHEAD (hero di sezione)
══════════════════════════════════════ */
.masthead {
  background: var(--bg-warm);
  border-bottom: 1px solid var(--rule);
  padding: 0.75rem  2rem 0.75rem;
}
.masthead-inner { max-width: 1300px; margin: 0 auto; }

.breadcrumb {
  display: flex; align-items: center; gap: .35rem;
  font-size: .62rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-faint); font-family: var(--fm); margin-bottom: 0.2rem;
}
.breadcrumb a { color: var(--accent); opacity: .85; }
.breadcrumb a:hover { opacity: 1; }

.masthead-body { display: grid; grid-template-columns: 1fr auto; gap: 3rem; align-items: end; }

.kicker {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--fm); font-size: .65rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent); margin-bottom: .7rem;
}
.kicker::before { content: ''; width: 20px; height: 1.5px; background: currentColor; }
.kicker.blue   { color: var(--blue); }
.kicker.green  { color: var(--green); }
.kicker.amber  { color: var(--amber); }
.kicker.violet { color: var(--violet); }
.kicker.brown  { color: var(--brown); }

.masthead h1 {
  font-family: var(--fd); font-size: clamp(1.9rem, 4.2vw, 3rem);
  font-weight: 800; line-height: 1.08;
  color: var(--ink); letter-spacing: -.02em; margin-bottom: .85rem;
}
.masthead h1 em { font-style: italic; font-weight: 400; color: var(--ink-mid); }

.masthead-desc {
  font-family: var(--fs); font-size: 1.02rem;
  color: var(--ink-soft); line-height: 1.75; max-width: 560px;
}

.mstats { display: flex; flex-direction: column; gap: 1.1rem; border-left: 1px solid var(--rule); padding-left: 2.75rem; }
.mstat  { text-align: right; }
.mstat-n { font-family: var(--fd); font-size: 2rem; font-weight: 700; color: var(--ink); line-height: 1; }
.mstat-l { font-size: .62rem; color: var(--ink-muted); letter-spacing: .07em; text-transform: uppercase; margin-top: .12rem; }

/* ══════════════════════════════════════
   FILTER BAR
══════════════════════════════════════ */
.fbar {
  background: var(--bg); border-bottom: 1px solid var(--rule);
  position: sticky; top: 62px; z-index: 90;
}
.finner {
  max-width: 1300px; margin: 0 auto;
  padding: .65rem 2rem;
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
}

/* Search */
.sw { position: relative; flex: 1; min-width: 180px; max-width: 300px; }
.sw svg {
  position: absolute; left: 9px; top: 50%; transform: translateY(-50%);
  width: 13px; height: 13px; stroke: var(--ink-muted);
  fill: none; pointer-events: none; stroke-width: 2;
}
.sinput {
  width: 100%; height: 34px; padding: 0 .65rem 0 2rem;
  font-family: var(--fn); font-size: .8rem;
  border: 1px solid var(--rule); border-radius: var(--r);
  background: var(--bg-warm); color: var(--ink); outline: none;
  transition: border-color var(--t), box-shadow var(--t);
}
.sinput:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(139,26,46,.08); }
.sinput::placeholder { color: var(--ink-faint); }

/* Category pills */
.pills { display: flex; gap: .35rem; flex-wrap: wrap; }

/* Pill base (usato sia per cat che per subcat) */
.pill {
  font-size: .62rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
  padding: .25rem .75rem; border-radius: 2px;
  border: 1px solid var(--rule); color: var(--ink-soft);
  background: transparent; font-family: var(--fn);
  transition: all var(--t); cursor: pointer;
}
.pill:hover { border-color: var(--ink-mid); color: var(--ink); }
.pill.on    { background: var(--ink); border-color: var(--ink); color: #fff; }
.pill.on.pc { background: var(--accent);  border-color: var(--accent); }
.pill.on.pi { background: var(--blue);    border-color: var(--blue); }
.pill.on.pf { background: var(--amber);   border-color: var(--amber); }
.pill.on.pl { background: var(--green);   border-color: var(--green); }
.pill.on.pb { background: var(--violet);  border-color: var(--violet); }
.pill.on.ps { background: var(--brown);   border-color: var(--brown); }

/* Sort */
.sort-g { display: flex; align-items: center; gap: .4rem; margin-left: auto; }
.sort-lbl {
  font-size: .62rem; color: var(--ink-muted); letter-spacing: .07em;
  text-transform: uppercase; white-space: nowrap;
}
.sort-sel {
  font-family: var(--fn); font-size: .78rem;
  height: 34px; padding: 0 .6rem; border-radius: var(--r);
  border: 1px solid var(--rule); background: var(--bg-warm);
  color: var(--ink-mid); outline: none; cursor: pointer;
  transition: border-color var(--t);
}
.sort-sel:focus { border-color: var(--accent); }

/* Results count */
.cbadge { font-size: .7rem; font-family: var(--fm); color: var(--ink-muted); white-space: nowrap; }
.cbadge strong { color: var(--ink); }

/* ══════════════════════════════════════
   SUBCAT BAR (pagine categoria)
══════════════════════════════════════ */
.scbar {
  background: var(--bg-tint);
  border-bottom: 1px solid var(--rule-soft);
}
.scbar-inner {
  max-width: 1300px; margin: 0 auto;
  padding: .55rem 2rem;
  display: flex; align-items: center; gap: .75rem; flex-wrap: wrap;
}
.scbar-label {
  font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink-muted); font-family: var(--fm); white-space: nowrap;
  border-right: 1px solid var(--rule-soft); padding-right: .75rem;
}
.scpills { display: flex; gap: .35rem; flex-wrap: wrap; }

/* ══════════════════════════════════════
   LAYOUT PRINCIPALE
══════════════════════════════════════ */
.layout {
  max-width: 1300px; margin: 0 auto;
  padding: 2.5rem 2rem 5rem;
  display: grid; grid-template-columns: 1fr 285px;
  gap: 3.5rem; align-items: start;
}
.section-head {
  display: flex; align-items: center; gap: .75rem; margin-bottom: 1.1rem;
}
.section-head h2 {
  font-family: var(--fd); font-size: 1.15rem; font-weight: 700; color: var(--ink); white-space: nowrap;
}
.sh-rule { flex: 1; height: 1px; background: var(--rule); }

/* ══════════════════════════════════════
   DOCUMENT ROW (lista documenti)
══════════════════════════════════════ */
.docs-list { display: flex; flex-direction: column; }

.drow {
  display: grid; grid-template-columns: 108px 1fr 125px;
  border-bottom: 1px solid var(--rule-soft);
  padding: 1.2rem 0;
  cursor: pointer;
  transition: background var(--t);
  animation: ri .32s ease both;
}
@keyframes ri {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.drow:first-child { border-top: 1px solid var(--rule-soft); }
.drow:hover       { background: var(--bg-warm); margin: 0 -.75rem; padding-left: .75rem; padding-right: .75rem; }
.drow.urg         { border-left: 3px solid var(--accent); padding-left: .75rem; margin-left: -.75rem; }

/* Categoria badge */
.dcat { padding-top: .12rem; }
.cbadge2 {
  display: inline-flex; align-items: center; gap: .28rem;
  font-size: .6rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase;
  font-family: var(--fn); padding: .2rem .52rem; border-radius: 2px;
}
.cbadge2::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.cbc { background: var(--accent-faint);  color: var(--accent); }
.cbi { background: var(--blue-pale);    color: var(--blue); }
.cbf { background: var(--amber-pale);   color: var(--amber); }
.cbl { background: var(--green-pale);   color: var(--green); }
.cbb { background: var(--violet-pale);  color: var(--violet); }
.cbs { background: var(--brown-pale);   color: var(--brown); }

/* Contenuto riga */
.dmain { padding: 0 1.1rem 0 .35rem; }
.dtitle {
  font-family: var(--fd); font-size: 1.04rem; font-weight: 700;
  color: var(--ink); line-height: 1.28; margin-bottom: .32rem;
  transition: color var(--t);
}
.drow:hover .dtitle { color: var(--accent); }
.uflag {
  font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #fff; background: var(--accent);
  padding: .12rem .42rem; border-radius: 2px; margin-right: .35rem;
  vertical-align: middle;
}
.ddesc {
  font-family: var(--fs); font-size: .86rem; color: var(--ink-soft); line-height: 1.58;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  margin-bottom: .45rem;
}
.dtags { display: flex; gap: .3rem; flex-wrap: wrap; }
.dtag  {
  font-size: .6rem; font-family: var(--fm);
  color: var(--ink-muted); background: var(--bg-tint);
  border: 1px solid var(--rule-soft); padding: .12rem .45rem; border-radius: 2px;
}

/* Meta colonna */
.dmeta { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: .6rem; }
.ddate { font-family: var(--fm); font-size: .65rem; color: var(--ink-muted); text-align: right; line-height: 1.25; }
.ddate .dd { font-size: .88rem; color: var(--ink); display: block; font-weight: 500; }
.dft   { font-size: .6rem; font-family: var(--fm); color: var(--ink-faint); }
.dacts { display: flex; gap: .35rem; }
.bsm   { font-size: .62rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; padding: .25rem .6rem; border-radius: var(--r); transition: all var(--t); }
.bopen { background: var(--accent); color: #fff; border: 1px solid var(--accent); }
.bopen:hover { background: var(--accent-h); }
.bdl   { border: 1px solid var(--rule); color: var(--ink-soft); }
.bdl:hover { border-color: var(--ink-mid); color: var(--ink); }

/* No results */
.no-res { padding: 3rem 1rem; text-align: center; border: 1px dashed var(--rule); border-radius: var(--r); }
.no-res p { font-family: var(--fs); font-size: 1.05rem; color: var(--ink-muted); }

/* ══════════════════════════════════════
   SIDEBAR
══════════════════════════════════════ */
.sidebar { display: flex; flex-direction: column; gap: 2rem; }

.wg       { border-top: 2px solid var(--ink); }
.wg-head  {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: .65rem 0 .55rem; border-bottom: 1px solid var(--rule-soft);
}
.wg-head h3 { font-family: var(--fd); font-size: 1.08rem; font-weight: 700; color: var(--ink); }
.wg-head span { font-size: .65rem; font-family: var(--fm); color: var(--ink-muted); }
.wg-body    { padding: .75rem 0; }

/* Alert box scadenze */
.alert-box {
  background: var(--accent-faint); border-left: 3px solid var(--accent);
  padding: .9rem 1rem; border-radius: var(--r); margin-bottom: .6rem;
}
.alert-box:last-child { margin-bottom: 0; }
.alert-box.blue  { background: var(--blue-pale);  border-left-color: var(--blue); }
.albl  { font-size: .6rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin-bottom: .35rem; }
.blue .albl  { color: var(--blue); }
.atitle { font-family: var(--fd); font-size: .95rem; font-weight: 700; color: var(--ink); line-height: 1.28; margin-bottom: .35rem; }
.adesc  { font-size: .8rem; color: var(--ink-soft); line-height: 1.5; margin-bottom: .6rem; font-family: var(--fs); }
.alink  { font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); border-bottom: 1px solid var(--accent); padding-bottom: .08rem; transition: opacity var(--t); }
.alink:hover { opacity: .65; }
.blue .alink { color: var(--blue); border-color: var(--blue); }

/* Categorie lista */
.cat-ul { list-style: none; display: flex; flex-direction: column; }
.cat-ul li a {
  display: flex; align-items: center; padding: .48rem 0;
  font-size: .86rem; color: var(--ink-mid);
  border-bottom: 1px solid var(--rule-soft);
  transition: color var(--t); font-family: var(--fs);
}
.cat-ul li:last-child a { border-bottom: none; }
.cat-ul li a:hover { color: var(--accent); }
.cdot  { width: 6px; height: 6px; border-radius: 50%; margin-right: .6rem; flex-shrink: 0; }
.cname { flex: 1; }
.cnum  {
  font-size: .65rem; font-family: var(--fm); color: var(--ink-muted);
  background: var(--bg-tint); border: 1px solid var(--rule-soft);
  padding: .1rem .42rem; border-radius: 2px;
}

/* Recenti */
.rec-ul { list-style: none; display: flex; flex-direction: column; }
.ri     { display: flex; gap: .7rem; padding: .68rem 0; border-bottom: 1px solid var(--rule-soft); }
.ri:last-child { border-bottom: none; }
.rdt   { font-family: var(--fm); font-size: .65rem; color: var(--ink-muted); text-align: center; min-width: 26px; padding-top: .08rem; line-height: 1.2; }
.rdt .rd { font-size: .88rem; color: var(--accent); font-weight: 500; display: block; }
.rm a  { font-family: var(--fs); font-size: .84rem; color: var(--ink); line-height: 1.32; display: block; margin-bottom: .18rem; }
.rm a:hover { color: var(--accent); }
.rcat  { font-size: .62rem; font-family: var(--fm); color: var(--ink-muted); text-transform: uppercase; letter-spacing: .06em; }

/* Newsletter box sidebar */
.nl-box { background: var(--bg-tint); border: 1px solid var(--rule-soft); padding: 1.2rem; border-radius: var(--r); }
.nl-box h3 { font-family: var(--fd); font-size: 1.05rem; font-weight: 700; margin-bottom: .4rem; }
.nl-box p  { font-size: .8rem; color: var(--ink-soft); line-height: 1.55; margin-bottom: .9rem; font-family: var(--fs); }
.nl-box input {
  width: 100%; height: 34px; padding: 0 .7rem;
  font-family: var(--fn); font-size: .8rem;
  border: 1px solid var(--rule); border-radius: var(--r);
  background: var(--bg); color: var(--ink); outline: none; margin-bottom: .45rem;
  transition: border-color var(--t);
}
.nl-box input:focus { border-color: var(--accent); }
.nl-box button {
  width: 100%; font-family: var(--fn); font-size: .78rem; font-weight: 600; letter-spacing: .04em;
  background: var(--accent); color: #fff; padding: .55rem;
  border-radius: var(--r); transition: background var(--t);
}
.nl-box button:hover { background: var(--accent-h); }

/* CTA box */
.cta-box { border-top: 2px solid var(--ink); padding: 1rem 0; }
.cta-box h3 { font-family: var(--fd); font-size: 1.02rem; font-weight: 700; margin-bottom: .38rem; }
.cta-box p  { font-size: .8rem; color: var(--ink-soft); font-family: var(--fs); line-height: 1.55; margin-bottom: .8rem; }
.cta-box a  { font-size: .78rem; font-weight: 600; color: var(--accent); border-bottom: 1px solid var(--accent); padding-bottom: .08rem; transition: opacity var(--t); }
.cta-box a:hover { opacity: .65; }

/* ══════════════════════════════════════
   NEWSLETTER BAR
══════════════════════════════════════ */
.nl-bar { background: var(--bg-tint); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 2rem; }
.nl-bar-in {
  max-width: 1300px; margin: 0 auto;
  display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
}
.nl-t p  { font-size: .62rem; font-family: var(--fm); color: var(--ink-muted); letter-spacing: .09em; text-transform: uppercase; margin-bottom: .28rem; }
.nl-t h2 { font-family: var(--fd); font-size: 1.45rem; font-weight: 700; color: var(--ink); }
.nl-t    { flex: 1; }
.nl-f    { display: flex; gap: .45rem; }
.nl-f input {
  font-family: var(--fn); font-size: .82rem;
  height: 38px; padding: 0 .9rem; border-radius: var(--r);
  border: 1px solid var(--rule); background: var(--bg); color: var(--ink);
  outline: none; width: 250px; transition: border-color var(--t);
}
.nl-f input:focus { border-color: var(--accent); }
.nl-f input::placeholder { color: var(--ink-faint); }
.nl-f button {
  font-family: var(--fn); font-size: .78rem; font-weight: 600;
  background: var(--accent); color: #fff; padding: 0 1.1rem;
  border-radius: var(--r); transition: background var(--t);
}
.nl-f button:hover { background: var(--accent-h); }

/* ══════════════════════════════════════
   FOOTER
══════════════════════════════════════ */
.foot { background: var(--ink); padding: 2.75rem 2rem 1.75rem; }
.foot-in { max-width: 1300px; margin: 0 auto; }
.foot-g {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 2.5rem;
  padding-bottom: 1.75rem; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: 1.35rem;
}
.fn2  { font-family: var(--fd); font-size: 1.05rem; font-weight: 700; color: #fff; margin-bottom: .35rem; }
.fs3  { font-size: .62rem; color: rgba(255,255,255,.28); font-family: var(--fm); letter-spacing: .08em; text-transform: uppercase; }
.fdiv { width: 24px; height: 2px; background: var(--accent); margin: .85rem 0; }
.fbio { font-size: .8rem; color: rgba(255,255,255,.32); font-family: var(--fs); line-height: 1.65; }
.fc h4 {
  font-size: .62rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.28); margin-bottom: .8rem;
  padding-bottom: .55rem; border-bottom: 1px solid rgba(255,255,255,.06);
}
.fc ul { list-style: none; display: flex; flex-direction: column; gap: .4rem; }
.fc ul li a { font-size: .8rem; color: rgba(255,255,255,.38); font-family: var(--fs); transition: color var(--t); }
.fc ul li a:hover { color: rgba(255,255,255,.75); }
.foot-b { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .6rem; }
.foot-b p { font-size: .72rem; color: rgba(255,255,255,.2); font-family: var(--fm); }
.foot-b a { color: rgba(255,255,255,.32); }
.foot-b a:hover { color: rgba(255,255,255,.6); }

/* ══════════════════════════════════════
   MODAL
══════════════════════════════════════ */
.mbg {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(17,17,17,.55); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center; padding: 1.5rem;
  opacity: 0; pointer-events: none; transition: opacity .22s ease;
}
.mbg.open { opacity: 1; pointer-events: all; }
.mpanel {
  background: var(--bg); max-width: 650px; width: 100%;
  max-height: 90vh; overflow-y: auto;
  border-top: 3px solid var(--accent);
  box-shadow: var(--shadow-lg);
  transform: translateY(20px); transition: transform .22s ease;
}
.mbg.open .mpanel { transform: translateY(0); }
.mph {
  background: var(--bg-warm); border-bottom: 1px solid var(--rule);
  padding: 1.6rem 1.75rem; position: relative;
}
.mcat   { font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-family: var(--fn); color: var(--accent); margin-bottom: .45rem; }
.mtitle { font-family: var(--fd); font-size: 1.38rem; font-weight: 800; color: var(--ink); line-height: 1.18; padding-right: 2.2rem; }
.mx {
  position: absolute; top: 1.1rem; right: 1.1rem;
  width: 26px; height: 26px; border-radius: 50%;
  border: 1px solid var(--rule); color: var(--ink-muted);
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; transition: all var(--t);
}
.mx:hover { background: var(--rule); color: var(--ink); }
.mpb   { padding: 1.6rem 1.75rem; }
.mgrid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: 1.1rem; }
.mi label { font-size: .62rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-muted); display: block; margin-bottom: .18rem; font-family: var(--fn); }
.mi span  { font-size: .88rem; color: var(--ink); font-weight: 500; font-family: var(--fs); }
.mtext { font-family: var(--fs); font-size: .9rem; color: var(--ink-mid); line-height: 1.75; border-top: 1px solid var(--rule-soft); padding-top: 1rem; margin-bottom: 1.3rem; }
.macts { display: flex; gap: .65rem; flex-wrap: wrap; }
.bmp {
  flex: 1; font-family: var(--fn); font-size: .8rem; font-weight: 600; letter-spacing: .04em;
  background: var(--accent); color: #fff; padding: .62rem 1.1rem; border-radius: var(--r);
  display: flex; align-items: center; justify-content: center; gap: .4rem;
  transition: background var(--t);
}
.bmp:hover { background: var(--accent-h); }
.bms {
  font-family: var(--fn); font-size: .8rem; font-weight: 500;
  border: 1px solid var(--rule); color: var(--ink-soft);
  padding: .62rem 1rem; border-radius: var(--r);
  display: flex; align-items: center; gap: .35rem; transition: all var(--t);
}
.bms:hover { border-color: var(--ink-mid); color: var(--ink); }

/* ══════════════════════════════════════
   TOAST
══════════════════════════════════════ */
.toast {
  position: fixed; bottom: 1.6rem; right: 1.6rem; z-index: 2000;
  background: var(--ink); color: #fff;
  padding: .7rem 1rem; border-radius: var(--r);
  font-size: .82rem; font-family: var(--fn);
  display: flex; align-items: center; gap: .45rem;
  box-shadow: var(--shadow-md); border-left: 3px solid var(--accent);
  transform: translateY(55px); opacity: 0; transition: all var(--t);
}
.toast.show { transform: translateY(0); opacity: 1; }

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1040px) {
  .layout { grid-template-columns: 1fr; gap: 2rem; }
  .sidebar { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .masthead-body { grid-template-columns: 1fr; }
  .mstats { flex-direction: row; border-left: none; padding-left: 0; border-top: 1px solid var(--rule); padding-top: 1.1rem; margin-top: .5rem; }
  .foot-g { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .main-nav .nav-list { display: none; }
  .burger             { display: flex; }
  .sidebar            { grid-template-columns: 1fr; }
  .drow               { grid-template-columns: 1fr; }
  .dcat               { margin-bottom: .45rem; }
  .dmeta              { flex-direction: row; align-items: center; margin-top: .65rem; }
  .pills              { display: none; }
  .topstrip           { display: none; }
  .foot-g             { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .masthead           { padding: 2.5rem 1.25rem 2rem; }
  .layout             { padding: 1.75rem 1.25rem 3.5rem; }
  .finner             { padding: .6rem 1.25rem; }
  .scbar-inner        { padding: .55rem 1.25rem; }
  .nl-bar             { padding: 1.75rem 1.25rem; }
}