/* =========================================================
HERO CORE SYSTEM
wspólna baza dla wszystkich hero landing
========================================================= */

.section-hero{
width:100%;
position:relative;
margin:0;
padding:0 !important;
overflow:hidden;
}

.section-hero > .layout-container-hero,
.section-hero > .layout-container{
width:100%;
max-width:none;
margin:0;
padding:0 !important;
}

.section-hero .profile-banner{
position:relative;
width:100%;
margin:0;
}

.hero-wrapper{
position:relative;
width:100%;
overflow:hidden;
}

.hero-wrapper .profile-banner{
position:relative;
}

.hero-overlay{
position:absolute;
inset:0;
background:linear-gradient(
180deg,
rgba(0,0,0,.20) 0%,
rgba(0,0,0,.45) 100%
);
z-index:1;
}

.hero-content{
position:relative;
z-index:2;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-align:center;
padding:40px 20px;
}

.hero-title{
font-size:clamp(2rem,3.5vw,3rem);
font-weight:800;
line-height:1.05;
margin:0;
}

.hero-subtitle{
margin-top:18px;
font-size:clamp(1rem,1.3vw,1.25rem);
line-height:1.6;
max-width:720px;
opacity:.9;
}

.hero-actions{
margin-top:28px;
display:flex;
gap:14px;
flex-wrap:wrap;
justify-content:center;
}

/* =========================================================
GLOBAL HERO BUTTONS
========================================================= */

.hero-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:48px;
padding:12px 22px;
border-radius:999px;
border:1px solid rgba(255,255,255,.9);
background:transparent;
color:#fff !important;
text-decoration:none !important;
font-weight:600;
font-size:14px;
line-height:1;
cursor:pointer;
transition:
background .22s ease,
color .22s ease,
border-color .22s ease,
transform .22s ease,
box-shadow .22s ease,
opacity .22s ease;
}

.hero-btn:visited,
.hero-btn:focus,
.hero-btn:active{
color:#fff !important;
text-decoration:none !important;
}

.hero-btn:hover{
transform:translateY(-2px);
color:#fff !important;
text-decoration:none !important;
}

.hero-btn-primary{
background:#fff;
color:#111 !important;
border-color:#fff;
box-shadow:0 12px 28px rgba(0,0,0,.18);
}

.hero-btn-primary:visited,
.hero-btn-primary:focus,
.hero-btn-primary:active{
color:#111 !important;
}

.hero-btn-primary:hover{
background:#111;
color:#fff !important;
border-color:#111;
box-shadow:0 16px 34px rgba(0,0,0,.24);
}

.hero-btn-secondary{
background:rgba(255,255,255,.08);
color:#fff !important;
border-color:rgba(255,255,255,.7);
backdrop-filter:blur(4px);
}

.hero-btn-secondary:hover{
background:#fff;
color:#111 !important;
border-color:#fff;
box-shadow:0 16px 34px rgba(0,0,0,.20);
}

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

@media (max-width:1024px){
.hero-content{
padding:30px 16px;
}
}

@media (max-width:768px){
.hero-content{
padding:24px 12px;
}

.hero-actions{
flex-direction:column;
width:100%;
}

.hero-actions .hero-btn{
width:100%;
}
}