/* ==========================================================================
   NextBuilder — front-end design system
   All classes are nxb- prefixed and variables nxb- prefixed so the plugin
   coexists with any theme. Defaults mirror the teal/gold luxury system;
   every token can be overridden from Page settings (design option).
   ========================================================================== */

:root {
  --nxb-dark: #11302e;
  --nxb-dark-rgb: 17, 48, 46;
  --nxb-dark2: #16403d;
  --nxb-primary: #3d6b66;
  --nxb-accent: #ab8a60;
  --nxb-accent-rgb: 171, 138, 96;
  --nxb-accent2: #c2a87e;
  --nxb-light: #f8f4ec;
  --nxb-light2: #f1ead9;
  --nxb-ink: #1c2321;
  --nxb-ink-rgb: 28, 35, 33;
  --nxb-ink2: #4c5a56;
  --nxb-white: #ffffff;
  --nxb-footer: #0d2422;
  --nxb-footer-rgb: 13, 36, 34;
  --nxb-font-display: "DM Serif Display", Georgia, serif;
  --nxb-font-body: "DM Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --nxb-container: 1180px;
  --nxb-radius: 14px;
  --nxb-section-pad: 96px;
  --nxb-shadow: 0 18px 50px -18px rgba(var(--nxb-dark-rgb), 0.35);
}

/* ==========================================================================
   Layout primitives (section → column → widget tree)
   ========================================================================== */
.nxb-root { font-family: var(--nxb-font-body); font-weight: 300; color: var(--nxb-ink);
  line-height: 1.65; -webkit-font-smoothing: antialiased; font-size: var(--nxb-base-font, 16px); }
/* full-bleed sections use 100vw (which includes the scrollbar) — clip the
   few overflowing pixels at the body so no horizontal scrollbar appears */
body:has(.nxb-root) { overflow-x: clip; }
.nxb-root *, .nxb-root *::before, .nxb-root *::after,
.nxb-header *, .nxb-header *::before, .nxb-header *::after,
.nxb-footer *, .nxb-footer *::before, .nxb-footer *::after { box-sizing: border-box; }
.nxb-root h1, .nxb-root h2, .nxb-root h3, .nxb-root h4, .nxb-root p, .nxb-root ul, .nxb-root figure { margin: 0; padding: 0; }
.nxb-root img { max-width: 100%; display: block; height: auto; }
.nxb-root ul { list-style: none; }

/* Full-bleed breakout: builder sections escape a narrow theme content column */
.nxb-root .nxb-section { width: 100vw; margin-left: calc(50% - 50vw); position: relative; }
.nxb-container { max-width: var(--nxb-container); margin: 0 auto; padding: 0 24px; }

.nxb-fullbleed { display: flex; flex-direction: column; justify-content: flex-end; }
.nxb-has-bg { overflow: hidden; }
.nxb-bg, .nxb-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nxb-bg { z-index: 0; }
.nxb-bg .swiper, .nxb-bg .swiper-wrapper { position: absolute; inset: 0; height: 100%; }
.nxb-has-bg > .nxb-container { position: relative; z-index: 2; }
/* stretch = every column matches the tallest column in the row, so each
   column's own vertical-align (top/middle/bottom) positions its content
   within that shared height. Sections can still opt out via "Columns
   vertical align" (compiles an align-items override on this row). */
.nxb-row { display: flex; flex-wrap: wrap; margin: 0 -16px; row-gap: 30px; align-items: stretch; }
.nxb-col { padding: 0 16px; display: flex; flex-direction: column; gap: 16px; min-width: 0; flex: 0 0 100%; max-width: 100%; }
.nxb-widget { min-width: 0; }
.nxb-h { font-family: var(--nxb-font-display); }
.nxb-t { font-size: 17px; line-height: 1.65; }
.nxb-sec-dark .nxb-t { color: rgba(255, 255, 255, 0.82); }
.nxb-fig { margin: 0; }
.nxb-w-image img { border-radius: var(--nxb-radius); width: 100%; display: block; }
/* image-widget shapes (the img carries an inline style too, this is the fallback) */
.nxb-w-image img.nxb-img-square { border-radius: 0; }
.nxb-w-image img.nxb-img-rounded { border-radius: 18px; }
.nxb-w-image img.nxb-img-circle { border-radius: 50%; aspect-ratio: 1; object-fit: cover; }

/* Page setting: hide the theme's default page/post title on builder pages */
.nxb-hide-title .wp-block-post-title,
.nxb-hide-title .wp-block-post-title a,
.nxb-hide-title h1.entry-title,
.nxb-hide-title .entry-header .entry-title,
.nxb-hide-title .page .entry-title { display: none !important; }
.nxb-w-image figcaption { font-size: 13px; color: var(--nxb-ink2); margin-top: 12px; letter-spacing: 0.06em; }
.nxb-divider { border: 0; border-top: 1px solid rgba(var(--nxb-dark-rgb), 0.15); margin: 0; width: 100%; }
.nxb-w-stats { width: 100%; margin-top: 22px; }
.nxb-w-gallery, .nxb-w-features, .nxb-w-amenities, .nxb-w-units, .nxb-w-payment,
.nxb-w-faq, .nxb-w-form, .nxb-w-agent, .nxb-w-buttons { width: 100%; }
.nxb-w-gallery { margin-top: 18px; }
.nxb-empty { border: 1.5px dashed rgba(var(--nxb-dark-rgb), 0.25); border-radius: 10px;
  padding: 28px; text-align: center; color: var(--nxb-ink2); font-size: 14px; }
.nxb-sec-dark .nxb-empty { border-color: rgba(255, 255, 255, 0.22); color: rgba(255, 255, 255, 0.55); }
.nxb-hidden { outline: 2px dashed rgba(226, 117, 107, 0.6); outline-offset: -2px; opacity: 0.5; }

/* ---------- sections ---------- */
.nxb-sec { padding: var(--nxb-section-pad) 0; }
.nxb-sec-light { background: var(--nxb-light); }
.nxb-sec-cream { background: var(--nxb-light2); }
.nxb-sec-dark { background: var(--nxb-dark); color: var(--nxb-white); }
.nxb-sec-dark .nxb-sec-title { color: var(--nxb-white); }

/* ---------- typography ---------- */
.nxb-root h1, .nxb-root h2, .nxb-root h3, .nxb-hero-title, .nxb-sec-title {
  font-family: var(--nxb-font-display); font-weight: 400; }
/* Titles wrap gracefully: a word longer than its column breaks at the box edge
   instead of overflowing the layout or stacking one letter per line. word-break
   stays normal (never break-all) so ordinary words only ever break at spaces —
   this also neutralises any theme that forces break-all/anywhere on headings. */
.nxb-root h1, .nxb-root h2, .nxb-root h3, .nxb-root h4, .nxb-root h5, .nxb-root h6,
.nxb-root p, .nxb-h, .nxb-hero-title, .nxb-sec-title, .nxb-eyebrow, .nxb-t,
.nxb-brand-text, .nxb-brand-by, .nxb-announcebar {
  overflow-wrap: break-word; word-break: normal; hyphens: none; }
/* Linked heading text inherits the title's colour/size; underline only on hover. */
.nxb-h-link { color: inherit; text-decoration: none; transition: opacity .2s; }
.nxb-h-link:hover { text-decoration: underline; text-underline-offset: 0.12em; opacity: 0.85; }
.nxb-eyebrow { font-size: 13px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--nxb-primary); margin-bottom: 14px; }
.nxb-eyebrow-gold { color: var(--nxb-accent2); }
.nxb-sec-title { font-size: clamp(30px, 4.4vw, 46px); line-height: 1.12; margin-bottom: 26px; max-width: 21em; }
.nxb-sec-intro { font-size: 18px; max-width: 640px; margin-bottom: 44px; color: var(--nxb-ink2); }
.nxb-sec-dark .nxb-sec-intro { color: rgba(255, 255, 255, 0.78); }
.nxb-hero-title { font-size: clamp(44px, 8vw, 96px); line-height: 1.02; letter-spacing: 0.04em; margin-bottom: 18px; }
.nxb-hero-sub { font-family: var(--nxb-font-display); font-style: italic; font-size: clamp(20px, 2.6vw, 28px);
  color: var(--nxb-ink2); margin-bottom: 14px; }
.nxb-sec-dark .nxb-hero-sub { color: rgba(255, 255, 255, 0.92); }
.nxb-hero-chips { font-size: 14px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--nxb-accent2); margin-bottom: 34px; }
.nxb-col-text { margin-bottom: 18px; font-size: 17px; }
.nxb-sec-dark .nxb-col-text { color: rgba(255, 255, 255, 0.82); }

/* ---------- buttons ---------- */
.nxb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 32px; font-family: var(--nxb-font-body); font-size: 14px; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase; text-decoration: none;
  border: 1px solid transparent; border-radius: 60px; cursor: pointer;
  transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease; }
.nxb-btn:hover { transform: translateY(-2px); }
.nxb-btn-ic { width: 18px; height: 18px; display: inline-flex; }
.nxb-btn-ic svg { width: 100%; height: 100%; }
.nxb-btn-gold { background: linear-gradient(120deg, var(--nxb-accent), var(--nxb-accent2));
  color: var(--nxb-dark); font-weight: 600; box-shadow: 0 12px 30px -10px rgba(var(--nxb-accent-rgb), 0.65); }
.nxb-btn-gold:hover { box-shadow: 0 16px 36px -10px rgba(var(--nxb-accent-rgb), 0.8); color: var(--nxb-dark); }
.nxb-btn-outline-light { border-color: rgba(255, 255, 255, 0.6); color: var(--nxb-white); }
.nxb-btn-outline-light:hover { background: rgba(255, 255, 255, 0.12); color: var(--nxb-white); }
.nxb-btn-outline-dark { border-color: var(--nxb-dark2); color: var(--nxb-dark2); }
.nxb-btn-outline-dark:hover { background: var(--nxb-dark2); color: var(--nxb-white); }
.nxb-btn-sm { padding: 10px 22px; font-size: 12px; }
.nxb-btn-lg { padding: 19px 40px; font-size: 15px; }
.nxb-btn-block { width: 100%; }
.nxb-btns { display: flex; flex-wrap: wrap; gap: 16px; }

