/* =========================================================
   FILIP STUDIO — subpage: privacy policy
   Uses the V4 tokens, fonts, nav, menu and footer from style.css.
   No curtain, no heavy animation; readable at ~70 characters per line.
   ========================================================= */

.lp{background:var(--stage);color:var(--bone)}
.no-js .nav__menu{display:none}                 /* without JS the page keeps its plain links */

/* hero */
.lp-hero{padding:clamp(112px,16vh,170px) var(--gutter) clamp(36px,6vh,64px);border-bottom:1px solid rgba(237,230,218,.14)}
.lp-back{display:inline-block;margin-bottom:clamp(28px,5vh,48px);font-size:14px;font-weight:600;text-decoration:none;opacity:.7;transition:opacity .3s}
.lp-back:hover,.lp-back:focus-visible{opacity:1;text-decoration:underline;text-underline-offset:4px}
.lp-kicker{font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.9vw,30px);color:var(--brass);margin-bottom:1.2vh}
.lp-title{font-family:var(--display);font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:clamp(54px,9.2vw,168px);line-height:.82;letter-spacing:-.02em}
.lp-title span{display:block}
.lp-lead{max-width:60ch;margin-top:clamp(20px,3.4vh,36px);font-size:clamp(16px,1.25vw,19px);line-height:1.55;opacity:.9}
.lp-meta{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:clamp(24px,4vh,40px);font-size:14px}
.lp-meta dt{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--brass)}
.lp-meta dd{font-weight:600}

/* layout: contents on the left, the text at ~70ch */
.lp-layout{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,58ch);gap:clamp(32px,6vw,110px);padding:clamp(40px,7vh,80px) var(--gutter) clamp(64px,10vh,120px)}
.lp-toc{position:sticky;top:96px;align-self:start;font-size:14px}
.lp-toc__title{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--brass);margin-bottom:12px}
.lp-toc ol{list-style:none;display:grid;gap:2px}
.lp-toc a{display:flex;gap:12px;padding:6px 0;text-decoration:none;opacity:.72;transition:opacity .25s,transform .35s var(--ease-out)}
.lp-toc a:hover,.lp-toc a:focus-visible{opacity:1;transform:translateX(4px)}
.lp-toc b{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--brass);min-width:1.6em}

/* text */
.lp-body{font-size:clamp(16px,1.1vw,17.5px);line-height:1.65}
.lp-body section{padding-top:clamp(28px,5vh,52px);scroll-margin-top:80px}
.lp-body section + section{border-top:1px solid rgba(237,230,218,.12);margin-top:clamp(28px,5vh,52px)}
.lp-body section:first-child{padding-top:0}
.lp-body h2{font-family:var(--display);font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:clamp(30px,3.2vw,48px);line-height:.92;letter-spacing:-.01em;margin-bottom:.6em}
.lp-no{display:block;font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;font-size:.5em;letter-spacing:0;color:var(--brass);margin-bottom:.25em}
.lp-body h3{font-family:var(--display);font-weight:700;font-stretch:85%;text-transform:uppercase;font-size:clamp(19px,1.5vw,23px);letter-spacing:.01em;margin:1.6em 0 .5em}
.lp-body p + p,.lp-body p + ul,.lp-body ul + p,.lp-body p + .lp-table,.lp-body .lp-table + p{margin-top:1em}
.lp-body ul{padding-left:1.2em;display:grid;gap:.45em;margin-top:.6em}
.lp-body li::marker{color:var(--brass)}
.lp-body a{color:inherit;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--brass) 70%,transparent);text-underline-offset:3px;text-decoration-thickness:1px}
.lp-body a:hover{text-decoration-color:var(--bone)}
.lp-body strong{font-weight:700}
.lp-body code{white-space:nowrap;font-size:.9em;padding:1px 6px;border-radius:4px;background:rgba(237,230,218,.08)}
.lp-note{padding:14px 18px;border-left:3px solid var(--crimson);background:rgba(237,230,218,.05);border-radius:0 6px 6px 0;font-size:.95em}
.lp-body .lp-note{margin-top:1.1em}

