/* ============================================================
   YOGA HORIZON 06 — Styles 2026
   Moderne · Dynamique · Effets premium · 0 dépendance externe
   ============================================================ */

/* === CUSTOM PROPERTIES === */
:root {
    --sage: #6AAD7A; --sage-dark: #3D7A4D; --sage-light: #E3F0E6;
    --cream: #F6FAF3; --terracotta: #C17A5D; --terracotta-dark: #A85E42;
    --terracotta-light: #F5E6E0; --gold: #D4A853;
    --green: #4A9C5D; --green-dark: #2D5A3A;
    --text: #1E2D22; --text-light: #4A5D4F; --text-muted: #7A8D7F; --white: #FFFFFF;
    --border: rgba(106,173,122,0.18);
    --shadow-sm: 0 2px 12px rgba(45,90,58,0.06);
    --shadow-md: 0 8px 30px rgba(45,90,58,0.10);
    --shadow-lg: 0 20px 60px rgba(45,90,58,0.12);
    --glow-sage: 0 0 30px rgba(106,173,122,0.35);
    --glow-terracotta: 0 0 30px rgba(193,122,93,0.35);
    --radius-sm: 10px; --radius: 16px; --radius-lg: 24px; --radius-pill: 50px;
    --max-width: 1100px; --nav-height: 64px;
    --ease-out-expo: cubic-bezier(0.16,1,0.3,1);
    --ease-out-back: cubic-bezier(0.34,1.56,0.64,1);
}

/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%}
html,body{overflow-x:hidden;overflow-x:clip;max-width:100vw}
body{
    font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
    color:var(--text);background:var(--cream);line-height:1.75;
    -webkit-font-smoothing:antialiased;
    cursor:default;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--sage-dark);text-decoration:none;transition:color 0.3s var(--ease-out-expo)}
a:hover{color:var(--terracotta)}
ul{list-style:none}

/* === SCROLLBAR === */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:var(--sage);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--sage-dark)}

/* === TYPOGRAPHY === */
h1,h2,h3,h4{line-height:1.3;font-weight:700;color:var(--text)}
h1{font-size:clamp(2rem,5vw,3rem)}
h2{font-size:clamp(1.5rem,3.5vw,2.2rem);margin-bottom:0.75rem}
h3{font-size:1.25rem;margin-bottom:0.5rem}
h4{font-size:1.1rem}
.gradient-text{
    background:linear-gradient(135deg,var(--sage-dark),var(--green),var(--sage));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;
    background-clip:text;background-size:200% auto;
    animation:gradientShift 4s ease infinite;
}
@keyframes gradientShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.text-center{text-align:center}.text-muted{color:var(--text-light)}
.lead{font-size:1.1rem;color:var(--text-light);max-width:650px;margin:0 auto}

/* === GLASS EFFECT === */
.glass{
    background:rgba(255,255,255,0.7);backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);
    border:1px solid rgba(255,255,255,0.5);
    box-shadow:0 8px 32px rgba(0,0,0,0.06);
}

