/* Theme Name: Jupiter X Child (Majestic Las Vegas) Theme URI: https://majesticlasvegas.com Description: Child theme for Jupiter X — holds all custom CSS and PHP for Majestic Las Vegas so customizations survive parent-theme updates. Author: VegasBusinessAI Template: jupiterx Version: 2.0.0 Text Domain: jupiterx-child */ /* ===================================================================== MAJESTIC V2 — brand design system (.maj2-*) Light, warm desert-luxury world. Cormorant Garamond (display) + Inter (body). Palette: cream / taupe / gold / warm ink. Full-bleed cinematic bands. ===================================================================== */ :root{ /* BLACK + GOLD world (2026-05-27 client direction). Token NAMES kept, VALUES flipped dark — every surface that was light now renders on black grain with ivory text + gold accents. */ --maj-cream:#0D0B09; --maj-cream-2:#0A0807; --maj-taupe:#15110D; --maj-taupe-2:#100C0A; --maj-taupe-deep:#070605; --maj-gold:#C5A06A; --maj-gold-d:#D8BE8C; --maj-ink:#F2ECE0; --maj-ink-soft:#C7BCA9; --maj-line:rgba(255,255,255,.14); /* Black grain at 50% over a solid black base (client 2026-05-27): the flat 50% black layer makes the grain image read as half-transparent. Multi-layer value — paired with a #000 background-color on every grain section so black shows through. Color comes last in use. */ --maj-grain:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),url('assets/Blackgrain_background.webp'); /* Match the original majesticlasvegas.com typography: Oswald (headlines) + Roboto (body). */ --maj-serif:'Oswald','Arial Narrow',Helvetica,sans-serif; --maj-sans:'Roboto',system-ui,-apple-system,'Segoe UI',sans-serif; --maj-wrap:1180px; --maj-h-pad:clamp(20px,5vw,80px); } /* ---- Brand canvas reset (scoped to body.maj2) ---- */ body.maj2{margin:0;background:var(--maj-cream);color:var(--maj-ink); font-family:var(--maj-sans);font-weight:400;font-size:17px;line-height:1.65; -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;} body.maj2 *,body.maj2 *::before,body.maj2 *::after{box-sizing:border-box;} body.maj2 img,body.maj2 video{max-width:100%;display:block;} body.maj2 a{color:inherit;text-decoration:none;} body.maj2 h1,body.maj2 h2,body.maj2 h3{font-family:var(--maj-serif);font-weight:500; line-height:1.08;margin:0;letter-spacing:.005em;} body.maj2 p{margin:0 0 1em;} .maj2-wrap{max-width:var(--maj-wrap);margin-inline:auto;padding-inline:var(--maj-h-pad);} .maj2-skip{position:absolute;left:-999px;top:0;background:var(--maj-ink);color:#fff;padding:10px 16px;z-index:2000;} .maj2-skip:focus{left:8px;top:8px;} /* ---- Shared label atoms ---- */ .maj2-eyebrow{font-family:var(--maj-sans);font-weight:600;font-size:.72rem;letter-spacing:.28em; text-transform:uppercase;color:var(--maj-gold-d);margin:0 0 .9rem;} .maj2-eyebrow--center{text-align:center;} /* Gap + dot offset use `em` so they scale together with the font (mobile shrinks the keyword font, so a fixed-rem dot offset drifted out of the gap — 2026-06-01). Dot sits at the gap centre (half the 1.6em column gap) and is self-centred. */ .maj2-keywords{display:flex;flex-wrap:wrap;gap:.4rem 1.6em;justify-content:center; margin:1.2rem 0 0;font-family:var(--maj-sans);font-weight:500;font-size:.74rem; letter-spacing:.22em;text-transform:uppercase;color:var(--maj-ink-soft);} .maj2-keywords span{position:relative;} .maj2-keywords span+span::before{content:"·";position:absolute;left:-.8em;top:50%; transform:translate(-50%,-50%);color:var(--maj-gold);} /* ---- Buttons ---- */ .maj2-btn{display:inline-block;font-family:var(--maj-sans);font-weight:600;font-size:.78rem; letter-spacing:.2em;text-transform:uppercase;padding:1.05em 2.4em;border:1px solid var(--maj-gold); transition:background .35s,color .35s,border-color .35s;cursor:pointer;} .maj2-btn--gold{background:var(--maj-gold);color:#1F1B17;border-color:var(--maj-gold);} .maj2-btn--gold:hover{background:transparent;color:var(--maj-gold);} .maj2-btn--ghost{background:transparent;color:var(--maj-cream);border-color:rgba(244,238,228,.6);} .maj2-btn--ghost:hover{background:var(--maj-cream);color:var(--maj-ink);} /* Plaza Suite Plans CTA — centered, dark-fill gold-text button (mirrors the home-page maj2-plaza-cta widget); reused on the Plaza statement section (client 2026-05-29). */ .maj2-plaza-cta{display:flex;justify-content:center;} .maj2-plaza-cta .maj2-btn{background:#0E0C0B;color:var(--maj-gold);text-decoration:none;} .maj2-plaza-cta .maj2-btn:hover{background:var(--maj-gold);color:#0E0C0B;} /* Gold variant: gold fill + black text (Plaza statement CTA, client 2026-05-29). */ .maj2-plaza-cta--gold .maj2-btn{background:var(--maj-gold);color:#000;border-color:var(--maj-gold);} .maj2-plaza-cta--gold .maj2-btn:hover{background:transparent;color:var(--maj-gold);} /* Home plaza card: stack the "Plaza Suite Plans" CTA BENEATH the card instead of beside it (the corner is a flex row by default). DOM order swapped in functions.php so the card precedes the CTA (client 2026-06-01). */ body.home .maj2-plazacard__corner{flex-direction:column;align-items:flex-end;} /* "PLAZA PLANS" emphasized within the CTA — bolder + larger (client 2026-05-29). */ .maj2-cta-emph{font-weight:800;font-size:1.28em;} /* Larger button variant (Plaza closing CTA, client 2026-05-29). */ .maj2-btn--lg{font-size:.95rem;padding:1.25em 3em;} /* Hero CTA row — gold-bordered button below the keywords (e.g. resort hero "Majestic Resort Presentation Deck"). Default the in-hero button to the ghost-style on dark backgrounds. */ .maj2-hero__actions{margin-top:clamp(1.1rem,2vw,1.6rem);display:flex;justify-content:center;} /* Button placed inside the hero panel, centered at the bottom (e.g. Developer documentary CTA). */ .maj2-hero__panel-actions{margin-top:clamp(1rem,2vw,1.5rem);display:flex;justify-content:center;} .maj2-hero__actions .maj2-btn{background:rgba(0,0,0,.45);color:var(--maj-gold);border-color:var(--maj-gold);} /* Resort hero deck button: solid gold + black text + drop shadow to pop (client 2026-05-29). */ :is(body.page-id-6569,body.page-id-6572) .maj2-hero__actions .maj2-btn{background:var(--maj-gold);color:#000;border-color:var(--maj-gold);box-shadow:0 12px 34px rgba(0,0,0,.5);} :is(body.page-id-6569,body.page-id-6572) .maj2-hero__actions .maj2-btn:hover{background:transparent;color:var(--maj-gold);} .maj2-hero__actions .maj2-btn:hover{background:var(--maj-gold);color:#1F1B17;} /* ---- Header ---- */ .maj2-header{position:fixed;inset:0 0 auto 0;background:#000000;z-index:1000;transition:background .4s,box-shadow .4s,border-color .4s; border-bottom:1px solid transparent;} .maj2-header__inner{max-width:1400px;margin-inline:auto;padding:8px var(--maj-h-pad); min-height:96px;display:flex;align-items:center;justify-content:space-between;gap:24px;} /* Logo split into two assets (2026-05-27): crown mark + "Majestic Las Vegas" wordmark, sized independently so the text can grow without enlarging the crown (and vice-versa). Top-state heights kept sane — the prior single 270px lockup was oversized. */ .maj2-header__brand{display:flex;align-items:center;gap:clamp(8px,1.1vw,18px);} .maj2-header__mark{height:clamp(70px,8.2vw,108px);width:auto;transition:height .4s;} .maj2-header__word{height:clamp(70px,8.2vw,108px);width:auto;transition:height .4s;} .maj2-header.is-scrolled{background:#000000; box-shadow:0 1px 0 rgba(0,0,0,.35);border-bottom-color:var(--maj-line);} .maj2-header.is-scrolled .maj2-header__mark{height:clamp(52px,6vw,76px);} .maj2-header.is-scrolled .maj2-header__word{height:clamp(52px,6vw,76px);} .maj2-nav ul{list-style:none;display:flex;align-items:center;gap:2.1rem;margin:0;padding:0;} .maj2-nav a{font-family:var(--maj-sans);font-weight:500;font-size:.8rem;letter-spacing:.16em; text-transform:uppercase;color:#F7F2E8;text-shadow:0 1px 14px rgba(0,0,0,.45);position:relative;padding:6px 0;transition:color .3s;} .maj2-nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--maj-gold);transition:width .3s;} .maj2-nav a:hover::after,.maj2-nav a[aria-current="page"]::after{width:100%;} /* Kill the parent theme's hover text-underline — keep only our gold ::after line (no double line). */ .maj2-nav a,.maj2-nav a:hover,.maj2-nav a:focus,.maj2-nav a:active{text-decoration:none!important;} .maj2-header.is-scrolled .maj2-nav a{color:var(--maj-ink);text-shadow:none;} .maj2-header.is-scrolled .maj2-nav a[aria-current="page"]{color:var(--maj-gold-d);} .maj2-nav__cta a{border:1px solid currentColor;padding:.7em 1.3em!important;} .maj2-nav__cta a::after{display:none;} .maj2-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:8px;cursor:pointer;z-index:1100;} .maj2-burger span{width:26px;height:2px;background:#F7F2E8;box-shadow:0 0 8px rgba(0,0,0,.4);transition:.3s;} .maj2-header.is-scrolled .maj2-burger span{background:var(--maj-ink);box-shadow:none;} /* ---- Hero ---- */ .maj2-hero{position:relative;min-height:72vh;display:flex;align-items:flex-end; overflow:hidden;color:#fff;isolation:isolate;} .maj2-hero--tall{min-height:100svh;} .maj2-hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;} .maj2-hero__media--fallback{z-index:-3;} /* Developer hero (sketch-to-render): lower the focal anchor so more of the render/lower portion shows (client 2026-05-27). */ .maj2-hero__media[src*="sketch-to-render"]{object-position:center 100%;} /* --fit (revised 2026-05-28, second pass): media spans the FULL WIDTH of the hero at its natural aspect (no cover-crop, fully visible top-to-bottom), pinned to the top edge of the section — but the SECTION KEEPS its `--tall`/default height instead of collapsing to the image's height. Any leftover vertical space below the image is filled by the dark `--maj-cream-2` backdrop. Net result: image goes full-width AND is fully visible AND the hero height is unchanged. */ .maj2-hero--fit{background:var(--maj-cream-2);} /* --fit (revised 2026-05-28, third pass): image is `object-fit:contain` inside the section's full bounds — section keeps its `--tall`/default height (so the hero fills the viewport), image is fully visible top-to-bottom (no vertical crop), letterbox space fills with the dark `--maj-cream-2` backdrop. */ .maj2-hero--fit .maj2-hero__media{position:absolute;inset:0; width:100%;height:100%;object-fit:contain;display:block;z-index:-2;} /* About page (id 20) — let the hero grow to whatever height is needed to show the full image at its natural aspect ratio (client 2026-05-28). Image goes from absolute to relative so the section sizes to it; scrim + inner overlay it via absolute. */ body.page-id-20 .maj2-hero{min-height:0;overflow:visible;} body.page-id-20 .maj2-hero--fit .maj2-hero__media{position:relative;width:100%;height:auto;object-fit:initial;} body.page-id-20 .maj2-hero__scrim{position:absolute;inset:0;} body.page-id-20 .maj2-hero__inner{position:absolute;left:0;right:0;bottom:0;} /* Contact (18) hero — full render shown uncropped at natural aspect; section grows to it, "Get in Touch" panel overlays at the bottom (mirrors /about/) (client 2026-05-29). */ body.page-id-18 .maj2-hero{min-height:0;overflow:visible;} body.page-id-18 .maj2-hero--fit .maj2-hero__media{position:relative;width:100%;height:auto;object-fit:initial;display:block;} body.page-id-18 .maj2-hero__scrim{position:absolute;inset:0;} body.page-id-18 .maj2-hero__inner{position:absolute;left:0;right:0;bottom:0;} /* Remove the "Get in Touch" hero panel (logo mark + heading + blurb) on Contact — the render shows clean with no overlay text (client 2026-06-01). */ body.page-id-18 .maj2-hero__inner{display:none!important;} /* 2026-06-01: ALL location-map sections match the homepage layout — full-width map (no text panel). Collapse the split to one column site-wide and hide the __body text panel everywhere the map appears. */ .maj2-location{grid-template-columns:1fr!important;} .maj2-location__body{display:none!important;} /* Contact location map (desktop): the map is a ~square 1823×1797 image that object-fit:cover was cropping. Match the homepage hero treatment — a soft blurred copy fills the full width as a backdrop (no blank bars) and the COMPLETE map shows on top via object-fit:contain (nothing cut). Desktop only; mobile keeps the stacked single-column treatment. (client 2026-06-01) */ @media(min-width:769px){ /* Brand-page heroes were clipped at the top on desktop: the opaque ~180px fixed header overlaps the hero, hiding the render's top edge. Seat every brand hero below the header (2026-06-01, site-wide lock-in). Two mechanisms: • --fit heroes (about=20, contact=18, plaza-top): media is IN-FLOW natural aspect, so push the section down with padding-top (area hides behind the opaque header → no visible gap, full render shows). • --tall heroes (plaza=6508, resort=6569, developer=6153): media is ABSOLUTE inset:0 cover, so offset its top below the header instead. */ body.page-id-18 .maj2-hero--fit, body.page-id-20 .maj2-hero--fit{padding-top:180px!important;background:#0E0C0B;} /* Offset the absolute cover media/scrim below the header AND shrink their height by the same 180px so they fill exactly header-bottom → section-bottom. Without the height clamp, height:100% + top:180 overflowed the section by 180px and the bottom got clipped (overflow:hidden). Section stays 100svh so the bottom content panel remains in view. */ body:not(.home) .maj2-hero--tall .maj2-hero__media{top:180px!important;height:calc(100% - 180px)!important;} body:not(.home) .maj2-hero--tall .maj2-hero__scrim{top:180px!important;height:calc(100% - 180px)!important;} /* Plaza (6508) desktop hero: match the MOBILE treatment — show the COMPLETE 16:9 plaza-dusk render (no cover crop) seated below the 180px header, with the panel overlaid at the bottom over a gradient. Overrides the generic --tall cover rules above (same specificity, later in source). */ body.page-id-6508 .maj2-hero--tall{min-height:0!important;height:auto!important; aspect-ratio:auto!important;display:block!important;overflow:visible!important; position:relative!important;padding-top:180px!important;background:#0E0C0B!important;} body.page-id-6508 .maj2-hero--tall .maj2-hero__media{position:relative!important; inset:auto!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important; width:100%!important;height:auto!important;aspect-ratio:16/9!important; object-fit:cover!important;object-position:center!important;display:block!important;} body.page-id-6508 .maj2-hero--tall .maj2-hero__scrim{display:none!important;} body.page-id-6508 .maj2-hero--tall .maj2-hero__inner{position:absolute!important; left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;max-width:100%!important; padding:clamp(14px,2vw,28px) clamp(20px,4vw,64px)!important; background:linear-gradient(180deg,rgba(8,6,5,0) 0%,rgba(8,6,5,.82) 100%)!important;} body.page-id-6508 .maj2-hero--tall .maj2-hero__scroll{display:none!important;} /* Developer (6153): sections swapped (2026-06-01) — the Lorenzo bio split now LEADS the page and the Doumani hero is SECOND. Seat the leading split below the 180px header, and reset the now-mid-page hero from the generic --tall header offset back to a full-bleed cover band. */ body.page-id-6153 .maj2-split{padding-top:180px!important;background:#0E0C0B!important;} body.page-id-6153 .maj2-hero--tall .maj2-hero__media{top:0!important;height:100%!important;} body.page-id-6153 .maj2-hero--tall .maj2-hero__scrim{top:0!important;height:100%!important;} /* Elementor-template pages (hotel, amenities, skysuites, press, portfolios): their first section also sat behind the header on desktop, clipping the hero title/image. Same below-header seating as the mobile (7) fix, with the desktop header height (180px). Full-bleed bg heroes keep their background behind the header; content seats cleanly below. */ body.page-template-elementor_header_footer:not(.home) .elementor-top-section:first-of-type, body.page-template-elementor_header_footer:not(.home) .elementor > .elementor-section:first-child, body.page-template-elementor_header_footer:not(.home) [data-elementor-type="wp-page"] > .elementor-section:first-child{ padding-top:180px!important;} /* Location-map gold backdrop + contained map + height are now global (see base .maj2-location__media rule), matching the homepage map exactly. */ } /* Plaza (6508) mid-page render block — same full-image `fit` treatment as the About hero, but scoped to .maj2-hero--fit so the page's top (tall) hero is untouched (client 2026-05-29). */ body.page-id-6508 .maj2-hero--fit, :is(body.page-id-6569,body.page-id-6572) .maj2-hero--fit{min-height:0;overflow:visible;} body.page-id-6508 .maj2-hero--fit .maj2-hero__media, :is(body.page-id-6569,body.page-id-6572) .maj2-hero--fit .maj2-hero__media{position:relative;width:100%;height:auto;object-fit:initial;display:block;} body.page-id-6508 .maj2-hero--fit .maj2-hero__scrim, :is(body.page-id-6569,body.page-id-6572) .maj2-hero--fit .maj2-hero__scrim{position:absolute;inset:0;} body.page-id-6508 .maj2-hero--fit .maj2-hero__inner, :is(body.page-id-6569,body.page-id-6572) .maj2-hero--fit .maj2-hero__inner{position:absolute;left:0;right:0;bottom:0;} .maj2-hero__scrim{position:absolute;inset:0;z-index:-1; background:linear-gradient(180deg,rgba(20,16,12,.55) 0%,rgba(20,16,12,.05) 30%,rgba(20,16,12,.15) 60%,rgba(20,16,12,.72) 100%);} .maj2-hero__inner{max-width:var(--maj-wrap);margin-inline:auto;width:100%; padding:0 var(--maj-h-pad) clamp(72px,12vh,150px);text-align:center;} .maj2-hero .maj2-eyebrow{color:#E9D8B8;} .maj2-hero__title{font-size:clamp(2.7rem,8vw,6.2rem);font-weight:500;letter-spacing:.01em; text-shadow:0 2px 40px rgba(0,0,0,.4);} /* Long leading H1 phrases (e.g. "Retail · Dining · Entertainment" on the Plaza page) — smaller scale than the default wordmark, single-line, scales with viewport so it fits. */ .maj2-hero__lead{display:block;font-size:clamp(1.5rem,4.4vw,3.4rem);font-weight:500; letter-spacing:.02em;white-space:nowrap;} .maj2-hero__name-sub{display:block;font-size:clamp(1.05rem,2.2vw,1.85rem);font-weight:400; letter-spacing:.14em;text-transform:uppercase;color:var(--maj-gold);margin-top:.4rem; white-space:nowrap;} /* Logo mark + "Resort & Spa" sit on one centered line, vertically aligned. */ .maj2-hero__sub-row{display:flex;align-items:center;justify-content:center; gap:clamp(.55rem,1.4vw,1.1rem);margin-top:.5rem;} .maj2-hero__sub-row .maj2-header__mark{height:clamp(2.1rem,4.4vw,3.4rem);width:auto;margin:0;} .maj2-hero__sub-row .maj2-hero__name-sub{margin-top:0;} /* Mixed-case name-sub (e.g. "The DOUMANI Family") — keep typed casing, not all-caps. */ .maj2-hero__name-sub--mixed{text-transform:none;} /* Plaza variant: Majestic wordmark logo with "Plaza" to its RIGHT, on one centered row (inherits base .maj2-hero__sub-row row layout) (client 2026-05-29). */ .maj2-hero__sub-row--plaza .maj2-hero__wordmark{height:clamp(2.8rem,6.2vw,4.6rem);width:auto;} /* Resort mark: crown on top, the Majestic wordmark, then "Resort" on its own line tucked up close under the cursive J (client 2026-05-29). */ .maj2-resort-mark{display:flex;flex-direction:column;align-items:center;gap:clamp(.4rem,1.4vw,1rem);} .maj2-resort-mark .maj2-header__mark{height:clamp(2.6rem,5vw,3.9rem);width:auto;margin:0;} .maj2-resort-mark .maj2-hero__wordmark{height:clamp(2.8rem,6.2vw,4.6rem);width:auto;display:block;} .maj2-resort-mark .maj2-hero__name-sub{margin-top:-1.5em;font-size:clamp(.95rem,1.98vw,1.67rem);} /* Brand panel — same black-transparent + gold-hairline container used on the location-body (style.css ~L267) and Elementor column 0d9e337 (~L527). Groups the brand_mark + sub + keywords under the hero lead on the Plaza page. */ .maj2-hero__panel{display:inline-block;text-align:center;position:relative; background:rgba(0,0,0,.5);border:1px solid #C5A06A;border-radius:2px; padding:clamp(28px,3.8vw,48px) clamp(22px,3.2vw,36px); margin:clamp(1.1rem,2vw,1.6rem) auto 0;max-width:min(94%,680px);} /* Hero size parity (client 2026-05-28): every brand page's `.maj2-hero` defaults to `.maj2-hero--tall` (100svh) — Plaza is the reference. The homepage hero is the Elementor slideshow section `elementor-element-023bdf3` (aerial rotation). Original approach (pinning `height`/`max-height` on the section itself) introduced a right-side gap because it interfered with `elementor-section-full_width`'s margin stretch and the slideshow's full-bleed sizing. Cleaner: raise the inner container's own `min-height` floor from Elementor's stock 300px to 100svh. The section grows naturally with its container — no height pins on the section, no overflow clipping, full-width stretch untouched. */ .elementor-element-023bdf3 > .elementor-container{min-height:100svh!important;} /* Slim-panel pages: /advertising/ (6445) holds only the sub (no brand_mark, no keywords), so the stock vertical padding feels heavy and the sub's own top margin doubles the gap. Halve panel V-padding and zero the sub's top margin. Horizontal padding unchanged. Specificity for the sub override (0,3,1) beats `body.maj2 .maj2-hero__sub`. (/about/ now follows the Plaza pattern — brand_mark + sub in the panel — so it keeps the default panel padding and is not slimmed here.) */ body.page-id-6445 .maj2-hero__panel{padding-top:clamp(14px,1.9vw,24px);padding-bottom:clamp(14px,1.9vw,24px);} body.page-id-6445 .maj2-hero__panel .maj2-hero__sub{margin-top:0;} .maj2-hero__panel .maj2-hero__sub-row{margin-top:0;} .maj2-hero__panel .maj2-hero__sub{margin-top:1rem;max-width:42ch;} /* Plaza (6508): lower the brand panel toward the bottom of the hero — shrink the inner's bottom lift (was clamp(72px,12vh,150px)) (client 2026-05-29). */ body.page-id-6508 .maj2-hero__inner{padding-bottom:clamp(20px,3.6vh,46px);} /* Resort (6569) hero: cut the inner bottom padding to 25% (was clamp(72px,12vh,150px)) (client 2026-05-29). */ :is(body.page-id-6569,body.page-id-6572) .maj2-hero__inner{padding-bottom:clamp(18px,3vh,38px);} /* Advertising-flyer (6445) hero: cut the inner bottom padding to 25% (client 2026-05-29). */ body.page-id-6445 .maj2-hero__inner{padding-bottom:clamp(18px,3vh,38px);} /* Developer (6153) hero: panel pinned bottom-left with left/bottom inset (mirrors the home Plaza card placement, but bottom-left) (client 2026-05-29). */ /* Full-width inner (drop the centered max-width column) so the left-pinned panel reaches the actual left edge, not the centered gutter. */ body.page-id-6153 .maj2-hero__inner{text-align:left;max-width:none;margin-inline:0;padding-left:clamp(1rem,2.5vw,2rem);padding-bottom:clamp(1rem,3vh,1.75rem);} /* Plaza panel: tighter padding all round — V was clamp(28px,3.8vw,48px), H was clamp(22px,3.2vw,36px) (client 2026-05-29). */ body.page-id-6508 .maj2-hero__panel{padding-top:clamp(14px,2vw,24px);padding-bottom:clamp(14px,2vw,24px);padding-left:clamp(14px,2.2vw,26px);padding-right:clamp(14px,2.2vw,26px);} /* Plaza panel: narrow the box a bit — tighten the sub's max-width (was 42ch) so it wraps a touch sooner and the inline-block panel shrinks with it (client 2026-05-29). */ body.page-id-6508 .maj2-hero__panel .maj2-hero__sub{max-width:34ch;} .maj2-hero__panel .maj2-keywords{margin-top:1rem;} /* `text-wrap: balance` distributes words evenly across lines so long hero subs (e.g. "An all-suite, five-star landmark rising opposite the Las Vegas Convention Center.") don't orphan 1-2 words on the last line. Widened max-width slightly (34ch→44ch) to give the balancer breathing room while keeping the elegant narrow measure. `hyphens:none` prevents the balancer from breaking proper nouns ("Las Vegas", "Convention Center"). */ .maj2-hero__sub{font-family:var(--maj-sans);font-weight:300;font-size:clamp(1rem,1.6vw,1.25rem); letter-spacing:.02em;max-width:44ch;margin:1.1rem auto 0;color:#F2ECE0;text-shadow:0 1px 20px rgba(0,0,0,.5); text-wrap:balance;hyphens:none;} .maj2-hero .maj2-keywords{color:#EADFC9;} .maj2-hero .maj2-keywords span+span::before{color:var(--maj-gold);} .maj2-hero__scroll{position:absolute;left:50%;bottom:26px;width:1px;height:46px; background:linear-gradient(var(--maj-gold),transparent);transform:translateX(-50%);animation:maj2drop 2.2s infinite;} @keyframes maj2drop{0%{opacity:0;transform:translate(-50%,-10px)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,16px)}} /* ---- Render band (signature deck motif) ---- */ .maj2-band__media{position:relative;height:clamp(420px,74vh,860px);} .maj2-band__media img{width:100%;height:100%;object-fit:cover;} /* Plaza LED-signage render: anchor the cover-crop lower so more of the lower facade / plaza level shows (client 2026-05-29). */ .maj2-band__media img[src*="plaza-led-signage-render"]{object-position:center bottom;} .maj2-band__caption{background:var(--maj-taupe);color:#F6F1E8;text-align:center; padding:clamp(34px,5vw,64px) var(--maj-h-pad);} .maj2-band__title{font-size:clamp(2rem,4.6vw,3.6rem);} /* Wordmark logo used inline in a band title (e.g. "[Majestic] View" on Plaza) — sized to sit with the title text on one baseline-centered line (client 2026-05-29). */ /* body.maj2 img sets display:block (L41); override to keep this inline beside "View". */ body.maj2 .maj2-band__wordmark{height:clamp(2.6rem,5.4vw,4.2rem);width:auto;vertical-align:middle;display:inline-block;margin:-.15em 0 0 0;} /* Keep the wordmark + label on one line (logo left of the word). */ .maj2-band__title:has(.maj2-band__wordmark){white-space:nowrap;} /* "Plaza" in the band title matches the hero name-sub (gold/uppercase/letter-spaced), but stays inline beside the wordmark instead of stacking (client 2026-05-29). */ .maj2-band__title .maj2-hero__name-sub{display:inline-block;margin-top:0;vertical-align:middle;} .maj2-band__caption .maj2-eyebrow{color:#E9D8B8;} .maj2-band__copy{font-family:var(--maj-sans);font-weight:300;max-width:60ch;margin:1rem auto 0; font-size:1.02rem;color:#F1EADD;} .maj2-band__caption .maj2-keywords{color:#EADFC9;} /* overlay variant */ .maj2-band--overlay{position:relative;} .maj2-band--overlay .maj2-band__caption{position:absolute;inset:auto 0 0 0;background:transparent; background-image:linear-gradient(180deg,rgba(20,16,12,0),rgba(20,16,12,.82));color:#fff; padding-top:clamp(80px,16vh,200px);} .maj2-band--overlay .maj2-band__media{height:clamp(460px,80vh,900px);} /* Plaza panel band: halve the caption bottom padding (was clamp(34px,5vw,64px)) so the panel sits closer to the bottom edge (client 2026-05-29). */ .maj2-band--overlay .maj2-band__caption:has(.maj2-hero__panel){padding-bottom:clamp(17px,2.5vw,32px);} /* ---- Statement ---- */ .maj2-statement{padding:clamp(32px,5.5vw,75px) 0;} .maj2-statement--cream{background:var(--maj-cream);} /* Developer "Honoring the past / Defining the future" statement — balanced (centered) padding, tighter than the default 75px (client 2026-06-01). The eyebrow's own bottom margin is zeroed so the two lines sit centred in the section. */ body.page-id-6153 .maj2-statement{padding-top:clamp(26px,3.6vw,46px)!important;padding-bottom:clamp(26px,3.6vw,46px)!important;} body.page-id-6153 .maj2-statement .maj2-eyebrow{margin:0!important;} /* Doumani panel floating at the seam between the bio split and the Six Decades grid. Negative block margins pull it up into the split and the grid up under it, so it straddles the boundary without adding layout height (client 2026-06-01). */ .maj2-doumani-float{position:relative;z-index:6;display:flex;justify-content:center; padding:0 clamp(16px,4vw,40px);margin-block:calc(-1 * clamp(46px,7vw,92px));pointer-events:none;} /* Solid panel bg so the sections behind don't bleed through the floating card. */ .maj2-doumani-float .maj2-hero__panel{margin:0!important;pointer-events:auto; background:#0E0C0B!important;} /* Let the long documentary button wrap inside the floating panel instead of overflowing its edge (mainly mobile). */ .maj2-doumani-float .maj2-doumani-mark__btn{white-space:normal!important;text-align:center!important;} .maj2-split,.maj2-grid{overflow:visible;} /* Extra top padding on the grid so the "Six Decades of History" title clears the floating Doumani panel above it (client 2026-06-01). */ body.page-id-6153 .maj2-grid{padding-top:clamp(78px,8.5vw,118px)!important;} .maj2-statement--taupe{background:var(--maj-taupe);color:#F6F1E8;} .maj2-statement--dark{background:var(--maj-taupe-deep);color:#F6F1E8;} .maj2-statement__inner{text-align:center;max-width:880px;} .maj2-statement__title{font-size:clamp(1.55rem,3.4vw,2.5rem);} /* Hierarchy reweight (2026-05-27): in statement sections the eyebrow carries the section identity (e.g. "Signage, Branding & Naming Rights Available") while the title supplies the long descriptive line — promote the eyebrow above the tiny base size used by other components. Scoped to .maj2-statement so band / split / hero / location eyebrows keep their base treatment. */ .maj2-statement .maj2-eyebrow{font-size:clamp(.92rem,1.6vw,1.15rem);letter-spacing:.22em;} .maj2-statement__copy{font-family:var(--maj-sans);font-weight:300;font-size:clamp(1.05rem,1.5vw,1.3rem); line-height:1.75;color:var(--maj-ink-soft);max-width:62ch;margin:1.4rem auto 0;} .maj2-statement--taupe .maj2-statement__copy,.maj2-statement--dark .maj2-statement__copy{color:#EDE6D9;} /* ---- Stats ---- */ /* Single-row stat strip (client 2026-05-27 on the Plaza statement): nowrap forces all four stats onto one line; each cell can shrink (`min-width:0; flex:1 1 0`) so a long label like "Customizable Spaces · 1,750–15,000+ sq ft" wraps within its own cell instead of pushing siblings off the row. Gap tightened to keep the row honest at narrower viewports. */ .maj2-stats{display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-start; gap:clamp(14px,2.6vw,44px); margin:clamp(34px,5vw,58px) 0 0;padding:0;border-top:1px solid var(--maj-line);padding-top:clamp(30px,4vw,48px);} .maj2-statement--taupe .maj2-stats,.maj2-statement--dark .maj2-stats{border-top-color:rgba(255,255,255,.2);} .maj2-stat{margin:0;text-align:center;min-width:0;flex:1 1 0;} .maj2-stat__num{font-family:var(--maj-serif);font-weight:500;font-size:clamp(1.9rem,3.6vw,3rem); color:var(--maj-gold-d);line-height:1;white-space:nowrap;} .maj2-statement--taupe .maj2-stat__num,.maj2-statement--dark .maj2-stat__num{color:var(--maj-gold);} .maj2-stat__label{margin:.6rem 0 0;font-family:var(--maj-sans);font-weight:500;font-size:.72rem; letter-spacing:.16em;text-transform:uppercase;color:var(--maj-ink-soft);} .maj2-statement--taupe .maj2-stat__label,.maj2-statement--dark .maj2-stat__label{color:#E3DACB;} /* ---- Split ---- */ .maj2-split{display:grid;grid-template-columns:1fr 1fr;} .maj2-split__media{min-height:440px;} .maj2-split__media img{width:100%;height:100%;object-fit:cover;} .maj2-split__body{background:var(--maj-cream);display:flex;align-items:center; padding:clamp(48px,7vw,110px) clamp(28px,5vw,84px);} /* --goldgrain: matches the maj2_location panel background — gold-grain overlay (50%) over the shared black-grain base, so a split body reads identically to the location body. */ .maj2-split--goldgrain .maj2-split__body{position:relative;} .maj2-split--goldgrain .maj2-split__body::before{content:"";position:absolute;inset:0;z-index:0; pointer-events:none;background:url('assets/goldgrain_background.webp') center/cover no-repeat;opacity:.5;} /* Black + gold card (on-brand): a near-opaque black panel + gold border over the gold-grain, gold headings/keywords with ivory body copy — high contrast and reads cleanly on the grain. */ .maj2-split--goldgrain .maj2-split__inner{position:relative;z-index:1; background:rgba(14,12,11,.82);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px); border:1px solid var(--maj-gold);border-radius:2px;padding:clamp(28px,3.5vw,48px);max-width:62ch;} .maj2-split--goldgrain .maj2-eyebrow{color:var(--maj-gold-d);font-weight:700;} .maj2-split--goldgrain .maj2-split__title{color:#FFFFFF;white-space:nowrap;font-size:clamp(1.55rem,2.9vw,2.4rem);} .maj2-split--goldgrain .maj2-split__copy{color:var(--maj-ink);} .maj2-split--goldgrain .maj2-keywords{color:var(--maj-gold-d);font-weight:700;} .maj2-split--goldgrain .maj2-keywords span+span::before{color:var(--maj-gold);} /* --inverted: black-grain split that mirrors --goldgrain's framed-card structure but skips the gold overlay — a dark twin so the /contact "Bring Your Concept" panel reads with the same weight as its --goldgrain "Lease at Majestic Plaza" partner sitting just above it. Body bg pinned explicitly (defensive vs cascade drift / Elementor injections); the inner card carries the gold border + blur framing identical to --goldgrain. */ .maj2-split--inverted .maj2-split__body{position:relative; background-color:#000000;background-image:var(--maj-grain); background-size:cover;background-position:center;background-repeat:no-repeat;} .maj2-split--inverted .maj2-split__inner{position:relative;z-index:1; background:rgba(14,12,11,.82);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px); border:1px solid var(--maj-gold);border-radius:2px;padding:clamp(28px,3.5vw,48px);max-width:62ch;} .maj2-split--inverted .maj2-eyebrow{color:var(--maj-gold-d);font-weight:700;} .maj2-split--inverted .maj2-split__title{color:#FFFFFF;white-space:nowrap;font-size:clamp(1.55rem,2.9vw,2.4rem);} .maj2-split--inverted .maj2-split__copy{color:var(--maj-ink);} .maj2-split--inverted .maj2-keywords{color:var(--maj-gold-d);font-weight:700;} .maj2-split--inverted .maj2-keywords span+span::before{color:var(--maj-gold);} .maj2-split--flip .maj2-split__media{order:2;} .maj2-split__inner{max-width:46ch;} /* Default split titles forced to one line so brand-name headings ("Hospitality & Event Tents", "Effortless Access, Spectacular Views") read as a single statement (client 2026-05-28). At tablet/desktop sizes the responsive clamp keeps them inside the column width comfortably; below 700px we re-enable wrap so long titles don't overflow the narrow mobile column. The goldgrain/inverted variants already set their own nowrap. */ .maj2-split__title{font-size:clamp(1.9rem,3.6vw,3rem);margin-bottom:.2em;white-space:nowrap;} @media(max-width:700px){ .maj2-split__title{white-space:normal;} } .maj2-split__copy{font-family:var(--maj-sans);font-weight:300;font-size:1.05rem;line-height:1.75;color:var(--maj-ink-soft);} /* Role line under a split title (e.g. "CEO: Majestic Resorts") in the subtext colour. */ .maj2-split__role{display:block;font-family:var(--maj-sans);font-weight:400;font-size:1.1rem;letter-spacing:normal;text-transform:none;color:var(--maj-ink-soft);margin-top:.35em;} /* Tagline pinned below a split's copy (e.g. "Honoring the past. Defining the future.") — double the eyebrow font size (.72rem → 1.44rem) (client 2026-05-29). */ .maj2-split__tagline{margin-top:clamp(1.25rem,2.5vw,2rem);font-size:1.44rem;} /* Subtitle (role line) directly under a split title, e.g. "CEO: Majestic Resorts". */ .maj2-split__subtitle{margin-top:.5em;} /* Plaza split ("Maximum Visibility"): more space between the title and its paragraph (base margin-bottom is only .2em) (client 2026-05-29). */ body.page-id-6508 .maj2-split__title{margin-bottom:.7em;} /* Developer (6153) split title: minimal bottom margin so the subtitle sits close (client 2026-05-29). */ body.page-id-6153 .maj2-split__title{margin-bottom:.175em;} /* Developer (6153) "Majestic Las Vegas" overlay band: caption (eyebrow + title) aligned right (client 2026-05-29). */ body.page-id-6153 .maj2-band--overlay .maj2-band__caption{text-align:right;} /* Developer (6153) Doumani mark: crown on the left; name + subtext + documentary button stacked in a left-aligned column to its right (client 2026-05-29). */ .maj2-doumani-mark{display:flex;align-items:center;justify-content:center;gap:clamp(1rem,2.5vw,2.2rem);} /* Developer (6153) hero panel: a bit more compact (client 2026-05-29). */ body.page-id-6153 .maj2-hero__panel{padding:clamp(16px,2.4vw,30px) clamp(20px,2.8vw,34px);} .maj2-doumani-mark .maj2-header__mark{height:clamp(2.8rem,5.5vw,4.4rem);width:auto;margin:0;flex:none;} .maj2-doumani-mark__col{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;} /* "Six decades…" as proper subtext hugging directly under the name — smaller/muted, pulled up tight under the uppercase name's line box (client 2026-05-29). */ /* body.maj2 .maj2-hero__sub{margin:1.1rem auto 0} (0,1,1) adds the top + auto side margins; (0,2,0) beats it so the subtext hugs the name with no padding (client 2026-05-29). */ body.maj2 .maj2-doumani-mark .maj2-doumani-mark__sub{margin:.1em 0 0;align-self:center;text-align:center;line-height:1.1;font-size:.82rem;font-weight:300;letter-spacing:.04em;text-transform:none;color:rgba(255,255,255,.82);} .maj2-doumani-mark .maj2-hero__name-sub{line-height:1;} /* body.maj2 a{color:inherit} (0,1,1) would tint this white; (0,2,0) wins → black text. */ body.maj2 .maj2-doumani-mark__btn{color:#000;margin-top:.7rem;white-space:nowrap;padding:.85em 1.7em;font-size:.72rem;letter-spacing:.12em;} /* Full "Majestic Las Vegas" wordmark used as a band title. */ body.maj2 .maj2-band__logo{display:inline-block;height:clamp(4.5rem,9vw,7rem);width:auto;vertical-align:middle;} .maj2-split .maj2-keywords{justify-content:flex-start;} /* ---- Media carousel (auto-fading; fills any __media slot) ---- Slides stack absolutely and cross-fade on opacity. No-JS fallback: the .track is a vertical scroll list showing every slide; maj2.js collapses it to the fading carousel, un-hides the prev/next + dot controls and drives autoplay (pauses on hover/focus). */ .maj2-carousel{position:relative;width:100%;height:100%;min-height:inherit;overflow:hidden;background:var(--maj-ink);} .maj2-carousel__track{list-style:none;margin:0;padding:0;width:100%;height:100%;} .maj2-carousel__slide{margin:0;} .maj2-carousel__slide img{width:100%;height:100%;object-fit:cover;display:block;} /* JS-on: slides become absolutely-stacked cross-fading layers */ body:not(.no-js) .maj2-carousel__slide{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none;} body:not(.no-js) .maj2-carousel__slide.is-active{opacity:1;pointer-events:auto;} /* Prev / next arrows */ .maj2-carousel__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3; width:46px;height:46px;display:flex;align-items:center;justify-content:center; border:1px solid rgba(255,255,255,.5);background:rgba(15,15,15,.4);color:#fff; font-size:1.6rem;line-height:1;cursor:pointer;border-radius:50%; transition:background .25s ease,border-color .25s ease;backdrop-filter:blur(2px);} .maj2-carousel__nav:hover{background:var(--maj-gold-d);border-color:var(--maj-gold);} .maj2-carousel__nav:focus-visible{outline:2px solid var(--maj-gold);outline-offset:2px;} .maj2-carousel__nav--prev{left:16px;} .maj2-carousel__nav--next{right:16px;} /* Dot indicators */ .maj2-carousel__dots{position:absolute;left:0;right:0;bottom:16px;z-index:3; display:flex;gap:9px;justify-content:center;} .maj2-carousel__dot{width:9px;height:9px;padding:0;border-radius:50%;cursor:pointer; border:1px solid rgba(255,255,255,.85);background:transparent; transition:background .25s ease,transform .25s ease;} .maj2-carousel__dot.is-active{background:var(--maj-gold);border-color:var(--maj-gold);transform:scale(1.15);} .maj2-carousel__dot:focus-visible{outline:2px solid var(--maj-gold);outline-offset:2px;} @media(prefers-reduced-motion:reduce){ body:not(.no-js) .maj2-carousel__slide{transition:none;} } /* ---- Pull quote ---- */ .maj2-pull{padding:clamp(64px,10vw,140px) 0;text-align:center;} .maj2-pull--taupe{background:var(--maj-taupe);color:#F6F1E8;} .maj2-pull--dark{background:var(--maj-taupe-deep);color:#F6F1E8;} .maj2-pull blockquote{margin:0;} .maj2-pull p{font-family:var(--maj-serif);font-style:italic;font-weight:400; font-size:clamp(1.5rem,3.2vw,2.5rem);line-height:1.35;max-width:24ch;margin-inline:auto;} .maj2-pull cite{display:block;margin-top:1.4rem;font-family:var(--maj-sans);font-style:normal; font-weight:500;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--maj-gold);} /* ---- Grid ---- */ .maj2-grid{padding:clamp(40px,5vw,72px) 0;background:var(--maj-cream-2);text-align:center;position:relative;} /* 1:1 with the homepage location panel (0d9e337): 50% gold-grain overlay atop the black-grain base = the darker-golden background (client 2026-05-27). */ .maj2-grid::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:url('assets/goldgrain_background.webp') center/cover no-repeat;opacity:.5;} .maj2-grid > .maj2-wrap{position:relative;z-index:1;} .maj2-grid__title{font-size:clamp(1.9rem,4vw,3.2rem);margin-bottom:clamp(34px,5vw,60px);padding-bottom:24px;} .maj2-grid__items{display:grid;gap:clamp(20px,2.4vw,34px);} .maj2-grid__items--4{grid-template-columns:repeat(4,1fr);} .maj2-card{margin:0;text-align:center;} .maj2-card img{width:100%;aspect-ratio:4/3;object-fit:cover;box-shadow:0 14px 40px rgba(42,38,34,.16);} .maj2-card figcaption{padding-top:1rem;} .maj2-card__name{display:block;font-family:var(--maj-serif);font-size:1.45rem;color:var(--maj-ink);} .maj2-card__meta{display:block;margin-top:.25rem;font-size:.72rem;letter-spacing:.12em; text-transform:uppercase;color:var(--maj-ink-soft);} /* ---- Location ---- */ .maj2-location{display:grid;grid-template-columns:1fr 1fr;} /* 2026-06-01: every location map sits on the brand GOLD-GRAIN texture — the media background is the gold texture and the map shows COMPLETE (object-fit:contain) on top of it, so the gold frames the map everywhere the map image is used (all pages, all breakpoints). */ .maj2-location__media{position:relative;height:clamp(420px,44vw,660px);min-height:0;overflow:hidden; background:#86786A url('assets/goldgrain_background.webp') center/cover no-repeat;} .maj2-location__media img{position:relative;z-index:1;width:100%;height:100%; object-fit:contain;object-position:center;} .maj2-location__body{background:var(--maj-taupe);color:#F6F1E8;display:flex;align-items:center; padding:clamp(48px,7vw,110px) clamp(28px,5vw,84px);} .maj2-location__body .maj2-eyebrow{color:#E9D8B8;} .maj2-location__title{font-size:clamp(1.9rem,3.6vw,3rem);} /* Match the maj2_location panel to the homepage map section (19d1056): taupe gold-grain body, Oswald thin heading + Roboto copy in black, centered. So the two location sections read identically (client 2026-05-27). */ .maj2-location__body{background:#86786A;position:relative;padding:40px clamp(28px,5vw,84px);} .maj2-location__body::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:url('assets/goldgrain_background.webp') center/cover no-repeat;opacity:.5;} /* 1:1 with the homepage box: black-transparent gold-outline container, ivory text, no eyebrow/address (the homepage box has only heading + seal + copy). */ .maj2-location__body > .maj2-split__inner{position:relative;z-index:1;text-align:center; background:rgba(0,0,0,.5);border:1px solid #C5A06A;border-radius:2px; padding:54px 36px;max-width:480px;margin:0 auto;} .maj2-location__body .maj2-eyebrow{display:none;} .maj2-location__body .maj2-location__title{ font-family:'Oswald',sans-serif;font-weight:100;font-size:2rem;letter-spacing:1.9px;line-height:1; color:#F2ECE0;text-align:center;} .maj2-location__body .maj2-location__copy{ font-family:'Roboto',sans-serif;font-weight:400;font-size:16px;line-height:1.4;color:#EDE6D9; max-width:400px;margin-left:auto;margin-right:auto;text-align:left;} .maj2-location__body .maj2-location__addr{display:none;} /* Seal box — matches the homepage seal box (sealbox1/sealboxc) exactly: black panel, gold hairline, wide rectangle, mark + wordmark tightened. */ .maj2-location__seal{margin:26px auto;max-width:400px; background:#000000;border:1px solid rgba(197,160,106,.45);border-radius:2px; padding:14px 30px;display:flex;flex-direction:column;align-items:center;gap:0;} .maj2-location__mark{width:120px;height:auto;} .maj2-location__word{width:150px;height:auto;margin-top:6px;} .maj2-location__copy{font-family:var(--maj-sans);font-weight:300;line-height:1.75;color:#EDE6D9;margin-top:1rem;} .maj2-location__addr{font-style:normal;margin-top:1.4rem;font-family:var(--maj-sans); font-size:1.05rem;line-height:1.6;color:#F6F1E8;} /* ---- Form ---- */ .maj2-form{padding:clamp(64px,10vw,140px) 0;} .maj2-form--cream{background:var(--maj-cream);} /* ============================================================================ CONTACT (18) — white theme + image hero with a wave shape-divider, matching the original WP contact page (client 2026-06-01). ============================================================================ */ /* Full-bleed aerial hero; the fixed header overlays its top (decorative), and a white wave divider curves into the white form below. */ body.page-id-18 .maj2-contact-hero{position:relative;width:100%; /* Matches the original WP contact section: min-height banner, image as a cover background, waves shape-divider at the bottom (client 2026-06-01). */ /* Pin to the image's native ratio (2200x1772) so cover never crops — the complete render shows identically on desktop AND mobile (client 2026-06-01). */ aspect-ratio:2200/1772;overflow:hidden; background:#0E0C0B url('/wp-content/uploads/2026/05/nighttime-resort-plaza-sphere-cropped5.webp') center center/cover no-repeat;} body.page-id-18 .maj2-contact-hero__shape{position:absolute;left:0;right:0;bottom:-1px;z-index:2;line-height:0;pointer-events:none;} body.page-id-18 .maj2-contact-hero__shape svg{display:block;width:100%;height:clamp(44px,6vw,96px);transform:scaleY(-1);} body.page-id-18 .maj2-contact-hero__shape svg path{fill:#fff;} /* White page + form. The brand "cream" is actually near-black, so force white. */ body.page-id-18 .maj2-form, body.page-id-18 .maj2-form--cream{background:#fff!important;padding-top:clamp(28px,4vw,56px)!important; /* Tuck the white form up 2px under the waves divider so the hero's clipped bottom edge can't show a dark hairline seam (client 2026-06-01). */ margin-top:-2px;position:relative;z-index:1;} body.page-id-18 .maj2-form__title, body.page-id-18 .maj2-form__copy strong{color:#1C1916!important;} body.page-id-18 .maj2-form__copy, body.page-id-18 .maj2-form__contact{color:#5A5249!important;} /* Stacked contact block: bold/larger name, then clickable email + phone lines. */ body.page-id-18 .maj2-form__contact{line-height:1.7;} body.page-id-18 .maj2-form__contact-name{display:block;font-weight:700;font-size:1.15em;color:#1C1916!important;margin-bottom:.35em;} body.page-id-18 .maj2-form__contact-direct{display:block;font-weight:600;color:#1C1916!important;} body.page-id-18 .maj2-form__contact-link{display:block;color:#5A5249!important;text-decoration:none;transition:color .2s ease;} body.page-id-18 .maj2-form__contact-link:hover{color:var(--maj-gold-d)!important;} /* Contact icon list (address / leasing / press / phone) — mirrors the original Majestic Elementor icon-list: gold icon + two-line label/detail, centered block. */ .maj2-form__contacts{list-style:none;margin:clamp(20px,2.4vw,32px) 0 0;padding:0; display:inline-block;text-align:left;} .maj2-form__contacts-item{margin:0 0 clamp(14px,1.6vw,20px);} .maj2-form__contacts-item:last-child{margin-bottom:0;} .maj2-form__contacts-link, .maj2-form__contacts-item{display:flex;align-items:center;gap:.85em;text-decoration:none;color:inherit;} .maj2-form__contacts-icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center; width:2.4em;height:2.4em;border-radius:50%;background:rgba(176,141,87,.12);color:var(--maj-gold-d);} .maj2-form__contacts-icon svg{width:1.15em;height:1.15em;fill:currentColor;} .maj2-form__contacts-text{display:flex;flex-direction:column;line-height:1.35;} .maj2-form__contacts-label{font-weight:600;} .maj2-form__contacts-detail{font-size:.92em;opacity:.85;} /* Contact-page (white) colors. */ body.page-id-18 .maj2-form__contacts-label{color:#1C1916;} body.page-id-18 .maj2-form__contacts-detail{color:#5A5249;} body.page-id-18 .maj2-form__contacts-link{transition:color .2s ease;} body.page-id-18 .maj2-form__contacts-link:hover .maj2-form__contacts-detail{color:var(--maj-gold-d);} body.page-id-18 .maj2-form__contacts-link:hover .maj2-form__contacts-icon{background:rgba(176,141,87,.22);} body.page-id-18 .maj2-form .maj2-eyebrow{color:var(--maj-gold-d)!important; font-size:clamp(1.5rem,4vw,2.4rem)!important;letter-spacing:.18em;margin-bottom:.5em;} /* Advertising-flyer form: enlarge the "Enquiries" eyebrow (client 2026-06-01). */ #form-advertising .maj2-eyebrow{font-size:clamp(1.5rem,4vw,2.4rem)!important;letter-spacing:.18em;margin-bottom:.5em;} body.page-id-18 .maj2-form label{color:#6B6258!important;} body.page-id-18 .maj2-form input, body.page-id-18 .maj2-form select, body.page-id-18 .maj2-form textarea{background:#fff!important;border-color:#D9D3C8!important;color:#1C1916!important;} body.page-id-18 .maj2-form input::placeholder, body.page-id-18 .maj2-form textarea::placeholder{color:#9a9286!important;} body.page-id-18 .maj2-form select option{background:#fff!important;color:#1C1916!important;} /* Drop the dark panel box around the form — plain white like the original. */ body.page-id-18 .maj2-form__inner{background:transparent!important;border:0!important;padding-inline:0!important;} .maj2-form--taupe{background:var(--maj-taupe);color:#F6F1E8;} .maj2-form__inner{max-width:760px;} .maj2-form__intro{text-align:center;margin-bottom:clamp(28px,4vw,48px);} .maj2-form__title{font-size:clamp(2rem,4vw,3.2rem);} .maj2-form__copy{font-family:var(--maj-sans);font-weight:300;color:var(--maj-ink-soft);max-width:48ch;margin:1rem auto 0;} /* Direct-contact line under the form copy (client 2026-05-29). */ .maj2-form__contact{font-family:var(--maj-sans);font-weight:400;font-size:.9rem;color:var(--maj-ink-soft);max-width:none;margin:.35rem auto 0;text-align:center;} .maj2-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px;} .maj2-form__full{grid-column:1/-1;} .maj2-form label{display:flex;flex-direction:column;gap:.45rem;font-family:var(--maj-sans); font-weight:600;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--maj-ink-soft);} .maj2-form input,.maj2-form select,.maj2-form textarea{font-family:var(--maj-sans);font-weight:400; font-size:1rem;letter-spacing:normal;text-transform:none;color:var(--maj-ink); background:#FBF8F1;border:1px solid var(--maj-line);border-radius:0;padding:.85em 1em;width:100%; transition:border-color .3s,box-shadow .3s;} .maj2-form input:focus,.maj2-form select:focus,.maj2-form textarea:focus{outline:none; border-color:var(--maj-gold);box-shadow:0 0 0 3px rgba(191,154,101,.18);} .maj2-form .maj2-btn{margin-top:clamp(20px,3vw,30px);border:0;} .maj2-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;} .maj2-form__notice{text-align:center;font-family:var(--maj-sans);padding:1.4rem;border:1px solid var(--maj-line);} .maj2-form__notice--ok{background:#EEF3E9;border-color:#B9CBA6;color:#3C5A2E;} .maj2-form__notice--err{background:#F6E9E6;border-color:#D8A99E;color:#7A352A;} /* ---- CTA ---- */ .maj2-cta{text-align:center;padding:clamp(64px,11vw,150px) 0;} /* Plaza closing CTA (button-only): half the section height (client 2026-05-29). */ .maj2-cta:has(.maj2-btn--lg){padding-top:clamp(32px,5.5vw,75px);padding-bottom:clamp(32px,5.5vw,75px);} /* Closing CTA button ~50% smaller (client 2026-06-01) — font halved; the em-based padding + letter-spacing scale down with it. */ .maj2-cta__inner .maj2-btn--lg{font-size:.48rem!important;} .maj2-cta--dark{background:var(--maj-taupe-deep);color:#F6F1E8;} .maj2-cta--gold{background:var(--maj-gold);color:#211C16;} .maj2-cta__title{font-size:clamp(2rem,4.6vw,3.6rem);} .maj2-cta__copy{font-family:var(--maj-sans);font-weight:300;margin:1rem auto 2rem;max-width:44ch;opacity:.92;} /* CTA gold button (Schedule a Majestic Meeting, On-Site Meeting): black text at rest, gold text on hover — consistent on every page (client 2026-06-02). Overrides the prior dark-CTA cream hover. */ .maj2-cta .maj2-btn--gold{color:#000;} .maj2-cta--dark .maj2-btn--gold:hover{background:transparent;color:var(--maj-gold);} /* ---- Footer ---- */ /* Centered, balanced composition (client 2026-05-27): the prior 1.2fr/1fr/1fr grid read as left-weighted (heavy logo column left, light nav right). Now a single centered stack — logo + tagline, nav row, NAP — so the footer is unambiguously centered on every page. */ .maj2-footer{background:#000000;color:#FFFFFF;padding:clamp(28px,4vw,48px) 0 30px;} .maj2-footer__inner{max-width:var(--maj-wrap);margin-inline:auto;padding:0 var(--maj-h-pad); display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(22px,3vw,34px);} .maj2-footer__brand{display:flex;flex-direction:column;align-items:center;} .maj2-footer__brand img{height:96px;width:auto;} .maj2-footer__tag{font-family:var(--maj-serif);font-style:italic;font-size:1.3rem;color:#E6D9C0;margin:.8rem 0 0;} .maj2-footer__nap{font-style:normal;line-height:1.7;font-size:.95rem;max-width:none;} .maj2-footer__nap span{display:block;margin-top:.7rem;font-size:.82rem;color:#FFFFFF;} /* Each NAP sub-line stays on its own line and never breaks mid-sentence (client 2026-05-28). Stacked with a small inter-line gap. */ .maj2-footer__nap__line{white-space:nowrap;margin-top:.15rem!important;} .maj2-footer__nap__line:first-of-type{margin-top:.7rem!important;} .maj2-footer__nav ul{list-style:none;margin:0;padding:0; display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2.2rem;} .maj2-footer__nav li{margin:0;} .maj2-footer__nav a{font-family:var(--maj-sans);font-size:.82rem;letter-spacing:.14em; text-transform:uppercase;color:#FFFFFF;transition:color .3s;} .maj2-footer__nav a:hover{color:var(--maj-gold);} .maj2-footer__fine{max-width:var(--maj-wrap);margin:clamp(40px,6vw,64px) auto 0;padding:24px var(--maj-h-pad) 0; border-top:1px solid rgba(255,255,255,.1);font-size:.74rem;letter-spacing:.04em;color:#FFFFFF;text-align:center;} /* body.maj2 p{margin:0 0 1em} (L45) zeroes the auto side-margins above, pushing the block left; restore centering with higher specificity (client 2026-05-29). */ body.maj2 .maj2-footer__fine{margin-left:auto;margin-right:auto;} /* ---- Reveal ---- */ .maj2-reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease;} .maj2-reveal.is-in{opacity:1;transform:none;} /* ---- Responsive ---- */ @media(max-width:980px){ .maj2-split,.maj2-location{grid-template-columns:1fr;} .maj2-split--flip .maj2-split__media{order:0;} .maj2-split__media{min-height:340px;height:56vw;max-height:480px;} /* .maj2-location__media keeps its global height (clamp 420–660) so every map section matches the homepage map at all breakpoints (2026-06-01). */ .maj2-grid__items--4{grid-template-columns:repeat(2,1fr);} /* mobile nav */ .maj2-burger{display:flex;} .maj2-nav{position:fixed;inset:0 0 0 auto;width:min(82vw,360px);background:#0A0806; transform:translateX(100%);transition:transform .4s;padding:96px 36px 36px;} .maj2-nav.is-open{transform:none;} .maj2-nav ul{flex-direction:column;align-items:flex-start;gap:1.4rem;} .maj2-nav a{color:#F2ECE0!important;text-shadow:none;font-size:1rem;} .maj2-nav__cta a{border-color:var(--maj-gold)!important;color:var(--maj-gold)!important;} body.maj2.maj2-navopen{overflow:hidden;} } @media(max-width:600px){ body.maj2{font-size:16px;} .maj2-stats{gap:24px 36px;} .maj2-stat{flex:1 1 38%;} .maj2-grid__items--4{grid-template-columns:1fr;} .maj2-form__grid{grid-template-columns:1fr;} .maj2-band__media{height:62vh;} } /* ---- Reduced motion ---- */ @media(prefers-reduced-motion:reduce){ .maj2-reveal{opacity:1!important;transform:none!important;transition:none!important;} .maj2-hero__scroll{animation:none;} body.maj2 *{scroll-behavior:auto!important;} } /* ---- No-JS fallback (reveal must not hide content) ---- */ body.maj2.no-js .maj2-reveal{opacity:1;transform:none;} /* ===================================================================== BLACK + GOLD — section backdrops, dark states, centering fix (2026-05-27) ===================================================================== */ /* One dark world: black grain behind the whole canvas + every content section. */ body.maj2{background:var(--maj-grain) #000000 center/cover fixed;} .maj2-statement,.maj2-grid,.maj2-form,.maj2-pull,.maj2-cta--dark, .maj2-band__caption,.maj2-split__body,.maj2-location__body{ background-color:#000000; background-image:var(--maj-grain);background-size:cover;background-position:center; } /* Footer matches the scrolled navbar colour (rgba(36,31,26,.94)) as a SOLID fill — fully opaque so the fixed body grain does NOT bleed through (no texture in the footer). */ .maj2-footer{background:#000000;background-image:none;} /* overlay band caption keeps its photo gradient (no grain over the image) */ .maj2-band--overlay .maj2-band__caption{background-image:linear-gradient(180deg,rgba(8,6,5,0),rgba(8,6,5,.88));} /* Scrolled navbar = footer, EXACT same solid colour (locked). Opaque so no texture/alpha drift. */ .maj2-header.is-scrolled{background:#000000;backdrop-filter:none; border-bottom-color:var(--maj-line);box-shadow:0 1px 0 rgba(0,0,0,.4);} .maj2-header.is-scrolled .maj2-nav a{color:var(--maj-ink);} .maj2-header.is-scrolled .maj2-nav a[aria-current="page"]{color:var(--maj-gold);} .maj2-header.is-scrolled .maj2-burger span{background:var(--maj-ink);box-shadow:none;} /* Form fields — light tan surface (2026-05-27 client direction): warm light tan inputs across the board, dark warm ink text + muted tan placeholder for contrast. */ .maj2-form input,.maj2-form select,.maj2-form textarea{background:#EDE3CE;border-color:rgba(197,160,106,.45);color:#241F1A;} .maj2-form input::placeholder,.maj2-form textarea::placeholder{color:#8A7E68;} .maj2-form select option{background:#EDE3CE;color:#241F1A;} .maj2-form input:focus,.maj2-form select:focus,.maj2-form textarea:focus{border-color:var(--maj-gold);box-shadow:0 0 0 3px rgba(197,160,106,.30);background:#F3EBDB;} .maj2-card img{box-shadow:0 16px 44px rgba(0,0,0,.6);} /* Form panel — frosted contained card matching V1's lead-form panel (client request 2026-05-27): intro + fields sit inside one bordered card over the black grain. */ .maj2-form{padding-inline:var(--maj-h-pad);} .maj2-form__inner{max-width:760px;margin-inline:auto; padding:clamp(1.75rem,4vw,3rem); background:rgba(14,12,11,.5); border:1px solid rgba(197,160,106,.35); border-radius:2px; -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);} /* Subtext centering. Root cause: the base `body.maj2 p` reset (specificity 0,1,2) was overriding the components' `margin:auto`, pinning the max-width sub/copy boxes to the left. These body-prefixed selectors (0,2,1) win, restoring centered blocks + centered text. */ body.maj2 .maj2-hero__sub{margin:1.1rem auto 0;text-align:center;} body.maj2 .maj2-statement__copy{margin:1.4rem auto 0;text-align:center;} body.maj2 .maj2-band__copy{margin:1rem auto 0;text-align:center;} body.maj2 .maj2-cta__copy{margin:1rem auto 2rem;text-align:center;} body.maj2 .maj2-form__copy{margin:1rem auto 0;text-align:center;} /* ===== Site-wide brand header (2026-05-27) ===== The brand header is injected on every page via wp_body_open so the nav matches site-wide. Hide the original Jupiter X / Elementor header (only present on the non-brand original pages). */ .jupiterx-header{display:none!important;} /* keep the mobile-menu scroll lock working on non-brand pages too */ body.maj2-navopen{overflow:hidden;} /* black-grain canvas — shared by "LOCATION." (a7fd941), the location intro (fe78d8d) and the showcase render (5136e85) (client 2026-05-27). */ .elementor-element-a7fd941, .elementor-element-fe78d8d, .elementor-element-5136e85{ background-color:#000000!important; background-image:var(--maj-grain)!important; background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important; } /* ============================================================ THE LAS VEGAS LOCATION — intro (fe78d8d) + showcase (5136e85) redesigned as ONE continuous black-grain editorial moment: the intro states it (gold eyebrow → ivory Cormorant headline trio → logo seal → soft copy), the render directly below shows it. On-brand with the rest of the site. (client 2026-05-27 redesign) ============================================================ */ /* --- intro --- */ .elementor-element-fe78d8d{position:relative;padding:clamp(64px,9vh,112px) 0 clamp(36px,6vh,68px)!important;} .elementor-element-fe78d8d > .elementor-container{max-width:940px;} .elementor-element-c6e75b4 > .elementor-element-populated{ background:transparent!important;border:0!important;border-radius:0!important; padding:0 var(--maj-h-pad)!important;text-align:center;} .elementor-element-c6e75b4 .elementor-widget{text-align:center;} /* gold eyebrow "Las Vegas" */ .elementor-element-444c85b .elementor-heading-title{ font-family:var(--maj-sans)!important;font-weight:600!important;font-size:.74rem!important; letter-spacing:.3em!important;text-transform:uppercase!important;color:var(--maj-gold-d)!important; margin:0 0 1.5rem!important;} /* ivory serif headline trio, tightly stacked */ .elementor-element-decce11,.elementor-element-c7aa237,.elementor-element-f2fa776{margin:0!important;} .elementor-element-decce11 .elementor-heading-title, .elementor-element-c7aa237 .elementor-heading-title, .elementor-element-f2fa776 .elementor-heading-title{ font-family:var(--maj-serif)!important;font-weight:500!important; font-size:clamp(2rem,4vw,3rem)!important;line-height:1.12!important;letter-spacing:.012em!important; color:var(--maj-ink)!important;margin:0!important;} /* logo seal — mark + wordmark, no box, centered on the grain */ .elementor-element-55e4c1a{margin:2.4rem auto 0!important;} .elementor-element-76acb7b > .elementor-element-populated{ background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;} .elementor-element-f78d20e img{width:clamp(116px,13vw,164px)!important;margin-inline:auto;} .elementor-element-5357ad1{margin-top:.55rem!important;} .elementor-element-5357ad1 img{width:clamp(148px,16vw,206px)!important;margin-inline:auto;} /* gold hairline + soft ivory body copy */ .elementor-element-0bb616f{position:relative;margin-top:2.2rem!important;padding-top:2.2rem!important;} .elementor-element-0bb616f::before{ content:"";position:absolute;top:0;left:50%;transform:translateX(-50%); width:56px;height:1px;background:var(--maj-gold);opacity:.6;} .elementor-element-0bb616f .elementor-text-editor{ max-width:62ch;margin-inline:auto; font-family:var(--maj-sans)!important;font-weight:300!important;font-size:1.04rem!important; line-height:1.72!important;color:var(--maj-ink-soft)!important;} .elementor-element-0bb616f .elementor-text-editor p{margin:0;} /* --- showcase: flows straight out of the intro (same canvas) --- */ .elementor-element-5136e85{position:relative;overflow:visible;padding:0 0 clamp(56px,9vh,96px)!important;} .elementor-element-5136e85 .elementor-element-1db76c3{position:relative;z-index:2;margin-top:clamp(-60px,-5vh,-34px);} .elementor-element-5136e85 .elementor-element-1db76c3 img{margin-inline:auto;display:block;} /* gold frame itself is set via Elementor's native image-border controls (DB) so it is not overridden by Elementor's own border rule — see post 6544 #1db76c3. */ /* Homepage hero slideshow (023bdf3) — brighten the aerial renders + a soft warm backlight glow so the images read luminous rather than flat (client 2026-05-27). */ .elementor-element-023bdf3 .elementor-background-slideshow__slide__image{ filter:brightness(1.2) contrast(1.03) saturate(1.08); } .elementor-element-023bdf3 .elementor-background-slideshow::after{ content:"";position:absolute;inset:0;pointer-events:none;z-index:1; background:radial-gradient(125% 85% at 50% 0%,rgba(255,239,206,.20),rgba(255,239,206,0) 62%); mix-blend-mode:screen; } /* Mobile-only crossfade hero (.maj2-mhero, injected by functions.php on the front page). Hidden on desktop — there the native Elementor Swiper hero runs. The ≤768px block (search "maj2-mhero") shows it + locks it to a 3:2 box below the nav so the aerials display COMPLETE (no crop, no blank). Same brightening filter as the desktop slides so the two heroes match. */ .maj2-mhero{display:none;} .maj2-mhero__img{filter:brightness(1.2) contrast(1.03) saturate(1.08);} @keyframes maj2-mhero-fade{ 0%{opacity:0;} 2%{opacity:1;} 23%{opacity:1;} 25%{opacity:0;} 100%{opacity:0;} } @media(prefers-reduced-motion:reduce){ .maj2-mhero__img{animation:none!important;} .maj2-mhero__img:nth-child(1){opacity:1;} } /* DESKTOP home hero (2026-06-01): use the SAME .maj2-mhero crossfade as mobile so the full 3:2 aerial shows below the nav with nothing cut — the Elementor Swiper (cover + Ken Burns) cropped the top. Hide the Swiper, render the mhero in a 3:2 box (66.67vw) seated below the ~180px desktop header. */ @media(min-width:769px){ body.home .elementor-element-023bdf3{ min-height:0!important;height:auto!important;aspect-ratio:auto!important; padding-top:180px!important;padding-bottom:0!important;background:#0E0C0B!important;} body.home .elementor-element-023bdf3 > .elementor-container, body.home .elementor-element-023bdf3 .elementor-background-slideshow{display:none!important;} body.home .maj2-mhero{display:block!important;position:relative!important; width:100%!important;height:clamp(300px,56.25vw,900px)!important;overflow:hidden!important;background:#0E0C0B!important;} body.home .maj2-mhero__img{position:absolute!important;inset:0!important; width:100%!important;height:100%!important;object-fit:cover!important; object-position:center!important;opacity:0;animation:maj2-mhero-fade 16s linear infinite;} body.home .maj2-mhero__img:nth-child(1){animation-delay:0s;} body.home .maj2-mhero__img:nth-child(2){animation-delay:4s;} body.home .maj2-mhero__img:nth-child(3){animation-delay:8s;} body.home .maj2-mhero__img:nth-child(4){animation-delay:12s;} } /* Original JupiterX subfooter (non-brand original pages, e.g. the home page) — fully replaced by the brand footer (maj2-footer), which functions.php injects via wp_footer. Hide the parent chrome so the home page matches the brand-template pages (client 2026-05-27). */ .jupiterx-footer,.jupiterx-subfooter{display:none!important;} /* Remove the empty Elementor section (5136e85) on the home page — it held no content and only added dead vertical space (client 2026-06-01). */ body.home .elementor-element-5136e85{display:none!important;} /* Home "Las Vegas Location" row — remove the right-hand text/seal column (0d9e337: "The Las Vegas Location" heading + logo seal + blurb) and let the left image column (e5ae4b7) span the full row width (client 2026-06-01). */ .elementor-element-0d9e337{display:none!important;} .elementor-element-e5ae4b7{width:100%!important;} /* Gold-grain texture (from V1) laid at 50% opacity over every Elementor block that uses the #86786A taupe background — site-wide (client 2026-05-27). A ::before holds the texture so the original color still reads through it; content is lifted above. The overlay must sit on the SAME element that carries background-color:#86786A: • section fe78d8d → color is on the section element itself • column 0d9e337 → color is on the inner .elementor-column-wrap (one level deeper) */ /* (fe78d8d gold-grain overlay removed 2026-05-27 — the location intro is now a black-grain editorial section, styled above; only 0d9e337 keeps gold-grain.) */ /* column 0d9e337 — darker golden panel: black-grain base + 50% gold-grain overlay, matching the brand maj2_location body exactly (client 2026-05-27). */ .elementor-element-0d9e337 > .elementor-column-wrap{position:relative; background-color:#000000!important;background-image:var(--maj-grain)!important; background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;} .elementor-element-0d9e337 > .elementor-column-wrap::before{ content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background:url('assets/goldgrain_background.webp') center/cover no-repeat;opacity:.5;} .elementor-element-0d9e337 > .elementor-column-wrap.elementor-element-populated > .elementor-widget-wrap{position:relative;z-index:1; background:rgba(0,0,0,.5); /* black transparent container */ border:1px solid #C5A06A; /* gold outline */ border-radius:2px;padding:54px 36px!important; /* taller box (override Elementor col padding) */ max-width:480px;align-self:center;} /* not full width — centered box */ /* ivory text on the dark box (was black, unreadable) */ .elementor-element-0d9e337 .elementor-element-7984d09 .elementor-heading-title, .elementor-element-0d9e337 .elementor-element-7984d09 .elementor-heading-title b{color:#F2ECE0!important;} .elementor-element-0d9e337 .elementor-element-b0e9d01 .elementor-text-editor, .elementor-element-0d9e337 .elementor-element-b0e9d01 .elementor-text-editor p{color:#EDE6D9!important;} /* Map split-panel (19d1056): hide the empty icon widget that only adds dead vertical space (client 2026-05-27). */ .elementor-element-d285285{display:none!important;} /* Use the convention-center map (the left column's cover BACKGROUND, id 6557) instead of the tall location-map.webp widget — hide that widget so the bg map shows. The widget was also a 1267x1791 portrait that forced the section huge. (client 2026-05-27) */ /* 2026-06-01: text column (0d9e337) removed → this map column is full-width and the section's only content. The COMPLETE map (object-fit:contain via ::after) sits centred on the brand GOLD-GRAIN texture backdrop — matching every other location map on the site. No crop, no distortion; the gold frames the map. */ .elementor-element-e5ae4b7 > .elementor-column-wrap{position:relative;overflow:hidden; background:#86786A url('assets/goldgrain_background.webp') center/cover no-repeat!important; min-height:clamp(420px,44vw,660px)!important;} /* foreground: complete map, contained + centred — no crop, no distortion */ .elementor-element-e5ae4b7 > .elementor-column-wrap::after{ content:"";position:absolute;inset:0;z-index:1;pointer-events:none; background:url(/wp-content/uploads/2024/10/las-vegas-convention-center-map.jpg) center/contain no-repeat;} .elementor-element-e5ae4b7 > .elementor-column-wrap > *{position:relative;z-index:2;} .elementor-element-ee70b3a{display:none!important;} .elementor-element-0d9e337 > .elementor-element-populated{ padding-top:30px!important;padding-bottom:30px!important; min-height:520px;display:flex;flex-direction:column;justify-content:center;} /* Mobile: open up the gap between the stacked "LOCATION. LOCATION. LOCATION." lines. */ @media(max-width:782px){.raven-heading-title{line-height:1.55;}} /* "Glowing Building" resort-card section (#6c7379a): zoom in the background image. Scaled ::before keeps cover-crop and zooms uniformly across aspect ratios; no DB edit. */ .elementor-element.elementor-element-6c7379a{position:relative;overflow:hidden;} .elementor-element.elementor-element-6c7379a::before{ content:"";position:absolute;inset:0;z-index:0;pointer-events:none; background-image:url('https://majesticlasvegas.com/wp-content/uploads/2024/09/event-centre-front-street-view-hotel-tower-in-background.jpg'); background-size:cover;background-position:bottom center;background-repeat:no-repeat; transform:scale(1.20);transform-origin:bottom center;} .elementor-element.elementor-element-6c7379a > .elementor-container{position:relative;z-index:2;} /* ===================================================================== Announcement top bar — sits above the nav inside the fixed header. Deep maroon strip with white text + gold accents; promo for /advertising-flyer/. Drops in from above after a 1s pause on first paint. ===================================================================== */ .maj2-topbar{background:#8B1A1A;border-bottom:1px solid rgba(0,0,0,.18); /* Box stays in flow (so the nav doesn't shift); only the visual is offset up + faded out, then we animate back to identity 1s after load. */ transform:translateY(-100%);opacity:0;will-change:transform,opacity; animation:maj2-topbar-drop .7s cubic-bezier(.22,.61,.36,1) 1s forwards;} @keyframes maj2-topbar-drop{to{transform:translateY(0);opacity:1;}} /* Respect reduced-motion: appear instantly, no slide. */ @media(prefers-reduced-motion:reduce){ .maj2-topbar{animation:none;transform:none;opacity:1;} } /* Button is absolutely pinned right + out of flow, so the message centres across the FULL bar width (not as a centred pair with the button). min-height + align-items give the strip breathing room and true vertical centring. */ .maj2-topbar__inner{position:relative;max-width:1400px;margin-inline:auto;min-height:54px; padding:8px var(--maj-h-pad);display:flex;align-items:center;justify-content:center;} /* Two-class selector (0,2,0) so margin:0 beats the `body.maj2 p` reset (0,1,2) on brand pages — otherwise the

inherits a 1em bottom margin and rides high / off the button. */ .maj2-topbar .maj2-topbar__msg{margin:0;position:relative;top:2px;display:flex;align-items:center;justify-content:center;gap:.7rem; flex-wrap:nowrap;white-space:nowrap;text-align:center;font-family:var(--maj-sans); font-size:.92rem;line-height:1;letter-spacing:.16em;text-transform:uppercase;} /* White copy on maroon, with a gold bullet for the brand accent. */ .maj2-topbar__lead{color:#fff;font-weight:700;letter-spacing:.22em;} .maj2-topbar__sub{color:rgba(255,255,255,.82);font-weight:500;position:relative;} /* Two-class selector (0,2,0) so the gold text colour beats `body.maj2 a{color:inherit}` (0,1,1) on brand pages — otherwise the button text renders ivory there, not gold. */ /* Solid gold pill with black lettering; hover lifts to a brighter gold (no transparency, no inversion — the pill just glows up a notch). */ .maj2-topbar .maj2-topbar__cta{position:absolute;right:var(--maj-h-pad);top:50%;transform:translateY(-50%); font-family:var(--maj-sans);font-size:.82rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase; background:var(--maj-gold);color:#000;border:1px solid var(--maj-gold);padding:.5em 1.3em;white-space:nowrap; transition:background .3s,border-color .3s;} .maj2-topbar .maj2-topbar__cta:hover{background:var(--maj-gold-d);border-color:var(--maj-gold-d);} @media(max-width:768px){ /* Single row on small screens: message left, "More Details" pill right. 2026-06-01: the message must take the remaining width and WRAP so it never runs under the button. Message = flex:1 + min-width:0 (so it can shrink), lead stays on one line, sub is allowed to wrap; the pill keeps its size (flex:0 0 auto) on the right. */ .maj2-topbar__inner{flex-direction:row;justify-content:space-between;align-items:center; gap:12px;min-height:0;padding:5px 14px;} .maj2-topbar .maj2-topbar__cta{position:static;transform:none;flex:0 0 auto;white-space:nowrap; font-size:clamp(.56rem,2.5vw,.72rem)!important;padding:.7em 1em!important;letter-spacing:.12em!important;} .maj2-topbar .maj2-topbar__msg{top:0;flex:1 1 auto;min-width:0; flex-direction:column;align-items:flex-start;justify-content:center;text-align:left;gap:1px; white-space:normal;flex-wrap:wrap;overflow-wrap:break-word; font-size:clamp(.58rem,2.5vw,.72rem);letter-spacing:.05em;line-height:1.22;} .maj2-topbar__lead{white-space:nowrap;} .maj2-topbar__sub{white-space:normal;overflow-wrap:break-word;} } /* ===================================================================== Logo wall (maj2_logos) — expo logos on ivory tiles so any mark reads on the dark canvas. object-fit:contain (no crop), uniform tile height. ===================================================================== */ .maj2-expos{padding:clamp(64px,8vw,110px) 0 clamp(40px,5vw,72px);background:var(--maj-cream-2);text-align:center;overflow:hidden;} /* Bottom padding on the title wrap — opens additional breathing room between the heading and the marquee below (client 2026-05-28). Scoped to .maj2-expos so the shared .maj2-wrap class isn't affected elsewhere. */ .maj2-expos > .maj2-wrap{padding-bottom:clamp(24px,3.4vw,56px);} .maj2-expos__title{font-size:clamp(1.9rem,4vw,3.2rem);margin-bottom:clamp(30px,4.5vw,54px);} /* Carousel: viewport masks the edges; the track holds two identical copies of the set and slides -50% — exactly one full set's width — for a seamless loop. Tiles bumped ~30% (client 2026-05-28); gap widened to keep the row breathing at the new size. */ .maj2-expos__carousel{position:relative;overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);} /* Promote the track to its own GPU layer (will-change + translate3d) — kills the subpixel jitter that made the previous loop occasionally "stutter" at the wrap point. The animation now interpolates between two 3D transforms which the browser composites off the main thread, so the seam at 50%→0% reset is invisible at any duration. */ .maj2-expos__track{list-style:none;margin:0;padding:0;display:flex;width:max-content; will-change:transform;animation:maj2-expos-scroll 55s linear infinite;} .maj2-expos__carousel:hover .maj2-expos__track{animation-play-state:paused;} .maj2-expos__item{flex:0 0 auto;width:clamp(195px,19.5vw,247px);margin:0 clamp(36px,4.5vw,64px) 0 0;text-align:center;} .maj2-expos__tile{display:flex;align-items:center;justify-content:center;height:clamp(108px,11vw,142px); padding:0;background:var(--maj-ink);border:1px solid var(--maj-line); box-shadow:0 12px 34px rgba(0,0,0,.5);overflow:hidden;} /* Logos completely fill the tile (client 2026-05-28, second pass). `object-fit:cover` scales each logo until it covers the entire tile in BOTH dimensions — no letterbox bars. Aspect ratio is preserved so logos aren't squashed, but logos with extreme ratios may crop slightly at the edges; `object-position:center` keeps the brand mark visually centered so the core of each logo stays in-frame. */ .maj2-expos__tile img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;box-shadow:none;} /* Name labels under each tile hidden (client 2026-05-28) — the logo image carries the brand mark visually and its `alt` attr keeps the name in the accessibility tree, so the small caption was redundant. Kept in the DOM (not removed from PHP) so screen readers still announce the logo identities via the img alt. */ .maj2-expos__name{display:none;} @keyframes maj2-expos-scroll{from{transform:translate3d(0,0,0);}to{transform:translate3d(-50%,0,0);}} @media(prefers-reduced-motion:reduce){ .maj2-expos__track{animation:none;flex-wrap:wrap;justify-content:center;width:auto;} .maj2-expos__item[aria-hidden="true"]{display:none;} .maj2-expos__carousel{-webkit-mask-image:none;mask-image:none;} } /* ===================================================================== Home hero overlay — eyebrow + address injected server-side as a direct child of the slideshow hero

, pinned to the bottom edge in a black-grain card with a gold hairline. Uses --maj-grain (the brand's black-grain texture over solid black) so the overlay reads as part of the same world as the brand-page sections. ===================================================================== */ section.elementor-element-023bdf3{position:relative;} .maj2-home-hero-overlay{position:absolute;left:50%;bottom:clamp(12px,2vh,28px); transform:translateX(-50%);z-index:5;text-align:center;pointer-events:none; width:auto;max-width:92vw; padding:clamp(14px,2.2vh,22px) clamp(28px,5vw,64px); background:#000;background:var(--maj-grain),#000; background-blend-mode:normal;background-size:auto,cover; background-position:center,center; border:1px solid rgba(197,160,106,.4); box-shadow:0 22px 60px rgba(0,0,0,.55); /* Subtle fade-in + lift so it lands rather than pops. */ opacity:0;transform:translate(-50%,12px); animation:maj2-home-hero-overlay-in .9s cubic-bezier(.22,.61,.36,1) .3s forwards;} /* Gold eyebrow hidden — overlay now reads as a single white address line. */ .maj2-home-hero-overlay .maj2-eyebrow{display:none;} .maj2-home-hero-overlay__loc{margin:0;color:#F2ECE0; font-family:var(--maj-sans);font-weight:500; font-size:clamp(.78rem,1.3vw,.98rem);letter-spacing:.24em; text-transform:uppercase;line-height:1.5;white-space:nowrap; display:inline-flex;align-items:center;gap:2.2em;} /* Gold map-pin glyph in front of the address; scales with the address font size (1em h/w) so the lockup stays balanced at any breakpoint. */ .maj2-home-hero-overlay__pin{flex:0 0 auto;width:1em;height:1.25em; color:var(--maj-gold);display:inline-block; /* Letterspaced uppercase rides high; nudge the pin down a hair to optically center. */ transform:translateY(.05em);} @keyframes maj2-home-hero-overlay-in{to{opacity:1;transform:translate(-50%,0);}} @media(prefers-reduced-motion:reduce){ .maj2-home-hero-overlay{animation:none;opacity:1;transform:translateX(-50%);} } /* ===================================================================== MOBILE PROFESSIONAL POLISH (2026-05-31) Accessibility + readability layer over the verified A+ design. Measured against the live DOM at 360/390/768px: 0 horizontal overflow on all 10 pages, so layout is left untouched — this ONLY enlarges sub-44px touch targets and lifts the smallest labels to a legible floor. Scoped <=1024px (desktop unchanged). !important is required to beat the in- inline