/* ==========================================================================
   ONE STEP AHEAD — Options Trading Workshop
   Design tokens
   -------------------------------------------------------------------------
   ink        deep navy-black, hero / dark sections, authority + trust
   paper      warm off-white, light sections
   gold       signal accent — CTAs, prices, the "confidence" colour
   green      calm / correct state (risk managed)
   rust       risk / danger state (used sparingly, for the "without
              knowledge" comparisons — never for CTAs)
   Type: Fraunces (display serif, market-report gravitas) for headings,
   Inter for body copy, IBM Plex Mono for all figures / data / timers —
   this keeps every number on the page reading like a ticker.
   ========================================================================== */

     @import url('https://fonts.googleapis.com/css2?family=Hind:wght@400;500;600;700&family=Noto+Sans+Devanagari:wght@400;500;600;700;800&display=swap');

:root{
  --ink:        #0B1220;
  --ink-soft:   #16202E;
  --paper:      #F7F4EE;
  --paper-dim:  #EFEAE0;
  --gold:       #C9972F;
  --gold-soft:  #E9CE8E;
  --green:      #2F6F52;
  --rust:       #B4472A;
  --line:       rgba(11,18,32,.12);
  --line-light: rgba(247,244,238,.16);
  --text:       #16202E;
  --text-dim:   #55606E;

  --font-display: 'Fraunces', Georgia, serif;
  --font-body:    'Inter', -apple-system, sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;

  --radius: 14px;
  --container-pad: 24px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  font-family: var(--font-body);
  color: var(--text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.container{ max-width: 1200px; }

a{ text-decoration:none; color: inherit; }
img{ max-width:100%; display:block; }
ul{ list-style:none; padding:0; margin:0; }

::selection{ background: var(--gold-soft); color: var(--ink); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior:auto !important; }
}

:focus-visible{
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

/* ---------------------------------- eyebrow / labels ------------------- */
.eyebrow{
  font-family: var(--font-mono);
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--gold-soft);
  display:flex; align-items:center; gap:8px;
  margin-bottom: 18px;
}
.eyebrow .dot{
  width:7px; height:7px; border-radius:50%;
  background: var(--green);
  box-shadow: 0 0 0 4px rgba(47,111,82,.2);
}
.eyebrow-dark{ color: var(--rust); }

.section-title{
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(1.9rem, 3.4vw, 2.75rem);
  line-height: 1.12;
  letter-spacing: -0.01em;
  margin-bottom: 22px;
  color: var(--ink);
}
.section-title.light{ color: var(--paper); }
.section-lead{
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--text-dim);
  margin-bottom: 16px;
}
.section-lead.light{ color: rgba(247,244,238,.72); }
.max-w{ max-width: 100%; }

.section{ padding: 30px 0; }
@media (max-width: 767px){ .section{ padding: 64px 0; } }

/* ================================= HEADER =============================== */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    border-radius: 39px;
    margin: 11px 25px 0px 25px;
    background: rgb(255 255 255 / 86%);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--line-light);
}
.site-header nav{ padding: 7px 0; }
.brand img{
  width:237px;
}
.brand span{ color: var(--gold); font-style: italic; }
.nav-links{ gap: 32px; }
.nav-links a {
    color: rgb(12 34 69);
    font-size: 17px;
    font-weight: 700;
    transition: color .2s;
}
.nav-links a:hover{ color: var(--gold-soft); }

.btn-ticker{
  font-family: var(--font-mono);
  font-size: .82rem;
  color: var(--ink);
  background: var(--gold);
  padding: 10px 18px;
  border-radius: 999px;
  font-weight: 600;
  transition: transform .2s, background .2s;
}
.btn-ticker:hover{ background: var(--gold-soft); transform: translateY(-1px); }

.nav-toggle{
  width:36px; height:32px; background:none; border:none; padding:0;
  display:flex; flex-direction:column; justify-content:center; gap:6px; cursor:pointer;
}
.nav-toggle span{ height:2px; background: var(--paper); border-radius:2px; }

.mobile-menu{
  display:none; flex-direction:column; gap:4px;
  padding-bottom: 18px;
}
.mobile-menu.open{ display:flex; }
.mobile-menu a{
  color: rgba(247,244,238,.85);
  padding: 12px 4px;
  border-top: 1px solid var(--line-light);
  font-size: .95rem;
}
.mobile-menu .btn-ticker{ margin-top:10px; text-align:center; justify-content:center; }

/* ================================= HERO ================================= */
.hero {
    position: relative;
    bottom: 96px;
    background: var(--ink);
    padding: 172px 0 132px;
    overflow: hidden;
}
.hero-inner{ position: relative; z-index: 2; }

.hero-chart{
  position:absolute; inset:0; z-index:1; opacity:.55;
  pointer-events:none;
}
.hero-chart svg{ width:100%; height:100%; }

.knowledge-line{
  fill:none; stroke: var(--gold);
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 1400;
  stroke-dashoffset: 1400;
  animation: drawLine 2.4s .3s cubic-bezier(.65,0,.35,1) forwards;
}
.line-dot{
  fill: var(--gold);
  opacity:0;
  animation: dotIn .4s 2.5s forwards;
}
@keyframes drawLine{ to{ stroke-dashoffset:0; } }
@keyframes dotIn{ to{ opacity:1; } }

.candle{ opacity:0; animation: candleIn .5s forwards; }
@keyframes candleIn{ to{ opacity:1; } }

.eyebrow.hero-eyebrow{ color: var(--gold-soft); }

.hero-title{
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--paper);
  font-size: clamp(2.3rem, 4.6vw, 3.6rem);
  line-height: 1.08;
  letter-spacing: -0.015em;
  margin-bottom: 22px;
}
.hero-title em{
  font-style: italic;
  color: var(--gold);
}
.hero-sub {
    color: rgba(247, 244, 238, .72);
    font-size: 14px;
    line-height: 24px;
    max-width: 540px;
    margin-bottom: 34px;
}
.hero-cta{ display:flex; flex-wrap:wrap; gap:18px; align-items:center; margin-bottom: 52px; }

.btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  background: var(--gold);
  color: var(--ink);
  font-weight: 600;
  font-size: .98rem;
  padding: 15px 28px;
  border-radius: 999px;
  border: none;
  cursor:pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  box-shadow: 0 10px 30px -12px rgba(201,151,47,.55);
}
.btn-primary:hover{ background: var(--gold-soft); transform: translateY(-2px); }

.btn-ghost{
  color: var(--paper);
  font-weight: 500;
  font-size: .98rem;
  padding: 15px 6px;
  border-bottom: 1px solid var(--line-light);
  transition: color .2s, border-color .2s;
}
.btn-ghost:hover{ color: var(--gold-soft); border-color: var(--gold-soft); }

.hero-stats{
  display:flex; gap: 40px; flex-wrap:wrap;
  border-top: 1px solid var(--line-light);
  padding-top: 28px;
}
.hero-stats .num{
  display:block;
  font-family: var(--font-mono);
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--gold);
}
.hero-stats .lbl{
  display:block;
  font-size: .82rem;
  color: rgba(247,244,238,.62);
  max-width: 150px;
  margin-top: 4px;
}

/* ---- registration card ---- */
.reg-card{
  background: var(--paper);
  border-radius: 20px;
  padding: 32px 30px 30px;
  box-shadow: 0 40px 80px -20px rgba(0,0,0,.55);
  position: relative;
  margin-top: 48px;
}
.reg-kicker{
  font-family: var(--font-mono);
  font-size: .72rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 6px;
}
.reg-title{
  font-family: var(--font-display);
  font-size: 1.55rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 2px;
}
.reg-subtitle{ color: var(--text-dim); font-size: .9rem; margin-bottom: 18px; }
.reg-price{
  font-family: var(--font-mono);
  font-size: 2.1rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 20px;
}
.reg-price span{ color: var(--gold); }
.reg-price::after{ content: ""; }

.reg-meta{
  display:grid; grid-template-columns: repeat(3,1fr);
  gap: 10px;
  border-top: 1px dashed var(--line);
  border-bottom: 1px dashed var(--line);
  padding: 16px 0;
  margin-bottom: 22px;
}
.reg-meta dt{
  font-size: .68rem; text-transform:uppercase; letter-spacing:.05em;
  color: var(--text-dim); margin-bottom: 3px;
}
.reg-meta dd{
  font-family: var(--font-mono);
  font-size: .82rem;
  font-weight: 600;
  color: var(--ink);
  margin:0;
}

.form-row{ margin-bottom: 14px; }
.form-row label{
  display:block; font-size: .78rem; font-weight:600;
  color: var(--ink); margin-bottom: 6px;
}
.form-row input{
  width:100%;
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: .92rem;
  color: var(--ink);
  transition: border-color .2s, box-shadow .2s;
}
.form-row input:focus{
  outline:none;
  border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(201,151,47,.18);
}
.reg-secure{
  text-align:center; font-size: .76rem; color: var(--text-dim);
  margin: 12px 0 0;
}
.reg-success{
  text-align:center;
  color: var(--green);
  font-weight: 600;
  font-size: .92rem;
  padding: 14px 0 2px;
}

