#ofte-stilte-sporsmal {
scroll-margin-top: 150px;
}

/* Updated mobile-cta class */
.mobile-cta {
display: flex;
flex-direction: column;
align-items: flex-start;
width: 100%;              
flex-shrink: 0;           
flex-wrap: nowrap !important; 
}

/* Prevent any content wrapping during animation */
#modal-1 .wp-block-navigation__responsive-container-content,
#modal-1 .wp-block-navigation__responsive-container-content > * {
width: 100%;
flex-shrink: 0;
flex-wrap: nowrap !important;
transform: translateZ(0);
will-change: transform;
}

/* Force all direct children of the dialog to maintain width */
#modal-1 .wp-block-navigation__responsive-dialog > * {
width: 100%;
flex-shrink: 0;
flex-wrap: nowrap !important;
}

/* Ensure buttons stay in place */
#modal-1 .mobile-cta .is-style-fill.black-btn,
#modal-1 .mobile-cta .white-btn.is-style-fill {
width: 100%;              
flex-shrink: 0;           
transform: translateZ(0); 
will-change: transform;   
}

/* Ensure the mobile-cta container maintains its layout during animation */
#modal-1 .wp-block-navigation__responsive-dialog .mobile-cta {
transform: translateZ(0);
will-change: transform;
width: 100%;
flex-wrap: nowrap !important;
}

/* ======================================
 CONTAINER — neutralize hidden-by-default
 ====================================== */
#modal-1.wp-block-navigation__responsive-container.hidden-by-default{
display: block !important;              /* override WP display:none */
visibility: visible !important;         /* keep in layout */
pointer-events: none;                   /* not interactive until open */
background: transparent !important;     /* no dim until open */
position: fixed; inset: 0; z-index: 10000;

/* 🔒 ensure no extra padding/margins from theme (e.g., has-background) */
padding: 0 !important;
margin: 0 !important;
}

/* OPEN: enable interactions (visual dim handled by ::before) */
#modal-1.wp-block-navigation__responsive-container.is-menu-open{
pointer-events: auto;
background: transparent !important;     /* keep container itself transparent */
}

/* ======================================
 BACKDROP (visual) — as pseudo-element (never transforms)
 ====================================== */
#modal-1.wp-block-navigation__responsive-container::before{
content: "";
position: fixed;                         /* pinned to viewport */
inset: 0;
background: rgba(0,0,0,0.4);
opacity: 0;                              /* fade control */
pointer-events: none;                    /* clicks handled by the close button */
transition: opacity .28s ease;
z-index: 0;                              /* behind the panel */
}
#modal-1.wp-block-navigation__responsive-container.is-menu-open::before{
opacity: 1;
}

/* ======================================
 CLICK-OUTSIDE TARGET — independent of panel
 ====================================== */
#modal-1 .wp-block-navigation__responsive-close{
position: fixed; inset: 0;               /* full-screen hit area */
display: block;
background: transparent !important;
pointer-events: none;                    /* off until open */
opacity: 1;                              /* visualless; no fade needed */
transition: none;                        /* ensure no accidental animation */
z-index: 0;                              /* sits over backdrop but under panel */
}
#modal-1.is-menu-open .wp-block-navigation__responsive-close{
pointer-events: auto;                    /* click outside to close */
}

/* ======================================
 SLIDING PANEL — viewport anchored
 ====================================== */
/* Guard against inline display:none from WP */
#modal-1 .wp-block-navigation__responsive-dialog,
#modal-1 .wp-block-navigation__responsive-dialog[style*="display:none"]{
display: block !important;
}

#modal-1 .wp-block-navigation__responsive-dialog{
position: fixed; top: 0; right: 0;
z-index: 1;                              /* above backdrop & close layer */

/* LOCK THE BOX so content doesn't reflow during animation */
width: 320px;                            /* set your desired panel width */
min-width: 320px;
max-width: 85vw;                         /* prevents overflow on tiny screens */
height: 100%;
box-sizing: border-box;

/* ✅ padding lives ONLY here */
padding: 2rem !important;
padding-top: 6rem !important;
background: #f4ac4e !important;

/* keep scroll stable; avoid jump when closing */
overflow: auto;
scrollbar-gutter: stable both-edges;
overscroll-behavior: contain;

/* clean slide */
transform: translate3d(100%, 0, 0);      /* off-canvas to right */
visibility: hidden;                      /* out of a11y focus when closed */
pointer-events: none;

transition: transform .35s ease, visibility 0s .35s;
will-change: transform;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}

/* OPEN STATE — panel slides only */
#modal-1.is-menu-open .wp-block-navigation__responsive-dialog{
transform: translate3d(0, 0, 0);
visibility: visible;
pointer-events: auto;
transition: transform .35s ease, visibility 0s;
}

/* ======================================
 INNER CONTENT — no extra padding; stable stack
 ====================================== */
#modal-1 .wp-block-navigation__responsive-container-content{
/* 🧹 kill any theme padding so we don't double to ~4rem */
padding: 0 !important;
margin: 0 !important;

transform: translateZ(0);                /* own layer to avoid text shimmer */
will-change: transform;
display: flex;
flex-direction: column;
flex-wrap: nowrap !important;
}

#modal-1 .wp-block-navigation__container{
/* reset list defaults so top isn't pushed down */
margin: 0; padding: 0; list-style: none;

display: flex;
flex-direction: column;
flex-wrap: nowrap !important;            /* no wrapping gymnastics while sliding */
gap: .75rem;                             /* adjust spacing to taste */
width: 100%;
}

/* Close button spacing (if you have a dedicated close block inside the panel) */
#modal-1 .wp-block-navigation__responsive-container-close{
margin: 2rem !important;
padding: 0 !important;
transform: scale(1.5);
}

.yellow-btn a:hover {
filter: brightness(0.9);
}

.white-btn a:hover {
filter: brightness(0.95);
}

.black-btn a:hover {
filter: brightness(1.5);
}

.is-style-outline a:hover {
background-color: rgba(255,255,255,0.2);
}

.site-header {
position: fixed;
z-index: 4;
width: 100%;
}

.hvorfor-smingel-bilde {
overflow: hidden;
}