/*
Theme Name: Wyfryzowani Salon & Shop
Theme URI: https://example.com/
Author: Wyfryzowani
Description: Elegancki motyw WordPress + WooCommerce dla salonu fryzjerskiego i sklepu z kosmetykami.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: wyfryzowani
*/

:root{
  --hb-black:#11100f;
  --hb-white:#fff;
  --hb-cream:#f3eee7;
  --hb-taupe:#c9a56d;
  --hb-muted:#6e6a66;
  --hb-border:#39322a;
  --hb-max:1240px;
  --hb-radius:2px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--hb-black);background:#fff;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button,input,select,textarea{font:inherit}
.container{width:min(var(--hb-max),calc(100% - 48px));margin:auto}
.hb-topbar{background:#151515;color:#fff;font-size:12px}
.hb-topbar .container{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.hb-topbar a{opacity:.9}
.hb-topbar-right{display:flex;gap:18px}
.hb-header{background:#11100f;color:#f8f3eb;border-bottom:1px solid #39322a;position:relative;z-index:20}
.hb-header .container{height:86px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.hb-logo{display:flex;align-items:center;gap:12px;min-width:225px}
.hb-logo-mark{font-size:34px;line-height:1}
.hb-logo strong{font-family:Georgia,serif;font-size:24px;font-weight:500;letter-spacing:-.5px}
.hb-logo small{display:block;color:#a4978b;font-size:8px;letter-spacing:3px;margin-top:-2px}
.hb-nav{display:flex;align-items:center;gap:32px;font-size:13px}
.hb-nav a{padding:33px 0;position:relative}
.hb-nav a:hover:after,.hb-nav .current-menu-item>a:after{content:"";position:absolute;bottom:21px;left:0;right:0;height:1px;background:#c9a56d}
.hb-actions{display:flex;gap:16px;align-items:center;font-size:20px}
.hb-actions a{position:relative}
.hb-cart-count{position:absolute;top:-8px;right:-9px;background:#111;color:#fff;width:18px;height:18px;border-radius:50%;font-size:10px;display:grid;place-items:center}
.hb-menu-toggle{display:none;border:0;background:none;font-size:24px}
.hb-hero{min-height:510px;background:#ddd center/cover no-repeat;position:relative;display:flex;align-items:center}
.hb-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(12,11,10,.94) 0%,rgba(12,11,10,.78) 38%,rgba(12,11,10,.04) 78%)}
.hb-hero-content{position:relative;z-index:1;width:55%;padding:70px 0}
.eyebrow{font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#c9a56d;margin:0 0 14px}
.hb-hero h1{font-family:Georgia,serif;font-size:clamp(46px,6vw,78px);line-height:1.02;font-weight:500;letter-spacing:-3px;max-width:620px;margin:0 0 24px}
.hb-hero p{max-width:550px;font-size:17px;color:#eee;margin:0 0 30px}
.hb-buttons{display:flex;gap:14px;flex-wrap:wrap}
.hb-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 23px;border:1px solid #c9a56d;background:#c9a56d;color:#17120d;font-size:13px;cursor:pointer}
.hb-btn:hover{opacity:.88;color:#fff}
.hb-btn-light{background:transparent;color:#171717}
.hb-benefits{padding:34px 0;border-bottom:1px solid var(--hb-border);background:#f3eee7}
.hb-benefits-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:25px}
.hb-benefit{text-align:center}
.hb-benefit-icon{font-size:27px;margin-bottom:8px}
.hb-benefit strong{font-size:13px;display:block}
.hb-benefit span{display:block;font-size:11px;color:#777;max-width:180px;margin:5px auto 0}
.hb-split{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:55px auto}
.hb-card{min-height:240px;padding:34px;display:flex;flex-direction:column;justify-content:flex-end;background:#222 center/cover no-repeat;color:#fff;position:relative;overflow:hidden}
.hb-card:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.05))}
.hb-card>*{position:relative}
.hb-card h2{font-family:Georgia,serif;font-size:31px;font-weight:400;margin:0 0 3px}
.hb-card p{margin:0 0 18px;font-size:13px}
.hb-card .hb-btn{align-self:flex-start;background:transparent;border-color:#fff}
.hb-section{padding:58px 0}
.hb-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}
.hb-section-head h2{font-family:Georgia,serif;font-size:38px;font-weight:400;line-height:1.1;margin:0}
.hb-section-link{font-size:12px;text-decoration:underline;text-underline-offset:4px}
.hb-products{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.hb-product{position:relative}
.hb-product-image{background:#f6f5f3;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden}
.hb-product-image img{width:100%;height:100%;object-fit:contain}
.hb-product h3{font-size:13px;line-height:1.4;margin:12px 0 6px;font-weight:500}
.hb-price{font-size:15px;font-weight:700;margin-bottom:10px}
.hb-product .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{border-radius:0;background:#171717;color:#fff;border:0;padding:12px 17px;font-size:12px}
.hb-product .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:#333;color:#fff}
.hb-about{display:grid;grid-template-columns:1fr 1.2fr;background:var(--hb-cream)}
.hb-about-image{min-height:410px;background:center/cover no-repeat}
.hb-about-copy{padding:55px}
.hb-about-copy h2{font-family:Georgia,serif;font-size:39px;font-weight:400;line-height:1.12;margin:0 0 18px}
.hb-services{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:28px}
.hb-service{padding:14px 0;border-top:1px solid #d4ccc4;font-size:13px}
.hb-newsletter{background:#11100f;color:#fff;padding:28px 0}
.hb-newsletter .container{display:flex;align-items:center;justify-content:space-between;gap:30px}
.hb-newsletter h3{font-family:Georgia,serif;font-size:24px;font-weight:400;margin:0}
.hb-newsletter p{margin:4px 0 0;color:#aaa;font-size:12px}
.hb-newsletter form{display:flex;min-width:440px}
.hb-newsletter input{height:46px;flex:1;border:0;padding:0 16px}
.hb-newsletter button{border:0;background:#fff;padding:0 22px;font-size:12px}
.hb-footer{background:#090909;color:#fff;padding:48px 0 0}
.hb-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr 1fr;gap:30px;padding-bottom:42px}
.hb-footer h4{font-size:12px;margin:0 0 15px}
.hb-footer a,.hb-footer p{font-size:11px;color:#aaa;display:block;margin:7px 0}
.hb-footer-brand strong{font-family:Georgia,serif;font-size:25px;font-weight:400}
.hb-footer-bottom{border-top:1px solid #292929;padding:17px 0;display:flex;justify-content:space-between;color:#777;font-size:10px}
.hb-page-title{background:var(--hb-cream);padding:70px 0;margin-bottom:40px}
.hb-page-title h1{font-family:Georgia,serif;font-size:52px;font-weight:400;margin:0}
.hb-content{padding:50px 0}
.woocommerce .site-main,.woocommerce-page .site-main{padding-bottom:70px}
.woocommerce .woocommerce-breadcrumb{font-size:11px;color:#777;margin:25px 0}
.woocommerce ul.products{margin:0!important;display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
.woocommerce ul.products:before,.woocommerce ul.products:after{display:none!important}
.woocommerce ul.products li.product{width:auto!important;margin:0!important}
.woocommerce ul.products li.product a img{background:#f6f5f3}
.woocommerce ul.products li.product .price{color:#111;font-weight:700}
.woocommerce div.product div.images img{background:#f6f5f3}
.woocommerce div.product .product_title{font-family:Georgia,serif;font-weight:400}
.woocommerce span.onsale{background:#171717;min-height:42px;min-width:42px;font-size:11px}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:#171717}
.woocommerce-message::before,.woocommerce-info::before{color:#171717}
.hb-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}
.hb-contact-box{padding:30px;background:var(--hb-cream)}
.hb-contact-box h2{font-family:Georgia,serif;font-weight:400}
@media(max-width:980px){
  .hb-nav{gap:18px}
  .hb-benefits-grid{grid-template-columns:repeat(3,1fr)}
  .hb-products{grid-template-columns:repeat(3,1fr)}
  .hb-footer-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .container{width:min(100% - 28px,var(--hb-max))}
  .hb-topbar-right{display:none}
  .hb-header .container{height:72px}
  .hb-menu-toggle{display:block}
  .hb-nav{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;padding:15px 20px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--hb-border)}
  .hb-nav.is-open{display:flex}
  .hb-nav a{padding:10px 0}
  .hb-nav a:hover:after,.hb-nav .current-menu-item>a:after{display:none}
  .hb-logo{min-width:0}
  .hb-hero{min-height:570px}
  .hb-hero-content{width:100%;padding:55px 0;align-self:flex-start;margin-top:30px}
  .hb-hero h1{font-size:48px}
  .hb-benefits-grid{grid-template-columns:1fr 1fr}
  .hb-split,.hb-about,.hb-contact-grid{grid-template-columns:1fr}
  .hb-products{grid-template-columns:repeat(2,1fr);gap:14px}
  .hb-section-head h2{font-size:30px}
  .hb-newsletter .container{display:block}
  .hb-newsletter form{min-width:0;margin-top:18px}
  .hb-footer-grid{grid-template-columns:1fr 1fr}
  .hb-footer-bottom{display:block}
  .hb-footer-bottom span{display:block;margin-top:6px}
  .woocommerce ul.products{grid-template-columns:repeat(2,1fr);gap:14px}
}

/* Luxury black, champagne and gold finish */
.hb-hero h1,.hb-section-head h2,.hb-about-copy h2,.hb-page-title h1{font-family:Georgia,serif}
.hb-section{border-bottom:1px solid #e6ded4}
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{background:#171512;border:1px solid #c9a56d}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce input.button:hover{background:#c9a56d;color:#17120d}





/* Poprawka poziomego menu Wyfryzowani */
.hb-nav {
display: flex !important;
flex-direction: row !important;
align-items: center;
justify-content: center;
gap: 28px;
flex-wrap: wrap;
}

.hb-nav a {
display: inline-block;
text-decoration: none;
white-space: nowrap;
}

.hb-header,
.hb-header .hb-inner {
display: flex;
align-items: center;
}

@media (max-width: 768px) {
.hb-nav {
gap: 12px;
justify-content: center;
}
}