/* ICS footer tear guard: footer section margin-top = -sp-5xl at <=991px; keep last content sp-xl above the torn edge. */
@media (max-width: 991px) {
	#brx-content > :last-child::after { content: ""; display: block; height: calc(var(--sp-5xl) + var(--sp-xl)); }
}
/* yellow-hero pages: colour the transparent header-clearance border so the hero background runs to y=0 under the floating header */
html body #brx-content>:is(#ab-hero,#mv-hero,#sup-hero,#jn-hero):first-child { border-top-color: var(--yellow-500); }
html body :is(#sup-band-wrap,#jn-band-wrap) { background: linear-gradient(var(--yellow-500) 0 40%, transparent 40%); }
html body #brx-content>:is(#ab-hero,#mv-hero):first-child { background-image: linear-gradient(var(--yellow-500) 0 40%, transparent 40%); }
/* About library cards: whole card is the link (stretched link on the existing ĐỌC THÊM anchor) */
html body :is(#lib-feat,#lib-wide,#lib-nar) { position: relative; cursor: pointer; }
html body :is(#lib-feat-cc,#lib-wide-cc,#lib-nar-cc) { position: static; }
html body :is(#lib-feat-link,#lib-wide-link,#lib-nar-link)::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; }
html body :is(#lib-feat-link,#lib-wide-link,#lib-nar-link):focus-visible::after { outline: 2px solid var(--heading); outline-offset: 2px; }
/* Font-family values saved by Bricks with stray quotes ("EB Garamond, serif", "\"EB Garamond\"...") are invalid names -> browser fell back to Times. Valid override: */
html body :is(#mis-intro-p,#mis-r1-q,#mis-s2-mid,#mis-r2-q,#mis-s2-h,#mis-s2-h span,#mis-s3-h,#mis-s4-h,#act-hero-p,#contact-form label,#contact-form .label) { font-family: "EB Garamond", Georgia, serif; }
html body :is(#brxe-wnsum2,#brxe-wnevs1) { font-family: "Google Sans Code", monospace; }
html body #p131-back-text { font-family: Inter, sans-serif; }
/* Hoạt động rows: at 992-1279 the fixed 752px figure squeezed the text column to 0-190px (one letter per line on iPad). Stack like tablet. */
@media (min-width: 992px) and (max-width: 1279px) {
  html body :is(#act-r1-in,#act-r2-in,#act-r3-in,#act-r4-in) { flex-direction: column; align-items: stretch; gap: 0; }
  html body :is(#act-r1-fig,#act-r2-fig,#act-r3-fig,#act-r4-fig) { width: 100%; flex: none; }
  html body :is(#act-r1-txt,#act-r2-txt,#act-r3-txt,#act-r4-txt) { align-self: auto; flex: none; padding: var(--sp-xl); }
}
/* Mobile menu: full-screen white overlay (bar with logo/language/close stays on top). */
@media (max-width: 991px) {
  html body #brx-header #brxe-noa29x .bricks-mobile-menu-wrapper { position: fixed !important; inset: 0 !important; width: 100vw !important; max-width: none !important; height: 100vh !important; height: 100dvh !important; max-height: none !important; box-sizing: border-box !important; border-radius: 0 !important; border: 0 !important; box-shadow: none !important; background: var(--yellow-0) !important; padding: calc(var(--ics-header-h) + var(--sp-m)) var(--gutter) var(--sp-xl) !important; overflow-y: auto !important; z-index: -1 !important; }
}
/* Hỗ trợ place cards: photo on top (torn photo wrapper) */
html body .pl-th { margin-bottom: var(--sp-xs); }
html body .pl-th img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
/* Separators/hairlines: translucent black so they blend with any band colour */
html body :is(#act-r1-h,#act-r2-h,#act-r3-h,#act-r4-h) { border-bottom-color: var(--border-separator); }
/* Hỗ trợ place cards: whole card is torn paper (.ics-torn-card ::before is the paper) -> drop the flat white box; photo always cover */
html body .pl-card { background: transparent; border: 0; box-shadow: none; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12)); }
html body .pl-th img { object-fit: cover; object-position: center; max-width: 100%; }
html body .pl-card { --torn-bg: var(--yellow-500); }
/* Advisor + team wells: no own mask any more (the whole card is torn paper) so image and caption touch with no cream gap */
html body :is(#adv-1-well,#adv-2-well) { -webkit-mask: none; mask: none; }
/* Tin tức featured card: photo wrapper had no fixed share -> text column squeezed to ~170px (one word per line) */
@media (min-width: 768px) {
  html body .nw-card:first-child > :first-child { flex: 0 0 42%; width: 42%; max-width: 42%; }
  html body .nw-card:first-child > :last-child { min-width: 0; flex: 1 1 0; }
}
/* ===== All card thumbs are 1:1 cover (owner 2026-11-04) =====
   Column cards: wrapper is a square; row cards: wrapper stretches to the card height and is square (width follows).
   Photo always width/height 100% + object-fit cover. */
html body :is(.nw-card > :first-child, .tm-well, #adv-1-well, #adv-2-well, .pl-th, #lib-nar-img, #lib-wide-img, #lib-feat-img, .mv-nf-img, #news-wide > :first-child, .wn-news-card > :first-child, a.ics-card--panel > .ics-torn-photo, .dc-ci) { aspect-ratio: 4 / 3; height: auto; min-height: 0; max-height: none; }
html body :is(.nw-card > :first-child, .tm-well, #adv-1-well, #adv-2-well, .pl-th, #lib-nar-img, #lib-wide-img, #lib-feat-img, .mv-nf-img, #news-wide > :first-child, .wn-news-card > :first-child, a.ics-card--panel > .ics-torn-photo, .dc-ci) img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
/* column layout (phones; news/cards stacked) */
html body :is(.nw-card:not(:first-child) > :first-child, .tm-well, #adv-1-well, #adv-2-well, .pl-th, #lib-nar-img) { width: 100%; max-width: 100%; }
/* row cards: the photo is 33% of the card width and square (card height follows; text column keeps the rest) */
@media (min-width: 768px) {
  html body :is(.nw-card:first-child > :first-child, #news-wide > :first-child, .mv-nf-img, #lib-feat-img, #lib-wide-img) { flex: 0 0 33%; width: 33%; max-width: 33%; align-self: flex-start; height: auto; }
}
html body .dc-ci { flex: 0 0 38%; width: 38%; max-width: 38%; align-self: flex-start; height: auto; }
html body #lib-grid > a > img { flex: 0 0 38%; width: 38%; max-width: 38%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; align-self: flex-start; }
html body a.ics-card > .ics-torn-photo { aspect-ratio: 4 / 3; height: auto; }
html body a.ics-card > .ics-torn-photo img { width: 100%; height: 100%; object-fit: cover; }
html body .dc-ci { min-height: 0 !important; height: auto !important; }
html body #lib-grid > a > img { flex: 0 0 38% !important; width: 38% !important; max-width: 38% !important; height: auto !important; aspect-ratio: 4 / 3 !important; object-fit: cover !important; }
html body #lib-grid > a { align-items: flex-start; }
/* Có gì mới bento: photos stay where the layout puts them (absolute, % widths) but are square */
html body #wn-news-grid > #wn-news-card > .ics-torn-photo { height: auto !important; aspect-ratio: 4 / 3 !important; }
/* Có gì mới news grid: bento with absolute photos replaced by the same layout as Tin tức (featured row card + 3-col square-photo cards) */
html body #wn-news-grid#wn-news-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html body #wn-news-grid#wn-news-grid > #wn-news-card { grid-column: auto; grid-row: auto; flex-direction: column; position: relative; }
html body #wn-news-grid#wn-news-grid > #wn-news-card:nth-child(1) { grid-column: 1 / -1; flex-direction: row; }
html body #wn-news-grid#wn-news-grid > #wn-news-card > .ics-torn-photo { position: relative !important; top: auto !important; left: auto !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; flex: none; }
html body #wn-news-grid#wn-news-grid > #wn-news-card:nth-child(1) > .ics-torn-photo { width: 33% !important; align-self: flex-start; }
html body #wn-news-grid#wn-news-grid > #wn-news-card > #wn-news-body { margin-left: 0 !important; flex: 1 1 0; min-width: 0; padding: var(--sp-m) var(--sp-l) !important; justify-content: center; }
@media (max-width: 991px) {
  html body #wn-news-grid#wn-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  html body #wn-news-grid#wn-news-grid { grid-template-columns: minmax(0, 1fr); }
  html body #wn-news-grid#wn-news-grid > #wn-news-card:nth-child(1) { flex-direction: column; }
  html body #wn-news-grid#wn-news-grid > #wn-news-card:nth-child(1) > .ics-torn-photo { width: 100% !important; }
}
/* Footer tear on phones/tablets: the 1440x40 edge was squeezed to the screen width (needle teeth). Keep its natural proportions and show the centre crop. */
@media (max-width: 991px) {
  html body #brxe-05pfln#brxe-05pfln { background-size: auto 32px, 100% calc(100% - 32px + 1px); background-position: top center, bottom center; }
}
/* Halftone paper texture over every solid colour (cream, yellow, blue, pink, black footer): two fixed, click-through dot layers
   (dark dots show on light colours, light dots show on the black footer). Staggered 6px grid = print halftone. No blend modes (cheap on phones). */
html::before, html::after { content: ""; position: fixed; inset: 0; z-index: 800; pointer-events: none; }
html::before { background: radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px) 0 0 / 6px 6px, radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px) 3px 3px / 6px 6px; }
html::after { background: radial-gradient(circle at center, rgba(255, 255, 255, 0.10) 0 0.7px, transparent 1px) 1.5px 0 / 6px 6px, radial-gradient(circle at center, rgba(255, 255, 255, 0.10) 0 0.7px, transparent 1px) 4.5px 3px / 6px 6px; }
@media print, (prefers-contrast: more) { html::before, html::after { display: none; } }
/* Full-height hero/CTA bands on phones/tablets: the torn SVG band (preserveAspectRatio none) was stretched to a tall narrow box -> needle spikes.
   Keep the artwork's proportions and crop the centre instead. */
@media (max-width: 991px) {
  html body :is(#hf-band, #lib-hero-band, #sup-band, #sup-cta-band, #wn-dec-band, #jn-band, #mv-hero-band, #ab-dec-band) { object-fit: cover; object-position: center; }
}
/* Search field: keep typed text / placeholder clear of the magnifier icon */
html body #lib-search-filter input { padding-right: calc(var(--sp-2xl) + var(--sp-xs)); text-overflow: ellipsis; }
/* owner 2026-11-04: Lịch sử timeline cards = torn paper cards like all cards (ics-torn-card + ics-hover on each card, torn edge and pink hover shown) */
html body #mv-tl .ics-torn-card { filter: none; }
/* FAQ page: grouped accordions */
html body .faq-in { display: flex; flex-direction: column; gap: var(--sp-l); width: 100%; max-width: var(--container-width); margin-inline: auto; padding-inline: var(--gutter); box-sizing: border-box; }
html body :is(#faq-ve-ics, #faq-nhan-ho-tro, #faq-bao-mat, #faq-tinh-nguyen) { padding-block: var(--sp-2xl) 0; }
html body #faq-tinh-nguyen { padding-bottom: var(--sp-4xl); }
html body #faq-hero { background-color: var(--yellow-500); display: flex; align-items: center; justify-content: center; padding-inline: var(--gutter); }
html body #faq-hero-in { display: flex; flex-direction: column; align-items: center; gap: var(--sp-l); max-width: var(--container-width); text-align: center; }
html body #faq-hero-in > :is(p, h1) { margin: 0; }
html body #faq-hero-in > p:first-child { font-family: "Google Sans Code", monospace; font-size: var(--fs-body); font-weight: 500; letter-spacing: var(--ls-eyebrow); line-height: var(--lh-body); text-transform: uppercase; color: var(--text); }
html body #faq-hero-in > h1 { font-family: "EB Garamond", Georgia, serif; font-size: var(--fs-display); font-weight: 500; line-height: var(--lh-display); color: var(--heading); }
html body #faq-hero-in > p:last-child { font-family: Inter, sans-serif; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text);}
html body .faq-in > h2 { margin: 0; font-family: "EB Garamond", Georgia, serif; font-size: var(--fs-h2); font-weight: 500; line-height: var(--lh-h2); color: var(--heading); }
/* Hỗ trợ CTA band on phones/tablets: the 1440x1105 band was stretched over a 5000px-tall section -> huge spikes. Use its top and bottom tear at natural proportions + a flat fill between. */
@media (max-width: 991px) {
  html body #sup-cta-band { display: none; }
  html body #sup-cta-band-wrap { background: url(/wp-content/uploads/ics-tear-guard/sup-cta-top.svg) top center / auto 140px no-repeat, url(/wp-content/uploads/ics-tear-guard/sup-cta-bottom.svg) bottom center / auto 140px no-repeat, linear-gradient(var(--yellow-500), var(--yellow-500)) center / 100% calc(100% - 120px) no-repeat; }
}
html body #pl-grid { padding-inline: 0; }
/* Home news row: the Figma bento gave photos fixed 480/404px heights and 49-54% widths -> huge blank card on tablets. Photos are square 1:1 now; card height follows the content. */
@media (min-width: 992px) {
  html body #news-row2#news-row2 > .brxe-u3e321 > :is(#news-wide-img, #brxe-muutx4) { height: auto; aspect-ratio: 4 / 3; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(1) > :is(#news-wide-img, #brxe-muutx4) { flex: 0 0 33%; width: 33%; height: auto; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(2) > :is(#news-wide-img, #brxe-muutx4) { flex: 0 0 38%; width: 38%; height: auto; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) > :is(#news-wide-img, #brxe-muutx4) { width: 100%; height: auto; }
}
@media (min-width: 992px) {
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) > :first-child { flex: none; width: 100%; max-width: 100%; height: auto; aspect-ratio: 4 / 3; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) > :first-child img { width: 100%; height: 100%; object-fit: cover; }
}
@media (min-width: 992px) {
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(-n+2) { align-items: center; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(-n+2) > :first-child { align-self: center !important; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(-n+2) > :last-child { justify-content: center; align-self: stretch; }
}
/* 992-1279: the narrow third card moves under card 2 as a row card, so no card is stretched by its neighbour */
@media (min-width: 992px) and (max-width: 1279px) {
  html body #news-row2#news-row2 { grid-template-columns: minmax(0, 1fr); }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) { flex-direction: row; align-items: center; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) > :first-child { flex: 0 0 38%; width: 38%; max-width: 38%; }
  html body #news-row2#news-row2 > .brxe-u3e321:nth-child(3) > :last-child { justify-content: center; align-self: stretch; padding: var(--sp-m) var(--sp-l); }
}
/* Heroes fill the whole visible screen: min-height uses the LARGE viewport (iOS toolbars collapse, svh left a cream strip),
   and the yellow of band heroes runs down to the torn band at the hero's bottom instead of stopping where the band image ends. */
@supports (height: 100lvh) {
  html body #brx-content#brx-content > :first-child { min-height: 100lvh; }
}
@media (min-width: 992px) {
  html body #brx-content > :is(#ab-hero, #mv-hero):first-child { background-image: linear-gradient(var(--yellow-500), var(--yellow-500)); background-size: 100% calc(100% - 120px); background-repeat: no-repeat; background-position: top center; }
  html body :is(#ab-dec-band, #mv-hero-band) { top: auto !important; bottom: 0 !important; }
  html body :is(#sup-band-wrap, #jn-band-wrap) { background: linear-gradient(var(--yellow-500), var(--yellow-500)) top center / 100% calc(100% - 120px) no-repeat; }
  html body :is(#sup-band, #jn-band) { position: absolute; left: 0; right: 0; bottom: 0; top: auto; width: 100%; }
}
@media (min-width: 992px) {
  html body #ab-dec-band#ab-dec-band#ab-dec-band, html body #mv-hero-band#mv-hero-band#mv-hero-band { top: auto !important; bottom: 0 !important; height: auto !important; }
}
/* About: the old static hand-drawn curve (ab-dec-torn raster) is replaced by the animated progress line */
html body #ab-dec-torn { display: none !important; }
/* About team + advisors: rows always centred, with the page gutter */
html body :is(#ab-team-grid, #ab-adv-grid)#ab-team-grid, html body #ab-adv-grid { justify-content: center; padding-inline: var(--gutter); box-sizing: border-box; }
html body #ab-team-grid#ab-team-grid { justify-content: center; }
html body :is(#ab-team-grid, #ab-adv-grid) > * { max-width: 100%; }
/* Bio popup (template 2298): centred torn card, not a full-width sheet */
html body .brx-popup:has(#bio-pop) .brx-popup-content { width: min(36rem, calc(100vw - 2 * var(--gutter))); max-width: none; height: auto; max-height: calc(100dvh - 2 * var(--sp-l)); padding: 0; background: transparent; border-radius: var(--radius-m); overflow: visible; }
html body #bio-pop { display: flex; flex-direction: column; gap: var(--sp-m); width: 100%; max-height: calc(100dvh - 2 * var(--sp-l)); overflow: auto; padding: var(--sp-l); box-sizing: border-box; background: var(--yellow-0); border-radius: var(--radius-m); }
html body #bio-pop .bio-pop__img { width: min(14rem, 60%); aspect-ratio: 1 / 1; align-self: center; }
html body #bio-pop .bio-pop__img img { width: 100%; height: 100%; object-fit: cover; }
html body #bio-pop > * { margin: 0; }
/* Tiến trình CTA: heading, button, link — all centred in that order at every width */
html body #mv-cta-inner { align-items: center; text-align: center; }
html body #mv-cta-h { text-align: center; }
html body #mv-cta-row#mv-cta-row { flex-direction: column; align-items: center; justify-content: center; gap: var(--sp-l); width: 100%; }
html body #mv-cta-row > #mv-cta-btn { order: 1; }
html body #mv-cta-row > #mv-cta-link { order: 2; justify-content: center; }
/* Thư viện card: the photo lives in a div (.lib-th) so it follows the card's flex layout; the img just fills the square */
html body #lib-grid > a > .lib-th { flex: 0 0 38%; width: 38%; max-width: 38%; aspect-ratio: 4 / 3; height: auto; align-self: flex-start; position: relative; }
html body #lib-grid > a > .lib-th > img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none; object-fit: cover; }
@media (max-width: 599px) { html body #lib-grid > a > .lib-th { flex: none; width: 100%; max-width: 100%; } }
/* ===== One column rule for every vertical-card grid: 4 desktop (>=1200), 3 tablet landscape (992-1199), 2 tablet portrait (600-991), 1 mobile (<600).
   Row-card lists (Thư viện, Tài liệu: photo beside text) keep 3/2/1: 4 columns is too narrow for a side-by-side card. ===== */
html body #brxe-tbgrid#brxe-tbgrid, html body #brxe-nwgrid#brxe-nwgrid, html body #brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid, html body #wn-ev-grid#wn-ev-grid, html body #wn-news-grid#wn-news-grid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { html body #brxe-tbgrid#brxe-tbgrid, html body #brxe-nwgrid#brxe-nwgrid, html body #brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid, html body #wn-ev-grid#wn-ev-grid, html body #wn-news-grid#wn-news-grid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { html body #brxe-tbgrid#brxe-tbgrid, html body #brxe-nwgrid#brxe-nwgrid, html body #brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid, html body #wn-ev-grid#wn-ev-grid, html body #wn-news-grid#wn-news-grid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { html body #brxe-tbgrid#brxe-tbgrid, html body #brxe-nwgrid#brxe-nwgrid, html body #brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid, html body #wn-ev-grid#wn-ev-grid, html body #wn-news-grid#wn-news-grid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid { grid-template-columns: minmax(0, 1fr); } }
/* Thư viện card = the same post card as Tin tức: photo on top (square, torn), then chip, heading, excerpt, read more, inside a torn card; grid 4/3/2/1 */
html body #lib-grid#lib-grid#lib-grid > a { flex-direction: column; align-items: stretch; gap: 0; padding: var(--sp-s); height: 100%; background-color: transparent; }
html body #lib-grid#lib-grid > a > .lib-th { flex: none; width: 100%; max-width: 100%; align-self: stretch; }
html body #lib-grid#lib-grid > a > .lib-th.ics-torn-photo { margin: 0; }
html body #lib-grid#lib-grid > a > .ics-stack { flex: 1; gap: var(--sp-xs); padding: var(--sp-m); }
html body #lib-grid#lib-grid > a > .ics-stack > :last-child { margin-top: auto; padding-top: var(--sp-s); }
html body #lib-grid#lib-grid > a .lib-exc { margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
html body #lib-grid#lib-grid#lib-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { html body #lib-grid#lib-grid#lib-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { html body #lib-grid#lib-grid#lib-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { html body #lib-grid#lib-grid#lib-grid { grid-template-columns: minmax(0, 1fr); } }
/* Photos inside a torn card are plain (square, cover): only the CARD is torn */
html body .ics-torn-card .ics-torn-photo { filter: none; }
html body .ics-torn-card .ics-torn-photo::before, html body .ics-torn-card .ics-torn-photo::after { display: none; }
html body .ics-torn-card .ics-torn-photo > img, html body .ics-torn-card .ics-torn-photo img { -webkit-mask: none; mask: none; }
html body .ics-torn-card .ics-torn-photo, html body .ics-torn-card .ics-torn-photo img { border-radius: 0; }
/* Event month colours: fixed per month (js sets data-ics-month = month mod 3) */
html body :is(.ev-badge, #wn-ev-grid .brxe-xe21fn)[data-ics-month="1"] { background: var(--yellow-500); color: var(--yellow-1000); }
html body :is(.ev-badge, #wn-ev-grid .brxe-xe21fn)[data-ics-month="2"] { background: var(--blue-500); color: var(--blue-1000); }
html body :is(.ev-badge, #wn-ev-grid .brxe-xe21fn)[data-ics-month="0"] { background: var(--pink-500); color: var(--pink-1000); }
html body .ev-badge[data-ics-month] .ev-mon, html body .ev-badge[data-ics-month] .ev-day { color: inherit; }
html body #wn-ev-grid > .brxe-o1g3oh .brxe-xe21fn { background: transparent; }
html body #wn-ev-grid > .brxe-o1g3oh .brxe-xe21fn[data-ics-month="1"] { background: var(--yellow-500); }
html body #wn-ev-grid > .brxe-o1g3oh .brxe-xe21fn[data-ics-month="2"] { background: var(--blue-500); }
html body #wn-ev-grid > .brxe-o1g3oh .brxe-xe21fn[data-ics-month="0"] { background: var(--pink-500); }
/* Footer bottom bar: legal links + social icons, separated from the main footer menu */
html body #ft-legal { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-m) var(--sp-l); width: 100%; margin-top: var(--sp-l); padding-top: var(--sp-l); border-top: 1px solid var(--border-separator-on-dark); }
html body #ft-legal-nav { display: flex; flex-wrap: wrap; gap: var(--sp-xs) var(--sp-l); }
html body #ft-legal-nav a { color: var(--yellow-0); font-size: var(--fs-small); text-decoration: none; padding-block: var(--sp-xs); min-height: 44px; display: inline-flex; align-items: center; }
html body #ft-legal-nav a:hover, html body #ft-legal-nav a:focus-visible { text-decoration: underline; }
html body #ft-social { display: flex; gap: var(--sp-s); }
html body #ft-social a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 50%; color: var(--yellow-0); }
html body #ft-social a:hover, html body #ft-social a:focus-visible { background: var(--yellow-0); color: var(--neutral-1000); }
html body #ft-social svg { width: 1.25rem; height: 1.25rem; }
@media (max-width: 599px) { html body #ft-legal { flex-direction: column; align-items: flex-start; } }
/* Contact (Dong hanh #lien-he) form card = the Home contact card: same width, same torn mask */
html body #jn-form#jn-form#jn-form { width: min(43.75rem, 100%); max-width: none; -webkit-mask: url(/wp-content/uploads/ics-torn/form-torn-mask-r2.svg) center / 100% 100% no-repeat; mask: url(/wp-content/uploads/ics-torn/form-torn-mask-r2.svg) center / 100% 100% no-repeat; }
/* Job card = post card: padding 16, square photo on top (featured or illustration fallback), body padding 24 */
html body :is(.jb-card, .jn-jcard) { padding: var(--sp-s); gap: 0; align-items: stretch; flex-direction: column; background-color: transparent; }
html body :is(.jb-card, .jn-jcard) > .jb-th { width: 100%; aspect-ratio: 4 / 3; height: auto; position: relative; overflow: hidden; flex: none; }
html body :is(.jb-card, .jn-jcard) > .jb-th > img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; object-fit: cover; }
html body :is(.jb-card, .jn-jcard) > .jb-th--fb { background: var(--yellow-300); }
html body :is(.jb-card, .jn-jcard) > .jb-th--fb > img { object-fit: contain; padding: var(--sp-xl); box-sizing: border-box; }
html body :is(.jb-card > .jb-cb, .jn-jcard > .jn-jcb) { padding: var(--sp-l); gap: var(--sp-xs); flex: 1; }
/* Tai lieu card = post card (photo on top, body below) and the same 4/3/2/1 grid */
html body .dc-card#brxe-dccard, html body #brxe-dcgrid > .dc-card { flex-direction: column; align-items: stretch; padding: var(--sp-s); gap: 0; background-color: transparent; }
html body #brxe-dcgrid > .dc-card > .dc-ci { flex: none !important; width: 100% !important; max-width: 100% !important; aspect-ratio: 4 / 3; height: auto !important; }
html body #brxe-dcgrid > .dc-card > .dc-cb { flex: 1; padding: var(--sp-l); }
html body #brxe-dcgrid#brxe-dcgrid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1199px) { html body #brxe-dcgrid#brxe-dcgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { html body #brxe-dcgrid#brxe-dcgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { html body #brxe-dcgrid#brxe-dcgrid { grid-template-columns: minmax(0, 1fr); } }
html body #brxe-dcsec1#brxe-dcsec1 #brxe-dcgrid > .dc-card { flex-direction: column; }
/* Header at tablet landscape (992-1279): tighter menu so the last item never runs into the language switcher */
@media (min-width: 992px) and (max-width: 1279px) {
  html body #brxe-noa29x .bricks-nav-menu > li.menu-item { margin-left: var(--sp-xs); }
  html body #brxe-noa29x .bricks-nav-menu > li > a, html body #brxe-noa29x .bricks-nav-menu > li > .brx-submenu-toggle > a { font-size: var(--fs-small); padding-inline: var(--sp-2xs); white-space: nowrap; }
}
@media (min-width: 992px) and (max-width: 1279px) {
  html body #brxe-noa29x .bricks-nav-menu a { font-size: var(--fs-small) !important; }
}
/* No "read more" label on cards: the whole card is the link (its heading is the accessible name) */
html body :is(a.ics-card, a.ics-card--panel, a.nw-card, a.dc-card, a.ev-card, a.jb-card, a.jn-jcard, a.lg-card, a.tm-card, a.wn-news-card, a.news-wide, #lib-grid > a, a.mv-nf) span:is(.ics-link, .nw-link, .dc-link, .ev-link, .jb-link, .jn-jact, .wn-news-act, .lg-link, .tm-link) { display: none !important; }
/* About library cards: the label is the real stretched link -> keep it for keyboard/screen readers, hide it visually */
html body :is(#lib-feat-link, #lib-wide-link, #lib-nar-link) { position: absolute; inset: 0; width: auto; height: auto; overflow: hidden; font-size: 0; line-height: 0; color: transparent; text-decoration: none; padding: 0; }
html body :is(#lib-feat-link, #lib-wide-link, #lib-nar-link)::after { z-index: 2; }
/* ===== Buttons: ONE size. Best practice = 44-48px tall touch target (WCAG 2.5.5 / Apple 44pt / Material 48dp), padding ~12/24, 16px label. Was 56px tall, 16/32 padding. ===== */
html body :is(.ics-btn, a.bricks-button.ics-btn, button.bricks-button.ics-btn, #contact-form button[type=submit], #jn-native-form button[type=submit]) { min-height: 48px; padding: var(--sp-s) var(--sp-l) !important; font-size: var(--fs-body); line-height: var(--lh-body); }
html body #lib-more { padding-inline: var(--sp-l) !important; }
/* ===== Text fields: content box must fit the line (Vietnamese diacritics were clipped at 44px height with 12px padding) ===== */
html body :is(input[type=text], input[type=search], input[type=email], input[type=tel], .brxe-filter-search input, select) { line-height: var(--lh-body); padding-block: var(--sp-xs) !important; }
html body :is(#contact-form, #jn-native-form) input[type=text] { padding-block: var(--sp-xs) !important; }
html body input::placeholder, html body textarea::placeholder { text-overflow: ellipsis; opacity: 1; }
@media (max-width: 599px) {
  html body .brxe-filter-search input { padding-inline: var(--sp-s); }
  html body :is(#brxe-nwtool, #brxe-dctl01, #wn-filter) > .brxe-filter-search, html body #lib-docs-inner > #lib-search-slot { min-width: 6.5rem; }
  html body .ics-fsel { max-width: 5.5rem; padding-inline: var(--sp-xs) var(--sp-2xs); }
}
@media (max-width: 599px) { html body .ics-fsel { max-width: 4.75rem; } html body :is(#brxe-nwtool, #brxe-dctl01, #wn-filter) > .brxe-filter-search, html body #lib-docs-inner > #lib-search-slot { min-width: 7.5rem; } }

/* Horizontal (row) cards: text block vertically centred against the photo; auto block margins do nothing when the card stacks (VN 11-05) */
html body :is(.news-wide-body, .lib-feat-cc, .lib-wide-cc, .wn-news-body, .nw-card:first-child > :last-child) { margin-block: auto; }
html body :is(#lib-feat-cc, #lib-wide-cc) { margin-block: auto; }
html body :is(#lib-feat-img, #lib-wide-img) { align-self: center !important; }

/* Audit batch 1 (VN 11-05): yellow band images fill section at narrow widths; related/support photos 1:1; load-more auto width; tap targets; filter label */
@media (max-width: 991px) {
  html body :is(#ics-contact-bg, #mv-cta-band) { inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
}
html body :is(img.brxe-tpi170, img.brxe-evlc02, img.brxe-cdx002, #card-1-img, #card-2-img, #card-3-img, #card-4-img, #card-5-img, #card-6-img, #card-7-img, #card-8-img) { aspect-ratio: 4 / 3; width: 100%; height: auto; object-fit: cover; }
html body #lib-more { width: auto; align-self: center; margin-inline: auto; display: inline-flex; justify-content: center; }
html body .pl-meta a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 599px) {
  html body .ics-fsel { max-width: none; min-width: 6.5rem; }
  html body #lib-docs-inner .ics-fsel { max-width: 4.75rem; min-width: 0; }
}
@media (max-width: 991px) { html body :is(#ics-contact-bg, #mv-cta-band) { display: block !important; z-index: 0; pointer-events: none; } }

/* Team grid: 4 / 3 / 2 / 1 columns (global card-grid rule) */
html body #ab-team-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-m); justify-content: stretch; }
html body #ab-team-grid > * { width: auto; max-width: none; min-width: 0; }
@media (max-width: 1199px) { html body #ab-team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { html body #ab-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { html body #ab-team-grid { grid-template-columns: minmax(0, 1fr); } }
/* Job single CTA: centred like every yellow CTA */
html body #brxe-6v01kv { align-items: center; text-align: center; }
html body #brxe-6v01kv > * { text-align: center; }

/* Cross-browser audit (VN 11-05): activity rows must not shrink-to-fit before lazy images load; filter row stable on cold load */
html body :is([id^="act-r"][id$="-in"]) { width: 100%; box-sizing: border-box; }
html body :is([id^="act-r"][id$="-in"]) img { max-width: 100%; height: auto; }
html body #lib-search-icon { width: 1.25em; height: 1.25em; flex: none; }
@media (max-width: 599px) {
  html body .ics-fsel, html body #lib-docs-inner .ics-fsel { max-width: 6rem !important; min-width: 6rem !important; padding-inline: var(--sp-xs) 1.75rem; }
  html body .brxe-filter-search input::placeholder { color: transparent; }
}
/* Timeline photos 1:1 cover */
html body :is([id^="mv-r"][id$="-img"]) { aspect-ratio: 4 / 3 !important; width: 100% !important; height: auto !important; max-height: none !important; object-fit: cover !important; }

/* Landing-page heroes (Hoạt động, Sứ mệnh, Hướng dẫn, Tìm kiếm sự giúp đỡ): yellow band with torn bottom, same art as Có gì mới (VN 11-05) */
html body :is(#p132-hero, #p131-intro, #act-hero, #mis-intro) { background: linear-gradient(var(--yellow-500), var(--yellow-500)) top / 100% 14% no-repeat, url(/wp-content/uploads/2026/11/ics-whatsnew-band-top.svg) center top / 100% 100% no-repeat, var(--cream, #faf6ed); }
html body :is(#p132-hero, #p131-intro, #act-hero, #mis-intro) { background-origin: border-box; }

/* Landing hero intro copy uses the site body face like every other hero; timeline year pills always readable */
html body :is(#p132-hero, #p131-intro, #act-hero, #mis-intro) p { font-family: Inter, system-ui, sans-serif; font-size: var(--fs-body); line-height: var(--lh-body); }
html body :is([id^="mv-r"][id$="-tag"]) { opacity: 1 !important; }

/* Event info rows left-aligned; document single cover 1:1 and larger (VN 11-05) */
html body .brxe-evrw01, html body #brxe-evrw01 { align-items: flex-start; text-align: left; }
@media (min-width: 768px) {
  html body.single-ics_document #brxe-ct0001 { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: var(--sp-l); align-items: start; }
}
html body.single-ics_document img#brxe-img001, html body.single-ics_document img.brxe-img001 { aspect-ratio: 4 / 3; width: 100%; height: auto; object-fit: cover; }
html body #brxe-evrw01#brxe-evrw01 { align-items: flex-start !important; text-align: left !important; }

/* Global content max width 1440px: sections, header, footer (VN 11-05) */
html:root { --container-wide: 90rem; }
html body #brxe-5sh2mw { max-width: 90rem; }

/* Halftone is a BACKGROUND texture only (owner 11-05): the fixed overlay above text/photos/cards is removed; dots are painted as background layers of body, coloured sections, band sections and the footer. */
html::before, html::after { display: none !important; }
html:root {
  --ht-img: radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px), radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px);
  --htl-img: radial-gradient(circle at center, rgba(255, 255, 255, 0.10) 0 0.7px, transparent 1px), radial-gradient(circle at center, rgba(255, 255, 255, 0.10) 0 0.7px, transparent 1px);
}
html body, html body section[class*="ics-bg-"]:not(.ics-bg-black) { background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; }
/* sections whose colour comes from a band image: dots sit on a first-child layer under the content */
html body section:has(> img[id$="-band"], > img.ics-parallax, > [id$="-band-wrap"], > img[id$="-bg"]) { position: relative; }
html body section:has(> img[id$="-band"], > img.ics-parallax, > [id$="-band-wrap"], > img[id$="-bg"])::before { content: ""; position: absolute; inset: 0; background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; pointer-events: none; z-index: 0; }
/* landing heroes with their own yellow art: dots as the top layer */
html body :is(#p132-hero, #p131-intro, #act-hero, #mis-intro) { background-image: radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px), radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px), linear-gradient(var(--yellow-500), var(--yellow-500)), url(/wp-content/uploads/2026/11/ics-whatsnew-band-top.svg); background-size: 6px 6px, 6px 6px, 100% 14%, 100% 100%; background-repeat: repeat, repeat, no-repeat, no-repeat; background-position: 0 0, 3px 3px, top, center top; }
/* black footer: light dots */
html body #brxe-05pfln { position: relative; }
html body #brxe-05pfln::before { content: ""; position: absolute; inset: 0; background-image: var(--htl-img); background-size: 6px 6px; background-position: 1.5px 0, 4.5px 3px; pointer-events: none; z-index: 0; }
html body #brxe-05pfln > * { position: relative; z-index: 1; }

/* Support-card illustrations: always a 1:1 box with padding so the float/wiggle animation never gets clipped (VN 11-05) */
html body [id^="card-"][id$="-art"] { aspect-ratio: 4 / 3 !important; height: auto !important; padding: var(--sp-m) !important; box-sizing: border-box; overflow: visible !important; display: flex; align-items: center; justify-content: center; }
html body [id^="card-"][id$="-art"] > img { width: 100% !important; height: 100% !important; aspect-ratio: 4 / 3; object-fit: contain !important; }

/* Hero yellow band art: always fills the hero; the torn bottom edge stays anchored to the bottom at every width (VN 11-05) */
html body section[id$="-hero"] img[id$="-band"] { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center bottom; }
html body #sup-band-wrap { position: absolute; inset: 0; height: 100%; }
html body section[id$="-hero"] img#sup-band#sup-band { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover !important; object-position: center bottom !important; }
html body #sup-band-wrap#sup-band-wrap { position: absolute !important; inset: 0 !important; height: 100% !important; }

/* Global content width (owner 11-05): width 87.5% of the viewport, capped at --global-content-max-width (1440px). Every wrapper that used var(--container-wide) now follows it; header + footer included. */
html:root { --global-content-max-width: 1440px; --container-wide: min(var(--global-content-max-width), 87.5vw); }
html body #brxe-5sh2mw#brxe-5sh2mw { width: 100%; max-width: var(--container-wide) !important; }
html body #brxe-cc5gtc#brxe-cc5gtc { width: 100%; max-width: var(--container-wide) !important; margin-inline: auto; }

/* ===== Owner batch 11-05 (late) ===== */
/* 1. No breadcrumbs / back-links anywhere */
html body :is(#brxe-bkp001, #brxe-bkd001, #brxe-bkb001, #p131-back, #p132-back, #brxe-evbc01) { display: none !important; }
/* 2. Card grids: one tight gap everywhere (was 24-32px) */
html body :is(#brxe-nwgrid, #pl-grid, #news-row2, #wn-news-grid, #wn-ev-grid, #jn-jobs-grid, #mv-news-list, #brxe-lggrd1, #brxe-evgrid, #brxe-dcgrid, #lib-grid, #brxe-tbgrid, #brxe-jbgrid, #ab-team-grid) { gap: var(--sp-m) !important; }
/* 3. Reset-filter button only when a filter is active */
html body .brxe-filter-submit.brx-no-active-filters, html body #lib-clear-filter[hidden] { display: none !important; }
/* 4. Sub-menu items never larger than first-level items */
html body #brx-header :is(.sub-menu, .brx-dropdown-content, .bricks-nav-menu .sub-menu, ul ul) a { font-family: Inter, system-ui, sans-serif; font-size: var(--fs-small); line-height: var(--lh-body); }
/* 5. Halftone dots also on yellow band art: dots layer sits between the band image and the content */
html body section:has(> img[id$="-band"], > img.ics-parallax, > [id$="-band-wrap"], > img[id$="-bg"]) { isolation: isolate; }
html body section:has(> img[id$="-band"], > img.ics-parallax, > [id$="-band-wrap"], > img[id$="-bg"])::before { z-index: -1; }
html body section > :is(img[id$="-band"], img.ics-parallax, [id$="-band-wrap"], img[id$="-bg"]) { z-index: -2 !important; }
/* Desktop sub-menu items: same face as first level, never bigger */
html body #brx-header .sub-menu li a, html body #brx-header .sub-menu a, html body #brx-header .brx-submenu-positioned a { font-family: Inter, system-ui, sans-serif !important; font-size: var(--fs-body) !important; line-height: var(--lh-body) !important; }
/* Owner change: header menu (desktop + mobile) in EB Garamond. Sub-menu = fallback for first-level size rules below. */
html body #brx-header .bricks-nav-menu a, html body #brx-header .bricks-mobile-menu-wrapper a, html body #brx-header .bricks-mobile-menu a { font-family: "EB Garamond", Georgia, serif !important; }
html body #brx-header .bricks-nav-menu > li > a, html body #brx-header .bricks-nav-menu > li > .brx-submenu-toggle > a { font-size: var(--fs-label-l) !important; }
@media (min-width: 992px) and (max-width: 1279px) { html body #brx-header .bricks-nav-menu > li > a, html body #brx-header .bricks-nav-menu > li > .brx-submenu-toggle > a { font-size: var(--fs-body) !important; } }
html body #brx-header .sub-menu li a, html body #brx-header .sub-menu a, html body #brx-header .brx-submenu-positioned a { font-family: "EB Garamond", Georgia, serif !important; font-size: var(--fs-body) !important; line-height: var(--lh-body) !important; }

/* Footer rhythm + one left edge (owner task E 11-04): logo, top nav, divider and legal bar share the footer inner left edge; spacing on the sp scale. */
html body #brxe-05pfln#brxe-05pfln { padding-top: var(--sp-2xl) !important; padding-bottom: var(--sp-l) !important; }
html body #brxe-cc5gtc#brxe-cc5gtc { gap: 0 !important; }
html body #brxe-4693rj#brxe-4693rj { margin-bottom: var(--sp-xl) !important; }
html body #brxe-9qi9lb#brxe-9qi9lb { margin-bottom: var(--sp-l) !important; min-height: 0 !important; height: auto !important; }
html body #brxe-skkdtv#brxe-skkdtv { max-width: none !important; width: 100% !important; margin-left: 0 !important; padding-left: 0 !important; }
html body #brxe-skkdtv a { margin-left: 0 !important; padding-left: 0 !important; }
html body #ft-legal#ft-legal { margin-top: 0 !important; padding-top: var(--sp-m) !important; }
/* Reset-filter buttons: hidden unless a filter is active (class set by a11y-read.js) */
html body button.brxe-filter-submit:not(.ics-f-on) { display: none !important; }
html body button.brxe-filter-submit.ics-f-on { display: inline-flex !important; }
/* Consent checkboxes (Join + Home forms): smaller label, clickable privacy link */
html body #contact-form#contact-form>.form-group>ul>li>label, html body #jn-native-form#jn-native-form>.form-group>ul>li>label { font-size: var(--fs-xs) !important; line-height: var(--lh-xs) !important; }
html body #contact-form#contact-form>.form-group>ul>li>label a, html body #jn-native-form#jn-native-form>.form-group>ul>li>label a { position: relative; z-index: 2; color: inherit; text-decoration: underline; }
html body #contact-form#contact-form>.form-group>ul>li>label a:focus-visible, html body #jn-native-form#jn-native-form>.form-group>ul>li>label a:focus-visible { outline: 2px solid var(--neutral-800); outline-offset: 2px; }

/* Footer spacing v2 (owner feedback 11-04): more room; overrides the task E rhythm rule above. */
html body #brxe-05pfln#brxe-05pfln { padding-top: var(--sp-3xl) !important; padding-bottom: var(--sp-xl) !important; }
html body #brxe-4693rj#brxe-4693rj { margin-bottom: var(--sp-2xl) !important; }
html body #brxe-9qi9lb#brxe-9qi9lb { margin-bottom: var(--sp-xl) !important; }

/* h3 2026-11-04: /co-gi-moi/ (page 127) recycles the Tin tuc card (tpl 1095 .nw-card/.nw-cb/.nw-ci/.nw-chip) and the Su kien card (tpl 1368 .ev-card/.ev-body/.ev-badge). Scoped to the page grids only. */
html body #wn-news-grid .nw-card { display: flex; flex-direction: column; border-radius: var(--radius-m); overflow: hidden; text-decoration: none; color: var(--text); position: relative; background: var(--yellow-0); }
html body #wn-news-grid .nw-ci { aspect-ratio: 4 / 3; background: var(--yellow-100); overflow: hidden; width: 100%; }
html body #wn-news-grid .nw-ci img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body #wn-news-grid .nw-cb { display: flex; flex-direction: column; gap: var(--sp-s); padding: var(--sp-l); flex: 1; }
html body #wn-news-grid .nw-chip { display: inline-flex; align-self: flex-start; padding: var(--sp-2xs) var(--sp-s); border-radius: var(--radius-m); font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); background: var(--pink-200); color: var(--pink-800); white-space: nowrap; }
html body #wn-news-grid .nw-meta { font-size: var(--fs-body); }
html body #wn-news-grid#wn-news-grid > #wn-news-card:nth-child(1) { min-height: 360px; }
html body #wn-news-grid#wn-news-grid > #wn-news-card:not(:first-child) > #wn-news-body.nw-cb { padding: var(--sp-l) !important; justify-content: flex-start !important; }
html body #wn-news-grid#wn-news-grid > #wn-news-card:first-child > #wn-news-body.nw-cb { padding: var(--sp-2xl) !important; gap: var(--sp-m); justify-content: center !important; }
html body #wn-ev-grid .ev-card { display: flex; flex-direction: column; background: var(--yellow-0); border-radius: var(--radius-m); overflow: hidden; color: var(--text); text-decoration: none; height: 100%; }
html body #wn-ev-grid .ev-body { display: flex; flex-direction: column; gap: var(--sp-m); padding: var(--sp-xl); flex: 1; }
html body #wn-ev-grid .ev-top { display: flex; gap: var(--sp-m); align-items: flex-start; justify-content: space-between; }
html body #wn-ev-grid .ev-badge { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 72px; padding: var(--sp-xs) var(--sp-s); background: var(--neutral-50); border-radius: var(--radius-m); }
html body #wn-ev-grid .ev-mon { font-family: 'Google Sans Code', monospace; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text-muted); }
html body #wn-ev-grid .ev-day { font-family: 'EB Garamond', serif; font-size: var(--fs-h3); line-height: var(--lh-body); color: var(--neutral-1000); }
html body #wn-ev-grid .ev-chip { display: inline-flex; align-self: flex-start; padding: var(--sp-2xs) var(--sp-s); border-radius: var(--radius-m); font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); background: var(--blue-200); color: var(--blue-800); white-space: nowrap; }
html body #wn-ev-grid .ev-meta { display: flex; flex-direction: column; gap: var(--sp-xs); font-size: var(--fs-body); color: var(--text-muted); }

/* ===== H2 content-width pass (11-04): section gutters zeroed where a 87.5% wrapper sits inside; layout wrappers = 87.5% of viewport capped at --global-content-max-width; text-only wrappers = 87.5% capped at 68rem; all centred. Bands, torn edges, footer black, header untouched. ===== */
html body section#ab-hero#ab-hero, html body section#act-hero#act-hero, html body section#brxe-dchero#brxe-dchero, html body section#brxe-dcsec1#brxe-dcsec1, html body section#brxe-evhero#brxe-evhero, html body section#brxe-evsec1#brxe-evsec1, html body section#brxe-jbcta1#brxe-jbcta1, html body section#brxe-jbhero#brxe-jbhero, html body section#brxe-jbsec1#brxe-jbsec1, html body section#brxe-nwhero#brxe-nwhero, html body section#brxe-nwsec1#brxe-nwsec1, html body section#brxe-tbhero#brxe-tbhero, html body section#brxe-tbsec1#brxe-tbsec1, html body section#faq-hero#faq-hero, html body section#jn-contact#jn-contact, html body section#jn-hero#jn-hero, html body section#jn-partners#jn-partners, html body section#jn-recruit#jn-recruit, html body section#jn-story#jn-story, html body section#lib-faq#lib-faq, html body section#lib-hero#lib-hero, html body section#lib-policies#lib-policies, html body section#mis-intro#mis-intro, html body section#mis-s2#mis-s2, html body section#mis-s3#mis-s3, html body section#mis-s4#mis-s4, html body section#mv-cta#mv-cta, html body section#mv-faq#mv-faq, html body section#mv-hero#mv-hero, html body section#mv-news#mv-news, html body section#mv-quote#mv-quote, html body section#p131-intro#p131-intro, html body section#p131-o3#p131-o3, html body section#p131-o4#p131-o4, html body section#p131-o5#p131-o5, html body section#p131-o6#p131-o6, html body section#p132-hero#p132-hero, html body section#p132-list#p132-list, html body section#p132-quote#p132-quote, html body section#sup-options#sup-options, html body section#wn-ev-intro#wn-ev-intro, html body section#wn-hero#wn-hero, html body section#wn-opt2#wn-opt2, html body section#wn-opt4#wn-opt4 { padding-inline: 0 !important; }
html body #brxe-ct0001#brxe-ct0001, html body #brxe-2q16v3#brxe-2q16v3, html body #brxe-33vyg5#brxe-33vyg5, html body #brxe-jiexkj#brxe-jiexkj, html body #brxe-vq2idu#brxe-vq2idu, html body #lib-policies-inner#lib-policies-inner, html body #lib-faq-inner#lib-faq-inner, html body #lib-hero-row#lib-hero-row, html body #mv-cta-inner#mv-cta-inner, html body #p132-hero-in#p132-hero-in, html body #mis-s4-head#mis-s4-head, html body #mis-intro-in#mis-intro-in, html body #jn-partners-in#jn-partners-in, html body #jn-recruit-in#jn-recruit-in, html body #jn-story-in#jn-story-in, html body #jn-contact-in#jn-contact-in, html body #jn-hero-inner#jn-hero-inner, html body #p131-o3-in#p131-o3-in, html body #p131-o4-in#p131-o4-in, html body #p131-o5-in#p131-o5-in, html body #p131-o6-in#p131-o6-in, html body #wn-opt2-wrap#wn-opt2-wrap, html body #wn-opt4-wrap#wn-opt4-wrap, html body #pl-grid#pl-grid, html body #sup-cards#sup-cards, html body #mis-s2-in#mis-s2-in { width: 87.5% !important; max-width: var(--global-content-max-width) !important; margin-inline: auto !important; box-sizing: border-box; }
html body #ab-hero-text#ab-hero-text, html body #act-hero-in#act-hero-in, html body #faq-hero-in#faq-hero-in, html body #wn-ev-intro-in#wn-ev-intro-in, html body #wn-hero-inner#wn-hero-inner, html body #mv-hero-text#mv-hero-text, html body #p131-intro-in#p131-intro-in, html body #p132-quote-t#p132-quote-t, html body #mv-quote-p#mv-quote-p, html body #mv-faq-head#mv-faq-head, html body #mv-news-head#mv-news-head, html body #sup-opt-head#sup-opt-head, html body #mis-s3-head#mis-s3-head, html body #ab-adv-head#ab-adv-head, html body #ab-lib-head#ab-lib-head, html body #ab-tl-head#ab-tl-head { width: 87.5% !important;margin-inline: auto !important; box-sizing: border-box; }
/* Halftone on yellow (generic): yellow-filled elements get the dot layer; yellow band sections get dots above the band art */
html body .ics-ydot { background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; }
html body section:has([id$="-band"], [id$="-band-wrap"], .ics-parallax, [id$="-bg"]):not(.ics-bg-black) { background-image: none !important; isolation: isolate; }
html body section:has([id$="-band"], [id$="-band-wrap"], .ics-parallax, [id$="-bg"]):not(.ics-bg-black)::before { content: ""; position: absolute; inset: 0; background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; pointer-events: none; z-index: -1; }
html body section > :is([id$="-band"], [id$="-band-wrap"], .ics-parallax, [id$="-bg"]) { z-index: -2 !important; }
html body #wn-ev-grid .ev-mon { white-space: nowrap; }
html body #wn-ev-grid .ev-badge { flex: none; }
/* Card thumbnails 4:3 (owner): activity panel photos, lich-su news thumbs, lib-wide photo */
html body main .ics-torn-card img[src*="vr-"] { aspect-ratio: 4 / 3 !important; width: 100% !important; height: auto !important; object-fit: cover !important; }
html body #mv-news-list .mv-nf-img { aspect-ratio: 4 / 3 !important; width: 100% !important; height: auto !important; object-fit: cover !important; }
html body img#lib-wide-photo, html body #lib-wide-photo img { aspect-ratio: 4 / 3 !important; width: 100% !important; height: auto !important; object-fit: cover !important; }
/* h3 r2: /co-gi-moi/ event venue = one line with ellipsis (same card height as /su-kien/) */
html body #wn-ev-grid .ev-meta > span:last-child { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Footer breathing room v3 (owner 11-04): top padding and logo->nav gap = sp-4xl (96px at 1440, nearest token to 100px); <=991px sp-2xl. Bottom stays sp-xl. Overrides v2 above. */
html body #brxe-05pfln#brxe-05pfln { padding-top: var(--sp-4xl) !important; }
html body #brxe-4693rj#brxe-4693rj { margin-bottom: var(--sp-4xl) !important; }
@media (max-width: 991px) {
  html body #brxe-05pfln#brxe-05pfln { padding-top: var(--sp-2xl) !important; }
  html body #brxe-4693rj#brxe-4693rj { margin-bottom: var(--sp-2xl) !important; }
}
/* H2 fix: hero text+art rows (ab-hero, mv-hero, act-hero) use the 87.5% gutter as section padding so text and art sit inside the content box; text column auto width, max 68rem. */
html body section#ab-hero#ab-hero, html body section#mv-hero#mv-hero, html body section#act-hero#act-hero { padding-inline: calc((100% - min(87.5%, var(--global-content-max-width))) / 2) !important; }
html body #ab-hero-text#ab-hero-text, html body #mv-hero-text#mv-hero-text, html body #act-hero-in#act-hero-in { width: auto !important;margin-inline: 0 !important; }
/* h3 r2: /co-gi-moi/ featured news card title = tpl 1095 first-child type (fs-h3 / lh-h3; 390: fs-sub2 / lh-h3) */
html body #wn-news-grid#wn-news-grid > #wn-news-card:first-child #wn-news-title { font-size: var(--fs-h3); line-height: var(--lh-h3); }
@media (max-width: 767px) { html body #wn-news-grid#wn-news-grid > #wn-news-card:first-child #wn-news-title { font-size: var(--fs-sub2); line-height: var(--lh-h3); } }

/* ===== People cards (team grid, advisors, team archive, bio popup): 1:1 square thumbs, owner 2026-11-04. Overrides the global 4:3 rule above. News/events/docs/library/jobs/places stay 4:3. ===== */
html body #adv-1-well#adv-1-well, html body #adv-2-well#adv-2-well, html body #brxe-tbgrid#brxe-tbgrid .tm-well, html body #bio-pop#bio-pop .bio-pop__img { aspect-ratio: 1 / 1; height: auto; min-height: 0; max-height: none; width: 100%; }
html body #brxe-tbgrid#brxe-tbgrid .tm-well > img.tm-photo, html body #bio-pop#bio-pop .bio-pop__img img { width: 100%; height: 100%; max-width: none; aspect-ratio: 1 / 1; object-fit: cover; object-position: center; }
html body #bio-pop#bio-pop .bio-pop__img { width: min(14rem, 60%); }

/* People cards: equal row height, aligned tops, card as flex column */
html body #brxe-tbgrid#brxe-tbgrid { grid-auto-rows: 1fr; align-items: stretch; }
html body #brxe-tbgrid#brxe-tbgrid > * { display: flex; flex-direction: column; height: 100%; min-width: 0; }
html body #brxe-tbgrid#brxe-tbgrid > * > .tm-well { flex: 0 0 auto; }
html body #brxe-tbgrid#brxe-tbgrid > * > :last-child { flex: 1 1 auto; }

/* People cards: keyboard focus ring only (no stuck outline after mouse click) */
html body #ab-team-grid#ab-team-grid :focus:not(:focus-visible), html body #brxe-tbgrid#brxe-tbgrid :focus:not(:focus-visible), html body #adv-1-well#adv-1-well :focus:not(:focus-visible), html body #adv-2-well#adv-2-well :focus:not(:focus-visible) { outline: none; }
html body #ab-team-grid#ab-team-grid :focus-visible, html body #brxe-tbgrid#brxe-tbgrid :focus-visible { outline: 2px solid var(--heading); outline-offset: 2px; }
/* Reset-filter buttons: the class set by a11y-read.js wins over the older hidden attribute */
html body button.brxe-filter-submit.ics-f-on[hidden], html body #lib-clear-filter.ics-f-on[hidden] { display: inline-flex !important; }

/* h11 2026-11-04: Home #ics-news (page 118) recycles the /tin-tuc/ card components (nw-card/nw-ci/nw-cb/nw-chip/nw-tit/nw-meta, ics-torn-card/ics-torn-photo): featured row card + standard cards. Scoped to #news-grid-home (the Home grid). Old #news-row2/#news-wide hacks are inert (ids removed). */
html body #news-grid-home#news-grid-home { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 992px) { html body #news-grid-home#news-grid-home { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
html body #news-grid-home#news-grid-home > .nw-card { display: flex; flex-direction: column; min-width: 0; border-radius: var(--radius-m); overflow: hidden; text-decoration: none; color: var(--text); position: relative; background: var(--yellow-0); }
html body #news-grid-home#news-grid-home > .nw-card > .ics-torn-photo { display: block; position: relative; top: auto; left: auto; width: 100%; height: auto; }
html body #news-grid-home#news-grid-home .nw-ci { aspect-ratio: 4 / 3; height: auto; width: 100%; background: var(--yellow-100); overflow: hidden; }
html body #news-grid-home#news-grid-home .nw-ci img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body #news-grid-home#news-grid-home .nw-cb { display: flex; flex-direction: column; gap: var(--sp-s); padding: var(--sp-l); flex: 1; justify-content: flex-start; }
html body #news-grid-home#news-grid-home .nw-chip { display: inline-flex; align-self: flex-start; padding: var(--sp-2xs) var(--sp-s); border-radius: var(--radius-m); font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); background: var(--pink-200); color: var(--pink-800); white-space: nowrap; }
html body #news-grid-home#news-grid-home .nw-meta { font-size: var(--fs-body); }
html body #news-grid-home#news-grid-home .nw-tit { margin: 0; }
@media (min-width: 768px) {
  html body #news-grid-home#news-grid-home > .nw-card:first-child { grid-column: 1 / -1; flex-direction: row; min-height: 360px; }
  html body #news-grid-home#news-grid-home > .nw-card:first-child > .ics-torn-photo { flex: none; width: 33% !important; align-self: flex-start; }
  html body #news-grid-home#news-grid-home > .nw-card:first-child > .nw-cb { justify-content: center; padding: var(--sp-2xl); gap: var(--sp-m); }
  html body #news-grid-home#news-grid-home > .nw-card:first-child .nw-tit { font-size: var(--fs-h3); line-height: var(--lh-h3); }
}

/* h11 2026-11-04 (planner review): Home #ics-news uses the /tin-tuc/ 4-column grid (5 posts: featured row + 4 standard). Overrides the earlier #news-grid-home 2-col rule. */
html body #news-grid-home#news-grid-home { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { html body #news-grid-home#news-grid-home { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { html body #news-grid-home#news-grid-home { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1200px) { html body #news-grid-home#news-grid-home { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
html body #news-grid-home#news-grid-home > .nw-card:first-child { grid-column: 1 / -1; }
/* h7 (11-04): wide screens (>=992px) the band/deco SVGs were object-fit:cover, so once the viewport is wider than the 1440px artboard the browser cropped the top and bottom of the art and the torn edges disappeared (straight edge at 1920). Stretch horizontally instead, the vertical tear stays. */
@media (min-width: 992px) {
  html body #sup-cta-band, html body #p132-quote-deco { object-fit: fill; }
}
@media (min-width: 992px) {
  html body #sup-cta-band#sup-cta-band, html body #p132-quote-deco#p132-quote-deco { object-fit: fill !important; }
}

/* h13 2026-11-04: FAQ page (2290) groups = white torn cards (.ics-torn-card), one 87.5% / min(68rem,87.5vw) container; answers 75ch; /lich-su-tien-trinh/ accordion (122) same container. Header nav: focus ring only on keyboard focus. */
html body :is(#brxe-33vyg5#brxe-33vyg5,#brxe-jiexkj#brxe-jiexkj,#brxe-2q16v3#brxe-2q16v3,#brxe-vq2idu#brxe-vq2idu).faq-in.ics-torn-card { width: 87.5% !important; max-width: min(68rem, 87.5vw) !important; margin-inline: auto !important; padding: var(--sp-l) !important; gap: var(--sp-m); box-sizing: border-box; }
@media (max-width: 600px) { html body :is(#brxe-33vyg5#brxe-33vyg5,#brxe-jiexkj#brxe-jiexkj,#brxe-2q16v3#brxe-2q16v3,#brxe-vq2idu#brxe-vq2idu).faq-in.ics-torn-card { width: 100% !important; max-width: none !important; } }
html body :is(#faq-ve-ics,#faq-nhan-ho-tro,#faq-bao-mat,#faq-tinh-nguyen) { padding-block: var(--sp-m) 0; }
html body #faq-ve-ics { padding-top: var(--sp-2xl); }
html body #faq-tinh-nguyen { padding-bottom: var(--sp-4xl); }
html body :is(#faq-ve-ics,#faq-nhan-ho-tro,#faq-bao-mat,#faq-tinh-nguyen) .brxe-text-basic {}
html body #mv-faq-acc#mv-faq-acc { width: 87.5% !important; max-width: min(68rem, 87.5vw) !important; margin-inline: auto !important; }
html body #mv-faq-acc-el .brxe-text-basic {}
html body #brx-header a:focus:not(:focus-visible) { outline: none; }
html body #brx-header a:focus-visible { outline: 2px solid var(--heading); outline-offset: 2px; }
/* Halftone on yellow pseudo-element bands */
html body .ics-ydot-b::before { background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; }
html body .ics-ydot-a::after { background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; }
/* C1 2026-11-04: unified card parts (global standard). /tin-tuc/ tpl 1095 + /co-gi-moi/ p127 + C2/C3 reuse.
   Parts: thumb .ics-torn-photo>.nw-ci (4/3) | title .nw-tit | badge .nw-chip (1 line, fs-xs) | deadline .nw-deadline (jobs only) | .nw-links a.is-call/.is-map/.is-web (places only). No date, no excerpt, no read-more. Tokens only. */
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-chip.nw-chip { display: block; width: fit-content; max-width: 100%; box-sizing: border-box; margin: 0; padding: var(--sp-2xs) var(--sp-xs); border-radius: var(--radius-pill, 999px); font-family: 'Google Sans Code', monospace; font-size: var(--fs-xs); line-height: var(--lh-xs); letter-spacing: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--pink-200); color: var(--pink-800); }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-meta.nw-meta { margin: 0; font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); color: var(--text-muted); }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-tit.nw-tit { margin: 0; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-deadline.nw-deadline { display: flex; align-items: center; gap: var(--sp-2xs); margin: 0; font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); color: var(--neutral-700); }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-deadline.nw-deadline::before { content: ""; flex: none; width: 1em; height: 1em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 7v5l3 2' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M12 7v5l3 2' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links { display: flex; flex-wrap: wrap; gap: var(--sp-xs); margin: 0; padding: 0; list-style: none; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links > * { margin: 0; padding: 0; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a { position: relative; display: inline-flex; align-items: center; gap: var(--sp-2xs); box-sizing: border-box; min-height: 32px; padding: var(--sp-2xs) var(--sp-s); font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); color: var(--neutral-1000); background: var(--yellow-0); border: 1px solid var(--border-ui); border-radius: var(--radius-pill, 999px); text-decoration: none; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a::after { content: ""; position: absolute; left: 50%; top: 50%; width: max(100%, 44px); height: 44px; transform: translate(-50%, -50%); }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a:hover { box-shadow: inset 0 0 0 1px var(--neutral-1000); }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a:focus-visible { outline: 2px solid var(--neutral-1000); outline-offset: 2px; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a::before { content: ""; flex: none; width: 1em; height: 1em; background: currentColor; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a.is-call::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2A19.8 19.8 0 0 1 11.2 19a19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2A19.8 19.8 0 0 1 11.2 19a19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center / contain no-repeat; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a.is-map::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E") center / contain no-repeat; }
html body :is(#wn-news-grid,#news-grid-home,.nw-card) .nw-links.nw-links a.is-web::before { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 2.5 15.3 0 18M12 3c-2.5 2.7-2.5 15.3 0 18' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.7 2.5 15.3 0 18M12 3c-2.5 2.7-2.5 15.3 0 18' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat; }
/* Halftone pseudo override: Bricks pseudo background shorthands (background: var(--yellow-500)) wipe the dot layer; !important wins */
html body .ics-ydot-b::before, html body .ics-ydot-a::after { background-image: var(--ht-img) !important; background-size: 6px 6px !important; background-position: 0 0, 3px 3px !important; background-repeat: repeat !important; }

/* C5 2026-11-04 owner rule: every card grid 3 / 2 / 1 columns (>=992 / 600-991 / <600), gap var(--sp-m). Appended overrides; earlier 4/3/2/1 rules kept. Featured row cards keep grid-column 1/-1. */
@media (min-width: 992px) { html body #news-grid-home#news-grid-home#news-grid-home, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid, html body #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid, html body #wn-news-grid#wn-news-grid#wn-news-grid, html body #wn-ev-grid#wn-ev-grid#wn-ev-grid, html body #lib-grid#lib-grid#lib-grid, html body #brxe-dcgrid#brxe-dcgrid#brxe-dcgrid, html body #brxe-evgrid#brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid#brxe-jbgrid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid, html body #ab-team-grid#ab-team-grid#ab-team-grid, html body #ab-adv-grid#ab-adv-grid#ab-adv-grid, html body #brxe-lggrd1#brxe-lggrd1#brxe-lggrd1, html body #mv-news-list#mv-news-list#mv-news-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 600px) and (max-width: 991px) { html body #news-grid-home#news-grid-home#news-grid-home, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid, html body #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid, html body #wn-news-grid#wn-news-grid#wn-news-grid, html body #wn-ev-grid#wn-ev-grid#wn-ev-grid, html body #lib-grid#lib-grid#lib-grid, html body #brxe-dcgrid#brxe-dcgrid#brxe-dcgrid, html body #brxe-evgrid#brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid#brxe-jbgrid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid, html body #ab-team-grid#ab-team-grid#ab-team-grid, html body #ab-adv-grid#ab-adv-grid#ab-adv-grid, html body #brxe-lggrd1#brxe-lggrd1#brxe-lggrd1, html body #mv-news-list#mv-news-list#mv-news-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { html body #news-grid-home#news-grid-home#news-grid-home, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid, html body #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid, html body #wn-news-grid#wn-news-grid#wn-news-grid, html body #wn-ev-grid#wn-ev-grid#wn-ev-grid, html body #lib-grid#lib-grid#lib-grid, html body #brxe-dcgrid#brxe-dcgrid#brxe-dcgrid, html body #brxe-evgrid#brxe-evgrid#brxe-evgrid, html body #brxe-jbgrid#brxe-jbgrid#brxe-jbgrid, html body #jn-jobs-grid#jn-jobs-grid#jn-jobs-grid, html body #pl-grid#pl-grid#pl-grid, html body #ab-team-grid#ab-team-grid#ab-team-grid, html body #ab-adv-grid#ab-adv-grid#ab-adv-grid, html body #brxe-lggrd1#brxe-lggrd1#brxe-lggrd1, html body #mv-news-list#mv-news-list#mv-news-list { grid-template-columns: minmax(0, 1fr); } }
/* c3 2026-11-04: /co-gi-moi/ event body padding = /su-kien/ (sp-l), overrides #wn-ev-grid .ev-body (sp-xl). */
html body #wn-ev-grid#wn-ev-grid .ev-body.ev-body { padding: var(--sp-l); }
/* Halftone: band art nested in a stage wrapper (home #hf-band) and the share-band pseudo on #jn-story */
html body section:has([id$="-band"]):not(.ics-bg-black) [id$="-band"] { z-index: -2 !important; }
html body #jn-story { background-image: none !important; isolation: isolate; }
html body #jn-story::before { z-index: -2 !important; }
html body #jn-story::after { content: ""; position: absolute; inset: 0; background-image: var(--ht-img); background-size: 6px 6px; background-position: 0 0, 3px 3px; background-repeat: repeat; pointer-events: none; z-index: -1; }
/* C2 2026-11-04: vertical card grids (documents 1105, library 126, legal 1799, related posts 1170) keep their first card vertical; the featured-row rule above is for the news/about featured card only */
@media (min-width: 768px) {
  html body :is(#brxe-dcgrid, #lib-grid, #brxe-lggrd1, #brxe-rnl001, #brxe-rdl001, #brxe-rbl001, #brxe-rjl001, #brxe-evlp01) > .nw-card:first-child > :first-child { flex: 0 0 auto; width: 100%; max-width: 100%; }
  html body :is(#brxe-dcgrid, #lib-grid, #brxe-lggrd1, #brxe-rnl001, #brxe-rdl001, #brxe-rbl001, #brxe-rjl001, #brxe-evlp01) > .nw-card:first-child > :last-child { flex: 1 1 auto; }
}

/* C5 2026-11-04: #brxe-tbgrid (Tieu su team) 1 column <600; #brxe-tbsec1 scoped rule (2 cols at <=991) outranked the 3/2/1 rule. */
@media (max-width: 599px) { html body #brxe-tbsec1#brxe-tbsec1 #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid { grid-template-columns: minmax(0, 1fr); } }
@media (min-width: 600px) and (max-width: 991px) { html body #brxe-tbsec1#brxe-tbsec1 #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { html body #brxe-tbsec1#brxe-tbsec1 #brxe-tbgrid#brxe-tbgrid#brxe-tbgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* C2 2026-11-04: thumb wrapper of each vertical card spans the card width (related-post cards keep the old body-first order) */
@media (min-width: 768px) {
  html body :is(#brxe-dcgrid, #lib-grid, #brxe-lggrd1, #brxe-rnl001, #brxe-rdl001, #brxe-rbl001, #brxe-rjl001, #brxe-evlp01) > .nw-card > .ics-torn-photo { width: 100%; max-width: 100%; flex: none; }
}
/* C2 2026-11-04: About library row cards (#lib-feat, #lib-wide): thumb is 40% of the card on desktop, full width on phones */
@media (min-width: 768px) {
  html body :is(#lib-feat, #lib-wide).nw-card > .ics-torn-photo { flex: 0 0 40%; width: 40%; max-width: 40%; }
}
/* Home feature band: stage must not form a z-index:1 stacking context, or the dots (section::before z-1) sit under the band. Band z-2 < dots z-1 < cards/text. */
html body #ics-feature-stage { z-index: auto !important; }
/* C2 2026-11-04: role chips (team archive tm-role, About advisor roles) use the nw-chip pill at var(--fs-xs) */
html body #brxe-tbgrid .tm-role.tm-role, html body #adv-1-role.nw-chip, html body #adv-2-role.nw-chip, html body #brxe-tbgrid .nw-chip.nw-chip { display: inline-flex; align-self: flex-start; padding: var(--sp-2xs) var(--sp-s); border-radius: var(--radius-m); font-family: 'Google Sans Code', monospace; font-size: var(--fs-xs); line-height: var(--lh-body); background: var(--blue-200); color: var(--blue-800); white-space: nowrap; }
/* C2 2026-11-04: About library thumbs on phones: full-width 4:3 box; photo fills it */
@media (max-width: 767px) {
  html body :is(#lib-feat-img, #lib-wide-img).ics-torn-photo { display: block; position: relative; width: 100%; max-width: 100%; height: auto; flex: none; aspect-ratio: 4 / 3; }
  html body :is(#lib-feat-photo, #lib-wide-photo).nw-ci { position: relative; left: auto; top: auto; width: 100%; height: 100%; max-width: none; object-fit: cover; }
}
/* Halftone: yellow-filled elements (.ics-ydot) must win over Bricks background shorthands (e.g. #adv-2-well on ve-chung-toi). */
html body .ics-ydot { background-image: var(--ht-img) !important; background-size: 6px 6px !important; background-position: 0 0, 3px 3px !important; background-repeat: repeat !important; }
/* C2 2026-11-04 (owner): badge text WRAPS inside the badge, never overflows or ellipsizes. Later rule wins over earlier single-line badge rules. */
html body .nw-chip.nw-chip, html body .tm-role.tm-role, html body #adv-1-role#adv-1-role, html body #adv-2-role#adv-2-role, html body .ics-chip.ics-chip, html body .dc-chip.dc-chip, html body .jb-tag.jb-tag, html body .ev-badge.ev-badge { display: inline-block !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere !important; word-break: normal !important; max-width: 100% !important; width: auto !important; height: auto !important; min-height: 26px !important; padding: var(--sp-2xs) var(--sp-xs) !important; line-height: var(--lh-xs) !important; border-radius: var(--radius-m) !important; font-size: var(--fs-xs) !important; box-sizing: border-box !important; }
/* C7 2026-11-04: accordion/FAQ type scale (owner: font too huge). Group h2 in .faq-in -> fs-h4; question title -> fs-sub2; answer -> fs-body; section h1 on /thu-vien/ and /lich-su-tien-trinh/ -> fs-h3. Tags unchanged. */
html body .faq-in > h2.ics-h2 { font-size: var(--fs-h4); line-height: var(--lh-h4); }
html body .ics-acc .accordion-title-wrapper > :first-child { font-family: "EB Garamond", Georgia, serif; font-size: var(--fs-sub2); line-height: var(--lh-sub); }
html body .ics-acc .accordion-title-wrapper { padding-block: var(--sp-s); }
html body .ics-acc .accordion-content-wrapper {}
html body .ics-acc .accordion-content-wrapper :is(p, li) { font-size: var(--fs-body); line-height: var(--lh-body); }
html body :is(#lib-faq-title, #lib-policies-title, #mv-faq-h) { font-size: var(--fs-h3); line-height: var(--lh-h3); }
/* C2 2026-11-04 (owner): badges size to their text (not full card width); long text wraps inside the badge */
html body .nw-chip.nw-chip, html body .tm-role.tm-role, html body #adv-1-role#adv-1-role, html body #adv-2-role#adv-2-role, html body .ics-chip.ics-chip, html body .dc-chip.dc-chip, html body .jb-tag.jb-tag, html body .ev-badge.ev-badge { display: inline-block !important; width: fit-content !important; max-width: 100% !important; align-self: flex-start !important; flex: 0 0 auto !important; white-space: normal !important; }

/* c9 2026-11-04: one track token for every animated progress line (lighter grey track so the rainbow stands out) */
html:root { --ics-track: rgba(0, 0, 0, 0.08); }
html body .ics-tl-track, html body .ics-tl-line svg .ics-tl-track { stroke: var(--ics-track) !important; }
/* About timeline: halftone dots as its background layer (its bg was none; Bricks grain ::before stays on top) */
html body section#ab-timeline#ab-timeline { background-image: var(--ht-img) !important; background-size: 6px 6px !important; background-position: 0 0, 3px 3px !important; background-repeat: repeat !important; }

/* C8 2026-11-04: About + Lich su hero (>=992px): the band art is pinned to the hero bottom at its natural 0.391 ratio, so the cream hero background showed as a strip above it (y 108-226 on /ve-chung-toi/). Paint the yellow above the band from y=0 (border-box); the cream below the torn edge is unchanged. */
@media (min-width: 992px) {
  html body section#ab-hero#ab-hero, html body section#mv-hero#mv-hero { background-image: linear-gradient(var(--yellow-500), var(--yellow-500)) !important; background-size: 100% max(0px, calc(100% - 39.1vw)) !important; background-repeat: no-repeat !important; background-position: top center !important; background-origin: border-box !important; background-clip: border-box !important; }
}

/* h14 2026-11-04 owner: accordion arrow -> simple chevron (replaces torn tile). Bricks accordion-nested has no icon control here (get-element-schema), so pure CSS on the .ics-acc root (all pages, loop items included). 10px box + 7px side margins = 24px icon box; row min-height 44px = hit area. Open = rotate(-135deg). */
html body .ics-acc .accordion-title-wrapper::after {
	content: "";
	flex: 0 0 10px;
	width: 10px;
	height: 10px;
	margin: 0 7px;
	background: none;
	border-right: 2px solid var(--neutral-600);
	border-bottom: 2px solid var(--neutral-600);
	opacity: .7;
	transform: rotate(45deg);
	transition: transform 160ms ease, opacity 160ms ease;
}
html body .ics-acc .brx-open > .accordion-title-wrapper::after { transform: rotate(-135deg); }
html body .ics-acc .accordion-title-wrapper:hover::after { opacity: 1; }
html body .ics-acc .accordion-title-wrapper:focus-visible { outline: 2px solid var(--heading); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
	html body .ics-acc .accordion-title-wrapper::after { transition: none; }
}
/* h14b 2026-11-04: open-state override (old .ics-acc .brx-open rule beats the base rule on specificity). */
html body .ics-acc .brx-open > .accordion-title-wrapper::after { background: none; opacity: .7; transform: rotate(-135deg); }
html body .ics-acc .brx-open > .accordion-title-wrapper:hover::after { opacity: 1; }
/* C6 2026-11-04: legacy news blocks on /ve-chung-toi/ (#ab-news-grid) and /lich-su-tien-trinh/ (#mv-news-grid) use the Home #news-grid-home card set: featured row card + 3/2/1 standard cards, no excerpt, no date, no read-more. Tokens only. */
html body #ab-news-grid#ab-news-grid, html body #mv-news-grid#mv-news-grid { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { html body #ab-news-grid#ab-news-grid, html body #mv-news-grid#mv-news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { html body #ab-news-grid#ab-news-grid, html body #mv-news-grid#mv-news-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
html body #ab-news-grid#ab-news-grid > .nw-card, html body #mv-news-grid#mv-news-grid > .nw-card { display: flex; flex-direction: column; min-width: 0; border-radius: var(--radius-m); overflow: hidden; text-decoration: none; color: var(--text); position: relative; background: var(--yellow-0); }
html body #ab-news-grid#ab-news-grid > .nw-card > .ics-torn-photo, html body #mv-news-grid#mv-news-grid > .nw-card > .ics-torn-photo { display: block; position: relative; top: auto; left: auto; width: 100%; height: auto; }
html body #ab-news-grid#ab-news-grid .nw-ci, html body #mv-news-grid#mv-news-grid .nw-ci { aspect-ratio: 4 / 3; height: auto; width: 100%; background: var(--yellow-100); overflow: hidden; }
html body #ab-news-grid#ab-news-grid .nw-ci img, html body #mv-news-grid#mv-news-grid .nw-ci img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body #ab-news-grid#ab-news-grid .nw-cb, html body #mv-news-grid#mv-news-grid .nw-cb { display: flex; flex-direction: column; gap: var(--sp-s); padding: var(--sp-l); flex: 1; justify-content: flex-start; }
html body #ab-news-grid#ab-news-grid .nw-chip, html body #mv-news-grid#mv-news-grid .nw-chip { display: inline-flex; align-self: flex-start; padding: var(--sp-2xs) var(--sp-s); border-radius: var(--radius-m); font-family: 'Google Sans Code', monospace; font-size: var(--fs-small); line-height: var(--lh-body); background: var(--pink-200); color: var(--pink-800); white-space: nowrap; }
html body #ab-news-grid#ab-news-grid .nw-tit, html body #mv-news-grid#mv-news-grid .nw-tit { margin: 0; }
@media (min-width: 768px) {
  html body #ab-news-grid#ab-news-grid > .nw-card:first-child, html body #mv-news-grid#mv-news-grid > .nw-card:first-child { grid-column: 1 / -1; flex-direction: row; min-height: 360px; }
  html body #ab-news-grid#ab-news-grid > .nw-card:first-child > .ics-torn-photo, html body #mv-news-grid#mv-news-grid > .nw-card:first-child > .ics-torn-photo { flex: none; width: 33% !important; align-self: flex-start; }
  html body #ab-news-grid#ab-news-grid > .nw-card:first-child > .nw-cb, html body #mv-news-grid#mv-news-grid > .nw-card:first-child > .nw-cb { justify-content: center; padding: var(--sp-2xl); gap: var(--sp-m); }
  html body #ab-news-grid#ab-news-grid > .nw-card:first-child .nw-tit, html body #mv-news-grid#mv-news-grid > .nw-card:first-child .nw-tit { font-size: var(--fs-h3); line-height: var(--lh-h3); }
}
/* mis-s3 (Tầm nhìn, page 133), owner 2026-11-04: section is a full-screen centred band; the four photo cards ring the centred heading (desktop) and stack into a 2x2 grid under it (tablet/phone). */
html body #mis-s3#mis-s3 { min-height: 100vh; }
@supports (height: 100lvh) { html body #mis-s3#mis-s3 { min-height: 100lvh; } }
@media (min-width: 992px) {
  html body #mis-s3#mis-s3 { height: auto; aspect-ratio: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
  html body #mis-s3-head#mis-s3-head { position: relative; left: auto; top: auto; width: min(50%, 52rem); max-width: none; margin-inline: auto; z-index: 2; }
  html body #mis-card-a#mis-card-a { left: 2.5%; top: 58%; }
  html body #mis-card-b#mis-card-b { left: 76%; top: 6%; }
  html body #mis-card-c#mis-card-c { left: 2.5%; top: 3.5%; }
  html body #mis-card-d#mis-card-d { left: 76%; top: 58%; }
  html body #mis-d-vec7328-w#mis-d-vec7328-w, html body #mis-d-vec7332-w#mis-d-vec7332-w { display: none; }
  html body #mis-d-union2-w#mis-d-union2-w { left: 26.4%; top: 6.7%; width: 10.3%; height: auto; aspect-ratio: 148 / 136; }
  html body #mis-d-vec7329-w#mis-d-vec7329-w { left: 37.5%; top: 3.3%; width: 26.4%; height: auto; aspect-ratio: 484 / 316; }
  html body #mis-d-grp-w#mis-d-grp-w { left: 65.3%; top: 6.7%; width: 9.5%; height: auto; aspect-ratio: 137 / 121; }
  html body #mis-d-illus2-w#mis-d-illus2-w { left: 26.4%; top: 26.7%; width: 6.4%; height: auto; aspect-ratio: 92 / 73; }
  html body #mis-d-vec7331-w#mis-d-vec7331-w { left: 36.1%; top: 77.8%; width: 26.4%; height: auto; aspect-ratio: 588 / 232; }
  html body #mis-d-art41-w#mis-d-art41-w { left: 64.6%; top: 66.7%; width: 9%; height: auto; aspect-ratio: 152 / 152; }
  html body #mis-d-illus1-w#mis-d-illus1-w { left: 66.7%; top: 84.4%; width: 5.5%; height: auto; aspect-ratio: 79 / 96; }
  html body #mis-d-union6-w#mis-d-union6-w { left: 26.4%; top: 82.2%; width: 9.2%; height: auto; aspect-ratio: 132 / 116; }
}
@media (max-width: 991px) {
  html body #mis-s3-cards#mis-s3-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 300px)); justify-content: center; gap: var(--sp-l); width: 100%; }
  html body :is(#mis-d-illus1-w, #mis-d-illus2-w, #mis-d-union2-w, #mis-d-union6-w, #mis-d-art41-w, #mis-d-vec7328-w, #mis-d-vec7329-w, #mis-d-vec7331-w, #mis-d-vec7332-w, #mis-d-grp-w) { display: none; }
}
@media (max-width: 767px) {
  html body #mis-s3-cards#mis-s3-cards { grid-template-columns: repeat(2, 38vw); gap: 4vw; }
}

/* f1 2026-11-04 /ve-chung-toi/hoat-dong/ = Figma 760:7272. Hero: cream dots, left text, 264px. Activity sections: full-bleed torn band, no white card, 728px, text 528 + photo 752, gap 32 (1312). */
html body section#act-hero#act-hero { background-color: var(--cream, #faf6ed) !important; background-image: var(--ht-img) !important; background-size: 6px 6px !important; background-position: 0 0, 3px 3px !important; background-repeat: repeat !important; min-height: 0 !important; height: auto !important; padding-block: 64px !important; text-align: left !important; }
html body #act-hero-in#act-hero-in { width: 87.5% !important; max-width: 1440px !important; margin-inline: auto !important; align-items: flex-start !important; text-align: left !important; gap: 24px !important; }
html body #act-hero-h#act-hero-h { font-size: 48px !important; line-height: 56px !important; font-weight: 500 !important; text-align: left !important; }
html body #act-hero-p#act-hero-p { font-family: "EB Garamond", Georgia, serif !important; font-size: 24px !important; line-height: 28px !important; max-width: none !important; width: 100% !important; text-align: left !important; }
html body section:is(#act-r1,#act-r2,#act-r3,#act-r4) { display: flex !important; flex-direction: column !important; justify-content: center !important; min-height: 728px !important; height: auto !important; padding-block: 0 !important; }
html body :is(#act-r1-in,#act-r2-in,#act-r3-in,#act-r4-in) { background: transparent !important; background-color: transparent !important; box-shadow: none !important; border: 0 !important; transform: none !important; filter: none !important; animation: none !important; padding: 0 !important; margin-inline: auto !important; }
html body :is(#act-r1-h,#act-r2-h,#act-r3-h,#act-r4-h) { border-bottom: 0 !important; padding-bottom: 0 !important; }
@media (min-width: 992px) {
  html body :is(#act-r1-in,#act-r2-in,#act-r3-in,#act-r4-in) { width: 1312px !important; max-width: 100% !important; gap: 32px !important; align-items: center !important; }
  html body :is(#act-r1-fig,#act-r2-fig,#act-r3-fig,#act-r4-fig) { flex: 0 0 752px !important; width: 752px !important; margin: 0 !important; }
  html body :is(#act-r1-txt,#act-r2-txt,#act-r3-txt,#act-r4-txt) { flex: 0 0 528px !important; width: 528px !important; padding: 32px 0 !important; align-self: center !important; justify-content: center !important; }
  html body :is(#act-r1-h,#act-r2-h,#act-r3-h,#act-r4-h) { font-size: 48px !important; line-height: 56px !important; font-weight: 600 !important; }
}
@media (max-width: 991px) {
  html body section#act-hero#act-hero { padding-block: 48px !important; }
  html body #act-hero-h#act-hero-h { font-size: 36px !important; line-height: 44px !important; }
  html body section:is(#act-r1,#act-r2,#act-r3,#act-r4) { min-height: 0 !important; padding-block: 48px !important; }
  html body :is(#act-r1-in,#act-r2-in,#act-r3-in,#act-r4-in) { width: 100% !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; }
  html body :is(#act-r1-fig,#act-r2-fig,#act-r3-fig,#act-r4-fig) { width: 100% !important; flex: none !important; }
  html body :is(#act-r1-txt,#act-r2-txt,#act-r3-txt,#act-r4-txt) { width: auto !important; flex: none !important; padding: 24px 0 !important; align-self: stretch !important; }
  html body :is(#act-r1-h,#act-r2-h,#act-r3-h,#act-r4-h) { font-size: 32px !important; line-height: 40px !important; }
}
/* mis-s3 rev 2: centre the stacked content on every width; heading box beats the 87.5% / 68rem !important rule */
html body #mis-s3#mis-s3 { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
@media (min-width: 992px) {
  html body #mis-s3-head#mis-s3-head { width: min(50%, 52rem) !important; max-width: none !important; }
}

/* f1 2026-11-04 hoat-dong hero: header is fixed (96px) so clear it: top = 88 + 64; container = section content width (1260 at 1440). */
html body section#act-hero#act-hero { padding-top: 152px !important; }
html body #act-hero-in#act-hero-in { width: 100% !important; max-width: 1440px !important; margin-top: 0 !important; margin-bottom: 0 !important; }
/* C6b 2026-11-04: /lich-su-tien-trinh/ news grid keeps the 16px phone gutter (section has no side padding at phone width). */
@media (max-width: 991px) { html body #mv-news-grid#mv-news-grid { box-sizing: border-box; padding-inline: var(--gutter); } }

/* f1 2026-11-04 hoat-dong hero: top-align content (no centring) so hero = 152 + 136 + 64. */
html body section#act-hero#act-hero { justify-content: flex-start !important; align-items: flex-start !important; height: auto !important; }

/* f1 2026-11-04 hoat-dong hero: a 108px yellow border-top (torn band) pushed the text down; cream hero has none. */
html body section#act-hero#act-hero { border-top: 0 !important; }
/* h15 2026-11-04 owner: carets less messy (~50%). Opacity on the caret pseudo only (not text); size/position unchanged. Rest .5; hover / focus-visible / open .9; 120ms; reduced-motion none. */
html body #brx-header .brx-submenu-toggle > button::after { opacity: .5; transition: opacity 120ms ease; }
html body #brx-header .brx-submenu-toggle:hover > button::after,
html body #brx-header .brx-submenu-toggle:has(:focus-visible) > button::after,
html body #brx-header .brx-submenu-toggle > button[aria-expanded="true"]::after { opacity: .9; }
html body #brx-header li.wpml-ls-item-legacy-dropdown > a.wpml-ls-item-toggle::after { opacity: .5; transition: opacity 120ms ease; }
html body #brx-header li.wpml-ls-item-legacy-dropdown:hover > a.wpml-ls-item-toggle::after,
html body #brx-header li.wpml-ls-item-legacy-dropdown:has(:focus-visible) > a.wpml-ls-item-toggle::after,
html body #brx-header a.wpml-ls-item-toggle[aria-expanded="true"]::after { opacity: .9; }
/* h15 accordion chevrons: .7 -> .5 rest; hover/focus/open-hover .9 */
html body .ics-acc .accordion-title-wrapper::after { opacity: .5; }
html body .ics-acc .brx-open > .accordion-title-wrapper::after { opacity: .5; }
html body .ics-acc .accordion-title-wrapper:hover::after { opacity: .9; }
html body .ics-acc .accordion-title-wrapper:focus-visible::after { opacity: .9; }
html body .ics-acc .brx-open > .accordion-title-wrapper:hover::after,
html body .ics-acc .brx-open > .accordion-title-wrapper:focus-visible::after { opacity: .9; }
@media (prefers-reduced-motion: reduce) {
	html body #brx-header .brx-submenu-toggle > button::after,
	html body #brx-header li.wpml-ls-item-legacy-dropdown > a.wpml-ls-item-toggle::after { transition: none; }
}
/* mis-s3 rev 3: the section ::after (90px torn strip) is out of flow on tablet/phone so the stacked content centres exactly; illus2 nudged up so it clears the heading box */
@media (max-width: 991px) {
  html body #mis-s3#mis-s3::after { position: absolute; left: 0; right: 0; bottom: 0; }
}
@media (min-width: 992px) {
  html body #mis-d-illus2-w#mis-d-illus2-w { top: 24%; }
}

/* f1 2026-11-04 hoat-dong bands: Figma torn band art = 1237x568, centred in the 728 section, full-bleed container (left/right per section). */
@media (min-width: 992px) {
  html body div#act-r1-band#act-r1-band#act-r1-band, html body div#act-r2-band#act-r2-band#act-r2-band, html body div#act-r3-band#act-r3-band#act-r3-band, html body div#act-r4-band#act-r4-band#act-r4-band { top: 50% !important; bottom: auto !important; height: 568px !important; transform: translateY(-50%) !important; }
  html body img#act-r1-band-img#act-r1-band-img#act-r1-band-img, html body img#act-r2-band-img#act-r2-band-img#act-r2-band-img, html body img#act-r3-band-img#act-r3-band-img#act-r3-band-img, html body img#act-r4-band-img#act-r4-band-img#act-r4-band-img { width: 1237px !important; height: 568px !important; }
}
/* mis-s3 rev 4: yellow band runs down to the section bottom (the footer torn edge sits over its last 48px), so no cream strip shows under the yellow on desktop */
@media (min-width: 992px) {
  html body #mis-s3-band#mis-s3-band { top: 12.12%; height: 87.88%; }
}

/* Header nav 992-1365 (Hỏi đáp item added 11-04): no item margin or side padding; 6px column gap between items so the last item clears the language switcher. Tokens: --sp-2xs x1.5. */
@media (min-width: 992px) and (max-width: 1365px) {
  html body #brxe-noa29x .bricks-nav-menu > li.menu-item { margin-left: 0; }
  html body #brxe-noa29x .bricks-nav-menu > li > a, html body #brxe-noa29x .bricks-nav-menu > li > .brx-submenu-toggle > a { padding-inline: 0; }
  html body #brxe-noa29x .bricks-nav-menu { column-gap: calc(var(--sp-2xs) * 1.5); }
}
/* mis-s3 rev 5: bottom cards lifted so their floating frames clear the footer torn edge */
@media (min-width: 992px) {
  html body #mis-card-a#mis-card-a { top: 54%; }
  html body #mis-card-d#mis-card-d { top: 54%; }
}

/* Header nav 992-1365 (Hỏi đáp 11-04): 4px column gap (--sp-2xs) overrides the 6px above; last item clears the language switcher at 992. */
@media (min-width: 992px) and (max-width: 1365px) {
  html body #brxe-noa29x .bricks-nav-menu { column-gap: var(--sp-2xs); }
}

/* f3 2026-11-04 /ve-chung-toi/su-menh-tam-nhin/ hero = Figma 760:6361: cream + halftone dots as #act-hero (yellow gradient/band removed by override), 264 content (64 + 56 h1 + 24 + 2x28 para + 64), text left at the 1260 section content edge as #act-hero. */
html body section#mis-intro#mis-intro { background-color: var(--cream, #faf6ed) !important; background-image: var(--ht-img) !important; background-size: 6px 6px !important; background-position: 0 0, 3px 3px !important; background-repeat: repeat !important; background-origin: border-box !important; min-height: 0 !important; height: auto !important; padding-block: 64px !important; padding-inline: calc((100% - min(87.5%, 1440px)) / 2) !important; text-align: left !important; }
html body #mis-intro-in#mis-intro-in { width: 100% !important; max-width: 1440px !important; margin-inline: auto !important; align-items: flex-start !important; text-align: left !important; gap: 24px !important; }
html body #mis-intro-h#mis-intro-h { font-family: "EB Garamond", Georgia, serif !important; font-size: 48px !important; line-height: 56px !important; font-weight: 500 !important; text-align: left !important; }
html body #mis-intro-p#mis-intro-p { font-family: "EB Garamond", Georgia, serif !important; font-size: 24px !important; line-height: 28px !important; font-weight: 400 !important; letter-spacing: -0.12px !important; max-width: none !important; width: 100% !important; text-align: left !important; }
@media (max-width: 991px) {
  html body section#mis-intro#mis-intro { padding-inline: var(--gutter) !important; padding-block: 48px !important; }
  html body #mis-intro-h#mis-intro-h { font-size: 36px !important; line-height: 44px !important; }
}
/* C1 2026-11-04 (owner): featured row card spans 2 of 3 grid columns on desktop (>=992); the 3rd column holds the next standard card, row height = max of both. 600-991 and <600: full width as before. Grids: home, tin-tuc archive, co-gi-moi, about, lich-su-tien-trinh. Thumb 42% of card at span 2. */
@media (min-width: 992px) {
  html body #news-grid-home#news-grid-home#news-grid-home > .nw-card:first-child, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid > .nw-card:first-child, html body #wn-news-grid#wn-news-grid#wn-news-grid > .nw-card:first-child, html body #ab-news-grid#ab-news-grid#ab-news-grid > .nw-card:first-child, html body #mv-news-grid#mv-news-grid#mv-news-grid > .nw-card:first-child { grid-column: span 2; }
  html body #news-grid-home#news-grid-home#news-grid-home > .nw-card:first-child > .ics-torn-photo, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid > .nw-card:first-child > .ics-torn-photo, html body #wn-news-grid#wn-news-grid#wn-news-grid > .nw-card:first-child > .ics-torn-photo, html body #ab-news-grid#ab-news-grid#ab-news-grid > .nw-card:first-child > .ics-torn-photo, html body #mv-news-grid#mv-news-grid#mv-news-grid > .nw-card:first-child > .ics-torn-photo { flex: 0 0 42% !important; width: 42% !important; max-width: 42% !important; }
}
@media (max-width: 991px) {
  html body #news-grid-home#news-grid-home#news-grid-home > .nw-card:first-child, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid > .nw-card:first-child, html body #wn-news-grid#wn-news-grid#wn-news-grid > .nw-card:first-child, html body #ab-news-grid#ab-news-grid#ab-news-grid > .nw-card:first-child, html body #mv-news-grid#mv-news-grid#mv-news-grid > .nw-card:first-child { grid-column: 1 / -1; }
}
/* f3 2026-11-04 junction: hero layered above the yellow band (band1 art has its own cream top, which showed as a cream strip under the dotted hero); band moved 27px down so its torn top starts at the hero bottom = Figma Banner top (hero 264). Desktop only (band1 hidden at tablet/phone). */
html body section#mis-intro#mis-intro { position: relative !important; z-index: 2 !important; }
@media (min-width: 992px) {
  html body #mis-s1 #mis-band1#mis-band1 { top: calc(29.94% + 27px) !important; }
}
/* c3 2026-11-04 nw-card--static (non-link card with inner links: /ho-tro/ and /tim-kiem-su-giup-do/ place cards). Overrides news card rules (first-child row, 4:3 on body, ics-bg-white box). */
html body .nw-card.nw-card--static.nw-card--static { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; min-width: 0; height: 100%; margin: 0; padding: 0; background: transparent; color: var(--text); text-decoration: none; overflow: visible; min-height: 0; flex: none; }
html body .nw-card.nw-card--static.nw-card--static:first-child { flex-direction: column; min-height: 0; grid-column: auto; }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb { display: flex; flex-direction: column; align-items: stretch; gap: var(--sp-s); flex: 1 1 auto; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; height: auto; aspect-ratio: auto; margin: 0; padding: 0 0 var(--sp-l); background: transparent; }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb > .ics-torn-photo { display: block; position: relative; top: auto; left: auto; flex: none; width: 100%; max-width: 100%; height: auto; aspect-ratio: 4 / 3; margin: 0; padding: 0; overflow: hidden; border-radius: 0; background: var(--yellow-100); }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb > .ics-torn-photo > img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb > :not(.ics-torn-photo) { margin-inline: var(--sp-l); min-width: 0; max-width: calc(100% - 2 * var(--sp-l)); }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb > .ics-torn-photo + * { margin-top: var(--sp-m); }
html body .nw-card.nw-card--static.nw-card--static .nw-chip.nw-chip { align-self: flex-start; width: fit-content; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
html body .nw-card.nw-card--static.nw-card--static .nw-tit.nw-tit { margin: 0; overflow-wrap: anywhere; }
html body .nw-card.nw-card--static.nw-card--static .nw-links.nw-links { margin-top: auto; padding-top: var(--sp-s); }
html body .nw-card.nw-card--static.nw-card--static .nw-links.nw-links a { max-width: 100%; }
/* c3 nw-card--static fix: news row-card rules (min-width 768 first-child > first-child 33%/42%) must not size the place card body. */
html body .nw-card.nw-card--static.nw-card--static { height: auto !important; align-self: stretch; }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb { flex: 1 1 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb > .ics-torn-photo { flex: none !important; width: 100% !important; max-width: 100% !important; }
/* C1 2026-11-04 (owner): featured row card at >=992 centres thumb + text vertically inside the row height (no top-stacking). */
@media (min-width: 992px) {
  html body #news-grid-home#news-grid-home#news-grid-home > .nw-card:first-child, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid > .nw-card:first-child, html body #wn-news-grid#wn-news-grid#wn-news-grid > .nw-card:first-child, html body #ab-news-grid#ab-news-grid#ab-news-grid > .nw-card:first-child, html body #mv-news-grid#mv-news-grid#mv-news-grid > .nw-card:first-child { align-items: center; }
  html body #news-grid-home#news-grid-home#news-grid-home > .nw-card:first-child > .ics-torn-photo, html body #brxe-nwgrid#brxe-nwgrid#brxe-nwgrid > .nw-card:first-child > .ics-torn-photo, html body #wn-news-grid#wn-news-grid#wn-news-grid > .nw-card:first-child > .ics-torn-photo, html body #ab-news-grid#ab-news-grid#ab-news-grid > .nw-card:first-child > .ics-torn-photo, html body #mv-news-grid#mv-news-grid#mv-news-grid > .nw-card:first-child > .ics-torn-photo { align-self: center !important; }
}

/* ICS Plex fonts 2026-11-04: body/UI Inter -> IBM Plex Sans, Google Sans Code -> IBM Plex Mono (ics-plex.css). Class-level Bricks overrides, !important required. Rollback: remove this block + mu-plugin ics-plex-fonts.php */
.ics-body,.ics-label,.ics-action,.ics-small,.brxe-text-basic,.brxe-text-link{font-family:var(--ff-sans)!important}
.nw-chip,.ics-eyebrow,.ics-tag,.ics-btn--torn,.ics-link,.bricks-button,.brxe-button,.brxe-filter-submit,.page-numbers,.is-call,.is-map,.is-web,.brxe-query-results-summary,.options-wrapper label,.options-wrapper label a,label:has(input[type=checkbox]),label:has(input[type=checkbox]) a{font-family:var(--ff-mono)!important}
/* c3 nw-card--static: body must not take the 4:3 photo ratio (it is the card's first child, not the photo). */
html body .nw-card.nw-card--static.nw-card--static > .nw-cb.nw-cb { aspect-ratio: auto !important; height: auto !important; }

/* c17 owner order: remove result-count summary (query-results-summary) everywhere */
html body .brxe-query-results-summary { display:none !important; }
html body .brxe-text-basic.ics-body,html body p.ics-body{font-family:var(--ff-sans)!important}
/* ICS Plex fix 2026-11-04: keep EB Garamond heading/sub/quote classes (restore after generic sans rules) */
.ics-display,.ics-h1,.ics-h2,.ics-h3,.ics-h4,.ics-sub,.ics-quote{font-family:"EB Garamond",Georgia,serif!important}
.nw-deadline{font-family:var(--ff-mono)!important}
[id$="-mono"]{font-family:"EB Garamond",Georgia,serif!important}

/* 2026-11-04 OWNER ORDER "2-COL CARD LOOK BAD -- REMOVE THIS IDEA": featured/spanning card removed everywhere. Every card = standard column card, same size, grid 3/2/1 (cdef0c). Appended overrides only; earlier featured rules kept and neutralised here. */
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) { grid-column: auto !important; grid-row: auto !important; flex-direction: column !important; align-items: stretch !important; min-height: 0 !important; }
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) > :first-child { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; align-self: stretch !important; }
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) > :last-child { flex: 1 1 auto !important; min-width: 0 !important; margin-block: 0 !important; }
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) > .nw-cb { justify-content: flex-start !important; align-items: stretch !important; padding: var(--sp-l) !important; gap: var(--sp-s) !important; }
html body #wn-news-grid#wn-news-grid#wn-news-grid > #wn-news-card#wn-news-card:first-child > #wn-news-body#wn-news-body.nw-cb { padding: var(--sp-l) !important; justify-content: flex-start !important; gap: var(--sp-s) !important; }
html body #wn-news-grid#wn-news-grid#wn-news-grid > #wn-news-card#wn-news-card:first-child#wn-news-card { grid-column: auto !important; flex-direction: column !important; }

/* 2026-11-04 OWNER featured-card removal, part 2: first card title = standard card title token (fs-sub2 / lh-sub); no justify override. */
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) .nw-tit { font-size: var(--fs-sub2) !important; line-height: var(--lh-sub) !important; }
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) > .nw-cb { justify-content: normal !important; }
html body #wn-news-grid#wn-news-grid#wn-news-grid > #wn-news-card#wn-news-card:first-child#wn-news-card #wn-news-title { font-size: var(--fs-sub2) !important; line-height: var(--lh-sub) !important; }
/* c4 2026-11-04 place cards = post card (owner order). DOM: .ics-torn-photo is a direct child of .pl-card (same as .nw-card post card), body = .nw-cb. Only the links row differs. Supersedes the c3 nw-card--static block above (padding, bg, overflow, torn-bg, drop-shadow now as post card). */
html body .pl-card.nw-card--static.nw-card--static { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; min-width: 0; height: auto !important; min-height: 0; margin: 0; padding: var(--sp-m); background: var(--yellow-0); color: var(--text); text-decoration: none; border: 0; border-radius: var(--radius-m); box-shadow: none; filter: none; overflow: hidden; flex: none; grid-column: auto; --torn-bg: var(--neutral-50); }
@media (max-width: 478px) { html body .pl-card.nw-card--static.nw-card--static { padding: var(--sp-s); } }
html body .pl-card.nw-card--static.nw-card--static > .ics-torn-photo { display: block; position: relative; top: auto; left: auto; flex: none; width: 100%; max-width: 100%; height: auto; aspect-ratio: 4 / 3; margin: 0; padding: 0; overflow: visible; border-radius: 0; background: var(--yellow-100); }
html body .pl-card.nw-card--static.nw-card--static > .ics-torn-photo > img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
html body .pl-card.nw-card--static.nw-card--static > .nw-cb.nw-cb.nw-cb { display: flex; flex-direction: column; align-items: stretch; gap: var(--sp-s); padding: var(--sp-l); flex: 1 1 auto; box-sizing: border-box; width: 100%; max-width: 100%; min-width: 0; height: auto; aspect-ratio: auto; margin: 0; background: transparent; }
html body .pl-card.nw-card--static.nw-card--static > .nw-cb.nw-cb.nw-cb > * { margin: 0; min-width: 0; max-width: 100%; }
html body .pl-card.nw-card--static.nw-card--static .nw-chip.nw-chip { align-self: flex-start; width: fit-content; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
html body .pl-card.nw-card--static.nw-card--static .nw-tit.nw-tit { margin: 0; overflow-wrap: anywhere; }
html body .pl-card.nw-card--static.nw-card--static .nw-links.nw-links { margin-top: auto; padding-top: var(--sp-s); }
/* ICS Plex fix 2026-11-04: ics-hero.css forces Inter on hero p (specificity 0,2,4 !important); restate with higher specificity */
html body section.ics-hero.ics-hero p{font-family:var(--ff-sans)!important}
html body section.ics-hero.ics-hero p.ics-eyebrow,html body section.ics-hero.ics-hero .ics-tag,html body section.ics-hero.ics-hero .ics-btn--torn,html body section.ics-hero.ics-hero .nw-chip{font-family:var(--ff-mono)!important}

/* 2026-11-04 OWNER featured-card removal, part 3: first card title line-height = standard card (lh-body). */
html body :is(#news-grid-home#news-grid-home#news-grid-home,#brxe-nwgrid#brxe-nwgrid#brxe-nwgrid,#wn-news-grid#wn-news-grid#wn-news-grid,#ab-news-grid#ab-news-grid#ab-news-grid,#mv-news-grid#mv-news-grid#mv-news-grid,#lib-grid#lib-grid#lib-grid,#brxe-dcgrid#brxe-dcgrid#brxe-dcgrid,#brxe-lggrd1#brxe-lggrd1#brxe-lggrd1,#brxe-rnl001#brxe-rnl001#brxe-rnl001,#brxe-rdl001#brxe-rdl001#brxe-rdl001,#brxe-rbl001#brxe-rbl001#brxe-rbl001,#brxe-rjl001#brxe-rjl001#brxe-rjl001,#brxe-evlp01#brxe-evlp01#brxe-evlp01) > .nw-card:first-child:not(.nw-card--static) .nw-tit { line-height: var(--lh-body) !important; }
html body #wn-news-grid#wn-news-grid#wn-news-grid > #wn-news-card#wn-news-card:first-child#wn-news-card #wn-news-title { line-height: var(--lh-body) !important; }

/* 11-04 ICS single (tpl 1170) related cards: photo fills the card (loop cards are :first-child, so the featured-row 33/42% rules must not apply here) */
html body #brxe-rt0001#brxe-rt0001 .nw-card > .ics-torn-photo { width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
/* 11-04 ICS single events (tpl 1170 evrt01 related cards): same fix */
html body #brxe-evrt01#brxe-evrt01 .nw-card > .ics-torn-photo { width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
/* 11-04 ICS single (tpl 1170): related grids use the full content width (87.5%), not the 68rem article column */
html body #brxe-rt0001#brxe-rt0001 #brxe-rzn001#brxe-rzn001, html body #brxe-evrt01#brxe-evrt01 #brxe-evrl01#brxe-evrl01 { max-width: none !important; width: 100% !important; }

/* h14 2026-11-04: FAQ page 2290 at <=600px: h13 rule forced width:100% -> .faq-in.ics-torn-card cards at x=0. Restore 87.5% content width like other pages. */
@media (max-width: 600px) { html body :is(#brxe-33vyg5#brxe-33vyg5,#brxe-jiexkj#brxe-jiexkj,#brxe-2q16v3#brxe-2q16v3,#brxe-vq2idu#brxe-vq2idu).faq-in.ics-torn-card { width: 87.5% !important; max-width: min(68rem, 87.5vw) !important; } }
/* 11-04 ICS single (tpl 1170 rt0001): the section must grow with its content; related cards were overlapping the footer */
html body #brxe-rt0001#brxe-rt0001 { flex: 0 0 auto !important; height: auto !important; }
html body #brxe-rt0001#brxe-rt0001 > .brxe-container { flex: 0 0 auto !important; }
/* ICS Plex fix 2026-11-04: upload field pseudo-element labels resolved to Inter */
html body .form-group.file::before,html body .form-group.file::after{font-family:var(--ff-sans)!important}
/* c4b 2026-11-04: place photo fills the card width like the post card photo (Bricks/ics-torn-photo width rules were shrinking it to fit-content). */
html body .pl-card.nw-card--static.nw-card--static > .ics-torn-photo.ics-torn-photo { width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; flex: none !important; align-self: stretch !important; display: block !important; }
html body .pl-card.nw-card--static.nw-card--static > .ics-torn-photo.ics-torn-photo > img { width: 100% !important; height: 100% !important; max-width: 100% !important; }

/* mis-s3 padding rev 6 (2026-11-04, owner: animated elements must sit inside the yellow band with margin >= float excursion + 16). Desktop only (>=992). Cards: top cards start below the band top torn edge by their own float amplitude + 16px; bottom cards sit 16px above the band bottom (rest position is the lowest point, the float moves up). Decor: floats move up 6px max; stays inside the band. Tokens only. */
@media (min-width: 992px) {
  html body #mis-card-c#mis-card-c { top: calc(12.12% + var(--ics-fl-amp-3) + var(--sp-m)); }
  html body #mis-card-b#mis-card-b { top: calc(12.12% + var(--ics-fl-amp-2) + var(--sp-m)); }
  html body #mis-card-a#mis-card-a { top: auto; bottom: var(--sp-m); }
  html body #mis-card-d#mis-card-d { top: auto; bottom: var(--sp-m); }
  html body #mis-d-union2-w#mis-d-union2-w, html body #mis-d-grp-w#mis-d-grp-w, html body #mis-d-vec7329-w#mis-d-vec7329-w { top: calc(12.12% + var(--sp-m) + var(--sp-xs)); }
  html body #mis-d-vec7331-w#mis-d-vec7331-w { top: auto; bottom: var(--sp-xl); }
}

/* mis-s3 padding rev 6b: dashed line clears the band top by one more --sp-s (min 16px over the float cycle). */
@media (min-width: 992px) {
  html body #mis-d-vec7329-w#mis-d-vec7329-w { top: calc(12.12% + var(--sp-m) + var(--sp-s)); }
}

/* mis-s3 padding rev 6c: dashed line 21% wide so its bottom stays above the Tam nhin label after the top offset. */
@media (min-width: 992px) {
  html body #mis-d-vec7329-w#mis-d-vec7329-w { width: 21%; }
}

/* mis-s3 padding rev 6d: dashed line 4.5% further left so it clears the Tam nhin label. */
@media (min-width: 992px) {
  html body #mis-d-vec7329-w#mis-d-vec7329-w { left: 33%; }
}

/* mis-s3 padding rev 6e: dashed line 29% left (clears the label at rest and at max float). */
@media (min-width: 992px) {
  html body #mis-d-vec7329-w#mis-d-vec7329-w { left: 29%; }
}

/* mis-s3 rev 7 (2026-11-04, owner: Tam nhin hero full screen, magnet-ready): section is at least one viewport high (100svh), header clearance on top, card zoom steps on short or narrow desktop viewports so the two card columns never overlap, bottom elements clear the footer torn edge (64px + --sp-m). Percent offsets unchanged. Tokens only. */
html body #mis-s3#mis-s3 { min-height: 100vh; min-height: 100svh; }
@media (min-width: 992px) {
  html body #mis-s3#mis-s3 { padding-top: calc(96px + var(--sp-m)); }
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 1; }
  html body #mis-card-a#mis-card-a, html body #mis-card-d#mis-card-d { bottom: calc(64px + var(--sp-m)); }
  html body #mis-d-vec7331-w#mis-d-vec7331-w, html body #mis-d-illus1-w#mis-d-illus1-w, html body #mis-d-union6-w#mis-d-union6-w { top: auto; bottom: calc(64px + var(--sp-m)); }
}
@media (min-width: 992px) and (max-height: 1000px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 0.9; }
}
@media (min-width: 992px) and (max-height: 860px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 0.82; }
}
@media (min-width: 992px) and (max-height: 800px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 0.76; }
}
@media (min-width: 992px) and (max-width: 1100px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 0.75; }
}

/* mis-s3 rev 7b (2026-11-04): supersedes the rev 7 zoom steps (zoom reset to 1). Desktop cards keep their 304px width but shrink to 24vw - 16px below 1267px so the right column clears the gutter; photo height follows the viewport height (44vh - 160px, max 255px, min 150px) so the two card columns always fit between the band top and the footer tear. Tokens only. */
@media (min-width: 992px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { zoom: 1; width: min(304px, calc(24vw - 16px)); }
  html body #mis-card-a-img#mis-card-a-img, html body #mis-card-b-img#mis-card-b-img, html body #mis-card-c-img#mis-card-c-img, html body #mis-card-d-img#mis-card-d-img { height: clamp(150px, calc(44vh - 160px), 255px); }
  @supports (height: 100svh) { html body #mis-card-a-img#mis-card-a-img, html body #mis-card-b-img#mis-card-b-img, html body #mis-card-c-img#mis-card-c-img, html body #mis-card-d-img#mis-card-d-img { height: clamp(150px, calc(44svh - 160px), 255px); } }
}

/* mis-s3 rev 7c (2026-11-04): photo frame wrappers (#mis-card-X-media, fixed 255px) follow the same clamp as their img (rev 7b) so the card height tracks the viewport height. Tokens only. */
@media (min-width: 992px) {
  html body #mis-card-a-media#mis-card-a-media, html body #mis-card-b-media#mis-card-b-media, html body #mis-card-c-media#mis-card-c-media, html body #mis-card-d-media#mis-card-d-media { height: clamp(150px, calc(44vh - 160px), 255px); }
  @supports (height: 100svh) { html body #mis-card-a-media#mis-card-a-media, html body #mis-card-b-media#mis-card-b-media, html body #mis-card-c-media#mis-card-c-media, html body #mis-card-d-media#mis-card-d-media { height: clamp(150px, calc(44svh - 160px), 255px); } }
}

/* mis-s3 rev 7d (2026-11-04): photo height factor 44vh -> 40vh (supersedes the 44 values of rev 7b/7c) so the two card columns keep >= 16px gaps at 1440x900, 1366x768 and 1050x900 (caption wraps at 236px width). Tokens only. */
@media (min-width: 992px) {
  html body #mis-card-a-img#mis-card-a-img, html body #mis-card-b-img#mis-card-b-img, html body #mis-card-c-img#mis-card-c-img, html body #mis-card-d-img#mis-card-d-img, html body #mis-card-a-media#mis-card-a-media, html body #mis-card-b-media#mis-card-b-media, html body #mis-card-c-media#mis-card-c-media, html body #mis-card-d-media#mis-card-d-media { height: clamp(150px, calc(40vh - 160px), 255px); }
  @supports (height: 100svh) { html body #mis-card-a-img#mis-card-a-img, html body #mis-card-b-img#mis-card-b-img, html body #mis-card-c-img#mis-card-c-img, html body #mis-card-d-img#mis-card-d-img, html body #mis-card-a-media#mis-card-a-media, html body #mis-card-b-media#mis-card-b-media, html body #mis-card-c-media#mis-card-c-media, html body #mis-card-d-media#mis-card-d-media { height: clamp(150px, calc(40svh - 160px), 255px); } }
}

/* 11-04 ICS single events (tpl 1170) audit: event hero, body grid and related block use the page container (87.5%, max 1440; x=90 at 1440 like article/job/doc/bio/legal H1 and article related grid) */
html body #brxe-evrt01#brxe-evrt01 #brxe-evhw01#brxe-evhw01, html body #brxe-evrt01#brxe-evrt01 #brxe-evgr02#brxe-evgr02, html body #brxe-evrt01#brxe-evrt01 #brxe-evrl01#brxe-evrl01 { width: 87.5% !important; max-width: 1440px !important; margin-left: auto !important; margin-right: auto !important; }
html body #brxe-evrt01#brxe-evrt01 #brxe-evlw01#brxe-evlw01 { width: 100% !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }


/* ===== 11-04 GLOBAL CONTENT WIDTH RULE (owner 2026-11-04, permanent) =====
content wrapper = width 87.5%; max-width var(--global-content-max-width,1440px); margin-inline auto; NO padding-inline (no gutter).
section = padding-inline 0; the 87.5% inner wrapper is the gutter. Component padding (cards, buttons, inputs, bg panels) is NOT in scope.
full-width parent + wrapper with no 87.5% inner: width 87.5% (rule below). New wrapper: class .ics-wrap (uploads/ics-motion/ics-layout.css, mu-plugins/ics-layout.php). Never add padding-inline to a wrapper.
hero sections (ab-hero, sup-hero, ics-hero.css) excluded: owner scope. Selectors = audit 2026-11-04 (scratchpad audit). Doubled id beats earlier !important rules. */
html body section#act-hero#act-hero, html body section#act-r1#act-r1, html body section#act-r2#act-r2, html body section#act-r3#act-r3, html body section#act-r4#act-r4, html body section#brxe-evhero#brxe-evhero, html body section#brxe-lgsec1#brxe-lgsec1, html body section#brxe-lghero#brxe-lghero, html body section#brxe-nwhero#brxe-nwhero, html body section#ics-feature#ics-feature, html body section#jn-hero#jn-hero, html body section#lib-hero#lib-hero, html body section#mis-intro#mis-intro, html body section#mv-hero#mv-hero, html body section#p132-hero#p132-hero, html body section#sup-cta#sup-cta, html body #lib-docs-inner#lib-docs-inner, html body #brxe-nwcol1#brxe-nwcol1, html body #brxe-lgwrap#brxe-lgwrap, html body #brxe-lgcol1#brxe-lgcol1, html body #brxe-evcol1#brxe-evcol1, html body #brxe-dchwrp#brxe-dchwrp, html body #brxe-dccol1#brxe-dccol1, html body #brxe-dzn001#brxe-dzn001, html body #brxe-o88lff#brxe-o88lff, html body #brxe-tbhwrp#brxe-tbhwrp, html body #brxe-tbcol1#brxe-tbcol1, html body #brxe-jbhwrp#brxe-jbhwrp, html body #brxe-jbcol1#brxe-jbcol1, html body #brxe-jbctac#brxe-jbctac, html body #tl-wrap#tl-wrap, html body #news-wrap#news-wrap, html body #contact-wrap#contact-wrap, html body #mv-r1#mv-r1, html body #mv-r2#mv-r2, html body #mv-r3#mv-r3, html body #mv-r4#mv-r4, html body #mv-r5#mv-r5, html body #mv-r6#mv-r6, html body #mv-r7#mv-r7, html body #mv-r8#mv-r8, html body #mv-r9#mv-r9, html body #mv-r10#mv-r10, html body #mv-news-grid#mv-news-grid, html body #ab-adv-grid#ab-adv-grid, html body #ab-team-grid#ab-team-grid, html body #ms-2#ms-2, html body #ms-3#ms-3 { padding-inline: 0 !important; }
html body :is(#mv-r1, #mv-r2, #mv-r3, #mv-r4, #mv-r5, #mv-r6, #mv-r7, #mv-r8, #mv-r9, #mv-r10, #mv-news-grid, #brxe-lgcol1) { width: 87.5% !important; max-width: var(--global-content-max-width, 1440px) !important; margin-inline: auto !important; box-sizing: border-box; }
@media (max-width: 991px) { html body :is(#ms-2, #ms-3) { width: 87.5% !important; max-width: var(--global-content-max-width, 1440px) !important; margin-inline: auto !important; box-sizing: border-box; } }

/* sidebar template 2626: calendar block + post-content headings */
.ics-evcal,.ics-evcal__btns{display:flex;flex-direction:column;gap:var(--sp-xs)}
.ics-evcal__label{margin:0;font-size:var(--fs-sub);font-weight:600}
.ics-evcal__btn{display:block;width:100%;text-align:center;font-size:var(--fs-body);box-sizing:border-box}
#brxe-q0004e h2{font-size:var(--fs-h4);line-height:1.25;margin:var(--sp-l) 0 var(--sp-s)}
#brxe-q0004e h3{font-size:var(--fs-sub);line-height:1.3;margin:var(--sp-m) 0 var(--sp-xs)}
#brxe-q0004e p,#brxe-q0004e li{margin:0 0 var(--sp-s)}
#brxe-q0004e ul,#brxe-q0004e ol{margin:0 0 var(--sp-s);padding-left:1.25em}

/* template 1170 article: centred hero + reading column */
#brxe-ct0001{align-items:center}
#brxe-ct0001 h1,#brxe-ct0001 p,#brxe-ct0001 span{text-align:center}
#brxe-bdy001{max-width:68rem;margin-left:auto !important;margin-right:auto !important;width:100%}
#brxe-img001{width:100% !important;max-width:68rem;margin-left:auto !important;margin-right:auto !important}
#brxe-bdy001 p{text-align:left}

/* mis-s3 rev 8 (2026-11-04, owner: no flat-cut doodles): replaces the earlier rev 8 block. Section overflow-x clip, overflow-y visible. Cap (union2) width clamp(80px, 9vw, 150px), image object-fit contain (cover cropped the artwork). Top-anchored doodles (union2, grp, dashed vec7329) and cards b/c start at band top (12.12%) + 34px, clearing the band top edge by >= 16px at max float (amp <= 18px). Tokens and clamp only. */
@media (min-width: 992px) {
  html body #mis-s3#mis-s3 { overflow-x: clip; overflow-y: visible; }
  html body #mis-d-union2-w#mis-d-union2-w { width: clamp(80px, 9vw, 150px); height: auto; aspect-ratio: 148 / 136; top: calc(12.12% + 34px); }
  html body #mis-d-union2-w#mis-d-union2-w img { object-fit: contain !important; width: 100% !important; height: 100% !important; }
  html body #mis-d-grp-w#mis-d-grp-w { top: calc(12.12% + 34px); }
  html body #mis-d-vec7329-w#mis-d-vec7329-w { top: calc(12.12% + 34px); }
}

/* card photos in loops: explicit box */
.ics-torn-photo img.nw-ci{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}

/* calendar buttons: black torn button, pink hover */
.ics-evcal__btn{display:block;background:#000;color:#fff;padding:var(--sp-xs) var(--sp-m);border-radius:var(--radius-m);text-decoration:none;text-align:center;font-size:var(--fs-body)}
.ics-evcal__btn:hover{background:#ed1d85;color:#fff}

/* QA 2026-11-04: bio related cards (Thanh vien khac) photo 1:1, portrait not cropped */
.brxe-iweavv .brxe-drpo41 > .brxe-v8sa1i{width:100% !important;max-width:100% !important;flex:0 0 auto !important;align-self:stretch !important;height:auto !important;aspect-ratio:1/1 !important;padding:0 !important;}
.brxe-iweavv .brxe-drpo41 > .brxe-v8sa1i img{width:100% !important;height:100% !important;object-fit:cover !important;display:block;}


/* ===== 11-04 GLOBAL CONTENT WIDTH RULE v3 (coordinator edge audit) =====
text-edge fix: these layout wrappers sat at the viewport edge (text within 20px). width 87.5% / auto margins only; no padding change. Excluded by owner: hero heads, templates 1170/2626, #tim-noi-ho-tro, #steps-panel. */
html body #jn-native-form#jn-native-form, html body #jn-contact-row#jn-contact-row, html body #jn-jobs-all#jn-jobs-all, html body #jn-i-addr-l#jn-i-addr-l, html body #jn-i-addr-v#jn-i-addr-v, html body #jn-i-tel-l#jn-i-tel-l, html body #jn-i-tel-v#jn-i-tel-v, html body #jn-i-mail-l#jn-i-mail-l, html body #jn-i-mail-v#jn-i-mail-v, html body #ab-team-head#ab-team-head, html body #adv-1-mono#adv-1-mono, html body #adv-2-mono#adv-2-mono, html body #ms-2-tag#ms-2-tag, html body #ms-3-tag#ms-3-tag, html body #fc-1#fc-1, html body #fc-2#fc-2, html body #fc-3#fc-3, html body #fc-4#fc-4, html body #ics-feature-head#ics-feature-head, html body .brxe-jnjcd1.brxe-jnjcd1, html body .brxe-jnttl1.brxe-jnttl1, html body .brxe-jndln1.brxe-jndln1, html body .brxe-jnchp1.brxe-jnchp1 { width: 87.5% !important; max-width: var(--global-content-max-width, 1440px) !important; margin-inline: auto !important; box-sizing: border-box; }
/* ics p133 mission mobile fix (2026-11-04, owner iPhone report): <=819px bands restored, Tam nhin band + 2-col cards + footer clearance; sticky pink on tap removed (touch only) */
@media (max-width: 819px) {
  html body #mis-r1#mis-r1, html body #mis-r2#mis-r2 { isolation: isolate; }
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band { display: block !important; position: absolute !important; top: 0 !important; bottom: 0 !important; left: -24px !important; right: -24px !important; width: auto !important; height: auto !important; z-index: 0 !important; pointer-events: none !important; }
  html body #mis-r1-band-img#mis-r1-band-img, html body #mis-r2-band-img#mis-r2-band-img { display: block !important; position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; aspect-ratio: auto !important; object-fit: fill !important; transform: none !important; }
  html body #mis-r1-fig#mis-r1-fig, html body #mis-r1-txt#mis-r1-txt, html body #mis-r2-fig#mis-r2-fig, html body #mis-r2-txt#mis-r2-txt { position: relative; z-index: 1; }
  html body #mis-s3#mis-s3 { min-height: 0 !important; height: auto !important; aspect-ratio: auto !important; padding-top: 56px !important; padding-bottom: calc(64px + 48px) !important; overflow: visible !important; position: relative !important; }
  html body #mis-s3-band#mis-s3-band { display: block !important; position: absolute !important; left: 0 !important; right: 0 !important; top: 0 !important; bottom: 0 !important; width: auto !important; height: auto !important; z-index: 0 !important; pointer-events: none !important; background: url(/wp-content/uploads/ics-hero/band-torn-top.svg) center top / 100% 40px no-repeat, url(/wp-content/uploads/ics-hero/band-torn-bottom.svg) center bottom / 100% 40px no-repeat, linear-gradient(#FFEF6B, #FFEF6B) center 40px / 100% calc(100% - 80px) no-repeat !important; }
  html body #mis-s3-band#mis-s3-band::before { content: ''; position: absolute; left: 0; right: 0; top: 40px; bottom: 40px; background-image: radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px); background-size: 6px 6px; }
  html body #mis-s3-band-img#mis-s3-band-img { display: none !important; }
  html body #mis-s3-head#mis-s3-head { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; max-width: none !important; margin-inline: auto !important; z-index: 2 !important; }
  html body #mis-s3-cards#mis-s3-cards { position: relative !important; z-index: 2 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px 16px !important; width: 100% !important; max-width: 341px !important; margin-inline: auto !important; justify-content: stretch !important; }
  html body :is(#mis-card-a,#mis-card-b,#mis-card-c,#mis-card-d)#mis-card-a { position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; zoom: 1 !important; width: auto !important; max-width: none !important; transform: none !important; }
  html body :is(#mis-d-illus1-w,#mis-d-illus2-w,#mis-d-union2-w,#mis-d-union6-w,#mis-d-art41-w,#mis-d-vec7328-w,#mis-d-vec7329-w,#mis-d-vec7331-w,#mis-d-vec7332-w,#mis-d-grp-w)#mis-d-illus1-w { display: none !important; }
}
@media (hover: none), (pointer: coarse) {
  html body .ics-hover-paper:focus-within, html body .ics-hover-paper:active { --hp-on: 0; }
  html body #mis-s3 .ics-card, html body #mis-s3 .ics-card * { -webkit-tap-highlight-color: transparent; }
}
/* ics p133 mobile fix rev 2 (2026-11-04): card and doodle selectors for all four cards (rev 1 applied to card a only) */
@media (max-width: 819px) {
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; zoom: 1 !important; width: auto !important; max-width: none !important; transform: none !important; }
  html body #mis-d-illus1-w#mis-d-illus1-w, html body #mis-d-illus2-w#mis-d-illus2-w, html body #mis-d-union2-w#mis-d-union2-w, html body #mis-d-union6-w#mis-d-union6-w, html body #mis-d-art41-w#mis-d-art41-w, html body #mis-d-vec7328-w#mis-d-vec7328-w, html body #mis-d-vec7329-w#mis-d-vec7329-w, html body #mis-d-vec7331-w#mis-d-vec7331-w, html body #mis-d-vec7332-w#mis-d-vec7332-w, html body #mis-d-grp-w#mis-d-grp-w { display: none !important; }
}
/* ics p133 mobile fix rev 3 (2026-11-04): bands at <=819px had translateY(-50%) from the desktop parallax transform, so they sat above their rows; reset transform, clip overflow */
@media (max-width: 819px) {
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band, html body #mis-s3-band#mis-s3-band { transform: none !important; overflow: hidden !important; }
  html body #mis-r1-band-img#mis-r1-band-img, html body #mis-r2-band-img#mis-r2-band-img { transform: none !important; }
}
/* ics p133 mobile fix rev 4 (2026-11-04): row bands span the full phone width (gutter to gutter) so no hard vertical cut shows at the right edge */
@media (max-width: 819px) {
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band { left: -24px !important; right: auto !important; width: calc(100% + 48px) !important; max-width: none !important; }
  html body #mis-s3-band#mis-s3-band { left: 0 !important; right: 0 !important; width: 100% !important; }
}
/* p133 mis2 rev 1 (2026-11-04, owner: tablet must equal desktop, nothing hidden): Bricks hides #mis-r1-band, #mis-r2-band, #mis-s3-band at <=991px; 820-991 restores them with the phone band geometry (row-spanning torn bands, yellow s3 band) and cards in 2 columns */
@media (min-width: 820px) and (max-width: 991px) {
  html body #mis-r1#mis-r1, html body #mis-r2#mis-r2 { isolation: isolate; }
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band { display: block !important; position: absolute !important; top: 0 !important; bottom: 0 !important; left: -24px !important; right: -24px !important; width: auto !important; height: auto !important; transform: none !important; z-index: 0 !important; pointer-events: none !important; }
  html body #mis-r1-band-img#mis-r1-band-img, html body #mis-r2-band-img#mis-r2-band-img { display: block !important; position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; aspect-ratio: auto !important; object-fit: fill !important; transform: none !important; }
  html body #mis-r1-fig#mis-r1-fig, html body #mis-r1-txt#mis-r1-txt, html body #mis-r2-fig#mis-r2-fig, html body #mis-r2-txt#mis-r2-txt { position: relative; z-index: 1; }
  html body #mis-s3#mis-s3 { height: auto !important; min-height: 0 !important; aspect-ratio: auto !important; padding-top: 56px !important; padding-bottom: calc(64px + 48px) !important; overflow: visible !important; position: relative !important; }
  html body #mis-s3-band#mis-s3-band { display: block !important; position: absolute !important; left: 0 !important; right: 0 !important; top: 0 !important; bottom: 0 !important; width: auto !important; height: auto !important; transform: none !important; z-index: 0 !important; pointer-events: none !important; background: url(/wp-content/uploads/ics-hero/band-torn-top.svg) center top / 100% 40px no-repeat, url(/wp-content/uploads/ics-hero/band-torn-bottom.svg) center bottom / 100% 40px no-repeat, linear-gradient(#FFEF6B, #FFEF6B) center 40px / 100% calc(100% - 80px) no-repeat !important; }
  html body #mis-s3-band#mis-s3-band::before { content: ''; position: absolute; left: 0; right: 0; top: 40px; bottom: 40px; background-image: radial-gradient(circle at center, rgba(40, 30, 10, 0.10) 0 0.9px, transparent 1.2px); background-size: 6px 6px; }
  html body #mis-s3-band-img#mis-s3-band-img { display: none !important; }
  html body #mis-s3-head#mis-s3-head { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; max-width: none !important; z-index: 2 !important; }
  html body #mis-s3-cards#mis-s3-cards { position: relative !important; z-index: 2 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px 24px !important; width: 100% !important; max-width: 620px !important; margin-inline: auto !important; }
  html body #mis-card-a#mis-card-a, html body #mis-card-b#mis-card-b, html body #mis-card-c#mis-card-c, html body #mis-card-d#mis-card-d { position: relative !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; width: auto !important; max-width: none !important; transform: none !important; zoom: 1 !important; }
}
/* p133 mis2 rev 2 (2026-11-04, owner: no empty gap under the hero): wide.css forced #mis-s1 to 801px at >=1440 while its banner is 521px, leaving an empty strip; height follows content */
@media (min-width: 992px) {
  html body.page-id-133 #mis-s1#mis-s1 { height: auto !important; }
}
/* p133 mis2 rev 3 (2026-11-04): tablet row bands full-bleed (viewport edge to edge) so no hard vertical cut shows at the container edge; same idea as phone rev 4 */
@media (min-width: 820px) and (max-width: 991px) {
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band { left: calc(50% - 50vw) !important; right: auto !important; width: 100vw !important; }
}

/* ===== Card hover: no black ring, no stuck tap state (owner 2026-11-04, append-only) =====
   A tap leaves :hover stuck on touch, so the unguarded `.nw-card:hover` 2px black box-shadow (rules above and Bricks page CSS) stayed on the tapped card.
   Card hover feedback = the global pink underlay in ics-card-hover.css, which runs only under (hover: hover) and (pointer: fine). */
html body :is(.nw-card, .ev-card, .sr-card, .pl-card, .jb-card, .dc-card, .tm-card, .lib-card, a.ics-card, article.ics-card):hover { box-shadow: none !important; }
html body :is(.nw-card, .ev-card, .sr-card) .nw-links.nw-links a:hover { box-shadow: none !important; }
/* p133 mis2 rev 4 (2026-11-04): #mis-s3 overflow-x clipped at <=991px (rev 1 phone/tablet blocks had overflow visible, so doodles u3/u4 widened the page); overflow-y stays visible so the band and card shadows are not cut */
@media (max-width: 991px) {
  html body #mis-s3#mis-s3 { overflow-x: clip !important; overflow-y: visible !important; }
}
/* p133 mis2 rev 5 (2026-11-04): tablet row bands had max-width:100% (container width) so the 100vw full-bleed width was capped; max-width none */
@media (min-width: 820px) and (max-width: 991px) {
  html body #mis-r1-band#mis-r1-band, html body #mis-r2-band#mis-r2-band { max-width: none !important; }
}
/* Footer halftone (owner: dots look missing on iPhone): raise the light dot alpha on the black footer from 0.10 to 0.18 at every width; same grid/position as the base rule (line ~333). Append-only. */
html body #brxe-05pfln::before { background-image: radial-gradient(circle at center, rgba(255, 255, 255, 0.18) 0 0.7px, transparent 1px), radial-gradient(circle at center, rgba(255, 255, 255, 0.18) 0 0.7px, transparent 1px); }
/* Menu separators (owner 2026-11-04 iPhone: separator too dark, must follow --border-ui token). Colour only, widths unchanged; scope = mobile menu overlay of header 243 (#brxe-noa29x) incl. sub-menu rows. Append-only. */
html body #brxe-noa29x#brxe-noa29x .bricks-mobile-menu > li, html body #brxe-noa29x#brxe-noa29x .bricks-mobile-menu .sub-menu li { border-bottom-color: var(--border-separator); }

/* 2026-11-04 related loops (.ics-related on 2626 q00058, 1170 rzn001): cards are the first child of their loop item, so the featured row rule (.nw-card:first-child, >=768) must not apply. Column layout = /tin-tuc/ non-featured card. Appended last: same specificity as the original rule, so this wins. */
html body .ics-related .nw-card > :first-child { flex: 0 0 auto; width: 100%; max-width: 100%; align-self: stretch; height: auto; aspect-ratio: 4 / 3; }
html body .ics-related .nw-card > :first-child img { width: 100%; height: 100%; object-fit: cover; }
html body .ics-related .nw-card > :last-child { flex: 0 0 auto; min-width: 0; margin-block: 0; }
/* 2026-11-04 .ics-related reset (v2): the 33%/42% featured row rules tie on specificity, so this one is stronger: :first-child twice + !important. */
html body .ics-related .nw-card:first-child > :first-child { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; align-self: stretch !important; height: auto !important; aspect-ratio: 4 / 3 !important; }
html body .ics-related .nw-card:first-child > :last-child { flex: 0 0 auto !important; min-width: 0 !important; margin-block: 0 !important; }

/* quote-merge p132 (2026-11-05): hero + icon band + quote = ONE yellow halftone section, single torn bottom at quote end. Scoped body.page-id-132 only; append-only. */
body.page-id-132 section.ics-hero.ics-hero{background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important}
body.page-id-132 #p132-icon{background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important}
body.page-id-132 #p132-quote{position:relative!important;isolation:isolate!important;background:transparent!important;height:auto!important;aspect-ratio:auto!important;padding-bottom:var(--sp-4xl)!important}
body.page-id-132 #p132-quote-deco{display:none!important}
body.page-id-132 #p132-quote::before{content:""!important;display:block!important;position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;z-index:-1!important;pointer-events:none!important;background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important;-webkit-mask-image:url("/wp-content/uploads/ics-hero/band-torn-bottom.svg"),linear-gradient(#000,#000)!important;mask-image:url("/wp-content/uploads/ics-hero/band-torn-bottom.svg"),linear-gradient(#000,#000)!important;-webkit-mask-size:100% 140px,100% calc(100% - 140px)!important;mask-size:100% 140px,100% calc(100% - 140px)!important;-webkit-mask-position:0 100%,0 0!important;mask-position:0 100%,0 0!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important}
/* quote-merge p132 (2026-11-05) clearance: quote text clears the torn bottom edge at all widths. */
body.page-id-132 #p132-quote{padding-bottom:calc(var(--sp-3xl) + var(--sp-4xl))!important}

/* 2026-11-04 FAQ spacing rebuild (owner iPhone 390 review): one rhythm. Group card = 87.5% content width (max 1440) centred, not edge to edge; padding clamp(sp-m, 6vw, sp-xl) all sides; group heading margin-bottom sp-m; accordion row min 44px, padding-block sp-s, 1px --border-ui divider; answer padding sp-s top / sp-m bottom, paragraph gap sp-s; section padding-top sp-xl = gap between groups and hero-to-first-card. Scoped to section.brxe-faqtrm (loop root, page 2290). Appended only. */
html body section.brxe-faqtrm { padding-top: var(--sp-xl); padding-bottom: 0; padding-inline: 0; }
html body section.brxe-faqtrm:last-of-type { padding-bottom: var(--sp-4xl); }
html body section.brxe-faqtrm .faq-in.ics-torn-card { width: 87.5%; max-width: var(--global-content-max-width); margin-inline: auto; padding: clamp(var(--sp-m), 6vw, var(--sp-xl)); gap: 0; box-sizing: border-box; }
html body section.brxe-faqtrm .faq-in > h2 { margin: 0 0 var(--sp-m); }
html body section.brxe-faqtrm .faq-in .brxe-faqitm { gap: 0; }
html body section.brxe-faqtrm .faq-in .accordion-title-wrapper { min-height: 44px; padding-block: var(--sp-s); border-bottom: 1px solid var(--border-separator); }
html body section.brxe-faqtrm .faq-in .brxe-faqcnt { gap: var(--sp-s); padding: var(--sp-s) 0 var(--sp-m); }
html body section.brxe-faqtrm .faq-in .brxe-faqans :is(p, ul, ol) { margin: 0; }
html body section.brxe-faqtrm .faq-in .brxe-faqans :is(p, ul, ol) + :is(p, ul, ol) { margin-top: var(--sp-s); }
/* 2026-11-04 FAQ last group: the global main-last-child spacer (tear-guard line 3, sp-5xl + sp-xl) already reserves the space above the footer torn edge, so the last group adds no bottom padding (was sp-4xl stacked on top = ~130px at 390). */
html body section.brxe-faqtrm:last-of-type { padding-bottom: 0; }
/* 2026-11-04 FAQ last group bottom, per breakpoint: >991px no global spacer (tear-guard line 3 is <=991 only) so sp-4xl; <=991px the spacer adds sp-5xl+sp-xl above the footer tear, so the group keeps sp-4xl - sp-xl (visible gap above the torn edge = sp-4xl). */
html body section.brxe-faqtrm:last-of-type { padding-bottom: var(--sp-4xl); }
@media (max-width: 991px) { html body section.brxe-faqtrm:last-of-type { padding-bottom: calc(var(--sp-4xl) - var(--sp-xl)); } }

/* p62 2026-11-05: EN scope copy of body.page-id-132 rules for body.page-id-2902 (append-only) */
body.page-id-2902 section.ics-hero.ics-hero{background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important}
body.page-id-2902 #p132-icon{background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important}
body.page-id-2902 #p132-quote{position:relative!important;isolation:isolate!important;background:transparent!important;height:auto!important;aspect-ratio:auto!important;padding-bottom:var(--sp-4xl)!important}
body.page-id-2902 #p132-quote-deco{display:none!important}
body.page-id-2902 #p132-quote::before{content:""!important;display:block!important;position:absolute!important;top:0!important;right:0!important;bottom:0!important;left:0!important;z-index:-1!important;pointer-events:none!important;background-color:var(--yellow-500)!important;background-image:var(--ht-img)!important;background-size:6px 6px!important;background-position:0 0,3px 3px!important;background-repeat:repeat!important;-webkit-mask-image:url("/wp-content/uploads/ics-hero/band-torn-bottom.svg"),linear-gradient(#000,#000)!important;mask-image:url("/wp-content/uploads/ics-hero/band-torn-bottom.svg"),linear-gradient(#000,#000)!important;-webkit-mask-size:100% 140px,100% calc(100% - 140px)!important;mask-size:100% 140px,100% calc(100% - 140px)!important;-webkit-mask-position:0 100%,0 0!important;mask-position:0 100%,0 0!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important}
body.page-id-2902 #p132-quote{padding-bottom:calc(var(--sp-3xl) + var(--sp-4xl))!important}

/* p69 2026-11-05: EN twin rules (copy of VI page-id/postid rules, append-only, generated by P69). */
@media (min-width: 992px) {
html body.page-id-2903 #mis-s1#mis-s1 { height: auto !important; }
}

/* H88 item 2 (2026-11-05): #ab-news-grid (/ve-chung-toi/ + EN twin) had element width min(1312px, 100% - 2rem): 16px gutters at 390-834 and 64px at 1440, i.e. cards 21.5px/10px outside the 87.5% container edges (pill). Now follows the container rule: 100% section -> 87.5% (max 1440), margin-inline auto, no padding-inline. Tokens only. */
html body #ab-news-grid#ab-news-grid { box-sizing: border-box; width: var(--container-w, 87.5%); max-width: var(--container-max, 1440px); margin-inline: auto; padding-inline: 0; }
/* /H88 item 2 */
