:root {
    --primary: rgba(18, 41, 69, 1);
    --primary-muted: rgba(18, 41, 69, .5);
    --secondary: rgba(255, 255, 255, 1);
    --tertiary: rgba(95, 120, 163, 1);
    --btn-before-bg: rgba(236, 242, 247, 1);
    --bg-light: rgba(255, 255, 255, 1);
    --bg-dark: rgba(18, 41, 69, 1);

    --radius: 18px !important;

    --fill: rgba(255,255,255,0.03); /* półprzezroczyste wypełnienie */
    --blur: 8px;                    /* siła szkła */
}

#menu {
    border: 1px solid rgba(18, 41, 69, 0.01);
    min-height: 100px;
    background-color: var(--bg-light);
    box-shadow: 10px 10px 50px 3px rgba(39, 92, 141, 0.1);
}

body {
    background: var(--bg-light);
    font-family: 'Montserrat', sans-serif;
    scroll-behavior: smooth;
    scroll-padding-top: 180px;
}

section {
    padding: 100px 20px;
    scroll-margin-top: 100px;
}

section#menu {
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 0;
}

section#footer {
    padding-bottom: 20px;
    margin-bottom: 0;
}

section#partnership {
    padding-left: 0;
    padding-right: 0;
}
section#partnership .row {
    margin: 0;
}

.menu-container, .social-container {
    display: flex;
    align-items: center;
}

.menu-container {
    justify-content: end;
}

ul.menu-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}

ul.menu-list li{
    display: inline-block;
    margin-left: 15px;
    padding: 10px 20px;
    position: relative;
}

ul.menu-list li.menu-item::before {
    content: "";
    display: inline-block;
    position: absolute;
    border-bottom: 2px solid rgba(18, 41, 69, 0.2);
    bottom: 0;
    width: 0;
    transition-duration: .5s;
}

ul.menu-list .menu-social-item {
    margin-left: 0;
    background-color: var(--primary);
    height: 44px;
    border-radius: 5px;
    line-height: 10px;

}

.menu-social-item i {
    font-size: 25px;
    color: var(--secondary);

}

ul.menu-list li.menu-item:hover::before {
    width: 100%;
}

li.free-consult {
    background-color: var(--primary);
    color: var(--secondary);
    border-radius: 5px;
    cursor: pointer;
}


section#profits, section#faq, section#footer {
    background: var(--bg-dark);
    color: var(--secondary);
}

span.subtitle {
    position: relative;
    color: var(--tertiary);
    font-size: 16px;
    text-transform: uppercase;
}

span.subtitle::after {
    content: '';
    display: inline-block;
    top: 8px;
    position: absolute;
    border-top: 1px solid var(--tertiary);
    width: 60px;
    height: 1px;
    margin-left: 10px;
}

h1, h2, h3, h4, h5, h6, span.subtitle {
    font-family: 'Inter', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    margin-bottom: 50px;
}

h1 {
    font-size: 3.5rem;
}

.btn-rej {
    background-color: var(--primary);
    color: var(--secondary);
    padding: 8px 15px;
    position: relative;
    display: inline-block;
    border-radius: 10px;
    cursor: pointer;
}

.btn-rej::before {
    content: '';
    display: inline-block;
    position: absolute;
    top: -10px;
    left: -20px;
    background-color: var(--btn-before-bg);
    width: 100px;
    height: 60px;
    z-index: -2;
    transition-duration: 0.5s;
    transition-timing-function: ease;
    border-radius: 10px;
}

.btn-rej:hover::before {
    position: absolute;
    left: 60px;
}

a {
    color: unset;
    text-decoration: none;
}

section#challenges .row {
    margin-top: 20px;
}

.challenge-card {
    background: #fff;
    border-radius: 18px;
    padding: 45px 45px 45px 45px;
    box-shadow: 10px 10px 50px 3px rgba(39, 92, 141, 0.1);
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    margin: 40px auto;
    max-width: 75%;
}

.challenge-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.challenge-card h3 {
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 2rem;
    color: #111;
}

.challenge-card p {
    font-size: 1.25rem;
    line-height: 1.6;
    color: #333;
    margin: 0;
}


