:root {
    --primary-color     :#1b2531;          /* marine — titres, fonds sombres */
    --secondary-color   :#384c64;          /* ardoise — surtitres            */
    --third-color       :#141c26;          /* fond menu latéral              */
    --text-color        :#384c64;
    --text-colorc7      :#384c64c7;
    --light-bg          :#efefef;          /* fond du site                   */
    --gradient          :linear-gradient(135deg,#1b2531 0%,#2a3a4f 100%);

    --success-color     :#27AE60;
    --danger-color      :#E74C3C;
    --warning-color     :#F39C12;
    --info-color        :#8a96a6;
    --dark-color        :#1b2531;
    --white             :#FFFFFF;
    --border-color      :#e3e8ef;
    --trans             :transparent;
    --font-main         :"Outfit", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --transition        :all 0.3s ease;
    --gap               :clamp(15px, 2.5vw, 40px);
    --martom            :clamp(15px, 2.5vw, 40px);
    --padding           :clamp(20px, 6vw, 100px);
    --maxpadding        :0 clamp(20px, 6vw, 100px);
    --radius            :clamp(6px, 1vw, 10px);
    --font-weight       :300;
    --font-size         :clamp(14px, 3vw, 16px);
    --shadow            :0 8px 25px rgba(27, 37, 49, .12);

    --maxsize           :1330px;
    --minsize           :1158px;

    --primary-font      :"Outfit", "Helvetica Neue", Arial, sans-serif;
    --secondary-font    :var(--primary-font);
    --third-font        :var(--primary-font);

    /* Marque */
    --accent            :#f25a5a;          /* corail : boutons, filets, accents */
    --accent-dark       :#de4545;
    --brand-050         :#f4f6f9;          /* marine très clair (fonds doux)    */
    --ink-soft          :#6b7686;          /* texte courant des sections        */
    --gradient-soft     :linear-gradient(180deg,#f7f9fb 0%,#f1f4f8 100%);
    --gradient-accent   :linear-gradient(135deg,#f25a5a 0%,#de4545 100%);
    --on-dark           :#ffffff;
    --on-dark-muted     :#c3cdd8;
    --shadow-soft       :0 0 10px rgba(27,37,49,.08);
    --shadow-strong     :0 24px 60px rgba(27,37,49,.18);

    /* Surfaces */
    --surface-alt       :#f5f7fa;          /* sections grisées*/
    --line              :#e6eaf0;          /* bordures fines*/
}

.bg         {background-color:#ffffff;}
.bgwhite    {background-color:white;}
.bgwhite2   {background-color:efefef;}
.bg1        {background-color:#1b2531;}
.bg2        {background-color:#384c64;}
.bg3        {background-color:#45243e;}

.colorwhite {color:white;}
.color      {color:#384c64;}
.color1     {color:#1b2531;}
.color2     {color:#764BA2;}
.color3     {color:#c3d0d8;}
.borderwhite {border-color:white;}
.border1    {border-color:#1b2531;}
.border2    {border-color:#764BA2;}
.border3    {border-color:#E0E0E0;}
.gradient   {background: linear-gradient(#383b51, #764BA2);}

.maxsize        {width:100%; max-width:1330px;}
.minsize        {width:100%; max-width:1158px;}
.maxpadding     {padding: 0 clamp(20px, 6vw, 100px);}

.primary-font   {font-family:var(--primary-font);}
.secondary-font {font-family:var(--secondary-font);}

.wrapper-h1     {padding:var(--padding) var(--padding) 0; width:100%;}
.wrapper-h1 h1  {max-width: var(--maxsize); margin: auto;}


/* ------------------ 
------- Body --------
------------------ */
body {background: var(--light-bg); color: var(--text-color);}

h1, h2, h3  {color:var(--primary-color); font-weight:600; line-height:1.2em; position:relative; display:flex;}
h1          {font-size: clamp(30px, 3vw, 40px);}
h1::after   {content: ''; height: 3px; width: clamp(80px, 10vw, 150px); background: var(--accent); position: absolute; bottom: 0; left: 0;}

/* ------------------ 
------ Sidebar ------
------------------ */
.menu-button {background-color:var(--dark-color);}
.toggle-checkbox:not(:checked) ~ .menu-button .menu-icon {background-color:var(--brand-050);}
.toggle-checkbox:checked ~ .menu-button .menu-icon::before {background-color:var(--brand-050);}
.toggle-checkbox:checked ~ .menu-button .menu-icon::after {background-color:var(--brand-050);}
.menu-icon::before, .menu-icon::after {background-color:var(--brand-050);}

.menu-sidebar {background-color: var(--dark-color);}
.header-menu ul li .icon    {display: none;}
.icon {background-color:var(--trans);}
.icon::before {background-color:var(--white);}
.icon::after {background-color:var(--info-color);}
.logo-sidebar {width: 190px;}
.menu a {color:var(--on-dark-muted);}
.menu a.active {color:var(--white);}
@media (min-width:1025px)   {
    .menu-sidebar.sidebar-off, .menu-button.sidebar-off { display:none; }
}

/* ------------------ 
------- Header ------
------------------ */
.header                 {background-color:var(--primary-color);}
.header-menu-content    {display:flex; align-items:center; justify-content: space-between; flex-wrap: balance; gap:10px; font-size:14px;}
.header-menu            {padding: 8px 16px;}
.header-menu a.active   {color:var(--white);}
.header-logo-padding    {padding: clamp(20px, 3vw, 30px);}
.header-background      {}
.header-logo            {display:flex; flex-direction:column; justify-content:center; align-items:flex-start; padding:20px 0 10px;}
.header-connexion       {display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid var(--border-color); border-radius:var(--radius); background:var(--brand-050); color:var(--secondary-color); font:inherit; font-size:.9em; font-weight:500; line-height:1.2;}
.logo                   {width: clamp(40%, 28vw, 75%); max-width: 400px; min-width: 200px; margin:auto; padding: 15px 0;}
.logo-page              {width:200px; margin: 0;}
.header-content         {margin:0 auto; /*padding: 0 0 40px clamp(10px, 3vw, 20px);*/}
.header-content-padding {padding: 10px var(--padding);}
nav.header-menu ul      {justify-content:flex-end; align-items:center; gap: 16px;}
.header-menu li:hover .icon::before, .header-menu li:active .icon::before {background-color:var(--accent);}
.header-menu li:hover .icon::after, .header-menu li:active .icon::after {background-color:var(--accent);}
nav.header-menu a, nav.menu a {font-size: 1.4em; white-space: nowrap;}
nav.header-menu a::before {bottom: -20px;}

.nav-header-bloc        {margin:auto;}
.nav-header a           {background-color: var(--secondary-color); border: 1px solid var(--border-color); color:var(--white); }
nav a                   {color:#c3d0d8;}
.nav a::before          {background:var(--primary-color);}
nav a::before           {background-color:var(--accent);}
.nav-header a:hover     {background-color:var(--accent);}

.page-header .toggle    {max-width:var(--maxsize); margin:0 auto;}

.toggle                 {background-color: var(--white); padding: clamp(15px, 3vw, 30px); border-radius: var(--radius); border: 1px solid var(--border-color); gap: 0; margin-bottom: var(--martom);}
.toggleable_content     {/*border-width:0 3px 0 0; border-style: solid; margin:0 35px 0 0; padding:0 20px 0 0; border-color:var(--primary-color);*/}
.toggleable_label::after {background-color:var(--primary-color); color:var(--white);}
.content-filter-btn-index.active {background-color: var(--primary-color); color:var(--white);}
.header-index           {}
.header-index h2        {background-color:var(--trans); color:var(--text-color); padding:0;}
.toggle label h2        {font-size: clamp(16px, 3vw, 20px); color: var(--primary-color); margin:0;}
.toggle label h3        {font-size: clamp(16px, 3vw, 20px);  color:var(--text-color); margin:0;}

@media (max-width:1024px) {
    .header-menu        {display:none !important;}
    .logo-page          {width:250px; margin:auto;}
    .header-logo        {justify-content:center;}
}
@media (max-width:819px) {
    .header-menu-content        {justify-content: center;}
    .header-content-padding     {padding: 20px var(--padding) 10px;}
}

.dropdown-toggle        {background: var(--white);}
.dropdown-toggle:hover, .dropdown-toggle:focus {background-color:var(--secondary-color); color:var(--white);}
.dropdown-toggle.active, .dropdown.open .dropdown-toggle {background-color: var(--primary-color); color: var(--white);}
.dropdown-menu          {background-color:var(--white);}
.dropdown-menu li button:hover, .dropdown-menu li button:focus {color: var(--white); background-color: var(--secondary-color);}

/* ------------------ 
----- Breadcrumb ----
------------------ */
.breadcrumb             {font-size:0.8em;}
.breadcrumb a           {color:var(--primary-color); border-radius: var(--radius); padding: 3px 0; display: flex; gap: 3px;}
.breadcrumb a:hover     {color:var(--white); background-color:var(--accent); padding: 3px 15px;}
.breadcrumb a svg       {padding-bottom: 1px;}
.breadcrumb-separator   {color:var(--info-color);}
.breadcrumb-current     {}

/* ------------------ 
----- Recherche -----
------------------ */
.mpress-search-input            {border:none; border-bottom:1px solid var(--border-color); background-color: var(--white); color: var(--info-color); border-radius: 8px 8px 0 0;}
.mpress-search-suggestions      {background:var(--white); border:1px solid var(--border-color); box-shadow:var(--shadow-soft); color:var(--secondary-color);}
.mpress-search-suggestions li   {border-bottom:1px solid var(--border-color);}

/* ------------------ 
---- Catégories -----
------------------ */
.view-link          {color:#bbb;}
.view-link:hover    {color:#333;}

/* ------------------ 
------ Galerie ------
------------------ */
.page-header            {padding:16px clamp(20px, 6vw, 100px); display: flex; flex-direction: column; gap: var(--gap);}
.page-header-bloc       {max-width:var(--maxsize); margin:auto;}
.page-header-bloc h1    {background-color:var(--trans); width:100%; padding:0 0 20px 0;}
/*.page-header-bloc h1::after {content: ''; height: 3px; width: clamp(80px, 10vw, 150px); background: var(--accent); position: absolute; bottom: 0; left: 0;}*/
.image-card, .ad-card   {background-color:var(--white);}
.image-info h2          {font-size: clamp(25px, 3vw, 30px); margin: 0 0 20px;}
.image-description      {color: var(--secondary-color);}
.image-description span {background-color: #383b51; color: #fff;}
.image-description p    {background-color: #d9d2ca; color: #383b51;}
.image-category         {color: var(--primary-color);}

.pagination-btn         {border: 1px solid #ddd; background-color: var(--white);}
.pagination-btn.active  {background-color: var(--primary-color); color:var(--white); border-color:#d53a7c;}
.pagination-btn:hover   {background: #dd6196; border-color: #d53a7c; color:white;}
.pagination-dots        {color:#999;}

.product-card .gallery-promo-badge {display:inline-block; background-color:var(--secondary-color); color:var(--white); font-size:.7em; font-weight:600; line-height:1; padding:6px 10px; border-radius:var(--radius);  margin-left:3px;  vertical-align:middle;  margin-top:-4px;}

.content-card           {background-color: var(--secondary-color);}

@media (max-width:819px) {
    .page-header-bloc h1::after {display:none;}
}

/* ------------------ 
------ Page ------
------------------ */
.misenpage {}
.misenpage h1   {font-size: clamp(30px, 3vw, 40px); line-height: 1.2; padding: 0 0 20px 0;}
.misenpage h2   {line-height:clamp(25px, 3vw, 30px); color:var(--secondary-color); display:flex;}
.misenpage h3   {font-weight:600; line-height:1.3;}

/* ------------------ 
------ Image ------
------------------ */
.image-main                     {padding: clamp(20px, 3vw, 40px) var(--padding);}
.image-detail                   {}
.image-detail-wrapper           {width:100%; max-width:var(--minsize); margin:clamp(10px, 2vw, 20px) auto var(--martom);}
.image-section                  {/*background-color:var(--white); box-shadow:0 8px 30px rgba(0, 0, 0, 0.12); padding: clamp(10px, 2vw, 30px);*/}
.image-section h1               {padding: 0 0 20px 0;}

.image-img img                  {border-radius:var(--radius); overflow:hidden;}

.media-thumb                    {border-radius:var(--radius);}

.image-description-detail       {background: var(--white); padding:clamp(10px, 4vw, 30px); border-radius: var(--radius); border: 1px solid var(--border-color);line-height: 1.6;}
.image-description-detail h2    {color: var(--primary-color); font-size:clamp(22px, 3vw, 30px); margin: 0 0 var(--martom);}
.image-description-detail h3    {font-size:clamp(18px, 3vw, 22px); margin: 0 0 15px;}
.image-description-detail p     {text-align: justify; margin: 0 0 clamp(15px, 3vw, 30px);}
.image-section strong           {color: var(--text-color);}
video                           {border-radius:var(--radius);}

.content-stats                  {background-color:var(--light-bg); border-radius:var(--radius);}
.content-stats svg              {color: var(--primary-color);}
.stat-like                      {background:none; border:none; color:inherit; font-size:inherit;}
.stat-like:hover                {background: rgba(220, 53, 69, .1); color: #dc3545;}
.stat-like.liked                {color: #dc3545;}
.stat-like.liked svg            {fill: #dc3545;}
.stat-views, .stat-duration     {opacity:.7;}

.profile-name-display h2 {}
.tag-link {background-color: var(--primary-color); color:var(--white);}

.related-content                {}
.profile-gallery-section        {}
.comments-block                 {background-color:var(--white); padding:15px clamp(15px, 2vw, 30px); border-radius:var(--radius); box-shadow:var(--shadow-soft); border:1px solid var(--border-color);}

.related-content h2             {padding: 10px 20px;}
.related-content h3             {color:var(--secondary-color); font-weight: 400; font-size: 14px; padding: 16px;}
.related-image-wrapper          {height:250px; border-radius:var(--radius);}
.related-image-wrapper img      {border-radius: var(--radius);}
.call                           {background-color: var(--primary-color); color:var(--white);}

.profile-gallery-section h2, .related-content h2 {display: flex; flex-wrap: nowrap; align-items: center; gap: 8px; color: var(--primary-color); margin:0 0 20px; padding: 0 0 16px;}
.profile-gallery-section h2::after, .related-content h2::after {content: ''; height: 3px; width: clamp(100px, 20vw, 250px); background: var(--accent); position: absolute; bottom: 0; left: 0;}


/*.related-content h2::before     {content: ''; display: inline-block; width: 28px; height: 28px; margin-right: 8px; vertical-align: middle; background-repeat: no-repeat; background-position: center; background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='.5' y='.5' width='31' height='31' rx='6' fill='%231b2531'/%3E%3Crect x='8.5' y='11' width='15' height='3.2' rx='1.6' fill='%23fff'/%3E%3Crect x='14.4' y='5.1' width='3.2' height='15' rx='1.6' fill='%23fff'/%3E%3Ccircle cx='10' cy='25' r='2' fill='%23fff'/%3E%3Crect x='13.2' y='23' width='11' height='4' rx='2' fill='%23fff'/%3E%3C/svg%3E");}
.profile-gallery-section h2::before {content: ""; display: inline-block; width: 28px; height: 28px; margin-right: 8px; vertical-align: middle; background-repeat: no-repeat; background-position: center; background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Crect x='8' y='8' width='240' height='240' rx='48' fill='%231b2531'/%3E%3Ccircle cx='76' cy='72' r='46' fill='%23ffffff'/%3E%3Ccircle cx='76' cy='184' r='46' fill='%23ffffff'/%3E%3Ccircle cx='172' cy='124' r='46' fill='%23ffffff'/%3E%3Ccircle cx='172' cy='44' r='20' fill='%23ffffff' opacity='0.8'/%3E%3Ccircle cx='172' cy='204' r='20' fill='%23000000' opacity='0.5'/%3E%3C/svg%3E");}
*/
.content-carousel--gallery      {--cn-cols: 4;}
.gallery-thumb                  {aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--radius); cursor: pointer;}

@media (max-width:900px)        { .content-carousel--gallery{ --cn-cols:4; } }
@media (max-width:600px)        { .content-carousel--gallery{ --cn-cols:2.2; } }
@media (max-width:480px)        { .image-section {background-color:inherit; box-shadow:none; padding:0;} }

/* ------------------ 
------ Widgets ------
------------------ */
.widget .dropdown, .widget h3   {position: relative; color: var(--primary-color);}
.widget h3                      {padding:0 0 20px; margin-bottom:20px;}
.widget h3::after               {content:''; position: absolute; background: var(--accent); bottom: 0; left: 0; height: 3px; width: 50%;  }

/* ------------------ 
 ------ footer ------ 
------------------ */
footer                      {}
.footer-content             {margin:20px auto 40px;}
.footer-block               {color:var(--white);}
.footer-block h3, .footer-block h4, .footer-block h5 {color:var(--accent); text-transform:uppercase; font-family:var(--secondary-font);}
.footer-block h4            {font-size:1.5em;}
.footer-block a:hover       {}
.footer-block p             {margin-bottom:12px;}

.reseaux                    {display:flex; flex-direction:column; gap:15px; margin:0 0 0 5px;}
.reseaux a                  {display:flex; align-items:center; gap:12px; color:var(--white); transition:color 0.2s;}
.reseaux a:hover            {color:var(--primary-color);}
.reseaux .puce              {width:34px; height:34px; background:var(--primary-color); border:1px solid var(--secondary-color); display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:var(--white); transform:skewX(-8deg);}
.reseaux .puce span         {transform:skewX(8deg);}

.footer-bottom              {}
.footer-copyright           {color:var(--info-color);}

/* ------------------ 
 ----- cookies ------ 
------------------ */
.cookie-consent             {background: rgb(255, 255, 255, 0.94); font-family: var(--font-main); box-shadow: var(--shadow);}
.cookie-consent-inner h4    {color:var(--primary-color); font-size:20px; margin-bottom:-10px;}
.cookie-text                {color: var(--primary-color); background: rgb(255, 255, 255, 0.5);}
.cookie-actions button      {color:var(--white); font-weight:600;}
#cookie-accept              {background:linear-gradient(135deg, #27ae60, #229954);}
#cookie-refuse              {background:linear-gradient(135deg, #e74c3c, #c0392b);}

/* ------------------ 
--- scroll to top ---
------------------ */
.scroll-to-top              {background-color:var(--accent);}
.scroll-to-top:hover        {background-color:var(--accent-dark); color:var(--white);}

/* ------------------ 
--- disclaimer ---
------------------ */
.disclaimer-content         {background-color:var(--white); border-radius:var(--radius); padding:var(--padding); box-shadow:0 20px 60px rgba(0, 0, 0, 0.5);}
.disclaimer-site-name       {color:var(--primary-color); background-color:var(--trans); font-weight:700; font-size:clamp(25px, 3vw, 33px);}
.disclaimer-title           {font-size:clamp(20px, 2vw, 26px); color:var(--secondary-color);}
.disclaimer-buttons         {}
.disclaimer-text            {font-size:clamp(14px, 2vw, 20px); color:var(--dark-color);}

/* -----------------
------ custom ------  
----------------- */

.custompage.grid            {grid-template-columns: 1fr 1fr;}
@media (max-width:960px) {
    .custompage.grid        {grid-template-columns:1fr;}
}


/* COMMENTAIRES ---------------------------------------- */
.comments-block             {}
.comments-block h3          {color:var(--primary-color); font-size:1.5em;}
.comments-block h3 strong   {letter-spacing: 1px; color: var(--accent);}
.comments-block h3::before  {content: ""; display: inline-block; width: 28px; height: 28px; margin-right: 8px; vertical-align: middle; background-repeat: no-repeat; background-position: center; background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect x='.5' y='.5' width='31' height='31' rx='6' fill='%231b2531'/%3E%3Cg transform='translate(.8 1.6) scale(.9)'%3E%3Cpath fill='%23fff' d='M16 4C8.8 4 3 8.7 3 14.5c0 3.1 1.7 6 4.4 7.9l-.9 5.1 6.2-2.2c1.1.3 2.2.4 3.3.4 7.2 0 13-4.7 13-10.5S23.2 4 16 4Z'/%3E%3Cg fill='%23050664'%3E%3Ccircle cx='11.3' cy='14.7' r='1.55'/%3E%3Ccircle cx='16' cy='14.7' r='1.55'/%3E%3Ccircle cx='20.7' cy='14.7' r='1.55'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");}
.comments-empty, .user-form-response {margin: 10px clamp(15px, 3vw, 30px) 16px; text-align:center; font-weight:500;}
.comments-block ul          {padding: clamp(15px, 3vw, 30px) 0 0;}
.comments-block li          {padding: 0 0 10px; margin: 0 0 10px; gap:clamp(15px, 3vw, 30px); border-bottom: 1px solid var(--border-color);}
.comments-block ul > li:last-child {border-bottom: none;}

.comment-avatar             {flex: 0 0 clamp(60px, 8vw, 80px);}
.comment-avatar span        {aspect-ratio: 1 / 1; border-radius: 50%; background: var(--brand-050); font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 700; line-height: 1; color: var(--white); text-shadow: 0px 0px 2px #aaa;}
.comment-body               {flex:1; min-width:0; padding: clamp(8px, 2vw, 16px) clamp(16px, 3vw, 25px); background-color: var(--light-bg); border-radius: var(--radius);}
.comment-header             {align-items:baseline; font-size: clamp(14px, 2vw, 18px);}
.comment-author             {text-transform: capitalize;}
.comment-date               {font-size: 0.85em; color: var(--info-color);}
.comment-content            {font-size: 1rem; line-height: 1.5; opacity:.75; overflow-wrap: anywhere;}

.comments-login-prompt      {background: var(--gradient-soft); border: 2px dashed var(--primary-color); margin: 0 0 clamp(15px, 3vw, 30px);}
.btn-user-auth              {background:var(--gradient); padding:10px 40px; font-weight:700;}
.btn-user-publication       {background-color: var(--accent); color: var(--white); padding: 12px 28px; border: none; border-radius:10px; font-size:18px; font-family:var(--primary-font); font-weight:600; margin:10px 0 0;}

.user-form-group-top        {padding: 0 0 clamp(15px, 3vw, 30px);}
.user-form-group-top label  {font-size: .9rem; margin: 0 0 5px; color: var(--primary-color); font-weight: 600;}
.user-form-group-top textarea {border-radius: var(--radius); padding: 12px 20px; border: 1px solid var(--border-color, #ccc); font-family: var(--primary-font);}
.user-form-count            {display: flex; flex-wrap: nowrap; margin: 5px 0 0; font-size: .75rem; color: var(--info-color);}
#comment_count              {color: var(--accent); font-weight: 700;}
.user-form-help             {color: var(--info-color); text-align: center; display: flex; justify-content: center; margin: 0 auto 16px;}


/* LANDING PAGE ---------------------------------------- */
.lp                     {color:var(--ink-soft); font-weight:300; line-height:1.65; interpolate-size:allow-keywords;}
.lp h1,.lp h2,.lp h3    {font-family:var(--primary-font); font-weight:500; text-transform:none; letter-spacing:-.01em; display:block; color:var(--primary-color); line-height:1.18;}
.lp h1                  {font-size:clamp(2.2rem,4vw,3.3rem); color:var(--white); margin:0 0 .45em;}
.lp h2                  {font-size:clamp(1.65rem,2.5vw,2.2rem); margin:0;}
.lp h3                  {font-size:.9rem; margin:0 0 .5em;}
.lp p                   {margin:0 0 1em;}
.lp p:last-child        {margin-bottom:0;}
.lp strong              {font-weight:500; color:var(--primary-color);}
.lp .lead               {font-size:clamp(1rem,1.25vw,1.08rem); color:var(--on-dark-muted); max-width:500px; margin-bottom:2em;}
.lp-accent              {color:var(--accent);}
.lp .maxsize            {max-width:var(--maxsize);}

/* SECTIONS + en-têtes ------------------------------------ */
.lp-section             {padding:clamp(56px,7vw,96px) clamp(20px,5vw,60px);}
.lp-alt                 {background:var(--surface-alt);}
/* Titre à gauche, texte (ou lien) à droite */
.lp-head                {display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:16px 48px; margin-bottom:clamp(32px,4.5vw,60px);}
.lp-head > p            {max-width:330px; font-size:.82rem; line-height:1.65;}

/* EYEBROW (surtitre + filet corail) ---------------------- */
.lp-eyebrow             {display:inline-flex; align-items:center; gap:12px; margin-bottom:14px; font-size:.72rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--secondary-color);}
.lp-eyebrow::before     {content:""; flex:0 0 22px; height:2px; background:var(--accent);}

/* BOUTONS ------------------------------------------------ */
.lp-btn                 {display:inline-flex; align-items:center; justify-content:center; gap:.7em; padding:16px 30px; font-family:var(--primary-font); font-size:.86rem; font-weight:500; line-height:1.2; letter-spacing:.01em; border:1px solid transparent; border-radius:999px; cursor:pointer; transition:background .25s, color .25s, border-color .25s, transform .25s, box-shadow .25s;}
.lp-btn:hover           {transform:translateY(-2px);}
.lp-btn-primary         {background:var(--accent); border-color:var(--accent); color:var(--white); box-shadow:0 10px 22px -10px rgba(242,90,90,.8);}
.lp-btn-primary:hover   {background:var(--accent-dark); border-color:var(--accent-dark); color:var(--white);}
.lp-btn-ghost           {color:var(--white); border-color:rgba(255,255,255,.65);}
.lp-btn-ghost:hover     {background:var(--white); border-color:var(--white); color:var(--primary-color);}
.lp-btn-outline         {color:var(--primary-color); border-color:var(--primary-color);}
.lp-btn-outline:hover   {background:var(--primary-color); color:var(--white);}
.lp-btn-arrow::after,
 .lp-link::after        {content:""; flex:0 0 14px; height:14px; background:currentColor; -webkit-mask:url(/img/icons/arrow-right.svg) center / contain no-repeat; mask:url(/img/icons/arrow-right.svg) center / contain no-repeat; transition:transform .25s;}
.lp-btn-arrow:hover::after,
 .lp-link:hover::after  {transform:translateX(3px);}

/* Lien texte + flèche corail */
.lp-link                {display:inline-flex; align-items:center; gap:.7em; font-size:.86rem; font-weight:500; color:var(--primary-color); transition:color .25s;}
.lp-link::after         {background:var(--accent);}
.lp-link:hover          {color:var(--accent);}

/* ICÔNES (couleur = background, dessin = --ico) ---------- */
.lp-ico                 {display:block; width:40px; height:40px; font-size:0; background:var(--primary-color); -webkit-mask:var(--ico) center / contain no-repeat; mask:var(--ico) center / contain no-repeat; transition:background .25s, transform .25s;}

/* HERO ----------------------------------------------------*/
.lp-hero                {--lp-veil:linear-gradient(90deg,#1b2531 0%,rgba(27,37,49,.92) 34%,rgba(27,37,49,0) 64%);
                         display:flex; align-items:center; min-height:clamp(460px,60vh,600px); padding:clamp(60px,8vw,110px) clamp(20px,5vw,60px); background-color:var(--primary-color); background-image:var(--lp-veil), var(--lp-photo, radial-gradient(ellipse at 80% 40%,#2d3e54 0%,#1b2531 58%)); background-size:cover; background-position:right top; background-repeat:no-repeat;}
.bg-hero                {--lp-photo:url(/img/lpbdc-hero.webp);}
.lp-hero-inner          {width:100%;}
.lp-hero-text           {max-width:560px;}
.lp-hero .lp-eyebrow    {color:var(--on-dark-muted); margin-bottom:22px;}
.lp-hero .lp-eyebrow::before {flex-basis:28px; height:1px; background:currentColor;}
@keyframes lp-in        {from {opacity:0; translate:0 14px; filter:blur(4px);} to {opacity:1; translate:0 0; filter:blur(0);}}
@media (prefers-reduced-motion:no-preference) {
    .lp-hero-text > *   {animation:lp-in .9s cubic-bezier(.2,.7,.2,1) both;}
    .lp-hero-text > :nth-child(2) {animation-delay:.12s;}
    .lp-hero-text > :nth-child(3) {animation-delay:.24s;}
    .lp-hero-text > :nth-child(4) {animation-delay:.36s;}
}

/* SERVICES (8 pictos) ------------------------------------ */
.lp-services            {display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(40px,4.5vw,64px) 24px;}
.lp-service             {display:flex; flex-direction:column; align-items:center; gap:18px; text-align:center; font-size:.95rem; font-weight:400; line-height:1.5; color:var(--primary-color);}
a.lp-service:hover .lp-ico {background:var(--accent); transform:translateY(-3px);}   /* si un service devient un lien */

/* RÉALISATIONS : [contenu:image] habillé -----------------
   Catégorie en gras (« Identité visuelle »), titre discret (« DelTour Immobilier »).
   Le bouton est réduit à son lien étiré : toute la carte reste cliquable. */
.lp-works .content-carousel        {--cn-gap:20px; --cn-img-h:clamp(80px,8.2vw,120px); margin:0 0 30px;}  /* hauteur des flèches = milieu de l'image */
.lp-works .content-card            {background:none; border:0; border-radius:0; box-shadow:none; overflow:visible;}
.lp-works .content-card:hover      {transform:none; box-shadow:none;}
.lp-works .content-card-media      {aspect-ratio:4 / 4; border-radius:var(--radius); overflow:hidden; margin-bottom:14px; background:var(--line);}
.lp-works .content-card-body       {padding:0; gap:2px;}
.lp-works .content-card-cat        {font-size:.95rem; font-weight:500; letter-spacing:0; text-transform:none; color:var(--primary-color);}
.lp-works .content-card-cat:hover  {color:var(--accent);}
.lp-works .content-card-title      {font-size:.84rem; font-weight:300; letter-spacing:0; line-height:1.4; color:var(--ink-soft); margin:0;}
.lp-works .content-card-desc,
 .lp-works .content-card-btn-arrow {display:none;}
.lp-works .content-card-btn        {font-size:0; padding:0; border:0; gap:0;}
.lp .content-carousel-arrow        {border-radius:50%; background:var(--white); color:var(--primary-color); box-shadow:0 6px 18px rgba(27,37,49,.14);}
.lp .content-carousel-arrow:hover  {color:var(--accent);}
.lp .content-carousel-arrow:disabled {opacity:.45;}
.lp-works .content-carousel-prev   {left:-21px;}
.lp-works .content-carousel-next   {right:-21px;}
.lp .content-carousel-dots         {margin-top:10px;}
.lp .content-carousel-dot          {background:#d5dbe3;}
.lp .content-carousel-dot.is-active{background:var(--accent);}

/* OFFRES : [onglets] + cartes ----------------------------- */
.lp .sc-tabs-list       {gap:6px; margin-bottom:clamp(24px,3vw,36px);}
.lp .sc-tabs-btn        {min-width:clamp(120px,13vw,190px); padding:15px 24px; font-size:.86rem; font-weight:500; color:var(--primary-color); background:var(--white); border:1px solid var(--line); border-radius:8px; box-shadow:0 2px 8px rgba(27,37,49,.05);}
.lp .sc-tabs-btn:hover  {border-color:var(--primary-color);}
.lp .sc-tabs-btn[aria-selected="true"] {background:var(--primary-color); border-color:var(--primary-color); color:var(--white);}
.lp .sc-tabs-panels     {padding-inline:16px; margin-inline:-16px;}        /* place pour les ombres latérales */

.lp-offers              {display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(16px,2vw,26px); padding-bottom:18px; isolation:isolate;}

.lp-offer               {position:relative; top:0; display:flex; flex-direction:column; padding:clamp(22px,2.2vw,30px) clamp(20px,2vw,28px); background:var(--white); border:1px solid var(--line); border-radius:8px; box-shadow:0 1px 3px rgba(27,37,49,.05); transition:top .3s ease;}
.lp-offer::before,
 .lp-offer::after       {content:""; position:absolute; z-index:-1; bottom:16px; width:46%; height:45%; max-height:130px; box-shadow:0 16px 15px rgba(27,37,49,.21); transition:transform .3s ease, box-shadow .3s ease;}
.lp-offer::before       {left:10px; transform:rotate(-3.5deg);}
.lp-offer::after        {right:10px; transform:rotate(3.5deg);}
.lp-offer:hover         {top:-4px;}
.lp-offer:hover::before {transform:rotate(-4.5deg); box-shadow:0 22px 18px rgba(27,37,49,.24);}
.lp-offer:hover::after  {transform:rotate(4.5deg); box-shadow:0 22px 18px rgba(27,37,49,.24);}
.lp-offer h3            {font-size:.9rem; font-weight:500; margin:0 0 14px;}
.lp .lp-price           {font-size:clamp(1.7rem,2.3vw,2.1rem); font-weight:600; line-height:1.1; color:var(--primary-color); margin:0 0 22px;}
.lp-checks              {list-style:none; padding:0; margin:0 0 28px; display:grid; gap:10px; font-size:.84rem; line-height:1.4;}
.lp-checks li           {display:flex; gap:10px; align-items:flex-start;}
.lp-checks li::before   {content:""; flex:0 0 13px; height:13px; margin-top:2px; background:var(--ink-soft); -webkit-mask:url(/img/icons/check.svg) center / contain no-repeat; mask:url(/img/icons/check.svg) center / contain no-repeat;}
.lp-offer .lp-btn       {margin-top:auto; width:100%; padding:12px 16px; border-radius:10px; font-size:.84rem; box-shadow:none;}
.lp-offer .lp-btn:hover {transform:none;}
/* Carte mise en avant (marine) */
.lp-offer-dark          {background:var(--primary-color); border-color:var(--primary-color); color:var(--on-dark-muted);}
.lp-offer-dark h3,
 .lp .lp-offer-dark .lp-price {color:var(--white);}
.lp-offer-dark .lp-checks li::before {background:var(--white);}
.lp-offer-dark::before,
 .lp-offer-dark::after  {box-shadow:0 16px 15px rgba(27,37,49,.34);}

/* POURQUOI NOUS CHOISIR ---------------------------------- */
.lp-why                 {display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr); background:var(--surface-alt);}
.lp-why-media           {min-height:clamp(300px,30vw,420px); font-size:0; background-color:var(--primary-color); background-image:var(--lp-photo, radial-gradient(ellipse at 30% 30%,#2d3e54 0%,#1b2531 65%)); background-size:cover; background-position:center;}
.lp-why-body            {align-self:center; padding:clamp(48px,6vw,88px) clamp(20px,5vw,60px) clamp(48px,6vw,88px) clamp(28px,5.5vw,80px);}
.lp-feats               {display:grid; grid-template-columns:repeat(4,1fr); gap:24px; max-width:720px; margin-top:clamp(28px,3.5vw,44px);}
.lp-feat                {display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; font-size:.95rem; font-weight:400; line-height:1.45; color:var(--primary-color);}

/* BANDEAU CONTACT ---------------------------------------- */
.lp-cta                 {padding:clamp(48px,6vw,80px) clamp(20px,5vw,60px); background:var(--primary-color); color:var(--on-dark-muted);}
.lp-cta-inner           {position:relative; z-index:1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:32px 48px;}
.lp-cta h2              {color:var(--white); margin-bottom:.35em;}
.lp-cta p               {margin-bottom:1.6em;}
.lp-cta .lp-eyebrow     {color:var(--on-dark-muted);}
.lp .lp-script          {margin:0 clamp(0px,7vw,120px) 0 0; font-size:clamp(1.25rem,1.9vw,1.6rem); font-weight:200; font-style:italic; line-height:1.35; color:var(--on-dark); transform:rotate(-7deg);}

/* BANDE CORAIL EN DIAGONALE (décor d'angle) ---------------
   À poser sur un bloc : lp-stripe-bl (bas gauche) · lp-stripe-br (bas droite). */
.lp-stripe-bl,
 .lp-stripe-br          {position:relative; overflow:hidden;}
.lp-stripe-bl::after,
 .lp-stripe-br::after   {content:""; position:absolute; bottom:0; width:clamp(120px,15vw,210px); aspect-ratio:1; pointer-events:none; background:linear-gradient(var(--lp-stripe-dir), transparent 24%, var(--accent) 24.4% 35.6%, transparent 36%);}
.lp-stripe-bl::after    {left:0; --lp-stripe-dir:to top right;}
.lp-stripe-br::after    {right:0; --lp-stripe-dir:to top left;}

@keyframes lp-rise      {from {opacity:0; translate:0 24px;} to {opacity:1; translate:0 0;}}
@supports (animation-timeline:view()) {
    @media (prefers-reduced-motion:no-preference) {
        .lp-reveal      {animation:lp-rise linear both; animation-timeline:view(); animation-range:entry 0% entry 35%;}
    }
}

/* ICÔNES : chaque classe ne fait que fournir le dessin (--ico) — fichiers dans /img/icons/ */
.ico-pencil    {--ico:url(/img/icons/pencil.svg);}
.ico-cards     {--ico:url(/img/icons/cards.svg);}
.ico-document  {--ico:url(/img/icons/document.svg);}
.ico-monitor   {--ico:url(/img/icons/monitor.svg);}
.ico-search    {--ico:url(/img/icons/search.svg);}
.ico-refresh   {--ico:url(/img/icons/refresh.svg);}
.ico-code      {--ico:url(/img/icons/code.svg);}
.ico-rocket    {--ico:url(/img/icons/rocket.svg);}
.ico-bulb      {--ico:url(/img/icons/bulb.svg);}
.ico-users     {--ico:url(/img/icons/users.svg);}
.ico-heart     {--ico:url(/img/icons/heart.svg);}
.ico-bolt      {--ico:url(/img/icons/bolt.svg);}
.ico-pin       {--ico:url(/img/icons/pin.svg);}
.ico-phone     {--ico:url(/img/icons/phone.svg);}
.ico-mail      {--ico:url(/img/icons/mail.svg);}
.ico-facebook  {--ico:url(/img/icons/facebook.svg);}
.ico-instagram {--ico:url(/img/icons/instagram.svg);}
.ico-linkedin  {--ico:url(/img/icons/linkedin.svg);}
.ico-youtube   {--ico:url(/img/icons/youtube.svg);}

/* RESPONSIVE -------------------------------------------- */
@media (max-width:1024px){
    .lp-offers          {grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:34px;}
}
@media (max-width:960px){
    .lp-works .content-carousel {--cn-img-h:17vw;}
    .lp-why             {grid-template-columns:1fr;}
    .lp-why-media       {min-height:clamp(220px,45vw,340px);}
}
@media (max-width:768px){
    .lp .lp-hero        {--lp-veil:linear-gradient(rgba(27,37,49,.84),rgba(27,37,49,.84)); min-height:0; background-position:70% center;}
    .lp h2 br           {display:none;}                          /* retours à la ligne pensés pour l'ordinateur */
    .lp-services        {grid-template-columns:repeat(2,1fr);}
    .lp-feats           {grid-template-columns:repeat(2,1fr); row-gap:30px;}
    .lp-head > p        {max-width:none;}
    .lp-cta-inner       {flex-direction:column; align-items:flex-start;}
    .lp .lp-script      {margin:0 0 0 12px;}                     /* à gauche : la bande corail occupe le coin droit */
}
@media (max-width:560px){
    .lp-offers          {grid-template-columns:minmax(0,1fr);}
    .lp .sc-tabs-btn    {min-width:0; padding:13px 18px;}
}
@media (hover:none){
    .lp-btn:hover       {transform:none;}
    .lp-offer:hover     {top:0;}
}

.bg-pourquoi        {/* --lp-photo:url(/img/lpbdc-cartes.webp); */}