/* =========================================================
   NIELADA STUDIO — wspólny arkusz stylów
   Kolory i fonty marki zdefiniowane jako zmienne na górze —
   tu zmieniasz wygląd całej strony w jednym miejscu.
   ========================================================= */

:root{
  --orange: #FF4C2D;
  --orange-dark: #E03D1F;
  --black: #14120F;
  --white: #FFFFFF;
  --gray-50: #F7F6F4;
  --gray-100: #EFEDE9;
  --gray-300: #D8D5CE;
  --gray-500: #8C897F;
  --gray-700: #4A473F;
  --font: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
  --container: 1180px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font);
  color:var(--black);
  background:var(--white);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:var(--container);margin:0 auto;padding:0 32px;}
section{padding:110px 0;}
@media (max-width:768px){ section{padding:70px 0;} .wrap{padding:0 22px;} }
.section-tight{padding:77px 0;text-align:center;}
@media (max-width:768px){ .section-tight{padding:49px 0;} }

h1,h2,h3,h4{font-weight:800;letter-spacing:-0.01em;line-height:1.08;text-wrap:balance;}
h2{font-size:clamp(30px,4vw,46px);}
h3{font-size:20px;}
p{color:var(--gray-700);text-wrap:pretty;}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--orange);margin-bottom:16px;
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--orange);}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:15px 28px;border-radius:100px;
  font-weight:700;font-size:15px;
  border:2px solid transparent;
  transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--orange);color:var(--white);}
.btn-primary:hover{background:var(--orange-dark);}
.btn-dark{background:var(--black);color:var(--white);}
.btn-dark:hover{background:#000;}
.btn-outline{background:transparent;color:var(--black);border-color:var(--black);}
.btn-outline:hover{background:var(--black);color:var(--white);}

/* ---------- NAV ---------- */
nav.site-nav{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--gray-100);
}
nav.site-nav .wrap{
  display:flex;align-items:center;justify-content:space-between;height:76px;
}
.logo{font-size:20px;font-weight:800;letter-spacing:-0.02em;display:flex;align-items:center;}
.logo span{color:var(--orange);}
.logo img{height:28px;width:auto;display:block;}
footer .logo img{height:26px;}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{font-size:14.5px;font-weight:600;position:relative;}
.nav-links a:not(.btn):hover{color:var(--orange);}
.nav-toggle{display:none;background:none;border:none;font-size:26px;cursor:pointer;}
@media (max-width:900px){
  .nav-links{
    position:fixed;top:76px;left:0;right:0;bottom:0;
    background:var(--white);flex-direction:column;justify-content:flex-start;
    padding:40px 32px;gap:26px;transform:translateX(100%);
    transition:transform .25s ease;
  }
  .nav-links.open{transform:translateX(0);}
  .nav-toggle{display:block;}
}

/* ---------- HERO ---------- */
.hero{padding:90px 0 100px;}
.hero .wrap{display:grid;grid-template-columns:1.05fr 0.95fr;gap:56px;align-items:center;}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr;} }
.hero h1{font-size:clamp(40px,5.6vw,64px);margin-bottom:22px;}
.hero h1 em{font-style:normal;color:var(--orange);}
.hero p.lead{font-size:18px;max-width:480px;margin-bottom:34px;}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;}
.hero-visual{position:relative;}
.hero-visual .frame{
  aspect-ratio:4/5;background:var(--gray-100);border-radius:22px;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;color:var(--gray-500);font-weight:600;
  position:relative;overflow:hidden;
}
.hero-visual .frame img{
  width:100%;height:100%;object-fit:cover;object-position:center 20%;
}
.hero-visual .tag{
  position:absolute;bottom:-18px;left:-18px;
  background:var(--orange);color:var(--white);
  padding:16px 20px;border-radius:16px;font-weight:800;font-size:15px;
  box-shadow:0 12px 26px rgba(255,76,45,0.28);
}
@media (max-width:900px){ .hero-visual .tag{left:14px;} }

/* ---------- GATEWAY (strona główna) ---------- */
.gateway{min-height:82vh;display:flex;align-items:center;padding:60px 0;}
.gateway-lead{text-align:center;font-size:13px;font-weight:700;color:var(--gray-500);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:44px;}
.gateway-tiles{max-width:1040px;margin:0 auto;}
@media (max-width:768px){ .gateway{min-height:auto;padding:40px 0 60px;} }

