/*
Theme Name: Green Monkey Barber Shop
Author: Piotr Okonek
Description: Demonstracyjny motyw one-page dla Green Monkey Barber Shop.
Version: 1.0.0
Text Domain: green-monkey
*/
:root{--ink:#101713;--pine:#123b2b;--green:#a8e52b;--cream:#f5f2e8;--paper:#e9e4d6;--orange:#f49a3f;--line:rgba(245,242,232,.18);--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55}.shell{width:min(1180px,calc(100% - 48px));margin:auto}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{position:absolute;top:0;left:0;width:100%;z-index:5;color:#fff;border-bottom:1px solid rgba(255,255,255,.13)}.header-inner{min-height:88px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none;letter-spacing:.02em}.brand-mark{border:2px solid var(--green);width:38px;height:38px;display:grid;place-items:center;border-radius:50%;font-weight:900;color:var(--green);font-size:13px}.brand-name{font-size:14px;font-weight:800;line-height:.86;letter-spacing:.06em}.brand-name strong{color:var(--green);display:block}.brand-name small{font-size:7px;letter-spacing:.23em;font-weight:700}.site-menu{display:flex;gap:27px;margin-left:auto}.site-menu a{color:inherit;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.site-menu a:hover,.text-link:hover{color:var(--green)}.button{background:var(--green);color:var(--ink);padding:15px 21px;display:inline-flex;align-items:center;gap:22px;text-decoration:none;text-transform:uppercase;font-size:11px;font-weight:900;letter-spacing:.08em;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);background:#c0f35c}.button span{font-size:18px;line-height:0}.button--small{padding:11px 15px}.menu-toggle{display:none}.hero{min-height:780px;background:var(--ink);position:relative;color:#fff;display:flex;align-items:center;overflow:hidden}.hero-image{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,14,10,.92) 0%,rgba(5,14,10,.69) 39%,rgba(5,14,10,.1) 75%),url('assets/images/unsplash/barbershop-hero.webp') center 47%/cover no-repeat}.hero-content{position:relative;z-index:1;padding-top:90px}.eyebrow{color:var(--green);font-size:11px;font-weight:900;letter-spacing:.17em;margin:0 0 20px}.hero h1,.section h2{font-size:clamp(3.5rem,7vw,7.5rem);line-height:.87;letter-spacing:-.075em;margin:0;font-weight:900}.hero h1 em,.section h2 em{font-family:var(--serif);font-weight:400;letter-spacing:-.09em}.hero-copy{width:min(450px,100%);font-size:17px;margin:32px 0}.hero-actions{display:flex;align-items:center;gap:29px}.text-link{color:inherit;text-decoration:none;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.text-link span{color:var(--green);font-size:20px;vertical-align:middle;margin-left:5px}.hero-note{position:absolute;bottom:27px;right:calc((100% - min(1180px,calc(100% - 48px)))/2);z-index:1;color:#d8ddd5;font-size:10px;letter-spacing:.13em}.hero-note span{width:75px;height:1px;background:var(--green);display:inline-block;vertical-align:middle;margin:0 10px}.section{padding:125px 0}.intro-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:9vw;align-items:start}.section h2{font-size:clamp(3rem,5.5vw,5.8rem)}.intro p:not(.lead){color:#4b514d;font-size:15px;margin:0 0 28px}.intro .lead{font-size:25px;line-height:1.25;font-weight:700;margin:0 0 28px}.services{background:var(--pine);color:var(--cream)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:63px}.service-list{border-top:1px solid var(--line)}.service-list article{display:grid;grid-template-columns:90px 1.1fr 1.5fr auto;gap:25px;align-items:center;border-bottom:1px solid var(--line);padding:31px 0}.service-number{color:var(--green);font-family:var(--serif);font-size:26px}.service-list h3{font-size:25px;margin:0;letter-spacing:-.04em}.service-list p{margin:0;color:#c6d3ca;font-size:14px}.service-price{font-size:14px;font-weight:800;white-space:nowrap}.demo-note,.contact-details small{font-size:11px;color:#9cad9f;margin-top:19px;display:block}.vibe{display:grid;grid-template-columns:1fr 1fr;padding-block:0}.vibe-card{background:var(--orange);padding:100px clamp(25px,7vw,100px);min-height:570px}.vibe-card .eyebrow{color:var(--ink)}.vibe-card h2{font-size:clamp(3rem,5vw,5.5rem)}.vibe-card>p:not(.eyebrow){max-width:380px;font-weight:600;margin-top:34px}.vibe-tags{display:flex;gap:9px;margin-top:48px;flex-wrap:wrap}.vibe-tags span{border:1px solid rgba(16,23,19,.35);border-radius:100px;padding:8px 12px;font-size:10px;font-weight:900;letter-spacing:.1em}.vibe-statement{background:var(--ink);color:var(--cream);padding:100px clamp(25px,7vw,100px);min-height:570px;display:flex;flex-direction:column;justify-content:space-between}.vibe-statement p{font-family:var(--serif);font-size:clamp(2.4rem,4.1vw,4.6rem);line-height:.98;margin:0}.button--outline{background:transparent;border:1px solid rgba(255,255,255,.7);color:#fff;width:max-content}.button--outline:hover{background:var(--green);border-color:var(--green);color:var(--ink)}.contact{background:var(--paper)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw}.contact-copy{font-size:20px;max-width:420px;margin:35px 0}.contact-details{padding-top:52px}.contact-details>div{border-top:1px solid #c9c3b4;padding:20px 0;display:grid;grid-template-columns:120px 1fr}.contact-details span{font-size:10px;font-weight:900;letter-spacing:.13em}.contact-details p{margin:0;font-size:18px;font-weight:700}.contact-details a{color:inherit}.site-footer{background:var(--ink);color:var(--cream);padding:34px 0}.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px}.footer-inner p,.footer-inner>a{font-size:11px;color:#9cad9f;margin:0;text-decoration:none}.brand--footer .brand-mark{width:30px;height:30px;font-size:10px}.brand--footer .brand-name{font-size:11px}@media(max-width:820px){.site-header{position:absolute}.header-inner{min-height:72px}.header-cta{display:none}.menu-toggle{display:flex;flex-direction:column;gap:4px;background:none;border:0;margin-left:auto;padding:9px;cursor:pointer}.menu-toggle span{width:21px;height:2px;background:#fff}.site-menu{display:none;position:absolute;top:72px;left:0;right:0;background:var(--ink);padding:22px 24px;flex-direction:column;gap:18px;border-top:1px solid var(--line)}.site-menu.is-open{display:flex}.hero{min-height:700px}.hero-image{background:linear-gradient(90deg,rgba(5,14,10,.87),rgba(5,14,10,.45)),url('assets/images/unsplash/barbershop-hero.webp') 58% center/cover no-repeat}.intro-grid,.contact-grid{grid-template-columns:1fr;gap:38px}.section{padding:82px 0}.section-heading{display:block;margin-bottom:38px}.section-heading .eyebrow{margin-bottom:18px}.service-list article{grid-template-columns:38px 1fr;gap:8px 18px}.service-list p{grid-column:2}.service-price{grid-column:2;margin-top:7px}.vibe{grid-template-columns:1fr;margin-inline:0;width:100%}.vibe-card,.vibe-statement{min-height:430px;padding:65px 24px}.footer-inner{align-items:flex-start;flex-direction:column}.hero-note{right:24px}.contact-details{padding-top:0}}@media(max-width:480px){.shell{width:min(100% - 34px,1180px)}.hero h1{font-size:3.3rem}.hero-copy{font-size:15px}.hero-actions{gap:17px;align-items:flex-start;flex-direction:column}.hero-note{display:none}.section h2{font-size:3.1rem}.intro .lead{font-size:21px}.contact-details>div{grid-template-columns:1fr;gap:5px}}
.brand-logo{width:48px;height:48px;display:block;object-fit:cover;border-radius:50%;background:#000}.brand--footer .brand-logo{width:36px;height:36px}.brand-mark{display:none}.button span,.text-link span{display:none}

/* Subtelny ruch tła hero - wyłączony dla osób ograniczających animacje. */
.hero-image {
    transform: scale(1.04);
    animation: hero-drift 20s ease-in-out infinite alternate;
    will-change: transform;
}

@keyframes hero-drift {
    from { transform: scale(1.04) translate3d(0, 0, 0); }
    to { transform: scale(1.11) translate3d(-1.2%, -0.7%, 0); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .hero-image { animation: none; transform: none; }
    .button { transition: none; }
}
.realizations-grid{display:grid;grid-template-columns:1.18fr .82fr;grid-template-rows:145px 145px;gap:12px;margin-top:36px}.realization{margin:0;overflow:hidden;background:#173c2c}.realization--large{grid-row:span 2}.realization img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .6s ease;filter:saturate(.9)}.realization--large img{object-position:56% center}.realization:hover img{transform:scale(1.07);filter:saturate(1.1)}
@media(max-width:820px){.realizations-grid{grid-template-rows:160px 160px;margin-top:30px}}
@media(max-width:480px){.realizations-grid{grid-template-rows:130px 130px;gap:8px}}
/* Slider realizacji pod sekcją O nas. */

.intro-copy{padding-top:6px}.realizations-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.realizations-gallery .realization{height:128px;margin:0;overflow:hidden;background:#173c2c}.realizations-gallery .realization img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .6s ease;filter:saturate(.9)}.realizations-gallery .realization:hover img{transform:scale(1.06);filter:saturate(1.1)}@media(max-width:820px){.intro-copy{padding-top:0}.realizations-gallery .realization{height:135px}}@media(max-width:480px){.realizations-gallery{gap:8px}.realizations-gallery .realization{height:112px}}
.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}.price-card{min-height:142px;padding:24px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;align-content:start;column-gap:20px}.price-card:nth-child(odd){padding-right:36px;border-right:1px solid var(--line)}.price-card:nth-child(even){padding-left:36px}.price-card h3{grid-column:1/-1;font-size:19px;line-height:1.15;margin:0 0 16px;letter-spacing:-.035em}.price-card p{margin:0;color:#c6d3ca;font-size:12px}.price-card strong{font-size:14px;color:var(--green);white-space:nowrap}.pricing-footer{display:flex;gap:24px;align-items:center;justify-content:space-between;margin-top:30px}.pricing-footer p{margin:0;color:#c6d3ca;font-size:12px}.team{padding-bottom:130px}.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.team-card{padding:30px;background:#e4dfd1;border:1px solid #d2cbbb}.team-avatar{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:var(--pine);color:var(--green);font-family:var(--serif);font-size:28px;margin-bottom:42px}.team-card h3{font-size:25px;letter-spacing:-.045em;margin:0}.team-card p{color:#57605a;margin:4px 0 27px;font-size:13px}.team-card .text-link{font-size:10px}@media(max-width:820px){.pricing-grid{grid-template-columns:1fr}.price-card:nth-child(odd),.price-card:nth-child(even){padding:22px 0;border-right:0}.pricing-footer{align-items:flex-start;flex-direction:column}.team{padding-bottom:82px}.team-grid{grid-template-columns:1fr}.team-card{display:grid;grid-template-columns:82px 1fr;column-gap:24px;align-items:center}.team-avatar{grid-row:span 3;margin:0}.team-card p{margin:4px 0 17px}}@media(max-width:480px){.price-card{min-height:auto}.price-card h3{font-size:17px}.price-card p{grid-column:1/-1;margin-bottom:6px}.team-card{padding:22px}}
.team{padding-bottom:130px}.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.team-card{position:relative;isolation:isolate;min-height:420px;overflow:hidden;background:var(--ink);display:flex;align-items:flex-end}.team-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(5,12,8,.05) 28%,rgba(5,12,8,.93) 100%)}.team-photo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform .65s ease}.team-card:hover .team-photo{transform:scale(1.055)}.team-card-content{color:var(--cream);padding:28px;position:relative;z-index:1;width:100%}.team-card-content p{color:var(--green);font-size:10px;font-weight:900;letter-spacing:.15em;margin:0 0 8px}.team-card h3{font-size:27px;letter-spacing:-.05em;margin:0 0 24px}.team-card .text-link{font-size:10px;color:#fff}.training{background:var(--orange);color:var(--ink)}.training-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:start}.training .eyebrow{color:var(--ink)}.training h2{font-size:clamp(3.2rem,5.4vw,5.8rem)}.training-content{padding-top:14px}.training-lead{font-size:24px;line-height:1.3;font-weight:700;margin:0 0 34px}.training-points{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(16,23,19,.25);margin-bottom:36px}.training-points span{padding:15px 0;border-bottom:1px solid rgba(16,23,19,.25);font-size:13px;font-weight:800}.training-points span:nth-child(odd){border-right:1px solid rgba(16,23,19,.25);padding-right:15px}.training-points span:nth-child(even){padding-left:15px}.training .button{background:var(--ink);color:var(--cream)}.training .button:hover{background:#253b30}@media(max-width:820px){.team{padding-bottom:82px}.team-grid{grid-template-columns:1fr}.team-card{min-height:380px}.training-grid{grid-template-columns:1fr;gap:38px}.training-content{padding-top:0}}@media(max-width:480px){.team-card{min-height:340px}.team-card-content{padding:22px}.training-lead{font-size:20px}.training-points{grid-template-columns:1fr}.training-points span:nth-child(odd){border-right:0;padding-right:0}.training-points span:nth-child(even){padding-left:0}}
/* Różnicowanie sekcji: fotografia i ciemniejszy rytm pomiędzy blokami. */
.training{position:relative;background:#101713;color:var(--cream);overflow:hidden}.training-grid{grid-template-columns:minmax(280px,.86fr) minmax(0,1fr);gap:clamp(40px,8vw,130px);align-items:stretch}.training-media{min-height:510px;background:linear-gradient(180deg,rgba(9,14,11,.04),rgba(9,14,11,.55)),url('assets/images/unsplash/barber-training.webp') center/cover}.training-content{padding:20px 0}.training .eyebrow{color:var(--green)}.training h2{margin:0 0 38px}.training h2 em{color:#d8e9d8}.training-lead{max-width:620px;color:#eef1e7}.training-points{border-color:rgba(238,241,231,.24);max-width:600px}.training-points span{border-color:rgba(238,241,231,.24);color:#eef1e7}.training-points span:nth-child(odd){border-color:rgba(238,241,231,.24)}.training .button{background:var(--green);color:var(--ink)}.training .button:hover{background:#c2f34d}.vibe-card{background:#d6e1d2}.vibe-statement{background:linear-gradient(90deg,rgba(13,28,20,.95),rgba(13,28,20,.68)),url('assets/images/unsplash/barber-vibe.webp') center/cover}.vibe-statement p{color:var(--cream)}@media(max-width:820px){.training-grid{grid-template-columns:1fr;gap:34px}.training-media{min-height:360px}.training-content{padding-top:0}.vibe-statement{min-height:420px}}@media(max-width:480px){.training-media{min-height:300px}}
/* Zdjęciowa kompozycja przy cenniku oraz nagłówek reagujący na kierunek przewijania. */
.site-header{transition:transform .32s ease,background .32s ease,box-shadow .32s ease}.site-header.is-scrolled{position:fixed;background:rgba(9,18,13,.96);backdrop-filter:blur(12px);box-shadow:0 8px 22px rgba(0,0,0,.18)}.site-header.is-scrolled:not(.is-visible){transform:translateY(-105%)}.pricing-intro{display:grid;grid-template-columns:1fr minmax(300px,420px);gap:48px;align-items:center;margin-bottom:54px}.pricing-intro .section-heading{display:block;margin:0}.pricing-collage{height:315px;position:relative;width:100%;max-width:420px;justify-self:end}.pricing-photo{position:absolute;display:block;width:182px;height:190px;border:7px solid var(--pine);background-size:cover;background-position:center;box-shadow:0 18px 36px rgba(0,0,0,.24);transition:transform .35s ease}.pricing-photo--one{top:0;left:50%;background-image:url('assets/images/unsplash/barber-training.webp');transform:translateX(-15%)}.pricing-photo--two{top:106px;left:0;background-image:url('assets/images/unsplash/barber-vibe.webp')}.pricing-photo--three{right:0;bottom:0;background-image:url('assets/images/unsplash/barbershop-hero.webp')}.pricing-collage:hover .pricing-photo--one{transform:translateX(-15%) translateY(-7px)}.pricing-collage:hover .pricing-photo--two{transform:translate(-7px,7px)}.pricing-collage:hover .pricing-photo--three{transform:translate(7px,7px)}@media(max-width:820px){.site-header.is-scrolled{position:fixed}.pricing-intro{grid-template-columns:1fr;gap:24px;margin-bottom:36px}.pricing-collage{justify-self:start;width:min(100%,390px);height:285px}.pricing-photo{width:164px;height:172px;border-width:5px}}@media(max-width:480px){.pricing-collage{height:245px;width:100%}.pricing-photo{width:138px;height:146px}.pricing-photo--one{left:50%;transform:translateX(-12%)}.pricing-collage:hover .pricing-photo--one{transform:translateX(-12%) translateY(-4px)}}
/* Korekta proporcji bloku „O nas”: szersza prawa kolumna i większe realizacje. */
@media(min-width:821px){.intro-grid{grid-template-columns:.95fr 1.05fr;gap:6vw}.intro-copy{padding-top:0;transform:translateY(-48px)}.realizations-gallery{gap:12px;margin-top:20px}.realizations-gallery .realization{height:166px}}
/* Wspólny styl etykiet wszystkich sekcji. */
.eyebrow{font-size:13px!important;line-height:1.2!important;letter-spacing:.17em!important;font-weight:900!important}

/* Telefon: układ od nowa zaprojektowany dla ekranów 320-480 px. */
@media(max-width:820px){
    body{overflow-x:hidden}
    .shell{width:min(100% - 32px,560px)}
    .section{padding:68px 0}
    .site-header{border-bottom-color:rgba(255,255,255,.1)}
    .header-inner{min-height:70px}
    .brand{gap:9px}
    .brand-logo{width:42px;height:42px}
    .brand-name{font-size:12px}
    .site-header.is-scrolled .header-inner{min-height:64px}
    .site-header.is-scrolled .brand-logo{width:37px;height:37px}
    .site-menu{top:70px;padding:20px 24px;gap:16px}
    .hero{min-height:100svh;align-items:flex-end}
    .hero-content{padding-top:110px;padding-bottom:60px}
    .hero h1{font-size:clamp(3.25rem,15vw,4.45rem);line-height:.84}
    .hero-copy{font-size:15px;line-height:1.5;margin:26px 0 30px;max-width:310px}
    .hero-actions{gap:17px}
    .hero-actions .button{padding:14px 18px}
    .intro-grid{gap:46px}
    .intro .lead{font-size:22px;line-height:1.28;margin-bottom:22px}
    .intro p:not(.lead){font-size:15px;line-height:1.55;margin-bottom:22px}
    .realizations-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:18px}
    .realizations-gallery .realization{height:126px}
    .pricing-intro{gap:18px;margin-bottom:30px}
    .pricing-collage{width:min(100%,380px);height:264px;margin-inline:auto}
    .pricing-photo{width:154px;height:162px}
    .pricing-grid{border-top-color:rgba(245,242,232,.26)}
    .price-card{padding:21px 0!important;min-height:0;row-gap:7px}
    .price-card h3{font-size:18px;margin-bottom:7px}
    .price-card p{font-size:13px;margin:0}
    .price-card strong{font-size:15px}
    .pricing-footer{margin-top:24px;gap:18px}
    .pricing-footer .button{width:100%;justify-content:center}
    .team{padding-bottom:68px}
    .team-grid{gap:12px}
    .team-card{min-height:355px}
    .team-card-content{padding:24px}
    .team-card h3{font-size:25px;margin-bottom:18px}
    .training-grid{gap:28px}
    .training-media{min-height:300px}
    .training-content{padding:0}
    .training h2{margin-bottom:26px}
    .training-lead{font-size:20px;margin-bottom:25px}
    .training-points{margin-bottom:27px}
    .vibe-card,.vibe-statement{min-height:400px;padding:55px 24px}
    .vibe-card h2{font-size:clamp(3.1rem,15vw,4rem)}
    .vibe-card>p:not(.eyebrow){margin-top:25px}
    .vibe-tags{margin-top:32px}
    .vibe-statement p{font-size:clamp(2.65rem,13vw,3.7rem)}
    .contact-grid{gap:42px}
    .contact-copy{font-size:19px;line-height:1.45;margin:26px 0}
    .contact .button{width:100%;justify-content:center}
    .contact-details>div{padding:18px 0;gap:7px}
    .contact-details p{font-size:17px;line-height:1.42}
    .contact-details small{margin-top:23px;line-height:1.45}
    .site-footer{padding:30px 0}
    .footer-inner{gap:17px}
}
@media(max-width:380px){
    .shell{width:calc(100% - 28px)}
    .hero h1{font-size:3.1rem}
    .realizations-gallery .realization{height:112px}
    .pricing-photo{width:138px;height:146px}
    .pricing-collage{height:240px}
}
/* Green Vibe jest parą stykających się kafli - bez ogólnego odstępu sekcji na telefonie. */
@media(max-width:820px){.vibe.section{padding:0}}
/* Telefon: Green Vibe musi wyjść poza kontener shell, a hero zachować równy rytm pionowy. */
@media(max-width:820px){
    .vibe.shell{width:100%;margin-inline:0}
    .hero{align-items:center}
    .hero-content{width:100%;padding-top:94px;padding-bottom:48px}
    .hero h1{max-width:100%}
    .hero-copy{margin:28px 0}
    .hero-actions{gap:16px}
}
/* Telefon: hero w spokojniejszym, wycentrowanym układzie. */
@media(max-width:820px){
    .hero{min-height:100svh;align-items:center}
    .hero-image{background:linear-gradient(180deg,rgba(5,14,10,.73) 0%,rgba(5,14,10,.88) 58%,rgba(5,14,10,.96) 100%),url('assets/images/unsplash/barbershop-hero.webp') 60% center/cover no-repeat}
    .hero-content{display:flex;flex-direction:column;align-items:center;text-align:center;padding:104px 0 38px}
    .hero .eyebrow{margin-bottom:24px;max-width:100%}
    .hero h1{font-size:clamp(3.05rem,14.5vw,4.05rem);line-height:.86;letter-spacing:-.07em}
    .hero-copy{max-width:315px;font-size:15px;line-height:1.55;margin:28px 0}
    .hero-actions{width:100%;max-width:340px;flex-direction:column;gap:12px}
    .hero-actions .button,.hero-actions .text-link{width:100%;min-height:54px;justify-content:center;padding-inline:18px}
    .hero-actions .text-link{border:1px solid rgba(255,255,255,.4);font-size:11px;color:var(--cream)}
    .hero-actions .text-link:hover{border-color:var(--green);color:var(--green)}
}
/* Telefon: kompaktowe przejścia między kolejnymi historiami strony. */
@media(max-width:820px){
    #o-nas{padding-bottom:38px}
    #uslugi{padding-top:42px;padding-bottom:58px}
    #zespol{padding-top:58px;padding-bottom:58px}
    #szkolenia{padding-top:58px;padding-bottom:58px}
    #kontakt{padding-top:52px}
    .vibe-card{min-height:0;padding-top:50px;padding-bottom:48px}
    .vibe-statement{min-height:440px;padding-top:50px;padding-bottom:50px}
}
/* Telefon: wyrównanie hero oraz optyczne wyrównanie etykiet z nagłówkami. */
@media(max-width:820px){
    .hero h1{max-width:310px;font-size:clamp(2.75rem,12vw,3.3rem);line-height:.94}
    .hero h1 em{display:inline-block;margin-top:7px}
    .hero-actions .text-link{display:flex;text-align:center}
    .section .eyebrow{position:relative;left:5px}
}
/* Interaktywne kafelki zespołu i mocniejszy blok kontaktowy. */
.team-card[data-booking-url]{cursor:pointer}.team-card[data-booking-url]:focus-visible{outline:3px solid var(--green);outline-offset:4px}.contact{background:linear-gradient(135deg,#e9e4d6 0%,#f5f2e8 54%,#d9e5d8 100%)}.contact-details{position:relative;align-self:start;background:var(--ink);color:var(--cream);padding:42px 38px 34px;border-top:4px solid var(--green)}.contact-details::before{content:'GREEN MONKEY / GDYNIA';display:block;color:var(--green);font-size:10px;font-weight:900;letter-spacing:.16em;margin-bottom:24px}.contact-details>div{border-color:rgba(245,242,232,.2)}.contact-details span{color:var(--green)}.contact-details p,.contact-details a{color:var(--cream)}.contact-details small{color:#b7c3ba;line-height:1.45}.hero-actions .text-link{align-items:center;line-height:1}@media(max-width:820px){.contact-grid{gap:34px}.contact-details{padding:30px 24px 27px}.contact-details::before{margin-bottom:19px}.contact-details>div{padding:17px 0}.contact-details small{margin-top:20px}.hero-actions .text-link{align-items:center}}
/* Pasek ma animować się wyłącznie przy powrocie do góry - bez mignięcia przy zjeżdżaniu w dół. */
.site-header.is-scrolled:not(.is-visible){transform:translateY(-105%);transition:none}.site-header.is-scrolled.is-visible{transform:translateY(0);transition:transform .32s ease,background .32s ease,box-shadow .32s ease}
/* Reakcja wszystkich głównych przycisków prowadzących do Booksy. */
.button[href*="booksy"]:is(:hover,:focus-visible){background:#f5f2e8;color:var(--pine)}.button[href*="booksy"]:active{background:var(--pine);color:var(--cream);transform:scale(.97)}.team-card .text-link:active{color:var(--green)}
/* Jaśniejszy panel danych kontaktowych, spójny z papierowym tłem strony. */
.contact-details{background:#d7e4d4;color:var(--ink);border-top-color:var(--green);box-shadow:0 18px 42px rgba(18,59,43,.06)}.contact-details::before{color:var(--pine)}.contact-details>div{border-color:#d5d0c1}.contact-details span{color:var(--pine)}.contact-details p,.contact-details a{color:var(--ink)}.contact-details small{color:#69766f}
/* Telefon: animowane menu wysuwane spod nagłówka, wyrównane z kontenerem strony. */
@media (max-width:820px){
    .header-inner{position:relative}
    .menu-toggle{width:44px;height:44px;align-items:center;justify-content:center;gap:5px;padding:0}
    .menu-toggle span{width:28px;transition:transform .26s ease,opacity .18s ease}
    .menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
    .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
    .menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
    .site-menu{
        display:flex;
        top:100%;
        right:auto;
        left:50%;
        width:100vw;
        padding:22px max(16px,calc((100vw - 560px) / 2)) 26px;
        gap:0;
        background:var(--ink);
        box-shadow:0 16px 28px rgba(0,0,0,.18);
        opacity:0;
        visibility:hidden;
        pointer-events:none;
        transform:translate(-50%,-14px);
        transition:transform .3s ease,opacity .2s ease,visibility 0s linear .3s;
    }
    .site-menu a{padding:11px 0}
    .site-menu.is-open{
        opacity:1;
        visibility:visible;
        pointer-events:auto;
        transform:translate(-50%,0);
        transition:transform .3s ease,opacity .2s ease,visibility 0s;
    }
}
@media (prefers-reduced-motion:reduce){
    .site-menu,.menu-toggle span{transition:none!important}
}
/* Telefon: równe pozycje rozwijanego menu, bez przypadkowych luk. */
@media (max-width:820px){
    .site-menu{
        padding-top:10px;
        padding-bottom:16px;
        gap:0;
    }
    .site-menu a{
        min-height:52px;
        padding:0;
        display:flex;
        align-items:center;
        border-bottom:1px solid rgba(245,242,232,.13);
    }
    .site-menu a:last-child{border-bottom:0}
}
/* Telefon: menu pokrywa całą szerokość widoku, a pozycje są centrowane w obu osiach. */
@media (max-width:820px){
    .site-menu{
        position:fixed;
        top:70px;
        right:0;
        left:0;
        width:100%;
        margin:0;
        padding-inline:16px;
        transform:translateY(-14px);
    }
    .site-header.is-scrolled .site-menu{top:64px}
    .site-menu.is-open{transform:translateY(0)}
    .site-menu a{
        justify-content:center;
        text-align:center;
        min-height:60px;
    }
}
/* Telefon: kompensacja szerokości paska przewijania - panel menu bez szczeliny po prawej. */
@media (max-width:820px){
    .site-menu{
        right:-18px;
        width:auto;
    }
}