/* Global CSS Reset */
*,
*::before,
*::after { box-sizing: border-box; }
html { margin: 0; padding: 0; }
body { margin: 0; padding: 0; }

/* Page: home */
/* ==========================================================================
   PUB-NAV-1018 — Neobrutalism Navbar
   ========================================================================== */

.pub_nav_1018_rootWrapper {
    position: relative;
    width: 100%;
    background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
    color: var(--text, #18181b);
    font-family: var(--font-body, system-ui, -apple-system, sans-serif);
    padding-top: var(--pt, 16px);
    padding-bottom: var(--pb, 16px);
    transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* ── Main Navbar Container ──────────────────────────────────────────────── */
.pub_nav_1018_navbar {
    position: var(--navbar-position, sticky);
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-navbar, 100); /* Layer navbar above standard page content */
}

.pub_nav_1018_container {
    max-width: var(--max-w, 1240px);
    height: var(--nav-h, 76px);
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-lg, 12px);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ── Brand Logo ─────────────────────────────────────────────────────────── */
.pub_nav_1018_brandWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_logoBlock {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 10px);
    text-decoration: none;
    color: var(--text, #18181b);
}

.pub_nav_1018_logoMark {
    font-size: var(--fs-2xl, 24px);
    color: var(--accent, #ff5277);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub_nav_1018_logoWord {
    font-family: var(--font-heading, var(--font-body, system-ui, sans-serif));
    font-weight: 800;
    font-size: var(--fs-xl, 20px);
    letter-spacing: var(--tracking, -0.02em);
    color: var(--text, #18181b);
}

.pub_nav_1018_logoImage {
    max-height: 42px;
    object-fit: contain;
}

/* ── Desktop Navigation Links ───────────────────────────────────────────── */
.pub_nav_1018_navLinksWrap {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
}

.pub_nav_1018_navItem {
    position: relative;
}

.pub_nav_1018_navLink {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    font-weight: 700;
    font-size: var(--fs-md, 15px);
    color: var(--text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-lg, 8px);
    border: 2px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pub_nav_1018_navLink:hover {
    background-color: var(--bg, #fdf4ff);
    border-color: var(--border, #000000);
    transform: translateY(-2px);
}

/* ── Dropdown Sub-menu ─────────────────────────────────────────────────── */
.pub_nav_1018_dropdownMenu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-md, 10px);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: var(--z-dropdown, 110); /* Layer dropdown above navbar container */
}

.pub_nav_1018_dropdownMenu[data-open="true"],
.pub_nav_1018_navItem:hover .pub_nav_1018_dropdownMenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pub_nav_1018_dropdownItem {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
    padding: 10px 12px;
    text-decoration: none;
    color: var(--text, #18181b);
    border-radius: var(--radius-md, 6px);
    transition: background-color 0.15s ease;
}

.pub_nav_1018_dropdownItem:hover {
    background-color: var(--bg, #fdf4ff);
}

.pub_nav_1018_subIcon {
    font-size: var(--fs-xl, 20px);
    color: var(--accent, #ff5277);
}

.pub_nav_1018_subContent {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_subTitle {
    font-weight: 700;
    font-size: var(--fs-sm, 14px);
}

.pub_nav_1018_subDesc {
    font-size: var(--fs-xs, 12px);
    color: var(--text-muted, #71717a);
}

/* ── CTA Button & Actions ───────────────────────────────────────────────── */
.pub_nav_1018_actionsWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_ctaBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: var(--cta-bg, var(--accent, #ff5277));
    color: var(--cta-text, #ffffff);
    font-weight: 800;
    font-size: var(--fs-sm, 14px);
    text-decoration: none;
    border: 2px solid var(--border, #000000);

    border-radius: var(--radius-lg, 8px);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
}

.pub_nav_1018_ctaBtn:hover {
    transform: translate(-2px, -2px);

}

.pub_nav_1018_ctaBtn:active {
    transform: translate(1px, 1px);

}

/* ── Hamburger Trigger ─────────────────────────────────────────────────── */
.pub_nav_1018_hamburgerBtn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-lg, 8px);
    font-size: var(--fs-2xl, 22px);
    cursor: pointer;
    box-shadow: 2px 2px 0px var(--border, #000000);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_nav_1018_hamburgerBtn:hover {
    transform: translate(-1px, -1px);
    box-shadow: 3px 3px 0px var(--border, #000000);
}

.pub_nav_1018_hamburgerBtn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0px var(--border, #000000);
}

/* ── Mobile Drawer ─────────────────────────────────────────────────────── */
.pub_nav_1018_mobileDrawer {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background-color: var(--nav-bg, #ffffff);
    border-left: 3px solid var(--border, #000000);

    z-index: var(--z-drawer, 200); /* Elevate mobile drawer over page overlay */
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pub_nav_1018_mobileDrawer[data-open="true"] {
    transform: translateX(0);
}

.pub_nav_1018_drawerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid var(--border, #000000);
}

.pub_nav_1018_closeBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-md, 6px);
    font-size: var(--fs-xl, 20px);
    cursor: pointer;
}

.pub_nav_1018_drawerBody {
    padding: var(--space-card-padding, 24px);
    display: flex;
    flex-direction: column;
gap: var(--space-gap, 24px);
    overflow-y: auto;
}

.pub_nav_1018_mobileLinks {
    display: flex;
    flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_mobileNavItem {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_mobileNavLink {
    font-weight: 800;
    font-size: var(--fs-lg, 18px);
    color: var(--text, #18181b);
    text-decoration: none;
    padding: 8px 0;
}

.pub_nav_1018_mobileSubList {
    display: flex;
    flex-direction: column;
    gap: var(--space-content-gap, 6px);
    padding-left: 14px;
    border-left: 2px solid var(--border, #000000);
    margin-top: 4px;
}

.pub_nav_1018_mobileSubLink {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
    font-size: var(--fs-sm, 14px);
    color: var(--text-muted, #71717a);
    text-decoration: none;
    padding: 4px 0;
}

.pub_nav_1018_mobileCtaWrap {
    margin-top: auto;
    display: flex;
}

.pub_nav_1018_mobileCtaWrap .pub_nav_1018_ctaBtn {
    width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.pub_nav_1018_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--overlay-bg, rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(4px);
    z-index: var(--z-overlay, 150); /* Layer backdrop behind drawer and above content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pub_nav_1018_overlay[data-open="true"] {
    opacity: 1;
    visibility: visible;
}

/* ── Page Builder Mode Guard Overrides ──────────────────────────────────── */
.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_navbar {
    z-index: var(--z-builder-nav, 10); /* Guard z-index in page builder canvas mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_dropdownMenu {
    z-index: var(--z-builder-dropdown, 15); /* Guard z-index for dropdown in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_mobileDrawer {
    z-index: var(--z-builder-drawer, 20); /* Guard z-index for drawer in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_overlay {
    z-index: var(--z-builder-overlay, 15); /* Guard z-index for overlay in page builder mode */
}

/* ── Responsive Layout ──────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .pub_nav_1018_navLinksWrap {
        display: none;
    }

    .pub_nav_1018_actionsWrap .pub_nav_1018_ctaBtn {
        display: none;
    }

    .pub_nav_1018_hamburgerBtn {
        display: flex;
    }
}


/* ==========================================================================
   PUB-HERO-1018 — Bento Introduction Hero (Neobrutalism Theme)
   ========================================================================== */

.pub_hero_1018_section {
  --hero-theme-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --hero-theme-card-bg: var(--card-bg, #ffffff);
  --hero-theme-text: var(--text, #18181b);
  --hero-theme-muted: var(--text-muted, #71717a);
  --hero-theme-accent: var(--accent, #ff5277);
  --hero-theme-border: var(--border, #000000);
  --hero-theme-shadow: var(--border, #000000);
  --hero-theme-cta-text: #ffffff;

  position: relative;
  width: 100%;
  min-height: var(--min-h, auto);
  background-color: var(--hero-theme-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--hero-theme-text, #18181b);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  box-sizing: border-box;
  overflow: hidden;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_hero_1018_section,
[data-theme="dark"] .pub_hero_1018_section {
  --hero-theme-bg: var(--bg, #18181b);
  --hero-theme-card-bg: var(--card-bg, #27272a);
  --hero-theme-text: var(--text, #f4f4f5);
  --hero-theme-muted: var(--text-muted, #a1a1aa);
  --hero-theme-accent: var(--accent, #38bdf8);
  --hero-theme-border: var(--border, #3f3f46);
  --hero-theme-shadow: var(--border, #000000);
  --hero-theme-cta-text: #09090b;
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_hero_1018_section,
[data-theme="neon"] .pub_hero_1018_section {
  --hero-theme-bg: var(--bg, #09090b);
  --hero-theme-card-bg: var(--card-bg, #121214);
  --hero-theme-text: var(--text, #ccff00);
  --hero-theme-muted: var(--text-muted, #a3e635);
  --hero-theme-accent: var(--accent, #ff007f);
  --hero-theme-border: var(--border, #ccff00);
  --hero-theme-shadow: var(--border, #ff007f);
  --hero-theme-cta-text: #ffffff;
}

.pub_hero_1018_container {
  width: 100%;
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

.pub_hero_1018_bentoGrid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
gap: var(--space-gap, 24px);
}

/* Intro Card (Main) */
.pub_hero_1018_introCard {
  grid-column: span 7;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 3px solid var(--hero-theme-border, #000000);

  border-radius: var(--radius-xl, 16px);
  padding: 40px;
  position: relative;
  box-sizing: border-box;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.3s ease;
}

.pub_hero_1018_introCard:hover {
  transform: translate(-3px, -3px);

}

.pub_hero_1018_badgeChip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  padding: 6px 14px;
  border-radius: var(--radius-full, 9999px);
  background-color: var(--hero-theme-bg, #fdf4ff);
  border: 2px solid var(--hero-theme-border, #000000);

  color: var(--hero-theme-text, #18181b);
  font-size: calc(0.875rem * var(--body-scale, 1));
  font-weight: 700;
  width: fit-content;
  margin-bottom: 24px;
}

.pub_hero_1018_liveDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--hero-theme-accent, #ff5277);

}

.pub_hero_1018_greeting {
  font-size: calc(1.125rem * var(--body-scale, 1));
  font-weight: 700;
  color: var(--hero-theme-accent, #ff5277);
  margin-top: 0;
  margin-bottom: 8px;
}

.pub_hero_1018_headline {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  line-height: var(--leading, 1.15);
  color: var(--hero-theme-text, #18181b);
  letter-spacing: var(--tracking, -0.02em);
  margin-top: 0;
  margin-bottom: 16px;
}

.pub_hero_1018_description {
  font-size: calc(1.0625rem * var(--body-scale, 1));
  line-height: var(--leading, 1.6);
  color: var(--hero-theme-muted, #71717a);
  margin-top: 0;
  margin-bottom: 32px;
  max-width: 600px;
}

.pub_hero_1018_ctaGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_hero_1018_primaryBtn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  padding: 14px 28px;
  border-radius: var(--radius-md, 10px);
  background-color: var(--hero-theme-accent, #ff5277);
  color: var(--hero-theme-cta-text, #ffffff);
  border: 2px solid var(--hero-theme-border, #000000);

  font-size: calc(1rem * var(--body-scale, 1));
  font-weight: 800;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_hero_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_hero_1018_secondaryBtn {
  display: inline-flex;
  align-items: center;
  padding: 14px 28px;
  border-radius: var(--radius-md, 10px);
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 2px solid var(--hero-theme-border, #000000);

  color: var(--hero-theme-text, #18181b);
  font-size: calc(1rem * var(--body-scale, 1));
  font-weight: 800;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_hero_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

}

/* Featured Project Card */
.pub_hero_1018_projectCard {
  grid-column: span 5;
  display: flex;
}

.pub_hero_1018_projectCardInner {
  width: 100%;
  display: flex;
  flex-direction: column;
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 3px solid var(--hero-theme-border, #000000);

  border-radius: var(--radius-xl, 16px);
  padding: 20px;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  box-sizing: border-box;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.3s ease;
}

.pub_hero_1018_projectCardInner:hover {
  transform: translate(-3px, -3px);

}

.pub_hero_1018_projectImageWrapper {
  position: relative;
  width: 100%;
  height: 220px;
  border: 2px solid var(--hero-theme-border, #000000);
  border-radius: var(--radius-md, 10px);
  overflow: hidden;
  margin-bottom: 20px;
}

.pub_hero_1018_projectImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.pub_hero_1018_projectCardInner:hover .pub_hero_1018_projectImage {
  transform: scale(1.05);
}

.pub_hero_1018_projectOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--overlay-bg, rgba(0, 0, 0, 0.1));
}

.pub_hero_1018_projectBadge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 6px 12px;
  border-radius: var(--radius-md, 6px);
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 2px solid var(--hero-theme-border, #000000);

  color: var(--hero-theme-accent, #ff5277);
  font-size: calc(0.75rem * var(--heading-scale, 1));
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: var(--tracking, 0.05em);
}

.pub_hero_1018_projectContent {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
}

.pub_hero_1018_projectTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-size: calc(1.25rem * var(--heading-scale, 1));
  font-weight: 800;
  color: var(--hero-theme-text, #18181b);
  margin: 0;
}

.pub_hero_1018_projectLinkIcon {
  width: 38px;
  height: 38px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--hero-theme-bg, #fdf4ff);
  border: 2px solid var(--hero-theme-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--hero-theme-text, #18181b);
  font-weight: 800;
  transition: transform 0.2s ease, color 0.2s ease;
}

.pub_hero_1018_projectCardInner:hover .pub_hero_1018_projectLinkIcon {
  transform: translate(2px, -2px);
  color: var(--hero-theme-accent, #ff5277);
}

/* Skills Card */
.pub_hero_1018_skillsCard {
  grid-column: span 5;
  display: flex;
}

.pub_hero_1018_skillsCardInner {
  width: 100%;
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 3px solid var(--hero-theme-border, #000000);

  border-radius: var(--radius-xl, 16px);
  padding: 28px;
  box-sizing: border-box;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.3s ease;
}

.pub_hero_1018_skillsCardInner:hover {
  transform: translate(-3px, -3px);

}

.pub_hero_1018_cardHeader {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-size: calc(1.125rem * var(--body-scale, 1));
  font-weight: 800;
  color: var(--hero-theme-text, #18181b);
  margin-top: 0;
  margin-bottom: 20px;
}

.pub_hero_1018_cardHeader i {
  color: var(--hero-theme-accent, #ff5277);
  font-size: calc(1.25rem * var(--body-scale, 1));
}

.pub_hero_1018_skillsGrid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 10px);
}

.pub_hero_1018_skillPill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  padding: 8px 14px;
  border-radius: var(--radius-lg, 8px);
  background-color: var(--hero-theme-bg, #fdf4ff);
  border: 2px solid var(--hero-theme-border, #000000);

  color: var(--hero-theme-text, #18181b);
  font-size: calc(0.875rem * var(--body-scale, 1));
  font-weight: 700;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_hero_1018_skillPill:hover {
  transform: translate(-2px, -2px);

}

.pub_hero_1018_skillPill i {
  color: var(--hero-theme-accent, #ff5277);
}

/* Key Metrics Card */
.pub_hero_1018_statsCard {
  grid-column: span 7;
  display: flex;
}

.pub_hero_1018_statsCardInner {
  width: 100%;
  background-color: var(--hero-theme-card-bg, #ffffff);
  border: 3px solid var(--hero-theme-border, #000000);

  border-radius: var(--radius-xl, 16px);
  padding: 28px;
  box-sizing: border-box;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.3s ease;
}

.pub_hero_1018_statsCardInner:hover {
  transform: translate(-3px, -3px);

}

.pub_hero_1018_statsGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-content-gap, 16px);
}

.pub_hero_1018_statItem {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border-radius: var(--radius-md, 10px);
  background-color: var(--hero-theme-bg, #fdf4ff);
  border: 2px solid var(--hero-theme-border, #000000);

}

.pub_hero_1018_statNumber {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-size: calc(2rem * var(--heading-scale, 1));
  font-weight: 800;
  color: var(--hero-theme-accent, #ff5277);
  line-height: var(--leading, 1);
  margin-bottom: 6px;
}

.pub_hero_1018_statLabel {
  font-size: calc(0.875rem * var(--body-scale, 1));
  color: var(--hero-theme-muted, #71717a);
  font-weight: 700;
}

/* Responsive Rules */
@media (max-width: 1024px) {
  .pub_hero_1018_introCard {
    grid-column: span 12;
  }

  .pub_hero_1018_projectCard {
    grid-column: span 6;
  }

  .pub_hero_1018_skillsCard {
    grid-column: span 6;
  }

  .pub_hero_1018_statsCard {
    grid-column: span 12;
  }
}

@media (max-width: 768px) {
  .pub_hero_1018_bentoGrid {
    grid-template-columns: 1fr;
    gap: var(--space-content-gap, 16px);
  }

  .pub_hero_1018_introCard,
  .pub_hero_1018_projectCard,
  .pub_hero_1018_skillsCard,
  .pub_hero_1018_statsCard {
    grid-column: span 1;
    padding: var(--space-card-padding, 24px);
  }

  .pub_hero_1018_statsGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 12px);
  }
}


/* PUB-SERVICE-1018 Interactive Terminal Neobrutalist CSS */

.pub_service_1018_servicesSection {
  --srv-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --srv-card-bg: var(--card-bg, #ffffff);
  --srv-terminal-bg: var(--terminal-bg, #0f172a);
  --srv-text: var(--text, #0f172a);
  --srv-muted: var(--text-muted, #475569);
  --srv-accent: var(--accent, #f59e0b);
  --srv-border: var(--border, #000000);
  --srv-cta-bg: var(--cta-bg, #f59e0b);
  --srv-cta-text: var(--cta-text, #000000);

  background-color: var(--srv-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--srv-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_service_1018_servicesSection,
[data-theme="dark"] .pub_service_1018_servicesSection {
  --srv-bg: var(--bg, #0f172a);
  --srv-card-bg: var(--card-bg, #1e293b);
  --srv-terminal-bg: var(--terminal-bg, #020617);
  --srv-text: var(--text, #f8fafc);
  --srv-muted: var(--text-muted, #94a3b8);
  --srv-accent: var(--accent, #f59e0b);
  --srv-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_service_1018_servicesSection,
[data-theme="neon"] .pub_service_1018_servicesSection {
  --srv-bg: var(--bg, #09090b);
  --srv-card-bg: var(--card-bg, #121214);
  --srv-terminal-bg: var(--terminal-bg, #000000);
  --srv-text: var(--text, #ccff00);
  --srv-muted: var(--text-muted, #a3e635);
  --srv-accent: var(--accent, #ff007f);
  --srv-border: var(--border, #ccff00);
}

.pub_service_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_service_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_service_1018_badge {
  display: inline-block;
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--srv-border, #000000);

  margin-bottom: 16px;
}

.pub_service_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--srv-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Terminal Outer Window Container */
.pub_service_1018_terminalContainer {
  background-color: var(--srv-card-bg, #ffffff);
  border: 4px solid var(--srv-border, #000000);

  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Window Title Bar */
.pub_service_1018_titleBar {
  background-color: var(--srv-border, #000000);
  color: var(--srv-card-bg, #ffffff);
  padding: 12px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 3px solid var(--srv-border, #000000);
}

.pub_service_1018_dotsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
}

.pub_service_1018_dot {
  width: 12px;
  height: 12px;
  border-radius: var(--radius-full, 50%);
  border: 1px solid var(--srv-border, #000000);
  display: inline-block;
}

.pub_service_1018_dotRed {
  background-color: var(--dot-red, #ef4444);
}

.pub_service_1018_dotYellow {
  background-color: var(--srv-accent, #f59e0b);
}

.pub_service_1018_dotGreen {
  background-color: var(--status-green, #22c55e);
}

.pub_service_1018_terminalTitle {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  letter-spacing: var(--tracking, 0.04em);
}

.pub_service_1018_cliTag {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  padding: 2px 8px;
  border: 1px solid var(--srv-border, #000000);
}

/* Terminal Body Grid */
.pub_service_1018_terminalBody {
  display: grid;
  grid-template-columns: 340px 1fr;
  min-height: 480px;
}

/* Left Sidebar: Command Selectors */
.pub_service_1018_commandSidebar {
  background-color: var(--srv-card-bg, #ffffff);
  border-right: 3px solid var(--srv-border, #000000);
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
}

.pub_service_1018_commandHeader {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--srv-muted, #475569);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px dashed var(--srv-border, #000000);
}

.pub_service_1018_commandList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_service_1018_commandBtn {
  background-color: var(--srv-bg, #fdf4ff);
  color: var(--srv-text, #0f172a);
  border: 3px solid var(--srv-border, #000000);

  padding: 12px 14px;
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  text-align: left;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_service_1018_commandBtn:hover {
  transform: translate(-1px, -1px);

  background-color: var(--srv-card-bg, #ffffff);
}

.pub_service_1018_commandBtnActive {
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);

}

.pub_service_1018_promptSymbol {
  color: var(--status-green, #22c55e);
  font-weight: 900;
  margin-right: 8px;
}

.pub_service_1018_commandBtnActive .pub_service_1018_promptSymbol {
  color: var(--srv-border, #000000);
}

.pub_service_1018_commandText {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Right Output Console Panel */
.pub_service_1018_outputConsole {
  background-color: var(--srv-terminal-bg, #0f172a);
  color: var(--console-text, #f8fafc);
  padding: 36px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.pub_service_1018_consoleContent {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.pub_service_1018_consoleHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--translucent-border, rgba(255, 255, 255, 0.15));
}

.pub_service_1018_serviceTitleGroup {
  display: flex;
  align-items: center;
  gap: 14px;
}

.pub_service_1018_serviceIcon {
  color: var(--srv-accent, #f59e0b);
}

.pub_service_1018_serviceTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--srv-card-bg, #ffffff);
  margin: 0;
}

.pub_service_1018_priceBadge {
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 6px 14px;
  border: 2px solid var(--srv-border, #000000);

}

.pub_service_1018_cmdExecutingRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, monospace, sans-serif);
  margin-bottom: 20px;
  background-color: var(--translucent-bg, rgba(255, 255, 255, 0.05));
  padding: 10px 14px;
  border-left: 4px solid var(--srv-accent, #f59e0b);
}

.pub_service_1018_promptGreen {
  color: var(--status-green, #22c55e);
  font-weight: 700;
}

.pub_service_1018_executingCmd {
  color: var(--code-cyan, #38bdf8);
  font-weight: 600;
}

.pub_service_1018_blinkingCursor {
  display: inline-block;
  width: 8px;
  height: 16px;
  background-color: var(--srv-accent, #f59e0b);
  animation: pub_service_1018_blink 1s infinite;
}

@keyframes pub_service_1018_blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

.pub_service_1018_serviceDescription {
  line-height: var(--leading, 1.6);
  color: var(--srv-muted, #94a3b8);
  margin: 0 0 24px 0;
}

/* Features List */
.pub_service_1018_featuresBox {
  margin-bottom: 24px;
}

.pub_service_1018_featuresHeading {
  display: block;
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--srv-accent, #f59e0b);
  letter-spacing: var(--tracking, 0.08em);
  margin-bottom: 12px;
}

.pub_service_1018_featuresList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--space-content-gap, 10px);
}

.pub_service_1018_featureItem {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  color: var(--feat-text, #e2e8f0);
}

.pub_service_1018_featureItem i {
  color: var(--status-green, #22c55e);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Tags Row */
.pub_service_1018_tagsRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 10px);
  margin-bottom: 32px;
}

.pub_service_1018_tagBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  background-color: var(--translucent-tag, rgba(255, 255, 255, 0.08));
  color: var(--code-cyan, #38bdf8);
  padding: 4px 10px;
  border: 1px solid var(--translucent-border, rgba(255, 255, 255, 0.15));
}

/* CTA Row */
.pub_service_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-top: auto;
}

.pub_service_1018_primaryBtn {
  background-color: var(--srv-cta-bg, #f59e0b);
  color: var(--srv-cta-text, #000000);
  border: 3px solid var(--srv-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_service_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_service_1018_secondaryBtn {
  background-color: var(--srv-card-bg, #ffffff);
  color: var(--srv-text, #0f172a);
  border: 3px solid var(--srv-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_service_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--srv-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_service_1018_terminalBody {
    grid-template-columns: 1fr;
  }

  .pub_service_1018_commandSidebar {
    border-right: none;
    border-bottom: 3px solid var(--srv-border, #000000);
  }

  .pub_service_1018_outputConsole {
    padding: var(--space-card-padding, 24px);
  }
}

@media (max-width: 640px) {
  .pub_service_1018_servicesSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_service_1018_header {
    margin-bottom: 28px;
  }

  .pub_service_1018_featuresList {
    grid-template-columns: 1fr;
  }

  .pub_service_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_service_1018_primaryBtn,
  .pub_service_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}


/* PUB-ABOUT-1018 Neobrutalist Illustrator CSS */

.pub_about_1018_aboutSection {
  background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
  color: var(--text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

.pub_about_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_about_1018_header {
  margin-bottom: 48px;
  text-align: left;
}

.pub_about_1018_badge {
  display: inline-block;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--border, #000000);

  margin-bottom: 16px;
}

.pub_about_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Dual Column Grid */
.pub_about_1018_grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 36px;
  align-items: stretch;
}

/* Left Column: Media Card */
.pub_about_1018_mediaCard {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 16px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.pub_about_1018_videoWrapper {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 3px solid var(--border, #000000);
  overflow: hidden;
  background-color: var(--border, #000000);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Base video player background layer (z-index 1) */
.pub_about_1018_videoPlayer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: var(--z-base, 1);
}

/* Dark translucent tint overlay layer above video (z-index 2) */
.pub_about_1018_videoOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--border, #000000);
  opacity: 0.15;
  z-index: var(--z-above, 2);
  /* Above background layers */
  pointer-events: none;
}

/* Top controls row overlay above background layers (z-index 3) */
.pub_about_1018_videoTopRow {
  position: relative;
  z-index: var(--z-overlay, 3);
  padding: 16px;
  display: flex;
  justify-content: flex-start;
}

.pub_about_1018_videoCaptionBadge {
  background-color: var(--card-bg, #ffffff);
  color: var(--text, #0f172a);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 6px 12px;
  border: 2px solid var(--border, #000000);

}

/* Interactive video player toggle button overlay layer above video (z-index 3) */
.pub_about_1018_videoToggleBtn {
  position: relative;
  z-index: var(--z-overlay, 3);
  margin: 16px;
  align-self: flex-start;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 10px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_videoToggleBtn:hover {
  transform: translate(-1px, -1px);

}

.pub_about_1018_videoToggleBtn:active {
  transform: translate(2px, 2px);

}

/* Right Column: Bio Card */
.pub_about_1018_bioCard {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 36px;
  display: flex;
  flex-direction: column;
}

.pub_about_1018_statusBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--bg, #fdf4ff);
  border: 2px solid var(--border, #000000);
  padding: 6px 14px;
  margin-bottom: 24px;
  align-self: flex-start;
}

.pub_about_1018_statusDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--status-dot-color, #22c55e);
  border: 1px solid var(--border, #000000);

  display: inline-block;
}

.pub_about_1018_statusText {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--text, #0f172a);
}

.pub_about_1018_bioHeadline {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  line-height: var(--leading, 1.25);
  color: var(--text, #0f172a);
  margin: 0 0 16px 0;
}

.pub_about_1018_bioText {
  line-height: var(--leading, 1.6);
  color: var(--text-muted, #475569);
  margin: 0 0 28px 0;
}

/* Skills Section */
.pub_about_1018_skillsWrapper {
  margin-bottom: 28px;
}

.pub_about_1018_subHeading {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--text-muted, #475569);
  margin: 0 0 14px 0;
  text-transform: uppercase;
}

.pub_about_1018_skillsGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: var(--space-content-gap, 12px);
}

.pub_about_1018_skillCard {
  background-color: var(--bg, #fdf4ff);
  border: 2px solid var(--border, #000000);

  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_about_1018_skillCard:hover {
  transform: translate(-1px, -1px);

}

.pub_about_1018_skillIcon {
  color: var(--accent, #f59e0b);
}

.pub_about_1018_skillName {
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 700;
  color: var(--text, #0f172a);
  flex: 1;
}

.pub_about_1018_skillTag {
  font-weight: 800;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  padding: 2px 6px;
  border: 1px solid var(--border, #000000);
  text-transform: uppercase;
}

/* Stats Row */
.pub_about_1018_statsRow {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 32px;
}

.pub_about_1018_statBox {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 14px;
  text-align: center;
}

.pub_about_1018_statNumber {
  display: block;
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--text, #0f172a);
  line-height: var(--leading, 1.1);
  margin-bottom: 4px;
}

.pub_about_1018_statLabel {
  font-weight: 700;
  color: var(--text-muted, #475569);
  text-transform: uppercase;
  letter-spacing: var(--tracking, 0.04em);
}

/* CTA Row */
.pub_about_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-top: auto;
}

.pub_about_1018_primaryBtn {
  background-color: var(--cta-bg, #000000);
  color: var(--cta-text, #ffffff);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_about_1018_primaryBtn:active {
  transform: translate(2px, 2px);

}

.pub_about_1018_secondaryBtn {
  background-color: var(--card-bg, #ffffff);
  color: var(--text, #0f172a);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--bg, #fdf4ff);
}

.pub_about_1018_secondaryBtn:active {
  transform: translate(2px, 2px);

}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_about_1018_grid {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_videoWrapper {
    min-height: 340px;
  }

  .pub_about_1018_bioCard {
    padding: var(--space-card-padding, 24px);
  }
}

@media (max-width: 640px) {
  .pub_about_1018_aboutSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_about_1018_header {
    margin-bottom: 32px;
  }

  .pub_about_1018_skillsGrid {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_statsRow {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_about_1018_primaryBtn,
  .pub_about_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-GALLERY-1018 Massive Masonry Spotlight CSS */

.pub_gallery_1018_gallerySection {
  --gal-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --gal-card-bg: var(--card-bg, #ffffff);
  --gal-text: var(--text, #0f172a);
  --gal-muted: var(--text-muted, #475569);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #000000);
  --gal-cta-bg: var(--cta-bg, #000000);
  --gal-cta-text: var(--cta-text, #ffffff);

  background-color: var(--gal-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--gal-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_gallery_1018_gallerySection,
[data-theme="dark"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #0f172a);
  --gal-card-bg: var(--card-bg, #1e293b);
  --gal-text: var(--text, #f8fafc);
  --gal-muted: var(--text-muted, #94a3b8);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_gallery_1018_gallerySection,
[data-theme="neon"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #09090b);
  --gal-card-bg: var(--card-bg, #121214);
  --gal-text: var(--text, #ccff00);
  --gal-muted: var(--text-muted, #a3e635);
  --gal-accent: var(--accent, #ff007f);
  --gal-border: var(--border, #ccff00);
}

.pub_gallery_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_gallery_1018_header {
  margin-bottom: 32px;
  text-align: left;
}

.pub_gallery_1018_badge {
  display: inline-block;
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--gal-border, #000000);

  margin-bottom: 16px;
}

.pub_gallery_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--gal-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Category Filter Tabs Bar */
.pub_gallery_1018_filterBar {
  display: flex;
  flex-wrap: wrap;
gap: var(--space-content-gap, 12px);
  margin-bottom: 40px;
}

.pub_gallery_1018_filterTab {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 8px 18px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_gallery_1018_filterTab:hover {
  transform: translate(-1px, -1px);

}

.pub_gallery_1018_filterTabActive {
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);

}

/* Masonry Grid Layout */
.pub_gallery_1018_masonryGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: start;
  margin-bottom: 48px;
  transition: opacity 0.25s ease;
}

/* Individual Artwork Card */
.pub_gallery_1018_artCard {
  background-color: var(--gal-card-bg, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease, filter 0.25s ease;
}

.pub_gallery_1018_artCard:hover {
  transform: translate(-3px, -3px);

}

/* Spotlight Dimming Effect */
.pub_gallery_1018_masonryGrid[data-spotlight-active="true"] .pub_gallery_1018_artCard:not([data-spotlight-hover="true"]) {
  opacity: 0.35;
  filter: grayscale(50%);
}

.pub_gallery_1018_cardVertical {
  grid-row: span 2;
}

.pub_gallery_1018_cardHorizontal {
  grid-column: span 2;
}

.pub_gallery_1018_cardSquare {
  grid-row: span 1;
}

.pub_gallery_1018_cardInnerLink {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Image Container */
.pub_gallery_1018_imageWrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--gal-border, #000000);
}

.pub_gallery_1018_cardVertical .pub_gallery_1018_imageWrapper {
  padding-bottom: 125%;
}

.pub_gallery_1018_cardHorizontal .pub_gallery_1018_imageWrapper {
  padding-bottom: 50%;
}

.pub_gallery_1018_cardSquare .pub_gallery_1018_imageWrapper {
  padding-bottom: 85%;
}

/* Base artwork image layer (z-index 1) */
.pub_gallery_1018_artImage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: var(--z-base, 1);
  /* Base layer - image */
  transition: transform 0.4s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_artImage {
  transform: scale(1.05);
}

/* Dark hover overlay layer above image (z-index 2) */
.pub_gallery_1018_imageOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--gal-border, #000000);
  opacity: 0;
  z-index: var(--z-above, 2);
  /* Above image layer */
  transition: opacity 0.25s ease;
  pointer-events: none;
    box-shadow: var(--shadow-sm, none);
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_imageOverlay {
  opacity: 0.15;
}

/* Category Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_categoryBadge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay */
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  padding: 4px 10px;
  border: 2px solid var(--gal-border, #000000);

}

/* Zoom Arrow Action Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_zoomBadge {
  position: absolute;
  bottom: 14px;
  right: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay layers */
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-border, #000000);
  width: 38px;
  height: 38px;
  border: 2px solid var(--gal-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_zoomBadge {
  transform: translate(-2px, -2px);
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
}

/* Card Metadata Caption Bar */
.pub_gallery_1018_cardMetaBar {
  padding: 18px 20px;
  background-color: var(--gal-card-bg, #ffffff);
  border-top: 3px solid var(--gal-border, #000000);
}

.pub_gallery_1018_artTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--gal-text, #0f172a);
  margin: 0 0 4px 0;
}

.pub_gallery_1018_artCaption {
  font-weight: 600;
  color: var(--gal-muted, #475569);
}

/* CTA Row */
.pub_gallery_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_gallery_1018_primaryBtn {
  background-color: var(--gal-cta-bg, #000000);
  color: var(--gal-cta-text, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_gallery_1018_secondaryBtn {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--gal-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_gallery_1018_masonryGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardHorizontal {
    grid-column: span 1;
  }
}

@media (max-width: 640px) {
  .pub_gallery_1018_gallerySection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_gallery_1018_masonryGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardVertical {
    grid-row: span 1;
  }

  .pub_gallery_1018_filterBar {
    gap: var(--space-content-gap, 8px);
  }

  .pub_gallery_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_gallery_1018_primaryBtn,
  .pub_gallery_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-TESTIMONIAL-1018 Neobrutalist Quote Cards CSS */

.pub_testimonial_1018_testimonialSection {
  --tst-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --tst-card-bg: var(--card-bg, #ffffff);
  --tst-text: var(--text, #0f172a);
  --tst-muted: var(--text-muted, #475569);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #000000);

  background-color: var(--tst-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--tst-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_testimonial_1018_testimonialSection,
[data-theme="dark"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #0f172a);
  --tst-card-bg: var(--card-bg, #1e293b);
  --tst-text: var(--text, #f8fafc);
  --tst-muted: var(--text-muted, #94a3b8);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_testimonial_1018_testimonialSection,
[data-theme="neon"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #09090b);
  --tst-card-bg: var(--card-bg, #121214);
  --tst-text: var(--text, #ccff00);
  --tst-muted: var(--text-muted, #a3e635);
  --tst-accent: var(--accent, #ff007f);
  --tst-border: var(--border, #ccff00);
}

.pub_testimonial_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_testimonial_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_testimonial_1018_badge {
  display: inline-block;
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--tst-border, #000000);

  margin-bottom: 16px;
}

.pub_testimonial_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--tst-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Testimonial Cards Grid */
.pub_testimonial_1018_testimonialGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: stretch;
}

/* Quote Card */
.pub_testimonial_1018_quoteCard {
  background-color: var(--tst-card-bg, #ffffff);
  border: 3px solid var(--tst-border, #000000);

  padding: 28px;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_testimonial_1018_quoteCard:hover {
  transform: translate(-3px, -3px);

}

/* Top Card Header Row */
.pub_testimonial_1018_cardHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.pub_testimonial_1018_quoteIconBadge {
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  width: 40px;
  height: 40px;
  border: 2px solid var(--tst-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
}

.pub_testimonial_1018_tagBadge {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--tst-bg, #fdf4ff);
  color: var(--tst-border, #000000);
  padding: 4px 10px;
  border: 2px solid var(--tst-border, #000000);
}

/* Star Rating Row */
.pub_testimonial_1018_starsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 4px);
  margin-bottom: 16px;
}

.pub_testimonial_1018_starIcon {
  color: var(--tst-accent, #f59e0b);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Quote Paragraph */
.pub_testimonial_1018_quoteText {
  line-height: var(--leading, 1.6);
  color: var(--tst-text, #0f172a);
  font-style: italic;
  margin: 0 0 24px 0;
  flex: 1;
}

/* Author Row */
.pub_testimonial_1018_authorRow {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 16px;
  border-top: 2px dashed var(--tst-border, #000000);
  margin-top: auto;
}

.pub_testimonial_1018_avatarImage {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--tst-border, #000000);

  object-fit: cover;
}

.pub_testimonial_1018_authorMeta {
  display: flex;
  flex-direction: column;
}

.pub_testimonial_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--tst-text, #0f172a);
  margin: 0 0 2px 0;
}

.pub_testimonial_1018_authorTitle {
  font-weight: 600;
  color: var(--tst-muted, #475569);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }
}

@media (max-width: 640px) {
  .pub_testimonial_1018_testimonialSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_testimonial_1018_header {
    margin-bottom: 28px;
  }

  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_testimonial_1018_quoteCard {
    padding: 20px;
  }
}


/* PUB-BLOG-1018 Horizontal Timeline Blog Feed CSS */

.pub_blog_1018_blogSection {
  --blg-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --blg-card-bg: var(--card-bg, #ffffff);
  --blg-text: var(--text, #0f172a);
  --blg-muted: var(--text-muted, #475569);
  --blg-accent: var(--accent, #ec4899);
  --blg-border: var(--border, #000000);
  --blg-cta-bg: var(--cta-bg, #000000);
  --blg-cta-text: var(--cta-text, #ffffff);

  background-color: var(--blg-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--blg-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_blog_1018_blogSection,
[data-theme="dark"] .pub_blog_1018_blogSection {
  --blg-bg: var(--bg, #0f172a);
  --blg-card-bg: var(--card-bg, #1e293b);
  --blg-text: var(--text, #f8fafc);
  --blg-muted: var(--text-muted, #94a3b8);
  --blg-accent: var(--accent, #ec4899);
  --blg-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_blog_1018_blogSection,
[data-theme="neon"] .pub_blog_1018_blogSection {
  --blg-bg: var(--bg, #09090b);
  --blg-card-bg: var(--card-bg, #121214);
  --blg-text: var(--text, #ccff00);
  --blg-muted: var(--text-muted, #a3e635);
  --blg-accent: var(--accent, #ff007f);
  --blg-border: var(--border, #ccff00);
}

.pub_blog_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_blog_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_blog_1018_badge {
  display: inline-block;
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--blg-border, #000000);

  margin-bottom: 16px;
}

.pub_blog_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--blg-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Timeline Feed Container */
.pub_blog_1018_timelineFeed {
  display: flex;
  flex-direction: column;
  gap: var(--space-gap, 28px);
  margin-bottom: 48px;
  position: relative;
}

.pub_blog_1018_timelineRow {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: var(--space-gap, 28px);
  align-items: start;
  position: relative;
}

/* Left Date Column & Connecting Line */
.pub_blog_1018_dateCol {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  height: 100%;
}

/* Date pill badge layer above timeline line (z-index 2) */
.pub_blog_1018_datePillBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  padding: 8px 14px;
  border: 2px solid var(--blg-border, #000000);

  z-index: var(--z-above, 2);
}

/* Background vertical connector line (z-index 1) */
.pub_blog_1018_timelineLine {
  position: absolute;
  top: 36px;
  left: 20px;
  bottom: -28px;
  width: 3px;
  background-color: var(--blg-border, #000000);
  z-index: var(--z-base, 1);
  /* Above blog card content */
}

.pub_blog_1018_timelineRow:last-child .pub_blog_1018_timelineLine {
  display: none;
}

/* Article Card */
.pub_blog_1018_articleCard {
  background-color: var(--blg-card-bg, #ffffff);
  border: 3px solid var(--blg-border, #000000);

  overflow: hidden;
  height: 215px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_blog_1018_articleCard:hover {
  transform: translate(-3px, -3px);

}

.pub_blog_1018_cardInnerLink {
  text-decoration: none;
  color: inherit;
  display: grid;
  grid-template-columns: 240px 1fr;
  height: 100%;
}

.pub_blog_1018_imageCol {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: var(--blg-border, #000000);
  border-right: 3px solid var(--blg-border, #000000);
}

.pub_blog_1018_coverImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_coverImage {
  transform: scale(1.06);
}

.pub_blog_1018_contentCol {
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
}

.pub_blog_1018_metaRow {
  display: flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  margin-bottom: 8px;
}

.pub_blog_1018_categoryTag {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  padding: 3px 10px;
  border: 2px solid var(--blg-border, #000000);
}

.pub_blog_1018_readTimeTag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 6px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--blg-muted, #475569);
}

.pub_blog_1018_articleTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.25);
  color: var(--blg-text, #0f172a);
  margin: 0 0 6px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_articleTitle {
  color: var(--blg-accent, #ec4899);
}

.pub_blog_1018_articleExcerpt {
  line-height: var(--leading, 1.5);
  color: var(--blg-muted, #475569);
  margin: 0 0 12px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pub_blog_1018_cardFooter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 2px dashed var(--blg-border, #000000);
  margin-top: auto;
}

.pub_blog_1018_authorGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_blog_1018_authorAvatar {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--blg-border, #000000);
  object-fit: cover;
}

.pub_blog_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--blg-text, #0f172a);
}

.pub_blog_1018_readBtn {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  background-color: var(--blg-border, #000000);
  color: var(--blg-card-bg, #ffffff);
  padding: 6px 14px;
  border: 2px solid var(--blg-border, #000000);

  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 6px);
  transition: transform 0.15s ease, background-color 0.15s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_readBtn {
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  transform: translate(-1px, -1px);
}

/* Section Bottom CTA Row */
.pub_blog_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_blog_1018_primaryBtn {
  background-color: var(--blg-cta-bg, #000000);
  color: var(--blg-cta-text, #ffffff);
  border: 3px solid var(--blg-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_blog_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_blog_1018_secondaryBtn {
  background-color: var(--blg-card-bg, #ffffff);
  color: var(--blg-text, #0f172a);
  border: 3px solid var(--blg-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_blog_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--blg-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_blog_1018_articleCard {
    height: auto;
  }

  .pub_blog_1018_timelineRow {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 12px);
  }

  .pub_blog_1018_timelineLine {
    display: none;
  }

  .pub_blog_1018_cardInnerLink {
    grid-template-columns: 1fr;
  }

  .pub_blog_1018_imageCol {
    min-height: 180px;
    border-right: none;
    border-bottom: 3px solid var(--blg-border, #000000);
  }
}

@media (max-width: 640px) {
  .pub_blog_1018_blogSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_blog_1018_contentCol {
    padding: 18px 20px;
  }

  .pub_blog_1018_cardFooter {
    flex-direction: column;
    align-items: flex-start;
gap: var(--space-content-gap, 12px);
  }

  .pub_blog_1018_readBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }

  .pub_blog_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_blog_1018_primaryBtn,
  .pub_blog_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-FORM-1018 Neobrutalist Contact Form CSS */

.pub_form_1018_formSection {
  --frm-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --frm-card-bg: var(--card-bg, #ffffff);
  --frm-text: var(--text, #0f172a);
  --frm-muted: var(--text-muted, #475569);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #000000);
  --frm-cta-bg: var(--cta-bg, #000000);
  --frm-cta-text: var(--cta-text, #ffffff);

  background-color: var(--frm-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--frm-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_form_1018_formSection,
[data-theme="dark"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #0f172a);
  --frm-card-bg: var(--card-bg, #1e293b);
  --frm-text: var(--text, #f8fafc);
  --frm-muted: var(--text-muted, #94a3b8);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_form_1018_formSection,
[data-theme="neon"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #09090b);
  --frm-card-bg: var(--card-bg, #121214);
  --frm-text: var(--text, #ccff00);
  --frm-muted: var(--text-muted, #a3e635);
  --frm-accent: var(--accent, #ff007f);
  --frm-border: var(--border, #ccff00);
}

.pub_form_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_form_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_form_1018_badge {
  display: inline-block;
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--frm-border, #000000);

  margin-bottom: 16px;
}

.pub_form_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--frm-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* 2-Column Section Grid */
.pub_form_1018_sectionGrid {
  display: grid;
  grid-template-columns: 360px 1fr;
gap: var(--space-gap, 32px);
  align-items: start;
}

/* Left Column: Contact Info Sidebar */
.pub_form_1018_infoSidebar {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  padding: 32px 28px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_responseBadge {
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 8px 14px;
  border: 2px solid var(--frm-border, #000000);

  text-align: center;
}

.pub_form_1018_infoList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_infoItem {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.pub_form_1018_infoIconBox {
  width: 40px;
  height: 40px;
  border: 2px solid var(--frm-border, #000000);

  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pub_form_1018_infoMeta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pub_form_1018_infoLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_infoValue {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  word-break: break-all;
  transition: color 0.15s ease;
}

.pub_form_1018_infoValue:hover {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_infoValueText {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 700;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_socialRow {
  padding-top: 16px;
  border-top: 2px dashed var(--frm-border, #000000);
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_socialLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_socialBadges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_socialPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  padding: 4px 8px;
  border: 1px solid var(--frm-border, #000000);
}

/* Right Column: Neobrutalist Form Card */
.pub_form_1018_formCard {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  overflow: hidden;
  width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* Form Top Availability Bar */
.pub_form_1018_formTopBar {
  background-color: var(--frm-bg, #fdf4ff);
  border-bottom: 3px solid var(--frm-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--frm-accent, #ec4899);
  border: 1px solid var(--frm-border, #000000);
  animation: pub_form_1018_pulse 1.5s infinite;
}

@keyframes pub_form_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_form_1018_statusText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--frm-text, #0f172a);
}

/* Form Element */
.pub_form_1018_formElement {
  padding: 36px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_inputGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_fieldGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_fieldLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_textInput,
.pub_form_1018_selectInput,
.pub_form_1018_textareaInput {
  background-color: var(--frm-card-bg, #ffffff);
  color: var(--frm-text, #0f172a);
  border: 3px solid var(--frm-border, #000000);

  padding: 14px 16px;
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 600;
  outline: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.pub_form_1018_textInput:focus,
.pub_form_1018_selectInput:focus,
.pub_form_1018_textareaInput:focus {
  transform: translate(-1px, -1px);

  border-color: var(--frm-border, #000000);
}

.pub_form_1018_textareaInput {
  resize: vertical;
  min-height: 120px;
}

/* Submit Row */
.pub_form_1018_submitRow {
  display: flex;
  align-items: center;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
  padding-top: 8px;
}

.pub_form_1018_submitBtn {
  background-color: var(--frm-cta-bg, #000000);
  color: var(--frm-cta-text, #ffffff);
  border: 3px solid var(--frm-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_form_1018_submitBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
}

.pub_form_1018_privacyNote {
  color: var(--frm-muted, #475569);
  font-weight: 500;
  flex: 1;
}

/* Success Banner */
.pub_form_1018_successBanner {
  display: none;
  background-color: var(--frm-bg, #fdf4ff);
  border: 3px solid var(--frm-border, #000000);

  padding: 20px 24px;
  align-items: center;
  gap: var(--space-content-gap, 16px);
}

.pub_form_1018_successBanner[data-visible="true"] {
  display: flex;
}

.pub_form_1018_successBanner i {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_successTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  margin: 0 0 2px 0;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_successDesc {
  margin: 0;
  color: var(--frm-muted, #475569);
}

/* Secondary Action Row */
.pub_form_1018_secondaryRow {
  padding: 18px 36px;
  background-color: var(--frm-bg, #fdf4ff);
  border-top: 3px solid var(--frm-border, #000000);
}

.pub_form_1018_secondaryLink {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  transition: color 0.15s ease;
}

.pub_form_1018_secondaryLink:hover {
  color: var(--frm-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_form_1018_sectionGrid {
    grid-template-columns: 1fr;
gap: var(--space-gap, 24px);
  }
}

@media (max-width: 768px) {
  .pub_form_1018_inputGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pub_form_1018_formSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_form_1018_formElement {
    padding: var(--space-card-padding, 24px);
  }

  .pub_form_1018_submitRow {
    flex-direction: column;
    align-items: stretch;
  }

  .pub_form_1018_submitBtn {
    width: 100%;
    justify-content: center;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_form_1018_secondaryRow {
    padding: var(--space-card-padding, 24px) 24px;
  }
}

.pub_form_1018_errorBanner {
  font-family: var(--font-body, inherit);
  font-size: 0.95rem;
  line-height: 1.5;
  border-radius: var(--shape-radius-sm, 4px);
}


/* PUB-FOOTER-1018 Floating macOS Dock Footer CSS */

.pub_footer_1018_footerSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_footer_1018_footerSection,
[data-theme="dark"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_footer_1018_footerSection,
[data-theme="neon"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_footer_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Main Neobrutalist Footer Card */
.pub_footer_1018_footerCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Header Bar */
.pub_footer_1018_topHeader {
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-gap, 24px);
  flex-wrap: wrap;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_brandGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_footer_1018_brandBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--sec-bg, #fdf4ff);
  padding: 8px 16px;
  border: 3px solid var(--sec-border, #000000);

}

.pub_footer_1018_brandTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--sec-text, #0f172a);
}

.pub_footer_1018_brandSub {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_taglineText {
  color: var(--sec-muted, #475569);
  margin: 0;
  font-weight: 500;
}

/* Navigation Bar */
.pub_footer_1018_navBar {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_navLink {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 6px 12px;
  border: 2px solid transparent;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_navLink:hover {
  border-color: var(--sec-border, #000000);
  background-color: var(--sec-bg, #fdf4ff);
}

/* Floating macOS Dock Section */
.pub_footer_1018_dockWrapper {
  padding: 40px 24px;
  background-color: var(--sec-bg, #fdf4ff);
  display: flex;
  justify-content: center;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_macDock {
  background-color: var(--sec-card-bg, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  flex-wrap: wrap;
  justify-content: center;
}

.pub_footer_1018_dockPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 8px 14px;
  background-color: var(--sec-bg, #fdf4ff);
  border: 2px solid var(--sec-border, #000000);
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_footer_1018_dockPill i {
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_dockPill:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_footer_1018_dockPill:hover i {
  color: var(--sec-card-bg, #ffffff);
}

/* Bottom Legal Bar */
.pub_footer_1018_bottomBar {
  padding: var(--space-card-padding, 24px) 40px;
  background-color: var(--sec-card-bg, #ffffff);
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
}

.pub_footer_1018_legalGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_copyrightText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--sec-muted, #475569);
}

.pub_footer_1018_statusBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--sec-border, #000000);
}

.pub_footer_1018_backToTopBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 8px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_backToTopBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

/* Responsive Styles */
@media (max-width: 768px) {
  .pub_footer_1018_topHeader {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
  }

  .pub_footer_1018_bottomBar {
    padding: 20px 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_footer_1018_backToTopBtn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pub_footer_1018_footerSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_footer_1018_dockWrapper {
    padding: 24px 16px;
  }

  .pub_footer_1018_macDock {
    width: 100%;
    box-sizing: border-box;
  }

  .pub_footer_1018_dockPill {
    flex: 1;
    justify-content: center;
  }
}


/* Page: services */
/* ==========================================================================
   PUB-NAV-1018 — Neobrutalism Navbar
   ========================================================================== */

.pub_nav_1018_rootWrapper {
    position: relative;
    width: 100%;
    background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
    color: var(--text, #18181b);
    font-family: var(--font-body, system-ui, -apple-system, sans-serif);
    padding-top: var(--pt, 16px);
    padding-bottom: var(--pb, 16px);
    transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* ── Main Navbar Container ──────────────────────────────────────────────── */
.pub_nav_1018_navbar {
    position: var(--navbar-position, sticky);
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-navbar, 100); /* Layer navbar above standard page content */
}

.pub_nav_1018_container {
    max-width: var(--max-w, 1240px);
    height: var(--nav-h, 76px);
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-lg, 12px);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ── Brand Logo ─────────────────────────────────────────────────────────── */
.pub_nav_1018_brandWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_logoBlock {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 10px);
    text-decoration: none;
    color: var(--text, #18181b);
}

.pub_nav_1018_logoMark {
    font-size: var(--fs-2xl, 24px);
    color: var(--accent, #ff5277);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub_nav_1018_logoWord {
    font-family: var(--font-heading, var(--font-body, system-ui, sans-serif));
    font-weight: 800;
    font-size: var(--fs-xl, 20px);
    letter-spacing: var(--tracking, -0.02em);
    color: var(--text, #18181b);
}

.pub_nav_1018_logoImage {
    max-height: 42px;
    object-fit: contain;
}

/* ── Desktop Navigation Links ───────────────────────────────────────────── */
.pub_nav_1018_navLinksWrap {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
}

.pub_nav_1018_navItem {
    position: relative;
}

.pub_nav_1018_navLink {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    font-weight: 700;
    font-size: var(--fs-md, 15px);
    color: var(--text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-lg, 8px);
    border: 2px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pub_nav_1018_navLink:hover {
    background-color: var(--bg, #fdf4ff);
    border-color: var(--border, #000000);
    transform: translateY(-2px);
}

/* ── Dropdown Sub-menu ─────────────────────────────────────────────────── */
.pub_nav_1018_dropdownMenu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-md, 10px);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: var(--z-dropdown, 110); /* Layer dropdown above navbar container */
}

.pub_nav_1018_dropdownMenu[data-open="true"],
.pub_nav_1018_navItem:hover .pub_nav_1018_dropdownMenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pub_nav_1018_dropdownItem {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
    padding: 10px 12px;
    text-decoration: none;
    color: var(--text, #18181b);
    border-radius: var(--radius-md, 6px);
    transition: background-color 0.15s ease;
}

.pub_nav_1018_dropdownItem:hover {
    background-color: var(--bg, #fdf4ff);
}

.pub_nav_1018_subIcon {
    font-size: var(--fs-xl, 20px);
    color: var(--accent, #ff5277);
}

.pub_nav_1018_subContent {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_subTitle {
    font-weight: 700;
    font-size: var(--fs-sm, 14px);
}

.pub_nav_1018_subDesc {
    font-size: var(--fs-xs, 12px);
    color: var(--text-muted, #71717a);
}

/* ── CTA Button & Actions ───────────────────────────────────────────────── */
.pub_nav_1018_actionsWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_ctaBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: var(--cta-bg, var(--accent, #ff5277));
    color: var(--cta-text, #ffffff);
    font-weight: 800;
    font-size: var(--fs-sm, 14px);
    text-decoration: none;
    border: 2px solid var(--border, #000000);

    border-radius: var(--radius-lg, 8px);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
}

.pub_nav_1018_ctaBtn:hover {
    transform: translate(-2px, -2px);

}

.pub_nav_1018_ctaBtn:active {
    transform: translate(1px, 1px);

}

/* ── Hamburger Trigger ─────────────────────────────────────────────────── */
.pub_nav_1018_hamburgerBtn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-lg, 8px);
    font-size: var(--fs-2xl, 22px);
    cursor: pointer;
    box-shadow: 2px 2px 0px var(--border, #000000);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_nav_1018_hamburgerBtn:hover {
    transform: translate(-1px, -1px);
    box-shadow: 3px 3px 0px var(--border, #000000);
}

.pub_nav_1018_hamburgerBtn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0px var(--border, #000000);
}

/* ── Mobile Drawer ─────────────────────────────────────────────────────── */
.pub_nav_1018_mobileDrawer {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background-color: var(--nav-bg, #ffffff);
    border-left: 3px solid var(--border, #000000);

    z-index: var(--z-drawer, 200); /* Elevate mobile drawer over page overlay */
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pub_nav_1018_mobileDrawer[data-open="true"] {
    transform: translateX(0);
}

.pub_nav_1018_drawerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid var(--border, #000000);
}

.pub_nav_1018_closeBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-md, 6px);
    font-size: var(--fs-xl, 20px);
    cursor: pointer;
}

.pub_nav_1018_drawerBody {
    padding: var(--space-card-padding, 24px);
    display: flex;
    flex-direction: column;
gap: var(--space-gap, 24px);
    overflow-y: auto;
}

.pub_nav_1018_mobileLinks {
    display: flex;
    flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_mobileNavItem {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_mobileNavLink {
    font-weight: 800;
    font-size: var(--fs-lg, 18px);
    color: var(--text, #18181b);
    text-decoration: none;
    padding: 8px 0;
}

.pub_nav_1018_mobileSubList {
    display: flex;
    flex-direction: column;
    gap: var(--space-content-gap, 6px);
    padding-left: 14px;
    border-left: 2px solid var(--border, #000000);
    margin-top: 4px;
}

.pub_nav_1018_mobileSubLink {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
    font-size: var(--fs-sm, 14px);
    color: var(--text-muted, #71717a);
    text-decoration: none;
    padding: 4px 0;
}

.pub_nav_1018_mobileCtaWrap {
    margin-top: auto;
    display: flex;
}

.pub_nav_1018_mobileCtaWrap .pub_nav_1018_ctaBtn {
    width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.pub_nav_1018_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--overlay-bg, rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(4px);
    z-index: var(--z-overlay, 150); /* Layer backdrop behind drawer and above content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pub_nav_1018_overlay[data-open="true"] {
    opacity: 1;
    visibility: visible;
}

/* ── Page Builder Mode Guard Overrides ──────────────────────────────────── */
.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_navbar {
    z-index: var(--z-builder-nav, 10); /* Guard z-index in page builder canvas mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_dropdownMenu {
    z-index: var(--z-builder-dropdown, 15); /* Guard z-index for dropdown in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_mobileDrawer {
    z-index: var(--z-builder-drawer, 20); /* Guard z-index for drawer in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_overlay {
    z-index: var(--z-builder-overlay, 15); /* Guard z-index for overlay in page builder mode */
}

/* ── Responsive Layout ──────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .pub_nav_1018_navLinksWrap {
        display: none;
    }

    .pub_nav_1018_actionsWrap .pub_nav_1018_ctaBtn {
        display: none;
    }

    .pub_nav_1018_hamburgerBtn {
        display: flex;
    }
}


/* PUB-SERVICE-1018 Interactive Terminal Neobrutalist CSS */

.pub_service_1018_servicesSection {
  --srv-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --srv-card-bg: var(--card-bg, #ffffff);
  --srv-terminal-bg: var(--terminal-bg, #0f172a);
  --srv-text: var(--text, #0f172a);
  --srv-muted: var(--text-muted, #475569);
  --srv-accent: var(--accent, #f59e0b);
  --srv-border: var(--border, #000000);
  --srv-cta-bg: var(--cta-bg, #f59e0b);
  --srv-cta-text: var(--cta-text, #000000);

  background-color: var(--srv-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--srv-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_service_1018_servicesSection,
[data-theme="dark"] .pub_service_1018_servicesSection {
  --srv-bg: var(--bg, #0f172a);
  --srv-card-bg: var(--card-bg, #1e293b);
  --srv-terminal-bg: var(--terminal-bg, #020617);
  --srv-text: var(--text, #f8fafc);
  --srv-muted: var(--text-muted, #94a3b8);
  --srv-accent: var(--accent, #f59e0b);
  --srv-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_service_1018_servicesSection,
[data-theme="neon"] .pub_service_1018_servicesSection {
  --srv-bg: var(--bg, #09090b);
  --srv-card-bg: var(--card-bg, #121214);
  --srv-terminal-bg: var(--terminal-bg, #000000);
  --srv-text: var(--text, #ccff00);
  --srv-muted: var(--text-muted, #a3e635);
  --srv-accent: var(--accent, #ff007f);
  --srv-border: var(--border, #ccff00);
}

.pub_service_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_service_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_service_1018_badge {
  display: inline-block;
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--srv-border, #000000);

  margin-bottom: 16px;
}

.pub_service_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--srv-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Terminal Outer Window Container */
.pub_service_1018_terminalContainer {
  background-color: var(--srv-card-bg, #ffffff);
  border: 4px solid var(--srv-border, #000000);

  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Window Title Bar */
.pub_service_1018_titleBar {
  background-color: var(--srv-border, #000000);
  color: var(--srv-card-bg, #ffffff);
  padding: 12px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 3px solid var(--srv-border, #000000);
}

.pub_service_1018_dotsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
}

.pub_service_1018_dot {
  width: 12px;
  height: 12px;
  border-radius: var(--radius-full, 50%);
  border: 1px solid var(--srv-border, #000000);
  display: inline-block;
}

.pub_service_1018_dotRed {
  background-color: var(--dot-red, #ef4444);
}

.pub_service_1018_dotYellow {
  background-color: var(--srv-accent, #f59e0b);
}

.pub_service_1018_dotGreen {
  background-color: var(--status-green, #22c55e);
}

.pub_service_1018_terminalTitle {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  letter-spacing: var(--tracking, 0.04em);
}

.pub_service_1018_cliTag {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  padding: 2px 8px;
  border: 1px solid var(--srv-border, #000000);
}

/* Terminal Body Grid */
.pub_service_1018_terminalBody {
  display: grid;
  grid-template-columns: 340px 1fr;
  min-height: 480px;
}

/* Left Sidebar: Command Selectors */
.pub_service_1018_commandSidebar {
  background-color: var(--srv-card-bg, #ffffff);
  border-right: 3px solid var(--srv-border, #000000);
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
}

.pub_service_1018_commandHeader {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--srv-muted, #475569);
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px dashed var(--srv-border, #000000);
}

.pub_service_1018_commandList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_service_1018_commandBtn {
  background-color: var(--srv-bg, #fdf4ff);
  color: var(--srv-text, #0f172a);
  border: 3px solid var(--srv-border, #000000);

  padding: 12px 14px;
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  text-align: left;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_service_1018_commandBtn:hover {
  transform: translate(-1px, -1px);

  background-color: var(--srv-card-bg, #ffffff);
}

.pub_service_1018_commandBtnActive {
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);

}

.pub_service_1018_promptSymbol {
  color: var(--status-green, #22c55e);
  font-weight: 900;
  margin-right: 8px;
}

.pub_service_1018_commandBtnActive .pub_service_1018_promptSymbol {
  color: var(--srv-border, #000000);
}

.pub_service_1018_commandText {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Right Output Console Panel */
.pub_service_1018_outputConsole {
  background-color: var(--srv-terminal-bg, #0f172a);
  color: var(--console-text, #f8fafc);
  padding: 36px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.pub_service_1018_consoleContent {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.pub_service_1018_consoleHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--translucent-border, rgba(255, 255, 255, 0.15));
}

.pub_service_1018_serviceTitleGroup {
  display: flex;
  align-items: center;
  gap: 14px;
}

.pub_service_1018_serviceIcon {
  color: var(--srv-accent, #f59e0b);
}

.pub_service_1018_serviceTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--srv-card-bg, #ffffff);
  margin: 0;
}

.pub_service_1018_priceBadge {
  background-color: var(--srv-accent, #f59e0b);
  color: var(--srv-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 6px 14px;
  border: 2px solid var(--srv-border, #000000);

}

.pub_service_1018_cmdExecutingRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, monospace, sans-serif);
  margin-bottom: 20px;
  background-color: var(--translucent-bg, rgba(255, 255, 255, 0.05));
  padding: 10px 14px;
  border-left: 4px solid var(--srv-accent, #f59e0b);
}

.pub_service_1018_promptGreen {
  color: var(--status-green, #22c55e);
  font-weight: 700;
}

.pub_service_1018_executingCmd {
  color: var(--code-cyan, #38bdf8);
  font-weight: 600;
}

.pub_service_1018_blinkingCursor {
  display: inline-block;
  width: 8px;
  height: 16px;
  background-color: var(--srv-accent, #f59e0b);
  animation: pub_service_1018_blink 1s infinite;
}

@keyframes pub_service_1018_blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

.pub_service_1018_serviceDescription {
  line-height: var(--leading, 1.6);
  color: var(--srv-muted, #94a3b8);
  margin: 0 0 24px 0;
}

/* Features List */
.pub_service_1018_featuresBox {
  margin-bottom: 24px;
}

.pub_service_1018_featuresHeading {
  display: block;
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--srv-accent, #f59e0b);
  letter-spacing: var(--tracking, 0.08em);
  margin-bottom: 12px;
}

.pub_service_1018_featuresList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--space-content-gap, 10px);
}

.pub_service_1018_featureItem {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  color: var(--feat-text, #e2e8f0);
}

.pub_service_1018_featureItem i {
  color: var(--status-green, #22c55e);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Tags Row */
.pub_service_1018_tagsRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 10px);
  margin-bottom: 32px;
}

.pub_service_1018_tagBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  background-color: var(--translucent-tag, rgba(255, 255, 255, 0.08));
  color: var(--code-cyan, #38bdf8);
  padding: 4px 10px;
  border: 1px solid var(--translucent-border, rgba(255, 255, 255, 0.15));
}

/* CTA Row */
.pub_service_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-top: auto;
}

.pub_service_1018_primaryBtn {
  background-color: var(--srv-cta-bg, #f59e0b);
  color: var(--srv-cta-text, #000000);
  border: 3px solid var(--srv-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_service_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_service_1018_secondaryBtn {
  background-color: var(--srv-card-bg, #ffffff);
  color: var(--srv-text, #0f172a);
  border: 3px solid var(--srv-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_service_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--srv-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_service_1018_terminalBody {
    grid-template-columns: 1fr;
  }

  .pub_service_1018_commandSidebar {
    border-right: none;
    border-bottom: 3px solid var(--srv-border, #000000);
  }

  .pub_service_1018_outputConsole {
    padding: var(--space-card-padding, 24px);
  }
}

@media (max-width: 640px) {
  .pub_service_1018_servicesSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_service_1018_header {
    margin-bottom: 28px;
  }

  .pub_service_1018_featuresList {
    grid-template-columns: 1fr;
  }

  .pub_service_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_service_1018_primaryBtn,
  .pub_service_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}


/* PUB-MENU-1018 Expanding Accordion Package Menu CSS */

.pub_menu_1018_menuSection {
  --mnu-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --mnu-card-bg: var(--card-bg, #ffffff);
  --mnu-text: var(--text, #0f172a);
  --mnu-muted: var(--text-muted, #475569);
  --mnu-accent: var(--accent, #ec4899);
  --mnu-border: var(--border, #000000);
  --mnu-cta-bg: var(--cta-bg, #000000);
  --mnu-cta-text: var(--cta-text, #ffffff);

  background-color: var(--mnu-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--mnu-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_menu_1018_menuSection,
[data-theme="dark"] .pub_menu_1018_menuSection {
  --mnu-bg: var(--bg, #0f172a);
  --mnu-card-bg: var(--card-bg, #1e293b);
  --mnu-text: var(--text, #f8fafc);
  --mnu-muted: var(--text-muted, #94a3b8);
  --mnu-accent: var(--accent, #ec4899);
  --mnu-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_menu_1018_menuSection,
[data-theme="neon"] .pub_menu_1018_menuSection {
  --mnu-bg: var(--bg, #09090b);
  --mnu-card-bg: var(--card-bg, #121214);
  --mnu-text: var(--text, #ccff00);
  --mnu-muted: var(--text-muted, #a3e635);
  --mnu-accent: var(--accent, #ff007f);
  --mnu-border: var(--border, #ccff00);
}

.pub_menu_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_menu_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_menu_1018_badge {
  display: inline-block;
  background-color: var(--mnu-accent, #ec4899);
  color: var(--mnu-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--mnu-border, #000000);

  margin-bottom: 16px;
}

.pub_menu_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--mnu-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Accordion List Container */
.pub_menu_1018_accordionList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 20px);
  margin-bottom: 48px;
}

/* Accordion Card */
.pub_menu_1018_accordionCard {
  background-color: var(--mnu-card-bg, #ffffff);
  border: 3px solid var(--mnu-border, #000000);

  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_menu_1018_accordionCard:hover {
  transform: translate(-2px, -2px);

}

/* Accordion Card Header Row */
.pub_menu_1018_cardHeader {
  padding: 22px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  user-select: none;
  background-color: var(--mnu-card-bg, #ffffff);
  transition: background-color 0.2s ease;
}

.pub_menu_1018_cardHeader:hover {
  background-color: var(--mnu-bg, #fdf4ff);
}

.pub_menu_1018_headerMetaGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 4px);
  flex: 1;
}

.pub_menu_1018_categoryBadge {
  display: inline-block;
  align-self: flex-start;
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--mnu-accent, #ec4899);
  color: var(--mnu-card-bg, #ffffff);
  padding: 3px 8px;
  border: 2px solid var(--mnu-border, #000000);

  margin-bottom: 4px;
}

.pub_menu_1018_packageTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--mnu-text, #0f172a);
  margin: 0;
}

.pub_menu_1018_packageTagline {
  color: var(--mnu-muted, #475569);
  font-weight: 500;
}

.pub_menu_1018_headerRightGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  margin-left: 20px;
}

.pub_menu_1018_turnaroundBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 6px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--mnu-bg, #fdf4ff);
  color: var(--mnu-text, #0f172a);
  padding: 6px 12px;
  border: 2px solid var(--mnu-border, #000000);
}

.pub_menu_1018_priceBadge {
  background-color: var(--mnu-border, #000000);
  color: var(--mnu-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 6px 16px;
  border: 2px solid var(--mnu-border, #000000);

}

.pub_menu_1018_toggleIconBtn {
  width: 38px;
  height: 38px;
  border: 2px solid var(--mnu-border, #000000);

  background-color: var(--mnu-card-bg, #ffffff);
  color: var(--mnu-text, #0f172a);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease;
}

/* Accordion Open / Closed State */
.pub_menu_1018_accordionCard[data-open="true"] .pub_menu_1018_cardBody {
  display: block;
}

.pub_menu_1018_accordionCard[data-open="false"] .pub_menu_1018_cardBody {
  display: none;
}

.pub_menu_1018_accordionCard[data-open="true"] .pub_menu_1018_toggleIconBtn {
  transform: rotate(45deg);
  background-color: var(--mnu-accent, #ec4899);
  color: var(--mnu-card-bg, #ffffff);
}

/* Expanding Body Panel */
.pub_menu_1018_cardBody {
  border-top: 3px solid var(--mnu-border, #000000);
  background-color: var(--mnu-card-bg, #ffffff);
}

.pub_menu_1018_bodyContent {
  padding: 24px 28px;
}

.pub_menu_1018_scopeSection {
  margin-bottom: 24px;
}

.pub_menu_1018_scopeHeading {
  display: block;
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--mnu-accent, #ec4899);
  letter-spacing: var(--tracking, 0.08em);
  margin-bottom: 12px;
}

.pub_menu_1018_deliverablesList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 12px);
}

.pub_menu_1018_deliverableItem {
  display: flex;
  align-items: flex-start;
  gap: var(--space-content-gap, 10px);
  line-height: var(--leading, 1.5);
  color: var(--mnu-text, #0f172a);
  font-weight: 600;
}

.pub_menu_1018_deliverableItem i {
  color: var(--mnu-accent, #ec4899);
  flex-shrink: 0;
  margin-top: 2px;
}

/* Footer Row inside Body */
.pub_menu_1018_footerRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  padding-top: 18px;
  border-top: 2px dashed var(--mnu-border, #000000);
}

.pub_menu_1018_tagsGroup {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 8px);
}

.pub_menu_1018_tagPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--mnu-bg, #fdf4ff);
  color: var(--mnu-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--mnu-border, #000000);
}

.pub_menu_1018_packageCtaBtn {
  background-color: var(--mnu-accent, #ec4899);
  color: var(--mnu-card-bg, #ffffff);
  border: 2px solid var(--mnu-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 10px 20px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_menu_1018_packageCtaBtn:hover {
  transform: translate(-1px, -1px);

}

/* Section Bottom CTA Row */
.pub_menu_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_menu_1018_primaryBtn {
  background-color: var(--mnu-cta-bg, #000000);
  color: var(--mnu-cta-text, #ffffff);
  border: 3px solid var(--mnu-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_menu_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_menu_1018_secondaryBtn {
  background-color: var(--mnu-card-bg, #ffffff);
  color: var(--mnu-text, #0f172a);
  border: 3px solid var(--mnu-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_menu_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--mnu-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_menu_1018_deliverablesList {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .pub_menu_1018_cardHeader {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-content-gap, 16px);
  }

  .pub_menu_1018_headerRightGroup {
    margin-left: 0;
    width: 100%;
    justify-content: space-between;
  }
}

@media (max-width: 640px) {
  .pub_menu_1018_menuSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_menu_1018_cardHeader {
    padding: 18px 20px;
  }

  .pub_menu_1018_bodyContent {
    padding: 18px 20px;
  }

  .pub_menu_1018_footerRow {
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_menu_1018_packageCtaBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }

  .pub_menu_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_menu_1018_primaryBtn,
  .pub_menu_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}


/* PUB-TESTIMONIAL-1018 Neobrutalist Quote Cards CSS */

.pub_testimonial_1018_testimonialSection {
  --tst-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --tst-card-bg: var(--card-bg, #ffffff);
  --tst-text: var(--text, #0f172a);
  --tst-muted: var(--text-muted, #475569);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #000000);

  background-color: var(--tst-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--tst-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_testimonial_1018_testimonialSection,
[data-theme="dark"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #0f172a);
  --tst-card-bg: var(--card-bg, #1e293b);
  --tst-text: var(--text, #f8fafc);
  --tst-muted: var(--text-muted, #94a3b8);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_testimonial_1018_testimonialSection,
[data-theme="neon"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #09090b);
  --tst-card-bg: var(--card-bg, #121214);
  --tst-text: var(--text, #ccff00);
  --tst-muted: var(--text-muted, #a3e635);
  --tst-accent: var(--accent, #ff007f);
  --tst-border: var(--border, #ccff00);
}

.pub_testimonial_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_testimonial_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_testimonial_1018_badge {
  display: inline-block;
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--tst-border, #000000);

  margin-bottom: 16px;
}

.pub_testimonial_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--tst-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Testimonial Cards Grid */
.pub_testimonial_1018_testimonialGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: stretch;
}

/* Quote Card */
.pub_testimonial_1018_quoteCard {
  background-color: var(--tst-card-bg, #ffffff);
  border: 3px solid var(--tst-border, #000000);

  padding: 28px;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_testimonial_1018_quoteCard:hover {
  transform: translate(-3px, -3px);

}

/* Top Card Header Row */
.pub_testimonial_1018_cardHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.pub_testimonial_1018_quoteIconBadge {
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  width: 40px;
  height: 40px;
  border: 2px solid var(--tst-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
}

.pub_testimonial_1018_tagBadge {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--tst-bg, #fdf4ff);
  color: var(--tst-border, #000000);
  padding: 4px 10px;
  border: 2px solid var(--tst-border, #000000);
}

/* Star Rating Row */
.pub_testimonial_1018_starsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 4px);
  margin-bottom: 16px;
}

.pub_testimonial_1018_starIcon {
  color: var(--tst-accent, #f59e0b);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Quote Paragraph */
.pub_testimonial_1018_quoteText {
  line-height: var(--leading, 1.6);
  color: var(--tst-text, #0f172a);
  font-style: italic;
  margin: 0 0 24px 0;
  flex: 1;
}

/* Author Row */
.pub_testimonial_1018_authorRow {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 16px;
  border-top: 2px dashed var(--tst-border, #000000);
  margin-top: auto;
}

.pub_testimonial_1018_avatarImage {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--tst-border, #000000);

  object-fit: cover;
}

.pub_testimonial_1018_authorMeta {
  display: flex;
  flex-direction: column;
}

.pub_testimonial_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--tst-text, #0f172a);
  margin: 0 0 2px 0;
}

.pub_testimonial_1018_authorTitle {
  font-weight: 600;
  color: var(--tst-muted, #475569);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }
}

@media (max-width: 640px) {
  .pub_testimonial_1018_testimonialSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_testimonial_1018_header {
    margin-bottom: 28px;
  }

  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_testimonial_1018_quoteCard {
    padding: 20px;
  }
}


/* PUB-CTA-1018 Neobrutalist Availability Status CTA CSS */

.pub_cta_1018_ctaSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_cta_1018_ctaSection,
[data-theme="dark"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_cta_1018_ctaSection,
[data-theme="neon"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_cta_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Neobrutalist CTA Card */
.pub_cta_1018_ctaCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Status Header Bar */
.pub_cta_1018_topBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-bottom: 3px solid var(--sec-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_cta_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--sec-accent, #ec4899);
  border: 1px solid var(--sec-border, #000000);
  animation: pub_cta_1018_pulse 1.5s infinite;
}

@keyframes pub_cta_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_cta_1018_statusLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

/* Card Body Content */
.pub_cta_1018_cardBody {
  padding: clamp(32px, 4vw, 48px) clamp(24px, 3vw, 40px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
gap: var(--space-content-gap, 20px);
  background-color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--sec-text, #0f172a);
  margin: 0;
  max-width: 860px;
}

.pub_cta_1018_subtitle {
  line-height: var(--leading, 1.6);
  color: var(--sec-muted, #475569);
  margin: 0;
  max-width: 720px;
}

/* Button Row */
.pub_cta_1018_btnRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
  padding-top: 12px;
}

.pub_cta_1018_primaryBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_cta_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_secondaryBtn {
  background-color: var(--sec-card-bg, #ffffff);
  color: var(--sec-text, #0f172a);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_cta_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
}

/* Bottom Timezone Clock Bar */
.pub_cta_1018_bottomBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-top: 3px solid var(--sec-border, #000000);
  padding: 14px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-content-gap, 16px);
}

.pub_cta_1018_timezoneGroup,
.pub_cta_1018_clockGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

.pub_cta_1018_timezoneGroup i,
.pub_cta_1018_clockGroup i {
  color: var(--sec-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 640px) {
  .pub_cta_1018_ctaSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_cta_1018_cardBody {
    padding: 32px 24px;
  }

  .pub_cta_1018_btnRow {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .pub_cta_1018_primaryBtn,
  .pub_cta_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_cta_1018_bottomBar {
    padding: 14px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-content-gap, 8px);
  }
}


/* PUB-FOOTER-1018 Floating macOS Dock Footer CSS */

.pub_footer_1018_footerSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_footer_1018_footerSection,
[data-theme="dark"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_footer_1018_footerSection,
[data-theme="neon"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_footer_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Main Neobrutalist Footer Card */
.pub_footer_1018_footerCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Header Bar */
.pub_footer_1018_topHeader {
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-gap, 24px);
  flex-wrap: wrap;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_brandGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_footer_1018_brandBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--sec-bg, #fdf4ff);
  padding: 8px 16px;
  border: 3px solid var(--sec-border, #000000);

}

.pub_footer_1018_brandTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--sec-text, #0f172a);
}

.pub_footer_1018_brandSub {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_taglineText {
  color: var(--sec-muted, #475569);
  margin: 0;
  font-weight: 500;
}

/* Navigation Bar */
.pub_footer_1018_navBar {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_navLink {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 6px 12px;
  border: 2px solid transparent;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_navLink:hover {
  border-color: var(--sec-border, #000000);
  background-color: var(--sec-bg, #fdf4ff);
}

/* Floating macOS Dock Section */
.pub_footer_1018_dockWrapper {
  padding: 40px 24px;
  background-color: var(--sec-bg, #fdf4ff);
  display: flex;
  justify-content: center;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_macDock {
  background-color: var(--sec-card-bg, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  flex-wrap: wrap;
  justify-content: center;
}

.pub_footer_1018_dockPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 8px 14px;
  background-color: var(--sec-bg, #fdf4ff);
  border: 2px solid var(--sec-border, #000000);
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_footer_1018_dockPill i {
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_dockPill:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_footer_1018_dockPill:hover i {
  color: var(--sec-card-bg, #ffffff);
}

/* Bottom Legal Bar */
.pub_footer_1018_bottomBar {
  padding: var(--space-card-padding, 24px) 40px;
  background-color: var(--sec-card-bg, #ffffff);
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
}

.pub_footer_1018_legalGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_copyrightText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--sec-muted, #475569);
}

.pub_footer_1018_statusBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--sec-border, #000000);
}

.pub_footer_1018_backToTopBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 8px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_backToTopBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

/* Responsive Styles */
@media (max-width: 768px) {
  .pub_footer_1018_topHeader {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
  }

  .pub_footer_1018_bottomBar {
    padding: 20px 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_footer_1018_backToTopBtn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pub_footer_1018_footerSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_footer_1018_dockWrapper {
    padding: 24px 16px;
  }

  .pub_footer_1018_macDock {
    width: 100%;
    box-sizing: border-box;
  }

  .pub_footer_1018_dockPill {
    flex: 1;
    justify-content: center;
  }
}


/* Page: work */
/* ==========================================================================
   PUB-NAV-1018 — Neobrutalism Navbar
   ========================================================================== */

.pub_nav_1018_rootWrapper {
    position: relative;
    width: 100%;
    background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
    color: var(--text, #18181b);
    font-family: var(--font-body, system-ui, -apple-system, sans-serif);
    padding-top: var(--pt, 16px);
    padding-bottom: var(--pb, 16px);
    transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* ── Main Navbar Container ──────────────────────────────────────────────── */
.pub_nav_1018_navbar {
    position: var(--navbar-position, sticky);
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-navbar, 100); /* Layer navbar above standard page content */
}

.pub_nav_1018_container {
    max-width: var(--max-w, 1240px);
    height: var(--nav-h, 76px);
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-lg, 12px);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ── Brand Logo ─────────────────────────────────────────────────────────── */
.pub_nav_1018_brandWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_logoBlock {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 10px);
    text-decoration: none;
    color: var(--text, #18181b);
}

.pub_nav_1018_logoMark {
    font-size: var(--fs-2xl, 24px);
    color: var(--accent, #ff5277);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub_nav_1018_logoWord {
    font-family: var(--font-heading, var(--font-body, system-ui, sans-serif));
    font-weight: 800;
    font-size: var(--fs-xl, 20px);
    letter-spacing: var(--tracking, -0.02em);
    color: var(--text, #18181b);
}

.pub_nav_1018_logoImage {
    max-height: 42px;
    object-fit: contain;
}

/* ── Desktop Navigation Links ───────────────────────────────────────────── */
.pub_nav_1018_navLinksWrap {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
}

.pub_nav_1018_navItem {
    position: relative;
}

.pub_nav_1018_navLink {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    font-weight: 700;
    font-size: var(--fs-md, 15px);
    color: var(--text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-lg, 8px);
    border: 2px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pub_nav_1018_navLink:hover {
    background-color: var(--bg, #fdf4ff);
    border-color: var(--border, #000000);
    transform: translateY(-2px);
}

/* ── Dropdown Sub-menu ─────────────────────────────────────────────────── */
.pub_nav_1018_dropdownMenu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-md, 10px);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: var(--z-dropdown, 110); /* Layer dropdown above navbar container */
}

.pub_nav_1018_dropdownMenu[data-open="true"],
.pub_nav_1018_navItem:hover .pub_nav_1018_dropdownMenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pub_nav_1018_dropdownItem {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
    padding: 10px 12px;
    text-decoration: none;
    color: var(--text, #18181b);
    border-radius: var(--radius-md, 6px);
    transition: background-color 0.15s ease;
}

.pub_nav_1018_dropdownItem:hover {
    background-color: var(--bg, #fdf4ff);
}

.pub_nav_1018_subIcon {
    font-size: var(--fs-xl, 20px);
    color: var(--accent, #ff5277);
}

.pub_nav_1018_subContent {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_subTitle {
    font-weight: 700;
    font-size: var(--fs-sm, 14px);
}

.pub_nav_1018_subDesc {
    font-size: var(--fs-xs, 12px);
    color: var(--text-muted, #71717a);
}

/* ── CTA Button & Actions ───────────────────────────────────────────────── */
.pub_nav_1018_actionsWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_ctaBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: var(--cta-bg, var(--accent, #ff5277));
    color: var(--cta-text, #ffffff);
    font-weight: 800;
    font-size: var(--fs-sm, 14px);
    text-decoration: none;
    border: 2px solid var(--border, #000000);

    border-radius: var(--radius-lg, 8px);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
}

.pub_nav_1018_ctaBtn:hover {
    transform: translate(-2px, -2px);

}

.pub_nav_1018_ctaBtn:active {
    transform: translate(1px, 1px);

}

/* ── Hamburger Trigger ─────────────────────────────────────────────────── */
.pub_nav_1018_hamburgerBtn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-lg, 8px);
    font-size: var(--fs-2xl, 22px);
    cursor: pointer;
    box-shadow: 2px 2px 0px var(--border, #000000);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_nav_1018_hamburgerBtn:hover {
    transform: translate(-1px, -1px);
    box-shadow: 3px 3px 0px var(--border, #000000);
}

.pub_nav_1018_hamburgerBtn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0px var(--border, #000000);
}

/* ── Mobile Drawer ─────────────────────────────────────────────────────── */
.pub_nav_1018_mobileDrawer {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background-color: var(--nav-bg, #ffffff);
    border-left: 3px solid var(--border, #000000);

    z-index: var(--z-drawer, 200); /* Elevate mobile drawer over page overlay */
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pub_nav_1018_mobileDrawer[data-open="true"] {
    transform: translateX(0);
}

.pub_nav_1018_drawerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid var(--border, #000000);
}

.pub_nav_1018_closeBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-md, 6px);
    font-size: var(--fs-xl, 20px);
    cursor: pointer;
}

.pub_nav_1018_drawerBody {
    padding: var(--space-card-padding, 24px);
    display: flex;
    flex-direction: column;
gap: var(--space-gap, 24px);
    overflow-y: auto;
}

.pub_nav_1018_mobileLinks {
    display: flex;
    flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_mobileNavItem {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_mobileNavLink {
    font-weight: 800;
    font-size: var(--fs-lg, 18px);
    color: var(--text, #18181b);
    text-decoration: none;
    padding: 8px 0;
}

.pub_nav_1018_mobileSubList {
    display: flex;
    flex-direction: column;
    gap: var(--space-content-gap, 6px);
    padding-left: 14px;
    border-left: 2px solid var(--border, #000000);
    margin-top: 4px;
}

.pub_nav_1018_mobileSubLink {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
    font-size: var(--fs-sm, 14px);
    color: var(--text-muted, #71717a);
    text-decoration: none;
    padding: 4px 0;
}

.pub_nav_1018_mobileCtaWrap {
    margin-top: auto;
    display: flex;
}

.pub_nav_1018_mobileCtaWrap .pub_nav_1018_ctaBtn {
    width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.pub_nav_1018_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--overlay-bg, rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(4px);
    z-index: var(--z-overlay, 150); /* Layer backdrop behind drawer and above content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pub_nav_1018_overlay[data-open="true"] {
    opacity: 1;
    visibility: visible;
}

/* ── Page Builder Mode Guard Overrides ──────────────────────────────────── */
.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_navbar {
    z-index: var(--z-builder-nav, 10); /* Guard z-index in page builder canvas mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_dropdownMenu {
    z-index: var(--z-builder-dropdown, 15); /* Guard z-index for dropdown in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_mobileDrawer {
    z-index: var(--z-builder-drawer, 20); /* Guard z-index for drawer in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_overlay {
    z-index: var(--z-builder-overlay, 15); /* Guard z-index for overlay in page builder mode */
}

/* ── Responsive Layout ──────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .pub_nav_1018_navLinksWrap {
        display: none;
    }

    .pub_nav_1018_actionsWrap .pub_nav_1018_ctaBtn {
        display: none;
    }

    .pub_nav_1018_hamburgerBtn {
        display: flex;
    }
}


/* PUB-GALLERY-1018 Massive Masonry Spotlight CSS */

.pub_gallery_1018_gallerySection {
  --gal-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --gal-card-bg: var(--card-bg, #ffffff);
  --gal-text: var(--text, #0f172a);
  --gal-muted: var(--text-muted, #475569);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #000000);
  --gal-cta-bg: var(--cta-bg, #000000);
  --gal-cta-text: var(--cta-text, #ffffff);

  background-color: var(--gal-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--gal-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_gallery_1018_gallerySection,
[data-theme="dark"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #0f172a);
  --gal-card-bg: var(--card-bg, #1e293b);
  --gal-text: var(--text, #f8fafc);
  --gal-muted: var(--text-muted, #94a3b8);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_gallery_1018_gallerySection,
[data-theme="neon"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #09090b);
  --gal-card-bg: var(--card-bg, #121214);
  --gal-text: var(--text, #ccff00);
  --gal-muted: var(--text-muted, #a3e635);
  --gal-accent: var(--accent, #ff007f);
  --gal-border: var(--border, #ccff00);
}

.pub_gallery_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_gallery_1018_header {
  margin-bottom: 32px;
  text-align: left;
}

.pub_gallery_1018_badge {
  display: inline-block;
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--gal-border, #000000);

  margin-bottom: 16px;
}

.pub_gallery_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--gal-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Category Filter Tabs Bar */
.pub_gallery_1018_filterBar {
  display: flex;
  flex-wrap: wrap;
gap: var(--space-content-gap, 12px);
  margin-bottom: 40px;
}

.pub_gallery_1018_filterTab {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 8px 18px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_gallery_1018_filterTab:hover {
  transform: translate(-1px, -1px);

}

.pub_gallery_1018_filterTabActive {
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);

}

/* Masonry Grid Layout */
.pub_gallery_1018_masonryGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: start;
  margin-bottom: 48px;
  transition: opacity 0.25s ease;
}

/* Individual Artwork Card */
.pub_gallery_1018_artCard {
  background-color: var(--gal-card-bg, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease, filter 0.25s ease;
}

.pub_gallery_1018_artCard:hover {
  transform: translate(-3px, -3px);

}

/* Spotlight Dimming Effect */
.pub_gallery_1018_masonryGrid[data-spotlight-active="true"] .pub_gallery_1018_artCard:not([data-spotlight-hover="true"]) {
  opacity: 0.35;
  filter: grayscale(50%);
}

.pub_gallery_1018_cardVertical {
  grid-row: span 2;
}

.pub_gallery_1018_cardHorizontal {
  grid-column: span 2;
}

.pub_gallery_1018_cardSquare {
  grid-row: span 1;
}

.pub_gallery_1018_cardInnerLink {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Image Container */
.pub_gallery_1018_imageWrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--gal-border, #000000);
}

.pub_gallery_1018_cardVertical .pub_gallery_1018_imageWrapper {
  padding-bottom: 125%;
}

.pub_gallery_1018_cardHorizontal .pub_gallery_1018_imageWrapper {
  padding-bottom: 50%;
}

.pub_gallery_1018_cardSquare .pub_gallery_1018_imageWrapper {
  padding-bottom: 85%;
}

/* Base artwork image layer (z-index 1) */
.pub_gallery_1018_artImage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: var(--z-base, 1);
  /* Base layer - image */
  transition: transform 0.4s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_artImage {
  transform: scale(1.05);
}

/* Dark hover overlay layer above image (z-index 2) */
.pub_gallery_1018_imageOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--gal-border, #000000);
  opacity: 0;
  z-index: var(--z-above, 2);
  /* Above image layer */
  transition: opacity 0.25s ease;
  pointer-events: none;
    box-shadow: var(--shadow-sm, none);
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_imageOverlay {
  opacity: 0.15;
}

/* Category Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_categoryBadge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay */
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  padding: 4px 10px;
  border: 2px solid var(--gal-border, #000000);

}

/* Zoom Arrow Action Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_zoomBadge {
  position: absolute;
  bottom: 14px;
  right: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay layers */
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-border, #000000);
  width: 38px;
  height: 38px;
  border: 2px solid var(--gal-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_zoomBadge {
  transform: translate(-2px, -2px);
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
}

/* Card Metadata Caption Bar */
.pub_gallery_1018_cardMetaBar {
  padding: 18px 20px;
  background-color: var(--gal-card-bg, #ffffff);
  border-top: 3px solid var(--gal-border, #000000);
}

.pub_gallery_1018_artTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--gal-text, #0f172a);
  margin: 0 0 4px 0;
}

.pub_gallery_1018_artCaption {
  font-weight: 600;
  color: var(--gal-muted, #475569);
}

/* CTA Row */
.pub_gallery_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_gallery_1018_primaryBtn {
  background-color: var(--gal-cta-bg, #000000);
  color: var(--gal-cta-text, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_gallery_1018_secondaryBtn {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--gal-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_gallery_1018_masonryGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardHorizontal {
    grid-column: span 1;
  }
}

@media (max-width: 640px) {
  .pub_gallery_1018_gallerySection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_gallery_1018_masonryGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardVertical {
    grid-row: span 1;
  }

  .pub_gallery_1018_filterBar {
    gap: var(--space-content-gap, 8px);
  }

  .pub_gallery_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_gallery_1018_primaryBtn,
  .pub_gallery_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-BLOG-1018 Horizontal Timeline Blog Feed CSS */

.pub_blog_1018_blogSection {
  --blg-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --blg-card-bg: var(--card-bg, #ffffff);
  --blg-text: var(--text, #0f172a);
  --blg-muted: var(--text-muted, #475569);
  --blg-accent: var(--accent, #ec4899);
  --blg-border: var(--border, #000000);
  --blg-cta-bg: var(--cta-bg, #000000);
  --blg-cta-text: var(--cta-text, #ffffff);

  background-color: var(--blg-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--blg-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_blog_1018_blogSection,
[data-theme="dark"] .pub_blog_1018_blogSection {
  --blg-bg: var(--bg, #0f172a);
  --blg-card-bg: var(--card-bg, #1e293b);
  --blg-text: var(--text, #f8fafc);
  --blg-muted: var(--text-muted, #94a3b8);
  --blg-accent: var(--accent, #ec4899);
  --blg-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_blog_1018_blogSection,
[data-theme="neon"] .pub_blog_1018_blogSection {
  --blg-bg: var(--bg, #09090b);
  --blg-card-bg: var(--card-bg, #121214);
  --blg-text: var(--text, #ccff00);
  --blg-muted: var(--text-muted, #a3e635);
  --blg-accent: var(--accent, #ff007f);
  --blg-border: var(--border, #ccff00);
}

.pub_blog_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_blog_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_blog_1018_badge {
  display: inline-block;
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--blg-border, #000000);

  margin-bottom: 16px;
}

.pub_blog_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--blg-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Timeline Feed Container */
.pub_blog_1018_timelineFeed {
  display: flex;
  flex-direction: column;
  gap: var(--space-gap, 28px);
  margin-bottom: 48px;
  position: relative;
}

.pub_blog_1018_timelineRow {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: var(--space-gap, 28px);
  align-items: start;
  position: relative;
}

/* Left Date Column & Connecting Line */
.pub_blog_1018_dateCol {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  height: 100%;
}

/* Date pill badge layer above timeline line (z-index 2) */
.pub_blog_1018_datePillBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  padding: 8px 14px;
  border: 2px solid var(--blg-border, #000000);

  z-index: var(--z-above, 2);
}

/* Background vertical connector line (z-index 1) */
.pub_blog_1018_timelineLine {
  position: absolute;
  top: 36px;
  left: 20px;
  bottom: -28px;
  width: 3px;
  background-color: var(--blg-border, #000000);
  z-index: var(--z-base, 1);
  /* Above blog card content */
}

.pub_blog_1018_timelineRow:last-child .pub_blog_1018_timelineLine {
  display: none;
}

/* Article Card */
.pub_blog_1018_articleCard {
  background-color: var(--blg-card-bg, #ffffff);
  border: 3px solid var(--blg-border, #000000);

  overflow: hidden;
  height: 215px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_blog_1018_articleCard:hover {
  transform: translate(-3px, -3px);

}

.pub_blog_1018_cardInnerLink {
  text-decoration: none;
  color: inherit;
  display: grid;
  grid-template-columns: 240px 1fr;
  height: 100%;
}

.pub_blog_1018_imageCol {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: var(--blg-border, #000000);
  border-right: 3px solid var(--blg-border, #000000);
}

.pub_blog_1018_coverImage {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_coverImage {
  transform: scale(1.06);
}

.pub_blog_1018_contentCol {
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
}

.pub_blog_1018_metaRow {
  display: flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  margin-bottom: 8px;
}

.pub_blog_1018_categoryTag {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  padding: 3px 10px;
  border: 2px solid var(--blg-border, #000000);
}

.pub_blog_1018_readTimeTag {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 6px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--blg-muted, #475569);
}

.pub_blog_1018_articleTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.25);
  color: var(--blg-text, #0f172a);
  margin: 0 0 6px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.15s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_articleTitle {
  color: var(--blg-accent, #ec4899);
}

.pub_blog_1018_articleExcerpt {
  line-height: var(--leading, 1.5);
  color: var(--blg-muted, #475569);
  margin: 0 0 12px 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pub_blog_1018_cardFooter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 2px dashed var(--blg-border, #000000);
  margin-top: auto;
}

.pub_blog_1018_authorGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_blog_1018_authorAvatar {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--blg-border, #000000);
  object-fit: cover;
}

.pub_blog_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--blg-text, #0f172a);
}

.pub_blog_1018_readBtn {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  background-color: var(--blg-border, #000000);
  color: var(--blg-card-bg, #ffffff);
  padding: 6px 14px;
  border: 2px solid var(--blg-border, #000000);

  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 6px);
  transition: transform 0.15s ease, background-color 0.15s ease;
}

.pub_blog_1018_articleCard:hover .pub_blog_1018_readBtn {
  background-color: var(--blg-accent, #ec4899);
  color: var(--blg-card-bg, #ffffff);
  transform: translate(-1px, -1px);
}

/* Section Bottom CTA Row */
.pub_blog_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_blog_1018_primaryBtn {
  background-color: var(--blg-cta-bg, #000000);
  color: var(--blg-cta-text, #ffffff);
  border: 3px solid var(--blg-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_blog_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_blog_1018_secondaryBtn {
  background-color: var(--blg-card-bg, #ffffff);
  color: var(--blg-text, #0f172a);
  border: 3px solid var(--blg-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_blog_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--blg-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_blog_1018_articleCard {
    height: auto;
  }

  .pub_blog_1018_timelineRow {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 12px);
  }

  .pub_blog_1018_timelineLine {
    display: none;
  }

  .pub_blog_1018_cardInnerLink {
    grid-template-columns: 1fr;
  }

  .pub_blog_1018_imageCol {
    min-height: 180px;
    border-right: none;
    border-bottom: 3px solid var(--blg-border, #000000);
  }
}

@media (max-width: 640px) {
  .pub_blog_1018_blogSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_blog_1018_contentCol {
    padding: 18px 20px;
  }

  .pub_blog_1018_cardFooter {
    flex-direction: column;
    align-items: flex-start;
gap: var(--space-content-gap, 12px);
  }

  .pub_blog_1018_readBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
  }

  .pub_blog_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_blog_1018_primaryBtn,
  .pub_blog_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-TESTIMONIAL-1018 Neobrutalist Quote Cards CSS */

.pub_testimonial_1018_testimonialSection {
  --tst-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --tst-card-bg: var(--card-bg, #ffffff);
  --tst-text: var(--text, #0f172a);
  --tst-muted: var(--text-muted, #475569);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #000000);

  background-color: var(--tst-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--tst-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_testimonial_1018_testimonialSection,
[data-theme="dark"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #0f172a);
  --tst-card-bg: var(--card-bg, #1e293b);
  --tst-text: var(--text, #f8fafc);
  --tst-muted: var(--text-muted, #94a3b8);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_testimonial_1018_testimonialSection,
[data-theme="neon"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #09090b);
  --tst-card-bg: var(--card-bg, #121214);
  --tst-text: var(--text, #ccff00);
  --tst-muted: var(--text-muted, #a3e635);
  --tst-accent: var(--accent, #ff007f);
  --tst-border: var(--border, #ccff00);
}

.pub_testimonial_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_testimonial_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_testimonial_1018_badge {
  display: inline-block;
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--tst-border, #000000);

  margin-bottom: 16px;
}

.pub_testimonial_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--tst-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Testimonial Cards Grid */
.pub_testimonial_1018_testimonialGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: stretch;
}

/* Quote Card */
.pub_testimonial_1018_quoteCard {
  background-color: var(--tst-card-bg, #ffffff);
  border: 3px solid var(--tst-border, #000000);

  padding: 28px;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_testimonial_1018_quoteCard:hover {
  transform: translate(-3px, -3px);

}

/* Top Card Header Row */
.pub_testimonial_1018_cardHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.pub_testimonial_1018_quoteIconBadge {
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  width: 40px;
  height: 40px;
  border: 2px solid var(--tst-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
}

.pub_testimonial_1018_tagBadge {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--tst-bg, #fdf4ff);
  color: var(--tst-border, #000000);
  padding: 4px 10px;
  border: 2px solid var(--tst-border, #000000);
}

/* Star Rating Row */
.pub_testimonial_1018_starsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 4px);
  margin-bottom: 16px;
}

.pub_testimonial_1018_starIcon {
  color: var(--tst-accent, #f59e0b);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Quote Paragraph */
.pub_testimonial_1018_quoteText {
  line-height: var(--leading, 1.6);
  color: var(--tst-text, #0f172a);
  font-style: italic;
  margin: 0 0 24px 0;
  flex: 1;
}

/* Author Row */
.pub_testimonial_1018_authorRow {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 16px;
  border-top: 2px dashed var(--tst-border, #000000);
  margin-top: auto;
}

.pub_testimonial_1018_avatarImage {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--tst-border, #000000);

  object-fit: cover;
}

.pub_testimonial_1018_authorMeta {
  display: flex;
  flex-direction: column;
}

.pub_testimonial_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--tst-text, #0f172a);
  margin: 0 0 2px 0;
}

.pub_testimonial_1018_authorTitle {
  font-weight: 600;
  color: var(--tst-muted, #475569);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }
}

@media (max-width: 640px) {
  .pub_testimonial_1018_testimonialSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_testimonial_1018_header {
    margin-bottom: 28px;
  }

  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_testimonial_1018_quoteCard {
    padding: 20px;
  }
}


/* PUB-FORM-1018 Neobrutalist Contact Form CSS */

.pub_form_1018_formSection {
  --frm-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --frm-card-bg: var(--card-bg, #ffffff);
  --frm-text: var(--text, #0f172a);
  --frm-muted: var(--text-muted, #475569);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #000000);
  --frm-cta-bg: var(--cta-bg, #000000);
  --frm-cta-text: var(--cta-text, #ffffff);

  background-color: var(--frm-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--frm-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_form_1018_formSection,
[data-theme="dark"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #0f172a);
  --frm-card-bg: var(--card-bg, #1e293b);
  --frm-text: var(--text, #f8fafc);
  --frm-muted: var(--text-muted, #94a3b8);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_form_1018_formSection,
[data-theme="neon"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #09090b);
  --frm-card-bg: var(--card-bg, #121214);
  --frm-text: var(--text, #ccff00);
  --frm-muted: var(--text-muted, #a3e635);
  --frm-accent: var(--accent, #ff007f);
  --frm-border: var(--border, #ccff00);
}

.pub_form_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_form_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_form_1018_badge {
  display: inline-block;
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--frm-border, #000000);

  margin-bottom: 16px;
}

.pub_form_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--frm-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* 2-Column Section Grid */
.pub_form_1018_sectionGrid {
  display: grid;
  grid-template-columns: 360px 1fr;
gap: var(--space-gap, 32px);
  align-items: start;
}

/* Left Column: Contact Info Sidebar */
.pub_form_1018_infoSidebar {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  padding: 32px 28px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_responseBadge {
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 8px 14px;
  border: 2px solid var(--frm-border, #000000);

  text-align: center;
}

.pub_form_1018_infoList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_infoItem {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.pub_form_1018_infoIconBox {
  width: 40px;
  height: 40px;
  border: 2px solid var(--frm-border, #000000);

  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pub_form_1018_infoMeta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pub_form_1018_infoLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_infoValue {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  word-break: break-all;
  transition: color 0.15s ease;
}

.pub_form_1018_infoValue:hover {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_infoValueText {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 700;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_socialRow {
  padding-top: 16px;
  border-top: 2px dashed var(--frm-border, #000000);
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_socialLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_socialBadges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_socialPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  padding: 4px 8px;
  border: 1px solid var(--frm-border, #000000);
}

/* Right Column: Neobrutalist Form Card */
.pub_form_1018_formCard {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  overflow: hidden;
  width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* Form Top Availability Bar */
.pub_form_1018_formTopBar {
  background-color: var(--frm-bg, #fdf4ff);
  border-bottom: 3px solid var(--frm-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--frm-accent, #ec4899);
  border: 1px solid var(--frm-border, #000000);
  animation: pub_form_1018_pulse 1.5s infinite;
}

@keyframes pub_form_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_form_1018_statusText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--frm-text, #0f172a);
}

/* Form Element */
.pub_form_1018_formElement {
  padding: 36px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_inputGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_fieldGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_fieldLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_textInput,
.pub_form_1018_selectInput,
.pub_form_1018_textareaInput {
  background-color: var(--frm-card-bg, #ffffff);
  color: var(--frm-text, #0f172a);
  border: 3px solid var(--frm-border, #000000);

  padding: 14px 16px;
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 600;
  outline: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.pub_form_1018_textInput:focus,
.pub_form_1018_selectInput:focus,
.pub_form_1018_textareaInput:focus {
  transform: translate(-1px, -1px);

  border-color: var(--frm-border, #000000);
}

.pub_form_1018_textareaInput {
  resize: vertical;
  min-height: 120px;
}

/* Submit Row */
.pub_form_1018_submitRow {
  display: flex;
  align-items: center;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
  padding-top: 8px;
}

.pub_form_1018_submitBtn {
  background-color: var(--frm-cta-bg, #000000);
  color: var(--frm-cta-text, #ffffff);
  border: 3px solid var(--frm-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_form_1018_submitBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
}

.pub_form_1018_privacyNote {
  color: var(--frm-muted, #475569);
  font-weight: 500;
  flex: 1;
}

/* Success Banner */
.pub_form_1018_successBanner {
  display: none;
  background-color: var(--frm-bg, #fdf4ff);
  border: 3px solid var(--frm-border, #000000);

  padding: 20px 24px;
  align-items: center;
  gap: var(--space-content-gap, 16px);
}

.pub_form_1018_successBanner[data-visible="true"] {
  display: flex;
}

.pub_form_1018_successBanner i {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_successTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  margin: 0 0 2px 0;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_successDesc {
  margin: 0;
  color: var(--frm-muted, #475569);
}

/* Secondary Action Row */
.pub_form_1018_secondaryRow {
  padding: 18px 36px;
  background-color: var(--frm-bg, #fdf4ff);
  border-top: 3px solid var(--frm-border, #000000);
}

.pub_form_1018_secondaryLink {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  transition: color 0.15s ease;
}

.pub_form_1018_secondaryLink:hover {
  color: var(--frm-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_form_1018_sectionGrid {
    grid-template-columns: 1fr;
gap: var(--space-gap, 24px);
  }
}

@media (max-width: 768px) {
  .pub_form_1018_inputGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pub_form_1018_formSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_form_1018_formElement {
    padding: var(--space-card-padding, 24px);
  }

  .pub_form_1018_submitRow {
    flex-direction: column;
    align-items: stretch;
  }

  .pub_form_1018_submitBtn {
    width: 100%;
    justify-content: center;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_form_1018_secondaryRow {
    padding: var(--space-card-padding, 24px) 24px;
  }
}

.pub_form_1018_errorBanner {
  font-family: var(--font-body, inherit);
  font-size: 0.95rem;
  line-height: 1.5;
  border-radius: var(--shape-radius-sm, 4px);
}


/* PUB-FOOTER-1018 Floating macOS Dock Footer CSS */

.pub_footer_1018_footerSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_footer_1018_footerSection,
[data-theme="dark"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_footer_1018_footerSection,
[data-theme="neon"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_footer_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Main Neobrutalist Footer Card */
.pub_footer_1018_footerCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Header Bar */
.pub_footer_1018_topHeader {
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-gap, 24px);
  flex-wrap: wrap;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_brandGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_footer_1018_brandBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--sec-bg, #fdf4ff);
  padding: 8px 16px;
  border: 3px solid var(--sec-border, #000000);

}

.pub_footer_1018_brandTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--sec-text, #0f172a);
}

.pub_footer_1018_brandSub {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_taglineText {
  color: var(--sec-muted, #475569);
  margin: 0;
  font-weight: 500;
}

/* Navigation Bar */
.pub_footer_1018_navBar {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_navLink {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 6px 12px;
  border: 2px solid transparent;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_navLink:hover {
  border-color: var(--sec-border, #000000);
  background-color: var(--sec-bg, #fdf4ff);
}

/* Floating macOS Dock Section */
.pub_footer_1018_dockWrapper {
  padding: 40px 24px;
  background-color: var(--sec-bg, #fdf4ff);
  display: flex;
  justify-content: center;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_macDock {
  background-color: var(--sec-card-bg, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  flex-wrap: wrap;
  justify-content: center;
}

.pub_footer_1018_dockPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 8px 14px;
  background-color: var(--sec-bg, #fdf4ff);
  border: 2px solid var(--sec-border, #000000);
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_footer_1018_dockPill i {
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_dockPill:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_footer_1018_dockPill:hover i {
  color: var(--sec-card-bg, #ffffff);
}

/* Bottom Legal Bar */
.pub_footer_1018_bottomBar {
  padding: var(--space-card-padding, 24px) 40px;
  background-color: var(--sec-card-bg, #ffffff);
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
}

.pub_footer_1018_legalGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_copyrightText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--sec-muted, #475569);
}

.pub_footer_1018_statusBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--sec-border, #000000);
}

.pub_footer_1018_backToTopBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 8px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_backToTopBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

/* Responsive Styles */
@media (max-width: 768px) {
  .pub_footer_1018_topHeader {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
  }

  .pub_footer_1018_bottomBar {
    padding: 20px 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_footer_1018_backToTopBtn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pub_footer_1018_footerSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_footer_1018_dockWrapper {
    padding: 24px 16px;
  }

  .pub_footer_1018_macDock {
    width: 100%;
    box-sizing: border-box;
  }

  .pub_footer_1018_dockPill {
    flex: 1;
    justify-content: center;
  }
}


/* Page: about */
/* ==========================================================================
   PUB-NAV-1018 — Neobrutalism Navbar
   ========================================================================== */

.pub_nav_1018_rootWrapper {
    position: relative;
    width: 100%;
    background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
    color: var(--text, #18181b);
    font-family: var(--font-body, system-ui, -apple-system, sans-serif);
    padding-top: var(--pt, 16px);
    padding-bottom: var(--pb, 16px);
    transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* ── Main Navbar Container ──────────────────────────────────────────────── */
.pub_nav_1018_navbar {
    position: var(--navbar-position, sticky);
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-navbar, 100); /* Layer navbar above standard page content */
}

.pub_nav_1018_container {
    max-width: var(--max-w, 1240px);
    height: var(--nav-h, 76px);
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-lg, 12px);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ── Brand Logo ─────────────────────────────────────────────────────────── */
.pub_nav_1018_brandWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_logoBlock {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 10px);
    text-decoration: none;
    color: var(--text, #18181b);
}

.pub_nav_1018_logoMark {
    font-size: var(--fs-2xl, 24px);
    color: var(--accent, #ff5277);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub_nav_1018_logoWord {
    font-family: var(--font-heading, var(--font-body, system-ui, sans-serif));
    font-weight: 800;
    font-size: var(--fs-xl, 20px);
    letter-spacing: var(--tracking, -0.02em);
    color: var(--text, #18181b);
}

.pub_nav_1018_logoImage {
    max-height: 42px;
    object-fit: contain;
}

/* ── Desktop Navigation Links ───────────────────────────────────────────── */
.pub_nav_1018_navLinksWrap {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
}

.pub_nav_1018_navItem {
    position: relative;
}

.pub_nav_1018_navLink {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    font-weight: 700;
    font-size: var(--fs-md, 15px);
    color: var(--text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-lg, 8px);
    border: 2px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pub_nav_1018_navLink:hover {
    background-color: var(--bg, #fdf4ff);
    border-color: var(--border, #000000);
    transform: translateY(-2px);
}

/* ── Dropdown Sub-menu ─────────────────────────────────────────────────── */
.pub_nav_1018_dropdownMenu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-md, 10px);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: var(--z-dropdown, 110); /* Layer dropdown above navbar container */
}

.pub_nav_1018_dropdownMenu[data-open="true"],
.pub_nav_1018_navItem:hover .pub_nav_1018_dropdownMenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pub_nav_1018_dropdownItem {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
    padding: 10px 12px;
    text-decoration: none;
    color: var(--text, #18181b);
    border-radius: var(--radius-md, 6px);
    transition: background-color 0.15s ease;
}

.pub_nav_1018_dropdownItem:hover {
    background-color: var(--bg, #fdf4ff);
}

.pub_nav_1018_subIcon {
    font-size: var(--fs-xl, 20px);
    color: var(--accent, #ff5277);
}

.pub_nav_1018_subContent {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_subTitle {
    font-weight: 700;
    font-size: var(--fs-sm, 14px);
}

.pub_nav_1018_subDesc {
    font-size: var(--fs-xs, 12px);
    color: var(--text-muted, #71717a);
}

/* ── CTA Button & Actions ───────────────────────────────────────────────── */
.pub_nav_1018_actionsWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_ctaBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: var(--cta-bg, var(--accent, #ff5277));
    color: var(--cta-text, #ffffff);
    font-weight: 800;
    font-size: var(--fs-sm, 14px);
    text-decoration: none;
    border: 2px solid var(--border, #000000);

    border-radius: var(--radius-lg, 8px);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
}

.pub_nav_1018_ctaBtn:hover {
    transform: translate(-2px, -2px);

}

.pub_nav_1018_ctaBtn:active {
    transform: translate(1px, 1px);

}

/* ── Hamburger Trigger ─────────────────────────────────────────────────── */
.pub_nav_1018_hamburgerBtn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-lg, 8px);
    font-size: var(--fs-2xl, 22px);
    cursor: pointer;
    box-shadow: 2px 2px 0px var(--border, #000000);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_nav_1018_hamburgerBtn:hover {
    transform: translate(-1px, -1px);
    box-shadow: 3px 3px 0px var(--border, #000000);
}

.pub_nav_1018_hamburgerBtn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0px var(--border, #000000);
}

/* ── Mobile Drawer ─────────────────────────────────────────────────────── */
.pub_nav_1018_mobileDrawer {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background-color: var(--nav-bg, #ffffff);
    border-left: 3px solid var(--border, #000000);

    z-index: var(--z-drawer, 200); /* Elevate mobile drawer over page overlay */
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pub_nav_1018_mobileDrawer[data-open="true"] {
    transform: translateX(0);
}

.pub_nav_1018_drawerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid var(--border, #000000);
}

.pub_nav_1018_closeBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-md, 6px);
    font-size: var(--fs-xl, 20px);
    cursor: pointer;
}

.pub_nav_1018_drawerBody {
    padding: var(--space-card-padding, 24px);
    display: flex;
    flex-direction: column;
gap: var(--space-gap, 24px);
    overflow-y: auto;
}

.pub_nav_1018_mobileLinks {
    display: flex;
    flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_mobileNavItem {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_mobileNavLink {
    font-weight: 800;
    font-size: var(--fs-lg, 18px);
    color: var(--text, #18181b);
    text-decoration: none;
    padding: 8px 0;
}

.pub_nav_1018_mobileSubList {
    display: flex;
    flex-direction: column;
    gap: var(--space-content-gap, 6px);
    padding-left: 14px;
    border-left: 2px solid var(--border, #000000);
    margin-top: 4px;
}

.pub_nav_1018_mobileSubLink {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
    font-size: var(--fs-sm, 14px);
    color: var(--text-muted, #71717a);
    text-decoration: none;
    padding: 4px 0;
}

.pub_nav_1018_mobileCtaWrap {
    margin-top: auto;
    display: flex;
}

.pub_nav_1018_mobileCtaWrap .pub_nav_1018_ctaBtn {
    width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.pub_nav_1018_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--overlay-bg, rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(4px);
    z-index: var(--z-overlay, 150); /* Layer backdrop behind drawer and above content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pub_nav_1018_overlay[data-open="true"] {
    opacity: 1;
    visibility: visible;
}

/* ── Page Builder Mode Guard Overrides ──────────────────────────────────── */
.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_navbar {
    z-index: var(--z-builder-nav, 10); /* Guard z-index in page builder canvas mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_dropdownMenu {
    z-index: var(--z-builder-dropdown, 15); /* Guard z-index for dropdown in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_mobileDrawer {
    z-index: var(--z-builder-drawer, 20); /* Guard z-index for drawer in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_overlay {
    z-index: var(--z-builder-overlay, 15); /* Guard z-index for overlay in page builder mode */
}

/* ── Responsive Layout ──────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .pub_nav_1018_navLinksWrap {
        display: none;
    }

    .pub_nav_1018_actionsWrap .pub_nav_1018_ctaBtn {
        display: none;
    }

    .pub_nav_1018_hamburgerBtn {
        display: flex;
    }
}


/* PUB-ABOUT-1018 Neobrutalist Illustrator CSS */

.pub_about_1018_aboutSection {
  background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
  color: var(--text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

.pub_about_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_about_1018_header {
  margin-bottom: 48px;
  text-align: left;
}

.pub_about_1018_badge {
  display: inline-block;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--border, #000000);

  margin-bottom: 16px;
}

.pub_about_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Dual Column Grid */
.pub_about_1018_grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 36px;
  align-items: stretch;
}

/* Left Column: Media Card */
.pub_about_1018_mediaCard {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 16px;
  display: flex;
  flex-direction: column;
  position: relative;
}

.pub_about_1018_videoWrapper {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 3px solid var(--border, #000000);
  overflow: hidden;
  background-color: var(--border, #000000);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Base video player background layer (z-index 1) */
.pub_about_1018_videoPlayer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: var(--z-base, 1);
}

/* Dark translucent tint overlay layer above video (z-index 2) */
.pub_about_1018_videoOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--border, #000000);
  opacity: 0.15;
  z-index: var(--z-above, 2);
  /* Above background layers */
  pointer-events: none;
}

/* Top controls row overlay above background layers (z-index 3) */
.pub_about_1018_videoTopRow {
  position: relative;
  z-index: var(--z-overlay, 3);
  padding: 16px;
  display: flex;
  justify-content: flex-start;
}

.pub_about_1018_videoCaptionBadge {
  background-color: var(--card-bg, #ffffff);
  color: var(--text, #0f172a);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 6px 12px;
  border: 2px solid var(--border, #000000);

}

/* Interactive video player toggle button overlay layer above video (z-index 3) */
.pub_about_1018_videoToggleBtn {
  position: relative;
  z-index: var(--z-overlay, 3);
  margin: 16px;
  align-self: flex-start;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 10px 16px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_videoToggleBtn:hover {
  transform: translate(-1px, -1px);

}

.pub_about_1018_videoToggleBtn:active {
  transform: translate(2px, 2px);

}

/* Right Column: Bio Card */
.pub_about_1018_bioCard {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 36px;
  display: flex;
  flex-direction: column;
}

.pub_about_1018_statusBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--bg, #fdf4ff);
  border: 2px solid var(--border, #000000);
  padding: 6px 14px;
  margin-bottom: 24px;
  align-self: flex-start;
}

.pub_about_1018_statusDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--status-dot-color, #22c55e);
  border: 1px solid var(--border, #000000);

  display: inline-block;
}

.pub_about_1018_statusText {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--text, #0f172a);
}

.pub_about_1018_bioHeadline {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  line-height: var(--leading, 1.25);
  color: var(--text, #0f172a);
  margin: 0 0 16px 0;
}

.pub_about_1018_bioText {
  line-height: var(--leading, 1.6);
  color: var(--text-muted, #475569);
  margin: 0 0 28px 0;
}

/* Skills Section */
.pub_about_1018_skillsWrapper {
  margin-bottom: 28px;
}

.pub_about_1018_subHeading {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--text-muted, #475569);
  margin: 0 0 14px 0;
  text-transform: uppercase;
}

.pub_about_1018_skillsGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: var(--space-content-gap, 12px);
}

.pub_about_1018_skillCard {
  background-color: var(--bg, #fdf4ff);
  border: 2px solid var(--border, #000000);

  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_about_1018_skillCard:hover {
  transform: translate(-1px, -1px);

}

.pub_about_1018_skillIcon {
  color: var(--accent, #f59e0b);
}

.pub_about_1018_skillName {
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 700;
  color: var(--text, #0f172a);
  flex: 1;
}

.pub_about_1018_skillTag {
  font-weight: 800;
  background-color: var(--accent, #f59e0b);
  color: var(--border, #000000);
  padding: 2px 6px;
  border: 1px solid var(--border, #000000);
  text-transform: uppercase;
}

/* Stats Row */
.pub_about_1018_statsRow {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 32px;
}

.pub_about_1018_statBox {
  background-color: var(--card-bg, #ffffff);
  border: 3px solid var(--border, #000000);

  padding: 14px;
  text-align: center;
}

.pub_about_1018_statNumber {
  display: block;
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--text, #0f172a);
  line-height: var(--leading, 1.1);
  margin-bottom: 4px;
}

.pub_about_1018_statLabel {
  font-weight: 700;
  color: var(--text-muted, #475569);
  text-transform: uppercase;
  letter-spacing: var(--tracking, 0.04em);
}

/* CTA Row */
.pub_about_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  margin-top: auto;
}

.pub_about_1018_primaryBtn {
  background-color: var(--cta-bg, #000000);
  color: var(--cta-text, #ffffff);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_about_1018_primaryBtn:active {
  transform: translate(2px, 2px);

}

.pub_about_1018_secondaryBtn {
  background-color: var(--card-bg, #ffffff);
  color: var(--text, #0f172a);
  border: 3px solid var(--border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_about_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--bg, #fdf4ff);
}

.pub_about_1018_secondaryBtn:active {
  transform: translate(2px, 2px);

}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_about_1018_grid {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_videoWrapper {
    min-height: 340px;
  }

  .pub_about_1018_bioCard {
    padding: var(--space-card-padding, 24px);
  }
}

@media (max-width: 640px) {
  .pub_about_1018_aboutSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_about_1018_header {
    margin-bottom: 32px;
  }

  .pub_about_1018_skillsGrid {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_statsRow {
    grid-template-columns: 1fr;
  }

  .pub_about_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_about_1018_primaryBtn,
  .pub_about_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-GALLERY-1018 Massive Masonry Spotlight CSS */

.pub_gallery_1018_gallerySection {
  --gal-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --gal-card-bg: var(--card-bg, #ffffff);
  --gal-text: var(--text, #0f172a);
  --gal-muted: var(--text-muted, #475569);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #000000);
  --gal-cta-bg: var(--cta-bg, #000000);
  --gal-cta-text: var(--cta-text, #ffffff);

  background-color: var(--gal-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--gal-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_gallery_1018_gallerySection,
[data-theme="dark"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #0f172a);
  --gal-card-bg: var(--card-bg, #1e293b);
  --gal-text: var(--text, #f8fafc);
  --gal-muted: var(--text-muted, #94a3b8);
  --gal-accent: var(--accent, #ec4899);
  --gal-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_gallery_1018_gallerySection,
[data-theme="neon"] .pub_gallery_1018_gallerySection {
  --gal-bg: var(--bg, #09090b);
  --gal-card-bg: var(--card-bg, #121214);
  --gal-text: var(--text, #ccff00);
  --gal-muted: var(--text-muted, #a3e635);
  --gal-accent: var(--accent, #ff007f);
  --gal-border: var(--border, #ccff00);
}

.pub_gallery_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_gallery_1018_header {
  margin-bottom: 32px;
  text-align: left;
}

.pub_gallery_1018_badge {
  display: inline-block;
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--gal-border, #000000);

  margin-bottom: 16px;
}

.pub_gallery_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--gal-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Category Filter Tabs Bar */
.pub_gallery_1018_filterBar {
  display: flex;
  flex-wrap: wrap;
gap: var(--space-content-gap, 12px);
  margin-bottom: 40px;
}

.pub_gallery_1018_filterTab {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  padding: 8px 18px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_gallery_1018_filterTab:hover {
  transform: translate(-1px, -1px);

}

.pub_gallery_1018_filterTabActive {
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);

}

/* Masonry Grid Layout */
.pub_gallery_1018_masonryGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: start;
  margin-bottom: 48px;
  transition: opacity 0.25s ease;
}

/* Individual Artwork Card */
.pub_gallery_1018_artCard {
  background-color: var(--gal-card-bg, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease, filter 0.25s ease;
}

.pub_gallery_1018_artCard:hover {
  transform: translate(-3px, -3px);

}

/* Spotlight Dimming Effect */
.pub_gallery_1018_masonryGrid[data-spotlight-active="true"] .pub_gallery_1018_artCard:not([data-spotlight-hover="true"]) {
  opacity: 0.35;
  filter: grayscale(50%);
}

.pub_gallery_1018_cardVertical {
  grid-row: span 2;
}

.pub_gallery_1018_cardHorizontal {
  grid-column: span 2;
}

.pub_gallery_1018_cardSquare {
  grid-row: span 1;
}

.pub_gallery_1018_cardInnerLink {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* Image Container */
.pub_gallery_1018_imageWrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--gal-border, #000000);
}

.pub_gallery_1018_cardVertical .pub_gallery_1018_imageWrapper {
  padding-bottom: 125%;
}

.pub_gallery_1018_cardHorizontal .pub_gallery_1018_imageWrapper {
  padding-bottom: 50%;
}

.pub_gallery_1018_cardSquare .pub_gallery_1018_imageWrapper {
  padding-bottom: 85%;
}

/* Base artwork image layer (z-index 1) */
.pub_gallery_1018_artImage {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: var(--z-base, 1);
  /* Base layer - image */
  transition: transform 0.4s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_artImage {
  transform: scale(1.05);
}

/* Dark hover overlay layer above image (z-index 2) */
.pub_gallery_1018_imageOverlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--gal-border, #000000);
  opacity: 0;
  z-index: var(--z-above, 2);
  /* Above image layer */
  transition: opacity 0.25s ease;
  pointer-events: none;
    box-shadow: var(--shadow-sm, none);
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_imageOverlay {
  opacity: 0.15;
}

/* Category Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_categoryBadge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay */
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  padding: 4px 10px;
  border: 2px solid var(--gal-border, #000000);

}

/* Zoom Arrow Action Badge overlay layer above image (z-index 3) */
.pub_gallery_1018_zoomBadge {
  position: absolute;
  bottom: 14px;
  right: 14px;
  z-index: var(--z-overlay, 3);
  /* Above image and overlay layers */
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-border, #000000);
  width: 38px;
  height: 38px;
  border: 2px solid var(--gal-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.pub_gallery_1018_artCard:hover .pub_gallery_1018_zoomBadge {
  transform: translate(-2px, -2px);
  background-color: var(--gal-accent, #ec4899);
  color: var(--gal-card-bg, #ffffff);
}

/* Card Metadata Caption Bar */
.pub_gallery_1018_cardMetaBar {
  padding: 18px 20px;
  background-color: var(--gal-card-bg, #ffffff);
  border-top: 3px solid var(--gal-border, #000000);
}

.pub_gallery_1018_artTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--gal-text, #0f172a);
  margin: 0 0 4px 0;
}

.pub_gallery_1018_artCaption {
  font-weight: 600;
  color: var(--gal-muted, #475569);
}

/* CTA Row */
.pub_gallery_1018_ctaRow {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 16px);
  justify-content: center;
}

.pub_gallery_1018_primaryBtn {
  background-color: var(--gal-cta-bg, #000000);
  color: var(--gal-cta-text, #ffffff);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

}

.pub_gallery_1018_secondaryBtn {
  background-color: var(--gal-card-bg, #ffffff);
  color: var(--gal-text, #0f172a);
  border: 3px solid var(--gal-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 12px 24px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_gallery_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--gal-bg, #fdf4ff);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_gallery_1018_masonryGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardHorizontal {
    grid-column: span 1;
  }
}

@media (max-width: 640px) {
  .pub_gallery_1018_gallerySection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_gallery_1018_masonryGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_gallery_1018_cardVertical {
    grid-row: span 1;
  }

  .pub_gallery_1018_filterBar {
    gap: var(--space-content-gap, 8px);
  }

  .pub_gallery_1018_ctaRow {
    flex-direction: column;
    width: 100%;
  }

  .pub_gallery_1018_primaryBtn,
  .pub_gallery_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }
}

/* PUB-TESTIMONIAL-1018 Neobrutalist Quote Cards CSS */

.pub_testimonial_1018_testimonialSection {
  --tst-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --tst-card-bg: var(--card-bg, #ffffff);
  --tst-text: var(--text, #0f172a);
  --tst-muted: var(--text-muted, #475569);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #000000);

  background-color: var(--tst-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--tst-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_testimonial_1018_testimonialSection,
[data-theme="dark"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #0f172a);
  --tst-card-bg: var(--card-bg, #1e293b);
  --tst-text: var(--text, #f8fafc);
  --tst-muted: var(--text-muted, #94a3b8);
  --tst-accent: var(--accent, #f59e0b);
  --tst-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_testimonial_1018_testimonialSection,
[data-theme="neon"] .pub_testimonial_1018_testimonialSection {
  --tst-bg: var(--bg, #09090b);
  --tst-card-bg: var(--card-bg, #121214);
  --tst-text: var(--text, #ccff00);
  --tst-muted: var(--text-muted, #a3e635);
  --tst-accent: var(--accent, #ff007f);
  --tst-border: var(--border, #ccff00);
}

.pub_testimonial_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_testimonial_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_testimonial_1018_badge {
  display: inline-block;
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--tst-border, #000000);

  margin-bottom: 16px;
}

.pub_testimonial_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--tst-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* Testimonial Cards Grid */
.pub_testimonial_1018_testimonialGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-gap, 28px);
  align-items: stretch;
}

/* Quote Card */
.pub_testimonial_1018_quoteCard {
  background-color: var(--tst-card-bg, #ffffff);
  border: 3px solid var(--tst-border, #000000);

  padding: 28px;
  display: flex;
  flex-direction: column;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pub_testimonial_1018_quoteCard:hover {
  transform: translate(-3px, -3px);

}

/* Top Card Header Row */
.pub_testimonial_1018_cardHeaderRow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.pub_testimonial_1018_quoteIconBadge {
  background-color: var(--tst-accent, #f59e0b);
  color: var(--tst-border, #000000);
  width: 40px;
  height: 40px;
  border: 2px solid var(--tst-border, #000000);

  display: flex;
  align-items: center;
  justify-content: center;
}

.pub_testimonial_1018_tagBadge {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  background-color: var(--tst-bg, #fdf4ff);
  color: var(--tst-border, #000000);
  padding: 4px 10px;
  border: 2px solid var(--tst-border, #000000);
}

/* Star Rating Row */
.pub_testimonial_1018_starsRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 4px);
  margin-bottom: 16px;
}

.pub_testimonial_1018_starIcon {
  color: var(--tst-accent, #f59e0b);
  font-size: calc(16px * var(--body-scale, 1));
}

/* Quote Paragraph */
.pub_testimonial_1018_quoteText {
  line-height: var(--leading, 1.6);
  color: var(--tst-text, #0f172a);
  font-style: italic;
  margin: 0 0 24px 0;
  flex: 1;
}

/* Author Row */
.pub_testimonial_1018_authorRow {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-top: 16px;
  border-top: 2px dashed var(--tst-border, #000000);
  margin-top: auto;
}

.pub_testimonial_1018_avatarImage {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-full, 50%);
  border: 2px solid var(--tst-border, #000000);

  object-fit: cover;
}

.pub_testimonial_1018_authorMeta {
  display: flex;
  flex-direction: column;
}

.pub_testimonial_1018_authorName {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--tst-text, #0f172a);
  margin: 0 0 2px 0;
}

.pub_testimonial_1018_authorTitle {
  font-weight: 600;
  color: var(--tst-muted, #475569);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
  }
}

@media (max-width: 640px) {
  .pub_testimonial_1018_testimonialSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_testimonial_1018_header {
    margin-bottom: 28px;
  }

  .pub_testimonial_1018_testimonialGrid {
    grid-template-columns: 1fr;
gap: var(--space-content-gap, 20px);
  }

  .pub_testimonial_1018_quoteCard {
    padding: 20px;
  }
}


/* PUB-CTA-1018 Neobrutalist Availability Status CTA CSS */

.pub_cta_1018_ctaSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_cta_1018_ctaSection,
[data-theme="dark"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_cta_1018_ctaSection,
[data-theme="neon"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_cta_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Neobrutalist CTA Card */
.pub_cta_1018_ctaCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Status Header Bar */
.pub_cta_1018_topBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-bottom: 3px solid var(--sec-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_cta_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--sec-accent, #ec4899);
  border: 1px solid var(--sec-border, #000000);
  animation: pub_cta_1018_pulse 1.5s infinite;
}

@keyframes pub_cta_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_cta_1018_statusLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

/* Card Body Content */
.pub_cta_1018_cardBody {
  padding: clamp(32px, 4vw, 48px) clamp(24px, 3vw, 40px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
gap: var(--space-content-gap, 20px);
  background-color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--sec-text, #0f172a);
  margin: 0;
  max-width: 860px;
}

.pub_cta_1018_subtitle {
  line-height: var(--leading, 1.6);
  color: var(--sec-muted, #475569);
  margin: 0;
  max-width: 720px;
}

/* Button Row */
.pub_cta_1018_btnRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
  padding-top: 12px;
}

.pub_cta_1018_primaryBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_cta_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_secondaryBtn {
  background-color: var(--sec-card-bg, #ffffff);
  color: var(--sec-text, #0f172a);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_cta_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
}

/* Bottom Timezone Clock Bar */
.pub_cta_1018_bottomBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-top: 3px solid var(--sec-border, #000000);
  padding: 14px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-content-gap, 16px);
}

.pub_cta_1018_timezoneGroup,
.pub_cta_1018_clockGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

.pub_cta_1018_timezoneGroup i,
.pub_cta_1018_clockGroup i {
  color: var(--sec-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 640px) {
  .pub_cta_1018_ctaSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_cta_1018_cardBody {
    padding: 32px 24px;
  }

  .pub_cta_1018_btnRow {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .pub_cta_1018_primaryBtn,
  .pub_cta_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_cta_1018_bottomBar {
    padding: 14px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-content-gap, 8px);
  }
}


/* PUB-FOOTER-1018 Floating macOS Dock Footer CSS */

.pub_footer_1018_footerSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_footer_1018_footerSection,
[data-theme="dark"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_footer_1018_footerSection,
[data-theme="neon"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_footer_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Main Neobrutalist Footer Card */
.pub_footer_1018_footerCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Header Bar */
.pub_footer_1018_topHeader {
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-gap, 24px);
  flex-wrap: wrap;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_brandGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_footer_1018_brandBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--sec-bg, #fdf4ff);
  padding: 8px 16px;
  border: 3px solid var(--sec-border, #000000);

}

.pub_footer_1018_brandTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--sec-text, #0f172a);
}

.pub_footer_1018_brandSub {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_taglineText {
  color: var(--sec-muted, #475569);
  margin: 0;
  font-weight: 500;
}

/* Navigation Bar */
.pub_footer_1018_navBar {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_navLink {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 6px 12px;
  border: 2px solid transparent;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_navLink:hover {
  border-color: var(--sec-border, #000000);
  background-color: var(--sec-bg, #fdf4ff);
}

/* Floating macOS Dock Section */
.pub_footer_1018_dockWrapper {
  padding: 40px 24px;
  background-color: var(--sec-bg, #fdf4ff);
  display: flex;
  justify-content: center;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_macDock {
  background-color: var(--sec-card-bg, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  flex-wrap: wrap;
  justify-content: center;
}

.pub_footer_1018_dockPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 8px 14px;
  background-color: var(--sec-bg, #fdf4ff);
  border: 2px solid var(--sec-border, #000000);
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_footer_1018_dockPill i {
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_dockPill:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_footer_1018_dockPill:hover i {
  color: var(--sec-card-bg, #ffffff);
}

/* Bottom Legal Bar */
.pub_footer_1018_bottomBar {
  padding: var(--space-card-padding, 24px) 40px;
  background-color: var(--sec-card-bg, #ffffff);
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
}

.pub_footer_1018_legalGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_copyrightText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--sec-muted, #475569);
}

.pub_footer_1018_statusBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--sec-border, #000000);
}

.pub_footer_1018_backToTopBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 8px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_backToTopBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

/* Responsive Styles */
@media (max-width: 768px) {
  .pub_footer_1018_topHeader {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
  }

  .pub_footer_1018_bottomBar {
    padding: 20px 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_footer_1018_backToTopBtn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pub_footer_1018_footerSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_footer_1018_dockWrapper {
    padding: 24px 16px;
  }

  .pub_footer_1018_macDock {
    width: 100%;
    box-sizing: border-box;
  }

  .pub_footer_1018_dockPill {
    flex: 1;
    justify-content: center;
  }
}


/* Page: contact */
/* ==========================================================================
   PUB-NAV-1018 — Neobrutalism Navbar
   ========================================================================== */

.pub_nav_1018_rootWrapper {
    position: relative;
    width: 100%;
    background-color: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
    background-image: var(--texture-bg, none);
    color: var(--text, #18181b);
    font-family: var(--font-body, system-ui, -apple-system, sans-serif);
    padding-top: var(--pt, 16px);
    padding-bottom: var(--pb, 16px);
    transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* ── Main Navbar Container ──────────────────────────────────────────────── */
.pub_nav_1018_navbar {
    position: var(--navbar-position, sticky);
    top: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-navbar, 100); /* Layer navbar above standard page content */
}

.pub_nav_1018_container {
    max-width: var(--max-w, 1240px);
    height: var(--nav-h, 76px);
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-lg, 12px);
    transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* ── Brand Logo ─────────────────────────────────────────────────────────── */
.pub_nav_1018_brandWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_logoBlock {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 10px);
    text-decoration: none;
    color: var(--text, #18181b);
}

.pub_nav_1018_logoMark {
    font-size: var(--fs-2xl, 24px);
    color: var(--accent, #ff5277);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pub_nav_1018_logoWord {
    font-family: var(--font-heading, var(--font-body, system-ui, sans-serif));
    font-weight: 800;
    font-size: var(--fs-xl, 20px);
    letter-spacing: var(--tracking, -0.02em);
    color: var(--text, #18181b);
}

.pub_nav_1018_logoImage {
    max-height: 42px;
    object-fit: contain;
}

/* ── Desktop Navigation Links ───────────────────────────────────────────── */
.pub_nav_1018_navLinksWrap {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
}

.pub_nav_1018_navItem {
    position: relative;
}

.pub_nav_1018_navLink {
    display: flex;
    align-items: center;
    padding: 8px 14px;
    font-weight: 700;
    font-size: var(--fs-md, 15px);
    color: var(--text, #18181b);
    text-decoration: none;
    border-radius: var(--radius-lg, 8px);
    border: 2px solid transparent;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.pub_nav_1018_navLink:hover {
    background-color: var(--bg, #fdf4ff);
    border-color: var(--border, #000000);
    transform: translateY(-2px);
}

/* ── Dropdown Sub-menu ─────────────────────────────────────────────────── */
.pub_nav_1018_dropdownMenu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 240px;
    background-color: var(--nav-bg, #ffffff);
    border: 3px solid var(--border, #000000);

    border-radius: var(--radius-md, 10px);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    z-index: var(--z-dropdown, 110); /* Layer dropdown above navbar container */
}

.pub_nav_1018_dropdownMenu[data-open="true"],
.pub_nav_1018_navItem:hover .pub_nav_1018_dropdownMenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.pub_nav_1018_dropdownItem {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
    padding: 10px 12px;
    text-decoration: none;
    color: var(--text, #18181b);
    border-radius: var(--radius-md, 6px);
    transition: background-color 0.15s ease;
}

.pub_nav_1018_dropdownItem:hover {
    background-color: var(--bg, #fdf4ff);
}

.pub_nav_1018_subIcon {
    font-size: var(--fs-xl, 20px);
    color: var(--accent, #ff5277);
}

.pub_nav_1018_subContent {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_subTitle {
    font-weight: 700;
    font-size: var(--fs-sm, 14px);
}

.pub_nav_1018_subDesc {
    font-size: var(--fs-xs, 12px);
    color: var(--text-muted, #71717a);
}

/* ── CTA Button & Actions ───────────────────────────────────────────────── */
.pub_nav_1018_actionsWrap {
    display: flex;
    align-items: center;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_ctaBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: var(--cta-bg, var(--accent, #ff5277));
    color: var(--cta-text, #ffffff);
    font-weight: 800;
    font-size: var(--fs-sm, 14px);
    text-decoration: none;
    border: 2px solid var(--border, #000000);

    border-radius: var(--radius-lg, 8px);
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.2s ease;
}

.pub_nav_1018_ctaBtn:hover {
    transform: translate(-2px, -2px);

}

.pub_nav_1018_ctaBtn:active {
    transform: translate(1px, 1px);

}

/* ── Hamburger Trigger ─────────────────────────────────────────────────── */
.pub_nav_1018_hamburgerBtn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-lg, 8px);
    font-size: var(--fs-2xl, 22px);
    cursor: pointer;
    box-shadow: 2px 2px 0px var(--border, #000000);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_nav_1018_hamburgerBtn:hover {
    transform: translate(-1px, -1px);
    box-shadow: 3px 3px 0px var(--border, #000000);
}

.pub_nav_1018_hamburgerBtn:active {
    transform: translate(1px, 1px);
    box-shadow: 1px 1px 0px var(--border, #000000);
}

/* ── Mobile Drawer ─────────────────────────────────────────────────────── */
.pub_nav_1018_mobileDrawer {
    position: fixed;
    top: 0;
    right: 0;
    width: 320px;
    max-width: 85vw;
    height: 100vh;
    background-color: var(--nav-bg, #ffffff);
    border-left: 3px solid var(--border, #000000);

    z-index: var(--z-drawer, 200); /* Elevate mobile drawer over page overlay */
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pub_nav_1018_mobileDrawer[data-open="true"] {
    transform: translateX(0);
}

.pub_nav_1018_drawerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 2px solid var(--border, #000000);
}

.pub_nav_1018_closeBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background-color: var(--bg, #fdf4ff);
    color: var(--text, #18181b);
    border: 2px solid var(--border, #000000);
    border-radius: var(--radius-md, 6px);
    font-size: var(--fs-xl, 20px);
    cursor: pointer;
}

.pub_nav_1018_drawerBody {
    padding: var(--space-card-padding, 24px);
    display: flex;
    flex-direction: column;
gap: var(--space-gap, 24px);
    overflow-y: auto;
}

.pub_nav_1018_mobileLinks {
    display: flex;
    flex-direction: column;
gap: var(--space-content-gap, 12px);
}

.pub_nav_1018_mobileNavItem {
    display: flex;
    flex-direction: column;
}

.pub_nav_1018_mobileNavLink {
    font-weight: 800;
    font-size: var(--fs-lg, 18px);
    color: var(--text, #18181b);
    text-decoration: none;
    padding: 8px 0;
}

.pub_nav_1018_mobileSubList {
    display: flex;
    flex-direction: column;
    gap: var(--space-content-gap, 6px);
    padding-left: 14px;
    border-left: 2px solid var(--border, #000000);
    margin-top: 4px;
}

.pub_nav_1018_mobileSubLink {
    display: flex;
    align-items: center;
    gap: var(--space-content-gap, 8px);
    font-size: var(--fs-sm, 14px);
    color: var(--text-muted, #71717a);
    text-decoration: none;
    padding: 4px 0;
}

.pub_nav_1018_mobileCtaWrap {
    margin-top: auto;
    display: flex;
}

.pub_nav_1018_mobileCtaWrap .pub_nav_1018_ctaBtn {
    width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.pub_nav_1018_overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--overlay-bg, rgba(0, 0, 0, 0.5));
    backdrop-filter: blur(4px);
    z-index: var(--z-overlay, 150); /* Layer backdrop behind drawer and above content */
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pub_nav_1018_overlay[data-open="true"] {
    opacity: 1;
    visibility: visible;
}

/* ── Page Builder Mode Guard Overrides ──────────────────────────────────── */
.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_navbar {
    z-index: var(--z-builder-nav, 10); /* Guard z-index in page builder canvas mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_dropdownMenu {
    z-index: var(--z-builder-dropdown, 15); /* Guard z-index for dropdown in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_mobileDrawer {
    z-index: var(--z-builder-drawer, 20); /* Guard z-index for drawer in page builder mode */
}

.pub_nav_1018_rootWrapper[data-pb-mode="true"] .pub_nav_1018_overlay {
    z-index: var(--z-builder-overlay, 15); /* Guard z-index for overlay in page builder mode */
}

/* ── Responsive Layout ──────────────────────────────────────────────────── */
@media (max-width: 992px) {
    .pub_nav_1018_navLinksWrap {
        display: none;
    }

    .pub_nav_1018_actionsWrap .pub_nav_1018_ctaBtn {
        display: none;
    }

    .pub_nav_1018_hamburgerBtn {
        display: flex;
    }
}


/* PUB-FORM-1018 Neobrutalist Contact Form CSS */

.pub_form_1018_formSection {
  --frm-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --frm-card-bg: var(--card-bg, #ffffff);
  --frm-text: var(--text, #0f172a);
  --frm-muted: var(--text-muted, #475569);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #000000);
  --frm-cta-bg: var(--cta-bg, #000000);
  --frm-cta-text: var(--cta-text, #ffffff);

  background-color: var(--frm-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--frm-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_form_1018_formSection,
[data-theme="dark"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #0f172a);
  --frm-card-bg: var(--card-bg, #1e293b);
  --frm-text: var(--text, #f8fafc);
  --frm-muted: var(--text-muted, #94a3b8);
  --frm-accent: var(--accent, #ec4899);
  --frm-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_form_1018_formSection,
[data-theme="neon"] .pub_form_1018_formSection {
  --frm-bg: var(--bg, #09090b);
  --frm-card-bg: var(--card-bg, #121214);
  --frm-text: var(--text, #ccff00);
  --frm-muted: var(--text-muted, #a3e635);
  --frm-accent: var(--accent, #ff007f);
  --frm-border: var(--border, #ccff00);
}

.pub_form_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Header */
.pub_form_1018_header {
  margin-bottom: 40px;
  text-align: left;
}

.pub_form_1018_badge {
  display: inline-block;
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  text-transform: uppercase;
  padding: 6px 14px;
  border: 3px solid var(--frm-border, #000000);

  margin-bottom: 16px;
}

.pub_form_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--frm-text, #0f172a);
  margin: 0;
  max-width: 780px;
}

/* 2-Column Section Grid */
.pub_form_1018_sectionGrid {
  display: grid;
  grid-template-columns: 360px 1fr;
gap: var(--space-gap, 32px);
  align-items: start;
}

/* Left Column: Contact Info Sidebar */
.pub_form_1018_infoSidebar {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  padding: 32px 28px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_responseBadge {
  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 8px 14px;
  border: 2px solid var(--frm-border, #000000);

  text-align: center;
}

.pub_form_1018_infoList {
  display: flex;
  flex-direction: column;
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_infoItem {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.pub_form_1018_infoIconBox {
  width: 40px;
  height: 40px;
  border: 2px solid var(--frm-border, #000000);

  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.pub_form_1018_infoMeta {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pub_form_1018_infoLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_infoValue {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  word-break: break-all;
  transition: color 0.15s ease;
}

.pub_form_1018_infoValue:hover {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_infoValueText {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 700;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_socialRow {
  padding-top: 16px;
  border-top: 2px dashed var(--frm-border, #000000);
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_socialLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-muted, #475569);
}

.pub_form_1018_socialBadges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_socialPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  background-color: var(--frm-bg, #fdf4ff);
  color: var(--frm-text, #0f172a);
  padding: 4px 8px;
  border: 1px solid var(--frm-border, #000000);
}

/* Right Column: Neobrutalist Form Card */
.pub_form_1018_formCard {
  background-color: var(--frm-card-bg, #ffffff);
  border: 4px solid var(--frm-border, #000000);

  overflow: hidden;
  width: 100%;
    box-shadow: var(--shadow-sm, none);
}

/* Form Top Availability Bar */
.pub_form_1018_formTopBar {
  background-color: var(--frm-bg, #fdf4ff);
  border-bottom: 3px solid var(--frm-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_form_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--frm-accent, #ec4899);
  border: 1px solid var(--frm-border, #000000);
  animation: pub_form_1018_pulse 1.5s infinite;
}

@keyframes pub_form_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_form_1018_statusText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--frm-text, #0f172a);
}

/* Form Element */
.pub_form_1018_formElement {
  padding: 36px;
  display: flex;
  flex-direction: column;
gap: var(--space-gap, 24px);
}

.pub_form_1018_inputGrid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
gap: var(--space-content-gap, 20px);
}

.pub_form_1018_fieldGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_form_1018_fieldLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.08em);
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_textInput,
.pub_form_1018_selectInput,
.pub_form_1018_textareaInput {
  background-color: var(--frm-card-bg, #ffffff);
  color: var(--frm-text, #0f172a);
  border: 3px solid var(--frm-border, #000000);

  padding: 14px 16px;
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 600;
  outline: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.pub_form_1018_textInput:focus,
.pub_form_1018_selectInput:focus,
.pub_form_1018_textareaInput:focus {
  transform: translate(-1px, -1px);

  border-color: var(--frm-border, #000000);
}

.pub_form_1018_textareaInput {
  resize: vertical;
  min-height: 120px;
}

/* Submit Row */
.pub_form_1018_submitRow {
  display: flex;
  align-items: center;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
  padding-top: 8px;
}

.pub_form_1018_submitBtn {
  background-color: var(--frm-cta-bg, #000000);
  color: var(--frm-cta-text, #ffffff);
  border: 3px solid var(--frm-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pub_form_1018_submitBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--frm-accent, #ec4899);
  color: var(--frm-card-bg, #ffffff);
}

.pub_form_1018_privacyNote {
  color: var(--frm-muted, #475569);
  font-weight: 500;
  flex: 1;
}

/* Success Banner */
.pub_form_1018_successBanner {
  display: none;
  background-color: var(--frm-bg, #fdf4ff);
  border: 3px solid var(--frm-border, #000000);

  padding: 20px 24px;
  align-items: center;
  gap: var(--space-content-gap, 16px);
}

.pub_form_1018_successBanner[data-visible="true"] {
  display: flex;
}

.pub_form_1018_successBanner i {
  color: var(--frm-accent, #ec4899);
}

.pub_form_1018_successTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  margin: 0 0 2px 0;
  color: var(--frm-text, #0f172a);
}

.pub_form_1018_successDesc {
  margin: 0;
  color: var(--frm-muted, #475569);
}

/* Secondary Action Row */
.pub_form_1018_secondaryRow {
  padding: 18px 36px;
  background-color: var(--frm-bg, #fdf4ff);
  border-top: 3px solid var(--frm-border, #000000);
}

.pub_form_1018_secondaryLink {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  color: var(--frm-text, #0f172a);
  text-decoration: none;
  transition: color 0.15s ease;
}

.pub_form_1018_secondaryLink:hover {
  color: var(--frm-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 991px) {
  .pub_form_1018_sectionGrid {
    grid-template-columns: 1fr;
gap: var(--space-gap, 24px);
  }
}

@media (max-width: 768px) {
  .pub_form_1018_inputGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .pub_form_1018_formSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_form_1018_formElement {
    padding: var(--space-card-padding, 24px);
  }

  .pub_form_1018_submitRow {
    flex-direction: column;
    align-items: stretch;
  }

  .pub_form_1018_submitBtn {
    width: 100%;
    justify-content: center;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_form_1018_secondaryRow {
    padding: var(--space-card-padding, 24px) 24px;
  }
}

.pub_form_1018_errorBanner {
  font-family: var(--font-body, inherit);
  font-size: 0.95rem;
  line-height: 1.5;
  border-radius: var(--shape-radius-sm, 4px);
}


/* PUB-CTA-1018 Neobrutalist Availability Status CTA CSS */

.pub_cta_1018_ctaSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_cta_1018_ctaSection,
[data-theme="dark"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_cta_1018_ctaSection,
[data-theme="neon"] .pub_cta_1018_ctaSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_cta_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Neobrutalist CTA Card */
.pub_cta_1018_ctaCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Status Header Bar */
.pub_cta_1018_topBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-bottom: 3px solid var(--sec-border, #000000);
  padding: 12px 24px;
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
}

.pub_cta_1018_pulseDot {
  width: 10px;
  height: 10px;
  border-radius: var(--radius-full, 50%);
  background-color: var(--sec-accent, #ec4899);
  border: 1px solid var(--sec-border, #000000);
  animation: pub_cta_1018_pulse 1.5s infinite;
}

@keyframes pub_cta_1018_pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pub_cta_1018_statusLabel {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

/* Card Body Content */
.pub_cta_1018_cardBody {
  padding: clamp(32px, 4vw, 48px) clamp(24px, 3vw, 40px);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
gap: var(--space-content-gap, 20px);
  background-color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_title {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  line-height: var(--leading, 1.15);
  color: var(--sec-text, #0f172a);
  margin: 0;
  max-width: 860px;
}

.pub_cta_1018_subtitle {
  line-height: var(--leading, 1.6);
  color: var(--sec-muted, #475569);
  margin: 0;
  max-width: 720px;
}

/* Button Row */
.pub_cta_1018_btnRow {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
  padding-top: 12px;
}

.pub_cta_1018_primaryBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_cta_1018_primaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_cta_1018_secondaryBtn {
  background-color: var(--sec-card-bg, #ffffff);
  color: var(--sec-text, #0f172a);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  padding: 14px 28px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_cta_1018_secondaryBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
}

/* Bottom Timezone Clock Bar */
.pub_cta_1018_bottomBar {
  background-color: var(--sec-bg, #fdf4ff);
  border-top: 3px solid var(--sec-border, #000000);
  padding: 14px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-content-gap, 16px);
}

.pub_cta_1018_timezoneGroup,
.pub_cta_1018_clockGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.06em);
  color: var(--sec-text, #0f172a);
}

.pub_cta_1018_timezoneGroup i,
.pub_cta_1018_clockGroup i {
  color: var(--sec-accent, #ec4899);
}

/* Responsive Styles */
@media (max-width: 640px) {
  .pub_cta_1018_ctaSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_cta_1018_cardBody {
    padding: 32px 24px;
  }

  .pub_cta_1018_btnRow {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .pub_cta_1018_primaryBtn,
  .pub_cta_1018_secondaryBtn {
    width: 100%;
    justify-content: center;
    box-sizing: border-box;
    box-shadow: var(--shadow-sm, none);
  }

  .pub_cta_1018_bottomBar {
    padding: 14px 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-content-gap, 8px);
  }
}


/* PUB-FOOTER-1018 Floating macOS Dock Footer CSS */

.pub_footer_1018_footerSection {
  --sec-bg: color-mix(in srgb, color-mix(in srgb, var(--bg, #fdf4ff) calc(var(--material-bg-opacity, 1) * 100%), transparent) calc(var(--material-bg-opacity, 1) * 100%), transparent);
  --sec-card-bg: var(--card-bg, #ffffff);
  --sec-text: var(--text, #0f172a);
  --sec-muted: var(--text-muted, #475569);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #000000);
  --sec-cta-bg: var(--cta-bg, #000000);
  --sec-cta-text: var(--cta-text, #ffffff);

  background-color: var(--sec-bg, #fdf4ff);
    background-image: var(--texture-bg, none);
  color: var(--sec-text, #0f172a);
  font-family: var(--font-body, system-ui, sans-serif);
  padding-top: var(--pt, 80px);
  padding-bottom: var(--pb, 80px);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  transition: background-color 0.3s ease, color 0.3s ease;
    backdrop-filter: var(--material-backdrop, none);
    -webkit-backdrop-filter: var(--material-backdrop, none);
}

/* Dark Theme Overrides */
body[data-theme="dark"] .pub_footer_1018_footerSection,
[data-theme="dark"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #0f172a);
  --sec-card-bg: var(--card-bg, #1e293b);
  --sec-text: var(--text, #f8fafc);
  --sec-muted: var(--text-muted, #94a3b8);
  --sec-accent: var(--accent, #ec4899);
  --sec-border: var(--border, #334155);
}

/* Neon Theme Overrides */
body[data-theme="neon"] .pub_footer_1018_footerSection,
[data-theme="neon"] .pub_footer_1018_footerSection {
  --sec-bg: var(--bg, #09090b);
  --sec-card-bg: var(--card-bg, #121214);
  --sec-text: var(--text, #ccff00);
  --sec-muted: var(--text-muted, #a3e635);
  --sec-accent: var(--accent, #ff007f);
  --sec-border: var(--border, #ccff00);
}

.pub_footer_1018_container {
  max-width: var(--max-w, 1240px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

/* Main Neobrutalist Footer Card */
.pub_footer_1018_footerCard {
  background-color: var(--sec-card-bg, #ffffff);
  border: 4px solid var(--sec-border, #000000);

  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Top Header Bar */
.pub_footer_1018_topHeader {
  padding: 36px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-gap, 24px);
  flex-wrap: wrap;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_brandGroup {
  display: flex;
  flex-direction: column;
  gap: var(--space-content-gap, 8px);
}

.pub_footer_1018_brandBadge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 10px);
  background-color: var(--sec-bg, #fdf4ff);
  padding: 8px 16px;
  border: 3px solid var(--sec-border, #000000);

}

.pub_footer_1018_brandTitle {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  color: var(--sec-text, #0f172a);
}

.pub_footer_1018_brandSub {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_taglineText {
  color: var(--sec-muted, #475569);
  margin: 0;
  font-weight: 500;
}

/* Navigation Bar */
.pub_footer_1018_navBar {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_navLink {
  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 800;
  letter-spacing: var(--tracking, 0.05em);
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 6px 12px;
  border: 2px solid transparent;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_navLink:hover {
  border-color: var(--sec-border, #000000);
  background-color: var(--sec-bg, #fdf4ff);
}

/* Floating macOS Dock Section */
.pub_footer_1018_dockWrapper {
  padding: 40px 24px;
  background-color: var(--sec-bg, #fdf4ff);
  display: flex;
  justify-content: center;
  border-bottom: 3px solid var(--sec-border, #000000);
}

.pub_footer_1018_macDock {
  background-color: var(--sec-card-bg, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  padding: 10px 16px;
  display: inline-flex;
  align-items: center;
gap: var(--space-content-gap, 12px);
  flex-wrap: wrap;
  justify-content: center;
}

.pub_footer_1018_dockPill {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  color: var(--sec-text, #0f172a);
  text-decoration: none;
  padding: 8px 14px;
  background-color: var(--sec-bg, #fdf4ff);
  border: 2px solid var(--sec-border, #000000);
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.pub_footer_1018_dockPill i {
  color: var(--sec-accent, #ec4899);
}

.pub_footer_1018_dockPill:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

.pub_footer_1018_dockPill:hover i {
  color: var(--sec-card-bg, #ffffff);
}

/* Bottom Legal Bar */
.pub_footer_1018_bottomBar {
  padding: var(--space-card-padding, 24px) 40px;
  background-color: var(--sec-card-bg, #ffffff);
  display: flex;
  align-items: center;
  justify-content: space-between;
gap: var(--space-content-gap, 20px);
  flex-wrap: wrap;
}

.pub_footer_1018_legalGroup {
  display: flex;
  align-items: center;
  gap: var(--space-content-gap, 16px);
  flex-wrap: wrap;
}

.pub_footer_1018_copyrightText {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 700;
  color: var(--sec-muted, #475569);
}

.pub_footer_1018_statusBadge {
  font-family: var(--font-heading, monospace, sans-serif);
  font-weight: 800;
  background-color: var(--sec-bg, #fdf4ff);
  color: var(--sec-text, #0f172a);
  padding: 4px 10px;
  border: 1px solid var(--sec-border, #000000);
}

.pub_footer_1018_backToTopBtn {
  background-color: var(--sec-cta-bg, #000000);
  color: var(--sec-cta-text, #ffffff);
  border: 3px solid var(--sec-border, #000000);

  font-family: var(--font-heading, system-ui, sans-serif);
  font-weight: 900;
  padding: 8px 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--space-content-gap, 8px);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.pub_footer_1018_backToTopBtn:hover {
  transform: translate(-2px, -2px);

  background-color: var(--sec-accent, #ec4899);
  color: var(--sec-card-bg, #ffffff);
}

/* Responsive Styles */
@media (max-width: 768px) {
  .pub_footer_1018_topHeader {
    flex-direction: column;
    align-items: flex-start;
    padding: 28px 24px;
  }

  .pub_footer_1018_bottomBar {
    padding: 20px 24px;
    flex-direction: column;
    align-items: flex-start;
  }

  .pub_footer_1018_backToTopBtn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pub_footer_1018_footerSection {
    padding-top: var(--pt, 48px);
    padding-bottom: var(--pb, 48px);
  }

  .pub_footer_1018_dockWrapper {
    padding: 24px 16px;
  }

  .pub_footer_1018_macDock {
    width: 100%;
    box-sizing: border-box;
  }

  .pub_footer_1018_dockPill {
    flex: 1;
    justify-content: center;
  }
}