/*
Theme Name: NeoSelf
Theme URI: https://neoself.fr
Author: NeoSelf
Description: Theme officiel NeoSelf — fitness, nutrition, IA & coaching. Boutique custom (sans WooCommerce), pilotee par api/ + cart.js.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: neoself
*/

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;700&display=swap');

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',sans-serif;background:#0B0B0A;color:#0B0B0A;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%}
a{color:#1E55FF;text-decoration:none}
a:hover{color:#0D3FE0}
::selection{background:#1E55FF;color:#fff}
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:#0B0B0A}
::-webkit-scrollbar-thumb{background:#3A3A36;border-radius:8px;border:3px solid #0B0B0A}
::-webkit-scrollbar-thumb:hover{background:#53534E}

@keyframes ns-aurora{0%{transform:translate(0,0) scale(1)}33%{transform:translate(6%,-8%) scale(1.15)}66%{transform:translate(-7%,6%) scale(.92)}100%{transform:translate(0,0) scale(1)}}
@keyframes ns-aurora2{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-9%,7%) scale(1.2)}100%{transform:translate(0,0) scale(1)}}
@keyframes ns-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
@keyframes ns-floatslow{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-22px) rotate(2deg)}}
@keyframes ns-spin{to{transform:rotate(360deg)}}
@keyframes ns-pulse{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}

/* reveal on scroll (fallback: visible si JS off) */
.ns-js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.16,.84,.44,1),transform .7s cubic-bezier(.16,.84,.44,1)}
.ns-js [data-reveal].ns-in{opacity:1;transform:none}

.ns-burger{display:none}
@media (max-width:1080px){.ns-hide-mob{display:none!important}.ns-burger{display:inline-flex!important}#ns-nav{padding-left:20px!important;padding-right:20px!important}}
@media (max-width:1080px){.ns-nav-cta{display:none!important}}
#ns-mobile-menu{opacity:0;visibility:hidden;transition:opacity .3s ease}
#ns-mobile-menu.open{opacity:1;visibility:visible}
#ns-mobile-menu a{opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
#ns-mobile-menu.open a{opacity:1;transform:none}

@media (max-width:920px){
  .ns-hero-grid{grid-template-columns:1fr!important;gap:56px!important}
  .ns-2col{grid-template-columns:1fr!important;gap:40px!important}
  .ns-feat-grid > div{grid-column:span 6!important}
  .ns-price-grid{grid-template-columns:1fr!important}
  .ns-price-feat{transform:none!important}
  .ns-cta-grid{grid-template-columns:1fr!important}
  .ns-foot-grid{grid-template-columns:1fr 1fr!important}
  .ns-disc-grid{grid-template-columns:1fr 1fr!important}
  h1{font-size:52px!important}
}
@media (max-width:600px){
  #devices{padding:76px 18px!important}
  .ns-dev-card{padding:28px 22px!important;min-height:0!important}
  .ns-ring-stage{flex-direction:column!important;min-height:0!important;margin:12px 0 8px!important}
  .ns-ring-stage > img{width:52%!important;max-width:190px!important}
  .ns-ring-mock{position:static!important;right:auto!important;bottom:auto!important;width:150px!important;margin:18px auto 0!important}
  .ns-scale-stage{flex-direction:column!important;min-height:0!important;margin:12px 0 16px!important}
  .ns-scale-stage > img{width:56%!important;max-width:200px!important}
  .ns-scale-mocks{position:static!important;right:auto!important;bottom:auto!important;justify-content:center!important;margin-top:16px!important}
  .ns-scale-mocks > div{transform:none!important;margin:0 5px!important}
}
@media (max-width:720px){
  #features{padding:80px 20px!important}
  .ns-feat-grid{gap:14px!important}
  .ns-feat-card{padding:28px!important;min-height:0!important}
  .ns-feat-flex{flex-direction:column!important;align-items:flex-start!important;gap:24px!important}
  .ns-feat-shot{align-self:center!important}
  .ns-chart-wrap{width:100%!important;max-width:420px!important}
}
@media (max-width:560px){
  .ns-chart-wrap{max-width:none!important}
  [data-bodychart]{padding:18px!important}
  [data-bc-tab]{font-size:10.5px!important}
}
@media (max-width:560px){.ns-feat-grid > div{grid-column:span 6!important;padding:22px!important}h2{font-size:34px!important}.ns-disc-grid{grid-template-columns:1fr!important}#features{padding:60px 16px!important}}


/* ---- Coach & Ambassadeur pages ---- */
@keyframes ns-aurora2{0%{transform:translate(0,0) scale(1)}50%{transform:translate(8%,-6%) scale(1.2)}100%{transform:translate(0,0) scale(1)}}
@keyframes ns-floatb{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-18px) rotate(1.5deg)}}
@keyframes ns-shimmer{to{background-position:200% center}}
@media (max-width:960px){
  .c-hide,.a-hide{display:none!important}
  .c-2,.a-2{grid-template-columns:1fr!important}
  .c-price{grid-template-columns:1fr 1fr!important}
  .c-ben{grid-template-columns:1fr!important}
  .a-gain{grid-template-columns:1fr 1fr!important}
  .a-steps{grid-template-columns:1fr!important}
  .a-prof{grid-template-columns:1fr 1fr!important}
  .a-track{grid-template-columns:1fr!important}
}
@media (max-width:600px){
  .c-price,.a-gain,.a-prof{grid-template-columns:1fr!important}
}