/* ============================== WHY / COMPARE (light) =================== */
.compare-stack{ display:flex; flex-direction:column; gap:18px; }
.compare-row{
  border-radius: var(--radius);
  padding: 24px 26px;
  border: 1px solid var(--line);
}
.compare-row p{ margin: 6px 0 0; color: var(--text-dim); }
.compare-tag{
  font-family: var(--font-mono);
  font-size: .72rem;
  text-transform: uppercase; letter-spacing:.05em;
  font-weight:600;
}
.compare-row.risk{ background: #FBEEE9; }
.compare-row.risk .compare-tag{ color: var(--rust); }
.compare-row.calm{ background: #EAF2ED; }
.compare-row.calm .compare-tag{ color: var(--green); }

/* ============================== CURRICULUM =============================== */
.ticker-list{ margin-top: 48px; border-top: 1px solid var(--line); }
.ticker-item {
    display: block;
    grid-template-columns: 130px 1fr;
    gap: 32px;
    padding: 19px 0;
    border-bottom: 1px solid var(--line);
}
.ticker-time{
  font-family: var(--font-mono);
  color: var(--ink);
}
.ticker-time span{ display:block; font-size: 1.5rem; font-weight:600; }
.ticker-time small{
  display:block; color: var(--gold);
  font-size: .68rem; text-transform:uppercase; letter-spacing:.06em; margin-top:4px;
}
.ticker-body h3{
  font-family: var(--font-display);
  font-size: 1.3rem; font-weight:600;
  color: var(--ink);
  margin-bottom: 8px;
}
.ticker-body p{ color: var(--text-dim); margin-bottom: 14px; max-width: 620px; }
.chip-list{ display:flex; flex-wrap:wrap; gap:10px; }
.chip-list li{
  font-family: var(--font-mono);
  font-size: .76rem;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--paper-dim);
  color: var(--ink-soft);
}

@media (max-width: 640px){
  .ticker-item{ grid-template-columns: 1fr; gap: 10px; }
  .ticker-time{ display:flex; align-items:baseline; gap:10px; }
}

/* ============================== TRAINER =================================== */
.trainer{ background: #ffffff; }
.trainer-card{ position:relative; max-width: 380px; }
.trainer-photo{
 
  border-radius: var(--radius);
  background:
    linear-gradient(160deg, rgba(11,18,32,.75), rgba(11,18,32,.15)),
    linear-gradient(135deg, #2b3a52, #0B1220);
}
.trainer-badge{
  position:absolute; left:-18px; bottom:-18px;
  background: var(--ink);
  color: var(--paper);
  border-radius: 14px;
  padding: 16px 20px;
  box-shadow: 0 20px 40px -16px rgba(0,0,0,.4);
}
.trainer-badge .num{
  display:block; font-family: var(--font-mono);
  font-size: 1.5rem; color: var(--gold); font-weight:600;
}
.trainer-badge .lbl{ display:block; font-size:.72rem; color: rgba(247,244,238,.7); max-width:130px; }

.trainer-facts{ margin: 22px 0 26px; }
.trainer-facts li{
  position:relative; padding-left: 22px; margin-bottom:10px;
  color: var(--text); font-weight:500; font-size:.95rem;
}
.trainer-facts li::before{
  content:"✓"; position:absolute; left:0; color: var(--green); font-weight:700;
}
.trainer-quote{
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1.2rem;
  color: var(--ink);
  border-left: 3px solid var(--gold);
  padding-left: 20px;
  margin: 0 0 28px;
  line-height:1.5;
}
.trainer-quote cite{
  display:block; margin-top:10px; font-style:normal;
  font-family: var(--font-mono);
  font-size: .78rem; color: var(--text-dim);
}

/* ============================== OUTCOMES =================================== */
.outcome-card{
  height:100%;
  background:#fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 26px 24px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.outcome-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -22px rgba(11,18,32,.25);
  border-color: var(--gold-soft);
}
.outcome-card h3{
  font-family: var(--font-display);
  font-size: 1.12rem; font-weight:600;
  color: var(--ink); margin-bottom:8px;
}
.outcome-card p{ color: var(--text-dim); font-size:.94rem; margin:0; }

/* ============================== COMPARE (dark) ============================= */
.compare-section{ background: var(--ink); padding: 20px 0; }
.compare-section .eyebrow{ justify-content:flex-start; }
.compare-cols{ margin-top: 4px; }
.compare-panel{
  height:100%;
  border-radius: var(--radius);
  padding: 30px 28px;
  border: 1px solid var(--line-light);
}
.compare-panel h3{
  font-family: var(--font-display);
  font-size: 1.2rem; margin-bottom: 18px;
}
.compare-panel li{
  padding: 10px 0 10px 26px;
  position:relative;
  font-size: .95rem;
  border-bottom: 1px solid rgba(247,244,238,.08);
}
.compare-panel.bad{ background: rgba(180,71,42,.08); }
.compare-panel.bad h3{ color: var(--rust); }
.compare-panel.bad li{ color: rgba(247,244,238,.65); }
.compare-panel.bad li::before{ content:"✕"; position:absolute; left:0; color: var(--rust); }
.compare-panel.good{ background: rgba(47,111,82,.1); }
.compare-panel.good h3{ color: var(--green); }
.compare-panel.good li{ color: var(--paper); }
.compare-panel.good li::before{ content:"✓"; position:absolute; left:0; color: var(--green); }

/* ============================== AUDIENCE =================================== */
.audience-card{
  height:100%;
  padding: 24px 20px;
  border-radius: var(--radius);
  background: #fff;
  border: 1px solid var(--line);
}
.audience-card h3{
  font-family: var(--font-display);
  font-size: 1.05rem; font-weight:600; margin-bottom:8px; color: var(--ink);
}
.audience-card p{ font-size:.88rem; color: var(--text-dim); margin:0; }
.audience-note{
  margin: 32px 0 0;
  font-family: var(--font-mono);
  font-size: .85rem;
  color: var(--green);
  text-align:center;
}

/* ============================== DETAILS / PASS ============================= */
.glance-list{ margin: 26px 0 32px; }
.glance-list div{
  display:flex; justify-content:space-between;
  padding: 14px 0;
  border-bottom: 1px dashed var(--line);
}
.glance-list dt{ color: var(--text-dim); font-size:.92rem; }
.glance-list dd{
  font-family: var(--font-mono);
  font-weight:600; color: var(--ink); margin:0; text-align:right;
}

.pass-list{ margin-top:26px; }
.pass-item{
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.pass-item h4{
  font-family: var(--font-display);
  font-size: 1.02rem; font-weight:600; color: var(--ink); margin-bottom:4px;
}
.pass-item p{ margin:0; color: var(--text-dim); font-size: .9rem; }

/* ============================== FAQ / ACCORDION ============================= */
.accordion-list{ margin-top: 10px; border-top: 1px solid var(--line); }
.accordion-item{ border-bottom: 1px solid var(--line); }
.accordion-trigger{
  width:100%;
  display:flex; justify-content:space-between; align-items:center;
  background:none; border:none; cursor:pointer;
  padding: 22px 4px;
  text-align:left;
  font-family: var(--font-display);
  font-size: 1.05rem; font-weight:600;
  color: var(--ink);
}
.accordion-icon{
  font-family: var(--font-mono);
  font-size: 1.3rem;
  color: var(--gold);
  transition: transform .25s ease;
  flex-shrink:0; margin-left:16px;
}
.accordion-trigger[aria-expanded="true"] .accordion-icon{ transform: rotate(45deg); }
.accordion-panel{
  max-height:0;
  overflow:hidden;
  transition: max-height .35s ease;
}
.accordion-panel p{
  color: var(--text-dim);
  padding: 0 4px 22px;
  margin:0;
  max-width: 640px;
  line-height:1.6;
}

/* ============================== FINAL CTA =================================== */
.final-cta{
  background: linear-gradient(180deg, var(--ink), #060a12);
  padding: 90px 0;
  text-align:center;
}
.final-cta .eyebrow{ justify-content:center; }
.final-cta h2{
  font-family: var(--font-display);
  color: var(--paper);
  font-size: clamp(1.8rem, 3.6vw, 2.6rem);
  margin-bottom: 30px;
}

/* ============================== FOOTER ======================================= */
.site-footer{
  background: var(--ink);
  border-top: 1px solid var(--line-light);
  padding: 26px 0;
}
.site-footer p{ color: rgba(247,244,238,.5); font-size:.85rem; margin:0; }

/* ==========================================
   OUR PHILOSOPHY SECTION
========================================== */

.philosophy-section {
    position: relative;
    padding: 30px 0;
    background:
        radial-gradient(circle at 10% 20%, rgba(255, 183, 3, 0.10), transparent 30%),
        radial-gradient(circle at 90% 80%, rgba(255, 120, 0, 0.08), transparent 30%),
        #0b0d12;
    overflow: hidden;
    color: #fff;
}


/* Background Decorative Circles */

.philosophy-section::before {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    border: 1px solid rgba(255, 183, 3, 0.08);
    border-radius: 50%;
    top: -250px;
    right: -150px;
}

.philosophy-section::after {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    border: 1px solid rgba(255, 183, 3, 0.06);
    border-radius: 50%;
    bottom: -180px;
    left: -120px;
}


/* Heading */

.philosophy-heading {
    position: relative;
    z-index: 2;
    max-width: 750px;
    margin: 0 auto 65px;
    text-align: center;
}

.philosophy-subtitle {
    display: inline-block;
    margin-bottom: 15px;
    color: #ffb703;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.philosophy-heading h2 {
    margin: 0 0 18px;
        font-size: 41px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -1px;
    font-family: var(--font-display);
}

.philosophy-heading h2 span {
    color: #ffb703;
}

.philosophy-heading p {
    max-width: 600px;
    margin: auto;
    color: #aeb3bd;
    font-size: 17px;
    line-height: 1.8;
}


/* ==========================================
   PHILOSOPHY FLOW
========================================== */

.philosophy-flow {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    max-width: 1200px;
    margin: 0 auto 25px;
    gap: 12px;
}


/* Card */

.philosophy-card {
    position: relative;

    width: 255px;
    min-height: 278px;

    padding: 38px 25px 30px;

    text-align: center;

    background: rgba(255, 255, 255, 0.045);

    border: 1px solid rgba(255, 255, 255, 0.09);

    border-radius: 22px;

    backdrop-filter: blur(12px);

    transition: all 0.4s ease;
}


.philosophy-card:hover {
    transform: translateY(-12px);

    border-color: rgba(255, 183, 3, 0.6);

    box-shadow:
        0 20px 50px rgba(0, 0, 0, 0.35),
        0 0 35px rgba(255, 183, 3, 0.08);
}


/* Number */

.step-number {
    position: absolute;
    top: 15px;
    right: 18px;

    font-size: 12px;
    font-weight: 700;

    color: rgba(255, 255, 255, 0.25);

    letter-spacing: 1px;
}


/* Icon */

.philosophy-icon {
    width: 72px;
    height: 72px;

    margin: 0 auto 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(255, 183, 3, 0.10);

    border: 1px solid rgba(255, 183, 3, 0.25);

    color: #ffb703;

    font-size: 27px;

    transition: all 0.4s ease;
}


.philosophy-card:hover .philosophy-icon {
    background: #ffb703;
    color: #0b0d12;

    transform: scale(1.08) rotate(5deg);

    box-shadow: 0 0 30px rgba(255, 183, 3, 0.25);
}


/* Card Heading */

.philosophy-card h3 {
    margin: 0 0 15px;

    color: #fff;

    font-size: 20px;
    font-weight: 800;

    letter-spacing: 1px;
}


/* Card Text */

.philosophy-card p {
    margin: 0;

    color: #999faa;

    font-size: 14px;

    line-height: 1.8;
}


/* Success Card */

.success-card {
    background:
        linear-gradient(
            145deg,
            rgba(255, 183, 3, 0.14),
            rgba(255, 255, 255, 0.035)
        );

    border-color: rgba(255, 183, 3, 0.35);
}


/* ==========================================
   FLOW ARROWS
========================================== */

.flow-arrow {
    flex-shrink: 0;

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #ffb703;

    font-size: 17px;

    opacity: 0.7;
}


/* ==========================================
   HINDI PHILOSOPHY BOX
========================================== */

.hindi-philosophy {
    position: relative;
    z-index: 2;

    max-width: 1050px;

    margin: 0 auto;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 35px 45px;

    border-radius: 20px;

    background:
        linear-gradient(
            120deg,
            rgba(255, 183, 3, 0.13),
            rgba(255, 255, 255, 0.035)
        );

    border: 1px solid rgba(255, 183, 3, 0.25);

    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.20);
}


.hindi-icon {
    flex-shrink: 0;

    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background: #ffb703;

    color: #111;

    font-size: 22px;
}


.hindi-content span {
    display: block;

    margin-bottom: 12px;

    color: #ffb703;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 2px;
}


.hindi-content h3 {
    margin: 3px 0;

    color: #fff;

    font-size: 18px;

    line-height: 1.7;

    font-weight: 600;
}


.hindi-content h3 b {
    color: #ffb703;
    padding: 0 5px;
}


/* ==========================================
   BRAND AREA
========================================== */

.philosophy-brand {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 25px;

    margin-top: 70px;
}


.brand-line {
    width: 100px;
    height: 1px;

    background: rgba(255, 255, 255, 0.15);
}


.brand-content {
    text-align: center;
}


.brand-content span {
    display: block;

    color: #ffb703;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 4px;
}


.brand-content strong {
    display: block;

    margin-top: 10px;

    font-size: 20px;

    letter-spacing: 2px;

    color: #fff;
}


.brand-content strong i {
    color: #ffb703;
    font-style: normal;
    padding: 0 7px;
}


.brand-content p {
    margin: 10px 0 0;

    color: #777d88;

    font-size: 13px;

    letter-spacing: 1px;
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1100px) {

    .philosophy-flow {
        flex-wrap: wrap;
    }

    .philosophy-card {
        width: calc(50% - 35px);
    }

    .flow-arrow {
        display: none;
    }
}


@media (max-width: 767px) {

    .philosophy-section {
        padding: 75px 20px;
    }

    .philosophy-heading {
        margin-bottom: 45px;
    }

    .philosophy-heading h2 {
        font-size: 36px;
    }

    .philosophy-heading p {
        font-size: 15px;
    }


    .philosophy-flow {
        display: grid;

        grid-template-columns: 1fr;

        gap: 18px;
    }


    .philosophy-card {
        width: 100%;

        min-height: auto;

        padding: 35px 25px;
    }


    .hindi-philosophy {
        flex-direction: column;

        text-align: center;

        padding: 30px 22px;

        gap: 20px;
    }


    .hindi-content h3 {
        font-size: 16px;
    }


    .philosophy-brand {
        margin-top: 50px;
    }


    .brand-line {
        width: 35px;
    }


    .brand-content strong {
        font-size: 15px;
        letter-spacing: 1px;
    }


    .brand-content span {
        font-size: 10px;
        letter-spacing: 2px;
    }
}


@media (max-width: 480px) {

    .philosophy-heading h2 {
        font-size: 30px;
    }

    .hindi-content h3 {
        font-size: 14px;
        line-height: 1.8;
    }

    .brand-line {
        display: none;
    }
}

/* ==========================================
   ANIMATED ENERGY BACKGROUND
========================================== */

.philosophy-section {
    position: relative;
    overflow: hidden;

    background: #0a1c3e;
}


/* Background Layer */

.philosophy-bg {
    position: absolute;
    inset: 0;

    overflow: hidden;

    pointer-events: none;

    z-index: 0;
}


/* ==========================================
   GLOWING ENERGY ORBS
========================================== */

.energy-orb {
    position: absolute;

    width: 420px;
    height: 420px;

    border-radius: 50%;

    background: radial-gradient(
        circle,
        rgba(255, 183, 3, 0.22) 0%,
        rgba(255, 150, 0, 0.10) 35%,
        transparent 70%
    );

    filter: blur(10px);

    opacity: 0.8;
}


/* Orb 1 */

.orb-1 {
    top: -180px;
    left: -120px;

    animation:
        orbFloat1 12s ease-in-out infinite alternate;
}


/* Orb 2 */

.orb-2 {
    right: -180px;
    top: 20%;

    width: 500px;
    height: 500px;

    background: radial-gradient(
        circle,
        rgba(255, 193, 7, 0.18),
        rgba(255, 120, 0, 0.08) 40%,
        transparent 70%
    );

    animation:
        orbFloat2 15s ease-in-out infinite alternate;
}


/* Orb 3 */

.orb-3 {
    bottom: -250px;
    left: 35%;

    width: 500px;
    height: 500px;

    background: radial-gradient(
        circle,
        rgba(255, 183, 3, 0.13),
        transparent 70%
    );

    animation:
        orbFloat3 18s ease-in-out infinite alternate;
}


/* ==========================================
   ORB ANIMATIONS
========================================== */

@keyframes orbFloat1 {

    0% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(180px, 100px) scale(1.15);
    }

    100% {
        transform: translate(80px, 230px) scale(0.9);
    }
}


@keyframes orbFloat2 {

    0% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(-160px, 80px) scale(1.15);
    }

    100% {
        transform: translate(-50px, -120px) scale(0.95);
    }
}


@keyframes orbFloat3 {

    0% {
        transform: translate(0, 0);
    }

    50% {
        transform: translate(100px, -120px) scale(1.2);
    }

    100% {
        transform: translate(-100px, -40px) scale(0.9);
    }
}


/* ==========================================
   ANIMATED ENERGY RINGS
========================================== */

.energy-ring {
    position: absolute;

    border-radius: 50%;

    border: 1px solid rgba(255, 183, 3, 0.10);

    transform: translate(-50%, -50%);

    animation: ringPulse 8s ease-in-out infinite;
}


.ring-1 {
    width: 650px;
    height: 650px;

    left: 50%;
    top: 45%;
}


.ring-2 {
    width: 950px;
    height: 950px;

    left: 50%;
    top: 45%;

    border-color: rgba(255, 183, 3, 0.055);

    animation-delay: 2s;
}


@keyframes ringPulse {

    0% {
        transform: translate(-50%, -50%) scale(0.9);
        opacity: 0.25;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.05);
        opacity: 0.7;
    }

    100% {
        transform: translate(-50%, -50%) scale(0.9);
        opacity: 0.25;
    }
}


/* ==========================================
   FLOATING PARTICLES
========================================== */

.energy-particles span {
    position: absolute;

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #ffb703;

    box-shadow:
        0 0 10px rgba(255, 183, 3, 0.8),
        0 0 20px rgba(255, 183, 3, 0.4);

    opacity: 0;

    animation: particleFloat 8s linear infinite;
}


/* Particle Positions */

.energy-particles span:nth-child(1) {
    left: 8%;
    bottom: 10%;
    animation-delay: 0s;
}

.energy-particles span:nth-child(2) {
    left: 18%;
    bottom: 30%;
    animation-delay: 2s;
}

.energy-particles span:nth-child(3) {
    left: 28%;
    bottom: 15%;
    animation-delay: 4s;
}

.energy-particles span:nth-child(4) {
    left: 38%;
    bottom: 40%;
    animation-delay: 1s;
}

.energy-particles span:nth-child(5) {
    left: 48%;
    bottom: 20%;
    animation-delay: 5s;
}

.energy-particles span:nth-child(6) {
    left: 58%;
    bottom: 35%;
    animation-delay: 3s;
}

.energy-particles span:nth-child(7) {
    left: 68%;
    bottom: 12%;
    animation-delay: 6s;
}

.energy-particles span:nth-child(8) {
    left: 78%;
    bottom: 45%;
    animation-delay: 1.5s;
}

.energy-particles span:nth-child(9) {
    left: 88%;
    bottom: 25%;
    animation-delay: 4.5s;
}

.energy-particles span:nth-child(10) {
    left: 93%;
    bottom: 55%;
    animation-delay: 2.5s;
}

.energy-particles span:nth-child(11) {
    left: 13%;
    bottom: 60%;
    animation-delay: 5.5s;
}

.energy-particles span:nth-child(12) {
    left: 73%;
    bottom: 65%;
    animation-delay: 7s;
}


/* Particle Animation */

@keyframes particleFloat {

    0% {
        transform: translateY(0) scale(0.5);
        opacity: 0;
    }

    15% {
        opacity: 0.8;
    }

    50% {
        transform: translateY(-180px) translateX(30px) scale(1);
        opacity: 1;
    }

    80% {
        opacity: 0.5;
    }

    100% {
        transform: translateY(-380px) translateX(-30px) scale(0.3);
        opacity: 0;
    }
}


/* ==========================================
   MOVING LIGHT BEAM
========================================== */

.philosophy-section .container {
    position: relative;
    z-index: 2;
}


.philosophy-section::after {
    content: "";

    position: absolute;

    width: 700px;
    height: 2px;

    left: -200px;
    top: 50%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 183, 3, 0.5),
        transparent
    );

    filter: blur(2px);

    transform: rotate(-25deg);

    animation: lightBeam 10s linear infinite;

    z-index: 1;
}


