/* Self-hosted fonts (Archivo, Archivo Black) — no third-party CDN */

/* --- paste into stylesheet (adjust the fonts/ path prefix if needed) --- */
@font-face{font-family:'Archivo';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/archivo-italic-400-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;}
@font-face{font-family:'Archivo';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/archivo-italic-400-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:'Archivo';font-style:italic;font-weight:400;font-display:swap;src:url('../fonts/archivo-italic-400-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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-normal-400-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-normal-400-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:'Archivo';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-normal-400-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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/archivo-normal-500-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/archivo-normal-500-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:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('../fonts/archivo-normal-500-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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/archivo-normal-600-vietnamese.woff2') format('woff2');unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/archivo-normal-600-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:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('../fonts/archivo-normal-600-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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* --- paste into stylesheet (adjust the fonts/ path prefix if needed) --- */
@font-face{font-family:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-black-normal-400-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:'Archivo Black';font-style:normal;font-weight:400;font-display:swap;src:url('../fonts/archivo-black-normal-400-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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ==========================================================================
   Diritti Chiari — color-block poster magazine (rebuilt from CuentasClaras design)
   Prefix: cc-
   ========================================================================== */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  --cream: #F4F1EA;
  --cream-2: #E9E4D8;
  --page: #E8E4DB;
  --ink: #17150F;
  --cobalt: #12365C;
  --cobalt-soft: #9FB4CB;
  --cobalt-body: #C7D3E1;
  --coral: #E4573D;
  --coral-soft: #FBD9CF;
  --coral-byline: #F0A895;
  --mustard: #C9A227;
  --mustard-dark: #4A4118;
  --body: #3B3729;
  --muted: #7C766A;
  --ink-muted: #B8B2A4;
  --ink-body: #D8D2C4;
  --maxw: 1180px;
  --art: 720px;
}
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--page); color: var(--ink);
  font-family: 'Archivo', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  -webkit-font-smoothing: antialiased; line-height: 1.6; font-size: 17px;
}
a { color: inherit; text-decoration: none; }
a:hover { opacity: .78; }
img { max-width: 100%; display: block; }
.cc-shell { max-width: var(--maxw); margin: 0 auto; background: var(--cream); }
.cc-display { font-family: 'Archivo Black', 'Archivo', sans-serif; font-weight: 400; letter-spacing: -0.012em; }

/* ---- Advertisement disclosure strip ---- */
.cc-adstrip { background: var(--ink); color: var(--ink-body); text-align: center;
  font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 8px 16px; }
.cc-adstrip strong { color: #fff; font-weight: 700; }

/* ---- Masthead / header ---- */
.cc-mast { background: var(--cobalt); color: var(--cream); padding: 22px clamp(18px,4vw,44px) 24px; }
.cc-mast-row { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; }
.cc-brand { font-family: 'Archivo Black', sans-serif; font-size: clamp(24px,4vw,34px); letter-spacing: -0.01em; color: var(--cream); line-height: 1; }
.cc-nav { display: flex; gap: clamp(14px,2vw,24px); font-size: 15.5px; font-weight: 500; align-items: center; flex-wrap: wrap; }
.cc-nav a { display: inline-flex; align-items: center; gap: 7px; }
.cc-nav a img { width: 15px; height: 15px; flex: none; }
.cc-nav .cc-cta { background: var(--coral); padding: 8px 16px; color: var(--cream); }
.cc-tagline { margin-top: 6px; font-size: 14.5px; color: var(--cobalt-soft); }

/* ---- Kicker (category label with icon) ---- */
.cc-kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 600; }
.cc-kicker img { width: 15px; height: 15px; flex: none; }

/* ---- Slabs (color-block poster) ---- */
.cc-slab { padding: clamp(30px,4vw,44px); }
.cc-slab-feat { background: var(--coral); color: var(--cream); display: block; padding: clamp(34px,5vw,48px) clamp(20px,4vw,44px); }
.cc-slab-feat .cc-kicker { color: var(--cream); }
.cc-slab-feat h1, .cc-slab-feat .cc-h { margin-top: 12px; font-size: clamp(38px,7vw,74px); line-height: .96; letter-spacing: -0.015em; max-width: 15em; }
.cc-slab-feat p { margin: 18px 0 0; font-size: clamp(17px,2.4vw,19px); line-height: 1.55; max-width: 34em; color: var(--coral-soft); }
.cc-byline { margin-top: 18px; font-size: 14.5px; }
.cc-slab-feat .cc-byline { color: var(--coral-byline); }

.cc-grid-2 { display: grid; grid-template-columns: 1fr 1fr; }
.cc-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.cc-grid-stat { display: grid; grid-template-columns: 1fr minmax(320px, 460px); }

.cc-slab-ink { background: var(--ink); color: var(--cream); }
.cc-slab-ink .cc-kicker { color: var(--mustard); }
.cc-slab-ink .cc-h { font-size: clamp(26px,3.4vw,36px); line-height: 1.04; margin-top: 10px; }
.cc-slab-ink p { margin: 12px 0 0; font-size: 16.5px; line-height: 1.55; color: var(--ink-muted); }

.cc-slab-mustard { background: var(--mustard); color: var(--ink); }
.cc-slab-mustard .cc-kicker { color: var(--ink); }
.cc-slab-mustard .cc-h { font-size: clamp(26px,3.4vw,36px); line-height: 1.04; margin-top: 10px; }
.cc-slab-mustard p { margin: 12px 0 0; font-size: 16.5px; line-height: 1.55; color: var(--mustard-dark); }

.cc-slab-cream { background: var(--cream); }
.cc-slab-cream-2 { background: var(--cream-2); }
.cc-card-sm { padding: clamp(24px,3vw,32px) clamp(22px,3vw,34px); display: block; }
.cc-card-sm .cc-kicker { color: var(--coral); font-size: 14px; }
.cc-card-sm .cc-h { margin-top: 8px; font-size: clamp(20px,2.4vw,24px); line-height: 1.1; }

.cc-slab-cobalt { background: var(--cobalt); color: var(--cream); padding: clamp(30px,4vw,44px); display: flex; flex-direction: column; justify-content: center; }
.cc-stat-num { font-family: 'Archivo Black', sans-serif; font-size: clamp(56px,9vw,92px); line-height: 1; color: var(--mustard); }
.cc-slab-cobalt p, .cc-stat-cap { margin-top: 14px; font-size: 18px; line-height: 1.55; color: var(--cobalt-body); max-width: 30em; }
.cc-stat-img { width: 100%; height: 100%; min-height: 240px; object-fit: cover; }

/* ---- Article ---- */
.cc-article { background: var(--cream); padding: clamp(32px,5vw,48px) clamp(18px,4vw,44px) 0; }
.cc-article-in { max-width: var(--art); margin: 0 auto; }
.cc-article h1 { margin: 12px 0 0; font-family: 'Archivo Black', sans-serif; font-size: clamp(34px,6vw,54px); line-height: 1.0; letter-spacing: -0.012em; }
.cc-art-meta { margin-top: 16px; font-size: 14.5px; color: var(--muted); }
.cc-hero-fig { margin-top: 28px; }
.cc-hero-fig img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.cc-hero-fig figcaption, .cc-fig figcaption { font-size: 13px; color: var(--muted); margin-top: 8px; font-style: italic; }
.cc-lead { margin: 30px 0 0; font-size: clamp(19px,2.6vw,21px); line-height: 1.55; font-weight: 500; }
.cc-article p { margin: 18px 0 0; font-size: 17.5px; line-height: 1.68; color: var(--body); }
.cc-article h2 { margin: 34px 0 0; font-family: 'Archivo Black', sans-serif; font-size: clamp(23px,3vw,28px); line-height: 1.12; }
.cc-article h3 { margin: 26px 0 0; font-size: 20px; font-weight: 600; color: var(--ink); }
.cc-article ul, .cc-article ol { margin: 16px 0 0 1.15em; color: var(--body); font-size: 17.5px; line-height: 1.68; }
.cc-article li { margin-bottom: 9px; }
.cc-article strong { color: var(--ink); }
.cc-fig { margin: 30px 0 0; }
.cc-fig img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }

