
    /* ═══════════════════════════════════════════════
       DESIGN TOKENS
    ═══════════════════════════════════════════════ */
    :root {
      /* ── Bleu marine (remplace vert) ── */
      --g950: #05080F;
      --g900: #090E1F;
      --g800: #0E1B42;
      --g700: #162B6E;
      --g600: #1E3D9E;
      --g500: #2E55C4;
      --g400: #4C72D8;
      --g200: #98AEEC;
      --g100: #D0DAFC;
      --g50:  #ECF0FD;
      /* ── Bordeaux / Rouge (remplace or) ── */
      --gold:    #8C1A2A;
      --gold-lt: #C43050;
      --gold-dk: #6A0E1E;
      /* ── Backgrounds ── */
      --cream:  #F5F5FA;
      --cream2: #ECEDF5;
      --cream3: #FAFAFD;
      /* ── Texte ── */
      --tx:   #0A0C18;
      --tx2:  #303660;
      --tx3:  #626888;
      --tx4:  #96A0BA;
      --bd:   #D0D5EC;
      --bd2:  #E4E8F6;
      --wh:   #FFFFFF;
      --fs:   'Lora', Georgia, serif;
      --fss:  'Space Grotesk', system-ui, sans-serif;
      --sh1:  0 1px 3px rgba(0,0,0,.06),0 1px 2px rgba(0,0,0,.04);
      --sh2:  0 4px 14px rgba(0,0,0,.09),0 2px 4px rgba(0,0,0,.04);
      --sh3:  0 12px 40px rgba(0,0,0,.12),0 4px 8px rgba(0,0,0,.05);
      --sh4:  0 24px 64px rgba(0,0,0,.14);
      --tr:   all .24s cubic-bezier(.4,0,.2,1);
      --trs:  all .44s cubic-bezier(.4,0,.2,1);
    }

    /* ═══════════════════════════════════════════════
       RESET
    ═══════════════════════════════════════════════ */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: var(--fss);
      color: var(--tx);
      background: var(--cream3);
      line-height: 1.6;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
    }
    img { max-width: 100%; display: block; }
    a { color: inherit; text-decoration: none; }
    button { cursor: pointer; border: none; background: none; font-family: inherit; }
    ul, ol { list-style: none; }
    input, select, textarea { font-family: inherit; }

    /* ═══════════════════════════════════════════════
       SPA ROUTER
    ═══════════════════════════════════════════════ */
    .page { display: none; animation: fadeInPg .35s ease both; }
    .page.active { display: block; }
    .page-flex.active { display: flex; }
    @keyframes fadeInPg { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

    /* ═══════════════════════════════════════════════
       TYPOGRAPHY SCALE
    ═══════════════════════════════════════════════ */
    .d1 { font-family: var(--fs); font-size: clamp(52px,6vw,92px); font-weight:700; line-height:1.02; letter-spacing:-.03em; }
    .d2 { font-family: var(--fs); font-size: clamp(36px,4.5vw,64px); font-weight:700; line-height:1.07; letter-spacing:-.025em; }
    .h1 { font-family: var(--fs); font-size: clamp(28px,3vw,46px); font-weight:600; line-height:1.12; letter-spacing:-.02em; }
    .h2 { font-family: var(--fs); font-size: clamp(20px,2vw,30px); font-weight:600; line-height:1.2; }
    .h3 { font-family: var(--fs); font-size: clamp(17px,1.5vw,22px); font-weight:500; line-height:1.3; }
    .lbl { font-family: var(--fss); font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; }
    .lbl-gold { color: var(--gold); }

    /* ═══════════════════════════════════════════════
       LAYOUT
    ═══════════════════════════════════════════════ */
    .wrap  { max-width:1280px; margin:0 auto; padding:0 48px; }
    .wrap-n { max-width:960px; margin:0 auto; padding:0 48px; }
    .sec  { padding:96px 0; }
    .sec-sm { padding:64px 0; }
    .g2 { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
    .g3 { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
    .g4 { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
    .row { display:flex; }
    .row-c { display:flex; align-items:center; }
    .row-cb { display:flex; align-items:center; justify-content:space-between; }

    /* ═══════════════════════════════════════════════
       SECTION HEADER
    ═══════════════════════════════════════════════ */
    .sh { margin-bottom:56px; }
    .sh-label { display:flex; align-items:center; gap:12px; color:var(--gold); margin-bottom:14px; }
    .sh-label::before { content:''; width:28px; height:1px; background:var(--gold); }
    .sh-desc { margin-top:16px; color:var(--tx3); max-width:520px; font-size:15px; line-height:1.75; }
    .sh-center { text-align:center; }
    .sh-center .sh-label { justify-content:center; }
    .sh-center .sh-label::before, .sh-center .sh-label::after { content:''; width:28px; height:1px; background:var(--gold); }
    .sh-center .sh-desc { margin:16px auto 0; }

    /* ═══════════════════════════════════════════════
       BUTTONS
    ═══════════════════════════════════════════════ */
    .btn { display:inline-flex; align-items:center; gap:8px; font-family:var(--fss); font-size:13.5px; font-weight:600; letter-spacing:.02em; padding:14px 28px; transition:var(--tr); cursor:pointer; white-space:nowrap; border:none; }
    .btn-lg { padding:17px 36px; font-size:15px; }
    .btn-sm { padding:9px 18px; font-size:12px; }
    .btn-primary { background:var(--g800); color:var(--wh); }
    .btn-primary:hover { background:var(--g900); }
    .btn-gold { background:var(--gold); color:var(--g900); }
    .btn-gold:hover { background:var(--gold-lt); }
    .btn-outline { background:transparent; border:1.5px solid var(--wh); color:var(--wh); }
    .btn-outline:hover { background:rgba(255,255,255,.08); }
    .btn-outline-dk { background:transparent; border:1.5px solid var(--g800); color:var(--g800); }
    .btn-outline-dk:hover { background:var(--g50); }

    /* ═══════════════════════════════════════════════
       NAVBAR  ←  {{-- @include('partials.navbar') --}}
    ═══════════════════════════════════════════════ */
    #navbar {
      position:fixed; top:0; left:0; right:0; z-index:200;
      height:72px; display:flex; align-items:center;
      transition:var(--tr);
      border-bottom:1px solid transparent;
    }
    #navbar.solid { background:var(--g900); border-bottom-color:var(--g700); box-shadow:var(--sh2); }
    #navbar.light-nav { background:var(--wh); border-bottom:1px solid var(--bd2); }
    #navbar.light-nav .nav-link { color:var(--tx2); }
    #navbar.light-nav .nav-link:hover { color:var(--g800); }
    #navbar.light-nav .nav-login { color:var(--tx3); }
    .nb-inner { display:flex; align-items:center; justify-content:space-between; width:100%; max-width:1280px; margin:0 auto; padding:0 48px; }
    .nb-logo { display:flex; align-items:center; gap:12px; cursor:pointer; }
    .nb-mark { width:34px; height:34px; background:var(--gold); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .nb-mark svg path.fill { fill:var(--g900); }
    .nb-name { font-family:var(--fs); font-size:17px; font-weight:700; color:var(--wh); line-height:1; }
    .nb-sub { font-size:9px; letter-spacing:.14em; color:var(--gold-lt); text-transform:uppercase; display:block; margin-top:2px; }
    .nb-nav { display:flex; gap:36px; }
    .nav-link { font-size:13px; font-weight:500; color:rgba(255,255,255,.8); letter-spacing:.02em; transition:var(--tr); position:relative; padding-bottom:3px; }
    .nav-link::after { content:''; position:absolute; bottom:0; left:0; right:0; height:1px; background:var(--gold); transform:scaleX(0); transition:var(--tr); transform-origin:left; }
    .nav-link:hover, .nav-link.act { color:var(--wh); }
    .nav-link:hover::after, .nav-link.act::after { transform:scaleX(1); }
    .nb-right { display:flex; align-items:center; gap:16px; }
    .nav-login { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:500; color:rgba(255,255,255,.7); transition:var(--tr); cursor:pointer; }
    .nav-login:hover { color:var(--wh); }

    /* ═══════════════════════════════════════════════
       PAGE HERO (inner pages)
    ═══════════════════════════════════════════════ */
    .ph { background:var(--g800); background-size:cover; background-position:center; padding:140px 0 64px; position:relative; overflow:hidden; }
    .ph::before {
      content:''; position:absolute; inset:0;
      background: linear-gradient(to bottom, rgba(14,27,66,.82) 0%, rgba(14,27,66,.70) 100%),
                  linear-gradient(135deg, rgba(140,26,42,.20) 0%, transparent 55%);
      pointer-events:none;
    }
    .ph-bc { display:flex; align-items:center; gap:8px; font-size:12px; color:rgba(255,255,255,.4); margin-bottom:14px; position:relative; }
    .ph-bc a { transition:var(--tr); cursor:pointer; }
    .ph-bc a:hover { color:rgba(255,255,255,.8); }
    .ph-title { font-family:var(--fs); font-size:clamp(34px,4vw,54px); font-weight:700; color:var(--wh); position:relative; line-height:1.1; }
    .ph-title em { color:var(--gold-lt); font-style:italic; }
    .ph-desc { margin-top:14px; font-size:16px; color:rgba(255,255,255,.55); max-width:520px; line-height:1.75; position:relative; }

    /* ═══════════════════════════════════════════════
       FOOTER  ←  {{-- @include('partials.footer') --}}
    ═══════════════════════════════════════════════ */
    #footer { background:var(--g950); padding:80px 0 32px; }
    .ft-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:64px; padding-bottom:64px; border-bottom:1px solid rgba(255,255,255,.07); }
    .ft-logo { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
    .ft-desc { font-size:13px; color:rgba(255,255,255,.4); line-height:1.75; max-width:260px; margin-bottom:24px; }
    .ft-socials { display:flex; gap:10px; }
    .ft-social { width:34px; height:34px; border:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,.4); transition:var(--tr); cursor:pointer; }
    .ft-social:hover { border-color:var(--gold); color:var(--gold); }
    .ft-col-title { font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin-bottom:24px; }
    .ft-links { display:flex; flex-direction:column; gap:12px; }
    .ft-link { font-size:13px; color:rgba(255,255,255,.45); transition:var(--tr); cursor:pointer; }
    .ft-link:hover { color:var(--wh); padding-left:6px; }
    .ft-ci { display:flex; align-items:flex-start; gap:12px; font-size:13px; color:rgba(255,255,255,.45); margin-bottom:12px; }
    .ft-ci svg { flex-shrink:0; color:var(--gold); margin-top:2px; }
    .ft-bot { display:flex; align-items:center; justify-content:space-between; padding-top:32px; }
    .ft-copy { font-size:12px; color:rgba(255,255,255,.25); }
    .ft-blinks { display:flex; gap:24px; }
    .ft-blinks a { font-size:12px; color:rgba(255,255,255,.25); transition:var(--tr); }
    .ft-blinks a:hover { color:rgba(255,255,255,.6); }

    /* ═══════════════════════════════════════════════
       PROJECT CARD  ←  {{-- @include('partials.project-card') --}}
    ═══════════════════════════════════════════════ */
    .pc { background:var(--wh); overflow:hidden; box-shadow:var(--sh1); transition:var(--tr); position:relative; }
    .pc:hover { box-shadow:var(--sh3); transform:translateY(-4px); }
    .pc-imgw { overflow:hidden; height:230px; }
    .pc-img { width:100%; height:100%; object-fit:cover; transition:var(--trs); }
    .pc:hover .pc-img { transform:scale(1.05); }
    .pc-badge { position:absolute; top:14px; left:14px; padding:5px 12px; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; background:var(--g800); color:var(--wh); }
    .pc-badge.live { background:var(--gold); color:var(--g900); }
    .pc-body { padding:22px 24px; }
    .pc-type { font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
    .pc-title { font-family:var(--fs); font-size:19px; font-weight:600; margin-bottom:6px; }
    .pc-loc { display:flex; align-items:center; gap:4px; font-size:13px; color:var(--tx3); margin-bottom:16px; }
    .pc-specs { display:flex; gap:24px; border-top:1px solid var(--bd2); padding-top:16px; }
    .pc-spec-val { font-size:14px; font-weight:700; }
    .pc-spec-lbl { font-size:11px; color:var(--tx4); }

    /* ═══════════════════════════════════════════════
       PROPERTY CARD  ←  {{-- @include('partials.property-card') --}}
    ═══════════════════════════════════════════════ */
    .prop { background:var(--wh); border:1px solid var(--bd2); overflow:hidden; transition:var(--tr); }
    .prop:hover { box-shadow:var(--sh3); transform:translateY(-4px); }
    .prop-imgw { position:relative; height:210px; overflow:hidden; }
    .prop-img { width:100%; height:100%; object-fit:cover; transition:var(--trs); }
    .prop:hover .prop-img { transform:scale(1.06); }
    .prop-status { position:absolute; top:12px; left:12px; padding:4px 11px; font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
    .prop-status.open { background:var(--gold); color:var(--g900); }
    .prop-status.avail { background:var(--g800); color:var(--wh); }
    .prop-status.soon { background:rgba(13,31,24,.85); color:var(--wh); }
    .prop-fav { position:absolute; top:12px; right:12px; width:32px; height:32px; background:var(--wh); display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--tx3); transition:var(--tr); }
    .prop-fav:hover { color:#E53E3E; }
    .prop-body { padding:18px 20px; }
    .prop-price { font-family:var(--fs); font-size:20px; font-weight:700; color:var(--g800); margin-bottom:4px; }
    .prop-currency { font-size:13px; font-weight:500; }
    .prop-title { font-size:14px; font-weight:600; margin-bottom:6px; }
    .prop-loc { display:flex; align-items:center; gap:4px; font-size:12px; color:var(--tx3); margin-bottom:14px; }
    .prop-specs { display:flex; gap:16px; border-top:1px solid var(--bd2); padding-top:14px; }
    .prop-spec { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--tx3); }
    .prop-spec b { color:var(--tx); font-weight:600; }

    /* ═══════════════════════════════════════════════
       SERVICE CARD
    ═══════════════════════════════════════════════ */
    .sc { display:flex; gap:20px; padding:28px; background:var(--wh); border:1px solid var(--bd2); transition:var(--tr); position:relative; overflow:hidden; }
    .sc::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background:var(--gold); transform:scaleX(0); transition:var(--tr); transform-origin:left; }
    .sc:hover { box-shadow:var(--sh2); transform:translateY(-2px); }
    .sc:hover::before { transform:scaleX(1); }
    .sc-icon { width:46px; height:46px; background:var(--g50); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--g700); }
    .sc-title { font-family:var(--fs); font-size:17px; font-weight:600; margin-bottom:8px; }
    .sc-desc { font-size:13.5px; color:var(--tx3); line-height:1.65; }
    .sc-link { display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--g600); margin-top:12px; transition:var(--tr); cursor:pointer; }
    .sc-link:hover { gap:10px; color:var(--g800); }

    /* ═══════════════════════════════════════════════
       FILTER TABS
    ═══════════════════════════════════════════════ */
    .ftabs { display:flex; gap:4px; border-bottom:1px solid var(--bd); margin-bottom:32px; }
    .ftab { padding:10px 20px; font-size:13px; font-weight:500; color:var(--tx3); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; transition:var(--tr); background:none; }
    .ftab.act { color:var(--g800); border-bottom-color:var(--gold); font-weight:600; }
    .ftab:hover { color:var(--g700); }

    /* ═══════════════════════════════════════════════
       FORMS
    ═══════════════════════════════════════════════ */
    .fgrp { margin-bottom:20px; }
    .flbl { display:block; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--tx3); margin-bottom:8px; }
    .finput, .fselect, .ftxtarea {
      width:100%; padding:12px 15px; border:1.5px solid var(--bd); font-size:14px; outline:none; transition:var(--tr); background:var(--wh); color:var(--tx);
    }
    .finput:focus, .fselect:focus, .ftxtarea:focus { border-color:var(--g500); }
    .ftxtarea { resize:vertical; min-height:120px; }
    .frow { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

    /* ═══════════════════════════════════════════════
       BADGES / TAGS
    ═══════════════════════════════════════════════ */
    .tag { display:inline-flex; align-items:center; gap:6px; padding:4px 12px; font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }
    .tag-green { background:var(--g100); color:var(--g700); }
    .tag-gold { background:#FDEAEC; color:var(--gold-dk); }
    .tag-gray { background:var(--bd2); color:var(--tx3); }

    /* ═══════════════════════════════════════════════
       PAYMENT TABLE
    ═══════════════════════════════════════════════ */
    .ptbl { width:100%; border-collapse:collapse; }
    .ptbl th { text-align:left; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--tx3); padding:10px 16px; border-bottom:1px solid var(--bd); }
    .ptbl td { padding:14px 16px; font-size:13.5px; border-bottom:1px solid var(--bd2); }
    .pbadge { padding:3px 10px; font-size:10.5px; font-weight:600; }
    .pbadge-paid { background:var(--g100); color:var(--g600); }
    .pbadge-due { background:#FDEAEC; color:var(--gold-dk); }
    .pbadge-soon { background:var(--bd2); color:var(--tx3); }

    /* ═══════════════════════════════════════════════
       STATS BAR
    ═══════════════════════════════════════════════ */
    #stats-bar { background:var(--g900); }
    .stat-row { display:grid; grid-template-columns:repeat(4,1fr); }
    .stat-it { padding:32px 24px; border-right:1px solid rgba(255,255,255,.07); text-align:center; }
    .stat-it:last-child { border-right:none; }
    .stat-num { font-family:var(--fs); font-size:44px; font-weight:700; color:var(--wh); line-height:1; }
    .stat-num span { color:var(--gold); }
    .stat-lbl { font-size:11px; font-weight:500; letter-spacing:.09em; text-transform:uppercase; color:rgba(255,255,255,.4); margin-top:6px; }

    /* ═══════════════════════════════════════════════
       DASHBOARD LAYOUT  ←  {{-- @extends('layouts.dashboard') --}}
    ═══════════════════════════════════════════════ */
    .dash-wrap { display:flex; min-height:100vh; }
    .dsb { width:260px; background:var(--g950); min-height:100vh; position:fixed; top:0; left:0; display:flex; flex-direction:column; z-index:50; }
    .dsb-logo { padding:22px 20px; border-bottom:1px solid rgba(255,255,255,.06); display:flex; align-items:center; gap:12px; }
    .dsb-nav { flex:1; padding:12px; overflow-y:auto; }
    .dsb-sec { font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.22); padding:16px 12px 8px; }
    .dni { display:flex; align-items:center; gap:12px; padding:9px 12px; font-size:14px; color:rgba(255,255,255,.5); cursor:pointer; transition:var(--tr); margin-bottom:2px; }
    .dni:hover { background:rgba(255,255,255,.05); color:rgba(255,255,255,.9); }
    .dni.act { background:rgba(201,168,76,.12); color:var(--gold-lt); }
    .dni-badge { margin-left:auto; background:var(--gold); color:var(--g900); font-size:10px; font-weight:700; padding:2px 7px; border-radius:10px; min-width:20px; text-align:center; }
    .dsb-user { padding:16px 20px; border-top:1px solid rgba(255,255,255,.06); display:flex; align-items:center; gap:12px; }
    .dav { width:36px; height:36px; background:var(--g600); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:var(--wh); flex-shrink:0; }
    .dash-main { margin-left:260px; flex:1; background:#EEEAE4; min-height:100vh; }
    .dash-top { background:var(--wh); padding:0 32px; height:62px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--bd2); position:sticky; top:0; z-index:40; }
    .dash-top-title { font-family:var(--fs); font-size:20px; font-weight:600; }
    .dash-top-r { display:flex; align-items:center; gap:14px; }
    .dash-notif { position:relative; width:38px; height:38px; background:var(--cream2); display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--tx2); transition:var(--tr); }
    .dash-notif:hover { background:var(--bd); }
    .notif-dot { position:absolute; top:8px; right:8px; width:8px; height:8px; background:#E53E3E; border-radius:50%; border:2px solid var(--wh); }
    .dash-content { padding:32px; }

    /* DASH STAT CARD */
    .dsc { background:var(--wh); padding:22px; }
    .dsc-hd { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
    .dsc-lbl { font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--tx3); }
    .dsc-ico { width:36px; height:36px; display:flex; align-items:center; justify-content:center; }
    .dsc-num { font-family:var(--fs); font-size:32px; font-weight:700; line-height:1; }
    .dsc-sub { font-size:12px; margin-top:6px; }
    .sub-up { color:var(--g500); }
    .sub-warn { color:var(--gold-dk); }
    .sub-neu { color:var(--tx3); }

    /* ═══════════════════════════════════════════════
       AUTH LAYOUT  ←  {{-- @extends('layouts.auth') --}}
    ═══════════════════════════════════════════════ */
    .auth-wrap { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; }
    .auth-brand { background:var(--g800); display:flex; flex-direction:column; justify-content:space-between; padding:48px; position:relative; overflow:hidden; }
    .auth-brand-img { position:absolute; inset:0; object-fit:cover; width:100%; height:100%; opacity:.18; }
    .auth-brand-grid { position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px); background-size:50px 50px; }
    .auth-brand-logo { position:relative; display:flex; align-items:center; gap:12px; }
    .auth-quote { position:relative; }
    .auth-quote-text { font-family:var(--fs); font-size:30px; font-weight:600; color:var(--wh); line-height:1.3; margin-bottom:12px; }
    .auth-quote-text em { color:var(--gold-lt); font-style:italic; }
    .auth-quote-by { font-size:13px; color:rgba(255,255,255,.45); }
    .auth-form-side { background:var(--cream3); display:flex; align-items:center; justify-content:center; padding:48px; }
    .auth-box { width:100%; max-width:400px; }
    .auth-title { font-family:var(--fs); font-size:34px; font-weight:700; margin-bottom:8px; }
    .auth-sub { font-size:14px; color:var(--tx3); margin-bottom:32px; }
    .auth-div { display:flex; align-items:center; gap:16px; margin:22px 0; }
    .auth-div::before, .auth-div::after { content:''; flex:1; height:1px; background:var(--bd); }
    .auth-div span { font-size:12px; color:var(--tx3); }
    .auth-foot { text-align:center; margin-top:22px; font-size:13px; color:var(--tx3); }
    .auth-foot a { color:var(--g600); font-weight:600; cursor:pointer; }

    /* ═══════════════════════════════════════════════
       PROJECT TRACKING
    ═══════════════════════════════════════════════ */
    .tl { display:flex; flex-direction:column; }
    .tl-phase { display:flex; gap:18px; padding-bottom:24px; }
    .tl-phase:last-child { padding-bottom:0; }
    .tl-line { display:flex; flex-direction:column; align-items:center; flex-shrink:0; }
    .tl-dot { width:14px; height:14px; border-radius:50%; flex-shrink:0; z-index:1; }
    .tl-dot.done { background:var(--g600); }
    .tl-dot.curr { background:var(--gold); box-shadow:0 0 0 4px rgba(201,168,76,.2); animation:pulse 2s infinite; }
    .tl-dot.pend { background:var(--bd); }
    @keyframes pulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.6; transform:scale(.85); } }
    .tl-conn { flex:1; width:1px; background:var(--bd); margin-top:4px; }
    .tl-conn.done { background:var(--g600); }
    .tl-content { flex:1; padding-bottom:4px; }
    .tl-ph-name { font-size:15px; font-weight:600; margin-bottom:4px; }
    .tl-ph-name.pend { color:var(--tx4); }
    .tl-ph-date { font-size:12px; color:var(--tx3); }
    .tl-ph-desc { font-size:13px; color:var(--tx3); line-height:1.6; margin-top:4px; }
    .ph-bar { height:4px; background:var(--bd2); margin-top:10px; overflow:hidden; }
    .ph-fill { height:100%; background:var(--g600); }
    .ph-fill.curr { background:var(--gold); }

    /* Messages */
    .msg-list { display:flex; flex-direction:column; gap:16px; max-height:300px; overflow-y:auto; padding-right:4px; }
    .msg { display:flex; gap:10px; max-width:82%; }
    .msg.self { flex-direction:row-reverse; margin-left:auto; }
    .msg-av { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex-shrink:0; }
    .msg-av.ag { background:var(--g100); color:var(--g700); }
    .msg-av.me { background:#F5ECC8; color:var(--gold-dk); }
    .msg-meta { display:flex; flex-direction:column; gap:3px; }
    .msg-name { font-size:10.5px; font-weight:600; color:var(--tx3); }
    .msg-bubble { background:var(--wh); padding:10px 13px; font-size:13px; line-height:1.6; box-shadow:var(--sh1); }
    .msg.self .msg-bubble { background:var(--g800); color:var(--wh); }
    .msg-time { font-size:10px; color:var(--tx4); }
    .msg-bar { display:flex; gap:10px; padding-top:14px; border-top:1px solid var(--bd2); margin-top:14px; }
    .msg-inp { flex:1; padding:9px 14px; border:1.5px solid var(--bd); font-size:13px; outline:none; transition:var(--tr); }
    .msg-inp:focus { border-color:var(--g500); }

    /* ═══════════════════════════════════════════════
       DEV NAV BAR (remove in production)
    ═══════════════════════════════════════════════ */
    #devnav {
      position:fixed; bottom:18px; left:50%; transform:translateX(-50%);
      background:var(--g950); border:1px solid rgba(255,255,255,.12);
      display:flex; gap:2px; padding:4px; z-index:9999;
      box-shadow:var(--sh4); border-radius:2px;
    }
    .dn-btn {
      padding:7px 13px; font-size:11px; font-weight:600; letter-spacing:.04em;
      color:rgba(255,255,255,.45); cursor:pointer; transition:var(--tr);
      background:transparent; border:none; font-family:var(--fss);
    }
    .dn-btn:hover { color:var(--wh); background:rgba(255,255,255,.05); }
    .dn-btn.act { background:var(--g700); color:var(--wh); }

    /* ═══════════════════════════════════════════════
       MISC HELPERS
    ═══════════════════════════════════════════════ */
    @keyframes fadeUp { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
    .au { animation:fadeUp .6s cubic-bezier(.4,0,.2,1) both; }
    .au1 { animation-delay:.1s; } .au2 { animation-delay:.2s; } .au3 { animation-delay:.3s; }

    /* ═══════════════════════════════════════════════
       ADMIN KPI CARDS
    ═══════════════════════════════════════════════ */
    .kpi { background:var(--wh); padding:22px 24px; box-shadow:0 1px 3px rgba(0,0,0,.06); border-left:3px solid var(--bd2); }
    .kpi.green { border-left-color:var(--g600); }
    .kpi.gold  { border-left-color:var(--gold); }
    .kpi.red   { border-left-color:#E53E3E; }
    .kpi.blue  { border-left-color:#3182CE; }
    .kpi-lbl { font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--tx3); margin-bottom:10px; }
    .kpi-num { font-family:var(--fs); font-size:38px; font-weight:700; line-height:1; color:var(--tx1); }
    .kpi.green .kpi-num { color:var(--g700); }
    .kpi.gold  .kpi-num { color:var(--gold-dk); }
    .kpi.red   .kpi-num { color:#C53030; }
    .kpi.blue  .kpi-num { color:#2B6CB0; }
    .kpi-sub { font-size:12px; color:var(--tx3); margin-top:6px; }

    /* ═══════════════════════════════════════════════
       ADMIN TABLE HELPERS
    ═══════════════════════════════════════════════ */
    .tbl-btn { font-size:12px; font-weight:600; color:var(--g600); text-decoration:none; padding:4px 0; background:none; border:none; cursor:pointer; font-family:inherit; }
    .tbl-btn:hover { color:var(--g800); text-decoration:underline; }
    .tbl-btn-edit { color:var(--g700); }
    .tbl-btn-view { color:var(--g600); }
    .tbl-btn-del  { color:#C53030; }
    .tbl-btn-del:hover { color:#9B2C2C; }
    .tbl-actions { display:flex; align-items:center; gap:12px; }
    .prog-bar { height:5px; background:var(--bd2); overflow:hidden; border-radius:2px; }
    .prog-fill { height:100%; background:var(--g600); border-radius:2px; }
    .prog-fill.gold { background:var(--gold); }

    /* Status pills (used via Enum pillClass()) */
    .pill { display:inline-block; padding:3px 10px; font-size:11px; font-weight:600; letter-spacing:.04em; border-radius:20px; }
    .pill-green  { background:#DBEAFE; color:#1E3A8A; }
    .pill-gold   { background:#FDEAEC; color:var(--gold-dk); }
    .pill-red    { background:#FEE2E2; color:#991B1B; }
    .pill-gray   { background:var(--bd2); color:var(--tx3); }
    .pill-blue   { background:#DBEAFE; color:#1E3A8A; }

    /* ═══════════════════════════════════════════════
       ADMIN SIDEBAR  (adm-* naming used in partials)
    ═══════════════════════════════════════════════ */
    .adm-sb { width:260px; background:var(--g950); min-height:100vh; position:fixed; top:0; left:0; display:flex; flex-direction:column; z-index:50; }
    .adm-sb-logo { padding:22px 20px; border-bottom:1px solid rgba(255,255,255,.06); display:flex; align-items:center; gap:12px; }
    .adm-sb-badge { font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); background:rgba(201,168,76,.12); padding:2px 7px; display:inline-block; margin-top:3px; }
    .adm-sb-nav { flex:1; padding:12px; overflow-y:auto; }
    .adm-sec-lbl { font-size:10px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.22); padding:16px 12px 8px; }
    .adm-ni { display:flex; align-items:center; gap:12px; padding:9px 12px; font-size:13.5px; color:rgba(255,255,255,.5); cursor:pointer; transition:var(--tr); margin-bottom:2px; text-decoration:none; }
    .adm-ni:hover { background:rgba(255,255,255,.05); color:rgba(255,255,255,.9); }
    .adm-ni.act { background:rgba(201,168,76,.12); color:var(--gold-lt); }
    .adm-badge { margin-left:auto; font-size:10px; font-weight:700; padding:2px 7px; border-radius:10px; min-width:20px; text-align:center; }
    .adm-badge.red { background:#E53E3E; color:#fff; }
    .adm-badge.gold { background:var(--gold); color:var(--g900); }
    .adm-sb-user { padding:16px 20px; border-top:1px solid rgba(255,255,255,.06); display:flex; align-items:center; gap:12px; }

    /* ═══════════════════════════════════════════════
       ADMIN CARDS & TABLE
    ═══════════════════════════════════════════════ */
    .adm-card { background:var(--wh); box-shadow:0 1px 3px rgba(0,0,0,.06); }
    .adm-card-head { padding:18px 24px; border-bottom:1px solid var(--bd2); display:flex; align-items:center; justify-content:space-between; }
    .adm-card-title { font-family:var(--fs); font-size:16px; font-weight:600; color:var(--tx1); }
    .adm-table { width:100%; border-collapse:collapse; font-size:13.5px; }
    .adm-table th { text-align:left; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--tx3); padding:11px 16px; border-bottom:1px solid var(--bd2); background:var(--cream3); }
    .adm-table td { padding:13px 16px; border-bottom:1px solid var(--bd2); color:var(--tx2); vertical-align:middle; }
    .adm-table tr:last-child td { border-bottom:none; }
    .adm-table tr:hover td { background:var(--cream3); }

    /* ═══════════════════════════════════════════════
       ADMIN ACTION BUTTONS
    ═══════════════════════════════════════════════ */
    .btn-edit { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; font-size:12px; font-weight:600; background:var(--cream2); color:var(--g700); border:1px solid var(--bd); cursor:pointer; transition:var(--tr); text-decoration:none; }
    .btn-edit:hover { background:var(--g50); border-color:var(--g400); color:var(--g900); }
    .btn-view { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; font-size:12px; font-weight:600; background:transparent; color:var(--g600); border:1px solid var(--g300); cursor:pointer; transition:var(--tr); text-decoration:none; }
    .btn-view:hover { background:var(--g50); }
    .btn-del { display:inline-flex; align-items:center; gap:5px; padding:5px 11px; font-size:12px; font-weight:600; background:transparent; color:#c53030; border:1px solid #feb2b2; cursor:pointer; transition:var(--tr); text-decoration:none; }
    .btn-del:hover { background:#fff5f5; border-color:#fc8181; }
    .grid-dot { background-image:radial-gradient(circle,rgba(255,255,255,.06) 1px,transparent 1px); background-size:28px 28px; }
  
    /* ═══════════════════════════════════════════════
       RESPONSIVE LAYOUT UTILITIES
    ═══════════════════════════════════════════════ */
    .ct-grid   { display:grid; grid-template-columns:1fr 1fr; min-height:580px; }
    .pj-layout { display:grid; grid-template-columns:2fr 1fr; gap:48px; align-items:start; }
    .pj-gal    { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:36px; }
    .adm-2col  { display:grid; grid-template-columns:1fr 1fr; gap:24px; }

    /* Hamburger (V2 navbar) */
    .nb-burger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:6px; }
    .nb-burger span { display:block; width:22px; height:1.5px; background:rgba(255,255,255,.85); transition:var(--tr); }
    .nb-burger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
    .nb-burger.open span:nth-child(2) { opacity:0; }
    .nb-burger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
    .nb-mob-menu {
      display:none; position:fixed; top:72px; left:0; right:0; bottom:0;
      background:var(--g900); z-index:199; overflow-y:auto; padding:16px 20px 32px;
      flex-direction:column; border-top:1px solid rgba(255,255,255,.06);
    }
    .nb-mob-menu.open { display:flex; }
    .nb-mob-link {
      display:block; font-size:16px; font-weight:500; color:rgba(255,255,255,.7);
      padding:15px 0; border-bottom:1px solid rgba(255,255,255,.07); letter-spacing:.01em;
    }
    .nb-mob-link.act, .nb-mob-link:hover { color:var(--wh); }
    .nb-mob-cta { display:flex; flex-direction:column; gap:12px; margin-top:28px; }
    .nb-mob-cta .btn { width:100%; justify-content:center; }

    /* Admin mobile sidebar */
    .adm-mob-btn { display:none; background:none; border:none; cursor:pointer; padding:6px; color:var(--tx2); }
    .adm-mob-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:49; }

    /* ─── 1100px — Tablette ───────────────────── */
    @media (max-width:1100px) {
      .wrap, .wrap-n { padding:0 28px; }
      .nb-inner { padding:0 28px; }
      .nb-nav { gap:22px; }
      .g3 { grid-template-columns:1fr 1fr; }
      .g4 { grid-template-columns:1fr 1fr; }
      .stat-row { grid-template-columns:1fr 1fr; }
      .stat-it:nth-child(2) { border-right:none; }
      .ft-grid { grid-template-columns:1.5fr 1fr 1fr; gap:40px; }
      .ft-grid > div:last-child { grid-column:1/-1; }
      .adm-2col { gap:18px; }
      .auth-wrap { grid-template-columns:1fr; }
      .auth-brand { display:none; }
      .auth-form-side { min-height:100vh; }
      .pj-layout { gap:32px; }
    }

    /* ─── 768px — Mobile/Tablette ─────────────── */
    @media (max-width:768px) {
      .wrap, .wrap-n { padding:0 18px; }
      .nb-inner { padding:0 18px; }
      .nb-nav { display:none; }
      .nb-right { display:none; }
      .nb-burger { display:flex; }

      .sec { padding:56px 0; }
      .sec-sm { padding:40px 0; }
      .sh { margin-bottom:32px; }

      .g2 { grid-template-columns:1fr; gap:20px; }
      .g3 { grid-template-columns:1fr; }
      .g4 { grid-template-columns:1fr 1fr; gap:16px; }
      .stat-row { grid-template-columns:1fr 1fr; }
      .stat-it { padding:22px 16px; }
      .stat-num { font-size:32px; }

      .ft-grid { grid-template-columns:1fr; gap:32px; padding-bottom:40px; }
      .ft-desc { max-width:100%; }
      .ft-bot { flex-direction:column; gap:10px; text-align:center; }
      .ft-blinks { justify-content:center; }

      .frow { grid-template-columns:1fr; }
      .ct-grid { grid-template-columns:1fr; min-height:auto; }
      .pj-layout { grid-template-columns:1fr; gap:24px; }
      .pj-gal { grid-template-columns:1fr 1fr; gap:8px; }
      .adm-2col { grid-template-columns:1fr; }

      .ph { padding:108px 0 44px; }
      .ph-title { font-size:clamp(22px,6vw,34px); }
      .ph-desc { font-size:14px; }

      /* Admin layout mobile */
      .adm-mob-btn { display:flex; align-items:center; justify-content:center; }
      .adm-sb {
        position:fixed; left:0; top:0; bottom:0;
        transform:translateX(-100%); transition:transform .3s cubic-bezier(.4,0,.2,1); z-index:200;
      }
      .adm-sb.open { transform:translateX(0); }
      .adm-mob-overlay.show { display:block; }
      .dash-main { margin-left:0 !important; }
      .dash-content { padding:20px 14px; }
      .dash-top { padding:0 14px; }
      .adm-table { font-size:12.5px; }
      .adm-table th, .adm-table td { padding:10px 12px; }
      .tbl-actions { gap:6px; }
      .btn-edit, .btn-view, .btn-del { padding:4px 8px; font-size:11px; }
    }

    /* ─── 480px — Petit mobile ─────────────────── */
    @media (max-width:480px) {
      .wrap, .wrap-n { padding:0 14px; }
      .g4 { grid-template-columns:1fr; }
      .stat-row { grid-template-columns:1fr 1fr; }
      .nb-inner { padding:0 14px; }
      .ph { padding:96px 0 36px; }
      .sec { padding:44px 0; }
      .btn-lg { padding:14px 22px; font-size:13px; }
      .ft-grid { gap:24px; }
      .pj-gal { grid-template-columns:1fr; }
      .adm-table { font-size:11.5px; }
    }

    /* ─── Grilles de page (remplacement inline styles) ─ */
    .v2-hero { display:grid; grid-template-columns:55% 45%; min-height:100vh; }
    .v2-flex-cta { display:flex; justify-content:center; gap:14px; flex-wrap:wrap; }
    .v2-flex-sh  { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:40px; flex-wrap:wrap; gap:16px; }

    @media (max-width:768px) {
      .v2-hero { grid-template-columns:1fr; min-height:auto; }
      .v2-hero > div:first-child { min-height:auto; padding:120px 18px 52px !important; }
      .v2-hero > div:last-child  { height:62vw; min-height:220px; }
      .v2-hero > div:last-child::before {
        content:''; position:absolute; top:0; left:0; right:0; height:45%;
        background:linear-gradient(to bottom, var(--g800) 0%, transparent 100%);
        z-index:2; pointer-events:none;
      }
      .v2-flex-sh { flex-direction:column; align-items:flex-start; }
      .v2-flex-sh a.btn { display:none; }
      .g2[style*="gap:96px"] { gap:36px !important; }
    }

    @media (max-width:480px) {
      .v2-flex-cta { flex-direction:column; align-items:center; }
    }

    /* ─── Correctifs responsifs additionnels ─────── */

    /* Stats 2 colonnes (about page) */
    .g2-2col { display:grid; grid-template-columns:1fr 1fr; gap:22px; }

    /* Onglets filtres scrollables sur mobile */
    @media (max-width:768px) {
      .ftabs        { overflow-x:auto; -webkit-overflow-scrolling:touch; flex-wrap:nowrap; padding-bottom:2px; scrollbar-width:none; }
      .ftabs::-webkit-scrollbar { display:none; }
      .ftab         { white-space:nowrap; flex-shrink:0; padding:10px 12px; font-size:12px; }

      /* Annuler direction:rtl sur mobile (services alternés) */
      .g2           { direction:ltr !important; }
      .g2 > *       { direction:ltr !important; }
    }

    /* ─── Barre de filtres projets/propriétés ───── */
    .flt-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
    .ftabs   { display:flex; gap:4px; flex:1; border-bottom:1px solid var(--bd); margin-bottom:0; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
    .ftabs::-webkit-scrollbar { display:none; }
    .flt-sel-form { flex-shrink:0; }
    .flt-sel { width:auto; min-width:150px; }

    @media (max-width:640px) {
      .flt-bar   { flex-direction:column; align-items:stretch; gap:0; }
      .ftabs     { flex:none; border-bottom:1px solid var(--bd); margin-bottom:0; }
      .flt-sel-form { padding:10px 0 0; }
      .flt-sel   { width:100%; min-width:0; }
    }