@keyframes lightBeam {

    0% {
        left: -700px;
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    50% {
        opacity: 0.7;
    }

    100% {
        left: 110%;
        opacity: 0;
    }
}


/* ==========================================
   MOBILE OPTIMIZATION
========================================== */

@media (max-width: 767px) {

    .energy-orb {
        width: 280px;
        height: 280px;
    }

    .orb-2,
    .orb-3 {
        width: 300px;
        height: 300px;
    }

    .ring-1 {
        width: 450px;
        height: 450px;
    }

    .ring-2 {
        width: 650px;
        height: 650px;
    }

    .philosophy-section::after {
        width: 450px;
    }
}

@import url('https://fonts.googleapis.com/css2?family=Hind:wght@400;500;600;700&family=Noto+Sans+Devanagari:wght@400;500;600;700;800&display=swap');


/* ==============================
   MAIN SECTION
================================= */

.framework-section {
    position: relative;

    padding: 40px 0;

    background: #f7f5f0;

    overflow: hidden;
}

.framework-container {
    width: min(1200px, 92%);
    margin: auto;
}


/* ==============================
   HEADING
================================= */

.framework-heading {
    max-width: 988px;
    margin: 0 auto 20px;

    text-align: center;
}

.framework-subtitle {
    display: inline-block;

    margin-bottom: 15px;

    font-family: 'Hind', sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 4px;

    color: #c79a3b;
}

.framework-heading h2 {
    margin: 0;

    font-family: var(--font-display);

    font-size: 40px;
    line-height: 1.15;

    font-weight: 700;

    color: #122033;
}

.framework-heading h2 span {
    display: block;

    color: #c79a3b;
}

.framework-heading p {
    max-width: 650px;

    margin: 22px auto 0;

    font-family: 'Hind', sans-serif;

    font-size: 18px;
    line-height: 1.7;

    color: #667085;
}


/* ==============================
   FRAMEWORK ITEM
================================= */

.framework-item {
    display: grid;

    grid-template-columns: 1fr 1fr;

    align-items: center;

    gap: 70px;

    margin-bottom: 10px;
}

.framework-item.reverse .framework-image {
    order: 2;
}

.framework-item.reverse .framework-content {
    order: 1;
}


/* ==============================
   IMAGE
================================= */

.framework-image {
    position: relative;

    height: 430px;

    overflow: hidden;

    border-radius: 4px;

    box-shadow:
        0 25px 60px rgba(18, 32, 51, 0.12);
}

.framework-image::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(18, 32, 51, 0.08),
            transparent 60%
        );

    pointer-events: none;
}

.framework-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.7s ease;
}

.framework-item:hover .framework-image img {
    transform: scale(1.06);
}


/* ==============================
   NUMBER
================================= */

