/* dziennikmary.pl – kopia 1:1 strony z Elementora (pomiary: zrodlo_wp/style*_komputer.json i style*_telefon.json) */
:root {
  --czern: #000;
  --szary-tlo: #f8f8f8;
  --braz: #695b50;
  --roz: #cc3366;
  --m: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --r: 'Roboto', 'Helvetica Neue', Arial, sans-serif;
  --h: Helvetica, 'Helvetica Neue', Arial, sans-serif;
  /* cienki Montserrat 300 na starej stronie wygląda jaśniej (lokalny krój) – szarość dobrana pomiarem pikseli zrzutu */
  --lekki: #7a7a7a;
  --lekki-bialy: rgba(255, 255, 255, .68);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 100px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; overflow-x: clip; background: #fff; color: #000; font: 400 16px/1.5 var(--m); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
p { margin: 0 0 .9em; }
h1, h2, h3 { margin: 0; font-weight: 600; }
.skip { position: absolute; left: -9999px; top: 0; background: #000; color: #fff; padding: 8px 14px; z-index: 100; }
.skip:focus { left: 8px; top: 8px; }
.ukryte { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 2px solid var(--roz); outline-offset: 3px; }
h2 { font: 600 35px/44px var(--m); text-transform: uppercase; text-align: center; }
h2 b { font-weight: 700; }

/* przyciski */
.btn { display: inline-block; background: #000; color: #fff; border: 1px solid #000; font: 400 16px/1 var(--m); text-transform: uppercase; text-decoration: none; padding: 16px 45px; transition: background .2s, color .2s; }
.btn:hover { background: #fff; color: #000; }
.btn--obrys { border-color: #fff; font-size: 20px; font-weight: 500; padding: 20px 50px; }
.btn--obrys:hover { background: #fff; color: #000; }
.btn--kup { border: 0; font-size: 16px; font-weight: 600; letter-spacing: 2px; padding: 12px 24px; }
.btn--kup:hover { background: #333; color: #fff; }

/* nagłówek */
.top { position: sticky; top: 0; z-index: 50; background: #fff; }
.top__in { height: 100px; padding: 0 115px; display: flex; align-items: center; }
.nav ul { list-style: none; display: flex; gap: 30px; margin: 0; padding: 0; }
.nav a { font: 400 20px/30px var(--m); text-transform: uppercase; text-decoration: none; color: #000; padding: 5px 0; }
.nav a:hover { opacity: .7; }
.top__kup { margin-left: auto; }
.burger { display: none; width: 40px; height: 40px; background: none; border: 0; padding: 10px 8px; cursor: pointer; }
.burger span { display: block; height: 2px; background: #333; margin: 4px 0; }
.menu { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; border: 0; padding: 80px 20px 40px; background: #fff; text-align: center; }
.menu[open] { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.menu__lista { list-style: none; margin: 0; padding: 0; }
.menu__lista a { display: block; font: 400 24px/2 var(--m); text-transform: uppercase; color: #000; text-decoration: none; }
.menu__zamknij { position: absolute; top: 12px; right: 20px; width: 48px; height: 48px; font-size: 40px; line-height: 1; background: none; border: 0; cursor: pointer; }
@media (max-width: 1024px) { .top__in { padding: 0 40px; } .nav ul { gap: 20px; } .nav a { font-size: 16px; } }
@media (max-width: 767px) {
  .top__in { height: 65px; padding: 0 19.5px; }
  .nav { display: none; }
  .burger { display: block; margin-left: -8px; }
  .top__kup { font-size: 14px; padding: 12px 25px; }
}

/* hero */
.hero { position: relative; min-height: 762px; isolation: isolate; color: #fff; }
.hero__tlo { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.hero__tlo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; }
.hero__in { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 534px 534px; justify-content: space-between; column-gap: 96px; padding-top: 55px; }
.hero__okladka img { width: 534px; filter: drop-shadow(0 20px 26px rgba(0,0,0,.35)); }
.hero__tekst { padding-top: 134px; }
.hero__logo img { width: 395px; margin-bottom: 39px; }
.hero__tekst p { font: 300 17px/22.1px var(--h); max-width: 427px; margin: 0 0 34px; }
.hero__tekst .btn { margin-top: 0; }
.hero__tekst .hero__tylko { font: 600 16px/24px var(--r); margin-top: 17px; }
@media (max-width: 1240px) { .hero__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 48px; padding-left: 40px; padding-right: 40px; } .hero__okladka img { width: 100%; } .hero__logo img { width: min(395px, 100%); } }
@media (max-width: 767px) {
  .hero { min-height: 600px; }
  .hero__tlo img { object-position: 0% 50%; }
  .hero__in { display: block; padding: 25px 34px 30px; text-align: center; }
  .hero__okladka { display: none; }
  .hero__tekst { padding-top: 0; }
  .hero__logo img { width: 230px; margin: 0 auto 18px; }
  .hero__tekst p { font-size: 16px; line-height: 20.8px; max-width: none; }
  .hero__tekst .btn { font-size: 14px; padding: 15px 30px; margin-top: 30px; letter-spacing: 2px; }
}

/* audiobook */
.audioteka { padding: 0 10px; }
.audioteka a { display: block; max-width: 1140px; margin: 0 auto; }
.audioteka__tel { display: none; }
@media (min-width: 768px) { .audioteka { padding-top: 9px; padding-bottom: 11px; } }
@media (max-width: 767px) { .audioteka { padding: 14px 20px 10px; } .audioteka__komp { display: none; } .audioteka__tel { display: block; } }

/* opinie */
.opinie { padding: 43px 86px 72px; }
.opinie__linia { border: 0; border-top: 1px solid #000; margin: 72px 0 100px; opacity: .6; }
.opinie__rzad { display: grid; gap: 64px; margin-bottom: 72px; }
.opinie__rzad > * { min-width: 0; }
.opinie__rzad--1 { grid-template-columns: 786px minmax(0, 418px); justify-content: space-between; }
.opinie__rzad--2 { grid-template-columns: 602px 602px; justify-content: space-between; margin-bottom: 0; }
.opinia p { font: 400 20px/30px var(--r); margin: 0 0 14px; }
.opinia .opinia__kto { font-size: 21px; font-weight: 600; margin-bottom: 14px; }
@media (max-width: 1300px) { .opinie__rzad--1 { grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); } .opinie__rzad--2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
@media (max-width: 767px) {
  .opinie { padding: 58.5px 35px 40px; }
  .opinie h2 { font-size: 25px; }
  .opinie__linia { margin: 30px 0; }
  .opinie__rzad, .opinie__rzad--1, .opinie__rzad--2 { grid-template-columns: minmax(0, 1fr); gap: 32px; margin-bottom: 32px; }
  .opinia p { font-size: 17px; line-height: 25.5px; }
}

/* lubimyczytać */
.lubimy { background: var(--szary-tlo); text-align: center; padding: 28px 20px 32px; }
.lubimy p { font: 600 21px/44px var(--r); margin: 0 0 6px; }
.lubimy img { width: 300px; margin: 0 auto; }
@media (max-width: 767px) { .lubimy p { font-size: 18px; } .lubimy img { width: 240px; } }

/* pakiety */
.pakiety { padding: 72px 72px 60px; }
.pakiety h2 { margin-bottom: 72px; }
.pakiety__siatka { display: grid; grid-template-columns: repeat(2, minmax(0, 556px)); gap: 37px 26px; justify-content: center; }
.pakiet { border: 2px solid #000; padding: 73px 26px 100px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.pakiet__wstazka { font: 800 25px/44px var(--m); text-transform: uppercase; margin: 0 0 20px; }
.pakiet:has(.pakiet__wstazka) { padding-top: 37px; }
.pakiet__nazwa { font: 600 25px/44px var(--m); text-transform: uppercase; margin-bottom: 60px; }
.pakiet__nazwa--mala { font-size: 20px; line-height: 34px; }
.pakiet__wstazka + .pakiet__nazwa { margin-top: 0; }
.pakiet__foto { margin-bottom: 30px; }
.pakiet__foto img { width: 260px; margin: 0 auto; }
.pakiet__cena { font: 700 60px/60px var(--m); margin: 0 0 20px; }
.pakiet__cena s { font: 600 28px/44px var(--r); vertical-align: middle; margin-right: 6px; }
.pakiet__omnibus { font: 500 12px/1.4 var(--m); margin: -8px 0 16px; }
.pakiet__opis { color: var(--lekki); font: 300 22px/33px var(--m); max-width: 440px; margin: 0 auto 40px; }
.pakiet .btn { margin-top: auto; }
@media (max-width: 1100px) { .pakiety { padding-left: 30px; padding-right: 30px; } .pakiet__cena { font-size: 48px; line-height: 50px; } .pakiet__opis { font-size: 18px; line-height: 26px; } }
@media (max-width: 767px) {
  .pakiety { padding: 58.5px 19.5px 40px; }
  .pakiety h2 { font-size: 25px; line-height: 30px; margin-bottom: 42px; }
  .pakiety__siatka { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .pakiet { padding: 28px 0 70px; }
  .pakiet__wstazka { font-size: 20px; line-height: 30px; }
  .pakiet__nazwa { font-size: 20px; line-height: 44px; margin-bottom: 14px; }
  .pakiet__nazwa--mala { font-size: 18px; line-height: 23.4px; }
  .pakiet__foto img { width: 120px; }
  .pakiet__cena { font-size: 40px; line-height: 40px; }
  .pakiet__cena s { font-size: 14px; }
  .pakiet__omnibus { font-size: 11px; }
  .pakiet__opis { font-size: 18px; line-height: 21.6px; padding: 0 15px; }
}

/* allegro */
.allegro { text-align: center; padding: 20px 10px 26px; }
.allegro h2 { font: 600 34px/44px var(--r); text-transform: none; margin-bottom: 14px; }
.allegro img { width: 240px; margin: 0 auto; }
@media (max-width: 767px) { .allegro h2 { font-size: 20px; } .allegro img { width: 200px; } }

/* o powieści */
.powiesc { background: var(--szary-tlo); padding: 0 129.6px; }
.powiesc__in { max-width: 1182px; margin: 0 auto; min-height: 642px; display: grid; grid-template-columns: 590px 321px; justify-content: start; align-items: center; column-gap: 198px; }
.powiesc__tekst { background: #000; color: #fff; padding: 35px 35px 25px; }
.powiesc__tekst p { font: 300 22px/33px var(--r); margin: 0 0 14px; }
.powiesc__tekst strong { font: 700 22px/33px var(--h); }
.powiesc__okladka img { width: 321px; }
@media (max-width: 1240px) { .powiesc { padding: 0 40px; } .powiesc__in { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); column-gap: 60px; } .powiesc__okladka img { width: min(321px, 100%); margin: 0 auto; } }
@media (max-width: 767px) {
  .powiesc { padding: 0 23.4px; }
  .powiesc__in { display: flex; flex-direction: column-reverse; min-height: 0; padding: 10px 0 0; }
  .powiesc__okladka img { width: 145px; margin: 0 auto 25px; }
  .powiesc__tekst { padding: 25px 10px 15px; text-align: center; }
  .powiesc__tekst p, .powiesc__tekst strong { font-size: 17px; line-height: 25.5px; }
}

/* MARA to kobieta… */
.definicja { padding: 80px 20px; }
@media (max-width: 767px) { .definicja { padding: 34px 25px 28px; } .definicja h2 { font-size: 22px; line-height: 24.2px; } }

/* o autorce */
.autorka { position: relative; min-height: 998px; isolation: isolate; color: #fff; }
.autorka__foto { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.autorka__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 0 0; }
.autorka__in { padding: 260px 0 60px 146px; max-width: 630px; }
.autorka h2 { text-align: left; color: #fff; margin-bottom: 20px; }
.autorka p { font: 300 22px/33px var(--m); color: var(--lekki-bialy); }
.autorka b { color: #fff; }
.autorka b { font-weight: 400; }
@media (max-width: 1024px) { .autorka__in { padding-left: 60px; max-width: 560px; } }
@media (max-width: 767px) {
  .autorka { min-height: 0; }
  .autorka__foto { position: relative; height: 998px; }
  .autorka__foto img { object-position: 61% 0; }
  .autorka h2 { position: absolute; top: 34px; left: 0; right: 0; text-align: center; }
  .autorka__in { padding: 16px 14px 20px; max-width: none; background: var(--braz); text-align: center; }
  .autorka p { font-size: 18px; line-height: 27px; margin: 0; }
}

/* Paweł Wilczak */
.wilczak__in { min-height: 845px; display: grid; grid-template-columns: 478px 774px; column-gap: 1px; justify-content: start; align-items: start; padding: 84px 0 60px 115px; }
.wilczak__foto img { width: 478px; }
.wilczak__tekst { text-align: center; padding: 50px 40px 0 50px; }
.wilczak__cudzyslow img { width: 400px; margin: 22px auto 34px; }
.wilczak__tekst p { font: 300 22px/33px var(--m); max-width: 618px; margin: 0 auto; color: var(--lekki); }
@media (max-width: 1240px) { .wilczak__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); padding: 60px 40px; min-height: 0; column-gap: 40px; } .wilczak__foto img { width: 100%; } .wilczak__tekst { padding: 20px 0 0; } }
@media (max-width: 767px) {
  .wilczak__in { display: flex; flex-direction: column-reverse; padding: 39px 39px 60px; }
  .wilczak h2 { font-size: 32px; }
  .wilczak__cudzyslow img { width: 100%; max-width: 312px; margin: 16px auto 18px; }
  .wilczak__tekst { padding: 0 0 52px; }
  .wilczak__tekst p { font-size: 18px; line-height: 27px; }
  .wilczak__foto img { width: 100%; }
}

/* muzyka */
.muzyka { background: var(--szary-tlo); padding: 39px 72px 60px; min-height: 583px; }
.muzyka h2 { font-weight: 400; }
.muzyka__in { max-width: 1140px; margin: 64px auto 0; display: grid; grid-template-columns: 467px 600px; justify-content: space-between; align-items: center; }
.muzyka__in p { font: 400 22px/33px var(--m); color: #212121; margin: 0; max-width: 420px; }
.muzyka__in strong { font-weight: 700; color: #212121; }
.muzyka__foto img { width: 600px; }
@media (max-width: 1240px) { .muzyka { padding-left: 40px; padding-right: 40px; } .muzyka__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 40px; } .muzyka__foto img { width: 100%; } }
@media (max-width: 767px) {
  .muzyka { padding: 40px 19.5px 50px; min-height: 0; }
  .muzyka h2 { font-size: 35px; }
  .muzyka__in { display: block; margin-top: 30px; text-align: center; }
  .muzyka__in p { font-size: 18px; line-height: 27px; max-width: none; margin-bottom: 30px; }
}

/* FAQ */
.faq { padding: 50px 144px 70px; }
.faq h2 { font-size: 32px; margin-bottom: 50px; }
.faq__lista { max-width: 820px; margin: 0 auto; }
.faq details { margin-bottom: 0; }
.faq summary { list-style: none; cursor: pointer; position: relative; padding: 0 50px 35px 0; font: 300 22px/33px var(--m); color: var(--lekki); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ''; position: absolute; right: 0; top: 5px; width: 22px; height: 22px;
  background: linear-gradient(#000, #000) center / 100% 5px no-repeat, linear-gradient(#000, #000) center / 5px 100% no-repeat; border-radius: 1px; }
.faq details[open] summary::after { background: linear-gradient(#000, #000) center / 100% 5px no-repeat; }
.faq details > div { padding: 0 15px 30px; font: 400 16px/24px var(--m); }
.faq details ul { margin: 0 0 .9em; padding-left: 1.3em; }
.faq a { color: #000; }
@media (max-width: 1024px) { .faq { padding-left: 40px; padding-right: 40px; } }
@media (max-width: 767px) { .faq { padding: 40px 19.5px 50px; } .faq summary { font-size: 18px; line-height: 27px; padding-bottom: 28px; } .faq summary::after { top: 2px; } }

/* bądź bliżej */
.blizej { background: #000; color: #fff; text-align: center; padding: 49px 115px 70px; }
.blizej h2 { font-weight: 400; color: #fff; margin-bottom: 70px; }
.blizej__ig { width: 76px; height: 76px; fill: #fff; margin: 0 auto 26px; display: block; }
.blizej__konta { font: 300 16px/24px 'Poppins', var(--m); margin: 0; }
.blizej__konta a { color: var(--roz); text-decoration: none; }
.blizej__konta a:hover { text-decoration: underline; }
@media (max-width: 767px) { .blizej { padding: 40px 19.5px 50px; } .blizej__ig { width: 50px; height: 50px; } .blizej__konta { font-size: 14px; line-height: 21px; } }

/* stopka */
.stopka { background: #000; color: #dcd7c8; text-align: center; padding: 11px 20px; font: 400 14px/23px -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
.stopka p { margin: 0; }
.stopka a { color: #dcd7c8; }

/* regulamin konkursu */
.dokument { max-width: 1140px; margin: 0 auto; padding: 40px 20px 80px; font: 400 16px/24px var(--r); color: #54595f; }
.dokument p { margin: 0 0 14px; }
.dokument ul, .dokument ol { margin: 0 0 14px; padding-left: 40px; }
.dokument strong { color: #54595f; }
.dokument__tytul { font: 700 16px/24px var(--r); color: #54595f; margin: 0 0 14px; }
.dokument a { color: #54595f; }

/* 404 */
.blad404 { text-align: center; padding: 120px 20px; }
.blad404 h1 { font: 600 35px/44px var(--m); text-transform: uppercase; margin-bottom: 30px; }

/* baner zgody */
#zgoda { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 90; max-width: 640px; margin: 0 auto; background: #fff; color: #000; box-shadow: 0 6px 30px rgba(0,0,0,.25); padding: 18px 20px; display: flex; flex-wrap: wrap; gap: 14px 20px; align-items: center; font: 400 14px/1.5 var(--m); }
#zgoda p { margin: 0; flex: 1 1 300px; }
#zgoda div { display: flex; gap: 10px; }
#zgoda button { font: 600 13px/1 var(--m); text-transform: uppercase; letter-spacing: 1px; padding: 12px 18px; cursor: pointer; border: 1px solid #000; }
#zgoda button[data-z="tak"] { background: #000; color: #fff; }
#zgoda button[data-z="nie"] { background: #fff; color: #000; }

/* animacje wejścia jak w Elementorze (fadeInUp / slideInUp, 1,25 s; „animated-slow” 2 s) i efekty grow/shrink po najechaniu */
.js [data-anim]:not(.wszedl) { opacity: 0; }
.js [data-anim="slideInUp"]:not(.wszedl) { opacity: 1; visibility: hidden; }
[data-anim].wszedl { animation: 1.25s both; }
[data-anim="fadeInUp"].wszedl { animation-name: fadeInUp; }
[data-anim="slideInUp"].wszedl { animation-name: slideInUp; }
@keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0); } to { opacity: 1; transform: none; } }
@keyframes slideInUp { from { visibility: visible; transform: translate3d(0, 100%, 0); } to { transform: translate3d(0, 0, 0); } }
.faq h2 { overflow: hidden; }
.btn--obrys, .btn--kup { transition: transform .3s, background .2s, color .2s; }
.btn--obrys:hover, .btn--kup:hover { transform: scale(1.1); }
.blizej__ig { transition: transform .3s; }
.blizej__ig:hover { transform: scale(.9); }
@media (prefers-reduced-motion: reduce) {
  .js [data-anim]:not(.wszedl) { opacity: 1; visibility: visible; }
  [data-anim].wszedl { animation: none; }
  .btn--obrys:hover, .btn--kup:hover, .blizej__ig:hover { transform: none; }
}
