/* ================================================================
   LYX Gallery v1.3
   Font: Poppins 600/400  ·  Palette: #0a0a0a / #fff / #c8a96e
================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* ═══════════════════════════════════════════════════════
   GALLERY SPECIFICITY SHIELD
   The theme's body/h1/h2/p/a/button rules bleed in when
   Elementor header/footer loads. These overrides restore
   our styles with high enough specificity to win.
   All rules scoped to .lyx-gallery-body so zero bleed
   back to the main site.
═══════════════════════════════════════════════════════ */
body.lyx-gallery-body,
body.lyx-gallery-body * {
    box-sizing: border-box;
}
body.lyx-gallery-body {
    background: #0a0a0a !important;
    color: #fff !important;
    font-family: 'Poppins', sans-serif !important;
}
body.lyx-gallery-body h1,
body.lyx-gallery-body h2,
body.lyx-gallery-body h3,
body.lyx-gallery-body h4 {
    color: #fff !important;
    font-family: 'Poppins', sans-serif !important;
}
body.lyx-gallery-body p,
body.lyx-gallery-body span,
body.lyx-gallery-body div {
    font-family: 'Poppins', sans-serif;
}
body.lyx-gallery-body a {
    color: inherit;
    text-decoration: none;
}
/* Prevent theme from adding margins/padding to our sections */
body.lyx-gallery-body .lyx-hero,
body.lyx-gallery-body .lyx-carousel-section,
body.lyx-gallery-body .lyx-scroll-gallery,
body.lyx-gallery-body .lyx-lightbox,
body.lyx-gallery-body .lyx-lb-backdrop {
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: none !important;
    width: 100% !important;
}
/* Elementor wraps content in .elementor-section-wrap — neutralise it */
body.lyx-gallery-body .elementor-section-wrap > *:not([class*="lyx-"]) {
    display: none;
}
/* Share buttons — prevent theme link/button styles */
body.lyx-gallery-body .lyx-share-btn {
    color: #fff !important;
    font-family: 'Poppins', sans-serif !important;
    text-decoration: none !important;
}
/* Scroll cue button */
body.lyx-gallery-body #lyxScrollCue {
    color: rgba(255,255,255,.55) !important;
    font-family: 'Poppins', sans-serif !important;
}


*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}

.lyx-gallery-body{
    background:#0a0a0a;color:#fff;
    font-family:'Poppins',sans-serif;
    font-size:16px;font-weight:400;line-height:1.6;
    min-height:100vh;overflow-x:hidden;
}

/* ── Hero ─────────────────────────────────────────────── */
.lyx-hero{display:flex;flex-direction:column;min-height:100vh}

.lyx-hero-image{
    position:relative;overflow:hidden;background:#111;
    width:100%;height:55vw;min-height:260px;max-height:480px;
    flex-shrink:0;
}
/* Hero photo is a real <img>; cover-cropped like the old background. */
body.lyx-gallery-body .lyx-hero-image .lyx-hero-img{
    position:absolute;inset:0;
    width:100% !important;height:100% !important;max-width:none !important;
    object-fit:cover;object-position:center;display:block;margin:0;
}
.lyx-hero-text{
    flex:1;background:#0a0a0a;
    display:flex;align-items:center;padding:48px 24px 40px;
}
.lyx-hero-inner{max-width:560px;width:100%}
.lyx-hero-label{
    font-size:11px;font-weight:500;letter-spacing:.15em;
    text-transform:uppercase;color:#c8a96e;margin-bottom:16px;
}
.lyx-hero-title{
    font-size:clamp(26px,5vw,52px);font-weight:600;
    line-height:1.15;color:#fff;margin-bottom:20px;
}
.lyx-hero-excerpt{
    font-size:15px;color:rgba(255,255,255,.65);
    line-height:1.7;margin-bottom:32px;max-width:480px;
}