/* ---------- check lists ---------- */
.nxb-check-list { list-style: none; margin-top: 10px; }
.nxb-check-list li { position: relative; padding: 7px 0 7px 34px; font-size: 16px; }
.nxb-check-list li::before { content: "✓"; position: absolute; left: 0; top: 7px; width: 22px; height: 22px;
  border-radius: 50%; background: var(--nxb-primary); color: var(--nxb-white); font-size: 12px;
  line-height: 22px; text-align: center; }
.nxb-check-gold li::before { background: var(--nxb-accent); }
.nxb-cols-2 { columns: 2; column-gap: 32px; }
.nxb-cols-2 li { break-inside: avoid; }

/* ---------- gold offset frame ---------- */
.nxb-frame-gold { position: relative; }
.nxb-frame-gold::before { content: ""; position: absolute; inset: 18px -18px -18px 18px;
  border: 1px solid var(--nxb-accent); border-radius: var(--nxb-radius); pointer-events: none; }
.nxb-frame-gold img { position: relative; }

/* ---------- stats ---------- */
.nxb-statsbar { position: relative; z-index: 2; border-top: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(var(--nxb-dark-rgb), 0.85); backdrop-filter: blur(6px); }
.nxb-stats-grid { display: grid; grid-template-columns: repeat(var(--nxb-grid-cols, 4), minmax(0, 1fr)); gap: var(--nxb-grid-gap, 0px); }
.nxb-stat { padding: 22px 10px; text-align: center; }
.nxb-stat + .nxb-stat { border-left: 1px solid rgba(255, 255, 255, 0.12); }
.nxb-stat-value { display: block; font-family: var(--nxb-font-display); font-size: clamp(22px, 3vw, 34px); color: var(--nxb-accent2); }
.nxb-stat-label { font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(255, 255, 255, 0.85); }

/* ---------- features ---------- */
.nxb-feature-grid { display: grid; grid-template-columns: repeat(var(--nxb-grid-cols, 3), minmax(0, 1fr)); gap: var(--nxb-grid-gap, 16px); margin-top: 24px; }
.nxb-feature-item { display: flex; align-items: center; gap: 14px; padding: 18px 22px; background: var(--nxb-white);
  border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); border-radius: var(--nxb-radius); font-size: 15.5px;
  line-height: 1.4; transition: transform 0.25s ease, box-shadow 0.25s ease; color: var(--nxb-feat-text, inherit); }
.nxb-feature-item:hover { transform: translateY(-3px); box-shadow: var(--nxb-shadow); }
.nxb-feature-check { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: var(--nxb-feat-icon, var(--nxb-accent));
  color: var(--nxb-white); font-size: 13px; line-height: 26px; text-align: center; }

/* ---------- amenities / icon box ---------- */
.nxb-amenity-grid { display: grid; grid-template-columns: repeat(var(--nxb-grid-cols, 4), minmax(0, 1fr)); gap: var(--nxb-grid-gap, 18px); margin-bottom: 40px; }
.nxb-amenity-card { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08);
  border-radius: var(--nxb-radius); padding: 26px 22px; font-size: 15.5px; font-weight: 400; color: var(--nxb-ink);
  display: flex; flex-direction: column; gap: 12px; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.nxb-amenity-card:hover { transform: translateY(-4px); box-shadow: var(--nxb-shadow); }
.nxb-amenity-icon { width: 46px; height: 46px; border-radius: 12px; background: rgba(var(--nxb-accent-rgb), 0.12);
  color: var(--nxb-accent); display: flex; align-items: center; justify-content: center; }
.nxb-amenity-icon svg { width: 24px; height: 24px; }
.nxb-gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.nxb-gallery-grid img { border-radius: var(--nxb-radius); height: 280px; width: 100%; object-fit: cover; }

/* ---------- payment ---------- */
.nxb-payment-grid { display: grid; grid-template-columns: 2fr 3fr; gap: 22px; margin-bottom: 28px; }
.nxb-payment-card { border-radius: var(--nxb-radius); padding: 42px 36px; background: var(--nxb-white);
  border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); color: var(--nxb-ink); }
.nxb-payment-accent { background: var(--nxb-dark); color: var(--nxb-white); }
.nxb-payment-pct { display: block; font-family: var(--nxb-font-display); font-size: clamp(48px, 6vw, 72px);
  line-height: 1; color: var(--nxb-accent); margin-bottom: 14px; }
.nxb-payment-card h3 { font-size: 24px; margin-bottom: 10px; }
.nxb-payment-card p { font-size: 16px; color: var(--nxb-ink2); }
.nxb-payment-accent p { color: rgba(255, 255, 255, 0.8); }
.nxb-payment-notes { list-style: none; display: flex; flex-wrap: wrap; gap: 12px 28px; }
.nxb-payment-notes li { font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--nxb-primary); }
.nxb-sec-dark .nxb-payment-notes li { color: rgba(255, 255, 255, 0.75); }
.nxb-payment-notes li::before { content: "—"; margin-right: 8px; color: var(--nxb-accent); }

/* ---------- units ---------- */
.nxb-unit-grid { display: grid; grid-template-columns: repeat(var(--nxb-grid-cols, 3), minmax(0, 1fr)); gap: var(--nxb-grid-gap, 22px); }
.nxb-unit-grid:has(> :nth-child(4)) { grid-template-columns: repeat(var(--nxb-grid-cols, 4), minmax(0, 1fr)); }
.nxb-unit-card { position: relative; background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08);
  border-radius: var(--nxb-radius); padding: 36px 30px; display: flex; flex-direction: column; color: var(--nxb-ink); }
.nxb-unit-featured { background: var(--nxb-dark); color: var(--nxb-white); box-shadow: var(--nxb-shadow); }
.nxb-unit-badge { position: absolute; top: -13px; left: 30px; background: linear-gradient(120deg, var(--nxb-accent), var(--nxb-accent2));
  color: var(--nxb-white); font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase;
  padding: 5px 14px; border-radius: 30px; }
.nxb-unit-img { width: calc(100% + 60px); max-width: none; margin: -36px -30px 24px; height: 170px;
  object-fit: cover; border-radius: var(--nxb-radius) var(--nxb-radius) 0 0; }
.nxb-unit-card h3 { font-size: 28px; margin-bottom: 20px; }
.nxb-unit-card dl { flex: 1; margin: 0 0 26px; }
.nxb-unit-card dl div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0;
  border-bottom: 1px solid rgba(var(--nxb-dark-rgb), 0.08); font-size: 15px; }
.nxb-unit-featured dl div { border-color: rgba(255, 255, 255, 0.14); }
.nxb-unit-card dt { color: var(--nxb-ink2); }
.nxb-unit-featured dt { color: rgba(255, 255, 255, 0.65); }
.nxb-unit-card dd { text-align: right; font-weight: 400; margin: 0; }

/* ---------- agent ---------- */
.nxb-agent-grid { display: grid; grid-template-columns: 340px 1fr; gap: 64px; align-items: start; }
.nxb-agent-photo img { border-radius: var(--nxb-radius); box-shadow: var(--nxb-shadow); }
.nxb-agent-role { font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--nxb-accent2); margin-bottom: 34px; }
.nxb-agent-text h3 { font-size: 22px; margin-bottom: 14px; }
.nxb-agent-text .nxb-check-list { margin-bottom: 34px; }

/* ---------- FAQ ---------- */
.nxb-faq-list { display: flex; flex-direction: column; gap: 14px; }
.nxb-faq-item { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08);
  border-radius: var(--nxb-radius); padding: 0 26px; overflow: hidden; color: var(--nxb-ink); }
.nxb-faq-item summary { list-style: none; cursor: pointer; font-family: var(--nxb-font-display);
  font-size: 19px; padding: 22px 36px 22px 0; position: relative; }
.nxb-faq-item summary::-webkit-details-marker { display: none; }
.nxb-faq-item summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  font-family: var(--nxb-font-body); font-size: 26px; font-weight: 300; color: var(--nxb-accent); transition: transform 0.25s ease; }
.nxb-faq-item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.nxb-faq-item p { padding: 0 0 24px; color: var(--nxb-ink2); font-size: 16px; }

/* ---------- form ---------- */
.nxb-form-layout { display: grid; grid-template-columns: 1fr 1.25fr; gap: 64px; align-items: start; }
.nxb-form-aside .nxb-check-list { margin-bottom: 36px; }
.nxb-form { background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: calc(var(--nxb-radius) + 6px); padding: 44px; backdrop-filter: blur(4px); }
.nxb-sec-light .nxb-form, .nxb-sec-cream .nxb-form, .nxb-sec-none .nxb-form { background: var(--nxb-white);
  border-color: rgba(var(--nxb-dark-rgb), 0.1); }
.nxb-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
.nxb-form-field label { display: flex; flex-direction: column; gap: 8px; font-size: 12px; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--nxb-cf-label, rgba(255, 255, 255, 0.7)); }
.nxb-sec-light .nxb-form-field label, .nxb-sec-cream .nxb-form-field label { color: var(--nxb-cf-label, var(--nxb-ink2)); }
.nxb-form-field input, .nxb-form-field select, .nxb-form-field textarea { font-family: var(--nxb-font-body); font-size: 16px; font-weight: 300;
  color: var(--nxb-cf-field-text, var(--nxb-white)); background: var(--nxb-cf-field-bg, rgba(255, 255, 255, 0.07));
  border: 1px solid var(--nxb-cf-field-border, rgba(255, 255, 255, 0.45));
  border-radius: var(--nxb-cf-radius, 10px); padding: 14px 16px; transition: border-color 0.2s ease, background 0.2s ease; width: 100%; }
.nxb-form-field textarea { resize: vertical; min-height: 96px; }
.nxb-sec-light .nxb-form-field input, .nxb-sec-cream .nxb-form-field input,
.nxb-sec-light .nxb-form-field select, .nxb-sec-cream .nxb-form-field select,
.nxb-sec-light .nxb-form-field textarea, .nxb-sec-cream .nxb-form-field textarea { color: var(--nxb-cf-field-text, var(--nxb-ink));
  background: var(--nxb-cf-field-bg, var(--nxb-light)); border-color: var(--nxb-cf-field-border, rgba(var(--nxb-dark-rgb), 0.25)); }