.framework-number {
    position: absolute;

    left: 25px;
    bottom: 25px;

    z-index: 2;

    width: 65px;
    height: 65px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #ffffff;

    color: #122033;

    font-family: 'Hind', sans-serif;

    font-size: 20px;
    font-weight: 700;

    box-shadow: 0 10px 30px rgba(0,0,0,.15);
}


/* ==============================
   CONTENT
================================= */

.framework-content {
    padding: 20px 10px;
}

.framework-label {
    display: block;

    margin-bottom: 12px;

    font-family: 'Hind', sans-serif;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 3px;

    color: #c79a3b;
}

.framework-content h3 {
    margin: 0;

    font-family: 'Hind', sans-serif;

    font-size: 45px;

    line-height: 1.1;

    font-weight: 700;

    color: #122033;
}

.framework-content h3 small {
    display: block;

    margin-top: 10px;

    font-family: 'Noto Sans Devanagari',
                 'Hind',
                 sans-serif;

    font-size: 21px;

    line-height: 1.5;

    font-weight: 600;

    color: #c79a3b;
}

.framework-content p {
    margin: 25px 0;

    font-family: 'Noto Sans Devanagari',
                 'Hind',
                 sans-serif;

    font-size: 17px;

    line-height: 1.8;

    color: #667085;
}


/* ==============================
   BUTTON
================================= */

.framework-btn {
    display: inline-flex;

    align-items: center;

    gap: 14px;

    padding: 12px 0;

    font-family: 'Hind', sans-serif;

    font-size: 15px;

    font-weight: 700;

    text-decoration: none;

    color: #122033;

    border-bottom: 1px solid #c79a3b;

    transition: .3s ease;
}

.framework-btn span {
    color: #c79a3b;

    font-size: 20px;

    transition: .3s ease;
}

.framework-btn:hover {
    color: #c79a3b;
}

.framework-btn:hover span {
    transform: translateX(6px);
}


/* ==============================
   JOURNEY
================================= */

.framework-journey {
    margin-top: 30px;

    padding: 20px 30px;

    text-align: center;

    background: #122033;

    border-radius: 4px;

    box-shadow:
        0 25px 60px rgba(18, 32, 51, .15);
}

.framework-journey > span {
    display: block;

    margin-bottom: 22px;

    font-family: 'Hind', sans-serif;

    font-size: 12px;

    letter-spacing: 4px;

    font-weight: 700;

    color: #c79a3b;
}

.journey-flow {
    display: flex;

    justify-content: center;
    align-items: center;

    flex-wrap: wrap;

    gap: 18px;
}

.journey-flow strong {
    font-family: 'Hind', sans-serif;

    font-size: 19px;

    color: #ffffff;

    letter-spacing: 1px;
}

.journey-flow i {
    font-style: normal;

    color: #c79a3b;

    font-size: 24px;
}


/* ==============================
   TABLET
================================= */

@media (max-width: 991px) {

    .framework-section {
        padding: 80px 0;
    }

    .framework-heading h2 {
        font-size: 42px;
    }

    .framework-item {
        gap: 40px;

        margin-bottom: 70px;
    }

    .framework-image {
        height: 360px;
    }

    .framework-content h3 {
        font-size: 38px;
    }

    .framework-content h3 small {
        font-size: 18px;
    }

    .framework-content p {
        font-size: 16px;
    }
}


/* ==============================
   MOBILE
================================= */

@media (max-width: 767px) {

    .framework-section {
        padding: 65px 0;
    }

    .framework-heading {
        margin-bottom: 55px;
    }

    .framework-heading h2 {
        font-size: 35px;
    }

    .framework-heading p {
        font-size: 16px;
    }

    .framework-item,
    .framework-item.reverse {
        display: flex;

        flex-direction: column;

        gap: 30px;

        margin-bottom: 65px;
    }

    .framework-item.reverse .framework-image,
    .framework-item.reverse .framework-content {
        order: initial;
    }

    .framework-image {
        width: 100%;
        height: 300px;
    }

    .framework-content {
        padding: 0;
    }

    .framework-content h3 {
        font-size: 35px;
    }

    .framework-content h3 small {
        font-size: 18px;
    }

    .framework-content p {
        font-size: 16px;
        line-height: 1.7;
    }

    .journey-flow {
        flex-direction: column;
        gap: 8px;
    }

    .journey-flow i {
        transform: rotate(90deg);
    }
}


/* =========================================
   LAW OF PAISALOGY 9 FOOTER
========================================= */

.lp9-footer {
    position: relative;
    overflow: hidden;

    padding: 26px 0 7px;

    background:radial-gradient(circle at 15% 20%, rgba(255, 183, 3, 0.12), transparent 30%), radial-gradient(circle at 85% 75%, rgba(255, 140, 0, 0.09), transparent 30%), #0c1c3f;

    color: #fff;
}


/* =========================================
   ANIMATED BACKGROUND
========================================= */

.lp9-footer-bg {
    position: absolute;
    inset: 0;

    pointer-events: none;

    overflow: hidden;
}


/* Glowing Orbs */

.footer-orb {
    position: absolute;

    width: 450px;
    height: 450px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 183, 3, 0.20),
            rgba(255, 150, 0, 0.07) 40%,
            transparent 70%
        );

    filter: blur(15px);
}


.footer-orb-1 {
    top: -250px;
    left: -150px;

    animation: footerOrbOne 14s ease-in-out infinite alternate;
}


.footer-orb-2 {
    right: -180px;
    top: 20%;

    width: 520px;
    height: 520px;

    animation: footerOrbTwo 17s ease-in-out infinite alternate;
}


.footer-orb-3 {
    bottom: -300px;
    left: 40%;

    animation: footerOrbThree 20s ease-in-out infinite alternate;
}


/* Orb Animations */

@keyframes footerOrbOne {

    0% {
        transform: translate(0, 0) scale(1);
    }

    100% {
        transform: translate(220px, 150px) scale(1.2);
    }
}


@keyframes footerOrbTwo {

    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(-180px, 100px) scale(1.15);
    }
}


@keyframes footerOrbThree {

    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(120px, -100px) scale(1.15);
    }
}


/* =========================================
   ANIMATED RINGS
========================================= */

.footer-ring {
    position: absolute;

    left: 50%;
    top: 55%;

    border-radius: 50%;

    transform: translate(-50%, -50%);

    border: 1px solid rgba(255, 183, 3, 0.08);

    animation: footerRing 9s ease-in-out infinite;
}


.footer-ring-1 {
    width: 650px;
    height: 650px;
}


.footer-ring-2 {
    width: 950px;
    height: 950px;

    border-color: rgba(255, 183, 3, 0.04);

    animation-delay: 2s;
}


@keyframes footerRing {

    0% {
        transform: translate(-50%, -50%) scale(.9);
        opacity: .2;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.05);
        opacity: .7;
    }

    100% {
        transform: translate(-50%, -50%) scale(.9);
        opacity: .2;
    }
}


/* =========================================
   FLOATING PARTICLES
========================================= */

.footer-particles span {
    position: absolute;

    width: 4px;
    height: 4px;

    border-radius: 50%;

    background: #ffb703;

    box-shadow:
        0 0 10px rgba(255, 183, 3, .8),
        0 0 20px rgba(255, 183, 3, .4);

    opacity: 0;

    animation: footerParticle 8s linear infinite;
}


.footer-particles span:nth-child(1) {
    left: 8%;
    bottom: 5%;
    animation-delay: 0s;
}

.footer-particles span:nth-child(2) {
    left: 20%;
    bottom: 20%;
    animation-delay: 2s;
}

.footer-particles span:nth-child(3) {
    left: 35%;
    bottom: 10%;
    animation-delay: 4s;
}

.footer-particles span:nth-child(4) {
    left: 50%;
    bottom: 30%;
    animation-delay: 1s;
}

.footer-particles span:nth-child(5) {
    left: 65%;
    bottom: 15%;
    animation-delay: 5s;
}

.footer-particles span:nth-child(6) {
    left: 75%;
    bottom: 40%;
    animation-delay: 3s;
}

.footer-particles span:nth-child(7) {
    left: 88%;
    bottom: 20%;
    animation-delay: 6s;
}

.footer-particles span:nth-child(8) {
    left: 95%;
    bottom: 50%;
    animation-delay: 2.5s;
}


@keyframes footerParticle {

    0% {
        transform: translateY(0) scale(.4);
        opacity: 0;
    }

    20% {
        opacity: .8;
    }

    50% {
        transform:
            translateY(-180px)
            translateX(30px)
            scale(1);
        opacity: 1;
    }

    100% {
        transform:
            translateY(-400px)
            translateX(-30px)
            scale(.2);
        opacity: 0;
    }
}


/* =========================================
   CONTENT
========================================= */

.lp9-footer .container {
    position: relative;
    z-index: 3;
}


/* =========================================
   CTA
========================================= */

.footer-cta {
    max-width: 800px;

    margin: 0 auto 30px;

    text-align: center;
}


.footer-small-title {
    display: inline-block;

    margin-bottom: 15px;

    color: #ffb703;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 4px;
}


.footer-cta h2 {
    margin: 0 0 18px;

    font-size: 40px;

    line-height: 1.1;

    font-weight: 800;
    font-family: var(--font-display);
}


.footer-cta h2 span {
    color: #ffb703;
}


.footer-cta p {
    max-width: 600px;

    margin: 0 auto 28px;

    color: #969ca7;

    font-size: 16px;

    line-height: 1.8;
}


/* CTA Button */

.footer-cta-btn {
    display: inline-flex;

    align-items: center;
    gap: 12px;

    padding: 14px 25px;

    border-radius: 50px;

    background: #ffb703;

    color: #101010;

    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition: .35s ease;
}


.footer-cta-btn:hover {
    background: #fff;

    color: #111;

    transform: translateY(-4px);

    box-shadow:
        0 10px 30px rgba(255, 183, 3, .20);
}


.footer-cta-btn i {
    transition: .3s ease;
}


.footer-cta-btn:hover i {
    transform: translateX(5px);
}


/* =========================================
   CONTACT CARDS
========================================= */

.footer-contact-grid {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 18px;

    margin-bottom: 25px;
}


.footer-contact-box {
    display: flex;

    align-items: center;

    gap: 18px;

    padding: 25px;

    border-radius: 18px;

    background: rgba(255, 255, 255, .035);

    border: 1px solid rgba(255, 255, 255, .08);

    backdrop-filter: blur(10px);

    transition: .35s ease;
}


.footer-contact-box:hover {
    transform: translateY(-7px);

    border-color: rgba(255, 183, 3, .35);

    background: rgba(255, 183, 3, .06);
}


.footer-contact-icon {
    flex-shrink: 0;

    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 14px;

    background: rgba(255, 183, 3, .10);

    color: #ffb703;

    font-size: 19px;
}


.footer-contact-box span {
    display: block;

    margin-bottom: 6px;

    color: #777d87;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;
}


.footer-contact-box a,
.footer-contact-box p {
    margin: 0;

    color: #fff;

    font-size: 14px;

    text-decoration: none;
}


.footer-contact-box a:hover {
    color: #ffb703;
}


