/* =========================================================
LANDING CORE
wspólny layout i struktura dla wszystkich templatek
========================================================= */

:root{
--landing-page-bg:#ffffff;
--landing-text:#111111;
--landing-muted:#5f5f5f;
--landing-heading:#111111;
--landing-accent:#111111;

--landing-container-max:1380px;
--landing-content-narrow:900px;
--landing-content-medium:1040px;
--landing-content-wide:1240px;

--landing-section-space-top:34px;
--landing-section-space-bottom:46px;
--landing-section-space-gap:0px;

--landing-shell-bg:transparent;
--landing-shell-border:transparent;
--landing-shell-radius:0px;
--landing-shell-shadow:none;
--landing-shell-padding:0px;

--landing-surface-bg:transparent;
--landing-surface-border:#dddddd;
--landing-surface-radius:16px;
--landing-surface-shadow:none;

--landing-card-bg:transparent;
--landing-card-border:transparent;
--landing-card-radius:14px;
--landing-card-shadow:none;

--landing-btn-bg:transparent;
--landing-btn-color:var(--landing-heading);
--landing-btn-border:var(--landing-heading);
--landing-btn-radius:999px;
--landing-btn-hover-bg:var(--landing-heading);
--landing-btn-hover-color:#ffffff;

--landing-input-bg:rgba(255,255,255,.82);
--landing-input-border:#d8d8d8;
--landing-input-radius:12px;

--landing-faq-border:#d8d8d8;
--landing-faq-open-border:#111111;

--landing-social-border:#d8d8d8;
--landing-social-bg:transparent;
--landing-social-hover-bg:#111111;

--landing-gallery-radius:8px;
--landing-gallery-gap:20px;
}

/* =========================================================
RESET / BASE
========================================================= */

html,
body{
margin:0;
padding:0;
width:100%;
overflow-x:hidden;
}

*,
*::before,
*::after{
box-sizing:border-box;
}

.landing-page{
width:100%;
overflow-x:hidden;
background:var(--landing-page-bg);
color:var(--landing-text);
}

.landing-page,
.landing-page input,
.landing-page textarea,
.landing-page button{
font-family:Inter,system-ui,sans-serif;
}

.landing-main{
display:block;
width:100%;
overflow-x:hidden;
}

/* =========================================================
SECTIONS
========================================================= */

.landing-page .section{
margin:0;
padding-left:0;
padding-right:0;
width:100%;
}

.landing-page .section:not(.section-hero){
padding-top:var(--landing-section-space-top);
padding-bottom:var(--landing-section-space-bottom);
}

.landing-page .section + .section:not(.section-hero){
margin-top:var(--landing-section-space-gap);
}

/* normal sections only */
.landing-page .section > .layout-container,
.landing-page .landing-footer .layout-container{
max-width:var(--landing-container-max);
margin:0 auto;
padding-left:30px;
padding-right:30px;
box-sizing:border-box;
}

/* hero must be edge-to-edge */
.landing-page .section-hero > .layout-container,
.landing-page .section-hero > .layout-container-hero{
max-width:none;
width:100%;
margin:0;
padding:0 !important;
}

.landing-page .section:not(.section-hero) > .layout-container{
background:var(--landing-shell-bg);
border:1px solid var(--landing-shell-border);
border-radius:var(--landing-shell-radius);
box-shadow:var(--landing-shell-shadow);
padding-top:var(--landing-shell-padding);
padding-bottom:var(--landing-shell-padding);
}

.landing-page h1,
.landing-page h2,
.landing-page h3{
margin-top:0;
color:var(--landing-heading);
}

.landing-page h2{
text-align:center;
font-size:clamp(1.7rem,2.6vw,2.5rem);
font-weight:700;
letter-spacing:-0.02em;
margin-bottom:36px;
}

.landing-section-shell,
.ui-box,
.landing-contact-form{
width:100%;
box-sizing:border-box;
background:var(--landing-surface-bg);
border-radius:var(--landing-surface-radius);
box-shadow:var(--landing-surface-shadow);
}

.landing-section-shell--narrow,
.ui-box,
.landing-contact-form,
.landing-faq{
max-width:var(--landing-content-narrow);
margin-left:auto;
margin-right:auto;
}

.landing-section-shell--medium,
.landing-pricing-grid{
max-width:var(--landing-content-medium);
margin-left:auto;
margin-right:auto;
}

.landing-pricing-desc{
white-space:normal;
line-height:1.7;
}

.landing-pricing-desc br{
display:block;
content:"";
}

.landing-section-shell--wide,
.landing-services-grid,
#upg-gallery{
max-width:var(--landing-content-wide);
margin-left:auto;
margin-right:auto;
}

.ui-box{
padding:28px 30px;
text-align:center;
line-height:1.9;
}

.ui-box p{
margin:0;
}

/* =========================================================
GALLERY
========================================================= */

#upg-gallery .photo-link{
display:block;
cursor:zoom-in;
}

#upg-gallery .upg-box,
#upg-gallery .upg-photo,
#upg-gallery .upg-hover{
cursor:zoom-in;
}

