@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Montserrat:wght@300;400;500&display=swap");
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#02050a}
body{margin:0;min-height:100svh;background:#02050a;color:#f7f3ed;font-family:Georgia,"Times New Roman",serif}
body.locked{overflow:hidden}
body > *{position:relative}


.entry{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#03070d;opacity:1;visibility:visible;transition:opacity 1.05s ease,visibility 1.05s ease}
.entry.leave{opacity:0;visibility:hidden;pointer-events:none}
.entry-bg{position:absolute;inset:-2%;background:url("../../images/entry-background.webp") center center/cover no-repeat;animation:entryBreathe 12s ease-in-out infinite alternate;transform:scale(1.02)}
.entry-veil{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(2,8,17,.08) 0%,rgba(0,0,0,.26) 52%,rgba(0,0,0,.68) 100%),linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.34))}
.entry-content{position:relative;z-index:2;text-align:center;text-shadow:0 4px 35px #000;padding:24px}
.entry-eyebrow{font:300 12px/1 Montserrat,Arial,sans-serif;letter-spacing:.58em;margin-left:.58em;color:#d8b36a}
.entry h1,.entry-question{margin:26px 0 38px;font-weight:400;font-size:clamp(36px,5vw,70px);line-height:.98;letter-spacing:.02em}
.seo-note{margin:18px auto 0;max-width:820px;text-align:center;font:400 9px/1.5 Montserrat,Arial,sans-serif;letter-spacing:.08em;color:rgba(226,210,174,.55)}
.entry button{border:1px solid #d6a956;background:rgba(0,0,0,.22);color:#e5bf72;padding:16px 32px;font:500 12px Montserrat,Arial,sans-serif;letter-spacing:.18em;cursor:pointer;transition:.4s ease}
.entry button:hover,.entry button:focus-visible{background:rgba(214,169,86,.10);border-color:#f1cb79;transform:translateY(-2px)}
@keyframes entryBreathe{from{transform:scale(1.02)}to{transform:scale(1.055)}}

.hero{position:relative;min-height:100svh;overflow:hidden;display:flex;flex-direction:column;align-items:center;background:#03070d;isolation:isolate}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.20) 55%,rgba(0,0,0,.48));pointer-events:none}
.side-glow{position:absolute;top:0;bottom:0;width:54%;z-index:-1;opacity:0;transition:opacity .55s ease,filter .55s ease;pointer-events:none}
.left-glow{left:-10%;background:radial-gradient(ellipse at 48% 52%,rgba(19,126,255,.25),transparent 67%);filter:blur(12px)}
.right-glow{right:-10%;background:radial-gradient(ellipse at 52% 52%,rgba(255,36,26,.27),transparent 67%);filter:blur(12px)}
.hero.hover-left .left-glow,.hero.hover-right .right-glow{opacity:1}
.hero.hover-left .right-glow,.hero.hover-right .left-glow{opacity:.05}

.brand{text-align:center;margin-top:7.2vh;position:relative;z-index:2;padding:18px 42px 20px;border-radius:18px;background:radial-gradient(ellipse at center,rgba(2,7,14,.66) 0%,rgba(2,7,14,.42) 48%,rgba(2,7,14,0) 82%);box-shadow:0 12px 45px rgba(0,0,0,.16)}
.eyebrow{font-size:13px;letter-spacing:.72em;margin-left:.72em;color:#d8b36a;text-shadow:0 2px 10px rgba(0,0,0,.95),0 0 18px rgba(0,0,0,.7)}
.brand h1{font-size:clamp(42px,5.2vw,82px);font-weight:400;letter-spacing:.18em;margin:17px 0 7px .18em;line-height:1;text-shadow:0 3px 16px rgba(0,0,0,1),0 0 30px rgba(0,0,0,.65)}
.subtitle{font-size:clamp(13px,1.35vw,22px);letter-spacing:.42em;margin-left:.42em;color:#e4c47d;text-shadow:0 2px 10px rgba(0,0,0,.95),0 0 18px rgba(0,0,0,.7)}
.choice{width:min(1000px,78vw);text-align:center;margin-top:7vh;position:relative;z-index:2;padding:18px 28px 22px;border-radius:22px;background:linear-gradient(180deg,rgba(2,6,12,.50),rgba(2,6,12,.27) 58%,rgba(2,6,12,0));box-shadow:0 10px 42px rgba(0,0,0,.12)}
.choice h2{font-size:clamp(29px,3.15vw,49px);font-weight:400;letter-spacing:.08em;margin:0 0 19px;text-shadow:0 2px 12px rgba(0,0,0,.95),0 0 24px rgba(0,0,0,.65)}
.gold-line{display:flex;align-items:center;justify-content:center;gap:25px;color:#e2bd72;font-size:14px;letter-spacing:.32em}
.gold-line span{height:1px;width:125px;background:linear-gradient(90deg,transparent,#c99d50);box-shadow:0 0 8px rgba(214,169,84,.15)}
.gold-line span:last-child{background:linear-gradient(90deg,#c99d50,transparent)}
.gold-line b{font-weight:400;white-space:nowrap;text-shadow:0 2px 10px rgba(0,0,0,.95),0 0 18px rgba(0,0,0,.7)}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:74px;margin-top:39px}
.choice-card{position:relative;display:flex;flex-direction:column;align-items:center;overflow:hidden;height:390px;padding:0 20px 20px;text-decoration:none;color:#f5dfac;border:1px solid rgba(214,169,84,.75);background:linear-gradient(180deg,rgba(2,13,25,.16),rgba(0,5,12,.72));box-shadow:inset 0 0 35px rgba(0,0,0,.32);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,border-color .45s ease}
.choice-card:before,.choice-card:after{content:"";position:absolute;width:15px;height:15px;border-color:#d6a956}
.choice-card:before{left:-1px;top:-1px;border-left:1px solid;border-top:1px solid}.choice-card:after{right:-1px;bottom:-1px;border-right:1px solid;border-bottom:1px solid}
.choice-card:hover,.choice-card:focus-visible{transform:translateY(-8px);border-color:#f3ca76}
.left-card:hover,.left-card:focus-visible{box-shadow:0 0 38px rgba(15,117,230,.27),inset 0 0 38px rgba(10,81,153,.24)}
.right-card:hover,.right-card:focus-visible{box-shadow:0 0 38px rgba(255,40,27,.27),inset 0 0 38px rgba(153,10,10,.24)}
.art{position:relative;width:100%;height:265px;display:flex;justify-content:center;align-items:center;overflow:hidden;flex-shrink:0}.art img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .55s ease}
.art-masks img{width:min(430px,100%)}.art-heart img{width:min(385px,100%)}
.left-card:hover .art-masks img,.left-card:focus-visible .art-masks img{transform:translateY(-4px) translateX(-5px) scale(1.025);filter:drop-shadow(0 0 14px rgba(31,133,255,.55))}
.right-card:hover .art-heart img,.right-card:focus-visible .art-heart img{transform:translateY(-5px) translateX(5px) scale(1.025);filter:drop-shadow(0 0 17px rgba(255,32,20,.55))}
.card-label{font-size:21px;letter-spacing:.06em;margin-top:5px;color:#ead08f}.arrow{width:58px;height:58px;border:1px solid #e5b85d;border-radius:50%;display:grid;place-items:center;font:32px Georgia,serif;margin-top:15px;color:#e7c375;transition:transform .4s ease,box-shadow .4s ease,background .4s ease}.choice-card:hover .arrow{transform:scale(1.08);box-shadow:0 0 22px rgba(231,190,103,.28);background:rgba(231,190,103,.05)}
.quote{position:relative;z-index:2;text-align:center;font-style:italic;font-size:18px;line-height:1.5;letter-spacing:.02em;margin:39px 0 26px;color:#eee7dd}.ornament{color:#e3b861;font-style:normal;font-size:25px;margin-top:13px;letter-spacing:1.2em;margin-left:1.2em}

.hero::before{content:"";position:absolute;inset:-12%;z-index:-2;background:inherit;background-position:center center;background-size:cover;transition:transform 1.15s cubic-bezier(.65,0,.2,1),filter 1.15s ease;transform:scale(1)}
.hero.transition-moon::before{transform:scale(1.42) translate(7%,1%);filter:brightness(1.08) saturate(1.08)}
.hero.transition-castle::before{transform:scale(1.42) translate(-9%,0);filter:brightness(1.08) saturate(1.1)}
.hero.transitioning{cursor:wait}.hero.transitioning .choice-card{pointer-events:none}.hero.transitioning .choice{transition:opacity .65s ease,transform .85s ease}.hero.transitioning .choice{opacity:.15;transform:scale(.98)}
.page-transition{position:fixed;inset:0;z-index:1100;pointer-events:none;opacity:0;background:#02050a;transition:opacity .65s ease}.page-transition.active{opacity:.82}.transition-vignette{position:absolute;inset:0;background:radial-gradient(circle at center,transparent 20%,rgba(0,0,0,.75) 100%)}
body.route-leaving .brand,body.route-leaving .quote{opacity:0;transition:opacity .5s ease}

@media (prefers-reduced-motion:reduce){.entry,.entry-bg,.hero::before,.hero .choice,.page-transition{animation:none;transition-duration:.2s}}
@media (max-width:800px){.entry h1,.entry-question{font-size:clamp(31px,8.7vw,52px);margin-bottom:32px}.entry button{padding:15px 22px;font-size:10px;letter-spacing:.15em}.hero{min-height:100svh;background-position:center top}.brand{margin-top:5vh;padding:14px 20px 16px}.choice{width:90vw;margin-top:5vh;padding:14px 12px 18px}.choice h2{font-size:29px}.gold-line{gap:12px;font-size:11px;letter-spacing:.22em}.gold-line span{width:55px}.choices{gap:14px;margin-top:28px}.choice-card{height:315px;padding:0 8px 12px}.art{height:205px}.art-masks img{width:min(285px,100%)}.art-heart img{width:min(265px,100%)}.card-label{font-size:14px}.arrow{width:48px;height:48px;font-size:26px;margin-top:12px}.quote{font-size:14px;margin-top:28px}}
@media (max-width:520px){.entry-eyebrow{font-size:9px}.eyebrow{font-size:9px}.brand h1{font-size:38px;letter-spacing:.13em}.subtitle{font-size:10px;letter-spacing:.26em}.choice{margin-top:4.5vh}.choice h2{font-size:24px}.choices{grid-template-columns:1fr 1fr}.choice-card{height:285px}.art{height:185px}.art-masks img{width:min(245px,100%)}.art-heart img{width:min(225px,100%)}.card-label{font-size:11px;letter-spacing:.02em}.arrow{width:43px;height:43px}}

body.world-entered .hero{background-image:url("../../images/entry-background.webp");background-position:center center;background-size:cover;background-repeat:no-repeat;}
@media(max-width:800px){body.world-entered .hero{background-position:center top;}}


@media (max-width:800px){
  .choices{align-items:stretch;grid-auto-rows:315px;}
  .choice-card{height:315px;min-height:315px;align-self:stretch;}
  .choice-card.left-card,.choice-card.right-card{margin:0;top:0;}
  .art{height:205px;min-height:205px;flex:0 0 205px;}
  .arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    place-items:unset;
    flex:0 0 auto;
    padding:0;
    line-height:1;
    text-align:center;
  }
}
@media (max-width:520px){
  .choices{grid-auto-rows:285px;}
  .choice-card{height:285px;min-height:285px;}
  .art{height:185px;min-height:185px;flex-basis:185px;}
  .arrow{width:43px;height:43px;font-size:26px;line-height:1;}
}

/* Dotyk mobilny: karta nie pozostaje w stanie focus po wyborze. */
@media (hover:none) and (pointer:coarse){
  .choice-card:focus,
  .choice-card:focus-visible{
    outline:none;
    transform:none;
  }
  .left-card:focus,.left-card:focus-visible,
  .right-card:focus,.right-card:focus-visible{
    box-shadow:inset 0 0 35px rgba(0,0,0,.32);
    border-color:rgba(214,169,84,.75);
  }
}

/* Strzałka jest centrowana optycznie niezależnie od fontu i urządzenia. */
.arrow{
  position:relative;
  display:block;
  font-size:0;
  line-height:0;
  transform:none;
}
.arrow::before{
  content:"→";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-54%);
  font:32px/1 Arial,Helvetica,sans-serif;
  color:#e7c375;
  white-space:nowrap;
}
.choice-card:hover .arrow,
.choice-card:focus-visible .arrow{
  transform:scale(1.08);
}
.choice-card:hover .arrow::before,
.choice-card:focus-visible .arrow::before{
  transform:translate(-50%,-54%);
}
@media (max-width:800px){
  .arrow::before{font-size:26px;}
}
@media (max-width:520px){
  .arrow::before{font-size:26px;}
}