/* =====================================================================
   "Sanskriti" layer — colours, lettering and motion drawn from the
   Royal Rajput Sangthan sun emblem: bhagwa/saffron, surya-gold,
   sindoor red, laurel green; Devanagari display type; marigold toran.
   Loaded after app.css.
   ===================================================================== */

/* ---------------------------------------------------------------- type */
h1, h2, .h1, .h2, .display-font, .section-title, .page-hero h1, .hero h1 {
  font-family: var(--rrs-font-display);
  font-weight: 400;
  letter-spacing: .005em;
}
h3, .h3 { font-family: var(--rrs-font-display); font-weight: 400; }
.section-kicker, .hero-kicker, .brand-text .hi, .deco-font, .motto {
  font-family: var(--rrs-font-deco);
  letter-spacing: .04em;
  text-transform: none;
}
.section-kicker {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: 1.05rem; color: var(--rrs-saffron); font-weight: 400;
}
.section-kicker::before, .section-kicker::after {
  content: ""; width: 26px; height: 10px; flex-shrink: 0;
  background: radial-gradient(circle at 50% 50%, var(--rrs-gold) 0 3px, transparent 3.5px),
              linear-gradient(90deg, transparent, var(--rrs-gold) 40%, var(--rrs-gold) 60%, transparent) center / 100% 1.5px no-repeat;
}
.section-head.center .section-kicker { justify-content: center; }
.section-title { color: var(--rrs-maroon-700); font-size: clamp(1.7rem, 3.2vw, 2.5rem); }
.brand-text .hi { font-size: 1.45rem; color: var(--rrs-maroon); line-height: 1; }
.brand-text .en { color: var(--rrs-saffron); letter-spacing: .22em; }
.motto { color: var(--rrs-gold-300); font-size: clamp(1.05rem, 2vw, 1.35rem); }
.text-maroon { color: var(--rrs-maroon) !important; }
.text-gold { color: var(--rrs-gold-600) !important; }

/* ---------------------------------------------------------------- gradient text & buttons */
.text-sun {
  background: var(--rrs-sun-grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.btn-primary, .btn-maroon {
  --bs-btn-bg: var(--rrs-maroon); --bs-btn-border-color: transparent;
  background-image: var(--rrs-royal-grad);
  position: relative; overflow: hidden; isolation: isolate;
  box-shadow: 0 6px 18px -8px rgba(155, 20, 24, .7);
}
.btn-gold {
  background-image: var(--rrs-sun-grad); border: 0; color: #3a0707;
  position: relative; overflow: hidden; isolation: isolate;
  box-shadow: 0 6px 18px -8px rgba(224, 142, 0, .8);
}
.btn-kesar {
  background-image: var(--rrs-kesar-grad); color: #fff; border: 0; position: relative; overflow: hidden; isolation: isolate;
  box-shadow: 0 6px 18px -8px rgba(240, 123, 16, .8);
}
.btn-kesar:hover { color: #fff; }
.btn-primary::after, .btn-gold::after, .btn-kesar::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .45) 50%, transparent 70%);
  transform: translateX(-120%); transition: transform .7s ease;
}
.btn-primary:hover::after, .btn-gold:hover::after, .btn-kesar:hover::after { transform: translateX(120%); }
.btn-primary:hover, .btn-gold:hover { transform: translateY(-1px); }
.btn { transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease; }