/* === NAVIGATION (glass) === */
.nav{
    position:fixed;top:0;left:0;right:0;z-index:1000;
    background:rgba(246,250,243,0.85);backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border-bottom:1px solid var(--border);height:var(--nav-height);
    transition:all 0.4s var(--ease-out-expo);
    max-width:100vw;contain:layout style;
}
.nav.scrolled{box-shadow:0 4px 30px rgba(45,90,58,0.1);background:rgba(246,250,243,0.97)}
.nav-inner{max-width:var(--max-width);margin:0 auto;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 1.25rem}
.nav-brand{display:flex;align-items:center;gap:0.5rem;font-weight:700;font-size:1.15rem;color:var(--sage-dark);transition:transform 0.3s var(--ease-out-expo)}
.nav-brand:hover{transform:scale(1.03)}.nav-brand .logo-icon{width:50px;height:50px}
.nav-menu{display:flex;gap:0.25rem;align-items:center}
.nav-menu a{padding:0.5rem 1rem;border-radius:var(--radius-pill);font-weight:500;font-size:0.95rem;color:var(--text);position:relative;overflow:hidden;transition:all 0.3s var(--ease-out-expo)}
.nav-menu a::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--sage);transition:all 0.3s var(--ease-out-expo);transform:translateX(-50%)}
.nav-menu a:hover::after,.nav-menu a.active::after{width:60%}
.nav-menu a:hover,.nav-menu a.active{background:var(--sage-light);color:var(--sage-dark)}
.nav-menu a.nav-cta{background:linear-gradient(135deg,var(--terracotta),var(--terracotta-dark));color:var(--white);font-weight:600;margin-left:0.5rem;box-shadow:0 4px 15px rgba(193,122,93,0.3)}
.nav-menu a.nav-cta:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(193,122,93,0.45)}
.nav-menu a.nav-cta::after{display:none}
.nav-share-btn{background:transparent;border:1.5px solid var(--sage);color:var(--sage-dark);padding:0.45rem 0.85rem;border-radius:var(--radius-pill);font-size:0.85rem;cursor:pointer;font-family:inherit;transition:all 0.3s var(--ease-out-expo);margin-left:0.3rem;white-space:nowrap;display:inline-flex;align-items:center;gap:0.35rem;position:relative}
.nav-share-btn:hover{background:var(--sage);color:var(--white);transform:translateY(-1px)}
.nav-share-btn svg{width:14px;height:14px}
.share-dropdown{
  position:absolute;top:calc(100% + 6px);right:0;min-width:180px;
  background:var(--white);border-radius:10px;box-shadow:0 12px 40px rgba(30,45,34,.18);
  border:1px solid rgba(122,154,126,.2);padding:6px;display:none;z-index:100;
  animation:shareIn .2s ease-out;
}
.share-dropdown.open{display:block}
@keyframes shareIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.share-dropdown a{
  display:flex;align-items:center;gap:10px;padding:9px 12px;
  border-radius:6px;font-size:.82rem;color:var(--text-dark);text-decoration:none;
  transition:background .15s;
}
.share-dropdown a:hover{background:var(--green-light)}
.share-dropdown a svg{width:18px;height:18px;flex-shrink:0}
.share-dropdown a.fb svg{fill:#1877F2}
.share-dropdown a.tw svg{fill:#0F1419}
.share-dropdown a.wa svg{fill:#25D366}
.share-dropdown a.copy svg{fill:var(--sage-dark)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:0.5rem}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--text);margin:4px 0;transition:0.3s}

/* === PAGE HEADER === */
.page-header{
    padding:calc(var(--nav-height) + 4rem) 1.25rem 4rem;text-align:center;
    background:linear-gradient(135deg,var(--sage-light) 0%,var(--cream) 60%);
    position:relative;overflow:hidden;
}
.page-header::before{
    content:'';position:absolute;top:-40%;right:-20%;width:60%;height:150%;
    background:radial-gradient(circle,rgba(122,154,126,0.08) 0%,transparent 70%);
    animation:orbFloat 15s ease-in-out infinite;
}
.page-header h1{color:var(--sage-dark);margin-bottom:0.75rem;position:relative}
.page-header .breadcrumb{display:flex;justify-content:center;gap:0.5rem;font-size:0.9rem;color:var(--text-muted);margin-bottom:1rem;position:relative}
.page-header .breadcrumb a{color:var(--sage-dark)}

/* === ORBES ANIMÉS === */
.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:0.15;pointer-events:none;z-index:0;contain:layout style paint}
.orb-1{width:500px;height:500px;background:var(--green);top:-200px;right:-200px;animation:orbFloat 20s ease-in-out infinite}
.orb-2{width:350px;height:350px;background:var(--sage);bottom:-150px;left:-100px;animation:orbFloat 25s ease-in-out infinite reverse}
.orb-3{width:250px;height:250px;background:rgba(106,173,122,0.4);top:50%;left:60%;animation:orbFloat 18s ease-in-out infinite 5s}
/* Masquer orbes sur mobile pour éviter l'overflow */
@media(max-width:768px){.orb{display:none}}
@keyframes orbFloat{
    0%,100%{transform:translate(0,0) scale(1)}
    25%{transform:translate(40px,-30px) scale(1.1)}
    50%{transform:translate(-20px,20px) scale(0.95)}
    75%{transform:translate(-30px,-10px) scale(1.05)}
}

