:root{
--dz-bg: #fefaf6;
--dz-card: #f8f4f0;
--dz-text: #3a2e28;
--dz-accent: #c86e2d;
--dz-border: #d7c8bc;
--dz-shadow: 0 4px 12px rgba(0,0,0,.12);
} html { scroll-behavior: smooth; }
.dz-service-card{ position: relative; }
.dz-stretch-link{
position: absolute;
inset: 0;
z-index: 1; border-radius: 12px;
} .dz-fullbleed{
width: 100vw !important;
max-width: 100vw !important;
margin-left: calc(50% - 50vw) !important;
margin-right: calc(50% - 50vw) !important;
} .dz-fullbleed.alignwide,
.dz-fullbleed.alignfull{
max-width: 100vw !important;
} .dz-service-card__cta,
.dz-service-card__link{
position: relative;
z-index: 2;
}
.dz-section{
padding: 3rem 2rem;
background-color: var(--dz-bg);
font-family: 'Marcellus', serif;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
margin: 4rem auto;
}
.dz-card {
max-width: 900px;
margin: 2rem auto;
padding: 2rem;
background: var(--dz-card);
border: 1px solid var(--dz-border);
border-radius: 12px;
box-shadow: var(--dz-shadow);
}
.dz-h1, .dz-h2, .dz-h3 { color: var(--dz-accent); text-align:center; margin: 0 0 1rem; }
.dz-lead { text-align:center; font-size: 1.1rem; margin-bottom: 1.75rem; } .dz-slider { position: relative; overflow: hidden; }
.dz-slider__track {
display: flex;
gap: 1rem;
transition: transform .6s ease;
will-change: transform;
}
.dz-slide {
min-width: 100%;
box-sizing: border-box;
}
@media (min-width: 900px){ .dz-carousel .dz-slide { min-width: calc(50% - .5rem); }
}
.dz-controls {
display:flex;
justify-content:center;
gap: .75rem;
margin-top: 1rem;
}
.dz-btn {
border: 1px solid var(--dz-border);
background: #fff;
padding: .5rem .75rem;
border-radius: 999px;
cursor: pointer;
}
.dz-dots { display:flex; gap:.4rem; justify-content:center; margin-top:.75rem; }
.dz-dot {
width:10px; height:10px; border-radius:50%;
border:1px solid var(--dz-border);
background:#fff; cursor:pointer;
}
.dz-dot.is-active { background: var(--dz-accent); border-color: var(--dz-accent); } .dz-hero{ width: 100%;
min-height: 70vh;
position: relative;
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/05/header-experience-the-ultimate-scaled.jpg);
background-size: cover;
background-position: center;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
} @media (min-width: 1024px){
.dz-hero{ background-attachment: fixed; }
}
.dz-hero__overlay{
position:absolute; inset:0;
background: rgba(32,24,16,.5);
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding: 1rem;
color:#f5f1ee;
}
.dz-hero__inner{
max-width: 1000px;
margin: 0 auto;
}
.dz-hero__title{
font-size: clamp(2rem, 4vw, 3rem);
margin: 0 0 1rem;
font-family: Georgia, serif;
}
.dz-hero__lead{
font-size: 1.25rem;
margin: 0 0 2rem;
}
.dz-btn{
display:inline-block;
text-decoration:none;
border-radius: 999px;
padding: .75rem 2rem;
font-weight: 700;
}
.dz-btn--primary{
background: rgba(251,154,68,.3);
color: #fff;
transition: background .3s ease;
}
.dz-btn--primary:hover{
background: rgba(251,154,68,.45);
} .dz-fade{
background-color: var(--dz-bg);
color: var(--dz-text);
padding: 3rem 2rem;
min-height: 190px;
}
.dz-fade__slide{
display: none;
opacity: 0;
transition: opacity 1.2s ease-in-out;
padding-top: 1rem;
box-sizing: border-box;
}
.dz-fade__slide.is-active{
display: block;
opacity: 1;
}
.dz-fade__quote{
font-size: 1.2rem;
font-style: italic;
margin: 0 auto 2px;
max-width: 600px;
padding: 1rem;
text-align: center;
background-color: #fbfbfb;
box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.25);
border-radius: 10px;
}
.dz-fade__rating{
text-align: center;
font-size: 1rem;
color: #c4a484;
margin: .75rem 0 .25rem;
}
.dz-fade__cite{
display: block;
text-align: center;
font-weight: bold;
color: #c4a484;
margin-bottom: 1rem;
}
.dz-card{
padding: 3rem 2rem;
margin: 4rem auto;
background: var(--dz-card);
font-family: 'Marcellus', serif;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
border-radius: 12px;
} .dz-cta{
position: relative;
height: 400px;
width: 100%;
background-size: cover;
background-position: center;
} .dz-cta{
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
width: 100vw;
} .dz-cta--stamps{
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/05/cta2-massage.jpg);
}
.dz-cta__overlay{
position: absolute;
inset: 0;
background-color: rgba(32, 24, 16, 0.5);
}
.dz-cta__inner{
position: relative;
z-index: 2;
height: 100%;
display: flex;
align-items: center;
}
.dz-cta__box{
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(6px);
border-radius: 12px;
padding: 2rem 1.5rem;
max-width: 390px;
color: #fff;
font-family: 'Marcellus', serif;
}
.dz-cta__title{
margin-top: 0;
font-size: 1.8rem;
color: rgba(251, 154, 68, 0.8);
}
.dz-cta__text{
margin-bottom: 1.5rem;
} .dz-btn--cta{
background-color: rgba(251, 154, 68, 0.85);
color: #fff;
box-shadow: 0 4px 10px rgba(251, 154, 68, 0.3);
transition: all 0.3s ease;
}
.dz-btn--cta:hover{
background-color: rgba(251, 154, 68, 0.95);
transform: translateY(-1px);
} .dz-services{
margin: 4rem auto;
background-color: var(--dz-bg);
font-family: 'Marcellus', serif;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
}
.dz-services__grid{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap: 2rem;
max-width: 1200px;
margin: 0 auto;
} .dz-service-card{
flex: 1 1 250px;
max-width: 360px;
background: #fff;
text-align:center;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,.1);
overflow:hidden;
cursor:pointer;
position:relative;
transition: box-shadow .3s ease-in-out, transform .3s ease-in-out;
}
.dz-service-card:hover{
box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.dz-service-card__image{
height: 300px;
background-size: cover;
background-position: center;
position: relative;
}
.dz-service-card__image::after{
content:'';
position:absolute;
inset:0;
background: rgba(56,56,55,0);
transition: background .4s ease-in-out;
}
.dz-service-card:hover .dz-service-card__image::after{
background: rgba(56,56,55,.3);
}
.dz-service-card__body{
padding: 2rem;
}
.dz-service-card__title{
margin-top: 0;
}
.dz-service-card__link{
display:inline-block;
margin-top: .5rem;
color: #c4a484;
font-weight: 700;
text-decoration: none;
font-size: .95rem;
}
.dz-service-card__link:hover{
text-decoration: underline;
}
.dz-service-card__cta{
margin-top: 1.5rem;
text-align:center;
} .dz-btn--wide{
width: 95%;
text-align: center;
} .dz-service-card__image--oil{
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/05/oil-massage.jpg);
}
.dz-service-card__image--press{
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/07/pressoterapi.jpg);
}
.dz-service-card__image--hotstone{
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/05/Hot-Stone-Massage.jpg);
} .dz-cta--offers{
background-image: url(https://www.dinzen.spa/wp-content/uploads/2025/05/CTA-01h.jpg);
} .dz-stamps{
height: 90%;
overflow: hidden;
margin-left: 1rem;
}
.dz-offers{
height: 90%;
overflow: hidden;
margin-right: 1rem;
}
.dz-deals{
height: 90%;
overflow: hidden;
margin-right: 1rem;
}
.dz-offer{
display: none;
animation: dzFadeIn .8s ease-in-out;
}
.dz-offer.is-active{
display: block;
}
.dz-offer__fomo{
font-size: .95rem;
font-style: italic;
color: #ffd9a0;
margin-top: -0.5rem;
} .dz-offers__btn{
position: absolute;
bottom: .75rem;
right: 1.25rem;
font-size: .85rem;
padding: .4rem .8rem;
border-radius: 999px;
} .dz-offers.dz-cta__box{ position: relative; }
@keyframes dzFadeIn{
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
} .dz-more-services{
margin: 4rem auto;
background-color: var(--dz-bg);
font-family: 'Marcellus', serif;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
}
.dz-hcards{
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
max-width: 1200px;
margin: 0 auto;
padding: 0 1rem;
}
.dz-hcard{
display:flex;
align-items: flex-start;
background: #fff;
border-radius: 12px 12px 0 0; overflow: hidden;
box-shadow: 0 4px 12px rgba(0,0,0,.1);
padding: 1rem;
cursor: pointer;
transition: box-shadow .3s ease-in-out;
position: relative;
}
.dz-hcard:hover{
box-shadow: 0 8px 20px rgba(0,0,0,.2);
}
.dz-hcard__img{
flex-shrink: 0;
width: 120px;
height: 120px;
margin-right: 1rem;
overflow: hidden;
}
.dz-hcard__img img{
width: 100%;
height: 100%;
object-fit: cover;
display:block;
border-radius: 12px; }
.dz-hcard__content{
flex: 1;
display:flex;
flex-direction: column;
}
.dz-hcard__title{
margin: 0 0 .5rem;
font-size: 1.4rem;
}
.dz-hcard__text{
font-size: 1rem;
line-height: 1.5;
margin: 0 0 1rem;
}
.dz-hcard__actions{
display:flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
}
.dz-hcard__link{
color: #c4a484;
font-weight: 700;
text-decoration: none;
font-size: .95rem;
}
.dz-hcard__link:hover{
text-decoration: underline;
}
.dz-hcard__btn{ padding: .5rem 1rem;
border-radius: 8px;
} @media (max-width: 768px){
.dz-hcards{
grid-template-columns: 1fr;
padding: 0 .5rem;
}
.dz-hcard{
max-width: 320px;
margin: 0 auto;
flex-direction: column;
align-items: center;
text-align: center;
padding: 0;
}
.dz-hcard__title{ font-size: 1.8rem; }
.dz-hcard__img{
width: 100%;
height: auto;
max-width: 300px;
margin: 0;
}
.dz-hcard__img img{
width: 100%;
height: auto;
}
.dz-hcard__content{
align-items: center;
padding: 1.5rem;
}
.dz-hcard__actions{
flex-direction: column;
align-items: stretch;
gap: .5rem;
width: 100%;
}
.dz-hcard__btn{
width: 95%;
margin: 0 auto;
}
} .dz-cta--left .dz-cta__inner{ justify-content: flex-start; padding-left: 5vw; padding-right: 0; }
.dz-cta--right .dz-cta__inner{ justify-content: flex-end; padding-right: 5vw; padding-left: 0; } .dz-cta--deal{
background-image: url(https://dinzen.spa/wp-content/uploads/2025/05/cta-massage.jpg);
}
@media (max-width: 768px){
.dz-cta__inner{
justify-content: center;
padding-left: 2rem;
padding-right: 2rem;
margin: auto;
text-align: center;
}
} .dz-treatment-steps{
margin: 4rem auto;
background-color: var(--dz-bg);
font-family: 'Marcellus', serif;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
}
.dz-treatment-steps__intro,
.dz-treatment-steps__outro{
max-width: 750px;
margin: 0 auto 2.5rem;
text-align: center;
color: #5a4a42;
}
.dz-treatment-steps__outro{
margin-top: 2rem;
}
.dz-treatment-steps__grid{
display:flex;
flex-wrap: wrap;
gap: 2rem;
justify-content: center;
max-width: 1000px;
margin: 0 auto;
}
.dz-step{
flex: 1 1 250px;
max-width: 300px;
background-color: #fff;
border-radius: 12px;
padding: 2rem;
box-shadow: 0 4px 12px rgba(0,0,0,.1);
text-align: center;
transition: box-shadow .3s ease;
}
.dz-step:hover{
box-shadow: 0 8px 20px rgba(0,0,0,.2);
}
.dz-step__icon{
font-size: 2.5rem;
margin-bottom: 1rem;
color: #c4a484;
}
.dz-step__title{
margin-top: 0;
color: #3a2e28;
}
.dz-step__text{
color: #5a4a42;
}
.dz-treatment-steps__actions{
display:flex;
justify-content: center;
gap: 1rem;
margin-top: 2rem;
flex-wrap: wrap;
} .dz-treatments{
background-color: var(--dz-bg);
}
.dz-treatments__title{
text-align: center;
color: #c86e2d;
margin: 2rem 0 0.5rem;
}
.dz-treatments__lead{
text-align: center;
font-size: 1.2rem;
margin: 0 auto 2.5rem;
max-width: 900px;
} .dz-treatments__grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
max-width: 1200px;
margin: 0 auto;
padding: 2rem;
font-family: 'Marcellus', serif;
} .dz-treatment{
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px dashed #ccc;
padding-bottom: 1rem;
gap: 1rem;
}
.dz-treatment__link{
text-decoration: none;
color: inherit;
display: block;
}
.dz-treatment__link:hover{
color: #c4a484;
}
.dz-treatment__info{
display: flex;
align-items: center;
gap: 1rem;
}
.dz-treatment__img{
width: 80px;
height: 80px;
object-fit: cover;
border-radius: 8px;
}
.dz-treatment__text{
max-width: 400px;
}
.dz-treatment__name{
margin: 0 0 0.3rem 0;
font-size: 1.2rem;
color: #3a2e28;
}
.dz-treatment__desc{
margin: 0;
color: #5a4a42;
}
.dz-treatment__price{
font-weight: bold;
font-size: 1.1rem;
white-space: nowrap;
padding-left: 1rem;
display: flex;
align-items: center;
gap: 0.4rem;
color: #3a2e28;
}
.dz-treatment__price-icon{
height: 18px;
} .dz-divider{
text-align: center;
margin: 1rem 0 0;
}
.dz-divider img{
max-width: 100%;
height: auto;
} @media (max-width: 768px){
.dz-treatments__grid{
grid-template-columns: 1fr;
padding: 1rem;
gap: 1.5rem;
}
.dz-treatment{
flex-direction: column;
align-items: flex-start;
}
.dz-treatment__price{
align-self: flex-end;
margin-top: 0.5rem;
padding-left: 0;
} .dz-treatment:hover{
box-shadow: 0 0 12px rgba(0,0,0,.1);
transform: translateY(-2px);
transition: all .2s ease-in-out;
}
} .dz-treatments{
background-color: var(--dz-bg);
}
.dz-treatments__title{
text-align: center;
color: #c86e2d;
margin: 2rem 0 0.5rem;
}
.dz-treatments__lead{
text-align: center;
font-size: 1.2rem;
margin: 0 auto 2.5rem;
max-width: 900px;
} .dz-treatments__grid{
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
max-width: 1200px;
margin: 0 auto;
padding: 2rem;
font-family: 'Marcellus', serif;
} .dz-treatment{
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px dashed #ccc;
padding-bottom: 1rem;
gap: 1rem;
}
.dz-treatment__link{
text-decoration: none;
color: inherit;
display: block;
}
.dz-treatment__link:hover{
color: #c4a484;
}
.dz-treatment__info{
display: flex;
align-items: center;
gap: 1rem;
}
.dz-treatment__img{
width: 80px;
height: 80px;
object-fit: cover;
border-radius: 8px;
}
.dz-treatment__text{
max-width: 400px;
}
.dz-treatment__name{
margin: 0 0 0.3rem 0;
font-size: 1.2rem;
color: #3a2e28;
}
.dz-treatment__desc{
margin: 0;
color: #5a4a42;
}
.dz-treatment__price{
font-weight: bold;
font-size: 1.1rem;
white-space: nowrap;
padding-left: 1rem;
display: flex;
align-items: center;
gap: 0.4rem;
color: #3a2e28;
}
.dz-treatment__price-icon{
height: 18px;
} .dz-divider{
text-align: center;
margin: 1rem 0 0;
}
.dz-divider img{
max-width: 100%;
height: auto;
} @media (max-width: 768px){
.dz-treatments__grid{
grid-template-columns: 1fr;
padding: 1rem;
gap: 1.5rem;
}
.dz-treatment{
flex-direction: column;
align-items: flex-start;
}
.dz-treatment__price{
align-self: flex-end;
margin-top: 0.5rem;
padding-left: 0;
} .dz-treatment:hover{
box-shadow: 0 0 12px rgba(0,0,0,.1);
transform: translateY(-2px);
transition: all .2s ease-in-out;
}
} .dz-article {
background: #fefaf6;
padding: 3rem 2rem;
margin: 4rem auto;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
.dz-article__header {
text-align: center;
max-width: 900px;
margin: 0 auto 2rem;
}
.dz-article__content {
max-width: 900px;
margin: 0 auto;
line-height: 1.7;
color: #3a2e28;
}
.dz-h1,
.dz-h3 {
color: #c86e2d;
margin-top: 2rem;
}
.dz-link {
color: #c86e2d;
text-decoration: underline;
}
.dz-link:hover {
opacity: 0.85;
}
.dz-list {
margin: 1rem 0 1.5rem;
padding-left: 1.25rem;
}
.dz-callout {
margin-top: 2rem;
padding: 1.25rem 1.25rem;
background: rgba(255, 255, 255, 0.6);
border: 1px solid #e7d7cc;
border-radius: 12px;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
} .dz-history { background: #fefaf6; box-shadow: 0 4px 12px rgba(0,0,0,.2); padding: 3rem 2rem; }
.dz-prose { max-width: 900px; margin: 0 auto; }
.dz-prose p { line-height: 1.75; margin: 0 0 1.1rem; color: #3a2e28; }
.dz-center { text-align: center; }
.dz-accent { color: #c86e2d; }
.dz-dropcap-title { color: #c86e2d; font-size: 21px; }
.dz-lead { font-size: 1.2rem; margin: 0.75rem auto 2.5rem; max-width: 900px; color: #3a2e28; } .dz-contact-intro {
background: #fefaf6;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
padding: 3rem 2rem;
} .dz-card.dz-review{
max-width: 800px;
margin: 2rem auto;
padding: 2rem;
background: var(--dz-card);
border-radius: 12px;
border: 1px solid #ccc;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
} .dz-form__row {
display: flex;
gap: 1rem;
flex-wrap: wrap;
margin-bottom: 1rem;
}
.dz-input,
.dz-select,
.dz-textarea {
width: 100%;
background-color: #fff;
padding: 0.25rem;
border-radius: 8px;
border: 1px solid #ccc;
font-size: 1rem;
font-family: inherit;
box-sizing: border-box;
}
.dz-form__row .dz-input {
flex: 1 1 240px;
background-color: #fff;
}
.dz-label {
font-weight: 700;
display: inline-block;
margin-bottom: 0.25rem;
}
.dz-form__field {
margin-bottom: 1rem;
}
.dz-captcha .dz-input{
margin-bottom: 1rem;
background-color: #fff;
}
.dz-form__notice {
margin-top: 1rem;
padding: 1rem;
background: #f8f4f0;
border-radius: 10px;
text-align: center;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
color: #3a2e28;
opacity: 0;
transform: translateY(10px);
transition: opacity .4s ease, transform .4s ease;
}
.dz-form__notice.is-visible {
opacity: 1;
transform: translateY(0);
}
.dz-card--narrow { max-width: 800px; margin: 2rem auto; }
.dz-form__row { display:flex; gap:1rem; flex-wrap:wrap; }
.dz-input, .dz-select, .dz-textarea { width:100%; }
.dz-form__msg { margin-top: 1rem; padding: 1rem; border-radius: 10px; background: #f8f4f0; text-align:center; }
.dz-map__wrap { max-width: 1000px; margin: 2rem auto; border-radius: 12px; overflow:hidden; box-shadow: 0 4px 12px rgba(0,0,0,.2); }
.dz-map__wrap iframe { width:100%; height:500px; border:0; display:block; }
.dz-map {
padding: 3rem 2rem;
background-color: #fefaf6;
}
.dz-map__title {
text-align: center;
font-family: 'Marcellus', serif;
color: #c86e2d;
font-size: 2rem;
margin-bottom: 2rem;
}
#zen-map {
width: 100%;
height: 500px;
max-width: 1200px;
margin: 0 auto;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,.2);
} .dz-terms { padding: 2.5rem 1rem; }
.dz-terms__header { text-align: center; margin: 0 auto 1.5rem; max-width: 900px; }
.dz-terms__card { max-width: 900px; margin: 0 auto; padding: 2rem; }
.dz-terms .dz-h1, .dz-h2 {
margin-top: 1.5rem;
color: var(--dz-accent, #c86e2d); }
.dz-muted { opacity: .75; margin: .25rem 0 0; }
.dz-link { color: var(--dz-accent, #c86e2d); text-decoration: underline; }
.dz-link:hover { text-decoration: none; } .dz-legal__header {
position: relative;
max-width: 850px;
margin: 0 auto 2rem;
}
.dz-legal{
padding: 2rem 1rem;
background-color: var(--dz-bg);
font-family: marcellus, serif;
box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
}
.dz-legal__box{
max-width: 850px;
margin: 0 auto;
background-color: var(--dz-bg);
border: 1px solid var(--dz-border);
border-radius: 16px;
box-shadow: 0 6px 20px rgba(0,0,0,.08);
padding: 2rem 2.5rem;
font-family: 'Marcellus', serif;
color: #333;
line-height: 1.65;
}
.dz-legal__title{
font-size: 2rem;
text-align: center;
margin: 0;
color: #c86e2d;
}
.dz-legal__meta{
margin: 0 0 1.25rem;
opacity: .8;
position: absolute;
top: 0;
right: 0;
font-size: 0.85rem;
color: #7a6a60;
}
.dz-legal__h{
margin: 1.5rem 0 .5rem;
font-size: 1.2rem;
color: #bb5e1f;
}
.dz-legal a{
color: #c86e2d;
text-decoration: underline;
}
.dz-legal a:hover{
text-decoration: none;
}
@media (max-width: 768px){
.dz-legal__box{ padding: 1.5rem; }
.dz-legal__title{ font-size: 1.6rem; }
}
@media (max-width: 600px) {
.dz-legal__meta {
position: static;
text-align: center;
margin-top: 0.5rem;
}
}