/* ============ ZMIENNE / RESET ============ */
:root{
  --bg:#fdfdfc;
  --ink:#1f1f2e;
  --gold:#d7bba8;
  --stone:#f5f1ee;
  --white:#ffffff;
  --muted:#6f6f75;
  --shadow:0 12px 32px rgba(0,0,0,.08);
  --radius:16px;
  --serif:'Playfair Display',serif;
  --sans:'Inter',sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:#111;line-height:1.75}

/* ============ TYPO / GLOBAL ============ */
h1,h2,h3{font-family:var(--serif);color:var(--ink)}
h1{font-size:3.2rem;margin:.5rem 0 1rem}
h2{font-size:2.4rem;margin-bottom:2rem;text-align:center}
h3{font-size:1.4rem;margin:.75rem 0 .5rem}
p{font-size:1.08rem;margin-bottom:1rem}
.muted{color:var(--muted)}
.container{max-width:1200px;margin:0 auto;padding:2rem}
section{padding:90px 0}
.highlight{color:var(--gold)}

/* buttons */
.btn{display:inline-block;padding:1rem 2.2rem;border-radius:40px;font-weight:600;
  text-transform:uppercase;font-size:.95rem;transition:.3s ease;cursor:pointer}
.btn.primary{background:var(--ink);color:var(--white)}
.btn.primary:hover{background:var(--gold);color:var(--ink)}
.btn.ghost{border:2px solid var(--ink);color:var(--ink);background:transparent}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.mini{padding:.5rem 1.1rem;border-radius:999px;border:2px solid #1f1f2e;background:transparent}
.btn.mini:hover{background:#1f1f2e;color:#fff}

/* glass util */
.glass{background:rgba(255,255,255,.65);backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.45);border-radius:var(--radius);box-shadow:var(--shadow)}

/* fade-in on scroll */
.section-fade{opacity:0;transform:translateY(40px);transition:all .8s cubic-bezier(.2,.65,.3,1)}
.section-fade.visible{opacity:1;transform:none}

/* ============ NAVBAR (sticky po scrollu) ============ */
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  transform:translateY(-110%); transition:transform .5s ease, background .3s ease, box-shadow .3s ease;
  background:rgba(255,255,255,.6); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(255,255,255,.4);
}
.topbar.visible{ transform:translateY(0); box-shadow: 0 10px 24px rgba(0,0,0,.06); }
.topbar-inner{ max-width:1200px; margin:0 auto; padding:.6rem 2rem; display:flex; align-items:center; justify-content:space-between; }
.brand-logo{ height:44px; display:block; }
.nav-links{ list-style:none; display:flex; gap:1.25rem; align-items:center; }
.nav-links a{ color:#1f1f2e; font-weight:600; }

/* ============ HERO ============ */
.hero{position:relative;min-height:100vh;background-size:cover;background-position:center;
  display:flex;align-items:center;justify-content:center;text-align:center}
.hero .overlay{position:absolute;inset:0;background:rgba(255,255,255,.7)}
.hero-content{position:relative;z-index:1;max-width:920px}
.logo-hero{width:170px;margin:0 auto 2rem auto;display:block}
.hero p{font-size:1.2rem;margin:.25rem auto 2rem;max-width:760px}
.hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* ============ WHY US ============ */
.why-grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.why-card{padding:2rem;border-radius:var(--radius);background:var(--stone);box-shadow:var(--shadow);text-align:center}
.why-icon{width:56px;height:56px;border-radius:50%;background:var(--white);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;box-shadow:0 8px 20px rgba(0,0,0,.05)}
.why-icon svg{width:28px;height:28px;fill:var(--ink)}

/* ============ FOR-WHO (odświeżone: tło + glass) ============ */
.for-who{ position:relative; padding:0; }
.for-who-bg{
  position:absolute; inset:0;
  background-position:center; background-size:cover;
  filter:saturate(.9) contrast(.95);
}
.for-who::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(1100px 380px at 50% -180px, rgba(255,255,255,.9) 0%, rgba(255,255,255,.6) 45%, rgba(255,255,255,.25) 70%, rgba(255,255,255,.15) 100%),
    linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.85));
}
.for-who-inner{ position:relative; z-index:1; min-height:80vh; display:flex; align-items:center; }
.for-card{ width:100%; max-width:1100px; margin:0 auto; padding:2rem 2.5rem; }
.for-head{ text-align:center; max-width:900px; margin:0 auto 1.5rem; }
.eyebrow{ letter-spacing:.12em; text-transform:uppercase; color:#8c7e73; font-weight:600; margin-bottom:.25rem; }
.lede{ color:#6f6f75; max-width:820px; margin:.5rem auto 0; }
.for-grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:3rem; align-items:start; margin-top:1.5rem; }
@media (max-width: 900px){ .for-grid{ grid-template-columns:1fr; } }

.for-list{ list-style:none; display:grid; gap:1.05rem; }
.for-list li{ font-size:1.12rem; padding-left:34px; position:relative; }
.for-list li::before{
  content:""; width:12px; height:12px; border-radius:50%;
  background:#d7bba8; position:absolute; left:8px; top:.6rem;
  box-shadow: 0 6px 12px rgba(215,187,168,.6);
}
.for-copy .for-bridge{ color:#444; margin-bottom:.75rem; }
.for-copy .for-note{ color:#6f6f75; margin-bottom:1rem; }

/* ============ SERVICES ============ */
.service-grid{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.service-card{display:flex;flex-direction:column;gap:1rem;border-radius:var(--radius);overflow:hidden;background:var(--white);box-shadow:var(--shadow);transition:transform .3s ease}
.service-card:hover{transform:translateY(-6px)}
.service-media img{width:100%;height:280px;object-fit:cover}
.service-body{padding:1.25rem 1.5rem}
.service-body p{margin-bottom:.5rem}

/* ============ PROCESS ============ */
.process{position:relative;background-size:cover;background-position:center}
.process .overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(255,255,255,.85),rgba(255,255,255,.65))}
.process-inner{position:relative;z-index:1;max-width:900px;margin:0 auto;padding:2rem}

/* ============ METAMORFOZY (carousel) ============ */
.makeovers{ background:#fff; }
.carousel{ position:relative; max-width:1000px; margin: 0 auto; }
.car-viewport{ overflow:hidden; border-radius:16px; box-shadow: 0 12px 32px rgba(0,0,0,.08); }
.car-track{ display:flex; transition: transform .5s ease; }
.car-item{ min-width:100%; position:relative; background:#000; }
.car-item img{ width:100%; height:520px; object-fit:cover; display:block; }
.car-item figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:1rem 1.25rem;
  color:#fff; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.45) 100%);
  font-size:.98rem;
}
.car-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border:none; border-radius:50%;
  background:rgba(255,255,255,.8); backdrop-filter: blur(8px);
  display:grid; place-items:center; font-size:1.6rem; color:#1f1f2e; cursor:pointer;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
}
.car-nav:hover{ background:#fff; }
.car-nav.prev{ left:-12px; }
.car-nav.next{ right:-12px; }
.makeovers-note{ text-align:center; color:#6f6f75; margin-top:1rem; }

@media (max-width: 768px){
  .car-item img{ height:340px; }
  .car-nav{ width:38px; height:38px; font-size:1.3rem; }
}

/* ============ TESTIMONIALS ============ */
.testimonials{background-size:cover;background-position:center;background-attachment:fixed}
.testimonial-slider{max-width:820px;margin:0 auto}
.testimonial{display:none;font-style:italic;background:rgba(255,255,255,.92);padding:2rem;border-radius:var(--radius);box-shadow:var(--shadow)}
.testimonial.active{display:block}

/* ============ FAQ ============ */
.faq .accordion{max-width:900px;margin:0 auto}
.faq details{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:1rem 1.25rem;margin-bottom:1rem}
.faq summary{cursor:pointer;list-style:none;font-weight:600}
.faq summary::-webkit-details-marker{display:none}
.faq details[open]{background:var(--stone)}
.faq details p{margin-top:.75rem;color:#333}

/* ============ CONTACT (glass + image) ============ */
.contact-flex{display:flex;gap:2rem;align-items:stretch;justify-content:center;flex-wrap:wrap}
.contact-form-wrapper{flex:1;min-width:320px;padding:2rem}
.contact-image{flex:1;min-width:300px}
.contact-image img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}
.contact form{display:flex;flex-direction:column;gap:1rem}
.contact input,.contact textarea{padding:1rem;border:1px solid #dcdcdc;border-radius:12px;font-family:var(--sans);font-size:1rem}
.consent{font-size:.92rem;color:#333}

/* ============ FINAL CTA / FOOTER ============ */
.final-cta{background:var(--stone)}
.final-cta-inner{text-align:center;max-width:900px;margin:0 auto}
.final-cta-inner p{color:var(--muted);margin-bottom:1.25rem}
.footer{background:var(--ink);color:#fff;text-align:center;padding:2rem}

/* ============ RESPONSYWNOŚĆ ============ */
@media (max-width:960px){ h1{font-size:2.4rem} }
@media (max-width:768px){
  section{padding:70px 0}
  h2{font-size:2rem}
  .hero p{font-size:1.05rem}
  .service-media img{height:220px}
  .btn{width:100%;text-align:center}
}