.glass-chip{
    position: relative;
    border-radius: var(--radius);
    padding: 10px 20px;
    color:#fff;
    line-height: 1.25;
    background:
        /* miękki highlight w prawym górnym rogu */
            radial-gradient(80% 120% at 92% 15%, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 55%)

    backdrop-filter: blur(var(--blur));
    -webkit-backdrop-filter: blur(var(--blur));
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.20),     /* górna poświata wewnątrz */
            inset 0 -1px 0 rgba(0,0,0,.25),          /* dolne przyciemnienie */
            0 10px 24px rgba(0,0,0,.35);             /* cień na zewnątrz */
    overflow: hidden;
    margin-top: 10px;
    min-height: 60px;
}

/* Gradientowy obrys (tylko ramka) */
.glass-chip::before{
    content:"";
    position:absolute; inset:0;
    border-radius: inherit;
    padding: 1px; /* grubość ramki */
    background:
            linear-gradient(145deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%);
    -webkit-mask:
            linear-gradient(#000 0 0) content-box,
            linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events:none;
}


.glass-chip h6{
    margin:0 0 4px 0;
    font-weight: 700;
    font-size: 1.05rem;        /* ~16.8px; zwiększ do 1.125rem jeśli chcesz większy tytuł */
    letter-spacing: 0.1px;
}
.glass-chip p{
    margin:0;
    font-weight: 400;
    font-size: 1rem;           /* ~16px */
    color: rgba(255,255,255,.90);
}

/* responsywny „oddech” (opcjonalnie) */
@media (min-width: 992px){
    :root{ --pad-y: 16px; --pad-x: 24px; }
}



.glass-accordion .accordion-item{
    background: transparent;
    border: 0;
    margin-bottom: 28px;
}

/* RESET bootstrapowego przycisku nagłówka */
.glass-accordion .accordion-button{
    background: transparent;
    color: #fff;
    min-height: 30px;
}

/* Nagłówek = „szklana karta” jak u Ciebie */
.glass-chip-btn{
    position: relative;
    width: 100%;
    text-align: left;
    border: 0;
    border-radius: var(--radius) !important;
    padding: 20px 10px;
    color:#fff;
    line-height:1.25;
    background: radial-gradient(80% 120% at 92% 15%, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 55%);
    backdrop-filter: blur(var(--blur));
    -webkit-backdrop-filter: blur(var(--blur));
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.20),
            inset 0 -1px 0 rgba(0,0,0,.25),
            0 10px 24px rgba(0,0,0,.35);
    overflow: hidden;
}