/* ---------- TILES / OFERTA ---------- */
.tile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;margin-top:50px;}
.tile{
  display:block;background:var(--gray-50);border-radius:18px;
  padding:32px 28px;border:1px solid var(--gray-100);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  position:relative;
}
.tile:hover{transform:translateY(-6px);box-shadow:0 18px 34px rgba(20,18,15,0.09);border-color:var(--gray-300);}
.tile .num{
  display:inline-block;font-size:12px;font-weight:800;color:var(--white);
  background:var(--black);padding:5px 10px;border-radius:8px;margin-bottom:20px;
}
.tile h3{margin-bottom:10px;}
.tile p{font-size:14.5px;margin-bottom:20px;}
.tile .go{font-size:14px;font-weight:800;color:var(--orange);display:inline-flex;align-items:center;gap:6px;}
.tile:hover .go{gap:10px;}

/* ---------- GDZIE DZIAŁAMY ---------- */
.area-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:44px;}
.area-card{background:var(--gray-50);border:1px solid var(--gray-100);border-radius:18px;padding:28px 24px;}
.area-card h3{font-size:18px;margin-bottom:12px;}
.area-card p{font-size:14px;color:var(--gray-700);}
.photo-carousel-wrap{position:relative;margin-top:44px;}
.photo-carousel{
  display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px;
}
.photo-carousel::-webkit-scrollbar{display:none;}
.photo-card{flex:0 0 240px;scroll-snap-align:start;}
.photo-card img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:20px;background:var(--gray-100);display:block;}
.photo-card .caption{margin-top:10px;font-size:13px;font-weight:600;color:var(--gray-500);text-align:center;}
@media (max-width:768px){ .photo-card{flex-basis:200px;} }

/* ---------- PORTFOLIO CAROUSEL ---------- */
.portfolio-carousel-wrap{position:relative;margin-top:44px;}
.portfolio-carousel{
  display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px;
}
.portfolio-carousel::-webkit-scrollbar{display:none;}
.portfolio-card{flex:0 0 240px;scroll-snap-align:start;}
.portfolio-card video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:20px;background:var(--gray-100);display:block;}
.portfolio-card .caption{margin-top:10px;font-size:13px;font-weight:600;color:var(--gray-500);text-align:center;}
.carousel-arrow{
  position:absolute;top:44%;transform:translateY(-50%);
  width:46px;height:46px;border-radius:100px;background:var(--white);
  border:1px solid var(--gray-300);display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:0 10px 24px rgba(20,18,15,0.14);z-index:5;
  font-size:20px;color:var(--black);line-height:1;transition:background .15s ease,color .15s ease;
}
.carousel-arrow:hover{background:var(--orange);color:var(--white);border-color:var(--orange);}
.carousel-arrow.prev{left:-8px;}
.carousel-arrow.next{right:-8px;}
@media (max-width:768px){ .carousel-arrow{display:none;} .portfolio-card{flex-basis:200px;} }

/* ---------- OPINIE ---------- */
.review-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;margin-top:44px;}
.review-card{background:var(--gray-50);border:1px solid var(--gray-100);border-radius:18px;padding:30px 26px;}
.review-card .stars{color:var(--orange);font-size:15px;letter-spacing:3px;margin-bottom:16px;}
.review-card p{font-size:14.5px;color:var(--gray-700);font-style:italic;}
.review-card .source{margin-top:18px;font-size:12.5px;font-weight:700;color:var(--gray-500);text-transform:uppercase;letter-spacing:0.03em;}

/* ---------- PROCES (timeline) ---------- */
.timeline{margin-top:36px;display:flex;flex-direction:column;}
.tstep{
  display:grid;grid-template-columns:70px 1fr;gap:24px;
  padding:14px 0;border-top:1px solid var(--gray-100);
}
.tstep:last-child{border-bottom:1px solid var(--gray-100);}
.tstep .n{font-size:26px;font-weight:800;color:var(--orange);}
.tstep h3{margin-bottom:6px;}
.tstep p{font-size:14.5px;max-width:600px;}

