@font-face{font-family:"Fraunces";src:url(fonts/fr400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122,U+2190-2193}
@font-face{font-family:"Fraunces";src:url(fonts/fr400-latin-ext.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"Fraunces";src:url(fonts/fr600-latin.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122,U+2190-2193}
@font-face{font-family:"Fraunces";src:url(fonts/fr600-latin-ext.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"Karla";src:url(fonts/ka400-latin.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122,U+2190-2193}
@font-face{font-family:"Karla";src:url(fonts/ka400-latin-ext.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:"Karla";src:url(fonts/ka700-latin.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122,U+2190-2193}
@font-face{font-family:"Karla";src:url(fonts/ka700-latin-ext.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
:root{--perla:#e6eaf0;--srebro:#c8d0dc;--tusz:#1d2330;--szary:#4a5365;--zloto:#8d6a22;--zl2:#d9b768}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--perla);color:var(--tusz);font:400 17px/1.55 "Karla",Arial,sans-serif;overflow-x:hidden}
h1,h2{font-family:"Fraunces",Georgia,serif;font-weight:400;line-height:1.2;margin:0}
button{font:inherit;color:inherit;cursor:pointer}
.gora{position:fixed;top:0;left:0;right:0;z-index:20;height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;background:rgba(236,239,244,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(141,106,34,.28)}
.znak{font:400 18px/1.2 "Fraunces",Georgia,serif;color:var(--tusz);white-space:nowrap}
.ster{display:flex;gap:8px}.ikona{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.7);border:1px solid rgba(29,35,48,.25);display:grid;place-items:center;padding:0}
.ikona svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scena{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;touch-action:manipulation}
#c{position:absolute;inset:0;width:100%;height:100%;display:block}
.tytul{position:absolute;left:16px;right:16px;top:78px;text-align:center;pointer-events:none;transition:opacity .6s}
.tytul h1{font-size:clamp(25px,3.2vw,38px);text-wrap:balance}.tytul b{font-weight:600;color:var(--zloto)}
.dol{position:absolute;left:16px;right:16px;bottom:max(14px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;transition:opacity .5s}
.dol p{margin:0;font-weight:700;font-size:16px;color:var(--tusz);background:rgba(255,255,255,.76);padding:12px 18px;border-radius:999px;min-height:48px;display:flex;align-items:center}
.btn-m{min-height:48px;padding:10px 20px;border-radius:999px;background:var(--tusz);color:#fff;border:1px solid var(--tusz);font-weight:700;font-size:16px}
#slowa{position:absolute;inset:0;pointer-events:none}
.slowo{position:absolute;font:600 clamp(20px,2.3vw,28px)/1.1 "Fraunces",Georgia,serif;color:var(--tusz);background:rgba(255,255,255,.82);border:1px solid var(--zl2);padding:8px 14px;border-radius:4px;white-space:nowrap;box-shadow:0 8px 24px rgba(50,60,85,.2);animation:sl .7s cubic-bezier(.2,.9,.25,1.2) both}
@keyframes sl{from{opacity:0;transform:translateY(12px) scale(.86)}to{opacity:1;transform:none}}
.list{position:absolute;left:50%;bottom:max(18px,env(safe-area-inset-bottom));width:min(560px,calc(100% - 32px));transform:translateX(-50%);text-align:center;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--zl2);padding:22px 24px 24px;box-shadow:0 22px 60px rgba(40,50,75,.28);animation:li .9s cubic-bezier(.2,.9,.25,1) both}
@keyframes li{from{opacity:0;transform:translate(-50%,24px)}to{opacity:1;transform:translateX(-50%)}}
.list .male{margin:0 0 6px;color:var(--zloto);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:14px}
.list h2{font-size:clamp(24px,3vw,34px);margin-bottom:8px;text-wrap:balance}.list p{margin:0 0 8px;color:var(--szary)}
.list .od{font:600 21px/1.25 "Fraunces",Georgia,serif;color:var(--tusz);margin:10px 0 14px;overflow-wrap:anywhere}
.reszta{width:min(620px,100%);margin:0 auto;padding:64px 16px 40px}
.pole label{display:block;font-weight:700;margin-bottom:8px}.pole input{width:100%;height:52px;padding:0 14px;font:inherit;background:#fff;border:1px solid var(--srebro);border-radius:4px;color:var(--tusz)}.pole input:focus{outline:2px solid var(--zloto);outline-offset:1px}
.pole small{display:block;margin-top:8px;font-size:14px;color:var(--szary)}
.zapr{margin-top:56px;padding:30px 24px;text-align:center;background:#fff;border:1px solid var(--zl2)}.zapr h2{font-size:27px;margin-bottom:8px}.zapr p{margin:0 0 18px;color:var(--szary)}
.zapr a{display:inline-flex;align-items:center;min-height:48px;padding:0 26px;background:var(--tusz);color:#fff;font-weight:700;text-decoration:none;border-radius:999px}
.przyklad{text-align:center;color:var(--szary);font-size:14px;margin:26px 0 0}
.sygnatura{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px;text-decoration:none;color:var(--tusz)}.sygnatura img{width:74px;height:auto}.sygnatura b{display:block;font-weight:700}.sygnatura small{font-size:14px;color:var(--szary)}
@media(max-width:520px){.znak{font-size:16px}.dol p{padding:10px 14px;font-size:15px}.btn-m{padding:10px 16px}.list{padding:16px 16px 18px}.reszta{padding-top:56px}}
@media(prefers-reduced-motion:reduce){.slowo,.list{animation:none}}