/* ---- Home page extras ---- */
@keyframes ns-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ns-blink{0%,100%{opacity:1}50%{opacity:.2}}
@keyframes ns-floatslow{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-22px) rotate(2deg)}}
.ns-disc-grid img{transition:transform .6s cubic-bezier(.2,0,0,1)}
.ns-disc-grid > div:hover img{transform:scale(1.07)}
[data-marquee]:hover{animation-play-state:paused}

/* ---- Boutique : grille produits (neutralise WooCommerce / thème parent) ---- */
.woocommerce ul.products.b-grid,
ul.products.b-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:22px!important;
  margin:0!important;padding:0!important;
  float:none!important;columns:auto!important;width:100%!important;
}
.woocommerce ul.products.b-grid li.product,
ul.products.b-grid li.product{
  width:100%!important;max-width:100%!important;min-width:0!important;
  float:none!important;clear:none!important;margin:0!important;
  break-inside:avoid!important;
}
.woocommerce ul.products.b-grid li.product::before,
.woocommerce ul.products.b-grid li.product::after{content:none!important;display:none!important}
/* WooCommerce clearfix pseudo-éléments sur le UL : en display:grid ils deviennent des cellules et décalent la grille — on les neutralise */
.woocommerce ul.products.b-grid::before,
.woocommerce ul.products.b-grid::after,
ul.products.b-grid::before,
ul.products.b-grid::after{content:none!important;display:none!important}
@media(max-width:640px){
  .woocommerce ul.products.b-grid,ul.products.b-grid{grid-template-columns:1fr!important}
}

/* ---- Checkout : bascule invité / connecté ---- */
body[data-auth="in"] [data-guest-banner]{display:none!important}
body[data-auth="in"] [data-auth-banner]{display:flex!important}

/* ---- Boutique & fiche produit : responsive mobile ---- */
@media (max-width:820px){
  /* En-tête boutique : masque le badge + les liens texte (garde logo + icônes compte/panier) */
  .ns-shop-hide{display:none!important}
  /* Fiche produit : empile galerie puis infos, retire le sticky */
  .p-grid{grid-template-columns:1fr!important;gap:30px!important}
  .p-grid > div:first-child{position:static!important;top:auto!important}
  /* Réduit les marges latérales du conteneur produit */
  .woocommerce.single-product > div{padding-left:18px!important;padding-right:18px!important;padding-top:92px!important}
  /* Boutique : marges latérales section */
  .ns-shop section{padding-left:18px!important;padding-right:18px!important}
  /* Panier / commande : champs sur une seule colonne */
  .o-two{grid-template-columns:1fr!important}
  /* Panier : articles puis récapitulatif empilés, résumé non-sticky */
  .k-grid{grid-template-columns:1fr!important;gap:18px!important}
  .k-grid aside[data-summary]{position:static!important;top:auto!important}
  /* Panier / commande : marges latérales + espace sous le header fixe */
  .woocommerce.woocommerce-cart > div,
  .woocommerce.woocommerce-checkout > div{padding-left:18px!important;padding-right:18px!important;padding-top:92px!important}
  .woocommerce.woocommerce-cart h1{font-size:30px!important}
  /* Ligne article : image+nom en haut, quantité/prix/suppr. sur une 2e ligne */
  .k-item{flex-wrap:wrap!important;gap:12px 14px!important}
  .k-item > div:nth-child(2){flex:1 1 calc(100% - 98px)!important}
  .k-item > div:nth-child(4){margin-left:auto!important;width:auto!important}
}
@media (max-width:720px){
  .p-specs{grid-template-columns:1fr 1fr!important}
}
@media (max-width:480px){
  .p-specs{grid-template-columns:1fr!important}
  .summary h1{font-size:32px!important}
  .summary .price{font-size:30px!important}
}