/* ---------- PORTFOLIO ---------- */
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;margin:40px 0 6px;}
.filter-bar button{
  padding:9px 18px;border-radius:100px;border:1px solid var(--gray-300);
  background:transparent;font-weight:700;font-size:13.5px;cursor:pointer;
  transition:background .15s ease, color .15s ease;
}
.filter-bar button.active,.filter-bar button:hover{background:var(--black);color:var(--white);border-color:var(--black);}
.portfolio-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:34px;}
.pcard{border-radius:18px;overflow:hidden;border:1px solid var(--gray-100);background:var(--white);transition:transform .2s ease, box-shadow .2s ease;}
.pcard:hover{transform:translateY(-6px);box-shadow:0 18px 34px rgba(20,18,15,0.09);}
.pcard .thumb{aspect-ratio:4/3;background:var(--gray-100);display:flex;align-items:center;justify-content:center;color:var(--gray-500);font-size:13px;font-weight:600;}
.pcard .body{padding:20px 22px 24px;}
.pcard .cat{font-size:12px;font-weight:800;color:var(--orange);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:8px;}
.pcard h3{margin-bottom:6px;}
.pcard p{font-size:14px;}

/* ---------- O STUDIO ---------- */
.about-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:56px;align-items:center;}
@media (max-width:900px){ .about-grid{grid-template-columns:1fr;} }
.about-photo{aspect-ratio:4/5;background:var(--gray-100);border-radius:20px;display:flex;align-items:center;justify-content:center;color:var(--gray-500);font-size:13px;font-weight:600;overflow:hidden;}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center 15%;}
.stat-row{display:flex;gap:40px;margin-top:36px;flex-wrap:wrap;}
.stat b{display:block;font-size:32px;color:var(--orange);}
.stat span{font-size:13px;color:var(--gray-500);font-weight:600;}

/* ---------- KONTAKT ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;}
@media (max-width:900px){ .contact-grid{grid-template-columns:1fr;} }
.form-row{margin-bottom:18px;}
.form-row label{display:block;font-size:13px;font-weight:700;margin-bottom:7px;}
.form-row input,.form-row textarea{
  width:100%;padding:13px 16px;border-radius:10px;border:1px solid var(--gray-300);
  font-family:var(--font);font-size:14.5px;background:var(--gray-50);
}
.form-row input:focus,.form-row textarea:focus{outline:2px solid var(--orange);outline-offset:1px;}
.contact-photo{border-radius:20px;overflow:hidden;}
.contact-photo img{width:100%;height:100%;object-fit:cover;display:block;min-height:400px;}
.contact-info-card{background:var(--black);color:var(--white);border-radius:20px;padding:40px 34px;}
.contact-info-card .eyebrow{color:var(--orange);}
.contact-info-card a{display:flex;align-items:center;gap:10px;font-weight:700;margin-top:18px;font-size:15px;}
.social-row{display:flex;gap:12px;margin-top:30px;}
.social-row a{
  width:42px;height:42px;border-radius:100px;border:1px solid rgba(255,255,255,0.25);
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;
}
.social-row a:hover{background:var(--orange);border-color:var(--orange);}

/* ---------- FOOTER ---------- */
footer.site-footer{background:var(--black);color:var(--white);padding:64px 0 28px;}
.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:44px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,0.12);}
.footer-brand{max-width:300px;}
.footer-brand p{color:var(--gray-300);margin-top:16px;font-size:14px;}
.footer-block .eyebrow{color:var(--orange);margin-bottom:14px;}
.footer-block a{display:block;color:var(--white);font-weight:700;margin-top:4px;font-size:14.5px;}
.footer-block a:hover{color:var(--orange);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:22px;font-size:13px;color:var(--gray-300);}
footer.site-footer .social-row{margin-top:0;}
footer.site-footer .social-row a{display:flex;align-items:center;justify-content:center;margin-top:0;}

