/*
Theme Name: CMindful
Theme URI: https://cmindful.com
Author: Gema
Description: Tema de bloques para el acompañamiento consciente de CMindful. Diseñado para editar páginas, contenidos y estilos desde WordPress.
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: cmindful
*/

:root {
  --cmindful-olive: #7e9f2a;
  --cmindful-teal: #006469;
  --cmindful-rose: #b92d5d;
  --cmindful-cream: #fffaf0;
  --cmindful-green: #00491f;
  --cmindful-coral: #ffb68e;
  --cmindful-lime: #d8ef70;
}

.wp-site-blocks {
  overflow: clip;
}

.cmindful-header {
  background: var(--cmindful-olive);
  color: #fff;
}

.cmindful-header .wp-block-navigation-item__content,
.cmindful-header .wp-block-site-title a {
  color: #fff;
  font-weight: 700;
}

.cmindful-header .wp-block-site-logo img {
  max-height: 46px;
  width: auto;
}

.cmindful-hero {
  position: relative;
  isolation: isolate;
  min-height: min(760px, calc(100svh - 72px));
  display: grid;
  place-items: center;
  padding: clamp(6rem, 12vw, 10rem) 1.5rem;
  color: #fff;
  text-align: center;
  background: #31502c url('./assets/images/cmindful-curtain-home-background.jpg') center/cover no-repeat;
}

.cmindful-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(125deg, rgba(0, 73, 31, .72), rgba(0, 100, 105, .42) 48%, rgba(126, 159, 42, .48));
}

.cmindful-hero__inner {
  width: min(760px, 100%);
  display: grid;
  justify-items: center;
  gap: 1.2rem;
}

.cmindful-hero__wordmark {
  width: min(365px, 72vw);
  height: auto;
  filter: brightness(0) invert(1) grayscale(1);
  mix-blend-mode: screen;
}

.cmindful-hero__eyebrow {
  margin: 0;
  color: var(--cmindful-lime);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.cmindful-hero h1 {
  max-width: 24ch;
  margin: 0;
  color: #fff;
  font-size: clamp(2.3rem, 5vw, 4.6rem);
  font-weight: 800;
  letter-spacing: -.055em;
  line-height: .99;
}

.cmindful-hero__lead {
  max-width: 39rem;
  margin: 0;
  color: #fff;
  font-size: clamp(1rem, 1.6vw, 1.16rem);
  font-weight: 650;
  line-height: 1.6;
}

.cmindful-button-group {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .8rem;
  margin-top: 1.35rem;
}

.cmindful-button,
.wp-block-button .wp-block-button__link {
  border-radius: 999px;
  font-weight: 800;
  transition: transform 160ms cubic-bezier(.23, 1, .32, 1), box-shadow 160ms cubic-bezier(.23, 1, .32, 1), filter 160ms cubic-bezier(.23, 1, .32, 1);
}

.cmindful-button:hover,
.wp-block-button .wp-block-button__link:hover {
  filter: brightness(1.08);
  box-shadow: 0 12px 26px rgba(0, 0, 0, .24);
  transform: translateY(-2px);
}

.cmindful-button:active,
.wp-block-button .wp-block-button__link:active {
  transform: scale(.97);
}

.cmindful-page-intro {
  background: linear-gradient(135deg, #fff8ed, #f1f7dc 58%, #dbecb3);
}

.cmindful-page-intro .wp-block-cover__background {
  background: linear-gradient(135deg, rgba(0, 73, 31, .88), rgba(0, 100, 105, .65)) !important;
}

.cmindful-feature-card {
  height: 100%;
  border: 1px solid rgba(0, 73, 31, .12);
  border-radius: 1.5rem;
  box-shadow: 0 14px 38px rgba(38, 74, 38, .09);
}

.cmindful-feature-card .wp-block-group {
  height: 100%;
}

.cmindful-faq .wp-block-details {
  border-bottom: 1px solid rgba(0, 73, 31, .18);
  padding: 1rem 0;
}

.cmindful-faq summary {
  cursor: pointer;
  color: var(--cmindful-green);
  font-weight: 800;
}

.cmindful-footer {
  background: var(--cmindful-olive);
  color: #fff;
}

.cmindful-footer a,
.cmindful-footer .wp-block-site-title a {
  color: #fff;
}

.cmindful-footer .wp-block-site-title a {
  text-decoration: none;
}

.cmindful-post-meta {
  color: #526451;
  font-size: .84rem;
  font-weight: 700;
}

@media (max-width: 640px) {
  .cmindful-hero {
    min-height: 650px;
    padding-inline: 1.1rem;
  }

  .cmindful-button-group,
  .cmindful-button-group .wp-block-button {
    width: 100%;
  }

  .cmindful-button-group .wp-block-button__link {
    display: block;
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cmindful-button,
  .wp-block-button .wp-block-button__link {
    transition: none;
  }
}