/* ==========================================================================
   DHARMIKAM — PLAN YOUR VISIT
   The invitation band that follows the film, and the popup it opens.

   Self-contained: this sheet adds the .plan-visit and .pv-* namespaces and
   nothing else, so it can load last without touching an existing rule. It
   reuses the site's tokens, its decorative primitives (.blob) and its
   buttons; the popup itself is built from css/form-kit.css.

   Layer order inside the band:
      0  .blob                soft colour fields
      1  .plan-visit__inner   the copy and the call to action
   ========================================================================== */

/* ==========================================================================
   1. THE INVITATION BAND
   ========================================================================== */
.plan-visit{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(64px,8vw,1px) 0 clamp(44px,5vw,78px);
  text-align:center;
  /* settles into the sand the services band opens with, so the two read as
     one continuous field of colour rather than two bands meeting */
  background:linear-gradient(180deg,#FBF7EF 0%,#F7EEDC 52%,#F9DFA9 100%);
}

.plan-visit .blob--plan-a{
  width:min(46vw,540px);aspect-ratio:1;top:-24%;left:-12%;
  background:radial-gradient(circle,rgba(45,106,79,.26),transparent 68%);
  opacity:.5;
}
.plan-visit .blob--plan-b{
  width:min(40vw,480px);aspect-ratio:1;bottom:-28%;right:-10%;
  background:radial-gradient(circle,rgba(226,200,138,.42),transparent 68%);
  opacity:.55;
}

.plan-visit__inner{
  position:relative;z-index:1;
  max-width:720px;margin-inline:auto;
}

.plan-visit__title{
  margin:0 0 .55rem;
  color:var(--ink);
}
.plan-visit__lead{
  margin:0 auto clamp(1.7rem,2.8vw,2.3rem);
  max-width:46ch;
  color:var(--body);
}

/* The button keeps the site's own .btn-ayur; the halo behind it is the only
   addition, so the call to action carries a little more weight than the rest
   of the band without breaking the shared button language. */
.plan-visit__cta{
  position:relative;display:inline-flex;
}
.plan-visit__cta::before{
  content:"";position:absolute;z-index:-1;
  top:50%;left:50%;width:210%;aspect-ratio:1;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(192,153,63,.3),transparent 66%);
  animation:pulseGlow 9s ease-in-out infinite;
  pointer-events:none;
}

/* ==========================================================================
   2. ITS SHEET
   Everything the popup is made of — the surface, the fields, the validation,
   the answer — comes from css/form-kit.css. Only its width is its own.
   ========================================================================== */
.pv-modal .modal-dialog{max-width:min(760px,94vw)}

/* ==========================================================================
   3. RESPONSIVE
   ========================================================================== */
@media (max-width:767.98px){
  .plan-visit{padding:clamp(52px,11vw,80px) 0 clamp(36px,8vw,58px)}
  .plan-visit__cta,
  .plan-visit__cta .btn-ayur{width:100%}
}

@media (max-width:575.98px){
  .plan-visit .blob--plan-a,
  .plan-visit .blob--plan-b{opacity:.4}
}

/* ==========================================================================
   4. PRINT
   ========================================================================== */
@media print{
  .plan-visit{background:#fff;padding:1.5rem 0}
  .plan-visit__cta{display:none}
}