/* ==========================================================================
   Site public — finition « cristal de luxe ».
   Chargé après public-crystal.css. S'appuie sur les jetons du thème actif (5 thèmes) : seules deux teintes
   locales (nuit profonde, ivoire) sont fixes pour garantir un texte lisible sur les zones sombres.
   Propriétés logiques (RTL natif) ; seules transform/opacity/ombres sont animées ; tout est coupé par
   prefers-reduced-motion et par le mode « lite ».
   ========================================================================== */

.public-body {
    --radius-xl: 30px;
    --lx-deep: color-mix(in srgb, var(--primary) 26%, #040912);
    --lx-deep-2: color-mix(in srgb, var(--accent) 20%, #0a1329);
    --lx-gold: var(--accent-2);
    --lx-ivory: #f4f8ff;
    --lx-ivory-soft: rgb(244 248 255 / .78);
    --lx-hair: rgb(255 255 255 / .16);
}

/* ---------- En-tête flottant en verre ---------- */
.public-body .site-header {
    inset-block-start: .75rem; inline-size: min(1240px, 100% - 1.5rem); margin: .75rem auto 0;
    border-radius: var(--radius-pill); border: 1px solid var(--glass-border);
    transition: box-shadow var(--dur) var(--ease), background-color var(--dur) var(--ease);
}
.public-body .site-header.is-scrolled {
    background: color-mix(in srgb, var(--surface-solid) 82%, transparent);
    box-shadow: 0 1px 0 var(--ring-a), 0 18px 40px -16px rgb(var(--shadow-rgb) / .55);
}
.public-body .site-header .header-row { inline-size: auto; margin-inline: var(--space-4); min-block-size: 64px; }
.public-body .site-header::after { inset-inline: 12%; }
.brand-link { font-size: var(--text-lg); letter-spacing: .01em; }

/* ---------- Hero : verre de nuit, facettes de cristal, filet d'or ---------- */
.public-body .hero {
    color: var(--lx-ivory); isolation: isolate;
    margin-block-start: calc(-1 * (64px + 1.5rem));
    padding-block: calc(64px + 1.5rem + 4.5rem) 9.5rem;
    background:
        radial-gradient(56rem 34rem at 82% -8%, color-mix(in srgb, var(--accent) 42%, transparent), transparent 62%),
        radial-gradient(38rem 26rem at -4% 104%, color-mix(in srgb, var(--lx-gold) 12%, transparent), transparent 66%),
        linear-gradient(158deg, var(--lx-deep-2), var(--lx-deep) 78%);
    border-end-start-radius: calc(var(--radius-xl) * 1.4); border-end-end-radius: calc(var(--radius-xl) * 1.4);
}
.public-body .hero::before, .public-body .hero::after {
    content: ""; position: absolute; pointer-events: none; z-index: -1; opacity: 1;
    -webkit-mask-image: none; mask-image: none; background-image: none;
}
.public-body .hero::before { /* grande facette translucide */
    inset-block: -20% -30%; inset-inline-end: -8%; inline-size: 62%;
    background: linear-gradient(120deg, rgb(255 255 255 / .09), rgb(255 255 255 / .01) 55%, rgb(255 255 255 / .06));
    clip-path: polygon(34% 0, 100% 0, 100% 100%, 0 100%);
    border-inline-start: 1px solid var(--lx-hair);
}
.public-body .hero::after { /* seconde facette plus fine, teintée d'or */
    inset-block: 0 -10%; inset-inline-end: 30%; inline-size: 24%;
    background: linear-gradient(100deg, color-mix(in srgb, var(--lx-gold) 7%, transparent), transparent 70%);
    clip-path: polygon(46% 0, 100% 0, 54% 100%, 0 100%);
}
[dir="rtl"] .public-body .hero::before { clip-path: polygon(0 0, 66% 0, 100% 100%, 0 100%); }
[dir="rtl"] .public-body .hero::after { clip-path: polygon(0 0, 54% 0, 100% 100%, 46% 100%); }
.public-body .hero-content::before {
    content: ""; display: block; inline-size: 72px; block-size: 2px; margin-block-end: var(--space-5);
    background: linear-gradient(90deg, var(--lx-gold), transparent);
}
[dir="rtl"] .public-body .hero-content::before { background: linear-gradient(270deg, var(--lx-gold), transparent); }
.public-body .hero h1 {
    font-size: clamp(2.5rem, 5.4vw, 4.4rem); line-height: 1.06; font-weight: 600; letter-spacing: -.02em; color: var(--lx-ivory);
    text-shadow: 0 2px 30px rgb(0 0 0 / .35);
}
.public-body .hero .hero-sub { color: var(--lx-ivory-soft); font-size: clamp(1.05rem, 1.6vw, 1.3rem); }
.public-body .hero .btn-primary {
    --btn-bg: var(--lx-gold); --btn-fg: #1b1304; --btn-edge: color-mix(in srgb, var(--lx-gold) 55%, #000);
    font-weight: 700; letter-spacing: .01em; border-radius: var(--radius-pill);
}
.public-body .hero-arch {
    border-radius: var(--radius-xl); aspect-ratio: 1 / 1; inline-size: min(100%, 440px);
    border: 1px solid color-mix(in srgb, var(--lx-gold) 70%, transparent); outline: 1px solid var(--lx-hair); outline-offset: 10px;
    background-color: var(--lx-deep-2);
    box-shadow: 0 40px 80px -30px rgb(0 0 0 / .7), 0 0 60px color-mix(in srgb, var(--accent) 30%, transparent), inset 0 1px 0 rgb(255 255 255 / .25);
}
.public-body .hero-arch::after { /* reflet de verre qui traverse l'arche une seule fois */
    content: ""; position: absolute; inset: -20% auto -20% -60%; inline-size: 38%; pointer-events: none;
    background: linear-gradient(100deg, transparent, rgb(255 255 255 / .28), transparent); transform: skewX(-18deg);
}
.public-body .sc-sky { fill: color-mix(in srgb, var(--accent) 34%, var(--lx-deep-2)); }
.public-body .sc-sun { fill: var(--lx-gold); opacity: .95; }
.public-body .sc-far { fill: color-mix(in srgb, var(--accent) 20%, var(--lx-deep)); }
.public-body .sc-near { fill: var(--lx-deep); }
.public-body .sc-win { fill: var(--lx-gold); opacity: .92; }

@media (prefers-reduced-motion: no-preference) {
    .public-body .hero-arch::after { animation: lx-sheen 1700ms var(--ease) 900ms 1 both; }
}
@keyframes lx-sheen { from { transform: translateX(0) skewX(-18deg); opacity: 0; } 15% { opacity: 1; } to { transform: translateX(520%) skewX(-18deg); opacity: 0; } }
[dir="rtl"] .public-body .hero-arch::after { inset: -20% -60% -20% auto; }
@media (prefers-reduced-motion: no-preference) {
    [dir="rtl"] .public-body .hero-arch::after { animation-name: lx-sheen-rtl; }
}
@keyframes lx-sheen-rtl { from { transform: translateX(0) skewX(18deg); opacity: 0; } 15% { opacity: 1; } to { transform: translateX(-520%) skewX(18deg); opacity: 0; } }

/* ---------- Recherche : grand panneau de verre qui chevauche le hero ---------- */
.public-body .search-overlap { margin-block-start: -5.5rem; }
.public-body .search-form {
    padding: var(--space-5); border-radius: var(--radius-xl); gap: var(--space-4);
    background: color-mix(in srgb, var(--surface-solid) 72%, transparent);
    -webkit-backdrop-filter: blur(26px) saturate(170%); backdrop-filter: blur(26px) saturate(170%);
    box-shadow: inset 0 1px 0 var(--glass-highlight), 0 30px 60px -28px rgb(var(--shadow-rgb) / .55), 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}
.public-body .search-form select, .public-body .search-form input { border-radius: var(--radius-md); min-block-size: 46px; }

/* ---------- Titres de section ---------- */
.public-body .section { padding-block: calc(var(--space-6) + var(--space-3)); }
.public-body .section h2, .public-body .section-head h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.15; }
.public-body .section-head h2::after, .public-body .section > h2::after {
    content: ""; display: block; inline-size: 56px; block-size: 2px; margin-block-start: .7rem;
    background: linear-gradient(90deg, var(--lx-gold), transparent);
}
[dir="rtl"] .public-body .section-head h2::after, [dir="rtl"] .public-body .section > h2::after { background: linear-gradient(270deg, var(--lx-gold), transparent); }
.public-body .section-head { align-items: flex-end; margin-block-end: var(--space-5); }
.public-body .section-head > a {
    display: inline-flex; align-items: center; min-block-size: 40px; padding-inline: 1.1rem; border-radius: var(--radius-pill);
    text-decoration: none; font-weight: 600; color: var(--text); white-space: nowrap;
    background: var(--glass-bg); border: 1px solid var(--glass-border);
    box-shadow: inset 0 1px 0 var(--glass-highlight), 0 6px 16px -8px rgb(var(--shadow-rgb) / .35);
    transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), color var(--dur) var(--ease);
}
@media (hover: hover) { .public-body .section-head > a:hover { transform: translateY(-2px); color: var(--primary); box-shadow: inset 0 1px 0 var(--glass-highlight), 0 12px 24px -10px rgb(var(--shadow-rgb) / .5), 0 0 22px color-mix(in srgb, var(--accent) 30%, transparent); } }

