@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Russo+One&display=swap');

:root{--bg:#130d09;--panel:#1d1510;--panel2:#251a12;--text:#f4eee5;--muted:#b4a99c;--green:#8ba66b;--green2:#315b36;--orange:#ef963c;--line:rgba(244,238,229,.13);--font:'Russo One', sans-serif
}



*{box-sizing:border-box }html{scroll-behavior:smooth;scroll-padding-top:90px}.brand img {
  display: block;
  width: clamp(70px, 12vw, 180px);
  height: auto;
  max-height: 80px;
  object-fit: contain;
}

body{margin:0;background:#000001;color:var(--text);font-family: "Russo One", sans-serif;}a{color:inherit;text-decoration:none}button{font:inherit}

.site-header{
  height:82px;
  padding:0 7%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 15px;
  border-bottom:0px solid var(--line);
  position:absolute;
  z-index:10;
  top:0;
  width:100%;
  background:transparent;
  backdrop-filter:blur(0px)

}.brand{
  display:flex;
  align-items:center;
  gap:10px
}

.brand-mark{font:800 25px var(--font);letter-spacing:0px;color:var(--text)}

.brand-mark span{color:var(--green)}

.brand-sub{
  font:800 9px var(--font);
  letter-spacing:2px;
  display:block;
}

.brand-sub i{
  font-style:normal;
  color:var(--orange);
  position: center;
}

.nav{
  display:flex;
  gap:clamp(15px,2.4vw,35px);
  margin-left:auto;
  margin-right:34px
}

.nav a,

.lang-toggle {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;
  padding: 10px 14px;
  background: transparent;
  color: #f5f2f5;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease,
              border-color 0.2s ease;
}

.lang-toggle:hover {
  color: #100d13;
  background: #ff9818;
  border-color: #ff9818;
}


.hero{min-height:700px;padding:145px 7% 80px;display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;position:relative;overflow:hidden;background:radial-gradient(ellipse at 72% 45%,#4d602b2b,transparent 36%),linear-gradient(110deg,#130d09 25%,#1c140e 100%)}.hero:after{content:'';position:absolute;inset:auto 0 0;height:1px;background:var(--line)}.hero-backdrop{position:absolute;width:600px;height:600px;right:6%;top:8%;border-radius:50%;background:#d47b2915;filter:blur(90px)}.hero-copy{position:relative;z-index:2;max-width:560px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--green);margin:0 0 22px}.live-dot,.status-dot{display:inline-block;width:6px;height:6px;background:var(--orange);border-radius:50%;margin-right:9px;box-shadow:0 0 12px #ef963c80}.hero h1,.section h2,.raff-copy h2,.contact-section h2{font:800 clamp(58px,7vw,100px)/.98 var(--font);letter-spacing:-5px;margin:0}.hero h1 em,.section h2 em,.raff-copy h2 em,.contact-section h2 em{font-style:normal;color:var(--orange)}.hero-text{font-size:15px;line-height:1.8;color:var(--muted);max-width:420px;margin:25px 0 30px}.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;gap:13px;padding:13px 17px;border-radius:5px;font-size:10px;font-weight:800;letter-spacing:.7px;transition:.2s}.button b{font-size:15px}.button-icon{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#1b140e;color:var(--text)}.button-primary{background:var(--orange);color:#21140b}.button-primary:hover{background:#ffb15e;transform:translateY(-2px)}.button-green{background:#315b36;border:1px solid #719a5c;color:#fff}.button-green:hover{background:#3f7044;transform:translateY(-2px)}.hero-note{display:flex;align-items:center;gap:12px;margin-top:48px;color:#a99b8c;font-size:8px;letter-spacing:2px}.note-line{height:1px;width:42px;background:var(--orange)}.hero-art{height:500px;position:relative;display:grid;place-items:center}.sound-ring{position:absolute;border:1px solid #d8a55b28;border-radius:50%;width:390px;height:390px}.ring-two{width:480px;height:480px;border-style:dashed;border-color:#8ba66b20}.bear-card{position:relative;width:330px;height:410px;border:1px solid #e9a64d65;border-radius:150px 150px 12px 12px;background:radial-gradient(ellipse at 50% 30%,#66502d,#2b2017 65%,#17110d);box-shadow:0 25px 90px #0008,inset 0 0 45px #e49b3410;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:18px;overflow:hidden}.bear-card:before{content:'';position:absolute;inset:12px;border:1px solid #e8c58c24;border-radius:145px 145px 7px 7px}.bear-topline,.bear-caption{width:100%;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:2;font-size:8px;letter-spacing:1.5px;color:#ddc9a9}.bear-topline span:last-child{color:var(--orange)}.bear-caption{align-items:end;border-top:1px solid #e8c58c30;padding-top:12px}.bear-caption b{font:800 26px var(--font);letter-spacing:2px;color:#f5e8d4;display:block}.bear-caption small{font-size:7px;letter-spacing:1.3px;color:#b9aa95}.paw{font-size:25px;color:var(--orange)}.bear-face{position:relative;width:230px;height:280px;margin-top:10px}.head{position:absolute;z-index:2;left:25px;top:30px;width:180px;height:190px;border-radius:48% 48% 44% 44%;background:radial-gradient(circle at 38% 28%,#c88a4b,#8b4d27 70%);box-shadow:inset -13px -12px 0 #63371f,inset 8px 5px 0 #d69a5a}.ear{position:absolute;top:24px;width:70px;height:75px;border-radius:50%;background:#9a5a2c;border:9px solid #754322;z-index:1}.ear:after{content:'';position:absolute;inset:10px;border-radius:50%;background:#d59a60}.ear-left{left:19px}.ear-right{right:19px}.eye{position:absolute;top:72px;width:10px;height:13px;border-radius:50%;background:#1b120d}.eye-left{left:43px}.eye-right{right:43px}.muzzle{position:absolute;top:95px;left:49px;width:82px;height:58px;border-radius:48%;background:#d6a16d;box-shadow:inset -5px -5px #b77d4c}.nose{position:absolute;top:8px;left:31px;width:22px;height:15px;border-radius:50%;background:#211710}.mouth{position:absolute;top:28px;left:39px;width:3px;height:12px;background:#5c321d}.mouth:after{content:'';position:absolute;top:10px;left:-10px;width:22px;height:8px;border-bottom:2px solid #5c321d;border-radius:50%}.beard{position:absolute;bottom:-15px;left:33px;width:112px;height:60px;background:linear-gradient(135deg,#5b3521,#241811);border-radius:20% 20% 48% 48%;clip-path:polygon(0 0,100% 0,92% 55%,72% 85%,50% 100%,28% 85%,8% 55%)}.headphones{position:absolute;z-index:3;left:13px;top:10px;width:204px;height:190px;border:11px solid #171b16;border-bottom-color:transparent;border-radius:50% 50% 0 0;transform:rotate(-2deg)}.headphones:before,.headphones:after{content:'';position:absolute;top:67px;width:24px;height:54px;border-radius:8px;background:#315b36;border:4px solid #161b15;box-shadow:inset 0 0 0 2px #ef963c}.headphones:before{left:-12px}.headphones:after{right:-12px}.float-tag{position:absolute;z-index:3;padding:10px 14px;border:1px solid #ef963c66;border-radius:30px;background:#1a120dd9;box-shadow:0 8px 25px #0005;font-size:16px;color:var(--orange)}.float-tag span{font:700 9px var(--font);letter-spacing:1.5px;color:var(--text);margin-left:5px}.tag-music{right:2%;top:22%;transform:rotate(7deg)}.tag-game{left:3%;bottom:20%;border-color:#8ba66b66;color:var(--green);transform:rotate(-7deg)}.hero-bottom{position:absolute;bottom:25px;left:7%;right:7%;display:flex;align-items:center;gap:18px;font-size:8px;letter-spacing:1.6px;color:#968a7d}.scroll-line{height:1px;flex:1;background:linear-gradient(90deg,var(--orange),transparent)}.section{padding:100px 7%}.split-section{padding:100px 7% 75px;background:#1b140f}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:35px;margin-bottom:38px}.section-heading .eyebrow{margin-bottom:17px}.section h2,.raff-copy h2{font-size:clamp(42px,5vw,65px);letter-spacing:-3px}.section-heading>p{font-size:12px;line-height:1.8;color:var(--muted);max-width:370px;margin:0 0 5px}.music-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:16px}.release{min-width:0}.cover{height:245px;position:relative;overflow:hidden;border:1px solid #ffffff20;display:flex;flex-direction:column;justify-content:space-between;padding:16px;box-shadow:inset 0 0 45px #0003}.cover-kicker,.cover-foot{font-size:7px;letter-spacing:1.7px;position:relative;z-index:2}.cover-foot{align-self:end}.cover-summer{background:radial-gradient(circle at 50% 40%,#f5b64b 0 12%,transparent 13%),linear-gradient(145deg,#fa8c32,#a52d32 55%,#2c1745)}.cover-summer:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(125deg,transparent 0 18px,#fff1 19px 21px)}.cover-sun{position:absolute;width:140px;height:140px;border-radius:50%;background:#ffc94c;filter:blur(1px);top:35px;right:18%;box-shadow:0 0 60px #ffdf6c}.cover-title{position:relative;z-index:2;font:800 clamp(25px,3vw,42px)/.88 var(--font);letter-spacing:-2px;text-shadow:2px 3px #55202a}.cover-title b{color:#ffdb62}.cover-stop{background:radial-gradient(ellipse at 50% 50%,#7923aa,#101c58 65%,#09102a)}.cover-stop:before{content:'';position:absolute;inset:-40%;background:repeating-conic-gradient(from 0deg at 50% 50%,#15d4e51b 0deg 5deg,transparent 5deg 15deg)}.stop-type{font:800 37px/.82 var(--font);letter-spacing:-2px;text-align:center;text-shadow:0 0 20px #ec38ff}.stop-type b{color:#f75aff}.cover-salve{background:radial-gradient(ellipse at 50% 35%,#a88c5b,#373b35 50%,#101413)}.salve-symbol{font-size:100px;line-height:.8;text-align:center;color:#f3d79d;text-shadow:0 0 30px #e8d39a88}.salve-type{text-align:center;font:600 23px/.9 Georgia,serif;letter-spacing:4px}.salve-type b{font-weight:400}.release-meta{padding:15px 2px;display:flex;justify-content:space-between;gap:8px}.mini-label{font-size:7px;letter-spacing:1.5px;color:var(--green);font-weight:700}.release h3,.game-content h3{font:800 17px var(--font);margin:6px 0}.release p,.game-content p{font-size:10px;line-height:1.6;color:var(--muted);margin:0;max-width:290px}.release-arrow{color:var(--orange);font-size:19px}.platform-bar{display:flex;align-items:center;gap:25px;border-top:1px solid var(--line);padding-top:20px;margin-top:18px;flex-wrap:wrap}.platform-bar>span{font-size:8px;letter-spacing:1.6px;color:var(--muted)}.platform-bar a{font-size:11px;display:flex;align-items:center;gap:7px}.platform-bar a:hover{color:var(--orange)}.platform-bar small{font-size:8px;color:#8d8175;margin-left:auto}.spotify-dot{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#1db954;color:#102012;font-weight:900}.games-section{background:var(--bg)}.games-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.game-card{background:var(--panel);border:1px solid var(--line);overflow:hidden}.game-art{height:275px;position:relative;display:grid;place-items:center;overflow:hidden}.game-code{position:absolute;left:18px;top:17px;font-size:7px;letter-spacing:1.6px;color:#f7e8ce;z-index:2}.ox-art{background:radial-gradient(ellipse at 50% 45%,#57713d,#263c25 64%,#142017)}.ox-art:before,.tetris-art:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,#ffffff12 50%,transparent 50.2%),linear-gradient(transparent 49.8%,#ffffff12 50%,transparent 50.2%);background-size:50px 50px;opacity:.5}.ox-board{width:155px;height:155px;display:grid;grid-template-columns:repeat(3,1fr);border:3px solid #d9c69c;border-radius:9px;transform:rotate(-7deg);box-shadow:12px 15px 0 #182719}.ox-board span{display:grid;place-items:center;border:1px solid #d9c69c77;font:800 33px var(--font);color:#f2a23e;text-shadow:0 3px #51351d}.ox-board span:nth-child(even){color:#e9e0c8}.art-title{position:absolute;bottom:16px;right:20px;font:800 28px var(--font);letter-spacing:-1px;text-shadow:2px 3px #182016}.art-title span{color:var(--orange)}.tetris-art{background:radial-gradient(ellipse at 50% 45%,#405a79,#202c46 65%,#121729)}.tetris-stack{position:absolute;display:grid;grid-template-columns:repeat(4,32px);grid-template-rows:repeat(4,32px);transform:rotate(8deg);filter:drop-shadow(9px 12px 0 #10152888)}.tetris-stack i{background:#ef963c;border:2px solid #ffcf78;box-shadow:inset -5px -5px #b65e25}.tetris-stack i:nth-child(1){grid-column:2}.tetris-stack i:nth-child(2){grid-column:3}.tetris-stack i:nth-child(3){grid-column:2;grid-row:2}.tetris-stack i:nth-child(4){grid-column:3;grid-row:2}.tetris-stack i:nth-child(5){grid-column:1;grid-row:3;background:#8ba66b;border-color:#c4d99a;box-shadow:inset -5px -5px #4e6b3a}.tetris-stack i:nth-child(6){grid-column:2;grid-row:3;background:#8ba66b;border-color:#c4d99a;box-shadow:inset -5px -5px #4e6b3a}.tetris-stack i:nth-child(7){grid-column:3;grid-row:3;background:#8ba66b;border-color:#c4d99a;box-shadow:inset -5px -5px #4e6b3a}.tetris-title{position:absolute;bottom:15px;left:20px;font:800 26px/.9 var(--font);text-shadow:2px 3px #101528}.tetris-title b{color:#ef963c}.tetris-score{position:absolute;right:18px;top:20px;font-size:8px;letter-spacing:2px}.game-content{padding:20px 22px}.game-status{font-size:7px;letter-spacing:1.5px;color:var(--green)}.game-content h3{font-size:20px}.game-bottom{border-top:1px solid var(--line);margin-top:19px;padding-top:13px;display:flex;justify-content:space-between;gap:10px;font-size:7px;letter-spacing:1px;color:#a99b8c}.game-bottom a{color:var(--orange);font-weight:800;white-space:nowrap}.raff-section{display:grid;grid-template-columns:1fr 1fr;min-height:420px;background:#202a1d}.raff-visual{position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at center,#435a37,#202a1d 68%)}.raff-orbit{width:310px;height:310px;border:1px solid #d7d8ad35;border-radius:50%;box-shadow:0 0 0 35px #d7d8ad0b,0 0 0 70px #d7d8ad08}.raff-medallion{position:absolute;width:190px;height:190px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 25%,#e8c18a,#98602f 70%,#56361f);border:7px solid #c9a16b;box-shadow:0 15px 45px #0006,inset 0 0 0 2px #70451f;color:#28190e;transform:rotate(-8deg)}.raff-medallion span{font:800 35px var(--font);letter-spacing:2px}.raff-medallion b{font-size:22px;color:#f4d08a}.raff-medallion small{font-size:7px;letter-spacing:2px}.raff-spark{position:absolute;color:var(--orange);font-size:30px}.spark-a{top:25%;left:22%}.spark-b{bottom:20%;right:20%;color:#c5d5a3}.raff-copy{align-self:center;padding:70px 12%}.raff-copy>p:not(.eyebrow){font-size:12px;line-height:1.9;color:#c1c9b8;max-width:420px;margin:24px 0}.text-link{font-size:9px;font-weight:800;letter-spacing:1.4px;color:var(--orange)}.about-section{background:#1a130e}.about-section h2{max-width:700px}.about-columns{display:grid;grid-template-columns:1fr 1fr;gap:55px;max-width:850px;margin-top:25px}.about-columns p{font-size:12px;line-height:1.9;color:var(--muted);margin:0}.news-section{padding-top:75px;padding-bottom:95px;background:#1b140f}.news-card{display:grid;grid-template-columns:130px 1fr 35px;gap:20px;align-items:center;padding:25px 27px;border:1px solid var(--line);background:var(--panel)}.news-index{font-size:8px;letter-spacing:1.5px;color:var(--orange)}.news-card h3{font:700 19px var(--font);margin:8px 0}.news-card p{font-size:10px;color:var(--muted);margin:0;line-height:1.7}.news-mark{color:var(--orange);font-size:25px}.contact-section{padding:75px 7%;background:#2a2118;display:flex;justify-content:space-between;align-items:center;gap:30px}.contact-section .eyebrow{color:#b6c69a}.contact-section h2{font-size:clamp(40px,5vw,62px)}.contact-section>div>p:last-child{font-size:11px;color:#c5b9ab;max-width:360px;line-height:1.8}.contact-link{font:700 clamp(13px,1.6vw,18px) var(--font);border-bottom:1px solid #b78a5d;padding:14px 0;white-space:nowrap}.contact-link span{color:var(--orange);margin-left:20px}footer {
  padding: 20px 8%;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 5px;
  background: #0b090d;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--muted);
  font-size: 12px;

}.footer-brand {
  grid-column: 1;
  justify-self: start;
  color: var(--orange);
  font-family: "Russo One", sans-serif;
  font-size: 18px;
}
.footerCopyright {
  grid-column: 2;
  justify-self: center;
  display: block;
  width: auto;
  text-align: center;
font-family: "Russo One", sans-serif;
}

.footer-contact {
    grid-column: 3;
    justify-self: end;

    color: var(--green);
    font-family: "Russo One", sans-serif;
    font-size: 14px;

    cursor: pointer;
    user-select: none;

    transition:
        color 0.2s ease,
        transform 0.2s ease,
        text-shadow 0.2s ease;
}

/* Hover tylko dla KONTAKT */
.footer-contact:not(.show-email):hover {
    color: var(--orange);
    transform: scale(1.08);
    text-shadow: 0 0 10px rgba(239, 150, 60, 0.7);
}

/* Po pokazaniu e-maila */
.footer-contact.show-email {
    color: #ffffff;
    transform: none;
    text-shadow: none;
}

/* Informacja po lewej stronie e-maila */
.footer-contact.show-email::before {
    content: attr(data-copy-hint);
    color: var(--orange);
    font-size: 11px;
    margin-right: 12px;
}

/* Po skopiowaniu */
.footer-contact.copied {
    color: var(--orange);
}

.brand-mark{font-size:20px}

@media(max-width:850px){.site-header{padding:0 5%}.menu-toggle{display:block;margin-left:auto;margin-right:16px}.nav{display:none;position:absolute;top:81px;left:0;right:0;background:#1a120d;padding:22px 6%;margin:0;border-bottom:1px solid var(--line);flex-direction:column;gap:20px}.nav.open{display:flex}.hero{padding:125px 6% 75px;grid-template-columns:1fr;min-height:unset}.hero-copy{padding-top:20px}.hero h1{font-size:clamp(58px,12vw,86px)}.hero-art{height:470px;margin-top:10px}.hero-bottom{left:6%;right:6%}.section,.split-section{padding:75px 6%}.section-heading{display:block}.section-heading>p{margin-top:18px}.music-grid{grid-template-columns:1fr 1fr}.release-main{grid-column:1/-1}.release-main .cover{height:300px}.cover{height:220px}.games-grid{grid-template-columns:1fr}.game-art{height:300px}.raff-section{grid-template-columns:1fr}.raff-visual{min-height:330px}.raff-copy{padding:60px 8%}.about-columns{gap:25px}.contact-section{padding:65px 6%}footer{padding:24px 6%}}
@media(max-width:520px){.site-header{height:70px}.nav{top:69px}.brand-sub{font-size:7px}.hero{padding-top:115px}.hero h1{letter-spacing:-3px}.hero-text{font-size:13px}.hero-art{height:400px}.bear-card{width:280px;height:360px}.bear-face{transform:scale(.85);transform-origin:top center;margin-bottom:-35px}.sound-ring{width:300px;height:300px}.ring-two{width:370px;height:370px}.tag-music{right:0;top:20%}.tag-game{left:0;bottom:17%}.hero-bottom{font-size:7px;gap:9px}.hero-note{margin-top:35px}.section h2,.raff-copy h2{letter-spacing:-2px}.music-grid{grid-template-columns:1fr}.release-main{grid-column:auto}.release-main .cover,.cover{height:260px}.platform-bar{gap:15px}.platform-bar small{width:100%;margin-left:0}.game-art{height:250px}.about-columns{grid-template-columns:1fr;gap:12px}.news-card{grid-template-columns:1fr 25px;gap:12px}.news-index{grid-column:1/-1}.news-card>div{grid-column:1}.news-mark{grid-column:2;grid-row:2}.contact-section{display:block}.contact-link{display:inline-block;margin-top:15px}footer{flex-wrap:wrap}footer>span{order:3;width:100%}}
@media(prefers-reduced-motion:no-preference){.bear-card{animation:float 6s ease-in-out infinite}.float-tag{animation:float 5s ease-in-out infinite}.tag-game{animation-delay:-2s}@keyframes float{0%,100%{translate:0 0}50%{translate:0 -8px}}}



/* ===== MRJK — STRONA STARTOWA: TRZY KOLUMNY ===== */
.portal-hero {
  position: relative;
  isolation: isolate;
  min-height: min(780px, 100vh);
  box-sizing: border-box;
  padding: 115px 4% 45px;
  display: flex;
  align-items: center;
  background-color: #130d09;
  background-image: url("assets/images/background.webp");
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
  color: var(--text);
}

.portal-hero::before {
  content: "";
  position: center;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(19, 13, 9, .58);
}

.portal-layout {
  width: min(1500px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 1.05fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(16px, 2.2vw, 34px);
}

.portal-intro {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  min-width: 0;
  margin-top: 350px;
  text-align: center;
}

.portal-eyebrow {
  display: block;
  margin: 0 0 16px;
  color: var(--green);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 2px;
}

.portal-intro h1 {
  margin: 0;
  font-family: var(--font);
  font-size: clamp(34px, 4vw, 64px);
  line-height: 1.04;
  letter-spacing: 2px;
      -webkit-text-stroke: 3px #1a0f08;
    paint-order: stroke fill;
}

.portal-intro h1 em {
  color: var(--orange);
  font-style: normal;
}

.portal-description {
  max-width: 520px;
  margin: 18px auto 0;
  color: #FFFFFF;
  font-size: clamp(12px, 1vw, 15px);
  line-height: 1.7;
  text-align: center;
      -webkit-text-stroke: 3px #1a0f08;
    paint-order: stroke fill;
}

.portal-card {
  min-width: 0;
  width: 100%;
  min-height: 100%;
  max-width: none;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-self: center;
  text-decoration: none;
  background: rgba(19, 13, 9, .0);
  box-shadow: 0 00px 30px rgba(252, 252, 252, 0);
  backdrop-filter: blur(0px);
  transition: transform .25s ease, border-color .25s ease;
}

.portal-card-music {
  grid-column: 1;
  grid-row: 1;
}

.portal-card-games {
  grid-column: 3;
  grid-row: 1;
}

.portal-card:hover {
  transform: scale(1.1);
  background: rgba(19, 13, 9, .0);
}

.portal-card-info {
  min-width: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 20px 20px 20px;
  text-align: center;
  margin-top: 40%;
}

.portal-card-label {
  display: block;
  color: #d78b50;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 1.4px;
  text-align: center;  
}

.portal-card-games .portal-card-label {
  color: #9cbe83;
}

.portal-card-logo-music {
  display: block;
  width: min(100%, 400px);
  max-height: 300px;
  height: auto;
  object-fit: contain;
  margin-top: -10px;
}

.portal-card-logo-games {
  display: block;
  width: min(100%, 300px);
  max-height: 300px;
  height: auto;
  object-fit: contain;
  margin: 0 auto;
}


.portal-card-info p {
  width: 100%;
  max-width: 320px;
  margin: 0;
  color: #FFFFFF;
  font-size: 16px;
  line-height: 1.55;
  text-align: center;
}

/* Przycisk Wróć do góry */
.back-to-top {
    display: inline-block;
    position: fixed;
    right: 25px;
    bottom: 25px;
    width: 48px;
    height: 48px;
    color: #ff9d24;
    font-size: 24px;
    font-family: 'Archivo Black', sans-serif;;
    font-weight: bold;
    -webkit-text-stroke: 4px currentColor;
    cursor: pointer;
    z-index: 9999;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease,
                background 0.3s ease,
                transform 0.3s ease;
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
}

.back-to-top:hover {
    background: transparent;
    color: #ff9d24;
    transform: scale(1.3);
}

.creator {
    color: #39B54A;
}

.buycoffee-button {
    display: inline-flex;
    align-items: center;
    padding: 0;
    background: transparent;
    border: none;
    transition: transform 0.2s ease;
}

.buycoffee-button:hover {
    background: transparent;
    transform: scale(1.1);
}

.buycoffee-button img {
    display: block;
    width: 145px;
    height: auto;
    object-fit: contain;
}

/* Mniejsze laptopy i tablety: tekst nad dwoma kafelkami */

@media (max-width: 1000px) {

  .portal-hero {
    min-height: auto;
    padding: 115px 5% 45px;
    background-position: 50% 0 !important;
  }

  .portal-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
    margin-top: -100px;
  }

  .portal-intro {
    grid-column: 1;
    grid-row: 1;
    max-width: 680px;
    justify-self: center;
  }

  .portal-card-music {
    grid-column: 1;
    grid-row: 2;
  }

  .portal-card-games {
    grid-column: 1;
    grid-row: 3;
    margin-bottom: 100px;
  }

  .portal-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 140px;
    min-height: 140px;
    max-height: 140px;
    box-sizing: border-box;
  }

   .portal-card-info {
    position: relative;
    inset: auto;
    transform: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 8px;
    margin: 0;
    gap: 5px;
    box-sizing: border-box;
  }

  .portal-card-logo {
    position: static;
    display: block;
    transform: none;
    width: 75%;
    max-width: 190px;
    max-height: 55px;
    height: auto;
    object-fit: contain;
    flex-shrink: 0;
    margin: 0 auto;
    opacity: 1;
    visibility: visible;
  }

.portal-card-label {
    flex: 0 0 auto;
    font-size: 8px;
}

.portal-card-info p {
    flex: 0 0 auto;
    font-size: 10px;
    margin: 0;
}

/* Widoczna tylko poniżej 1000 px */
    .back-to-top {
        display: flex;
    }
  .brand-sub{
    text-align: center;
  }

  }

/* Telefony: tekst, a następnie kafelki jeden pod drugim */

/* TELEFONY — LOGOTYPY OBOK SIEBIE */
@media screen and (max-width: 650px) {

    .portal-hero {
         min-height: 100svh;
        height: auto;
        padding: 100px 6% 45px;
        box-sizing: border-box;
        background-size:auto;
        background-position: center 65%;
    }

    .portal-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 460px;
        gap: 35px 12px;
        margin-top: 300px;
    }

    /* Nagłówek i opis nad logotypami */
    .portal-intro {
        grid-column: 1 / -1;
        grid-row: 1;
        width: 100%;
        max-width: 100%;
        margin-top: 0;
        justify-self: center;
        text-align: center;
    }

    .portal-intro h1 {
        font-size: clamp(30px, 8vw, 42px);
        letter-spacing: -1px;
    }

    .portal-description {
        max-width: 100%;
        margin: 15px auto 0;
        font-size: 12px;
    }

    /* MrJKMusicAI — lewa kolumna */
    .portal-card-music {
        grid-column: 1;
        grid-row: 2;
        margin: 0;
    }

    /* MrJKGames — prawa kolumna */
    .portal-card-games {
        grid-column: 2;
        grid-row: 2;
        margin-bottom: 0;
    }

    /* Oba kafelki */
    .portal-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        min-height: 0;
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .portal-card-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: auto;
        min-width: 0;
        margin: 0;
        padding: 0;
        gap: 8px;
        text-align: center;
    }

    /* Grafiki logotypów */
    .portal-card-logo-music,
    .portal-card-logo-games,
    .portal-card-logo {
        display: block;
        position: static;
        width: 100%;
        max-width: 100%;
        max-height: 150px;
        height: auto;
        margin: 0 auto;
        object-fit: contain;
        transform: none;
        flex-shrink: 1;
        visibility: visible;
        opacity: 1;
    }

    .portal-card-label {
        font-size: 8px;
        letter-spacing: 1px;
    }

    .portal-card-info p {
        font-size: 10px;
        line-height: 1.5;
    }

    .portal-card:hover {
        transform: scale(1.1);
    }
    
     footer {
        position: relative;
        margin-bottom: 0;
        z-index: 1;
    }
}




/* ==========================================
   STOPKA — UKŁAD MOBILNY
========================================== */

@media screen and (max-width: 650px) {

    footer {
        display:flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 10px;

        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
      

        text-align: center;
        box-sizing: border-box;
    }

    /* Logo MrJK */
    footer .footer-brand {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 8px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
    }

    footer .brand-mark {
        font-size: 14px;
    }

    footer .brand-sub {
        font-size: 6px;
        letter-spacing: 2px;
    }

    /* Informacja o prawach autorskich */
    footer .footerCopyright {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;

        font-size: 10px;
        line-height: 1.7;
        text-align: center;
        overflow-wrap: anywhere;
        box-sizing: border-box;
    }

    /* Kontakt */
    footer .footer-contact {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 8px;

        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
        padding: 0;

        text-align: center;
        overflow-wrap: anywhere;
        box-sizing: border-box;
    }

    footer .contact-label {
        display: block;
        max-width: 100%;
        margin: 0;
        text-align: center;
        overflow-wrap: anywhere;
        font-size: 10px;
    }
}


@media (prefers-reduced-motion: reduce) {
  .portal-card {
    transition: none;
  }

    .back-to-top {
        display: flex;
    }

    .brand-sub{
    text-align: center;
  }

}

/* PRIVACY NOTICE */

.privacy-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.78);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