/* === CANVAS PARTICLES === */
#particlesCanvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}

/* === HERO (homepage) === */
.hero{
    min-height:100vh;display:flex;align-items:center;justify-content:center;
    background:var(--cream);position:relative;overflow:hidden;
    padding:calc(var(--nav-height) + 2rem) 1.25rem 4rem;
}
.hero .orb-1{top:-250px;right:-250px;width:600px;height:600px}
.hero .orb-2{bottom:-200px;left:-150px;width:400px;height:400px}
.hero-content{max-width:700px;text-align:center;position:relative;z-index:2}
.hero-badge{
    display:inline-block;
    background:linear-gradient(135deg,var(--terracotta),var(--terracotta-dark));
    color:var(--white);padding:0.5rem 1.5rem;border-radius:var(--radius-pill);
    font-weight:600;font-size:0.9rem;margin-bottom:1.5rem;
    box-shadow:0 4px 20px rgba(193,122,93,0.3);
    animation:fadeUp 0.6s var(--ease-out-expo),pulse 3s ease-in-out 0.6s infinite;
}
@keyframes pulse{0%,100%{box-shadow:0 4px 20px rgba(193,122,93,0.3)}50%{box-shadow:0 4px 35px rgba(193,122,93,0.55)}}
.hero h1{margin-bottom:1rem;animation:fadeUp 0.7s var(--ease-out-expo) 0.1s both;line-height:1.3}
.hero h1 .hl{background:linear-gradient(135deg,var(--terracotta),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero p{font-size:1.15rem;color:var(--text-light);margin-bottom:2rem;animation:fadeUp 0.7s var(--ease-out-expo) 0.2s both}
/* Definition block (hero) */
.definition-block{margin-bottom:1.5rem;animation:fadeUp 0.7s var(--ease-out-expo) 0.15s both}
.definition-subtitle{
    font-size:1.05rem;color:var(--text-muted);letter-spacing:0.12em;text-transform:uppercase;
    font-weight:500;margin-bottom:1.5rem;
}
.definition-sep{
    display:block;width:60px;height:3px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
    margin:0 auto 1.8rem;border-radius:2px;
}
.definition-text{
    font-size:1.15rem;color:var(--text-light);line-height:1.9;max-width:620px;margin:0 auto 2rem;
    text-wrap:pretty;
}
.definition-text em{color:var(--terracotta);font-style:italic}
.definition-text strong{color:var(--sage-dark);font-weight:600}
.hero-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;animation:fadeUp 0.7s var(--ease-out-expo) 0.3s both}

/* === BUTTONS === */
.btn{
    display:inline-flex;align-items:center;gap:0.5rem;
    padding:0.75rem 1.6rem;border-radius:var(--radius-pill);
    font-weight:600;font-size:0.95rem;cursor:pointer;
    transition:all 0.4s var(--ease-out-expo);border:none;text-align:center;
    white-space:nowrap;position:relative;overflow:hidden;
}
.btn::before{
    content:'';position:absolute;top:50%;left:50%;width:0;height:0;
    border-radius:50%;background:rgba(255,255,255,0.2);
    transform:translate(-50%,-50%);transition:width 0.6s,height 0.6s;
}
.btn:active::before{width:300px;height:300px}
.btn-primary{background:linear-gradient(135deg,var(--sage),var(--sage-dark));color:var(--white)}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 35px rgba(122,154,126,0.4)}
.btn-accent{background:linear-gradient(135deg,var(--terracotta),var(--terracotta-dark));color:#fff;box-shadow:0 4px 18px rgba(193,122,93,0.3);font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,0.2)}
.btn-accent:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(193,122,93,0.45)}
.btn-outline{background:transparent;color:var(--sage-dark);border:2px solid var(--sage)}
.btn-outline:hover{background:var(--sage);color:var(--white);transform:translateY(-3px);box-shadow:0 8px 25px rgba(122,154,126,0.3)}
.btn-white{background:var(--white);color:var(--sage-dark)}
.btn-white:hover{background:var(--sage-light);transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,0.1)}
.btn-lg{padding:1rem 2.5rem;font-size:1.05rem}
.btn-sm{padding:0.45rem 1.1rem;font-size:0.85rem}
.btn-glow{animation:btnGlow 2s ease-in-out infinite}
@keyframes btnGlow{0%,100%{box-shadow:0 4px 18px rgba(193,122,93,0.3)}50%{box-shadow:0 4px 35px rgba(193,122,93,0.6),0 0 60px rgba(193,122,93,0.2)}}

