/* poster/mode_342 —— 三步流程带 · 2026-09-19 新建
   参照 scentiment.com 首页 section.c-ritual.bg-ink，实测值逐条对照：

     区块      background-color rgb(28,26,23) / background-image **none**
               padding 140px 60px / color rgb(251,248,243)
     内容区    max-width 1400px 居中
     头部      text-align center / margin-bottom 100px
     小标签    11px/15.4px 字距 3.08px 大写 rgb(184,172,154) 下边距 24px
     大标题    72px/75.6px 字重 300 Cormorant Infant，max-width 800px 居中
     三栏      grid 3×413.33px / gap 80px / 每栏内容居中
     序号      14px/19.6px Cormorant Infant **斜体** rgb(184,172,154) 下边距 40px
     小标题    32px/48px 字重 300 字距 -0.32px Cormorant Infant 下边距 16px
     正文      14px/25.2px rgb(184,172,154)，max-width 280px 居中

   rgb(184,172,154) 在 rgb(28,26,23) 上对比度 7.78:1，远超 AA，
   所以这个模块**不做**颜色偏离，参照站原值照搬（媒体引言带 mode_341
   因为底色是浅色才不得不调深一档，两者情况不同）。

   字重：global.css:2534 `body, body *{font-weight:normal!important}`
   把全站字重钉死，故标题的 300 必须带 !important 才生效。 */

