/* ========================================================= ALMARA Redesign CSS — FINAL FREEZE Scope: ALMARA Home Elementor templates Stack: WordPress + Elementor Pro + MU plugin asset Notes: cleaned full version, CSS-only, no JS layout fixes ========================================================= */ :root { --alm-navy: #092b3d; --alm-blue: #0e6f8f; --alm-aqua: #38c6d9; --alm-sand: #f3eadb; --alm-cream: #fbf8f1; --alm-white: #ffffff; --alm-muted: #637985; --alm-line: rgba(9, 43, 61, 0.14); --alm-shadow-soft: 0 14px 38px rgba(9, 43, 61, 0.08); --alm-shadow: 0 22px 60px rgba(9, 43, 61, 0.12); --alm-radius-lg: 30px; --alm-radius-md: 20px; --alm-max: 1440px; } html, body { overflow-x: hidden; } body { background: var(--alm-sand); } .elementor-widget:not(:last-child) { margin-block-end: 0; } body.elementor-page [id^="alm-home-"], body.elementor-page [id^="alm-home-"] *, body.elementor-page [id^="alm-home-"] *::before, body.elementor-page [id^="alm-home-"] *::after { box-sizing: border-box; } /* Elementor variable reset */ body.elementor-page [id^="alm-home-"], body.elementor-page .alm-v6-clean, body.elementor-page .alm-card, body.elementor-page .alm-cta-card { --width: 100% !important; --min-height: initial !important; --flex-basis: auto !important; --flex-grow: 0 !important; --flex-shrink: 1 !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; min-width: 0 !important; } /* ========================================================= Shortcode/page-wrapper breakout ========================================================= */ body:has(#alm-home-hero) .site-main, body:has(#alm-home-hero) main, body:has(#alm-home-hero) article, body:has(#alm-home-hero) .page-content, body:has(#alm-home-hero) .entry-content, body:has(#alm-home-hero) .elementor-shortcode, body:has(#alm-home-hero) .elementor-widget-shortcode, body:has(#alm-home-hero) .elementor-widget-shortcode .elementor-widget-container { width: 100% !important; max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; overflow: visible !important; } body.elementor-page .elementor-2130, body.elementor-page .elementor-2134, body:has(#alm-home-hero) .entry-content > .elementor, body:has(#alm-home-hero) .page-content > .elementor, body:has(#alm-home-hero) .elementor-shortcode > .elementor { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; } /* ========================================================= Page sections ========================================================= */ #alm-home-hero, #alm-home-trust, #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { position: relative; width: 100% !important; max-width: none !important; overflow: hidden; padding-left: clamp(28px, 5vw, 72px) !important; padding-right: clamp(28px, 5vw, 72px) !important; } #alm-home-hero > .e-con-inner, #alm-home-trust > .e-con-inner, #alm-home-shift > .e-con-inner, #alm-home-partners > .e-con-inner, #alm-home-destinations > .e-con-inner, #alm-home-how > .e-con-inner, #alm-home-experience > .e-con-inner, #alm-home-platform > .e-con-inner, #alm-home-final-cta > .e-con-inner { width: 100% !important; max-width: min(var(--alm-max), calc(100vw - 96px)) !important; margin-left: auto !important; margin-right: auto !important; } #alm-home-partners > .e-con-inner, #alm-home-destinations > .e-con-inner, #alm-home-platform > .e-con-inner { max-width: min(1500px, calc(100vw - 96px)) !important; } #alm-home-destinations > .e-con-inner { max-width: min(1560px, calc(100vw - 80px)) !important; } #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { padding-top: clamp(84px, 8vw, 132px) !important; padding-bottom: clamp(84px, 8vw, 132px) !important; } #alm-home-partners, #alm-home-platform { background: rgba(251, 248, 241, 0.72) !important; } #alm-home-destinations { background: radial-gradient(circle at 88% 12%, rgba(56, 198, 217, 0.18), transparent 30%), linear-gradient(180deg, rgba(9, 43, 61, 0.035), rgba(56, 198, 217, 0.06)) !important; } /* ========================================================= Typography ========================================================= */ .alm-kicker, .alm-eyebrow, .alm-card__eyebrow, .alm-card__eyebrow p, #alm-home-hero .elementor-widget-text-editor:first-child, #alm-home-shift-copy .elementor-widget-text-editor:first-child, #alm-home-partners > .e-con-inner > .elementor-widget-text-editor:first-child, #alm-home-destinations > .e-con-inner > .elementor-widget-text-editor:first-child, #alm-home-how > .e-con-inner > .elementor-widget-text-editor:first-child, #alm-home-experience-copy .elementor-widget-text-editor:first-child, #alm-home-platform > .e-con-inner > .elementor-widget-text-editor:first-child { margin: 0 0 18px !important; color: var(--alm-muted) !important; font-size: 0.78rem !important; font-weight: 800 !important; letter-spacing: 0.16em !important; line-height: 1.3 !important; text-transform: uppercase !important; } #alm-home-hero h1, #alm-home-shift h2, #alm-home-partners h2, #alm-home-destinations h2, #alm-home-how h2, #alm-home-experience h2, #alm-home-platform h2, #alm-home-final-cta h2 { color: var(--alm-navy) !important; letter-spacing: -0.035em !important; line-height: 1.02 !important; margin: 0 !important; text-wrap: balance; } #alm-home-hero h1 { max-width: 640px; font-size: clamp(3.8rem, 6.2vw, 6.8rem) !important; } #alm-home-shift h2, #alm-home-partners h2, #alm-home-destinations h2, #alm-home-how h2, #alm-home-experience h2, #alm-home-platform h2, #alm-home-final-cta h2 { max-width: 900px; font-size: clamp(2.65rem, 4.8vw, 5.3rem) !important; } #alm-home-hero p, #alm-home-shift p, #alm-home-partners p, #alm-home-destinations p, #alm-home-how p, #alm-home-experience p, #alm-home-platform p, #alm-home-final-cta p { color: var(--alm-muted) !important; font-size: clamp(1rem, 1.1vw, 1.14rem) !important; line-height: 1.72 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } #alm-home-hero-copy, #alm-home-shift-copy, #alm-home-experience-copy, #alm-home-partners-copy, #alm-home-destinations-copy, #alm-home-how-copy, #alm-home-platform-copy, .alm-copy-column { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 0 !important; min-width: 0 !important; } /* ========================================================= Buttons ========================================================= */ #alm-home-hero-cta-row, #alm-home-partner-cta-row, #alm-home-experience-cta-row { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 14px !important; width: auto !important; margin-top: 30px !important; } .alm-button, .alm-button .elementor-widget-container, .alm-button .elementor-button-wrapper { width: auto !important; max-width: 100% !important; } .alm-button .elementor-button { min-height: 54px !important; padding: 0 24px !important; border-radius: 999px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; font-size: 0.98rem !important; font-weight: 700 !important; box-shadow: var(--alm-shadow-soft) !important; text-decoration: none !important; white-space: nowrap !important; transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, color 180ms ease !important; } .alm-button .elementor-button:hover { transform: translateY(-3px) !important; box-shadow: 0 22px 44px rgba(9, 43, 61, 0.18) !important; } .alm-button--primary .elementor-button { background: var(--alm-navy) !important; color: var(--alm-white) !important; } .alm-button--primary .elementor-button:hover { background: var(--alm-blue) !important; } .alm-button--secondary .elementor-button { background: rgba(255, 255, 255, 0.82) !important; color: var(--alm-navy) !important; border: 1px solid var(--alm-line) !important; } /* ========================================================= Hero / Trust / Split media ========================================================= */ #alm-home-hero > .e-con-inner, #alm-home-shift > .e-con-inner, #alm-home-experience-split > .e-con-inner { display: grid !important; grid-template-columns: minmax(0, 1.03fr) minmax(320px, 0.97fr) !important; gap: clamp(44px, 5vw, 84px) !important; align-items: center !important; } #alm-home-trust { margin-top: 24px !important; padding-top: 0 !important; padding-bottom: 0 !important; } #alm-home-trust > .e-con-inner { max-width: calc(var(--alm-max) - 140px) !important; background: rgba(255, 255, 255, 0.82) !important; border: 1px solid var(--alm-line) !important; border-radius: 999px !important; padding: 18px 28px !important; box-shadow: var(--alm-shadow-soft) !important; text-align: center !important; } #alm-home-trust p { margin: 0 !important; color: var(--alm-navy) !important; font-size: 1rem !important; font-weight: 700 !important; line-height: 1.5 !important; } #alm-home-hero-media, #alm-home-experience-media { min-height: clamp(420px, 42vw, 560px) !important; border-radius: 34px !important; border: 1px dashed rgba(56, 198, 217, 0.6) !important; background: radial-gradient(circle at 18% 20%, rgba(56, 198, 217, 0.18), transparent 35%), linear-gradient(180deg, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0.3)) !important; padding: 28px !important; box-shadow: var(--alm-shadow-soft) !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; } /* ========================================================= Grids ========================================================= */ #alm-home-glide-explore-dive-grid, #alm-home-partner-card-grid, #alm-home-destination-card-grid, #alm-home-step-card-grid, #alm-home-how-card-grid, #alm-home-platform-card-grid { width: 100% !important; max-width: 100% !important; } #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-glide-explore-dive-grid:not(.e-con-boxed), #alm-home-partner-card-grid > .e-con-inner, #alm-home-partner-card-grid:not(.e-con-boxed), #alm-home-destination-card-grid > .e-con-inner, #alm-home-destination-card-grid:not(.e-con-boxed), #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner, #alm-home-step-card-grid:not(.e-con-boxed), #alm-home-how-card-grid:not(.e-con-boxed), #alm-home-platform-card-grid:not(.e-con-boxed) { width: 100% !important; display: grid !important; align-items: stretch !important; } #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-glide-explore-dive-grid:not(.e-con-boxed) { grid-template-columns: repeat(3, minmax(220px, 1fr)) !important; gap: 28px !important; } #alm-home-partner-card-grid > .e-con-inner, #alm-home-partner-card-grid:not(.e-con-boxed) { grid-template-columns: repeat(4, minmax(220px, 1fr)) !important; gap: 28px !important; } #alm-home-destination-card-grid > .e-con-inner, #alm-home-destination-card-grid:not(.e-con-boxed) { grid-template-columns: repeat(5, minmax(210px, 1fr)) !important; gap: 30px !important; } #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner, #alm-home-step-card-grid:not(.e-con-boxed), #alm-home-how-card-grid:not(.e-con-boxed), #alm-home-platform-card-grid:not(.e-con-boxed) { grid-template-columns: repeat(3, minmax(260px, 1fr)) !important; gap: 28px !important; } #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element, #alm-home-partner-card-grid > .e-con-inner > .elementor-element, #alm-home-destination-card-grid > .e-con-inner > .elementor-element, #alm-home-step-card-grid > .e-con-inner > .elementor-element, #alm-home-how-card-grid > .e-con-inner > .elementor-element, #alm-home-platform-card-grid > .e-con-inner > .elementor-element { width: 100% !important; max-width: 100% !important; min-width: 0 !important; justify-self: stretch !important; align-self: stretch !important; } /* ========================================================= Cards / Hover ========================================================= */ .alm-card, .alm-cta-card, #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element, #alm-home-destination-card-grid > .e-con-inner > .elementor-element, #alm-home-step-card-grid > .e-con-inner > .elementor-element, #alm-home-how-card-grid > .e-con-inner > .elementor-element, #alm-home-platform-card-grid > .e-con-inner > .elementor-element, #alm-home-partner-card-grid .elementor-widget-icon-box { position: relative !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; background: rgba(255, 255, 255, 0.84) !important; border: 1px solid var(--alm-line) !important; border-top: 4px solid rgba(56, 198, 217, 0.85) !important; border-radius: 22px !important; box-shadow: 0 10px 24px rgba(9, 43, 61, 0.07) !important; overflow: hidden !important; transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease, background-color 220ms ease !important; will-change: transform; } .alm-card:hover, .alm-cta-card:hover, #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element:hover, #alm-home-destination-card-grid > .e-con-inner > .elementor-element:hover, #alm-home-step-card-grid > .e-con-inner > .elementor-element:hover, #alm-home-how-card-grid > .e-con-inner > .elementor-element:hover, #alm-home-platform-card-grid > .e-con-inner > .elementor-element:hover, #alm-home-partner-card-grid .elementor-widget-icon-box:hover { transform: translateY(-7px) scale(1.012) !important; box-shadow: 0 26px 62px rgba(9, 43, 61, 0.14) !important; border-color: rgba(56, 198, 217, 0.58) !important; background: rgba(255, 255, 255, 0.94) !important; } .alm-card, #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element, #alm-home-step-card-grid > .e-con-inner > .elementor-element, #alm-home-how-card-grid > .e-con-inner > .elementor-element, #alm-home-platform-card-grid > .e-con-inner > .elementor-element { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; padding: 32px 28px !important; text-align: left !important; } #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; padding: 34px 30px !important; min-height: 390px !important; text-align: left !important; } #alm-home-partner-card-grid .elementor-widget-icon-box, #alm-home-partner-card-grid .elementor-widget-container, #alm-home-partner-card-grid .elementor-icon-box-wrapper, #alm-home-partner-card-grid .elementor-icon-box-content, #alm-home-partner-card-grid .elementor-icon-box-description { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } #alm-home-partner-card-grid .elementor-widget-icon-box, #alm-home-partner-card-grid .elementor-widget-container { height: 100% !important; } #alm-home-partner-card-grid .elementor-icon-box-wrapper { height: 100% !important; padding: 32px 28px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; text-align: center !important; } #alm-home-partner-card-grid .elementor-icon-box-icon { margin-bottom: 16px !important; } #alm-home-partner-card-grid .elementor-icon-box-title, #alm-home-partner-card-grid .elementor-icon-box-title span, #alm-home-partner-card-grid .elementor-icon-box-title a, .alm-card__title, .alm-card__title h3, .alm-card__title h4 { margin: 0 0 14px !important; color: var(--alm-navy) !important; font-size: clamp(1.16rem, 1.35vw, 1.48rem) !important; line-height: 1.24 !important; letter-spacing: -0.01em !important; word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; } #alm-home-partner-card-grid .elementor-icon-box-description, .alm-card__text, .alm-card__text p { color: var(--alm-muted) !important; font-size: clamp(0.98rem, 0.95vw, 1.08rem) !important; line-height: 1.62 !important; word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; } #alm-home-destination-card-grid .alm-card__eyebrow, #alm-home-destination-card-grid .alm-card__eyebrow *, #alm-home-destination-card-grid .alm-card__eyebrow p, #alm-home-destination-card-grid .alm-card__eyebrow strong, #alm-home-destination-card-grid .alm-card__eyebrow b { display: block !important; width: 100% !important; min-height: 44px !important; margin: 0 0 30px !important; color: var(--alm-muted) !important; font-size: 0.66rem !important; font-weight: 800 !important; letter-spacing: 0.115em !important; line-height: 1.34 !important; text-transform: uppercase !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } #alm-home-destination-card-grid .alm-card__eyebrow strong, #alm-home-destination-card-grid .alm-card__eyebrow b { font-size: inherit !important; letter-spacing: inherit !important; line-height: inherit !important; } #alm-home-destination-card-grid .alm-card__title, #alm-home-destination-card-grid .alm-card__title h3, #alm-home-destination-card-grid .alm-card__title h4 { font-size: clamp(1.1rem, 1.05vw, 1.34rem) !important; line-height: 1.24 !important; margin-bottom: 18px !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } #alm-home-destination-card-grid .alm-card__text, #alm-home-destination-card-grid .alm-card__text p, #alm-home-destination-card-grid .alm-card__text strong { font-size: clamp(0.95rem, 0.88vw, 1.04rem) !important; line-height: 1.54 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; color: var(--alm-muted) !important; } /* ========================================================= Final CTA ========================================================= */ #alm-home-final-cta > .e-con-inner { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 24px !important; } .alm-cta-card, #alm-home-final-partner-cta, #alm-home-final-guest-cta { min-height: 300px !important; padding: clamp(34px, 4vw, 54px) !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: space-between !important; } #alm-home-final-partner-cta { background: var(--alm-navy) !important; } #alm-home-final-partner-cta h2, #alm-home-final-partner-cta p { color: var(--alm-white) !important; } /* ========================================================= Tablet ========================================================= */ @media (max-width: 1320px) { #alm-home-destination-card-grid > .e-con-inner, #alm-home-destination-card-grid:not(.e-con-boxed) { grid-template-columns: repeat(3, minmax(240px, 1fr)) !important; } } @media (max-width: 1180px) { #alm-home-shift > .e-con-inner, #alm-home-experience-split > .e-con-inner { grid-template-columns: 1fr !important; gap: 44px !important; } #alm-home-partner-card-grid > .e-con-inner, #alm-home-partner-card-grid:not(.e-con-boxed) { grid-template-columns: repeat(2, minmax(260px, 1fr)) !important; } #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-glide-explore-dive-grid:not(.e-con-boxed), #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(260px, 1fr)) !important; } } /* ========================================================= Responsive layout hardening Applies below 980px because Elementor preview / shortcode wrappers can keep imported desktop constraints active in mobile emulation. ========================================================= */ @media (max-width: 980px) { body:has(#alm-home-hero) .site-main, body:has(#alm-home-hero) main, body:has(#alm-home-hero) article, body:has(#alm-home-hero) .page-content, body:has(#alm-home-hero) .entry-content, body:has(#alm-home-hero) .elementor-shortcode, body:has(#alm-home-hero) .elementor-widget-shortcode, body:has(#alm-home-hero) .elementor-widget-shortcode .elementor-widget-container, body:has(#alm-home-hero) .elementor-2130, body:has(#alm-home-hero) .elementor-2134 { width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding-left: 0 !important; padding-right: 0 !important; overflow-x: hidden !important; } #alm-home-hero, #alm-home-trust, #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { width: 100% !important; max-width: 100% !important; padding-left: 22px !important; padding-right: 22px !important; } #alm-home-hero > .e-con-inner, #alm-home-trust > .e-con-inner, #alm-home-shift > .e-con-inner, #alm-home-partners > .e-con-inner, #alm-home-destinations > .e-con-inner, #alm-home-how > .e-con-inner, #alm-home-experience > .e-con-inner, #alm-home-platform > .e-con-inner, #alm-home-final-cta > .e-con-inner, #alm-home-experience-split > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; gap: 30px !important; } body.elementor-page .alm-section, body.elementor-page .alm-split, body.elementor-page .alm-split-layout, body.elementor-page [id^="alm-home-"].e-con, body.elementor-page .alm-card-grid, body.elementor-page .alm-card-grid > .e-con-inner, body.elementor-page .alm-grid, body.elementor-page .alm-grid > .e-con-inner, #alm-home-glide-explore-dive-grid, #alm-home-partner-card-grid, #alm-home-destination-card-grid, #alm-home-step-card-grid, #alm-home-how-card-grid, #alm-home-platform-card-grid, #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-partner-card-grid > .e-con-inner, #alm-home-destination-card-grid > .e-con-inner, #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; gap: 18px !important; } body.elementor-page .alm-copy-column, body.elementor-page .alm-copy-column > .e-con-inner, body.elementor-page #alm-home-hero-copy, body.elementor-page #alm-home-shift-copy, body.elementor-page #alm-home-experience-copy { display: flex !important; flex-direction: column !important; align-items: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; align-self: stretch !important; } body.elementor-page #alm-home-hero-copy > .elementor-element, body.elementor-page #alm-home-shift-copy > .elementor-element, body.elementor-page #alm-home-experience-copy > .elementor-element, body.elementor-page .alm-copy-column > .elementor-element, body.elementor-page .alm-copy-column > .e-con-inner > .elementor-element, body.elementor-page .alm-card-grid > .elementor-element, body.elementor-page .alm-card-grid > .e-con-inner > .elementor-element, body.elementor-page .alm-grid > .elementor-element, body.elementor-page .alm-grid > .e-con-inner > .elementor-element, body.elementor-page .alm-card, body.elementor-page .alm-card > .e-con-inner, body.elementor-page .alm-cta-card, body.elementor-page .alm-cta-card > .e-con-inner, body.elementor-page #alm-home-partner-card-grid .elementor-widget-icon-box, body.elementor-page #alm-home-partner-card-grid .elementor-widget-container, body.elementor-page #alm-home-partner-card-grid .elementor-icon-box-wrapper, body.elementor-page #alm-home-partner-card-grid .elementor-icon-box-content, body.elementor-page #alm-home-partner-card-grid .elementor-icon-box-description { width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; align-self: stretch !important; justify-self: stretch !important; } body.elementor-page .alm-card, body.elementor-page .alm-cta-card, body.elementor-page #alm-home-partner-card-grid .elementor-widget-icon-box { padding: 26px 24px !important; min-height: auto !important; } body.elementor-page #alm-home-partner-card-grid .elementor-icon-box-wrapper { padding: 26px 24px !important; } body.elementor-page [id^="alm-home-"] .elementor-widget-button, body.elementor-page [id^="alm-home-"] .elementor-widget-button .elementor-widget-container, body.elementor-page [id^="alm-home-"] .elementor-button-wrapper, body.elementor-page [id^="alm-home-"] .elementor-button, body.elementor-page .alm-button, body.elementor-page .alm-button .elementor-widget-container, body.elementor-page .alm-button .elementor-button-wrapper, body.elementor-page .alm-button .elementor-button { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } body.elementor-page [id^="alm-home-"] .elementor-button, body.elementor-page .alm-button .elementor-button { display: flex !important; min-height: 54px !important; height: auto !important; border-radius: 999px !important; padding: 15px 18px !important; justify-content: center !important; align-items: center !important; white-space: normal !important; text-align: center !important; line-height: 1.15 !important; } #alm-home-hero-cta-row, #alm-home-hero-cta-row > .e-con-inner, #alm-home-partner-cta-row, #alm-home-partner-cta-row > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; overflow: visible !important; } #alm-home-hero-cta-row { margin-top: 24px !important; margin-block-start: 24px !important; } #alm-home-hero-cta-row .elementor-widget-button, #alm-home-partner-cta-row .elementor-widget-button { width: min(100%, 280px) !important; max-width: 280px !important; min-width: 220px !important; flex: 0 0 auto !important; align-self: center !important; } #alm-home-hero-cta-row .elementor-widget-container, #alm-home-hero-cta-row .elementor-button-wrapper, #alm-home-partner-cta-row .elementor-widget-container, #alm-home-partner-cta-row .elementor-button-wrapper { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } #alm-home-hero-cta-row a.elementor-button, #alm-home-partner-cta-row a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0.55rem !important; width: 100% !important; max-width: 280px !important; min-width: 220px !important; min-height: 54px !important; height: auto !important; aspect-ratio: auto !important; border-radius: 999px !important; padding: 15px 22px !important; white-space: normal !important; text-align: center !important; line-height: 1.15 !important; } #alm-home-hero-cta-row .elementor-button-content-wrapper, #alm-home-partner-cta-row .elementor-button-content-wrapper { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0.55rem !important; width: 100% !important; max-width: 100% !important; text-align: center !important; } #alm-home-hero-cta-row .elementor-button-text, #alm-home-partner-cta-row .elementor-button-text { display: block !important; width: auto !important; max-width: 100% !important; margin: 0 !important; text-align: center !important; white-space: normal !important; line-height: 1.15 !important; } #alm-home-hero-cta-row .elementor-button-icon, #alm-home-partner-cta-row .elementor-button-icon { display: inline-flex !important; flex: 0 0 auto !important; align-items: center !important; justify-content: center !important; } } /* ========================================================= Mobile spacing polish Scope: mobile only, spacing only, no structure changes ========================================================= */ @media (max-width: 767px) { #alm-home-hero, #alm-home-trust, #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { padding-left: 22px !important; padding-right: 22px !important; } #alm-home-trust { margin-top: 0 !important; padding-top: 34px !important; padding-bottom: 54px !important; } #alm-home-trust > .e-con-inner { max-width: 100% !important; padding: 18px !important; border-radius: 24px !important; } #alm-home-trust .elementor-widget-text-editor, #alm-home-trust .elementor-widget-container { margin-bottom: 0 !important; } #alm-home-shift { padding-top: 58px !important; padding-bottom: 76px !important; } #alm-home-glide-explore-dive-grid { margin-top: 0 !important; } #alm-home-glide-explore-dive-grid .alm-card { margin-bottom: 0 !important; } #alm-home-partners { padding-top: 74px !important; padding-bottom: 72px !important; } #alm-home-partner-card-grid { margin-top: 34px !important; } #alm-home-partner-cta-row { margin-top: 14px !important; margin-bottom: 0 !important; } #alm-home-destinations { padding-top: 76px !important; padding-bottom: 58px !important; } #alm-home-destination-card-grid { margin-top: 40px !important; } #alm-home-how { padding-top: 58px !important; padding-bottom: 78px !important; } #alm-home-step-card-grid, #alm-home-how-card-grid { margin-top: 36px !important; } #alm-home-experience { padding-top: 0 !important; padding-bottom: 82px !important; } #alm-home-experience-split { gap: 42px !important; } #alm-home-experience-media { min-height: 320px !important; padding: 22px !important; border-radius: 26px !important; margin-bottom: 10px !important; } #alm-home-experience-copy { margin-top: 0 !important; } #alm-home-experience-cta-row { margin-top: 28px !important; } #alm-home-platform { padding-top: 58px !important; padding-bottom: 78px !important; } #alm-home-platform-card-grid { margin-top: 38px !important; } #alm-home-final-cta { padding-top: 58px !important; padding-bottom: 74px !important; } #alm-home-final-cta > .e-con-inner { display: flex !important; flex-direction: column !important; } #alm-home-final-cta .alm-cta-card { margin-bottom: 22px !important; } #alm-home-final-cta .alm-cta-card:last-child { margin-bottom: 0 !important; } #alm-home-hero h1, #alm-home-shift h2, #alm-home-partners h2, #alm-home-destinations h2, #alm-home-how h2, #alm-home-experience h2, #alm-home-platform h2, #alm-home-final-cta h2 { max-width: 100% !important; font-size: clamp(2.35rem, 10.6vw, 3.45rem) !important; line-height: 1.04 !important; } #alm-home-hero p, #alm-home-shift p, #alm-home-partners p, #alm-home-destinations p, #alm-home-how p, #alm-home-experience p, #alm-home-platform p, #alm-home-final-cta p, .alm-card__text p, #alm-home-partner-card-grid .elementor-icon-box-description { max-width: 100% !important; font-size: 1rem !important; line-height: 1.65 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } #alm-home-hero-media, #alm-home-experience-media { min-height: 320px !important; padding: 22px !important; border-radius: 26px !important; } #alm-home-destination-card-grid .alm-card { padding: 28px 24px !important; } #alm-home-destination-card-grid .alm-card__eyebrow, #alm-home-destination-card-grid .alm-card__eyebrow p { min-height: 0 !important; margin-bottom: 18px !important; font-size: 0.72rem !important; line-height: 1.34 !important; } #alm-home-destination-card-grid .alm-card__title, #alm-home-destination-card-grid .alm-card__title h3, #alm-home-destination-card-grid .alm-card__title h4, #alm-home-partner-card-grid .elementor-icon-box-title, #alm-home-partner-card-grid .elementor-icon-box-title span, #alm-home-partner-card-grid .elementor-icon-box-title a, #alm-home-glide-explore-dive-grid .alm-card__title, #alm-home-step-card-grid .alm-card__title, #alm-home-platform-card-grid .alm-card__title { font-size: 1.42rem !important; line-height: 1.22 !important; } #alm-home-final-partner-cta, #alm-home-final-guest-cta { min-height: auto !important; } } /* ========================================================= ALMARA HOME DESTINATIONS + DARK CTA POLISH v1.4.6 Scope: Home only; additive CSS; no loader/PHP/JS changes Purpose: strategic destination rollout cards + robust central dark CTA behavior Rollback: remove this complete block and re-import previous Home JSONs Notes: - CTA selectors intentionally do NOT depend only on .alm-cta-card--dark. - This keeps the hover working even if Elementor cache temporarily serves the old class list. ========================================================= */ #alm-home-destinations .alm-section__lead, #alm-home-destinations .alm-section__lead p { max-width: 980px !important; } #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element { min-height: 410px !important; } #alm-home-destination-card-grid .alm-card::before, #alm-home-destination-card-grid > .e-con-inner > .elementor-element::before { content: ""; position: absolute !important; top: 24px !important; right: 24px !important; width: 34px !important; height: 2px !important; border-radius: 999px !important; background: rgba(56, 198, 217, 0.78) !important; opacity: 0.82 !important; transition: width 200ms ease, opacity 200ms ease, background-color 200ms ease !important; pointer-events: none !important; } #alm-home-destination-card-grid .alm-card:hover::before, #alm-home-destination-card-grid > .e-con-inner > .elementor-element:hover::before { width: 46px !important; opacity: 1 !important; background: var(--alm-aqua) !important; } #alm-home-destination-card-grid .alm-card__eyebrow, #alm-home-destination-card-grid .alm-card__eyebrow *, #alm-home-destination-card-grid .alm-card__eyebrow p { min-height: 38px !important; margin-bottom: 24px !important; color: rgba(9, 43, 61, 0.66) !important; font-size: 0.64rem !important; letter-spacing: 0.13em !important; } #alm-home-destination-card-grid .alm-card__title, #alm-home-destination-card-grid .alm-card__title h3, #alm-home-destination-card-grid .alm-card__title h4 { max-width: 96% !important; font-size: clamp(1.13rem, 1.05vw, 1.34rem) !important; line-height: 1.22 !important; } #alm-home-destination-card-grid .alm-card__text, #alm-home-destination-card-grid .alm-card__text p { font-size: clamp(0.94rem, 0.86vw, 1.02rem) !important; line-height: 1.58 !important; } /* Home final CTA: robust dark-card button polish */ body #alm-home-final-cta #alm-home-final-partner-cta, body #alm-home-final-cta #alm-home-final-partner-cta.alm-cta-card--dark, body #alm-home-final-cta .alm-final-partner-cta { background: var(--alm-navy) !important; color: #ffffff !important; } body #alm-home-final-cta #alm-home-final-partner-cta .alm-cta-card__title, body #alm-home-final-cta #alm-home-final-partner-cta .alm-cta-card__title *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-cta-card__text, body #alm-home-final-cta #alm-home-final-partner-cta .alm-cta-card__text *, body #alm-home-final-cta #alm-home-final-partner-cta h2, body #alm-home-final-cta #alm-home-final-partner-cta p { color: #ffffff !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-widget-button, body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button-wrapper { width: fit-content !important; max-width: 100% !important; } body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-height: 42px !important; padding: 0.82rem 1.18rem !important; border-radius: 999px !important; background: #ffffff !important; background-color: #ffffff !important; color: var(--alm-navy) !important; border: 1px solid rgba(255, 255, 255, 0.92) !important; box-shadow: 0 18px 42px rgba(0, 0, 0, 0.18) !important; transform: translateY(0) !important; transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease !important; } body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button *, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button * { color: var(--alm-navy) !important; fill: var(--alm-navy) !important; } body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button:hover, body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button:focus-visible, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button:hover, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button:focus-visible, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button:hover, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button:focus-visible, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button:hover, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button:focus-visible { background: var(--alm-aqua) !important; background-color: var(--alm-aqua) !important; border-color: var(--alm-aqua) !important; color: var(--alm-navy) !important; box-shadow: 0 24px 54px rgba(56, 198, 217, 0.26) !important; transform: translateY(-1px) !important; } body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button:hover *, body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button:focus-visible *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button:hover *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button:focus-visible *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button:hover *, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button:focus-visible *, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button:hover *, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button:focus-visible * { color: var(--alm-navy) !important; fill: var(--alm-navy) !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-icon { display: none !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-content-wrapper { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-text { display: inline-flex !important; align-items: center !important; color: var(--alm-navy) !important; white-space: nowrap !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-text::after { content: "→"; display: inline-block !important; margin-left: 0.42em !important; color: var(--alm-navy) !important; transform: translateX(0) !important; transition: transform 180ms ease !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button:hover .elementor-button-text::after, body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button:focus-visible .elementor-button-text::after { transform: translateX(3px) !important; } @media (max-width: 1320px) { #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element { min-height: 360px !important; } } @media (max-width: 767px) { #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element { min-height: auto !important; } #alm-home-destination-card-grid .alm-card::before, #alm-home-destination-card-grid > .e-con-inner > .elementor-element::before { top: 22px !important; right: 22px !important; width: 28px !important; } #alm-home-destination-card-grid .alm-card__eyebrow, #alm-home-destination-card-grid .alm-card__eyebrow *, #alm-home-destination-card-grid .alm-card__eyebrow p { min-height: 0 !important; margin-bottom: 18px !important; font-size: 0.7rem !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-widget-button, body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button-wrapper, body #alm-home-final-cta #alm-home-final-partner-cta a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--primary a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta .alm-button--dark-card a.elementor-button, body #alm-home-final-cta #alm-home-final-partner-cta-button a.elementor-button { width: 100% !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-text { white-space: normal !important; text-align: center !important; } } /* ========================================================= ALMARA HOME v1.4.8 — CENTRAL DARK CTA MICRO-INTERACTION Scope: Home final partner CTA only Intent: match central ALMARA dark CTA pattern - Initial: white button, navy text, no visible arrow - Hover/focus: aqua fill, navy CSS-only arrow appears and moves subtly - Elementor icons are suppressed to prevent double-arrow states ========================================================= */ body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-icon, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button .elementor-button-icon { display: none !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-content-wrapper, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button .elementor-button-content-wrapper { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-text, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button .elementor-button-text { display: inline-flex !important; align-items: center !important; color: var(--alm-navy) !important; white-space: nowrap !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button .elementor-button-text::after, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button .elementor-button-text::after { content: "→" !important; display: inline-block !important; width: 0 !important; max-width: 0 !important; margin-left: 0 !important; opacity: 0 !important; overflow: hidden !important; color: var(--alm-navy) !important; transform: translateX(-2px) !important; transition: width 180ms ease, max-width 180ms ease, margin-left 180ms ease, opacity 160ms ease, transform 180ms ease !important; } body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button:hover .elementor-button-text::after, body #alm-home-final-cta #alm-home-final-partner-cta .elementor-button:focus-visible .elementor-button-text::after, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button:hover .elementor-button-text::after, body #alm-home-final-cta #alm-home-final-partner-cta-button .elementor-button:focus-visible .elementor-button-text::after { width: 1em !important; max-width: 1em !important; margin-left: 0.42em !important; opacity: 1 !important; transform: translateX(2px) !important; } /* ========================================================= ALMARA Header v2 Dark — Color & Logo Contrast Fix v1.0 Scope: Elementor Theme Builder Header Intent: #042034 header, light logo, off-white nav, aqua active/hover, aqua CTA ========================================================= */ :root{ --almara-header-bg:#042034; --almara-header-ink:#F2F4F5; --almara-header-ink-muted:rgba(242,244,245,.82); --almara-header-aqua:#42919D; --almara-header-aqua-soft:rgba(66,145,157,.22); --almara-header-aqua-hover:#216B7E; --almara-header-line:rgba(242,244,245,.10); } /* Full-width dark header base */ html body .elementor-location-header{ position:relative!important; z-index:50!important; width:100%!important; background:var(--almara-header-bg)!important; color:var(--almara-header-ink)!important; border-bottom:1px solid var(--almara-header-line)!important; box-shadow:0 14px 38px rgba(4,32,52,.18)!important; } html body .elementor-location-header::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:linear-gradient(90deg, transparent 0%, rgba(66,145,157,.42) 18%, rgba(242,244,245,.12) 50%, rgba(66,145,157,.42) 82%, transparent 100%); pointer-events:none; } /* Header container */ html body .elementor-location-header .almara-header-v2, html body .elementor-location-header .e-con.almara-header-v2, html body .elementor-location-header .elementor-element.almara-header-v2{ width:100%!important; max-width:none!important; margin:0!important; padding:16px clamp(18px,3.4vw,42px)!important; background:var(--almara-header-bg)!important; color:var(--almara-header-ink)!important; overflow:visible!important; } html body .elementor-location-header .almara-header-v2 > .e-con-inner{ width:100%!important; max-width:1240px!important; margin:0 auto!important; padding:0!important; display:grid!important; grid-template-columns:auto minmax(0,1fr) auto!important; gap:clamp(22px,3vw,42px)!important; align-items:center!important; } /* Logo: use the cropped/optimized ALMARA_Logo_hell_frei.webp in the media library */ html body .elementor-location-header .almara-header-logo, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo, html body .elementor-location-header .elementor-widget-image.almara-header-logo{ justify-self:start!important; width:auto!important; max-width:292px!important; min-width:0!important; margin:0!important; opacity:1!important; overflow:visible!important; } html body .elementor-location-header .almara-header-logo a, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo a, html body .elementor-location-header .elementor-widget-image.almara-header-logo a{ display:inline-flex!important; align-items:center!important; justify-content:flex-start!important; width:auto!important; max-width:292px!important; min-height:58px!important; overflow:visible!important; line-height:0!important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img{ display:block!important; width:auto!important; max-width:292px!important; height:auto!important; max-height:62px!important; object-fit:contain!important; opacity:1!important; mix-blend-mode:normal!important; filter:drop-shadow(0 1px 8px rgba(242,244,245,.10)) drop-shadow(0 10px 22px rgba(0,0,0,.24))!important; transform:none!important; } /* Fallback for uncropped transparent logo uploads: keep the asset visually bounded */ html body .elementor-location-header .almara-header-logo--uncropped img{ max-width:360px!important; transform:scale(1.18)!important; transform-origin:left center!important; } /* Navigation layout */ html body .elementor-location-header .almara-header-nav{ justify-self:end!important; width:auto!important; max-width:100%!important; margin:0!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu{ display:flex!important; align-items:center!important; justify-content:flex-end!important; gap:clamp(18px,2.1vw,30px)!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main a.elementor-item, html body .elementor-location-header .elementor-nav-menu--main .elementor-item{ position:relative!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; padding:13px 0 14px!important; font-family:"Inter", Arial, sans-serif!important; font-size:14px!important; font-weight:650!important; line-height:1!important; letter-spacing:.01em!important; color:var(--almara-header-ink-muted)!important; background:transparent!important; text-decoration:none!important; border:0!important; box-shadow:none!important; transition:color .18s ease, opacity .18s ease, transform .18s ease!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item::after, html body .elementor-location-header .elementor-nav-menu--main .elementor-item::after{ content:""!important; position:absolute!important; background:none!important; background-image:none!important; border:0!important; box-shadow:none!important; opacity:0!important; pointer-events:none!important; transition:none!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:hover, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:focus, html body .elementor-location-header .elementor-nav-menu--main .elementor-item:hover, html body .elementor-location-header .elementor-nav-menu--main .elementor-item:focus{ color:#FFFFFF!important; background:transparent!important; transform:translateY(-1px)!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:hover::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:focus::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item::after, html body .elementor-location-header .elementor-nav-menu--main .elementor-item:hover::after, html body .elementor-location-header .elementor-nav-menu--main .elementor-item:focus::after, html body .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active::after, html body .elementor-location-header .elementor-nav-menu--main .current-menu-item > .elementor-item::after, html body .elementor-location-header .elementor-nav-menu--main .current_page_item > .elementor-item::after{ background:none!important; background-image:none!important; opacity:0!important; transform:none!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item{ color:#FFFFFF!important; font-weight:750!important; } /* While hovering another main menu item, do not visually double-mark the active item */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .elementor-item.elementor-item-active:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-item > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_item > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-ancestor > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_ancestor > .elementor-item:not(:hover){ color:var(--almara-header-ink-muted)!important; font-weight:650!important; transform:none!important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .elementor-item.elementor-item-active:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-ancestor > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_ancestor > .elementor-item:not(:hover)::after{ opacity:0!important; background:none!important; background-image:none!important; } /* Header CTA */ html body .elementor-location-header .almara-header-cta{ justify-self:end!important; width:auto!important; margin:0!important; } html body .elementor-location-header .almara-header-cta a.elementor-button, html body .elementor-location-header .almara-header-cta .elementor-button, html body .elementor-location-header .elementor-widget-button.almara-header-cta a.elementor-button{ display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:44px!important; padding:13px 20px!important; border-radius:999px!important; border:1px solid rgba(242,244,245,.16)!important; background:var(--almara-header-aqua)!important; color:#FFFFFF!important; font-family:"Inter", Arial, sans-serif!important; font-size:13px!important; font-weight:800!important; letter-spacing:.01em!important; line-height:1!important; text-decoration:none!important; white-space:nowrap!important; box-shadow:0 14px 28px rgba(0,0,0,.18), 0 0 0 1px rgba(66,145,157,.18)!important; transition:transform .2s ease, background-color .2s ease, box-shadow .2s ease, border-color .2s ease!important; } html body .elementor-location-header .almara-header-cta a.elementor-button:hover, html body .elementor-location-header .almara-header-cta a.elementor-button:focus, html body .elementor-location-header .almara-header-cta .elementor-button:hover, html body .elementor-location-header .almara-header-cta .elementor-button:focus{ transform:translateY(-2px)!important; background:var(--almara-header-aqua-hover)!important; border-color:rgba(242,244,245,.28)!important; box-shadow:0 18px 34px rgba(0,0,0,.24), 0 0 0 1px rgba(66,145,157,.30)!important; } /* Optional: CTA as menu item if the button is maintained inside the WordPress menu */ html body .elementor-location-header .elementor-nav-menu--main .menu-item.almara-nav-cta > a, html body .elementor-location-header .elementor-nav-menu--main .menu-item.menu-cta > a{ min-height:42px!important; padding:13px 19px!important; border-radius:999px!important; background:var(--almara-header-aqua)!important; color:#FFFFFF!important; box-shadow:0 14px 28px rgba(0,0,0,.16)!important; } html body .elementor-location-header .elementor-nav-menu--main .menu-item.almara-nav-cta > a::after, html body .elementor-location-header .elementor-nav-menu--main .menu-item.menu-cta > a::after{ display:none!important; } /* Mobile / dropdown */ html body .elementor-location-header .elementor-menu-toggle{ color:#FFFFFF!important; background:rgba(242,244,245,.06)!important; border:1px solid rgba(242,244,245,.12)!important; border-radius:999px!important; padding:10px!important; } html body .elementor-location-header .elementor-menu-toggle:hover, html body .elementor-location-header .elementor-menu-toggle.elementor-active{ color:#FFFFFF!important; background:var(--almara-header-aqua-soft)!important; border-color:rgba(66,145,157,.45)!important; } html body .elementor-location-header .elementor-nav-menu--dropdown{ margin-top:14px!important; padding:10px!important; border-radius:18px!important; border:1px solid rgba(242,244,245,.12)!important; background:#062A41!important; box-shadow:0 22px 54px rgba(0,0,0,.28)!important; } html body .elementor-location-header .elementor-nav-menu--dropdown .elementor-item{ border-radius:12px!important; padding:13px 14px!important; background:transparent!important; color:var(--almara-header-ink-muted)!important; font-family:"Inter", Arial, sans-serif!important; font-weight:700!important; } html body .elementor-location-header .elementor-nav-menu--dropdown .elementor-item:hover, html body .elementor-location-header .elementor-nav-menu--dropdown .elementor-item:focus{ background:var(--almara-header-aqua-soft)!important; color:#FFFFFF!important; } html body .elementor-location-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active, html body .elementor-location-header .elementor-nav-menu--dropdown .current-menu-item > .elementor-item, html body .elementor-location-header .elementor-nav-menu--dropdown .current_page_item > .elementor-item{ background:rgba(66,145,157,.30)!important; color:#FFFFFF!important; font-weight:800!important; } html body .elementor-location-header .elementor-nav-menu--dropdown:hover .elementor-item.elementor-item-active:not(:hover), html body .elementor-location-header .elementor-nav-menu--dropdown:hover .current-menu-item > .elementor-item:not(:hover), html body .elementor-location-header .elementor-nav-menu--dropdown:hover .current_page_item > .elementor-item:not(:hover){ background:transparent!important; color:var(--almara-header-ink-muted)!important; font-weight:700!important; } @media (max-width:1024px){ html body .elementor-location-header .almara-header-v2{ padding:14px 18px!important; } html body .elementor-location-header .almara-header-v2 > .e-con-inner{ grid-template-columns:minmax(0,1fr) auto!important; gap:14px!important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img{ max-width:250px!important; max-height:58px!important; } html body .elementor-location-header .almara-header-nav{ justify-self:end!important; } html body .elementor-location-header .almara-header-cta{ grid-column:1 / -1!important; justify-self:stretch!important; width:100%!important; margin-top:2px!important; } html body .elementor-location-header .almara-header-cta a.elementor-button, html body .elementor-location-header .almara-header-cta .elementor-button{ width:100%!important; } } @media (max-width:767px){ html body .elementor-location-header .almara-header-v2{ padding:12px 14px!important; } html body .elementor-location-header .almara-header-logo a{ min-height:50px!important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img{ max-width:220px!important; max-height:52px!important; } html body .elementor-location-header .almara-header-cta a.elementor-button, html body .elementor-location-header .almara-header-cta .elementor-button{ min-height:42px!important; font-size:12px!important; } } /* ========================================================= ALMARA Header v1.3 — CLEAN Brand Wave Fix Scope: Elementor Theme Builder Header Purpose: - single source of truth for the menu underline - no Elementor pointer underline - no generic/legacy wave flash on hover - uses the real ALMARA logo wave, derived from logo_wave_crop.png ========================================================= */ html body .elementor-location-header { --almara-header-wave-logo-exact: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVgAAAAbCAYAAAA515c2AAAUmElEQVR42u19W3Bdx3Xl2ru7zzn3XoAgSIKSDBIiJYqUQZGUbFlDe+zEcjmOYilKJZWL+VCNko9U/DXjr1RSNR8AvlLzkalyzZenUjWOXTOuAcqOK7YVJXFC0ZYp2aIepEiEb/EhvgBQJPG4957T3XvPxwVJkARIynpQos76Qt26dXFO9+7Va6+9+xxCiRIlSpR4z9ip6rqPHKnmxlS51cqSJEnKUSlRokSJDwhUDsF7HDvVK58MDV0ez0EAYxs3vi/j21+vK4aGMDz/w6GhK/+YCAC0nJISJW4/L+g8TigJdjHyvDRIQ0NUn0eUo3v3KoaGFET6kbvmwcGrrrW/XtfhoaErZPzRu+YSJUoFe0eT6DUE2r93rw4PD8st/cK2bXbD4YuVniVFJiE4EFVSY2wskBCHVClWNHNVUWVh0+UaebVKKQkr+xhBqVVEgUdQUtYYI4hZM+tyUvFN5M2WYppFcstoIbFNpzY3PvcJqsVpN+svXEDrT48eLW7tmpXqI6O8wGZRKuASJUqCfX+IdHTvXsVNCOlPtm3Ljk7MLo3+Yq/3fiXY3kWU9MD7u4jp7gjpFpVOkC4h5Q4GJQZcIVUbfO5EgmWFY+OYiABnwVAQE0QBVgaY0aAA0QgXFEYFIMAZA2va3xNIhCISIahoDrJejSkI8Mq2pcQzxvA0EC4Q5Cwsn4yESY5yVrwZJ6GJZZWud9z6e6ZHH3qoWPSGBwf5qvH5aKr0Eh8mL+i7mP5yk/5EEOxVaXJ/va7DRAsT6aDyFzf+4/KcxlcCrbtdsXQtPPpAZlUR8nuMoR5fFCslhh4YZMY5sMlAbAAmgBSAgJkAYQSvIAVYI1Q9NAogCsBAmcFMIBZEFqgQLBmwGHiNAASOGVAFMWATB2MMQAzVMBfrihA8RNrB3OZibk8hEYg9mAEiRhSBFgExSkFsZxKTXojAJBGdypL0MDQey014KzqcDIWefqWnZxKPPx4WGs9BVRobHaX+vXt1uCTdO0ZwDA4N0dhidtJvOscKwtAgDQ4NYWx09ONgq5UEu/hkKmFo6PJk3kiVPvPcy0uO+vOrg289WMxeeDBh21ewrFOVe433PQQsSUw31DkwMyQGeAlQ7yE+ByREJTQZdsrZZCZCpqAyboydaRWNqcRmsxp4ShPKsySbZBNnlE3O7HJjiWIEckQYEQoGACIsErAQZV5ZpDBqjRWiFKoZMS0TkQ4yvKSVz2RpktSKvMhAWKJK3Yi6lEFdUKpaMqmxlsgIVCN8FEAJiIIIBQKgkaCGkZCBS1LkTiGhAY5xJibunBKddLkeSWH2ZV3db8xS3J9cpNP/8uzvzpZK985YH7eauV2e5m3b7FHAhmYzmclzXgqg0dFx1TznlYqkfCpgSX8c2bjR083jgAYHlcY2tq9n3qZ9x6pf+jgFzCBwRU0tECiDqvzzH/xgtZpkHRVyr1f/oC+Kfo7mvkBhremoZgQAMSIgopACrhFhvJmA4fFgaVxTe7amdBrAaREd1xjPU0pTonqRrT1H3k+fmZxsHPrmN/PbMQy/vW1bdnr6VEd3kXZTLt2Z4W5reFlQWSkx3hVEPiUx3sNCd5FiJYmuUDYOZGBihEfRjueoAAm8YbAxsGxhiUHEUEPnSHFcoh5mxj41vNeklbGLZ04cevUb32hcz7mDPLZxI/XX6zoMlIR7mzO30XpdFpuDuqqZ/elPe5re9xqiu62hFTHqSglYHn2xjCEdUOkCoUYwKRHXwGQiCJBLAligKkCUAEILRAFM0yIyZUQvwOg5WDqjaseZ+Kxjd4qr9tTzX//61GI3UB8ZMXfipk0f9YAZBYCBAbl2h3viwHNpsWNmRVELq8Rjs4psijFuUdWHwHaZqVTA1oBEIUUO8v6iET4TEz7BUY9xoOPB8pEAPSRTjZO1nrXnt9e/PPsuJpYwOEgAUH+f2rEWwujeve3reZdBt3XHjgoOHFhm1KyG6Hrr7P0UeZ2Yxr3Mrlc1WalGqwJARBC9h0iERgERgZwFWQtmBlQguZ9NyRx2nenu86S7TMz3NKIczKby0wuR7lULZnhYS3/ufRYbcyn+Yqr0qZ3/UJ09WvQE1V5Vut9LWMeia0ixBkp9qvkKZq6xdSQgiBI0KogIzLFtb7GBwrT9VTZgZqgqoghIBSqCKAImApFCIYAKVAJUIkgZDBsgOm2cPe2sO2KtO5ZlybGg+hZaxeEZTd5+8T89OXGd3zuXKbUJd1hBH8/4oY8aoQLA6MBAXEC5LY2TsxtMXmyeQeuxGMIjKVMfCfVwmgKJhfgCvtFoGmtOqMpBAu2p1Gr7UmuPeeAUi0x+8Q//8Pyivuw1Svk6f+oy0QFzJuxt8c/mroMW6rW9WRr459/+tttxd+ey5bLkHufzvtwX/T4vNqvqeutsX4xxOVvLMIwYI6IvEEKQqEKpS4mTCsh4aEuVFJMW/LYzdu+SpLazYfTV435634Fnnpn8pCiUD80znYvJBeeXgC3/7zu9VZc9VI12sxf97Az5DdWWrKQg3R6oCBkYa9qkSQqFb69+ARgMFQVFDYa0KRIapDqtbKZANsKwMFsxRMrGiIhI8LmqRBQhZAyqECOFakUpLoFoRVRSMg7GZSC2YGtg2EBibFcORCAiF6F6VqFHIfK6Qdxpa3a3y7qOPf/1r+d3woZ9+whWleqj7ZahhQh168h3ekOBzcq81Zp0CxFt1shrK7aKKIKpYhpE8SwFPWiZdluhAy7J3jI1e7ivr+/k3z3yyIXFDaYrPuI15v6d4wWpEgAMDuGy53Wj1PGJ555LZycnPwVka0H+gQB5iFQ3JYQNLZG7yVooAUUAknwWKqkYGJaEkZFBxSUoKAYv8RhBx0zQN9RgZ0jDm78YePatxWyF0Xq9vVjKKvTcvLULRTcSG7/z3X+qgS8+ENF6uJnnn/FsHxRDn3ZseoF2m4otInIHWGLAMACGet8ktuPWmQlj6LRhPhGB04Z5UmO8yEQTueo4qU6z99O5c7OTp09Lcs892tPTI9tfeAEYG1P0918iOXz22zutr4wl3bHTiZVKjkZ3EkJ3NLGHkSx3aeUuKK8iplWC2NuM/i5p+ZXOWafGQKzCtjzgAyIimGkyddkBB7ObnPl1y7mdD65eve9/PfqoX5BwbxDTnyyCnacMRxdI+b86MtJHzFtmG43PecIXixA+Y5Kky2YZUBTQKJNw9kBaYA8iv3HB4Q1e0XV419e+NrGYuX5pEq5RTp/0hXxdFXkx1auq9NTo6KfONZufNsKPpol5WLxsLEjWgE2HNQ4SA2KeI8YYDTORMWwsA0SIwUOYJpTxpmHzClnzmphk9wmRY28PDDSvJ13lsY2jdHnTu9OthblC1I3aBwmEr/7g+ZXT/vwD5LEFIo8A8lhR+PuUYgfYAGpAZEFMMKSgokBN6MJUpm9Twkcohv0+sbvSrHZAND9+zi29cOgahfhh1Q9OzUwsX9pEn2mG9YTYD8Y6G+Nao3F1VF1h0gywKZiA4D2UdIpIdueCX9jq8pe6Tdj146efPkHz42JOrPXX9+owbkt2RIODgzQ0NKTXchF9oAt5Lu1fqCj11LadK6bOndmk0vyy8fFxCfIwd1Q7W9HDN2aiEI0lxDsM+OWE7cFaUjv6056dZ/H4cLiRIi1T0Pe22C9VnRcrJG7427/t7OrouM+I9GfCj0boY6JxvRdZycaCAWgooIXXoCpi2MBZOGtBUcHK7zhjjkji9nikrxQys8sXxcHdzz47fsPix9xx4Y+tH3cNmfbvrevw8PVW1Z/v3OmOHx/vU2c3NlvNzyOGz8D7+0Ke9wZjKmQdRNtptmiAigJBC2vdSYXucYn5lff6Zsz4yFLmEz8bGLh4K7bcglbY5W/Sze7tyt8LWFdzsbToZvnbIyMdDPRSUdwnQD+z/Zz3xRaBrqE0yZBaEBFkNkcgd7JAuruT018tzfSXy4vpXf97YGBi0ez4g+CDeR54HcDAAlnGB0OwV6vUq/7pkz/5SffM9PktFVS2tjT8VoDZSmlnt8QmbN6aIDGvF0Ze02rymkjzjT5xx0YHBooytfwIeeMLpWODg/zovff2appusoLHUqGHlMNGr2ENmDMQI3iPWOSw4sSyY+scNEkRSOHzPBiTnKo6u9/EOMZk/12h+3KmI78w//cUBkbjjeylj5jFc92hlht1Vmz9m7+pdK5efbcS3QfWTS2JDyqw2QZez3lc3nIGLQ5gr4Bou+gYIqxNJqzQ/ojmnqaPe5iy12vp1IHtz3xjcqFrqo+M8FXX0iZNvV2bzFWtY4uk+F8dGekq8ny9GHo4IWyKDhs5D/0Sk7vzpStgjEN1agqg1lFv/Mup8EsgfeVUtWvfm089df5GMXN5g8PQvI2ErrChXgmja/uFR+p1WSBjtn/193+/RSs2/Pcnfn/XHK/q+0KwV7XoXFM8euL7378/sv28Kv4gqH4FiVlmWh4++mNBeY+CX3Qw27MK9v/zwMA7iynTT0zK+HFMaxfYvZ/43veWTGbmfi2aW9M8fMkbbGIyfRnVlpBxiFEQWjliDBEEYsushmCsBRRQH5XZTRqTHGga3dlKijcoSQ/FWTq2uisdf/4G6e2leJz/2XXPZLipMtOFo2xOneGaRvpb8QK3joxUUqS91Vq6tjE7tU5i8TkJ8lnxskqJusglRkBQULuLgwjVKPBSxIbVUxRwiE3yuof+sqNz2eu8JDmx/frDIZfJ9GOVyV0bUwuMparS7/3wh71UFA97xpeE3GMBeJCBuzVjRPUI0w0w0VsJ7KvGJS/5Ft7syroOrTm99tT//Ob6980Sqe/YUTEXJh5Y4qqPdKaVz6e+9WCHwcy05H/911958peDg4N8Kfv7TQiWBgcHaU5FXjUQ/+Vb30oPd9X+Q5EkvxfVfZmJH2ZrM4lyBsALwvg3svxqXLbswPbHH59ZNB0s0/w7SuVu+NGPOvta5l7AfzrG+EieF49Z6zaLSE8ggaggRg8SAYAoQjCcGCQJWqmBEUIMTV9RP2EIx9XjmHfJITb2QOayg3mMp3seMOM/efTpxu0ciLqqGf/xj7s1o+44G3qbDuu5GdZnoms8oY9U7rVMK0SVWRVaBBQ+tlugjIV1KWJRhCRN3ibSV63XX7HormI5j23/1e5T1/nkV7Uy3WHr5SataPURNW/zT1dlkt8vlG/xwW/VED+noLWmUoNzGbglkEZjVm3rkAmyH3AHpmx8yxl7tOJWTFpbO19ZKtNf6e1t/tcHHvBz4o1GMUonTmxN9kwe7Th9ZqanavPVXUrrGtauS8WtT4XuVaElbPlIJcleMEXjZ6+++OLL24evty/plm92kdT/qb8b6Qtd+JLl5IkQml9oFqEX0UwaMq8bpZ/nwb8YfHPPjj/7s+mFJHvZnH5nq9zFU8B/6NPQ6p+ZaWyBwSZi3hBV7ifnuq11gABStBBDgRiq6rkJy57IOBiyUGPAoiBVj4TOG0tnMjbjFOlMLngbrTiBWjKesDmniBcxi4vVql5AtdqYqTX8GvSENT09MjY2Fkfq9cuLdwDg8e+84NasWQOsARqnDXWOH7fTyVRW5Jw1fHM50mSZELp9LJbPzswsSxLuVtXVEF2NiHtCDEut2iWaGGdIYTxjNjFwDBhSqACsAIUgEJwB0WFYs5+IdgH0GtfSA9uffvrGrW6fvGzupq2cT/7k/3RPTBQbDHN/lmX9gF0f0exFzD9l8/QuVJh8RuBA0ACIotHZ2TGjIjNCsQVSNRFKDFUlGwicsgGb3LP4vKBkPPN2f9rCTvjw6+8/88cHr1XZt17kWqyNanCQf+fRT/fXtPq1EPUpE1qbWizGR7cvhvBcMzZ/1jpj3tz9F8/OLmgllGfaS1thgcXRPzKSUCOudo42pOwfSWEe8UVjXVqEe4JJutWlzjugiBEoPDT34KjCZIiMJcMObG37OQ0quPScCEaEKnkoN4kxrYRZKOUq6o1ohGhORIGJATIaWZJIqFxaKUzEzMYxawUImUA7RbSiICNgeB8BnmtPFoXEgCwXRMtgCgB5eBiYtGPGWnueiN42yvvVyqup5TcbrdbBXmvPXjcm89dfe5Mqaw03ItxFOmEGdZt940cXOmTar4iVsLxpYlcRUEtj6PJFzJytWCJl7xg+NTE0Y8zYNcn78xTjeGbDmda+o5Pbh4dnFsxaRtT016HD7XDRmyvYObU630994lvPpZU1+h/ZmCdJ5LdCCKvBccJF+cWM+n8dl/yVVwf+5HipUEu8X7YCAGz+7ndrWda1cpmf6S1Y102prAvBryeidTZQLwuWEYwF27Z3qQzMPTyHSNsn0DSi3XbAABQigMjc4SQBEGWeJUuIDIghMLePELdPNnH79zi0GxiU0T5tQoDO9ZhKhMYIVcwm1p4JMR4PCAezqjlahT1EaceRKa9nXkZzAgsUb6+qN5Tr5T3bCjfrXPhNf/9ycfUWf39RBfuf/+WHyzlZ+mWKeIp8/Gwz+CySO8Kt2X8N7/ht/E8jr4+OXl3hrY+MmNvYi1biE0C6l9Ru1bm7qo3GKgj1SNReiVgN4l4mrGLmpcTUEaOvArEGMqmoJgrY9tFgtElTCRICoArV9jFRMQRYBpRAqojewznnnTM5IRRK2hKli84m04bNpFc9y0onKMTjuQ9nkpo9ma5adfyfv/CFdxa70fmFuFKdfghxNdf3vVBx8kbor+/V4SG8pw4VutY/+NOXXngglfDfpCi2Bk1kNvhfV1ryYwn5C9/7oz86V3pCJT5sa+FdPRFKlbb+j9EsXeZSk3KaLO3oKGZnahJ9Z2G0ppGqEkMG5swSUoliokr7yY8wYINIQiKqDVadCUCzI0mnM5tMWx+asxVucpbNWO9bz9+sWX/+icH5bUGl+PgEsfu8XXV4eFiefelnm13D/8HU7PTPT/77W6/t+Mu/nL4u7f8g5HeJEu9S7S743NFbfRvF+4Rr28LKE4MlbskiuE6lfsTP/JYoMT8lvIxFHorzbnDppZMA2i+evPKOs5JES7z7tKw+MmIGVfnSA0NKlChRokSJEiVKlChRokSJEnc6/j/eBtu0FdNMcwAAAABJRU5ErkJggg=="); --almara-header-wave-width: 96px; --almara-header-wave-height: 8px; } /* 1) Kill all Elementor/default pointer artefacts except our final ::after below */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item::before, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item::before, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .sub-arrow::before, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .sub-arrow::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item-highlight { content: none !important; display: none !important; background: none !important; border: 0 !important; box-shadow: none !important; opacity: 0 !important; } /* 2) Main nav item baseline */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > a.elementor-item { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 13px 0 16px !important; color: var(--almara-header-ink-muted) !important; background: transparent !important; border: 0 !important; box-shadow: none !important; text-decoration: none !important; transition: color .16s ease, opacity .16s ease, transform .16s ease !important; } /* 3) The only wave underline: exact ALMARA logo wave, flat and brand-consistent */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > a.elementor-item::after { content: "" !important; display: block !important; position: absolute !important; left: 50% !important; right: auto !important; bottom: 4px !important; width: var(--almara-header-wave-width) !important; height: var(--almara-header-wave-height) !important; background-color: transparent !important; background-image: var(--almara-header-wave-logo-exact) !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; opacity: 0 !important; transform: translateX(-50%) !important; transform-origin: center center !important; pointer-events: none !important; transition: opacity .14s ease !important; } /* 4) Active and hover states */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item:hover, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item:focus, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item { color: #FFFFFF !important; background: transparent !important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item:hover::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .menu-item > .elementor-item:focus::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item::after { opacity: 1 !important; background-image: var(--almara-header-wave-logo-exact) !important; background-color: transparent !important; } /* 5) During hover over another menu point, avoid double-active marking */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .elementor-item.elementor-item-active:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-item > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_item > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-ancestor > .elementor-item:not(:hover), html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_ancestor > .elementor-item:not(:hover) { color: var(--almara-header-ink-muted) !important; font-weight: 650 !important; transform: none !important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .elementor-item.elementor-item-active:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current-menu-ancestor > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-nav-menu:hover .current_page_ancestor > .elementor-item:not(:hover)::after { opacity: 0 !important; } /* 6) CTA/menu-button items never receive a wave */ html body .elementor-location-header .elementor-nav-menu--main .menu-item.almara-nav-cta > a::after, html body .elementor-location-header .elementor-nav-menu--main .menu-item.menu-cta > a::after, html body .elementor-location-header .almara-header-cta a.elementor-button::after, html body .elementor-location-header .almara-header-cta .elementor-button::after { content: none !important; display: none !important; } @media (max-width: 1024px) { html body .elementor-location-header { --almara-header-wave-width: 86px; --almara-header-wave-height: 7px; } } /* ========================================================= ALMARA Header v1.5 — Center-Crop Brand Wave Correction Purpose: - keeps the real ALMARA logo wave as the only source - prevents the wave from being stretched/compressed into short menu words - uses a center-crop of the logo wave for short items like B2B and FAQ - centers the wave below the text, with visual inset from the word edges - does NOT suppress the last menu item, so Contact receives a wave too ========================================================= */ /* Wave geometry: visible window clips a larger ALMARA wave artwork. This keeps the original wave character instead of squeezing it. */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item { --almara-header-wave-width: 42px; --almara-header-wave-height: 8px; --almara-header-wave-art-width: 72px; --almara-header-wave-art-height: 8px; --almara-header-wave-shift: 0px; --almara-header-wave-bottom: 3px; } /* Dropdown items include the arrow inside the anchor width. Shift the wave slightly left so it sits under the word, not under word + arrow. */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item-has-children { --almara-header-wave-shift: -7px; } /* Fallback by current menu order: Experiences, Locations, B2B, FAQ, Contact */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:nth-child(1) { --almara-header-wave-width: 58px; --almara-header-wave-shift: -7px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:nth-child(2) { --almara-header-wave-width: 46px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:nth-child(3) { --almara-header-wave-width: 32px; --almara-header-wave-shift: -7px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:nth-child(4) { --almara-header-wave-width: 32px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:nth-child(5) { --almara-header-wave-width: 42px; } /* URL-based safety net, independent of menu order */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a[href*="experiences"] { --almara-header-wave-width: 58px; --almara-header-wave-shift: -7px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a[href*="locations"] { --almara-header-wave-width: 46px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a[href*="b2b"] { --almara-header-wave-width: 32px; --almara-header-wave-shift: -7px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a[href*="faq"] { --almara-header-wave-width: 32px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a[href*="contact"] { --almara-header-wave-width: 42px; --almara-header-wave-shift: 0px; } /* Final single allowed wave pseudo-element */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta) > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta) > a.elementor-item::after { content: "" !important; display: block !important; position: absolute !important; left: 50% !important; right: auto !important; bottom: var(--almara-header-wave-bottom) !important; width: var(--almara-header-wave-width) !important; height: var(--almara-header-wave-height) !important; background-color: transparent !important; background-image: var(--almara-header-wave-logo-exact) !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: var(--almara-header-wave-art-width) var(--almara-header-wave-art-height) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; opacity: 0 !important; transform: translateX(-50%) translateX(var(--almara-header-wave-shift)) !important; transform-origin: center center !important; pointer-events: none !important; overflow: hidden !important; transition: opacity .14s ease !important; } /* Active / hover visibility */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta) > .elementor-item:hover::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta) > .elementor-item:focus::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta) > .elementor-item.elementor-item-active::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta).current-menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta).current_page_item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta).current-menu-ancestor > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item:not(.almara-nav-cta):not(.menu-cta).current_page_ancestor > .elementor-item::after { opacity: 1 !important; background-image: var(--almara-header-wave-logo-exact) !important; } /* Keep active-item suppression when hovering another menu item, but never suppress the actually hovered item. */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu:hover > li.menu-item.current-menu-item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu:hover > li.menu-item.current_page_item > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu:hover > li.menu-item.current-menu-ancestor > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu:hover > li.menu-item.current_page_ancestor > .elementor-item:not(:hover)::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu:hover > li.menu-item > .elementor-item.elementor-item-active:not(:hover)::after { opacity: 0 !important; } /* CTA must never get a wave. Do not use :last-child here because Contact may be the last item in the menu. */ html body .elementor-location-header .elementor-nav-menu--main .menu-item.almara-nav-cta > a::after, html body .elementor-location-header .elementor-nav-menu--main .menu-item.menu-cta > a::after, html body .elementor-location-header .almara-header-cta a.elementor-button::after, html body .elementor-location-header .almara-header-cta .elementor-button::after { content: none !important; display: none !important; opacity: 0 !important; } /* ========================================================= ALMARA Header v1.6 — Smooth SVG Brand Wave Final Fix Purpose: - remove the fragmented / interrupted wave look from v1.5 - use a smooth vector wave instead of the cropped raster wave - keep the wave centered under the word with left/right inset - ensure short labels (B2B / FAQ / Contact) still show a visible wave ========================================================= */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item { --almara-header-wave-left-right-gap: 18px; --almara-header-wave-width-min: 30px; --almara-header-wave-width-max: 58px; --almara-header-wave-height: 8px; --almara-header-wave-bottom: 4px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item.menu-item-has-children { --almara-header-wave-shift: -6px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > .elementor-item, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a.elementor-item { position: relative !important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a.elementor-item::after { content: "" !important; display: block !important; width: clamp(var(--almara-header-wave-width-min), calc(100% - var(--almara-header-wave-left-right-gap)), var(--almara-header-wave-width-max)) !important; min-width: var(--almara-header-wave-width-min) !important; max-width: var(--almara-header-wave-width-max) !important; height: var(--almara-header-wave-height) !important; left: 50% !important; right: auto !important; bottom: var(--almara-header-wave-bottom) !important; transform: translateX(calc(-50% + var(--almara-header-wave-shift))) !important; opacity: 0 !important; border: 0 !important; box-shadow: none !important; background-color: transparent !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 14' fill='none'%3E%3Cpath d='M2 10.4C10 9.7 16 6.0 25 6.1c7 .1 12 2.4 18 4.3c5.6 1.7 10.2 2.0 16 .9c5.9-1.1 10.9-4.2 17-5.0c6.6-.9 12.1.2 18 2.4c5.1 1.8 9.6 3.1 15 3.0c3.2-.1 6.1-.7 9-1.8' stroke='%2342919D' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; pointer-events: none !important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:hover::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:focus::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item::after { opacity: 1 !important; } /* CTA must never get a wave */ html body .elementor-location-header .almara-header-cta a.elementor-button::after, html body .elementor-location-header .almara-header-cta .elementor-button::after { content: none !important; display: none !important; } /* ========================================================= ALMARA Header v1.7 — Continuous Brand Wave Refinement Reason: - v1.6 solved spacing, but the wave still looked visually segmented - this refinement uses a calmer, more continuous SVG path - optimized for tiny header sizes and short menu labels ========================================================= */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item { --almara-header-wave-left-right-gap: 18px; --almara-header-wave-width-min: 32px; --almara-header-wave-width-max: 54px; --almara-header-wave-height: 7px; --almara-header-wave-bottom: 4px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item.menu-item-has-children { --almara-header-wave-shift: -6px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a.elementor-item::after { content: "" !important; display: block !important; width: clamp(var(--almara-header-wave-width-min), calc(100% - var(--almara-header-wave-left-right-gap)), var(--almara-header-wave-width-max)) !important; min-width: var(--almara-header-wave-width-min) !important; max-width: var(--almara-header-wave-width-max) !important; height: var(--almara-header-wave-height) !important; left: 50% !important; right: auto !important; bottom: var(--almara-header-wave-bottom) !important; transform: translateX(calc(-50% + var(--almara-header-wave-shift))) !important; background-color: transparent !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' fill='none'%3E%3Cpath d='M2 8.2C10 8.0 17 5.7 25 5.7C33 5.7 39 7.8 46 9.0C52 10.0 58 10.1 64 9.0C71 7.8 77 5.7 85 5.7C93 5.7 100 7.9 108 8.2' stroke='%2342919D' stroke-width='2.15' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; border: 0 !important; box-shadow: none !important; } /* ========================================================= ALMARA Header v1.8 — Premium Nav Wave Purpose: - move away from the too-literal mini logo wave - use a calmer, more premium navigation marker - consistent width across menu items for better visual balance - still centered under the word, with optical inset and arrow compensation ========================================================= */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item { --almara-header-wave-width: 46px; --almara-header-wave-height: 8px; --almara-header-wave-bottom: 4px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item.menu-item-has-children { --almara-header-wave-shift: -6px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item > a.elementor-item::after { content: "" !important; display: block !important; width: var(--almara-header-wave-width) !important; min-width: var(--almara-header-wave-width) !important; max-width: var(--almara-header-wave-width) !important; height: var(--almara-header-wave-height) !important; left: 50% !important; right: auto !important; bottom: var(--almara-header-wave-bottom) !important; transform: translateX(calc(-50% + var(--almara-header-wave-shift))) !important; opacity: 0 !important; border: 0 !important; box-shadow: none !important; background-color: transparent !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: 100% 100% !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 16' fill='none'%3E%3Cpath d='M4 10.2C16 7.4 29 5.8 42 7.2C49 8.0 55 10.2 62 10.3C69 10.4 75 8.1 82 7.0C92 5.5 103 6.4 116 8.7' stroke='%2342919D' stroke-width='2.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; pointer-events: none !important; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:hover::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item:focus::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .elementor-item.elementor-item-active::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_item > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current-menu-ancestor > .elementor-item::after, html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main .current_page_ancestor > .elementor-item::after { opacity: 1 !important; } /* CTA must never get a wave */ html body .elementor-location-header .almara-header-cta a.elementor-button::after, html body .elementor-location-header .almara-header-cta .elementor-button::after, html body .elementor-location-header .elementor-nav-menu--main .menu-item.almara-nav-cta > a::after, html body .elementor-location-header .elementor-nav-menu--main .menu-item.menu-cta > a::after { content: none !important; display: none !important; } /* ========================================================= ALMARA Header v1.8.1 — Final Polish Purpose: - keep the v1.8 premium nav-wave concept - reduce visual dominance slightly - make the wave more elegant and less loud ========================================================= */ html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item { --almara-header-wave-width: 42px; --almara-header-wave-height: 7px; --almara-header-wave-bottom: 4px; --almara-header-wave-shift: 0px; } html body .elementor-location-header .almara-header-nav .elementor-nav-menu--main > ul.elementor-nav-menu > li.menu-item.menu-item-has-children { --almara-header-wave-shift: -6px; } /* ========================================================= ALMARA Header v1.8.2 — Tablet / Mobile CTA Fix Purpose: - removes the faulty full-width CTA row on tablet/mobile - tablet keeps a compact header CTA in the top row - smartphone keeps a clean premium logo + burger header; CTA is hidden in header - keeps v1.8.1 nav wave unchanged ========================================================= */ @media (max-width: 1024px) and (min-width: 768px) { html body .elementor-location-header .almara-header-v2 > .e-con-inner { display: grid !important; grid-template-columns: minmax(0, 1fr) auto auto !important; align-items: center !important; gap: 14px !important; } html body .elementor-location-header .almara-header-logo, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo, html body .elementor-location-header .elementor-widget-image.almara-header-logo { grid-column: 1 !important; grid-row: 1 !important; justify-self: start !important; align-self: center !important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img { max-width: clamp(190px, 28vw, 250px) !important; max-height: 58px !important; } html body .elementor-location-header .almara-header-nav { grid-column: 2 !important; grid-row: 1 !important; justify-self: end !important; align-self: center !important; width: auto !important; margin: 0 !important; } html body .elementor-location-header .almara-header-cta { grid-column: 3 !important; grid-row: 1 !important; justify-self: end !important; align-self: center !important; width: auto !important; max-width: none !important; margin: 0 !important; } html body .elementor-location-header .almara-header-cta a.elementor-button, html body .elementor-location-header .almara-header-cta .elementor-button { width: auto !important; min-width: 0 !important; max-width: none !important; min-height: 40px !important; padding: 11px 18px !important; border-radius: 999px !important; font-size: 12.5px !important; line-height: 1 !important; white-space: nowrap !important; } } @media (max-width: 767px) { html body .elementor-location-header .almara-header-v2 > .e-con-inner { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; } html body .elementor-location-header .almara-header-logo, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo, html body .elementor-location-header .elementor-widget-image.almara-header-logo { grid-column: 1 !important; grid-row: 1 !important; justify-self: start !important; align-self: center !important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img { max-width: clamp(188px, 56vw, 226px) !important; max-height: 58px !important; } html body .elementor-location-header .almara-header-nav { grid-column: 2 !important; grid-row: 1 !important; justify-self: end !important; align-self: center !important; width: auto !important; margin: 0 !important; } html body .elementor-location-header .almara-header-cta, html body .elementor-location-header .elementor-widget-button.almara-header-cta { display: none !important; } } @media (max-width: 420px) { html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img { max-width: clamp(172px, 58vw, 210px) !important; } } /* ========================================================= ALMARA Home Visual v1 — Hero Still + Editorial Image Slots Scope: ALMARA Home Elementor templates EN/DE Purpose: final Home image dramaturgy with hero poster, partner/destination/how visuals, and experience mosaic ========================================================= */ /* --- shared final media-card polish --- */ #alm-home-hero-media, #alm-home-experience-media { border-style: solid !important; border-color: rgba(56, 198, 217, 0.36) !important; background: radial-gradient(circle at 14% 18%, rgba(56, 198, 217, 0.14), transparent 36%), linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(255, 255, 255, 0.46)) !important; gap: 18px !important; } #alm-home-hero-media .alm-image-slot__label, #alm-home-experience-media .alm-image-slot__label { margin: 0 !important; color: var(--alm-navy) !important; } #alm-home-hero-media .alm-image-slot__hint, #alm-home-experience-media .alm-image-slot__hint { margin: 0 !important; } #alm-home-hero-media .alm-image-slot__hint p, #alm-home-experience-media .alm-image-slot__hint p { margin: 0 !important; font-size: clamp(0.94rem, 1vw, 1.06rem) !important; line-height: 1.62 !important; } /* --- hero still --- */ #alm-home-hero-image, #alm-home-hero-media .alm-home-hero-image, #alm-home-hero-media .alm-home-media-image { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; } #alm-home-hero-media .alm-home-hero-image .elementor-widget-container, #alm-home-hero-media .alm-home-media-image .elementor-widget-container { width: 100% !important; max-width: 100% !important; overflow: hidden !important; border-radius: 20px !important; box-shadow: 0 16px 42px rgba(9, 43, 61, 0.10) !important; } #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; object-fit: cover !important; object-position: 54% 44% !important; border-radius: 20px !important; } /* --- editorial visual slots --- */ #alm-home-partner-visual, #alm-home-destinations-visual, #alm-home-how-visual { width: 100% !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; } #alm-home-partner-visual { max-width: min(1080px, 100%) !important; margin-top: clamp(30px, 3vw, 44px) !important; margin-bottom: clamp(34px, 4vw, 54px) !important; } #alm-home-destinations-visual { max-width: min(1180px, 100%) !important; margin-top: clamp(30px, 3vw, 46px) !important; margin-bottom: clamp(38px, 4vw, 58px) !important; } #alm-home-how-visual { max-width: min(920px, 100%) !important; margin-top: clamp(30px, 3vw, 42px) !important; margin-bottom: clamp(34px, 3.5vw, 48px) !important; } #alm-home-partner-visual .elementor-widget-image, #alm-home-destinations-visual .elementor-widget-image, #alm-home-how-visual .elementor-widget-image, #alm-home-partner-visual .elementor-widget-container, #alm-home-destinations-visual .elementor-widget-container, #alm-home-how-visual .elementor-widget-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { display: block !important; width: 100% !important; max-width: 100% !important; object-fit: cover !important; border: 1px solid rgba(56, 198, 217, 0.38) !important; border-radius: 28px !important; box-shadow: 0 18px 48px rgba(9, 43, 61, 0.11) !important; background: rgba(255, 255, 255, 0.70) !important; } #alm-home-partner-visual img { aspect-ratio: 16 / 8.6 !important; object-position: 50% 48% !important; } #alm-home-destinations-visual img { aspect-ratio: 16 / 7.4 !important; object-position: 50% 50% !important; } #alm-home-how-visual img { aspect-ratio: 16 / 8.8 !important; object-position: 50% 54% !important; } /* --- experience mosaic --- */ #alm-home-experience-mosaic { width: 100% !important; max-width: 100% !important; min-width: 0 !important; display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 14px !important; margin-top: 4px !important; } #alm-home-experience-mosaic > .e-con-inner { display: contents !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border-radius: 18px !important; background: rgba(255, 255, 255, 0.65) !important; box-shadow: 0 10px 28px rgba(9, 43, 61, 0.08) !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item > .e-con-inner { width: 100% !important; max-width: 100% !important; display: block !important; margin: 0 !important; padding: 0 !important; } #alm-home-experience-mosaic .elementor-widget-image, #alm-home-experience-mosaic .elementor-widget-container { width: 100% !important; height: 100% !important; max-width: 100% !important; margin: 0 !important; } #alm-home-experience-mosaic img { display: block !important; width: 100% !important; height: 100% !important; min-height: 142px !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; border-radius: 18px !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item--family img { object-position: 52% 50% !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item--service img { object-position: 50% 48% !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item--marina img { object-position: 50% 52% !important; } #alm-home-experience-mosaic .alm-home-experience-mosaic__item--underwater img { object-position: 50% 45% !important; } /* --- desktop rhythm after new editorial slots --- */ #alm-home-partners #alm-home-partner-card-grid, #alm-home-destinations #alm-home-destination-card-grid, #alm-home-how #alm-home-step-card-grid { margin-top: 0 !important; } /* --- tablet visual behavior --- */ @media (max-width: 1024px) { #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { object-position: 56% 45% !important; } #alm-home-partner-visual, #alm-home-destinations-visual, #alm-home-how-visual { max-width: 100% !important; margin-top: 34px !important; margin-bottom: 42px !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { aspect-ratio: 4 / 3 !important; border-radius: 24px !important; } #alm-home-experience-mosaic { gap: 12px !important; } } /* --- mobile visual behavior --- */ @media (max-width: 767px) { #alm-home-hero-media, #alm-home-experience-media { gap: 14px !important; } #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { aspect-ratio: 4 / 5 !important; object-position: 58% 42% !important; border-radius: 18px !important; } #alm-home-partner-visual, #alm-home-destinations-visual, #alm-home-how-visual { margin-top: 28px !important; margin-bottom: 34px !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { aspect-ratio: 4 / 3 !important; border-radius: 22px !important; box-shadow: 0 14px 34px rgba(9, 43, 61, 0.10) !important; } #alm-home-experience-mosaic { grid-template-columns: 1fr !important; gap: 14px !important; margin-top: 0 !important; } #alm-home-experience-mosaic img { min-height: 210px !important; aspect-ratio: 4 / 3 !important; } } @media (max-width: 420px) { #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { aspect-ratio: 1 / 1 !important; object-position: 57% 44% !important; } } /* ========================================================= ALMARA Home Visual v1.1 — Responsive Polish Fix Scope: ALMARA Home EN/DE, CSS-only Purpose: - keep the approved image dramaturgy - make tablet layouts less long by restoring 2-column grids - compact mobile rhythm without changing content - improve Hero / editorial visual proportions on small screens - keep Experience mosaic as a real mosaic on mobile ========================================================= */ /* --- desktop / large screen micro-polish --- */ #alm-home-hero { padding-top: clamp(72px, 7vw, 112px) !important; padding-bottom: clamp(46px, 5.5vw, 82px) !important; } #alm-home-hero-media { min-height: auto !important; padding: clamp(24px, 2.2vw, 32px) !important; } #alm-home-hero-media .alm-image-slot__label { margin-bottom: 2px !important; } #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { box-shadow: 0 14px 36px rgba(9, 43, 61, 0.11) !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { filter: saturate(1.02) contrast(1.015) !important; } #alm-home-destinations-visual { max-width: min(1120px, 96%) !important; } #alm-home-how-visual { max-width: min(860px, 92%) !important; } #alm-home-destinations-visual img { aspect-ratio: 16 / 7.8 !important; } #alm-home-how-visual img { aspect-ratio: 16 / 8.4 !important; } /* --- tablet polish: below 980px the hardening block stacks everything; for true tablet widths we re-enable balanced 2-column card grids. --- */ @media (min-width: 768px) and (max-width: 980px) { #alm-home-hero, #alm-home-trust, #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { padding-left: 34px !important; padding-right: 34px !important; } #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { padding-top: 82px !important; padding-bottom: 88px !important; } #alm-home-hero > .e-con-inner { gap: 34px !important; } #alm-home-hero h1 { font-size: clamp(3.1rem, 8.4vw, 5.1rem) !important; max-width: 720px !important; } #alm-home-shift h2, #alm-home-partners h2, #alm-home-destinations h2, #alm-home-how h2, #alm-home-experience h2, #alm-home-platform h2, #alm-home-final-cta h2 { font-size: clamp(2.5rem, 6.4vw, 4.2rem) !important; max-width: 760px !important; } #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-glide-explore-dive-grid:not(.e-con-boxed), #alm-home-partner-card-grid > .e-con-inner, #alm-home-partner-card-grid:not(.e-con-boxed), #alm-home-destination-card-grid > .e-con-inner, #alm-home-destination-card-grid:not(.e-con-boxed), #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner, #alm-home-step-card-grid:not(.e-con-boxed), #alm-home-how-card-grid:not(.e-con-boxed), #alm-home-platform-card-grid:not(.e-con-boxed) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px !important; } #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element, #alm-home-partner-card-grid > .e-con-inner > .elementor-element, #alm-home-destination-card-grid > .e-con-inner > .elementor-element, #alm-home-step-card-grid > .e-con-inner > .elementor-element, #alm-home-how-card-grid > .e-con-inner > .elementor-element, #alm-home-platform-card-grid > .e-con-inner > .elementor-element, #alm-home-glide-explore-dive-grid:not(.e-con-boxed) > .elementor-element, #alm-home-partner-card-grid:not(.e-con-boxed) > .elementor-element, #alm-home-destination-card-grid:not(.e-con-boxed) > .elementor-element, #alm-home-step-card-grid:not(.e-con-boxed) > .elementor-element, #alm-home-how-card-grid:not(.e-con-boxed) > .elementor-element, #alm-home-platform-card-grid:not(.e-con-boxed) > .elementor-element { width: 100% !important; max-width: 100% !important; min-width: 0 !important; align-self: stretch !important; } #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element, #alm-home-destination-card-grid:not(.e-con-boxed) > .elementor-element { min-height: 0 !important; } #alm-home-partner-visual, #alm-home-destinations-visual, #alm-home-how-visual { max-width: 100% !important; margin-top: 30px !important; margin-bottom: 34px !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { aspect-ratio: 16 / 9 !important; border-radius: 24px !important; } #alm-home-experience-media { min-height: auto !important; } #alm-home-experience-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; } #alm-home-experience-mosaic img { min-height: 0 !important; aspect-ratio: 1 / 1 !important; } #alm-home-final-cta > .e-con-inner { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 22px !important; } } /* --- mobile polish: more compact rhythm, readable media, shorter page. --- */ @media (max-width: 767px) { #alm-home-hero, #alm-home-trust, #alm-home-shift, #alm-home-partners, #alm-home-destinations, #alm-home-how, #alm-home-experience, #alm-home-platform, #alm-home-final-cta { padding-left: 20px !important; padding-right: 20px !important; } #alm-home-hero { padding-top: 34px !important; padding-bottom: 0 !important; } #alm-home-hero > .e-con-inner { gap: 24px !important; } #alm-home-hero h1 { font-size: clamp(2.22rem, 11.2vw, 3.2rem) !important; line-height: 1.03 !important; letter-spacing: -0.038em !important; } #alm-home-shift h2, #alm-home-partners h2, #alm-home-destinations h2, #alm-home-how h2, #alm-home-experience h2, #alm-home-platform h2, #alm-home-final-cta h2 { font-size: clamp(2.12rem, 9.8vw, 3.05rem) !important; line-height: 1.04 !important; } #alm-home-hero p, #alm-home-shift p, #alm-home-partners p, #alm-home-destinations p, #alm-home-how p, #alm-home-experience p, #alm-home-platform p, #alm-home-final-cta p { font-size: 0.98rem !important; line-height: 1.58 !important; } #alm-home-hero-media, #alm-home-experience-media { min-height: auto !important; padding: 16px !important; border-radius: 24px !important; gap: 12px !important; } #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { aspect-ratio: 4 / 3 !important; object-position: 56% 45% !important; border-radius: 17px !important; } #alm-home-hero-media .alm-image-slot__hint p, #alm-home-experience-media .alm-image-slot__hint p { font-size: 0.9rem !important; line-height: 1.5 !important; } #alm-home-trust { padding-top: 28px !important; padding-bottom: 46px !important; } #alm-home-shift { padding-top: 52px !important; padding-bottom: 64px !important; } #alm-home-partners { padding-top: 66px !important; padding-bottom: 64px !important; } #alm-home-destinations { padding-top: 66px !important; padding-bottom: 54px !important; } #alm-home-how { padding-top: 54px !important; padding-bottom: 66px !important; } #alm-home-experience { padding-top: 0 !important; padding-bottom: 68px !important; } #alm-home-platform { padding-top: 54px !important; padding-bottom: 66px !important; } #alm-home-final-cta { padding-top: 54px !important; padding-bottom: 66px !important; } #alm-home-partner-visual, #alm-home-destinations-visual, #alm-home-how-visual { max-width: 100% !important; margin-top: 24px !important; margin-bottom: 28px !important; } #alm-home-partner-visual img, #alm-home-destinations-visual img, #alm-home-how-visual img { aspect-ratio: 4 / 3 !important; border-radius: 20px !important; box-shadow: 0 12px 28px rgba(9, 43, 61, 0.10) !important; } #alm-home-partner-card-grid, #alm-home-destination-card-grid, #alm-home-step-card-grid, #alm-home-how-card-grid, #alm-home-platform-card-grid { margin-top: 26px !important; } #alm-home-glide-explore-dive-grid, #alm-home-partner-card-grid, #alm-home-destination-card-grid, #alm-home-step-card-grid, #alm-home-how-card-grid, #alm-home-platform-card-grid, #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-partner-card-grid > .e-con-inner, #alm-home-destination-card-grid > .e-con-inner, #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner { gap: 14px !important; } body.elementor-page .alm-card, body.elementor-page .alm-cta-card, body.elementor-page #alm-home-partner-card-grid .elementor-widget-icon-box, #alm-home-destination-card-grid .alm-card, #alm-home-destination-card-grid > .e-con-inner > .elementor-element { padding: 23px 20px !important; border-radius: 20px !important; } body.elementor-page #alm-home-partner-card-grid .elementor-icon-box-wrapper { padding: 23px 20px !important; } #alm-home-destination-card-grid .alm-card::before, #alm-home-destination-card-grid > .e-con-inner > .elementor-element::before { top: 18px !important; right: 18px !important; width: 24px !important; } #alm-home-destination-card-grid .alm-card__title, #alm-home-destination-card-grid .alm-card__title h3, #alm-home-destination-card-grid .alm-card__title h4, #alm-home-partner-card-grid .elementor-icon-box-title, #alm-home-partner-card-grid .elementor-icon-box-title span, #alm-home-partner-card-grid .elementor-icon-box-title a, #alm-home-glide-explore-dive-grid .alm-card__title, #alm-home-step-card-grid .alm-card__title, #alm-home-platform-card-grid .alm-card__title { font-size: 1.28rem !important; line-height: 1.22 !important; } #alm-home-experience-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; margin-top: 2px !important; } #alm-home-experience-mosaic img { min-height: 0 !important; aspect-ratio: 1 / 1 !important; border-radius: 14px !important; } #alm-home-final-cta > .e-con-inner { gap: 16px !important; } #alm-home-final-cta .alm-cta-card { margin-bottom: 0 !important; } } @media (max-width: 420px) { #alm-home-hero-media .alm-home-hero-image img, #alm-home-hero-media .alm-home-media-image img { aspect-ratio: 4 / 3 !important; object-position: 56% 45% !important; } #alm-home-experience-mosaic { gap: 8px !important; } #alm-home-experience-mosaic img { border-radius: 12px !important; } } /* ========================================================= ALMARA Home Visual v1.2 — Mobile Experience + CTA Polish Scope: ALMARA Home EN/DE, CSS-only Purpose: - remove the Experience media/mosaic slot on mobile - keep the approved desktop/tablet Experience mosaic unchanged - prevent the Final CTA from becoming cramped on mobile - reduce mobile section rhythm after removing the mosaic ========================================================= */ @media (max-width: 767px) { /* On mobile, do not show the editorial Experience media/mosaic slot. The actual guest-facing message remains in the copy column below. */ #alm-home-experience-media, #alm-home-experience-mosaic { display: none !important; visibility: hidden !important; height: 0 !important; min-height: 0 !important; max-height: 0 !important; overflow: hidden !important; padding: 0 !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; } #alm-home-experience-split, #alm-home-experience-split > .e-con-inner { display: flex !important; flex-direction: column !important; gap: 0 !important; min-height: 0 !important; } #alm-home-experience-copy { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; min-height: 0 !important; } #alm-home-experience { padding-top: 54px !important; padding-bottom: 58px !important; } #alm-home-experience-copy .alm-kicker { margin-bottom: 12px !important; } #alm-home-experience-copy h2, #alm-home-experience h2 { margin-bottom: 14px !important; } #alm-home-experience-copy .alm-button-row, #alm-home-experience-cta-row { margin-top: 18px !important; } /* Final CTA: mobile must read as two clear blocks, not as two cramped columns. */ #alm-home-final-cta > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 18px !important; } #alm-home-final-partner-cta, #alm-home-final-guest-cta { width: 100% !important; max-width: 100% !important; margin: 0 !important; } #alm-home-final-partner-cta { padding: 26px 24px !important; } #alm-home-final-guest-cta { padding: 24px 0 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } #alm-home-final-cta .alm-button-row, #alm-home-final-cta .elementor-widget-button { width: 100% !important; } #alm-home-final-cta .elementor-button { width: 100% !important; justify-content: center !important; } } @media (max-width: 420px) { /* Narrow phones: avoid ultra-slim cards from inherited tablet/grid rules. */ #alm-home-glide-explore-dive-grid > .e-con-inner, #alm-home-partner-card-grid > .e-con-inner, #alm-home-destination-card-grid > .e-con-inner, #alm-home-step-card-grid > .e-con-inner, #alm-home-how-card-grid > .e-con-inner, #alm-home-platform-card-grid > .e-con-inner, #alm-home-glide-explore-dive-grid:not(.e-con-boxed), #alm-home-partner-card-grid:not(.e-con-boxed), #alm-home-destination-card-grid:not(.e-con-boxed), #alm-home-step-card-grid:not(.e-con-boxed), #alm-home-how-card-grid:not(.e-con-boxed), #alm-home-platform-card-grid:not(.e-con-boxed) { display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; } #alm-home-partner-card-grid > .e-con-inner > .elementor-element, #alm-home-destination-card-grid > .e-con-inner > .elementor-element, #alm-home-step-card-grid > .e-con-inner > .elementor-element, #alm-home-how-card-grid > .e-con-inner > .elementor-element, #alm-home-platform-card-grid > .e-con-inner > .elementor-element, #alm-home-glide-explore-dive-grid > .e-con-inner > .elementor-element { width: 100% !important; max-width: 100% !important; } } /* ========================================================= ALMARA Header Language Switcher — v1.0 FREEZE Scope: Elementor Theme Builder Header + Polylang switcher Purpose: - adds a real language slot to the header grid - Desktop: Logo | Navigation | Language | CTA - Tablet: Logo | Language | Burger/Nav | CTA - Mobile: Logo | Language | Burger/Nav; CTA hidden Requires header JSON class on the language wrapper: .almara-header-lang ========================================================= */ html body .elementor-location-header{ --almara-header-lang-bg: rgba(255,255,255,.96); --almara-header-lang-bg-hover: #ffffff; --almara-header-lang-ink: #042034; --almara-header-lang-line: rgba(242,244,245,.34); } /* Desktop grid: add a dedicated language column between nav and CTA. */ @media (min-width:1025px){ html body .elementor-location-header .almara-header-v2 > .e-con-inner{ display:grid!important; grid-template-columns:auto minmax(0,1fr) auto auto!important; align-items:center!important; gap:clamp(16px,2.2vw,32px)!important; } html body .elementor-location-header .almara-header-logo{ grid-column:1!important; grid-row:1!important; } html body .elementor-location-header .almara-header-nav{ grid-column:2!important; grid-row:1!important; justify-self:end!important; } html body .elementor-location-header .almara-header-lang, html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.almara-header-lang-widget), html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.elementor-widget-polylang-language-switcher){ grid-column:3!important; grid-row:1!important; justify-self:end!important; align-self:center!important; } html body .elementor-location-header .almara-header-cta{ grid-column:4!important; grid-row:1!important; justify-self:end!important; } } /* Language slot base: keep it compact and independent from Elementor's imported widths. */ html body .elementor-location-header .almara-header-lang, html body .elementor-location-header .almara-header-lang-widget, html body .elementor-location-header .almara-header-lang .elementor-widget-container, html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.almara-header-lang-widget), html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.elementor-widget-polylang-language-switcher){ width:auto!important; max-width:none!important; min-width:0!important; min-height:0!important; margin:0!important; padding:0!important; flex:0 0 auto!important; align-self:center!important; justify-self:end!important; overflow:visible!important; } html body .elementor-location-header .almara-header-lang .elementor-widget-container, html body .elementor-location-header .almara-header-lang-widget .elementor-widget-container{ display:flex!important; align-items:center!important; justify-content:center!important; line-height:1!important; } /* Polylang can render as ul/li/a or select; normalize both. */ html body .elementor-location-header .almara-header-lang ul, html body .elementor-location-header .almara-header-lang-widget ul, html body .elementor-location-header .almara-header-lang .polylang-language-switcher, html body .elementor-location-header .almara-header-lang-widget .polylang-language-switcher, html body .elementor-location-header .almara-header-lang .pll-switcher, html body .elementor-location-header .almara-header-lang-widget .pll-switcher{ list-style:none!important; display:flex!important; align-items:center!important; justify-content:center!important; gap:6px!important; margin:0!important; padding:0!important; width:auto!important; max-width:none!important; } html body .elementor-location-header .almara-header-lang li, html body .elementor-location-header .almara-header-lang-widget li{ display:flex!important; align-items:center!important; justify-content:center!important; margin:0!important; padding:0!important; line-height:1!important; } html body .elementor-location-header .almara-header-lang a, html body .elementor-location-header .almara-header-lang-widget a, html body .elementor-location-header .almara-header-lang .lang-item a, html body .elementor-location-header .almara-header-lang-widget .lang-item a, html body .elementor-location-header .almara-header-lang select, html body .elementor-location-header .almara-header-lang-widget select, html body .elementor-location-header .almara-header-lang .pll-switcher-select, html body .elementor-location-header .almara-header-lang-widget .pll-switcher-select{ box-sizing:border-box!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; min-width:42px!important; height:34px!important; min-height:34px!important; padding:0 12px!important; margin:0!important; border-radius:999px!important; border:1px solid var(--almara-header-lang-line)!important; background:var(--almara-header-lang-bg)!important; color:var(--almara-header-lang-ink)!important; font-family:"Inter", Arial, sans-serif!important; font-size:13px!important; line-height:1!important; font-weight:800!important; letter-spacing:.02em!important; text-transform:uppercase!important; text-decoration:none!important; white-space:nowrap!important; text-align:center!important; box-shadow:0 10px 22px rgba(0,0,0,.12)!important; appearance:none!important; -webkit-appearance:none!important; outline:0!important; transition:background-color .18s ease, transform .18s ease, box-shadow .18s ease!important; } html body .elementor-location-header .almara-header-lang a:hover, html body .elementor-location-header .almara-header-lang-widget a:hover, html body .elementor-location-header .almara-header-lang select:hover, html body .elementor-location-header .almara-header-lang-widget select:hover{ background:var(--almara-header-lang-bg-hover)!important; color:var(--almara-header-lang-ink)!important; transform:translateY(-1px)!important; box-shadow:0 14px 28px rgba(0,0,0,.16)!important; } html body .elementor-location-header .almara-header-lang img, html body .elementor-location-header .almara-header-lang-widget img{ width:18px!important; height:auto!important; margin:0 5px 0 0!important; display:inline-block!important; } /* Tablet: Logo | Language | Burger/Nav | CTA. */ @media (max-width:1024px) and (min-width:768px){ html body .elementor-location-header .almara-header-v2 > .e-con-inner{ display:grid!important; grid-template-columns:minmax(0,1fr) auto auto auto!important; align-items:center!important; gap:14px!important; } html body .elementor-location-header .almara-header-logo{ grid-column:1!important; grid-row:1!important; justify-self:start!important; } html body .elementor-location-header .almara-header-lang, html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.almara-header-lang-widget), html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.elementor-widget-polylang-language-switcher){ grid-column:2!important; grid-row:1!important; justify-self:end!important; } html body .elementor-location-header .almara-header-nav{ grid-column:3!important; grid-row:1!important; justify-self:end!important; } html body .elementor-location-header .almara-header-cta{ grid-column:4!important; grid-row:1!important; justify-self:end!important; width:auto!important; margin:0!important; } } /* Mobile: Logo | Language | Burger/Nav. Header CTA hidden. */ @media (max-width:767px){ html body .elementor-location-header .almara-header-v2{ padding:12px 14px!important; } html body .elementor-location-header .almara-header-v2 > .e-con-inner{ display:grid!important; grid-template-columns:minmax(0,1fr) auto auto!important; align-items:center!important; gap:10px!important; } html body .elementor-location-header .almara-header-logo{ grid-column:1!important; grid-row:1!important; justify-self:start!important; min-width:0!important; } html body .elementor-location-header .almara-header-logo a{ min-height:50px!important; max-width:100%!important; } html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img{ max-width:clamp(172px,52vw,204px)!important; max-height:54px!important; } html body .elementor-location-header .almara-header-lang, html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.almara-header-lang-widget), html body .elementor-location-header .almara-header-v2 > .e-con-inner > .elementor-element:has(.elementor-widget-polylang-language-switcher){ grid-column:2!important; grid-row:1!important; justify-self:end!important; align-self:center!important; } html body .elementor-location-header .almara-header-nav{ grid-column:3!important; grid-row:1!important; justify-self:end!important; align-self:center!important; width:auto!important; margin:0!important; } html body .elementor-location-header .almara-header-cta, html body .elementor-location-header .elementor-widget-button.almara-header-cta{ display:none!important; } html body .elementor-location-header .almara-header-lang a, html body .elementor-location-header .almara-header-lang-widget a, html body .elementor-location-header .almara-header-lang select, html body .elementor-location-header .almara-header-lang-widget select, html body .elementor-location-header .almara-header-lang .pll-switcher-select, html body .elementor-location-header .almara-header-lang-widget .pll-switcher-select{ min-width:40px!important; height:32px!important; min-height:32px!important; padding:0 11px!important; font-size:12px!important; } } @media (max-width:380px){ html body .elementor-location-header .almara-header-logo img, html body .elementor-location-header .elementor-widget-theme-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-site-logo.almara-header-logo img, html body .elementor-location-header .elementor-widget-image.almara-header-logo img{ max-width:clamp(158px,49vw,190px)!important; } } /* ========================================================= ALMARA Locations B2C v1.5.5 — POST-REDESIGN OVERRIDE Scope: Locations v1.5.x only Load position: MUST be appended to /assets/almara-redesign.css Reason: almara-redesign.css is loaded after almara-platform.css on the live page. Architecture: CSS only, no JS, no layout HTML widgets, no shortcode content. ========================================================= */ /* ---------- Tokens ---------- */ :root { --almara-blue: #1F3C4C; --almara-aqua: #6EC1C2; --almara-sand: #F4EDE4; --almara-white: #FFFFFF; --almara-ink: #1F3C4C; --almara-muted: rgba(31, 60, 76, 0.72); --almara-border: rgba(31, 60, 76, 0.15); --almara-shadow-soft: 0 18px 46px rgba(31, 60, 76, 0.08); --almara-shadow-card: 0 24px 64px rgba(31, 60, 76, 0.10); --almara-font-display: "Cormorant Garamond", Georgia, serif; --almara-font-ui: "Inter", Arial, sans-serif; } body.elementor-page #almara-locations-v150-hero, body.elementor-page #almara-locations-v150-find, body.elementor-page #almara-locations-v150-spots, body.elementor-page #almara-locations-v150-types, body.elementor-page #almara-locations-v150-status, body.elementor-page #almara-locations-v150-final { box-sizing: border-box !important; width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; overflow: visible !important; } body.elementor-page #almara-locations-v150-hero > .e-con-inner, body.elementor-page #almara-locations-v150-find > .e-con-inner, body.elementor-page #almara-locations-v150-spots > .e-con-inner, body.elementor-page #almara-locations-v150-types > .e-con-inner, body.elementor-page #almara-locations-v150-status > .e-con-inner, body.elementor-page #almara-locations-v150-final > .e-con-inner { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } /* ---------- Hero ---------- */ body.elementor-page #almara-locations-v150-hero { display: grid !important; grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1.08fr) !important; align-items: center !important; column-gap: clamp(48px, 6vw, 86px) !important; row-gap: 42px !important; padding-top: clamp(72px, 8vw, 118px) !important; padding-bottom: clamp(58px, 7vw, 98px) !important; } body.elementor-page #almara-locations-v150-hero > .e-con-inner { display: contents !important; } body.elementor-page #almara-locations-v150-hero .almara-copy, body.elementor-page #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } body.elementor-page #almara-locations-v150-hero .almara-coastline-visual, body.elementor-page #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { width: 100% !important; max-width: 100% !important; margin: 0 !important; overflow: hidden !important; border-radius: 24px !important; box-shadow: 0 26px 70px rgba(31, 60, 76, 0.12) !important; } body.elementor-page #almara-locations-v150-hero .almara-coastline-visual img { display: block !important; width: 100% !important; height: clamp(280px, 28vw, 390px) !important; object-fit: cover !important; border-radius: 24px !important; } body.elementor-page #almara-locations-v150-hero .almara-actions, body.elementor-page #almara-locations-v150-final .almara-actions { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important; margin-top: 30px !important; } /* ---------- Typography hardening ---------- */ body.elementor-page #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, body.elementor-page #almara-locations-v150-hero h1, body.elementor-page #almara-locations-v150-find .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-spots .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-types .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-status .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-final .almara-section-title .elementor-heading-title { font-family: var(--almara-font-display) !important; color: var(--almara-blue) !important; font-weight: 600 !important; letter-spacing: -0.012em !important; text-transform: none !important; } body.elementor-page #almara-locations-v150-hero .almara-hero-title .elementor-heading-title { font-size: clamp(52px, 5.5vw, 84px) !important; line-height: 1.03 !important; max-width: 650px !important; } body.elementor-page #almara-locations-v150-find .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-spots .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-types .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-status .almara-section-title .elementor-heading-title, body.elementor-page #almara-locations-v150-final .almara-section-title .elementor-heading-title { font-size: clamp(36px, 3.2vw, 52px) !important; line-height: 1.08 !important; } body.elementor-page .almara-eyebrow, body.elementor-page .almara-eyebrow p, body.elementor-page .almara-v150-card-kicker, body.elementor-page .almara-v150-card-kicker p { font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1.4 !important; font-weight: 800 !important; letter-spacing: .20em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; margin: 0 0 14px !important; } body.elementor-page .almara-copy, body.elementor-page .almara-copy p, body.elementor-page .almara-lead, body.elementor-page .almara-lead p, body.elementor-page .almara-v150-section-lead, body.elementor-page .almara-v150-section-lead p { font-family: var(--almara-font-ui) !important; font-size: 16px !important; line-height: 1.7 !important; color: var(--almara-muted) !important; } /* ---------- Shared section heads ---------- */ body.elementor-page .almara-v150-section-head, body.elementor-page .almara-v150-section-head > .e-con-inner { box-sizing: border-box !important; width: min(780px, 100%) !important; max-width: 780px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; align-items: center !important; } body.elementor-page .almara-v150-section-head .almara-copy, body.elementor-page .almara-v150-section-head .almara-copy p, body.elementor-page .almara-v150-section-head .almara-v150-section-lead, body.elementor-page .almara-v150-section-head .almara-v150-section-lead p { text-align: center !important; max-width: 620px !important; margin-left: auto !important; margin-right: auto !important; } /* ---------- Finder panel ---------- */ body.elementor-page #almara-locations-v150-find { padding-top: clamp(70px, 8vw, 112px) !important; padding-bottom: clamp(64px, 8vw, 104px) !important; } body.elementor-page #almara-locations-v150-find .almara-filter-panel { box-sizing: border-box !important; display: block !important; width: min(980px, 100%) !important; max-width: 980px !important; margin: 42px auto 0 !important; padding: 22px !important; border: 1px solid var(--almara-border) !important; border-radius: 28px !important; background: rgba(255, 255, 255, .66) !important; box-shadow: var(--almara-shadow-soft) !important; overflow: visible !important; } body.elementor-page #almara-locations-v150-find .almara-filter-panel > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } body.elementor-page #almara-locations-v150-find .almara-filter-group { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } body.elementor-page #almara-locations-v150-find .almara-filter-group > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: 150px minmax(0, 1fr) !important; align-items: center !important; column-gap: 18px !important; row-gap: 12px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 16px 18px !important; border-radius: 18px !important; background: rgba(244, 237, 228, .62) !important; } body.elementor-page #almara-locations-v150-find .almara-filter-label, body.elementor-page #almara-locations-v150-find .almara-filter-label p { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; text-align: left !important; font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1.25 !important; font-weight: 850 !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; } body.elementor-page #almara-locations-v150-find .almara-filter-chip-row, body.elementor-page #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; align-content: center !important; justify-content: flex-start !important; gap: 8px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } body.elementor-page #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button, body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip { box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 auto !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; align-self: center !important; } body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-widget-container, body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-button-wrapper { display: inline-flex !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; min-height: 32px !important; height: 32px !important; padding: 0 14px !important; margin: 0 !important; border-radius: 999px !important; border: 1px solid rgba(31, 60, 76, .14) !important; background: rgba(255, 255, 255, .86) !important; color: rgba(31, 60, 76, .78) !important; box-shadow: none !important; font-family: var(--almara-font-ui) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: 0 !important; text-align: center !important; text-transform: none !important; white-space: nowrap !important; transform: none !important; } body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button *, body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-button-text { color: inherit !important; font: inherit !important; line-height: 1 !important; white-space: nowrap !important; } body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, body.elementor-page #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button:hover { background: var(--almara-blue) !important; border-color: var(--almara-blue) !important; color: #fff !important; box-shadow: 0 10px 22px rgba(31, 60, 76, .12) !important; } body.elementor-page #almara-locations-v150-find .almara-v150-microcopy, body.elementor-page #almara-locations-v150-find .almara-v150-microcopy p { max-width: 760px !important; margin: 20px auto 0 !important; text-align: center !important; font-size: 13px !important; color: rgba(31, 60, 76, .48) !important; } /* ---------- Location loop spacing ---------- */ body.elementor-page #almara-locations-v150-spots { padding-top: clamp(58px, 7vw, 96px) !important; padding-bottom: clamp(70px, 8vw, 112px) !important; } body.elementor-page #almara-locations-v150-spots .almara-locations-single-section { width: 100% !important; max-width: 100% !important; margin-top: 46px !important; } /* ---------- Type + Status card grids ---------- */ body.elementor-page #almara-locations-v150-types, body.elementor-page #almara-locations-v150-status, body.elementor-page #almara-locations-v150-final { padding-top: clamp(68px, 8vw, 112px) !important; padding-bottom: clamp(68px, 8vw, 112px) !important; } body.elementor-page #almara-locations-v150-types .almara-v150-card-grid, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid, body.elementor-page #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 22px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 42px auto 0 !important; padding: 0 !important; align-items: stretch !important; } body.elementor-page #almara-locations-v150-types .almara-v150-type-card, body.elementor-page #almara-locations-v150-status .almara-v150-card { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 230px !important; margin: 0 !important; padding: 28px 26px !important; border: 1px solid var(--almara-border) !important; border-top: 3px solid rgba(110, 193, 194, .78) !important; border-radius: 22px !important; background: rgba(255, 255, 255, .74) !important; box-shadow: var(--almara-shadow-soft) !important; overflow: hidden !important; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background-color .22s ease !important; } body.elementor-page #almara-locations-v150-types .almara-v150-type-card:hover, body.elementor-page #almara-locations-v150-status .almara-v150-card:hover { transform: translateY(-5px) !important; box-shadow: var(--almara-shadow-card) !important; border-color: rgba(110, 193, 194, .54) !important; background: rgba(255, 255, 255, .88) !important; } body.elementor-page #almara-locations-v150-types .almara-card-title .elementor-heading-title, body.elementor-page #almara-locations-v150-status .almara-card-title .elementor-heading-title { font-family: var(--almara-font-display) !important; font-size: clamp(24px, 2vw, 32px) !important; line-height: 1.12 !important; color: var(--almara-blue) !important; margin: 0 0 10px !important; } body.elementor-page #almara-locations-v150-status .almara-v150-card-number, body.elementor-page #almara-locations-v150-status .almara-v150-card-number p { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 24px !important; margin: 0 0 18px !important; border-radius: 999px !important; background: rgba(110, 193, 194, .18) !important; color: rgba(31, 60, 76, .72) !important; font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1 !important; font-weight: 850 !important; letter-spacing: .08em !important; } /* ---------- Final CTA cards ---------- */ body.elementor-page #almara-locations-v150-final .almara-v150-final-grid, body.elementor-page #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 auto !important; padding: 0 !important; align-items: stretch !important; } body.elementor-page #almara-locations-v150-final .almara-v150-final-card { box-sizing: border-box !important; min-height: 330px !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: space-between !important; padding: clamp(34px, 4vw, 54px) !important; border: 1px solid var(--almara-border) !important; border-radius: 24px !important; background: rgba(255, 255, 255, .74) !important; box-shadow: var(--almara-shadow-soft) !important; } body.elementor-page #almara-locations-v150-final .almara-v150-final-card--dark { background: var(--almara-blue) !important; border-color: rgba(31, 60, 76, .22) !important; } body.elementor-page #almara-locations-v150-final .almara-v150-final-card--dark, body.elementor-page #almara-locations-v150-final .almara-v150-final-card--dark *, body.elementor-page #almara-locations-v150-final .almara-v150-final-card--dark p, body.elementor-page #almara-locations-v150-final .almara-v150-final-card--dark .elementor-heading-title { color: #fff !important; } /* ---------- Buttons ---------- */ body.elementor-page #almara-locations-v150-hero .almara-el-btn .elementor-button, body.elementor-page #almara-locations-v150-final .almara-el-btn .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 46px !important; padding: 0 22px !important; border-radius: 999px !important; font-family: var(--almara-font-ui) !important; font-size: 14px !important; line-height: 1 !important; font-weight: 800 !important; text-decoration: none !important; box-shadow: 0 12px 28px rgba(31, 60, 76, .16) !important; } body.elementor-page .almara-el-btn--primary .elementor-button { background: var(--almara-blue) !important; color: #fff !important; } body.elementor-page .almara-el-btn--secondary .elementor-button { background: rgba(255, 255, 255, .78) !important; color: var(--almara-blue) !important; border: 1px solid rgba(31, 60, 76, .16) !important; } body.elementor-page .almara-el-btn--light .elementor-button { background: #fff !important; color: var(--almara-blue) !important; } /* ---------- Tablet ---------- */ @media (max-width: 1180px) { body.elementor-page #almara-locations-v150-hero, body.elementor-page #almara-locations-v150-find, body.elementor-page #almara-locations-v150-spots, body.elementor-page #almara-locations-v150-types, body.elementor-page #almara-locations-v150-status, body.elementor-page #almara-locations-v150-final { width: min(980px, calc(100% - 48px)) !important; max-width: 980px !important; } body.elementor-page #almara-locations-v150-hero { grid-template-columns: 1fr !important; } body.elementor-page #almara-locations-v150-types .almara-v150-card-grid, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid, body.elementor-page #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } /* ---------- Mobile ---------- */ @media (max-width: 767px) { body.elementor-page #almara-locations-v150-hero, body.elementor-page #almara-locations-v150-find, body.elementor-page #almara-locations-v150-spots, body.elementor-page #almara-locations-v150-types, body.elementor-page #almara-locations-v150-status, body.elementor-page #almara-locations-v150-final { width: min(390px, calc(100% - 32px)) !important; max-width: 390px !important; } body.elementor-page #almara-locations-v150-hero { display: flex !important; flex-direction: column !important; padding-top: 44px !important; padding-bottom: 54px !important; } body.elementor-page #almara-locations-v150-hero > .e-con-inner { display: flex !important; flex-direction: column !important; gap: 28px !important; } body.elementor-page #almara-locations-v150-hero .almara-hero-title .elementor-heading-title { font-size: clamp(40px, 11vw, 54px) !important; line-height: 1.04 !important; } body.elementor-page #almara-locations-v150-find .almara-filter-panel { padding: 18px !important; border-radius: 24px !important; } body.elementor-page #almara-locations-v150-find .almara-filter-group > .e-con-inner { grid-template-columns: 1fr !important; align-items: start !important; padding: 15px !important; } body.elementor-page #almara-locations-v150-find .almara-filter-chip-row, body.elementor-page #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { justify-content: flex-start !important; } body.elementor-page #almara-locations-v150-types .almara-v150-card-grid, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid, body.elementor-page #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, body.elementor-page #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner, body.elementor-page #almara-locations-v150-final .almara-v150-final-grid, body.elementor-page #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations B2C v1.5.6 — SELECTOR SCOPE FIX Reason: the live body class is not reliably body.elementor-page on this setup. This block repeats the Locations layout rules without that prefix. Architecture: CSS only, no JS, no layout HTML widgets, no shortcode content. ========================================================= */ #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final, #almara-locations-v150-hero *, #almara-locations-v150-find *, #almara-locations-v150-spots *, #almara-locations-v150-types *, #almara-locations-v150-status *, #almara-locations-v150-final * { box-sizing: border-box !important; } #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final { --width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 0 !important; min-width: 0 !important; } #almara-locations-v150-find .almara-filter-panel, #almara-locations-v150-find .almara-filter-group, #almara-locations-v150-find .almara-filter-chip-row, #almara-locations-v150-types .almara-v150-card-grid, #almara-locations-v150-status .almara-v150-card-grid, #almara-locations-v150-final .almara-v150-final-grid { --width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 0 !important; min-width: 0 !important; } /* ========================================================= ALMARA Locations B2C v1.5.6 — UNPREFIXED OVERRIDE Scope: Locations v1.5.x only Load position: MUST be appended to /assets/almara-redesign.css Reason: almara-redesign.css is loaded after almara-platform.css on the live page. Architecture: CSS only, no JS, no layout HTML widgets, no shortcode content. ========================================================= */ /* ---------- Tokens ---------- */ :root { --almara-blue: #1F3C4C; --almara-aqua: #6EC1C2; --almara-sand: #F4EDE4; --almara-white: #FFFFFF; --almara-ink: #1F3C4C; --almara-muted: rgba(31, 60, 76, 0.72); --almara-border: rgba(31, 60, 76, 0.15); --almara-shadow-soft: 0 18px 46px rgba(31, 60, 76, 0.08); --almara-shadow-card: 0 24px 64px rgba(31, 60, 76, 0.10); --almara-font-display: "Cormorant Garamond", Georgia, serif; --almara-font-ui: "Inter", Arial, sans-serif; } html body #almara-locations-v150-hero, html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { box-sizing: border-box !important; width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; overflow: visible !important; } html body #almara-locations-v150-hero > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner, html body #almara-locations-v150-spots > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner { width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } /* ---------- Hero ---------- */ html body #almara-locations-v150-hero { display: grid !important; grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1.08fr) !important; align-items: center !important; column-gap: clamp(48px, 6vw, 86px) !important; row-gap: 42px !important; padding-top: clamp(72px, 8vw, 118px) !important; padding-bottom: clamp(58px, 7vw, 98px) !important; } html body #almara-locations-v150-hero > .e-con-inner { display: contents !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { width: 100% !important; max-width: 100% !important; margin: 0 !important; overflow: hidden !important; border-radius: 24px !important; box-shadow: 0 26px 70px rgba(31, 60, 76, 0.12) !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { display: block !important; width: 100% !important; height: clamp(280px, 28vw, 390px) !important; object-fit: cover !important; border-radius: 24px !important; } html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-final .almara-actions { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 12px !important; margin-top: 30px !important; } /* ---------- Typography hardening ---------- */ html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero h1, html body #almara-locations-v150-find .almara-section-title .elementor-heading-title, html body #almara-locations-v150-spots .almara-section-title .elementor-heading-title, html body #almara-locations-v150-types .almara-section-title .elementor-heading-title, html body #almara-locations-v150-status .almara-section-title .elementor-heading-title, html body #almara-locations-v150-final .almara-section-title .elementor-heading-title { font-family: var(--almara-font-display) !important; color: var(--almara-blue) !important; font-weight: 600 !important; letter-spacing: -0.012em !important; text-transform: none !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title { font-size: clamp(52px, 5.5vw, 84px) !important; line-height: 1.03 !important; max-width: 650px !important; } html body #almara-locations-v150-find .almara-section-title .elementor-heading-title, html body #almara-locations-v150-spots .almara-section-title .elementor-heading-title, html body #almara-locations-v150-types .almara-section-title .elementor-heading-title, html body #almara-locations-v150-status .almara-section-title .elementor-heading-title, html body #almara-locations-v150-final .almara-section-title .elementor-heading-title { font-size: clamp(36px, 3.2vw, 52px) !important; line-height: 1.08 !important; } html body .almara-eyebrow, html body .almara-eyebrow p, html body .almara-v150-card-kicker, html body .almara-v150-card-kicker p { font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1.4 !important; font-weight: 800 !important; letter-spacing: .20em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; margin: 0 0 14px !important; } html body .almara-copy, html body .almara-copy p, html body .almara-lead, html body .almara-lead p, html body .almara-v150-section-lead, html body .almara-v150-section-lead p { font-family: var(--almara-font-ui) !important; font-size: 16px !important; line-height: 1.7 !important; color: var(--almara-muted) !important; } /* ---------- Shared section heads ---------- */ html body .almara-v150-section-head, html body .almara-v150-section-head > .e-con-inner { box-sizing: border-box !important; width: min(780px, 100%) !important; max-width: 780px !important; margin-left: auto !important; margin-right: auto !important; text-align: center !important; align-items: center !important; } html body .almara-v150-section-head .almara-copy, html body .almara-v150-section-head .almara-copy p, html body .almara-v150-section-head .almara-v150-section-lead, html body .almara-v150-section-head .almara-v150-section-lead p { text-align: center !important; max-width: 620px !important; margin-left: auto !important; margin-right: auto !important; } /* ---------- Finder panel ---------- */ html body #almara-locations-v150-find { padding-top: clamp(70px, 8vw, 112px) !important; padding-bottom: clamp(64px, 8vw, 104px) !important; } html body #almara-locations-v150-find .almara-filter-panel { box-sizing: border-box !important; display: block !important; width: min(980px, 100%) !important; max-width: 980px !important; margin: 42px auto 0 !important; padding: 22px !important; border: 1px solid var(--almara-border) !important; border-radius: 28px !important; background: rgba(255, 255, 255, .66) !important; box-shadow: var(--almara-shadow-soft) !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-panel > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } html body #almara-locations-v150-find .almara-filter-group { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-group > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: 150px minmax(0, 1fr) !important; align-items: center !important; column-gap: 18px !important; row-gap: 12px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 16px 18px !important; border-radius: 18px !important; background: rgba(244, 237, 228, .62) !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-label p { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; text-align: left !important; font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1.25 !important; font-weight: 850 !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; } html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; align-content: center !important; justify-content: flex-start !important; gap: 8px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip { box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 auto !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; align-self: center !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-widget-container, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-button-wrapper { display: inline-flex !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; min-height: 32px !important; height: 32px !important; padding: 0 14px !important; margin: 0 !important; border-radius: 999px !important; border: 1px solid rgba(31, 60, 76, .14) !important; background: rgba(255, 255, 255, .86) !important; color: rgba(31, 60, 76, .78) !important; box-shadow: none !important; font-family: var(--almara-font-ui) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: 0 !important; text-align: center !important; text-transform: none !important; white-space: nowrap !important; transform: none !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button *, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-button-text { color: inherit !important; font: inherit !important; line-height: 1 !important; white-space: nowrap !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button:hover { background: var(--almara-blue) !important; border-color: var(--almara-blue) !important; color: #fff !important; box-shadow: 0 10px 22px rgba(31, 60, 76, .12) !important; } html body #almara-locations-v150-find .almara-v150-microcopy, html body #almara-locations-v150-find .almara-v150-microcopy p { max-width: 760px !important; margin: 20px auto 0 !important; text-align: center !important; font-size: 13px !important; color: rgba(31, 60, 76, .48) !important; } /* ---------- Location loop spacing ---------- */ html body #almara-locations-v150-spots { padding-top: clamp(58px, 7vw, 96px) !important; padding-bottom: clamp(70px, 8vw, 112px) !important; } html body #almara-locations-v150-spots .almara-locations-single-section { width: 100% !important; max-width: 100% !important; margin-top: 46px !important; } /* ---------- Type + Status card grids ---------- */ html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { padding-top: clamp(68px, 8vw, 112px) !important; padding-bottom: clamp(68px, 8vw, 112px) !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 22px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 42px auto 0 !important; padding: 0 !important; align-items: stretch !important; } html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-status .almara-v150-card { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 230px !important; margin: 0 !important; padding: 28px 26px !important; border: 1px solid var(--almara-border) !important; border-top: 3px solid rgba(110, 193, 194, .78) !important; border-radius: 22px !important; background: rgba(255, 255, 255, .74) !important; box-shadow: var(--almara-shadow-soft) !important; overflow: hidden !important; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, background-color .22s ease !important; } html body #almara-locations-v150-types .almara-v150-type-card:hover, html body #almara-locations-v150-status .almara-v150-card:hover { transform: translateY(-5px) !important; box-shadow: var(--almara-shadow-card) !important; border-color: rgba(110, 193, 194, .54) !important; background: rgba(255, 255, 255, .88) !important; } html body #almara-locations-v150-types .almara-card-title .elementor-heading-title, html body #almara-locations-v150-status .almara-card-title .elementor-heading-title { font-family: var(--almara-font-display) !important; font-size: clamp(24px, 2vw, 32px) !important; line-height: 1.12 !important; color: var(--almara-blue) !important; margin: 0 0 10px !important; } html body #almara-locations-v150-status .almara-v150-card-number, html body #almara-locations-v150-status .almara-v150-card-number p { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 24px !important; margin: 0 0 18px !important; border-radius: 999px !important; background: rgba(110, 193, 194, .18) !important; color: rgba(31, 60, 76, .72) !important; font-family: var(--almara-font-ui) !important; font-size: 11px !important; line-height: 1 !important; font-weight: 850 !important; letter-spacing: .08em !important; } /* ---------- Final CTA cards ---------- */ html body #almara-locations-v150-final .almara-v150-final-grid, html body #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner { box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 auto !important; padding: 0 !important; align-items: stretch !important; } html body #almara-locations-v150-final .almara-v150-final-card { box-sizing: border-box !important; min-height: 330px !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: space-between !important; padding: clamp(34px, 4vw, 54px) !important; border: 1px solid var(--almara-border) !important; border-radius: 24px !important; background: rgba(255, 255, 255, .74) !important; box-shadow: var(--almara-shadow-soft) !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark { background: var(--almara-blue) !important; border-color: rgba(31, 60, 76, .22) !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark, html body #almara-locations-v150-final .almara-v150-final-card--dark *, html body #almara-locations-v150-final .almara-v150-final-card--dark p, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-heading-title { color: #fff !important; } /* ---------- Buttons ---------- */ html body #almara-locations-v150-hero .almara-el-btn .elementor-button, html body #almara-locations-v150-final .almara-el-btn .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 46px !important; padding: 0 22px !important; border-radius: 999px !important; font-family: var(--almara-font-ui) !important; font-size: 14px !important; line-height: 1 !important; font-weight: 800 !important; text-decoration: none !important; box-shadow: 0 12px 28px rgba(31, 60, 76, .16) !important; } html body .almara-el-btn--primary .elementor-button { background: var(--almara-blue) !important; color: #fff !important; } html body .almara-el-btn--secondary .elementor-button { background: rgba(255, 255, 255, .78) !important; color: var(--almara-blue) !important; border: 1px solid rgba(31, 60, 76, .16) !important; } html body .almara-el-btn--light .elementor-button { background: #fff !important; color: var(--almara-blue) !important; } /* ---------- Tablet ---------- */ @media (max-width: 1180px) { html body #almara-locations-v150-hero, html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { width: min(980px, calc(100% - 48px)) !important; max-width: 980px !important; } html body #almara-locations-v150-hero { grid-template-columns: 1fr !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } /* ---------- Mobile ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-hero, html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { width: min(390px, calc(100% - 32px)) !important; max-width: 390px !important; } html body #almara-locations-v150-hero { display: flex !important; flex-direction: column !important; padding-top: 44px !important; padding-bottom: 54px !important; } html body #almara-locations-v150-hero > .e-con-inner { display: flex !important; flex-direction: column !important; gap: 28px !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title { font-size: clamp(40px, 11vw, 54px) !important; line-height: 1.04 !important; } html body #almara-locations-v150-find .almara-filter-panel { padding: 18px !important; border-radius: 24px !important; } html body #almara-locations-v150-find .almara-filter-group > .e-con-inner { grid-template-columns: 1fr !important; align-items: start !important; padding: 15px !important; } html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { justify-content: flex-start !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-final .almara-v150-final-grid, html body #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations B2C v1.5.7 — DOM-SHAPE HARD FIX Scope: Locations v1.5.x only Reason: Elementor container wrappers render as direct e-con children; previous class-scoped child selectors styled the section, but missed the actual panel/grid wrappers on the live DOM. Architecture: CSS only, no JS, no HTML layout widgets, no shortcode content. ========================================================= */ /* ---------- Finder: structural fallback panel ---------- */ html body #almara-locations-v150-find > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 auto !important; padding: 0 !important; } html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { box-sizing: border-box !important; display: block !important; width: min(980px, 100%) !important; max-width: 980px !important; margin: 42px auto 0 !important; padding: 22px !important; border: 1px solid rgba(31, 60, 76, .15) !important; border-radius: 28px !important; background: rgba(255, 255, 255, .68) !important; box-shadow: 0 18px 46px rgba(31, 60, 76, .08) !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-panel > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-group, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; overflow: visible !important; } /* Group row: works whether chips are wrapped in .almara-filter-chip-row or direct children. */ html body #almara-locations-v150-find .almara-filter-group > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 9px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 16px 18px !important; border-radius: 18px !important; background: rgba(244, 237, 228, .62) !important; overflow: visible !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-widget-text-editor:first-child { flex: 0 0 150px !important; width: 150px !important; max-width: 150px !important; min-width: 150px !important; margin: 0 !important; padding: 0 !important; align-self: center !important; text-align: left !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-label p, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child p { font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 11px !important; line-height: 1.25 !important; font-weight: 850 !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; } html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { box-sizing: border-box !important; flex: 1 1 0 !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; width: auto !important; max-width: none !important; min-width: min(100%, 420px) !important; margin: 0 !important; padding: 0 !important; overflow: visible !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-button { box-sizing: border-box !important; flex: 0 0 auto !important; display: inline-flex !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; align-self: center !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-widget-container, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip .elementor-button-wrapper, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button .elementor-widget-container, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button .elementor-button-wrapper { display: inline-flex !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button a.elementor-button, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-button a.elementor-button { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; min-height: 32px !important; height: 32px !important; padding: 0 14px !important; margin: 0 !important; border-radius: 999px !important; border: 1px solid rgba(31, 60, 76, .14) !important; background: rgba(255, 255, 255, .88) !important; color: rgba(31, 60, 76, .78) !important; box-shadow: none !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; text-align: center !important; text-decoration: none !important; text-transform: none !important; white-space: nowrap !important; transform: none !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button:hover, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button:first-child a.elementor-button { background: var(--almara-blue, #1F3C4C) !important; border-color: var(--almara-blue, #1F3C4C) !important; color: #fff !important; box-shadow: 0 10px 22px rgba(31, 60, 76, .12) !important; } /* ---------- Type/status cards: structural fallback grids ---------- */ html body #almara-locations-v150-types > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; width: 100% !important; max-width: 100% !important; margin: 0 auto !important; padding: 0 !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2), html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) { display: block !important; width: 100% !important; max-width: 100% !important; margin: 44px 0 0 !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 22px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; align-items: stretch !important; } html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-status .almara-v150-card, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; min-width: 0 !important; min-height: 240px !important; padding: 28px 26px !important; border: 1px solid rgba(31, 60, 76, .14) !important; border-top: 4px solid rgba(110, 193, 194, .78) !important; border-radius: 22px !important; background: rgba(255, 255, 255, .78) !important; box-shadow: 0 18px 46px rgba(31, 60, 76, .08) !important; overflow: hidden !important; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease !important; } html body #almara-locations-v150-types .almara-v150-type-card:hover, html body #almara-locations-v150-status .almara-v150-card:hover, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:hover, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:hover { transform: translateY(-5px) !important; box-shadow: 0 26px 64px rgba(31, 60, 76, .12) !important; border-color: rgba(110, 193, 194, .48) !important; } html body #almara-locations-v150-types .almara-v150-type-card > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; gap: 0 !important; margin: 0 !important; padding: 0 !important; } /* ---------- Final CTA structural fallback ---------- */ html body #almara-locations-v150-final .almara-v150-final-grid, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child { display: block !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } html body #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } html body #almara-locations-v150-final .almara-v150-final-card, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element { box-sizing: border-box !important; min-height: 320px !important; padding: clamp(34px, 4vw, 50px) !important; border: 1px solid rgba(31, 60, 76, .14) !important; border-radius: 24px !important; background: rgba(255, 255, 255, .78) !important; box-shadow: 0 18px 46px rgba(31, 60, 76, .08) !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child { background: var(--almara-blue, #1F3C4C) !important; color: #fff !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark *, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child * { color: #fff !important; } /* ---------- Responsive ---------- */ @media (max-width: 1180px) { html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 767px) { html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { padding: 18px !important; border-radius: 24px !important; } html body #almara-locations-v150-find .almara-filter-group > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner { flex-direction: column !important; align-items: flex-start !important; padding: 16px !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner { flex: 1 1 auto !important; width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-types .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-status .almara-v150-card-grid > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner, html body #almara-locations-v150-final .almara-v150-final-grid > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations B2C v1.5.8 — EXPERIENCE FINDER POLISH Scope: Locations v1.5.x only Purpose: - more premium / experience-led Finder UI - German/English labels remain editorial in Elementor JSON - no JS, no layout HTML widgets, no shortcode content Load position: appended to /assets/almara-redesign.css after v1.5.7 ========================================================= */ /* ---------- Finder: premium discovery panel ---------- */ html body #almara-locations-v150-find .almara-v150-microcopy, html body #almara-locations-v150-find .almara-v150-microcopy *, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor:last-child { display: none !important; } html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { position: relative !important; width: min(1060px, 100%) !important; max-width: 1060px !important; margin-top: 46px !important; padding: 22px !important; border-radius: 30px !important; border: 1px solid rgba(110, 193, 194, .30) !important; background: radial-gradient(circle at 12% 0%, rgba(110, 193, 194, .22), transparent 34%), radial-gradient(circle at 92% 10%, rgba(230, 165, 126, .14), transparent 30%), rgba(255, 255, 255, .74) !important; box-shadow: 0 28px 74px rgba(31, 60, 76, .105), inset 0 1px 0 rgba(255, 255, 255, .74) !important; } html body #almara-locations-v150-find .almara-filter-panel::before, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2)::before { content: "" !important; position: absolute !important; left: 28px !important; right: 28px !important; top: 0 !important; height: 3px !important; border-radius: 999px !important; background: linear-gradient(90deg, rgba(110, 193, 194, .18), rgba(110, 193, 194, .86), rgba(230, 165, 126, .44), rgba(110, 193, 194, .18)) !important; pointer-events: none !important; } html body #almara-locations-v150-find .almara-filter-panel > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { gap: 0 !important; } html body #almara-locations-v150-find .almara-filter-group, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { border-bottom: 1px solid rgba(31, 60, 76, .08) !important; } html body #almara-locations-v150-find .almara-filter-group:last-child, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:last-child { border-bottom: 0 !important; } html body #almara-locations-v150-find .almara-filter-group > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner { min-height: 76px !important; padding: 18px 20px !important; border-radius: 0 !important; background: transparent !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; gap: 18px !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-widget-text-editor:first-child { position: relative !important; flex: 0 0 154px !important; width: 154px !important; max-width: 154px !important; min-width: 154px !important; padding-left: 18px !important; } html body #almara-locations-v150-find .almara-filter-label::before, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child::before, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-widget-text-editor:first-child::before { content: "" !important; position: absolute !important; left: 0 !important; top: 50% !important; width: 7px !important; height: 7px !important; border-radius: 999px !important; background: var(--almara-aqua, #6EC1C2) !important; transform: translateY(-50%) !important; box-shadow: 0 0 0 5px rgba(110, 193, 194, .14) !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-label p, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child p { font-size: 10px !important; letter-spacing: .18em !important; color: rgba(31, 60, 76, .68) !important; } /* Chip rows: force the actual Elementor container and its inner wrapper to horizontal wrap. */ html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row.e-con, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .almara-filter-chip-row, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-element:nth-child(2), html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { --display: flex !important; --flex-direction: row !important; --flex-wrap: wrap !important; --justify-content: flex-start !important; --align-items: center !important; box-sizing: border-box !important; flex: 1 1 auto !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; align-content: center !important; gap: 9px !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) .elementor-widget-button { flex: 0 0 auto !important; width: auto !important; max-width: max-content !important; min-width: 0 !important; display: inline-flex !important; margin: 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button .elementor-widget-container, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button .elementor-button-wrapper, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button .elementor-widget-container, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button .elementor-button-wrapper { width: auto !important; max-width: max-content !important; min-width: 0 !important; display: inline-flex !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button a.elementor-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button { min-height: 34px !important; height: 34px !important; padding: 0 15px !important; border: 1px solid rgba(31, 60, 76, .13) !important; background: rgba(255, 255, 255, .84) !important; box-shadow: 0 8px 18px rgba(31, 60, 76, .055) !important; transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button:first-child a.elementor-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button:first-of-type a.elementor-button { background: var(--almara-blue, #1F3C4C) !important; border-color: var(--almara-blue, #1F3C4C) !important; color: #fff !important; box-shadow: 0 12px 26px rgba(31, 60, 76, .17) !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button:hover, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button a.elementor-button:hover, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button:hover { transform: translateY(-1px) !important; border-color: rgba(110, 193, 194, .55) !important; box-shadow: 0 12px 24px rgba(31, 60, 76, .105) !important; } /* ---------- Experience-led place cards ---------- */ html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { position: relative !important; min-height: 278px !important; padding: 32px 28px 30px !important; border-top: 1px solid rgba(110, 193, 194, .42) !important; background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)), radial-gradient(circle at 88% 10%, rgba(110,193,194,.22), transparent 34%) !important; } html body #almara-locations-v150-types .almara-v150-type-card::before, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element::before { content: "" !important; position: absolute !important; top: 18px !important; right: 20px !important; width: 52px !important; height: 52px !important; border-radius: 999px !important; background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.94), rgba(110,193,194,.28) 48%, rgba(110,193,194,.12) 100%) !important; box-shadow: 0 16px 34px rgba(31, 60, 76, .08) !important; pointer-events: none !important; } html body #almara-locations-v150-types .almara-v150-type-card::after, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element::after { position: absolute !important; right: 31px !important; top: 31px !important; font-size: 18px !important; line-height: 1 !important; color: rgba(31,60,76,.54) !important; pointer-events: none !important; } html body #almara-locations-v150-types .almara-v150-type-card:nth-child(1)::after, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:nth-child(1)::after { content: "≈" !important; } html body #almara-locations-v150-types .almara-v150-type-card:nth-child(2)::after, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:nth-child(2)::after { content: "◌" !important; } html body #almara-locations-v150-types .almara-v150-type-card:nth-child(3)::after, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:nth-child(3)::after { content: "△" !important; } html body #almara-locations-v150-types .almara-v150-type-card:nth-child(4)::after, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element:nth-child(4)::after { content: "⌁" !important; } html body #almara-locations-v150-types .almara-v150-card-kicker, html body #almara-locations-v150-types .almara-v150-card-kicker p { color: rgba(31, 60, 76, .58) !important; } html body #almara-locations-v150-types .almara-card-title .elementor-heading-title, html body #almara-locations-v150-types .almara-v150-type-card h3, html body #almara-locations-v150-types .almara-v150-type-card .elementor-heading-title { padding-right: 58px !important; } html body #almara-locations-v150-status .almara-v150-card, html body #almara-locations-v150-status > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { min-height: 250px !important; background: rgba(255,255,255,.80) !important; } html body #almara-locations-v150-status .almara-v150-card-number, html body #almara-locations-v150-status .almara-v150-card-number p { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 28px !important; height: 20px !important; border-radius: 999px !important; background: rgba(110, 193, 194, .16) !important; color: rgba(31, 60, 76, .70) !important; font-size: 9px !important; line-height: 1 !important; font-weight: 850 !important; margin-bottom: 16px !important; } /* ---------- Final CTA: more emotional guest card ---------- */ html body #almara-locations-v150-final .almara-v150-final-card--dark, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child { position: relative !important; overflow: hidden !important; background: radial-gradient(circle at 86% 12%, rgba(110, 193, 194, .26), transparent 33%), linear-gradient(135deg, #143343, #1F3C4C) !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark::after, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child::after { content: "" !important; position: absolute !important; right: -68px !important; bottom: -88px !important; width: 230px !important; height: 230px !important; border-radius: 999px !important; background: rgba(110, 193, 194, .12) !important; pointer-events: none !important; } @media (max-width: 767px) { html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { padding: 16px !important; border-radius: 26px !important; } html body #almara-locations-v150-find .almara-filter-group > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner { min-height: 0 !important; flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; padding: 17px 16px !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-group > .e-con-inner > .elementor-widget-text-editor:first-child, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-widget-text-editor:first-child { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .almara-filter-chip-row > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-element:nth-child(2), html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner { width: 100% !important; justify-content: flex-start !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button a.elementor-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button { min-height: 32px !important; height: 32px !important; padding: 0 12px !important; font-size: 11px !important; } html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-types > .e-con-inner > .elementor-element:nth-child(2) > .e-con-inner > .elementor-element { min-height: 230px !important; } } /* ========================================================= ALMARA Locations B2C v1.5.9 — FILTER LINK / LABEL POLISH Scope: Locations v1.5.x only Purpose: filter chips are URL-driven anchors now; no # top-jump. ========================================================= */ #almara-locations-v150-find .almara-filter-chip a.elementor-button, #almara-locations-v150-find .almara-filter-chip .elementor-button { cursor: pointer !important; } #almara-locations-v150-find .almara-filter-chip a.elementor-button:focus-visible { outline: 2px solid rgba(110, 193, 194, 0.9) !important; outline-offset: 3px !important; } /* ========================================================= ALMARA Locations B2C v1.6.1 — FILTER CLICK + ACTIVE STATE FIX Scope: Locations v1.5/v1.6 finder only Purpose: - Ensure Elementor filter pills are actually clickable. - Support JS/PHP URL filter interaction without changing layout. - Remove false active state from first child when another URL parameter is active. ========================================================= */ html body #almara-locations-v150-find, html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find .almara-filter-group, html body #almara-locations-v150-find .almara-filter-chip-row, html body #almara-locations-v150-find .elementor-widget-button, html body #almara-locations-v150-find .elementor-widget-button .elementor-widget-container, html body #almara-locations-v150-find .elementor-widget-button .elementor-button-wrapper, html body #almara-locations-v150-find .elementor-widget-button a.elementor-button, html body #almara-locations-v150-find .elementor-widget-button .elementor-button { pointer-events: auto !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button, html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button { position: relative !important; z-index: 5 !important; cursor: pointer !important; user-select: none !important; touch-action: manipulation !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button, html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button { text-decoration: none !important; } /* Neutral state wins over older :first-child active rules. JS/PHP class then re-applies the real active pill. */ html body #almara-locations-v150-find .almara-filter-group .elementor-widget-button a.elementor-button, html body #almara-locations-v150-find .almara-filter-chip-row .elementor-widget-button a.elementor-button { background: rgba(255,255,255,.84) !important; border-color: rgba(31,60,76,.13) !important; color: var(--almara-blue, #1F3C4C) !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, html body #almara-locations-v150-find .elementor-widget-button.is-almara-filter-active a.elementor-button { background: var(--almara-blue, #1F3C4C) !important; border-color: var(--almara-blue, #1F3C4C) !important; color: #fff !important; box-shadow: 0 12px 26px rgba(31,60,76,.17) !important; } html body #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button *, html body #almara-locations-v150-find .elementor-widget-button.is-almara-filter-active a.elementor-button * { color: #fff !important; } /* ALMARA Locations B2C v1.6.3 URL Language Safety - CSS unchanged from v1.6.1; interaction fixed in MU helper. */ /* ========================================================= ALMARA Locations B2C v1.6.6 — Filter Query + No Result Polish Scope: Locations finder / loop only Purpose: no-result state and strict active-pill styling; no layout JS. ========================================================= */ #almara-location-no-results, .almara-location-no-results { width: min(760px, 100%); margin: 34px auto 0 !important; padding: 24px 28px !important; border-radius: 22px !important; border: 1px solid rgba(110, 193, 194, 0.36) !important; background: rgba(255, 255, 255, 0.74) !important; box-shadow: 0 18px 44px rgba(31, 60, 76, 0.08) !important; color: rgba(31, 60, 76, 0.82) !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 15px !important; line-height: 1.65 !important; text-align: center !important; } #almara-locations-v150-find .elementor-widget-button.almara-filter-chip:not(.almara-filter-chip--active) a.elementor-button { background: rgba(255, 255, 255, 0.84) !important; color: var(--almara-blue, #1F3C4C) !important; } #almara-locations-v150-find .elementor-widget-button.almara-filter-chip.almara-filter-chip--active a.elementor-button, #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button.almara-filter-chip--active { background: var(--almara-blue, #1F3C4C) !important; color: #fff !important; } #almara-locations-v150-find .elementor-widget-button.almara-filter-chip.almara-filter-chip--active a.elementor-button *, #almara-locations-v150-find .elementor-widget-button.almara-filter-chip a.elementor-button.almara-filter-chip--active * { color: #fff !important; } /* ========================================================= ALMARA Locations B2C v1.6.10 — Loop Grid Left Alignment Fix Scope: Locations page only Purpose: after filtering, one or two result cards start left in the intended grid. ========================================================= */ #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, #almara-locations-v150-spots .almara-locations-grid .e-loop-container, #almara-locations-v150-spots .almara-locations-grid .elementor-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; justify-content: start !important; justify-items: stretch !important; align-items: stretch !important; column-gap: 36px !important; row-gap: 34px !important; } #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item, #almara-locations-v150-spots .almara-locations-grid .e-loop-item, #almara-locations-v150-spots .elementor-loop-container > .e-loop-item, #almara-locations-v150-spots .e-loop-container > .e-loop-item, #almara-locations-v150-spots .elementor-grid > .e-loop-item { grid-column: auto !important; grid-row: auto !important; justify-self: stretch !important; align-self: stretch !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } @media (max-width: 1024px) { #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, #almara-locations-v150-spots .almara-locations-grid .e-loop-container, #almara-locations-v150-spots .almara-locations-grid .elementor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 767px) { #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, #almara-locations-v150-spots .almara-locations-grid .e-loop-container, #almara-locations-v150-spots .almara-locations-grid .elementor-grid { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations B2C v1.6.11 — Filter UX + Badge Wrap Polish Scope: Locations page only Purpose: - no forced anchor jump after filter clicks (handled in Core JS v1.3.61) - immediate active state styling on widget AND anchor - badge pills stay single-line and wrap gracefully as pills, not as broken text ========================================================= */ #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button, #almara-locations-v150-find .elementor-widget-button.is-almara-filter-active a.elementor-button, #almara-locations-v150-find .elementor-widget-button a.elementor-button.almara-filter-chip--active, #almara-locations-v150-find .elementor-widget-button a.elementor-button.is-almara-filter-active { background: var(--almara-blue, #1F3C4C) !important; border-color: var(--almara-blue, #1F3C4C) !important; color: #fff !important; box-shadow: 0 12px 26px rgba(31, 60, 76, .17) !important; } #almara-locations-v150-find .elementor-widget-button.almara-filter-chip--active a.elementor-button *, #almara-locations-v150-find .elementor-widget-button.is-almara-filter-active a.elementor-button *, #almara-locations-v150-find .elementor-widget-button a.elementor-button.almara-filter-chip--active *, #almara-locations-v150-find .elementor-widget-button a.elementor-button.is-almara-filter-active * { color: #fff !important; } .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badges, #almara-locations-v150-spots .almara-location-badges, .almara-location-badges { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; align-content: flex-start !important; justify-content: flex-start !important; gap: 5px !important; min-height: 42px !important; margin: 8px 0 12px !important; overflow: visible !important; } .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badge, #almara-locations-v150-spots .almara-location-badge, .almara-location-badge { box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 auto !important; align-items: center !important; justify-content: center !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; max-width: none !important; padding: 0 7px !important; white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; line-height: 18px !important; font-size: 8px !important; letter-spacing: .085em !important; } .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badge *, #almara-locations-v150-spots .almara-location-badge *, .almara-location-badge * { white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; line-height: 18px !important; } @media (max-width: 1100px) { .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badges, #almara-locations-v150-spots .almara-location-badges, .almara-location-badges { gap: 4px !important; } .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badge, #almara-locations-v150-spots .almara-location-badge, .almara-location-badge { height: 17px !important; min-height: 17px !important; max-height: 17px !important; padding: 0 6px !important; font-size: 7.5px !important; line-height: 17px !important; letter-spacing: .075em !important; } } /* ========================================================= ALMARA Locations B2C v1.6.12 — Finder UX Polish Core pairing: ALMARA Platform Core SAFE v1.3.62 + Loader v1.9.17 Scope: Locations page only Purpose: - left-align Finder copy for stronger discovery / search behavior - show active filter summary + reset below the Finder panel - refine no-result message spacing ========================================================= */ html body #almara-locations-v150-find { text-align: left !important; } html body #almara-locations-v150-find > .e-con-inner { align-items: flex-start !important; } html body #almara-locations-v150-find .almara-eyebrow, html body #almara-locations-v150-find .almara-eyebrow p, html body #almara-locations-v150-find .almara-section-title, html body #almara-locations-v150-find .almara-section-title .elementor-heading-title, html body #almara-locations-v150-find .almara-copy, html body #almara-locations-v150-find .almara-copy p, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-heading, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-heading .elementor-heading-title, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor p { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-section-title .elementor-heading-title, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-heading .elementor-heading-title { max-width: 760px !important; } html body #almara-locations-v150-find .almara-copy, html body #almara-locations-v150-find .almara-copy p, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor p { max-width: 760px !important; } html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { margin-top: 38px !important; margin-left: auto !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-active-filter-summary { width: min(1180px, 100%) !important; display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; margin: 14px auto 0 !important; padding: 0 16px !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; color: rgba(31, 60, 76, 0.78) !important; } html body #almara-locations-v150-find .almara-active-filter-summary__label { display: inline-flex !important; align-items: center !important; min-height: 24px !important; margin-right: 2px !important; font-size: 12px !important; line-height: 1.2 !important; font-weight: 800 !important; letter-spacing: .055em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, .62) !important; } html body #almara-locations-v150-find .almara-active-filter-summary__pill { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 26px !important; padding: 0 11px !important; border-radius: 999px !important; background: rgba(110, 193, 194, .16) !important; border: 1px solid rgba(110, 193, 194, .34) !important; color: var(--almara-blue, #1F3C4C) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; white-space: nowrap !important; } html body #almara-locations-v150-find .almara-active-filter-summary__reset { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 26px !important; margin-left: 4px !important; color: rgba(31, 60, 76, .74) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; text-decoration: none !important; border-bottom: 1px solid rgba(31, 60, 76, .30) !important; transition: color .18s ease, border-color .18s ease, transform .18s ease !important; } html body #almara-locations-v150-find .almara-active-filter-summary__reset:hover, html body #almara-locations-v150-find .almara-active-filter-summary__reset:focus-visible { color: var(--almara-blue, #1F3C4C) !important; border-color: var(--almara-blue, #1F3C4C) !important; transform: translateY(-1px) !important; } #almara-location-no-results, .almara-location-no-results { margin: 24px auto 0 !important; max-width: 720px !important; } html body #almara-locations-v150-spots:has(#almara-location-no-results) { padding-top: clamp(54px, 6vw, 82px) !important; } @media (max-width: 767px) { html body #almara-locations-v150-find .almara-eyebrow, html body #almara-locations-v150-find .almara-eyebrow p, html body #almara-locations-v150-find .almara-section-title, html body #almara-locations-v150-find .almara-section-title .elementor-heading-title, html body #almara-locations-v150-find .almara-copy, html body #almara-locations-v150-find .almara-copy p, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-heading, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-heading .elementor-heading-title, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor, html body #almara-locations-v150-find > .e-con-inner > .elementor-widget-text-editor p { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-active-filter-summary { justify-content: center !important; text-align: center !important; padding-left: 0 !important; padding-right: 0 !important; } } /* ========================================================= ALMARA Locations B2C v1.6.13 — Alignment + Badge Wrapper Polish Core pairing: ALMARA Platform Core SAFE v1.3.63 + Loader v1.9.18 Scope: Locations page only Purpose: - left-align Finder and result section copy using the real Elementor DOM shape - remove forced large badge-wrapper background; only individual pills carry background - allow badge rows to grow naturally only when pills wrap to a second line ========================================================= */ /* Finder + selected-location section heads: override older global centered section-head rules. */ html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner { width: min(1180px, 100%) !important; max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important; text-align: left !important; align-items: flex-start !important; justify-content: flex-start !important; } html body #almara-locations-v150-find .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner > .elementor-element { width: min(760px, 100%) !important; max-width: 760px !important; margin-left: 0 !important; margin-right: auto !important; text-align: left !important; align-self: flex-start !important; } html body #almara-locations-v150-find .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-find .almara-v150-section-head .almara-eyebrow p, html body #almara-locations-v150-find .almara-v150-section-head .almara-section-title, html body #almara-locations-v150-find .almara-v150-section-head .almara-section-title .elementor-heading-title, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-find .almara-v150-section-head .almara-v150-section-lead, html body #almara-locations-v150-find .almara-v150-section-head .almara-v150-section-lead p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-spots .almara-v150-section-head .almara-eyebrow p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-section-title, html body #almara-locations-v150-spots .almara-v150-section-head .almara-section-title .elementor-heading-title, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-v150-section-lead, html body #almara-locations-v150-spots .almara-v150-section-head .almara-v150-section-lead p { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-v150-section-head .almara-copy, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-find .almara-v150-section-head .almara-v150-section-lead, html body #almara-locations-v150-find .almara-v150-section-head .almara-v150-section-lead p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-v150-section-lead, html body #almara-locations-v150-spots .almara-v150-section-head .almara-v150-section-lead p { max-width: 720px !important; } /* Keep the premium panel centered, but make the explanatory copy above it left-aligned. */ html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .almara-filter-panel, html body #almara-locations-v150-find > .e-con-inner > .elementor-element:nth-child(2) { margin-left: auto !important; margin-right: auto !important; } /* Badge rows: wrapper is layout-only, not a visible pill. */ html body .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badges, html body #almara-locations-v150-spots .almara-location-badges, html body .almara-location-badges, html body .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-badge, html body #almara-locations-v150-spots .almara-badge, html body .almara-badge { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; align-content: flex-start !important; justify-content: flex-start !important; gap: 5px !important; width: 100% !important; min-height: 0 !important; height: auto !important; margin: 8px 0 12px !important; padding: 0 !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; overflow: visible !important; } /* Only the actual badge items get the light background. */ html body .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-location-badge, html body #almara-locations-v150-spots .almara-location-badge, html body .almara-location-badge, html body .elementor-widget-loop-grid:has(.almara-location-card) .almara-location-card .almara-badge > span, html body #almara-locations-v150-spots .almara-badge > span, html body .almara-badge > span { box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 auto !important; align-items: center !important; justify-content: center !important; gap: 4px !important; width: auto !important; max-width: 100% !important; height: 18px !important; min-height: 18px !important; max-height: 18px !important; margin: 0 !important; padding: 0 7px !important; border: 0 !important; border-radius: 999px !important; background: rgba(110, 193, 194, .18) !important; color: rgba(31, 60, 76, .76) !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 8px !important; line-height: 18px !important; font-weight: 800 !important; letter-spacing: .08em !important; text-transform: uppercase !important; text-align: center !important; white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; writing-mode: horizontal-tb !important; transform: none !important; } html body .almara-location-badge *, html body .almara-badge > span * { white-space: nowrap !important; overflow-wrap: normal !important; word-break: keep-all !important; line-height: 18px !important; } @media (max-width: 767px) { html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-find .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner > .elementor-element { width: 100% !important; max-width: 100% !important; align-items: center !important; text-align: center !important; } html body #almara-locations-v150-find .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-find .almara-v150-section-head .almara-eyebrow p, html body #almara-locations-v150-find .almara-v150-section-head .almara-section-title, html body #almara-locations-v150-find .almara-v150-section-head .almara-section-title .elementor-heading-title, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-spots .almara-v150-section-head .almara-eyebrow p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-section-title, html body #almara-locations-v150-spots .almara-v150-section-head .almara-section-title .elementor-heading-title, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy p { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } } /* ========================================================= ALMARA Locations B2C v1.6.14 — Section Head Left Alignment Final Core pairing: ALMARA Platform Core SAFE v1.3.63+ stable Scope: Locations page only Purpose: - apply the left-aligned Finder editorial rhythm to ALL B2C Locations sections - override Elementor/global centered section-head rules more broadly - keep mobile centered for readability CSS-only. No PHP/JS/query changes. ========================================================= */ @media (min-width: 768px) { html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { text-align: left !important; } html body #almara-locations-v150-find > .e-con-inner, html body #almara-locations-v150-spots > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner { align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; } html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-types .almara-v150-section-head, html body #almara-locations-v150-status .almara-v150-section-head, html body #almara-locations-v150-final .almara-v150-section-head, html body #almara-locations-v150-find > .e-con-inner > .almara-v150-section-head, html body #almara-locations-v150-spots > .e-con-inner > .almara-v150-section-head, html body #almara-locations-v150-types > .e-con-inner > .almara-v150-section-head, html body #almara-locations-v150-status > .e-con-inner > .almara-v150-section-head, html body #almara-locations-v150-final > .e-con-inner > .almara-v150-section-head { width: 100% !important; max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; } html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-types .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-status .almara-v150-section-head > .e-con-inner, html body #almara-locations-v150-final .almara-v150-section-head > .e-con-inner { width: 100% !important; max-width: 1180px !important; margin-left: auto !important; margin-right: auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; } html body #almara-locations-v150-find .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-find .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-spots .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-types .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-types .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-status .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-status .almara-v150-section-head > .e-con-inner > .elementor-element, html body #almara-locations-v150-final .almara-v150-section-head > .elementor-element, html body #almara-locations-v150-final .almara-v150-section-head > .e-con-inner > .elementor-element { width: min(760px, 100%) !important; max-width: 760px !important; margin-left: 0 !important; margin-right: auto !important; align-self: flex-start !important; text-align: left !important; } html body #almara-locations-v150-find .almara-v150-section-head .elementor-widget-container, html body #almara-locations-v150-spots .almara-v150-section-head .elementor-widget-container, html body #almara-locations-v150-types .almara-v150-section-head .elementor-widget-container, html body #almara-locations-v150-status .almara-v150-section-head .elementor-widget-container, html body #almara-locations-v150-final .almara-v150-section-head .elementor-widget-container { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-v150-section-head .elementor-heading-title, html body #almara-locations-v150-spots .almara-v150-section-head .elementor-heading-title, html body #almara-locations-v150-types .almara-v150-section-head .elementor-heading-title, html body #almara-locations-v150-status .almara-v150-section-head .elementor-heading-title, html body #almara-locations-v150-final .almara-v150-section-head .elementor-heading-title, html body #almara-locations-v150-find .almara-v150-section-head p, html body #almara-locations-v150-spots .almara-v150-section-head p, html body #almara-locations-v150-types .almara-v150-section-head p, html body #almara-locations-v150-status .almara-v150-section-head p, html body #almara-locations-v150-final .almara-v150-section-head p, html body #almara-locations-v150-find .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-spots .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-types .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-status .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-final .almara-v150-section-head .almara-eyebrow, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy, html body #almara-locations-v150-types .almara-v150-section-head .almara-copy, html body #almara-locations-v150-status .almara-v150-section-head .almara-copy, html body #almara-locations-v150-final .almara-v150-section-head .almara-copy { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-find .almara-v150-section-head .almara-copy, html body #almara-locations-v150-find .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy, html body #almara-locations-v150-spots .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-types .almara-v150-section-head .almara-copy, html body #almara-locations-v150-types .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-status .almara-v150-section-head .almara-copy, html body #almara-locations-v150-status .almara-v150-section-head .almara-copy p, html body #almara-locations-v150-final .almara-v150-section-head .almara-copy, html body #almara-locations-v150-final .almara-v150-section-head .almara-copy p { max-width: 720px !important; } } @media (max-width: 767px) { html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-types .almara-v150-section-head, html body #almara-locations-v150-status .almara-v150-section-head, html body #almara-locations-v150-final .almara-v150-section-head, html body #almara-locations-v150-find .almara-v150-section-head * , html body #almara-locations-v150-spots .almara-v150-section-head * , html body #almara-locations-v150-types .almara-v150-section-head * , html body #almara-locations-v150-status .almara-v150-section-head * , html body #almara-locations-v150-final .almara-v150-section-head * { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } } /* ========================================================= ALMARA Locations B2C v1.6.15 — Section Lead Direct Widget Fix Core pairing: ALMARA Platform Core SAFE v1.3.60+ stable Scope: Locations page only Purpose: - fix the real Elementor DOM where section intro copy is NOT wrapped by .almara-v150-section-head but exists as direct widgets such as .almara-v150-section-lead / .almara-copy - keep mobile centered CSS-only. No PHP/JS/query changes. ========================================================= */ @media (min-width: 768px) { html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) > .e-con-inner { align-items: flex-start !important; justify-content: flex-start !important; text-align: left !important; } /* Direct Elementor widgets in the actual live DOM */ html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) > .e-con-inner > :is( .elementor-widget-heading, .elementor-widget-text-editor, .almara-eyebrow, .almara-section-title, .almara-copy, .almara-v150-section-lead ) { align-self: flex-start !important; justify-self: flex-start !important; width: min(760px, 100%) !important; max-width: 760px !important; margin-left: 0 !important; margin-right: auto !important; text-align: left !important; } /* The specific lead-copy widget shown in DevTools */ html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .almara-v150-section-lead, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget-text-editor.almara-v150-section-lead, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget-text-editor.almara-copy { align-self: flex-start !important; justify-self: flex-start !important; width: min(760px, 100%) !important; max-width: 760px !important; margin-left: 0 !important; margin-right: auto !important; text-align: left !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) :is( .almara-v150-section-lead, .almara-copy, .almara-eyebrow, .almara-section-title ) > .elementor-widget-container, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) :is( .almara-v150-section-lead, .almara-copy, .almara-eyebrow, .almara-section-title ) :is(p, .elementor-heading-title) { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } /* Keep functional UI blocks full-width after the text widgets */ html body #almara-locations-v150-find .almara-filter-panel, html body #almara-locations-v150-spots .elementor-widget-loop-grid, html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-final .almara-v150-final-grid { align-self: stretch !important; width: 100% !important; max-width: 100% !important; } } @media (max-width: 767px) { html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) :is( .almara-v150-section-lead, .almara-copy, .almara-eyebrow, .almara-section-title, .elementor-widget-container, p, .elementor-heading-title ) { text-align: center !important; margin-left: auto !important; margin-right: auto !important; } } /* ========================================================= ALMARA Locations B2C v1.6.16 — Responsive + Premium Hero Polish Core pairing: ALMARA Platform Core SAFE v1.3.60+ Scope: Locations page only Purpose: - make the hero visual feel closer to the premium Destinations hero slot - harden tablet and mobile layouts against old imported mobile constraints - keep stable filter/query logic untouched CSS-only. No PHP/JS/query changes. ========================================================= */ /* ---------- Premium hero image slot ---------- */ html body #almara-locations-v150-hero { position: relative !important; isolation: isolate !important; } html body #almara-locations-v150-hero::before { content: "" !important; position: absolute !important; inset: 0 !important; z-index: -2 !important; pointer-events: none !important; background: radial-gradient(circle at 78% 22%, rgba(110,193,194,.20), transparent 34%), radial-gradient(circle at 18% 82%, rgba(230,165,126,.11), transparent 36%) !important; } html body #almara-locations-v150-hero .almara-visual-wrap { position: relative !important; align-self: center !important; justify-self: stretch !important; min-width: 0 !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before { content: "" !important; position: absolute !important; inset: -22px -18px 18px 18px !important; border-radius: 34px !important; background: linear-gradient(135deg, rgba(110,193,194,.22), rgba(255,255,255,.20) 42%, rgba(230,165,126,.14)) !important; filter: blur(.1px) !important; opacity: .95 !important; z-index: 0 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-coastline-visual { position: relative !important; z-index: 1 !important; width: 100% !important; max-width: none !important; margin: 0 !important; } html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { position: relative !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: clamp(8px, 1vw, 14px) !important; border-radius: 30px !important; overflow: hidden !important; border: 2px solid rgba(110,193,194,.58) !important; background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,255,255,.44)), radial-gradient(circle at 18% 8%, rgba(110,193,194,.28), transparent 36%) !important; box-shadow: 0 30px 78px rgba(31,60,76,.13), 0 0 0 1px rgba(255,255,255,.60) inset !important; } html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container::after { content: "" !important; position: absolute !important; inset: 12px !important; border-radius: 22px !important; pointer-events: none !important; background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 42%), radial-gradient(circle at 82% 18%, rgba(255,255,255,.28), transparent 22%) !important; z-index: 2 !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { width: 100% !important; max-width: none !important; height: clamp(255px, 27vw, 390px) !important; min-height: 0 !important; display: block !important; object-fit: cover !important; object-position: center center !important; border-radius: 20px !important; filter: saturate(1.05) contrast(1.04) brightness(1.01) !important; } @media (hover:hover) and (prefers-reduced-motion:no-preference) { html body #almara-locations-v150-hero .almara-coastline-visual img { transition: transform .55s ease, filter .55s ease !important; } html body #almara-locations-v150-hero .almara-coastline-visual:hover img { transform: scale(1.018) !important; filter: saturate(1.08) contrast(1.05) brightness(1.02) !important; } } /* ---------- Tablet hardening ---------- */ @media (min-width: 768px) and (max-width: 1180px) { html body #almara-locations-v150-hero, html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { width: min(100% - 56px, 980px) !important; max-width: 980px !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; } html body #almara-locations-v150-hero { display: grid !important; grid-template-columns: minmax(0, .95fr) minmax(320px, 1.05fr) !important; gap: clamp(34px, 5vw, 58px) !important; align-items: center !important; padding-top: clamp(72px, 8vw, 104px) !important; padding-bottom: clamp(74px, 8vw, 112px) !important; } html body #almara-locations-v150-hero > .e-con-inner { display: contents !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: clamp(48px, 6.2vw, 72px) !important; line-height: 1.04 !important; max-width: 520px !important; } html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p { max-width: 460px !important; font-size: 15.5px !important; line-height: 1.68 !important; } html body #almara-locations-v150-find .almara-filter-panel { width: min(100%, 920px) !important; max-width: 920px !important; margin-left: 0 !important; margin-right: auto !important; padding: 28px 34px !important; } html body #almara-locations-v150-find .almara-filter-group { display: grid !important; grid-template-columns: 138px minmax(0, 1fr) !important; column-gap: 18px !important; align-items: center !important; } html body #almara-locations-v150-find .almara-filter-chip-row { justify-content: flex-start !important; gap: 9px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 26px !important; align-items: stretch !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; } html body #almara-locations-v150-final .almara-v150-final-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; } } @media (min-width: 768px) and (max-width: 900px) { html body #almara-locations-v150-hero { grid-template-columns: 1fr !important; gap: 34px !important; width: min(100% - 52px, 760px) !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap { max-width: 720px !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { height: clamp(270px, 42vw, 360px) !important; } } /* ---------- Mobile hardening ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-hero, html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { display: flex !important; flex-direction: column !important; width: min(100% - 30px, 420px) !important; max-width: 420px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; overflow: visible !important; } html body #almara-locations-v150-hero { padding-top: 42px !important; padding-bottom: 56px !important; gap: 26px !important; align-items: stretch !important; } html body #almara-locations-v150-hero > .e-con-inner, html body #almara-locations-v150-find > .e-con-inner, html body #almara-locations-v150-spots > .e-con-inner, html body #almara-locations-v150-types > .e-con-inner, html body #almara-locations-v150-status > .e-con-inner, html body #almara-locations-v150-final > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; gap: 0 !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap, html body #almara-locations-v150-hero .elementor-widget, html body #almara-locations-v150-hero .elementor-widget-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; text-align: left !important; } html body #almara-locations-v150-hero .almara-eyebrow, html body #almara-locations-v150-hero .almara-eyebrow p, html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title, html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: clamp(42px, 14vw, 58px) !important; line-height: 1.05 !important; max-width: 360px !important; } html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p { max-width: 340px !important; font-size: 15px !important; line-height: 1.65 !important; } html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-final .almara-actions { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; width: 100% !important; } html body #almara-locations-v150-hero .almara-actions .elementor-widget-button, html body #almara-locations-v150-final .almara-actions .elementor-widget-button { width: auto !important; max-width: 100% !important; } html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { border-radius: 24px !important; padding: 8px !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { height: clamp(190px, 57vw, 248px) !important; border-radius: 17px !important; } html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { padding-top: 54px !important; padding-bottom: 54px !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) :is( .almara-v150-section-head, .almara-v150-section-head *, .almara-eyebrow, .almara-section-title, .almara-copy, .almara-v150-section-lead, .elementor-heading-title, p ) { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .almara-section-title .elementor-heading-title, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-heading-title { font-size: clamp(31px, 10.5vw, 42px) !important; line-height: 1.08 !important; } html body #almara-locations-v150-find .almara-filter-panel { width: 100% !important; max-width: 100% !important; margin: 24px 0 0 !important; padding: 18px 16px !important; border-radius: 20px !important; } html body #almara-locations-v150-find .almara-filter-group { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; padding: 14px 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row { display: flex !important; flex-wrap: wrap !important; justify-content: flex-start !important; gap: 8px !important; width: 100% !important; } html body #almara-locations-v150-find .almara-filter-chip .elementor-button, html body #almara-locations-v150-find .almara-filter-chip a.elementor-button { min-height: 30px !important; padding: 0 12px !important; font-size: 11px !important; line-height: 1 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-widget-container, html body #almara-locations-v150-spots .elementor-loop-container, html body #almara-locations-v150-spots .e-loop-container, html body #almara-locations-v150-spots .elementor-grid { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 22px !important; align-items: stretch !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; } html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-final .almara-v150-final-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 18px !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-status .almara-v150-card, html body #almara-locations-v150-final .almara-v150-final-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; } } @media (min-width: 520px) and (max-width: 767px) { html body #almara-locations-v150-spots { width: min(100% - 34px, 620px) !important; max-width: 620px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } /* ========================================================= ALMARA Locations Responsive + Premium Hero Polish v1.6.17 Scope: Locations v1.5.x page only Purpose: - bring hero visual closer to Destinations premium frame - stabilize tablet + mobile layout after Elementor import constraints - fix dark final CTA button legibility on tablet/mobile - keep existing filter/PHP logic untouched ========================================================= */ /* ---------- Premium hero frame: closer to Destinations visual language ---------- */ html body #almara-locations-v150-hero { position: relative !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-visual-wrap { position: relative !important; max-width: 560px !important; margin-left: auto !important; margin-right: 0 !important; padding: 12px !important; border: 2px solid rgba(110,193,194,.62) !important; border-radius: 30px !important; background: linear-gradient(135deg, rgba(255,255,255,.86), rgba(255,255,255,.44)), radial-gradient(circle at 12% 4%, rgba(110,193,194,.32), transparent 38%) !important; box-shadow: 0 34px 86px rgba(31,60,76,.15), 0 1px 0 rgba(255,255,255,.72) inset !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before { inset: -18px -18px 20px 22px !important; border-radius: 38px !important; opacity: .72 !important; background: linear-gradient(135deg, rgba(110,193,194,.24), rgba(255,255,255,.08) 44%, rgba(230,165,126,.16)) !important; } html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 22px !important; background: transparent !important; box-shadow: none !important; overflow: hidden !important; } html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container::after { inset: 0 !important; border-radius: 22px !important; background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 42%), radial-gradient(circle at 82% 18%, rgba(255,255,255,.22), transparent 24%) !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { width: 100% !important; max-width: none !important; height: clamp(285px, 28vw, 405px) !important; object-fit: cover !important; object-position: center center !important; border-radius: 22px !important; display: block !important; filter: saturate(1.06) contrast(1.04) brightness(1.02) !important; } /* ---------- Tablet: readable CTA + premium but compact hero ---------- */ @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-hero .almara-visual-wrap { max-width: 100% !important; padding: 10px !important; border-radius: 28px !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { height: clamp(255px, 34vw, 340px) !important; border-radius: 20px !important; } html body #almara-locations-v150-final .almara-v150-final-card { min-height: 280px !important; padding: 34px !important; } html body #almara-locations-v150-final .almara-v150-final-card .almara-actions, html body #almara-locations-v150-final .almara-v150-final-card .elementor-widget-button, html body #almara-locations-v150-final .almara-v150-final-card .elementor-button-wrapper { width: auto !important; max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .almara-el-btn .elementor-button { min-width: 178px !important; max-width: 100% !important; min-height: 44px !important; padding: 0 24px !important; background: #fff !important; color: var(--almara-blue,#1F3C4C) !important; border: 0 !important; border-radius: 999px !important; white-space: nowrap !important; overflow: visible !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button *, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button * { color: var(--almara-blue,#1F3C4C) !important; white-space: nowrap !important; } } /* ---------- Mobile: hard override against imported Elementor width constraints ---------- */ @media (max-width: 767px) { html, body { overflow-x: hidden !important; } html body .elementor, html body .elementor > .elementor-element, html body .elementor-template, html body .elementor[data-elementor-type="wp-page"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; } html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; width: calc(100% - 28px) !important; max-width: 430px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; overflow: visible !important; --width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 0 !important; } html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) > .e-con-inner, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-element, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget-container { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-hero { padding-top: 42px !important; padding-bottom: 58px !important; gap: 24px !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-hero .almara-eyebrow, html body #almara-locations-v150-hero .almara-eyebrow p, html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title, html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p, html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-find .almara-v150-section-head *, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head *, html body #almara-locations-v150-types .almara-v150-section-head, html body #almara-locations-v150-types .almara-v150-section-head *, html body #almara-locations-v150-status .almara-v150-section-head, html body #almara-locations-v150-status .almara-v150-section-head * { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: clamp(34px, 10.5vw, 42px) !important; line-height: 1.07 !important; max-width: 100% !important; letter-spacing: -0.012em !important; } html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p { font-size: 14.5px !important; line-height: 1.62 !important; max-width: 100% !important; } html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-final .almara-actions { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; width: 100% !important; } html body #almara-locations-v150-hero .almara-actions .elementor-button, html body #almara-locations-v150-final .almara-actions .elementor-button { width: auto !important; max-width: 100% !important; min-width: 150px !important; min-height: 40px !important; padding: 0 20px !important; white-space: nowrap !important; } html body #almara-locations-v150-hero .almara-visual-wrap { padding: 8px !important; border-radius: 24px !important; border: 1.5px solid rgba(110,193,194,.58) !important; box-shadow: 0 20px 52px rgba(31,60,76,.12) !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before { inset: -8px -8px 8px 8px !important; border-radius: 28px !important; opacity: .55 !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { height: clamp(178px, 52vw, 230px) !important; border-radius: 17px !important; } html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { padding-top: 54px !important; padding-bottom: 54px !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .elementor-heading-title { font-size: clamp(28px, 8.5vw, 36px) !important; line-height: 1.12 !important; max-width: 100% !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-copy, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-copy p { font-size: 14px !important; line-height: 1.62 !important; max-width: 100% !important; } html body #almara-locations-v150-find .almara-filter-panel { width: 100% !important; max-width: 100% !important; margin: 24px 0 0 !important; padding: 17px 14px !important; border-radius: 22px !important; } html body #almara-locations-v150-find .almara-filter-group { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; align-items: start !important; padding: 14px 0 !important; } html body #almara-locations-v150-find .almara-filter-label, html body #almara-locations-v150-find .almara-filter-label p { text-align: left !important; margin: 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)) !important; gap: 8px !important; width: 100% !important; justify-content: stretch !important; } html body #almara-locations-v150-find .almara-filter-chip, html body #almara-locations-v150-find .almara-filter-chip .elementor-widget-container, html body #almara-locations-v150-find .almara-filter-chip .elementor-button-wrapper { width: 100% !important; } html body #almara-locations-v150-find .almara-filter-chip .elementor-button, html body #almara-locations-v150-find .almara-filter-chip a.elementor-button { width: 100% !important; min-width: 0 !important; min-height: 32px !important; padding: 0 10px !important; font-size: 11px !important; line-height: 1 !important; white-space: nowrap !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-final .almara-v150-final-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 20px !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item, html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-status .almara-v150-card, html body #almara-locations-v150-final .almara-v150-final-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-final .almara-v150-final-card { min-height: 0 !important; padding: 28px 24px !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .almara-el-btn .elementor-button { min-width: 170px !important; background: #fff !important; color: var(--almara-blue,#1F3C4C) !important; overflow: visible !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button *, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button * { color: var(--almara-blue,#1F3C4C) !important; white-space: nowrap !important; } } @media (max-width: 359px) { html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) { width: calc(100% - 20px) !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: 32px !important; } html body #almara-locations-v150-find .almara-filter-chip-row { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations Responsive + Premium Hero Polish v1.6.18 Scope: Locations v1.5.x page only Purpose: - true mobile viewport-width rescue against narrow Elementor parent constraints - stronger destination-like hero media frame - readable dark CTA button text on tablet/mobile - wider, cleaner mobile cards and spacing No PHP / filter / loader changes. ========================================================= */ /* ---------- Hero: destination-like premium media frame ---------- */ html body #almara-locations-v150-hero .almara-visual-wrap, html body #almara-locations-v150-hero .almara-coastline-visual { position: relative !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-visual-wrap { padding: 13px !important; border: 2px solid rgba(110,193,194,.70) !important; border-radius: 30px !important; background: linear-gradient(135deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.58) 52%, rgba(244,237,228,.35) 100%), radial-gradient(circle at 13% 6%, rgba(110,193,194,.35) 0%, rgba(110,193,194,.10) 36%, transparent 58%) !important; box-shadow: 0 34px 88px rgba(31,60,76,.16), 0 18px 46px rgba(110,193,194,.10), inset 0 1px 0 rgba(255,255,255,.82) !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before { content: "" !important; position: absolute !important; z-index: 0 !important; inset: -20px -22px 22px 24px !important; border-radius: 40px !important; background: radial-gradient(circle at 16% 16%, rgba(110,193,194,.30), transparent 42%), radial-gradient(circle at 88% 85%, rgba(230,165,126,.18), transparent 44%) !important; filter: blur(4px) !important; opacity: .82 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-visual-wrap::after { content: "" !important; position: absolute !important; z-index: 2 !important; inset: 13px !important; border-radius: 22px !important; background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 42%) !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual .elementor-widget-container { position: relative !important; z-index: 1 !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 22px !important; overflow: hidden !important; background: transparent !important; box-shadow: none !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { width: 100% !important; max-width: none !important; min-width: 0 !important; height: clamp(300px, 30vw, 420px) !important; object-fit: cover !important; object-position: center center !important; border-radius: 22px !important; display: block !important; filter: saturate(1.08) contrast(1.045) brightness(1.02) !important; transform: translateZ(0) !important; } /* ---------- Tablet: premium rhythm + readable dark CTA button ---------- */ @media (min-width: 768px) and (max-width: 1180px) { html body #almara-locations-v150-hero .almara-visual-wrap { padding: 11px !important; border-radius: 28px !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { height: clamp(260px, 34vw, 350px) !important; border-radius: 20px !important; } html body #almara-locations-v150-final .almara-v150-final-grid { gap: 22px !important; } html body #almara-locations-v150-final .almara-v150-final-card { min-height: 300px !important; padding: 34px 30px !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .almara-actions, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-widget-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-wrapper { width: 100% !important; max-width: 100% !important; overflow: visible !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; min-width: 184px !important; max-width: 100% !important; min-height: 42px !important; padding: 0 22px !important; background: #fff !important; color: var(--almara-blue,#1F3C4C) !important; border: 0 !important; border-radius: 999px !important; line-height: 1 !important; text-indent: 0 !important; overflow: visible !important; opacity: 1 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-content-wrapper, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-text, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button * { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: 100% !important; color: var(--almara-blue,#1F3C4C) !important; font-size: 12px !important; line-height: 1 !important; white-space: nowrap !important; text-indent: 0 !important; opacity: 1 !important; visibility: visible !important; } } /* ---------- Mobile: viewport-width rescue, not parent-width dependent ---------- */ @media (max-width: 767px) { html body, html body .elementor, html body .elementor-template, html body .elementor[data-elementor-type="wp-page"], html body .elementor > .elementor-element { width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; } html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) { box-sizing: border-box !important; width: min(430px, calc(100vw - 30px)) !important; max-width: min(430px, calc(100vw - 30px)) !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; overflow: visible !important; --width: min(430px, calc(100vw - 30px)) !important; --content-width: min(430px, calc(100vw - 30px)) !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 0 !important; } html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) > .e-con-inner, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .e-con-inner, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-element, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget, html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) .elementor-widget-container { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; } html body #almara-locations-v150-hero { padding-top: 38px !important; padding-bottom: 50px !important; gap: 22px !important; } html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-hero .almara-eyebrow, html body #almara-locations-v150-hero .almara-eyebrow p, html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title, html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p, html body #almara-locations-v150-find .almara-v150-section-head, html body #almara-locations-v150-find .almara-v150-section-head *, html body #almara-locations-v150-spots .almara-v150-section-head, html body #almara-locations-v150-spots .almara-v150-section-head *, html body #almara-locations-v150-types .almara-v150-section-head, html body #almara-locations-v150-types .almara-v150-section-head *, html body #almara-locations-v150-status .almara-v150-section-head, html body #almara-locations-v150-status .almara-v150-section-head * { text-align: left !important; margin-left: 0 !important; margin-right: auto !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: clamp(36px, 10.8vw, 46px) !important; line-height: 1.04 !important; max-width: 100% !important; letter-spacing: -0.015em !important; word-break: normal !important; overflow-wrap: normal !important; } html body #almara-locations-v150-hero .almara-lead, html body #almara-locations-v150-hero .almara-lead p { max-width: 100% !important; font-size: 14.5px !important; line-height: 1.62 !important; } html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-final .almara-actions { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; width: 100% !important; max-width: 100% !important; } html body #almara-locations-v150-hero .almara-actions .elementor-button, html body #almara-locations-v150-final .almara-actions .elementor-button { display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 156px !important; min-height: 40px !important; padding: 0 20px !important; white-space: nowrap !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-visual-wrap { width: 100% !important; max-width: 100% !important; padding: 9px !important; border-radius: 25px !important; border: 1.75px solid rgba(110,193,194,.68) !important; box-shadow: 0 22px 58px rgba(31,60,76,.14), 0 10px 24px rgba(110,193,194,.10) !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before { inset: -10px -10px 10px 10px !important; border-radius: 30px !important; opacity: .70 !important; } html body #almara-locations-v150-hero .almara-visual-wrap::after { inset: 9px !important; border-radius: 18px !important; } html body #almara-locations-v150-hero .almara-coastline-visual img { width: 100% !important; height: clamp(190px, 52vw, 240px) !important; min-height: 185px !important; border-radius: 18px !important; } html body #almara-locations-v150-find, html body #almara-locations-v150-spots, html body #almara-locations-v150-types, html body #almara-locations-v150-status, html body #almara-locations-v150-final { padding-top: 50px !important; padding-bottom: 50px !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .elementor-heading-title { max-width: 100% !important; font-size: clamp(29px, 8.8vw, 38px) !important; line-height: 1.10 !important; } html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-copy, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-copy p, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-v150-section-lead, html body :is( #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status ) .almara-v150-section-lead p { max-width: 100% !important; font-size: 14px !important; line-height: 1.62 !important; text-align: left !important; } html body #almara-locations-v150-find .almara-filter-panel { width: 100% !important; max-width: 100% !important; margin: 24px 0 0 !important; padding: 18px 15px !important; border-radius: 24px !important; } html body #almara-locations-v150-find .almara-filter-group { display: grid !important; grid-template-columns: 1fr !important; gap: 10px !important; align-items: start !important; padding: 15px 0 !important; } html body #almara-locations-v150-find .almara-filter-chip-row { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; width: 100% !important; } html body #almara-locations-v150-find .almara-filter-chip, html body #almara-locations-v150-find .almara-filter-chip .elementor-widget-container, html body #almara-locations-v150-find .almara-filter-chip .elementor-button-wrapper, html body #almara-locations-v150-find .almara-filter-chip .elementor-button { width: 100% !important; max-width: 100% !important; } html body #almara-locations-v150-find .almara-filter-chip .elementor-button, html body #almara-locations-v150-find .almara-filter-chip a.elementor-button { min-width: 0 !important; min-height: 34px !important; padding: 0 10px !important; font-size: 11.5px !important; line-height: 1 !important; white-space: nowrap !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-types .almara-v150-card-grid, html body #almara-locations-v150-status .almara-v150-card-grid, html body #almara-locations-v150-final .almara-v150-final-grid { display: grid !important; grid-template-columns: 1fr !important; gap: 18px !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item, html body #almara-locations-v150-types .almara-v150-type-card, html body #almara-locations-v150-status .almara-v150-card, html body #almara-locations-v150-final .almara-v150-final-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item { min-height: 0 !important; } html body #almara-locations-v150-spots .almara-location-card img, html body #almara-locations-v150-spots .almara-location-card img.wp-post-image, html body #almara-locations-v150-spots .almara-location-card img.almara-location-image { height: 210px !important; object-fit: cover !important; } html body #almara-locations-v150-final .almara-v150-final-card { min-height: 0 !important; padding: 30px 24px !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button { min-width: 186px !important; min-height: 42px !important; padding: 0 22px !important; background: #fff !important; color: var(--almara-blue,#1F3C4C) !important; border: 0 !important; border-radius: 999px !important; overflow: visible !important; opacity: 1 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-content-wrapper, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-text, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button * { color: var(--almara-blue,#1F3C4C) !important; font-size: 12px !important; line-height: 1 !important; white-space: nowrap !important; text-indent: 0 !important; opacity: 1 !important; visibility: visible !important; } } @media (max-width: 359px) { html body :is( #almara-locations-v150-hero, #almara-locations-v150-find, #almara-locations-v150-spots, #almara-locations-v150-types, #almara-locations-v150-status, #almara-locations-v150-final ) { width: calc(100vw - 22px) !important; max-width: calc(100vw - 22px) !important; --width: calc(100vw - 22px) !important; --content-width: calc(100vw - 22px) !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .elementor-heading-title { font-size: 34px !important; } html body #almara-locations-v150-find .almara-filter-chip-row { grid-template-columns: 1fr !important; } } /* ========================================================= ALMARA Locations v1.6.19 – Mobile Final CTA Button Visibility Fix Scope: Locations B2C final CTA only Purpose: keep dark-card decorative layer behind content and force button label visible. No PHP / Filter / Loader changes. ========================================================= */ html body #almara-locations-v150-final .almara-v150-final-card--dark, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child { isolation: isolate !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark::after, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child::after { z-index: 0 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark > *, html body #almara-locations-v150-final .almara-v150-final-card--dark .e-con-inner, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-element, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-widget-container, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child > *, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .e-con-inner, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-element, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-widget-container { position: relative !important; z-index: 2 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-widget-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-widget-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button-wrapper { display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; overflow: visible !important; opacity: 1 !important; visibility: visible !important; position: relative !important; z-index: 5 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: 100% !important; min-width: 176px !important; min-height: 42px !important; height: auto !important; padding: 0 24px !important; overflow: visible !important; border-radius: 999px !important; background: #fff !important; color: #1F3C4C !important; text-decoration: none !important; text-indent: 0 !important; opacity: 1 !important; visibility: visible !important; position: relative !important; z-index: 6 !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button .elementor-button-content-wrapper { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; overflow: visible !important; color: #1F3C4C !important; opacity: 1 !important; visibility: visible !important; transform: none !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button .elementor-button-text, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button .elementor-button-text, html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button span, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button span, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button .elementor-button-text, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button .elementor-button-text, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button span, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button span { display: inline-block !important; width: auto !important; max-width: none !important; min-width: 0 !important; height: auto !important; max-height: none !important; padding: 0 !important; margin: 0 !important; clip: auto !important; clip-path: none !important; overflow: visible !important; position: relative !important; left: auto !important; top: auto !important; transform: none !important; text-indent: 0 !important; text-align: center !important; white-space: nowrap !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 12.5px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: 0 !important; color: #1F3C4C !important; -webkit-text-fill-color: #1F3C4C !important; opacity: 1 !important; visibility: visible !important; z-index: 7 !important; } @media (max-width: 767px) { html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button { min-width: min(210px, 100%) !important; min-height: 44px !important; padding: 0 22px !important; } } /* ========================================================= ALMARA Locations v1.6.20 – Hero Premium Frame + Final CTA Wrap Scope: Locations B2C page only Purpose: - apply premium media frame directly to the live hero image widget, not only to wrapper classes - allow the dark final CTA button label to wrap cleanly on mobile No PHP / Filter / Loader changes. ========================================================= */ /* ---------- Hero: premium destination-like image frame, robust live-DOM targeting ---------- */ html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image, html body #almara-locations-v150-hero .elementor-widget-image:has(img) { position: relative !important; overflow: visible !important; isolation: isolate !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image:has(img) > .elementor-widget-container { position: relative !important; z-index: 1 !important; padding: 10px !important; border: 2px solid rgba(110,193,194,.74) !important; border-radius: 26px !important; background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,255,255,.62) 58%, rgba(244,237,228,.52)), radial-gradient(circle at 18% 8%, rgba(110,193,194,.28), transparent 45%) !important; box-shadow: 0 32px 82px rgba(31,60,76,.145), 0 18px 44px rgba(110,193,194,.13), inset 0 1px 0 rgba(255,255,255,.90) !important; overflow: visible !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image:has(img) > .elementor-widget-container::before { content: "" !important; position: absolute !important; z-index: -1 !important; inset: -18px -20px 18px 20px !important; border-radius: 34px !important; background: radial-gradient(circle at 14% 18%, rgba(110,193,194,.30), transparent 42%), radial-gradient(circle at 88% 86%, rgba(230,165,126,.16), transparent 48%) !important; filter: blur(5px) !important; opacity: .74 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image:has(img) > .elementor-widget-container::after { content: "" !important; position: absolute !important; z-index: 3 !important; inset: 10px !important; border-radius: 18px !important; background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,0) 44%) !important; pointer-events: none !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image img, html body #almara-locations-v150-hero .elementor-widget-image:has(img) img { position: relative !important; z-index: 2 !important; display: block !important; width: 100% !important; max-width: none !important; height: clamp(285px, 30vw, 405px) !important; object-fit: cover !important; object-position: center center !important; border-radius: 18px !important; filter: saturate(1.07) contrast(1.04) brightness(1.02) !important; transform: translateZ(0) !important; box-shadow: none !important; } /* Avoid a doubled frame if the wrapper itself already received older premium styles. */ html body #almara-locations-v150-hero .almara-visual-wrap { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; } html body #almara-locations-v150-hero .almara-visual-wrap::before, html body #almara-locations-v150-hero .almara-visual-wrap::after { content: none !important; display: none !important; } /* ---------- Final CTA: allow two-line mobile labels in the dark CTA button ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-widget-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-widget-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button-wrapper { width: auto !important; max-width: 190px !important; min-width: 0 !important; overflow: visible !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button { display: inline-flex !important; width: auto !important; min-width: 138px !important; max-width: 188px !important; min-height: 48px !important; height: auto !important; padding: 10px 20px !important; white-space: normal !important; overflow: visible !important; border-radius: 999px !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button .elementor-button-content-wrapper, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button .elementor-button-content-wrapper { width: 100% !important; max-width: 148px !important; white-space: normal !important; overflow: visible !important; text-align: center !important; } html body #almara-locations-v150-final .almara-v150-final-card--dark a.elementor-button .elementor-button-text, html body #almara-locations-v150-final .almara-v150-final-card--dark .elementor-button .elementor-button-text, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child a.elementor-button .elementor-button-text, html body #almara-locations-v150-final > .e-con-inner > .elementor-element:first-child > .e-con-inner > .elementor-element:first-child .elementor-button .elementor-button-text { display: block !important; width: 100% !important; max-width: 148px !important; white-space: normal !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: manual !important; text-align: center !important; line-height: 1.15 !important; font-size: 12.5px !important; color: #1F3C4C !important; -webkit-text-fill-color: #1F3C4C !important; opacity: 1 !important; visibility: visible !important; } } /* ---------- Mobile hero: larger, destination-like, but still compact enough ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image, html body #almara-locations-v150-hero .elementor-widget-image:has(img) { width: 100% !important; max-width: 100% !important; margin-top: 22px !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image:has(img) > .elementor-widget-container { padding: 9px !important; border-radius: 24px !important; border-width: 1.75px !important; box-shadow: 0 22px 58px rgba(31,60,76,.145), 0 10px 25px rgba(110,193,194,.12), inset 0 1px 0 rgba(255,255,255,.88) !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image img, html body #almara-locations-v150-hero .elementor-widget-image:has(img) img { height: clamp(205px, 58vw, 258px) !important; min-height: 200px !important; border-radius: 17px !important; } } /* ========================================================= ALMARA Locations v1.6.21 – Hero Image TRUE Premium Frame Fix Scope: Locations B2C hero only Purpose: - previous premium frame was constrained by a too-narrow Elementor parent on mobile - force the live hero image widget to break out to usable viewport width - apply visible premium frame directly to image + container for Destination-like look No PHP / Filter / Loader changes. ========================================================= */ /* Desktop + tablet: premium media stage similar to Destinations */ html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual.e-widget-image, html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image { position: relative !important; width: min(560px, 100%) !important; max-width: 560px !important; margin-left: auto !important; margin-right: auto !important; overflow: visible !important; isolation: isolate !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container { position: relative !important; z-index: 1 !important; width: 100% !important; padding: 10px !important; border: 2px solid rgba(110, 193, 194, 0.86) !important; border-radius: 28px !important; background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(255,255,255,0.70) 62%, rgba(244,237,228,0.50)), radial-gradient(circle at 14% 12%, rgba(110,193,194,0.26), transparent 44%) !important; box-shadow: 0 34px 86px rgba(31,60,76,0.16), 0 18px 48px rgba(110,193,194,0.15), inset 0 1px 0 rgba(255,255,255,0.92) !important; overflow: visible !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::before { content: "" !important; position: absolute !important; z-index: -1 !important; inset: -24px -28px 18px 22px !important; border-radius: 38px !important; background: radial-gradient(circle at 20% 18%, rgba(110,193,194,0.34), transparent 44%), radial-gradient(circle at 88% 82%, rgba(237,168,142,0.18), transparent 52%) !important; filter: blur(8px) !important; opacity: .82 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::after { content: "" !important; position: absolute !important; z-index: 4 !important; inset: 10px !important; border-radius: 19px !important; background: linear-gradient(180deg, rgba(255,255,255,.30), rgba(255,255,255,0) 46%) !important; pointer-events: none !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image img { position: relative !important; z-index: 3 !important; display: block !important; width: 100% !important; max-width: none !important; height: clamp(300px, 29vw, 390px) !important; min-height: 300px !important; object-fit: cover !important; object-position: center center !important; border-radius: 19px !important; border: 0 !important; outline: 0 !important; padding: 0 !important; filter: saturate(1.07) contrast(1.045) brightness(1.02) !important; box-shadow: none !important; } /* Tablet: keep generous frame, avoid oversized image */ @media (max-width: 1024px) and (min-width: 768px) { html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image { width: min(620px, calc(100vw - 72px)) !important; max-width: min(620px, calc(100vw - 72px)) !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image img { height: clamp(292px, 38vw, 360px) !important; min-height: 292px !important; } } /* Mobile: break out of narrow Elementor parent and use real viewport width */ @media (max-width: 767px) { html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual.e-widget-image, html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .almara-visual-wrap, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image { width: min(360px, calc(100vw - 34px)) !important; max-width: min(360px, calc(100vw - 34px)) !important; min-width: min(300px, calc(100vw - 34px)) !important; flex: 0 0 auto !important; align-self: center !important; justify-self: center !important; margin-top: 24px !important; margin-left: auto !important; margin-right: auto !important; overflow: visible !important; transform: none !important; } /* When the image lives inside a very narrow column, center it optically against the viewport. */ html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual { left: 50% !important; transform: translateX(-50%) !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container { width: 100% !important; min-width: 100% !important; padding: 9px !important; border: 2px solid rgba(110,193,194,.86) !important; border-radius: 25px !important; background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(255,255,255,.70) 60%, rgba(244,237,228,.48)), radial-gradient(circle at 18% 14%, rgba(110,193,194,.30), transparent 45%) !important; box-shadow: 0 24px 62px rgba(31,60,76,.17), 0 12px 30px rgba(110,193,194,.15), inset 0 1px 0 rgba(255,255,255,.92) !important; overflow: visible !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::before { inset: -18px -18px 14px 18px !important; border-radius: 32px !important; filter: blur(7px) !important; opacity: .78 !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image > .elementor-widget-container::after { inset: 9px !important; border-radius: 18px !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .almara-visual-wrap .elementor-widget-image img, html body #almara-locations-v150-hero .elementor-element-3b996df1 img { display: block !important; width: 100% !important; max-width: none !important; min-width: 0 !important; height: clamp(215px, 61vw, 252px) !important; min-height: 215px !important; object-fit: cover !important; object-position: center center !important; border-radius: 18px !important; filter: saturate(1.08) contrast(1.045) brightness(1.02) !important; box-shadow: none !important; } } /* ========================================================= ALMARA Locations v1.6.22 – Hero Premium Stage Final Fix Scope: Locations B2C hero only Purpose: - actual live DOM places the image in a second Elementor column with its own min-height/centering - remove the mobile vertical void before the image - apply a visible destination-like premium frame directly to the real image and widget container No PHP / Filter / Loader changes. ========================================================= */ /* Desktop / tablet: make the visible image itself look like the Destinations premium frame. */ html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .elementor-element-3b996df1 { position: relative !important; overflow: visible !important; isolation: isolate !important; width: min(620px, 100%) !important; max-width: 620px !important; margin-left: auto !important; margin-right: auto !important; } html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-element-3b996df1 > .elementor-widget-container { position: relative !important; z-index: 1 !important; width: 100% !important; max-width: 100% !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-element-3b996df1 > .elementor-widget-container::before { content: "" !important; position: absolute !important; z-index: -1 !important; inset: -18px -18px 18px 18px !important; border-radius: 31px !important; background: radial-gradient(circle at 20% 18%, rgba(110,193,194,.30), transparent 46%), radial-gradient(circle at 88% 84%, rgba(237,168,142,.14), transparent 54%) !important; filter: blur(6px) !important; opacity: .86 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-element-3b996df1 img { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: none !important; height: clamp(315px, 30vw, 395px) !important; min-height: 315px !important; object-fit: cover !important; object-position: center center !important; border: 10px solid rgba(255,255,255,.98) !important; outline: 2px solid rgba(110,193,194,.85) !important; outline-offset: 0 !important; border-radius: 28px !important; background: #fff !important; box-shadow: 0 32px 82px rgba(31,60,76,.15), 0 14px 36px rgba(110,193,194,.16), inset 0 1px 0 rgba(255,255,255,.95) !important; filter: saturate(1.06) contrast(1.035) brightness(1.02) !important; } /* Tablet: premium but not oversized. */ @media (max-width: 1024px) and (min-width: 768px) { html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .elementor-element-3b996df1 { width: min(640px, calc(100vw - 74px)) !important; max-width: min(640px, calc(100vw - 74px)) !important; } html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-element-3b996df1 img { height: clamp(292px, 38vw, 365px) !important; min-height: 292px !important; border-width: 9px !important; border-radius: 26px !important; } } /* Mobile: remove the inherited visual-column min-height/centering void and show a real framed landscape. */ @media (max-width: 767px) { html body #almara-locations-v150-hero, html body #almara-locations-v150-hero > .e-con-inner { display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 0 !important; min-height: 0 !important; height: auto !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element, html body #almara-locations-v150-hero .e-con-inner > .elementor-element, html body #almara-locations-v150-hero .elementor-element[data-element_type="container"] { min-height: 0 !important; height: auto !important; flex: 0 0 auto !important; justify-content: flex-start !important; align-items: stretch !important; } /* The live visual column is the second direct child in the imported Locations hero. */ html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:nth-child(2), html body #almara-locations-v150-hero .e-con-inner > .elementor-element:nth-child(2) { width: 100% !important; max-width: 100% !important; min-height: 0 !important; height: auto !important; margin-top: 30px !important; margin-bottom: 0 !important; padding: 0 !important; display: flex !important; justify-content: center !important; align-items: center !important; } html body #almara-locations-v150-hero .almara-coastline-visual, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual, html body #almara-locations-v150-hero .elementor-element-3b996df1 { position: relative !important; left: auto !important; right: auto !important; transform: none !important; width: min(348px, calc(100vw - 38px)) !important; max-width: min(348px, calc(100vw - 38px)) !important; min-width: 0 !important; margin: 0 auto !important; padding: 0 !important; align-self: center !important; justify-self: center !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-element-3b996df1 > .elementor-widget-container { width: 100% !important; max-width: 100% !important; min-height: 0 !important; height: auto !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-element-3b996df1 > .elementor-widget-container::before { inset: -14px -12px 16px 12px !important; border-radius: 29px !important; filter: blur(7px) !important; opacity: .84 !important; } html body #almara-locations-v150-hero .almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-element-3b996df1 > .elementor-widget-container::after { content: "" !important; position: absolute !important; z-index: 4 !important; inset: 8px !important; border-radius: 19px !important; background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,0) 48%) !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual img, html body #almara-locations-v150-hero .elementor-element-3b996df1 img { width: 100% !important; max-width: none !important; min-width: 0 !important; height: clamp(205px, 58vw, 232px) !important; min-height: 205px !important; max-height: 232px !important; object-fit: cover !important; object-position: center center !important; box-sizing: border-box !important; border: 8px solid rgba(255,255,255,.98) !important; outline: 2px solid rgba(110,193,194,.86) !important; outline-offset: 0 !important; border-radius: 25px !important; box-shadow: 0 22px 58px rgba(31,60,76,.16), 0 10px 28px rgba(110,193,194,.14) !important; filter: saturate(1.07) contrast(1.04) brightness(1.02) !important; } } /* ========================================================= ALMARA Locations v1.6.24 – SAFE ROLLBACK Basis: v1.6.22 hero-premium-final Purpose: remove the failed v1.6.23 mobile viewport-stage experiment. No PHP / Loader / Filter changes. ========================================================= */ /* ============================================================ ALMARA Locations v1.6.25 – Hero Premium Split-Class Fix Purpose: separate visual premium frame from old layout-affecting class almara-coastline-visual. Elementor instruction: - REMOVE class: almara-coastline-visual - ADD class on the same Image widget: almara-hero-premium-frame CSS only. No PHP, no JS, no filter/query changes. ============================================================ */ html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { position: relative !important; display: block !important; width: 100% !important; max-width: min(560px, 100%) !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin-inline: auto !important; margin-block: 0 !important; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; transform: none !important; translate: none !important; flex: 0 1 auto !important; align-self: center !important; z-index: 1 !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { position: relative !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin: 0 auto !important; padding: 8px !important; overflow: visible !important; border-radius: 28px !important; border: 1px solid rgba(110, 193, 194, 0.62) !important; background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(255,255,255,0.82)) !important; box-shadow: 0 26px 74px rgba(31, 60, 76, 0.18), 0 0 0 1px rgba(255,255,255,0.66) inset, 0 0 42px rgba(110, 193, 194, 0.16) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::before { content: "" !important; position: absolute !important; inset: -18px !important; z-index: -1 !important; border-radius: 34px !important; background: radial-gradient(circle at 18% 0%, rgba(110,193,194,0.26), rgba(110,193,194,0) 52%), radial-gradient(circle at 92% 90%, rgba(237,168,142,0.16), rgba(237,168,142,0) 56%) !important; filter: blur(10px) !important; opacity: 0.92 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::after { content: "" !important; position: absolute !important; inset: 8px !important; z-index: 2 !important; border-radius: 21px !important; pointer-events: none !important; background: linear-gradient(135deg, rgba(255,255,255,0.20), rgba(255,255,255,0) 34%), linear-gradient(0deg, rgba(4,32,52,0.05), rgba(4,32,52,0) 38%) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.16) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; aspect-ratio: 16 / 9 !important; object-fit: cover !important; object-position: 50% 50% !important; border-radius: 21px !important; filter: saturate(1.06) contrast(1.035) brightness(1.02) !important; box-shadow: none !important; transform: none !important; } /* Safety: if the old class accidentally remains together with the new class, prevent old layout rules from reintroducing lateral offsets. */ html body #almara-locations-v150-hero .almara-coastline-visual.almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-coastline-visual.almara-hero-premium-frame { left: auto !important; right: auto !important; transform: none !important; translate: none !important; margin-inline: auto !important; } @media (max-width: 1024px) { html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(100%, 520px) !important; max-width: 520px !important; margin-inline: auto !important; } } @media (max-width: 767px) { html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(100%, 326px) !important; max-width: 326px !important; min-width: 0 !important; margin: 24px auto 0 !important; padding: 0 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { padding: 7px !important; border-radius: 24px !important; box-shadow: 0 22px 54px rgba(31, 60, 76, 0.18), 0 0 0 1px rgba(255,255,255,0.70) inset, 0 0 34px rgba(110, 193, 194, 0.14) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::before { inset: -12px !important; border-radius: 30px !important; filter: blur(9px) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::after { inset: 7px !important; border-radius: 18px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { border-radius: 18px !important; aspect-ratio: 16 / 9 !important; } } /* ============================================================ ALMARA Locations v1.7.1 – Final CSS Polish Scope: Locations page only Basis: v1.7.0 Elementor responsive settings + stable Core/Loader Purpose: - stronger premium rendering for the original Hero image - slightly more editorial desktop/tablet balance - safer mobile spacing without touching filter/query logic - card/CTA polish only; no PHP, no JS, no structural assumptions ============================================================ */ /* ---------- Hero premium frame: Destinations-inspired look ---------- */ html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { max-width: min(620px, 100%) !important; width: 100% !important; margin-inline: auto !important; overflow: visible !important; position: relative !important; z-index: 2 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { padding: 10px !important; border-radius: 30px !important; border: 1px solid rgba(110, 193, 194, 0.82) !important; background: linear-gradient(135deg, rgba(255,255,255,0.99), rgba(255,255,255,0.86)) !important; box-shadow: 0 32px 88px rgba(31, 60, 76, 0.20), 0 18px 46px rgba(110, 193, 194, 0.16), 0 0 0 1px rgba(255,255,255,0.82) inset !important; overflow: visible !important; isolation: isolate !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::before { content: "" !important; position: absolute !important; z-index: -1 !important; inset: -22px -24px -24px -24px !important; border-radius: 38px !important; pointer-events: none !important; background: radial-gradient(circle at 16% 4%, rgba(110,193,194,0.34), rgba(110,193,194,0) 50%), radial-gradient(circle at 100% 100%, rgba(237,168,142,0.18), rgba(237,168,142,0) 58%), linear-gradient(135deg, rgba(110,193,194,0.10), rgba(255,255,255,0)) !important; filter: blur(12px) !important; opacity: 1 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::after { content: "" !important; position: absolute !important; z-index: 3 !important; inset: 10px !important; border-radius: 22px !important; pointer-events: none !important; background: linear-gradient(135deg, rgba(255,255,255,0.28), rgba(255,255,255,0) 36%), linear-gradient(0deg, rgba(4,32,52,0.07), rgba(4,32,52,0) 42%) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.22), inset 0 1px 18px rgba(255,255,255,0.08) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { display: block !important; width: 100% !important; max-width: none !important; aspect-ratio: 16 / 9 !important; object-fit: cover !important; object-position: 50% 50% !important; border-radius: 22px !important; filter: saturate(1.09) contrast(1.045) brightness(1.025) !important; transform: translateZ(0) !important; } /* Give the hero visual a bit more presence on desktop without changing Elementor structure. */ @media (min-width: 1025px) { html body #almara-locations-v150-hero { padding-top: clamp(76px, 7vw, 116px) !important; padding-bottom: clamp(74px, 7vw, 110px) !important; } html body #almara-locations-v150-hero .almara-hero-title .elementor-heading-title, html body #almara-locations-v150-hero .almara-hero-title h1, html body #almara-locations-v150-hero .elementor-heading-title { letter-spacing: -0.022em !important; } } /* ---------- Tablet polish ---------- */ @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-hero { padding-top: 72px !important; padding-bottom: 70px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { max-width: min(560px, 100%) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { padding: 9px !important; border-radius: 28px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { border-radius: 20px !important; } } /* ---------- Mobile polish: use the available width, but keep the hero calm ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-hero { padding-top: 52px !important; padding-bottom: 48px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(100%, 340px) !important; max-width: 340px !important; margin-top: 18px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { padding: 7px !important; border-radius: 24px !important; border-color: rgba(110, 193, 194, 0.88) !important; box-shadow: 0 22px 54px rgba(31, 60, 76, 0.18), 0 12px 32px rgba(110, 193, 194, 0.17), 0 0 0 1px rgba(255,255,255,0.78) inset !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::before, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::before { inset: -12px -14px -16px -14px !important; border-radius: 30px !important; filter: blur(10px) !important; opacity: .96 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container::after, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container::after { inset: 7px !important; border-radius: 18px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { border-radius: 18px !important; } } /* ---------- Location cards: keep badge rows compact and avoid awkward wrapped pills ---------- */ html body #almara-locations-v150-spots .almara-location-card .almara-location-badges, html body #almara-locations-v150-spots .almara-location-card [class*="badge"]:not(.elementor-button), html body .almara-location-card .almara-location-badges { max-width: 100% !important; } html body #almara-locations-v150-spots .almara-location-card .almara-location-badges span, html body #almara-locations-v150-spots .almara-location-card .almara-location-badge, html body #almara-locations-v150-spots .almara-location-card [class*="badge"] span { white-space: nowrap !important; } /* Cards should feel consistent even when one location has fewer badges/CTA text. */ html body #almara-locations-v150-spots .almara-location-card, html body #almara-locations-v150-spots .e-loop-item .almara-location-card { box-shadow: 0 18px 46px rgba(31, 60, 76, 0.075) !important; transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important; } html body #almara-locations-v150-spots .almara-location-card:hover, html body #almara-locations-v150-spots .e-loop-item .almara-location-card:hover { transform: translateY(-3px) !important; box-shadow: 0 24px 58px rgba(31, 60, 76, 0.11) !important; } /* ---------- Final CTA mobile clarity ---------- */ @media (max-width: 767px) { html body #almara-locations-v150-final .elementor-button, html body #almara-locations-v150-final .elementor-button-link { min-width: 0 !important; max-width: 100% !important; white-space: normal !important; line-height: 1.18 !important; text-align: center !important; } html body #almara-locations-v150-final .elementor-button-text { white-space: normal !important; line-height: 1.18 !important; } } /* ============================================================ ALMARA Locations v1.7.2 — Hero Premium Frame selector fix Scope: Locations hero image widget using .almara-hero-premium-frame Reason: v1.7.1 still targeted legacy .almara-coastline-visual. Architecture: CSS-only polish. No PHP, no JS, no layout hacks. ============================================================ */ /* Hero image widget: premium frame applied to the CURRENT class */ html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { position: relative !important; display: block !important; width: min(560px, 44vw) !important; max-width: 560px !important; min-width: 360px !important; margin: 0 auto !important; padding: 8px !important; background: rgba(255,255,255,.96) !important; border: 1px solid rgba(110,193,194,.68) !important; border-radius: 26px !important; box-shadow: 0 26px 64px rgba(31,60,76,.16), 0 0 0 1px rgba(255,255,255,.72) inset, 0 0 34px rgba(110,193,194,.20) !important; overflow: visible !important; isolation: isolate !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame::before { content: "" !important; position: absolute !important; inset: -18px -22px -24px -22px !important; z-index: -1 !important; border-radius: 34px !important; background: radial-gradient(circle at 78% 22%, rgba(110,193,194,.26), transparent 44%), radial-gradient(circle at 22% 88%, rgba(237,168,142,.18), transparent 48%) !important; filter: blur(8px) !important; opacity: .92 !important; pointer-events: none !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame::after { content: "" !important; position: absolute !important; inset: 8px !important; z-index: 2 !important; border-radius: 18px !important; background: linear-gradient(135deg, rgba(255,255,255,.18), transparent 42%) !important; pointer-events: none !important; mix-blend-mode: soft-light !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border-radius: 18px !important; overflow: hidden !important; box-shadow: none !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img { display: block !important; width: 100% !important; max-width: none !important; min-width: 0 !important; height: auto !important; aspect-ratio: 16 / 9 !important; object-fit: cover !important; object-position: 50% 50% !important; border-radius: 18px !important; box-shadow: none !important; filter: saturate(1.06) contrast(1.035) brightness(1.02) !important; } @media (min-width: 1025px) { html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(580px, 43vw) !important; max-width: 580px !important; } } @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(520px, calc(100vw - 80px)) !important; max-width: 520px !important; min-width: 0 !important; padding: 7px !important; border-radius: 24px !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .almara-hero-premium-frame::after { border-radius: 17px !important; } } @media (max-width: 767px) { html body #almara-locations-v150-hero .almara-hero-premium-frame, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame { width: min(330px, calc(100vw - 44px)) !important; max-width: min(330px, calc(100vw - 44px)) !important; min-width: 0 !important; margin: 20px auto 0 !important; padding: 6px !important; border-radius: 23px !important; box-shadow: 0 20px 48px rgba(31,60,76,.16), 0 0 0 1px rgba(255,255,255,.72) inset, 0 0 28px rgba(110,193,194,.18) !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame::before { inset: -12px -12px -18px -12px !important; border-radius: 30px !important; filter: blur(7px) !important; opacity: .84 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .almara-hero-premium-frame::after { border-radius: 17px !important; } } /* ============================================================ ALMARA Locations v1.7.3 — Hero image width hard fix Scope: active original Locations hero with .almara-hero-premium-frame Reason: image frame style worked, but parent Hero Visual container still constrained the image width. Architecture: CSS-only polish. No PHP, no JS, no JSON changes. ============================================================ */ /* The Hero Visual container itself must be allowed to be as wide as the premium image. */ @media (min-width: 1025px) { html body #almara-locations-v150-hero > .e-con-inner { gap: clamp(64px, 7vw, 112px) !important; align-items: center !important; overflow: visible !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) { flex: 0 1 clamp(520px, 45vw, 640px) !important; width: clamp(520px, 45vw, 640px) !important; max-width: 640px !important; min-width: 520px !important; align-self: center !important; overflow: visible !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) > .e-con-inner { width: 100% !important; max-width: none !important; min-width: 0 !important; display: flex !important; justify-content: center !important; align-items: center !important; overflow: visible !important; padding: 0 !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame, html body #almara-locations-v150-hero .almara-hero-premium-frame { width: 100% !important; max-width: 620px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; } } /* Tablet: keep the visual generous, but not wider than the viewport. */ @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) { width: 100% !important; max-width: 100% !important; min-width: 0 !important; align-self: center !important; overflow: visible !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) > .e-con-inner { width: 100% !important; max-width: none !important; display: flex !important; justify-content: center !important; align-items: center !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame, html body #almara-locations-v150-hero .almara-hero-premium-frame { width: min(560px, calc(100vw - 72px)) !important; max-width: min(560px, calc(100vw - 72px)) !important; min-width: 0 !important; } } /* Mobile: parent column gets full usable width; image gets a fixed premium mobile width. */ @media (max-width: 767px) { html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) { width: 100% !important; max-width: 100% !important; min-width: 0 !important; align-self: stretch !important; overflow: visible !important; display: flex !important; justify-content: center !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element:has(.almara-hero-premium-frame) > .e-con-inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; display: flex !important; justify-content: center !important; align-items: center !important; padding: 0 !important; overflow: visible !important; } html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame, html body #almara-locations-v150-hero .almara-hero-premium-frame { width: min(356px, calc(100vw - 32px)) !important; max-width: min(356px, calc(100vw - 32px)) !important; min-width: 0 !important; margin: 18px auto 0 !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { width: 100% !important; max-width: none !important; min-width: 0 !important; } } /* ============================================================ ALMARA Locations v1.7.4 — Mobile Hero Width Normalization Scope: Locations page only Reason: v1.7.3 widened the hero image but the mobile Elementor template/hero parent remained constrained, causing the visual to sit inside a too-narrow column with excessive vertical space. Architecture: CSS-only. No PHP, no JS, no JSON changes. ============================================================ */ @media (max-width: 767px) { /* 1) Make the embedded Elementor template itself use the phone viewport. */ html body .elementor-widget-template:has(#almara-locations-v150-hero), html body .elementor-widget-template:has(#almara-locations-v150-hero) > .elementor-widget-container, html body .elementor-widget-template:has(#almara-locations-v150-hero) .elementor-template, html body .elementor-widget-template:has(#almara-locations-v150-hero) .elementor-template > .elementor, html body .elementor-widget-template:has(#almara-locations-v150-hero) [data-elementor-type="page"] { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; align-self: stretch !important; overflow: visible !important; } /* 2) Normalize the active original hero section. Do not use a narrow parent width. */ html body #almara-locations-v150-hero { width: calc(100vw - 32px) !important; max-width: 390px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding: 52px 16px 48px !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: stretch !important; gap: 26px !important; transform: none !important; left: auto !important; right: auto !important; } html body #almara-locations-v150-hero > .e-con-inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 auto !important; padding: 0 !important; display: flex !important; flex-direction: column !important; justify-content: flex-start !important; align-items: stretch !important; gap: 22px !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; } /* 3) Every direct hero child gets full usable mobile width. */ html body #almara-locations-v150-hero > .e-con-inner > .elementor-element { width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 1 auto !important; align-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; } html body #almara-locations-v150-hero > .e-con-inner > .elementor-element > .e-con-inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; } /* 4) Copy/CTA spacing: compact and stable. */ html body #almara-locations-v150-hero .almara-eyebrow, html body #almara-locations-v150-hero .almara-hero-title, html body #almara-locations-v150-hero .almara-copy, html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-hero .elementor-widget-heading, html body #almara-locations-v150-hero .elementor-widget-text-editor, html body #almara-locations-v150-hero .elementor-widget-button { max-width: 100% !important; min-width: 0 !important; } html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-hero .CTA-Row, html body #almara-locations-v150-hero .cta-row { gap: 10px !important; margin-top: 4px !important; margin-bottom: 0 !important; } /* 5) Hero image: wide enough to feel premium, but never clipped. */ html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame, html body #almara-locations-v150-hero .almara-hero-premium-frame { width: min(100%, 340px) !important; max-width: min(100%, 340px) !important; min-width: 0 !important; margin: 8px auto 0 !important; padding: 7px !important; border-radius: 24px !important; flex: 0 1 auto !important; align-self: center !important; position: relative !important; left: auto !important; right: auto !important; transform: none !important; overflow: visible !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame > .elementor-widget-container, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame > .elementor-widget-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; padding: 0 !important; margin: 0 !important; border-radius: 18px !important; overflow: hidden !important; } html body #almara-locations-v150-hero .almara-hero-premium-frame img, html body #almara-locations-v150-hero .elementor-widget-image.almara-hero-premium-frame img { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; aspect-ratio: 16 / 9 !important; object-fit: cover !important; object-position: 50% 50% !important; border-radius: 18px !important; } /* 6) If Elementor preview still constrains via variable widths, neutralize them in the hero. */ html body #almara-locations-v150-hero, html body #almara-locations-v150-hero * { --width: 100% !important; --min-height: 0 !important; --flex-basis: auto !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 0 !important; } } /* ========================================================= ALMARA Locations Single Preview v1.5.9 — INTERNAL PREVIEW RENDERING Scope: single CPT pages for almara_location Purpose: - make "Vorschau der Änderungen" / single location preview render like ALMARA Locations B2C - fixes header overlap on CPT preview URLs - applies final Locations typography, image card, meta-card rhythm - CSS only; no PHP, no JS, no public routing changes ========================================================= */ :root { --almara-single-blue: var(--almara-blue, #1F3C4C); --almara-single-aqua: var(--almara-aqua, #6EC1C2); --almara-single-sand: var(--almara-sand, #F4EDE4); --almara-single-white: var(--almara-white, #FFFFFF); --almara-single-muted: var(--almara-muted, rgba(31, 60, 76, 0.72)); --almara-single-border: var(--almara-border, rgba(31, 60, 76, 0.15)); --almara-single-shadow: var(--almara-shadow-card, 0 24px 64px rgba(31, 60, 76, 0.10)); --almara-single-shadow-soft: var(--almara-shadow-soft, 0 18px 46px rgba(31, 60, 76, 0.08)); --almara-single-display: var(--almara-font-display, "Cormorant Garamond", Georgia, serif); --almara-single-ui: var(--almara-font-ui, "Inter", Arial, sans-serif); } /* ---------- CPT preview/page shell ---------- */ html body.single-almara_location, html body.post-type-almara_location, html body:has(article.almara_location) { background: var(--almara-single-sand) !important; } html body.single-almara_location .site-main, html body.single-almara_location main, html body.single-almara_location #content, html body.post-type-almara_location .site-main, html body.post-type-almara_location main, html body.post-type-almara_location #content, html body:has(article.almara_location) .site-main, html body:has(article.almara_location) main, html body:has(article.almara_location) #content { box-sizing: border-box !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: clamp(98px, 9vw, 142px) 0 clamp(72px, 7vw, 110px) !important; background: radial-gradient(circle at 82% 12%, rgba(110, 193, 194, 0.16), transparent 34%), linear-gradient(180deg, rgba(255, 255, 255, 0.28), rgba(244, 237, 228, 0) 38%) !important; overflow: visible !important; } /* If the header is fixed/sticky, prevent the default title from sliding underneath it. */ html body.single-almara_location .elementor-location-header + .site-main, html body.post-type-almara_location .elementor-location-header + .site-main, html body:has(article.almara_location) .elementor-location-header + .site-main { padding-top: clamp(118px, 10vw, 164px) !important; } /* ---------- Default WP article styling ---------- */ html body.single-almara_location article.almara_location, html body.post-type-almara_location article.almara_location, html body:has(article.almara_location) article.almara_location, html body.single-almara_location article[id*="post-"], html body.post-type-almara_location article[id*="post-"] { box-sizing: border-box !important; width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; margin: 0 auto !important; padding: 0 !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-ui) !important; } /* Preview kicker, added via CSS so no Elementor/ACF field is required. */ html body.single-almara_location article.almara_location::before, html body.post-type-almara_location article.almara_location::before, html body:has(article.almara_location) article.almara_location::before { content: "ALMARA LOCATION PREVIEW" !important; display: block !important; margin: 0 0 16px !important; color: rgba(31, 60, 76, 0.62) !important; font-family: var(--almara-single-ui) !important; font-size: 11px !important; line-height: 1.4 !important; font-weight: 850 !important; letter-spacing: 0.20em !important; text-transform: uppercase !important; } /* Header/title block */ html body.single-almara_location article.almara_location .entry-header, html body.post-type-almara_location article.almara_location .entry-header, html body:has(article.almara_location) article.almara_location .entry-header { width: min(860px, 100%) !important; margin: 0 0 clamp(28px, 4vw, 46px) !important; padding: 0 !important; } html body.single-almara_location article.almara_location .entry-title, html body.post-type-almara_location article.almara_location .entry-title, html body:has(article.almara_location) article.almara_location .entry-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title, html body:has(article.almara_location) h1.entry-title { position: relative !important; z-index: 1 !important; display: block !important; max-width: 840px !important; margin: 0 !important; padding: 0 !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-display) !important; font-size: clamp(56px, 6.1vw, 92px) !important; line-height: 1.03 !important; font-weight: 600 !important; letter-spacing: -0.018em !important; text-transform: none !important; text-wrap: balance !important; transform: none !important; } /* Default Hello/Theme metadata should not dominate the internal preview. */ html body.single-almara_location article.almara_location .entry-meta, html body.post-type-almara_location article.almara_location .entry-meta, html body:has(article.almara_location) article.almara_location .entry-meta, html body.single-almara_location article.almara_location .post-meta, html body.post-type-almara_location article.almara_location .post-meta { display: none !important; } /* Featured image / post thumbnail */ html body.single-almara_location article.almara_location .post-thumbnail, html body.post-type-almara_location article.almara_location .post-thumbnail, html body:has(article.almara_location) article.almara_location .post-thumbnail, html body.single-almara_location article.almara_location .wp-post-image, html body.post-type-almara_location article.almara_location .wp-post-image, html body:has(article.almara_location) article.almara_location .wp-post-image { box-sizing: border-box !important; } html body.single-almara_location article.almara_location .post-thumbnail, html body.post-type-almara_location article.almara_location .post-thumbnail, html body:has(article.almara_location) article.almara_location .post-thumbnail { width: min(980px, 100%) !important; margin: 0 auto clamp(34px, 4vw, 56px) !important; overflow: hidden !important; border: 1px solid rgba(110, 193, 194, 0.34) !important; border-radius: 28px !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: 0 22px 60px rgba(31, 60, 76, 0.10) !important; } html body.single-almara_location article.almara_location .post-thumbnail img, html body.post-type-almara_location article.almara_location .post-thumbnail img, html body:has(article.almara_location) article.almara_location .post-thumbnail img, html body.single-almara_location article.almara_location img.wp-post-image, html body.post-type-almara_location article.almara_location img.wp-post-image, html body:has(article.almara_location) article.almara_location img.wp-post-image { display: block !important; width: 100% !important; max-width: 100% !important; height: clamp(280px, 32vw, 420px) !important; object-fit: cover !important; object-position: 50% 50% !important; border-radius: 28px !important; } /* Content / ACF preview fields */ html body.single-almara_location article.almara_location .entry-content, html body.post-type-almara_location article.almara_location .entry-content, html body:has(article.almara_location) article.almara_location .entry-content { box-sizing: border-box !important; width: min(860px, 100%) !important; max-width: 860px !important; margin: 0 auto !important; padding: 0 !important; display: grid !important; grid-template-columns: 1fr !important; gap: 14px !important; color: var(--almara-single-muted) !important; font-family: var(--almara-single-ui) !important; } /* Make raw "Land: … / Area: … / Status: …" lines read like the final Locations UI. */ html body.single-almara_location article.almara_location .entry-content > p, html body.post-type-almara_location article.almara_location .entry-content > p, html body:has(article.almara_location) article.almara_location .entry-content > p { box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; width: 100% !important; margin: 0 !important; padding: 18px 22px !important; border: 1px solid var(--almara-single-border) !important; border-radius: 18px !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: 0 10px 28px rgba(31, 60, 76, 0.055) !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-ui) !important; font-size: 16px !important; line-height: 1.55 !important; font-weight: 650 !important; } /* Elementor-based internal preview template support. Add this class to the root container if you build the Single template in Elementor. */ html body .almara-single-location-preview, html body .almara-single-location-preview * { box-sizing: border-box !important; } html body .almara-single-location-preview { width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; margin: 0 auto !important; padding: clamp(88px, 8vw, 128px) 0 clamp(72px, 7vw, 110px) !important; } html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-preview__hero { display: grid !important; grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1.08fr) !important; align-items: center !important; gap: clamp(48px, 6vw, 86px) !important; } html body .almara-single-location-preview .almara-single-location-preview__image, html body .almara-single-location-preview__image, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image, html body .almara-single-location-preview .elementor-widget-image { width: 100% !important; max-width: 100% !important; } html body .almara-single-location-preview .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image .elementor-widget-container { overflow: hidden !important; border: 1px solid rgba(110, 193, 194, 0.34) !important; border-radius: 28px !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: 0 22px 60px rgba(31, 60, 76, 0.10) !important; } html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-preview__image img, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image img { display: block !important; width: 100% !important; height: clamp(280px, 32vw, 420px) !important; object-fit: cover !important; border-radius: 28px !important; } html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-preview__details { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 14px !important; width: 100% !important; margin-top: clamp(30px, 4vw, 48px) !important; } html body .almara-single-location-preview .almara-single-location-preview__details .elementor-widget, html body .almara-single-location-preview__details .elementor-widget { border: 1px solid var(--almara-single-border) !important; border-radius: 18px !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: 0 10px 28px rgba(31, 60, 76, 0.055) !important; padding: 18px 20px !important; } /* Hide non-essential WP chrome around previews */ html body.single-almara_location .post-tags, html body.single-almara_location .cat-links, html body.single-almara_location .comments-area, html body.single-almara_location nav.post-navigation, html body.post-type-almara_location .post-tags, html body.post-type-almara_location .cat-links, html body.post-type-almara_location .comments-area, html body.post-type-almara_location nav.post-navigation, html body:has(article.almara_location) .post-tags, html body:has(article.almara_location) .cat-links, html body:has(article.almara_location) .comments-area, html body:has(article.almara_location) nav.post-navigation { display: none !important; } /* ---------- Tablet ---------- */ @media (max-width: 1180px) { html body.single-almara_location article.almara_location, html body.post-type-almara_location article.almara_location, html body:has(article.almara_location) article.almara_location, html body.single-almara_location article[id*="post-"], html body.post-type-almara_location article[id*="post-"], html body .almara-single-location-preview { width: min(980px, calc(100% - 48px)) !important; max-width: 980px !important; } html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-preview__hero { grid-template-columns: 1fr !important; gap: 36px !important; } } /* ---------- Mobile ---------- */ @media (max-width: 767px) { html body.single-almara_location .site-main, html body.single-almara_location main, html body.single-almara_location #content, html body.post-type-almara_location .site-main, html body.post-type-almara_location main, html body.post-type-almara_location #content, html body:has(article.almara_location) .site-main, html body:has(article.almara_location) main, html body:has(article.almara_location) #content { padding-top: 96px !important; padding-bottom: 64px !important; } html body.single-almara_location article.almara_location, html body.post-type-almara_location article.almara_location, html body:has(article.almara_location) article.almara_location, html body.single-almara_location article[id*="post-"], html body.post-type-almara_location article[id*="post-"], html body .almara-single-location-preview { width: min(390px, calc(100% - 32px)) !important; max-width: 390px !important; } html body.single-almara_location article.almara_location::before, html body.post-type-almara_location article.almara_location::before, html body:has(article.almara_location) article.almara_location::before { font-size: 10px !important; letter-spacing: 0.16em !important; } html body.single-almara_location article.almara_location .entry-title, html body.post-type-almara_location article.almara_location .entry-title, html body:has(article.almara_location) article.almara_location .entry-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title, html body:has(article.almara_location) h1.entry-title { font-size: clamp(40px, 11vw, 56px) !important; line-height: 1.04 !important; } html body.single-almara_location article.almara_location .post-thumbnail, html body.post-type-almara_location article.almara_location .post-thumbnail, html body:has(article.almara_location) article.almara_location .post-thumbnail, html body.single-almara_location article.almara_location .post-thumbnail img, html body.post-type-almara_location article.almara_location .post-thumbnail img, html body:has(article.almara_location) article.almara_location .post-thumbnail img, html body.single-almara_location article.almara_location img.wp-post-image, html body.post-type-almara_location article.almara_location img.wp-post-image, html body:has(article.almara_location) article.almara_location img.wp-post-image { border-radius: 22px !important; } html body.single-almara_location article.almara_location .post-thumbnail img, html body.post-type-almara_location article.almara_location .post-thumbnail img, html body:has(article.almara_location) article.almara_location .post-thumbnail img, html body.single-almara_location article.almara_location img.wp-post-image, html body.post-type-almara_location article.almara_location img.wp-post-image, html body:has(article.almara_location) article.almara_location img.wp-post-image, html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-preview__image img { height: auto !important; aspect-ratio: 4 / 3 !important; } html body.single-almara_location article.almara_location .entry-content > p, html body.post-type-almara_location article.almara_location .entry-content > p, html body:has(article.almara_location) article.almara_location .entry-content > p { flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; padding: 16px 18px !important; font-size: 15px !important; } html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-preview__details { grid-template-columns: 1fr !important; gap: 12px !important; } } /* ========================================================= ALMARA Single Location Preview v1.5.10 — CLASS ALIAS FIX Scope: Single CPT almara_location preview/detail pages Reason: Supports both class naming schemes: - .almara-single-location-hero / image / meta / meta-card - .almara-single-location-preview__hero / image / details ========================================================= */ :root { --almara-single-blue: var(--almara-blue, #1F3C4C); --almara-single-aqua: var(--almara-aqua, #6EC1C2); --almara-single-sand: var(--almara-sand, #F4EDE4); --almara-single-white: var(--almara-white, #FFFFFF); --almara-single-muted: var(--almara-muted, rgba(31, 60, 76, 0.72)); --almara-single-border: var(--almara-border, rgba(31, 60, 76, 0.15)); --almara-single-shadow: var(--almara-shadow-card, 0 24px 64px rgba(31, 60, 76, 0.10)); --almara-single-shadow-soft: var(--almara-shadow-soft, 0 18px 46px rgba(31, 60, 76, 0.08)); --almara-single-display: var(--almara-font-display, "Cormorant Garamond", Georgia, serif); --almara-single-ui: var(--almara-font-ui, "Inter", Arial, sans-serif); } /* Single CPT page fallback: prevent title/header collision even if wrapper is missing. */ html body.single-almara_location, html body.post-type-almara_location { background: var(--almara-single-sand) !important; } html body.single-almara_location .site-main, html body.single-almara_location main, html body.single-almara_location article, html body.single-almara_location .entry-content, html body.post-type-almara_location .site-main, html body.post-type-almara_location main, html body.post-type-almara_location article, html body.post-type-almara_location .entry-content { overflow: visible !important; } /* Main wrapper: supports both a dedicated Elementor container class and body fallback. */ html body .almara-single-location-preview, html body.single-almara_location .almara-single-location-preview, html body.post-type-almara_location .almara-single-location-preview { box-sizing: border-box !important; width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; margin: 0 auto !important; padding: clamp(92px, 8vw, 132px) 0 clamp(76px, 7vw, 112px) !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-ui) !important; } /* Elementor inner wrapper normalisation. */ html body .almara-single-location-preview > .e-con-inner { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; padding: 0 !important; } /* Hero/content area aliases. */ html body .almara-single-location-preview .almara-single-location-hero, html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-hero, html body .almara-single-location-preview__hero { box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr) !important; gap: clamp(42px, 5.4vw, 78px) !important; align-items: center !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-hero > .e-con-inner, html body .almara-single-location-preview .almara-single-location-preview__hero > .e-con-inner, html body .almara-single-location-hero > .e-con-inner, html body .almara-single-location-preview__hero > .e-con-inner { display: contents !important; } /* Title aliases. */ html body .almara-single-location-preview .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview .almara-single-location-preview__title .elementor-heading-title, html body .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview__title .elementor-heading-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title { font-family: var(--almara-single-display) !important; color: var(--almara-single-blue) !important; font-size: clamp(52px, 5.5vw, 86px) !important; line-height: 1.02 !important; font-weight: 600 !important; letter-spacing: -0.018em !important; margin: 0 0 26px !important; max-width: 680px !important; text-transform: none !important; transform: none !important; white-space: normal !important; overflow: visible !important; } /* Image aliases. */ html body .almara-single-location-preview .almara-single-location-image, html body .almara-single-location-preview .almara-single-location-preview__image, html body .almara-single-location-image, html body .almara-single-location-preview__image, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image, html body .almara-single-location-preview .elementor-widget-image { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image .elementor-widget-container, html body .almara-single-location-preview .elementor-widget-image .elementor-widget-container { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border-radius: 24px !important; border: 1px solid var(--almara-single-border) !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: var(--almara-single-shadow) !important; } html body .almara-single-location-preview .almara-single-location-image img, html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-image img, html body .almara-single-location-preview__image img, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image img, html body .almara-single-location-preview .elementor-widget-image img { display: block !important; width: 100% !important; max-width: none !important; height: clamp(300px, 34vw, 460px) !important; object-fit: cover !important; object-position: center center !important; border-radius: 24px !important; } /* Meta/details aliases. */ html body .almara-single-location-preview .almara-single-location-meta, html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-meta, html body .almara-single-location-preview__details { box-sizing: border-box !important; display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; width: 100% !important; max-width: 100% !important; margin: clamp(34px, 4vw, 54px) 0 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-meta-card, html body .almara-single-location-preview .almara-single-location-preview__details .elementor-widget, html body .almara-single-location-meta-card, html body .almara-single-location-preview__details .elementor-widget { box-sizing: border-box !important; min-height: 86px !important; padding: 20px 22px !important; border: 1px solid var(--almara-single-border) !important; border-radius: 18px !important; background: rgba(255, 255, 255, 0.74) !important; box-shadow: var(--almara-single-shadow-soft) !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-ui) !important; font-size: 15px !important; line-height: 1.55 !important; } html body .almara-single-location-preview .almara-single-location-meta-card p, html body .almara-single-location-meta-card p, html body .almara-single-location-preview__details .elementor-widget p { margin: 0 !important; color: var(--almara-single-muted) !important; font-size: 15px !important; line-height: 1.55 !important; } /* Optional badge/status styling for preview fields. */ html body .almara-single-location-preview .almara-location-badge, html body .almara-single-location-preview .almara-location-status, html body .almara-single-location-preview .almara-status-pill { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 24px !important; padding: 0 10px !important; border-radius: 999px !important; background: rgba(110, 193, 194, 0.18) !important; color: rgba(31, 60, 76, 0.78) !important; font-family: var(--almara-single-ui) !important; font-size: 10px !important; line-height: 1 !important; font-weight: 850 !important; letter-spacing: 0.10em !important; text-transform: uppercase !important; } @media (max-width: 1024px) { html body .almara-single-location-preview { width: min(980px, calc(100% - 48px)) !important; padding-top: 82px !important; } html body .almara-single-location-preview .almara-single-location-hero, html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-hero, html body .almara-single-location-preview__hero { grid-template-columns: 1fr !important; gap: 34px !important; } html body .almara-single-location-preview .almara-single-location-meta, html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-meta, html body .almara-single-location-preview__details { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } } @media (max-width: 767px) { html body .almara-single-location-preview { width: min(390px, calc(100% - 32px)) !important; padding-top: 54px !important; padding-bottom: 64px !important; } html body .almara-single-location-preview .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview .almara-single-location-preview__title .elementor-heading-title, html body .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview__title .elementor-heading-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title { font-size: clamp(40px, 11vw, 54px) !important; line-height: 1.04 !important; } html body .almara-single-location-preview .almara-single-location-image img, html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-image img, html body .almara-single-location-preview__image img, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image img, html body .almara-single-location-preview .elementor-widget-image img { height: auto !important; aspect-ratio: 4 / 3 !important; } html body .almara-single-location-preview .almara-single-location-meta, html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-meta, html body .almara-single-location-preview__details { grid-template-columns: 1fr !important; gap: 12px !important; margin-top: 28px !important; } } /* ========================================================= ALMARA Single Location Preview v1.5.11 — Final Listing Alignment Scope: Elementor Theme Builder Single for CPT almara_location Intent: - keep the internal single preview useful - move visual language closer to the final Locations card output - no dependency on shortcode rendering - supports both alias class systems from v1.5.10 Required outer class: .almara-single-location-preview Existing supported child classes: .almara-single-location-hero / .almara-single-location-title / .almara-single-location-image / .almara-single-location-meta / .almara-single-location-meta-card ========================================================= */ html body.single-almara_location, html body.post-type-almara_location { background: var(--almara-sand, #F4EDE4) !important; } html body .almara-single-location-preview, html body.single-almara_location .almara-single-location-preview, html body.post-type-almara_location .almara-single-location-preview { --almara-single-blue: #1F3C4C; --almara-single-aqua: #6EC1C2; --almara-single-sand: #F4EDE4; --almara-single-white: #FFFFFF; --almara-single-muted: rgba(31, 60, 76, 0.68); --almara-single-border: rgba(31, 60, 76, 0.16); --almara-single-border-soft: rgba(31, 60, 76, 0.10); --almara-single-shadow: 0 24px 64px rgba(31, 60, 76, 0.09); --almara-single-shadow-soft: 0 14px 38px rgba(31, 60, 76, 0.06); --almara-single-serif: "Cormorant Garamond", Georgia, serif; --almara-single-ui: "Inter", Arial, sans-serif; box-sizing: border-box !important; width: min(1120px, calc(100% - 72px)) !important; max-width: 1120px !important; margin: 0 auto !important; padding: clamp(62px, 6.5vw, 96px) 0 clamp(72px, 7vw, 108px) !important; color: var(--almara-single-blue) !important; overflow: visible !important; } html body .almara-single-location-preview *, html body .almara-single-location-preview *::before, html body .almara-single-location-preview *::after { box-sizing: border-box !important; } html body .almara-single-location-preview > .e-con-inner { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } /* Hero: editorial two-column, but tighter and closer to Locations final rhythm. */ html body .almara-single-location-preview .almara-single-location-hero, html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-hero, html body .almara-single-location-preview__hero { display: grid !important; grid-template-columns: minmax(0, 0.82fr) minmax(380px, 1.18fr) !important; gap: clamp(44px, 5vw, 72px) !important; align-items: center !important; justify-content: stretch !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-hero > .e-con-inner, html body .almara-single-location-preview .almara-single-location-preview__hero > .e-con-inner, html body .almara-single-location-hero > .e-con-inner, html body .almara-single-location-preview__hero > .e-con-inner { display: contents !important; } /* Title block: add the same curated-location editorial feeling as the final page. */ html body .almara-single-location-preview .almara-single-location-title, html body .almara-single-location-preview .almara-single-location-preview__title, html body .almara-single-location-title, html body .almara-single-location-preview__title { width: 100% !important; max-width: 560px !important; margin: 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-title::before, html body .almara-single-location-preview .almara-single-location-preview__title::before, html body .almara-single-location-title::before, html body .almara-single-location-preview__title::before { content: "ALMARA LOCATION" !important; display: block !important; margin: 0 0 18px !important; font-family: var(--almara-single-ui) !important; font-size: 11px !important; line-height: 1.35 !important; font-weight: 850 !important; letter-spacing: 0.20em !important; text-transform: uppercase !important; color: rgba(31, 60, 76, 0.58) !important; } html body .almara-single-location-preview .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview .almara-single-location-preview__title .elementor-heading-title, html body .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview__title .elementor-heading-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title { margin: 0 !important; padding: 0 !important; max-width: 560px !important; font-family: var(--almara-single-serif) !important; font-size: clamp(52px, 5.3vw, 78px) !important; line-height: 1.03 !important; font-weight: 600 !important; letter-spacing: -0.018em !important; color: var(--almara-single-blue) !important; text-transform: none !important; word-break: normal !important; overflow-wrap: normal !important; } /* Image: same calm card/image language as the final Location cards, but scaled as hero preview. */ html body .almara-single-location-preview .almara-single-location-image, html body .almara-single-location-preview .almara-single-location-preview__image, html body .almara-single-location-image, html body .almara-single-location-preview__image, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image, html body .almara-single-location-preview .elementor-widget-image { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image .elementor-widget-container, html body .almara-single-location-preview .elementor-widget-image .elementor-widget-container { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 10px !important; overflow: hidden !important; border-radius: 22px !important; border: 1px solid var(--almara-single-border) !important; background: rgba(255, 255, 255, 0.72) !important; box-shadow: var(--almara-single-shadow) !important; } html body .almara-single-location-preview .almara-single-location-image img, html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-image img, html body .almara-single-location-preview__image img, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image img, html body .almara-single-location-preview .elementor-widget-image img { display: block !important; width: 100% !important; max-width: none !important; height: clamp(300px, 30vw, 390px) !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center center !important; border-radius: 16px !important; filter: saturate(1.02) contrast(1.015) !important; } /* Meta: no longer large isolated blocks; behave closer to the final badge/status rhythm. */ html body .almara-single-location-preview .almara-single-location-meta, html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-meta, html body .almara-single-location-preview__details { box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important; gap: 10px !important; width: 100% !important; max-width: 760px !important; margin: clamp(34px, 4vw, 52px) 0 0 !important; padding: 0 !important; } html body .almara-single-location-preview .almara-single-location-meta-card, html body .almara-single-location-preview .almara-single-location-preview__details .elementor-widget, html body .almara-single-location-meta-card, html body .almara-single-location-preview__details .elementor-widget { box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; min-height: 38px !important; margin: 0 !important; padding: 0 16px !important; border: 1px solid rgba(31, 60, 76, 0.12) !important; border-radius: 999px !important; background: rgba(255, 255, 255, 0.76) !important; box-shadow: 0 10px 24px rgba(31, 60, 76, 0.055) !important; color: var(--almara-single-blue) !important; font-family: var(--almara-single-ui) !important; font-size: 13px !important; line-height: 1 !important; font-weight: 700 !important; white-space: nowrap !important; } html body .almara-single-location-preview .almara-single-location-meta-card p, html body .almara-single-location-meta-card p, html body .almara-single-location-preview__details .elementor-widget p { display: inline !important; margin: 0 !important; padding: 0 !important; color: var(--almara-single-muted) !important; font-family: var(--almara-single-ui) !important; font-size: 13px !important; line-height: 1 !important; font-weight: 700 !important; } html body .almara-single-location-preview .almara-single-location-meta-card strong, html body .almara-single-location-preview .almara-single-location-meta-card b, html body .almara-single-location-preview__details .elementor-widget strong, html body .almara-single-location-preview__details .elementor-widget b { color: var(--almara-single-blue) !important; font-weight: 850 !important; } /* Optional Cardlike Mode: add class .almara-single-location-preview--cardlike to outer wrapper if the single preview should mimic the loop-card even more strongly. */ html body .almara-single-location-preview.almara-single-location-preview--cardlike { width: min(520px, calc(100% - 48px)) !important; max-width: 520px !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-hero, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__hero { display: flex !important; flex-direction: column-reverse !important; gap: 0 !important; padding: 12px !important; border: 1px solid var(--almara-single-border) !important; background: #fff !important; box-shadow: var(--almara-single-shadow) !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-title, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__title { padding: 24px 0 10px !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-title::before, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__title::before { display: none !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__title .elementor-heading-title { font-size: clamp(30px, 3vw, 42px) !important; line-height: 1.1 !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__image .elementor-widget-container { padding: 0 !important; border: 0 !important; border-radius: 16px 16px 0 0 !important; box-shadow: none !important; background: transparent !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-image img, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__image img { height: 260px !important; border-radius: 16px 16px 0 0 !important; } html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-meta, html body .almara-single-location-preview.almara-single-location-preview--cardlike .almara-single-location-preview__details { margin-top: 18px !important; } @media (max-width: 1024px) { html body .almara-single-location-preview, html body.single-almara_location .almara-single-location-preview, html body.post-type-almara_location .almara-single-location-preview { width: min(920px, calc(100% - 48px)) !important; padding-top: 72px !important; } html body .almara-single-location-preview .almara-single-location-hero, html body .almara-single-location-preview .almara-single-location-preview__hero, html body .almara-single-location-hero, html body .almara-single-location-preview__hero { grid-template-columns: 1fr !important; gap: 34px !important; align-items: stretch !important; } html body .almara-single-location-preview .almara-single-location-title, html body .almara-single-location-preview .almara-single-location-preview__title, html body .almara-single-location-title, html body .almara-single-location-preview__title { max-width: 680px !important; } html body .almara-single-location-preview .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview .almara-single-location-preview__title .elementor-heading-title, html body .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview__title .elementor-heading-title { max-width: 680px !important; } } @media (max-width: 767px) { html body .almara-single-location-preview, html body.single-almara_location .almara-single-location-preview, html body.post-type-almara_location .almara-single-location-preview { width: min(390px, calc(100% - 32px)) !important; padding-top: 46px !important; padding-bottom: 64px !important; } html body .almara-single-location-preview .almara-single-location-title::before, html body .almara-single-location-preview .almara-single-location-preview__title::before, html body .almara-single-location-title::before, html body .almara-single-location-preview__title::before { margin-bottom: 12px !important; font-size: 10px !important; } html body .almara-single-location-preview .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview .almara-single-location-preview__title .elementor-heading-title, html body .almara-single-location-title .elementor-heading-title, html body .almara-single-location-preview__title .elementor-heading-title, html body.single-almara_location h1.entry-title, html body.post-type-almara_location h1.entry-title { font-size: clamp(40px, 11vw, 54px) !important; line-height: 1.04 !important; } html body .almara-single-location-preview .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview .almara-single-location-preview__image .elementor-widget-container, html body .almara-single-location-image .elementor-widget-container, html body .almara-single-location-preview__image .elementor-widget-container { padding: 8px !important; border-radius: 20px !important; } html body .almara-single-location-preview .almara-single-location-image img, html body .almara-single-location-preview .almara-single-location-preview__image img, html body .almara-single-location-image img, html body .almara-single-location-preview__image img, html body .almara-single-location-preview .elementor-widget-theme-post-featured-image img, html body .almara-single-location-preview .elementor-widget-image img { height: auto !important; aspect-ratio: 4 / 3 !important; border-radius: 14px !important; } html body .almara-single-location-preview .almara-single-location-meta, html body .almara-single-location-preview .almara-single-location-preview__details, html body .almara-single-location-meta, html body .almara-single-location-preview__details { gap: 8px !important; margin-top: 26px !important; } html body .almara-single-location-preview .almara-single-location-meta-card, html body .almara-single-location-preview .almara-single-location-preview__details .elementor-widget, html body .almara-single-location-meta-card, html body .almara-single-location-preview__details .elementor-widget { min-height: 34px !important; padding: 0 13px !important; font-size: 12px !important; } html body .almara-single-location-preview .almara-single-location-meta-card p, html body .almara-single-location-meta-card p, html body .almara-single-location-preview__details .elementor-widget p { font-size: 12px !important; } } /* ========================================================= ALMARA Locations v1.8.1 — SAMS Results Layout / Query Fix Scope: B2C Locations result surface only Core pairing: ALMARA Platform Core v1.3.64-sams-v180 Intent: - show max. 6 SAMS-ranked results - first result becomes the editorial SAMS Hero on desktop/tablet - filters still constrain candidates first; SAMS then ranks the candidates - mobile stays linear and readable ========================================================= */ html body #almara-locations-v150-spots { --almara-location-grid-gap-x: 34px; --almara-location-grid-gap-y: 34px; --almara-location-card-radius: 0; --almara-location-card-border: rgba(31, 60, 76, 0.16); --almara-location-card-shadow: 0 22px 58px rgba(31, 60, 76, 0.08); --almara-location-card-shadow-hover: 0 30px 72px rgba(31, 60, 76, 0.13); } /* Result grid: restore curated SAMS surface instead of a generic unlimited directory. */ html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-auto-flow: dense !important; column-gap: var(--almara-location-grid-gap-x) !important; row-gap: var(--almara-location-grid-gap-y) !important; align-items: stretch !important; justify-items: stretch !important; } /* Make every loop item a coherent card shell, including the separate conversion container. */ html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-item, html body #almara-locations-v150-spots .elementor-loop-container > .e-loop-item, html body #almara-locations-v150-spots .e-loop-container > .e-loop-item, html body #almara-locations-v150-spots .elementor-grid > .e-loop-item { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-self: stretch !important; justify-self: stretch !important; width: 100% !important; min-width: 0 !important; max-width: none !important; min-height: 0 !important; margin: 0 !important; background: rgba(255, 255, 255, 0.92) !important; border: 1px solid var(--almara-location-card-border) !important; border-radius: var(--almara-location-card-radius) !important; box-shadow: var(--almara-location-card-shadow) !important; overflow: hidden !important; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease, background-color .24s ease !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-item:hover, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-item:hover { transform: translateY(-4px) !important; border-color: rgba(110, 193, 194, 0.42) !important; box-shadow: var(--almara-location-card-shadow-hover) !important; background: #ffffff !important; } /* Normalize the inner Elementor wrappers generated by the Loop Item. */ html body #almara-locations-v150-spots .e-loop-item > .elementor, html body #almara-locations-v150-spots .e-loop-item > .elementor > .elementor-element, html body #almara-locations-v150-spots .e-loop-item > .elementor-element, html body #almara-locations-v150-spots .e-loop-item .almara-location-card, html body #almara-locations-v150-spots .e-loop-item .almara-location-card > .e-con-inner { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; } /* The content container should not behave like a separate visual card. */ html body #almara-locations-v150-spots .e-loop-item .almara-location-card { flex: 1 1 auto !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 0 !important; padding: 18px 18px 10px !important; margin: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; overflow: visible !important; transform: none !important; } /* The conversion container is the footer of the same card. */ html body #almara-locations-v150-spots .e-loop-item .almara-location-card + .elementor-element, html body #almara-locations-v150-spots .e-loop-item > .elementor-element:not(.almara-location-card):last-child { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; margin-top: auto !important; padding: 0 18px 20px !important; background: transparent !important; border-top: 1px solid rgba(31, 60, 76, 0.08) !important; } /* Image normalization: every normal card gets the same image and title scale. */ html body #almara-locations-v150-spots .e-loop-item .almara-location-card .elementor-widget-image, html body #almara-locations-v150-spots .e-loop-item .almara-location-card .elementor-widget-image .elementor-widget-container { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; border-radius: 14px !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-card img, html body #almara-locations-v150-spots .e-loop-item .almara-location-card img.wp-post-image, html body #almara-locations-v150-spots .e-loop-item .almara-location-card img.almara-location-image { display: block !important; width: 100% !important; max-width: none !important; height: 178px !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center center !important; border-radius: 14px !important; filter: saturate(1.035) contrast(1.02) brightness(1.01) !important; } html body #almara-locations-v150-spots .e-loop-item .elementor-widget-theme-post-title, html body #almara-locations-v150-spots .e-loop-item .elementor-widget-text-editor { width: 100% !important; max-width: 100% !important; } html body #almara-locations-v150-spots .e-loop-item .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .e-loop-item .almara-fix-title .elementor-heading-title { margin: 16px 0 9px !important; font-family: var(--almara-font-display, "Cormorant Garamond", Georgia, serif) !important; font-size: clamp(24px, 1.85vw, 31px) !important; line-height: 1.08 !important; font-weight: 600 !important; letter-spacing: -0.012em !important; color: var(--almara-blue, #1F3C4C) !important; text-transform: none !important; } html body #almara-locations-v150-spots .e-loop-item .elementor-widget-text-editor, html body #almara-locations-v150-spots .e-loop-item .elementor-widget-text-editor p { margin: 0 !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 13px !important; line-height: 1.55 !important; color: rgba(31, 60, 76, 0.66) !important; } /* Badges: keep the wrapper invisible and the badge pills consistent. */ html body #almara-locations-v150-spots .e-loop-item .almara-badge, html body #almara-locations-v150-spots .e-loop-item .almara-location-badges { min-height: 22px !important; margin: 15px 0 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-badge, html body #almara-locations-v150-spots .e-loop-item .almara-badge > span { height: 18px !important; min-height: 18px !important; max-height: 18px !important; padding: 0 7px !important; font-size: 7.6px !important; line-height: 18px !important; letter-spacing: .08em !important; white-space: nowrap !important; } /* CTA normalization inside the Loop Item footer. */ html body #almara-locations-v150-spots .e-loop-item .almara-location-smart-cta, html body #almara-locations-v150-spots .e-loop-item a.almara-location-smart-cta { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: auto !important; max-width: 100% !important; min-height: 38px !important; margin-top: 18px !important; padding: 0 18px !important; border-radius: 999px !important; background: var(--almara-blue, #1F3C4C) !important; color: #ffffff !important; font-family: var(--almara-font-ui, Inter, Arial, sans-serif) !important; font-size: 12px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: .01em !important; text-decoration: none !important; box-shadow: 0 14px 30px rgba(31, 60, 76, .16) !important; transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-smart-cta:hover, html body #almara-locations-v150-spots .e-loop-item a.almara-location-smart-cta:hover { transform: translateY(-1px) !important; background: #216B7E !important; box-shadow: 0 18px 38px rgba(31, 60, 76, .20) !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-smart-cta *, html body #almara-locations-v150-spots .e-loop-item a.almara-location-smart-cta * { color: #ffffff !important; white-space: nowrap !important; } /* Desktop SAMS composition: one editorial hero + two side cards + three cards below. */ @media (min-width: 1025px) { html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } html body #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child { grid-column: span 2 !important; grid-row: span 2 !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child { min-height: 650px !important; } /* If a filter returns only 1–3 locations, keep all cards equal instead of over-promoting one item. */ html body #almara-locations-v150-spots .elementor-loop-container:not(:has(> .e-loop-item:nth-child(4))) > .e-loop-item:first-child, html body #almara-locations-v150-spots .e-loop-container:not(:has(> .e-loop-item:nth-child(4))) > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-grid:not(:has(> .e-loop-item:nth-child(4))) > .e-loop-item:first-child { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card { padding: 24px 24px 12px !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img { height: 360px !important; border-radius: 16px !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title { margin-top: 22px !important; font-size: clamp(42px, 3.8vw, 58px) !important; line-height: 1.02 !important; letter-spacing: -0.018em !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-text-editor, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-text-editor, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-text-editor { font-size: 15px !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-smart-cta, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-smart-cta, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-smart-cta { min-height: 42px !important; padding: 0 22px !important; font-size: 13px !important; } } /* Tablet: keep the SAMS hero, but span only across the two tablet columns. */ @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; column-gap: 24px !important; row-gap: 24px !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child { grid-column: span 2 !important; grid-row: auto !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .almara-location-card img { height: 300px !important; } html body #almara-locations-v150-spots .elementor-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .e-loop-container:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-grid:has(> .e-loop-item:nth-child(4)) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title { font-size: clamp(34px, 5vw, 48px) !important; } } /* Mobile: no oversized hero card; show a clean one-column list. */ @media (max-width: 767px) { html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid { grid-template-columns: 1fr !important; row-gap: 18px !important; column-gap: 0 !important; } html body #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child { grid-column: auto !important; grid-row: auto !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-card { padding: 16px 16px 8px !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-card + .elementor-element, html body #almara-locations-v150-spots .e-loop-item > .elementor-element:not(.almara-location-card):last-child { padding: 0 16px 18px !important; } html body #almara-locations-v150-spots .e-loop-item .almara-location-card img, html body #almara-locations-v150-spots .e-loop-item .almara-location-card img.wp-post-image, html body #almara-locations-v150-spots .e-loop-item .almara-location-card img.almara-location-image { height: 190px !important; } html body #almara-locations-v150-spots .e-loop-item .elementor-widget-theme-post-title .elementor-heading-title { font-size: clamp(25px, 7.8vw, 31px) !important; } } /* ALMARA Locations v1.8.4 PHP visibility fallback pairing — CSS unchanged from v1.8.3. */ /* ========================================================= ALMARA Locations v1.8.7 — SAMS Featured Marker Layout Scope: B2C Locations result surface only Pairing: Core v1.3.67-sams-v185 or newer Reason: - Query rescue now returns max. 6 SAMS-ranked locations. - On the live Elementor Loop Grid, the first-item selectors from v1.8.x are not specific/broad enough for Elementor's generated wrapper shape. - This block forces the first returned Loop Item to become the editorial SAMS Hero on desktop and tablet, while mobile stays linear. Architecture: CSS-only. No JS layout hacks. No shortcode content. ========================================================= */ /* --- Result grid: robust direct-child grid surface --- */ html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-auto-flow: dense !important; gap: 34px !important; align-items: stretch !important; justify-items: stretch !important; } /* --- Every Loop item remains a stable card shell --- */ html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"], html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"], html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"], html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post { box-sizing: border-box !important; width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; } /* --- Desktop: first SAMS-ranked result becomes the editorial hero. --- */ @media (min-width: 1025px) { html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child { grid-column: 1 / span 2 !important; grid-row: 1 / span 2 !important; min-height: 650px !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child .almara-location-card, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child .almara-location-card { padding: 24px 24px 12px !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child .almara-location-card img { height: 360px !important; min-height: 360px !important; max-height: 360px !important; border-radius: 16px !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child .elementor-widget-theme-post-title .elementor-heading-title { margin-top: 22px !important; font-size: clamp(42px, 3.8vw, 58px) !important; line-height: 1.02 !important; letter-spacing: -0.018em !important; } } /* --- Tablet: first SAMS result spans the two-column surface. --- */ @media (min-width: 768px) and (max-width: 1024px) { html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child { grid-column: 1 / span 2 !important; grid-row: auto !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child .almara-location-card img, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child .almara-location-card img { height: 300px !important; min-height: 300px !important; max-height: 300px !important; } } /* --- Mobile: keep all cards equal and readable. --- */ @media (max-width: 767px) { html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body.elementor-page #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container, html body.elementor-page #almara-locations-v150-spots .e-loop-container, html body.elementor-page #almara-locations-v150-spots .elementor-grid { grid-template-columns: 1fr !important; gap: 18px !important; } html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .e-loop-item:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > [data-elementor-type="loop-item"]:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .post:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .e-loop-container > .elementor:first-child, html body.elementor-page #almara-locations-v150-spots .elementor-grid > .elementor:first-child { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } } /* ========================================================= ALMARA Locations v1.8.7 — SAMS Featured Marker Layout Pairing: Core v1.3.68-sams-v187 Reason: - v1.8.6 first-child selectors did not hit the live Elementor Loop shape. - Core now marks the SAMS-leading post with .almara-sams-featured. - CSS targets that explicit marker instead of relying on fragile first-child selectors. Architecture: CSS-only layout rules, no JS layout hacks. ========================================================= */ html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body #almara-locations-v150-spots .elementor-loop-container, html body #almara-locations-v150-spots .e-loop-container, html body #almara-locations-v150-spots .elementor-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 34px !important; grid-auto-flow: dense !important; align-items: stretch !important; } @media (min-width: 1025px) { html body #almara-locations-v150-spots .elementor-loop-container > .almara-sams-featured, html body #almara-locations-v150-spots .e-loop-container > .almara-sams-featured, html body #almara-locations-v150-spots .elementor-grid > .almara-sams-featured, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) { grid-column: 1 / span 2 !important; grid-row: 1 / span 2 !important; min-height: 650px !important; align-self: stretch !important; } html body #almara-locations-v150-spots .almara-sams-featured .almara-location-card, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured) .almara-location-card, html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured) .almara-location-card, html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) .almara-location-card { height: 100% !important; min-height: 650px !important; padding: 24px 24px 14px !important; display: flex !important; flex-direction: column !important; } html body #almara-locations-v150-spots .almara-sams-featured .almara-location-card img, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured) .almara-location-card img, html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured) .almara-location-card img, html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) .almara-location-card img { width: 100% !important; height: 360px !important; min-height: 360px !important; max-height: 360px !important; object-fit: cover !important; border-radius: 18px !important; } html body #almara-locations-v150-spots .almara-sams-featured .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured) .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured) .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) .elementor-widget-theme-post-title .elementor-heading-title { margin-top: 24px !important; font-size: clamp(42px, 3.8vw, 58px) !important; line-height: 1.02 !important; letter-spacing: -0.018em !important; } html body #almara-locations-v150-spots .almara-sams-featured .almara-location-smart-cta, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured) .almara-location-smart-cta, html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured) .almara-location-smart-cta, html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) .almara-location-smart-cta { margin-top: auto !important; } } @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body #almara-locations-v150-spots .elementor-loop-container, html body #almara-locations-v150-spots .e-loop-container, html body #almara-locations-v150-spots .elementor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; } html body #almara-locations-v150-spots .elementor-loop-container > .almara-sams-featured, html body #almara-locations-v150-spots .e-loop-container > .almara-sams-featured, html body #almara-locations-v150-spots .elementor-grid > .almara-sams-featured, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) { grid-column: 1 / span 2 !important; grid-row: auto !important; } html body #almara-locations-v150-spots .almara-sams-featured .almara-location-card img, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured) .almara-location-card img, html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured) .almara-location-card img, html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) .almara-location-card img { height: 300px !important; min-height: 300px !important; max-height: 300px !important; } } @media (max-width: 767px) { html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-grid, html body #almara-locations-v150-spots .almara-locations-grid .elementor-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .e-loop-container, html body #almara-locations-v150-spots .almara-locations-grid .elementor-grid, html body #almara-locations-v150-spots .elementor-loop-container, html body #almara-locations-v150-spots .e-loop-container, html body #almara-locations-v150-spots .elementor-grid { grid-template-columns: 1fr !important; gap: 18px !important; } html body #almara-locations-v150-spots .almara-sams-featured, html body #almara-locations-v150-spots .elementor-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .e-loop-container > *:has(.almara-sams-featured), html body #almara-locations-v150-spots .elementor-grid > *:has(.almara-sams-featured) { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } } /* ========================================================= ALMARA Locations v1.8.8 — SAMS Widget-Container Grid Fix Scope: B2C Locations result surface only Pairing: Core v1.3.68-sams-v187 or newer Reason: - Live Elementor Loop Grid renders loop items directly inside .elementor-widget-container, not only inside .elementor-loop-container. - Earlier SAMS hero selectors missed that live wrapper shape. - This block intentionally targets the actual live DOM shown in DevTools. Architecture: CSS-only, no JS layout hacks. ========================================================= */ /* Real live grid wrapper: Loop items are direct children of widget-container. */ html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 34px !important; grid-auto-flow: dense !important; align-items: stretch !important; justify-items: stretch !important; } html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item, html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"], html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"] { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; } @media (min-width: 1025px) { html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child { grid-column: 1 / span 2 !important; grid-row: 1 / span 2 !important; min-height: 650px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .almara-location-card, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .almara-location-card { height: 100% !important; min-height: 650px !important; display: flex !important; flex-direction: column !important; padding: 24px 24px 14px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .almara-location-card img, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .almara-location-card img { width: 100% !important; height: 360px !important; min-height: 360px !important; max-height: 360px !important; object-fit: cover !important; border-radius: 18px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child h1.elementor-heading-title, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child h1.elementor-heading-title { margin-top: 24px !important; font-size: clamp(42px, 3.8vw, 58px) !important; line-height: 1.02 !important; letter-spacing: -0.018em !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .almara-location-smart-cta, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .almara-location-smart-cta { margin-top: auto !important; } } @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child { grid-column: 1 / span 2 !important; grid-row: auto !important; min-height: 0 !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child .elementor-widget-image img { height: 300px !important; min-height: 300px !important; max-height: 300px !important; object-fit: cover !important; } } @media (max-width: 767px) { html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container { grid-template-columns: 1fr !important; gap: 18px !important; } html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > .e-loop-item:first-child, html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container > [data-elementor-type="loop-item"]:first-child { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } } /* ========================================================= ALMARA Locations v1.8.9 — SAMS Grid Direct-Parent Fix Scope: B2C Locations result surface only Pairing: Core v1.3.68-sams-v187 or newer Reason: - v1.8.8 targeted .elementor-widget-container too broadly. - On live Elementor builds, the real grid parent can be either .elementor-loop-container, .e-loop-container, .elementor-grid or, in some builds, the widget container itself. - This fix targets only the element that directly contains .e-loop-item. Architecture: CSS-only, no JS layout hacks. ========================================================= */ @supports selector(:has(*)) { /* Undo the too-broad v1.8.8 grid on widget-container when it is NOT the direct parent of the loop items. This prevents the squeezed/narrow result column seen on desktop. */ html body #almara-locations-v150-spots .almara-locations-grid.elementor-widget-loop-grid > .elementor-widget-container:not(:has(> .e-loop-item)), html body #almara-locations-v150-spots .elementor-widget-loop-grid > .elementor-widget-container:not(:has(> .e-loop-item)) { display: block !important; grid-template-columns: none !important; grid-template-rows: none !important; grid-auto-flow: initial !important; gap: 0 !important; align-items: initial !important; justify-items: initial !important; } /* The real loop grid parent: whichever wrapper directly owns the .e-loop-item nodes becomes the SAMS layout surface. */ html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) { display: grid !important; width: 100% !important; max-width: none !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 34px !important; grid-auto-flow: dense !important; align-items: stretch !important; justify-items: stretch !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item { width: 100% !important; max-width: none !important; min-width: 0 !important; margin: 0 !important; align-self: stretch !important; justify-self: stretch !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item .almara-location-card { width: 100% !important; max-width: none !important; height: 100% !important; min-width: 0 !important; } @media (min-width: 1025px) { html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child { grid-column: 1 / span 2 !important; grid-row: 1 / span 2 !important; min-height: 650px !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .almara-location-card { min-height: 650px !important; display: flex !important; flex-direction: column !important; padding: 24px 24px 14px !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .almara-location-card img { width: 100% !important; height: 360px !important; min-height: 360px !important; max-height: 360px !important; object-fit: cover !important; border-radius: 18px !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .elementor-widget-theme-post-title .elementor-heading-title, html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child h1.elementor-heading-title { margin-top: 24px !important; font-size: clamp(42px, 3.8vw, 58px) !important; line-height: 1.02 !important; letter-spacing: -0.018em !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .almara-location-smart-cta { margin-top: auto !important; } } @media (min-width: 768px) and (max-width: 1024px) { html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child { grid-column: 1 / span 2 !important; grid-row: auto !important; min-height: 0 !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .almara-location-card img { height: 300px !important; min-height: 300px !important; max-height: 300px !important; object-fit: cover !important; } } @media (max-width: 767px) { html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) { grid-template-columns: 1fr !important; gap: 18px !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .elementor-widget-image img, html body #almara-locations-v150-spots .almara-locations-grid :is(.elementor-loop-container, .e-loop-container, .elementor-grid, .elementor-widget-container):has(> .e-loop-item) > .e-loop-item:first-child .almara-location-card img { height: 190px !important; min-height: 190px !important; max-height: 190px !important; object-fit: cover !important; } } } /* ========================================================= ALMARA Locations v1.9.3 — Stable Shortcode Results Renderer Scope: #almara-locations-v150-spots only Purpose: replaces unstable Elementor Loop Grid query layer with a PHP-rendered SAMS + filter result surface. Elementor remains the editable shell. ========================================================= */ #almara-locations-v150-spots .almara-locations-renderer, #almara-locations-v150-spots .almara-locations-renderer * { box-sizing: border-box !important; } #almara-locations-v150-spots .almara-locations-renderer { width: 100% !important; max-width: 100% !important; margin-top: 42px !important; } #almara-locations-v150-spots .almara-locations-renderer-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 24px !important; align-items: stretch !important; width: 100% !important; max-width: 100% !important; } #almara-locations-v150-spots .almara-location-card { position: relative !important; display: flex !important; flex-direction: column !important; min-width: 0 !important; min-height: 360px !important; background: rgba(255,255,255,.82) !important; border: 1px solid rgba(31,60,76,.14) !important; border-radius: 0 !important; box-shadow: 0 20px 52px rgba(31,60,76,.10) !important; overflow: hidden !important; } #almara-locations-v150-spots .almara-location-card--featured { grid-column: span 2 !important; grid-row: span 2 !important; min-height: 620px !important; } #almara-locations-v150-spots .almara-location-card__media { padding: 16px 16px 0 !important; } #almara-locations-v150-spots .almara-location-card__media img, #almara-locations-v150-spots .almara-location-image { display: block !important; width: 100% !important; height: 190px !important; max-width: 100% !important; object-fit: cover !important; object-position: center center !important; border-radius: 12px !important; } #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__media img, #almara-locations-v150-spots .almara-location-card--featured .almara-location-image { height: 320px !important; } #almara-locations-v150-spots .almara-location-card__body { display: flex !important; flex-direction: column !important; flex: 1 1 auto !important; padding: 22px 18px 18px !important; } #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__body { padding: 30px 28px 22px !important; } #almara-locations-v150-spots .almara-location-card__title { margin: 0 0 12px !important; font-family: var(--almara-font-display, "Cormorant Garamond", Georgia, serif) !important; font-size: clamp(24px, 1.8vw, 32px) !important; line-height: 1.08 !important; font-weight: 600 !important; letter-spacing: -.012em !important; color: var(--almara-blue, #1F3C4C) !important; } #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__title { font-size: clamp(34px, 3vw, 50px) !important; max-width: 92% !important; } #almara-locations-v150-spots .almara-location-card__area { margin: 0 0 24px !important; font-family: var(--almara-font-ui, "Inter", Arial, sans-serif) !important; font-size: 13px !important; line-height: 1.45 !important; color: rgba(31,60,76,.62) !important; } #almara-locations-v150-spots .almara-location-card__badges { margin-top: auto !important; } #almara-locations-v150-spots .almara-location-badges { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin: 0 !important; } #almara-locations-v150-spots .almara-location-badge { display: inline-flex !important; align-items: center !important; min-height: 20px !important; padding: 4px 9px !important; border-radius: 999px !important; background: rgba(110,193,194,.18) !important; color: rgba(31,60,76,.74) !important; font-family: var(--almara-font-ui, "Inter", Arial, sans-serif) !important; font-size: 10px !important; line-height: 1.1 !important; font-weight: 850 !important; letter-spacing: .07em !important; text-transform: uppercase !important; white-space: nowrap !important; } #almara-locations-v150-spots .almara-location-card__cta { padding: 18px 18px 22px !important; border-top: 1px solid rgba(31,60,76,.10) !important; background: linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.82)) !important; } #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__cta { padding: 22px 28px 28px !important; } #almara-locations-v150-spots .almara-location-smart-cta { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 38px !important; padding: 0 16px !important; border-radius: 999px !important; background: var(--almara-blue, #1F3C4C) !important; color: #fff !important; font-family: var(--almara-font-ui, "Inter", Arial, sans-serif) !important; font-size: 12px !important; font-weight: 850 !important; line-height: 1 !important; text-decoration: none !important; box-shadow: 0 12px 28px rgba(31,60,76,.18) !important; } #almara-locations-v150-spots .almara-location-smart-cta:hover { transform: translateY(-1px) !important; background: #24576A !important; } #almara-locations-v150-spots .almara-cta-arrow { margin-left: .45em !important; } #almara-locations-v150-spots .almara-location-no-results { max-width: 780px !important; margin: 34px auto 0 !important; padding: 22px 26px !important; border: 1px solid rgba(110,193,194,.42) !important; border-radius: 22px !important; background: rgba(255,255,255,.78) !important; box-shadow: 0 18px 50px rgba(31,60,76,.08) !important; font-family: var(--almara-font-ui, "Inter", Arial, sans-serif) !important; font-size: 15px !important; line-height: 1.6 !important; font-weight: 650 !important; color: var(--almara-blue, #1F3C4C) !important; text-align: center !important; } @media (max-width: 1180px) { #almara-locations-v150-spots .almara-locations-renderer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px !important; } #almara-locations-v150-spots .almara-location-card--featured { grid-column: span 2 !important; grid-row: span 1 !important; min-height: 0 !important; } } @media (max-width: 767px) { #almara-locations-v150-spots .almara-locations-renderer { margin-top: 28px !important; } #almara-locations-v150-spots .almara-locations-renderer-grid { grid-template-columns: 1fr !important; gap: 16px !important; } #almara-locations-v150-spots .almara-location-card, #almara-locations-v150-spots .almara-location-card--featured { grid-column: auto !important; grid-row: auto !important; min-height: 0 !important; } #almara-locations-v150-spots .almara-location-card__media img, #almara-locations-v150-spots .almara-location-image, #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__media img, #almara-locations-v150-spots .almara-location-card--featured .almara-location-image { height: 190px !important; } #almara-locations-v150-spots .almara-location-card__body, #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__body { padding: 20px 18px 18px !important; } #almara-locations-v150-spots .almara-location-card__title, #almara-locations-v150-spots .almara-location-card--featured .almara-location-card__title { font-size: 28px !important; max-width: 100% !important; } } /* ========================================================= ALMARA Locations v1.9.4 — Shortcode Renderer CSS Polish Scope: #almara-locations-v150-spots only Pairing: Core v1.9.3 shortcode renderer Purpose: - hide duplicate no-result messages when an old no-result layer/widget is still present - make location card imagery a touch more generous/premium - keep badge wrappers invisible and actual badge pills compact - preserve SAMS hero layout and mobile one-column behavior Architecture: CSS-only. ========================================================= */ /* If an old Elementor no-results layer is still present in the results section, the shortcode renderer owns the message now. */ #almara-locations-v150-spots .elementor-widget-loop-grid .e-loop-nothing-found-message, #almara-locations-v150-spots .elementor-widget-loop-grid .elementor-posts-nothing-found, #almara-locations-v150-spots .e-loop-nothing-found-message { display: none !important; } /* Hide accidental duplicate shortcode no-result boxes, but keep the first one. */ #almara-locations-v150-spots .almara-location-no-results + .almara-location-no-results { display: none !important; } @supports selector(:has(*)) { #almara-locations-v150-spots .almara-locations-renderer:has(.almara-location-no-results) ~ .almara-locations-renderer:has(.almara-location-no-results) { display: none !important; } } /* Shortcode renderer: premium image proportions. */ @media (min-width: 1025px) { #almara-locations-v150-spots .almara-locations-renderer .almara-location-card:not(.almara-location-card--featured) { min-height: 390px !important; } #almara-locations-v150-spots .almara-locations-renderer .almara-location-card:not(.almara-location-card--featured) .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card:not(.almara-location-card--featured) .almara-location-image { height: 215px !important; min-height: 215px !important; max-height: 215px !important; object-fit: cover !important; } #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured { min-height: 640px !important; } #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-image { height: 340px !important; min-height: 340px !important; max-height: 340px !important; object-fit: cover !important; } } /* Tablet: slightly larger images, but no oversized hero card. */ @media (min-width: 768px) and (max-width: 1024px) { #almara-locations-v150-spots .almara-locations-renderer .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-image, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-image { height: 225px !important; min-height: 225px !important; max-height: 225px !important; object-fit: cover !important; } } /* Mobile: preserve compact cards; image remains generous but not dominant. */ @media (max-width: 767px) { #almara-locations-v150-spots .almara-locations-renderer .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-image, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-card__media img, #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-image { height: 200px !important; min-height: 200px !important; max-height: 200px !important; object-fit: cover !important; } } /* Badge wrapper is layout-only. This prevents the long grey bar effect while keeping each badge as its own compact pill. */ #almara-locations-v150-spots .almara-locations-renderer .almara-location-card__badges, #almara-locations-v150-spots .almara-locations-renderer .almara-location-badges { width: auto !important; max-width: 100% !important; min-height: 0 !important; height: auto !important; margin-top: auto !important; margin-bottom: 0 !important; padding: 0 !important; display: flex !important; flex-wrap: wrap !important; align-items: center !important; align-content: flex-start !important; justify-content: flex-start !important; gap: 6px !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } #almara-locations-v150-spots .almara-locations-renderer .almara-location-card__badges .almara-location-badge, #almara-locations-v150-spots .almara-locations-renderer .almara-location-badge { width: auto !important; flex: 0 0 auto !important; min-width: 0 !important; max-width: 100% !important; height: 20px !important; min-height: 20px !important; max-height: 20px !important; padding: 0 8px !important; border-radius: 999px !important; background: rgba(110,193,194,.18) !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; line-height: 20px !important; } /* Slightly tighten card body so larger images do not make cards feel heavy. */ #almara-locations-v150-spots .almara-locations-renderer .almara-location-card__body { padding-top: 20px !important; } #almara-locations-v150-spots .almara-locations-renderer .almara-location-card--featured .almara-location-card__body { padding-top: 28px !important; } /* ========================================================= ALMARA Locations v1.9.5 — No-Results De-Dupe Guard Pairing: Core v1.9.5 shortcode renderer Purpose: hard-hide legacy JS/Loop fallback no-results boxes when the shortcode renderer already owns the result surface. ========================================================= */ #almara-locations-v150-spots .almara-locations-renderer ~ #almara-location-no-results, #almara-locations-v150-spots .almara-locations-renderer ~ .almara-location-no-results, #almara-locations-v150-spots #almara-location-no-results + .almara-location-no-results, #almara-locations-v150-spots .almara-location-no-results + #almara-location-no-results { display: none !important; } @supports selector(:has(*)) { #almara-locations-v150-spots:has(.almara-locations-renderer .almara-location-no-results) > #almara-location-no-results, #almara-locations-v150-spots:has(.almara-locations-renderer .almara-location-no-results) .elementor-widget-loop-grid .e-loop-nothing-found-message { display: none !important; } } /* ========================================================= ALMARA Mobile Late Lock v3.0 — HOME / B2C Startseite Scope: phone only. Purpose: kill remaining Elementor desktop grid constraints printed after normal page CSS. No header/footer selectors. ========================================================= */ @media screen and (max-width: 767px) { html body:has(#alm-home-hero) { overflow-x: hidden !important; } html body:has(#alm-home-hero) :is(.site-main, main, article, .page-content, .entry-content) { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; overflow-x: hidden !important; } html body #alm-home-page, html body .almara-page-home, html body:has(#alm-home-hero) .elementor-location-single, html body:has(#alm-home-hero) .entry-content > .elementor, html body:has(#alm-home-hero) .page-content > .elementor, html body:has(#alm-home-hero) .elementor-shortcode > .elementor { display: block !important; width: 100vw !important; max-width: 100vw !important; min-width: 0 !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding-left: 0 !important; padding-right: 0 !important; overflow-x: hidden !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body #alm-home-page > .e-con-inner, html body .almara-page-home > .e-con-inner, html body:has(#alm-home-hero) .entry-content > .elementor > .e-con-inner, html body:has(#alm-home-hero) .page-content > .elementor > .e-con-inner { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) { display: block !important; width: 100vw !important; max-width: 100vw !important; min-width: 0 !important; margin-left: calc(50% - 50vw) !important; margin-right: calc(50% - 50vw) !important; padding-left: 18px !important; padding-right: 18px !important; overflow: hidden !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; --flex-basis: auto !important; --flex-grow: 0 !important; --flex-shrink: 1 !important; } html body :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) > .e-con-inner { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; gap: 24px !important; width: 100% !important; max-width: 430px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; grid-template-columns: none !important; grid-auto-flow: row !important; --width: 100% !important; --content-width: 100% !important; } html body :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) > .e-con-inner > :is(.elementor-element,.e-con,.e-con-full,.e-con-boxed,.e-grid,.e-flex), html body :is(#alm-home-hero-copy,#alm-home-shift-copy,#alm-home-experience-copy,#alm-home-partners-copy,#alm-home-destinations-copy,#alm-home-how-copy,#alm-home-platform-copy,#alm-home-hero-media,#alm-home-experience-media) { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; align-self: stretch !important; justify-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; grid-column: auto !important; grid-row: auto !important; transform: none !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; } /* Home grids must not keep Elementor's phone grid. */ html body :is(#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid), html body :is(#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; gap: 16px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; grid-template-columns: none !important; grid-auto-flow: row !important; --width: 100% !important; --content-width: 100% !important; } html body :is(#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner > :is(.elementor-element,.e-con,.e-con-full,.e-con-boxed), html body :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive), html body :is(#alm-home-page,.almara-page-home) :is(.alm-card,.alm-cta-card), html body:has(#alm-home-hero) :is(.alm-card,.alm-cta-card) { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; align-self: stretch !important; justify-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; grid-column: auto !important; grid-row: auto !important; transform: none !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; } html body :is(#alm-home-page,.almara-page-home) :is(.alm-card,.alm-cta-card).e-con-boxed > .e-con-inner, html body:has(#alm-home-hero) :is(.alm-card,.alm-cta-card).e-con-boxed > .e-con-inner, html body :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive) > .e-con-inner { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 10px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; grid-template-columns: none !important; } html body:has(#alm-home-hero) :is(.alm-card,.alm-cta-card) :is(.elementor-widget,.elementor-widget-container,.elementor-heading-title,p,.alm-card__title,.alm-card__title h3,.alm-card__title h4,.alm-card__text,.alm-card__text p,.alm-card__eyebrow,.alm-card__eyebrow p) { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } html body:has(#alm-home-hero) :is(#alm-home-hero h1,#alm-home-shift h2,#alm-home-partners h2,#alm-home-destinations h2,#alm-home-how h2,#alm-home-experience h2,#alm-home-platform h2,#alm-home-final-cta h2,.elementor-heading-title) { max-width: 100% !important; overflow-wrap: normal !important; word-break: normal !important; } html body:has(#alm-home-hero) :is(img,video) { max-width: 100% !important; height: auto !important; } html body:has(#alm-home-hero) :is(.alm-button,.alm-button .elementor-widget-container,.alm-button .elementor-button-wrapper,.alm-button .elementor-button,.elementor-widget-button,.elementor-widget-button .elementor-button-wrapper) { max-width: 100% !important; min-width: 0 !important; } } @media screen and (max-width: 374px) { html body :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) { padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================= ALMARA Mobile Late Lock v3.0 — Visual/Image Card Polish Scope: phone only. Restores visible rounded image-card frames. ========================================================= */ @media screen and (max-width: 767px) { html body :is( #alm-destinations-hero-media, #alm-destinations-location-visual, #alm-experience-hero-media, #alm-experience-visual-media, #alm-home-hero-media, #alm-home-experience-media, .almara-coastline-visual, .alm-photo-slot, .alm-image-widget-slot, .alm-partner-image-card, .alm-equipment-card .alm-photo-mosaic, .almara-location-card .elementor-widget-image ) { border: 1px solid rgba(9, 43, 61, 0.12) !important; border-radius: 20px !important; box-shadow: 0 14px 34px rgba(9, 43, 61, 0.10) !important; overflow: hidden !important; background: rgba(255, 255, 255, 0.82) !important; } html body :is( #alm-destinations-hero-media .alm-destinations-hero-image, #alm-destinations-location-visual .alm-destinations-image, #alm-experience-hero-media .elementor-widget-container, #alm-experience-visual-media .elementor-widget-container, #alm-home-hero-media .elementor-widget-container, #alm-home-experience-media .elementor-widget-container, .alm-photo-slot .elementor-widget-container, .alm-image-widget-slot .elementor-widget-container, .alm-partner-image-card .elementor-widget-container, .almara-location-card .elementor-widget-image .elementor-widget-container ) { width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; border-radius: 16px !important; } html body :is( #alm-destinations-hero-media img, #alm-destinations-location-visual img, #alm-experience-hero-media img, #alm-experience-visual-media img, #alm-home-hero-media img, #alm-home-experience-media img, .alm-photo-slot img, .alm-image-widget-slot img, .alm-partner-image-card img, .almara-location-card .elementor-widget-image img ) { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; object-fit: cover !important; border-radius: 16px !important; } } /* ========================================================= ALMARA Mobile Recovery Lock v4.0 Purpose: - HOME: neutralize remaining Elementor/Container mobile compression inside the embedded template .elementor-2994 / page 2004. - LOCATIONS/STANDORTE: align hero CTA pills consistently on mobile. Notes: - Appended after v3 rules by design. - No header, burger, language menu or footer selectors. ========================================================= */ @media screen and (max-width: 767px) { /* ---------- HOME: embedded Elementor template containment ---------- */ html body:has(#alm-home-hero) :is(.elementor-2004, .elementor-2994), html body.elementor-page-2004 :is(.elementor-2004, .elementor-2994) { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; overflow-x: hidden !important; transform: none !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body:has(#alm-home-hero) .elementor-widget-template, html body:has(#alm-home-hero) .elementor-widget-template > .elementor-widget-container, html body:has(#alm-home-hero) .elementor-template, html body.elementor-page-2004 .elementor-widget-template, html body.elementor-page-2004 .elementor-widget-template > .elementor-widget-container, html body.elementor-page-2004 .elementor-template { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; overflow-x: hidden !important; } /* HOME: do NOT let section viewport-escape rules keep compressing nested templates. */ html body:has(#alm-home-hero) :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta), html body.elementor-page-2004 :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 18px !important; padding-right: 18px !important; overflow-x: visible !important; transform: none !important; grid-template-columns: 1fr !important; grid-auto-flow: row !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: stretch !important; --justify-content: flex-start !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body:has(#alm-home-hero) :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) > .e-con-inner, html body.elementor-page-2004 :is(#alm-home-hero,#alm-home-trust,#alm-home-shift,#alm-home-partners,#alm-home-destinations,#alm-home-how,#alm-home-experience,#alm-home-platform,#alm-home-final-cta) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 430px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; gap: 24px !important; transform: none !important; grid-template-columns: 1fr !important; grid-auto-flow: row !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: stretch !important; --justify-content: flex-start !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: 100% !important; } /* HOME: split columns and card grids must become one local mobile column. */ html body:has(#alm-home-hero) :is(#alm-home-shift,#alm-home-experience-split,#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid), html body:has(#alm-home-hero) :is(#alm-home-shift,#alm-home-experience-split,#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner, html body.elementor-page-2004 :is(#alm-home-shift,#alm-home-experience-split,#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid), html body.elementor-page-2004 :is(#alm-home-shift,#alm-home-experience-split,#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; gap: 16px !important; transform: none !important; grid-template-columns: 1fr !important; grid-template-rows: auto !important; grid-auto-flow: row !important; grid-auto-columns: auto !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: stretch !important; --justify-content: flex-start !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body:has(#alm-home-hero) :is(#alm-home-hero-copy,#alm-home-shift-copy,#alm-home-experience-copy,#alm-home-partners-copy,#alm-home-destinations-copy,#alm-home-how-copy,#alm-home-platform-copy,#alm-home-hero-media,#alm-home-experience-media,#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive), html body:has(#alm-home-hero) :is(#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner > .elementor-element, html body.elementor-page-2004 :is(#alm-home-hero-copy,#alm-home-shift-copy,#alm-home-experience-copy,#alm-home-partners-copy,#alm-home-destinations-copy,#alm-home-how-copy,#alm-home-platform-copy,#alm-home-hero-media,#alm-home-experience-media,#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive), html body.elementor-page-2004 :is(#alm-home-glide-explore-dive-grid,#alm-home-partner-card-grid,#alm-home-destination-card-grid,#alm-home-step-card-grid,#alm-home-how-card-grid,#alm-home-platform-card-grid) > .e-con-inner > .elementor-element { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; flex-grow: 0 !important; flex-shrink: 1 !important; align-self: stretch !important; justify-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; transform: none !important; grid-column: 1 / -1 !important; grid-row: auto !important; --display: flex !important; --flex-direction: column !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: 100% !important; } html body:has(#alm-home-hero) :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive) > .e-con-inner, html body.elementor-page-2004 :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; gap: 10px !important; --display: flex !important; --flex-direction: column !important; --width: 100% !important; --content-width: 100% !important; } html body:has(#alm-home-hero) :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive,.alm-card,.alm-cta-card) :is(.elementor-widget,.elementor-widget-container,.elementor-heading-title,p,.alm-card__title,.alm-card__text,.alm-card__eyebrow), html body.elementor-page-2004 :is(#alm-home-card-glide,#alm-home-card-explore,#alm-home-card-dive,.alm-card,.alm-cta-card) :is(.elementor-widget,.elementor-widget-container,.elementor-heading-title,p,.alm-card__title,.alm-card__text,.alm-card__eyebrow) { box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } /* Mobile image cards: keep premium radii after Elementor image widgets. */ html body :is(.alm-card,.alm-cta-card,.almara-v150-card,.almara-v150-type-card,.almara-v150-final-card) { border-radius: 22px !important; overflow: hidden !important; } html body :is(.alm-card,.alm-cta-card,.almara-v150-card,.almara-v150-type-card,.almara-v150-final-card) :is(.elementor-widget-image,.elementor-widget-image > .elementor-widget-container) { border-radius: 18px !important; overflow: hidden !important; } html body :is(.alm-card,.alm-cta-card,.almara-v150-card,.almara-v150-type-card,.almara-v150-final-card) :is(.elementor-widget-image img,img.wp-post-image) { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; border-radius: 18px !important; overflow: hidden !important; } /* ---------- STANDORTE / LOCATIONS: align hero pills ---------- */ html body:has(#almara-locations-v150-hero) :is(#almara-locations-v150-hero,#almara-locations-v150-mobile-hero) .almara-v150-actions, html body:has(#almara-locations-v150-hero) :is(#almara-locations-v150-hero,#almara-locations-v150-mobile-hero) .almara-v150-actions > .e-con-inner { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; margin-top: 28px !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; text-align: left !important; --display: flex !important; --flex-direction: column !important; --align-items: flex-start !important; --justify-content: flex-start !important; --width: 100% !important; --content-width: 100% !important; } html body:has(#almara-locations-v150-hero) :is(#almara-locations-v150-hero,#almara-locations-v150-mobile-hero) .almara-v150-actions :is(.elementor-widget-button,.elementor-button-wrapper,a.elementor-button) { width: auto !important; max-width: 100% !important; min-width: 0 !important; margin-left: 0 !important; margin-right: auto !important; align-self: flex-start !important; justify-self: flex-start !important; text-align: left !important; } html body:has(#almara-locations-v150-hero) :is(#almara-locations-v150-hero,#almara-locations-v150-mobile-hero) .almara-v150-actions a.elementor-button { justify-content: center !important; white-space: nowrap !important; } } /* ========================================================= ALMARA Mobile Surgical Lock v5.0 Scope: phone only Purpose: 1) STANDORTE: align the actual hero CTA row (.almara-actions), not the previously assumed .almara-v150-actions wrapper. 2) HOME: force the hero media/image card to stretch to the local mobile content width; Elementor sometimes leaves the image widget at its imported desktop/widget width. 3) HOME: stabilize the final CTA cards/buttons after the embedded-template mobile recovery rules. Notes: - CSS-only. - No header, burger, language menu or footer selectors. ========================================================= */ @media screen and (max-width: 767px) { /* ---------- STANDORTE / LOCATIONS: actual hero CTA pill row ---------- */ html body #almara-locations-v150-hero .almara-actions, html body #almara-locations-v150-hero .almara-actions > .e-con-inner, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .almara-actions, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .almara-actions > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin-top: 28px !important; margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 0 !important; padding: 0 !important; text-align: left !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: flex-start !important; --justify-content: flex-start !important; --gap: 12px !important; --row-gap: 12px !important; --column-gap: 0px !important; --width: 100% !important; --min-width: 0 !important; --content-width: 100% !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body #almara-locations-v150-hero .almara-actions > :is(.elementor-element,.elementor-widget-button,.almara-el-btn), html body #almara-locations-v150-hero .almara-actions > .e-con-inner > :is(.elementor-element,.elementor-widget-button,.almara-el-btn), html body #almara-locations-v150-hero .almara-actions :is(.elementor-widget-button,.almara-el-btn) { box-sizing: border-box !important; display: block !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; flex-grow: 0 !important; flex-shrink: 1 !important; align-self: flex-start !important; justify-self: flex-start !important; margin: 0 !important; padding: 0 !important; text-align: left !important; --width: auto !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body #almara-locations-v150-hero .almara-actions :is(.elementor-widget-container,.elementor-button-wrapper) { width: auto !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; text-align: left !important; } html body #almara-locations-v150-hero .almara-actions a.elementor-button, html body #almara-locations-v150-hero .almara-actions .elementor-button { display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 190px !important; min-height: 46px !important; margin: 0 !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; text-align: center !important; } /* ---------- HOME: hero media/image card full local width ---------- */ html body:has(#alm-home-hero) #alm-home-hero-media, html body.elementor-page-2004 #alm-home-hero-media { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; align-self: stretch !important; justify-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; padding: 14px !important; border-radius: 22px !important; overflow: hidden !important; --display: flex !important; --flex-direction: column !important; --align-items: stretch !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body:has(#alm-home-hero) #alm-home-hero-media > .e-con-inner, html body.elementor-page-2004 #alm-home-hero-media > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body:has(#alm-home-hero) #alm-home-hero-media :is(#alm-home-hero-image,.alm-home-hero-image,.alm-home-media-image,.elementor-widget-image), html body.elementor-page-2004 #alm-home-hero-media :is(#alm-home-hero-image,.alm-home-hero-image,.alm-home-media-image,.elementor-widget-image) { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; align-self: stretch !important; justify-self: stretch !important; margin: 0 !important; padding: 0 !important; --width: 100% !important; --content-width: 100% !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; } html body:has(#alm-home-hero) #alm-home-hero-media :is(#alm-home-hero-image,.alm-home-hero-image,.alm-home-media-image,.elementor-widget-image) > .elementor-widget-container, html body.elementor-page-2004 #alm-home-hero-media :is(#alm-home-hero-image,.alm-home-hero-image,.alm-home-media-image,.elementor-widget-image) > .elementor-widget-container { box-sizing: border-box !important; display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border-radius: 17px !important; overflow: hidden !important; } html body:has(#alm-home-hero) #alm-home-hero-media img, html body.elementor-page-2004 #alm-home-hero-media img { display: block !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; aspect-ratio: 4 / 3 !important; object-fit: cover !important; object-position: 56% 45% !important; border-radius: 17px !important; } /* ---------- HOME: final CTA mobile card/button stabilization ---------- */ html body:has(#alm-home-hero) #alm-home-final-cta > .e-con-inner, html body.elementor-page-2004 #alm-home-final-cta > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; justify-content: flex-start !important; gap: 18px !important; width: 100% !important; max-width: 430px !important; min-width: 0 !important; margin-left: auto !important; margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; grid-template-columns: 1fr !important; --display: flex !important; --flex-direction: column !important; --align-items: stretch !important; --width: 100% !important; --content-width: 100% !important; } html body:has(#alm-home-hero) #alm-home-final-cta :is(#alm-home-final-partner-cta,#alm-home-final-guest-cta,.alm-cta-card), html body.elementor-page-2004 #alm-home-final-cta :is(#alm-home-final-partner-cta,#alm-home-final-guest-cta,.alm-cta-card) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 16px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: auto !important; margin: 0 !important; padding: 26px 22px !important; align-self: stretch !important; justify-self: stretch !important; } html body:has(#alm-home-hero) #alm-home-final-cta :is(#alm-home-final-partner-cta,#alm-home-final-guest-cta,.alm-cta-card) > .e-con-inner, html body.elementor-page-2004 #alm-home-final-cta :is(#alm-home-final-partner-cta,#alm-home-final-guest-cta,.alm-cta-card) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 14px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; } html body:has(#alm-home-hero) #alm-home-final-cta :is(.elementor-widget-button,.alm-button), html body.elementor-page-2004 #alm-home-final-cta :is(.elementor-widget-button,.alm-button) { width: auto !important; max-width: 100% !important; min-width: 0 !important; align-self: flex-start !important; margin: 0 !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body:has(#alm-home-hero) #alm-home-final-cta :is(.elementor-button-wrapper,.elementor-widget-container), html body.elementor-page-2004 #alm-home-final-cta :is(.elementor-button-wrapper,.elementor-widget-container) { max-width: 100% !important; min-width: 0 !important; } html body:has(#alm-home-hero) #alm-home-final-cta a.elementor-button, html body.elementor-page-2004 #alm-home-final-cta a.elementor-button { display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; align-items: center !important; justify-content: center !important; white-space: normal !important; text-align: center !important; } } /* ========================================================= ALMARA Mobile Surgical Lock v6.0 Scope: phone only Purpose: 1) STANDORTE: fix the real Elementor hero CTA container. The live markup does not expose .almara-actions here; the actual button widgets are .almara-e1-btn inside an anonymous Elementor e-con. 2) HOME: make final CTA button text wrap into two lines instead of overflowing the dark CTA card. Notes: - CSS-only. - No header, burger, language menu or footer selectors. ========================================================= */ @media screen and (max-width: 767px) { /* ---------- STANDORTE / LOCATIONS: real hero CTA button container ---------- */ html body #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn), html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; margin: 28px 0 0 0 !important; padding: 0 !important; text-align: left !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: flex-start !important; --justify-content: flex-start !important; --width: 100% !important; --content-width: 100% !important; --min-height: 0px !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn) > .e-con-inner, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn) > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; text-align: left !important; grid-template-columns: none !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: flex-start !important; --justify-content: flex-start !important; --gap: 12px !important; --row-gap: 12px !important; --column-gap: 0px !important; --width: 100% !important; --content-width: 100% !important; --min-height: 0px !important; } html body #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn) > .e-con-inner > .almara-e1-btn, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .e-con:has(> .e-con-inner > .almara-e1-btn) > .e-con-inner > .almara-e1-btn { box-sizing: border-box !important; display: block !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; flex-grow: 0 !important; flex-shrink: 1 !important; align-self: flex-start !important; justify-self: flex-start !important; margin: 0 !important; padding: 0 !important; text-align: left !important; --width: auto !important; --align-self: flex-start !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body #almara-locations-v150-hero .almara-e1-btn :is(.elementor-widget-container,.elementor-button-wrapper), html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .almara-e1-btn :is(.elementor-widget-container,.elementor-button-wrapper) { box-sizing: border-box !important; display: block !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; text-align: left !important; } html body #almara-locations-v150-hero .almara-e1-btn a.elementor-button, html body #almara-locations-v150-hero .almara-e1-btn .elementor-button, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .almara-e1-btn a.elementor-button, html body:has(#almara-locations-v150-hero) #almara-locations-v150-hero .almara-e1-btn .elementor-button { box-sizing: border-box !important; display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 190px !important; min-height: 46px !important; margin: 0 !important; padding-left: 22px !important; padding-right: 22px !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; text-align: center !important; } /* ---------- HOME: final CTA button label wraps cleanly into two lines ---------- */ html body:has(#alm-home-hero) #alm-home-final-cta a.elementor-button, html body.elementor-page-2004 #alm-home-final-cta a.elementor-button { box-sizing: border-box !important; display: inline-flex !important; width: 178px !important; max-width: 100% !important; min-width: 0 !important; min-height: 50px !important; margin: 0 !important; padding: 10px 16px !important; align-items: center !important; justify-content: center !important; white-space: normal !important; text-align: center !important; line-height: 1.15 !important; } html body:has(#alm-home-hero) #alm-home-final-cta a.elementor-button .elementor-button-content-wrapper, html body.elementor-page-2004 #alm-home-final-cta a.elementor-button .elementor-button-content-wrapper, html body:has(#alm-home-hero) #alm-home-final-cta a.elementor-button .elementor-button-text, html body.elementor-page-2004 #alm-home-final-cta a.elementor-button .elementor-button-text { display: block !important; width: 100% !important; max-width: 100% !important; white-space: normal !important; text-align: center !important; line-height: 1.15 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: none !important; } } /* ========================================================= ALMARA Mobile Surgical Lock v7.0 Scope: phone only Purpose: - STANDORTE / LOCATIONS hero pills: exact Elementor-ID lock. - This intentionally avoids :has() and inferred wrapper classes. - Based on live DevTools markup: #almara-locations-v150-hero .elementor-element-640fc494 = CTA container .elementor-element-168a4b3d = primary pill .elementor-element-5fa195d3 = secondary pill - No header, burger, language menu or footer selectors. ========================================================= */ @media screen and (max-width: 767px) { /* Exact live CTA container: force simple vertical mobile stack */ html body #almara-locations-v150-hero .elementor-element-640fc494, html body #almara-locations-v150-hero .elementor-element-640fc494.e-con, html body #almara-locations-v150-hero .elementor-element-640fc494 > .e-con-inner { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start !important; justify-content: flex-start !important; align-content: flex-start !important; gap: 12px !important; row-gap: 12px !important; column-gap: 0 !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; height: auto !important; min-height: 0 !important; max-height: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; text-align: left !important; place-items: start !important; grid-template-columns: none !important; transform: none !important; left: auto !important; right: auto !important; --display: flex !important; --flex-direction: column !important; --flex-wrap: nowrap !important; --align-items: flex-start !important; --justify-content: flex-start !important; --align-content: flex-start !important; --gap: 12px !important; --row-gap: 12px !important; --column-gap: 0px !important; --width: 100% !important; --content-width: 100% !important; --min-height: 0px !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; } html body #almara-locations-v150-hero .elementor-element-640fc494 { margin-top: 28px !important; padding-top: 0 !important; padding-bottom: 0 !important; } html body #almara-locations-v150-hero .elementor-element-640fc494 > .e-con-inner { margin: 0 !important; padding: 0 !important; } /* Exact live widgets: remove Elementor self-alignment/centering on secondary pill */ html body #almara-locations-v150-hero .elementor-element-168a4b3d, html body #almara-locations-v150-hero .elementor-element-5fa195d3, html body #almara-locations-v150-hero .almara-e1-btn, html body #almara-locations-v150-hero .almara-e1-btn--primary, html body #almara-locations-v150-hero .almara-e1-btn--secondary { box-sizing: border-box !important; display: block !important; width: max-content !important; max-width: 100% !important; min-width: 0 !important; flex: 0 0 auto !important; flex-basis: auto !important; flex-grow: 0 !important; flex-shrink: 1 !important; align-self: flex-start !important; justify-self: flex-start !important; place-self: start !important; margin: 0 !important; margin-left: 0 !important; margin-right: 0 !important; margin-inline-start: 0 !important; margin-inline-end: 0 !important; padding: 0 !important; text-align: left !important; transform: none !important; translate: none !important; left: auto !important; right: auto !important; inset-inline-start: auto !important; inset-inline-end: auto !important; --width: auto !important; --align-self: flex-start !important; --container-widget-width: auto !important; --container-widget-flex-grow: 0 !important; --e-transform-translateX: 0px !important; --e-transform-translateY: 0px !important; } html body #almara-locations-v150-hero .elementor-element-168a4b3d a.elementor-button, html body #almara-locations-v150-hero .elementor-element-5fa195d3 a.elementor-button, html body #almara-locations-v150-hero .almara-e1-btn a.elementor-button, html body #almara-locations-v150-hero .almara-e1-btn .elementor-button { box-sizing: border-box !important; display: inline-flex !important; width: auto !important; max-width: 100% !important; min-width: 190px !important; min-height: 46px !important; height: auto !important; margin: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding: 13px 22px !important; align-items: center !important; justify-content: center !important; align-self: flex-start !important; text-align: center !important; line-height: 1.12 !important; border-radius: 999px !important; white-space: nowrap !important; transform: none !important; translate: none !important; left: auto !important; right: auto !important; } html body #almara-locations-v150-hero .elementor-element-168a4b3d .elementor-button-content-wrapper, html body #almara-locations-v150-hero .elementor-element-5fa195d3 .elementor-button-content-wrapper, html body #almara-locations-v150-hero .almara-e1-btn .elementor-button-content-wrapper { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; text-align: center !important; } }