/* ---------- Cartes : grands arrondis, photo en retrait, reflet et halo ---------- */
.public-body .card { border-radius: var(--radius-xl); }
.public-body .property-card .card-media, .public-body .group-card .group-logo { margin: .6rem .6rem 0; border-radius: calc(var(--radius-xl) - .6rem); }
.public-body .property-card .card-media { aspect-ratio: 4 / 3; box-shadow: inset 0 0 0 1px rgb(255 255 255 / .12); }
.public-body .property-card .card-body, .public-body .project-card .card-body { padding: var(--space-4) var(--space-5) var(--space-5); }
.public-body .project-card .card-media { border-radius: calc(var(--radius-xl) - .6rem); aspect-ratio: 4 / 3; border: 0; margin: .6rem .6rem 0; box-shadow: inset 0 0 0 1px rgb(255 255 255 / .12); }
.public-body .card-media::after { /* voile bas de photo : le badge et le texte restent lisibles */
    content: ""; position: absolute; inset: auto 0 0 0; block-size: 38%; pointer-events: none;
    background: linear-gradient(0deg, rgb(4 9 18 / .28), transparent);
}
.public-body .card-title { font-family: var(--font-display); font-weight: 600; font-size: 1.3rem; letter-spacing: -.005em; }
.public-body .property-card .price, .public-body .project-card .price { font-size: 1.35rem; }
.public-body .media-badge { inset-block-start: var(--space-4); inset-inline-start: var(--space-4); z-index: 1; }
.public-body .badge { border-radius: var(--radius-pill); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.public-body .quick-contact .btn { border-radius: var(--radius-pill); }
.public-body .btn-sm.btn-primary, .public-body .btn-lg { border-radius: var(--radius-pill); }
.public-body .card.is-interactive:hover { transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateY(-8px); }

/* Pourquoi nous / témoignages / statistiques */
.public-body .grid.features .card { padding: var(--space-5) var(--space-5) calc(var(--space-5) + .2rem); }
.public-body .grid.features .card-title::before {
    content: ""; display: block; inline-size: 30px; block-size: 3px; border-radius: 3px; margin-block-end: .9rem; background: var(--lx-gold);
}
.public-body .grid.features .card-title { font-size: 1.35rem; margin-block-end: var(--space-2); }
.public-body .quote { padding: var(--space-5) var(--space-5) var(--space-4); font-size: 1.08rem; line-height: 1.65; }
.public-body .quote::before { content: "“"; display: block; font-family: var(--font-display); font-size: 4.2rem; line-height: .6; color: var(--lx-gold); background: none; opacity: 1; position: static; inset: auto; }
.public-body .kpi { padding: var(--space-6) var(--space-5); gap: var(--space-2); text-align: center; }
.public-body .kpi-value { font-size: clamp(2.4rem, 4.6vw, 3.6rem); line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; direction: ltr; unicode-bidi: isolate; }
.public-body .kpi-label { font-size: var(--text-sm); letter-spacing: .02em; }
.public-body .kpi::after { content: ""; position: static; inline-size: 36px; block-size: 2px; margin-inline: auto; margin-block-start: var(--space-2); background: var(--lx-gold); border-radius: 2px; mask: none; -webkit-mask: none; padding: 0; opacity: 1; }

/* ---------- Appel à l'action : panneau de nuit ---------- */
.public-body .cta-card {
    color: var(--lx-ivory); padding: clamp(2rem, 5vw, 3.5rem); border-color: transparent; overflow: hidden;
    background:
        radial-gradient(34rem 20rem at 85% -20%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 65%),
        radial-gradient(26rem 18rem at 0% 120%, color-mix(in srgb, var(--lx-gold) 24%, transparent), transparent 65%),
        linear-gradient(150deg, var(--lx-deep-2), var(--lx-deep));
    box-shadow: 0 40px 80px -36px rgb(0 0 0 / .65), inset 0 1px 0 rgb(255 255 255 / .2);
}
.public-body .cta-card h2 { color: var(--lx-ivory); font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.public-body .cta-card h2::after { margin-inline: auto; }
.public-body .cta-card .muted { color: var(--lx-ivory-soft); font-size: 1.1rem; }
.public-body .cta-card .btn { border-radius: var(--radius-pill); }
.public-body .cta-card .btn-primary { --btn-bg: var(--lx-gold); --btn-fg: #1b1304; --btn-edge: color-mix(in srgb, var(--lx-gold) 55%, #000); font-weight: 700; }
.public-body .cta-card .btn:not(.btn-primary) { --btn-bg: rgb(255 255 255 / .1); --btn-fg: var(--lx-ivory); --btn-edge: rgb(255 255 255 / .22); border-color: rgb(255 255 255 / .28); }

/* ---------- Pied de page : nuit de cristal ---------- */
.public-body .site-footer {
    margin-block-start: var(--space-7); padding-block-start: var(--space-7); color: var(--lx-ivory-soft); border-block-start: 0;
    background: radial-gradient(40rem 20rem at 90% -10%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 65%), linear-gradient(180deg, var(--lx-deep-2), var(--lx-deep));
    border-start-start-radius: calc(var(--radius-xl) * 1.4); border-start-end-radius: calc(var(--radius-xl) * 1.4);
}
.public-body .site-footer .footer-title { font-family: var(--font-display); font-size: 1.25rem; color: var(--lx-ivory); font-weight: 600; }
.public-body .site-footer .footer-title::after { content: ""; display: block; inline-size: 32px; block-size: 2px; margin-block-start: .6rem; background: var(--lx-gold); }
.public-body .site-footer a { color: var(--lx-ivory); text-decoration-color: rgb(255 255 255 / .35); }
.public-body .site-footer a:hover { color: var(--lx-gold); }
.public-body .site-footer .muted, .public-body .footer-bottom { color: rgb(244 248 255 / .66); }
.public-body .footer-bottom { border-block-start: 1px solid var(--lx-hair); margin-block-start: var(--space-5); }
.public-body .site-footer .social-links a { color: var(--lx-ivory); background: rgb(255 255 255 / .08); border-color: rgb(255 255 255 / .2); box-shadow: inset 0 1px 0 rgb(255 255 255 / .22), 0 3px 0 rgb(0 0 0 / .35); }
.public-body .site-footer::before { inset-inline: 10%; background: linear-gradient(90deg, transparent, var(--lx-gold), transparent); opacity: .7; }

/* ---------- Pages intérieures ---------- */
.public-body .page-head h1 { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.015em; }
.public-body main > .container:first-child { padding-block-start: var(--space-5); }
.public-body .contact-form, .public-body .contact-aside, .public-body .property-aside, .public-body .group-profile { border-radius: var(--radius-xl); }
.public-body .property-gallery img, .public-body .gallery-item img, .public-body .project-cover, .public-body .about-image { border-radius: var(--radius-lg); }

/* ---------- Mobile ---------- */
@media (max-width: 760px) {
    .public-body .site-header { border-radius: var(--radius-lg); }
    .public-body .hero { padding-block: calc(64px + 1.5rem + 1.5rem) 7rem; border-end-start-radius: var(--radius-xl); border-end-end-radius: var(--radius-xl); }
    .public-body .hero::before { inline-size: 90%; }
    .public-body .search-overlap { margin-block-start: -4rem; }
    .public-body .section-head > a { min-block-size: 36px; padding-inline: .9rem; }
    .public-body .site-footer { border-start-start-radius: var(--radius-xl); border-start-end-radius: var(--radius-xl); }
}

/* ---------- Appareils faibles / préférences ---------- */
[data-effects="lite"] .public-body .search-form { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--surface-solid); }
[data-effects="lite"] .public-body .hero-arch::after { display: none; }
@media (prefers-reduced-motion: reduce) { .public-body .hero-arch::after { display: none; } .public-body .section-head > a { transition: none; } }
@media (prefers-reduced-transparency: reduce) { .public-body .search-form { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--surface-solid); } }

/* ---------- Logos : carrés aux angles arrondis ---------- */
.public-body .brand-link img { border-radius: 14px; block-size: 44px; inline-size: 44px; object-fit: cover; background: var(--surface-solid); box-shadow: 0 0 0 1px color-mix(in srgb, var(--lx-gold) 55%, transparent), 0 4px 12px rgb(var(--shadow-rgb) / .25); }
.public-body .group-logo { border-radius: var(--radius-lg); }
.public-body .group-logo img, .public-body .group-profile-logo, .public-body .about-logo { border-radius: var(--radius-md); }
.public-body .group-profile-logo, .public-body .about-logo { padding: var(--space-2); background: var(--surface-solid); box-shadow: 0 0 0 1px var(--line); }