.section-main-bunner {
    position: relative;
    overflow: hidden;
    padding: 80px 0 70px;
    background-color: #ffffff;
}

@media (min-width: 992px) {
    .section-main-bunner {
        min-height: 700px;
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 180px 0 120px;
    }
}

.section-main-bunner .main-bunner-img {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-position: right;
}

@media (min-width: 1200px) {
    .section-main-bunner .main-bunner-img {
        background-position: center;
    }
}

.section-main-bunner .main-bunner-inner {
    position: relative;
    flex: 1;
    z-index: 1;
}

.section-main-bunner .main-bunner-inner * + h1 {
    margin-top: 30px;
}

.section-main-bunner .main-bunner-inner .bunner-location {
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: 400;
}

.section-main-bunner .main-bunner-inner .bunner-location .icon {
    font-size: 30px;
    margin-right: 10px;
    vertical-align: top;
}

@media (min-width: 576px) {
    .section-main-bunner .main-bunner-inner .bunner-location .icon {
        vertical-align: middle;
    }
}

.section-main-bunner .main-bunner-inner .bunner-location a {
    display: inline-block;
}

.section-main-bunner.section-main-bunner-filter {
    background: #868e96;
}

.section-main-bunner.section-main-bunner-filter .main-bunner-img {
    opacity: 1;
}

.section-main-bunner.section-main-bunner-filter:before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    content: '';
    background: linear-gradient(359.73deg, #3A092F 0.9%, rgba(60, 55, 79, 0.45) 107.43%);
    z-index: 1;
}
/* CSS */

/* Background ken-burns + overlay */
.section-main-bunner .main-bunner-img {
    position: absolute;
    inset: 0;
    background-position: center;
    background-size: cover;
    will-change: transform, opacity;
    transform-origin: center;
    animation: bunner-kenburns 24s ease-in-out infinite alternate;
    transition: opacity 0.4s ease;
}

/* subtle color overlay */
.section-main-bunner .main-bunner-img::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10,10,25,0.30) 0%, rgba(26,18,43,0.55) 55%, rgba(10,10,25,0.7) 100%);
    pointer-events: none;
    mix-blend-mode: multiply;
    z-index: 1;
}

/* Ken-burns keyframes */
@keyframes bunner-kenburns {
    0% { transform: scale(1.06) translateY(0); filter: brightness(0.98); }
    100% { transform: scale(1) translateY(-6px); filter: brightness(1); }
}

/* Content stacking above overlay */
.section-main-bunner .main-bunner-inner { position: relative; z-index: 2; }

/* Fade-in / move-up animation used by data-caption-animate="fadeInUp" */
[data-caption-animate="fadeInUp"] {
    opacity: 0;
    transform: translateY(18px);
    animation-name: fadeUp;
    animation-duration: 0.9s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(.2,.9,.3,1);
}

/* Map specific delays (exact values from markup) */
[data-caption-animate][data-caption-delay="100"] { animation-delay: 0.10s; }
[data-caption-animate][data-caption-delay="450"] { animation-delay: 0.45s; }

/* Keyframes for fadeUp */
@keyframes fadeUp {
    to { opacity: 1; transform: translateY(0); }
}



/* css */
.section-main-bunner .group-xxl { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }

/* Primary button: animated gradient, sheen, pulse, glow, accessible focus/active */
.section-main-bunner .button.button-primary {
    position: relative;
    overflow: hidden;
    z-index: 2;
    color: #08103b;
    background: linear-gradient(90deg, #ffd37a 0%, #ffb65a 45%, #8B5E3C 85%);
    background-size: 200% 100%;
    padding: 12px 20px;
    border-radius: 999px;
    font-weight: 600;
    box-shadow: 0 8px 30px rgba(9,12,40,0.28);
    transition: transform .28s cubic-bezier(.2,.9,.3,1), box-shadow .28s, filter .28s, background-position .6s linear;
    will-change: transform, box-shadow, background-position;
    animation: btn-bg 8s linear infinite, btn-pulse 6s ease-in-out infinite;
}

/* keep inner content above pseudo layers */
.section-main-bunner .button.button-primary > * { position: relative; z-index: 3; }

/* sheen overlay (existing) */
.section-main-bunner .button.button-primary::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.06) 50%, rgba(255,255,255,0.14) 100%);
    transform: translateX(-120%) skewX(-8deg);
    transition: transform .6s cubic-bezier(.2,.9,.3,1), opacity .3s;
    pointer-events: none;
    mix-blend-mode: overlay;
    z-index: 2;
}
.section-main-bunner .button.button-primary:hover::before,
.section-main-bunner .button.button-primary:focus::before {
    transform: translateX(40%) skewX(-8deg);
    opacity: 1;
}