/*
   SCROLL CUE — FIX #2
   The visible box/rectangle was caused by the browser's default
   <button> styles bleeding in (background, border, outline).
   We must explicitly reset ALL button defaults, then force our style
   with !important to beat any theme stylesheet that targets `button`.
*/
#lyxScrollCue,
button#lyxScrollCue,
.lyx-gallery-body button#lyxScrollCue {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    color: rgba(255,255,255,.55) !important;
    font-family: 'Poppins', sans-serif !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 12px !important;
    cursor: pointer !important;
    transition: color .2s !important;
    text-decoration: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
#lyxScrollCue:hover,
.lyx-gallery-body button#lyxScrollCue:hover { color: #fff !important; }
#lyxScrollCue svg { flex-shrink:0; animation: lyxBounce 2s ease-in-out infinite; }
@keyframes lyxBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(5px)} }

/* Deck — excerpt shown below scroll cue */
.lyx-hero-deck{
    font-size:13px;color:rgba(255,255,255,.5);
    line-height:1.6;margin-top:16px;
    max-width:420px;
}

@media(min-width:900px){
    .lyx-hero{flex-direction:row;height:100vh;max-height:900px}
    .lyx-hero-image{width:55%;height:100%;max-height:none}
    .lyx-hero-text{width:45%;padding:60px 56px;justify-content:center}
    .lyx-hero-inner{max-width:480px}
}

/* ── Share buttons ────────────────────────────────────── */
.lyx-share-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:36px}

.lyx-share-btn{
    display:inline-flex;align-items:center;gap:7px;
    padding:8px 16px;border-radius:40px;
    font-size:12px;font-weight:500;font-family:'Poppins',sans-serif;
    text-decoration:none;
    /* FIX #1 & #5: ALL buttons same neutral border — Pinterest no longer red */
    border:1px solid rgba(255,255,255,.15);
    color:#fff;background:rgba(255,255,255,.06);
    transition:background .2s,border-color .2s,transform .15s;
    cursor:pointer;white-space:nowrap;
    -webkit-appearance:none;appearance:none;
    box-shadow:none;outline:none;
}
.lyx-share-btn:hover{
    background:rgba(255,255,255,.13);
    border-color:rgba(255,255,255,.35);
    transform:translateY(-1px);
}
/* Subtle branded hover only — no idle border colour change */
.lyx-share-pinterest:hover{background:rgba(230,0,35,.12)}
.lyx-share-facebook:hover{background:rgba(24,119,242,.12)}
.lyx-share-whatsapp:hover{background:rgba(37,211,102,.12)}

/* ── Carousel section ─────────────────────────────────── */
.lyx-carousel-section{padding:64px 0 80px;background:#0a0a0a}

/* ── Card shared ──────────────────────────────────────── */
.lyx-card{cursor:pointer;user-select:none;outline:none}
.lyx-card-inner{position:relative;overflow:hidden;border-radius:4px;background:#111}
.lyx-card-inner img{
    width:100%;height:100%;object-fit:cover;display:block;
    transition:transform .5s cubic-bezier(.25,.46,.45,.94),filter .3s;
}
.lyx-card-overlay{
    position:absolute;inset:0;
    background:linear-gradient(to top,rgba(0,0,0,.65) 0%,rgba(0,0,0,0) 55%);
    opacity:0;transition:opacity .3s;
    display:flex;flex-direction:column;justify-content:flex-end;padding:18px;
}
.lyx-card:hover .lyx-card-overlay,
.lyx-card:focus .lyx-card-overlay{opacity:1}
.lyx-card:hover .lyx-card-inner img,
.lyx-card:focus .lyx-card-inner img{filter:brightness(.82);transform:scale(1.03)}

.lyx-card-expand{
    position:absolute;top:50%;left:50%;
    transform:translate(-50%,-50%) scale(.7);
    color:rgba(255,255,255,.9);opacity:0;
    transition:opacity .25s,transform .25s;pointer-events:none;
}
.lyx-card:hover .lyx-card-expand,
.lyx-card:focus .lyx-card-expand{opacity:1;transform:translate(-50%,-50%) scale(1)}

/*
   CARD TITLES — FIX #2
   The title must be OUTSIDE the opacity:0 overlay so it's always visible
   when enabled. It sits in a separate absolutely-positioned strip at the
   bottom of .lyx-card-inner with its own permanent dark gradient.
   The overlay (expand icon + hover dim) is unaffected.
*/
.lyx-card-title{
    /* Absolute strip at bottom of card — always visible when enabled */
    position:absolute;
    bottom:0;left:0;right:0;
    padding:32px 14px 12px;
    font-size:13px;font-weight:500;color:#fff;
    line-height:1.3;
    margin:0;
    /* Own gradient so text is readable without hover */
    background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,0) 100%);
    /* Hidden by default */
    display:none;
    z-index:2; /* above the hover overlay */
    pointer-events:none;
}
body.lyx-titles-visible .lyx-card-title,
.lyx-gallery-body.lyx-titles-visible .lyx-card-title{
    display:block !important;
}