/* callout (ink box) */
.cc-callout { margin: 30px 0 0; background: var(--ink); color: var(--ink-body); padding: 26px clamp(22px,3vw,30px); }
.cc-callout .cc-kicker { color: var(--mustard); font-size: 14.5px; }
.cc-callout p { margin: 10px 0 0; font-size: 16.5px; line-height: 1.6; color: var(--ink-body); }
.cc-callout strong { color: #fff; }

/* stat inline (cobalt figure inside article) */
.cc-figbox { margin: 30px 0 0; background: var(--cobalt); color: var(--cream); padding: 28px clamp(22px,3vw,32px); }
.cc-figbox .cc-fignum { font-family: 'Archivo Black', sans-serif; font-size: clamp(40px,6vw,60px); line-height: 1; color: var(--mustard); }
.cc-figbox p { margin: 10px 0 0; color: var(--cobalt-body); font-size: 16.5px; }

/* sources */
.cc-sources { margin: 34px 0 0; background: var(--cream-2); padding: 24px clamp(22px,3vw,30px); }
.cc-sources h2 { margin: 0; font-family: 'Archivo Black', sans-serif; font-size: 18px; }
.cc-sources ul { list-style: none; margin: 12px 0 0; padding: 0; }
.cc-sources li { margin: 0; padding: 11px 0; border-top: 1px solid #d9d2c2; font-size: 15px; }
.cc-sources li:first-child { border-top: 0; }
.cc-sources a { color: var(--cobalt); font-weight: 600; word-break: break-word; }
.cc-sources .cc-src-d { display: block; color: var(--muted); font-size: 13.5px; margin-top: 2px; }

/* disclaimer */
.cc-disclaimer { margin: 30px 0 0; padding: 22px clamp(20px,3vw,28px); background: var(--cream-2); font-size: 13.5px; line-height: 1.6; color: var(--muted); }
.cc-disclaimer strong { color: var(--body); }

/* ---- Opt-in ---- */
.cc-optin { margin: 40px 0 0; background: var(--coral); color: var(--cream); padding: clamp(28px,4vw,36px); }
.cc-optin .cc-kicker { color: var(--coral-soft); }
.cc-optin .cc-h { margin-top: 10px; font-family: 'Archivo Black', sans-serif; font-size: clamp(24px,3.4vw,30px); line-height: 1.06; max-width: 20em; }
.cc-optin p.cc-optin-sub { margin: 12px 0 0; font-size: 16px; line-height: 1.55; color: var(--coral-soft); max-width: 40em; }
.cc-optin-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; margin-top: 20px; max-width: 560px; }
.cc-optin-form input[type=email] { font-family: 'Archivo', sans-serif; font-size: 15.5px; padding: 14px 15px; border: 0; background: var(--cream); color: var(--ink); }
.cc-optin-form button { font-family: 'Archivo', sans-serif; font-size: 15.5px; font-weight: 600; padding: 14px 26px; border: 0; background: var(--ink); color: var(--cream); cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.cc-consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 14px; max-width: 560px; }
.cc-consent input { margin-top: 3px; width: 17px; height: 17px; flex: none; accent-color: var(--ink); }
.cc-consent label { font-size: 12.5px; line-height: 1.5; color: var(--coral-soft); }
.cc-consent a { text-decoration: underline; }
.cc-form-msg { margin-top: 12px; font-size: 13px; color: #fff; min-height: 1em; }

/* ---- Related ---- */
.cc-related { border-top: 3px solid var(--ink); margin-top: 4px; }
.cc-related-h { max-width: var(--art); margin: 0 auto; padding: 30px clamp(18px,4vw,44px) 0; font-family: 'Archivo Black', sans-serif; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }

/* ---- Footer ---- */
.cc-footer { background: var(--ink); color: var(--ink-muted); padding: 30px clamp(18px,4vw,44px) 36px; display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; flex-wrap: wrap; }
.cc-footer .cc-foot-brand { font-family: 'Archivo Black', sans-serif; font-size: 20px; color: var(--cream); }
.cc-footer p { margin-top: 8px; font-size: 14px; max-width: 34em; line-height: 1.55; }
.cc-foot-links { display: flex; gap: 20px; font-size: 14.5px; flex-wrap: wrap; }
.cc-foot-links a { color: var(--ink-body); }

/* ---- Cookie banner ---- */
.cc-cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: 200; background: var(--ink); color: var(--ink-body); padding: 16px 20px; display: none; }
.cc-cookie.on { display: block; }
.cc-cookie-in { max-width: 900px; margin: 0 auto; display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cc-cookie p { font-size: 13px; line-height: 1.5; margin: 0; flex: 1 1 320px; }
.cc-cookie a { color: var(--mustard); text-decoration: underline; }
.cc-cookie-btns { display: flex; gap: 10px; flex: none; }
.cc-cookie button { font-family: 'Archivo', sans-serif; font-size: 13.5px; padding: 9px 16px; border: 0; cursor: pointer; }
.cc-cookie .cc-c-no { background: none; border: 1px solid #4a463c; color: var(--ink-body); }
.cc-cookie .cc-c-yes { background: var(--coral); color: #fff; font-weight: 600; }

/* ---- Category chips / breadcrumb ---- */
.cc-catbar { background: var(--cream-2); padding: 14px clamp(18px,4vw,44px); display: flex; gap: 8px 14px; flex-wrap: wrap; font-size: 14px; font-weight: 600; }
.cc-catbar a { color: var(--cobalt); }
.cc-catbar .cc-here { color: var(--muted); }
.cc-cathead { background: var(--cobalt); color: var(--cream); padding: clamp(30px,4vw,44px); }
.cc-cathead .cc-h { font-family: 'Archivo Black', sans-serif; font-size: clamp(32px,5vw,52px); line-height: 1; }
.cc-cathead p { margin-top: 12px; color: var(--cobalt-body); font-size: 17px; max-width: 38em; }

/* legal pages */
.cc-legal { background: var(--cream); }
.cc-legal-in { max-width: var(--art); margin: 0 auto; padding: clamp(30px,5vw,48px) clamp(18px,4vw,44px) 40px; }
.cc-legal-in h1 { font-family: 'Archivo Black', sans-serif; font-size: clamp(30px,5vw,44px); line-height: 1.02; }
.cc-legal-in h2 { margin-top: 30px; font-family: 'Archivo Black', sans-serif; font-size: 20px; }
.cc-legal-in p, .cc-legal-in li { margin-top: 12px; font-size: 16px; line-height: 1.66; color: var(--body); }
.cc-legal-in ul { margin-left: 1.15em; }
.cc-legal-in a { color: var(--cobalt); font-weight: 600; }
.cc-vatbox { margin-top: 18px; border-left: 4px solid var(--coral); background: var(--cream-2); padding: 18px 22px; }
.cc-vatbox .cc-vat-l { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cc-vatbox b { display: block; font-size: 26px; color: var(--coral); font-family: 'Archivo Black', sans-serif; margin-top: 4px; }
.cc-vatbox .cc-vat-2 { margin-top: 10px; font-size: 15px; color: var(--body); }

/* thank you */
.cc-ty { background: var(--cobalt); color: var(--cream); padding: clamp(50px,8vw,90px) clamp(18px,4vw,44px); text-align: center; }
.cc-ty .cc-h { font-family: 'Archivo Black', sans-serif; font-size: clamp(34px,6vw,60px); line-height: 1; }
.cc-ty p { margin: 16px auto 0; max-width: 32em; color: var(--cobalt-body); font-size: 18px; }
.cc-ty a.cc-ty-btn { display: inline-block; margin-top: 26px; background: var(--coral); color: #fff; font-weight: 600; padding: 13px 26px; }

@media (max-width: 860px) {
  .cc-grid-2, .cc-grid-3, .cc-grid-stat { grid-template-columns: 1fr; }
  .cc-stat-img { min-height: 220px; }
  .cc-nav { font-size: 14px; gap: 12px; }
  .cc-nav .cc-lbl-hide { display: none; }
}
@media (max-width: 560px) {
  .cc-optin-form { grid-template-columns: 1fr; }
  .cc-footer { flex-direction: column; }
}