.nxb-form-field input::placeholder, .nxb-form-field textarea::placeholder { color: rgba(255, 255, 255, 0.55); }
.nxb-sec-light .nxb-form-field input::placeholder, .nxb-sec-cream .nxb-form-field input::placeholder,
.nxb-sec-light .nxb-form-field textarea::placeholder, .nxb-sec-cream .nxb-form-field textarea::placeholder { color: rgba(var(--nxb-ink-rgb), 0.4); }
.nxb-form-field input:focus, .nxb-form-field select:focus, .nxb-form-field textarea:focus { border-color: var(--nxb-cf-accent, var(--nxb-accent2)); outline: 3px solid var(--nxb-cf-accent, var(--nxb-accent2)); outline-offset: 1px; }
/* ---- contact form (generic, editable fields + style overrides) ---- */
.nxb-contact { max-width: var(--nxb-cf-maxw, 720px); margin: 0 auto; }
.nxb-contact-head { text-align: center; margin-bottom: 30px; }
.nxb-contact-head .nxb-sec-title { margin-bottom: 12px; }
.nxb-contact-head .nxb-sec-intro { font-size: 17px; line-height: 1.6; opacity: 0.85; margin: 0 auto; max-width: 46em; }
.nxb-form-grid { display: grid; grid-template-columns: repeat(var(--nxb-cf-cols, 2), minmax(0, 1fr)); gap: var(--nxb-cf-gap, 20px); margin-bottom: 22px; }
.nxb-form-grid .nxb-form-wide { grid-column: 1 / -1; }
.nxb-contact-form .nxb-btn { width: 100%; }
.nxb-contact-form .nxb-btn-gold { background: var(--nxb-cf-btn, linear-gradient(120deg, var(--nxb-accent), var(--nxb-accent2))); color: var(--nxb-cf-btn-text, var(--nxb-dark)); }
.nxb-contact-form .nxb-btn-gold:hover { color: var(--nxb-cf-btn-text, var(--nxb-dark)); }
.nxb-req { color: var(--nxb-cf-accent, var(--nxb-accent2)); }
@media (max-width: 640px) { .nxb-form-grid { grid-template-columns: 1fr; } }
.nxb-form-field input.invalid { border-color: #e2756b; }
.nxb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nxb-form-error { background: rgba(226, 117, 107, 0.14); border: 1px solid rgba(226, 117, 107, 0.5); color: #f3b9b3;
  border-radius: 10px; padding: 12px 16px; font-size: 14.5px; margin-bottom: 20px; }
.nxb-form-privacy { font-size: 13px; color: rgba(255, 255, 255, 0.5); text-align: center; margin-top: 16px; }
.nxb-sec-light .nxb-form-privacy, .nxb-sec-cream .nxb-form-privacy { color: var(--nxb-ink2); }
.nxb-spinner { width: 18px; height: 18px; border: 2px solid rgba(var(--nxb-dark-rgb), 0.35);
  border-top-color: var(--nxb-dark); border-radius: 50%; animation: nxb-spin 0.7s linear infinite; }
@keyframes nxb-spin { to { transform: rotate(360deg); } }
.nxb-form-success { text-align: center; padding: 60px 30px; border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: calc(var(--nxb-radius) + 6px); background: rgba(255, 255, 255, 0.04); }
.nxb-success-icon { width: 72px; height: 72px; margin: 0 auto 22px; border-radius: 50%;
  background: linear-gradient(120deg, var(--nxb-accent), var(--nxb-accent2)); color: var(--nxb-white);
  font-size: 34px; line-height: 72px; }
.nxb-form-success h3 { font-size: 30px; margin-bottom: 14px; }
.nxb-form-success p { color: rgba(255, 255, 255, 0.78); margin-bottom: 28px; }

/* ==========================================================================
   Sliders (Swiper) — luxury skin: bronze-glass arrows, gold dots,
   Ken-Burns zoom on the active slide, gold time-to-next progress bar.
   ========================================================================== */
.nxb-slider { position: relative; overflow: hidden; border-radius: var(--nxb-radius); min-height: 300px;
  background: #0b0f0e; width: 100%; height: 440px; }
.nxb-slider .swiper { position: absolute; inset: 0; height: 100%; }
.nxb-slider .swiper-slide img, .nxb-bgslider .swiper-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nxb-slide-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 24px 28px; z-index: 3;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.65)); color: #fff;
  font-family: var(--nxb-font-display); font-size: 20px; }
.nxb-sl-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 6; width: 44px; height: 44px;
  border-radius: 50%; border: 1px solid rgba(194, 168, 126, 0.55); background: rgba(17, 48, 46, 0.42);
  color: var(--nxb-accent2); font-size: 24px; line-height: 1; cursor: pointer; display: flex; align-items: center;
  justify-content: center; backdrop-filter: blur(4px);
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.nxb-sl-arrow:hover { background: var(--nxb-accent); border-color: var(--nxb-accent); color: #fff; }
.nxb-sl-prev { left: 16px; }
.nxb-sl-next { right: 16px; }
.nxb-dots { position: absolute; left: 0; right: 0; bottom: 16px; z-index: 6; display: flex; gap: 8px; justify-content: center; }
.nxb-dots .nxb-dot { width: 9px; height: 9px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, 0.45);
  cursor: pointer; padding: 0; transition: width 0.2s, background 0.2s; display: inline-block; }
.nxb-dots .nxb-dot.active { background: var(--nxb-accent2); width: 22px; border-radius: 6px; }
@keyframes nxb-kenburns { from { transform: scale(1.09); } to { transform: scale(1); } }
.nxb-kb .swiper-slide-active img { animation: nxb-kenburns 8s ease-out both; }
.nxb-progress { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; z-index: 7;
  background: linear-gradient(90deg, var(--nxb-accent), var(--nxb-accent2)); pointer-events: none; }
.nxb-slide-cap { transform: translateY(14px); opacity: 0; transition: transform 0.6s ease, opacity 0.6s ease; }
.swiper-slide-active .nxb-slide-cap { transform: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .nxb-kb .swiper-slide-active img { animation: none; }
  .nxb-progress { display: none; }
  .nxb-slide-cap { transition: none; transform: none; opacity: 1; }
}

/* ==========================================================================
   Entrance animations (GSAP-driven). Elements stay visible without JS;
   the runtime adds .nxb-anim-ready before animating, so no dead content.
   ========================================================================== */
.nxb-anim-ready .nxb-anim:not(.nxb-in), .nxb-anim-ready .nxb-reveal:not(.nxb-in) { opacity: 0; }
.nxb-no-anim .nxb-anim, .nxb-no-anim .nxb-reveal { opacity: 1 !important; transform: none !important; }
html.nxb-scroll-off { scroll-behavior: auto; }

/* ==========================================================================
   Header chrome
   ========================================================================== */
.nxb-header { position: fixed; inset: 0 0 auto 0; z-index: 100; padding: 14px 0;
  font-family: var(--nxb-font-body); font-size: 16px;
  transition: background 0.35s ease, box-shadow 0.35s ease, padding 0.35s ease; }
body.admin-bar .nxb-header { top: 32px; }
.nxb-header.scrolled { background: var(--nxb-hdr-bg, rgba(var(--nxb-dark-rgb), 0.96)); backdrop-filter: blur(10px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18); padding: 8px 0; }
.nxb-hdr-solid { position: sticky; top: 0; background: var(--nxb-hdr-bg, rgba(var(--nxb-dark-rgb), 0.96));
  backdrop-filter: blur(10px); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18); }
.nxb-hdr-static { position: absolute; }
.nxb-hdr-solid.nxb-hdr-static { position: relative; }
.nxb-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.nxb-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
/* Logo: preserve the real shape/aspect by default (height set inline from the
   Logo height setting); shape is opt-in so non-circular logos aren't cropped. */
.nxb-brand-logo { width: auto; max-width: 220px; height: 44px; object-fit: contain; border-radius: 0; }
.nxb-brand-logo.nxb-logo-rounded { border-radius: 10px; }
.nxb-brand-logo.nxb-logo-circle { width: auto; aspect-ratio: 1; border-radius: 50%; object-fit: cover; }
.nxb-brand-text { font-family: var(--nxb-font-display); font-size: 19px; letter-spacing: 0.08em;
  color: var(--nxb-hdr-text, var(--nxb-white)); white-space: nowrap; }
.nxb-brand-text em { font-style: italic; font-size: 14px; color: var(--nxb-accent2); }
.nxb-nav { display: flex; align-items: center; gap: 26px; }
.nxb-nav a { color: var(--nxb-hdr-text, rgba(255, 255, 255, 0.85)); text-decoration: none; font-size: 14px;
  font-weight: 400; letter-spacing: 0.04em; transition: color 0.2s ease; white-space: nowrap; }
.nxb-nav a:hover { color: var(--nxb-accent2); }
.nxb-nav a.nxb-nav-cta { color: var(--nxb-dark); }
/* light hero → dark text over the transparent header until scrolled */
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-brand-text { color: var(--nxb-hdr-text, var(--nxb-ink)); }
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-brand-text em { color: var(--nxb-accent); }
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-nav a { color: var(--nxb-hdr-text, rgba(var(--nxb-ink-rgb), 0.82)); }
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-nav a:hover { color: var(--nxb-accent); }
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-nav a.nxb-nav-cta { color: var(--nxb-dark); }
.nxb-hdr-onlight:not(.scrolled):not(.nxb-hdr-solid) .nxb-nav-toggle span { background: var(--nxb-ink); }
.nxb-nav-toggle { display: none; flex-direction: column; gap: 5px; background: none; border: 0; padding: 10px; cursor: pointer; }
.nxb-nav-toggle span { width: 24px; height: 2px; background: var(--nxb-hdr-text, var(--nxb-white)); transition: 0.3s; }

/* ==========================================================================
   Footer chrome
   ========================================================================== */
.nxb-footer { background: var(--nxb-footer); color: rgba(255, 255, 255, 0.7); padding: 56px 0 30px;
  font-family: var(--nxb-font-body); font-size: 15px; }
.nxb-footer-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;
  gap: 20px; margin-bottom: 30px; }