.footer-contact-box a:last-child {
    display: inline-block;

    margin-top: 7px;

    color: #ffb703;

    font-size: 12px;
}


/* =========================================
   MAIN FOOTER
========================================= */

.footer-main {
    display: grid;

    grid-template-columns:
        1.5fr 1fr 1fr 1.3fr;

    gap: 50px;

    padding: 20px 0;

    border-top: 1px solid rgba(255,255,255,.08);

    border-bottom: 1px solid rgba(255,255,255,.08);
}


/* Brand */

.footer-logo span {
    display: block;

    color: #aaa;

    font-size: 11px;

    letter-spacing: 4px;
}


.footer-logo strong {
    display: block;

    margin-top: 4px;

    font-size: 27px;

    letter-spacing: 2px;
}


.footer-logo strong b {
    color: #ffb703;
}


.footer-brand > p {
    max-width: 330px;

    margin: 20px 0;

    color: #858b95;

    font-size: 14px;

    line-height: 1.8;
}


.footer-tagline {
    color: #ffb703;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.5px;
}


.footer-tagline i {
    color: #777;

    font-style: normal;

    padding: 0 6px;
}


/* Links */

.footer-links h4 {
    margin: 0 0 20px;

    color: #fff;

    font-size: 15px;
}


.footer-links a {
    display: block;

    margin-bottom: 11px;

    color: #858b95;

    font-size: 13px;

    text-decoration: none;

    transition: .3s ease;
}


.footer-links a:hover {
    color: #ffb703;

    transform: translateX(4px);
}


/* Address */

.footer-address p {
    display: flex;

    gap: 10px;

    align-items: flex-start;

    color: #858b95;

    font-size: 13px;

    line-height: 1.6;
}


.footer-address p i {
    margin-top: 4px;

    color: #ffb703;
}


.footer-address p a {
    margin: 0;
}


/* =========================================
   BOTTOM
========================================= */

.footer-bottom {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    padding-top: 25px;
}


.footer-bottom p {
    margin: 0;

    color: #656b74;

    font-size: 12px;
}


.footer-bottom strong {
    color: #aaa;
}


/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991px) {

    .footer-contact-grid {
        grid-template-columns: 1fr 1fr;
    }

    .footer-contact-box:last-child {
        grid-column: span 2;
    }

    .footer-main {
        grid-template-columns: 1fr 1fr;
    }
}


@media (max-width: 767px) {

    .lp9-footer {
        padding: 70px 20px 20px;
    }


    .footer-cta {
        margin-bottom: 50px;
    }


    .footer-cta h2 {
        font-size: 38px;
    }


    .footer-contact-grid {
        grid-template-columns: 1fr;

        margin-bottom: 50px;
    }


    .footer-contact-box:last-child {
        grid-column: auto;
    }


    .footer-main {
        grid-template-columns: 1fr;

        gap: 35px;

        padding: 45px 0;
    }


    .footer-bottom {
        flex-direction: column;

        text-align: center;
    }


    .footer-ring-1 {
        width: 450px;
        height: 450px;
    }


    .footer-ring-2 {
        width: 650px;
        height: 650px;
    }

}

/* =========================================
   FLOATING CONTACT BUTTONS
========================================= */

.floating-contact {
    position: fixed;

    right: 22px;
    bottom: 25px;

    display: flex;
    flex-direction: column;

    gap: 12px;

    z-index: 99999;
}


/* Main Button */

.floating-btn {
    position: relative;

    width: 56px;
    height: 56px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #fff;

    font-size: 25px;

    text-decoration: none;

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.25);

    transition: all 0.3s ease;

    animation: floatingPulse 2.5s infinite;
}


/* WhatsApp */

.whatsapp-btn {
    background: #25D366;
}


/* Call */

.call-btn {
    background: #ffb703;
    color: #111;
}


/* Hover */

.floating-btn:hover {
    transform: scale(1.12);

    color: #fff;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.35);
}


.call-btn:hover {
    color: #111;
}


/* =========================================
   PULSE ANIMATION
========================================= */

@keyframes floatingPulse {

    0% {
        box-shadow:
            0 0 0 0 rgba(255, 183, 3, 0.35),
            0 8px 25px rgba(0, 0, 0, 0.25);
    }

    70% {
        box-shadow:
            0 0 0 12px rgba(255, 183, 3, 0),
            0 8px 25px rgba(0, 0, 0, 0.25);
    }

    100% {
        box-shadow:
            0 0 0 0 rgba(255, 183, 3, 0),
            0 8px 25px rgba(0, 0, 0, 0.25);
    }
}


/* =========================================
   TOOLTIP
========================================= */

.floating-tooltip {
    position: absolute;

    right: 70px;

    top: 50%;

    transform:
        translateY(-50%)
        translateX(10px);

    padding: 8px 13px;

    border-radius: 6px;

    background: #111;

    color: #fff;

    font-size: 12px;

    font-weight: 600;

    white-space: nowrap;

    opacity: 0;

    visibility: hidden;

    transition: all 0.3s ease;

    pointer-events: none;
}


.floating-tooltip::after {
    content: "";

    position: absolute;

    right: -5px;

    top: 50%;

    transform: translateY(-50%) rotate(45deg);

    width: 10px;
    height: 10px;

    background: #111;
}


.floating-btn:hover .floating-tooltip {

    opacity: 1;

    visibility: visible;

    transform:
        translateY(-50%)
        translateX(0);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 575px) {

    .floating-contact {

        right: 15px;
        bottom: 18px;

        gap: 10px;
    }


    .floating-btn {

        width: 50px;
        height: 50px;

        font-size: 21px;
    }


    .floating-tooltip {
        display: none;
    }

}

/* ==========================================
   GALLERY SECTION
========================================== */
/* ==========================================
   LIGHT GALLERY SECTION
========================================== */

.light-gallery-section {

    position: relative;

    padding: 100px 0;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #faf9f5 50%,
            #ffffff 100%
        );
}


/* ==========================================
   BACKGROUND
========================================== */

.light-gallery-bg {

    position: absolute;

    inset: 0;

    overflow: hidden;

    pointer-events: none;
}


/* Golden Glow */

.gallery-light-orb {

    position: absolute;

    width: 400px;
    height: 400px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 183, 3, .12),
            transparent 70%
        );

    filter: blur(20px);
}


.orb-one {

    left: -180px;
    top: -180px;

    animation:
        lightOrbOne 12s ease-in-out infinite alternate;
}


.orb-two {

    right: -180px;
    bottom: -180px;

    animation:
        lightOrbTwo 15s ease-in-out infinite alternate;
}


@keyframes lightOrbOne {

    0% {
        transform: translate(0,0);
    }

    100% {
        transform:
            translate(150px,120px)
            scale(1.15);
    }
}


@keyframes lightOrbTwo {

    0% {
        transform: translate(0,0);
    }

    100% {
        transform:
            translate(-120px,-100px)
            scale(1.2);
    }
}


/* ==========================================
   BACKGROUND RINGS
========================================== */

.gallery-light-ring {

    position: absolute;

    left: 50%;
    top: 50%;

    border-radius: 50%;

    transform:
        translate(-50%,-50%);

    border:
        1px solid rgba(190,145,20,.08);

    animation:
        lightRingAnimation 10s ease-in-out infinite;
}


.ring-one {

    width: 600px;
    height: 600px;
}


.ring-two {

    width: 900px;
    height: 900px;

    border-color:
        rgba(190,145,20,.04);

    animation-delay: 2s;
}


@keyframes lightRingAnimation {

    0% {
        transform:
            translate(-50%,-50%)
            scale(.92);

        opacity: .3;
    }

    50% {
        transform:
            translate(-50%,-50%)
            scale(1.04);

        opacity: .7;
    }

    100% {
        transform:
            translate(-50%,-50%)
            scale(.92);

        opacity: .3;
    }
}


/* ==========================================
   SWIPER
========================================== */

.light-gallery-slider {

    position: relative;

    z-index: 2;

    padding:
        15px 5px 70px !important;
}


.light-gallery-slider
.swiper-slide {

    height: auto;
}


/* ==========================================
   IMAGE CARD
========================================== */

.light-gallery-card {

    position: relative;

    height: 400px;

    overflow: hidden;

    border-radius: 20px;

    background: #fff;

    cursor: pointer;

    border:
        1px solid rgba(30,30,30,.08);

    box-shadow:
        0 15px 40px rgba(0,0,0,.08);

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.light-gallery-card:hover {

    transform:
        translateY(-8px);

    border-color:
        rgba(190,145,20,.35);

    box-shadow:
        0 25px 60px rgba(0,0,0,.14);
}


/* Image */

.light-gallery-card img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .8s
        cubic-bezier(.2,.7,.2,1);
}


.light-gallery-card:hover img {

    transform:
        scale(1.08);
}


/* ==========================================
   HOVER OVERLAY
========================================== */

.light-gallery-overlay {

    position: absolute;

    inset: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    background:
        rgba(0,0,0,.20);

    opacity: 0;

    transition: .35s ease;
}


.light-gallery-card:hover
.light-gallery-overlay {

    opacity: 1;
}


/* Zoom Button */

.light-gallery-zoom {

    width: 62px;
    height: 62px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        rgba(255,255,255,.95);

    color: #b58300;

    font-size: 19px;

    box-shadow:
        0 10px 30px rgba(0,0,0,.18);

    transform:
        scale(.7);

    transition: .4s ease;
}


.light-gallery-card:hover
.light-gallery-zoom {

    transform:
        scale(1);
}


/* ==========================================
   NAVIGATION
========================================== */

.light-gallery-prev,
.light-gallery-next {

    position: absolute;

    top: 43%;

    z-index: 10;

    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    border: none;

    border-radius: 50%;

    background: #fff;

    color: #333;

    box-shadow:
        0 8px 25px rgba(0,0,0,.12);

    cursor: pointer;

    transition: .3s ease;
}


.light-gallery-prev {

    left: 0;
}


.light-gallery-next {

    right: 0;
}


.light-gallery-prev:hover,
.light-gallery-next:hover {

    background: #ffb703;

    color: #111;

    transform: scale(1.08);
}


/* ==========================================
   PAGINATION
========================================== */

.light-gallery-pagination {

    position: absolute !important;

    bottom: 5px !important;

    left: 50% !important;

    transform:
        translateX(-50%);

    display: flex;

    justify-content: center;

    gap: 5px;

    width: auto !important;
}


.light-gallery-pagination
.swiper-pagination-bullet {

    width: 7px;
    height: 7px;

    margin: 0 !important;

    opacity: 1;

    background: #d2d2d2;

    transition: .3s ease;
}


.light-gallery-pagination
.swiper-pagination-bullet-active {

    width: 22px;

    border-radius: 10px;

    background: #c89400;
}


/* ==========================================
   LIGHTBOX
========================================== */

.light-gallery-modal {

    position: fixed;

    inset: 0;

    z-index: 999999;

    display: flex;

    align-items: center;
    justify-content: center;

    padding: 30px;

    background:rgb(14 12 12 / 65%);

    backdrop-filter: blur(15px);

    opacity: 0;

    visibility: hidden;

    transition:
        opacity .35s ease,
        visibility .35s ease;
}


