/*
Theme Name: Zenkilibre Preproduction
Theme URI: https://preprod.zenkilibre.ch/
Description: Child theme for the Zenkilibre WordPress preproduction site.
Author: Zenkilibre
Template: Divi
Version: 1.0.0
Text Domain: zenkilibre-preprod
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500;1,600&family=DM+Mono:wght@400;500&family=Lato:wght@400;500;600;700&display=swap');

:root {
  --zen-forest-deep: #083923;
  --zen-forest: #105337;
  --zen-ink: #233f31;
  --zen-muted: #60776b;
  --zen-ivory: #faf7f2;
  --zen-linen: #e7ddd0;
  --zen-pale: #e7eee5;
  --zen-pink: #e55288;
  --zen-pink-pale: #f8dce6;
  --zen-line: rgba(16, 83, 55, .16);
}

/* Scope the bespoke layout to new Zenkilibre pages only. */
body:has(.zen-home), body:has(.zen-service) { background: var(--zen-ivory); }
body:has(.zen-home) #main-header,
body:has(.zen-home) #top-header,
body:has(.zen-home) #main-footer,
body:has(.zen-service) #main-header,
body:has(.zen-service) #top-header,
body:has(.zen-service) #main-footer { display: none !important; }
body:has(.zen-home) #page-container,
body:has(.zen-service) #page-container { padding-top: 0 !important; }
body:has(.zen-home) #et-main-area,
body:has(.zen-home) #main-content,
body:has(.zen-home) #main-content .container,
body:has(.zen-home) #content-area,
body:has(.zen-home) article,
body:has(.zen-service) #et-main-area,
body:has(.zen-service) #main-content,
body:has(.zen-service) #main-content .container,
body:has(.zen-service) #content-area,
body:has(.zen-service) article { width: 100% !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
body:has(.zen-home) #main-content .container:before,
body:has(.zen-service) #main-content .container:before { display: none !important; }
body:has(.zen-home) .entry-title,
body:has(.zen-service) .entry-title { display: none !important; }
body:has(.zen-home) .et_pb_post,
body:has(.zen-service) .et_pb_post { margin-bottom: 0 !important; }

.zen-home, .zen-service {
  color: var(--zen-ink);
  background: var(--zen-ivory);
  font-family: Lato, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  overflow: hidden;
}
.zen-home *, .zen-service * { box-sizing: border-box; }
.zen-home a, .zen-service a { color: inherit; text-decoration: none; }
.zen-home img, .zen-service img { max-width: 100%; height: auto; display: block; }
.zen-shell { width: min(1240px, calc(100% - 64px)); margin-inline: auto; }
.zen-eyebrow { color: var(--zen-forest); text-transform: uppercase; letter-spacing: .16em; font: 500 10px/1.4 'DM Mono', monospace; }
.zen-kicker { color: var(--zen-muted); text-transform: uppercase; letter-spacing: .16em; font: 500 10px/1.4 'DM Mono', monospace; }
.zen-title { font: 600 clamp(48px, 7vw, 90px)/.91 'Cormorant Garamond', Georgia, serif; letter-spacing: -.035em; color: var(--zen-forest-deep); margin: 14px 0 0; }
.zen-title em { font-weight: 500; }
.zen-copy { color: var(--zen-muted); max-width: 560px; margin: 22px 0 0; font-size: 17px; }
.zen-btn { display: inline-flex; align-items: center; justify-content: center; gap: 11px; border-radius: 100px; padding: 15px 23px; font: 700 12px/1 Lato, sans-serif; transition: transform .2s ease, background .2s ease; }
.zen-btn:hover { transform: translateY(-2px); }
.zen-btn-primary { color: #fff !important; background: var(--zen-pink); box-shadow: 0 10px 25px rgba(229,82,136,.25); }
.zen-btn-ghost { color: var(--zen-forest) !important; padding-inline: 8px; }
.zen-arrow { font-size: 18px; line-height: 0; }

/* Homepage */
.zen-hero { min-height: 760px; position: relative; color: #fff; background: linear-gradient(137deg, rgba(8,57,35,.86), rgba(26,87,62,.55) 50%, rgba(231,238,229,.70)), radial-gradient(circle at 50% 45%, rgba(255,255,255,.35), transparent 32%), linear-gradient(135deg, #244e3d, #92a99e 55%, #e0d7c8); }
.zen-hero:after { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 70px 70px; opacity: .32; }
.zen-nav { position: relative; z-index: 1; min-height: 86px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.2); }
.zen-nav-logo { width: 49px; height: 49px; border-radius: 50%; background: #fff; padding: 3px; }
.zen-nav-links { display: flex; align-items: center; gap: 27px; font: 500 11px/1 'DM Mono', monospace; letter-spacing: .03em; }
.zen-nav-links a { color: rgba(255,255,255,.94) !important; }
.zen-nav-links .zen-nav-cta { color: var(--zen-forest-deep) !important; background: #fff; padding: 11px 17px; border-radius: 100px; font-family: Lato, sans-serif; font-weight: 700; }
.zen-hero-inner { position: relative; z-index: 1; min-height: 600px; display: grid; place-items: center; text-align: center; padding: 84px 0 124px; }
.zen-hero-content { max-width: 720px; }
.zen-hero-mark { width: 142px; height: 142px; border-radius: 50%; padding: 8px; margin: 0 auto 27px; background: rgba(255,255,255,.93); box-shadow: 0 22px 58px rgba(0,0,0,.18); }
.zen-hero .zen-eyebrow { color: rgba(255,255,255,.9); }
.zen-hero h1 { margin: 8px 0 15px; color: #fff; font: 600 clamp(60px, 9vw, 112px)/.84 'Cormorant Garamond', Georgia, serif; letter-spacing: -.055em; }
.zen-hero p { max-width: 540px; margin: 0 auto; color: rgba(255,255,255,.91); font-size: 17px; }
.zen-hero-actions { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-top: 28px; }
.zen-hero .zen-btn-ghost { color: #fff !important; }
.zen-hero-location, .zen-hero-signature { position: absolute; bottom: 30px; color: rgba(255,255,255,.74); font: 500 9px/1.4 'DM Mono', monospace; text-transform: uppercase; letter-spacing: .12em; }
.zen-hero-location { left: 0; }
.zen-hero-signature { right: 0; }
.zen-section { padding: 132px 0; }
.zen-section-alt { background: var(--zen-pale); }
.zen-section-intro { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 59px; }
.zen-section-intro .zen-copy { margin-bottom: 8px; }
.zen-services { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--zen-line); border-left: 1px solid var(--zen-line); }
.zen-service-card { min-height: 252px; display: flex; flex-direction: column; padding: 28px; border-right: 1px solid var(--zen-line); border-bottom: 1px solid var(--zen-line); background: rgba(255,255,255,.18); transition: background .2s ease; }
.zen-service-card:hover { background: #fff; }
.zen-service-number { color: var(--zen-pink); font: 500 11px/1 'DM Mono', monospace; }
.zen-service-card h3 { color: var(--zen-forest-deep); font: 600 31px/1 'Cormorant Garamond', Georgia, serif; margin: 46px 0 8px; }
.zen-service-card p { color: var(--zen-muted); margin: 0; font-size: 13px; }
.zen-service-meta { display: flex; justify-content: space-between; gap: 12px; padding-top: 22px; margin-top: auto; color: var(--zen-forest); font: 500 10px/1.4 'DM Mono', monospace; }
.zen-reservation { display: grid; grid-template-columns: 1.15fr .85fr; gap: 8vw; align-items: center; }
.zen-reservation-art { min-height: 400px; position: relative; border-radius: 220px 220px 10px 10px; background: linear-gradient(145deg, #d8c8b7, #7e9b8d); overflow: hidden; }
.zen-reservation-art:before { content: ''; position: absolute; inset: 11%; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; }
.zen-reservation-art:after { content: 'Z'; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(255,255,255,.78); font: italic 260px/.8 'Cormorant Garamond', serif; }
.zen-reservation .zen-title { max-width: 510px; }
.zen-review { padding: 42px; border: 1px solid var(--zen-line); background: #fff; }
.zen-review-top { display: flex; justify-content: space-between; align-items: center; color: var(--zen-forest); font: 500 11px/1 'DM Mono', monospace; }
.zen-google { display: inline-grid; place-items: center; width: 26px; height: 26px; color: #fff; background: var(--zen-forest); border-radius: 50%; font: 700 15px/1 Lato, sans-serif; }
.zen-review blockquote { margin: 34px 0 22px; color: var(--zen-ink); font: 500 clamp(23px, 2.5vw, 33px)/1.16 'Cormorant Garamond', Georgia, serif; }
.zen-review cite { color: var(--zen-muted); font: 500 10px/1 'DM Mono', monospace; font-style: normal; text-transform: uppercase; letter-spacing: .1em; }
.zen-about { display: grid; grid-template-columns: .7fr 1.3fr; gap: 9vw; align-items: center; }
.zen-about-motif { width: min(300px, 100%); margin: 0 auto; opacity: .9; }
.zen-contact { background: var(--zen-forest-deep); color: #fff; }
.zen-contact .zen-title { color: #fff; }
.zen-contact .zen-eyebrow, .zen-contact .zen-copy { color: rgba(255,255,255,.72); }
.zen-contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 45px; margin-top: 58px; padding-top: 42px; border-top: 1px solid rgba(255,255,255,.2); }
.zen-contact h3 { margin: 0 0 12px; color: #fff; font: 600 27px/1 'Cormorant Garamond', serif; }
.zen-contact p { margin: 0; color: rgba(255,255,255,.75); font-size: 14px; }
.zen-contact a { color: #fff !important; }
.zen-footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 28px 0; background: var(--zen-forest-deep); border-top: 1px solid rgba(255,255,255,.16); color: rgba(255,255,255,.75); }
.zen-footer img { width: 155px; filter: brightness(0) invert(1); opacity: .92; }
.zen-footer p, .zen-footer a { margin: 0; color: rgba(255,255,255,.76) !important; font-size: 12px; }

/* Service pages */
.zen-service-hero { padding: 0 0 88px; background: linear-gradient(135deg, var(--zen-pale), var(--zen-ivory)); }
.zen-service-bar { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--zen-line); }
.zen-service-brand { display: flex; align-items: center; gap: 12px; color: var(--zen-forest-deep) !important; font: 600 26px/1 'Cormorant Garamond', serif; }
.zen-service-brand img { width: 40px; height: 40px; border-radius: 50%; }
.zen-service-back { color: var(--zen-forest) !important; font: 500 11px/1 'DM Mono', monospace; }
.zen-service-hero-inner { max-width: 850px; padding-top: 110px; }
.zen-service-hero h1 { max-width: 850px; }
.zen-service-lead { max-width: 600px; margin-top: 26px; color: var(--zen-muted); font-size: 18px; }
.zen-service-pills { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 32px; }
.zen-pill { border: 1px solid var(--zen-line); border-radius: 99px; padding: 8px 12px; color: var(--zen-forest); background: rgba(255,255,255,.58); font: 500 10px/1 'DM Mono', monospace; }
.zen-service-content { display: grid; grid-template-columns: 1.5fr .7fr; gap: 10vw; padding: 110px 0; }
.zen-service-content h2 { color: var(--zen-forest-deep); font: 600 43px/1 'Cormorant Garamond', serif; margin: 0 0 19px; }
.zen-service-content p { color: var(--zen-muted); margin: 0 0 17px; font-size: 16px; }
.zen-service-aside { align-self: start; position: sticky; top: 35px; padding: 30px; border-top: 3px solid var(--zen-pink); background: var(--zen-pale); }
.zen-service-aside strong { display: block; color: var(--zen-forest-deep); font: 600 29px/1 'Cormorant Garamond', serif; margin: 10px 0 20px; }
.zen-service-aside p { font-size: 13px; }
.zen-service-footer { padding: 57px 0; color: #fff; background: var(--zen-forest-deep); text-align: center; }
.zen-service-footer h2 { margin: 0 0 17px; color: #fff; font: 600 48px/1 'Cormorant Garamond', serif; }

@media (max-width: 980px) {
  .zen-shell { width: min(100% - 40px, 760px); }
  .zen-nav-links { gap: 15px; }
  .zen-services { grid-template-columns: repeat(2, 1fr); }
  .zen-section { padding: 92px 0; }
  .zen-reservation, .zen-about, .zen-service-content { grid-template-columns: 1fr; gap: 48px; }
  .zen-contact-grid { grid-template-columns: 1fr; gap: 28px; }
  .zen-service-aside { position: static; }
}
@media (max-width: 640px) {
  .zen-shell { width: min(100% - 32px, 540px); }
  .zen-nav { min-height: 70px; }
  .zen-nav-logo { width: 40px; height: 40px; }
  .zen-nav-links a:not(.zen-nav-cta) { display: none; }
  .zen-hero { min-height: 670px; }
  .zen-hero-inner { min-height: 530px; padding: 57px 0 96px; }
  .zen-hero-mark { width: 115px; height: 115px; margin-bottom: 22px; }
  .zen-hero-location { left: 0; font-size: 8px; }
  .zen-hero-signature { display: none; }
  .zen-section { padding: 72px 0; }
  .zen-section-intro { display: block; margin-bottom: 38px; }
  .zen-section-intro .zen-copy { margin-top: 18px; }
  .zen-services { grid-template-columns: 1fr; }
  .zen-service-card { min-height: 207px; }
  .zen-service-card h3 { margin-top: 33px; }
  .zen-reservation-art { min-height: 270px; }
  .zen-contact-grid { margin-top: 42px; }
  .zen-footer { flex-direction: column; align-items: flex-start; }
  .zen-service-hero { padding-bottom: 60px; }
  .zen-service-hero-inner { padding-top: 70px; }
  .zen-service-content { padding: 72px 0; }
}