.privacy-overlay[hidden] {
    display: none;
}

.privacy-modal {
    width: 100%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 32px;
    background: #1d1510;
    color: #f4eee5;
    border: 1px solid rgba(239, 150, 60, 0.45);
    border-radius: 16px;
    box-shadow: 0 20px 70px rgba(0, 0, 0, 0.55);
    text-align: center;
    animation: privacyAppear 0.3s ease-out;
}

.privacy-icon {
    font-size: 34px;
    margin-bottom: 14px;
}

.privacy-modal h2 {
    margin: 0 0 18px;
    color: #ef963c;
    font-family: 'Russo One', sans-serif;
    font-size: clamp(21px, 4vw, 28px);
    line-height: 1.3;
}

.privacy-modal p {
    margin: 0;
    color: #d8cec2;
    font-family: 'Nunito', sans-serif;
    font-size: 15px;
    line-height: 1.8;
    text-align: left;
    overflow-wrap: anywhere;
}

.privacy-modal code {
    color: #ef963c;
    font-size: 0.92em;
    overflow-wrap: anywhere;
}

.privacy-button {
    display: block;
    width: 100%;
    margin-top: 26px;
    padding: 14px 20px;
    border: none;
    border-radius: 8px;
    background: #ef963c;
    color: #130d09;
    font-family: 'Russo One', sans-serif;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}

.privacy-button:hover {
    background: #ffad56;
    transform: translateY(-2px);
}

.privacy-button:focus-visible {
    outline: 3px solid #f4eee5;
    outline-offset: 4px;
}

@keyframes privacyAppear {
    from {
        opacity: 0;
        transform: translateY(15px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 600px) {
    .privacy-modal {
        padding: 24px 20px;
        border-radius: 12px;
    }

    .privacy-modal p {
        font-size: 14px;
        line-height: 1.7;
    }
}

@media (prefers-reduced-motion: reduce) {
    .privacy-modal {
        animation: none;
    }

    .privacy-button {
        transition: none;
    }
}

.privacy-language {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    color: rgba(244, 238, 229, 0.4);
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    font-weight: 800;
}

.privacy-language button {
    padding: 5px 8px;
    border: none;
    background: transparent;
    color: #b4a99c;
    font: inherit;
    cursor: pointer;
    transition: color 0.2s ease;
}

.privacy-language button:hover,
.privacy-language button[aria-pressed="true"] {
    color: #ef963c;
}

.privacy-language button[aria-pressed="true"] {
    text-decoration: underline;
    text-underline-offset: 4px;
}