.nxb-footer-contact { display: flex; flex-direction: column; gap: 4px; text-align: right; }
.nxb-footer-nav { display: flex; flex-wrap: wrap; gap: 6px 22px; }
.nxb-footer-nav a { color: rgba(255, 255, 255, 0.75); text-decoration: none; font-size: 14px; padding: 6px 0; }
.nxb-footer-nav a:hover { color: var(--nxb-accent2); }
.nxb-footer-contact a { color: var(--nxb-accent2); text-decoration: none; font-size: 15px; display: inline-block; padding: 6px 0; }
.nxb-footer-disclaimer { font-size: 13px; line-height: 1.7; color: rgba(255, 255, 255, 0.65);
  border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 26px; margin: 0 0 22px; }
.nxb-footer-bottom { font-size: 13px; color: rgba(255, 255, 255, 0.65); }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 960px) {
  .nxb-agent-grid, .nxb-form-layout { grid-template-columns: 1fr; gap: 36px; }
  .nxb-feature-grid { grid-template-columns: repeat(var(--nxb-grid-cols, 2), minmax(0, 1fr)); }
  .nxb-frame-gold::before { inset: 12px -12px -12px 12px; }
  .nxb-agent-photo { max-width: 320px; }
  .nxb-amenity-grid { grid-template-columns: repeat(var(--nxb-grid-cols, 2), minmax(0, 1fr)); }
  .nxb-unit-grid, .nxb-unit-grid:has(> :nth-child(4)) { grid-template-columns: repeat(var(--nxb-grid-cols, 1), minmax(0, 1fr)); max-width: 460px; margin: 0 auto; }
  .nxb-unit-featured { order: -1; }
  .nxb-payment-grid { grid-template-columns: 1fr; }
  .nxb-gallery-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1020px) {
  .nxb-nav-toggle { display: flex; }
  .nxb-nav { position: fixed; top: 0; right: 0; bottom: 0; width: min(320px, 84vw); background: var(--nxb-dark);
    flex-direction: column; align-items: flex-start; justify-content: center; gap: 28px; padding: 40px 36px;
    transform: translateX(100%); transition: transform 0.35s ease; box-shadow: -20px 0 60px rgba(0, 0, 0, 0.35); z-index: 120; }
  .nxb-nav.open { transform: none; }
  .nxb-nav a { font-size: 18px; padding: 10px 0; color: rgba(255, 255, 255, 0.85) !important; }
  .nxb-nav a.nxb-nav-cta { color: var(--nxb-dark) !important; }
  .nxb-nav-toggle.open { position: relative; z-index: 130; }
  .nxb-nav-toggle.open span { background: #fff; }
  .nxb-nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nxb-nav-toggle.open span:nth-child(2) { opacity: 0; }
  .nxb-nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .nxb-cta-deskonly { display: none; }
  .nxb-stats-grid { grid-template-columns: repeat(var(--nxb-grid-cols, 2), minmax(0, 1fr)); }
  .nxb-stat:nth-child(3) { border-left: 0; }
  .nxb-stat { border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .nxb-stat:nth-child(-n+2) { border-top: 0; }
  .nxb-form-row { grid-template-columns: 1fr; }
  .nxb-feature-grid { grid-template-columns: repeat(var(--nxb-grid-cols, 1), minmax(0, 1fr)); }
  .nxb-form { padding: 28px 22px; }
  .nxb-cols-2 { columns: 1; }
  .nxb-gallery-grid { grid-template-columns: 1fr; }
  .nxb-footer-contact { text-align: left; }
}

/* tablet-width burger (menu = "tablet"): drawer up to 1200px */
@media (max-width: 1200px) {
  .nxb-menu-tablet .nxb-nav-toggle { display: flex; }
  .nxb-menu-tablet .nxb-nav { position: fixed; top: 0; right: 0; bottom: 0; width: min(340px, 86vw);
    background: var(--nxb-dark); flex-direction: column; align-items: flex-start; justify-content: center;
    gap: 26px; padding: 40px 36px; transform: translateX(100%); transition: transform 0.35s ease;
    box-shadow: -20px 0 60px rgba(0, 0, 0, 0.35); z-index: 120; }
  .nxb-menu-tablet .nxb-nav.open { transform: none; }
  .nxb-menu-tablet .nxb-nav a { font-size: 18px; padding: 10px 0; color: rgba(255, 255, 255, 0.85) !important; }
  .nxb-menu-tablet .nxb-nav a.nxb-nav-cta { color: var(--nxb-dark) !important; }
}

@media (prefers-reduced-motion: reduce) {
  .nxb-anim-ready .nxb-anim, .nxb-anim-ready .nxb-reveal { opacity: 1 !important; transform: none !important; }
}

/* ==========================================================================
   ONYX PRESET — monochrome black / white / gold, heavy uppercase display,
   sharp geometric UI, signature gold hatch on dark sections.
   Scoped to body.nxb-preset-onyx; palette overrides come from PHP vars.
   ========================================================================== */
.nxb-preset-onyx .nxb-root h1, .nxb-preset-onyx .nxb-root h2,
.nxb-preset-onyx .nxb-hero-title, .nxb-preset-onyx .nxb-sec-title {
  font-weight: 800; text-transform: uppercase; letter-spacing: -0.005em; line-height: 1.03; }
.nxb-preset-onyx .nxb-root h3 { text-transform: uppercase; font-weight: 700; letter-spacing: 0.01em; }
.nxb-preset-onyx .nxb-hero-title { letter-spacing: 0.01em; }
.nxb-preset-onyx .nxb-hero-sub { font-family: var(--nxb-font-body); font-style: normal; font-weight: 300; }
.nxb-preset-onyx .nxb-eyebrow { color: var(--nxb-accent); font-weight: 600; letter-spacing: 0.3em;
  display: inline-flex; align-items: center; gap: 14px; }
.nxb-preset-onyx .nxb-eyebrow::before { content: ""; width: 34px; height: 1px; background: var(--nxb-accent); display: inline-block; }
.nxb-preset-onyx .nxb-sec-dark .nxb-eyebrow, .nxb-preset-onyx .nxb-eyebrow-gold { color: var(--nxb-accent2); }
.nxb-preset-onyx .nxb-btn, .nxb-preset-onyx .nxb-amenity-icon, .nxb-preset-onyx .nxb-nav-cta,
.nxb-preset-onyx .nxb-form input, .nxb-preset-onyx .nxb-unit-badge, .nxb-preset-onyx .nxb-form,
.nxb-preset-onyx .nxb-form-success, .nxb-preset-onyx .nxb-dots .nxb-dot { border-radius: 0 !important; }
.nxb-preset-onyx .nxb-btn { text-transform: uppercase; letter-spacing: 0.14em; font-weight: 600; font-size: 13px; }
.nxb-preset-onyx .nxb-btn-gold { background: var(--nxb-accent); color: #0b0b0c; box-shadow: none; }
.nxb-preset-onyx .nxb-btn-gold:hover { background: var(--nxb-accent2); box-shadow: none; }
.nxb-preset-onyx .nxb-brand-text { text-transform: uppercase; font-weight: 800; letter-spacing: 0.04em; font-family: var(--nxb-font-body); }
.nxb-preset-onyx .nxb-brand-text em { font-style: normal; }
.nxb-preset-onyx .nxb-nav a { text-transform: uppercase; letter-spacing: 0.16em; font-size: 12px; }
.nxb-preset-onyx .nxb-header.scrolled { background: rgba(8, 8, 9, 0.97); }
.nxb-preset-onyx .nxb-sec { border-top: 1px solid rgba(var(--nxb-accent-rgb), 0.16); }
.nxb-preset-onyx .nxb-stat-value, .nxb-preset-onyx .nxb-payment-pct { font-weight: 800; letter-spacing: -0.01em; }
.nxb-preset-onyx .nxb-sec-dark:not(.nxb-has-bg)::after { content: ""; position: absolute; inset: 0;
  pointer-events: none; z-index: 0; opacity: 0.6;
  background-image: repeating-linear-gradient(45deg, rgba(var(--nxb-accent-rgb), 0.05) 0 1px, transparent 1px 24px),
    repeating-linear-gradient(-45deg, rgba(var(--nxb-accent-rgb), 0.05) 0 1px, transparent 1px 24px); }
.nxb-preset-onyx .nxb-sec-dark:not(.nxb-has-bg) > .nxb-container { position: relative; z-index: 1; }
.nxb-preset-onyx .nxb-feature-item, .nxb-preset-onyx .nxb-amenity-card, .nxb-preset-onyx .nxb-unit-card {
  border: 1px solid rgba(11, 11, 12, 0.14); border-radius: 0; box-shadow: none; }
.nxb-preset-onyx .nxb-feature-item:hover, .nxb-preset-onyx .nxb-amenity-card:hover, .nxb-preset-onyx .nxb-unit-card:hover {
  border-color: var(--nxb-accent); box-shadow: 0 20px 44px -26px rgba(11, 11, 12, 0.5); }
.nxb-preset-onyx .nxb-sec-dark .nxb-feature-item, .nxb-preset-onyx .nxb-sec-dark .nxb-amenity-card,
.nxb-preset-onyx .nxb-sec-dark .nxb-unit-card { border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.02); color: inherit; }
.nxb-preset-onyx .nxb-amenity-icon { background: rgba(var(--nxb-accent-rgb), 0.1); color: var(--nxb-accent);
  border: 1px solid rgba(var(--nxb-accent-rgb), 0.32); }
.nxb-preset-onyx .nxb-unit-featured, .nxb-preset-onyx .nxb-payment-accent { background: var(--nxb-accent); color: #0b0b0c; }
.nxb-preset-onyx .nxb-unit-featured .nxb-unit-badge { background: #0b0b0c; color: var(--nxb-accent2); }
.nxb-preset-onyx .nxb-payment-accent .nxb-payment-pct { color: #0b0b0c; }
.nxb-preset-onyx .nxb-frame-gold::before { border: 2px solid var(--nxb-accent); }
.nxb-preset-onyx .nxb-check-list li::before { border-radius: 0 !important; }
.nxb-preset-onyx .nxb-faq-item { border-radius: 0; }
.nxb-preset-onyx .nxb-w-image img, .nxb-preset-onyx .nxb-slider, .nxb-preset-onyx .nxb-gallery-grid img { border-radius: 0; }

/* ==========================================================================
   Header layout variants
   ========================================================================== */
.nxb-hdr-center .nxb-header-inner { flex-direction: column; gap: 10px; }
.nxb-hdr-stack .nxb-header-inner { flex-wrap: wrap; }
.nxb-hdr-stack .nxb-nav { width: 100%; justify-content: flex-start; }
@media (min-width: 1021px) {
  .nxb-hdr-stack .nxb-brand { margin-right: auto; }
}

/* ==========================================================================
   Footer layout variants
   ========================================================================== */
.nxb-ftr-centered .nxb-footer-top { flex-direction: column; text-align: center; gap: 16px; }
.nxb-ftr-centered .nxb-footer-contact { text-align: center; flex-direction: row; gap: 18px; justify-content: center; }
.nxb-ftr-centered .nxb-footer-disclaimer, .nxb-ftr-centered .nxb-footer-bottom { text-align: center; }
.nxb-ftr-minimal { padding: 26px 0; }
.nxb-ftr-minimal .nxb-footer-top { margin-bottom: 0; }
.nxb-ftr-minimal .nxb-footer-disclaimer { display: none; }
.nxb-ftr-minimal .nxb-footer-bottom { margin-top: 12px; }

/* ==========================================================================
   Gallery layouts + lightbox
   ========================================================================== */
.nxb-gallery-grid { grid-template-columns: repeat(var(--nxb-gal-cols, 3), 1fr); }
.nxb-gal-item { position: relative; margin: 0; overflow: hidden; border-radius: var(--nxb-radius); }
.nxb-gal-item img { transition: transform 0.5s ease; height: 280px; }
[data-nxb-lightbox] .nxb-gal-item { cursor: zoom-in; }
.nxb-gal-item:hover img { transform: scale(1.05); }
.nxb-gal-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 16px 12px; color: #fff; font-size: 13.5px;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.65)); opacity: 0; transform: translateY(8px); transition: 0.3s; }
.nxb-gal-item:hover .nxb-gal-cap { opacity: 1; transform: none; }
.nxb-gal-masonry { columns: var(--nxb-gal-cols, 3); column-gap: 18px; }
.nxb-gal-masonry .nxb-gal-item { break-inside: avoid; margin-bottom: 18px; }
.nxb-gal-masonry .nxb-gal-item img { height: auto; }
.nxb-gal-carousel { position: relative; min-height: 260px; }
.nxb-gal-carousel .swiper { overflow: hidden; border-radius: var(--nxb-radius); }
.nxb-gal-carousel .swiper-slide { position: relative; height: 300px; border-radius: var(--nxb-radius); overflow: hidden; }
.nxb-gal-carousel .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.nxb-gal-carousel .nxb-dots { position: static; margin-top: 14px; }
.nxb-lightbox { position: fixed; inset: 0; z-index: 100000; background: rgba(8, 10, 9, 0.94); display: flex;
  align-items: center; justify-content: center; padding: 4vh 4vw; opacity: 0; transition: opacity 0.25s ease; }
.nxb-lightbox.on { opacity: 1; }
.nxb-lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); }
.nxb-lightbox button { position: absolute; background: rgba(255, 255, 255, 0.08); color: #fff; border: 1px solid rgba(255, 255, 255, 0.25);
  width: 46px; height: 46px; border-radius: 50%; font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.nxb-lightbox .nxb-lb-close { top: 18px; right: 18px; }
.nxb-lightbox .nxb-lb-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.nxb-lightbox .nxb-lb-next { right: 18px; top: 50%; transform: translateY(-50%); }
.nxb-lightbox button:hover { background: var(--nxb-accent); border-color: var(--nxb-accent); }

/* ==========================================================================
   Team members
   ========================================================================== */
.nxb-team-grid { display: grid; grid-template-columns: repeat(var(--nxb-team-cols, 3), 1fr); gap: 26px; }
.nxb-team-card { text-align: center; }
.nxb-team-photo { position: relative; margin: 0 0 16px; border-radius: var(--nxb-radius); overflow: hidden; }
.nxb-team-photo img { width: 100%; height: 300px; object-fit: cover; transition: transform 0.5s ease; }
.nxb-team-card:hover .nxb-team-photo img { transform: scale(1.04); }
.nxb-team-socials { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; gap: 8px;
  padding: 26px 0 14px; background: linear-gradient(transparent, rgba(11, 20, 19, 0.75));
  opacity: 0; transform: translateY(10px); transition: 0.3s ease; }
.nxb-team-card:hover .nxb-team-socials { opacity: 1; transform: none; }
.nxb-team-socials a { width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, 0.14); color: #fff;
  display: flex; align-items: center; justify-content: center; backdrop-filter: blur(4px); transition: background 0.2s; }
.nxb-team-socials a:hover { background: var(--nxb-accent); }
.nxb-team-socials svg { width: 16px; height: 16px; }
.nxb-team-card h3 { font-size: 21px; margin-bottom: 2px; }
.nxb-team-role { font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--nxb-accent); }
.nxb-team-bio { font-size: 14.5px; color: var(--nxb-ink2); margin-top: 8px; }
.nxb-sec-dark .nxb-team-bio { color: rgba(255, 255, 255, 0.7); }

/* ==========================================================================
   Testimonials
   ========================================================================== */
.nxb-testimonials { position: relative; }
.nxb-testimonials .swiper { overflow: hidden; padding: 6px; }
.nxb-testi-card { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); border-radius: var(--nxb-radius);
  padding: 30px 28px; height: 100%; display: flex; flex-direction: column; gap: 14px; color: var(--nxb-ink);
  box-shadow: 0 10px 30px -18px rgba(var(--nxb-dark-rgb), 0.25); }
.nxb-sec-dark .nxb-testi-card { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.14); color: #fff; }
.nxb-testi-stars { color: var(--nxb-accent); letter-spacing: 3px; font-size: 15px; }
.nxb-testi-card blockquote { margin: 0; font-family: var(--nxb-font-display); font-size: 18px; line-height: 1.55; font-style: italic; flex: 1; }
.nxb-testi-who { display: flex; align-items: center; gap: 12px; }
.nxb-testi-who img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; }
.nxb-testi-who span { display: flex; flex-direction: column; }
.nxb-testi-who em { font-style: normal; font-size: 12.5px; color: var(--nxb-ink2); letter-spacing: 0.06em; text-transform: uppercase; }
.nxb-sec-dark .nxb-testi-who em { color: rgba(255, 255, 255, 0.6); }
.nxb-testimonials .nxb-dots { position: static; margin-top: 16px; }
.nxb-testimonials .nxb-dots .nxb-dot { background: rgba(var(--nxb-dark-rgb), 0.25); }
.nxb-testimonials .nxb-dots .nxb-dot.active { background: var(--nxb-accent); }