/* === SECTIONS === */
.section{padding:5rem 1.25rem;position:relative;max-width:100vw;contain:layout style}
.section-alt{background:var(--white)}
.section-colored{background:linear-gradient(135deg,var(--sage-dark),var(--green-dark));color:var(--white)}
.section-colored h2,.section-colored h3{color:var(--white)}
.section-header{text-align:center;margin-bottom:3rem}
.section-label{font-size:0.8rem;text-transform:uppercase;letter-spacing:4px;color:var(--sage-dark);font-weight:600;margin-bottom:0.5rem}
.container{max-width:var(--max-width);margin:0 auto;position:relative;z-index:1}

/* === GRIDS === */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}
.grid-4{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}

/* === CARDS (glass on hover) === */
.card{
    background:var(--white);border-radius:var(--radius);padding:2rem;
    border:1px solid var(--border);transition:all 0.5s var(--ease-out-expo);
    position:relative;overflow:hidden;
}
.card::before{
    content:'';position:absolute;inset:0;border-radius:var(--radius);
    background:linear-gradient(135deg,rgba(106,173,122,0.08),rgba(74,156,93,0.05));
    opacity:0;transition:opacity 0.5s var(--ease-out-expo);
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg),0 0 40px rgba(106,173,122,0.12)}
.card:hover::before{opacity:1}
.card-icon{font-size:2.5rem;margin-bottom:1rem;transition:transform 0.5s var(--ease-out-expo);display:inline-block}
.card:hover .card-icon{transform:scale(1.15) rotate(-5deg)}
.card h3{margin-bottom:0.5rem}
.card p{color:var(--text-light);font-size:0.95rem}

/* === STATS (animés) === */
.stats{display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;margin-top:2rem}
.stat-item{text-align:center;padding:1rem}
.stat-number{font-size:2.5rem;font-weight:700;background:linear-gradient(135deg,var(--sage-dark),var(--terracotta));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:all 0.3s var(--ease-out-expo)}
.stat-item:hover .stat-number{transform:scale(1.1)}
.stat-label{font-size:0.9rem;color:var(--text-light);margin-top:0.25rem}