#upg-gallery .upg-hover{
pointer-events:none;
}

#upg-gallery{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:var(--landing-gallery-gap);
}

#upg-gallery .upg-box{
position:relative;
overflow:hidden;
border-radius:var(--landing-gallery-radius);
background:#000;
isolation:isolate;
}

#upg-gallery .upg-photo{
width:100%;
height:auto;
display:block;
border-radius:inherit;
backface-visibility:hidden;
transform:scale(1);
transform-origin:center center;
transition:transform .22s ease;
}

#upg-gallery .photo-link{
line-height:0;
border-radius:inherit;
overflow:hidden;
outline:none;
}

#upg-gallery .photo-link:focus-visible{
outline:2px solid currentColor;
outline-offset:4px;
}

.landing-page #upg-gallery .upg-box::after{
content:none;
display:none;
}

.landing-page #upg-gallery .upg-box:hover,
.landing-page #upg-gallery .upg-box:focus-within{
border:0;
outline:0;
box-shadow:none;
transform:none;
filter:none;
}

.landing-page #upg-gallery .upg-box:hover .upg-photo,
.landing-page #upg-gallery .upg-box:focus-within .upg-photo{
filter:none;
opacity:1;
}

@media (hover:hover) and (pointer:fine){
.landing-page #upg-gallery .upg-box:hover .upg-photo,
.landing-page #upg-gallery .photo-link:hover .upg-photo{
transform:scale(1.035);
}
}

.landing-page #upg-gallery .photo-link:focus-visible .upg-photo{
transform:scale(1.035);
}

#upg-gallery .upg-hover{
position:absolute;
inset:0;
display:none;
align-items:flex-end;
justify-content:center;
background:transparent;
}

#upg-gallery .upg-title{
color:#fff;
font-size:14px;
padding:12px;
text-align:center;
}

.landing-page #upg-gallery.landing-gallery--cols-3{
grid-template-columns:repeat(3,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--cols-4{
grid-template-columns:repeat(4,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--cols-5{
grid-template-columns:repeat(5,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--cols-6{
grid-template-columns:repeat(6,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--spacing-small{
gap:12px;
}

.landing-page #upg-gallery.landing-gallery--spacing-medium{
gap:var(--landing-gallery-gap);
}

.landing-page #upg-gallery.landing-gallery--spacing-large{
gap:30px;
}

.landing-page #upg-gallery.landing-gallery--corners-straight .upg-box{
border-radius:0;
}

.landing-page #upg-gallery.landing-gallery--corners-rounded .upg-box{
border-radius:var(--landing-card-radius);
}

.landing-page #upg-gallery.landing-gallery--shape-square .upg-box{
aspect-ratio:1 / 1;
}

.landing-page #upg-gallery.landing-gallery--shape-square .upg-photo,
.landing-page #upg-gallery.landing-gallery--shape-square .portfolio-adult-placeholder-image{
width:100%;
height:100%;
object-fit:cover;
}

.landing-page #upg-gallery .upg-cell[hidden]{
display:none;
}

.landing-gallery-more{
display:flex;
justify-content:center;
margin-top:24px;
}

.landing-gallery-show-more{
appearance:none;
border:1px solid var(--landing-btn-border);
border-radius:var(--landing-btn-radius);
background:var(--landing-btn-bg);
color:var(--landing-btn-color);
padding:10px 18px;
font:inherit;
font-weight:700;
cursor:pointer;
transition:background .2s ease,color .2s ease,border-color .2s ease;
}

.landing-gallery-show-more:hover,
.landing-gallery-show-more:focus-visible{
background:var(--landing-btn-hover-bg);
color:var(--landing-btn-hover-color);
}

@media (max-width:1024px){
.landing-page #upg-gallery.landing-gallery--cols-3{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--cols-4,
.landing-page #upg-gallery.landing-gallery--cols-5{
grid-template-columns:repeat(3,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--cols-6{
grid-template-columns:repeat(4,minmax(0,1fr));
}
}

@media (max-width:640px){
.landing-page #upg-gallery.landing-gallery--cols-3{
grid-template-columns:1fr;
}

.landing-page #upg-gallery.landing-gallery--cols-4,
.landing-page #upg-gallery.landing-gallery--cols-5,
.landing-page #upg-gallery.landing-gallery--cols-6{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.landing-page #upg-gallery.landing-gallery--spacing-large{
gap:18px;
}
}

/* =========================================================
SERVICES
========================================================= */

.landing-services-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:28px;
align-items:start;
}

.landing-service-card{
display:flex;
flex-direction:column;
align-items:flex-start;
text-align:left;
gap:0;
text-decoration:none;
color:inherit;
}

.landing-service-photo{
width:100%;
aspect-ratio:4 / 3;
overflow:hidden;
position:relative;
border-radius:var(--landing-card-radius);
background:#f1f1f1;
}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width:900px){
#upg-gallery{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}

@media (max-width:600px){
#upg-gallery{
grid-template-columns:1fr;
}

.landing-page .section > .layout-container,
.landing-page .landing-footer .layout-container{
padding-left:16px;
padding-right:16px;
}
}