.light-gallery-modal.active {

    opacity: 1;

    visibility: visible;
}


/* Image */

.light-modal-image-wrap {

    max-width: 1150px;

    width: 90%;

    text-align: center;
}


.light-modal-image-wrap img {

    max-width: 100%;

    max-height: 82vh;

    width: auto;

    display: block;

    margin: auto;

    object-fit: contain;

    border-radius: 10px;

    box-shadow:
        0 25px 70px rgba(0,0,0,.22);

    animation:
        modalImageShow .4s ease;
}


@keyframes modalImageShow {

    from {
        opacity: 0;

        transform:
            scale(.9);
    }

    to {
        opacity: 1;

        transform:
            scale(1);
    }
}


/* ==========================================
   CLOSE BUTTON
========================================== */

.light-modal-close {

    position: absolute;

    top: 25px;
    right: 30px;

    width: 50px;
    height: 50px;

    display: flex;

    align-items: center;
    justify-content: center;

    border: none;

    border-radius: 50%;

    background: #fff;

    color: #222;

    font-size: 20px;

    cursor: pointer;

    box-shadow:
        0 8px 25px rgba(0,0,0,.12);

    transition: .3s ease;
}


.light-modal-close:hover {

    background: #ffb703;

    transform:
        rotate(90deg);
}


/* ==========================================
   LIGHTBOX ARROWS
========================================== */

.light-modal-prev,
.light-modal-next {

    position: absolute;

    top: 50%;

    transform:
        translateY(-50%);

    width: 52px;
    height: 52px;

    display: flex;

    align-items: center;
    justify-content: center;

    border: none;

    border-radius: 50%;

    background: #fff;

    color: #333;

    font-size: 17px;

    cursor: pointer;

    box-shadow:
        0 10px 30px rgba(0,0,0,.12);

    transition: .3s ease;
}


.light-modal-prev {

    left: 30px;
}


.light-modal-next {

    right: 30px;
}


.light-modal-prev:hover,
.light-modal-next:hover {

    background: #ffb703;

    color: #111;

    transform:
        translateY(-50%)
        scale(1.08);
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 991px) {

    .light-gallery-card {

        height: 360px;
    }

    .light-gallery-prev {

        left: 8px;
    }

    .light-gallery-next {

        right: 8px;
    }
}


@media (max-width: 767px) {

    .light-gallery-section {

        padding: 70px 20px;
    }


    .light-gallery-card {

        height: 380px;

        border-radius: 17px;
    }


    /* Always show zoom on mobile */

    .light-gallery-overlay {

        opacity: 1;

        background:
            rgba(0,0,0,.08);
    }


    .light-gallery-zoom {

        width: 52px;
        height: 52px;

        font-size: 16px;
    }


    .light-gallery-prev,
    .light-gallery-next {

        width: 42px;
        height: 42px;

        top: 43%;
    }


    .light-gallery-prev {

        left: 5px;
    }


    .light-gallery-next {

        right: 5px;
    }


    .light-gallery-modal {

        padding: 20px;
    }


    .light-modal-image-wrap {

        width: 100%;
    }


    .light-modal-image-wrap img {

        max-height: 75vh;
    }


    .light-modal-close {

        top: 15px;
        right: 15px;

        width: 44px;
        height: 44px;
    }


    .light-modal-prev,
    .light-modal-next {

        width: 42px;
        height: 42px;
    }


    .light-modal-prev {

        left: 10px;
    }


    .light-modal-next {

        right: 10px;
    }
}

/* ==========================================
   LAW OF PAISALOGY 9
   CORE FOUNDATION
========================================== */

.lp9-foundation-section {

    position: relative;

    padding:38px 0;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #fffdf7 45%,
            #f8f7f2 100%
        );

    color: #202020;
}


/* ==========================================
   ANIMATED BACKGROUND
========================================== */

.foundation-bg {

    position: absolute;

    inset: 0;

    overflow: hidden;

    pointer-events: none;
}


.foundation-orb {

    position: absolute;

    width: 450px;
    height: 450px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(255, 190, 30, .12),
            transparent 70%
        );

    filter: blur(20px);
}


.orb-left {

    top: -220px;
    left: -200px;

    animation:
        foundationOrbLeft 12s
        ease-in-out infinite alternate;
}


.orb-right {

    right: -200px;
    bottom: -250px;

    animation:
        foundationOrbRight 15s
        ease-in-out infinite alternate;
}


@keyframes foundationOrbLeft {

    0% {
        transform: translate(0,0);
    }

    100% {
        transform:
            translate(180px,150px)
            scale(1.15);
    }
}


@keyframes foundationOrbRight {

    0% {
        transform: translate(0,0);
    }

    100% {
        transform:
            translate(-160px,-120px)
            scale(1.2);
    }
}


/* ==========================================
   FLOATING DOTS
========================================== */

.foundation-dot {

    position: absolute;

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: #e5ad18;

    opacity: .4;

    animation:
        floatingDot 7s
        ease-in-out infinite;
}


.dot-1 {
    top: 20%;
    left: 8%;
}


.dot-2 {
    top: 65%;
    left: 18%;

    animation-delay: 1s;
}


.dot-3 {
    top: 25%;
    right: 12%;

    animation-delay: 2s;
}


.dot-4 {
    bottom: 15%;
    right: 25%;

    animation-delay: 3s;
}


@keyframes floatingDot {

    0%,
    100% {
        transform:
            translateY(0)
            scale(1);
    }

    50% {
        transform:
            translateY(-25px)
            scale(1.5);
    }
}


/* ==========================================
   CIRCLES
========================================== */

.foundation-circle {

    position: absolute;

    left: 50%;
    top: 50%;

    border-radius: 50%;

    border:
        1px solid
        rgba(206, 158, 22, .06);

    transform:
        translate(-50%,-50%);

    animation:
        foundationCircle 10s
        ease-in-out infinite;
}


.circle-1 {

    width: 600px;
    height: 600px;
}


.circle-2 {

    width: 900px;
    height: 900px;

    animation-delay: 2s;
}


@keyframes foundationCircle {

    0% {
        transform:
            translate(-50%,-50%)
            scale(.92);

        opacity: .2;
    }

    50% {
        transform:
            translate(-50%,-50%)
            scale(1.05);

        opacity: .7;
    }

    100% {
        transform:
            translate(-50%,-50%)
            scale(.92);

        opacity: .2;
    }
}


/* ==========================================
   HEADING
========================================== */

.foundation-heading {

    position: relative;

    z-index: 2;

    max-width: 750px;

    margin: 0 auto 60px;

    text-align: center;
}


.foundation-tag {

    display: inline-block;

    margin-bottom: 14px;

    color: #b78600;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 3px;
}


.foundation-heading h2 {

    margin: 0 0 18px;

   font-family: var(--font-display);
    font-weight: 600;
    font-size: clamp(1.9rem, 3.4vw, 2.75rem);

    line-height: 1.1;

}


.foundation-heading h2 span {

    color: #c28b00;
}


.foundation-heading p {

    margin: 0 auto;

    max-width: 620px;

    color: #777;

    font-size: 16px;

    line-height: 1.8;
}


/* ==========================================
   FOUNDATION CARD
========================================== */

.foundation-card {

    position: relative;

    height: 100%;

    padding: 38px;

    overflow: hidden;

    border-radius: 28px;

    background:
        rgba(255,255,255,.88);

    border:
        1px solid rgba(30,30,30,.08);

    box-shadow:
        0 20px 60px rgba(30,30,30,.08);

    backdrop-filter: blur(12px);

    transition:
        transform .45s ease,
        box-shadow .45s ease;
}


.foundation-card:hover {

    transform:
        translateY(-8px);

    box-shadow:
        0 30px 80px rgba(30,30,30,.12);
}


/* Top */

.card-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 0px;
}


.foundation-number {

    color: #c99a16;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 2px;
}


.foundation-icon {

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 17px;

    background:
        linear-gradient(
            135deg,
            #fff4c9,
            #fff9e9
        );

    color: #c18a00;

    font-size: 23px;

    box-shadow:
        0 10px 25px
        rgba(193,138,0,.12);
}


/* ==========================================
   CARD CONTENT
========================================== */

.small-label {

    color: #a98216;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}


.foundation-card h3 {

    margin: 8px 0 0;

    font-size: 36px;

    font-weight: 800;

    color: #202020;
}


.foundation-card h3 span {

    font-size: 19px;

    color: #999;

    font-weight: 500;
}


.gold-line {

    width: 55px;
    height: 3px;

    margin: 18px 0 20px;

    border-radius: 5px;

    background:
        linear-gradient(
            90deg,
            #c89500,
            #f5d66a
        );
}


.foundation-intro {

    margin-bottom: 25px;

    color: #686868;

    font-size: 15px;

    line-height: 1.8;
}


/* ==========================================
   SKILL POINTS
========================================== */

.foundation-points {

    display: flex;

    flex-direction: column;

    gap: 14px;
}


.foundation-point {

    display: flex;

    align-items: flex-start;

    gap: 13px;

    padding: 13px;

    border-radius: 13px;

    background:
        #faf9f4;

    border:
        1px solid rgba(0,0,0,.045);

    transition: .3s ease;
}


.foundation-point:hover {

    transform:
        translateX(5px);

    background:
        #fff8df;

    border-color:
        rgba(201,154,22,.15);
}


.point-icon {

    flex: 0 0 34px;

    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 9px;

    background: #fff0b9;

    color: #b88300;

    font-size: 13px;
}


.foundation-point p {

    margin: 0;

    color: #666;

    font-size: 13px;

    line-height: 1.65;
}


.foundation-point strong {

    color: #333;
}


/* ==========================================
   HIGHLIGHT
========================================== */

.foundation-highlight {

    display: flex;

    gap: 15px;

    margin-top: 25px;

    padding: 18px;

    border-radius: 16px;

    background:
        linear-gradient(
            135deg,
            #fff6d4,
            #fffdf3
        );

    border:
        1px solid
        rgba(201,154,22,.18);
}


.foundation-highlight > i {

    color: #c08a00;

    font-size: 18px;

    margin-top: 3px;
}


.foundation-highlight strong {

    display: block;

    margin-bottom: 5px;

    color: #8c6800;

    font-size: 13px;
}


.foundation-highlight p {

    margin: 0;

    color: #70684f;

    font-size: 12px;

    line-height: 1.6;
}


/* ==========================================
   INERGY FLOW
========================================== */

.energy-flow {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 7px;

    margin: 25px 0;

    padding: 18px 12px;

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            #fffaf0,
            #f9f8f3
        );

    border:
        1px solid rgba(0,0,0,.05);
}


.energy-step {

    display: flex;

    flex-direction: column;

    align-items: center;

    gap: 7px;

    text-align: center;
}


.energy-icon {

    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        #fff0b5;

    color: #b88300;

    font-size: 14px;

    animation:
        energyPulse 3s
        ease-in-out infinite;
}


