/* Экран 6 «Условия» по визуалу Марии 28.10.2026 (foto-1028-005955): тёмный фон, золотая нить с медальонами 01–04.
   Иллюстрации шагов и декор — фрагменты её макета (assets/rules-*.jpg), текст живой. В конце — второй таймер до 03.11 23:59 МСК. */
.rl{position:relative;isolation:isolate;overflow:clip;color:#eef0f7;scroll-margin-top:84px;font-variant-numeric:lining-nums;
  background:radial-gradient(900px 520px at 72% 0%,#0c2440 0%,#03162a 55%,#011222 100%)}
.rl:before,.rl:after{content:'';position:absolute;z-index:-1;pointer-events:none;background-repeat:no-repeat}
.rl:before{top:0;right:0;width:min(420px,32vw);aspect-ratio:365/262;background-image:url(assets/rules-deco-tr.jpg);background-size:cover;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 30%),linear-gradient(0deg,transparent,#000 30%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent,#000 30%),linear-gradient(0deg,transparent,#000 30%);mask-composite:intersect}
.rl:after{left:0;right:0;bottom:0;height:clamp(70px,8.7vw,140px);background-image:url(assets/rules-deco-bottom.jpg);background-size:100% 100%;opacity:.8;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 70%);mask-image:linear-gradient(180deg,transparent,#000 70%)}
.rl-in{max-width:1280px;margin:0 auto;padding:clamp(56px,6vw,90px) 0 clamp(80px,9vw,140px)}
.rl-eyebrow{display:inline-block;margin:0 0 20px 7.2%;padding:7px 18px;border:1px solid #c9a35c;border-radius:30px;
  color:#e3bd72;font:600 12px/1.2 Manrope,Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.rl h2{margin:0 0 6px 7.2%;color:#fbf7ee;font:700 clamp(40px,5.2vw,68px)/1.06 'Playfair Display',Editorial,serif;letter-spacing:-.4px}
.rl h2 em{font-style:normal;background:linear-gradient(180deg,#fbe7b6,#e5bf73 60%,#c89a4c);-webkit-background-clip:text;background-clip:text;color:transparent}
.rl-strip{display:block;width:100%;height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent);mask-composite:intersect}
.rl-list{display:grid;grid-template-columns:24.9% 25.6% 26.1% 1fr;margin:14px 0 0;padding:0 2% 0 7.2%;list-style:none}
.rl-list li{padding-right:7%}
.rl-ico{display:none}
.rl h3{margin:0 0 14px;color:#fbf7ee;font:700 clamp(24px,2.35vw,31px)/1.12 'Playfair Display',Editorial,serif}
.rl-list p{margin:0;color:#d5d9e3;font:400 15.5px/1.6 Manrope,Inter,sans-serif}
/* второй таймер */
.rl-timer{margin:clamp(48px,5vw,72px) auto 0;max-width:min(900px,86%);padding:30px clamp(20px,4vw,48px) 32px;text-align:center;
  border:1px solid #c9a35c88;border-radius:18px;background:#020f1fcc;box-shadow:0 0 30px #d9b46c1f,0 24px 50px #0008}
.rl-tl{margin:0 0 16px;color:#e3bd72;font:700 clamp(22px,2.2vw,30px)/1.2 'Playfair Display',Editorial,serif}
.rl-cd{display:flex;justify-content:center;align-items:center;gap:12px}
.rl-cd span{display:flex;flex-direction:column;align-items:center;justify-content:center;width:118px;height:82px;border:1px solid #b38d4e99;border-radius:8px;background:#06142699;
  font:11px Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#d9d5cc}
.rl-cd b{font:normal 46px/1 Editorial,serif;color:#f8f0dc;margin:0 0 6px;font-variant-numeric:tabular-nums}
.rl-cd i{font:normal 28px Editorial,serif;color:#ecd197;font-style:normal}
.rl-cd-end{margin:14px 0 0;color:#ecd197;font:15px Manrope,Inter,sans-serif}
.rl-dl{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px;text-align:left}
.rl-dl>div{display:flex;gap:16px;align-items:flex-start;padding:16px 18px;border-radius:12px;background:#ffffff08;border:1px solid #ffffff14}
.rl-dl b{flex:0 0 auto;color:#e3bd72;font:700 34px/1 'Playfair Display',Editorial,serif;text-align:center}
.rl-dl small{display:block;margin-top:4px;font:600 11px Manrope,Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.rl-dl p{margin:0;color:#d5d9e3;font:400 14.5px/1.55 Manrope,Inter,sans-serif}
.rl-dl strong{display:block;margin-bottom:2px;color:#fbf7ee;font:700 17px/1.3 'Playfair Display',Editorial,serif}
.rl h2,.rl h3,.rl-tl,.rl-dl b,.rl-dl strong{font-variant-numeric:lining-nums}/* после font: — сокращение его сбрасывает */
/* планшет и телефон: шаги столбиком, у каждого свой фрагмент иллюстрации */
@media(max-width:900px){
  .rl{scroll-margin-top:76px}
  .rl-in{padding:56px 6% 90px}
  .rl-eyebrow,.rl h2{margin-left:0}
  .rl h2{font-size:clamp(34px,9vw,52px);margin-bottom:22px}
  .rl-strip{display:none}
  .rl-list{display:block;padding:0;margin:0}
  .rl-list li{display:grid;grid-template-columns:clamp(130px,36vw,220px) 1fr;gap:14px;align-items:center;padding:0;margin:0 0 18px}
  .rl-ico{display:block;width:100%;height:auto;
    -webkit-mask-image:radial-gradient(closest-side,#000 70%,transparent);mask-image:radial-gradient(closest-side,#000 70%,transparent)}
  .rl h3{font-size:clamp(22px,6vw,28px);margin-bottom:8px}
  .rl-list p{font-size:14.5px;line-height:1.5}
  .rl-timer{max-width:none;margin-top:36px;padding:24px 14px 22px}
  .rl-cd{gap:5px}
  .rl-cd span{flex:1;width:auto;height:68px;font-size:9px;letter-spacing:.08em}
  .rl-cd b{font-size:32px}
  .rl-cd i{font-size:20px}
  .rl-dl{grid-template-columns:1fr;gap:12px}
  .rl:before{width:46vw;opacity:.7}
}
@media(max-width:420px){.rl-list li{grid-template-columns:120px 1fr;gap:10px}}