/* === TESTIMONIALS === */
.testimonial-card{
    background:var(--white);border-radius:var(--radius);padding:2rem;
    position:relative;border:1px solid var(--border);
    transition:all 0.5s var(--ease-out-expo);
}
.testimonial-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--sage)}
.testimonial-card::before{
    content:'\201C';position:absolute;top:0.5rem;left:1.5rem;
    font-size:5rem;color:var(--green);opacity:0.12;line-height:1;
    font-family:Georgia,serif;transition:all 0.5s var(--ease-out-expo);
}
.testimonial-card:hover::before{opacity:0.25;transform:scale(1.1)}
.testimonial-text{font-style:italic;margin-bottom:1rem;position:relative;z-index:1}
.testimonial-author{font-weight:600;color:var(--sage-dark)}
.testimonial-stars{color:#F0C040;margin-bottom:0.5rem;font-size:1.1rem}

/* === PRICING TABLE === */
.pricing-table{
    width:100%;max-width:750px;margin:0 auto;border-collapse:collapse;
    background:var(--white);border-radius:var(--radius-lg);overflow:hidden;
    box-shadow:var(--shadow-md);border:1px solid var(--border);
    transition:box-shadow 0.4s var(--ease-out-expo);
}
.pricing-table:hover{box-shadow:var(--shadow-lg)}
.pricing-table thead{background:linear-gradient(135deg,var(--green),var(--sage-dark));color:var(--white)}
.pricing-table th{padding:1.1rem 1.25rem;text-align:left;font-weight:600}
.pricing-table td{padding:1.1rem 1.25rem;border-bottom:1px solid var(--border);transition:background 0.3s}
.pricing-table tr:hover td{background:var(--cream)}
.pricing-table tr:last-child td{border-bottom:none}
.pricing-table .price{font-weight:700;color:var(--sage-dark);font-size:1.1rem;white-space:nowrap}
.pricing-table .highlight-row{background:linear-gradient(135deg,var(--sage-light),rgba(106,173,122,0.08))}
.pricing-table .highlight-row .price{color:var(--terracotta);font-size:1.2rem}

/* === HIGHLIGHT BOX === */
.highlight-box{
    background:var(--sage-light);border-left:4px solid var(--sage);
    padding:1.5rem;border-radius:0 var(--radius) var(--radius) 0;
    margin:1.5rem 0;transition:all 0.4s var(--ease-out-expo);
}
.highlight-box:hover{transform:translateX(4px)}
.highlight-box.accent{background:var(--terracotta-light);border-left-color:var(--terracotta)}

/* === ALERT BANNER (shimmer) === */
.alert-banner{
    background:linear-gradient(135deg,var(--green),var(--sage-dark));
    color:var(--white);text-align:center;padding:0.85rem;
    font-weight:600;font-size:0.95rem;
    position:relative;overflow:hidden;
}
.alert-banner::after{
    content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);
    animation:shimmer 3s ease-in-out infinite;
}
@keyframes shimmer{0%{left:-50%}100%{left:150%}}

/* === FAQ === */
.faq-item{border-bottom:1px solid var(--border);padding:1.25rem 0;transition:all 0.3s}
.faq-q{font-weight:600;margin-bottom:0.5rem;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:color 0.3s}
.faq-q:hover{color:var(--sage-dark)}
.faq-q::after{content:'+';font-size:1.5rem;color:var(--sage);transition:all 0.4s var(--ease-out-expo)}
.faq-item.open .faq-q::after{content:'−';transform:rotate(180deg);color:var(--terracotta)}
.faq-a{color:var(--text-light);display:none;animation:fadeUp 0.4s var(--ease-out-expo)}
.faq-item.open .faq-a{display:block}

/* === FORM === */
.form-group{margin-bottom:1.2rem}
.form-group label{display:block;font-weight:600;margin-bottom:0.3rem;font-size:0.9rem}
.form-group input,.form-group select,.form-group textarea{
    width:100%;padding:0.8rem 1.1rem;border:2px solid #E8E8E8;
    border-radius:var(--radius-sm);font-size:1rem;font-family:inherit;
    transition:all 0.3s var(--ease-out-expo);background:var(--cream);
}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
    outline:none;border-color:var(--sage);
    box-shadow:0 0 0 4px rgba(122,154,126,0.12);
    background:var(--white);
}
.form-group textarea{min-height:120px;resize:vertical}

/* === INFO CARDS === */
.info-card{
    display:flex;gap:1rem;padding:1.25rem;
    background:var(--white);border-radius:var(--radius);
    border:1px solid var(--border);align-items:center;
    transition:all 0.4s var(--ease-out-expo);
}
.info-card:hover{transform:translateX(4px);box-shadow:var(--shadow-sm);border-color:var(--green)}
.info-card-icon{font-size:1.5rem;flex-shrink:0}
.info-card-content strong{display:block;margin-bottom:0.2rem}

