/* ========================================================
   Shared sub-page layer — Sumeru India Growth Fund
   Loaded AFTER style.css / home.css / <page>.css on every
   page except index. Unifies the stage look, fixes hero
   spacing + dark-text-on-dark bugs, aligns flat/glass bands,
   and provides the warm grainy backdrop for light mode.
   ======================================================== */

/* ---------- global guards ---------- */
body{overflow-x:hidden}
.sec-mark{display:none}   /* wireframe annotations retired from the visual design */

/* kill the 60px base main bottom-padding — it left a strip of the fixed
   stage showing between the CTA band and the footer on every sub-page
   (home already zeroes this, which is why home was fine). */
body.fund main,body.approach main,body.team main,
body.invest main,body.contact main,body.regulatory main{padding-bottom:0}
/* the CTA band is the last thing in main; seat it flush on the footer */
body.fund .cta-band,body.approach .cta-band,
body.team .cta-band,body.invest .cta-band{margin-bottom:0}

/* ---------- unified dark stage (fx3d) ---------- */
html.fx3d .fund-stage,
html.fx3d .approach-stage,
html.fx3d .team-stage,
html.fx3d .invest-stage{
  background:radial-gradient(120% 92% at 74% 8%,#fbf5ec 0%,#f4ecdc 45%,#eee2cf 100%);
}
html.fx3d .fund-stage::before,
html.fx3d .approach-stage::before,
html.fx3d .team-stage::before,
html.fx3d .invest-stage::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:radial-gradient(46% 60% at 78% 40%,rgba(252,105,0,.12),rgba(252,105,0,0) 70%);
}

/* ---------- flat glass slate (sub-pages only; home keeps its louvers) ----------
   One clean sheet of glass: full strength at the right edge,
   dissolving to nothing toward the left. */
html.fx3d .fund-stage .glass-rail,
html.fx3d .approach-stage .glass-rail,
html.fx3d .team-stage .glass-rail,
html.fx3d .invest-stage .glass-rail{
  display:block;
  width:min(54vw,880px);
  /* ~18% lighter frost so the objects behind read more sharply */
  -webkit-backdrop-filter:blur(14.5px) saturate(1.08) brightness(1.02);
  backdrop-filter:blur(14.5px) saturate(1.08) brightness(1.02);
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.14) 45%,rgba(255,255,255,.28) 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 62%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 62%);
}
html.fx3d .fund-stage .glass-rail::after,
html.fx3d .approach-stage .glass-rail::after,
html.fx3d .team-stage .glass-rail::after,
html.fx3d .invest-stage .glass-rail::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(105deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%),
    linear-gradient(105deg,transparent 72%,rgba(255,255,255,.16) 80%,transparent 88%);
}

/* ---------- warm grainy backdrop for light mode (no WebGL / mobile) ---------- */
body.fund,body.approach,body.team,body.invest,body.contact,body.regulatory{background:#f1e9db}
body.fund::before,body.approach::before,body.team::before,body.invest::before,
body.contact::before,body.regulatory::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(44% 38% at 85% 14%, rgba(255,138,66,.16), transparent 62%),
    radial-gradient(52% 44% at 6% 58%, rgba(216,195,164,.28), transparent 64%),
    radial-gradient(58% 48% at 74% 96%, rgba(255,154,92,.12), transparent 66%),
    linear-gradient(180deg,#f7f1e7 0%,#efe6d6 55%,#f3ecde 100%);
}
body.fund::after,body.approach::after,body.team::after,body.invest::after,
body.contact::after,body.regulatory::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.42;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  background-size:190px 190px;mix-blend-mode:soft-light;
}

/* ---------- alignment: naked containers inside bands ----------
   .sec-glass / .sec-flat already pad the band to the 1116px grid;
   an inner .container was double-insetting content by 32px. */
.sec-glass > .container,
.sec-flat > .container{max-width:none;margin:0;padding:0}

/* ---------- sub-page hero ---------- */
.hero-sec{
  min-height:56vh;
  display:flex;align-items:flex-end;
  padding-top:170px;padding-bottom:72px;
}
.hero-sec .hero-inner{max-width:760px}
@media(max-width:680px){
  .hero-sec{min-height:44vh;padding-top:140px;padding-bottom:52px}
}

/* hero entrance (pure CSS so it works with or without GSAP) */
@media (prefers-reduced-motion: no-preference){
  .hero-sec .hero-inner > *{animation:pageHeroRise .9s var(--ease) backwards}
  .hero-sec .hero-inner > :nth-child(1){animation-delay:.05s}
  .hero-sec .hero-inner > :nth-child(2){animation-delay:.14s}
  .hero-sec .hero-inner > :nth-child(3){animation-delay:.23s}
  .hero-sec .hero-inner > :nth-child(4){animation-delay:.32s}
}
@keyframes pageHeroRise{from{opacity:0;transform:translateY(26px)}}

/* ---------- dark-stage typography for glass bands outside cards ----------
   (glass-card children are handled in home.css; heroes and any naked
   sec-glass content were rendering ink-on-navy — unreadable) */
html.fx3d .sec-glass h1,
html.fx3d .sec-glass h2{color:var(--ink)}
html.fx3d .sec-glass .sub,
html.fx3d .sec-glass > p,
html.fx3d .sec-glass .hero-inner p{color:var(--ink-soft)}
html.fx3d .sec-glass .eyebrow{color:var(--accent-deep)}
html.fx3d .sec-glass .pending{color:var(--ink-faint)}
html.fx3d .glass-card li,
html.fx3d .invest-terms-card li{color:var(--ink-soft)}
html.fx3d .glass-card li strong,
html.fx3d .invest-terms-card li strong{color:var(--ink)}

/* flat bands stay ink-on-cream — restore inside them if nested */
html.fx3d .sec-flat h1,html.fx3d .sec-flat h2{color:var(--ink)}
html.fx3d .sec-flat .eyebrow{color:var(--accent-deep)}
html.fx3d .sec-flat .pending{color:var(--ink-faint)}

/* ---------- light-glass panels for contact & regulatory ---------- */
body.contact main,body.regulatory main{max-width:820px}
body.contact form{
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.35));
  border:1px solid rgba(255,255,255,.7);
  border-radius:20px;padding:34px 32px;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 18px 40px -22px rgba(60,48,36,.18);
}
body.contact input,body.contact select,body.contact textarea{background:rgba(255,255,255,.65)}
body.regulatory section{padding-top:44px;padding-bottom:44px}

/* glance table: neutralise the base wireframe td styling (bordered
   cream cells looked like grey blocks on the dark glass card) */
.glance-table td,
.glance-table td:first-child{border:none;background:transparent}

/* micro-interactions shared by sub-page components */
.glance-table tr{transition:background var(--dur-s) var(--ease)}
.glance-table tr:hover{background:rgba(255,255,255,.35)}
html.fx3d .glance-table tr:hover{background:rgba(60,48,36,.05)}
.invest-terms-card,.j-curve-container{
  transition:transform var(--dur-s) var(--ease),box-shadow var(--dur-s) var(--ease),border-color var(--dur-s) var(--ease);
}
.invest-terms-card:hover{transform:translateY(-3px);border-color:rgba(210,80,0,.35)}
html.fx3d .invest-terms-card:hover{border-color:var(--accent)}
