/* ═══════════════════════════════════════════
   Kabir Singha Photography — main.css
═══════════════════════════════════════════ */

/* ── Page Loader ──────────────────────────── */
.page-loader {
    position: fixed; inset: 0; z-index: 99999;
    background: #0d0d0d;
    display: flex; align-items: center; justify-content: center;
    transition: opacity .55s ease, visibility .55s ease;
    opacity: 1; visibility: visible;
}
.page-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-text {
    font-family: 'Josefin Sans', sans-serif;
    font-weight: 100;
    font-size: clamp(18px, 3.5vw, 42px);
    color: #f5f0eb;
    letter-spacing: .45em;
    text-transform: uppercase;
    animation: loaderPulse 1.5s ease-in-out infinite;
}
@keyframes loaderPulse { 0%,100%{opacity:.2} 50%{opacity:1} }
@keyframes fadeUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }

/* ── Scroll Reveal ────────────────────────── */
.reveal, .reveal-left, .reveal-right {
    opacity: 0; transition: opacity .8s ease, transform .8s ease;
}
.reveal       { transform: translateY(44px); }
.reveal-left  { transform: translateX(-44px); }
.reveal-right { transform: translateX(44px); }
.reveal.visible, .reveal-left.visible, .reveal-right.visible { opacity: 1; transform: none; }
.stagger-1{transition-delay:.05s} .stagger-2{transition-delay:.12s} .stagger-3{transition-delay:.19s}
.stagger-4{transition-delay:.26s} .stagger-5{transition-delay:.33s} .stagger-6{transition-delay:.40s}

/* ── Image zoom on hover ──────────────────── */
.img-zoom { overflow: hidden; }
.img-zoom img { width:100%; height:100%; object-fit:cover; transition:transform .65s cubic-bezier(.25,.46,.45,.94); }
.img-zoom:hover img { transform: scale(1.06); }

/* ── Image overlay (fade up from bottom) ─── */
.img-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(13,13,13,.85) 0%, rgba(13,13,13,.12) 55%, transparent 100%);
    opacity: 0; transition: opacity .45s ease;
}
.group:hover .img-overlay { opacity: 1; }

/* ── Section label ────────────────────────── */
.section-label {
    font-family: 'Jost', sans-serif; font-size: 10px;
    letter-spacing: .3em; text-transform: uppercase; color: #c9a96e;
}

/* ── Luxury outline button ────────────────── */
.btn-luxury {
    font-family: 'Jost', sans-serif; font-size: 11px;
    letter-spacing: .2em; text-transform: uppercase;
    display: inline-flex; align-items: center; gap: 12px;
    border: 1px solid rgba(201,169,110,.45); color: #c9a96e;
    padding: 13px 30px; position: relative; overflow: hidden;
    transition: color .35s ease, border-color .35s ease;
    isolation: isolate;
}
.btn-luxury::before {
    content: ''; position: absolute; inset: 0; left: -100%;
    background: #c9a96e; z-index: -1;
    transition: left .38s cubic-bezier(.25,.46,.45,.94);
}
.btn-luxury:hover::before { left: 0; }
.btn-luxury:hover { color: #0d0d0d; border-color: #c9a96e; }
.btn-luxury .arrow { transition: transform .3s ease; }
.btn-luxury:hover .arrow { transform: translateX(5px); }

/* ── Solid fill button ────────────────────── */
.btn-solid {
    font-family: 'Jost', sans-serif; font-size: 11px;
    letter-spacing: .2em; text-transform: uppercase;
    display: inline-flex; align-items: center; gap: 10px;
    background: #c9a96e; color: #0d0d0d;
    padding: 13px 30px; transition: background .3s ease;
}
.btn-solid:hover { background: #e8c88a; }

/* ── Form inputs (front-end) ──────────────── */
.luxury-input {
    width: 100%; background: transparent; border: none;
    border-bottom: 1px solid rgba(201,169,110,.3);
    padding: 11px 0;
    font-family: 'Cormorant Garamond', serif; font-size: 18px;
    color: #f5f0eb; outline: none; transition: border-color .3s;
}
.luxury-input::placeholder { color: rgba(245,240,235,.28); font-style: italic; }
.luxury-input:focus { border-bottom-color: #c9a96e; }
.luxury-label {
    font-family: 'Jost', sans-serif; font-size: 9px;
    letter-spacing: .25em; text-transform: uppercase;
    color: rgba(245,240,235,.38); display: block; margin-bottom: 6px;
}
select.luxury-input option { background: #1a1a1a; }

/* ── Filter buttons (portfolio) ───────────── */
.filter-btn {
    font-family: 'Jost', sans-serif; font-size: 10px;
    letter-spacing: .2em; text-transform: uppercase;
    padding: 8px 20px; color: rgba(245,240,235,.4);
    border: 1px solid rgba(201,169,110,.15); transition: all .3s; white-space: nowrap;
}
.filter-btn:hover, .filter-btn.active { background: #c9a96e; color: #0d0d0d; border-color: #c9a96e; }

/* ── Blog prose ───────────────────────────── */
.prose-luxury p  { margin-bottom: 1.6rem; font-size: 1.15rem; line-height: 1.9; color: rgba(245,240,235,.7); }
.prose-luxury h2 { font-family:'Playfair Display',serif; font-size: 1.9rem; color: #f5f0eb; margin: 2.5rem 0 1rem; }
.prose-luxury h3 { font-family:'Playfair Display',serif; font-size: 1.35rem; color: #c9a96e; margin: 2rem 0 .8rem; }
.prose-luxury strong { color: #f5f0eb; }
.prose-luxury em     { color: #c9a96e; }
.prose-luxury blockquote { border-left: 2px solid #c9a96e; padding-left: 2rem; margin: 2rem 0; font-style: italic; color: rgba(245,240,235,.45); font-size: 1.25rem; }
.prose-luxury a  { color: #c9a96e; text-decoration: underline; }
.prose-luxury ul { list-style: none; padding: 0; }
.prose-luxury ul li::before { content: '✦ '; color: #c9a96e; }

/* ── Swiper pagination ────────────────────── */
.swiper-pagination-bullet { background: rgba(201,169,110,.3); width: 6px; height: 6px; opacity: 1; }
.swiper-pagination-bullet-active { background: #c9a96e; width: 22px; border-radius: 3px; }

/* ── Mobile tweaks ────────────────────────── */
@media (max-width: 768px) {
    .btn-luxury, .btn-solid { padding: 11px 22px; font-size: 10px; }
}

/* ── Image Protection ─────────────────────────── */
img {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}
/* Block right-click save via overlay approach — JS handles contextmenu */
/* pointer-events kept on so hover effects still work */