/* === MAP === */
.map-container{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:16/9;background:var(--sage-light);border:1px solid var(--border)}
.map-container iframe{width:100%;height:100%;border:none}

/* === SOCIAL === */
.social-bar{display:flex;gap:0.75rem;flex-wrap:wrap}
.social-btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.6rem 1.2rem;border-radius:var(--radius-pill);background:rgba(106,173,122,0.12);color:var(--sage-dark);font-weight:600;font-size:0.9rem;transition:all 0.4s var(--ease-out-expo)}
.social-btn:hover{background:var(--green);color:var(--white);transform:translateY(-3px);box-shadow:0 8px 20px rgba(106,173,122,0.35)}

/* === CTA SECTION === */
.cta-section{
    background:linear-gradient(135deg,var(--green-dark),var(--sage-dark),var(--green));
    color:var(--white);text-align:center;padding:5rem 1.25rem;
    position:relative;overflow:hidden;
}
.cta-section::before{
    content:'';position:absolute;top:-30%;left:-20%;width:70%;height:150%;
    background:radial-gradient(circle,rgba(106,173,122,0.2) 0%,transparent 70%);
    animation:orbFloat 18s ease-in-out infinite;
}
.cta-section h2{color:var(--white);margin-bottom:0.75rem;position:relative}
.cta-section p{color:rgba(255,255,255,0.85);max-width:500px;margin:0 auto 1.5rem;font-size:1.05rem;position:relative}

/* === FOOTER === */
.footer{background:var(--green-dark);color:rgba(255,255,255,0.7);padding:3rem 1.25rem 2rem}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;max-width:var(--max-width);margin:0 auto}
.footer h4{color:var(--white);margin-bottom:1rem}
.footer-logo{width:65px;height:auto;margin-bottom:0.5rem;opacity:0.85;transition:opacity 0.3s}.footer-logo:hover{opacity:1}
.footer a{color:rgba(255,255,255,0.5);transition:color 0.3s}
.footer a:hover{color:var(--sage)}
.footer-links{display:flex;flex-direction:column;gap:0.4rem}
.footer-bottom{text-align:center;margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,0.08);font-size:0.85rem;max-width:var(--max-width);margin-left:auto;margin-right:auto}

/* === FLOATING CTA === */
.floating-cta{display:none;position:fixed;bottom:0;left:0;right:0;z-index:999;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:0.75rem 1rem;box-shadow:0 -4px 30px rgba(0,0,0,0.1)}
.floating-cta .btn{width:100%;justify-content:center}