/* ==========================================================================
   Services slider
   ========================================================================== */
.nxb-services { position: relative; }
.nxb-services .swiper { overflow: hidden; padding: 6px; }
.nxb-service { border-radius: var(--nxb-radius); height: 100%; display: flex; flex-direction: column; gap: 12px; color: var(--nxb-ink); }
.nxb-service h3 { font-size: 20px; }
.nxb-service p { font-size: 15px; color: var(--nxb-ink2); flex: 1; }
.nxb-service-cards { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); padding: 30px 26px;
  transition: transform 0.25s ease, box-shadow 0.25s ease; }
.nxb-service-cards:hover { transform: translateY(-4px); box-shadow: var(--nxb-shadow); }
.nxb-service-minimal { padding: 10px 0; border-top: 2px solid rgba(var(--nxb-dark-rgb), 0.1); }
.nxb-service-minimal:hover { border-top-color: var(--nxb-accent); }
.nxb-service-imagetop { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); overflow: hidden; padding-bottom: 24px; }
.nxb-service-imagetop h3, .nxb-service-imagetop p, .nxb-service-imagetop .nxb-service-link { padding: 0 24px; }
.nxb-service-img { width: 100%; height: 180px; object-fit: cover; margin-bottom: 6px; }
.nxb-sec-dark .nxb-service { color: #fff; }
.nxb-sec-dark .nxb-service p { color: rgba(255, 255, 255, 0.72); }
.nxb-sec-dark .nxb-service-cards, .nxb-sec-dark .nxb-service-imagetop { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.14); }
.nxb-service-link { color: var(--nxb-accent); text-decoration: none; font-weight: 500; font-size: 14px; letter-spacing: 0.06em; }
.nxb-service-link:hover { color: var(--nxb-accent2); }
.nxb-services .nxb-sl-arrow { top: 40%; }
.nxb-services .nxb-dots { position: static; margin-top: 14px; }
.nxb-services .nxb-dots .nxb-dot { background: rgba(var(--nxb-dark-rgb), 0.25); }
.nxb-services .nxb-dots .nxb-dot.active { background: var(--nxb-accent); }

/* ==========================================================================
   CTA banner
   ========================================================================== */
.nxb-cta-box { position: relative; overflow: hidden; border-radius: calc(var(--nxb-radius) + 4px);
  background: var(--nxb-dark); color: #fff; padding: 64px 48px; }
.nxb-cta-inner { position: relative; z-index: 2; max-width: 720px; }
.nxb-cta-center .nxb-cta-inner { margin: 0 auto; text-align: center; }
.nxb-cta-box h2 { font-size: clamp(28px, 3.6vw, 42px); margin-bottom: 12px; color: #fff; }
.nxb-cta-text { color: rgba(255, 255, 255, 0.82); font-size: 17px; margin-bottom: 26px; }

/* ==========================================================================
   Newsletter
   ========================================================================== */
.nxb-newsletter h3 { font-size: 24px; margin-bottom: 6px; }
.nxb-nl-text { color: var(--nxb-ink2); margin-bottom: 16px; font-size: 15.5px; }
.nxb-sec-dark .nxb-nl-text { color: rgba(255, 255, 255, 0.75); }
.nxb-nl-form { display: flex; gap: 10px; }
.nxb-nl-stacked .nxb-nl-form { flex-direction: column; }
.nxb-nl-form input[type="email"] { flex: 1; font-family: var(--nxb-font-body); font-size: 15.5px; padding: 14px 18px;
  border-radius: 60px; border: 1px solid rgba(var(--nxb-dark-rgb), 0.25); background: var(--nxb-white); color: var(--nxb-ink); min-width: 0; }
.nxb-sec-dark .nxb-nl-form input[type="email"] { background: rgba(255, 255, 255, 0.07); border-color: rgba(255, 255, 255, 0.4); color: #fff; }
.nxb-nl-form input:focus { outline: 2px solid var(--nxb-accent2); border-color: var(--nxb-accent2); }
.nxb-nl-boxed { background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08); border-radius: var(--nxb-radius);
  padding: 34px 30px; box-shadow: 0 14px 40px -24px rgba(var(--nxb-dark-rgb), 0.4); }
.nxb-sec-dark .nxb-nl-boxed { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.14); }
.nxb-nl-done { color: var(--nxb-accent); font-weight: 500; margin-top: 10px; }

/* ==========================================================================
   Pricing
   ========================================================================== */
.nxb-pricing-grid { display: grid; grid-template-columns: repeat(var(--nxb-price-cols, 3), 1fr); gap: 22px; align-items: stretch; }
.nxb-price-card { position: relative; background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.1);
  border-radius: var(--nxb-radius); padding: 38px 30px; display: flex; flex-direction: column; color: var(--nxb-ink);
  transition: transform 0.25s ease, box-shadow 0.25s ease; }