.ly_poster_342 .index_part_ritual{position: relative;background-color: #1c1a17;color: #fbf8f3;padding: clamp(72px, 9vw, 140px) 24px}/* 两层暖色径向渐变 —— 参照站把它们放在 **::before 伪元素** 上，
   区块自身是 `background-image: none`。我此前只量了 section、没量伪元素，
   据此误判"参照站是纯墨色"并把渐变删掉了，是错的。这里按伪元素还原。

   实测原值（参照站用 color(srgb …) 记法，换算成 rgba）：
     0.419608/0.309804/0.172549 @ .30 → rgba(107, 79, 44, .30)
     0.541176/0.494118/0.427451 @ .15 → rgba(138, 126, 109, .15)
   位置、半径、透明度一律照抄，不要"顺手调匀"。

   伪元素是 position:absolute，会盖住静态流里的内容，
   所以给它 z-index:0、给 .ritual_inner z-index:1，文字才在渐变之上。
   pointer-events:none 保证按钮照常可点。 */
.ly_poster_342 .index_part_ritual::before{content: "";position: absolute;inset: 0;z-index: 0;pointer-events: none;background-image:
		radial-gradient(at 20% 30%, rgba(107, 79, 44, .30) 0%, rgba(0, 0, 0, 0) 55%),
		radial-gradient(at 85% 75%, rgba(138, 126, 109, .15) 0%, rgba(0, 0, 0, 0) 60%)}.ly_poster_342 .ritual_inner{position: relative;z-index: 1;width: 100%;max-width: 1400px;margin: 0 auto;box-sizing: border-box}.ly_poster_342 .ritual_header{text-align: center;margin-bottom: clamp(56px, 7vw, 100px)}.ly_poster_342 .ritual_label{margin: 0 0 24px;font-family: 'Inter Tight', Arial, sans-serif;font-size: 11px;line-height: 1.4;letter-spacing: .28em;text-transform: uppercase;color: #b8ac9a}.ly_poster_342 .ritual_title{margin: 0 auto;max-width: 800px;font-family: 'Cormorant Infant', Georgia, serif;font-size: clamp(38px, 5vw, 72px);font-weight: 300 !important;line-height: 1.05;letter-spacing: 0;color: #fbf8f3;text-wrap: balance}.ly_poster_342 .ritual_steps{display: grid;gap: 80px}/* 列数走类名而不是内联 style：内联样式压不过下面的手机端媒体查询 */
.ly_poster_342 .ritual_steps_1{grid-template-columns: minmax(0, 1fr)}.ly_poster_342 .ritual_steps_2{grid-template-columns: repeat(2, minmax(0, 1fr))}.ly_poster_342 .ritual_steps_3{grid-template-columns: repeat(3, minmax(0, 1fr))}.ly_poster_342 .ritual_step{text-align: center}/* 序号的下边距 40px 是这一带里最大的一处间隔，
   它把序号与其下的标题正文分成两组，节奏来自参照站，不要压缩 */
.ly_poster_342 .ritual_num{display: inline-block;margin: 0 0 40px;font-family: 'Cormorant Infant', Georgia, serif;font-size: 14px;font-style: italic;line-height: 1.4;letter-spacing: 0;color: #b8ac9a}.ly_poster_342 .ritual_step_title{margin: 0 0 16px;font-family: 'Cormorant Infant', Georgia, serif;font-size: 32px;font-weight: 300 !important;line-height: 1.5;letter-spacing: -.01em;color: #fbf8f3;text-transform: none}.ly_poster_342 .ritual_body{margin: 0 auto;max-width: 280px;font-family: 'Inter Tight', Arial, sans-serif;font-size: 14px;line-height: 1.8;letter-spacing: 0;color: #b8ac9a}@media (max-width: 1100px){.ly_poster_342 .ritual_steps{gap: 56px}}

@media (max-width: 767px){.ly_poster_342 .ritual_steps,
	.ly_poster_342 .ritual_steps_2,
	.ly_poster_342 .ritual_steps_3{grid-template-columns: minmax(0, 1fr);gap: 48px}.ly_poster_342 .ritual_num{margin-bottom: 24px}.ly_poster_342 .ritual_step_title{font-size: 26px;line-height: 1.3}}

/* ── 夺回被首页全局标题规则钉死的行高与字距 ──
   index.css 里有一条：
     body.index :is(h2, h3, .part_title, .themes_box_title,
                    .ly_poster_339 .p339_right .title){line-height:1.05!important;letter-spacing:-0.015em!important }
   :is() 的特异性取**参数里最大的那个**（这里是 .ly_poster_339 .p339_right .title
   = 0,3,0），加上 body.index 合计 (0,4,1)。本模块原先的
   `.ly_poster_342 .ritual_step_title` 只有 (0,2,0)，即便同为 !important 也输。
   所以这两条写满四个类 + body.index，特异性 (0,5,1) 才压得过。

   顺带说明为什么大标题也要写：那条规则把 h2 的字距改成 -0.015em，
   而参照站的大标题是 letter-spacing:normal；行高 1.05 倒是和参照站
   72px/75.6px 正好吻合，写出来只是为了不依赖这个巧合。

   本模块若用在非首页，body.index 不成立，上面不带 !important 的基础规则
   照常生效，结果一致。 */
body.index .ly_poster_342 .ritual_inner .ritual_header .ritual_title{line-height: 1.05 !important;letter-spacing: 0 !important}body.index .ly_poster_342 .ritual_inner .ritual_steps .ritual_step_title{line-height: 1.5 !important;letter-spacing: -.01em !important}@media (max-width: 767px){body.index .ly_poster_342 .ritual_inner .ritual_steps .ritual_step_title{line-height: 1.3 !important}}

/* ── 合作按钮 ──
   参照站 section.c-ritual 里**没有任何链接**（实测 a/button 数为 0）。
   这个按钮是本站的增项：原 OEM 带 mode_283 已并入本模块，
   "Join Zhithera" 是那一带存在的理由，不能丢。

   **按钮语言改为与参照站一致的胶囊描边**（2026-09-19）：
   参照站主按钮实测 = 圆角 100px、透明底 1px 描边、内边距 14px 28px、
   Inter Tight 11px/15.4px 字重 300、字距 2.42px(.22em)、全大写、
   过渡 `color/background-color .45s cubic-bezier(.4,0,.2,1)`。
   本站首页的 `view more` 已逐值相同，此处对齐同一套。
   （改前是纸色实心方角 15px —— 那是从旧 OEM 带照搬的，属站内第三套按钮语言。）

   这一块是墨底，所以描边与字用纸色、悬停时填充纸色反相。 */
.ly_poster_342 .ritual_cta{display: flex;justify-content: center;margin-top: 80px}.ly_poster_342 .ritual_cta a{display: inline-flex;align-items: center;gap: 10px;min-height: 45px;box-sizing: border-box;padding: 14px 28px;background: transparent;color: #fbf8f3;border: 1px solid #fbf8f3;border-radius: 100px;font-family: 'Inter Tight', Arial, sans-serif;font-size: 11px;line-height: 1.4;font-weight: 300 !important;letter-spacing: .22em;text-transform: uppercase;text-decoration: none;transition: color var(--dur-slow, .45s) var(--ease-std, cubic-bezier(.4, 0, .2, 1)),
	            background-color var(--dur-slow, .45s) var(--ease-std, cubic-bezier(.4, 0, .2, 1))}/* 悬停填充：纸底墨字 */
.ly_poster_342 .ritual_cta a:hover{background: #fbf8f3;color: #1c1a17}.ly_poster_342 .ritual_cta a b{display: flex;align-items: center}/* 箭头素材 moreicongreen.png 本身是绿色的（12×12），绿不在色板内。
   墨底上按钮字是纸色，所以箭头要压成纸色；悬停反相后压成墨色。
   尺寸从 20px 收到 14px —— 11px 的大写字旁边 20px 的箭头会压过文字。 */
.ly_poster_342 .ritual_cta a img{width: 14px;height: auto;display: block;filter: brightness(0) invert(1);transition: filter var(--dur-slow, .45s) var(--ease-std, cubic-bezier(.4, 0, .2, 1))}.ly_poster_342 .ritual_cta a:hover img{filter: brightness(0)}@media (max-width: 767px){.ly_poster_342 .ritual_cta{margin-top: 48px}}