.energy-step span {

    color: #666;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: .5px;
}


.energy-arrow {

    color: #d0a329;

    font-size: 18px;

    animation:
        arrowPulse 2s
        ease-in-out infinite;
}


@keyframes energyPulse {

    0%,
    100% {
        box-shadow:
            0 0 0 0
            rgba(213,164,30,.15);
    }

    50% {
        box-shadow:
            0 0 0 8px
            rgba(213,164,30,0);
    }
}


@keyframes arrowPulse {

    0%,
    100% {
        opacity: .35;
    }

    50% {
        opacity: 1;
    }
}


/* ==========================================
   INERGY POINTS
========================================== */

.inergy-points {

    display: flex;

    flex-direction: column;

    gap: 13px;
}


.inergy-point {

    display: flex;

    align-items: flex-start;

    gap: 11px;

    color: #646464;

    font-size: 13px;

    line-height: 1.7;
}


.inergy-point i {

    flex: 0 0 20px;

    width: 20px;
    height: 20px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #fff0b5;

    color: #ad7e00;

    font-size: 9px;

    margin-top: 2px;
}


/* ==========================================
   IMPORTANT MESSAGE
========================================== */

.inergy-message {

    display: flex;

    gap: 15px;

    margin-top: 25px;

    padding: 20px;

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            #202020,
            #34312a
        );

    color: #fff;

    box-shadow:
        0 15px 35px
        rgba(0,0,0,.12);
}


.message-icon {

    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background:
        #ffca32;

    color: #222;

    font-size: 13px;
}


.inergy-message span {

    display: block;

    margin-bottom: 8px;

    color: #ffca32;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.inergy-message p {

    margin: 0;

    color: #d9d9d9;

    font-size: 12px;

    line-height: 1.7;
}


.inergy-message strong {

    color: #fff;
}


/* ==========================================
   BOTTOM FLOW
========================================== */

.foundation-bottom {

    position: relative;

    margin-top: 55px;

    text-align: center;
}


.bottom-line {

    width: 100%;

    height: 1px;

    margin-bottom: 30px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(194,139,0,.25),
            transparent
        );
}


.bottom-content {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 15px;
}


.bottom-content span {

    color: #8c8c8c;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1px;
}


.bottom-content i {

    color: #c49209;

    font-size: 11px;
}


.bottom-content .success-text {

    color: #bd8500;
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 991px) {

    .lp9-foundation-section {

        padding: 80px 20px;
    }


    .foundation-card {

        padding: 30px;
    }


    .energy-flow {

        gap: 4px;
    }

}


@media (max-width: 575px) {

    .lp9-foundation-section {

        padding: 65px 15px;
    }


    .foundation-heading {

        margin-bottom: 35px;
    }


    .foundation-heading h2 {

        font-size: 34px;
    }


    .foundation-heading p {

        font-size: 14px;
    }


    .foundation-card {

        padding: 23px;

        border-radius: 20px;
    }


    .foundation-card h3 {

        font-size: 29px;
    }


    .energy-flow {

        overflow-x: auto;

        justify-content: flex-start;

        padding: 15px 10px;

        gap: 10px;
    }


    .energy-step {

        min-width: 55px;
    }


    .energy-arrow {

        flex: 0 0 auto;
    }


    .bottom-content {

        gap: 9px;
    }


    .bottom-content i {

        font-size: 9px;
    }


    .bottom-content span {

        font-size: 9px;
    }


    .foundation-highlight,
    .inergy-message {

        padding: 15px;
    }

}


/* ==========================================
   FRAMEWORK SECTION
========================================== */

.framework-section {
    padding: 80px 0;
    background: #f8f7f3;
    overflow: hidden;
}


/* ==========================================
   SWIPER
========================================== */

.framework-swiper {
    width: 100%;
    overflow: hidden;
}

.framework-swiper .swiper-wrapper {
    align-items: stretch;
}

.framework-swiper .swiper-slide {
    height: auto;
    display: flex;
}


/* ==========================================
   FRAMEWORK CARD
========================================== */

.framework-card {
    width: 100%;
    height: 100%;
    background: #ffffff;

    border-radius: 3px;

    overflow: hidden;

    display: flex;
    flex-direction: column;

    box-shadow: 0 15px 45px rgba(0, 0, 0, 0.07);

    transition: all 0.4s ease;
}

.framework-card:hover {
    transform: translateY(-5px);

    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.11);
}


/* ==========================================
   IMAGE
========================================== */

.framework-image {
    position: relative;

    width: 100%;
    height: 300px;

    overflow: hidden;
}

.framework-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform 0.6s ease;
}

.framework-card:hover .framework-image img {
    transform: scale(1.04);
}


/* ==========================================
   NUMBER CIRCLE
========================================== */

.framework-number {
    position: absolute;

    left: 25px;
    bottom: 25px;

    width: 70px;
    height: 70px;

    background: #ffffff;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 20px;
    font-weight: 700;

    color: #0c1b2e;

    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
}


/* ==========================================
   CONTENT
========================================== */

.framework-content {
    padding: 35px 35px 40px;

    display: flex;
    flex-direction: column;

    flex: 1;
}


/* Small Framework Text */

.framework-label {
    display: block;

    margin-bottom: 10px;

    font-size: 12px;
    font-weight: 700;

    letter-spacing: 4px;

    color: #c7942c;

    text-transform: uppercase;
}


/* Main Heading */

.framework-content h2 {
    margin: 0 0 8px;

    font-size: 30px;
    line-height: 1.1;

    font-weight: 800;

    color: #0c1b2e;

    letter-spacing: 1px;
}


/* Sub Heading */

.framework-content h4 {
    margin: 0 0 6px;
    font-size: 16px;
    line-height: 1.4;

    font-weight: 500;

    color: #c7942c;
}


/* Description */

.framework-content p {
    margin: 0;
    font-size: 15px;
    line-height: 22px;
    color: #53657a;
    font-weight: 400;
}


/* ==========================================
   EXPLORE LINK
========================================== */

.framework-link {
    display: inline-flex;
    align-items: center;
    gap: 18px;

    margin-top: 30px;

    padding-bottom: 12px;

    width: fit-content;

    font-size: 15px;
    font-weight: 700;

    color: #0c1b2e;

    text-decoration: none;

    border-bottom: 1px solid #c7942c;

    transition: all 0.3s ease;
}

.framework-link span {
    font-size: 22px;

    color: #c7942c;

    transition: transform 0.3s ease;
}

.framework-link:hover {
    color: #c7942c;
}

.framework-link:hover span {
    transform: translateX(6px);
}


/* ==========================================
   NAVIGATION
========================================== */

.framework-navigation {
    margin-top: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 25px;
}


/* Arrows */

.framework-prev,
.framework-next {
    width: 48px;
    height: 48px;

    border: 1px solid #d6d0c5;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;

    font-size: 20px;

    color: #0c1b2e;

    transition: all 0.3s ease;
}

.framework-prev:hover,
.framework-next:hover {
    background: #c7942c;

    border-color: #c7942c;

    color: #ffffff;
}


/* Pagination */

.framework-pagination {
    position: static !important;

    width: auto !important;
}

.framework-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;

    margin: 0 5px !important;

    opacity: 1;

    background: #d5d0c8;

    transition: all 0.3s ease;
}

.framework-pagination .swiper-pagination-bullet-active {
    width: 25px;

    border-radius: 10px;

    background: #c7942c;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 991px) {

    .framework-section {
        padding: 60px 0;
    }

    .framework-image {
        height: 260px;
    }

    .framework-content {
        padding: 30px;
    }

    .framework-content h2 {
        font-size: 36px;
    }

    .framework-content h4 {
        font-size: 18px;
    }

    .framework-content p {
        font-size: 15px;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .framework-section {
        padding: 45px 0;
    }

    .framework-image {
        height: 230px;
    }

    .framework-number {
        width: 60px;
        height: 60px;

        left: 18px;
        bottom: 18px;

        font-size: 17px;
    }

    .framework-content {
        padding: 25px 22px 30px;
    }

    .framework-label {
        font-size: 10px;

        letter-spacing: 3px;
    }

    .framework-content h2 {
        font-size: 32px;
    }

    .framework-content h4 {
        font-size: 17px;

        margin-bottom: 15px;
    }

    .framework-content p {
        font-size: 14px;

        line-height: 1.7;
    }

    .framework-link {
        margin-top: 25px;
    }

    .framework-navigation {
        margin-top: 30px;

        gap: 15px;
    }

    .framework-prev,
    .framework-next {
        width: 42px;
        height: 42px;

        font-size: 17px;
    }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 480px) {

    .framework-image {
        height: 210px;
    }

    .framework-content h2 {
        font-size: 28px;
    }

    .framework-content p {
        font-size: 13.5px;
    }

}

/* ============================================
   LAW OF PAISALOGY 9
============================================= */

.paisalogy-section {
    padding: 10px 0;
    background: #f7f5f0;
    overflow: hidden;
}


/* ============================================
   SECTION HEADING
============================================= */

.paisalogy-heading {
    max-width: 900px;
    margin: 0 auto 10px;
    text-align: center;
}

.paisalogy-subtitle {
    display: inline-block;

    margin-bottom: 15px;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 4px;

    color: #c7942c;
    text-transform: uppercase;
}

.paisalogy-heading h2 {
    margin: 0 0 18px;
    font-family: var(--font-display);
    font-weight: 600;
    font-size:25px;
    line-height: 1.1;
}

.paisalogy-heading h2 span {
    color: #c7942c;
}

.paisalogy-heading p {
    max-width: 750px;
    margin: auto;

    font-size: 17px;
    line-height: 1.8;

    color: #5d6c7d;
}


/* ============================================
   TWO COLUMN GRID
============================================= */

.paisalogy-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 30px;

    align-items: start;
}


/* ============================================
   CARD
============================================= */

.paisalogy-card {
    position: relative;

    padding: 23px;

    background: #ffffff;

    border: 1px solid #ebe7df;

    border-radius: 4px;

    box-shadow: 0 20px 60px rgba(13, 28, 47, 0.07);

    overflow: hidden;
}


/* Gold top line */

.paisalogy-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background: #c7942c;
}


/* ============================================
   CARD TOP
============================================= */

.paisalogy-card-top {
    display: flex;

    align-items: center;

    gap: 18px;

    margin-bottom: 28px;
}

.paisalogy-number {
    width: 55px;
    height: 55px;

    flex-shrink: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #0d1c2f;

    color: #ffffff;

    font-size: 17px;
    font-weight: 700;
}

.paisalogy-card-label {
    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;

    color: #c7942c;
}


/* ============================================
   CARD HEADING
============================================= */

.paisalogy-card h3 {
    margin: 0;

    font-size: 31px;

    line-height: 1.25;

    color: #0d1c2f;

    font-weight: 800;
}


/* Gold line */

.paisalogy-line {
    width: 60px;
    height: 3px;

    margin: 22px 0 28px;

    background: #c7942c;
}


/* ============================================
   CONTENT
============================================= */