.nxb-price-card:hover { transform: translateY(-4px); box-shadow: var(--nxb-shadow); }
.nxb-price-featured { border: 2px solid var(--nxb-accent); box-shadow: var(--nxb-shadow); }
.nxb-price-card h3 { font-size: 17px; letter-spacing: 0.14em; text-transform: uppercase; font-family: var(--nxb-font-body);
  font-weight: 600; color: var(--nxb-ink2); margin-bottom: 14px; }
.nxb-price-amount { display: flex; align-items: baseline; gap: 4px; margin-bottom: 10px; }
.nxb-price-cur { font-size: 22px; color: var(--nxb-accent); }
.nxb-price-val { font-family: var(--nxb-font-display); font-size: clamp(40px, 5vw, 56px); line-height: 1; }
.nxb-price-per { color: var(--nxb-ink2); font-size: 15px; }
.nxb-price-desc { font-size: 14.5px; color: var(--nxb-ink2); margin-bottom: 6px; }
.nxb-price-card .nxb-check-list { flex: 1; margin-bottom: 26px; }
.nxb-price-card .nxb-check-list li { font-size: 15px; }
.nxb-sec-dark .nxb-price-card { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.16); color: #fff; }
.nxb-sec-dark .nxb-price-card h3, .nxb-sec-dark .nxb-price-per, .nxb-sec-dark .nxb-price-desc { color: rgba(255, 255, 255, 0.7); }
.nxb-sec-dark .nxb-price-card .nxb-btn-outline-dark { border-color: rgba(255, 255, 255, 0.6); color: #fff; }

/* ==========================================================================
   Video
   ========================================================================== */
.nxb-video { position: relative; width: 100%; border-radius: var(--nxb-radius); overflow: hidden; background: #0b0f0e; }
.nxb-ratio-16-9 { aspect-ratio: 16 / 9; }
.nxb-ratio-4-3 { aspect-ratio: 4 / 3; }
.nxb-ratio-1-1 { aspect-ratio: 1 / 1; }
.nxb-ratio-9-16 { aspect-ratio: 9 / 16; max-width: 420px; }
.nxb-video iframe, .nxb-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.nxb-video-empty { display: flex; align-items: center; justify-content: center; color: rgba(255, 255, 255, 0.6);
  font-size: 14px; padding: 20px; text-align: center; }

/* ==========================================================================
   Countdown
   ========================================================================== */
.nxb-countdown { display: flex; gap: 14px; flex-wrap: wrap; }
.nxb-cd-unit { min-width: 92px; text-align: center; background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.1);
  border-radius: var(--nxb-radius); padding: 18px 12px; color: var(--nxb-ink); }
.nxb-sec-dark .nxb-cd-unit { background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.16); color: #fff; }
.nxb-cd-num { display: block; font-family: var(--nxb-font-display); font-size: clamp(30px, 4vw, 46px); line-height: 1.1; color: var(--nxb-accent); }
.nxb-cd-lab { font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--nxb-ink2); }
.nxb-sec-dark .nxb-cd-lab { color: rgba(255, 255, 255, 0.65); }

/* ==========================================================================
   Socials
   ========================================================================== */
.nxb-socials { display: flex; gap: 10px; flex-wrap: wrap; }
.nxb-soc { width: var(--nxb-soc-size, 42px); height: var(--nxb-soc-size, 42px); border-radius: 50%;
  border: 1px solid rgba(var(--nxb-dark-rgb), 0.18); color: var(--nxb-ink); display: flex; align-items: center;
  justify-content: center; transition: 0.25s ease; }
