/* Szabályzat – világos rajzlap-háttér, rajta egy letisztult, lekerekített kártya; a szöveg megnyitáskor „íródik ki” */
.rules-page{background:#eef0e8;color:#18281f;
  background-image:linear-gradient(#56745d14 1px,transparent 1px),linear-gradient(90deg,#56745d14 1px,transparent 1px),
    linear-gradient(#56745d0c 1px,transparent 1px),linear-gradient(90deg,#56745d0c 1px,transparent 1px);
  background-size:180px 180px,180px 180px,36px 36px,36px 36px;background-position:center top}
.rules-page header{color:#18281f}
.rules-page header .dot{color:#6f9a4f}
.rules-page header .pill{border-color:#18281f40;white-space:nowrap}
.rules-page header .pill:hover{background:#18281f;color:#eff3ed;border-color:#18281f}
.rules-page header .mm-btn{color:#18281f;border-color:#18281f40;background:#f8f9f4b3}
.rules-page footer{color:#4e6153}
.foot-links{display:flex;gap:26px}
.rules-page footer .foot-ct:hover{color:#18281f}

/* olvasási csík a képernyő tetején */
.rules-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:50;pointer-events:none}
.rules-progress i{display:block;height:100%;width:100%;background:#56745d;transform-origin:left;transform:scaleX(0)}

.rules{padding:150px 4.5vw 110px}
.rules-card{position:relative;max-width:940px;margin:0 auto;background:#fbfcf8;border-radius:34px;padding:68px 76px 56px;
  box-shadow:0 1px 0 #fff inset,0 0 0 1px #18281f0d,0 50px 90px -60px #0b1a1366,0 18px 40px -30px #0b1a1333}

.rc-eyebrow{display:flex;gap:14px;align-items:center;font-size:11px;letter-spacing:2px;color:#56745d}
.rc-eyebrow span+span::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:#9fbf86;margin-right:14px;vertical-align:2px}
.rules-card h1{position:static;margin:26px 0 0;font-size:clamp(56px,7.2vw,104px);line-height:.98;font-weight:400;letter-spacing:-.07em;pointer-events:auto}
.rc-lead{margin:26px 0 0;max-width:600px;font-size:clamp(18px,1.6vw,21px);line-height:1.55;letter-spacing:-.01em;color:#2f4636}
.rc-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.rc-meta span{font-size:12px;padding:6px 12px;border-radius:999px;background:#eef2e8;color:#4e6153;font-variant-numeric:tabular-nums}

.rc-toc{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 18px;padding-bottom:40px;border-bottom:1px solid #18281f14}
.rc-toc a{display:inline-flex;align-items:baseline;gap:8px;padding:9px 15px 9px 13px;border-radius:999px;border:1px solid #18281f1a;font-size:14px;color:#2f4636;
  transition:background .25s,color .25s,border-color .25s}
.rc-toc>a:first-child{display:inline-flex} /* a style.css mobilon elrejtené a nav első linkjét */
.rc-toc a small{font-size:10px;letter-spacing:1px;color:#8aa08f;font-variant-numeric:tabular-nums;transition:color .25s}
.rc-toc a:hover{background:#18281f;border-color:#18281f;color:#eff3ed}
.rc-toc a:hover small{color:#c9eeaa}

.rc-sec{display:grid;grid-template-columns:76px 1fr;gap:0 10px;padding:38px 0 34px;border-bottom:1px solid #18281f12;scroll-margin-top:40px}
.rc-num{font-size:12px;letter-spacing:1.5px;color:#8aa08f;padding-top:12px;font-variant-numeric:tabular-nums}
.rc-body h2{font-size:clamp(26px,2.5vw,34px);line-height:1.15;letter-spacing:-.045em;margin:0 0 16px}
.rc-body p{margin:0 0 14px;font-size:16.5px;line-height:1.75;color:#2f4636;max-width:680px}
.rc-body p:last-child{margin-bottom:0}
.rc-body strong{font-weight:600;color:#18281f}
.rc-body a{color:#3f6b4b;font-weight:500}
.rc-body a:hover{text-decoration:underline}
.rc-body ul{list-style:none;margin:6px 0 18px;padding:0;display:flex;flex-direction:column;gap:2px;max-width:680px}
.rc-body ul:last-child{margin-bottom:0}
.rc-body li{position:relative;padding:9px 0 9px 26px;font-size:16.5px;line-height:1.65;color:#2f4636}
.rc-body li::before{content:'';position:absolute;left:2px;top:20px;width:12px;height:1.5px;border-radius:2px;background:#7fa35f;transition:opacity .3s,transform .4s}
.rc-body .kv{margin:6px 0 0;display:grid;gap:8px;max-width:520px}
.rc-body .kv>div{display:flex;justify-content:space-between;gap:20px;padding:13px 18px;border-radius:14px;background:#eef2e8}
.rc-body .kv dt{font-size:13px;color:#56745d;letter-spacing:.02em}
.rc-body .kv dd{margin:0;font-size:15.5px;color:#18281f;text-align:right}

.rc-end{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-top:40px;font-size:15px;color:#4e6153}
.rc-end>div{display:flex;gap:10px;flex-wrap:wrap}
.rc-btn{display:inline-flex;gap:10px;align-items:center;padding:13px 20px;border-radius:999px;background:#18281f;color:#eff3ed;font-size:14px;transition:background .25s,color .25s}
.rc-btn:hover{background:#c9eeaa;color:#101815}
.rc-btn.ghost{background:none;border:1px solid #18281f2a;color:#18281f}
.rc-btn.ghost:hover{background:#eef2e8}

/* ===== „Íródás” (csak ha a JS fut és nincs csökkentett mozgás) ===== */
.tw .rules-card{opacity:0}
/* ha a szkript nem töltene be, 2,5 mp után minden a helyén van */
.tw:not(.tw-ready) :is(.rules-card,.rc-toc a,.rc-num,.rc-meta,.rc-eyebrow,.rc-end),.tw:not(.tw-ready) .rc-body li::before{animation:tw-fallback 0s 2.5s forwards}
@keyframes tw-fallback{to{opacity:1;transform:none}}
.tw-ready .rules-card{animation:tw-card .8s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes tw-card{from{opacity:0;transform:translateY(26px) scale(.985)}to{opacity:1;transform:none}}
.tw-h{color:transparent!important}                       /* a még ki nem írt rész: helyet foglal, de nem látszik */
.tw .rc-body li:not(.tw-on)::before{opacity:0;transform:scaleX(.2)}
.tw .rc-sec:not(.tw-on) .rc-num,.tw .rc-meta:not(.tw-on),.tw .rc-eyebrow:not(.tw-on){opacity:0;transform:translateY(6px)}
.tw-ready .rc-sec .rc-num,.tw-ready .rc-meta,.tw-ready .rc-eyebrow{transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.tw .rc-body .kv>div:not(.tw-on){background:transparent}
.tw-ready .rc-body .kv>div{transition:background .5s}
.tw .rc-toc:not(.tw-on) a{opacity:0;transform:translateY(8px)}
.tw-ready .rc-toc a{transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1),background .25s,color .25s,border-color .25s}
.tw .rc-sec:not(.tw-on){border-bottom-color:transparent}
.tw-ready .rc-sec{transition:border-color .6s}
.tw .rc-end:not(.tw-on){opacity:0}
.tw-ready .rc-end{transition:opacity .6s}
.tw-ready .rc-toc a:nth-child(1){transition-delay:0ms}
.tw-ready .rc-toc a:nth-child(2){transition-delay:35ms}
.tw-ready .rc-toc a:nth-child(3){transition-delay:70ms}
.tw-ready .rc-toc a:nth-child(4){transition-delay:105ms}
.tw-ready .rc-toc a:nth-child(5){transition-delay:140ms}
.tw-ready .rc-toc a:nth-child(6){transition-delay:175ms}
.tw-ready .rc-toc a:nth-child(7){transition-delay:210ms}
.tw-ready .rc-toc a:nth-child(8){transition-delay:245ms}
.tw-ready .rc-toc a:nth-child(9){transition-delay:280ms}
.tw-ready .rc-toc a:nth-child(10){transition-delay:315ms}
.tw-ready .rc-toc a:nth-child(11){transition-delay:350ms}
.tw-ready .rc-toc a:nth-child(12){transition-delay:385ms}
.tw-ready .rc-toc a:nth-child(13){transition-delay:420ms}
.tw-ready .rc-toc a:nth-child(14){transition-delay:455ms}
.tw-ready .rc-toc a:nth-child(15){transition-delay:490ms}
.tw-ready .rc-toc a:nth-child(16){transition-delay:525ms}
.tw-ready .rc-toc a:hover{transition-delay:0s}
.tw-caret{position:relative}
.tw-caret::after{content:'';position:absolute;left:1px;bottom:-.12em;width:2px;height:1.08em;border-radius:1px;background:#56745d;animation:tw-blink 1s steps(1) infinite}
.tw-caret.typing::after{animation:none}
@keyframes tw-blink{50%{opacity:0}}

@media(max-width:900px){
  .rules-card{padding:54px 46px 46px;border-radius:30px}
  .rc-sec{grid-template-columns:56px 1fr}
}
@media(max-width:750px){
  .rules{padding:118px 3.5vw 60px}
  .rules-card{padding:36px 22px 30px;border-radius:26px}
  .rules-card h1{font-size:clamp(50px,15vw,74px);margin-top:20px}
  .rc-lead{font-size:17px;margin-top:18px}
  .rc-toc{margin:28px 0 6px;padding-bottom:26px;gap:6px}
  .rc-toc a{padding:7px 12px 7px 11px;font-size:13px}
  .rc-sec{grid-template-columns:1fr;padding:30px 0 26px}
  .rc-num{padding:0 0 8px}
  .rc-body h2{font-size:26px;margin-bottom:12px}
  .rc-body p,.rc-body li{font-size:16px}
  .rc-body .kv>div{flex-direction:column;gap:2px;padding:11px 15px}
  .rc-body .kv dd{text-align:left}
  .rc-end{padding-top:30px}
  .foot-links{gap:18px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Gyakori kérdések (szabalyzat.php #gyik) */
.rc-faq{padding:46px 0 10px;border-bottom:1px solid #18281f12}
.tw .faq-eyebrow{opacity:1;transform:none}
.rc-faq h2{font-size:clamp(28px,3vw,40px);line-height:1.1;letter-spacing:-.05em;margin:12px 0 26px}
.faq-list{display:flex;flex-direction:column;gap:10px}
.faq-item{border:1px solid #18281f14;border-radius:18px;background:#fbfcf9;transition:border-color .25s,background .25s}
.faq-item[open]{background:#fff;border-color:#9fbf86}
.faq-item summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;cursor:pointer;list-style:none;font-size:17px;letter-spacing:-.01em;color:#18281f}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary i{flex:none;width:26px;height:26px;border-radius:50%;border:1px solid #18281f22;position:relative;transition:transform .3s,background .3s,border-color .3s}
.faq-item summary i::before,.faq-item summary i::after{content:'';position:absolute;left:50%;top:50%;width:10px;height:1.5px;background:#2f4636;transform:translate(-50%,-50%)}
.faq-item summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s}
.faq-item[open] summary i{background:#18281f;border-color:#18281f;transform:rotate(45deg)}
.faq-item[open] summary i::before,.faq-item[open] summary i::after{background:#c9eeaa}
.faq-item p{margin:0;padding:0 20px 18px;font-size:15.5px;line-height:1.75;color:#2f4636;max-width:68ch}
@media(max-width:750px){.rc-faq{padding:34px 0 6px}.faq-item summary{padding:14px 16px;font-size:16px}.faq-item p{padding:0 16px 16px;font-size:15px}}
