/* Pani Detektyw — style one-page'a. Źródło: docs/mockup/design/Pani Detektyw v5.dc.html (high-fidelity).
   Zasady klientki: bez zaokrągleń, bez numeracji, bez pigułek i etykiet wersalikami. */

@font-face{font-family:'Zilla Slab';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/zilla-slab-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Zilla Slab';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/zilla-slab-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Zilla Slab';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/zilla-slab-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Zilla Slab';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/zilla-slab-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/source-sans-3-var-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/source-sans-3-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --c-footer:#06140F;
  --c-hero:#06241A;
  --c-dark:#0A3A2B;
  --c-green:#0D4A37;
  --c-link:#0B6B4C;
  --c-link-hover:#08402F;
  --c-mint:#6FD3A5;
  --c-on-dark-2:#B7D9CB;
  --c-on-dark-p:#DCEAE3;
  --c-footer-text:#B7C7C0;
  --c-text:#14201B;
  --c-text-p:#26332E;
  --c-text-p2:#33423C;
  --c-block:#F2F5F3;
  --c-line:#DDE5E1;
  --c-line-2:#C9D5CF;
  --c-marker:#CFE6DC;
  --c-photo:#E6ECE9;
  --f-head:'Zilla Slab',Georgia,serif;
  --f-body:'Source Sans 3',system-ui,sans-serif;
  --container:1160px;
  --gutter:clamp(18px,4vw,40px);
  --section-y:clamp(56px,7vw,96px);
  --ease-in:cubic-bezier(.2,.7,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#FFFFFF;color:var(--c-text);font-family:var(--f-body);-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:var(--c-link);text-underline-offset:3px}
a:hover{color:var(--c-link-hover)}
::selection{background:var(--c-green);color:#FFFFFF}
:focus-visible{outline:2px solid var(--c-mint);outline-offset:3px}

.container{max-width:var(--container);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.skip-link{position:absolute;left:-9999px;top:0;z-index:30;background:#FFFFFF;color:var(--c-text);padding:10px 16px}
.skip-link:focus{left:16px;top:10px}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:20;background:var(--c-dark);transition:box-shadow .3s ease}
.site-header.is-scrolled{box-shadow:0 8px 24px rgba(0,0,0,.28)}
.site-header__inner{padding-top:14px;padding-bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:14px 32px;flex-wrap:wrap}
.site-header__logo{display:block;line-height:0}
.site-header__logo img{height:48px;width:auto}
.site-nav{display:flex;align-items:center;gap:clamp(18px,2.8vw,34px);flex-wrap:wrap;font-size:17px}
.site-nav a{color:#FFFFFF;text-decoration:none}
.site-nav a:hover{color:var(--c-on-dark-2)}
.site-nav__phone{font-weight:700;border-left:1px solid rgba(255,255,255,.3);padding-left:clamp(18px,2.8vw,34px)}
.site-header__progress{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--c-mint)}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;background:var(--c-hero);color:#FFFFFF}
.hero__bg{position:absolute;inset:-12% 0;background-color:var(--c-hero);background-image:url(/img/hero-bg-1000.jpg);background-image:image-set(url(/img/hero-bg-1000.webp) type('image/webp'),url(/img/hero-bg-1000.jpg) type('image/jpeg'));background-size:cover;background-position:center 60%;will-change:transform}
@media (min-width:1000px){
  .hero__bg{background-image:url(/img/hero-bg.jpg);background-image:image-set(url(/img/hero-bg.webp) type('image/webp'),url(/img/hero-bg.jpg) type('image/jpeg'))}
}
.hero__torch{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle clamp(180px,22vw,320px) at var(--mx,72%) var(--my,45%),rgba(6,36,26,0) 0%,rgba(6,36,26,.4) 55%,rgba(6,36,26,.88) 100%)}
.hero__shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(6,36,26,.85) 0%,rgba(6,36,26,.3) 55%,rgba(6,36,26,0) 100%)}
.hero__inner{position:relative;max-width:var(--container);margin:0 auto;min-height:clamp(460px,70vh,700px);display:flex;align-items:center}
.hero__content{max-width:700px;padding:clamp(48px,7vw,96px) var(--gutter);display:flex;flex-direction:column;justify-content:center}
.hero h1{margin:0;font-family:var(--f-head);font-weight:600;font-size:clamp(38px,4.8vw,60px);line-height:1.08;text-wrap:balance}
.hero__lead{margin:24px 0 0;max-width:44ch;font-size:clamp(18px,1.5vw,20px);line-height:1.55;color:var(--c-on-dark-p);text-wrap:pretty}
.hero__call{margin-top:36px;display:flex;flex-direction:column;gap:6px}
.hero__call-label{font-size:16px;color:var(--c-on-dark-2)}
.hero__phone{color:#FFFFFF;font-family:var(--f-head);font-weight:600;font-size:clamp(28px,3vw,36px);text-decoration:none;align-self:flex-start;border-bottom:2px solid #FFFFFF}
.hero__phone:hover{color:var(--c-on-dark-2)}
.hero__bar{position:relative;border-top:1px solid rgba(255,255,255,.14)}
.hero__bar-inner{padding-top:14px;padding-bottom:14px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 24px;font-size:15px;color:var(--c-on-dark-2);letter-spacing:.02em}
.hero__typed{display:flex;align-items:center;min-height:22px;color:#FFFFFF}
.caret{display:inline-block;width:2px;height:1.1em;margin-left:3px;background:var(--c-mint);animation:pdBlink 1s steps(1) infinite}
.hero__geo{white-space:pre}

/* ---------- Wstęp ---------- */
.intro{padding-top:var(--section-y);padding-bottom:var(--section-y)}
.intro__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:36px 48px}
.intro__item{border-top:3px solid var(--c-green);padding-top:20px}
.intro__item h3{margin:0;font-family:var(--f-head);font-weight:600;font-size:23px;line-height:1.25}
.intro__quote{margin:clamp(48px,6vw,72px) 0 0;max-width:40ch;font-family:var(--f-head);font-weight:500;font-size:clamp(26px,2.8vw,34px);line-height:1.3;color:var(--c-green);text-wrap:pretty}
.marker{background-image:linear-gradient(var(--c-marker),var(--c-marker));background-repeat:no-repeat;background-position:0 88%;background-size:100% 34%}
.js-motion .marker{background-size:0% 34%;transition:background-size 1.2s cubic-bezier(.6,0,.2,1) .5s}
.js-motion .marker.is-visible{background-size:100% 34%}

/* ---------- Usługi ---------- */
.services{border-top:1px solid var(--c-line);scroll-margin-top:76px}
.services__inner{padding-top:var(--section-y);padding-bottom:var(--section-y)}
.h2{margin:0;font-family:var(--f-head);font-weight:600;font-size:clamp(30px,3.4vw,40px);line-height:1.15}
.services__groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:44px 64px;margin-top:44px}
.services__label{margin:0 0 6px;font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--c-link);padding-bottom:12px;border-bottom:2px solid var(--c-green)}
.list{margin:0;padding:0;list-style:none}
.list__row{padding:12px 0;border-bottom:1px solid var(--c-line);font-size:18px;line-height:1.45;transition:padding .25s ease,color .2s ease}
.list__row:hover{padding-left:10px;color:var(--c-link)}
.business{margin-top:clamp(56px,7vw,80px);background:var(--c-block);padding:clamp(28px,4vw,48px)}
.business .h2{font-size:clamp(26px,3vw,34px)}
.business .list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));column-gap:36px;margin-top:24px}
.business .list__row{border-bottom-color:var(--c-line-2)}
.services__outro{margin-top:40px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px 40px}
.services__outro p{margin:0;font-size:18px;line-height:1.55;color:var(--c-text-p2);max-width:62ch;text-wrap:pretty}
.services__outro b{color:var(--c-text)}
.btn{flex:none;display:inline-block;background:var(--c-green);color:#FFFFFF;text-decoration:none;padding:15px 24px;font-weight:700;font-size:17px}
.btn:hover{background:var(--c-dark);color:#FFFFFF}

/* ---------- O nas ---------- */
.about{padding-top:var(--section-y);padding-bottom:var(--section-y);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:clamp(40px,5vw,72px);align-items:start;scroll-margin-top:76px}
.about .h2{font-size:clamp(32px,3.4vw,44px);line-height:1.1}
.about__text{margin-top:24px;display:flex;flex-direction:column;gap:16px;font-size:18px;line-height:1.6;color:var(--c-text-p);max-width:60ch}
.about__text p{margin:0;text-wrap:pretty}
.about__text .strong{font-weight:600;color:var(--c-text)}
.about__photo{position:relative;aspect-ratio:4/3;background:var(--c-photo);overflow:hidden}
.about__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.js-motion .about__photo{clip-path:circle(0% at 50% 50%);transition:clip-path 1.5s cubic-bezier(.7,0,.2,1) .25s}
.js-motion .about__photo.is-visible{clip-path:circle(75% at 50% 50%)}

/* ---------- Kontakt ---------- */
.contact{background:var(--c-dark);color:#FFFFFF;scroll-margin-top:60px}
.contact__inner{padding-top:var(--section-y);padding-bottom:var(--section-y);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:clamp(40px,5vw,64px);align-items:stretch}
.contact h2{margin:0;font-family:var(--f-head);font-weight:600;font-size:clamp(32px,3.6vw,46px);line-height:1.1}
.contact__open{margin:18px 0 0;font-size:20px;font-weight:600;display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px}
.contact__now{display:flex;align-items:center;gap:8px;font-weight:400;font-size:16px;color:var(--c-on-dark-2)}
.pulse{width:9px;height:9px;border-radius:50%;background:var(--c-mint);animation:pdPulse 2s infinite}
.contact__note{margin:10px 0 0;font-size:18px;line-height:1.55;color:var(--c-on-dark-p);max-width:46ch;text-wrap:pretty}
.contact__table{margin-top:32px;width:100%;border-collapse:collapse;font-size:18px;line-height:1.5}
.contact__table tr{border-bottom:1px solid rgba(255,255,255,.2)}
.contact__table tr:first-child{border-top:1px solid rgba(255,255,255,.2)}
.contact__table th{padding:14px 16px 14px 0;color:var(--c-on-dark-2);vertical-align:top;width:38%;text-align:left;font-weight:400}
.contact__table td{padding:14px 0}
.contact__table a{color:#FFFFFF;text-decoration:none}
.contact__table a:hover{color:var(--c-on-dark-2)}
.contact__table .email a{text-decoration:underline;word-break:break-all}
.contact__table address{font-style:normal}
.copy{all:unset;cursor:copy;display:inline-flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.copy:hover{color:var(--c-on-dark-2)}
.copy:focus-visible{outline:2px solid var(--c-mint);outline-offset:3px}
.copy__label{font-size:14px;color:var(--c-on-dark-2);border-bottom:1px dotted var(--c-on-dark-2)}
.contact__map{position:relative;min-height:420px;background:var(--c-green)}
.contact__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- Stopka ---------- */
.site-footer{background:var(--c-footer);color:var(--c-footer-text)}
.site-footer__inner{padding-top:clamp(40px,5vw,56px);padding-bottom:26px}
.site-footer__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:28px 48px}
.site-footer__brand{display:flex;flex-direction:column;gap:16px;max-width:380px}
.site-footer__brand img{height:50px;width:auto;align-self:flex-start}
.site-footer__brand p{margin:0;font-size:17px;line-height:1.45;color:#FFFFFF}
.site-footer__licenses{margin:0;padding:0;list-style:none;font-size:16px;line-height:1.8}
.site-footer__copy{margin-top:36px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);font-size:14px}

/* ---------- Animacja wejścia (włączana przez JS, gdy ruch nie jest ograniczony) ---------- */
.js-motion [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease-in) var(--d,0ms),transform .8s var(--ease-in) var(--d,0ms),padding .25s ease,color .2s ease}
.js-motion [data-reveal].is-visible{opacity:1;transform:none}

@keyframes pdBlink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes pdPulse{0%{box-shadow:0 0 0 0 rgba(130,220,175,.7)}70%{box-shadow:0 0 0 10px rgba(130,220,175,0)}100%{box-shadow:0 0 0 0 rgba(130,220,175,0)}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .caret,.pulse{animation:none}
}
