/* FBE Lecturer System — frontend styles (snippet 897).
   Two rendering contexts:
   1) Legacy class-based markup (.fbe-*) — direct shortcode usage.
   2) Atomic/template context — the tag sanitizer strips inner classes, so hosts
      carry global classes (fbe-s-*, fbe-card-*, fbe-hero-*) and inner tags are
      limited to span / strong / em / a / br. Rules below style via host + descendants.
   v3 (2026-09-30): accent switched to Akuntansi UII magenta #CE0058 (light surfaces)
   + #F24E66 (dark surfaces) per accounting.uii.ac.id identity; `a`-targeted rules
   hardened with !important (they tie on specificity with .e-paragraph-base a and lose on order). */

/* ============ 1) LEGACY CLASS-BASED (direct usage) ============ */

/* Section shell */
.fbe-sec { margin: 0 0 2.75rem; }
.fbe-sec:last-child { margin-bottom: 0; }
.fbe-sec-title { font-family: var(--headingFont, Montserrat, sans-serif); font-size: 1.5rem; line-height: 1.3; font-weight: 700; color: var(--color-ink, #1C2733); margin: 0 0 1.25rem; }
.fbe-sec-title::before { content: ""; display: block; width: 44px; height: 3px; background: #CE0058; margin-bottom: .625rem; }

/* Expertise chips */
.fbe-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
a.fbe-chip, span.fbe-chip { display: inline-block; font-family: var(--bodyFont, Roboto, sans-serif); font-size: .8125rem; line-height: 1.2; color: var(--color-primary, #06337B); background: #fff; border: 1px solid var(--color-border, #E1E1E1); border-radius: 999px; padding: .4375rem .875rem; text-decoration: none; }
a.fbe-chip:hover { border-color: var(--color-primary, #06337B); color: var(--color-primary-deep, #041159); }

/* Academic position line */
.fbe-position { display: inline-block; font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #5B6672; }

/* Academic profile link buttons */
.fbe-links { display: flex; flex-wrap: wrap; gap: .5rem; }
a.fbe-link-btn { display: inline-block; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary, #06337B); background: #fff; border: 1px solid var(--color-border, #E1E1E1); border-radius: .375rem; padding: .625rem .9375rem; text-decoration: none; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
a.fbe-link-btn:hover, a.fbe-link-btn:focus { background: var(--color-primary, #06337B); border-color: var(--color-primary, #06337B); color: #fff; }

/* Email link */
a.fbe-email { font-size: .9375rem; color: var(--color-primary, #06337B); text-decoration: none; border-bottom: 1px solid currentColor; }

/* Lead & body text */
.fbe-lead { font-size: 1.0625rem; line-height: 1.7; color: var(--color-ink, #1C2733); margin: 0 0 1rem; }
.fbe-body { font-size: 1rem; line-height: 1.7; color: #46505C; margin: 0; }

/* Education timeline */
.fbe-timeline { list-style: none; margin: 0; padding: 0 0 0 1.375rem; border-left: 2px solid var(--prf-line, #DEE4EA); }
.fbe-timeline > li { position: relative; padding: 0 0 1.5rem .25rem; }
.fbe-timeline > li:last-child { padding-bottom: .25rem; }
.fbe-timeline > li::before { content: ""; position: absolute; left: -1.75rem; top: .3rem; width: .625rem; height: .625rem; border-radius: 50%; background: #CE0058; border: 2px solid #fff; box-shadow: 0 0 0 2px var(--prf-line, #DEE4EA); }
.fbe-t-title { font-family: var(--headingFont, Montserrat, sans-serif); font-size: 1.0625rem; font-weight: 700; color: var(--color-ink, #1C2733); margin: 0 0 .25rem; }
.fbe-t-meta { font-size: .875rem; color: #46505C; margin: 0; }
.fbe-t-desc { font-size: .9375rem; color: #46505C; margin: .375rem 0 0; }

/* Stacked rows (certifications, courses, teaching) */
.fbe-rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--color-border, #E1E1E1); }
.fbe-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; padding: .875rem 0; border-bottom: 1px solid var(--color-border, #E1E1E1); }
.fbe-row-title { font-weight: 600; color: var(--color-ink, #1C2733); }
.fbe-row-meta { font-size: .875rem; color: #5B6672; }
.fbe-row-desc { flex-basis: 100%; font-size: .875rem; color: #5B6672; }
a.fbe-row-link { margin-left: auto; font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-primary, #06337B); text-decoration: none; border-bottom: 1px solid #CE0058; padding-bottom: 1px; }
a.fbe-row-link:hover { color: var(--color-primary-deep, #041159); }

/* Publications */
.fbe-pub-group { margin-bottom: 1.75rem; }
.fbe-pub-group:last-child { margin-bottom: 0; }
.fbe-pub-group > h3 { font-family: var(--bodyFont, Roboto, sans-serif); font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #5B6672; margin: 0 0 .75rem; }
.fbe-pubs { list-style: none; margin: 0; padding: 0; }
.fbe-pub { padding: .9375rem 0; border-bottom: 1px solid var(--color-border, #E1E1E1); }
.fbe-pub:first-child { border-top: 1px solid var(--color-border, #E1E1E1); }
.fbe-pub.is-featured { border-left: 3px solid #CE0058; padding-left: .875rem; }
.fbe-pub-title { display: block; font-size: 1rem; font-weight: 600; line-height: 1.5; color: var(--color-ink, #1C2733); margin-bottom: .25rem; }
.fbe-pub-meta { display: block; font-size: .875rem; color: #5B6672; }
.fbe-pub-links { display: inline-block; margin-top: .375rem; }
a.fbe-pub-link { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-primary, #06337B); text-decoration: none; border-bottom: 1px solid #CE0058; }
.fbe-pub-doi { font-size: .8125rem; color: #5B6672; }

/* Contact */
.fbe-contact-row { display: grid; gap: .25rem; padding: .625rem 0; border-bottom: 1px solid var(--color-border, #E1E1E1); }
.fbe-contact-row:last-child { border-bottom: 0; }
.fbe-contact-label { font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #5B6672; }
.fbe-contact-value { font-size: 1rem; color: var(--color-ink, #1C2733); text-decoration: none; }
a.fbe-contact-value:hover { color: var(--color-primary, #06337B); }

/* Related lecturers */
.fbe-related { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: var(--gridGap, 1.25rem); }
a.fbe-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--color-border, #E1E1E1); border-radius: .5rem; overflow: hidden; text-decoration: none; transition: border-color .15s ease; }
a.fbe-card:hover { border-color: var(--color-primary, #06337B); }
.fbe-card img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.fbe-card-body { display: flex; flex-direction: column; gap: .5rem; padding: .875rem 1rem 1.125rem; }
.fbe-card-name { font-family: var(--headingFont, Montserrat, sans-serif); font-size: .9375rem; font-weight: 700; line-height: 1.4; color: var(--color-ink, #1C2733); }
.fbe-card .fbe-chip { font-size: .6875rem; padding: .375rem .625rem; }
.fbe-related-cta { margin: 1.25rem 0 0; }

/* ============ 2) ATOMIC / TEMPLATE HOST CONTEXT ============ */
/* Hosts are p/span widgets carrying global classes; inner markup is
   restricted to span / strong / em / a / br. All layout via block display.
   `a`-targeted rules carry !important: they tie on specificity with
   `.elementor .e-paragraph-base a` / `.e-heading-base a` and lose on order. */

/* Hero position */
.fbe-hero-pos span { display: inline-block; font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #5B6672; }

/* Google Scholar h-index meta line — [fbe_h_index] host carries global class
   `fbe-hindex`; hidden entirely when the value is empty. */
.fbe-hindex span { display: inline-block; font-family: var(--bodyFont, Roboto, sans-serif) !important; font-size: .8125rem !important; line-height: 1.45 !important; color: #5B6672 !important; }
.fbe-hindex span b { font-weight: 700 !important; color: var(--color-ink, #1C2733) !important; }
.fbe-hindex:not(:has(*)) { display: none !important; }

/* Scopus h-index meta line — [fbe_scopus_h_index] host carries global class
   `fbe-scopus`; hidden entirely when the value is empty. */
.fbe-scopus span { display: inline-block; font-family: var(--bodyFont, Roboto, sans-serif) !important; font-size: .8125rem !important; line-height: 1.45 !important; color: #5B6672 !important; }
.fbe-scopus span b { font-weight: 700 !important; color: var(--color-ink, #1C2733) !important; }
.fbe-scopus:not(:has(*)) { display: none !important; }

/* Gelar akademik subtitle — [fbe_gelar] host carries global class `fbe-gelar`;
   the shortcode wraps the text in a single span. Card context = smaller/muted
   (rule below overrides the hero/base rule by specificity). A host with no
   children means the gelar is empty — hide it (no empty gap in the flex gap rhythm). */
.fbe-gelar span { display: inline-block; font-family: var(--bodyFont, Roboto, sans-serif) !important; font-size: 1.0625rem !important; line-height: 1.45 !important; font-weight: 500 !important; color: #46505C !important; }
.fbe-card-body .fbe-gelar span { font-size: .75rem !important; line-height: 1.3 !important; font-weight: 400 !important; color: #5B6672 !important; }
.fbe-gelar:not(:has(*)) { display: none !important; }

/* Chips rows */
.fbe-hero-chips, .fbe-card-chips, .fbe-s-expertise { display: flex !important; flex-wrap: wrap !important; gap: .5rem !important; }
.fbe-hero-chips a, .fbe-card-chips a, .fbe-s-expertise a { display: inline-block !important; font-family: var(--bodyFont, Roboto, sans-serif) !important; font-size: .8125rem !important; line-height: 1.2 !important; color: var(--color-primary, #06337B) !important; background: #fff !important; border: 1px solid var(--color-border, #E1E1E1) !important; border-radius: 999px !important; padding: .4375rem .875rem !important; text-decoration: none !important; }
.fbe-hero-chips a:hover, .fbe-card-chips a:hover, .fbe-s-expertise a:hover { border-color: var(--color-primary, #06337B) !important; color: var(--color-primary-deep, #041159) !important; }
.fbe-card-chips a { font-size: .6875rem !important; padding: .375rem .625rem !important; }

/* Hero academic links */
.fbe-hero-links { display: flex !important; flex-wrap: wrap !important; gap: .5rem !important; }
.fbe-hero-links a { display: inline-block !important; font-size: .75rem !important; font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: var(--color-primary, #06337B) !important; background: #fff !important; border: 1px solid var(--color-border, #E1E1E1) !important; border-radius: .375rem !important; padding: .625rem .9375rem !important; text-decoration: none !important; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.fbe-hero-links a:hover, .fbe-hero-links a:focus { background: var(--color-primary, #06337B) !important; border-color: var(--color-primary, #06337B) !important; color: #fff !important; }
.fbe-hero-links a[href^="mailto:"] { border-color: var(--color-primary, #06337B) !important; }

/* About */
.fbe-s-about span { display: block; font-size: 1.0625rem; line-height: 1.7; color: var(--color-ink, #1C2733); }
.fbe-s-about span + span { margin-top: 1rem; font-size: 1rem; color: #46505C; }

/* Education timeline */
.fbe-s-edu { border-left: 2px solid var(--prf-line, #DEE4EA); padding-left: 1.375rem; }
.fbe-s-edu strong { position: relative; display: block; font-family: var(--headingFont, Montserrat, sans-serif); font-size: 1.0625rem; font-weight: 700; color: var(--color-ink, #1C2733); margin-top: 1.75rem; }
.fbe-s-edu strong:first-child { margin-top: 0; }
.fbe-s-edu strong::before { content: ""; position: absolute; left: -1.75rem; top: .35rem; width: .625rem; height: .625rem; border-radius: 50%; background: #CE0058; border: 2px solid #fff; box-shadow: 0 0 0 2px var(--prf-line, #DEE4EA); }
.fbe-s-edu span { display: block; font-size: .875rem; color: #46505C; margin-top: .25rem; line-height: 1.6; }
.fbe-s-edu span + span { font-size: .9375rem; }

/* Stacked rows: certifications / courses / teaching */
.fbe-s-certs strong, .fbe-s-courses strong, .fbe-s-teach strong { display: block; font-family: var(--bodyFont, Roboto, sans-serif); font-size: 1rem; font-weight: 600; color: var(--color-ink, #1C2733); border-top: 1px solid var(--color-border, #E1E1E1); padding-top: .9375rem; margin-top: .9375rem; }
.fbe-s-certs strong:first-child, .fbe-s-courses strong:first-child, .fbe-s-teach strong:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.fbe-s-certs span, .fbe-s-courses span, .fbe-s-teach span { display: block; font-size: .875rem; color: #5B6672; margin-top: .25rem; line-height: 1.6; }
.fbe-s-certs a, .fbe-s-courses a { display: inline-block !important; margin-top: .5rem !important; font-size: .75rem !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--color-primary, #06337B) !important; text-decoration: none !important; border-bottom: 1px solid #CE0058 !important; padding-bottom: 1px !important; }

/* Publications */
.fbe-s-pubs em { display: block; font-style: normal; font-family: var(--bodyFont, Roboto, sans-serif); font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #5B6672; margin: 2rem 0 .25rem; }
.fbe-s-pubs em:first-child { margin-top: 0; }
.fbe-s-pubs strong { display: block; font-size: 1rem; font-weight: 600; line-height: 1.5; color: var(--color-ink, #1C2733); border-top: 1px solid var(--color-border, #E1E1E1); padding-top: .9375rem; margin-top: .9375rem; }
.fbe-s-pubs em + strong { border-top: 0; padding-top: 0; margin-top: 0; }
.fbe-s-pubs span { display: block; font-size: .875rem; color: #5B6672; margin-top: .25rem; }
.fbe-s-pubs a { display: inline-block !important; margin-top: .5rem !important; font-size: .75rem !important; font-weight: 600 !important; letter-spacing: .06em !important; text-transform: uppercase !important; color: var(--color-primary, #06337B) !important; text-decoration: none !important; border-bottom: 1px solid #CE0058 !important; padding-bottom: 1px !important; }

/* Contact */
.fbe-s-contact strong { display: block; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #5B6672; margin-top: 1.125rem; }
.fbe-s-contact strong:first-child { margin-top: 0; }
.fbe-s-contact a, .fbe-s-contact span { display: block !important; font-size: 1rem !important; color: var(--color-ink, #1C2733) !important; text-decoration: none !important; margin-top: .25rem !important; }
.fbe-s-contact a:hover { color: var(--color-primary, #06337B) !important; }

/* Lecturer card (atomic loop item) */
.fbe-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
.fbe-card { background: #fff; border: 1px solid var(--color-border, #E1E1E1); border-radius: .5rem; overflow: hidden; }
.fbe-card-img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.fbe-card-body { display: flex; flex-direction: column; gap: .5rem; padding: .875rem 1rem 1.125rem; flex: 1 1 auto; }
.fbe-card-name { margin: 0; }
.fbe-card-name a { font-family: var(--headingFont, Montserrat) !important; font-size: .9375rem !important; line-height: 1.4 !important; font-weight: 700 !important; color: #1C2733 !important; text-decoration: none !important; }
.fbe-card-name a:hover { color: #06337B !important; }
.fbe-card-email a { font-size: .8125rem !important; color: var(--color-primary, #06337B) !important; text-decoration: none !important; border-bottom: 1px solid currentColor !important; }
.fbe-card-cta { margin-top: auto; }
.fbe-card-cta a { display: inline-block; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--color-primary, #06337B); text-decoration: none; border-bottom: 1px solid #CE0058; padding-bottom: 2px; }
a.fbe-card-cta { font-size: .75rem !important; font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: #06337B !important; text-decoration: none !important; border-bottom: 1px solid #CE0058 !important; padding-bottom: 2px !important; }
a.fbe-card-cta:hover { color: #041159 !important; }

/* Single hero portrait — cap even if the per-document atomic CSS is missing.
   border-radius needs !important: `.elementor .e-default-img` resets radius to 0 at (0,2,0). */
.fbe-hero-photo { width: 100%; max-width: 24rem !important; flex: 0 0 auto !important; aspect-ratio: 4 / 5; object-fit: cover; display: block; border-radius: .5rem !important; }

/* ============ SINGLE TEMPLATE RHYTHM (tighter sections) ============ */
/* The section stack is the .e-con that directly contains .fbe-sec-block children
   (its element styles: flex column, gap 3.25rem — too airy).
   Band containers (hero / white wrapper / related) plus their inner display bands
   each carried 4rem block paddings that stack up to ~128px voids — normalized to
   the same 2.5rem rhythm as the section stack. Structural selectors are used
   (not auto-generated e-xxxx classes, which Elementor regenerates on re-save):
   - `> .e-con`        = the three root bands (hero grey, white content, related grey)
   - `> .e-con > .e-con` = their inner bands (hero flex row, section stack, related inner)
   The section blocks themselves sit one level deeper, so they keep zero padding. */
.elementor-1066 .e-con:has(> .fbe-sec-block) { row-gap: 2rem !important; }
.elementor-1066 > .e-con { padding-block-start: 2.5rem !important; padding-block-end: 2.5rem !important; }
.elementor-1066 > .e-con > .e-con { padding-block-start: 2.5rem !important; padding-block-end: 2.5rem !important; }

/* ============ DIRECTORY PAGE RHYTHM (all lecturer directory pages) ============ */
/* Pages: 1042 "3121 Dosen Akuntansi" · 1197 "3111 Dosen Manajemen" ·
   1332 "3131 Dosen Ilmu Ekonomi" · 1381 "3141 Dosen Sarjana Terapan".
   Same anatomy on every directory, bad stacking if left alone: the navy hero
   (72/64px) and the grey grid band (56/80px) each sit above an inner chain that
   adds two more 64px paddings (e-collection-loop wrapper + loop layout) — voids
   of 184px above the first card row and 208px below the last. Normalize: root
   bands keep the 2.5rem rhythm; the loop wrapper chain drops its block padding
   entirely.
   Depth note: `.elementor-XXXX > .e-con` = {navy hero, grey band}; depth 2 =
   {hero inner, loop wrapper}; depth 3 = {loop layout} — cards sit deeper. */
.elementor-1042 > .e-con,
.elementor-1197 > .e-con,
.elementor-1332 > .e-con,
.elementor-1381 > .e-con { padding-block-start: 2.5rem !important; padding-block-end: 2.5rem !important; }
.elementor-1042 > .e-con > .e-con,
.elementor-1197 > .e-con > .e-con,
.elementor-1332 > .e-con > .e-con,
.elementor-1381 > .e-con > .e-con { padding-block-start: 0 !important; padding-block-end: 0 !important; }
.elementor-1042 > .e-con > .e-con > .e-con,
.elementor-1197 > .e-con > .e-con > .e-con,
.elementor-1332 > .e-con > .e-con > .e-con,
.elementor-1381 > .e-con > .e-con > .e-con { padding-block-start: 0 !important; padding-block-end: 0 !important; }

/* ============ LOOP ITEM PADDING (lecturer loops) ============ */
/* Every e-collection-loop-item wrapper renders with a 64px/16px padding (not
   stored in the page data — injected by the loop widget; source rule not found
   in any compiled css). It stacks with the grid gap: measured row gutters
   148px / side gutters 52px on the directory, 52px horizontal on the single's
   related row. Zero it — directory grids matched via our .fbe-grid layout
   class (covers future prodi pages too), plus the single template's related. */
.e-collection-loop-layout-base.fbe-grid > .e-con { padding: 0 !important; }
.elementor-1066 .e-collection-loop-layout-base > .e-con { padding: 0 !important; }

/* Responsive */
@media (max-width: 1200px) {
	.fbe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
	.fbe-related { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
}
@media (max-width: 900px) {
	.fbe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.fbe-hero-photo { max-width: 20rem !important; }
}
@media (max-width: 767px) {
	.fbe-sec-title { font-size: 1.25rem; }
	.fbe-timeline { padding-left: 1.125rem; }
	.fbe-related { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1rem; }
	a.fbe-row-link { margin-left: 0; }
	.fbe-s-edu { padding-left: 1.125rem; }
	.fbe-s-edu strong::before { left: -1.5rem; }
}
@media (max-width: 600px) {
	.fbe-grid { grid-template-columns: 1fr; }
}

/* ============ 3) EMPTY-SECTION HIDING (single template) ============ */
/* A shortcode host with zero element children means the section had no data:
   hide the whole wrapper (heading included), per the empty-field rule.
   NOTE: nested :has() (e.g. :has(.x:not(:has(*)))) is INVALID CSS — browsers drop
   the entire rule. Use a single-level :has inside :not() instead. */
.fbe-sec-block:not(:has(.fbe-sec-host *)) { display: none !important; }