/* ---- Champs de formulaire (checkout, connexion, compte) ---- */
.ns-label{display:block;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:600;color:#3A3A36;letter-spacing:.01em;margin:0 0 7px}
.ns-field{display:block;width:100%;height:50px;box-sizing:border-box;border:1.5px solid #E4E4DF;border-radius:12px;padding:0 15px;font-family:'Inter',sans-serif;font-size:15px;line-height:1.2;color:#0B0B0A;background:#fff;outline:none;transition:border-color .18s,box-shadow .18s;-webkit-appearance:none;appearance:none}
.ns-field::placeholder{color:#A8A8A1;opacity:1}
.ns-field:hover{border-color:#D2D2CB}
.ns-field:focus{border-color:#1E55FF;box-shadow:0 0 0 3px rgba(30,85,255,.15)}
select.ns-field{padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2376766F' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
textarea.ns-field{height:auto;min-height:92px;padding:12px 15px;resize:vertical;line-height:1.5}
@media(max-width:820px){
  .rv-grid{grid-template-columns:1fr!important;gap:22px!important}
  .rv-side{position:static!important;top:auto!important}
}

/* ---- Suivi de colis ---- */
.trk-btn:hover{filter:brightness(1.06)}
[data-r-link]:hover{filter:brightness(1.06)}
@media(max-width:640px){
  .trk-fields{grid-template-columns:1fr!important}
  .trk-btn{width:100%!important}
  [data-r-steps] [data-conn]{width:24px!important}
  [data-r-steps] [data-lbl]{font-size:12px!important}
}
.ns-field[type=number]{-moz-appearance:textfield}
.ns-field[type=number]::-webkit-outer-spin-button,.ns-field[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ---- Mon compte : survol cartes + responsive tablette/mobile ---- */
.acct-card{transition:transform .18s ease, box-shadow .18s ease}
.acct-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(11,15,51,.11)}
/* Onglets desktop : pleine largeur, texte aligné à gauche (surcharge le CSS WooCommerce) */
@media (min-width:821px){
  .a-tabs > button, .a-tabs > a{width:100%!important;box-sizing:border-box!important;justify-content:flex-start!important;text-align:left!important;flex:none!important}
}
@media (max-width:920px){
  .a-grid{grid-template-columns:1fr!important;gap:20px!important}
  .a-tabs{flex-direction:row!important;position:static!important;top:auto!important;gap:8px!important;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .a-tabs > button, .a-tabs > a{width:auto!important;flex:0 0 auto!important}
  .a-tabs::-webkit-scrollbar{display:none}
  .a-tabs > button,.a-tabs > a{flex:0 0 auto}
}
@media (max-width:640px){
  .acct{padding:88px 16px 48px!important}
  .a-two{grid-template-columns:1fr!important}
  .acct-head h1{font-size:25px!important}
  .acct-hero{padding:24px 22px!important}
  .acct-stats{gap:26px!important}
}

/* ---- Contact ---- */
.ns-field{border:1px solid #E1E1DC;border-radius:12px;padding:12px 14px;font-family:inherit;font-size:14.5px;color:#0B0B0A;background:#fff;transition:border-color .18s,box-shadow .18s}
.ns-field:focus{outline:none;border-color:#1E55FF;box-shadow:0 0 0 3px rgba(30,85,255,.12)}
.ns-field::placeholder{color:#A3A39C}
@media (max-width:960px){
  .ct-grid{grid-template-columns:1fr!important}
  .ct-grid aside{position:static!important}
  .ct-topics{grid-template-columns:1fr 1fr!important}
  .ct-3{grid-template-columns:1fr 1fr!important}
}
@media (max-width:600px){
  .ct-topics,.ct-2,.ct-3{grid-template-columns:1fr!important}
  #formulaire{padding:60px 18px 80px!important}
  #formulaire form{padding:22px!important}
}

/* ---- Espace ambassadeur ---- */@media (max-width:960px){
  .amb-kpi{grid-template-columns:1fr 1fr!important}
  .amb-two{grid-template-columns:1fr!important}
  .amb-rw{grid-template-columns:1fr 1fr!important}
}
@media (max-width:640px){
  .amb-scale{grid-template-columns:1fr 1fr!important}
  .amb-rw{grid-template-columns:1fr!important}
  .amb-affrow{flex-wrap:wrap}
}
@media (max-width:600px){
  .amb-linkrow{flex-direction:column!important}
  .amb-linkrow button{width:100%}
  .amb-share a{flex:1;justify-content:center}
  [data-amb-chart]{gap:4px!important}
}

/* ---- Bascule connecté / déconnecté ---- */
.ns-auth-in{display:none}
body[data-auth="in"] .ns-auth-in{display:inline-flex}
body[data-auth="in"] .ns-auth-out{display:none}

/* ---- Politique de cookies : tableau responsive ---- */
@media (max-width:700px){
  .ck-tbl{grid-template-columns:1fr!important}
  .ck-tbl>div:nth-child(1),.ck-tbl>div:nth-child(2),.ck-tbl>div:nth-child(3){display:none}
  .ck-tbl>div{border-top:1px solid #F1F1EE!important;padding:9px 14px!important}
  .ck-tbl>div:nth-child(3n+4){padding-top:14px!important;font-size:13.5px!important}
  .ck-tbl>div:nth-child(3n+6){padding-bottom:14px!important;font-size:12.5px!important}
  .ck-tbl>div:nth-child(3n+5),.ck-tbl>div:nth-child(3n+6){border-top:0!important}
}