/* table of the previewed sites */
.lp-table{overflow-x:auto;border:1px solid rgba(237,230,218,.16);border-radius:8px}
.lp-table:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.lp-table table{width:100%;min-width:560px;border-collapse:collapse;font-size:14.5px;line-height:1.5}
.lp-table th,.lp-table td{padding:12px 14px;text-align:left;vertical-align:top;border-bottom:1px solid rgba(237,230,218,.12)}
.lp-table thead th{font-family:var(--serif);font-style:italic;font-weight:400;font-size:15px;color:var(--brass)}
.lp-table tbody tr:last-child > *{border-bottom:0}
.lp-table tbody th{font-weight:700;white-space:nowrap}

/* consent settings (#ustawienia-zgod) */
.lp-consent{margin-top:1.6em;padding:20px 22px;border:1px solid rgba(237,230,218,.2);border-radius:10px;background:rgba(237,230,218,.04);scroll-margin-top:90px}
.lp-consent__title{font-family:var(--display);font-weight:800;font-stretch:75%;text-transform:uppercase;font-size:clamp(20px,1.6vw,24px);letter-spacing:.01em;margin-bottom:12px}
.lp-consent__row{display:flex;align-items:center;justify-content:space-between;gap:20px}
.lp-consent__name{font-weight:700}
.lp-consent__desc{font-size:.92em;opacity:.8;margin-top:2px}
.lp-consent__state{margin-top:12px;font-size:.92em;color:var(--brass)}
.lp-consent__other{margin-top:8px;font-size:.88em;opacity:.7}
.lp-body .lp-consent p + p{margin-top:0}
.lp-body .lp-consent .lp-consent__state,.lp-body .lp-consent .lp-consent__other{margin-top:10px}
.lp-switch{flex:none;position:relative;width:56px;height:32px;border-radius:999px;background:rgba(237,230,218,.22);border:1px solid rgba(237,230,218,.5);transition:background .25s}
.lp-switch span{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:var(--bone);transition:transform .3s var(--ease-out)}
.lp-switch[aria-checked="true"]{background:var(--crimson);border-color:var(--crimson)}
.lp-switch[aria-checked="true"] span{transform:translateX(24px)}
.lp-switch:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

.lp-foot{background:var(--crimson);color:var(--bone);border-top:0}
.lp-foot a[aria-current]{text-decoration:underline;text-underline-offset:3px}

/* tablet and phone */
@media (max-width:900px){
  .lp-layout{grid-template-columns:minmax(0,1fr)}
  .lp-toc{position:static;padding:16px 18px;border:1px solid rgba(237,230,218,.14);border-radius:8px}
  .lp-toc ol{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));column-gap:20px}
}
/* phones: the table becomes one card per site, each value with its own label (no sideways scrolling) */
@media (max-width:640px){
  .lp-table{overflow:visible;border:0}
  .lp-table table,.lp-table tbody,.lp-table tr,.lp-table th,.lp-table td{display:block;min-width:0;width:auto}
  .lp-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .lp-table tr{border:1px solid rgba(237,230,218,.16);border-radius:8px;padding:4px 0}
  .lp-table tr + tr{margin-top:12px}
  .lp-table tbody th{white-space:normal;font-family:var(--display);font-stretch:85%;text-transform:uppercase;font-size:17px;letter-spacing:.01em;border-bottom:1px solid rgba(237,230,218,.12)}
  .lp-table td{border-bottom:0;padding-top:8px;padding-bottom:10px}
  .lp-table td::before{content:attr(data-label);display:block;margin-bottom:2px;font-family:var(--serif);font-style:italic;font-size:14px;color:var(--brass)}
  .lp-table code{white-space:normal;overflow-wrap:anywhere}
}
@media (max-width:760px){
  .lp-hero{padding-top:96px}
  .lp-title{font-size:min(15vw,12svh)}
  .lp-meta{gap:10px 28px}
}
@media (prefers-reduced-motion:reduce){
  .lp-toc a{transition:none}
}