/* MASSE YAPI — /grohe-spa (canlı blok 631, tpl-user_masse-grohe-spa-2). ÜRETİLİR: kaynak-canli/sayfalar/uret.py; elle düzenleme ek_grohe-spa.css */
/* Canlı eski sistem CSS'inden blok için ayıklandı (blok_css.py). Sarmalayıcı: .masse-eski-spa */
.masse-eski-spa{font-family:'Inter',sans-serif;font-size:13px;line-height:1.34;--container-max-width:1400px;}
.masse-eski-spa address{font-style:normal;}
.masse-eski-spa.col-12{padding-left:15px;padding-right:15px;}
@media (max-width:767px){.masse-eski-spa.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-spa .container:not(.padding-active){padding-left:8px;padding-right:8px;}
@media (min-width:768px){.masse-eski-spa .container:not(.padding-active){padding-left:15px;padding-right:15px;}}
.masse-eski-spa .swiper-wrapper{position:relative;width:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}
.masse-eski-spa .swiper-wrapper{transform:translate3d(0px,0,0)}
.masse-eski-spa .swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}
.masse-eski-spa button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}
.masse-eski-spa .row{display: flex !important;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;}
.masse-eski-spa .col-12{flex-basis: 100%;
max-width: 100%;
padding-left: 15px;
padding-right: 15px;}
@media (max-width: 767px){.masse-eski-spa .row{margin-right: -8px;
margin-left: -8px;}
.masse-eski-spa .col-12{padding-right: 8px;
padding-left: 8px;}}
@media (min-width: 992px){.masse-eski-spa .col-lg-6{flex-basis: 50%;
max-width: 50%;
padding-left: 15px;
padding-right: 15px;}}
.masse-eski-spa .container{width: 100%;
max-width: 100%;
padding-left: 8px;
padding-right: 8px;
margin: 0 auto;
float: none;
clear: both;}
@media (min-width: 1200px){.masse-eski-spa .container{width: 1200px;}}
@media (min-width: 768px){.masse-eski-spa .container{padding-left: 15px;
padding-right: 15px;}}
.masse-eski-spa .align-items-center{align-items: center;}
.v5-mango .swiper-pagination-bullets{width: 100%;
text-align: center;
padding: 8px;
font-size: 0;}
.v5-mango .swiper-pagination-bullets .swiper-pagination-bullet{background-color: var(--border-secondary);
width: 7px;
height: 7px;
margin-left: 2px;
margin-right: 2px;
display: inline-block;
vertical-align: middle;
border-radius: 100%;}
.v5-mango .swiper-pagination-bullets .swiper-pagination-bullet-active{background-color: var(--bg-primary);}
@media (min-width: 768px){.v5-mango .swiper-pagination-bullets{padding: 15px;}}
.v5-mango .swiper-pagination-bullets:not(.bottom){position: absolute;
left: 0;
bottom: 0;
top: auto;
z-index: 2;}
.v5-mango .swiper-pagination *{outline: 0;}
@media (min-width: 1200px){.masse-eski-spa .container{width: 1400px !important;
max-width: 100% !important;
margin-left: auto !important;
margin-right: auto !important;}}
.masse-eski-spa .gsp-root{background: #f5f1eb;
color: #1a2341;
font-family: inherit;
overflow-x: hidden;
margin: 0;
padding: 0;
width: 100%;}
.masse-eski-spa .gsp-root *{box-sizing: border-box;}
.masse-eski-spa .gsp-root img{display: block;
max-width: 100%;
height: auto;
background: #ede7dd;
min-height: 40px;}
.masse-eski-spa .gsp-root a:not(.gsp-btn){text-decoration: none;
color: inherit;}
.masse-eski-spa .gsp-root a.gsp-btn{text-decoration: none;}
.masse-eski-spa .gsp-btn{display: inline-flex;
align-items: center;
gap: 6px;
padding: 12px 28px;
border-radius: 32px;
font-size: 14px;
font-weight: 600;
letter-spacing: 0.03em;
cursor: pointer;
border: 2px solid transparent;
transition: background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
white-space: nowrap;
line-height: 1.2;}
.masse-eski-spa .gsp-btn:hover{transform: translateY(-1px);}
.masse-eski-spa .gsp-root .gsp-btn--dark,.masse-eski-spa a.gsp-btn--dark{background: #1a2341 !important;
color: #ffffff !important;
border: 2px solid #1a2341 !important;}
.masse-eski-spa .gsp-root .gsp-btn--dark:hover,.masse-eski-spa a.gsp-btn--dark:hover{background: #2d3a5e !important;
border-color: #2d3a5e !important;
color: #ffffff !important;}
.masse-eski-spa .gsp-root .gsp-btn--light,.masse-eski-spa a.gsp-btn--light{background: #ffffff !important;
color: #1a2341 !important;
border: 2px solid #ffffff !important;}
.masse-eski-spa .gsp-root .gsp-btn--light:hover,.masse-eski-spa a.gsp-btn--light:hover{background: #f5f1eb !important;
border-color: #f5f1eb !important;
color: #1a2341 !important;}
.masse-eski-spa .gsp-root .gsp-btn--outline,.masse-eski-spa a.gsp-btn--outline{background: transparent !important;
color: #1a2341 !important;
border: 2px solid #1a2341 !important;}
.masse-eski-spa .gsp-root .gsp-btn--outline:hover,.masse-eski-spa a.gsp-btn--outline:hover{background: #1a2341 !important;
color: #ffffff !important;
border-color: #1a2341 !important;}
@keyframes gsp-fade-up{
from
{
opacity: 0;
transform: translateY(28px);
}
to
{
opacity: 1;
transform: translateY(0);
}
}
.masse-eski-spa .gsp-reveal{animation: gsp-fade-up 0.75s ease both;}
@media (prefers-reduced-motion: reduce){.masse-eski-spa .gsp-reveal{animation: none;}}
.masse-eski-spa .gsp-hero{background: #f5f1eb;
padding: 72px 0 56px;}
@media (max-width: 991px){.masse-eski-spa .gsp-hero{padding: 40px 0 32px;}}
.masse-eski-spa .gsp-hero__row{display: flex;
flex-wrap: wrap;
gap: 0;}
@media (max-width: 991px){.masse-eski-spa .gsp-hero__text{text-align: center;}}
.masse-eski-spa .gsp-hero__h1{font-size: 72px;
font-weight: 800;
color: #1a2341;
line-height: 1;
letter-spacing: -1px;
margin-bottom: 6px;}
@media (max-width: 767px){.masse-eski-spa .gsp-hero__h1{font-size: 48px;}}
@media (max-width: 575px){.masse-eski-spa .gsp-hero__h1{font-size: 36px;}}
.masse-eski-spa .gsp-hero__h2{font-size: 24px;
font-weight: 400;
color: #6b7280;
font-style: italic;
letter-spacing: 0.05em;
margin-bottom: 24px;}
@media (max-width: 767px){.masse-eski-spa .gsp-hero__h2{font-size: 18px;}}
.masse-eski-spa .gsp-hero__body{font-size: 16px;
line-height: 1.8;
color: #1a2341;
max-width: 520px;
margin-bottom: 28px;}
@media (max-width: 991px){.masse-eski-spa .gsp-hero__body{margin-left: auto;
margin-right: auto;}}
.masse-eski-spa .gsp-hero__media{display: flex;
justify-content: flex-end;
align-items: flex-start;}
@media (max-width: 991px){.masse-eski-spa .gsp-hero__media{justify-content: center;
margin-top: 32px;}}
.masse-eski-spa .gsp-video-thumb{position: relative;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 16px 48px rgba(26, 35, 65, 0.14);
cursor: pointer;
max-width: 560px;
width: 100%;}
.masse-eski-spa .gsp-video-thumb__poster{width: 100%;
height: 350px;
object-fit: cover;
display: block;
background: #ede7dd;
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
@media (max-width: 767px){.masse-eski-spa .gsp-video-thumb__poster{height: 220px;}}
.masse-eski-spa .gsp-video-thumb:hover .gsp-video-thumb__poster{transform: scale(1.02);}
.masse-eski-spa .gsp-play-btn{position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 72px;
height: 72px;
background: rgba(255, 255, 255, 0.92);
border: none;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: #1a2341;
transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.masse-eski-spa .gsp-play-btn__ring{position: absolute;
top: -6px;
right: -6px;
bottom: -6px;
left: -6px;
border: 2px solid rgba(255, 255, 255, 0.55);
border-radius: 50%;
animation: gsp-pulse 2.4s ease-in-out infinite;}
.masse-eski-spa .gsp-play-btn__icon{position: relative;
margin-left: 4px;}
.masse-eski-spa .gsp-play-btn:hover{background: #ffffff;
transform: translate(-50%, -50%) scale(1.08);}
@keyframes gsp-pulse{
0%, 100%
{
opacity: 0.6;
transform: scale(1);
}
50%
{
opacity: 0.2;
transform: scale(1.3);
}
}
.masse-eski-spa .gsp-collab{padding: 0;}
.masse-eski-spa .gsp-collab__inner{position: relative;
overflow: hidden;
min-height: 520px;}
@media (max-width: 767px){.masse-eski-spa .gsp-collab__inner{min-height: 400px;}}
.masse-eski-spa .gsp-collab__img{width: 100%;
height: 100%;
min-height: 520px;
object-fit: cover;
display: block;
background: #1a1a1a;
transition: transform 0.8s ease;}
@media (max-width: 767px){.masse-eski-spa .gsp-collab__img{min-height: 400px;}}
.masse-eski-spa .gsp-collab__inner:hover .gsp-collab__img{transform: scale(1.02);}
.masse-eski-spa .gsp-collab__overlay{position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(to right, rgba(13, 15, 23, 0.88) 0%, rgba(13, 15, 23, 0.55) 55%, rgba(13, 15, 23, 0.05) 100%);
display: flex;
align-items: center;
padding: 48px 64px;}
@media (max-width: 767px){.masse-eski-spa .gsp-collab__overlay{padding: 24px 20px;
align-items: flex-end;
background: linear-gradient(to top, rgba(13, 15, 23, 0.92) 0%, rgba(13, 15, 23, 0.45) 60%, transparent 100%);}}
.masse-eski-spa .gsp-collab__content{max-width: 480px;
color: #ffffff;}
@media (max-width: 767px){.masse-eski-spa .gsp-collab__content{max-width: 100%;}}
.masse-eski-spa .gsp-collab__title{font-size: 28px;
font-weight: 700;
line-height: 1.25;
margin-bottom: 14px;
color: #ffffff;}
@media (max-width: 767px){.masse-eski-spa .gsp-collab__title{font-size: 22px;}}
.masse-eski-spa .gsp-collab__text{font-size: 16px;
line-height: 1.7;
color: rgba(255, 255, 255, 0.82);
margin-bottom: 24px;}
.masse-eski-spa .gsp-collections{background: #ede7dd;
padding: 72px 0 56px;
overflow: hidden;}
@media (max-width: 767px){.masse-eski-spa .gsp-collections{padding: 40px 0 32px;}}
.masse-eski-spa .gsp-collections__header{text-align: center;
margin-bottom: 36px;}
.masse-eski-spa .gsp-collections__title{font-size: 36px;
font-weight: 700;
color: #1a2341;
margin-bottom: 12px;}
@media (max-width: 767px){.masse-eski-spa .gsp-collections__title{font-size: 26px;}}
.masse-eski-spa .gsp-collections__desc{font-size: 16px;
color: #6b7280;
max-width: 520px;
margin: 0 auto;
line-height: 1.7;}
.masse-eski-spa .gsp-coll-card{border-radius: 12px;
overflow: hidden;
background: #ffffff;
box-shadow: 0 4px 16px rgba(26, 35, 65, 0.08);
transition: box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
height: 100%;}
.masse-eski-spa .gsp-coll-card:hover{box-shadow: 0 8px 32px rgba(26, 35, 65, 0.16);
transform: translateY(-4px);}
.masse-eski-spa .gsp-coll-card__link{display: block;
color: inherit;
height: 100%;}
.masse-eski-spa .gsp-coll-card__img-wrap{overflow: hidden;
height: 360px;
background: #ede7dd;}
@media (max-width: 575px){.masse-eski-spa .gsp-coll-card__img-wrap{height: 280px;}}
.masse-eski-spa .gsp-coll-card__img-wrap img{width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;}
.masse-eski-spa .gsp-coll-card:hover .gsp-coll-card__img-wrap img{transform: scale(1.04);}
.masse-eski-spa .gsp-coll-card__info{padding: 14px 18px 18px;
display: flex;
flex-direction: column;
gap: 4px;}
.masse-eski-spa .gsp-coll-card__name{font-size: 14px;
font-weight: 700;
color: #1a2341;
line-height: 1.3;
display: block;}
.masse-eski-spa .gsp-coll-card__sub{font-size: 12px;
color: #6b7280;
line-height: 1.5;
display: block;}
.masse-eski-spa .gsp-swiper{overflow: visible;
padding-bottom: 8px;}
.masse-eski-spa .gsp-swiper .swiper-wrapper{align-items: stretch;}
.masse-eski-spa .gsp-swiper .swiper-slide{height: auto;
width: 280px;}
@media (max-width: 575px){.masse-eski-spa .gsp-swiper .swiper-slide{width: 240px;}}
.masse-eski-spa .gsp-swiper-nav{display: flex;
align-items: center;
justify-content: center;
gap: 20px;
margin-top: 28px;}
.masse-eski-spa .gsp-nav-btn{width: 44px;
height: 44px;
border-radius: 50%;
border: 2px solid #1a2341;
background: transparent;
color: #1a2341;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
flex-shrink: 0;}
.masse-eski-spa .gsp-nav-btn svg{display: block;}
.masse-eski-spa .gsp-nav-btn:hover{background: #1a2341;
color: #ffffff;}
.masse-eski-spa .gsp-nav-btn:disabled{opacity: 0.3;
cursor: default;
pointer-events: none;}
.masse-eski-spa .gsp-dots{display: flex;
align-items: center;
gap: 6px;}
.masse-eski-spa .gsp-dots .swiper-pagination-bullet{width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(26, 35, 65, 0.12);
opacity: 1;
cursor: pointer;
display: block;
transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.masse-eski-spa .gsp-dots .swiper-pagination-bullet-active{background: #1a2341;
transform: scale(1.35);}
.masse-eski-spa .gsp-showroom{background: #f5f1eb;
padding: 72px 0;}
@media (max-width: 767px){.masse-eski-spa .gsp-showroom{padding: 40px 0;}}
.masse-eski-spa .gsp-showroom__inner{text-align: center;
max-width: 640px;
margin: 0 auto;}
.masse-eski-spa .gsp-showroom__title{font-size: 32px;
font-weight: 700;
color: #1a2341;
margin-bottom: 14px;}
@media (max-width: 767px){.masse-eski-spa .gsp-showroom__title{font-size: 24px;}}
.masse-eski-spa .gsp-showroom__text{font-size: 16px;
line-height: 1.7;
color: #6b7280;
margin-bottom: 16px;}
.masse-eski-spa .gsp-showroom__address{font-size: 14px;
color: #6b7280;
margin-bottom: 28px;}
.masse-eski-spa .gsp-showroom__address svg{color: #1a2341;}
.masse-eski-spa .gsp-showroom__ctas{display: flex;
flex-wrap: wrap;
gap: 14px;
justify-content: center;}
.masse-eski-spa .gsp-inspiration{background: #ede7dd;
padding: 72px 0;}
@media (max-width: 767px){.masse-eski-spa .gsp-inspiration{padding: 40px 0;}}
.masse-eski-spa .gsp-inspiration__title{font-size: 36px;
font-weight: 700;
color: #1a2341;
margin-bottom: 12px;}
@media (max-width: 767px){.masse-eski-spa .gsp-inspiration__title{font-size: 26px;}}
.masse-eski-spa .gsp-inspiration__desc{font-size: 16px;
line-height: 1.7;
color: #6b7280;
max-width: 600px;
margin-bottom: 36px;}
.masse-eski-spa .gsp-insp-masonry{column-count: 3;
column-gap: 16px;
margin-bottom: 32px;}
@media (max-width: 991px){.masse-eski-spa .gsp-insp-masonry{column-count: 2;
column-gap: 12px;}}
@media (max-width: 575px){.masse-eski-spa .gsp-insp-masonry{column-count: 2;
column-gap: 8px;}}
.masse-eski-spa .gsp-insp-header{margin-bottom: 32px;}
.masse-eski-spa .gsp-insp-item{display: inline-block;
width: 100%;
margin-bottom: 16px;
border-radius: 8px;
overflow: hidden;
background: #ede7dd;
break-inside: avoid;}
@media (max-width: 575px){.masse-eski-spa .gsp-insp-item{margin-bottom: 8px;}}
.masse-eski-spa .gsp-insp-item img{width: 100%;
height: auto;
display: block;
transition: transform 0.6s ease;}
.masse-eski-spa .gsp-insp-item:hover img{transform: scale(1.04);}
.masse-eski-spa .gsp-insp-item--hidden{display: none;}
.masse-eski-spa .gsp-insp-item--hidden.gsp-insp-item--shown{display: inline-block;}
.masse-eski-spa .gsp-insp-more{text-align: center;
margin-top: 8px;}
.masse-eski-spa .gsp-contact{background: #1a2341;
padding: 72px 0;}
@media (max-width: 767px){.masse-eski-spa .gsp-contact{padding: 48px 0;}}
.masse-eski-spa .gsp-contact__inner{text-align: center;}
.masse-eski-spa .gsp-contact__title{font-size: 40px;
font-weight: 700;
color: #ffffff;
margin-bottom: 28px;}
@media (max-width: 767px){.masse-eski-spa .gsp-contact__title{font-size: 28px;}}
.masse-eski-spa .gsp-contact .gsp-btn--dark{background: #ffffff;
color: #1a2341;
border-color: #ffffff;}
.masse-eski-spa .gsp-contact .gsp-btn--dark:hover{background: #f5f1eb;
border-color: #f5f1eb;}
.masse-eski-spa .gsp-modal{position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;}
.masse-eski-spa .gsp-modal[hidden]{display: none;}
.masse-eski-spa .gsp-modal__backdrop{position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.85);
cursor: pointer;}
.masse-eski-spa .gsp-modal__box{position: relative;
z-index: 1;
width: 92vw;
max-width: 1000px;
background: #0d0f17;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 32px 80px rgba(0, 0, 0, 0.5);}
.masse-eski-spa .gsp-modal__close{position: absolute;
top: 10px;
right: 10px;
z-index: 2;
width: 40px;
height: 40px;
border: none;
background: rgba(255, 255, 255, 0.12);
border-radius: 50%;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: background 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.masse-eski-spa .gsp-modal__close:hover{background: rgba(255, 255, 255, 0.25);}
.masse-eski-spa .gsp-modal__video{display: block;
width: 100%;
height: auto;
min-height: 300px;
background: #000;}

/* --- 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;}

/* Mobil: menü hizası 12..378 @390 (canlıda 8px) */
@media (max-width:767px){.masse-eski-spa .gsp-root .container{padding-left:12px;padding-right:12px;}}