.nxb-soc svg { width: 45%; height: 45%; }
.nxb-soc:hover { background: var(--nxb-accent); border-color: var(--nxb-accent); color: #fff; transform: translateY(-2px); }
.nxb-sec-dark .nxb-soc { border-color: rgba(255, 255, 255, 0.3); color: #fff; }

/* new widgets: full width by default */
.nxb-w-team, .nxb-w-testimonials, .nxb-w-services, .nxb-w-cta, .nxb-w-pricing,
.nxb-w-newsletter, .nxb-w-video, .nxb-w-socials { width: 100%; }

@media (max-width: 960px) {
  .nxb-team-grid { grid-template-columns: repeat(2, 1fr); }
  .nxb-pricing-grid { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; }
  .nxb-price-featured { order: -1; }
  .nxb-gallery-grid, .nxb-gal-masonry { --nxb-gal-cols: 2; }
  .nxb-cta-box { padding: 44px 26px; }
}
@media (max-width: 640px) {
  .nxb-team-grid { grid-template-columns: 1fr; }
  .nxb-gallery-grid, .nxb-gal-masonry { --nxb-gal-cols: 1; }
  .nxb-nl-form { flex-direction: column; }
  .nxb-cd-unit { min-width: 72px; padding: 12px 8px; }
}

/* ==========================================================================
   GSAP animation widgets
   ========================================================================== */
.nxb-w-animtext, .nxb-w-countup, .nxb-w-marquee { width: 100%; }

/* --- Animated headline --- */
.nxb-animtext { font-family: var(--nxb-font-display); font-size: clamp(30px, 5vw, 60px); line-height: 1.1;
  margin: 0; perspective: 900px; }
.nxb-at-word { display: inline-block; vertical-align: top; }
.nxb-at-slide-up .nxb-at-word, .nxb-at-chars .nxb-at-word { overflow: hidden; padding-bottom: 0.08em; }
.nxb-at-u { display: inline-block; will-change: transform, opacity, filter; }
.nxb-at-typewriter .nxb-at-u { will-change: opacity; }

/* --- Animated counters --- */
.nxb-countup-grid { display: grid; grid-template-columns: repeat(var(--nxb-cu-cols, 4), 1fr); gap: 24px; width: 100%; }
.nxb-cu-cell { text-align: center; }
.nxb-cu-num { display: block; font-family: var(--nxb-font-display); font-size: clamp(34px, 5vw, 60px);
  line-height: 1.05; color: var(--nxb-accent); font-variant-numeric: tabular-nums; }
.nxb-cu-pre, .nxb-cu-suf { font-size: 0.7em; }
.nxb-cu-label { display: block; margin-top: 8px; font-size: 12.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--nxb-ink2); }
.nxb-sec-dark .nxb-cu-label { color: rgba(255, 255, 255, 0.7); }
@media (max-width: 640px) { .nxb-countup-grid { grid-template-columns: repeat(2, 1fr); } }

/* --- Infinite marquee --- */
.nxb-marquee { width: 100%; overflow: hidden; white-space: nowrap; font-family: var(--nxb-font-display);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.nxb-mq-track { display: inline-flex; will-change: transform; }
.nxb-mq-group { display: inline-flex; align-items: center; flex: none; }
.nxb-mq-item { padding: 0 0.35em; }
.nxb-mq-sep { padding: 0 0.35em; color: var(--nxb-accent); }

/* countup icons */
.nxb-cu-icon { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px;
  margin: 0 auto 12px; border-radius: 12px; background: rgba(var(--nxb-accent-rgb), 0.12); color: var(--nxb-accent); }
.nxb-cu-icon svg { width: 24px; height: 24px; }
.nxb-sec-dark .nxb-cu-icon { background: rgba(255, 255, 255, 0.08); }

/* marquee logos + colour effects */
/* scoped past `.nxb-root img` (0-1-1) so the height wins even without the inline style */
.nxb-root .nxb-mq-logo, .nxb-marquee .nxb-mq-logo { height: var(--nxb-mq-logo-h, 40px); width: auto; display: block; object-fit: contain; max-width: none; }
.nxb-mq-haslogo { display: inline-flex; align-items: center; }
.nxb-mq-logo-white .nxb-mq-logo { filter: brightness(0) invert(1); }
.nxb-mq-logo-black .nxb-mq-logo { filter: brightness(0); }
.nxb-mq-logo-grayscale .nxb-mq-logo { filter: grayscale(1); opacity: 0.75; transition: opacity 0.3s, filter 0.3s; }
.nxb-mq-logo-grayscale .nxb-mq-haslogo:hover .nxb-mq-logo { filter: grayscale(0); opacity: 1; }
.nxb-mq-logo-accent .nxb-mq-logo { filter: brightness(0) saturate(100%) invert(63%) sepia(18%) saturate(680%) hue-rotate(357deg) brightness(90%) contrast(86%); }

/* ==========================================================================
   Scroll-driven GSAP widgets
   ========================================================================== */
.nxb-w-splitreveal, .nxb-w-bento, .nxb-w-cardslider, .nxb-w-pinpanels,
.nxb-w-loopanels, .nxb-w-hscroll { width: 100%; }

/* --- Split reveal headline --- */
.nxb-splitreveal { font-family: var(--nxb-font-display); font-size: clamp(30px, 5vw, 60px); line-height: 1.12; margin: 0; }
.nxb-sr-seg { display: inline; }
.nxb-sr-u { display: inline-block; overflow: hidden; will-change: transform, opacity; }
.nxb-sr-hl { display: inline-block; will-change: transform, opacity; }
.nxb-sr-hl-gradient { background: linear-gradient(100deg, var(--nxb-accent), var(--nxb-accent2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nxb-sr-hl-underline { box-shadow: inset 0 -0.14em 0 rgba(var(--nxb-accent-rgb), 0.55); }
.nxb-sr-hl-pill { background: var(--nxb-accent); color: #fff; padding: 0 0.28em; border-radius: 0.28em; }
.nxb-sec-dark .nxb-sr-hl-pill { color: var(--nxb-dark); }

/* --- Scrubbed bento gallery --- */
.nxb-bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; gap: 16px; width: 100%; }
.nxb-bento-cell { position: relative; margin: 0; overflow: hidden; border-radius: var(--nxb-radius); }
.nxb-bento-cell img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.nxb-bento-cell:hover img { transform: scale(1.06); }
.nxb-bento-big { grid-column: span 2; grid-row: span 2; }
.nxb-bento-wide { grid-column: span 2; }
.nxb-bento-tall { grid-row: span 2; }
.nxb-bento-cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 16px 12px; color: #fff; font-size: 14px;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.6)); }
@media (max-width: 720px) { .nxb-bento { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
  .nxb-bento-big { grid-column: span 2; } .nxb-bento-wide { grid-column: span 2; } }

/* --- Infinite card slider --- */
.nxb-cardslider, .nxb-loopanels { position: relative; width: 100%; overflow: hidden; }
.nxb-cs-track, .nxb-lp-track { display: flex; }
.nxb-cs-card { flex: 0 0 300px; margin-right: 20px; background: var(--nxb-white); border: 1px solid rgba(var(--nxb-dark-rgb), 0.08);
  border-radius: var(--nxb-radius); overflow: hidden; color: var(--nxb-ink); }
.nxb-sec-dark .nxb-cs-card { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.14); color: #fff; }
.nxb-cs-card img { width: 100%; height: 200px; object-fit: cover; display: block; }
.nxb-cs-body { padding: 18px 20px; }
.nxb-cs-body h4 { font-size: 19px; margin: 0 0 4px; }
.nxb-cs-body p { font-size: 14px; color: var(--nxb-ink2); margin: 0; }
.nxb-sec-dark .nxb-cs-body p { color: rgba(255, 255, 255, 0.7); }
.nxb-cs-prev, .nxb-lp-prev { left: 14px; } .nxb-cs-next, .nxb-lp-next { right: 14px; }

/* --- Infinite looped panels --- */
.nxb-lp-panel { position: relative; flex: 0 0 46%; margin-right: 22px; height: 460px; border-radius: var(--nxb-radius);
  overflow: hidden; background: #0b0f0e; }
.nxb-lp-panel img { width: 100%; height: 100%; object-fit: cover; }
.nxb-lp-title { position: absolute; left: 26px; bottom: 22px; color: #fff; font-family: var(--nxb-font-display); font-size: 26px;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.6); }
@media (max-width: 720px) { .nxb-lp-panel { flex-basis: 82%; height: 340px; } .nxb-cs-card { flex-basis: 260px; } }

/* --- Pinned panels with overscroll --- */
.nxb-pinpanels { width: 100%; }
.nxb-pp-panel { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; align-items: center;
  background: var(--nxb-dark); color: #fff; }
.nxb-pp-inner { position: relative; z-index: 2; width: 100%; }
.nxb-pp-num { font-family: var(--nxb-font-display); font-size: clamp(48px, 10vw, 130px); line-height: 1; color: rgba(var(--nxb-accent-rgb), 0.4); display: block; }
.nxb-pp-title { font-family: var(--nxb-font-display); font-size: clamp(30px, 5vw, 58px); margin: 6px 0 16px; color: #fff; }
.nxb-pp-text { font-size: 18px; max-width: 560px; color: rgba(255, 255, 255, 0.82); margin-bottom: 26px; }

/* --- Horizontal scrolling gallery --- */
.nxb-hscroll { position: relative; width: 100%; height: 100vh; overflow: hidden; display: flex; align-items: center; }
.nxb-hs-track { display: flex; gap: 26px; padding: 0 5vw; will-change: transform; }
.nxb-hs-panel { position: relative; flex: 0 0 60vw; height: 72vh; margin: 0; border-radius: var(--nxb-radius); overflow: hidden; background: #0b0f0e; }
.nxb-hs-panel img { width: 100%; height: 100%; object-fit: cover; }
.nxb-hs-panel figcaption { position: absolute; left: 24px; bottom: 20px; color: #fff; font-family: var(--nxb-font-display);
  font-size: 22px; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.6); }

/* In the builder canvas, hint that these are scroll-driven demos */
.nxb-build .nxb-hscroll::after, .nxb-build .nxb-pinpanels::before {
  content: "↕ scroll to preview"; position: absolute; z-index: 9; top: 12px; left: 50%; transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.55); color: #fff; font: 600 11px/1 -apple-system, sans-serif; letter-spacing: 0.08em;
  text-transform: uppercase; padding: 6px 12px; border-radius: 20px; pointer-events: none; }
.nxb-build .nxb-pinpanels { position: relative; }

/* ==========================================================================
   Theme builder — expanded header/footer options
   ========================================================================== */
/* announcement bar */
.nxb-announcebar { position: relative; z-index: 99; background: var(--nxb-dark); color: #fff; text-align: center;
  font-family: var(--nxb-font-body); font-size: 13px; letter-spacing: 0.03em; padding: 9px 0; }
.nxb-announcebar a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* header appearance vars */
.nxb-header { padding: var(--nxb-hdr-pad, 14px) 0; }
.nxb-nav a { font-size: var(--nxb-hdr-nav-size, 14px); }
.nxb-nav a:hover { color: var(--nxb-hdr-hover, var(--nxb-accent2)); }
.nxb-hdr-upper .nxb-nav a { text-transform: uppercase; letter-spacing: 0.13em; }
.nxb-hdr-border { border-bottom: 1px solid var(--nxb-hdr-border, rgba(255, 255, 255, 0.14)); }
/* scrolled-state colours (override the base scrolled rule) */
.nxb-header.scrolled { background: var(--nxb-hdr-scrolled-bg, var(--nxb-hdr-bg, rgba(var(--nxb-dark-rgb), 0.96))); }
.nxb-header.scrolled .nxb-brand-text { color: var(--nxb-hdr-scrolled-text, var(--nxb-hdr-text, var(--nxb-white))); }
.nxb-header.scrolled .nxb-nav a { color: var(--nxb-hdr-scrolled-text, var(--nxb-hdr-text, rgba(255, 255, 255, 0.85))); }
/* smart sticky (hide on scroll down, reveal on scroll up) */
.nxb-hdr-smart { transition: transform 0.35s ease, background 0.35s ease, box-shadow 0.35s ease, padding 0.35s ease; }
.nxb-hdr-smart.nxb-hdr-hidden { transform: translateY(-100%); }
body.admin-bar .nxb-hdr-smart.nxb-hdr-hidden { transform: translateY(calc(-100% - 32px)); }

/* footer logo + socials + back-to-top */
.nxb-ftr-logo { width: auto; max-width: 220px; object-fit: contain; display: block; }
.nxb-footer-socials { display: flex; gap: 8px; }
.nxb-footer-socials .nxb-soc { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.28);
  color: inherit; display: flex; align-items: center; justify-content: center; transition: 0.25s ease; }
.nxb-footer-socials .nxb-soc svg { width: 44%; height: 44%; }
.nxb-footer-socials .nxb-soc:hover { background: var(--nxb-accent); border-color: var(--nxb-accent); color: #fff; transform: translateY(-2px); }
.nxb-footer[style*="--nxb-ftr-border"] .nxb-footer-disclaimer { border-top-color: var(--nxb-ftr-border); }
.nxb-back-top { position: fixed; right: 22px; bottom: 22px; z-index: 95; width: 46px; height: 46px; border-radius: 50%;
  border: 0; background: var(--nxb-accent); color: #fff; font-size: 20px; cursor: pointer; opacity: 0; pointer-events: none;
  transform: translateY(12px); transition: opacity 0.3s ease, transform 0.3s ease; box-shadow: 0 10px 26px -10px rgba(0, 0, 0, 0.5); }
.nxb-back-top.nxb-show { opacity: 1; pointer-events: auto; transform: none; }
.nxb-back-top:hover { filter: brightness(1.08); }

/* drawer colour + left side (mobile menu) */
@media (max-width: 1020px) {
  .nxb-nav { background: var(--nxb-hdr-drawer-bg, var(--nxb-dark)); }
  .nxb-drawer-left .nxb-nav { left: 0; right: auto; transform: translateX(-100%); box-shadow: 20px 0 60px rgba(0, 0, 0, 0.35); }
  .nxb-drawer-left .nxb-nav.open { transform: none; }
}
@media (max-width: 1200px) {
  .nxb-menu-tablet .nxb-nav { background: var(--nxb-hdr-drawer-bg, var(--nxb-dark)); }
}

/* ---------- chrome typography (menu + CTA + footer links), var-driven ---------- */
.nxb-nav a { font-family: var(--nxb-hdr-nav-font, var(--nxb-font-body));
  font-weight: var(--nxb-hdr-nav-weight, 400); letter-spacing: var(--nxb-hdr-nav-ls, 0.04em); }
.nxb-header .nxb-nav-cta { font-family: var(--nxb-hdr-cta-font, var(--nxb-font-body));
  font-size: var(--nxb-hdr-cta-size, 12px); font-weight: var(--nxb-hdr-cta-weight, 600);
  text-transform: var(--nxb-hdr-cta-tt, uppercase); }
.nxb-footer-nav a { font-family: var(--nxb-ftr-nav-font, var(--nxb-font-body));
  font-size: var(--nxb-ftr-nav-size, 14px); font-weight: var(--nxb-ftr-nav-weight, 400);
  text-transform: var(--nxb-ftr-nav-tt, none); }

/* ---------- column backgrounds: position the layer against the COLUMN and keep
   widgets above it (positioned z-0 layers otherwise paint over static children) ---------- */
.nxb-col.nxb-has-bg { position: relative; }
.nxb-col.nxb-has-bg > :not(.nxb-bg) { position: relative; z-index: 2; }

/* ---------- basic-widget style options (Elementor parity) ---------- */
/* image: alignment + hover effects + caption */
.nxb-fig-ac { text-align: center; }
.nxb-fig-ac img { margin-left: auto; margin-right: auto; }
.nxb-fig-ar { text-align: right; }
.nxb-fig-ar img { margin-left: auto; }
.nxb-fig[class*="nxb-imgfx-"] img { transition: transform var(--nxb-img-dur, 0.4s) ease, opacity var(--nxb-img-dur, 0.4s) ease, filter var(--nxb-img-dur, 0.4s) ease; }
.nxb-imgfx-zoom { overflow: hidden; }
.nxb-imgfx-zoom:hover img { transform: scale(1.07); }
.nxb-imgfx-lift:hover img { transform: translateY(-8px); box-shadow: 0 24px 50px -20px rgba(0, 0, 0, 0.35); }
.nxb-imgfx-fade:hover img { opacity: 0.75; }
.nxb-imgfx-gray img { filter: grayscale(1); }
.nxb-imgfx-gray:hover img { filter: grayscale(0); }
/* text shadow presets (heading / text / list) */
.nxb-tsh-soft { text-shadow: 0 2px 14px rgba(0, 0, 0, 0.28); }
.nxb-tsh-strong { text-shadow: 0 3px 8px rgba(0, 0, 0, 0.5); }
/* text columns + drop cap */
.nxb-tcols-2 { columns: 2; column-gap: 36px; }
.nxb-tcols-3 { columns: 3; column-gap: 32px; }
@media (max-width: 768px) { .nxb-tcols-2, .nxb-tcols-3 { columns: 1; } }
.nxb-dropcap::first-letter { font-family: var(--nxb-font-display); font-size: 3.1em; float: left;
  line-height: 0.85; padding: 4px 10px 0 0; color: var(--nxb-accent); }
/* icon / icon box sizing + colours */
.nxb-icw svg, .nxb-w-icon.nxb-icw svg { width: var(--nxb-icw-svg, 24px); height: var(--nxb-icw-svg, 24px); }
.nxb-w-iconbox .nxb-amenity-icon { background: var(--nxb-ib-bg, rgba(var(--nxb-accent-rgb), 0.12)); color: var(--nxb-ib-ic, var(--nxb-accent)); }
.nxb-w-iconbox .nxb-amenity-icon svg { width: var(--nxb-ib-svg, 24px); height: var(--nxb-ib-svg, 24px); }
/* custom button hover colours + hover effect variants */
.nxb-btn-custom { transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease; }
.nxb-btn-custom[style*="--nxb-bwh-bg"]:hover { background: var(--nxb-bwh-bg); border-color: var(--nxb-bwh-bg); }
.nxb-btn-custom[style*="--nxb-bwh-c"]:hover { color: var(--nxb-bwh-c); }
.nxb-btnfx-none .nxb-btn:hover { transform: none; }
.nxb-btnfx-zoom .nxb-btn:hover { transform: scale(1.05); }

/* ---------- menu widget ---------- */
.nxb-menuw-links { display: flex; align-items: center; gap: var(--nxb-mw-gap, 26px); flex-wrap: wrap; }
.nxb-menuw-v .nxb-menuw-links { flex-direction: column; align-items: flex-start; gap: calc(var(--nxb-mw-gap, 26px) / 2); }
.nxb-menuw-ac .nxb-menuw-links { justify-content: center; }
.nxb-menuw-ar .nxb-menuw-links { justify-content: flex-end; }
.nxb-menuw-v.nxb-menuw-ac .nxb-menuw-links { align-items: center; }
.nxb-menuw-v.nxb-menuw-ar .nxb-menuw-links { align-items: flex-end; }
.nxb-menuw-links a { color: var(--nxb-mw-color, inherit); font-size: var(--nxb-mw-size, 14px);
  font-weight: var(--nxb-mw-weight, 400); text-decoration: none; letter-spacing: 0.04em;
  transition: color 0.2s ease; white-space: nowrap; }
.nxb-menuw-upper .nxb-menuw-links a { text-transform: uppercase; letter-spacing: 0.1em; }
.nxb-menuw-links a:hover, .nxb-menuw-links a.on { color: var(--nxb-mw-hover, var(--nxb-accent)); }
.nxb-menuw, .nxb-burgerwrap { display: flex; align-items: center; }
.nxb-burgerwrap.nxb-menuw-ac, .nxb-menuw.nxb-menuw-ac { justify-content: center; }
.nxb-burgerwrap.nxb-menuw-ar, .nxb-menuw.nxb-menuw-ar { justify-content: flex-end; }
/* collapse-to-burger: hide links / show burger below the breakpoint */
.nxb-menuw .nxb-burgerw { display: none; }
@media (max-width: 1020px) {
  .nxb-menuw-collapse-t .nxb-menuw-links { display: none; }
  .nxb-menuw-collapse-t .nxb-burgerw { display: inline-flex; }
}
@media (max-width: 768px) {
  .nxb-menuw-collapse-m .nxb-menuw-links { display: none; }
  .nxb-menuw-collapse-m .nxb-burgerw { display: inline-flex; }
}

/* ---------- burger button + off-canvas drawer ---------- */
.nxb-burgerw { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
  width: var(--nxb-bw-size, 28px); height: calc(var(--nxb-bw-size, 28px) * 0.85);
  background: none; border: 0; padding: 0; cursor: pointer; }
.nxb-burgerw span { display: block; width: 100%; height: 2px; border-radius: 2px;
  background: var(--nxb-bw-color, currentColor); transition: transform 0.3s ease, opacity 0.3s ease; }
.nxb-burgerw.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nxb-burgerw.open span:nth-child(2) { opacity: 0; }
.nxb-burgerw.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.nxb-mdrawer { position: fixed; inset: 0; z-index: 4000; }
.nxb-mdrawer-ov { position: absolute; inset: 0; background: rgba(10, 14, 13, 0.55);
  opacity: 0; transition: opacity 0.3s ease; }
.nxb-mdrawer-panel { position: absolute; top: 0; bottom: 0; width: min(340px, 86vw);
  background: var(--nxb-mdrawer-bg, var(--nxb-dark)); color: var(--nxb-mdrawer-text, var(--nxb-white));
  display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 48px 40px;
  transition: transform 0.35s ease; overflow-y: auto; }
.nxb-mdrawer-right .nxb-mdrawer-panel { right: 0; transform: translateX(100%); box-shadow: -20px 0 60px rgba(0, 0, 0, 0.35); }
.nxb-mdrawer-left .nxb-mdrawer-panel { left: 0; transform: translateX(-100%); box-shadow: 20px 0 60px rgba(0, 0, 0, 0.35); }
.nxb-mdrawer.open .nxb-mdrawer-ov { opacity: 1; }
.nxb-mdrawer.open .nxb-mdrawer-panel { transform: none; }
.nxb-mdrawer-panel a { color: var(--nxb-mdrawer-text, var(--nxb-white)); text-decoration: none;
  font-size: 19px; padding: 10px 0; letter-spacing: 0.03em; }
.nxb-mdrawer-panel a:hover, .nxb-mdrawer-panel a.on { color: var(--nxb-accent2); }
.nxb-mdrawer-close { position: absolute; top: 18px; right: 20px; background: none; border: 0;
  color: inherit; font-size: 20px; cursor: pointer; padding: 8px; }
body.nxb-noscroll { overflow: hidden; }

/* ---------- header/footer templates: behaviour classes ---------- */
.nxb-tpl-chrome { position: relative; z-index: 110; }
.nxb-tpl-header.nxb-tpl-sticky { position: sticky; top: 0; }
.nxb-tpl-header.nxb-tpl-overlay { position: absolute; top: 0; left: 0; right: 0; }
.nxb-tpl-header.nxb-tpl-overlay .nxb-section { background: transparent; }
.nxb-tpl-header.nxb-tpl-overlay.nxb-tpl-sticky { position: fixed; top: 0; left: 0; right: 0; }
.nxb-tpl-header.nxb-tpl-smart { transition: transform 0.35s ease; }
.nxb-tpl-header.nxb-tpl-smart.nxb-tpl-hidden { transform: translateY(-105%); }
.nxb-tpl-header .nxb-section { transition: padding 0.3s ease, background 0.3s ease, box-shadow 0.3s ease; }
.nxb-tpl-header.nxb-tpl-shrink.scrolled .nxb-section { padding-top: 8px; padding-bottom: 8px; }
.nxb-tpl-header.scrolled { background: var(--nxb-tplh-scrolled-bg, transparent); }
.nxb-tpl-header.nxb-tpl-shadow.scrolled { box-shadow: 0 10px 40px -18px rgba(0, 0, 0, 0.35); }
.nxb-tpl-header.nxb-tpl-anim-slide { animation: nxb-tpl-slide 0.6s ease both; }
.nxb-tpl-header.nxb-tpl-anim-fade { animation: nxb-tpl-fade 0.8s ease both; }
@keyframes nxb-tpl-slide { from { transform: translateY(-100%); } to { transform: none; } }
@keyframes nxb-tpl-fade { from { opacity: 0; } to { opacity: 1; } }
/* per-device visibility: sections/columns/widgets (.nxb-hide-*) hide on the
   front-end; inside the editor canvas (html.nxb-build) they stay laid out but
   ghosted so they remain selectable. Template-level hides always apply. */
@media (min-width: 1021px) {
  .nxb-tpl-hide-d, html:not(.nxb-build) .nxb-hide-d { display: none !important; }
  html.nxb-build .nxb-hide-d { opacity: 0.35 !important; outline: 1.5px dashed rgba(226, 117, 107, 0.6); outline-offset: -2px; }
}
@media (max-width: 1020px) and (min-width: 769px) {
  .nxb-tpl-hide-t, html:not(.nxb-build) .nxb-hide-t { display: none !important; }
  html.nxb-build .nxb-hide-t { opacity: 0.35 !important; outline: 1.5px dashed rgba(226, 117, 107, 0.6); outline-offset: -2px; }
}
@media (max-width: 768px) {
  .nxb-tpl-hide-m, html:not(.nxb-build) .nxb-hide-m { display: none !important; }
  html.nxb-build .nxb-hide-m { opacity: 0.35 !important; outline: 1.5px dashed rgba(226, 117, 107, 0.6); outline-offset: -2px; }
}