.lyx-counter-badge{
    position:absolute;top:12px;right:12px;
    font-size:10px;font-weight:600;letter-spacing:.08em;
    color:rgba(255,255,255,.8);background:rgba(0,0,0,.5);
    padding:3px 8px;border-radius:20px;
    opacity:0;transition:opacity .3s;
}
.lyx-card:hover .lyx-counter-badge,
.lyx-card:focus .lyx-counter-badge{opacity:1}

/* ── Peek carousel ────────────────────────────────────── */
.lyx-swiper-peek{
    padding:0 10% 56px !important;
    overflow:visible !important;
    cursor:grab;
}
.lyx-swiper-peek:active{cursor:grabbing}
/*
   FIX #1 — Magic Mouse horizontal swipe.
   Elementor's swiper.min.css sets touch-action:pan-y on .swiper-wrapper,
   which tells the browser to intercept horizontal gestures before Swiper
   can see them. Override to none so Swiper handles all pointer movement.
*/
.lyx-swiper-peek .swiper-wrapper{
    align-items:center;
    touch-action:none !important;
}
.lyx-swiper-peek .swiper-slide{
    width:72% !important;
    height:auto !important;
    opacity:.45;transform:scale(.91);
    transition:opacity .4s,transform .4s;
}
.lyx-swiper-peek .swiper-slide-active{opacity:1;transform:scale(1)}
/*
   FIX #1 — Card height.
   autoHeight + aspect-ratio made the card 670px+ tall on wide viewports,
   pushing the image bottom (and title) below the visible area.
   Fixed height on the card-inner constrains everything inside it.
   The image fills it with object-fit:cover. Title sits at absolute bottom:0
   which is now always visible within the card.
*/
.lyx-swiper-peek .lyx-card-inner{
    height: 420px;
    overflow: hidden;
}
.lyx-swiper-peek .lyx-card-inner img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
@media(max-width:900px){
    .lyx-swiper-peek .lyx-card-inner{ height:320px; }
}
@media(max-width:600px){
    .lyx-swiper-peek .lyx-card-inner{ height:240px; }
}
.lyx-swiper-peek .swiper-pagination{bottom:14px !important}
.lyx-pagination .swiper-pagination-bullet{background:rgba(255,255,255,.3);opacity:1}
.lyx-pagination .swiper-pagination-bullet-active{background:#c8a96e}
.lyx-nav-prev,.lyx-nav-next{
    color:#fff !important;background:rgba(255,255,255,.08);
    width:44px !important;height:44px !important;border-radius:50%;
    transition:background .2s;top:calc(50% - 28px) !important;
}
.lyx-nav-prev:hover,.lyx-nav-next:hover{background:rgba(255,255,255,.2) !important}
.lyx-nav-prev::after,.lyx-nav-next::after{font-size:16px !important}
@media(max-width:768px){
    .lyx-swiper-peek{padding:0 6% 48px !important}
    .lyx-swiper-peek .swiper-slide{width:86% !important}
}

/* ── 2-column grid ────────────────────────────────────── */
.lyx-grid-carousel{
    display:grid;grid-template-columns:1fr 1fr;
    gap:16px;padding:0 24px;max-width:1200px;margin:0 auto;
}
.lyx-grid-card .lyx-card-inner{height:320px}
@media(max-width:600px){
    .lyx-grid-carousel{grid-template-columns:1fr;gap:12px}
    .lyx-grid-card .lyx-card-inner{height:240px}
}

/* ── Filmstrip ────────────────────────────────────────── */
.lyx-filmstrip-wrap{overflow-x:auto;padding:0 24px 24px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}
.lyx-filmstrip{display:flex;gap:14px;width:max-content}
.lyx-film-card{flex-shrink:0;width:220px}
.lyx-film-card .lyx-card-inner{height:160px}
.lyx-film-title{font-size:12px;color:rgba(255,255,255,.6);margin-top:8px;padding:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── Scroll layout ────────────────────────────────────
   Full-bleed stacked images, Nat Geo / Atlantic style.
   Each .lyx-scroll-item is observed by IntersectionObserver
   which fires a GA4 pageview and updates the URL.
*/
.lyx-scroll-gallery{
    width:100%;
    background:#0a0a0a;
}

.lyx-scroll-item{
    width:100%;
    border-bottom:1px solid rgba(255,255,255,.06);
}

/* Full-bleed image — no max-width, no padding */
.lyx-scroll-image-wrap{
    width:100%;
    line-height:0; /* remove inline-block gap */
    background:#000;
}
.lyx-scroll-image{
    width:100%;
    height:auto;
    display:block;
    /* Start visible — JS adds lyx-loaded which triggers transition.
       WP Rocket lazy loader replaces src with placeholder briefly;
       starting at opacity:1 prevents a flash of invisible content. */
    opacity:1;
    transition:opacity .4s ease;
}

/* Caption strip — centred, max-width for readability */
.lyx-scroll-caption-strip{
    background:#0a0a0a;
    padding:32px 24px 28px;
}
.lyx-scroll-caption-inner{
    max-width:720px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.lyx-scroll-meta{display:flex;flex-direction:column;gap:8px}
.lyx-scroll-title{
    font-size:clamp(18px,2.5vw,26px);
    font-weight:600;color:#fff;
    line-height:1.25;margin:0;
}
.lyx-scroll-caption{
    font-size:15px;color:rgba(255,255,255,.7);
    line-height:1.75;margin:0;
}
.lyx-scroll-credit{
    font-size:10px;font-weight:500;
    letter-spacing:.1em;text-transform:uppercase;
    color:rgba(255,255,255,.35);margin:0;
}
.lyx-scroll-share{
    margin-bottom:0; /* override default .lyx-share-row margin */
}

/* Ad between images */
.lyx-scroll-ad{
    background:#0d0d0d;
    padding:20px 0;
    text-align:center;
    min-height:100px;
    border-top:1px solid rgba(255,255,255,.04);
}
.lyx-scroll-ad .adsbygoogle{
    display:block;
    margin:0 auto;
}

@media(max-width:600px){
    .lyx-scroll-caption-strip{padding:24px 16px 20px}
    .lyx-scroll-title{font-size:18px}
}


.lyx-ad-below-carousel{margin:48px auto 0;max-width:900px;padding:0 24px;min-height:90px}

/* ── Lightbox backdrop ────────────────────────────────── */
.lyx-lb-backdrop{
    position:fixed;inset:0;background:rgba(0,0,0,.95);
    z-index:9998;opacity:0;transition:opacity .25s;
}
.lyx-lb-backdrop.lyx-visible{opacity:1}

.lyx-lightbox{
    position:fixed;inset:0;z-index:9999;
    overflow-y:auto;display:none;
    align-items:flex-start;justify-content:center;
    padding:24px 16px 48px;
}
.lyx-lightbox.lyx-visible{display:flex}

.lyx-lb-inner{
    position:relative;width:100%;max-width:860px;
    background:#111;border-radius:6px;overflow:hidden;
    margin:auto;
    animation:lyxLbIn .3s cubic-bezier(.34,1.56,.64,1) forwards;
}
@keyframes lyxLbIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}

/* ── Image wrap ───────────────────────────────────────── */
.lyx-lb-image-wrap{width:100%;background:#000;line-height:0}
.lyx-lb-image{width:100%;height:auto;max-height:72vh;object-fit:contain;display:block}

/* ── Full-width stack ─────────────────────────────────── */
.lyx-lb-fullwidth_stack .lyx-lb-info{padding:28px 32px 32px}
.lyx-lb-fullwidth_stack .lyx-lb-ad{
    margin-top:20px;border-top:1px solid rgba(255,255,255,.07);
    padding-top:16px;min-height:90px;
}

/* ── Image + sidebar — FIX #7 ─────────────────────────
   Entire lightbox constrained to viewport height.
   Left: image fills available height.
   Right: sidebar scrolls internally if content overflows.
   Arrows centred on left column only.
   No outer scroll needed.
*/
.lyx-lb-image_right_sidebar{
    display:grid;
    grid-template-columns:1fr 300px;
    max-width:1100px;
    /* Constrain to viewport so nothing scrolls outside */
    height:calc(100vh - 48px);
    max-height:800px;
    overflow:hidden;
}
.lyx-lb-image_right_sidebar .lyx-lb-image-wrap{
    grid-column:1;grid-row:1;
    display:flex;align-items:center;justify-content:center;
    height:100%;overflow:hidden;background:#000;
}
.lyx-lb-image_right_sidebar .lyx-lb-image{
    width:100%;height:auto;
    max-height:100%;object-fit:contain;
}
/* Sidebar: scrolls internally */
.lyx-lb-image_right_sidebar .lyx-lb-info{
    grid-column:2;grid-row:1;
    padding:20px 18px 20px;
    overflow-y:auto;height:100%;
    background:#141414;
    border-left:1px solid rgba(255,255,255,.06);
    display:flex;flex-direction:column;
}
.lyx-lb-image_right_sidebar .lyx-lb-ad{
    margin-top:auto;padding-top:14px;
    border-top:1px solid rgba(255,255,255,.07);min-height:90px;
}
/*
   Arrows: vertically centred on the LEFT column (image area).
   Right arrow stops before the sidebar.
*/
.lyx-lb-image_right_sidebar .lyx-lb-nav{
    top:50%;transform:translateY(-50%);
}
.lyx-lb-image_right_sidebar .lyx-lb-prev{left:14px}
.lyx-lb-image_right_sidebar .lyx-lb-next{
    /* right edge of image col = total width minus sidebar 300px minus arrow width 44px minus gap */
    right:calc(300px + 14px);
}
@media(max-width:768px){
    .lyx-lb-image_right_sidebar{
        grid-template-columns:1fr;
        height:auto;max-height:none;overflow:visible;
    }
    .lyx-lb-image_right_sidebar .lyx-lb-image-wrap{height:auto}
    .lyx-lb-image_right_sidebar .lyx-lb-image{max-height:55vw}
    .lyx-lb-image_right_sidebar .lyx-lb-info{height:auto;overflow:visible}
    .lyx-lb-image_right_sidebar .lyx-lb-next{right:14px}
}

/*
   FULLSCREEN OVERLAY — completely self-contained via position:fixed.
   The .lyx-lightbox wrapper padding/alignment is irrelevant because
   the inner positions itself directly over the viewport.
   No wrapper changes needed — eliminates all height calculation bugs.
*/
.lyx-lightbox:has(.lyx-lb-fullscreen_overlay),
.lyx-lightbox.lyx-is-fullscreen {
    padding: 0 !important;
    overflow: hidden;
}
.lyx-lb-fullscreen_overlay{
    position: fixed;
    inset: 0;               /* top:0 right:0 bottom:0 left:0 */
    width: 100%;
    height: 100%;           /* fills the fixed containing block = viewport */
    max-width: 100%;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    background: #000;
    overflow: hidden;
    z-index: 9999;          /* same as .lyx-lightbox, stacks correctly */
    margin: 0;
}
.lyx-lb-fullscreen_overlay .lyx-lb-image-wrap{
    flex: 1 1 0%;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
    overflow: hidden;
}
.lyx-lb-fullscreen_overlay .lyx-lb-image{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
}
.lyx-lb-fullscreen_overlay .lyx-lb-info{
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 24px 14px;
    background: rgba(8,8,8,.97);
    border-top: 1px solid rgba(255,255,255,.07);
    width: 100%;
    overflow: hidden;
}
.lyx-lb-fullscreen_overlay .lyx-lb-title{
    font-size:14px;text-align:center;margin-bottom:2px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    max-width:600px;width:100%;
}
.lyx-lb-fullscreen_overlay .lyx-lb-caption{
    font-size:12px;text-align:center;max-width:560px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    margin-bottom:6px;color:rgba(255,255,255,.55);
}
/* FIX #3b — Credit restored, small and inline */
.lyx-lb-fullscreen_overlay .lyx-lb-credit{
    display:block;
    font-size:10px;color:rgba(255,255,255,.4);
    letter-spacing:.06em;text-transform:uppercase;
    margin-bottom:8px;text-align:center;
}
.lyx-lb-fullscreen_overlay .lyx-share-row{
    justify-content:center;margin-bottom:0;gap:8px;
}
.lyx-lb-fullscreen_overlay .lyx-share-btn{padding:5px 11px;font-size:11px}
.lyx-lb-fullscreen_overlay .lyx-lb-ad{
    display:block;width:100%;max-width:728px;
    margin:8px auto 0;min-height:60px;
    text-align:center;flex-shrink:0;
}
/* Arrows: positioned within image area */
.lyx-lb-fullscreen_overlay .lyx-lb-prev{left:20px}
.lyx-lb-fullscreen_overlay .lyx-lb-next{right:20px}

/* ── Shared lightbox elements ─────────────────────────── */
.lyx-lb-title{font-size:18px;font-weight:600;color:#fff;line-height:1.3;margin-bottom:10px}
.lyx-lb-caption{font-size:14px;color:rgba(255,255,255,.7);line-height:1.7;margin-bottom:8px}
/* FIX #4 — Credit: label and photographer name both uppercase */
.lyx-lb-credit{
    font-size:11px;color:rgba(255,255,255,.45);
    letter-spacing:.06em;margin-bottom:16px;
    text-transform:uppercase;
    font-weight:500;
}
.lyx-lb-share{margin-bottom:20px}
.lyx-lb-share .lyx-share-btn{padding:6px 12px;font-size:11px}

.lyx-lb-counter{
    position:absolute;top:14px;left:50%;transform:translateX(-50%);
    font-size:11px;font-weight:600;letter-spacing:.12em;
    color:rgba(255,255,255,.8);background:rgba(0,0,0,.6);
    padding:4px 14px;border-radius:20px;z-index:10;white-space:nowrap;
    pointer-events:none;
}
.lyx-lb-close{
    position:absolute;top:12px;right:12px;z-index:20;
    background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.15) !important;
    color:#fff;border-radius:50%;width:36px;height:36px;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:background .2s;
    -webkit-appearance:none;appearance:none;box-shadow:none;outline:none;
}
.lyx-lb-close:hover{background:rgba(255,255,255,.15)}
.lyx-lb-nav{
    position:absolute;top:50%;transform:translateY(-50%);
    background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.12) !important;
    color:#fff;border-radius:50%;width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;transition:background .2s,opacity .2s;z-index:20;
    -webkit-appearance:none;appearance:none;box-shadow:none;outline:none;
}
.lyx-lb-prev{left:14px}
.lyx-lb-next{right:14px}
.lyx-lb-nav:hover{background:rgba(255,255,255,.15)}
.lyx-lb-nav:disabled,.lyx-lb-nav[aria-disabled="true"]{opacity:.2;cursor:not-allowed}

@media(max-width:768px){
    .lyx-lightbox{padding:0;align-items:flex-end}
    .lyx-lb-inner:not(.lyx-lb-fullscreen_overlay){
        border-radius:12px 12px 0 0;max-height:95vh;overflow-y:auto;
    }
    .lyx-lb-nav{width:36px;height:36px}
    .lyx-lb-fullscreen_overlay .lyx-lb-image{max-height:60vh}
    .lyx-lb-fullscreen_overlay .lyx-lb-title{font-size:13px}
}

[hidden]{display:none !important}

/* ── Password-protected gallery ─────────────────────────── */
.lyx-locked{padding:72px 24px 96px;background:#0a0a0a}
.lyx-locked-inner{max-width:520px;margin:0 auto;text-align:center}
.lyx-locked-text{font-size:15px;color:rgba(255,255,255,.7);line-height:1.7;margin:0 0 24px}
body.lyx-gallery-body .lyx-locked form.post-password-form p{margin:0 0 14px;color:rgba(255,255,255,.7);font-size:14px}
body.lyx-gallery-body .lyx-locked form.post-password-form p:first-child{display:none} /* WP's own English sentence — we show ours */
body.lyx-gallery-body .lyx-locked input[type="password"]{
    width:100%;max-width:320px;padding:12px 16px;margin-top:6px;
    background:#141414;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:40px;
    font-family:'Poppins',sans-serif;font-size:14px;
}
body.lyx-gallery-body .lyx-locked input[type="submit"]{
    -webkit-appearance:none;appearance:none;margin-top:12px;
    padding:11px 28px;border-radius:40px;border:1px solid #c8a96e;
    background:#c8a96e;color:#0a0a0a;font-family:'Poppins',sans-serif;
    font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;
}

/* ── Hero byline: author + publish date (1.6.1) ───────── */
.lyx-hero-byline{
    display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;
    margin:-6px 0 24px;
    font-family:'Poppins',sans-serif;font-size:13px;line-height:1.5;
    color:rgba(255,255,255,.65);
}
body.lyx-gallery-body .lyx-hero-byline .lyx-byline-author{color:#fff;font-weight:500}
body.lyx-gallery-body .lyx-hero-byline a.lyx-byline-author{
    text-decoration:none;
    border-bottom:1px solid rgba(200,169,110,.5);
    transition:color .2s,border-color .2s;
}
body.lyx-gallery-body .lyx-hero-byline a.lyx-byline-author:hover{color:#c8a96e;border-color:#c8a96e}
.lyx-byline-sep{color:#c8a96e}

/* ── Hero excerpt, layout G3 (1.8.0) ─────────────────────
   Title → byline → short gold dash → excerpt → share buttons → scroll cue */
body.lyx-gallery-body .lyx-hero-deck{
    font-size:16px;line-height:1.75;
    color:rgba(255,255,255,.75);
    margin:0 0 28px;max-width:460px;
}
body.lyx-gallery-body .lyx-hero-deck::before{
    content:"";display:block;
    width:40px;height:2px;background:#c8a96e;
    margin:4px 0 20px;
}
@media(max-width:600px){
    body.lyx-gallery-body .lyx-hero-deck{font-size:15px;margin-bottom:24px}
}