/* =========================================================================
   DigitalPM — Magazine sub-brand editorial CSS
   Ported from the Claude Design handoff bundle. Self-hosted fonts, no CDN.
   Tokens mirror theme.json presets (--wp--preset--color--*) but are also
   aliased to --dpm-* so the bundle's class vocabulary ports 1:1.
   ========================================================================= */

/* ---- Self-hosted fonts (latin + latin-ext) --------------------------- */
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/fraunces-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Fraunces";
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/fraunces-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Fraunces";
  font-style: italic;
  font-weight: 400 600;
  font-display: swap;
  src: url("../fonts/fraunces-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Fraunces";
  font-style: italic;
  font-weight: 400 600;
  font-display: swap;
  src: url("../fonts/fraunces-italic-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url("../fonts/jetbrainsmono-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url("../fonts/jetbrainsmono-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---- Token aliases (bundle vocabulary -> wp presets) ----------------- */
:root {
  --dpm-accent:        var(--wp--preset--color--accent, #FF4D2E);
  --dpm-accent-700:    var(--wp--preset--color--accent-700, #E53A1C);
  --dpm-accent-800:    var(--wp--preset--color--accent-800, #B8290E);
  --dpm-accent-100:    var(--wp--preset--color--accent-100, #FFE9E1);
  --dpm-accent-050:    var(--wp--preset--color--accent-050, #FFF5F1);
  --dpm-ink:           var(--wp--preset--color--ink, #0A0B0D);
  --dpm-ink-2:         var(--wp--preset--color--ink-2, #1A1A1C);
  --dpm-paper:         var(--wp--preset--color--paper, #FAF7F2);
  --dpm-paper-2:       var(--wp--preset--color--paper-2, #F2EDE4);
  --dpm-navy:          var(--wp--preset--color--navy, #00263F);
  --dpm-navy-2:        var(--wp--preset--color--navy-2, #003560);
  --dpm-highlight:     var(--wp--preset--color--highlight, #FFE066);
  --dpm-rule:          var(--wp--preset--color--rule, #1A1A1C);

  --dpm-font-serif:    "Fraunces", "Source Serif Pro", Georgia, serif;
  --dpm-font-sans:     "Inter", "Helvetica Neue", Arial, sans-serif;
  --dpm-font-mono:     "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --dpm-container:     1320px;
  --dpm-container-text: 720px;

  /* category colours */
  --dpm-cat-metodo:    var(--dpm-accent);
  --dpm-cat-tool:      var(--dpm-navy);
  --dpm-cat-stima:     var(--dpm-ink);
  --dpm-cat-persone:   var(--wp--preset--color--cat-persone, #1F8A5B);
  --dpm-cat-ai:        var(--wp--preset--color--cat-ai, #7E3FF2);
  --dpm-cat-carriera:  var(--wp--preset--color--cat-carriera, #C68A1F);
}

html, body { font-family: var(--dpm-font-sans); color: var(--dpm-ink); background: #fff; }

/* ---- Typography ------------------------------------------------------ */
.dpm-display { font-family: var(--dpm-font-serif); font-weight: 700; font-variation-settings: "opsz" 144, "SOFT" 50; line-height: 0.96; letter-spacing: -0.025em; color: var(--dpm-ink); text-wrap: balance; margin: 0; }
.dpm-h1 { font-family: var(--dpm-font-serif); font-weight: 700; font-variation-settings: "opsz" 96; font-size: clamp(36px, 4.4vw, 64px); line-height: 1.02; letter-spacing: -0.022em; color: var(--dpm-ink); text-wrap: balance; margin: 0; }
.dpm-h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-variation-settings: "opsz" 60; font-size: clamp(28px, 2.6vw, 40px); line-height: 1.06; letter-spacing: -0.018em; color: var(--dpm-ink); margin: 0; text-wrap: balance; }
.dpm-h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-variation-settings: "opsz" 36; font-size: 24px; line-height: 1.18; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 0; }
.dpm-kicker, .dpm-eyebrow { font-family: var(--dpm-font-sans); font-weight: 600; font-size: 12px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); display: inline-flex; align-items: center; gap: 8px; }
.dpm-eyebrow--ink { color: var(--dpm-ink); }
.dpm-eyebrow--paper { color: rgba(255,255,255,0.85); }
.dpm-meta { font-family: var(--dpm-font-mono); font-size: 11px; line-height: 1; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dpm-ink-2); opacity: 0.7; }
.dpm-body { font-family: var(--dpm-font-sans); font-size: 16px; line-height: 1.6; color: var(--dpm-ink-2); }
.dpm-lead { font-family: var(--dpm-font-serif); font-weight: 400; font-variation-settings: "opsz" 36; font-size: 22px; line-height: 1.4; color: var(--dpm-ink-2); letter-spacing: -0.005em; }

/* ---- Buttons --------------------------------------------------------- */
.dpm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-family: var(--dpm-font-sans); font-weight: 600; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; padding: 14px 22px; border-radius: 0; border: 1px solid transparent; cursor: pointer; transition: background 120ms ease, color 120ms ease, border-color 120ms ease; text-decoration: none; white-space: nowrap; }
.dpm-btn--primary { background: var(--dpm-accent); color: #fff; }
.dpm-btn--primary:hover { background: var(--dpm-accent-700); color: #fff; }
.dpm-btn--ink { background: var(--dpm-ink); color: #fff; }
.dpm-btn--ink:hover { background: var(--dpm-navy); color: #fff; }
.dpm-btn--ghost { background: transparent; color: var(--dpm-ink); border-color: var(--dpm-ink); }
.dpm-btn--ghost:hover { background: var(--dpm-ink); color: #fff; }
.dpm-btn--ghost-paper { background: transparent; color: #fff; border-color: rgba(255,255,255,0.6); }
.dpm-btn--ghost-paper:hover { background: #fff; color: var(--dpm-ink); border-color: #fff; }

/* ---- Tag pills ------------------------------------------------------- */
.dpm-tag { display: inline-flex; align-items: center; font-family: var(--dpm-font-sans); font-weight: 600; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; padding: 5px 9px; border-radius: 2px; background: var(--dpm-accent); color: #fff; text-decoration: none; line-height: 1; }
.dpm-tag--paper { background: var(--dpm-ink); color: #fff; }
.dpm-tag--ghost { background: transparent; color: var(--dpm-ink); border: 1px solid var(--dpm-ink); }
.dpm-tag--navy { background: var(--dpm-navy); color: #fff; }
/* category-coloured tags (mapped from post terms) */
.dpm-tag.cat-tool { background: var(--dpm-navy); }
.dpm-tag.cat-stima { background: var(--dpm-ink); }
.dpm-tag.cat-persone { background: var(--dpm-cat-persone); }
.dpm-tag.cat-ai { background: var(--dpm-cat-ai); }
.dpm-tag.cat-carriera { background: var(--dpm-cat-carriera); }

/* ---- Editorial primitives ------------------------------------------- */
.dpm-rule { border: 0; border-top: 1px solid var(--dpm-ink); height: 0; margin: 0; opacity: 1; }
.dpm-rule--soft { border-top: 1px solid #DCDCD8; }
.dpm-rule--thick { border-top: 3px solid var(--dpm-ink); }
.dpm-rule--accent { border-top: 3px solid var(--dpm-accent); }
.dpm-marker { background: linear-gradient(180deg, transparent 60%, var(--dpm-highlight) 60%); padding: 0 2px; }
.dpm-link { color: var(--dpm-ink); text-decoration: underline; text-decoration-color: var(--dpm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; font-weight: 500; }
.dpm-link:hover { color: var(--dpm-accent); }
a.dpm-bare { color: var(--dpm-ink); text-decoration: none; }
a.dpm-bare:hover { color: var(--dpm-accent); }

/* ---- Containers ------------------------------------------------------ */
.dpm-wrap { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.dpm-wrap-text { max-width: var(--dpm-container-text); margin: 0 auto; padding: 0 24px; }

/* =========================================================================
   HEADER / TOPBAR (parts/header.html)
   ========================================================================= */
.topbar { background: var(--dpm-ink); color: #fff; }
.topbar-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 9px 32px; display: flex; justify-content: space-between; align-items: center; font-family: var(--dpm-font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.85); flex-wrap: wrap; gap: 8px; }
.topbar a { color: rgba(255,255,255,0.85); text-decoration: none; margin-left: 20px; }
.topbar a:hover { color: var(--dpm-accent); }
.topbar-issue b { color: #fff; }
.topbar .wp-block-navigation { gap: 0; }
.topbar .wp-block-navigation .wp-block-navigation-item__content { color: rgba(255,255,255,0.85); font-family: var(--dpm-font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; }
.topbar .wp-block-navigation a:hover { color: var(--dpm-accent); }

.hdr { background: #fff; border-bottom: 1px solid var(--dpm-ink); position: sticky; top: 0; z-index: 50; }
.hdr-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 18px 32px; display: flex; align-items: center; gap: 32px; }
.hdr-logo img, .hdr-logo .custom-logo { height: 44px; width: auto; display: block; }
.hdr-nav { display: flex; gap: 26px; flex: 1; }
.hdr-nav a, .hdr-nav .wp-block-navigation-item__content { font-family: var(--dpm-font-sans); font-weight: 600; font-size: 13px; color: var(--dpm-ink); text-decoration: none; letter-spacing: -0.005em; }
.hdr-nav a:hover, .hdr-nav a.active, .hdr-nav .current-menu-item a { color: var(--dpm-accent); }
.hdr-actions { display: flex; gap: 10px; align-items: center; }
.hdr-search { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--dpm-ink); width: 220px; font-family: var(--dpm-font-sans); font-size: 13px; }
.hdr-search input, .hdr-search .wp-block-search__input { border: 0; outline: 0; flex: 1; font-family: inherit; font-size: 13px; background: transparent; color: var(--dpm-ink); padding: 0; }
.hdr-search input::placeholder { color: var(--dpm-ink-2); opacity: 0.5; }
.hdr-search svg { flex-shrink: 0; opacity: 0.7; }
.hdr-search .wp-block-search__inside-wrapper { border: 0; }
.hdr-search .wp-block-search__button { display: none; }

/* =========================================================================
   FOOTER (parts/footer.html)
   ========================================================================= */
.ft { background: var(--dpm-ink); color: #fff; padding: 72px 0 24px; }
.ft-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.ft-top { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 48px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,0.18); }
.ft-brand img { height: 50px; width: auto; filter: invert(1); }
.ft-tag { font-family: var(--dpm-font-serif); font-weight: 400; font-style: italic; font-size: 18px; line-height: 1.3; color: rgba(255,255,255,0.85); margin: 18px 0; max-width: 320px; }
.ft-social { display: flex; gap: 10px; margin-top: 10px; }
.ft-social a { width: 36px; height: 36px; border: 1px solid rgba(255,255,255,0.3); display: flex; align-items: center; justify-content: center; color: #fff; text-decoration: none; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; transition: background 120ms ease; }
.ft-social a:hover { background: var(--dpm-accent); border-color: var(--dpm-accent); color: #fff; }
.ft-col h4 { font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); margin: 0 0 14px; }
.ft-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ft-col a, .ft-col .wp-block-navigation-item__content { color: rgba(255,255,255,0.8); text-decoration: none; font-family: var(--dpm-font-sans); font-size: 13px; }
.ft-col a:hover { color: var(--dpm-accent); }
.ft-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 24px; font-family: var(--dpm-font-mono); font-size: 11px; color: rgba(255,255,255,0.55); text-transform: uppercase; letter-spacing: 0.06em; flex-wrap: wrap; gap: 8px; }
.ft-bottom a { color: rgba(255,255,255,0.55); text-decoration: none; margin-left: 20px; }
.ft-bottom a:hover { color: var(--dpm-accent); }

/* =========================================================================
   GENERIC SECTION HEADINGS (shared)
   ========================================================================= */
.sec { padding: 64px 0; }
.sec--paper { background: var(--dpm-paper); border-bottom: 1px solid var(--dpm-ink); border-top: 1px solid var(--dpm-ink); }
.sec--dark { background: var(--dpm-navy); color: #fff; }
.sec-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); margin-bottom: 32px; gap: 24px; flex-wrap: wrap; }
.sec--dark .sec-head { border-bottom-color: rgba(255,255,255,0.25); }
.sec-head h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; letter-spacing: -0.018em; line-height: 1; margin: 0; color: inherit; }
.sec-head h2 b { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.sec--dark .sec-head h2 b { color: #FFD5C5; }
.sec-head-meta { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); }
.sec--dark .sec-head-meta { color: rgba(255,255,255,0.7); }
.sec-head-link { font-family: var(--dpm-font-sans); font-weight: 600; font-size: 13px; color: var(--dpm-ink); text-decoration: none; border-bottom: 2px solid var(--dpm-accent); padding-bottom: 2px; }
.sec--dark .sec-head-link { color: #fff; }
.sec-head-link:hover { color: var(--dpm-accent); }

/* =========================================================================
   FRONT PAGE — variant B "Magazine board" (templates/front-page.html)
   ========================================================================= */
.issue-strip { background: var(--dpm-accent); color: #fff; padding: 14px 0; border-bottom: 1px solid var(--dpm-ink); }
.issue-strip-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; display: flex; align-items: center; justify-content: space-between; font-family: var(--dpm-font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; flex-wrap: wrap; gap: 12px; }
.issue-strip-inner b { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 16px; letter-spacing: -0.005em; text-transform: none; }
.issue-strip-meta { display: flex; gap: 24px; flex-wrap: wrap; }

.mosaic { padding: 32px 0 0; }
.mosaic-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.mosaic-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: minmax(120px, auto); gap: 20px; }

.tile { display: flex; flex-direction: column; gap: 12px; text-decoration: none; color: var(--dpm-ink); position: relative; overflow: hidden; }
.tile-img { aspect-ratio: 16/10; position: relative; overflow: hidden; background-size: cover; background-position: center; }
.tile-img-cap { position: absolute; bottom: 12px; left: 12px; right: 12px; font-family: var(--dpm-font-mono); font-size: 10px; color: #fff; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.7; }
.tile-tags { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tile-h { font-family: var(--dpm-font-serif); font-weight: 600; line-height: 1.08; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 0; text-wrap: balance; font-size: 22px; }
.tile-h a { color: inherit; text-decoration: none; }
.tile-h a:hover { color: var(--dpm-accent); }
.tile-meta { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.7; display: flex; gap: 10px; flex-wrap: wrap; }
.tile-dek { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 18px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0; }

.tile-A { grid-column: span 6; grid-row: span 2; }
.tile-A .tile-img { aspect-ratio: 16/10; background-color: var(--dpm-navy); background-image: linear-gradient(135deg, #00263F, #1A6BA0); display: flex; align-items: flex-end; padding: 20px; }
.tile-A .tile-img::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 75% 35%, rgba(255,77,46,0.4), transparent 55%); }
.tile-A .tile-h { font-size: 44px; }
.tile-B { grid-column: span 3; grid-row: span 2; background: var(--dpm-accent); color: #fff; padding: 24px; }
.tile-B .tile-h { color: #fff; font-size: 26px; }
.tile-B .tile-meta { color: rgba(255,255,255,0.7); }
.tile-B .tile-img { background: rgba(255,255,255,0.15); aspect-ratio: 1; display: flex; align-items: center; justify-content: center; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 60px; color: rgba(255,255,255,0.9); }
.tile-C { grid-column: span 3; grid-row: span 2; background: var(--dpm-paper); padding: 24px; }
.tile-D { grid-column: span 4; }
.tile-D .tile-img { background: linear-gradient(135deg, #FFE9E1, #FFD5C5); }
.tile-E { grid-column: span 4; background: var(--dpm-ink); color: #fff; padding: 24px; }
.tile-E .tile-h { color: #fff; }
.tile-E .tile-meta { color: rgba(255,255,255,0.6); }
.tile-E .quote { font-family: var(--dpm-font-serif); font-style: italic; font-size: 22px; line-height: 1.25; color: #fff; margin: 0; }
.tile-E .quote::before { content: "\201C"; color: var(--dpm-accent); font-size: 36px; line-height: 0.5; vertical-align: -10px; }
.tile-F { grid-column: span 4; }
.tile-F .tile-img { background: linear-gradient(135deg, #DCE8F1, #B6D0E3); }
.tile-G { grid-column: span 3; padding: 22px; border: 1px solid var(--dpm-ink); display: flex; flex-direction: column; gap: 10px; }
.tile-G .tile-h { font-size: 18px; }
.tile-H { grid-column: span 6; background: var(--dpm-navy); color: #fff; padding: 28px; display: flex; flex-direction: column; gap: 14px; position: relative; }
.tile-H .tile-h { color: #fff; font-size: 28px; }
.tile-H .tile-meta { color: rgba(255,255,255,0.65); }
.tile-H .nl-mini-form { display: flex; gap: 0; margin-top: auto; }
.tile-H .nl-mini-form input { flex: 1; padding: 12px 14px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.3); color: #fff; font-family: var(--dpm-font-sans); font-size: 13px; }
.tile-H .nl-mini-form input::placeholder { color: rgba(255,255,255,0.5); }
.tile-H .nl-mini-form button { background: var(--dpm-accent); border: 1px solid var(--dpm-accent); color: #fff; padding: 12px 18px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.tile-I { grid-column: span 3; padding: 0; }
.tile-I .tile-img { background: linear-gradient(135deg, #FAF7F2, #F2EDE4); aspect-ratio: 4/5; }

/* Rubriche colour blocks */
.rb { padding: 64px 0; background: var(--dpm-paper); border-top: 1px solid var(--dpm-ink); border-bottom: 1px solid var(--dpm-ink); margin-top: 64px; }
.rb-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.rb-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); margin-bottom: 28px; gap: 16px; flex-wrap: wrap; }
.rb-head h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 40px; letter-spacing: -0.02em; line-height: 1; margin: 0; }
.rb-head h2 b { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.rb-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.rb-card { padding: 20px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; min-height: 140px; transition: transform 120ms ease; }
.rb-card:hover { transform: translateY(-3px); }
.rb-card .glyph { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 48px; line-height: 0.9; }
.rb-card .name { font-family: var(--dpm-font-sans); font-weight: 700; font-size: 14px; letter-spacing: -0.005em; margin-top: auto; }
.rb-card .count { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.7; }
.rb-card.m { background: var(--dpm-accent); color: #fff; }
.rb-card.t { background: var(--dpm-navy); color: #fff; }
.rb-card.s { background: var(--dpm-ink); color: #fff; }
.rb-card.p { background: var(--dpm-cat-persone); color: #fff; }
.rb-card.a { background: var(--dpm-cat-ai); color: #fff; }
.rb-card.c { background: var(--dpm-cat-carriera); color: #fff; }

/* Big lead magnet block */
.mag-b { padding: 64px 0; }
.mag-b-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.mag-b-card { background: var(--dpm-ink); color: #fff; padding: 56px; display: grid; grid-template-columns: 1fr 1.4fr; gap: 56px; align-items: center; position: relative; overflow: hidden; }
.mag-b-card::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 300px; height: 300px; background: radial-gradient(circle, rgba(255,77,46,0.4), transparent 65%); }
.mag-b-vis { position: relative; z-index: 1; display: flex; justify-content: center; }
.mag-b-cover { width: 240px; aspect-ratio: 3/4; background: linear-gradient(160deg, var(--dpm-accent), #B8290E); color: #fff; padding: 28px 22px; display: flex; flex-direction: column; gap: 8px; transform: rotate(-4deg); box-shadow: 12px 12px 0 #FAF7F2; }
.mag-b-cover .label { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.12em; opacity: 0.8; }
.mag-b-cover .title { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 32px; line-height: 0.98; letter-spacing: -0.015em; margin-top: 12px; }
.mag-b-body { position: relative; z-index: 1; }
.mag-b-body h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 48px; line-height: 1; letter-spacing: -0.022em; margin: 12px 0 16px; color: #fff; }
.mag-b-body p { font-family: var(--dpm-font-sans); font-size: 16px; line-height: 1.55; color: rgba(255,255,255,0.85); margin: 0 0 24px; max-width: 520px; }
.mag-b-form, .dpm-inline-form { display: flex; gap: 0; max-width: 460px; }
.mag-b-form input { flex: 1; padding: 14px 16px; border: 1px solid rgba(255,255,255,0.3); background: rgba(255,255,255,0.08); color: #fff; font-family: var(--dpm-font-sans); font-size: 14px; outline: 0; }
.mag-b-form input::placeholder { color: rgba(255,255,255,0.5); }
.mag-b-form button { background: var(--dpm-accent); color: #fff; border: 1px solid var(--dpm-accent); padding: 14px 22px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }

/* Recent dense grid (front + home variant A) */
.recent { padding: 64px 0; border-top: 1px solid var(--dpm-ink); }
.recent-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.recent-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); margin-bottom: 28px; gap: 16px; flex-wrap: wrap; }
.recent-head h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; letter-spacing: -0.018em; line-height: 1; margin: 0; }
.recent-head h2 b { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.recent-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.rc { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--dpm-ink); }
.rc .img { aspect-ratio: 4/3; background: var(--dpm-paper-2); background-size: cover; background-position: center; }
.rc .h { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 18px; line-height: 1.15; letter-spacing: -0.008em; margin: 0; }
.rc .h a { color: inherit; text-decoration: none; }
.rc .h a:hover { color: var(--dpm-accent); }
.rc .m { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; opacity: 0.7; }

/* =========================================================================
   HOME variant A — editorial classic (templates/home.html)
   ========================================================================= */
.hero { padding: 32px 0 56px; border-bottom: 1px solid var(--dpm-ink); }
.hero-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.hero-issue { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); margin-bottom: 28px; gap: 16px; flex-wrap: wrap; }
.hero-issue h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-style: italic; font-size: 28px; letter-spacing: -0.01em; margin: 0; color: var(--dpm-ink); }
.hero-issue h2 b { font-style: normal; color: var(--dpm-accent); }
.hero-issue-meta { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); }
.hero-grid { display: grid; grid-template-columns: 1.7fr 1px 1fr; gap: 40px; }
.hero-divider { background: var(--dpm-ink); width: 1px; }
.lead { display: flex; flex-direction: column; gap: 20px; }
.lead-img { aspect-ratio: 16/9; background-color: var(--dpm-navy); background-image: linear-gradient(135deg, #00263F 0%, #003560 60%, #1A6BA0 100%); position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 24px; background-size: cover; background-position: center; }
.lead-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 54px; line-height: 1.0; letter-spacing: -0.022em; color: var(--dpm-ink); margin: 0; text-wrap: balance; }
.lead-h a { color: inherit; text-decoration: none; }
.lead-h a:hover { color: var(--dpm-accent); }
.lead-dek { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 20px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0; max-width: 620px; }
.lead-tags { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.lead-byline { display: flex; align-items: center; gap: 12px; font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); flex-wrap: wrap; }
.lead-byline .avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--dpm-paper-2); border: 1px solid var(--dpm-ink); display: inline-flex; align-items: center; justify-content: center; font-family: var(--dpm-font-serif); font-weight: 600; font-size: 12px; color: var(--dpm-ink); }
.lead-byline b { font-family: var(--dpm-font-sans); font-weight: 600; color: var(--dpm-ink); letter-spacing: 0; text-transform: none; font-size: 13px; }
.side { display: flex; flex-direction: column; gap: 0; }
.side-item { padding: 20px 0; border-bottom: 1px dotted #BDBDC1; display: flex; flex-direction: column; gap: 8px; }
.side-item:first-child { padding-top: 0; }
.side-item:last-child { border-bottom: 0; padding-bottom: 0; }
.side-h { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 22px; line-height: 1.1; letter-spacing: -0.01em; color: var(--dpm-ink); margin: 0; text-wrap: balance; }
.side-h a { color: inherit; text-decoration: none; }
.side-h a:hover { color: var(--dpm-accent); }
.side-thumb { aspect-ratio: 16/9; background: var(--dpm-paper-2); background-image: linear-gradient(135deg, #FAF7F2 0%, #F2EDE4 100%); background-size: cover; background-position: center; }

/* Newsletter inline (home A) */
.nl { background: var(--dpm-paper); padding: 64px 0; border-top: 1px solid var(--dpm-ink); border-bottom: 1px solid var(--dpm-ink); }
.nl-inner { max-width: 920px; margin: 0 auto; padding: 0 32px; text-align: center; }
.nl h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 52px; line-height: 1; letter-spacing: -0.022em; margin: 14px 0 16px; color: var(--dpm-ink); }
.nl h2 em { font-style: italic; font-weight: 500; }
.nl p { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 20px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0 auto 28px; max-width: 640px; }
.nl-form { display: flex; gap: 0; max-width: 520px; margin: 0 auto; }
.nl-form input { flex: 1; padding: 16px 18px; border: 1px solid var(--dpm-ink); border-right: 0; background: #fff; font-family: var(--dpm-font-sans); font-size: 15px; outline: 0; }
.nl-form button { background: var(--dpm-accent); border: 1px solid var(--dpm-accent); color: #fff; padding: 16px 28px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.nl-form button:hover { background: var(--dpm-accent-700); }
.nl-proof { display: flex; justify-content: center; gap: 32px; margin-top: 24px; font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); flex-wrap: wrap; }
.nl-proof span b { font-family: var(--dpm-font-sans); font-weight: 700; color: var(--dpm-ink); }

/* Cross-brand strip (home A) */
.cb { background: #fff; padding: 56px 0; border-bottom: 1px solid var(--dpm-ink); }
.cb-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 1fr 2fr; gap: 48px; align-items: center; }
.cb-h { font-family: var(--dpm-font-serif); font-weight: 700; font-style: italic; font-size: 28px; line-height: 1.1; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 8px 0 0; }
.cb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--dpm-ink); border: 1px solid var(--dpm-ink); }
.cb-card { background: #fff; padding: 22px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: var(--dpm-ink); }
.cb-card:hover { background: var(--dpm-paper); }
.cb-card .brand { font-family: var(--dpm-font-sans); font-weight: 800; font-size: 14px; letter-spacing: -0.005em; color: var(--dpm-ink); }
.cb-card .what { font-family: var(--dpm-font-sans); font-size: 12px; color: var(--dpm-ink-2); line-height: 1.45; }
.cb-card .go { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dpm-accent); margin-top: auto; }

/* Diagnostic CTA (home A) */
.diag { background: var(--dpm-ink); color: #fff; padding: 56px 48px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; align-items: center; border: 1px solid var(--dpm-ink); position: relative; overflow: hidden; }
.diag::before { content: ""; position: absolute; right: -120px; top: -120px; width: 420px; height: 420px; background: radial-gradient(circle, rgba(255,77,46,0.35), transparent 65%); pointer-events: none; }
.diag h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 48px; line-height: 0.98; letter-spacing: -0.022em; margin: 0 0 18px; color: #fff; text-wrap: balance; }
.diag h2 em { font-style: italic; color: var(--dpm-accent); font-weight: 500; }
.diag p { font-family: var(--dpm-font-sans); font-size: 16px; line-height: 1.55; color: rgba(255,255,255,0.85); margin: 0 0 24px; max-width: 480px; }
.diag-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.diag-meta { font-family: var(--dpm-font-mono); font-size: 11px; color: rgba(255,255,255,0.65); text-transform: uppercase; letter-spacing: 0.06em; }

/* Events / Webinar (home A) */
.ev-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ev { background: var(--dpm-navy); color: #fff; padding: 28px; display: flex; flex-direction: column; gap: 14px; border: 1px solid var(--dpm-navy); text-decoration: none; transition: background 120ms ease; position: relative; }
.ev:hover { background: #003560; }
.ev-date { display: flex; align-items: baseline; gap: 8px; }
.ev-date .day { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 44px; line-height: 1; letter-spacing: -0.02em; color: var(--dpm-accent); }
.ev-date .month { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.8); }
.ev-tag { display: inline-flex; padding: 4px 8px; background: rgba(255,255,255,0.12); font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: #fff; align-self: flex-start; }
.ev-h { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 22px; line-height: 1.12; color: #fff; margin: 0; }
.ev-host { font-family: var(--dpm-font-sans); font-size: 13px; color: rgba(255,255,255,0.75); }
.ev-cta { margin-top: auto; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dpm-accent); display: inline-flex; align-items: center; gap: 6px; }

/* This week strip (home A) */
.week-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--dpm-ink); border: 1px solid var(--dpm-ink); }
.week-item { background: #fff; padding: 24px 20px; display: flex; flex-direction: column; gap: 12px; min-height: 220px; }
.week-num { font-family: var(--dpm-font-mono); font-size: 11px; color: var(--dpm-accent); letter-spacing: 0.06em; }
.week-h { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 18px; line-height: 1.15; letter-spacing: -0.005em; color: var(--dpm-ink); margin: 0; flex: 1; }
.week-h a { color: inherit; text-decoration: none; }
.week-h a:hover { color: var(--dpm-accent); }
.week-foot { display: flex; align-items: center; justify-content: space-between; font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.7; }

/* Sticky NL bar (global, JS-dismissable) */
.sticky-nl { position: fixed; right: 24px; bottom: 24px; z-index: 60; background: var(--dpm-ink); color: #fff; padding: 14px 18px; border: 1px solid var(--dpm-ink); box-shadow: 6px 6px 0 var(--dpm-accent); display: flex; align-items: center; gap: 14px; max-width: 360px; font-family: var(--dpm-font-sans); font-size: 13px; line-height: 1.35; }
.sticky-nl b { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 15px; display: block; margin-bottom: 2px; }
.sticky-nl button.subscribe { background: var(--dpm-accent); color: #fff; border: 0; padding: 8px 12px; font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
.sticky-nl .close { position: absolute; top: 4px; right: 8px; background: none; border: 0; color: rgba(255,255,255,0.5); cursor: pointer; font-size: 14px; padding: 0; line-height: 1; }

/* =========================================================================
   SINGLE ARTICLE (templates/single.html)
   ========================================================================= */
.pbar { position: fixed; top: 0; left: 0; right: 0; height: 3px; background: transparent; z-index: 100; pointer-events: none; }
.pbar-fill { height: 100%; background: var(--dpm-accent); width: 0%; transition: width 80ms linear; }

.art-hero { padding: 56px 0 48px; border-bottom: 1px solid var(--dpm-ink); }
.art-hero-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; }
.art-crumbs { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dpm-ink-2); display: flex; gap: 10px; margin-bottom: 24px; flex-wrap: wrap; }
.art-crumbs a { color: var(--dpm-ink-2); text-decoration: none; }
.art-crumbs a:hover { color: var(--dpm-accent); }
.art-crumbs .sep { opacity: 0.4; }
.art-tags { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; flex-wrap: wrap; }
.art-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: clamp(40px, 5.6vw, 76px); line-height: 0.98; letter-spacing: -0.026em; color: var(--dpm-ink); margin: 0 0 24px; text-wrap: balance; }
.art-h em { font-style: italic; font-weight: 600; }
.art-dek { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 22px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0 0 32px; max-width: 820px; }
.art-byline { display: flex; align-items: center; gap: 16px; padding-top: 20px; border-top: 1px solid var(--dpm-ink); flex-wrap: wrap; }
.art-byline .avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--dpm-accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 18px; overflow: hidden; }
.art-byline .avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.art-byline .who b { display: block; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 15px; color: var(--dpm-ink); }
.art-byline .who span { font-family: var(--dpm-font-sans); font-size: 13px; color: var(--dpm-ink-2); }
.art-byline .meta { margin-left: auto; display: flex; gap: 20px; font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); flex-wrap: wrap; }
.art-byline .meta b { font-family: var(--dpm-font-sans); font-weight: 700; color: var(--dpm-ink); text-transform: none; letter-spacing: 0; font-size: 13px; display: block; }
.art-cover { margin-top: 40px; aspect-ratio: 16/9; background-color: var(--dpm-navy); background-image: linear-gradient(135deg, #00263F 0%, #003560 50%, #1A6BA0 100%); background-size: cover; background-position: center; position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 24px; }
.art-cover-cap { position: relative; z-index: 1; font-family: var(--dpm-font-mono); font-size: 11px; color: #fff; opacity: 0.75; text-transform: uppercase; letter-spacing: 0.06em; }

.art-body { padding: 64px 0 96px; }
.art-body-inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 220px 1fr 320px; gap: 56px; align-items: start; }
.art-rail-left { position: sticky; top: 100px; align-self: start; display: flex; flex-direction: column; gap: 28px; }
.toc h4, .share h4 { font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); margin: 0 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--dpm-ink); }
.toc ol { list-style: none; padding: 0; margin: 0; counter-reset: toc; display: flex; flex-direction: column; gap: 10px; }
.toc li { counter-increment: toc; }
.toc a { display: flex; gap: 10px; font-family: var(--dpm-font-sans); font-size: 13px; line-height: 1.35; color: var(--dpm-ink-2); text-decoration: none; padding: 6px 0 6px 10px; border-left: 2px solid transparent; margin-left: -10px; transition: all 120ms ease; }
.toc a::before { content: "0" counter(toc); font-family: var(--dpm-font-mono); font-size: 10px; color: var(--dpm-accent); flex-shrink: 0; letter-spacing: 0.06em; padding-top: 2px; }
.toc a:hover, .toc a.active { color: var(--dpm-ink); border-left-color: var(--dpm-accent); background: var(--dpm-paper); }
.toc a.active { font-weight: 600; }
.share-row { display: flex; gap: 6px; }
.share-row a { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--dpm-ink); color: var(--dpm-ink); text-decoration: none; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; transition: all 120ms ease; }
.share-row a:hover { background: var(--dpm-ink); color: #fff; }

.art-prose { max-width: 720px; }
.art-prose > * + * { margin-top: 24px; }
.art-prose p { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 19px; line-height: 1.6; color: var(--dpm-ink-2); margin: 0 0 22px; }
.art-prose p > b, .art-prose p > strong { color: var(--dpm-ink); font-weight: 600; }
.art-prose h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; line-height: 1.08; letter-spacing: -0.018em; color: var(--dpm-ink); margin: 56px 0 18px; padding-top: 12px; border-top: 1px solid var(--dpm-ink); position: relative; }
.art-prose h2::before { content: ""; position: absolute; top: -1px; left: 0; width: 64px; height: 3px; background: var(--dpm-accent); }
.art-prose h2 em { font-style: italic; font-weight: 500; }
.art-prose h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 24px; line-height: 1.18; color: var(--dpm-ink); margin: 36px 0 12px; }
.art-prose ul, .art-prose ol { font-family: var(--dpm-font-serif); font-size: 19px; line-height: 1.55; color: var(--dpm-ink-2); padding-left: 22px; margin: 0 0 22px; }
.art-prose ul li, .art-prose ol li { margin-bottom: 8px; }
.art-prose ul li::marker { color: var(--dpm-accent); }
.art-prose a { color: var(--dpm-ink); text-decoration: underline; text-decoration-color: var(--dpm-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.art-prose a:hover { color: var(--dpm-accent); }
.art-prose blockquote, .art-prose .wp-block-pullquote { margin: 48px 0; padding: 32px 0; border-top: 2px solid var(--dpm-ink); border-bottom: 2px solid var(--dpm-ink); }
.art-prose blockquote p, .art-prose .wp-block-pullquote p { font-family: var(--dpm-font-serif); font-weight: 600; font-style: italic; font-size: 32px; line-height: 1.18; letter-spacing: -0.014em; color: var(--dpm-ink); }
.art-prose figure img { width: 100%; height: auto; border: 1px solid var(--dpm-ink); }
.art-prose figcaption { font-family: var(--dpm-font-sans); font-size: 13px; color: var(--dpm-ink-2); margin-top: 12px; line-height: 1.5; }

.art-rail-right { position: sticky; top: 100px; display: flex; flex-direction: column; gap: 24px; align-self: start; }
.sticky-magnet { border: 1px solid var(--dpm-ink); background: var(--dpm-paper); overflow: hidden; }
.sticky-magnet-vis { aspect-ratio: 4/3; background: var(--dpm-ink); display: flex; align-items: center; justify-content: center; position: relative; padding: 22px; }
.sticky-magnet-vis .cov { width: 130px; aspect-ratio: 3/4; background: linear-gradient(160deg, var(--dpm-accent), #B8290E); color: #fff; padding: 16px 14px; display: flex; flex-direction: column; gap: 4px; transform: rotate(-4deg); box-shadow: 6px 6px 0 var(--dpm-paper); }
.sticky-magnet-vis .cov .lab { font-family: var(--dpm-font-mono); font-size: 8px; text-transform: uppercase; letter-spacing: 0.12em; opacity: 0.85; }
.sticky-magnet-vis .cov .ttl { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 18px; line-height: 0.95; letter-spacing: -0.012em; margin-top: 6px; }
.sticky-magnet-body { padding: 20px; }
.sticky-magnet h4 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 22px; line-height: 1.1; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 8px 0; }
.sticky-magnet p { font-family: var(--dpm-font-sans); font-size: 13px; line-height: 1.45; color: var(--dpm-ink-2); margin: 0 0 14px; }
.sticky-magnet-form { display: flex; flex-direction: column; gap: 8px; }
.sticky-magnet-form input { padding: 11px 12px; border: 1px solid var(--dpm-ink); background: #fff; font-family: var(--dpm-font-sans); font-size: 13px; outline: 0; }
.sticky-magnet-form button { background: var(--dpm-ink); color: #fff; border: 0; padding: 12px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.sticky-magnet-form button:hover { background: var(--dpm-accent); }
.sticky-cross { padding: 22px; background: var(--dpm-navy); color: #fff; }
.sticky-cross .ey { color: var(--dpm-accent); font-family: var(--dpm-font-sans); font-weight: 700; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }
.sticky-cross h4 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 20px; line-height: 1.15; letter-spacing: -0.012em; color: #fff; margin: 8px 0; }
.sticky-cross p { font-family: var(--dpm-font-sans); font-size: 13px; line-height: 1.45; color: rgba(255,255,255,0.8); margin: 0 0 14px; }
.sticky-cross a { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; background: transparent; border: 1px solid #fff; color: #fff; text-decoration: none; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
.sticky-cross a:hover { background: var(--dpm-accent); border-color: var(--dpm-accent); }

/* Inline newsletter (in-article) */
.inline-nl { margin: 56px 0; padding: 36px 32px; background: var(--dpm-ink); color: #fff; display: grid; grid-template-columns: 1fr auto; gap: 28px; align-items: center; border: 1px solid var(--dpm-ink); }
.inline-nl h3 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 26px; line-height: 1.1; letter-spacing: -0.012em; color: #fff; margin: 0; }
.inline-nl p { font-family: var(--dpm-font-sans); font-size: 14px; line-height: 1.45; color: rgba(255,255,255,0.8); margin: 4px 0 0; }
.inline-nl-form { display: flex; gap: 0; }
.inline-nl-form input { padding: 12px 14px; width: 240px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.3); color: #fff; font-family: var(--dpm-font-sans); font-size: 13px; outline: 0; }
.inline-nl-form button { background: var(--dpm-accent); border: 1px solid var(--dpm-accent); color: #fff; padding: 12px 18px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }

/* Author box (single) */
.author-box { padding: 64px 0; background: var(--dpm-paper); border-top: 1px solid var(--dpm-ink); border-bottom: 1px solid var(--dpm-ink); }
.author-box-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 200px 1fr; gap: 48px; align-items: start; }
.author-portrait { aspect-ratio: 4/5; background: linear-gradient(135deg, var(--dpm-accent), #B8290E); display: flex; align-items: center; justify-content: center; color: #fff; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 80px; letter-spacing: -0.02em; overflow: hidden; }
.author-portrait img { width: 100%; height: 100%; object-fit: cover; }
.author-content .ey { font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); }
.author-content h3 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; line-height: 1.05; letter-spacing: -0.018em; color: var(--dpm-ink); margin: 8px 0 4px; }
.author-content .role { font-family: var(--dpm-font-sans); font-size: 15px; color: var(--dpm-ink-2); }
.author-content .bio { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 18px; line-height: 1.5; color: var(--dpm-ink-2); margin: 18px 0 24px; max-width: 640px; }

/* Related (single) */
.rel { padding: 72px 0; }
.rel-inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.rel-head { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); margin-bottom: 32px; gap: 16px; flex-wrap: wrap; }
.rel-head h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; letter-spacing: -0.018em; line-height: 1; margin: 0; }
.rel-head h2 b { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.rel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.rel-card { display: flex; flex-direction: column; gap: 12px; text-decoration: none; color: var(--dpm-ink); }
.rel-card .img { aspect-ratio: 16/10; background: var(--dpm-paper-2); background-size: cover; background-position: center; }
.rel-card h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 22px; line-height: 1.12; letter-spacing: -0.01em; color: var(--dpm-ink); margin: 0; }
.rel-card h3 a { color: inherit; text-decoration: none; }
.rel-card:hover h3 { color: var(--dpm-accent); }
.rel-card .m { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.7; }

/* =========================================================================
   CATEGORY (templates/category.html) — colour-coded by body class
   ========================================================================= */
.cat-hero { background: var(--dpm-accent); color: #fff; padding: 72px 0 56px; border-bottom: 1px solid var(--dpm-ink); position: relative; overflow: hidden; }
.dpm-cat--tool .cat-hero { background: var(--dpm-navy); }
.dpm-cat--stima .cat-hero { background: var(--dpm-ink); }
.dpm-cat--persone .cat-hero { background: var(--dpm-cat-persone); }
.dpm-cat--ai .cat-hero { background: var(--dpm-cat-ai); }
.dpm-cat--carriera .cat-hero { background: var(--dpm-cat-carriera); }
.cat-hero::after { content: ""; position: absolute; right: -100px; bottom: -100px; width: 480px; height: 480px; background: radial-gradient(circle, rgba(0,0,0,0.15), transparent 65%); }
.cat-hero-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; position: relative; z-index: 1; }
.cat-crumbs { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: rgba(255,255,255,0.85); display: flex; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }
.cat-crumbs a { color: rgba(255,255,255,0.85); text-decoration: none; }
.cat-crumbs .sep { opacity: 0.55; }
.cat-grid { display: grid; grid-template-columns: 100px 1fr 280px; gap: 48px; align-items: center; }
.cat-glyph { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 140px; line-height: 0.8; letter-spacing: -0.04em; color: #fff; text-transform: uppercase; }
.cat-name h1 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 80px; line-height: 0.92; letter-spacing: -0.028em; margin: 0 0 14px; color: #fff; }
.cat-name p { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 22px; line-height: 1.35; color: rgba(255,255,255,0.92); margin: 0; max-width: 720px; }
.cat-stats { display: flex; flex-direction: column; gap: 16px; border-left: 1px solid rgba(255,255,255,0.3); padding-left: 32px; }
.cat-stats b { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; letter-spacing: -0.014em; color: #fff; line-height: 1; }
.cat-stats span { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255,255,255,0.85); }

.toolbar { padding: 24px 0; border-bottom: 1px solid var(--dpm-ink); background: #fff; }
.toolbar-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.filters { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.chip { padding: 7px 14px; border: 1px solid var(--dpm-ink); font-family: var(--dpm-font-sans); font-size: 12px; font-weight: 500; color: var(--dpm-ink); cursor: pointer; background: #fff; text-decoration: none; }
.chip.active { background: var(--dpm-ink); color: #fff; }
.chip:hover { background: var(--dpm-paper); }

.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.acard { display: flex; flex-direction: column; gap: 12px; text-decoration: none; color: var(--dpm-ink); }
.acard .img { aspect-ratio: 4/3; background: var(--dpm-paper-2); background-size: cover; background-position: center; }
.acard .tags { display: flex; gap: 6px; flex-wrap: wrap; }
.acard h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 22px; line-height: 1.12; letter-spacing: -0.01em; margin: 0; }
.acard h3 a { color: inherit; text-decoration: none; }
.acard:hover h3 { color: var(--dpm-accent); }
.acard .dek { font-family: var(--dpm-font-sans); font-size: 14px; line-height: 1.5; color: var(--dpm-ink-2); margin: 0; }
.acard .meta { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.7; padding-top: 10px; border-top: 1px solid #DCDCD8; display: flex; gap: 12px; flex-wrap: wrap; }

.feat-card { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0; border: 1px solid var(--dpm-ink); }
.feat-img { aspect-ratio: 16/10; background-color: var(--dpm-navy); background-image: linear-gradient(135deg, #00263F, #003560); background-size: cover; background-position: center; position: relative; overflow: hidden; }
.feat-body { padding: 40px; display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.feat-eye { font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); }
.feat-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 36px; line-height: 1.05; letter-spacing: -0.018em; margin: 0; color: var(--dpm-ink); }
.feat-h a { color: inherit; text-decoration: none; }
.feat-h a:hover { color: var(--dpm-accent); }
.feat-dek { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 18px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0; }

/* Pagination (shared) */
.pag, .wp-block-query-pagination { display: flex; justify-content: center; gap: 4px; padding: 32px 0 0; }
.pag a, .wp-block-query-pagination a, .wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers { padding: 10px 14px; border: 1px solid var(--dpm-ink); font-family: var(--dpm-font-mono); font-size: 13px; color: var(--dpm-ink); text-decoration: none; min-width: 44px; text-align: center; }
.pag a:hover, .pag a.current, .wp-block-query-pagination .page-numbers.current { background: var(--dpm-ink); color: #fff; }

/* =========================================================================
   AUTHOR (templates/author.html)
   ========================================================================= */
.auth-hero { padding: 64px 0 56px; border-bottom: 1px solid var(--dpm-ink); }
.auth-hero-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; }
.crumbs { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dpm-ink-2); display: flex; gap: 10px; margin-bottom: 24px; flex-wrap: wrap; }
.crumbs a { color: var(--dpm-ink-2); text-decoration: none; }
.crumbs .sep { opacity: 0.4; }
.auth-grid { display: grid; grid-template-columns: 320px 1fr; gap: 56px; align-items: start; }
.auth-portrait-wrap { position: sticky; top: 100px; }
.auth-portrait { aspect-ratio: 4/5; background: linear-gradient(135deg, var(--dpm-accent), #B8290E); display: flex; align-items: center; justify-content: center; color: #fff; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 140px; letter-spacing: -0.02em; line-height: 1; overflow: hidden; }
.auth-portrait img { width: 100%; height: 100%; object-fit: cover; }
.auth-social { display: flex; gap: 0; }
.auth-social a { flex: 1; height: 52px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--dpm-ink); border-top: 0; color: var(--dpm-ink); text-decoration: none; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 13px; }
.auth-social a:hover { background: var(--dpm-ink); color: #fff; }
.auth-social a + a { border-left: 0; }
.auth-meta { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dpm-accent); }
.auth-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: clamp(56px, 6.5vw, 96px); line-height: 0.95; letter-spacing: -0.028em; margin: 14px 0 8px; color: var(--dpm-ink); }
.auth-role { font-family: var(--dpm-font-serif); font-weight: 400; font-style: italic; font-size: 26px; line-height: 1.25; color: var(--dpm-ink-2); margin: 0 0 32px; max-width: 720px; }
.auth-bio { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 20px; line-height: 1.55; color: var(--dpm-ink-2); margin: 0 0 36px; max-width: 760px; }
.auth-bio strong { color: var(--dpm-ink); font-weight: 600; }
.arts-list { display: flex; flex-direction: column; }
.arts-item { display: grid; grid-template-columns: 90px 1fr 220px 80px; gap: 32px; padding: 28px 0; border-bottom: 1px solid #DCDCD8; align-items: center; text-decoration: none; color: inherit; transition: background 120ms ease, padding 120ms ease; }
.arts-item:hover { background: var(--dpm-paper); padding-left: 14px; padding-right: 14px; }
.arts-item .date { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); }
.arts-item .date b { display: block; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 28px; letter-spacing: -0.014em; color: var(--dpm-ink); text-transform: none; line-height: 1.05; }
.arts-item .body { display: flex; flex-direction: column; gap: 6px; }
.arts-item .body h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 24px; line-height: 1.12; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 0; }
.arts-item:hover h3 { color: var(--dpm-accent); }
.arts-item .body .dek { font-family: var(--dpm-font-sans); font-size: 14px; line-height: 1.5; color: var(--dpm-ink-2); margin: 0; }
.arts-item .stats { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); display: flex; flex-direction: column; gap: 2px; }
.arts-item .go { font-family: var(--dpm-font-serif); font-size: 28px; color: var(--dpm-accent); text-align: right; }

/* =========================================================================
   ARCHIVE / SEARCH (templates/archive.html, search.html)
   ========================================================================= */
.arch-hero { padding: 64px 0 48px; border-bottom: 1px solid var(--dpm-ink); background: var(--dpm-paper); }
.arch-hero-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; }
.arch-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: clamp(48px, 6vw, 80px); line-height: 1; letter-spacing: -0.026em; color: var(--dpm-ink); margin: 0 0 14px; }
.arch-h em { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.arch-sub { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 22px; line-height: 1.4; color: var(--dpm-ink-2); margin: 0 0 36px; max-width: 700px; }
.arch-search { display: flex; gap: 0; background: #fff; border: 2px solid var(--dpm-ink); max-width: 760px; }
.arch-search input, .arch-search .wp-block-search__input { flex: 1; padding: 18px 22px; border: 0; font-family: var(--dpm-font-serif); font-size: 22px; outline: 0; color: var(--dpm-ink); background: transparent; margin: 0; }
.arch-search button, .arch-search .wp-block-search__button { background: var(--dpm-ink); color: #fff; border: 0; padding: 0 28px; margin: 0; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.arch-search .wp-block-search__inside-wrapper { border: 0; }

.arch-main { padding: 48px 0 96px; }
.arch-main-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 260px 1fr; gap: 56px; align-items: start; }
.filt { position: sticky; top: 100px; align-self: start; display: flex; flex-direction: column; gap: 24px; }
.filt-block h4 { font-family: var(--dpm-font-sans); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--dpm-accent); margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--dpm-ink); }
.filt-block ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.filt-block li a { display: flex; align-items: center; gap: 10px; font-family: var(--dpm-font-sans); font-size: 13px; color: var(--dpm-ink); text-decoration: none; padding: 4px 0; }
.filt-block li a:hover { color: var(--dpm-accent); }

.res-head { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 18px; border-bottom: 1px solid var(--dpm-ink); gap: 16px; flex-wrap: wrap; }
.res-head h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 30px; line-height: 1; letter-spacing: -0.018em; margin: 0; }
.res-head h2 b { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.res-list { display: flex; flex-direction: column; }
.res-item { display: grid; grid-template-columns: 100px 1fr 180px 30px; gap: 20px; padding: 22px 0; border-bottom: 1px solid #EAEAEC; align-items: center; text-decoration: none; color: inherit; transition: background 120ms ease, padding 120ms ease; }
.res-item:hover { background: var(--dpm-paper); padding-left: 14px; padding-right: 14px; }
.res-tag-cell { display: flex; }
.res-body { display: flex; flex-direction: column; gap: 4px; }
.res-body h3 { font-family: var(--dpm-font-serif); font-weight: 600; font-size: 19px; line-height: 1.18; letter-spacing: -0.008em; color: var(--dpm-ink); margin: 0; }
.res-body h3 a { color: inherit; text-decoration: none; }
.res-item:hover h3 { color: var(--dpm-accent); }
.res-body .dek { font-family: var(--dpm-font-sans); font-size: 13px; color: var(--dpm-ink-2); line-height: 1.4; opacity: 0.85; }
.res-date { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); }
.res-go { font-family: var(--dpm-font-serif); font-size: 22px; color: var(--dpm-ink-2); opacity: 0.4; text-align: right; }
.res-item:hover .res-go { color: var(--dpm-accent); opacity: 1; }

/* =========================================================================
   NEWSLETTER LANDING (templates/page-newsletter.html)
   ========================================================================= */
.nlh { padding: 96px 0 80px; border-bottom: 1px solid var(--dpm-ink); position: relative; overflow: hidden; background: var(--dpm-paper); }
.nlh::before { content: ""; position: absolute; right: -100px; top: -80px; width: 480px; height: 480px; background: radial-gradient(circle, rgba(255,77,46,0.2), transparent 65%); pointer-events: none; }
.nlh-inner { max-width: 1100px; margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: 1.3fr 1fr; gap: 64px; align-items: center; position: relative; }
.nlh-eye { font-family: var(--dpm-font-sans); font-size: 13px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--dpm-accent); display: inline-flex; align-items: center; gap: 8px; }
.nlh-eye::before { content: "\2605"; }
.nlh-h { font-family: var(--dpm-font-serif); font-weight: 700; font-size: clamp(48px, 6.5vw, 92px); line-height: 0.94; letter-spacing: -0.028em; color: var(--dpm-ink); margin: 20px 0 24px; text-wrap: balance; }
.nlh-h em { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.nlh-dek { font-family: var(--dpm-font-serif); font-weight: 400; font-size: 22px; line-height: 1.42; color: var(--dpm-ink-2); margin: 0 0 32px; max-width: 580px; }
.nlh-form { display: flex; gap: 0; max-width: 520px; }
.nlh-form input { flex: 1; padding: 18px 22px; border: 2px solid var(--dpm-ink); border-right: 0; background: #fff; font-family: var(--dpm-font-sans); font-size: 16px; outline: 0; }
.nlh-form button { background: var(--dpm-accent); color: #fff; border: 2px solid var(--dpm-accent); padding: 0 32px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.nlh-meta { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); margin-top: 14px; }
.nlh-meta b { color: var(--dpm-accent); font-family: var(--dpm-font-sans); font-weight: 700; }

.env { background: #fff; border: 1px solid var(--dpm-ink); padding: 28px 32px; box-shadow: 12px 12px 0 var(--dpm-accent); font-family: var(--dpm-font-mono); font-size: 12px; line-height: 1.5; color: var(--dpm-ink-2); transform: rotate(1.5deg); }
.env-from { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid #DCDCD8; margin-bottom: 16px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); flex-wrap: wrap; gap: 8px; }
.env-from b { color: var(--dpm-ink); }
.env-subj { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 24px; line-height: 1.1; color: var(--dpm-ink); margin-bottom: 6px; letter-spacing: -0.012em; }
.env-pre { font-family: var(--dpm-font-sans); font-size: 14px; line-height: 1.5; color: var(--dpm-ink-2); }
.env-pre em { color: var(--dpm-accent); font-style: normal; font-weight: 600; }
.env-list { margin: 18px 0 0; padding: 0; list-style: none; }
.env-list li { padding: 8px 0; border-bottom: 1px dotted #DCDCD8; font-family: var(--dpm-font-sans); font-size: 13px; color: var(--dpm-ink); display: flex; align-items: baseline; gap: 8px; }
.env-list li::before { content: "\2192"; color: var(--dpm-accent); font-weight: 700; }
.env-list li:last-child { border-bottom: 0; }
.env-foot { margin-top: 16px; padding-top: 12px; border-top: 1px solid #DCDCD8; font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.7; }

.nl-stats { padding: 32px 0; background: var(--dpm-ink); color: #fff; }
.nl-stats-inner { max-width: var(--dpm-container); margin: 0 auto; padding: 0 32px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.nl-stat { display: flex; flex-direction: column; gap: 4px; padding-right: 24px; border-right: 1px solid rgba(255,255,255,0.2); }
.nl-stat:last-child { border-right: 0; }
.nl-stat b { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 56px; line-height: 1; letter-spacing: -0.022em; color: var(--dpm-accent); }
.nl-stat span { font-family: var(--dpm-font-sans); font-size: 13px; color: rgba(255,255,255,0.85); }

.get-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid var(--dpm-ink); background: var(--dpm-ink); }
.get-item { background: #fff; padding: 32px 28px; display: flex; flex-direction: column; gap: 16px; }
.get-num { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 56px; line-height: 0.9; letter-spacing: -0.024em; color: var(--dpm-accent); }
.get-item h3 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: 22px; line-height: 1.1; letter-spacing: -0.012em; color: var(--dpm-ink); margin: 0; }
.get-item p { font-family: var(--dpm-font-sans); font-size: 14px; line-height: 1.55; color: var(--dpm-ink-2); margin: 0; }

.tst-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.tst-card { background: #fff; border: 1px solid var(--dpm-ink); padding: 32px 28px; display: flex; flex-direction: column; gap: 18px; }
.tst-quote { font-family: var(--dpm-font-serif); font-weight: 500; font-style: italic; font-size: 22px; line-height: 1.3; letter-spacing: -0.01em; color: var(--dpm-ink); margin: 0; flex: 1; }
.tst-quote::before { content: "\201C"; color: var(--dpm-accent); font-size: 56px; line-height: 0; vertical-align: -20px; margin-right: 4px; }
.tst-meta { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid #DCDCD8; }
.tst-meta .av { width: 44px; height: 44px; border-radius: 50%; background: var(--dpm-accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-family: var(--dpm-font-serif); font-weight: 700; font-size: 16px; flex-shrink: 0; }
.tst-meta .av.b { background: var(--dpm-navy); }
.tst-meta .av.c { background: var(--dpm-ink); }
.tst-meta b { font-family: var(--dpm-font-sans); font-weight: 700; font-size: 14px; color: var(--dpm-ink); display: block; }
.tst-meta span { font-family: var(--dpm-font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--dpm-ink-2); opacity: 0.8; }

details.q { border-bottom: 1px solid var(--dpm-ink); padding: 0; }
details.q summary { padding: 22px 0; cursor: pointer; font-family: var(--dpm-font-serif); font-weight: 600; font-size: 22px; line-height: 1.2; letter-spacing: -0.01em; color: var(--dpm-ink); display: flex; justify-content: space-between; align-items: center; gap: 24px; list-style: none; }
details.q summary::-webkit-details-marker { display: none; }
details.q summary::after { content: "+"; font-family: var(--dpm-font-serif); font-weight: 400; font-size: 32px; color: var(--dpm-accent); line-height: 1; }
details.q[open] summary::after { content: "\2212"; }
details.q[open] summary { color: var(--dpm-accent); }
details.q .a { padding: 0 0 24px; font-family: var(--dpm-font-serif); font-weight: 400; font-size: 17px; line-height: 1.55; color: var(--dpm-ink-2); max-width: 720px; }

.final { padding: 96px 0; background: var(--dpm-ink); color: #fff; text-align: center; border-bottom: 1px solid var(--dpm-ink); position: relative; overflow: hidden; }
.final::after { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 800px; height: 800px; background: radial-gradient(circle, rgba(255,77,46,0.18), transparent 60%); pointer-events: none; }
.final-inner { max-width: 720px; margin: 0 auto; padding: 0 32px; position: relative; z-index: 1; }
.final h2 { font-family: var(--dpm-font-serif); font-weight: 700; font-size: clamp(48px, 6vw, 80px); line-height: 0.96; letter-spacing: -0.026em; margin: 16px 0 18px; color: #fff; }
.final h2 em { font-style: italic; font-weight: 500; color: var(--dpm-accent); }
.final p { font-family: var(--dpm-font-serif); font-size: 20px; line-height: 1.4; color: rgba(255,255,255,0.85); margin: 0 0 28px; }
.final form { display: flex; gap: 0; max-width: 520px; margin: 0 auto; }
.final input { flex: 1; padding: 16px 18px; border: 1px solid rgba(255,255,255,0.4); border-right: 0; background: transparent; color: #fff; font-family: var(--dpm-font-sans); font-size: 15px; outline: 0; }
.final button { background: var(--dpm-accent); border: 1px solid var(--dpm-accent); color: #fff; padding: 16px 28px; font-family: var(--dpm-font-sans); font-weight: 700; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.final .micro { font-family: var(--dpm-font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: rgba(255,255,255,0.6); margin-top: 16px; }

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 1080px) {
  .hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero-divider { display: none; }
  .art-body-inner { grid-template-columns: 1fr; gap: 40px; }
  .art-rail-left, .art-rail-right { position: static; }
  .auth-grid { grid-template-columns: 1fr; }
  .auth-portrait-wrap { position: static; max-width: 320px; }
  .arch-main-inner { grid-template-columns: 1fr; }
  .filt { position: static; }
  .cat-grid { grid-template-columns: 1fr; gap: 24px; }
  .cat-glyph { font-size: 96px; }
  .cat-name h1 { font-size: 56px; }
  .cat-stats { flex-direction: row; border-left: 0; padding-left: 0; gap: 32px; }
  .nlh-inner { grid-template-columns: 1fr; }
  .mag-b-card, .feat-card { grid-template-columns: 1fr; }
  .diag { grid-template-columns: 1fr; }
  .ev-grid, .tst-grid, .recent-grid, .get-grid, .nl-stats-inner, .ft-top { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 860px) {
  .mosaic-grid { grid-template-columns: repeat(6, 1fr); }
  .tile-A, .tile-H { grid-column: span 6; grid-row: auto; }
  .tile-B, .tile-C, .tile-D, .tile-E, .tile-F, .tile-G, .tile-I { grid-column: span 3; grid-row: auto; }
  .rb-grid { grid-template-columns: repeat(3, 1fr); }
  .article-grid, .rel-grid { grid-template-columns: repeat(2, 1fr); }
  .arts-item { grid-template-columns: 70px 1fr; }
  .arts-item .stats, .arts-item .go { display: none; }
  .res-item { grid-template-columns: 1fr; gap: 8px; }
  .res-date, .res-go, .res-tag-cell { display: block; }
}

@media (max-width: 600px) {
  .dpm-wrap, .hero-inner, .mosaic-inner, .rb-inner, .mag-b-inner, .recent-inner,
  .art-hero-inner, .art-body-inner, .auth-hero-inner, .arch-hero-inner,
  .arch-main-inner, .cat-hero-inner, .nlh-inner, .hdr-inner, .ft-inner,
  .topbar-inner, .issue-strip-inner { padding-left: 18px; padding-right: 18px; }
  .hdr-nav, .hdr-search { display: none; }
  .mosaic-grid { grid-template-columns: 1fr; }
  .tile-A, .tile-B, .tile-C, .tile-D, .tile-E, .tile-F, .tile-G, .tile-H, .tile-I { grid-column: 1 / -1; }
  .rb-grid { grid-template-columns: repeat(2, 1fr); }
  .article-grid, .rel-grid, .ev-grid, .tst-grid, .recent-grid, .get-grid,
  .nl-stats-inner, .ft-top { grid-template-columns: 1fr; }
  .mag-b-card { padding: 32px; }
  .cat-stats { flex-direction: column; }
  .sticky-nl { right: 12px; left: 12px; bottom: 12px; max-width: none; }
}