/*
 Theme Name:   hello elementor child
 Template:     hello-elementor
 Description:  Enfant de hello elementor
 Author:       Make a wave
 Version:      1.0
 Text Domain:  hello-elementor-child
*/



/* header */
/* Afficher SEULEMENT en mobile (<= 768px) */
/* @media (max-width: 768px) {
  .menu-item.only-mobile{
    display: none !important;
  }
} */




/* page accueil */

h1.makeawave {
    font-size: 12vw !important;
}


.container-link {
  display: block;
  text-decoration: none !important;
  color: inherit;
  width: 100%;
}


/* cards */

.card-click {
    /* padding: 3em 0,7em !important; */
    text-align: center;
}

.card-click h2 {
    /* font-size: 3em !important;
    font-weight: 900 !important; */
    margin-bottom: 40px;
    color: #272524;
}

.card-click .subtitle {
    /* font-size: 1,6em !important;
    font-weight: 600; */
    color: #6D6C6C;
    margin: 2em 0;
    line-height: 1.3;
    font-style: italic;
}

.card-click .description {
    /* font-size: 1,6em !important; */
    line-height: 1.6;
    color: #6D6C6C;
    max-width: 800px;
    margin: 0 auto;
    text-align: justify;
}

/* Version responsive */
@media (max-width: 768px) {
    .card-click {
        padding: 40px 20px;
    }
    
    .card-click h2 {
        font-size: 2.5rem;
    }
    
    .card-click .subtitle {
        font-size: 1.5rem;
    }
    
    .card-click .description {
        font-size: 1.2rem;
    }
}


/* page portfolio */

.antoineW {
  display: inline-block;
  transform: rotate(-90deg); /* tourne ton texte */
  transform-origin: left top; /* point d’ancrage, ajuste selon ton besoin */
}

a.antoine {
    text-decoration: none;
}

/* Burger (≡) + Croix (X) uniquement sur la page Portfolio */
body.page-id-99 .hfe-nav-menu__toggle svg path {
  fill: #FFF7F2 !important;   
  stroke: #FFF7F2 !important; /* sécurité si le SVG utilise stroke */
}

/* page à propos bouton 'contactez-moi'*/

/* Ligne de texte : taille fluide, bon interlettrage */
.cta-line{
  font-size: 1.1em;
  line-height: 1.25;
  letter-spacing: .01em;
  text-wrap: balance;
}

/* Bouton pill “neumorphique” ultra-léger */
.pill-cta{
  --pill-bg: #F5F7FA;             /* fond du pill */
  --pill-fg: #0A0A0A;             /* couleur du texte */
  --shadow-hi: rgba(255,255,255,.85);
  --shadow-lo: rgba(0,0,0,.12);

  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .55em 1.1em;
  margin: 0 .35em;                /* espace dans la phrase */
  border-radius: 9999px;
  background:
    radial-gradient(120% 140% at 50% -40%, #E8EEF6 0%, var(--pill-bg) 60%) /* léger lustre */,
    var(--pill-bg);
  color: var(--pill-fg);
  text-decoration: none !important;          /* pas de soulignement */
  line-height: 1;
  font-weight: 800;               /* effet visuel du mockup */
  box-shadow:
    6px 10px 20px var(--shadow-lo),
   -6px -10px 20px var(--shadow-hi);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  will-change: transform, box-shadow;
}

/* Effet “press-in” au hover/active/focus : le pill s’enfonce */
.pill-cta:hover,
.pill-cta:active{
  box-shadow:
    inset 6px 10px 18px rgba(0,0,0,.12),
    inset -6px -10px 18px rgba(255,255,255,.9);
  transform: translateY(1px);
  filter: saturate(1.02);
}

/* Focus accessible (clavier) */
.pill-cta:focus-visible{
  outline: 2px solid currentColor;
  outline-offset: 3px;
  box-shadow:
    inset 6px 10px 18px rgba(0,0,0,.12),
    inset -6px -10px 18px rgba(255,255,255,.9),
    0 0 0 6px rgba(0,0,0,.06);
}

/* Respecte “réduire les animations” si l’utilisateur l’a demandé */
@media (prefers-reduced-motion: reduce){
  .pill-cta{ transition: none; }
}

/* (Option) Variante fond sombre : adapte automatiquement */
@media (prefers-color-scheme: dark){
  .pill-cta{
    --pill-bg: #101318;
    --pill-fg: #F2F4F7;
    --shadow-hi: rgba(255,255,255,.08);
    --shadow-lo: rgba(0,0,0,.6);
    background:
      radial-gradient(120% 140% at 50% -40%, #1A222C 0%, var(--pill-bg) 60%),
      var(--pill-bg);
  }
}