/* ORAȘUL VOCILOR · pagina unui loc Se încarcă după stil.css și folosește aceleași culori din :root. Culoarea locului vine dintr-un singur rând, pe : Restul paginii o preia de acolo. */ /* ————— antetul locului ————— */ .inapoi{ display:inline-block; margin:22px 0 0 22px; color:var(--text-sters); font-size:.86rem; text-decoration:none; border-bottom:1px solid transparent; } .inapoi:hover, .inapoi:focus-visible{color:var(--aur);border-bottom-color:var(--aur)} .antet-loc{ max-width:44rem; margin:0 auto; padding:18px 22px 6px; text-align:center; } .antet-loc .supratitlu{ font-size:.78rem;letter-spacing:.2em;text-transform:uppercase; color:var(--text-sters);margin-bottom:.8em; } .antet-loc h1{ margin:0; font-size:clamp(1.9rem,5.2vw,2.9rem); font-weight:normal;letter-spacing:.02em; color:var(--aur-pal); } .antet-loc .replica{ margin:.7em 0 0; font-style:italic; color:var(--acc); filter:brightness(1.7); font-size:1.05rem; } .plansa{ display:block; width:min(92vw,44rem); margin:26px auto 0; border-radius:6px; border:2px solid var(--acc); box-shadow:0 12px 40px rgba(0,0,0,.55); } /* ————— textul de intrare ————— */ .intrare{ max-width:36rem; margin:34px auto 0; padding:0 24px; font-size:1.08rem; font-style:italic; line-height:1.7; color:var(--text); } .intrare p{margin:0 0 1em} /* ————— treptele ————— */ .trepte{ max-width:44rem; margin:52px auto 0; padding:0 22px; } .treapta{ border-top:1px solid rgba(160,170,210,.2); padding:30px 0 6px; } .treapta .capat{ display:flex;flex-wrap:wrap;align-items:baseline;gap:.2em 1em; margin-bottom:.2em; } .treapta .clasa{ font-size:.76rem;letter-spacing:.18em;text-transform:uppercase; color:var(--text-sters); } .treapta h2{ margin:0; font-size:1.5rem;font-weight:normal; color:var(--aur-pal); } .treapta.viitoare{opacity:.45} .treapta.viitoare .curand{ font-size:.86rem;color:var(--text-sters);margin:.5em 0 0; } /* ————— cele trei momente ————— */ .moment{margin:30px 0 0} .moment > h3{ margin:0 0 .8em; font-size:.8rem;letter-spacing:.2em;text-transform:uppercase; font-weight:normal; color:var(--acc); filter:brightness(1.7); } .situatie{ margin:0 0 1.3em; padding:0 0 0 18px; border-left:3px solid var(--acc); font-style:italic; line-height:1.7; } .situatie p{margin:0 0 .8em} .situatie p:last-child{margin-bottom:0} .cerinta{margin:0 0 1em;color:var(--text)} /* ————— de bifat și de ales ————— */ .optiuni{list-style:none;margin:0;padding:0} .optiuni li{margin:0 0 .55em} .optiuni label{ display:flex;align-items:flex-start;gap:.7em; padding:.6em .8em; border:1px solid rgba(160,170,210,.22); border-radius:4px; cursor:pointer; transition:border-color .15s ease, background .15s ease; } .optiuni label:hover{border-color:var(--acc);background:rgba(255,255,255,.03)} .optiuni input{ margin:.32em 0 0; accent-color:var(--acc); width:1.05em;height:1.05em;flex:none; } .optiuni input:focus-visible + span{text-decoration:underline} .optiuni :checked ~ span{color:var(--aur-pal)} /* rândul care apare după ce s-a bifat ceva */ .dupa{ margin:1em 0 0; color:var(--text-sters); font-style:italic; } [hidden]{display:none !important} /* ————— replicile ghizilor ————— */ .ghizi{margin:1.4em 0 0} .ghid{ display:flex;gap:.75em; margin:0 0 .7em; line-height:1.6; } .ghid .cine{ flex:none; color:var(--aur); font-size:.9rem; letter-spacing:.04em; padding-top:.05em; } .ghid .zice{margin:0;font-style:italic} /* ————— momentul Fac ————— */ .variante{list-style:none;margin:0;padding:0} .variante li{margin:0 0 .6em} .variante button{ display:block;width:100%; text-align:left; font-family:inherit;font-size:1rem;line-height:1.5; color:var(--text); background:none; border:1px solid rgba(160,170,210,.25); border-radius:4px; padding:.75em .9em; cursor:pointer; transition:border-color .15s ease, background .15s ease; } .variante button:hover, .variante button:focus-visible{ border-color:var(--acc); background:rgba(255,255,255,.04); outline:none; } .variante button[aria-pressed="true"]{ border-color:var(--acc); background:rgba(255,255,255,.06); color:var(--aur-pal); } .consecinta{ margin:1.3em 0 0; padding:1em 1.1em; border-left:3px solid var(--acc); background:rgba(255,255,255,.03); line-height:1.65; } .consecinta p{margin:0} /* ————— felinarul și pecetea ————— */ .felinar{ margin:26px 0 0; padding:20px 0 4px; border-top:1px solid rgba(160,170,210,.2); text-align:center; } .flacara{ width:16px;height:16px; margin:0 auto .8em; border-radius:50%; background:var(--acc); box-shadow:0 0 26px 8px var(--acc); animation:palpaie 4s ease-in-out infinite; } @keyframes palpaie{ 0%,100%{opacity:.85;transform:scale(1)} 50% {opacity:1; transform:scale(1.12)} } .felinar .aprins{margin:0;color:var(--text-sters);font-size:.95rem} .felinar .pecete{ margin:.9em 0 0; font-size:.78rem;letter-spacing:.22em;text-transform:uppercase; color:var(--aur); } /* ————— subsolul ————— */ .subsol-loc{ max-width:44rem; margin:60px auto 0; padding:26px 22px 60px; border-top:1px solid rgba(160,170,210,.2); text-align:center; color:var(--text-sters); font-size:.9rem; } .subsol-loc a{color:var(--aur);text-decoration:none;border-bottom:1px solid transparent} .subsol-loc a:hover, .subsol-loc a:focus-visible{border-bottom-color:var(--aur)} @media (max-width:640px){ .intrare{font-size:1.02rem} .plansa{width:100%;border-radius:0;border-left:none;border-right:none} .trepte, .antet-loc, .subsol-loc{padding-left:18px;padding-right:18px} } @media (prefers-reduced-motion:reduce){ .flacara{animation:none} } /* ————— pupitrul cu Cartea Cunoașterii ————— */ .pupitru{ margin:8px 0 12px; padding:26px 24px 24px; border:1px solid rgba(160,170,210,.22); border-left:3px solid var(--acc); border-radius:4px; background:rgba(227,211,171,.045); text-align:center; } .pupitru .deasupra{ margin:0 0 .5em; font-size:.76rem;letter-spacing:.18em;text-transform:uppercase; color:var(--text-sters); } .pupitru h2{margin:0;font-size:1.6rem;font-weight:normal} .pupitru h2 a{ color:var(--aur-pal); text-decoration:none; border-bottom:1px solid rgba(232,212,160,.35); } .pupitru h2 a:hover, .pupitru h2 a:focus-visible{ color:#f3e6c4;border-bottom-color:#f3e6c4;outline:none; } .pupitru .sub{ margin:.7em 0 0; font-style:italic; font-size:.95rem; color:var(--text-sters); }