/* === SOCIAL SHARE BAR === */
.share-bar{display:flex;gap:0.5rem;flex-wrap:wrap;justify-content:center;margin:2rem 0;padding:1.5rem;background:var(--sage-light);border-radius:var(--radius-lg)}
.share-bar span{font-weight:600;width:100%;text-align:center;margin-bottom:0.5rem;color:var(--sage-dark)}
.share-btn{display:inline-flex;align-items:center;gap:0.4rem;padding:0.5rem 1rem;border-radius:var(--radius-pill);font-weight:600;font-size:0.85rem;text-decoration:none;color:#fff;transition:all 0.3s var(--ease-out-expo)}
.share-btn:hover{transform:translateY(-2px)}
.share-fb{background:#1877F2}.share-fb:hover{box-shadow:0 6px 20px rgba(24,119,242,0.4)}
.share-tw{background:#000}.share-tw:hover{box-shadow:0 6px 20px rgba(0,0,0,0.3)}
.share-wa{background:#25D366}.share-wa:hover{box-shadow:0 6px 20px rgba(37,211,102,0.4)}
.share-copy{background:var(--white);color:var(--text);border:1px solid var(--border);cursor:pointer}
.share-copy:hover{background:var(--sage);color:var(--white)}

/* === SOCIAL FOOTER ICONS === */
.social-icons{display:flex;gap:0.6rem;flex-wrap:wrap;margin-top:0.5rem}
.social-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,0.1);transition:all 0.3s var(--ease-out-expo)}
.social-icon:hover{transform:translateY(-3px)}
.social-icon svg{width:18px;height:18px;fill:rgba(255,255,255,0.7)}
.social-icon:hover svg{fill:#fff}
.social-icon.fb:hover{background:#1877F2}
.social-icon.insta:hover{background:linear-gradient(135deg,#F58529,#DD2A7B,#8134AF)}
.social-icon.yt:hover{background:#FF0000}
.social-icon.tk:hover{background:#000}
.social-icon.coming-soon{opacity:0.4;cursor:not-allowed}
.social-icon.coming-soon:hover{transform:none;background:rgba(255,255,255,0.1)!important}
.social-icon.coming-soon:hover svg{fill:rgba(255,255,255,0.7)!important}
/* === SOCIAL PAGE ICONS (light bg) === */
.social-icons-light .social-icon{background:var(--sage-light)}
.social-icons-light .social-icon svg{fill:var(--sage-dark)}
.social-icons-light .social-icon:hover svg{fill:#fff}

/* === ANIMATIONS === */
@keyframes fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
.reveal{opacity:0;transform:translateY(40px);transition:all 0.8s var(--ease-out-expo)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-40px);transition:all 0.8s var(--ease-out-expo)}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(40px);transition:all 0.8s var(--ease-out-expo)}
.reveal-right.visible{opacity:1;transform:translateX(0)}
.reveal-scale{opacity:0;transform:scale(0.9);transition:all 0.8s var(--ease-out-expo)}
.reveal-scale.visible{opacity:1;transform:scale(1)}
.delay-1{transition-delay:0.1s}.delay-2{transition-delay:0.2s}.delay-3{transition-delay:0.3s}.delay-4{transition-delay:0.4s}

/* === RESPONSIVE === */

/* Tablette (768px - 1024px) */
@media(max-width:1024px){
    .nav-menu{gap:0}.nav-menu a{padding:0.4rem 0.7rem;font-size:0.85rem}
    .nav-share-btn{font-size:0.78rem;padding:0.4rem 0.7rem;margin-left:0.1rem}
    .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
    .footer-grid > div:first-child{grid-column:1/-1}
}

/* Mobile large (480px - 768px) */
@media(max-width:768px){
    .nav-menu{display:none}.nav-toggle{display:block;padding:0.7rem}
    .nav-toggle span{width:24px}
    .nav-menu.mobile-open{display:flex;flex-direction:column;position:absolute;top:var(--nav-height);left:0;right:0;background:rgba(246,250,243,0.98);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:0.75rem;gap:0;box-shadow:var(--shadow-lg);border-bottom:1px solid var(--border);z-index:100;max-height:calc(100vh - var(--nav-height));overflow-y:auto}
    .nav-menu.mobile-open a{border-radius:var(--radius-sm);padding:0.85rem 1rem;min-height:44px;display:flex;align-items:center}
    .nav-menu a.nav-cta{margin-left:0;justify-content:center}
    .nav-share-btn{display:none}
    .grid-2{grid-template-columns:1fr}
    .grid-3,.grid-4{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr;gap:1.5rem}
    .stats{gap:1rem;justify-content:space-around}
    .stat-number{font-size:1.8rem}
    .stat-item{padding:0.35rem;min-width:70px}
    .stat-label{font-size:0.8rem}
    .floating-cta{display:block}
    .hero-actions{flex-direction:column;align-items:center;gap:0.75rem}
    .hero-actions .btn{width:100%;justify-content:center;min-height:48px}
    .hero{padding:calc(var(--nav-height) + 1.5rem) 1rem 2.5rem;min-height:auto}
    .hero-badge{font-size:0.82rem;padding:0.45rem 1.2rem}
    .hero h1{font-size:1.55rem;line-height:1.25}
    .hero p{font-size:1rem;line-height:1.6}
    .hero .orb-1{width:300px;height:300px;top:-120px;right:-120px}
    .hero .orb-2{width:200px;height:200px;bottom:-80px;left:-60px}
    .page-header{padding:calc(var(--nav-height) + 2.5rem) 1rem 2.5rem}
    .page-header h1{font-size:1.5rem}
    .breadcrumb{flex-wrap:wrap;font-size:0.8rem;gap:0.3rem}
    /* Photo portrait 3/4 — limiter la hauteur */
    [style*="aspect-ratio:3/4"]{aspect-ratio:auto!important;max-height:380px}
    /* Table overflow */
    .pricing-table{font-size:0.88rem;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius)}
    .pricing-table thead,.pricing-table tbody,.pricing-table tr{display:table;width:100%;table-layout:fixed;min-width:480px}
    .pricing-table th,.pricing-table td{padding:0.7rem 0.8rem;white-space:normal}
    /* Blog cards */
    article[style*="display:flex"]{flex-direction:column!important}
    article[style*="display:flex"] img{width:100%!important;height:180px!important}
    /* Section padding */
    .section{padding:2.5rem 1rem}
    .cta-section{padding:3rem 1rem}
    /* Map */
    .map-container{aspect-ratio:4/3}
    /* Share bar */
    .share-bar{gap:0.4rem;padding:1rem}
    .share-btn{font-size:0.8rem;padding:0.45rem 0.8rem;min-height:44px}
    /* Cards */
    .card{padding:1.5rem}
    .testimonial-card{padding:1.5rem}
    /* Orbs sur page-header */
    .page-header::before{width:100%;height:100%}
    /* Contact info cards */
    .info-card{padding:0.9rem;gap:0.75rem}
    /* Alert banner */
    .alert-banner{font-size:0.8rem;padding:0.65rem 1rem;line-height:1.4}
}

/* Mobile petit (< 480px) */
@media(max-width:480px){
    .hero h1{font-size:clamp(1.3rem,5vw,1.55rem)}
    .hero p{font-size:0.92rem}
    .hero-badge{font-size:0.76rem}
    .hero .orb-1{width:200px;height:200px;top:-80px;right:-80px}
    .hero .orb-2{width:150px;height:150px;bottom:-60px;left:-50px}
    .page-header h1{font-size:1.25rem}
    .section{padding:2rem 0.8rem}
    .section-label{letter-spacing:2px;font-size:0.7rem}
    .card{padding:1.25rem}
    /* Pricing table encore plus compact */
    .pricing-table{min-width:400px;font-size:0.78rem}
    .pricing-table th,.pricing-table td{padding:0.5rem 0.55rem}
    .stats{gap:0.5rem}
    .stat-number{font-size:1.45rem}
    .stat-label{font-size:0.72rem}
    .stat-item{padding:0.25rem;min-width:60px}
    .footer-grid{gap:1rem}
    .footer{padding:2rem 0.8rem 1.2rem;font-size:0.88rem}
    .footer h4{font-size:1rem}
    .cta-section h2{font-size:1.3rem}
    .cta-section p{font-size:0.85rem}
    .alert-banner{font-size:0.72rem;padding:0.5rem 0.7rem}
    .nav-brand{font-size:0.95rem;gap:0.35rem}
    .nav-brand .logo-icon{width:38px;height:38px}
    .floating-cta{padding:0.5rem 0.7rem}
    .floating-cta .btn{padding:0.65rem 1rem;font-size:0.88rem;min-height:44px}
    .article-meta span{display:block;margin:0.1rem 0}
    .article-meta{display:flex;flex-direction:column;align-items:center;gap:0.1rem}
    .faq-q{font-size:0.92rem}
    .social-icons{gap:0.35rem}
    .social-icon{width:34px;height:34px}
    .social-icon svg{width:15px;height:15px}
    article[style*="display:flex"] img{height:150px!important}
    article[style*="display:flex"] h2{font-size:1rem!important}
    .article-content .gallery{grid-template-columns:1fr;gap:0.75rem}
    .article-content{font-size:0.95rem}
    .btn-lg{padding:0.8rem 1.8rem;font-size:0.95rem}
    [style*="aspect-ratio:3/4"]{max-height:320px}
    .grid-2 .card{padding:1.25rem}
}