.paisalogy-card > p {
    margin: 0 0 8px;
    font-size: 12px;
    line-height: 20px;
    color: #53657a;
}

.paisalogy-card strong {
    color: #0d1c2f;

    font-weight: 700;
}


/* ============================================
   QUESTIONS
============================================= */

.paisalogy-questions {
    margin: 25px 0;

    padding: 20px;

    background: #f8f6f1;

    border-left: 3px solid #c7942c;
}

.question-item {
    padding: 9px 0;

    font-size: 15px;

    line-height: 1.5;

    color: #526277;

    border-bottom: 1px solid #e6e1d8;
}

.question-item:last-child {
    border-bottom: none;
}


/* ============================================
   TRANSFORMATION
============================================= */

.paisalogy-transform {
    margin-top: 30px;

    padding: 20px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 15px;

    flex-wrap: wrap;

    background: #0d1c2f;

    border-radius: 3px;

    color: #ffffff;

    text-align: center;
}

.paisalogy-transform span {
    font-size: 12px;

    font-weight: 700;

    letter-spacing: 1.5px;
}

.paisalogy-transform strong {
    color: #c7942c;

    font-size: 22px;
}


/* ============================================
   PRINCIPLE FLOW
============================================= */

.paisalogy-flow {
    margin: 7px 0;
    padding: 6px;
    
    text-align: center;
    border-radius: 3px;
}

.paisalogy-flow span {
    display: block;
    padding: 6px 15px;
    background: #ffffff;
    border: 1px solid #e8e3da;
    color: #0d1c2f;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1px;
}

.paisalogy-flow b {
    display: block;
    margin: 0px 0;
    margin: 3px 0;
    font-size: 14px;
}


/* ============================================
   WOMEN HIGHLIGHT
============================================= */

.women-highlight {
    margin-top: 12px;
    padding: 2px;
    padding: 29px;
    border: 1px solid #e6e0d4;
    border-radius: 4px;
}

.women-label {
    display: block;

    margin-bottom: 12px;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    color: #c7942c;

    text-transform: uppercase;
}

.women-highlight h4 {
    margin: 0 0 2px;

    font-size: 21px;

    color: #0d1c2f;
}


/* ============================================
   QUOTE COMPARISON
============================================= */

.quote-comparison {
    display: flex;

    align-items: stretch;

    gap: 10px;

    margin-bottom: 25px;
}

.quote-box {
    flex: 1;

    padding: 3px 5px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;

    background: #ffffff;

    border: 1px solid #e2ddd3;

    color: #0d1c2f;

    font-size: 14px;

    line-height: 1.6;

    font-weight: 600;
}

.quote-box span {
    margin: 0 5px;

    color: #c7942c;

    font-size: 22px;
}

.quote-vs {
    display: flex;

    align-items: center;
    justify-content: center;

    padding: 0 4px;

    color: #c7942c;

    font-size: 11px;

    font-weight: 800;
}

.women-highlight p {
    margin: 0 0 3px;
    font-size: 13px;
    
    color: #53657a;
}

.women-highlight p:last-child {
    margin-bottom: 0;
}


/* ============================================
   SKILL HIGHLIGHT
============================================= */

.skill-highlight {
    margin-top: 30px;

    padding: 30px;

    background: #0d1c2f;

    color: #ffffff;

    border-radius: 4px;
}

.skill-label {
    display: block;

    margin-bottom: 15px;

    color: #c7942c;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 3px;
}

.skill-highlight p {
    margin: 0 0 20px;

    font-size: 15px;

    line-height: 1.8;

    color: #e7ebef;
}

.skill-highlight strong {
    color: #ffffff;
}


/* ============================================
   SELF QUESTION
============================================= */

.self-question {
    padding: 22px;

    border-left: 3px solid #c7942c;

    background: rgba(255, 255, 255, 0.05);

    color: #ffffff;

    font-size: 16px;

    line-height: 1.7;

    font-weight: 500;

    font-style: italic;
}


/* ============================================
   SELF KILL
============================================= */

.self-kill-box {
    margin-top: 30px;

    padding: 30px;

    background: #fff8ef;

    border: 1px solid #ead9bd;

    border-radius: 4px;
}

.self-kill-title {
    display: inline-block;

    margin-bottom: 18px;

    padding: 8px 15px;

    background: #c7942c;

    color: #ffffff;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 2px;
}

.self-kill-box p {
    margin: 0 0 15px;

    font-size: 14.5px;

    line-height: 1.8;

    color: #596878;
}

.self-kill-box p:last-child {
    margin-bottom: 0;
}


/* ============================================
   FINAL MESSAGE
============================================= */

.paisalogy-final-message {
    margin-top: 30px;

    padding-top: 25px;

    border-top: 1px solid #e6e1d8;

    text-align: center;
}

.paisalogy-final-message span {
    display: block;

    margin-bottom: 10px;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 3px;

    color: #c7942c;
}

.paisalogy-final-message strong {
    display: block;

    font-size: 14px;

    letter-spacing: 1px;

    color: #0d1c2f;
}


/* ============================================
   TABLET
============================================= */

@media (max-width: 991px) {

    .paisalogy-section {
        padding: 70px 0;
    }

    .paisalogy-heading h2 {
        font-size: 38px;
    }

    .paisalogy-grid {
        gap: 20px;
    }

    .paisalogy-card {
        padding: 30px;
    }

    .paisalogy-card h3 {
        font-size: 27px;
    }

    .quote-comparison {
        flex-direction: column;
    }

    .quote-vs {
        padding: 5px;
    }

}


/* ============================================
   MOBILE
============================================= */

@media (max-width: 767px) {

    .paisalogy-section {
        padding: 55px 0;
    }

    .paisalogy-heading {
        margin-bottom: 35px;
    }

    .paisalogy-heading h2 {
        font-size: 30px;
    }

    .paisalogy-heading p {
        font-size: 14px;
    }

    /* One card per row */

    .paisalogy-grid {
        grid-template-columns: 1fr;

        gap: 25px;
    }

    .paisalogy-card {
        padding: 25px 20px;
    }

    .paisalogy-card-top {
        margin-bottom: 22px;
    }

    .paisalogy-number {
        width: 48px;
        height: 48px;

        font-size: 15px;
    }

    .paisalogy-card-label {
        font-size: 9px;

        letter-spacing: 2px;
    }

    .paisalogy-card h3 {
        font-size: 25px;
    }

    .paisalogy-card > p {
        font-size: 14px;

        line-height: 1.75;
    }

    .paisalogy-questions {
        padding: 15px;
    }

    .question-item {
        font-size: 13.5px;
    }

    .paisalogy-transform {
        gap: 10px;

        padding: 16px;
    }

    .paisalogy-transform span {
        font-size: 10px;
    }

    .paisalogy-transform strong {
        font-size: 18px;
    }

    .women-highlight,
    .skill-highlight,
    .self-kill-box {
        padding: 22px 18px;
    }

    .women-highlight h4 {
        font-size: 18px;
    }

    .self-question {
        font-size: 14px;
    }

    .paisalogy-final-message strong {
        font-size: 11px;

        line-height: 1.7;
    }

}


/* ============================================
   SMALL MOBILE
============================================= */

@media (max-width: 480px) {

    .paisalogy-heading h2 {
        font-size: 27px;
    }

    .paisalogy-card h3 {
        font-size: 23px;
    }

    .paisalogy-card {
        padding: 22px 17px;
    }

    .paisalogy-transform {
        flex-direction: column;
    }

    .paisalogy-transform strong {
        transform: rotate(90deg);
    }

}

/* ********************************mobile view******************************************** */
@media (max-width: 767px){

    .foundation-heading h2, .foundation-card h3, .philosophy-heading h2, .framework-heading h2,.framework-content h3, .ticker-body h3,.footer-cta h2,.footer-logo strong,.paisalogy-heading h2,.paisalogy-heading h2,.section-title {
        font-size: 20px;
        line-height: 30px;
    }

    .section-lead, .foundation-intro, .foundation-point p, .philosophy-heading p, .framework-heading p, .framework-content p,.ticker-body p, .chip-list li, .paisalogy-card > p,.accordion-panel p,.compare-panel li{
        font-size:13px;
    }
    .section-title{
        margin-bottom:0px;
    }
    .compare-cols{
        margin-top:0px;
    }
    .compare-panel{
        padding: 11px 7px;
    }
    .compare-panel li {
    padding: 4px 0 3px 18px;
    }

    .lp9-footer {
        padding: 11px 1px 17px;
    }

    .footer-cta {
        margin-bottom: 4px;
    }

    .light-gallery-section {
        padding: 16px 2px;
    }

    .accordion-trigger{
        padding:4px 4px;
            font-size: 13px;
    }


    .journey-flow strong{
        font-size: 9px;
    }

    .compare-panel h3 {
    font-family: var(--font-display);
    font-size: 1.2rem;
    margin-bottom: 0px;
}

    .journey-flow i {
        transform: rotate(0deg);
    }

    .journey-flow {
        flex-direction: row !important;
        gap: 2px;
    }

    .journey-flow i {
    font-style: normal;
    color: #c79a3b;
    font-size: 9px;
}

    .hindi-content span {
    display: block;
    margin-bottom: 1px;
    }
    .framework-heading {
        margin-bottom: 23px;
    }
    .journey-flow {
        flex-direction: column;
        gap: 2px;
    }
    .hindi-content h3 {
        font-size: 9px;
        line-height: 1.8;
    }

        .hindi-philosophy {
        flex-direction: column;
        text-align: center;
        padding: 10px 7px;
        gap: 9px;
    }

    .hindi-icon {
    
    width: 42px;
    height: 42px;
   
    font-size: 18px;
}

    .philosophy-card p {
    margin: 0;
    color: #999faa;
    font-size: 11px;
    line-height: 16px;
}

    .philosophy-section {
        padding: 14px 1px;
    }

    .philosophy-heading {
        margin-bottom: 9px;
    }

    .philosophy-card h3 {
    margin: 0 0 6px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1px;
    font-weight: 00;
}

        .philosophy-card {
        width: 100%;
        min-height: auto;
        padding: 8px 8px;
    }
    .philosophy-icon{
        width: 46px;
    height: 46px;
    margin: 0 auto 8px;
    font-size: 16px;
    }

    .philosophy-flow {

display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 18px;

}

    .paisalogy-card h3 {
        font-size: 15px;
    }
    .footer-contact-box{
        padding:9px;
    }

    .section-title{
        font-size:20px;
    }

    .section {
        padding: 4px 0;
    }

    .hero-cta{
        margin-bottom:0px;
    }

    .hero{
        padding: 121px 0 7px;
    }

    .btn-primary{
        font-size: 11px;
    padding: 9px 18px;
    }

    .hero-sub {
    color: rgba(247, 244, 238, .72);
    font-size: 11px;
    line-height: 17px;
    }

    .hero-title{
        font-size:20px;
    }

  .mobile-menu a {
    color: rgb(0 0 0 / 85%);
    padding: 5px 4px;
    border-top: 1px solid var(--line-light);
    font-size: 12px;
}

}