/* ═══════════════════════════════════════════════════════
   LAVISHA & DIGVIJAY — SHARED DESIGN SYSTEM
   All pages import this file
═══════════════════════════════════════════════════════ */

/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Cinzel:wght@400;500;600&family=Jost:wght@200;300;400;500&display=swap');

/* ================================================================
   iOS SAFARI / MOBILE FLICKER FIXES
   Applied globally to all pages
================================================================ */

/* Fix 1: iOS 100vh bug — use dvh (dynamic viewport height) with
   100vh fallback. Prevents repaint when Safari address bar shows/hides. */
:root {
  --vh: 1vh; /* Updated by JS on mobile */
}

/* Fix 2: Promote animated elements to their own GPU layer.
   This prevents iOS from dropping/recreating layers during animation
   which causes the white/black flash between frames. */
.will-animate {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-perspective: 1000px;
  perspective: 1000px;
}

/* Fix 3: Prevent tap highlight flash on all interactive elements */
* {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}

/* Fix 4: Prevent iOS rubber-band scroll on fixed overlays */
.fixed-overlay {
  position: fixed;
  overflow: hidden;
  -webkit-overflow-scrolling: auto;
  touch-action: none;
}


/* ── Variables ── */
:root {
  --gold:      #BF9B5F;
  --gold-l:    #D4B483;
  --gold-p:    #EDD9A3;
  --gold-glow: rgba(191,155,95,.35);
  --rose:      #B5606F;
  --rose-s:    #D4909D;
  --rose-p:    #F0D0D5;
  --cream:     #FBF5EA;
  --cream2:    #F4ECD8;
  --paper:     #FEFAF2;
  --dark:      #17100A;
  --dark2:     #261A10;
  --dark3:     #1E1509;
  --ink:       #2C1F14;
  --ink2:      #52392A;
  --ink3:      #8C6E57;
  --shadow:    rgba(23,16,10,.2);
  --transition: all .3s cubic-bezier(.4,0,.2,1);
}

/* ── Reset ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body {
  background: var(--dark);
  font-family: 'Jost', sans-serif;
  color: var(--cream);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ── Paper grain overlay ── */
body::after {
  content:''; position:fixed; inset:0;
  pointer-events:none; z-index:9990; opacity:.45;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}