/* Gradientowy obrys wokół nagłówka */
.glass-chip-btn::before{
    content:"";
    position:absolute; inset:0;
    border-radius: inherit;
    padding: 1px; /* grubość ramki */
    background:
            linear-gradient(145deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%);
    -webkit-mask:
            linear-gradient(#000 0 0) content-box,
            linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events:none;
}

/* Treść odpowiedzi = osobna „szklana karta” */
.glass-answer{
    position: relative;
    margin-top: 10px;
    border-radius: var(--radius);
    padding: 20px 10px;
    color:#fff;
    background: radial-gradient(80% 120% at 92% 15%, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 55%);
    backdrop-filter: blur(var(--blur));
    -webkit-backdrop-filter: blur(var(--blur));
    box-shadow:
            inset 0 1px 0 rgba(255,255,255,.20),
            inset 0 -1px 0 rgba(0,0,0,.25),
            0 10px 24px rgba(0,0,0,.35);
    overflow: hidden;
}
.glass-answer::before{
    content:"";
    position:absolute; inset:0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(145deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 35%, rgba(255,255,255,0) 65%, rgba(255,255,255,0) 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events:none;
}

/* Typografia w nagłówku */
.glass-accordion .accordion-button .h6,
.glass-accordion .accordion-button{
    font-weight:700;
    font-size:1.05rem;
    letter-spacing:.1px;
}

/* Biała strzałka jak na screenie */
.glass-accordion .accordion-button::after{
    width: 1rem; height: 1rem;
    background-size: 1rem 1rem;
    filter: none;
    transition: transform .2s ease, opacity .2s ease;
    /* pełny biały trójkąt ▲ (SVG) */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpolygon points='8,4 14,12 2,12' fill='white'/%3e%3c/svg%3e");
    transform: rotate(180deg); /* domyślnie w dół gdy zamknięte */
    opacity:.9;
}
.glass-accordion .accordion-button:not(.collapsed)::after{
    transform: rotate(0deg); /* w górę gdy otwarte */
    opacity:1;
}

/* Treść w środku */
.glass-accordion .accordion-body{
    color: rgba(255,255,255,.90);
    font-size: 1rem;
    line-height: 1.6;
}

.glass-accordion .accordion-body ol{ padding-left: 1.25rem; }

.accordion-item:first-of-type > .accordion-header .accordion-button {
    border-top-left-radius: var(--radius);
    border-top-right-radius: var(--radius);
}


/* karta */
.pricing-card{
    background:#fff;
    border-radius:16px;
    padding:18px;
    box-shadow: 0 20px 40px rgba(16,24,40,.08);
    border:1px solid rgba(2,6,23,.04);
    margin-top: 50px;
    position: relative;
}

.recommended-badge {
    background-color: var(--primary-muted);
    color: var(--secondary);
    position: absolute;
    top: 0;
    margin: 0;
    right: 0;
    border-radius: 0 16px 0 0;
    padding: 8px;
}

/* nagłówek */
.pc-title{ margin:30px 0 0 0; font-weight:700; font-size:1.75rem; color:#111827; }
.pc-sub{ color:#6b7280; font-size:.9rem; margin-top:2px; }

/* cena */
.pc-price{ margin:50px 0 10px; }
.pc-amount{ font-weight:700; font-size:1.75rem; color:#0f172a; }
.pc-meta{ color:#6b7280; font-size:1.2rem; }

/* lista z checkami */
.pc-list li{ display:flex; gap:.5rem; align-items:flex-start; margin-bottom:.45rem; color:#111827; }
.pc-list .check{
    width:18px; height:18px; margin-top:2px; flex:0 0 18px;
    border-radius:50%; background: #ffffff; position:relative;
}
.pc-list .check::after{
    content: url('../assets/check.svg');
    color: white;
}

.btn-schedule-meeting {
    margin: 30px auto;
}

/* dolny przycisk z ikoną play */
.btn-video{
    background:#edf1f5; color:#0f172a; border:none;
    border-radius:10px; padding:.55rem .9rem; font-weight:600;
    display:flex; align-items:center; justify-content:center; gap:.5rem;
}
.btn-video:hover{ background:#e6ebf0; color:#0f172a; }
.btn-video .play{
    width:26px; height:26px; border-radius:50%;
    background:#ffffff; box-shadow:0 1px 2px rgba(0,0,0,.08) inset;
    position:relative; flex:0 0 26px;
}
.btn-video .play::after{
    content:""; position:absolute; top:50%; left:50%;
    transform: translate(-42%,-50%);
    border-left:8px solid #6b7280; border-top:6px solid transparent; border-bottom:6px solid transparent;
}

/* modal ciemny borderless – opcjonalnie */
#videoModal .modal-content{ border-radius:12px; }


.carousel-item {
    width: unset !important;
}

.footer-social {
    margin-top:15px;
}
.footer-social i {
    font-size: 2rem;
}

.footer-copy {
    color: var(--tertiary);
}


/* Pasek mobilny */
#menu-mobile{
    background-color: var(--bg-light);
    border: 1px solid rgba(18,41,69,0.01);
    box-shadow: 10px 10px 50px 3px rgba(39,92,141,0.1);
    padding: 12px 0;             /* nie dziedzicz z ogólnego section */
}
section#menu-mobile{ padding-top:12px; padding-bottom:12px; }

#menu-mobile .mobile-logo{ height: 34px; }
#menu-mobile .mobile-logo.small{ height: 26px; }

#menu-mobile .mobile-toggler{
    border: none;
    padding: 6px 10px;
    line-height: 1;
}
#menu-mobile .mobile-toggler i{
    font-size: 30px;
    color: var(--primary);
}

/* Offcanvas – kolory jak header */
#mobileNav{
    background-color: var(--bg-light);
    color: #0b1d33;
}
#mobileNav .offcanvas-header{ border-bottom: 1px solid rgba(18,41,69,0.06); }

#mobileNav .nav-link{
    padding: .9rem 0;
    font-weight: 600;
    color: #0b1d33;
    border-bottom: 1px solid rgba(18,41,69,0.06);
}
#mobileNav .nav-link:hover{ color: var(--primary); }

/* Ikony social jak w desktopie */
#mobileNav .mobile-social .social{
    display: inline-flex; align-items:center; justify-content:center;
    width: 44px; height: 44px; border-radius: 5px;
    background: var(--primary); color: var(--secondary);
    text-decoration: none;
}

.form-row {
    margin-bottom: 20px;

}

.rej-input {
    box-shadow: 10px 10px 50px 3px rgba(39, 92, 141, 0.1);
    border: 0;
    min-height: 60px;
}