/* ---------------------------------------------------------------- toran (marigold garland) */
.toran {
  height: 18px; position: relative; pointer-events: none;
  background:
    radial-gradient(circle at 10px 4px, #ff9d00 0 5px, transparent 5.5px) 0 0 / 20px 10px repeat-x,
    radial-gradient(circle at 10px 5px, #ffd447 0 4px, transparent 4.5px) 10px 0 / 20px 10px repeat-x;
}
.toran::after {   /* mango-leaf bunting */
  content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 10px;
  background: linear-gradient(135deg, var(--rrs-laurel) 25%, transparent 25%) 0 0 / 28px 10px repeat-x,
              linear-gradient(225deg, var(--rrs-laurel) 25%, transparent 25%) 0 0 / 28px 10px repeat-x;
  opacity: .85;
}
.site-header { border-bottom: 0; }
.site-header .toran { margin-bottom: -2px; }
.topbar { background: var(--rrs-royal-grad); }

/* ---------------------------------------------------------------- mandala backdrop */
.pattern-bg { position: relative; overflow: hidden; background-color: var(--rrs-maroon-900); background-image: var(--rrs-royal-grad); }
.pattern-bg > *:not(.hero-art) { position: relative; z-index: 1; }
.pattern-bg::before {
  content: ""; position: absolute; width: 760px; height: 760px; right: -220px; top: 50%; margin-top: -380px; z-index: 0;
  background: url("../img/mandala.svg") center / contain no-repeat; opacity: .14;
  animation: rrs-spin 160s linear infinite;
}
.pattern-bg:not(.hero-slide)::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: radial-gradient(ellipse at 15% 0%, rgba(255, 157, 0, .22), transparent 55%), radial-gradient(ellipse at 100% 100%, rgba(242, 183, 5, .14), transparent 50%);
}
.page-hero::before { width: 520px; height: 520px; margin-top: -260px; right: -140px; }
.site-footer.pattern-bg::before { left: -260px; right: auto; }

@keyframes rrs-spin { to { transform: rotate(360deg); } }

/* ---------------------------------------------------------------- hero */
.hero .hero-slide::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(100deg, rgba(58, 7, 7, .95) 0%, rgba(122, 15, 18, .82) 42%, rgba(240, 123, 16, .28) 100%); }
.hero h1 { font-size: clamp(2.2rem, 4.8vw, 4rem); line-height: 1.12; }
.hero h1 .gold, .hero .hl { background: var(--rrs-sun-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-kicker { font-family: var(--rrs-font-deco); font-size: 1rem; letter-spacing: .05em; border-color: rgba(255, 212, 71, .6); color: #ffe08a; background: rgba(0, 0, 0, .18); }
.hero-emblem { position: relative; width: min(420px, 34vw); aspect-ratio: 1; margin-left: auto; display: grid; place-items: center; }
.hero-emblem::before {   /* rotating sun-rays halo */
  content: ""; position: absolute; inset: -14%;
  background: repeating-conic-gradient(from 0deg, rgba(255, 212, 71, .55) 0deg 4deg, transparent 4deg 15deg);
  -webkit-mask: radial-gradient(circle, transparent 46%, #000 47%, #000 64%, transparent 70%);
          mask: radial-gradient(circle, transparent 46%, #000 47%, #000 64%, transparent 70%);
  animation: rrs-spin 60s linear infinite;
}
.hero-emblem::after {   /* soft glow */
  content: ""; position: absolute; inset: 6%; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 212, 71, .45), rgba(255, 138, 0, .12) 55%, transparent 70%);
  animation: rrs-glow 4s ease-in-out infinite;
}
.hero-emblem img { position: relative; z-index: 1; width: 82%; height: auto; filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .45)); animation: rrs-float 6s ease-in-out infinite; }
@keyframes rrs-glow { 50% { opacity: .55; transform: scale(1.05); } }
@keyframes rrs-float { 50% { transform: translateY(-10px); } }
.carousel-item.active .hero-slide .anim-up { animation: rrs-up .9s cubic-bezier(.2, .7, .2, 1) both; }
.carousel-item.active .hero-slide .anim-up.d1 { animation-delay: .12s; }
.carousel-item.active .hero-slide .anim-up.d2 { animation-delay: .24s; }
.carousel-item.active .hero-slide .anim-up.d3 { animation-delay: .36s; }
@keyframes rrs-up { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }

.hero .hero-slide .container { position: relative; z-index: 2; }
.hero .hero-slide::before { z-index: 1; opacity: .1; }

/* ---------------------------------------------------------------- ornament divider (diya) */
.ornament { color: var(--rrs-saffron); }
.ornament svg { width: 22px; height: 22px; filter: drop-shadow(0 0 6px rgba(255, 138, 0, .55)); animation: rrs-flicker 2.4s ease-in-out infinite; }
.ornament::before, .ornament::after { background: linear-gradient(90deg, transparent, var(--rrs-gold)); height: 2px; width: 70px; }
@keyframes rrs-flicker { 0%, 100% { transform: scale(1); opacity: 1; } 45% { transform: scale(1.12) rotate(-3deg); opacity: .85; } 70% { transform: scale(.96) rotate(2deg); } }

/* ---------------------------------------------------------------- cards & tiles */
.card { border-color: #f3e2c2; }
.card-hover:hover { border-color: var(--rrs-gold); box-shadow: 0 14px 34px -14px rgba(155, 20, 24, .35), 0 0 0 3px rgba(242, 183, 5, .14); }
.cat-tile .icon { background: var(--rrs-gold-100); color: var(--rrs-maroon); border: 1px solid #f7dc8a; }
.cat-tile:hover .icon { background: var(--rrs-kesar-grad); color: #fff; transform: rotate(-6deg) scale(1.06); }
.cat-tile .icon { transition: transform .25s ease, background .25s ease; }
.badge-cat { background: #fff1d6; color: var(--rrs-maroon-700); }
.badge-soft { background: rgba(255, 243, 207, .95); color: var(--rrs-maroon-700); }
.mp-card::before { background: var(--rrs-royal-grad); }
.mp-card .portrait { border-color: var(--rrs-gold); box-shadow: 0 0 0 6px rgba(242, 183, 5, .18), var(--rrs-shadow); }
.mp-card .title { color: var(--rrs-saffron); font-family: var(--rrs-font-deco); text-transform: none; letter-spacing: .04em; font-size: .95rem; }
.heritage-tile::after { background: linear-gradient(180deg, transparent 25%, rgba(58, 7, 7, .95) 100%); }
.heritage-tile .caption small { color: var(--rrs-gold-300); font-family: var(--rrs-font-deco); text-transform: none; letter-spacing: .04em; font-size: .9rem; }
.heritage-tile .caption h3 { font-size: 1.45rem; }
.event-date .m { background: var(--rrs-kesar-grad); }
.stat .num { background: var(--rrs-sun-grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-family: var(--rrs-font-display); }
.stats-band { box-shadow: 0 20px 40px -20px rgba(58, 7, 7, .6); }
.discover-card { border-top: 4px solid var(--rrs-gold); }
.discover-tabs button.active { background: var(--rrs-royal-grad); border-color: transparent; }
.quick-needs a { background: #fff1d6; border: 1px solid #f7dc8a; }
.quick-needs a:hover { background: var(--rrs-sun-grad); color: #3a0707; }
.ticker { background: linear-gradient(90deg, #fff3cf, #ffe7b8); }
.ticker .label { background: var(--rrs-kesar-grad); font-family: var(--rrs-font-deco); text-transform: none; letter-spacing: .03em; font-size: .95rem; }
.timeline::before { background: linear-gradient(var(--rrs-gold), var(--rrs-saffron), var(--rrs-maroon)); }
.timeline-item::before { border-color: var(--rrs-saffron); }
.vnode.t-vansh, .vnode.t-dynasty { background: var(--rrs-royal-grad); }
.vnode.t-branch { background: #fff1d6; border-color: var(--rrs-gold); }
.vnode .vtoggle { background: var(--rrs-saffron); }
.family-card .pid { font-family: var(--rrs-font-display); }
.bottom-nav .fab span.ic { background: var(--rrs-kesar-grad); color: #fff; }
.bottom-nav a.active { color: var(--rrs-saffron); }
.bottom-nav a.active::before { background: var(--rrs-saffron); }
.site-header .nav-link:hover, .site-header .nav-link.active { background: #fff1d6; color: var(--rrs-maroon); }
.site-header .dropdown-item .bi { color: var(--rrs-saffron); }
.account-nav .list-group-item.active { background: var(--rrs-royal-grad); }
.account-nav .list-group-item .bi { color: var(--rrs-saffron); }
.privacy-note { background: #fff3cf; border-color: var(--rrs-gold); }
.page-hero h1 { font-size: clamp(1.9rem, 3.8vw, 3rem); }
.page-hero .section-kicker { color: var(--rrs-gold-300) !important; }

/* ---------------------------------------------------------------- footer */
.site-footer h5 { font-family: var(--rrs-font-deco); text-transform: none; letter-spacing: .03em; font-size: 1.15rem; color: var(--rrs-gold-300); font-weight: 400; }
.site-footer .footer-motto { font-family: var(--rrs-font-deco); color: var(--rrs-gold-300); font-size: 1.2rem; }
.social-links a:hover { background: var(--rrs-sun-grad); }

/* ---------------------------------------------------------------- scroll reveal */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--d, 0s); }
.reveal.in { opacity: 1; transform: none; }
.reveal-zoom { opacity: 0; transform: scale(.94); transition: opacity .7s ease, transform .7s ease; transition-delay: var(--d, 0s); }
.reveal-zoom.in { opacity: 1; transform: none; }
body { animation: rrs-fade .5s ease both; }
@keyframes rrs-fade { from { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal, .reveal-zoom { opacity: 1; transform: none; }
}
@media (max-width: 991.98px) {
  .hero-emblem { display: none; }
  .pattern-bg::before { width: 420px; height: 420px; margin-top: -210px; right: -160px; }
  .brand-text .hi { font-size: 1.2rem; }
}

/* never show the light page background while hero slides cross-fade */
.hero .carousel-inner, .hero { background: var(--rrs-maroon-900); }
.hero .carousel-fade .carousel-item { transition-duration: .9s; }

/* ===== Floating WhatsApp / call ===== */
.float-contact { position: fixed; right: 18px; bottom: 22px; z-index: 1040; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.fc-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; height: 52px; min-width: 52px; border-radius: 999px; color: #fff; text-decoration: none; font-weight: 700; box-shadow: 0 10px 24px -8px rgba(51, 6, 12, .55); border: 2px solid rgba(255, 255, 255, .85); transition: transform .2s ease, box-shadow .2s ease; }
.fc-btn:hover, .fc-btn:focus-visible { color: #fff; transform: translateY(-3px) scale(1.04); box-shadow: 0 14px 30px -8px rgba(51, 6, 12, .6); }
.fc-btn .bi { font-size: 1.4rem; line-height: 1; }
.fc-wa { background: linear-gradient(135deg, #25d366, #128c7e); padding: 0 1.1rem 0 .95rem; position: relative; }
.fc-wa::before { content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid #25d366; animation: fc-ping 2.4s cubic-bezier(0, 0, .2, 1) infinite; pointer-events: none; }
.fc-call { width: 46px; height: 46px; min-width: 46px; background: var(--rrs-kesar-grad, linear-gradient(135deg, #f07b10, #9b1418)); }
.fc-call .bi { font-size: 1.1rem; }
.fc-label { font-size: .9rem; white-space: nowrap; }
@keyframes fc-ping { 0% { transform: scale(1); opacity: .8; } 80%, 100% { transform: scale(1.35); opacity: 0; } }
@media (max-width: 991.98px) {
  .float-contact { right: 12px; bottom: calc(var(--rrs-bottom-nav-h) + 14px + env(safe-area-inset-bottom)); }
  .fc-label { display: none; }
  .fc-wa { width: 52px; padding: 0; }
  body:has(.mobile-action-bar) .float-contact { display: none; }
}
@media (prefers-reduced-motion: reduce) { .fc-wa::before { animation: none; } }
@media print { .float-contact { display: none !important; } }

/* ===== Hero cross-fade: only the active slide's text is ever visible ===== */
.hero .carousel-item:not(.active) .anim-up,
.hero .carousel-item.active.carousel-item-start .anim-up,
.hero .carousel-item.active.carousel-item-end .anim-up { opacity: 0 !important; animation: none !important; transition: opacity .25s ease; }
/* Devanagari display headings need room for matras */
.hero h1, .hero .h1 { font-size: clamp(2rem, 4.2vw, 3.5rem) !important; line-height: 1.32 !important; text-shadow: 0 4px 18px rgba(0, 0, 0, .35); }
.hero .lead { font-size: clamp(1.02rem, 1.4vw, 1.2rem); max-width: 36rem; color: rgba(255, 246, 228, .92); }
h1, h2, h3, .h1, .h2, .h3, .section-title { line-height: 1.3; }
.section-kicker { font-size: 1.05rem; }
@media (max-width: 575.98px) {
  .hero h1, .hero .h1 { font-size: 1.85rem !important; }
  .hero .motto { font-size: .95rem; }
}

/* ===== Page hero with photograph ===== */
.page-hero.has-photo { padding: 4.5rem 0 3.5rem; }
.page-hero .page-hero-photo { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; transform: scale(1.04); animation: rrs-kenburns 22s ease-in-out infinite alternate; }
.page-hero .page-hero-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(48, 6, 6, .95) 0%, rgba(122, 15, 18, .82) 45%, rgba(122, 15, 18, .3) 100%); }
.page-hero.has-photo::before { opacity: .08; }
@keyframes rrs-kenburns { to { transform: scale(1.12) translateX(-1.5%); } }
@media (prefers-reduced-motion: reduce) { .page-hero .page-hero-photo { animation: none; } }

/* ===== Photo credits ===== */
.img-credit { font-size: .72rem; color: var(--rrs-muted); margin-top: .35rem; line-height: 1.4; }
.img-credit a { color: inherit; text-decoration: underline; text-decoration-color: rgba(0, 0, 0, .2); }
.img-credit .bi { color: var(--rrs-gold-600, #b8860b); }
.detail-cover img { width: 100%; max-height: 480px; object-fit: cover; border-radius: 18px; }

/* ===== Portrait paintings: keep faces in frame ===== */
.mp-card img, .mp-avatar, img.mp-photo { object-position: 50% 15%; }

/* ===== Dynasty cards ===== */
.vansh-card { position: relative; display: block; border-radius: 18px; overflow: hidden; aspect-ratio: 4 / 3; color: #fff; box-shadow: 0 14px 30px -18px rgba(51, 6, 12, .6); }
.vansh-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.vansh-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(40, 5, 5, .92)); }
.vansh-card .cap { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: .9rem 1rem; }
.vansh-card .cap .hi { font-family: var(--rrs-font-deco); color: var(--rrs-gold-300); font-size: .95rem; }
.vansh-card .cap h3 { color: #fff; font-size: 1.15rem; margin: 0; }
.vansh-card .cap small { color: rgba(255, 255, 255, .75); }
.vansh-card:hover img, .vansh-card:focus-visible img { transform: scale(1.07); }
.vansh-card:hover { color: #fff; }
.mp-portrait { width: 230px; max-width: 70vw; margin-inline: auto; }
.mp-portrait img { width: 100%; height: 290px; object-fit: cover; object-position: 50% 12%; border-radius: 20px 20px 110px 110px / 20px 20px 70px 70px; border: 5px solid var(--rrs-gold-300); box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .6), 0 0 0 10px rgba(242, 183, 5, .12); background: var(--rrs-gold-100); }
.mp-portrait .img-credit { color: rgba(255, 255, 255, .6); max-width: 230px; }
.pattern-bg .img-credit a { text-decoration-color: rgba(255, 255, 255, .3); }

/* ===== Business card cover band ===== */
.biz-card { overflow: hidden; }
.biz-card .biz-cover { height: 132px; overflow: hidden; position: relative; background: var(--rrs-sand); }
.biz-card .biz-cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.biz-card .biz-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(40, 5, 5, .35)); }
.biz-card:hover .biz-cover img { transform: scale(1.06); }
.biz-card.has-cover .biz-logo { margin-top: -42px; position: relative; z-index: 1; border: 3px solid #fff; box-shadow: 0 6px 16px -6px rgba(51, 6, 12, .45); }
.list-view .biz-card .biz-cover { display: none; }
.list-view .biz-card.has-cover .biz-logo { margin-top: 0; }

/* ===== Footer developer credit ===== */
.footer-dev { font-size: .85rem; color: rgba(255, 255, 255, .7); }
.footer-dev a { color: var(--rrs-gold-300); font-weight: 700; text-decoration: none; border-bottom: 1px dashed rgba(255, 212, 71, .5); }
.footer-dev a:hover { color: #fff; border-bottom-color: #fff; }
@media (max-width: 767.98px) { .footer-bottom { text-align: center; padding-bottom: 1rem; } }
