/* Iboga Facilitator Training (training.theibogasource.com/iboga-facilitator-training).
   Loads after transcend.css, which carries the shared Iboga Source look (earth black, sand gold,
   the woven pavilion arch, the header, the buttons). This file adds the training's own pieces.
   Its signature is the channel: a column of light down the page that fills as you read,
   the way the light pours through a clear channel. */

/* ---------- hero: the light pours from above, the words get a soft halo to sit on the beam ---------- */
.train-hero .hero-stage{--ox:50%;--oy:71%}
@media (max-aspect-ratio: 4/5){.train-hero .hero-stage{--oy:60%}}
.train-hero .hero-copy::before{content:"";position:absolute;inset:-14% -6% -22%;z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(6,9,18,.62),rgba(6,9,18,.3) 58%,transparent);filter:blur(8px)}
.train-hero .hero-caption{color:#3d2a10}

/* ---------- the channel: a rail of light on wide screens, one node per section ---------- */
.channel{position:fixed;left:max(16px, env(safe-area-inset-left, 0px));top:50%;z-index:20;width:14px;height:min(64vh, 580px);transform:translateY(-50%);
  display:none;opacity:0;pointer-events:none;transition:opacity .45s ease}
.channel.on{opacity:1;pointer-events:auto}
@media (min-width:1320px){.channel{display:block}}
.channel-line{position:absolute;left:6px;top:0;bottom:0;width:2px;border-radius:2px;background:rgba(217,173,112,.16);overflow:hidden}
.channel-fill{position:absolute;left:0;right:0;top:0;height:100%;transform-origin:top;transform:scaleY(var(--p,0));
  background:linear-gradient(180deg,#fffaf0,var(--sand-hi) 35%,var(--sand));box-shadow:0 0 12px rgba(241,214,162,.9)}
.channel ol{list-style:none;margin:0;padding:0;position:absolute;inset:0}
.channel li{position:absolute;left:0;top:var(--y,0)}
.channel a{position:absolute;left:0;top:-7px;width:14px;height:14px;display:block;text-decoration:none;border-radius:3px}
.channel a::before{content:"";position:absolute;inset:3px;transform:rotate(45deg);border:1px solid var(--sand-lo);background:var(--earth);transition:background .3s,border-color .3s,box-shadow .3s}
.channel li.lit a::before{background:var(--sand);border-color:var(--sand-hi)}
.channel li.here a::before{background:#fff6e2;box-shadow:0 0 0 4px rgba(241,214,162,.16),0 0 16px rgba(241,214,162,.85)}
.channel a span{position:absolute;left:24px;top:50%;transform:translate(-6px,-50%);white-space:nowrap;font:500 .68rem/1 var(--display);letter-spacing:.2em;text-transform:uppercase;
  color:var(--bone);background:rgba(14,11,8,.9);border:1px solid var(--line);padding:.6em .9em;border-radius:999px;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease}
.channel a:hover span,.channel a:focus-visible span,.channel li.here a span.peek{opacity:1;transform:translate(0,-50%)}

/* ---------- how it works: the transmission, then the path in four steps ---------- */
.how{background:radial-gradient(60% 45% at 50% 0%,rgba(217,173,112,.1),transparent 70%)}
.transmission{position:relative;margin:0 0 clamp(52px, 7vw, 92px);aspect-ratio:2000/1126;overflow:hidden;isolation:isolate;
  border-radius:999px 999px 18px 18px / 240px 240px 18px 18px;box-shadow:0 34px 90px -44px rgba(0,0,0,.95),0 0 0 1px rgba(217,173,112,.28)}
.transmission img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 2.2s cubic-bezier(.2,.7,.2,1)}
.transmission.in img{transform:scale(1)}
.transmission figcaption{position:absolute;left:0;right:0;bottom:0;padding:56px 20px 20px;text-align:center;font:italic 500 clamp(1.1rem, 2vw, 1.45rem)/1.3 var(--serif);color:#fff6e2;
  background:linear-gradient(180deg,rgba(14,11,8,0),rgba(14,11,8,.78));text-shadow:0 1px 12px rgba(0,0,0,.6)}
.path-steps{--fill:1;list-style:none;margin:0;padding:0;position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px, 2.8vw, 40px)}
.path-steps::before,.path-steps::after{content:"";position:absolute;left:22px;right:22px;top:21px;height:2px;border-radius:2px}
.path-steps::before{background:rgba(217,173,112,.22)}
.path-steps::after{transform-origin:left;transform:scaleX(var(--fill));background:linear-gradient(90deg,var(--sand),var(--sand-hi));box-shadow:0 0 12px rgba(241,214,162,.7)}
.step{position:relative;z-index:1;display:flex;flex-direction:column;gap:.85rem;min-width:0}
.step-n{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:600 .95rem var(--display);color:var(--sand-hi);background:var(--earth);border:1px solid var(--sand);
  box-shadow:0 0 0 7px var(--earth);transition:background .5s ease,color .5s ease,box-shadow .5s ease}
.step.lit .step-n{background:var(--sand);color:var(--ink-on-gold);box-shadow:0 0 0 7px var(--earth),0 0 24px rgba(241,214,162,.6)}
.step h3{font-size:clamp(1.25rem, 1.8vw, 1.5rem);line-height:1.2;margin-top:.3rem}
.step p:not(.step-n){font-size:.98rem;color:var(--bone-2)}
.step .land{font-size:1.25rem!important;color:var(--sand-hi)!important}
.includes{margin-top:clamp(44px, 5vw, 68px);display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;padding:22px 26px;border:1px solid var(--line);border-radius:22px;
  background:linear-gradient(180deg,rgba(217,173,112,.08),rgba(217,173,112,.02))}
.includes-title{font:500 .78rem var(--display);letter-spacing:.24em;text-transform:uppercase;color:var(--sand)}
.includes .ticks{margin:0}
.includes-note{font:italic 500 1.15rem var(--serif);color:var(--sand-hi)}
.how-close{margin-top:clamp(32px, 4vw, 48px);max-width:70ch;font:500 1.32rem/1.55 var(--serif);color:var(--bone)}

/* ---------- what you'll learn: four doorways (the arch windows of the retreat page) ---------- */
.door{display:flex;flex-direction:column;align-items:center;gap:.7rem;width:100%;text-decoration:none;color:inherit;border-radius:12px}
.door-title{font:600 clamp(1.15rem, 1.6vw, 1.4rem)/1.2 var(--display);color:var(--bone);transition:color .3s ease}
.door-line{font-size:.98rem;color:var(--bone-2);max-width:30ch}
.door:hover .door-title,.door:focus-visible .door-title{color:var(--gold-hi)}
.door:hover .stage-arch img{transform:scale(1.03)}
.doors{margin-bottom:0}

/* ---------- the four learning sections: the art stays beside you while you read ---------- */
.learn-grid{display:grid;grid-template-columns:minmax(260px,.82fr) minmax(0,1.18fr);gap:clamp(36px, 6vw, 100px);align-items:start}
.learn-sticky{position:sticky;top:calc(env(safe-area-inset-top, 0px) + 112px)}
.learn-side h2{font-size:clamp(1.9rem, 3.5vw, 3rem);margin-bottom:clamp(24px, 3vw, 38px)}
.learn-art{position:relative;margin:0;isolation:isolate;aspect-ratio:100/140;width:min(100%, 380px, calc((100vh - 380px) * 100 / 140));min-width:200px}
.learn-art img{width:100%;height:100%;object-fit:cover;-webkit-mask:var(--arch) center/100% 100% no-repeat;mask:var(--arch) center/100% 100% no-repeat}
.learn-art::after{content:"";position:absolute;inset:-12px;background:var(--arch-line) center/100% 100% no-repeat;pointer-events:none}
.learn-art::before{content:"";position:absolute;inset:14% -10% -6%;border-radius:50%;background:radial-gradient(closest-side,rgba(241,214,162,.24),transparent);filter:blur(14px);z-index:-1}
.learn-body{display:grid;gap:clamp(38px, 4.8vw, 58px);min-width:0}
.learn-group h3{font-size:clamp(1.3rem, 2vw, 1.65rem);line-height:1.2;margin-bottom:1.15rem;display:flex;align-items:center;gap:16px}
.learn-group h3::after{content:"";flex:1;min-width:30px;height:1px;background:linear-gradient(90deg,var(--sand-lo),transparent)}
.learn-group > p{color:var(--bone-2)}
.learn-list{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.learn-list li{position:relative;padding-left:28px;color:var(--bone-2)}
.learn-list li::before{content:"";position:absolute;left:4px;top:.66em;width:8px;height:8px;transform:rotate(45deg);border:1px solid var(--sand);background:rgba(217,173,112,.25)}
.learn-defs{margin:0;display:grid;gap:18px}
.learn-defs div{display:grid;grid-template-columns:minmax(140px,.36fr) minmax(0,1fr);gap:6px 24px;padding-top:16px;border-top:1px solid var(--line)}
.learn-defs dt{font:600 .8rem/1.5 var(--display);letter-spacing:.16em;text-transform:uppercase;color:var(--sand-hi)}
.learn-defs dd{margin:0;color:var(--bone-2)}
.learn-intro{font:500 1.38rem/1.55 var(--serif);color:var(--bone)}
.learn-close{font:500 1.28rem/1.6 var(--serif);color:var(--bone);padding-top:1.5rem;border-top:1px solid var(--line)}
.learn-close em{display:block;margin-top:.55em;color:var(--sand-hi)}
.learn.meo{background:radial-gradient(60% 55% at 22% 32%,rgba(88,98,180,.2),transparent 70%),linear-gradient(180deg,var(--earth),#0e1121 22%,#0e1121 78%,var(--earth))}
.five{list-style:none;counter-reset:five;margin:0;padding:0;display:grid;gap:12px}
.five li{counter-increment:five;position:relative;padding:16px 20px 16px 66px;border:1px solid var(--line);border-radius:16px;color:var(--bone-2);
  background:linear-gradient(180deg,rgba(217,173,112,.07),rgba(217,173,112,.01))}
.five li::before{content:counter(five);position:absolute;left:20px;top:17px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  font:600 .85rem var(--display);color:var(--ink-on-gold);background:var(--sand)}
.five b{display:block;font:600 1.02rem var(--display);color:var(--bone);margin-bottom:.25rem;letter-spacing:.02em}

/* ---------- the clear channel: a beam of light pours down the middle as you arrive ---------- */
.divine{overflow:hidden;isolation:isolate;background:radial-gradient(48% 70% at 50% 0%,rgba(255,240,205,.13),transparent 72%)}
.beam{--pour:1;position:absolute;left:50%;top:0;bottom:0;width:min(52vw, 620px);transform:translateX(-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(50% 100% at 50% 0%,rgba(255,246,226,.2),rgba(241,214,162,.06) 55%,transparent 82%);
  -webkit-mask:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent);mask:linear-gradient(90deg,transparent,#000 32%,#000 68%,transparent)}
.beam::before{content:"";position:absolute;left:50%;top:0;width:2px;height:clamp(64px, 9vw, 140px);margin-left:-1px;transform-origin:top;transform:scaleY(var(--pour));
  background:linear-gradient(180deg,#fffaf0,rgba(241,214,162,.7) 55%,rgba(241,214,162,0));box-shadow:0 0 22px 5px rgba(241,214,162,.42)}
.divine-wrap{max-width:940px}
.divine-lead{text-align:center;font:italic 500 clamp(1.7rem, 3.4vw, 2.6rem)/1.25 var(--serif);color:var(--sand-hi);margin:-14px auto clamp(34px, 4vw, 54px);max-width:30ch;text-wrap:balance}
.divine-text{display:grid;gap:1.05em;font-size:1.08rem;padding:clamp(24px, 3.2vw, 40px);border-radius:26px;background:rgba(14,11,8,.78);box-shadow:0 0 0 1px var(--line),0 30px 60px -40px rgba(0,0,0,.9);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.divine-text b{color:var(--bone);font-weight:600}
.divine-quote{margin:clamp(44px, 5vw, 68px) auto 0;max-width:780px;text-align:center}
.divine-quote p{font:italic 500 clamp(1.5rem, 2.8vw, 2.25rem)/1.35 var(--serif);color:var(--bone);text-wrap:balance}
.divine-more{margin:clamp(22px, 3vw, 32px) auto 0;text-align:center}
.divine-more a{color:var(--sand-hi);font:600 1rem/1.5 var(--ui);text-underline-offset:4px}
.divine-more a:hover{color:var(--gold-hi)}
.divine-bonus{margin:clamp(30px, 4vw, 46px) auto 0;max-width:62ch;text-align:center;color:var(--dust)}
.divine-bonus b{color:var(--sand-hi);font-weight:600}

/* ---------- your guide ---------- */
.alek-title{margin-bottom:clamp(40px, 5vw, 70px)}

/* ---------- the investment: the seal, what you receive, the medicine card ---------- */
.perspective{text-align:center;max-width:32ch;font:italic 500 1.22rem/1.45 var(--serif);color:var(--sand-hi)}
.price-land{margin:.1rem 0 1rem}
.price .incl h2{font-size:clamp(1.9rem, 3.8vw, 3rem)}
.medicine{margin-top:clamp(60px, 7vw, 100px);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(28px, 4vw, 60px);align-items:center;
  padding:clamp(28px, 4vw, 50px);border:1px solid var(--sand-lo);border-radius:30px;outline:1px solid rgba(217,173,112,.18);outline-offset:8px;
  background:linear-gradient(135deg,rgba(217,173,112,.1),rgba(217,173,112,.02) 62%)}
.medicine h3{font-size:clamp(1.5rem, 2.6vw, 2.1rem);line-height:1.15;margin-bottom:1rem}
.medicine-text p+p{margin-top:1rem}
.medicine-call{font:italic 500 1.25rem/1.5 var(--serif);color:var(--bone)}
.medicine-compare{display:grid;gap:18px;justify-items:center;text-align:center}
.medicine-compare p{display:flex;flex-direction:column;gap:6px}
.medicine-compare span{font:600 clamp(2.2rem, 4.2vw, 3.2rem)/1 var(--display);font-variant-numeric:lining-nums}
.medicine-compare small{font-size:.84rem;color:var(--dust);letter-spacing:.03em}
.medicine-compare .was span{font-size:clamp(1.5rem, 2.6vw, 2rem);color:var(--dust);text-decoration:line-through;text-decoration-color:rgba(217,173,112,.75);text-decoration-thickness:2px}
.medicine-compare .now span{color:var(--sand-hi);text-shadow:0 0 26px rgba(241,214,162,.35)}

/* ---------- where you'll train ---------- */
.where-strip{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(10px, 1.4vw, 18px);height:clamp(240px, 30vw, 430px)}
.where-strip .tile{height:100%}
.where-strip .tile img{transform:scale(1)}
.where-strip .tile:hover img{transform:scale(1.04)}

/* ---------- questions ---------- */
.faq-wrap{max-width:1000px}
.faq-list{display:grid;gap:12px}
.faq details{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(217,173,112,.06),rgba(217,173,112,.01));transition:border-color .3s ease}
.faq details[open]{border-color:var(--sand-lo)}
.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 24px;border-radius:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary h3{font:600 clamp(1.05rem, 1.6vw, 1.22rem)/1.35 var(--display);color:var(--bone);letter-spacing:.01em}
.faq summary::after{content:"";flex:none;width:11px;height:11px;border-right:1.5px solid var(--sand);border-bottom:1.5px solid var(--sand);transform:translateY(-3px) rotate(45deg);transition:transform .3s ease}
.faq details[open] summary::after{transform:translateY(3px) rotate(225deg)}
.faq details p{padding:0 24px 22px;color:var(--bone-2);max-width:74ch}

/* ---------- apply ---------- */
.apply .invite-grid{align-items:start}
.apply .invite-arch{position:sticky;top:120px}
.apply-q{margin:1.4rem 0 0;padding:0;list-style:none;counter-reset:q;display:grid;gap:10px;max-width:640px}
.apply-q li{counter-increment:q;position:relative;padding:14px 18px 14px 60px;border:1px solid var(--line);border-radius:14px;background:rgba(217,173,112,.04);
  font:500 1.14rem/1.45 var(--serif);color:var(--bone)}
.apply-q li::before{content:counter(q);position:absolute;left:16px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;display:grid;place-items:center;
  font:600 .8rem var(--display);color:var(--sand-hi);border:1px solid var(--sand-lo)}
.apply-more{margin-top:1.1rem!important;font:italic 500 1.22rem var(--serif);color:var(--sand-hi)}
.apply-alt{margin-top:1.1rem!important;font-size:.95rem;color:var(--dust)}
.copy{font:inherit;color:var(--sand-hi);background:none;border:0;border-bottom:1px dashed var(--sand-lo);padding:0;cursor:pointer}
.copy:hover{color:var(--gold-hi)}
.copy.done::after{content:" (copied)";color:var(--dust)}
.apply-close{margin-top:clamp(38px, 4vw, 54px);padding-top:clamp(28px, 3vw, 40px);border-top:1px solid var(--line);display:grid;gap:1em;max-width:62ch}
.apply-close .land{margin:.15em 0}
.ask{margin-top:1.7rem!important;font:italic 400 1.08rem/1.5 var(--caption);color:var(--dust)}

/* ---------- smaller screens ---------- */
@media (max-width:1100px){
  .path-steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:44px}
  .path-steps::before,.path-steps::after{display:none}
}
@media (max-width:860px){
  .learn-grid{grid-template-columns:minmax(0,1fr);gap:28px}
  .learn-sticky{position:relative;top:0}
  .learn-art{width:min(68vw, 300px)}
  .learn-defs div{grid-template-columns:minmax(0,1fr)}
  .medicine{grid-template-columns:minmax(0,1fr)}
  .medicine-compare{grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}
  .where-strip{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(150px, 42vw, 260px);height:auto}
  .where-strip .tile:first-child{grid-column:1 / -1}
  .apply .invite-arch{position:relative;top:0}
  .transmission{border-radius:300px 300px 14px 14px / 90px 90px 14px 14px}
}
@media (max-width:640px){
  .path-steps{grid-template-columns:minmax(0,1fr);row-gap:34px}
  .includes{padding:18px}
  .how-close{font-size:1.18rem}
  .learn-intro{font-size:1.22rem}
  .learn-group h3::after{display:none}
  .five li{padding:14px 16px 14px 58px}
  .five li::before{left:16px}
  .faq summary{padding:16px 18px}
  .faq details p{padding:0 18px 18px}
  .apply-q li{padding-left:54px;font-size:1.06rem}
  .apply-q li::before{left:14px}
  .medicine{outline-offset:5px}
}

@media (prefers-reduced-motion:reduce){
  .transmission img{transform:none}
}