/* Home page only: the first-visit gate and the courtyard.
   These rules were carried over from the original home page. The brand palette they use is
   declared here so the rest of the site is untouched. */
#entrance,.court-stage{--night:#12090B;--night-2:#241014;--ember:#3B1A1A;--ivory:#F6EFDD;--parchment:#E7DAB8;--parchment-dark:#CBB57F;
  --temple-gold:#93712B;--turmeric:#DDA53E;--turmeric-bright:#F0C26A;--vermilion:#A62E33;--maroon-deep:#5A1620;--peacock:#2E6B66;
  --font-te:'Noto Serif Telugu',serif;--font-display:'Fraunces',Georgia,serif;--font-body:'EB Garamond',Georgia,serif}

/* ===== the courtyard ===== */
.court-stage{position:relative;border-radius:4px 4px 0 0;overflow:hidden}
.courtyard-image{height:clamp(300px,50vw,580px);overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;background:#BFDDE6;scrollbar-width:none}
.courtyard-image::-webkit-scrollbar{display:none}
.courtscene{display:block;width:100%;height:100%}
@media (max-aspect-ratio:4/3){
  .courtyard-image{height:clamp(300px,58svh,520px);touch-action:pan-x pan-y}
  .courtscene{width:auto;min-width:100%;aspect-ratio:16/9;max-width:none}
  .pan-hint{display:flex}
}
.pan-hint{display:none;position:absolute;bottom:14px;left:50%;transform:translateX(-50%);align-items:center;gap:.5rem;padding:.35rem .9rem;border-radius:99px;
  background:rgba(18,9,11,.6);backdrop-filter:blur(6px);color:#F6EFDD;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:.8rem;letter-spacing:.14em;
  pointer-events:none;z-index:2;transition:opacity .6s;white-space:nowrap}
.pan-hint.hide{opacity:0}
/* the three halls and the About chamber can be clicked; their names stay readable */
.courtscene .hoverlabel{opacity:.95;transform:none}
.courtscene .scene-node[data-chamber="about"] .hoverlabel{opacity:0;transform:translateY(6px)}
.courtscene .scene-node[data-chamber="about"]:hover .hoverlabel,.courtscene .scene-node[data-chamber="about"]:focus-visible .hoverlabel{opacity:1;transform:none}
.courtscene .scene-label-te{font-weight:400}
.courtscene .scene-node:focus-visible{outline:none}
.courtscene .scene-node:focus-visible .hoverlabel{opacity:1}

/* ===== the courtyard's living details: sun, clouds, ripples, birds, lamps, night ===== */
  .scene-node{cursor:pointer;}
  .hoverlabel{opacity:0;transform:translateY(6px);transition:opacity 0.35s ease, transform 0.35s ease;pointer-events:none;}
  .scene-node:hover .hoverlabel,.scene-node:focus-visible .hoverlabel{opacity:1;transform:translateY(0);}
  @media (hover:none){.hoverlabel{opacity:1;transform:none;}}
  .scene-label-te{font-family:var(--font-te);font-weight:600;fill:var(--maroon-deep);}
  .scene-label-en{font-family:var(--font-display);font-style:italic;fill:var(--peacock);}

  .sunrays{animation:spinrays 90s linear infinite;transform-box:fill-box;transform-origin:center;}
  @keyframes spinrays{to{transform:rotate(360deg);}}
  .cloud{animation:drift 70s ease-in-out infinite alternate;}
  .cloud.c2{animation-delay:14s;}.cloud.c3{animation-delay:32s;}
  @keyframes drift{to{transform:translateX(70px);}}
  .ripple{animation:ripple 4.5s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
  .ripple.r2{animation-delay:1.5s;}.ripple.r3{animation-delay:3s;}
  @keyframes ripple{0%{opacity:0.55;transform:scale(0.85);}70%{opacity:0;transform:scale(1.25);}100%{opacity:0;transform:scale(1.25);}}
  .jet{stroke-dasharray:5 9;animation:flow 1.5s linear infinite;}
  @keyframes flow{to{stroke-dashoffset:-56;}}
  .eyespot{animation:shimmer 3.4s ease-in-out infinite;}
  .eyespot.e2{animation-delay:0.8s;}.eyespot.e3{animation-delay:1.6s;}.eyespot.e4{animation-delay:2.4s;}
  @keyframes shimmer{0%,100%{opacity:0.5;}50%{opacity:1;}}
  .deerbody{transform-box:fill-box;transform-origin:50% 100%;}
  .deerbody.d1{animation:sway1 9s ease-in-out infinite;}
  .deerbody.d2{animation:sway2 7.5s ease-in-out infinite 0.8s;}
  .deerbody.d3{animation:sway1 8.4s ease-in-out infinite 1.9s;}
  .deerbody.d4{animation:sway2 9.2s ease-in-out infinite 0.3s;}
  @keyframes sway1{0%,100%{transform:translateX(0) rotate(0deg);}50%{transform:translateX(-3px) rotate(-1deg);}}
  @keyframes sway2{0%,100%{transform:translateX(0) rotate(0deg);}50%{transform:translateX(2.5px) rotate(0.8deg);}}
  .star{animation:twinkle 2.8s ease-in-out infinite;}
  .star.s2{animation-delay:0.9s;}.star.s3{animation-delay:1.7s;}.star.s4{animation-delay:2.3s;}
  @keyframes twinkle{0%,100%{opacity:0.25;}50%{opacity:1;}}
  .flock1{animation:fly1 36s linear infinite;}
  .flock2{animation:fly2 50s linear infinite;animation-delay:9s;}
  .flock3{animation:fly3 62s linear infinite;animation-delay:22s;}
  @keyframes fly1{0%{transform:translate(-180px,160px);}100%{transform:translate(1780px,110px);}}
  @keyframes fly2{0%{transform:translate(-180px,230px);}100%{transform:translate(1780px,190px);}}
  @keyframes fly3{0%{transform:translate(1780px,120px) scaleX(-1);}100%{transform:translate(-180px,180px) scaleX(-1);}}
  .wing{animation:flap 0.5s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:center bottom;}
  @keyframes flap{to{transform:scaleY(0.35);}}

  .nightshade{opacity:0;transition:opacity 1.4s ease;pointer-events:none;}
  .courtscene.night .nightshade{opacity:0.32;}
  .night-only{opacity:0;transition:opacity 1.4s ease;pointer-events:none;}
  .courtscene.night .night-only{opacity:1;}
  .day-only{opacity:1;transition:opacity 1.4s ease;}
  .courtscene.night .day-only{opacity:0;}
  .lampglow{opacity:0;transition:opacity 1.4s ease;}
  .courtscene.night .lampglow{opacity:0.9;}

  

/* ===== the first-visit gate (CSS only; plays once per visitor; can be skipped) ===== */
/* ===== act III+IV — the passage: gate, then the courtyard emerging from centre ===== */
    .stage{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(180deg,var(--night-2) 0%,var(--ember) 100%);}
  .approach-title{position:absolute;top:12vh;left:0;right:0;text-align:center;font-family:var(--font-display);
    font-style:italic;font-weight:300;font-size:clamp(1rem,2.4vw,1.35rem);letter-spacing:0.24em;color:var(--parchment-dark);z-index:5;}
  .doorlight{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;
    background:radial-gradient(ellipse 46% 60% at 50% 52%,var(--ivory) 0%,var(--turmeric-bright) 32%,rgba(221,165,62,0.25) 58%,transparent 75%);}
  .monument{display:flex;flex-direction:column;align-items:center;transform:scale(0.42);transform-origin:center 60%;
    will-change:transform;position:relative;z-index:4;}
  .spire{display:flex;flex-direction:column;align-items:center;margin-bottom:2px;}
  .spire-tier{height:17px;margin-bottom:2px;}
  .spire-tier.gold{background:linear-gradient(180deg,var(--turmeric),var(--temple-gold));}
  .spire-tier.deep{background:linear-gradient(180deg,var(--temple-gold),#4E3A16);}
  .spire-tier.t1{width:360px;clip-path:polygon(2% 100%,98% 100%,90% 0,10% 0);}
  .spire-tier.t2{width:296px;clip-path:polygon(2% 100%,98% 100%,89% 0,11% 0);}
  .spire-tier.t3{width:224px;clip-path:polygon(2% 100%,98% 100%,87% 0,13% 0);}
  .spire-tier.t4{width:150px;clip-path:polygon(2% 100%,98% 100%,85% 0,15% 0);}
  .spire-tier.t5{width:80px;clip-path:polygon(2% 100%,98% 100%,80% 0,20% 0);}
  .finial{width:14px;height:14px;background:var(--vermilion);transform:rotate(45deg);margin-bottom:8px;
    box-shadow:0 0 16px 4px rgba(166,46,51,0.55);}
  .lintel{width:412px;max-width:92vw;height:15px;background:var(--temple-gold);position:relative;}
  .lintel::before,.lintel::after{content:'';position:absolute;top:4.5px;width:6px;height:6px;border-radius:50%;background:var(--turmeric-bright);}
  .lintel::before{left:22px;}.lintel::after{right:22px;}
  .gframe{display:flex;align-items:stretch;}
  .pillar{width:22px;background:repeating-linear-gradient(90deg,rgba(255,255,255,0.14) 0 2px,transparent 2px 6px),
    linear-gradient(180deg,var(--turmeric),var(--temple-gold));}
  .doorway{width:368px;max-width:80vw;height:430px;position:relative;perspective:1200px;overflow:hidden;}
  .beyond{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,var(--ivory) 0%,var(--turmeric-bright) 55%,var(--turmeric) 100%);}
  .door-leaf{position:absolute;top:0;width:50%;height:100%;z-index:2;
    background:repeating-linear-gradient(90deg,rgba(43,27,18,0.1) 0 2px,transparent 2px 18px),linear-gradient(180deg,#7A5334,#5C3E24);
    box-shadow:inset 0 0 0 8px rgba(246,239,221,0.08),inset 0 0 0 1px rgba(0,0,0,0.3);transform-style:preserve-3d;will-change:transform;}
  .door-leaf.left{left:0;transform-origin:left center;}
  .door-leaf.right{right:0;transform-origin:right center;}
  .door-leaf .panel{position:absolute;inset:13% 15%;border:2px solid rgba(221,165,62,0.5);}
  .door-leaf::after{content:'';position:absolute;top:50%;width:17px;height:17px;border-radius:50%;background:var(--turmeric);
    box-shadow:0 0 0 2px var(--temple-gold),inset 0 1px 3px rgba(0,0,0,0.4);transform:translateY(-50%);}
  .door-leaf.left::after{right:17px;}
  .door-leaf.right::after{left:17px;}
  .steps{display:flex;flex-direction:column;align-items:center;}
  .step{height:10px;margin-top:2px;background:var(--temple-gold);}
  .step.s1{width:412px;max-width:92vw;}
  .step.s2{width:466px;max-width:96vw;background:#4E3A16;}
  .step.s3{width:520px;max-width:99vw;background:var(--ember);}

  
@media (max-width:520px){
    .approach-title{letter-spacing:0.12em;padding:0 1rem;}
    .spire-tier.t1{width:250px;}.spire-tier.t2{width:206px;}.spire-tier.t3{width:154px;}
    .spire-tier.t4{width:104px;}.spire-tier.t5{width:56px;}
    .lintel{width:286px;}
    .pillar{width:15px;}
    .doorway{height:330px;}
    .step.s1{width:286px;}.step.s2{width:330px;}.step.s3{width:372px;}
  }
#entrance{position:fixed;inset:0;z-index:800;display:none;background:var(--night-2);overflow:hidden;cursor:pointer}
html.entrance #entrance{display:block}
html.entrance,html.entrance body{overflow:hidden}
#entrance .stage{position:absolute;inset:0;height:auto}
#entrance .monument{transform:scale(.42)}
#entrance.go .monument{animation:ent-mon 3s cubic-bezier(.45,0,.25,1) forwards}
#entrance.go #leafL{animation:ent-lL 1.1s ease-in-out 1s forwards}
#entrance.go #leafR{animation:ent-lR 1.1s ease-in-out 1s forwards}
#entrance.go .doorlight{animation:ent-dl 2.3s ease-in 1s forwards}
#entrance.go .approach-title{animation:ent-fade .6s ease .9s forwards}
#entrance.out{animation:ent-out .8s ease forwards;pointer-events:none}
.entrance-skip{position:absolute;right:1.2rem;bottom:1.2rem;z-index:9;background:rgba(18,9,11,.6);color:#F6EFDD;border:1px solid rgba(221,165,62,.5);
  border-radius:99px;padding:.45rem 1.1rem;min-height:0;font-family:'Fraunces',Georgia,serif;font-style:italic;letter-spacing:.08em;cursor:pointer}
@keyframes ent-mon{0%{transform:scale(.42);opacity:1}40%{transform:scale(1);opacity:1}62%{transform:scale(1);opacity:1}100%{transform:scale(3.8);opacity:0}}
@keyframes ent-lL{to{transform:rotateY(-112deg)}}
@keyframes ent-lR{to{transform:rotateY(112deg)}}
@keyframes ent-dl{0%{opacity:0}45%{opacity:.9}100%{opacity:1}}
@keyframes ent-fade{to{opacity:0}}
@keyframes ent-out{to{opacity:0}}

@media (prefers-reduced-motion:reduce){
  #entrance{display:none!important}
  .courtscene *{animation:none!important}
}