/* soft halo/glow behind button to match warm tone */
.section-main-bunner .button.button-primary::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 260%;
    height: 260%;
    transform: translate(-50%, -50%) scale(.9);
    background: radial-gradient(ellipse at center, rgba(255,211,122,0.14) 0%, rgba(139,94,60,0.06) 30%, transparent 55%);
    filter: blur(24px);
    opacity: 0;
    transition: opacity .35s, transform .35s;
    pointer-events: none;
    z-index: 1;
}
.section-main-bunner .button.button-primary:hover::after,
.section-main-bunner .button.button-primary:focus::after {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

/* hover / focus / active states */
.section-main-bunner .button.button-primary:hover,
.section-main-bunner .button.button-primary:focus {
    transform: translateY(-6px) scale(1.03);
    box-shadow: 0 22px 45px rgba(11,23,75,0.32);
    text-decoration: none;
}
.section-main-bunner .button.button-primary:active {
    transform: translateY(-2px) scale(.985);
    box-shadow: 0 10px 28px rgba(11,23,75,0.22);
}

/* keyboard focus visible for accessibility */
.section-main-bunner .button.button-primary:focus-visible {
    outline: none;
    box-shadow: 0 0 0 6px rgba(139,94,60,0.12), 0 14px 36px rgba(9,12,40,0.18);
    transform: translateY(-4px) scale(1.02);
}

/* subtle background movement + pulse */
@keyframes btn-bg {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes btn-pulse {
    0%   { box-shadow: 0 8px 30px rgba(9,12,40,0.28); transform: translateY(0) scale(1); }
    50%  { box-shadow: 0 14px 40px rgba(9,12,40,0.18); transform: translateY(-1px) scale(1.002); }
    100% { box-shadow: 0 8px 30px rgba(9,12,40,0.28); transform: translateY(0) scale(1); }
}

/* pressed / subtle inset when using pointer */
.section-main-bunner .button.button-primary:active::before { transform: translateX(20%) skewX(-8deg); }

/* White button variant kept with similar interactions */
.section-main-bunner .button.button-white {
    background: rgba(255,255,255,0.12);
    color: #fff;
    border-radius: 999px;
    padding: 12px 20px;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255,255,255,0.06);
    transition: background .28s ease, transform .28s ease, box-shadow .28s;
    text-shadow: none;
}
.section-main-bunner .button.button-white:hover {
    background: rgba(255,255,255,0.18);
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(4,8,30,0.18);
}

/* icon spacing */
.section-main-bunner .button .btn-booking-icon { display: inline-block; margin-right: 8px; vertical-align: middle; }

/* Respect reduced motion: remove continuous animations but keep quick affordances */
@media (prefers-reduced-motion: reduce) {
    .section-main-bunner .button.button-primary,
    .section-main-bunner .button.button-white {
        animation: none !important;
        transition: transform .12s linear, box-shadow .12s linear;
    }
    .section-main-bunner .button.button-primary::before,
    .section-main-bunner .button.button-primary::after {
        transition: none !important;
        opacity: 0.06;
        transform: none !important;
    }
}

/* faint floating keyframes */
@keyframes floatText {
    0% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
    100% { transform: translateY(0); }
}

/* Responsive tweaks */
@media (max-width: 991.98px) {
    .section-main-bunner { padding: 100px 0 60px; }
    .section-main-bunner h2 { font-size: 2rem; }
    .group-xxl { gap:10px; }
}

/* Accessibility: prefer-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .section-main-bunner .main-bunner-img,
    [data-caption-animate="fadeInUp"],
    .phone-wrap {
        animation: none !important;
        transition: none !important;
    }
}
.section-main-bunner .container .col-lg-5 {
    display: flex;
    flex-direction: column;
    align-items: center; /* horizontal center */
    text-align: center;  /* center inline text like h1 */
}

/* Center the button row under the title without affecting other areas */
.section-main-bunner .col-lg-5 > .btn-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 12px;
}

/* Make the title a single unwrappable line */
.section-main-bunner .main-bunner-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    font-size: 2.6rem; /* keep size from previous h2 */
    margin: 0 0 18px;
    color: #fff;
    font-weight: 700;
    line-height: 1;
}

/* Responsive: reduce font-size on smaller screens so it stays one line */
@media (max-width: 991.98px) {
    .section-main-bunner .main-bunner-title {
        font-size: 1.8rem;
        white-space: nowrap;
    }
}

/* Preserve reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
    .section-main-bunner .main-bunner-title,
    .section-main-bunner .col-lg-5 > .btn-wrap {
        transition: none !important;
        animation: none !important;
    }
}
/* CSS - add to `site/css/main-bunner.css` */

/* H1 pop + shimmer (keeps existing fadeUp) */
.section-main-bunner .main-bunner-title {
    position: relative;
    display: inline-block;
    will-change: transform, opacity;
    /* combine existing fadeUp with an extra pop */
    animation-name: fadeUp, title-pop;
    animation-duration: 0.9s, 0.9s;
    animation-fill-mode: both, both;
    animation-timing-function: cubic-bezier(.2,.9,.3,1), cubic-bezier(.16,1,.3,1);
    /* default small stagger; per-attribute overrides below */
    animation-delay: 0.10s, 0.12s;
}

