/*
Theme Name: btw.agency
Author: Admin
Description: Motyw fioletowy - btw agency
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: btw-agency
*/

/* Base & Variables */
:root{--ink:#14162B;--ink2:#26206A;--paper:#F1EEF8;--mist:#BDB6DD;--acc:#B9A0FF;--acc2:#5B3FA0;--on:#14162B;box-sizing:border-box}
*,*:before,*:after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.65 'Manrope',system-ui,sans-serif}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:400;line-height:1.1;margin:0}
p{margin:0 0 1em}a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.w{max-width:1160px;margin:0 auto;padding:0 24px}

/* Header */
header{position:fixed;top:0;left:0;right:0;z-index:50;background:color-mix(in srgb,var(--ink) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.12)}
header .w{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font:600 22px 'Fraunces',serif;color:#fff;text-decoration:none}.logo i{color:var(--acc);font-style:normal}
nav{display:flex;align-items:center;gap:26px}nav a{color:#fff;font-size:15px;font-weight:500}
.btn{display:inline-block;background:var(--acc);color:var(--on)!important;font:700 16px 'Manrope',sans-serif;padding:14px 26px;border-radius:999px;border:0;cursor:pointer}
nav .btn{padding:10px 20px;font-size:14px}

/* Page Templates (Legal) */
.page-wrap { padding: 140px 24px 100px; max-width: 800px; margin: 0 auto; min-height: 70vh; text-align: left; font-family: 'Manrope', sans-serif !important; color: #333 !important; background-color: var(--paper) !important; counter-reset: none !important; }
.page-wrap *:before, .page-wrap *:after { content: none !important; }
.page-wrap *, .page-wrap .wp-block-columns, .page-wrap .wp-block-column { border: none !important; border-bottom: none !important; box-shadow: none !important; background: transparent !important; float: none !important; display: block !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
.page-wrap h1 { font-family: 'Fraunces', Georgia, serif !important; font-size: 38px !important; font-weight: 600 !important; margin-bottom: 30px !important; color: var(--ink) !important; line-height: 1.2 !important; }
.page-wrap h2 { font-family: 'Fraunces', Georgia, serif !important; font-size: 22px !important; font-weight: 600 !important; margin-top: 36px !important; margin-bottom: 12px !important; color: var(--ink) !important; }
.page-wrap h3 { font-size: 18px !important; font-weight: 700 !important; margin-top: 24px !important; margin-bottom: 8px !important; color: var(--ink) !important; }
.page-wrap p { font-size: 16px !important; line-height: 1.8 !important; margin-bottom: 16px !important; color: #333 !important; }
.page-wrap ul, .page-wrap ol { margin-bottom: 20px !important; padding-left: 24px !important; font-size: 16px !important; line-height: 1.8 !important; color: #333 !important; }
.page-wrap li { margin-bottom: 8px !important; }
.page-wrap a { color: var(--acc2) !important; text-decoration: underline !important; }

/* Animations & Core Layout */
.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out; }
.reveal.active { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: 0.1s; } .delay-2 { transition-delay: 0.3s; } .delay-3 { transition-delay: 0.5s; }
.floating-phone { position: fixed; bottom: 30px; right: 30px; width: 60px; height: 60px; background: var(--acc); color: var(--ink); border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 20px rgba(0,0,0,0.3); z-index: 90; transition: transform 0.3s, background 0.3s; animation: pulse-ring 2s infinite; }
.floating-phone:hover { transform: scale(1.1); background: #fff; animation: none; }
.floating-phone svg { width: 26px; height: 26px; fill: currentColor; }
@keyframes pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(185,160,255,0.7); } 70% { box-shadow: 0 0 0 15px rgba(185,160,255,0); } 100% { box-shadow: 0 0 0 0 rgba(185,160,255,0); } }

/* Hero */
.hero{position:relative;overflow:hidden;min-height:100vh;display:flex;align-items:flex-end;color:#fff;padding:140px 0 88px;background:radial-gradient(circle at 78% 22%,var(--acc2),transparent 55%),linear-gradient(160deg,var(--ink2),var(--ink) 65%)}
.hero .w{position:relative;z-index:2;width:100%}
.hero small{display:block;color:var(--mist);margin-bottom:20px}
.hero h1{font-size:clamp(32px,5vw,72px);max-width:18ch;margin-bottom:32px}
.hero p{max-width:52ch;color:var(--mist);font-size:19px;margin-bottom:36px}
.hero-img{position:absolute;right:5%;top:20%;width:500px;max-width:45vw;z-index:1;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 20px 40px rgba(0,0,0,0.4))}
@keyframes float { 0% { transform: translateY(0px); } 50% { transform: translateY(-20px); } 100% { transform: translateY(0px); } }

/* Generic Section */
section{padding:112px 0}h2{font-size:clamp(32px,4.4vw,56px)}

/* About */
.about .w{display:grid;grid-template-columns:1.1fr .9fr;gap:72px;align-items:center}.about h2{margin-bottom:28px}
.art{height:520px;border-radius:220px 220px 8px 8px;overflow:hidden;position:relative;background:var(--ink)}
.art img{width:100%;height:100%;object-fit:cover;animation:slowZoom 15s ease-in-out infinite alternate;transform-origin:center}
@keyframes slowZoom { 0% { transform: scale(1); } 100% { transform: scale(1.15); } }
.facts{display:flex;gap:32px;flex-wrap:wrap;margin-top:32px;padding-top:24px;border-top:1px solid var(--mist)}
.facts b{font:600 22px 'Fraunces',serif;color:var(--acc2);display:block}.facts span{font-size:14px}

/* Services */
.serv{background:var(--ink);color:#fff}
.serv h2{margin-bottom:56px;white-space:nowrap}
.row{display:grid;grid-template-columns:.9fr 1.4fr;gap:40px;padding:32px 0;border-top:1px solid rgba(255,255,255,.18);transition:background .25s}
.row:last-child{border-bottom:1px solid rgba(255,255,255,.18)}.row:hover{background:var(--ink2)}
.row h3{font-size:28px;color:var(--acc)}.row p{color:var(--mist);margin:0}

/* Process */
.proc h2{margin-bottom:56px}
ol{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;counter-reset:s;padding:0;margin:0;list-style:none}
li{counter-increment:s;border-top:3px solid var(--acc2);padding-top:20px;transition:transform 0.4s ease, border-color 0.4s ease}
li:hover{transform:translateY(-10px);border-top-color:var(--acc)}
li:before{content:counter(s);font:44px/1 'Fraunces',serif;color:var(--acc2);display:block;margin-bottom:12px;transition:color 0.4s ease, transform 0.4s ease;transform-origin:left bottom}
li:hover:before{color:var(--acc);transform:scale(1.1)}
li h3{font-size:24px;margin-bottom:10px}li p{font-size:16px;margin:0}

/* Contact & Form */
.contact{background:linear-gradient(135deg,var(--acc2),var(--ink2) 70%);color:#fff}
.contact .w{display:grid;grid-template-columns:1fr 1fr;gap:72px}.contact h2{margin-bottom:24px}
.mail{font:26px 'Fraunces',serif;color:var(--acc)}
label{display:block;font-size:14px;margin-bottom:16px}
input,textarea{display:block;width:100%;margin-top:6px;padding:14px 16px;font:inherit;color:#fff;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.3);border-radius:8px}
textarea{min-height:120px}
.rodo-check{display:flex;align-items:flex-start;gap:12px;font-size:12px;color:var(--mist);margin:24px 0}
.rodo-check input{width:auto;margin-top:4px}
.rodo-check a{color:var(--acc);text-decoration:underline}

/* Footer */
footer{background:var(--ink);color:var(--mist);padding:48px 0 64px;font-size:14px}
footer .w{display:flex;flex-direction:column;gap:32px}
.f-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:24px;border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:32px}
.f-contact{display:flex;gap:32px;font-family:'Fraunces',serif;font-size:22px;color:#fff}
.f-contact a:hover{color:var(--acc)}
.f-socials{display:flex;gap:16px}
.f-socials a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.05);transition:background 0.3s, color 0.3s}
.f-socials a:hover{background:var(--acc);color:var(--ink)}
.f-socials svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.f-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;font-size:13px;color:rgba(255,255,255,.6)}
.f-company{display:flex;flex-direction:column;gap:6px}
.copyright{color:#fff;font-weight:700;font-size:15px;margin-bottom:4px}
.f-links{display:flex;gap:16px}
.f-links a:hover{color:var(--acc);text-decoration:underline}

/* Text balancing */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}

/* A11y skip link */
.skip-link{position:absolute;left:-9999px;top:8px;background:#fff;color:var(--ink);padding:10px 14px;border-radius:8px;z-index:100}
.skip-link:focus{left:8px}

/* Hero grid */
.hero .w > h1,
.hero .w > p,
.hero .w > .hero-actions{max-width:min(100%,620px)}
.hero .w h1{font-size:clamp(30px,3.4vw,52px);line-height:1.12;margin-bottom:28px}
.hero .w > p{font-size:18px;max-width:min(100%,46ch);margin-bottom:36px}
.hero-img{width:min(460px,36vw);max-width:none;right:max(3%,calc((100vw - 1160px) / 2));top:50%;margin-top:-230px}

/* Call to action */
.hero .hero-actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.hero .hero-actions .btn{margin:0}
.hero .hero-actions .trust{margin:0;max-width:none;font-size:14px;line-height:1.5;color:var(--mist);opacity:.9}

/* About grid */
.about .w{align-items:stretch}
.about .w > div:first-child{align-self:center}
.about h2{font-size:clamp(30px,3.6vw,46px);line-height:1.12;margin-bottom:24px}
.art{height:auto;min-height:460px}
.art img{position:absolute;inset:0}

/* Services list */
.pr{margin:10px 0 0!important}
.pr b{color:var(--acc);font-weight:700}
.serv-note{margin:36px 0 0;font-size:18px;color:var(--mist);max-width:none}
.serv-note a{color:var(--acc);text-decoration:underline;text-underline-offset:4px}

/* Pricing */
.price{background:linear-gradient(180deg,#E7E1F6,#DCD3F1)}
.price h2{font-size:clamp(30px,3.6vw,46px);margin-bottom:16px}
.price .lead{max-width:56ch;color:#4A4670;margin-bottom:44px}
.audit{display:flex;align-items:center;justify-content:space-between;gap:32px;background:#fff;border:1px solid rgba(91,63,160,.18);border-radius:20px;padding:28px 32px;margin-bottom:28px}
.audit h3{font-size:26px;margin-bottom:8px}
.audit p{margin:0;max-width:62ch;color:#4A4670}
.audit .btn{flex:none;white-space:nowrap}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.plan.reveal{display:flex;flex-direction:column;background:#fff;border-radius:20px;padding:36px 32px;box-shadow:0 18px 40px -26px rgba(38,32,106,.5);
  transform:translateY(48px) scale(.97);
  transition:opacity .7s ease-out,transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .35s;transition-delay:var(--d,0s)}
.plan.reveal.active{transform:none}
.plan.reveal.active:hover{transform:translateY(-8px);box-shadow:0 28px 50px -24px rgba(38,32,106,.6);transition-delay:0s}
.plan h3{font-size:30px;margin-bottom:8px}
.plan .for{font-size:15px;color:#5A5680;min-height:3em;margin-bottom:18px}
.plan .setup{font:600 44px/1 'Fraunces',serif;color:var(--acc2);margin:6px 0 6px;white-space:nowrap}
.plan .setup small{font:500 16px 'Manrope',sans-serif;color:#5A5680}
.plan .sub{font-weight:700;margin-bottom:24px}
.plan .pts{display:grid;gap:12px;padding-top:22px;margin-bottom:28px;border-top:1px solid rgba(20,22,43,.12);font-size:15px}
.plan .pts p{position:relative;margin:0;padding-left:28px}
.plan .pts p:before{content:"";position:absolute;left:0;top:.45em;width:14px;height:8px;border-left:2px solid var(--acc2);border-bottom:2px solid var(--acc2);transform:rotate(-45deg)}
.plan-cta{margin-top:auto;align-self:flex-start;font-weight:700;color:var(--acc2);border-bottom:2px solid var(--acc);padding-bottom:2px;transition:color .2s,border-color .2s}
.plan-cta:hover{color:var(--ink);border-color:var(--acc2)}
.plan.dark{background:var(--ink);color:#fff}
.plan.dark .for,.plan.dark .setup small{color:var(--mist)}
.plan.dark .setup{color:var(--acc)}
.plan.dark .pts{border-top-color:rgba(255,255,255,.18)}
.plan.dark .pts p:before{border-color:var(--acc)}
.plan.dark .plan-cta{color:var(--acc);border-color:var(--acc2)}
.plan.dark .plan-cta:hover{color:#fff;border-color:var(--acc)}
.price-note{margin:28px 0 0;font-size:15px;color:#4A4670;max-width:none}

/* FAQ */
.faq{background:#fff}
.faq .w{display:grid;grid-template-columns:.8fr 1.4fr;gap:72px;align-items:start}
.faq-intro{position:sticky;top:110px}
.faq-intro h2{font-size:clamp(30px,3.6vw,46px);margin-bottom:20px}
.faq-intro p{max-width:34ch;color:#4A4670}
.mail-sm{font:22px 'Fraunces',serif;color:var(--acc2);border-bottom:1px solid var(--acc)}
.faq-list{border-top:1px solid rgba(20,22,43,.14)}
.faq-item.reveal{transform:translateX(-24px);transition-delay:var(--d,0s);border-bottom:1px solid rgba(20,22,43,.14)}
.faq-item.reveal.active{transform:none}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;font:400 22px/1.25 'Fraunces',Georgia,serif;transition:color .2s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--acc2)}
.faq-item summary:after{content:"";flex:none;width:36px;height:36px;border-radius:50%;background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%2314162B' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .3s,background-color .3s}
.faq-item[open] summary:after{transform:rotate(45deg);background-color:var(--acc)}
.faq-item p{margin:0 0 26px;max-width:60ch;color:#3B3858;animation:faqIn .35s ease-out}
@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* Reduced motion fallback */
@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1!important;transform:none!important}
}

/* Media Queries */
@media(max-width:1000px){
  .hero-img{width:min(380px,44vw);margin-top:-190px}
  .plans{grid-template-columns:1fr}
  .plan .for{min-height:0}
}
@media(max-width:900px){
  .hero{min-height:auto;padding:120px 0 64px}
  .hero-img{width:70vw;right:-10%;top:12%;margin-top:0;opacity:.18}
  .hero .w h1{font-size:clamp(28px,8vw,40px)}
  .hero .w > p{font-size:17px}
  .art{min-height:0;height:340px}
  .serv h2{white-space:normal}
  .audit{flex-direction:column;align-items:flex-start}
  .faq .w{grid-template-columns:1fr;gap:36px}
  .faq-intro{position:static}
  .faq-item summary{font-size:19px}
  .floating-phone { bottom: 20px; right: 20px; width: 50px; height: 50px; } 
  .floating-phone svg { width: 22px; height: 22px; }
  .f-top{flex-direction:column;align-items:flex-start}
  .f-contact{flex-direction:column;gap:12px}
}
@media (max-width: 768px) {
  /* Zmniejszenie głównych nagłówków poza sekcją hero */
  h2 { font-size: 28px !important; line-height: 1.3 !important; }
  h3 { font-size: 22px !important; }

  /* Pionowy układ stopki z wyśrodkowaniem */
  footer .f-top, 
  footer .f-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 20px !important;
  }
  
  footer .f-links {
    flex-direction: column !important;
    gap: 12px !important;
  }
}