/*
Theme Name: Astra for Estelle Bertrand Shiatsu
Template: astra
Author: Pixdev
Description: Astra Theme Child for Estelle Bertrand Shiatsu
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/**
 * AC 02-12-2025
 * Identité visuelle
 */

/* Couleurs */

:root {
  --color-header: #ee907f;
  --color-rose-clair: #e5b0b5;
  --color-rose-fonce: #c03e53;
  --color-marron: #d18245;
  --color-framboise: #c13e52;
  --color-bleu: #418c9e;
}

/* Fonts */

@font-face {
  font-family: "avenir_next_regular";
  src: url("./fonts/avenirnext-regular.woff2") format("woff2"),
    url("./fonts/avenirnext-regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "avenir_next_bold";
  src: url("./fonts/avenirnext-bold.woff2") format("woff2"),
    url("./fonts/avenirnext-bold.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "avenir_next_demi_bold";
  src: url("./fonts/avenirnext-demibold.woff2") format("woff2"),
    url("./fonts/avenirnext-demibold.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "avenir_next_demi_bold_italic";
  src: url("./fonts/avenirnext-demibolditalic.woff2") format("woff2"),
    url("./fonts/avenirnext-demibolditalic.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "avenir_next_italic";
  src: url("./fonts/avenirnext-italic.woff2") format("woff2"),
    url("./fonts/avenirnext-italic.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

html,
body,
* {
  font-family: "avenir_next_regular", Arial, Helvetica, sans-serif;
  font-size: 1rem;
  color: black;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "avenir_next_demi_bold", Arial, Helvetica, sans-serif;
}

h2 {
  text-transform: uppercase;
}

/* Header */
.site-header {
  top: 0;
  position: sticky;
}
.ast-primary-header-bar {
  background-color: var(--color-header);
}
.main-header-menu > .menu-item > .menu-link {
  font-family: "avenir_next_demi_bold", Arial, Helvetica, sans-serif;
  color: white;
  font-size: 1.5rem;
}

/* Blocs .section */
.section {
  margin-top: 60px;
}

/* Bloc #leshiatsu */

.text-rouge {
  margin: 20px 0 !important;
}

.text-rouge > p,
.text-rouge > p.p1 {
  font-family: "avenir_next_demi_bold", Arial, Helvetica, sans-serif;
  color: var(--color-framboise) !important;
  margin-bottom: 0 !important;
}

.rond {
  width: 200px !important;
  height: 200px !important;
  border-radius: 100px !important;
}
.rond > div {
  display: flex;
  align-items: center;
  justify-content: center;
}

.with-triangle {
  max-height: 320px;
}
.with-triangle h3.p1 {
  margin-bottom: 10px !important;
}
.with-triangle p.p2 {
  margin: 0 !important;
}
.triangle {
  width: 0px !important;
  height: 0px !important;
  border-style: solid;
  border-width: 160px 0 160px 80px;
  border-color: transparent transparent transparent var(--color-rose-clair);
  transform: rotate(0deg);
  padding: 0 !important;
  margin: 0 !important;
}

.shiatsu-list {
  padding: 0 20% !important;
}
.shiatsu-list ul,
.shiatsu-list-2 ul {
  list-style: none;
  padding: 0;
}
.shiatsu-list li:before,
.shiatsu-list-2 li:before {
  position: relative;
  top: 1px;
  display: inline-block;
  content: "✔";
  margin-right: 6px;
}

/* RDV */
#rdv .elementor-widget-text-editor p,
#rdv .elementor-widget-text-editor strong,
#rdv .elementor-widget-text-editor span,
#rdv .elementor-widget-text-editor a {
  color: black;
}
#rdv .elementor-widget-text-editor a {
  text-decoration: none;
}
#rdv .elementor-widget-text-editor a:hover {
  text-decoration: underline;
}

/* Contact */
#contact h2 {
  color: var(--color-header);
}
.wpcf7-form label {
  font-size: 1.2rem;
}

/* Boutons */
.elementor-widget-button .elementor-button {
  background-color: var(--color-marron);
  border-radius: 10px;
  padding: 20px 40px;
}
.elementor-widget-button .elementor-button:hover {
  background-color: var(--color-bleu);
}
.elementor-widget-button .elementor-button span {
  font-family: "avenir_next_demi_bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  color: white;
}
#rdv .elementor-widget-button .elementor-button {
  padding: 20px 40px;
}
#rdv .elementor-widget-button .elementor-button span {
  color: var(--color-bleu);
}
.wpcf7-form p:last-of-type {
  display: block;
  width: 100%;
  text-align: center !important;
}
.wpcf7-form input[type="submit"] {
  background-color: var(--color-header);
  border-radius: 10px;
  padding: 20px 40px;
  font-family: "avenir_next_demi_bold", Arial, Helvetica, sans-serif;
  font-size: 1.2rem;
  color: white;
}

/* Scroll to top */
#ast-scroll-top {
  background-color: var(--color-header);
  color: white;
}
#ast-scroll-top .ast-icon.icon-arrow svg {
  color: white;
  fill: white;
}

/* Mobile */
[data-section="section-header-mobile-trigger"]
  .ast-button-wrap
  .mobile-menu-toggle-icon
  .ast-mobile-svg {
  fill: white;
}
@media (max-width: 921px) {
  .ast-builder-menu-mobile .main-navigation .main-header-menu,
  .ast-builder-menu-mobile
    .main-navigation
    .main-header-menu
    .menu-item
    > .menu-link {
    background-color: var(--color-framboise);
    color: white;
  }
  #first:before {
    background-position: top center;
    margin-top: 230px;
  }
  #portrait img {
    height: 100%;
  }
  #leshiatsu {
    padding: 20px;
  }
  #leshiatsu > div {
    padding: 0;
  }
  #leshiatsu h2 {
    text-align: center;
    margin: 0 20px;
  }
  #mains {
    flex-direction: column;
    gap: 0;
    height: auto;
  }
  .with-triangle {
    max-height: none;
    gap: 0 !important;
  }
  .with-triangle h3.p1 {
    margin-bottom: 10px !important;
  }
  .with-triangle p.p2 {
    margin: 0 !important;
  }
  .with-triangle > div:last-child {
    padding: 0;
  }
  .triangle {
    width: 0px !important;
    height: 0px !important;
    border-style: solid;
    border-width: 60px 160px 0 160px;
    border-color: var(--color-rose-clair) transparent transparent transparent;
    transform: rotate(0deg);
    padding: 0 !important;
    margin: 0 !important;
  }
  .shiatsu-list {
    padding: 20px !important;
  }
  #rdv-1 {
    margin: 0;
  }
  #rdv-1 > div {
    margin: 0;
  }
  #rdv-1-photo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    max-height: 200px;
  }
  #rdv-1-photo:before {
    width: 100%;
    height: 100%;
  }
  #rdv-1-button {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
  }
  #seance {
    padding: 10px;
  }
  #seance h2 {
    margin-left: 10px;
    width: 70%;
  }
  #seance .elementor-absolute {
    top: 10px;
    right: 10px;
  }
  .wpcf7-form p:last-of-type {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-align: center !important;
  }
}