/* ---------- SUBPAGES (oferta / portfolio detail) ---------- */
.sub-hero{background:var(--gray-50);padding:70px 0 60px;}
.sub-hero .back{font-size:13.5px;font-weight:700;color:var(--gray-700);margin-bottom:22px;display:inline-flex;align-items:center;gap:6px;}
.sub-hero .back:hover{color:var(--orange);}
.sub-hero h1{font-size:clamp(32px,5vw,52px);max-width:760px;}
.sub-hero p.lead{font-size:17px;max-width:560px;margin-top:18px;}
.includes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:40px;}
.includes li{background:var(--gray-50);border:1px solid var(--gray-100);border-radius:14px;padding:20px 22px;font-weight:600;font-size:14.5px;display:flex;gap:10px;}
.includes li::before{content:"✓";color:var(--orange);font-weight:800;}
.cta-band{background:var(--black);border-radius:24px;padding:56px 48px;text-align:center;color:var(--white);}
.cta-band h2{color:var(--white);margin-bottom:16px;}
.cta-band p{color:var(--gray-300);margin-bottom:28px;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:40px;}
.gallery-grid .g{aspect-ratio:4/3;background:var(--gray-100);border-radius:16px;display:flex;align-items:center;justify-content:center;color:var(--gray-500);font-size:13px;font-weight:600;}
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:18px;margin-top:40px;}
.video-grid video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:16px;background:var(--gray-100);display:block;}
.video-caption{margin-top:10px;font-size:13px;font-weight:600;color:var(--gray-500);text-align:center;}
.image-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:40px;}
.image-gallery img{width:100%;height:auto;border-radius:16px;background:var(--gray-100);display:block;}
.image-gallery .caption{margin-top:10px;font-size:13px;font-weight:600;color:var(--gray-500);text-align:center;}
.info-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:20px;}
.info-cards .card{background:var(--white);border:1px solid var(--gray-100);border-radius:14px;padding:26px 24px;}
.info-cards .card .eyebrow{margin-bottom:12px;}
.info-cards .card p{font-size:14.5px;}
.faq-item{border-top:1px solid var(--gray-100);padding:22px 0;}
.faq-item:last-child{border-bottom:1px solid var(--gray-100);}
.faq-item h3{font-size:16px;margin-bottom:8px;}
.faq-item p{font-size:14.5px;}
.placeholder-box{margin-top:20px;padding:60px 30px;background:var(--gray-50);border:1px dashed var(--gray-300);border-radius:18px;text-align:center;}
.placeholder-box p{font-size:15px;color:var(--gray-500);}
select.form-select{width:100%;padding:13px 16px;border-radius:10px;border:1px solid var(--gray-300);font-family:var(--font);font-size:14.5px;background:var(--gray-50);}

/* ---------- CENNIK ---------- */
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-top:32px;}
.price-card{background:var(--white);border:1px solid var(--gray-100);border-radius:20px;padding:36px 32px;}
.price-card-premium{background:var(--black);color:var(--white);border-color:var(--black);}
.price-card-label{font-size:15px;font-weight:700;margin-bottom:8px;}
.price-card-amount{font-family:'Plus Jakarta Sans',sans-serif;font-size:32px;font-weight:800;margin-bottom:26px;}
.price-card-amount span{font-size:14px;font-weight:600;opacity:0.65;margin-left:4px;}
.price-features{display:flex;flex-direction:column;gap:13px;}
.price-features li{font-size:14px;padding-left:24px;position:relative;color:var(--gray-700);}
.price-card-premium .price-features li{color:var(--gray-300);}
.price-features li::before{content:"✓";position:absolute;left:0;font-weight:800;color:var(--orange);}
.price-note{margin-top:22px;font-size:13px;color:var(--gray-500);}
.price-card-wide{
  margin-top:24px;background:var(--gray-50);border:1px solid var(--gray-100);border-radius:20px;
  padding:28px 32px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
}
.price-card-wide h3{font-size:17px;margin-bottom:6px;}
.price-card-wide p{font-size:14px;margin:0;}
.price-card-wide .amount{font-size:22px;font-weight:800;white-space:nowrap;}
.price-card-wide .amount span{font-size:13px;font-weight:600;color:var(--gray-500);margin-left:2px;}
.price-list{margin-top:30px;max-width:600px;}
.price-list-item{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:16px 0;border-bottom:1px solid var(--gray-100);}
.price-list-item span{font-weight:600;font-size:15px;}
.price-list-item strong{color:var(--orange);font-weight:800;white-space:nowrap;font-size:15px;}