/* Sync with the element's data-caption-delay if present */
.section-main-bunner .main-bunner-title[data-caption-delay="100"] {
    animation-delay: 0.10s, 0.12s;
}
.section-main-bunner .main-bunner-title[data-caption-delay="450"] {
    animation-delay: 0.45s, 0.47s;
}

/* gentle scale/pop */
@keyframes title-pop {
    0%   { transform: scale(.98); filter: blur(.6px); }
    60%  { transform: scale(1.02); filter: blur(0); }
    100% { transform: scale(1); filter: blur(0); }
}

/* Shimmer overlay */
.section-main-bunner .main-bunner-title::after {
    content: "";
    position: absolute;
    top: 0;
    left: -40%;
    width: 40%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.36) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-18deg);
    pointer-events: none;
    opacity: 0;
    animation: title-shine 1.2s ease-in-out 0.18s both;
}

/* Sync shimmer delay with caption delay */
.section-main-bunner .main-bunner-title[data-caption-delay="100"]::after {
    animation-delay: 0.22s;
}
.section-main-bunner .main-bunner-title[data-caption-delay="450"]::after {
    animation-delay: 0.50s;
}

@keyframes title-shine {
    0%   { left: -40%; opacity: 0; }
    30%  { opacity: 1; }
    100% { left: 120%; opacity: 0; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .section-main-bunner .main-bunner-title,
    .section-main-bunner .main-bunner-title::after {
        animation: none !important;
        transition: none !important;
    }
}
/* css - replace block in `site/css/main-bunner.css` */

/* Yellow -> white gradient + continuous animations (keeps entrance animations) */
.section-main-bunner .main-bunner-title {
    background: linear-gradient(90deg, #ffffff 0%, #ffd37a 40%, #8B5E3C 70%, #ffffff 100%);
    background-size: 200% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    display: inline-block;
    will-change: transform, opacity, background-position, letter-spacing, text-shadow;

    /* entrance (once) + continuous (infinite) */
    animation-name: fadeUp, title-pop, title-gradient, title-tracking, title-glow;
    animation-duration: 0.9s, 0.9s, 6s, 3.5s, 3s;
    animation-timing-function: cubic-bezier(.2,.9,.3,1), cubic-bezier(.16,1,.3,1), linear, ease-in-out, ease-in-out;
    animation-delay: 0.10s, 0.12s, 1s, 1s, 1s;
    animation-iteration-count: 1, 1, infinite, infinite, infinite;
    animation-direction: normal, normal, alternate, alternate, alternate;
    animation-fill-mode: both, both, both, both, both;
}


/* brighter white shimmer to read over yellow->white text */
.section-main-bunner .main-bunner-title::after {
    content: "";
    position: absolute;
    top: 0;
    left: -40%;
    width: 40%;
    height: 100%;
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.85) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-18deg);
    pointer-events: none;
    opacity: 0;
    animation: title-shine 1.2s ease-in-out 0.18s both;
}

/* gradient movement (yellow <-> white) */
@keyframes title-gradient {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* gentle letter-spacing pulse */
@keyframes title-tracking {
    0%   { letter-spacing: 0px; }
    50%  { letter-spacing: 2px; }
    100% { letter-spacing: 0px; }
}

/* subtle yellow glow to match the yellow tone */
@keyframes title-glow {
    0%   { text-shadow: 0 6px 20px rgba(255,211,122,0.12); }
    50%  { text-shadow: 0 12px 40px rgba(255,211,122,0.22); }
    100% { text-shadow: 0 6px 20px rgba(255,211,122,0.12); }
}

/* Respect reduced motion: keep only a simple entrance */
@media (prefers-reduced-motion: reduce) {
    .section-main-bunner .main-bunner-title {
        animation: fadeUp 0.9s both;
        -webkit-animation: fadeUp 0.9s both;
        transition: none !important;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: initial;
        color: #fff;
    }
    .section-main-bunner .main-bunner-title::after {
        animation: none !important;
        opacity: 0 !important;
    }
}
/* css (paste into `site/css/main-bunner.css`) */
/* Restore missing button: display, stacking, visibility */
.section-main-bunner .button.button-primary.button-md.button-round-2,
.section-main-bunner .button.button-primary.button-md {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 110px;
    line-height: 1;
    padding: 12px 20px; /* keep comfortable hit area */
    position: relative;
    z-index: 9999 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure button text and icons stay above any overlays */
.section-main-bunner .button.button-primary > *,
.section-main-bunner .button.button-primary.button-md.button-round-2 > * {
    position: relative;
    z-index: 10000 !important;
}

/* Make sure background image/overlay can't cover the button */
.section-main-bunner .main-bunner-img,
.section-main-bunner .main-bunner-img::after {
    z-index: 0;
}

/* Keep pseudo-elements non-blocking and non-interactive */
.section-main-bunner .button.button-primary::before,
.section-main-bunner .button.button-primary::after {
    pointer-events: none;
}

/* If caption animations hid the button, disable them for this button */
.section-main-bunner .button.button-primary[data-caption-animate] {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
}