[id="J0295083746"] .page-content {
padding: 0.1rem;
}
[id="J0295083746"] .page-content {
padding: 1.3rem;
align-items: center;
width: 100%;
}
[id="J0295083746"].page {
}
[id="J0295083746"] .backdrop {
}
.mobile [id="J0295083746"] .backdrop {
}
[id="J0295083746"] .page-layout {
align-items: center;
}
.mobile [id="J0295083746"] .page-layout {
}
@media (max-width: 768px){
/* Try all common header hooks; Cargo themes vary */
.site-header,
header.site,
.header,
[data-role="header"]{
position: static !important; /* removes overlay behavior */
height: auto !important;
min-height: 48px !important; /* keep it modest */
margin: 0 !important;
padding: 8px 12px !important;
z-index: 1 !important; /* below content */
overflow: visible !important;
}
/* If there’s a spacer directly under the header, collapse it on mobile */
.spacer, .spacer-block, .empty-block {
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
}
/* === Sizes of your fixed overlays (tune these to what you actually see) === */
:root{
--desktop-top: 56px;
--desktop-bottom:56px;
--mobile-top: 44px;
--mobile-bottom: 44px;
}
/* Reserve space so content isn't hidden by the overlays */
.page-content{
padding-top: var(--desktop-top) !important;
padding-bottom: var(--desktop-bottom) !important;
min-height: 100vh; /* ensure the page exists even if gallery is fixed */
}
@media (max-width:768px){
.page-content{
padding-top: var(--mobile-top) !important;
padding-bottom: var(--mobile-bottom) !important;
min-height: 100vh;
}
}
/* === MOBILE: fixed Freeform collage (no scroll inside the gallery) === */
@media (max-width:768px){
/* Keep it a canvas between header & footer */
[data-module="freeform-gallery"]{
position: fixed !important;
top: var(--mobile-top);
left: 0; right: 0;
height: calc(100vh - var(--mobile-top) - var(--mobile-bottom)) !important;
overflow: hidden !important; /* no internal scrolling */
z-index: 1 !important; /* below overlays */
display: block !important; /* stop grid/flex flips */
background: transparent !important;
transform: translateZ(0); /* iOS stability */
}
/* Preserve the collage (absolute children) */
[data-module="freeform-gallery"] > *{
position: absolute !important;
pointer-events: auto;
opacity: 1 !important;
}
/* Remove accidental white fills */
[data-module="freeform-gallery"],
[data-module="freeform-gallery"] *{
background: transparent !important;
}
}
/* === Make sure overlays stay above everything (works with Cargo 2 Overlay UI) === */
[data-overlay], [data-behavior="overlay"], .overlay{
z-index: 9999 !important;
transform: translateZ(0);
}
[data-overlay] a, [data-behavior="overlay"] a, .overlay a{
pointer-events: auto; /* keep overlay links clickable */
}
/* OPTIONAL: if you want the whole landing page to have ZERO scroll on mobile,
uncomment the two lines below. (Footer links will still work.) */
/*
@media (max-width:768px){
html, body{ height:100%; overflow:hidden; }
}
*/
[id="Q1578031613"] .page-content {
padding: 0.1rem;
}
[id="Q1578031613"] .page-content {
padding: 1.3rem;
align-items: center;
width: 100%;
}
[id="Q1578031613"].page {
}
[id="Q1578031613"] .backdrop {
}
.mobile [id="Q1578031613"] .backdrop {
}
[id="Q1578031613"] .page-layout {
align-items: center;
}
.mobile [id="Q1578031613"] .page-layout {
}
@media (max-width: 768px){
/* Try all common header hooks; Cargo themes vary */
.site-header,
header.site,
.header,
[data-role="header"]{
position: static !important; /* removes overlay behavior */
height: auto !important;
min-height: 48px !important; /* keep it modest */
margin: 0 !important;
padding: 8px 12px !important;
z-index: 1 !important; /* below content */
overflow: visible !important;
}
/* If there’s a spacer directly under the header, collapse it on mobile */
.spacer, .spacer-block, .empty-block {
height: 0 !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
}
}
/* === Sizes of your fixed overlays (tune these to what you actually see) === */
:root{
--desktop-top: 56px;
--desktop-bottom:56px;
--mobile-top: 44px;
--mobile-bottom: 44px;
}
/* Reserve space so content isn't hidden by the overlays */
.page-content{
padding-top: var(--desktop-top) !important;
padding-bottom: var(--desktop-bottom) !important;
min-height: 100vh; /* ensure the page exists even if gallery is fixed */
}
@media (max-width:768px){
.page-content{
padding-top: var(--mobile-top) !important;
padding-bottom: var(--mobile-bottom) !important;
min-height: 100vh;
}
}
/* === MOBILE: fixed Freeform collage (no scroll inside the gallery) === */
@media (max-width:768px){
/* Keep it a canvas between header & footer */
[data-module="freeform-gallery"]{
position: fixed !important;
top: var(--mobile-top);
left: 0; right: 0;
height: calc(100vh - var(--mobile-top) - var(--mobile-bottom)) !important;
overflow: hidden !important; /* no internal scrolling */
z-index: 1 !important; /* below overlays */
display: block !important; /* stop grid/flex flips */
background: transparent !important;
transform: translateZ(0); /* iOS stability */
}
/* Preserve the collage (absolute children) */
[data-module="freeform-gallery"] > *{
position: absolute !important;
pointer-events: auto;
opacity: 1 !important;
}
/* Remove accidental white fills */
[data-module="freeform-gallery"],
[data-module="freeform-gallery"] *{
background: transparent !important;
}
}
/* === Make sure overlays stay above everything (works with Cargo 2 Overlay UI) === */
[data-overlay], [data-behavior="overlay"], .overlay{
z-index: 9999 !important;
transform: translateZ(0);
}
[data-overlay] a, [data-behavior="overlay"] a, .overlay a{
pointer-events: auto; /* keep overlay links clickable */
}
/* OPTIONAL: if you want the whole landing page to have ZERO scroll on mobile,
uncomment the two lines below. (Footer links will still work.) */
/*
@media (max-width:768px){
html, body{ height:100%; overflow:hidden; }
}
*/
/* === Mobile fixed bars (set to your real heights) === */
:root{
--m-header: 44px; /* mobile marquee height */
--m-footer: 44px; /* mobile footer height */
}
/* Give the mobile page a predictable canvas */
@media (max-width:768px){
/* Your landing page ID from before */
#G2494417645 .page-content{ position: relative; }
/* Keep page content from hiding under the bars if anything scrolls */
#G2494417645 .page-content{
padding-top: var(--m-header) !important;
padding-bottom: var(--m-footer) !important;
}
/* FIXED mobile Freeform: no grid, no scroll, sits between bars */
[data-module="freeform-gallery"]{
position: fixed !important;
top: var(--m-header);
left: 0; right: 0;
height: calc(100vh - var(--m-header) - var(--m-footer)) !important;
overflow: hidden !important;
background: transparent !important;
z-index: 1 !important; /* under header/footer */
display: block !important; /* prevent grid/flex flips */
}
[data-module="freeform-gallery"] > *{
position: absolute !important; /* keep collage */
pointer-events: auto;
opacity: 1 !important;
}
}
@media (max-width:768px){
/* Position + size the mobile slideshow wrapper */
#G2494417645 bodycopy:has(> gallery-slideshow){
position: absolute !important;
/* start with generous, easy-to-see values; tweak after */
left: 6vw; /* horizontal position */
top: 18vh; /* vertical position (between bars) */
width: 88vw !important;
aspect-ratio: 4 / 5 !important; /* pick a nice mobile ratio */
z-index: 5;
--resize-parent-width: auto !important;
background: transparent !important;
}
/* Ensure the slideshow fills its wrapper */
#G2494417645 bodycopy gallery-slideshow,
#G2494417645 bodycopy gallery-slideshow media-item,
#G2494417645 bodycopy gallery-slideshow img,
#G2494417645 bodycopy gallery-slideshow video{
width: 100% !important;
height: 100% !important;
object-fit: cover; /* or 'contain' if you prefer no crop */
display: block !important;
}
}