/* MASSE YAPI — /urun-katalog (canlı blok 634, tpl-user_masse-grohe-katalog). ÜRETİLİR: kaynak-canli/sayfalar/uret.py; elle düzenleme ek_urun-katalog.css */
/* Canlı eski sistem CSS'inden blok için ayıklandı (blok_css.py). Sarmalayıcı: .masse-eski-kat */
.masse-eski-kat{font-family:'Inter',sans-serif;font-size:13px;line-height:1.34;--container-max-width:1400px;}
.masse-eski-kat address{font-style:normal;}
.masse-eski-kat.col-12{padding-left:15px;padding-right:15px;}
@media (max-width:767px){.masse-eski-kat.col-12{padding-left:8px;padding-right:8px;}}
/* Main temasının .container .container:not(.padding-active){padding:0} kuralına karşı eski sitenin değerleri */
.masse-eski-kat .container:not(.padding-active){padding-left:8px;padding-right:8px;}
@media (min-width:768px){.masse-eski-kat .container:not(.padding-active){padding-left:15px;padding-right:15px;}}
.masse-eski-kat .row{display: flex !important;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;}
.masse-eski-kat .col-12{flex-basis: 100%;
max-width: 100%;
padding-left: 15px;
padding-right: 15px;}
@media (max-width: 767px){.masse-eski-kat .row{margin-right: -8px;
margin-left: -8px;}
.masse-eski-kat .col-12{padding-right: 8px;
padding-left: 8px;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk{font-family: -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
background: #f4f6f9;
color: #1a2130;
position: relative;
width: 100vw;
left: calc(50% - 50vw);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk *,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk *::before,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk *::after{box-sizing: border-box;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk a{text-decoration: none;
color: inherit;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk button{cursor: pointer;
font-family: inherit;
border: none;
background: none;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk p{margin: 0;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk h1,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk h2,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk h3{margin: 0;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero{position: relative;
background: #001a35;
overflow: hidden;
padding: 56px 20px 72px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero::before{content: '';
position: absolute;
top: -160px;
right: -160px;
width: 480px;
height: 480px;
border-radius: 50%;
background: radial-gradient(circle, rgba(0, 105, 180, 0.15) 0%, transparent 70%);
pointer-events: none;
z-index: 2;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero::after{content: '';
position: absolute;
bottom: 50px;
left: -60px;
width: 300px;
height: 300px;
border-radius: 50%;
background: radial-gradient(circle, rgba(0, 61, 110, 0.2) 0%, transparent 70%);
pointer-events: none;
z-index: 2;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-video{position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
z-index: 0;
filter: saturate(0.85) brightness(0.9);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-overlay{position: absolute;
inset: 0;
z-index: 1;
background: linear-gradient(160deg, rgba(0, 20, 50, 0.72) 0%, rgba(0, 10, 30, 0.68) 50%, rgba(0, 5, 15, 0.78) 100%);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-inner{position: relative;
z-index: 3;
max-width: 680px;
margin: 0 auto;
text-align: center;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-eyebrow{display: inline-flex;
align-items: center;
gap: 8px;
font-size: 10px;
font-weight: 400;
letter-spacing: 0.22em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.45);
margin-bottom: 18px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-eyebrow::before,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-eyebrow::after{content: '';
display: block;
width: 28px;
height: 1px;
background: rgba(255, 255, 255, 0.25);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-eyebrow i{font-size: 9.75px;
opacity: 0.6;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-title{font-size: clamp(22px, 3.8vw, 38px);
font-weight: 300;
color: rgba(255, 255, 255, 0.92);
letter-spacing: 0.04em;
line-height: 1.2;
margin-bottom: 12px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-sub{font-size: 13px;
font-weight: 300;
color: rgba(255, 255, 255, 0.42);
line-height: 1.7;
margin-bottom: 32px;
max-width: 420px;
margin-left: auto;
margin-right: auto;
letter-spacing: 0.01em;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stats{display: inline-flex;
align-items: center;
gap: 0;
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 10px;
padding: 0;
backdrop-filter: blur(12px);
overflow: hidden;}
@media (max-width: 480px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stats{flex-direction: column;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stat{display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
padding: 14px 28px;}
@media (max-width: 480px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stat{padding: 12px 24px;
width: 100%;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stat-num{font-size: 22px;
font-weight: 300;
color: rgba(255, 255, 255, 0.88);
line-height: 1;
letter-spacing: -0.01em;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-stat-lbl{font-size: 9px;
color: rgba(255, 255, 255, 0.32);
text-transform: uppercase;
letter-spacing: 0.14em;
font-weight: 400;
white-space: nowrap;
margin-top: 2px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-sep{width: 1px;
height: 32px;
background: rgba(255, 255, 255, 0.1);
flex-shrink: 0;}
@media (max-width: 480px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-sep{width: 32px;
height: 1px;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-wave{position: absolute;
bottom: 0;
left: 0;
right: 0;
line-height: 0;
z-index: 3;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__hero-wave svg{display: block;
width: 100%;
height: auto;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__body{max-width: 1400px;
margin: 0 auto;
padding: 0 20px 64px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__filter-wrap{overflow-x: auto;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
margin: 0 -20px 40px;
padding: 0 20px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__filter-wrap::-webkit-scrollbar{display: none;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__filter{display: inline-flex;
align-items: center;
gap: 6px;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 14px;
padding: 8px;
margin-top: -24px;
position: relative;
z-index: 10;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
white-space: nowrap;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn{display: inline-flex;
align-items: center;
gap: 6px;
padding: 9px 16px;
border: 1.5px solid transparent;
border-radius: 9px;
font-size: 13px;
font-weight: 600;
color: #475569;
background: transparent;
transition: all 0.18s ease;
white-space: nowrap;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn em{display: inline-flex;
align-items: center;
justify-content: center;
min-width: 20px;
height: 20px;
padding: 0 5px;
background: #f1f5f9;
border-radius: 999px;
font-size: 11px;
font-style: normal;
font-weight: 700;
color: #64748b;
transition: background 0.18s, color 0.18s;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn i{font-size: 10.66px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn:hover{color: #003d6e;
background: #f0f7ff;
border-color: #bfdbfe;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn.is-active{background: #003d6e;
color: #fff;
border-color: #003d6e;
box-shadow: 0 4px 12px rgba(0, 61, 110, 0.28);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn.is-active em{background: rgba(255, 255, 255, 0.22);
color: #fff;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__fbtn.is-active i{color: rgba(255, 255, 255, 0.8);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__grid{display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px;
align-items: start;}
@media (max-width: 1200px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__grid{grid-template-columns: repeat(3, 1fr);}}
@media (max-width: 820px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__grid{grid-template-columns: repeat(2, 1fr);
gap: 16px;}}
@media (max-width: 480px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__grid{grid-template-columns: 1fr;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card{background: #fff;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04);
display: flex;
flex-direction: column;
transition: transform 0.22s ease, box-shadow 0.22s ease;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card:hover{transform: translateY(-5px);
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.13), 0 0 0 1px rgba(0, 0, 0, 0.04);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card.gk__card--hidden{display: none;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover{position: relative;
aspect-ratio: 0.75;
overflow: hidden;
background: #e8edf2;
display: block;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-pdf-link{display: block;
width: 100%;
height: 100%;
position: relative;
text-decoration: none;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-img{width: 100%;
height: 100%;
object-fit: cover;
object-position: top center;
display: block;
transition: transform 0.4s ease;
background: #dde4ed;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-overlay{position: absolute;
inset: 0;
background: rgba(0, 30, 70, 0.75);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 10px;
color: #fff;
opacity: 0;
transition: opacity 0.22s ease;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-overlay i{font-size: 28.6px;
display: block;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-overlay span{font-size: 13px;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-pdf-link:hover .gk__cover-overlay{opacity: 1;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-pdf-link:hover .gk__cover-img{transform: scale(1.04);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card-body{padding: 16px 18px 18px;
display: flex;
flex-direction: column;
gap: 8px;
flex: 1;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag{display: inline-flex;
align-items: center;
gap: 5px;
padding: 3px 10px 3px 8px;
border-radius: 999px;
font-size: 10.5px;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
width: fit-content;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag i{font-size: 10.14px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag--katalog{background: #dbeafe;
color: #1d4ed8;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag--banyo{background: #e0f2fe;
color: #0369a1;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag--mutfak{background: #d1fae5;
color: #065f46;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag--profesyonel{background: #f1f5f9;
color: #334155;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__tag--referans{background: #faf5ff;
color: #6b21a8;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card-name{font-size: 15px;
font-weight: 700;
color: #1a2130;
line-height: 1.3;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card-desc{font-size: 12.5px;
color: #64748b;
line-height: 1.6;
flex: 1;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card-actions{display: flex;
gap: 8px;
margin-top: 4px;
flex-wrap: wrap;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn{display: inline-flex;
align-items: center;
gap: 6px;
padding: 9px 16px;
border-radius: 8px;
font-size: 12.5px;
font-weight: 700;
text-decoration: none;
transition: all 0.18s ease;
white-space: nowrap;
border: 1.5px solid transparent;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn i{font-size: 10.66px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn--primary{background: #003d6e !important;
color: #fff !important;
border-color: #003d6e !important;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn--primary:hover{background: #0052a3 !important;
border-color: #0052a3 !important;
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 61, 110, 0.32);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn--outline{background: #fff;
color: #003d6e;
border-color: #cbd5e1;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn--outline:hover{border-color: #003d6e;
background: #f0f7ff;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta{margin-top: 52px;
background: linear-gradient(120deg, #003d6e 0%, #0057a8 100%);
border-radius: 20px;
overflow: hidden;
position: relative;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta::before{content: '';
position: absolute;
top: -90px;
right: -90px;
width: 300px;
height: 300px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.05);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-inner{position: relative;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
padding: 36px 44px;
flex-wrap: wrap;}
@media (max-width: 640px){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-inner{padding: 28px 24px;
flex-direction: column;
align-items: flex-start;}}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-text h2{font-size: 22px;
font-weight: 800;
color: #fff;
margin-bottom: 6px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-text p{font-size: 14px;
color: rgba(255, 255, 255, 0.65);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-actions{display: flex;
gap: 12px;
flex-wrap: wrap;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn{display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 22px;
border-radius: 10px;
font-size: 14px;
font-weight: 700;
text-decoration: none;
transition: all 0.2s ease;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn i{font-size: 11.44px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn--white{background: #fff;
color: #003d6e;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn--white:hover{background: #f0f7ff;
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn--ghost{background: rgba(255, 255, 255, 0.12);
color: #fff;
border: 1.5px solid rgba(255, 255, 255, 0.28);}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn--ghost:hover{background: rgba(255, 255, 255, 0.2);
border-color: rgba(255, 255, 255, 0.5);}
@media (prefers-reduced-motion: reduce){.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__card,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-img,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cover-overlay,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__btn,.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__cta-btn{transition: none !important;}}

/* --- el yazımı (kaynak-canli/sayfalar/ek_ortak.css) --- */
/* Sarmalayıcı tam genişlik: bölümlerin arka planları kenardan kenara, içerik 1400px + 15px (menü hizası 35..1405 @1440) */
.masse-sayfa-kap{width:100%;max-width:100%;flex:0 0 100%;}
/* mss.masseyapi.com görseli gelmezse kırık resim simgesi yerine sade zemin */
.masse-sayfa-kap .masse-gorsel-yedek{background:#e8e4de;}
.masse-sayfa-kap img.masse-gorsel-yok{visibility:hidden;}
/* Main (Tailwind) temel kuralı img/svg/video'yu blok yapıyor; eski sitede satır içi (ikon + metin yan yana) */
.masse-sayfa-kap :is(img,svg,video){display:inline;vertical-align:baseline;}
.masse-sayfa-kap svg{vertical-align:middle;}
/* Eski sitenin genel başlık kuralları (Main'in sıfırlamasına karşı; :where ile düşük öncelik, blok kuralları üstte kalır) */
.masse-sayfa-kap :where(h1,h2,h3,h4,h5,h6){color:#373738;font-weight:bold;line-height:1.2;margin-top:0;margin-bottom:10px;}
.masse-sayfa-kap :where(h1){font-size:24px;} .masse-sayfa-kap :where(h2){font-size:20px;} .masse-sayfa-kap :where(h3){font-size:18px;}
.masse-sayfa-kap :where(h4){font-size:16px;} .masse-sayfa-kap :where(h5){font-size:14px;} .masse-sayfa-kap :where(h6){font-size:12px;}
@media (min-width:1200px){.masse-sayfa-kap :where(h1){font-size:32px;} .masse-sayfa-kap :where(h2){font-size:28px;} .masse-sayfa-kap :where(h3){font-size:22px;}
.masse-sayfa-kap :where(h4){font-size:20px;} .masse-sayfa-kap :where(h5){font-size:18px;} .masse-sayfa-kap :where(h6){font-size:16px;}}
.masse-sayfa-kap :where(p){margin-top:0;margin-bottom:10px;}
.masse-sayfa-kap{color:#373738;}
.masse-sayfa-kap :where(ol,ul){padding-left:15px;margin-top:0;margin-bottom:10px;}
.masse-sayfa-kap :where(b,strong){font-weight:bold;}
/* mss kesikken bölümler çökmesin */
.masse-eski-spa .gsp-video-thumb.masse-gorsel-yedek{aspect-ratio:3/2;min-height:220px;}
.masse-eski-spa .gsp-collab__inner.masse-gorsel-yedek{background:#2b2f38;min-height:560px;}
@media (max-width:767px){.masse-eski-spa .gsp-collab__inner.masse-gorsel-yedek{min-height:400px;}}
.masse-eski-spa .gsp-insp-item.masse-gorsel-yedek{display:none !important;}
.masse-sayfa-kap .masse-yuklenemedi{background:#fff;border:1px solid #e3e7ee;border-radius:12px;padding:14px 18px;margin:0 0 20px;color:#4a5260;font-size:14px;line-height:1.5;}

/* Canlıda 100vw ile taşma; sarmalayıcı zaten tam genişlik */
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk{width:100%;left:0;}
/* Gövde menü hizasında: 1440'ta 35..1405, 390'da 12..378 */
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__body{padding-left:15px;padding-right:15px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__filter-wrap{margin-left:-15px;margin-right:-15px;padding-left:15px;padding-right:15px;}
@media (max-width:767px){
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__body{padding-left:12px;padding-right:12px;}
.v5-mango.folder-html-block.tpl-user_masse-grohe-katalog .gk__filter-wrap{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px;}
}
.masse-eski-kat .gk__cover-pdf-link.masse-gorsel-yedek{background:#dfe5ec;}
