/* Title page only. */
@import url('./fonts.css');
:root{--wine:#491e24;--deep:#291518;--gold:#c5a263;--paper:#f3eddf;--ink:#302724;--muted:#756c60}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;color:var(--ink);background:var(--paper);font-family:'Manrope',Arial,sans-serif;font-size:14px;line-height:1.7}
button,input{font:inherit}
button,a,input,summary{outline-offset:5px}
.hero{position:relative;min-height:730px;overflow:hidden;background:#271b18;color:#fff4de}
.hero:after{content:'';position:absolute;inset:21px;border:1px solid #bca16c44;pointer-events:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(min-width:1600px){.hero{min-height:810px}}
@media(max-width:1000px){.hero{min-height:690px}}
@media(max-width:720px){.hero{min-height:730px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*{transition:none!important}}
body:has(.flag-hero) header{position:absolute;top:0;left:0;right:0;background:linear-gradient(#fffdf3d9,#fffdf32b);border-bottom:1px solid #76634b33;color:#292329;height:88px;padding-inline:5%;z-index:5}
body:has(.flag-hero) header .brand img{width:39px;height:46px}
.flag-hero{height:100svh;min-height:780px;overflow:hidden;background:#f7f6f2;color:#26212a;isolation:isolate}
.flag-hero:after{inset:16px;z-index:4;border-color:#c2a26766;pointer-events:none}
.motion-filters{position:absolute;pointer-events:none}
.flag-silk{position:absolute;inset:-36px;background:url('assets/flaga-jedwab.png') center/cover;filter:url('#silk-wave');animation:flag-breathe 14s ease-in-out infinite;z-index:-3}
.flag-light{position:absolute;inset:0;background:linear-gradient(180deg,#fffdf522 0%,#fffdf50a 42%,#44001400 63%,#43041255 100%);z-index:-1}
.flag-title{position:absolute;left:5%;right:5%;top:16%;text-align:center;z-index:2;text-shadow:0 2px 16px #fffaf4b0}
.flag-title .eyebrow{color:#66512f;font-size:9px;letter-spacing:3px;margin:0 0 15px}
.flag-hero .flag-title h1{font-size:clamp(40px,4.3vw,71px);line-height:1.01;letter-spacing:-1.3px;margin:0;font-weight:600;color:#2b2530}
.flag-title h1 span{font-size:.88em}
.flag-hero .motto{font-size:clamp(25px,2.5vw,39px);margin:17px 0 0;color:#76551f;font-weight:500}
.eagle-aura{position:absolute;top:45%;bottom:17%;left:30%;right:30%;display:flex;justify-content:center;align-items:center;z-index:1;animation:eagle-float 12s ease-in-out infinite}
.flag-eagle{height:100%;width:100%;object-fit:contain;filter:brightness(1.18) drop-shadow(0 0 3px #fff) drop-shadow(0 0 17px #fff9) drop-shadow(0 8px 18px #360007aa)}
.flag-actions{position:absolute;bottom:9%;left:0;right:0;text-align:center;z-index:3}
.flag-actions .button{color:#fff6e4;background:#571c2a7a;border-color:#e8cf9eaa;backdrop-filter:blur(8px);padding:13px 24px;font-weight:500;letter-spacing:.4px;box-shadow:0 3px 25px #4208192b}
.flag-actions .button:hover{background:#671a30c9}
.flag-caption{position:absolute;bottom:31px;left:5%;right:5%;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff2dd;z-index:3;font-size:8px;letter-spacing:1.7px;text-shadow:0 1px 5px #4a001d}
.flag-caption button{background:#47041c45;border:1px solid #f6e5c65c;border-radius:2px;color:#fff4de;padding:8px 12px;font-size:9px;letter-spacing:.4px}
.flag-caption button span{margin-right:6px}
.motion-paused .flag-silk,.motion-paused .eagle-aura{animation-play-state:paused}
@keyframes flag-breathe{0%,100%{transform:scale(1.035) translate(-.35%,.15%)}50%{transform:scale(1.06) translate(.35%,-.4%)}}
@keyframes eagle-float{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-7px) rotate(.4deg)}}
@media(min-width:1600px){.flag-hero{min-height:850px}
.flag-title{top:15%}
.eagle-aura{top:43%;bottom:18%}}
@media(max-width:720px){body:has(.flag-hero) header{height:75px;padding-inline:7%}
.flag-hero{min-height:740px;height:100svh}
.flag-title{top:19%;left:7%;right:7%}
.flag-title .eyebrow{font-size:7px;letter-spacing:1.8px;margin-bottom:17px}
.flag-hero .flag-title h1{font-size:43px;letter-spacing:-.9px;line-height:1.02}
.flag-title h1 span{font-size:.88em}
.flag-hero .motto{font-size:28px;margin-top:18px}
.eagle-aura{top:47%;bottom:19%;left:15%;right:15%}
.flag-silk{background-position:53% center}
.flag-caption{bottom:26px;left:8%;right:8%;font-size:6px;letter-spacing:.8px;gap:10px}
.flag-caption button{font-size:8px;padding:7px 8px}
.flag-actions{bottom:10%}
.flag-actions .button{font-size:11px;padding:11px 18px}}
@media(prefers-reduced-motion:reduce){.flag-silk,.eagle-aura{animation:none}
.flag-silk{filter:none}}
.flag-hero{min-height:640px}
@media(min-width:1600px){.flag-hero{min-height:720px}}
@media(max-width:720px){.flag-hero{min-height:640px}}
body{font-family:'EB Garamond',Georgia,serif;font-size:18px;line-height:1.65}
button,input{font-family:'EB Garamond',Georgia,serif}
.flag-hero .flag-title h1{font-size:clamp(48px,5.2vw,80px);font-weight:500;letter-spacing:.1px;line-height:.99}
.flag-title h1 span{font-size:.88em}
.motto,.flag-hero .motto{font-family:'EB Garamond',Georgia,serif;font-style:italic;font-weight:500}
.flag-title .eyebrow{font-size:11px;letter-spacing:2.7px}
.flag-hero .motto{font-size:37px;margin-top:15px}
.flag-title{top:16%}
.eagle-aura{top:47%}
.button,.flag-actions .button{font-size:17px}
.flag-caption{font-size:10px}
.flag-caption button{font-size:13px}
@media(max-width:720px){.flag-hero .flag-title h1{font-size:43px;line-height:1.04}
.flag-title{top:19%}
.flag-hero .motto{font-size:31px;margin-top:16px}
.flag-title .eyebrow{font-size:9px;letter-spacing:1.5px}
.flag-caption{font-size:8px}
.flag-caption button{font-size:11px}
.flag-actions .button{font-size:16px}}
.flag-hero{min-height:720px}
.flag-eagle{filter:none}
.eagle-aura{left:39%;right:2%;top:99px;bottom:48px;animation:none}
.flag-title{left:6%;right:auto;top:23%;width:32%;text-align:left;text-shadow:none}
.flag-hero .flag-title h1{font-size:clamp(43px,4.4vw,68px);line-height:1.04;letter-spacing:0}
.flag-title h1 span{font-size:.88em}
.flag-title .eyebrow{font-size:10px;letter-spacing:2px;line-height:1.8;margin-bottom:19px}
.flag-hero .motto{font-size:34px;line-height:1.2;margin-top:22px;color:#654723}
.flag-actions{left:6%;right:auto;bottom:18%;width:32%;text-align:left}
.flag-caption{left:6%;right:5%;bottom:25px}
.flag-light{background:linear-gradient(180deg,#fffdf508 0%,transparent 65%,#43041240 100%)}
@media(min-width:1600px){.flag-hero{min-height:780px}
.eagle-aura{top:105px;bottom:50px}
.flag-title{top:25%}}
@media(max-width:1000px) and (min-width:721px){.flag-title{left:5%;width:35%;top:23%}
.flag-hero .flag-title h1{font-size:44px}
.flag-title .eyebrow{font-size:8px;letter-spacing:1.5px}
.flag-hero .motto{font-size:29px}
.eagle-aura{left:41%;right:1%;top:110px;bottom:65px}
.flag-actions{left:5%;width:35%}
.flag-actions .button{font-size:15px;padding-inline:16px;gap:16px}}
@media(max-width:720px){.flag-hero{height:100svh;min-height:950px}
.flag-title{top:102px;left:7%;right:7%;width:auto;text-align:center}
.flag-hero .flag-title h1{font-size:42px;line-height:1.02}
.flag-title h1 span{font-size:.85em}
.flag-title .eyebrow{font-size:8px;letter-spacing:1.6px;margin-bottom:11px}
.flag-hero .motto{font-size:29px;margin-top:12px}
.eagle-aura{top:305px;bottom:143px;left:3%;right:3%;animation:none}
.flag-actions{left:7%;right:7%;width:auto;text-align:center;bottom:80px}
.flag-actions .button{font-size:16px}
.flag-caption{left:7%;right:7%;bottom:25px}
.flag-silk{background-position:center}}
@media(min-width:721px){.flag-title{top:16%}
.flag-hero .flag-title .motto{position:absolute;top:40svh;left:0;width:100%;margin:0;color:#fff1d7;font-size:34px}
.flag-hero .flag-title h1{font-size:clamp(43px,4.4vw,68px)}}
@media(max-width:1000px) and (min-width:721px){.flag-hero .flag-title h1{font-size:44px}
.flag-hero .flag-title .motto{font-size:29px}}
.flag-eagle{filter:none;image-rendering:auto}
.flag-caption>span{max-width:60%;line-height:1.6}
@media(max-width:720px){.flag-caption>span{max-width:52%;font-size:7px;letter-spacing:.6px}}
.flag-hero{height:100svh;min-height:820px}
.flag-hero .arc-title{position:static;inset:auto;width:auto;text-align:center;text-shadow:none}
.heraldic-title{position:absolute;top:78px;left:50%;transform:translateX(-50%);width:min(1120px,98%);height:auto;overflow:visible;z-index:3;pointer-events:none}
.heraldic-title text{font-family:'Grenze Gotisch','EB Garamond',Georgia,serif;font-size:69px;font-weight:500;letter-spacing:.2px}
.flag-hero .flag-title h1.sr-only{font-size:1px}
.eagle-aura{left:50%;right:auto;top:200px;bottom:153px;width:min(620px,66%);transform:translateX(-50%);animation:none;z-index:2}
.flag-eagle{filter:none}
.flag-hero .flag-title .motto{position:absolute;top:auto;bottom:94px;left:0;right:0;width:auto;margin:0;color:#fff0c8;font-size:34px;line-height:1.2;z-index:3}
.flag-actions{left:0;right:0;bottom:38px;width:auto;text-align:center;z-index:3}
.flag-actions .button{padding:10px 24px;font-size:16px}
.flag-caption{bottom:23px;left:5%;right:5%}
.flag-caption>span{max-width:34%;font-size:8px;letter-spacing:1px}
.flag-light{background:linear-gradient(0deg,#59000e22,transparent 22%)}
.flag-silk{inset:-65px;animation:flag-strong-wave 10s ease-in-out infinite;filter:url('#silk-wave') saturate(1.08)}
@keyframes flag-strong-wave{0%,100%{transform:scale(1.07) translate(-.7%,.3%) rotate(-.45deg)}50%{transform:scale(1.11) translate(.7%,-.7%) rotate(.45deg)}}
@media(min-width:1600px){.flag-hero{min-height:900px}
.heraldic-title{top:80px;width:min(1260px,92%)}
.eagle-aura{top:215px;bottom:157px;width:min(700px,68%)}}
@media(max-width:1000px) and (min-width:721px){.heraldic-title{top:99px;width:100%}
.eagle-aura{top:220px;bottom:160px;width:73%}
.flag-hero .flag-title .motto{font-size:33px}
.flag-actions{left:0;right:0;width:auto}
.flag-caption>span{max-width:30%;font-size:7px}}
@media(max-width:720px){.flag-hero{min-height:820px;height:100svh}
.heraldic-title{top:104px;width:calc(100% + 4px)}
.heraldic-title text{font-size:70px;stroke-width:1}
.eagle-aura{top:230px;bottom:191px;left:50%;right:auto;width:100%;transform:translateX(-50%)}
.flag-hero .flag-title .motto{bottom:139px;font-size:31px}
.flag-actions{left:0;right:0;bottom:80px;width:auto;text-align:center}
.flag-caption{left:6%;right:6%;bottom:23px}
.flag-caption>span{max-width:52%;font-size:7px;letter-spacing:.6px}
.flag-caption button{font-size:11px}
.flag-silk{background-position:50% center}}
@media(prefers-reduced-motion:reduce){.flag-silk{animation:none;filter:none}}
.flag-silk{background-image:url('assets/flaga-biel-czerwien-intensywna.png')}
.eagle-aura{top:185px;bottom:140px}
@media(max-width:1000px) and (min-width:721px){.eagle-aura{top:210px;bottom:151px}}
@media(max-width:720px){.eagle-aura{top:230px;bottom:191px}}
body:has(.flag-hero) header{background:linear-gradient(#ffffffd9,#ffffff25)}
.heraldic-title text{font-size:68px;letter-spacing:0;filter:drop-shadow(0 2px 1px rgb(0 0 0 / 48%))}
.heraldic-motto{position:absolute;left:50%;bottom:24px;width:min(650px,88%);height:auto;transform:translateX(-50%);overflow:visible;z-index:3;pointer-events:none}
.heraldic-motto text{font-family:'EB Garamond',Georgia,serif;font-style:italic;font-weight:500;font-size:76px;letter-spacing:.5px;filter:drop-shadow(0 2px 1px rgb(0 0 0 / 42%))}
.flag-actions{left:5%;right:auto;bottom:47px;width:auto;text-align:left}
.flag-actions .button{font-size:15px;padding:9px 18px;gap:20px}
.flag-caption>span{max-width:35%}
@media(max-width:1000px) and (min-width:721px){.heraldic-motto{width:62%;bottom:31px}
.flag-actions{left:5%;right:auto;bottom:52px;width:auto}
.flag-actions .button{font-size:13px;padding:8px 12px;gap:12px}}
@media(max-width:720px){.heraldic-title text{font-size:68px;letter-spacing:0}
.heraldic-motto{width:calc(100% - 16px);bottom:120px}
.heraldic-motto text{font-size:82px}
.flag-actions{left:0;right:0;bottom:68px;width:auto;text-align:center}
.flag-actions .button{font-size:16px;padding:10px 22px}
.flag-caption>span{max-width:52%}}
@media(min-width:721px){.flag-actions{bottom:65px}}
img.heraldic-title,img.heraldic-motto{display:block;object-fit:contain;filter:none;-webkit-filter:none;pointer-events:none}
.eagle-aura{animation:royal-eagle-breath 8s ease-in-out infinite;transform-origin:center center;will-change:transform}
@keyframes royal-eagle-breath{0%,100%{transform:translateX(-50%) translateY(0) scale(1)}50%{transform:translateX(-50%) translateY(-4px) scale(1.008)}}
@media(prefers-reduced-motion:reduce){.eagle-aura{animation:none;will-change:auto}}
.flag-hero{min-height:900px}
.eagle-aura{bottom:220px}
.heraldic-values{position:absolute;left:50%;bottom:88px;width:min(540px,85%);height:auto;transform:translateX(-50%);z-index:3;display:block;object-fit:contain;pointer-events:none}
@media(max-width:720px){.flag-hero{min-height:880px}
.eagle-aura{bottom:250px}
.heraldic-values{bottom:210px;width:92%}}
body:has(.flag-hero) header{position:relative;inset:auto;top:auto;height:88px;background:#f6f0e3;border-top:1px solid #c5a26355;border-bottom:1px solid #c5a26366;color:#292329;z-index:5}
@media(max-width:720px){body:has(.flag-hero) header{height:75px}}
.heraldic-title,.heraldic-side{position:absolute;top:50%;left:50%;width:min(1100px,98%);height:auto;z-index:3;display:block;object-fit:contain;pointer-events:none;transform:translate(-50%,-50%)}
@media(min-width:1600px){.heraldic-title,.heraldic-side{width:min(1240px,95%)}}
@media(max-width:720px){.heraldic-title,.heraldic-side{top:49%;width:120%}
.eagle-aura{width:82%}}
.heraldic-title{top:calc(40px - 1cm);left:50%;width:min(1180px,96%);height:auto;transform:translateX(-50%)}
@media(max-width:720px){.heraldic-title{top:calc(80px - 1cm);width:96%}}
.eagle-aura{top:142px;bottom:125px;width:min(900px,76%)}
.heraldic-title{top:calc(0px - 1cm)}
.heraldic-values{bottom:42px}
.heraldic-side{top:75%;width:min(240px,20%);height:auto;transform:translateY(-50%)}
.heraldic-left{left:2%;right:auto}
.heraldic-right{left:auto;right:2%}
@media(max-width:1000px) and (min-width:721px){.eagle-aura{width:82%;top:155px;bottom:140px}
.heraldic-side{top:76%;width:24%}
.heraldic-left{left:3%}
.heraldic-right{right:3%}}
@media(max-width:720px){.flag-hero{min-height:820px}
.eagle-aura{top:100px;bottom:220px;width:96%}
.heraldic-title{top:12px;width:96%}
.heraldic-side{top:76%;width:44%}
.heraldic-left{left:3%}
.heraldic-right{right:3%}
.heraldic-values{bottom:130px;width:92%}}
.eagle-relief{position:relative;width:100%;height:100%;transform-origin:50% 50%;transform:perspective(1200px) rotateX(var(--relief-pitch,0deg)) rotateY(var(--relief-yaw,0deg)) translateZ(12px);transition:transform 240ms ease-out;will-change:transform;filter:drop-shadow(0 3px 1px rgb(48 25 8 / 22%)) drop-shadow(9px 20px 12px rgb(40 4 8 / 33%))}
.eagle-relief:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,#e1b34b,#805014 70%,#4d2c09);-webkit-mask-image:url('assets/orzel-zloty-ryngraf.png');mask-image:url('assets/orzel-zloty-ryngraf.png');-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;transform:translate(2px,3.5px)}
.eagle-relief .flag-eagle{position:relative;z-index:1;filter:none}
@media(prefers-reduced-motion:reduce){.eagle-relief{transform:none;transition:none;will-change:auto}}
.gold-relief{display:block;filter:drop-shadow(1px 2px .4px #000) drop-shadow(2px 4px 2px rgb(0 0 0 / 85%))}
.gold-relief>img{display:block;width:100%;height:auto}
.gold-relief:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(112deg,transparent 42%,rgb(255 255 239 / 12%) 46%,rgb(255 255 245 / 96%) 49%,rgb(255 242 179 / 85%) 51%,rgb(255 245 206 / 12%) 54%,transparent 58%);background-size:250% 100%;background-position:200% 0;-webkit-mask-image:var(--letter-mask);mask-image:var(--letter-mask);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-mode:alpha;animation:royal-gold-glint 8s ease-in-out infinite}
@keyframes royal-gold-glint{0%,12%{background-position:200% 0}65%,100%{background-position:-100% 0}}
.motion-paused .gold-relief:after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.gold-relief:after{animation:none;background-position:50% 0;opacity:.2}}
.heraldic-title{width:calc(100% - 36px);max-width:1600px}
@media(max-width:720px){.heraldic-title{width:calc(100% - 20px)}}
.ryngraf-relief-patch{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
@media(min-width:1001px){.flag-hero{--eagle-diameter:min(900px,76vw,calc(max(100svh,900px) - 267px));--inscription-inset:max(2%,calc(30.8% - .288 * var(--eagle-diameter) - .45 * min(240px,20vw)))}
.heraldic-left{left:var(--inscription-inset)}
.heraldic-right{right:var(--inscription-inset)}}
@media(min-width:721px) and (max-width:1000px){.heraldic-left{left:13%}
.heraldic-right{right:13%}}
@media(max-width:720px){.heraldic-left{left:6%}
.heraldic-right{right:6%}}
.heraldic-title{--letter-mask:url('assets/tytul-eb-swietliste-smukle.svg')}
.heraldic-title picture,.heraldic-title picture>img{display:block;width:100%;height:auto}
@media(max-width:720px){.heraldic-title{--letter-mask:url('assets/tytul-mobile-dwie-linie.svg');top:12px}
.heraldic-title picture>img{aspect-ratio:1200/320}}