@font-face{font-family:'Forum';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/forum-400-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Forum';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/forum-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Forum';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/forum-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Forum';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/forum-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/alegreya-400-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/alegreya-400-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/alegreya-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Alegreya';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/alegreya-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ============ НАЛАШТУВАННЯ ============
   Discord-посилання і трейлер міняються в скрипті внизу (CONFIG). */

:root{
  --night:#0c1734;      /* глибокий синій Forever */
  --royal:#1d3a7a;      /* синій мапи */
  --gold:#d8b25e;       /* золото рамок */
  --gold-deep:#8a6424;
  --parch:#efe2c0;      /* пергамент */
  --ink:#2a1d10;        /* чорнило */
  --ember:#8e1b16;      /* кармін кнопки */
  --display:"Forum","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --text:"Alegreya","Palatino Linotype",Palatino,Georgia,serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-variant-numeric:lining-nums;background:var(--night);color:var(--parch);font-family:var(--text);font-size:1.125rem;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

/* ============ HERO ============ */
.hero{position:relative;min-height:100svh;display:grid;place-items:end center;overflow:hidden;isolation:isolate}
.hero__poster{position:absolute;inset:0;transform:scale(1.06);background:url("https://blz-contentstack-images.akamaized.net/v3/assets/blt9c12f249ac15c7ec/blt2ba5c8ba05a5aed8/6aa43f0b203da39637f0e411/Cinematic_Trailer.jpg") center/cover no-repeat;z-index:-3}
.hero__video{position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:0;transition:opacity 1.6s ease}
.hero__video.is-on{opacity:1}
.hero__video video{position:absolute;top:50%;left:50%;width:100%;height:100%;object-fit:cover;transform:translate(-50%,-50%) scale(1.12);opacity:0;transition:opacity 1s ease}
.hero__video video.is-shown{opacity:1}
.hero__video iframe{position:absolute;top:50%;left:50%;width:max(100vw,177.78svh);height:max(56.25vw,100svh);transform:translate(-50%,-50%) scale(1.18);border:0}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:
   radial-gradient(60% 45% at 50% 68%,rgba(6,12,30,.55) 0%,transparent 100%),
   radial-gradient(120% 80% at 50% 40%,transparent 35%,rgba(6,12,30,.75) 100%),
   linear-gradient(to bottom,rgba(6,12,30,.55) 0%,transparent 22%,transparent 45%,rgba(12,23,52,.92) 88%,var(--night) 100%)}

.topbar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:22px clamp(18px,4vw,48px)}
.crest{font-weight:800;display:flex;align-items:center;gap:12px;text-decoration:none;font-family:var(--display);font-size:1.35rem;letter-spacing:.06em;color:var(--parch)}
.crest img{width:46px;height:46px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.6))}
.dc-btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px 0 14px;border-radius:8px;background:#5865F2;color:#fff;text-decoration:none;font-family:"gg sans","Noto Sans","Segoe UI",system-ui,sans-serif;font-weight:600;font-size:.98rem;box-shadow:0 6px 20px rgba(0,0,0,.35);transition:background .15s}
.dc-btn:hover{background:#4752C4}
.dc-btn svg{width:24px;height:24px;flex:none}

.hero__content{text-align:center;padding:0 20px clamp(56px,10vh,110px);max-width:760px}
.hero h1{font-weight:800}
.hero__title{display:inline-flex;align-items:flex-start;justify-content:center;gap:.1em;font-family:var(--display);font-weight:800;line-height:.9;font-size:clamp(5.2rem,17vw,11.5rem);letter-spacing:.02em;
  background:linear-gradient(180deg,#fff6d8 0%,#f3d58d 38%,#c6923a 62%,#7d5418 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 rgba(40,20,0,.85)) drop-shadow(0 12px 30px rgba(0,0,0,.7))}
.hero__sub{display:block;font-weight:400;font-family:var(--display);font-size:clamp(1.25rem,2.4vw,1.6rem);color:var(--parch);margin:.4em 0 .2em;text-shadow:0 2px 12px rgba(0,0,0,.9)}
.hero__lead{max-width:34em;margin:0 auto 1.8em;color:rgba(239,226,192,.85);text-shadow:0 2px 10px rgba(0,0,0,.9)}

/* WoW-кнопка: карміновий щит у золотій оправі */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:58px;padding:0 2.2em;
  font-family:var(--display);font-size:1.35rem;letter-spacing:.03em;text-decoration:none;color:#fff3d6;
  background:linear-gradient(180deg,#c3342a 0%,var(--ember) 55%,#5a0d0a 100%);
  border:2px solid var(--gold);border-radius:4px;
  box-shadow:inset 0 1px 0 rgba(255,220,160,.5),inset 0 0 0 1px rgba(60,10,0,.6),0 0 0 1px #2b1705,0 10px 30px rgba(0,0,0,.55);
  text-shadow:0 1px 2px rgba(0,0,0,.8);transition:filter .2s,transform .2s}
.btn::before,.btn::after{content:"";position:absolute;top:50%;width:10px;height:10px;background:var(--gold);transform:translateY(-50%) rotate(45deg);box-shadow:0 0 0 2px #2b1705}
.btn::before{left:-7px}.btn::after{right:-7px}
.btn:hover{filter:brightness(1.15) saturate(1.1)}
.btn:active{transform:translateY(1px)}
.btn svg{width:26px;height:26px;flex:none}
.hero__meta{margin-top:1.4em;font-size:.98rem;color:rgba(239,226,192,.7)}
.hero__meta a{color:var(--gold)}

/* ============ ХТО МИ (синій бік мапи) ============ */
.about{position:relative;min-height:min(92vh,860px);display:flex;align-items:center;justify-content:flex-end;
  background:var(--royal) url("https://blz-contentstack-images.akamaized.net/v3/assets/blt9c12f249ac15c7ec/blt4d412035d16da095/6aa204fb2c0580bfcf273e54/masthead-art.jpg") left center/cover no-repeat}
.about::before{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--night) 0%,transparent 14%,transparent 86%,var(--night) 100%)}
.about__text{position:relative;width:min(560px,100%);margin-right:clamp(20px,8vw,140px);padding:48px 0}
.about h2{font-family:var(--display);font-weight:800;font-size:clamp(2.4rem,5vw,3.6rem);line-height:1.05;color:#fff3d6;margin-bottom:.55em;text-shadow:0 3px 18px rgba(5,10,30,.8)}
.oath{list-style:none;display:grid;gap:1.4em}
.oath li{padding-left:1.6em;position:relative}
.oath li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:9px;background:var(--gold);transform:rotate(45deg);box-shadow:0 0 12px rgba(216,178,94,.7)}
.oath b{display:block;font-family:var(--display);font-weight:400;font-size:1.45rem;color:var(--gold);line-height:1.2;margin-bottom:.15em;font-weight:800}
.oath span{color:rgba(239,226,192,.88)}

/* ============ ПЕРГАМЕНТ-ЗАКЛИК ============ */
.call{position:relative;color:#fff6e0;text-align:center;padding:clamp(70px,11vw,130px) 20px;
  background:#d9c49a url("https://blz-contentstack-images.akamaized.net/v3/assets/blt9c12f249ac15c7ec/blt3be5fbbd8ab0160d/6a9bc736f8f1240c84bcb8fd/paper-bg.jpg") center/cover;
  box-shadow:inset 0 0 160px rgba(40,24,6,.75)}
.call>*{position:relative}
.call .veil{position:absolute;inset:0;background:rgba(28,18,6,.28);pointer-events:none}
.call::before,.call::after{content:"";position:absolute;left:0;right:0;height:14px;background:linear-gradient(90deg,var(--gold-deep),var(--gold) 50%,var(--gold-deep));box-shadow:0 0 0 2px #2b1705}
.call::before{top:0}.call::after{bottom:0}
.call h2{font-family:var(--display);font-weight:800;color:#fff6e0;text-shadow:0 2px 14px rgba(20,10,0,.55);font-size:clamp(2.2rem,5.4vw,3.8rem);line-height:1.05;margin-bottom:.35em}
.call p{max-width:30em;margin:0 auto 2em;font-size:1.2rem;color:#fbf1da;text-shadow:0 1px 8px rgba(20,10,0,.6)}
.call__row{display:flex;flex-wrap:wrap;gap:22px 34px;justify-content:center;align-items:center}
.link-buy{font-family:var(--display);font-size:1.3rem;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--gold-deep);padding-bottom:2px}
.link-buy:hover{color:var(--ember);border-color:var(--ember)}

/* ============ ХТО МИ: 3IRD ============ */
.who{position:relative;padding:clamp(80px,11vw,140px) clamp(20px,5vw,60px);overflow:hidden;
  background:radial-gradient(55% 60% at 26% 50%,rgba(206,110,40,.16),transparent 70%),linear-gradient(180deg,var(--night),#0f1d40 50%,var(--night))}
.who__inner{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:clamp(36px,6vw,90px);align-items:center}
.who__crest{width:100%;height:auto;aspect-ratio:1;max-width:420px;filter:drop-shadow(0 26px 50px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(220,120,50,.18))}
.who h2{font-family:var(--display);font-weight:800;font-size:clamp(2.3rem,4.6vw,3.4rem);line-height:1.05;color:#fff3d6;margin-bottom:.15em}
.who__name{font-family:var(--display);font-size:1.2rem;color:#e8914a;margin-bottom:1.1em}
.who__story p{color:rgba(239,226,192,.9);max-width:36em;margin-bottom:1em}
.fronts{max-width:1140px;margin:clamp(56px,7vw,90px) auto 0;display:grid;grid-template-columns:repeat(4,1fr);
  border-top:2px solid var(--gold-deep);border-bottom:2px solid var(--gold-deep);background:linear-gradient(180deg,rgba(216,178,94,.06),transparent)}
.front{padding:28px 26px 30px;border-left:1px solid rgba(216,178,94,.25)}
.front:first-child{border-left:0}
.front h3{font-family:var(--display);font-weight:800;font-size:clamp(1.6rem,2.4vw,2rem);line-height:1.1;color:#fff3d6}
.front__tag{font-family:var(--display);font-size:1.05rem;color:#e8914a;margin:.2em 0 .7em}
.front p{font-size:1rem;line-height:1.55;color:rgba(239,226,192,.85)}
.front a{display:inline-block;margin-top:.8em;font-size:.98rem;color:var(--gold)}
.rules{max-width:1140px;margin:clamp(48px,6vw,70px) auto 0}
.rules h3{font-family:var(--display);font-weight:800;font-size:1.6rem;color:var(--gold);margin-bottom:.9em}
.rules ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2em 2em}
.rules li{border-left:2px solid #c9722f;padding-left:.9em;font-size:1rem;color:rgba(239,226,192,.85);line-height:1.5}
.rules b{display:block;font-weight:600;color:#fff3d6;margin-bottom:.15em}
@media (max-width:1000px){
  .fronts{grid-template-columns:1fr 1fr}
  .front:nth-child(3){border-left:0}
  .front:nth-child(n+3){border-top:1px solid rgba(216,178,94,.25)}
  .rules ul{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .who__inner{grid-template-columns:1fr;text-align:left}
  .who__crest{max-width:240px;margin:0 auto}
  .rules ul{grid-template-columns:1fr}
}
@media (max-width:600px){
  .fronts{grid-template-columns:1fr}
  .front{border-left:0}
  .front+.front{border-top:1px solid rgba(216,178,94,.25)}
  .front{padding:24px 4px}
}

/* боковий арт у заклику — «чорнило на пергаменті», лише десктоп */
.call{overflow:hidden}
.call>.call__art{position:absolute;top:14px;height:calc(100% - 28px);width:auto;max-width:33vw;object-fit:cover;pointer-events:none;display:none}
.call>.call__art--l{left:0;object-position:left center;-webkit-mask-image:linear-gradient(to right,#000 60%,transparent);mask-image:linear-gradient(to right,#000 60%,transparent)}
.call>.call__art--r{right:0;object-position:right center;-webkit-mask-image:linear-gradient(to left,#000 60%,transparent);mask-image:linear-gradient(to left,#000 60%,transparent)}
@media (min-width:1100px){.call>.call__art{display:block}.call{padding-top:140px;padding-bottom:140px}}

/* ============ ЕМБЛЕМА: WoW Forever ⇄ 3IRD ============ */
.emblem{position:relative;width:clamp(150px,19vw,220px);aspect-ratio:1;margin:0 auto 4px;perspective:1000px}
.emblem__float{position:absolute;inset:0}
.coin{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.coin__face{position:absolute;inset:0;display:grid;place-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.coin__face img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 26px rgba(0,0,0,.6))}
.coin__back{transform:rotateY(180deg)}
.coin__back img{width:94%;height:94%}
.coin__back::after{content:"";position:absolute;inset:3%;border-radius:50%;pointer-events:none;opacity:0;
  background:linear-gradient(112deg,transparent 38%,rgba(255,244,214,.75) 49%,rgba(255,255,255,.95) 50%,rgba(255,244,214,.75) 51%,transparent 62%);
  background-size:260% 100%;background-position:130% 0;mix-blend-mode:screen}
.coin__back.is-glint::after{animation:glint 1.2s cubic-bezier(.3,.1,.2,1)}
@keyframes glint{0%{opacity:1;background-position:130% 0}100%{opacity:1;background-position:-40% 0}}
.emblem__glow{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,196,110,.55),rgba(255,160,60,.18) 55%,transparent 72%);opacity:0;transform:scale(.7);pointer-events:none}
.emblem__glow.is-on{animation:glow 1.6s ease-out}
@keyframes glow{0%{opacity:0;transform:scale(.6)}25%{opacity:1;transform:scale(1.05)}100%{opacity:0;transform:scale(1.25)}}
.emblem__ring{position:absolute;inset:4%;border-radius:50%;border:2px solid #ffe3a0;box-shadow:0 0 18px rgba(255,210,120,.8),inset 0 0 18px rgba(255,210,120,.5);opacity:0;pointer-events:none}
.emblem__ring.is-on{animation:ring 1s cubic-bezier(.2,.7,.2,1)}
@keyframes ring{0%{opacity:.95;transform:scale(.7)}100%{opacity:0;transform:scale(1.9)}}
.emblem__sparks{position:absolute;inset:0;pointer-events:none}
.spark{position:absolute;left:50%;top:50%;width:var(--s,6px);height:var(--s,6px);border-radius:50%;
  background:radial-gradient(circle,#fffbe8 0 30%,#ffc861 55%,transparent 72%);
  animation:spark var(--t,.9s) cubic-bezier(.15,.7,.3,1) forwards}
@keyframes spark{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.2)}}
@media (prefers-reduced-motion:no-preference){
  .emblem.is-live .emblem__float{animation:bob 6s ease-in-out infinite}
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
}
.hero__ua{font-size:.34em;font-weight:800;line-height:1;margin-top:.32em;letter-spacing:.06em;padding:.12em .22em .06em;border:2px solid rgba(243,213,141,.75);border-radius:4px;
  background:linear-gradient(180deg,#fff6d8 0%,#f3d58d 38%,#c6923a 62%,#7d5418 100%);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ============ КОГО ШУКАЄМО ============ */
.quests{position:relative;padding:clamp(80px,10vw,130px) 22px clamp(90px,11vw,140px);
  background:radial-gradient(70% 55% at 50% 0%,rgba(216,178,94,.10),transparent 70%),linear-gradient(180deg,var(--night),#101c42 55%,var(--night))}
.quests__head{text-align:center;max-width:640px;margin:0 auto clamp(64px,7vw,84px)}
.quests__kicker{font-family:var(--display);font-size:1.1rem;letter-spacing:.14em;text-transform:uppercase;color:#e8914a}
.quests h2{font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,5.6vw,4rem);line-height:1;color:#fff3d6;margin:.15em 0 .3em}
.quests__head>p:last-child{color:rgba(239,226,192,.8);font-size:1.15rem}
.quest-grid{max-width:1140px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(22px,3vw,34px)}
.quest{position:relative;display:flex;flex-direction:column;padding:0 clamp(22px,2.4vw,30px) 28px;text-align:center;margin-top:160px;
  background:linear-gradient(180deg,rgba(33,62,128,.55),rgba(12,23,52,.85));
  border:1px solid rgba(216,178,94,.55);
  box-shadow:inset 0 0 0 5px rgba(10,20,46,.9),inset 0 0 0 6px rgba(216,178,94,.28),0 24px 50px rgba(0,0,0,.4);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.quest::before,.quest::after{content:"";position:absolute;top:-6px;width:11px;height:11px;background:var(--gold);transform:rotate(45deg);box-shadow:0 0 0 2px #2b1705;z-index:2}
.quest::before{left:-6px}.quest::after{right:-6px}
.quest:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 5px rgba(10,20,46,.9),inset 0 0 0 6px rgba(216,178,94,.45),0 30px 60px rgba(0,0,0,.5),0 0 40px rgba(245,197,52,.12)}
.quest__top{position:relative;width:150px;margin:-104px auto 16px}
.quest__portrait{position:relative;width:150px;aspect-ratio:4/5;border-radius:50%;overflow:hidden;
  border:4px solid #c9a24a;box-shadow:0 0 0 2px #2b1705,0 0 0 6px rgba(216,178,94,.35),0 14px 30px rgba(0,0,0,.55),inset 0 0 24px rgba(0,0,0,.6);background:#101a36}
.quest__portrait img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.quest:hover .quest__portrait img{transform:scale(1.07)}
.quest__portrait::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(255,236,180,.35),inset 0 -30px 40px rgba(0,0,0,.35)}
.quest__mark{position:absolute;left:50%;top:-50px;width:34px;height:54px;margin-left:-17px;z-index:2;filter:drop-shadow(0 0 10px rgba(255,200,60,.75)) drop-shadow(0 4px 6px rgba(0,0,0,.6))}
@media (prefers-reduced-motion:no-preference){
  .quest__mark{animation:qbob 2.4s ease-in-out infinite}
  .quest-grid .quest:nth-child(1) .quest__mark{animation-delay:-.6s}
  .quest-grid .quest:nth-child(2) .quest__mark{animation-delay:-1.2s}
  .quest-grid .quest:nth-child(3) .quest__mark{animation-delay:-1.8s}
  @keyframes qbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
}
.quest__label{font-family:var(--display);font-size:.9rem;letter-spacing:.2em;text-transform:uppercase;color:#f5c534}
.quest h3{font-family:var(--display);font-weight:800;font-size:clamp(1.55rem,2.3vw,1.95rem);line-height:1.12;color:#fff3d6;margin:.2em 0 .55em}
.quest p{color:rgba(239,226,192,.88);font-size:1.03rem;line-height:1.6}
.quest p.quest__label{color:#f5c534;font-size:.9rem}
.quest .quest__reward{margin-top:auto;padding-top:1.1em;border-top:1px dashed rgba(216,178,94,.4);font-size:.98rem;color:rgba(239,226,192,.8)}
.quest h3+p{margin-bottom:1.3em}
.quest__reward b{color:#f5c534;font-weight:600}

/* головний квест — одинаки */
.quest--main{max-width:1140px;margin:56px auto 0;flex-direction:row;align-items:center;gap:clamp(28px,4vw,56px);text-align:left;
  padding:clamp(28px,3.4vw,44px) clamp(24px,4vw,56px);
  background:radial-gradient(80% 120% at 0% 50%,rgba(245,197,52,.16),transparent 60%),linear-gradient(180deg,rgba(42,74,150,.7),rgba(14,27,62,.92));
  border-color:#e0bb62;
  box-shadow:inset 0 0 0 5px rgba(10,20,46,.9),inset 0 0 0 6px rgba(245,197,52,.45),0 30px 70px rgba(0,0,0,.5),0 0 60px rgba(245,197,52,.14)}
.quest--main .quest__top{width:220px;margin:0;flex:none}
.quest--main .quest__portrait{width:220px;border-width:5px;border-color:#f0c65a;box-shadow:0 0 0 2px #2b1705,0 0 0 8px rgba(245,197,52,.35),0 0 40px rgba(245,197,52,.35),0 18px 36px rgba(0,0,0,.6)}
.quest--main .quest__mark{top:-58px;width:40px;height:64px;margin-left:-20px}
.quest__body{display:flex;flex-direction:column;align-items:flex-start}
.quest--main p.quest__label{font-size:1rem;color:#ffd35c}
.quest--main h3{font-size:clamp(2rem,3.6vw,2.8rem);margin:.15em 0 .4em}
.quest--main h3+p{font-size:1.12rem;max-width:36em;margin-bottom:1em}
.quest--main .quest__reward{margin:0 0 1.4em;padding-top:.9em;align-self:stretch;max-width:36em}
.btn--small{min-height:50px;font-size:1.12rem;padding:0 1.8em}
.quest--main:hover{transform:translateY(-4px)}

/* ============ ЛОГОТИПИ НАПРЯМІВ ============ */
.front__logo{height:52px;display:flex;align-items:center;margin-bottom:14px}
.front__logo img{max-height:44px;max-width:100%;width:auto;height:auto;opacity:.95}
.front:first-child .front__logo img{max-height:52px}
.multi{gap:10px;color:#f4ecd6}
.multi__pad{width:48px;height:30px;flex:none}
.multi__word{display:block;font-weight:800;height:1.35em;overflow:hidden;font-family:var(--display);font-size:1.22rem;line-height:1.35;text-transform:uppercase;letter-spacing:.04em;color:#f4ecd6}
.multi__roll{display:flex;flex-direction:column}
.multi__roll span{display:block;white-space:nowrap}
@media (prefers-reduced-motion:no-preference){
  .multi__roll{animation:roll 12s cubic-bezier(.7,0,.3,1) infinite}
  @keyframes roll{
    0%,14%{transform:translateY(0)}
    20%,34%{transform:translateY(-1.35em)}
    40%,54%{transform:translateY(-2.7em)}
    60%,74%{transform:translateY(-4.05em)}
    80%,94%{transform:translateY(-5.4em)}
    100%{transform:translateY(-6.75em)}
  }
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ============ ІКОНКИ ПРАВИЛ ============ */
.rule__icon{display:block;width:34px;height:34px;margin-bottom:.55em;fill:none;stroke:#e8914a;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.rule__icon text{fill:#e8914a;stroke:none;font-family:var(--text);font-weight:600;font-size:10.5px}
.rules li{border-left:0;padding-left:0;padding-top:.2em}

@media (max-width:900px){
  .quest-grid{grid-template-columns:1fr;gap:0;max-width:520px;margin:0 auto}
  .quest--main{flex-direction:column;text-align:center;max-width:520px;margin-top:170px}
  .btn--small{padding:.7em 1.3em;font-size:1.05rem;line-height:1.25}
  .quest--main .quest__top{margin-top:-110px;width:190px}
  .quest--main .quest__portrait{width:190px}
  .quest__body{align-items:center}
}

/* ============ ПИТАННЯ ============ */
.faq{max-width:760px;margin:0 auto;padding:clamp(60px,9vw,100px) 22px 20px}
.faq h2{font-family:var(--display);font-weight:800;font-size:clamp(2rem,4.4vw,2.8rem);color:#fff3d6;margin-bottom:.6em}
.faq details{border-top:1px solid rgba(216,178,94,.3)}
.faq details:last-of-type{border-bottom:1px solid rgba(216,178,94,.3)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1em;padding:1.05em 0;font-family:var(--display);font-size:1.3rem;color:var(--gold)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-size:1.5rem;line-height:1;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 1.2em;color:rgba(239,226,192,.88);max-width:36em}

/* ============ СТОРІНКА ПРАВИЛ ============ */
.legal-top{display:flex;align-items:center;justify-content:space-between;padding:22px clamp(18px,4vw,48px);border-bottom:1px solid rgba(216,178,94,.25)}
.legal-back{font-family:var(--display);font-size:1.1rem;color:var(--gold)}
.legal{max-width:720px;margin:0 auto;padding:clamp(40px,7vw,80px) 22px 40px}
.legal h1{font-weight:800;font-family:var(--display);font-weight:800;font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.1;color:#fff3d6}
.legal__date{color:rgba(239,226,192,.6);margin:.4em 0 1.6em;font-size:1rem}
.legal__toc{display:flex;flex-wrap:wrap;gap:.6em 1.6em;padding:1em 0;border-top:1px solid rgba(216,178,94,.3);border-bottom:1px solid rgba(216,178,94,.3);margin-bottom:2.4em}
.legal__toc a{font-family:var(--display);font-size:1.1rem;color:var(--gold)}
.legal section{margin-bottom:2.6em;scroll-margin-top:24px}
.legal h2{font-family:var(--display);font-weight:800;font-size:clamp(1.7rem,3.4vw,2.2rem);color:var(--gold);margin-bottom:.5em}
.legal h3{font-weight:600;font-size:1.08rem;color:#fff3d6;margin:1.3em 0 .3em}
.legal p{color:rgba(239,226,192,.88);margin-bottom:.8em}
.legal strong{color:#fff3d6;font-weight:600}
.legal a{color:var(--gold)}
footer p{max-width:62em;margin:0 auto .6em}

footer{padding:34px 20px 40px;text-align:center;font-size:.9rem;color:rgba(239,226,192,.5)}
footer a{color:rgba(239,226,192,.75)}

/* ============ одна сцена появи ============ */
@media (prefers-reduced-motion:no-preference){
  .emblem,.hero__title,.hero__sub,.hero__lead,.hero__cta,.hero__meta{opacity:0;animation:rise 1.1s cubic-bezier(.2,.7,.2,1) forwards}
  .hero__title{animation-delay:.25s}.hero__sub{animation-delay:.55s}.hero__lead{animation-delay:.7s}.hero__cta{animation-delay:.9s}.hero__meta{animation-delay:1.05s}
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

@media (max-width:820px){
  .about{background-position:22% center;align-items:flex-end;min-height:auto;padding-top:46vw}
  .about::before{background:linear-gradient(to bottom,var(--night) 0%,transparent 20%,rgba(17,35,80,.85) 55%,var(--night) 100%)}
  .about__text{margin:0 auto;padding:40px 22px 70px}
  .dc-btn{height:40px;padding:0 12px}
  .dc-btn span{display:none}
  .dc-btn::after{content:"Discord"}
  .btn{font-size:1.2rem;padding:0 1.6em}
}