/* ── Petals ── */
.petals-wrap { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.petal {
  position:absolute; border-radius:50% 50% 50% 0;
  animation: pFall linear infinite;
  will-change: transform, opacity;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
@keyframes pFall {
  0%   { transform:translate3d(0,-30px,0) rotate(0deg); opacity:0; }
  8%   { opacity:1; }
  92%  { opacity:.5; }
  100% { transform:translate3d(70px,105vh,0) rotate(800deg); opacity:0; }
}

/* ── Section header ── */
.sec-hd { text-align:center; margin-bottom:3rem; }
.sec-eye {
  font-family:'Cinzel',serif; font-size:.62rem;
  letter-spacing:.45em; color:var(--rose-s);
  text-transform:uppercase; margin-bottom:.8rem;
  display:block;
}
.sec-eye.gold { color:var(--gold-l); }
.sec-ttl {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-weight:300; font-size:clamp(2rem,5vw,3.2rem);
  line-height:1.1;
}
.sec-ttl.light { color:var(--cream); }
.sec-ttl.dark  { color:var(--ink); }
.sec-rule {
  display:flex; align-items:center; gap:10px;
  margin:.9rem auto 0; width:fit-content;
}
.sr-line   { width:45px; height:1px; background:var(--gold); }
.sr-diamond { width:7px; height:7px; background:var(--gold); transform:rotate(45deg); flex-shrink:0; }

/* ── Nav bar ── */
.site-nav {
  position:fixed; top:0; left:0; right:0; z-index:999;
  padding:.9rem 2rem;
  display:flex; align-items:center; justify-content:space-between;
  background:rgba(23,16,10,.85);
  backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(191,155,95,.12);
  transition:var(--transition);
}
.nav-logo {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:1.3rem; color:var(--gold); letter-spacing:.05em;
  text-decoration:none;
}
.nav-links { display:flex; gap:2rem; list-style:none; }
.nav-links a {
  font-family:'Cinzel',serif; font-size:.58rem;
  letter-spacing:.25em; color:rgba(237,217,163,.55);
  text-decoration:none; text-transform:uppercase;
  transition:color .2s;
}
.nav-links a:hover,
.nav-links a.active { color:var(--gold); }
.nav-links a.active {
  border-bottom:1px solid var(--gold);
  padding-bottom:2px;
}

/* ── Scroll reveal ── */
.rv {
  opacity:0; transform:translateY(24px);
  transition:opacity .75s ease, transform .75s ease;
}
.rv.in { opacity:1; transform:none; }
.rv.delay-1 { transition-delay:.1s; }
.rv.delay-2 { transition-delay:.2s; }
.rv.delay-3 { transition-delay:.35s; }

/* ── Footer ── */
.site-foot {
  background:var(--dark); text-align:center;
  padding:3.5rem 2rem;
  border-top:1px solid rgba(191,155,95,.1);
  position:relative;
}
.site-foot::before {
  content:''; position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:200px; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.foot-names {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:clamp(1.4rem,3.5vw,2rem); color:var(--gold);
}
.foot-sub {
  font-family:'Cinzel',serif; font-size:.55rem;
  letter-spacing:.38em; color:rgba(237,217,163,.25);
  margin-top:.6rem; text-transform:uppercase;
}
.foot-nav {
  display:flex; justify-content:center; gap:2rem;
  margin-top:1.2rem; list-style:none;
}
.foot-nav a {
  font-family:'Cinzel',serif; font-size:.55rem;
  letter-spacing:.2em; color:rgba(191,155,95,.4);
  text-decoration:none; text-transform:uppercase;
  transition:color .2s;
}
.foot-nav a:hover { color:var(--gold); }
.foot-hearts {
  margin-top:1rem; font-size:1rem;
  color:var(--rose); letter-spacing:.45rem;
  animation:hb 2.5s ease-in-out infinite;
}
@keyframes hb { 0%,100%{transform:scale(1);} 50%{transform:scale(1.18);} }

/* ── Toast ── */
.toast {
  position:fixed; bottom:2rem; left:50%;
  transform:translateX(-50%) translateY(80px);
  background:var(--dark2); border:1px solid var(--gold);
  border-radius:25px; padding:.65rem 2rem;
  z-index:9995;
  font-family:'Jost',sans-serif; font-size:.72rem;
  letter-spacing:.1em; color:var(--gold-p);
  transition:transform .4s cubic-bezier(.34,1.56,.64,1);
  white-space:nowrap; pointer-events:none;
}
.toast.show { transform:translateX(-50%) translateY(0); }

/* ── Button ── */
.btn-gold {
  display:inline-block; padding:.7rem 2.2rem;
  background:linear-gradient(135deg,var(--gold),var(--rose));
  color:white; border:none; border-radius:30px; cursor:pointer;
  font-family:'Cinzel',serif; font-size:.65rem;
  letter-spacing:.2em; text-transform:uppercase;
  text-decoration:none;
  transition:transform .25s, box-shadow .25s;
}
.btn-gold:hover {
  transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(191,155,95,.38);
}
.btn-outline {
  display:inline-block; padding:.65rem 2rem;
  border:1px solid rgba(191,155,95,.35);
  background:transparent;
  color:var(--gold-l); border-radius:30px; cursor:pointer;
  font-family:'Cinzel',serif; font-size:.62rem;
  letter-spacing:.2em; text-transform:uppercase;
  text-decoration:none;
  transition:var(--transition);
}
.btn-outline:hover {
  border-color:var(--gold);
  background:rgba(191,155,95,.08);
}

/* ── Divider ornament ── */
.ornament-row {
  display:flex; align-items:center; gap:14px;
  margin:1.5rem auto; width:fit-content;
}
.ornament-row::before, .ornament-row::after {
  content:''; flex:1; height:1px; width:60px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

/* ── Animations ── */
@keyframes fadeUp   { from{opacity:0;transform:translate3d(0,28px,0);} to{opacity:1;transform:translate3d(0,0,0);} }
@keyframes fadeIn   { from{opacity:0;} to{opacity:1;} }
@keyframes spin     { to{transform:rotate3d(0,0,1,360deg);} }
@keyframes spinSlow { to{transform:rotate3d(0,0,1,360deg);} }
@keyframes unlkBloom {
  0%  {opacity:1;transform:scale(1);}
  55% {opacity:1;transform:scale(1.07);}
  100%{opacity:0;transform:scale(1.13);pointer-events:none;}
}
@keyframes glow {
  0%,100%{text-shadow:0 0 40px rgba(191,155,95,.4);}
  50%    {text-shadow:0 0 70px rgba(191,155,95,.78),0 0 140px rgba(191,155,95,.25);}
}
/* spinSlow utility class */
.anim-spin-slow { animation:spinSlow 45s linear infinite; }
.anim-spin      { animation:spin 1s linear infinite; }

/* ── Utility ── */
.text-gold  { color:var(--gold); }
.text-rose  { color:var(--rose-s); }
.text-cream { color:var(--cream); }
.text-ink   { color:var(--ink); }
.italic     { font-style:italic; }
.cinzel     { font-family:'Cinzel',serif; }
.cormorant  { font-family:'Cormorant Garamond',serif; }
.jost       { font-family:'Jost',sans-serif; }
.center     { text-align:center; }
.mt1        { margin-top:1rem; }
.mt2        { margin-top:2rem; }
.mb1        { margin-bottom:1rem; }

/* ================================================================
   MOBILE NAV FLICKER FIX
================================================================ */
.site-nav {
  /* Force own compositing layer — prevents nav from flickering
     when iOS repaints the page during scroll */
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  will-change: transform;
}

/* Reduce animation load on mobile */
@media (max-width: 768px) {
  /* Disable continuous animations that cause repaints */
  .lk-mandala     { animation: none !important; opacity: .05; }
  .hero-rings svg { display: none; }
  .hs-ln          { animation: none !important; }
  .fd-heart       { animation: none !important; }
  .foot-hearts    { animation: none !important; }

  /* Keep entrance animations but remove infinite ones */
  .hb, @keyframes hb { animation: none; }
}

/* iOS safe area padding (notch/home indicator) */
@supports (padding: max(0px)) {
  .site-nav {
    padding-left:  max(2rem, env(safe-area-inset-left));
    padding-right: max(2rem, env(safe-area-inset-right));
  }
  .site-foot {
    padding-bottom: max(3.5rem, calc(3.5rem + env(safe-area-inset-bottom)));
  }
}