/* bloo.Cards — Card redesign (free 6-btn 2x3, glass hero chips, +avatar, liquid no-scroll, side-by-side CTAs)
   Deployed 2026-09-17. Loaded by card.php after layout CSS. */
/* ===== BLOO CARD REDESIGN v4 ===== */
:root{ --k-accent: var(--card-accent,#7c5cfc); }
/* black bar + top gap */
.card-idbar{ display:none !important; }
html, body[data-layout]{ background:#f2ede7 !important; }
body[data-layout] .card-wrap, body[data-layout] .card-inner{ margin:0 !important; padding-top:0 !important; }
/* full-height liquid column, no scroll */
html,body{ height:100% !important; overflow:hidden !important; }
body[data-layout]{ height:100dvh !important; min-height:0 !important; overflow:hidden !important; }
body[data-layout] .card-wrap, body[data-layout] .card-inner{
  height:100dvh !important; min-height:0 !important; max-height:100dvh !important;
  overflow-y:auto !important; overflow-x:hidden !important; display:flex !important; flex-direction:column !important; -webkit-overflow-scrolling:touch; }
/* hero height (specificity-correct: beats layout rules) */
body[data-layout] .card-wrap .card-header{ height:clamp(112px,19vh,205px) !important; flex:0 0 auto !important; }
/* hero chips: frosted glass readable on ANY bg */
.h-badges-float{ top:10px !important; right:12px !important; gap:9px !important; }
.h-badge{ width:40px !important; height:40px !important; border-radius:50% !important;
  background:rgba(15,18,24,.46) !important; -webkit-backdrop-filter:blur(12px) saturate(1.5); backdrop-filter:blur(12px) saturate(1.5);
  border:1.5px solid rgba(255,255,255,.68) !important; color:#fff !important; box-shadow:0 4px 18px rgba(0,0,0,.35) !important; }
.h-badge i,.h-badge *{ color:#fff !important; text-shadow:0 1px 3px rgba(0,0,0,.5) !important; }
.h-badge.h-badge-lang{ font-weight:800 !important; font-size:11px !important; }
/* avatar prominent + height-aware (specificity-correct) */
body[data-layout] .card-wrap .card-avatar-wrap{ margin-top:clamp(-92px,-12vh,-58px) !important; flex:0 0 auto !important; }
body[data-layout] .card-wrap .card-avatar-frame{ width:clamp(132px,min(46vw,25vh),190px) !important; height:clamp(132px,min(46vw,25vh),190px) !important; }
/* identity compact */
.card-identity{ flex:0 0 auto !important; padding:4px 18px 0 !important; }
.card-name{ font-size:clamp(24px,7vw,40px) !important; line-height:1.08 !important; margin:0 !important; }
.card-title{ margin:2px 0 0 !important; }
.card-tagline{ font-size:clamp(10.5px,3vw,13px) !important; line-height:1.2 !important; margin-top:3px !important; }
/* action area fills + centers, no scroll */
.modules-section{ flex:1 1 auto !important; min-height:0 !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important; justify-content:center !important; padding:4px 14px 0 !important; }
.modules-page-wrap{ flex:0 1 auto !important; overflow:hidden !important; }
.modules-track{ height:auto !important; }
.modules-page{ overflow:hidden !important; gap:clamp(8px,2vh,16px) 10px !important; justify-items:center !important; align-content:center !important; }
body[data-tier="free"] .modules-page{ grid-template-columns:repeat(3,1fr) !important; }
body[data-tier="paid"] .modules-page{ grid-template-columns:repeat(4,1fr) !important; }
/* clean action buttons */
.mod-btn{ background:transparent !important; padding:2px !important; width:100% !important; max-width:132px !important; }
.mod-icon{ width:clamp(46px,min(14.5vw,8vh),62px) !important; height:clamp(46px,min(14.5vw,8vh),62px) !important;
  border-radius:18px !important; margin:0 auto !important;
  background:color-mix(in srgb,var(--k-accent) 14%,#fff) !important; color:var(--k-accent) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  font-size:clamp(18px,5.2vw,23px) !important; box-shadow:0 6px 16px rgba(0,0,0,.10) !important;
  border:1px solid color-mix(in srgb,var(--k-accent) 22%,transparent) !important; }
.mod-label{ font-size:clamp(10px,3.1vw,12.5px) !important; font-weight:700 !important; margin-top:5px !important;
  max-width:100% !important; white-space:nowrap !important; overflow:visible !important; text-overflow:clip !important; }
.mod-btn.is-empty{ opacity:.42 !important; pointer-events:none !important; }
.mod-btn.is-empty .mod-icon{ background:rgba(120,120,130,.12) !important; color:#9aa0aa !important; border-color:rgba(120,120,130,.18) !important; }
/* CTA + footer compact */
.contact-actions{ flex:0 0 auto !important; gap:6px !important; padding:6px 16px calc(4px + env(safe-area-inset-bottom,0px)) !important; }
body[data-layout] .card-action-btn{ min-height:clamp(40px,5.2vh,50px) !important; }
.card-footer{ flex:0 0 auto !important; padding:2px 0 calc(2px + env(safe-area-inset-bottom,0px)) !important; font-size:11px !important; }
/* ===== v4b: kill top gap + compact footer ===== */
html,body{ padding:0 !important; margin:0 !important; }
body[data-layout] .card-wrap .card-header{ margin-top:0 !important; height:clamp(100px,17vh,196px) !important; }
body[data-layout] .card-inner{ padding-top:0 !important; }
.card-footer{ padding:1px 0 calc(1px + env(safe-area-inset-bottom,0px)) !important; font-size:10.5px !important; }
.card-footer *{ line-height:1.2 !important; }
.modules-page{ gap:clamp(6px,1.8vh,15px) 10px !important; }
/* ===== v5: cross-theme fixes ===== */
/* stronger disc border so icons read on light themes (premium) */
.mod-icon{ border:1.5px solid color-mix(in srgb,var(--k-accent) 42%,transparent) !important; }
/* header-hidden / avatar-first layouts: no negative pull (avatar was overlapping the name) */
body[data-layout="liquid"] .card-wrap .card-avatar-wrap,
body[data-layout="frost"] .card-wrap .card-avatar-wrap,
body[data-layout="bento"] .card-wrap .card-avatar-wrap,
body[data-layout="tactile"] .card-wrap .card-avatar-wrap,
body[data-layout="magazine"] .card-wrap .card-avatar-wrap,
body[data-layout="brutal"] .card-wrap .card-avatar-wrap{ margin-top:8px !important; }
/* a touch more global compaction for the tight themes */
.card-identity{ padding-bottom:0 !important; }
.contact-actions{ padding-top:4px !important; }
/* ===== v6: CTAs side-by-side everywhere + disc contrast ===== */
.contact-actions{ display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; gap:8px !important; align-items:stretch !important; }
body[data-layout] .card-action-btn{ flex:1 1 0 !important; min-width:0 !important; padding:8px 6px !important;
  font-size:clamp(10.5px,2.9vw,12.5px) !important; line-height:1.12 !important; white-space:normal !important; text-align:center !important; }
.mod-icon{ background:color-mix(in srgb,var(--k-accent) 12%,#fff) !important;
  border:1.5px solid color-mix(in srgb,var(--k-accent) 45%,transparent) !important;
  box-shadow:0 4px 14px rgba(0,0,0,.12) !important; }
/* ===== v7: per-theme cleanup ===== */
/* liquid/frost have no hero → smaller avatar so it doesn't cover the name */
body[data-layout="liquid"] .card-wrap .card-avatar-frame,
body[data-layout="frost"] .card-wrap .card-avatar-frame{ width:112px !important; height:112px !important; }
body[data-layout="liquid"] .card-wrap .card-avatar-wrap,
body[data-layout="frost"] .card-wrap .card-avatar-wrap{ margin-top:12px !important; }
/* bento/magazine/tactile: hide the redundant decorative photo band (avatar already shown) */
body[data-layout="bento"] .card-header,
body[data-layout="magazine"] .card-header,
body[data-layout="tactile"] .card-header{ display:none !important; }
/* brutal: shrink avatar so it fits alongside its top hero */
body[data-layout="brutal"] .card-wrap .card-avatar-frame{ width:118px !important; height:118px !important; }
body[data-layout="brutal"] .card-wrap .card-avatar-wrap{ margin-top:6px !important; }
/* brutal: trim hero + avatar to fit */
body[data-layout="brutal"] .card-wrap .card-header{ height:clamp(76px,12vh,116px) !important; }
body[data-layout="brutal"] .card-wrap .card-avatar-frame{ width:104px !important; height:104px !important; }
body[data-layout="brutal"] .card-wrap .card-avatar-wrap{ margin-top:4px !important; }
/* liquid/frost: name sits in a glass panel under the avatar → push content clear of avatar */
body[data-layout="liquid"] .card-identity,
body[data-layout="frost"] .card-identity{ padding-top:52px !important; }
body[data-layout="liquid"] .card-avatar-frame img,
body[data-layout="frost"] .card-avatar-frame img{ width:100% !important; height:100% !important; }

/* v8 — button cleanup + accent labels + bigger icons + readable tagline */
body[data-layout] .modules-page .mod-btn{ background:transparent !important; border:none !important; box-shadow:none !important; }
body[data-layout] .modules-page .mod-icon{
  background:color-mix(in srgb, var(--card-accent) 15%, #fff) !important;
  border:1.5px solid color-mix(in srgb, var(--card-accent) 45%, transparent) !important;
  color:var(--card-accent) !important; box-shadow:0 4px 14px rgba(0,0,0,.14) !important;
  width:clamp(50px,min(16vw,9vh),68px) !important; height:clamp(50px,min(16vw,9vh),68px) !important; }
body[data-layout] .modules-page .mod-icon i{ font-size:clamp(20px,5.8vw,26px) !important; }
body[data-layout] .modules-page .mod-label{ color:var(--card-accent) !important; }
body[data-layout] .card-identity .card-tagline{ color:var(--card-accent) !important; opacity:.85 !important; }

/* v9 — aurora feedback + global bold */
/* AURORA: remove the brown tile, KEEP the button disc */
body[data-layout="aurora"] .card-inner .modules-page .mod-btn{ background:transparent !important; border:none !important; box-shadow:none !important; }
/* AURORA: subtler, deeper dark background (no muddy mid-brown) */
body[data-layout="aurora"], body[data-layout="aurora"] .card-wrap{ background:#0a0809 !important; }
body[data-layout="aurora"] .card-inner{
  background:
    radial-gradient(ellipse 75% 50% at 18% 28%, rgba(52,211,153,.17) 0%, rgba(52,211,153,0) 62%),
    radial-gradient(ellipse 65% 45% at 82% 58%, rgba(255,181,107,.14) 0%, rgba(255,181,107,0) 62%),
    radial-gradient(ellipse 55% 40% at 50% 92%, rgba(139,92,246,.12) 0%, rgba(139,92,246,0) 62%),
    linear-gradient(180deg,#16121a 0%,#0e0b10 55%,#090709 100%) !important;
  background-size:200% 200%,200% 200%,200% 200%,100% 100% !important;
  animation:bloo-aurora 26s ease-in-out infinite alternate !important; }
@keyframes bloo-aurora{ from{background-position:0% 0%,100% 100%,50% 100%,0 0} to{background-position:35% 25%,65% 75%,40% 85%,0 0} }
/* AURORA: glass disc that reads on deep dark */
body[data-layout="aurora"] .card-inner .modules-page .mod-icon{
  background:rgba(255,255,255,.08) !important; border:1px solid rgba(255,214,170,.35) !important; box-shadow:0 6px 20px rgba(0,0,0,.35) !important; }
/* icon +5% (global) */
body[data-layout] .modules-page .mod-icon i{ font-size:clamp(21px,6.1vw,27px) !important; }
/* readable slogan on dark themes */
body[data-layout="aurora"] .card-identity .card-tagline,
body[data-layout="neon"] .card-identity .card-tagline{ color:rgba(255,246,235,.94) !important; opacity:1 !important; }
/* CTA symmetry (global) */
.contact-actions{ align-items:stretch !important; }
body[data-layout] .card-action-btn{ white-space:nowrap !important; font-size:clamp(9.5px,2.7vw,12.5px) !important; }
/* GLOBAL: name + title heavy bold */
body[data-layout] .card-identity .card-name{ font-weight:800 !important; }
body[data-layout] .card-identity .card-title{ font-weight:800 !important; }
/* GLOBAL: button label = button icon color */
body[data-layout] .card-inner .modules-page .mod-icon,
body[data-layout] .card-inner .modules-page .mod-icon i,
body[data-layout] .card-inner .modules-page .mod-label{ color:var(--card-accent) !important; }
/* AURORA: label + glyph share the same amber (theme forces amber glyphs) */
body[data-layout="aurora"] .card-inner .modules-page .mod-icon,
body[data-layout="aurora"] .card-inner .modules-page .mod-icon i,
body[data-layout="aurora"] .card-inner .modules-page .mod-label{ color:#ffb56b !important; }

/* v10 — brand fonts GLOBAL: Lexend (headings) + Inter (body), local variable woff2 */
@font-face{font-family:'Inter';src:url('/assets/fonts/inter.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;}
@font-face{font-family:'Lexend';src:url('/assets/fonts/lexend.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap;}
body[data-layout], body[data-layout] .card-inner,
body[data-layout] .card-inner *:not(i):not(svg):not([class*="fa-"]){ font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif !important; }
body[data-layout] .card-inner .card-identity .card-name,
body[data-layout] .card-inner .card-identity .card-title{ font-family:'Lexend','Inter',system-ui,sans-serif !important; }

/* v11 — subtle shadows everywhere */
.h-badge{ box-shadow:0 2px 10px rgba(0,0,0,.18) !important; }
body[data-layout] .modules-page .mod-icon{ box-shadow:0 2px 8px rgba(0,0,0,.08) !important; }
body[data-layout="aurora"] .card-inner .modules-page .mod-icon{ box-shadow:0 3px 10px rgba(0,0,0,.22) !important; }

/* v12 — footer readable on dark themes (bloo / Confidentialité / Cookies) */
body[data-layout="aurora"] .card-footer, body[data-layout="aurora"] .card-footer a, body[data-layout="aurora"] .card-footer span,
body[data-layout="neon"] .card-footer, body[data-layout="neon"] .card-footer a, body[data-layout="neon"] .card-footer span{ color:rgba(255,246,235,.85) !important; }
body[data-layout="aurora"] .card-footer .f-accent, body[data-layout="neon"] .card-footer .f-accent{ color:#ffb56b !important; }

/* v12b — footer links readable on dark themes (targets the exact elements) */
body[data-layout="aurora"] .card-inner .card-footer a.card-footer-logo,
body[data-layout="aurora"] .card-inner .card-footer .card-footer-legal a,
body[data-layout="aurora"] .card-inner .card-footer .card-footer-legal span,
body[data-layout="neon"] .card-inner .card-footer a.card-footer-logo,
body[data-layout="neon"] .card-inner .card-footer .card-footer-legal a,
body[data-layout="neon"] .card-inner .card-footer .card-footer-legal span{ color:rgba(255,246,235,.88) !important; }
body[data-layout="aurora"] .card-inner .card-footer .f-accent,
body[data-layout="neon"] .card-inner .card-footer .f-accent{ color:#ffb56b !important; }

/* v13 — AURORA: dark neumorphic action buttons */
body[data-layout="aurora"] .card-inner .modules-page .mod-icon{
  background:linear-gradient(145deg,#1b1a1e 0%,#0f0e12 100%) !important;
  border:none !important;
  box-shadow:5px 5px 12px rgba(0,0,0,.55), -3px -3px 8px rgba(255,255,255,.05), inset 0 0 0 1px rgba(255,181,107,.12) !important;
  border-radius:20px !important; }
body[data-layout="aurora"] .card-inner .modules-page .mod-btn:active .mod-icon{
  box-shadow:inset 4px 4px 10px rgba(0,0,0,.6), inset -3px -3px 8px rgba(255,255,255,.04) !important; }

/* v14 — AURORA: ghost / transparent action buttons (replaces neumorphic) */
body[data-layout="aurora"] .card-inner .modules-page .mod-icon{
  background:rgba(255,255,255,.035) !important;
  border:1.5px solid rgba(255,181,107,.55) !important;
  box-shadow:none !important; border-radius:20px !important;
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
body[data-layout="aurora"] .card-inner .modules-page .mod-btn:active .mod-icon{
  background:rgba(255,181,107,.14) !important; box-shadow:none !important; }

/* v15 — footer mascot = same color as ".Cards" */
body[data-layout] .card-inner .card-footer .card-footer-logo i{ color:var(--card-accent) !important; }
body[data-layout="aurora"] .card-inner .card-footer .card-footer-logo i,
body[data-layout="neon"] .card-inner .card-footer .card-footer-logo i{ color:#ffb56b !important; }

/* v16 — hero chips: border + glyph like the action buttons */
body[data-layout] .h-badges-float .h-badge{ border:1.5px solid var(--card-accent) !important; color:var(--card-accent) !important; background:rgba(15,18,24,.55) !important; }
body[data-layout] .h-badges-float .h-badge i, body[data-layout] .h-badges-float .h-badge *{ color:var(--card-accent) !important; text-shadow:none !important; }
body[data-layout="aurora"] .h-badges-float .h-badge, body[data-layout="neon"] .h-badges-float .h-badge{ border-color:#ffb56b !important; color:#ffb56b !important; }
body[data-layout="aurora"] .h-badges-float .h-badge i, body[data-layout="aurora"] .h-badges-float .h-badge *,
body[data-layout="neon"] .h-badges-float .h-badge i, body[data-layout="neon"] .h-badges-float .h-badge *{ color:#ffb56b !important; }

/* v17 — ÉDITORIAL (slug magazine): restore native paper / serif / written design */
body[data-layout="magazine"] .card-inner .card-identity .card-name{
  font-family:Georgia,'Bitstream Charter','Times New Roman',serif !important; font-weight:400 !important;
  font-size:clamp(40px,12vw,56px) !important; line-height:.84 !important; letter-spacing:-.06em !important; margin:12px 0 10px !important; }
body[data-layout="magazine"] .card-inner .card-identity .card-tagline{
  font-family:Georgia,'Bitstream Charter','Times New Roman',serif !important; font-style:italic !important;
  font-size:15px !important; line-height:1.5 !important; color:var(--m-ink,#1a1a1a) !important; opacity:1 !important; margin:0 0 12px !important; }
body[data-layout="magazine"] .card-inner .card-identity .card-title{
  font-family:'Inter',system-ui,sans-serif !important; font-weight:800 !important; font-size:10px !important;
  text-transform:uppercase !important; letter-spacing:.12em !important; margin:0 !important; }
/* restore the photo-cadre (reduced height so it still fits small phones) */
body[data-layout="magazine"] .card-header{ display:block !important; }
body[data-layout="magazine"] .card-wrap .card-header{ height:clamp(110px,17vh,190px) !important; }
/* ÉDITORIAL: compaction to fit without scroll (identity preserved) */
body[data-layout="magazine"] .card-inner{ padding-top:30px !important; }
body[data-layout="magazine"] .card-wrap .card-header{ height:clamp(80px,12.5vh,150px) !important; margin:0 0 4px !important; }
body[data-layout="magazine"] .card-wrap .card-avatar-frame{ width:clamp(100px,min(33vw,16.5vh),140px) !important; height:clamp(100px,min(33vw,16.5vh),140px) !important; }
body[data-layout="magazine"] .card-wrap .card-avatar-wrap{ margin-top:0 !important; }
body[data-layout="magazine"] .card-inner .card-identity .card-name{ font-size:clamp(34px,10.5vw,52px) !important; margin:6px 0 4px !important; }
body[data-layout="magazine"] .card-inner .card-identity .card-tagline{ font-size:14px !important; line-height:1.4 !important; margin:0 0 6px !important; }
body[data-layout="magazine"] .card-inner .card-identity .card-title{ padding:5px 0 !important; }
body[data-layout="magazine"] .modules-section{ padding-top:2px !important; }
body[data-layout="magazine"] .modules-page{ gap:6px 10px !important; }
body[data-layout="magazine"] .modules-page .mod-icon{ width:clamp(42px,min(12.5vw,6.8vh),54px) !important; height:clamp(42px,min(12.5vw,6.8vh),54px) !important; }
body[data-layout="magazine"] .modules-page .mod-icon i{ font-size:clamp(18px,5vw,22px) !important; }
body[data-layout="magazine"] .modules-page .mod-label{ margin-top:3px !important; }
body[data-layout="magazine"] .card-inner .contact-actions .card-action-btn{ white-space:nowrap !important; font-size:clamp(9px,2.55vw,11.5px) !important; padding:7px 5px !important; min-height:38px !important; }
body[data-layout="magazine"] .card-footer{ padding-top:0 !important; }

/* v18 — ÉDITORIAL: hero chips styled like the theme's light action buttons */
body[data-layout="magazine"] .h-badges-float .h-badge{ background:rgba(255,255,255,.88) !important; border:1.5px solid var(--card-accent) !important; color:var(--card-accent) !important; box-shadow:0 2px 8px rgba(0,0,0,.10) !important; -webkit-backdrop-filter:none; backdrop-filter:none; }
body[data-layout="magazine"] .h-badges-float .h-badge i, body[data-layout="magazine"] .h-badges-float .h-badge *{ color:var(--card-accent) !important; }

/* v19 — NEON: photo-as-background layout — avatar, chips, glow ghost buttons, readable CTA/footer */
body[data-layout="neon"]{ background:#0b0c12 !important; }
body[data-layout="neon"] .card-wrap .card-avatar-wrap{ margin-top:14px !important; }
body[data-layout="neon"] .card-wrap .card-avatar-frame{ width:clamp(116px,min(38vw,20vh),156px) !important; height:clamp(116px,min(38vw,20vh),156px) !important; }
body[data-layout="neon"] .card-identity{ padding-top:10px !important; }
body[data-layout="neon"] .h-badges-float{ left:auto !important; right:12px !important; }
body[data-layout="neon"] .h-badges-float .h-badge{ background:rgba(10,12,20,.55) !important; border:1.5px solid color-mix(in srgb,var(--card-accent) 70%,#fff) !important; box-shadow:0 0 12px color-mix(in srgb,var(--card-accent) 45%,transparent) !important; }
body[data-layout="neon"] .h-badges-float .h-badge, body[data-layout="neon"] .h-badges-float .h-badge i, body[data-layout="neon"] .h-badges-float .h-badge *{ color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; }
body[data-layout="neon"] .card-inner .modules-page .mod-btn{ background:transparent !important; border:none !important; box-shadow:none !important; }
body[data-layout="neon"] .card-inner .modules-page .mod-icon{ background:rgba(255,255,255,.04) !important; border:1.5px solid color-mix(in srgb,var(--card-accent) 70%,#fff) !important; border-radius:20px !important;
  box-shadow:0 0 14px color-mix(in srgb,var(--card-accent) 40%,transparent), inset 0 0 10px color-mix(in srgb,var(--card-accent) 12%,transparent) !important; }
body[data-layout="neon"] .card-inner .modules-page .mod-icon, body[data-layout="neon"] .card-inner .modules-page .mod-icon i, body[data-layout="neon"] .card-inner .modules-page .mod-label{
  color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; text-shadow:0 0 8px color-mix(in srgb,var(--card-accent) 55%,transparent) !important; }
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--ghost{ background:transparent !important; border:1.5px solid rgba(255,255,255,.55) !important; color:#eef3f8 !important; }
body[data-layout="neon"] .card-inner .card-footer .card-footer-logo i, body[data-layout="neon"] .card-inner .card-footer .f-accent{ color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; }
body[data-layout="neon"] .card-wrap .card-inner .h-badges-float, body[data-layout="neon"] .card-inner > .h-badges-float{ left:auto !important; right:12px !important; top:10px !important; transform:none !important; }
body[data-layout="neon"] .h-badges-float{ display:flex !important; justify-content:flex-end !important; }

/* v20 — NEON typography: Orbitron (name) + Space Grotesk (UI), self-hosted variable woff2 (OFL) */
@font-face{font-family:'Orbitron';src:url('/assets/fonts/orbitron-latin.woff2') format('woff2');font-weight:400 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Space Grotesk';src:url('/assets/fonts/space-grotesk-latin.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Space Grotesk';src:url('/assets/fonts/space-grotesk-latin-ext.woff2') format('woff2');font-weight:300 700;font-style:normal;font-display:swap;unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
body[data-layout="neon"] .card-inner *:not(i):not(svg):not([class*="fa-"]):not(.card-name){ font-family:'Space Grotesk','Inter',system-ui,sans-serif !important; }
body[data-layout="neon"] .card-inner .card-identity .card-name{ font-family:'Orbitron','Space Grotesk',sans-serif !important; font-weight:800 !important; letter-spacing:.02em !important;
  text-shadow:0 0 18px color-mix(in srgb,var(--card-accent) 55%,transparent), 0 0 2px rgba(255,255,255,.35) !important; }
body[data-layout="neon"] .card-inner .card-identity .card-title{ font-family:'Space Grotesk',sans-serif !important; font-weight:700 !important; letter-spacing:.04em !important; text-transform:uppercase !important; font-size:12px !important; }

/* v21 — NEON day/night: on this dark layout the accent derives from the theme's signature color (--card-bg), since the dark background can't show it */
/* (v21 accent override moved to .card-wrap in v22) */
/* NEON avatar +15% */
body[data-layout="neon"] .card-wrap .card-avatar-frame{ width:clamp(133px,min(44vw,23vh),180px) !important; height:clamp(133px,min(44vw,23vh),180px) !important; }
/* v22 — NEON two-tone (ex. Mandarine = orange + vert) : A = couleur signature du thème (--card-bg), B = accent du thème.
   Les deux sont normalisées en couleurs "tube" lumineuses (oklch) ; A = nom, glyphes/labels, CTA primaire, footer ; B = titre, chips héro, anneaux des boutons, CTA ghost, halo. */
body[data-layout="neon"]{ --neon-a: var(--card-bg,#ffb56b); --neon-b: var(--card-accent,#5ee1c9); }
@supports (color: oklch(from red calc(l + .1) c h)){
  body[data-layout="neon"]{ --neon-a: oklch(from var(--card-bg,#ffb56b) .82 max(c,.14) h); --neon-b: oklch(from var(--card-accent,#5ee1c9) .80 max(c,.13) h); }
}
body[data-layout="neon"]{ --neon-a-txt: color-mix(in srgb,var(--neon-a) 80%,#fff); --neon-b-txt: color-mix(in srgb,var(--neon-b) 80%,#fff); }
/* l'accent de la carte devient A (le panneau de partage garde l'accent d'origine sur son fond clair) */
body[data-layout="neon"] .card-wrap{ --card-accent: var(--neon-a); }
/* A : glyphes + labels (même couleur), nom */
body[data-layout="neon"] .card-inner .modules-page .mod-icon, body[data-layout="neon"] .card-inner .modules-page .mod-icon i, body[data-layout="neon"] .card-inner .modules-page .mod-label{
  color:var(--neon-a-txt) !important; text-shadow:0 0 8px color-mix(in srgb,var(--neon-a) 55%,transparent) !important; }
body[data-layout="neon"] .card-inner .card-identity .card-name{ color:#fff !important;
  text-shadow:0 0 16px color-mix(in srgb,var(--neon-a) 65%,transparent), 0 0 44px color-mix(in srgb,var(--neon-b) 40%,transparent), 0 0 2px rgba(255,255,255,.35) !important; }
body[data-layout="neon"] .card-inner .card-footer .card-footer-logo i, body[data-layout="neon"] .card-inner .card-footer .f-accent{ color:var(--neon-a-txt) !important; text-shadow:0 0 8px color-mix(in srgb,var(--neon-a) 45%,transparent) !important; }
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--primary{ box-shadow:0 0 16px color-mix(in srgb,var(--neon-a) 40%,transparent) !important; }
/* B : titre, chips héro, anneaux, CTA ghost */
body[data-layout="neon"] .card-inner .card-identity .card-title{ color:var(--neon-b-txt) !important; text-shadow:0 0 10px color-mix(in srgb,var(--neon-b) 60%,transparent) !important; }
body[data-layout="neon"] .card-inner .card-identity .card-title::after, body[data-layout="neon"] .card-inner .card-identity .card-name::after, body[data-layout="neon"] .card-inner .card-identity hr{ background:var(--neon-b-txt) !important; border-color:var(--neon-b-txt) !important; }
body[data-layout="neon"] .h-badges-float .h-badge{ border-color:var(--neon-b-txt) !important; box-shadow:0 0 12px color-mix(in srgb,var(--neon-b) 50%,transparent) !important; }
body[data-layout="neon"] .h-badges-float .h-badge, body[data-layout="neon"] .h-badges-float .h-badge i, body[data-layout="neon"] .h-badges-float .h-badge *{ color:var(--neon-b-txt) !important; text-shadow:0 0 8px color-mix(in srgb,var(--neon-b) 55%,transparent) !important; }
body[data-layout="neon"] .card-inner .modules-page .mod-icon{ border-color:var(--neon-b-txt) !important;
  box-shadow:0 0 14px color-mix(in srgb,var(--neon-b) 45%,transparent), inset 0 0 10px color-mix(in srgb,var(--neon-b) 14%,transparent) !important; }
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--ghost, body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--ghost i, body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{
  color:var(--neon-b-txt) !important; text-shadow:0 0 8px color-mix(in srgb,var(--neon-b) 50%,transparent) !important; }
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--ghost{ border-color:var(--neon-b-txt) !important; box-shadow:0 0 12px color-mix(in srgb,var(--neon-b) 35%,transparent) !important; }
body[data-layout="neon"] .card-inner .carousel-dots > *{ background:rgba(255,255,255,.28) !important; }
body[data-layout="neon"] .card-inner .carousel-dots > .active, body[data-layout="neon"] .card-inner .carousel-dots > .is-active, body[data-layout="neon"] .card-inner .carousel-dots > [aria-current="true"]{ background:var(--neon-b-txt) !important; box-shadow:0 0 8px var(--neon-b) !important; }
/* halo ambiant bicolore derrière le contenu (sous les enfants z-index:1 du layout) */
body[data-layout="neon"] .card-inner::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(70% 30% at 8% 46%, color-mix(in srgb,var(--neon-a) 14%,transparent), transparent 70%), radial-gradient(70% 34% at 96% 80%, color-mix(in srgb,var(--neon-b) 16%,transparent), transparent 70%); }
/* v22b — NEON primary CTA: plein en couleur signature A (toujours lisible, quel que soit le thème) */
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--primary{ background:var(--neon-a) !important; border:1.5px solid var(--neon-a-txt) !important; color:#0b0c12 !important; }
body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--primary i, body[data-layout="neon"] .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#0b0c12 !important; text-shadow:none !important; }
/* v23 — FORME DES BOUTONS (backoffice > Thème > Forme des boutons) : body[data-btnshape] pilote modules, chips héro et CTA — déclaré en dernier pour gagner sur les layouts */
body[data-btnshape="round"] .card-wrap .card-inner .modules-page .mod-icon{ border-radius:50% !important; }
body[data-btnshape="round"] .card-wrap .card-inner .h-badges-float .h-badge{ border-radius:999px !important; }
body[data-btnshape="round"] .card-wrap .card-inner .contact-actions .card-action-btn{ border-radius:999px !important; }
body[data-btnshape="rounded-square"] .card-wrap .card-inner .modules-page .mod-icon{ border-radius:clamp(14px,4.5vw,20px) !important; }
body[data-btnshape="rounded-square"] .card-wrap .card-inner .h-badges-float .h-badge{ border-radius:12px !important; }
body[data-btnshape="rounded-square"] .card-wrap .card-inner .contact-actions .card-action-btn{ border-radius:12px !important; }
/* v24 — CHIPS HÉRO lisibles sur N'IMPORTE QUEL fond (photo claire/sombre, accent clair/foncé).
   Défaut (hors neon/aurora/magazine) : disque quasi opaque sombre + glyphe BLANC + liseré teinté accent (éclairci pour rester visible) + ombre douce. */
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]):not([data-layout="magazine"]) .card-wrap .h-badges-float .h-badge{
  background:rgba(17,20,26,.90) !important;
  border:1.6px solid color-mix(in srgb,var(--card-accent) 50%,#fff) !important;
  box-shadow:0 2px 12px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.12) !important;
  -webkit-backdrop-filter:blur(6px) !important; backdrop-filter:blur(6px) !important; }
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]):not([data-layout="magazine"]) .card-wrap .h-badges-float .h-badge,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]):not([data-layout="magazine"]) .card-wrap .h-badges-float .h-badge i,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]):not([data-layout="magazine"]) .card-wrap .h-badges-float .h-badge *{
  color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.45) !important; }
/* Magazine (layout papier clair) : disque blanc quasi opaque + glyphe encre foncé (indépendant de l'accent) + liseré accent foncé. */
body[data-layout="magazine"] .card-wrap .h-badges-float .h-badge{
  background:rgba(255,255,255,.95) !important;
  border:1.6px solid color-mix(in srgb,var(--card-accent) 55%,#1a1310) !important;
  box-shadow:0 2px 10px rgba(0,0,0,.20) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
body[data-layout="magazine"] .card-wrap .h-badges-float .h-badge,
body[data-layout="magazine"] .card-wrap .h-badges-float .h-badge i,
body[data-layout="magazine"] .card-wrap .h-badges-float .h-badge *{ color:#241a12 !important; text-shadow:none !important; }
/* v25 — 2e CTA (ghost) TOUJOURS visible sur les layouts clairs (bug editorial/Portrait : texte blanc + bord 0 + fond blanc = invisible).
   Contour + texte/icone en couleur d'accent. Exclut neon & aurora (fond sombre, gérés à part). */
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost{
  background:transparent !important; border:1.6px solid var(--card-accent) !important; box-shadow:none !important; }
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{
  color:var(--card-accent) !important; text-shadow:none !important; }
/* v25b — Portrait (editorial) : le CTA primaire suit la couleur du thème (au lieu du caramel figé) → paire de CTA cohérente */
body[data-layout="editorial"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; border:1.6px solid var(--card-accent) !important; }
body[data-layout="editorial"] .card-wrap .card-inner .contact-actions .card-action-btn--primary,
body[data-layout="editorial"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-layout="editorial"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#fff !important; text-shadow:none !important; }
/* v26 — COLORISATION cohérente : le CTA primaire suit la couleur du thème sur tous les layouts clairs (Linear passait en violet figé, editorial en caramel). Exclut neon & aurora (fonds sombres, gérés à part). Rend v25b redondant (conservé sans effet). */
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; border:1.6px solid var(--card-accent) !important; }
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--primary,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-layout]:not([data-layout="neon"]):not([data-layout="aurora"]) .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#fff !important; text-shadow:none !important; }
/* v27 — LIQUID & FROST (verre sur photo) : textes hors pastilles en clair + ombre → lisibles sur le fond photo (labels modules, slogan, footer, CTA ghost). Les pastilles restent des disques clairs à glyphe foncé. */
body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-label,
body[data-layout="frost"] .card-wrap .card-inner .modules-page .mod-label,
body[data-layout="liquid"] .card-wrap .card-inner .card-tagline,
body[data-layout="frost"] .card-wrap .card-inner .card-tagline,
body[data-layout="liquid"] .card-wrap .card-inner .card-footer, body[data-layout="liquid"] .card-wrap .card-inner .card-footer *,
body[data-layout="frost"] .card-wrap .card-inner .card-footer, body[data-layout="frost"] .card-wrap .card-inner .card-footer *{
  color:#fff !important; text-shadow:0 1px 4px rgba(0,0,0,.6) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-layout="frost"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-layout="frost"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label,
body[data-layout="frost"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{
  color:#fff !important; border-color:rgba(255,255,255,.72) !important; text-shadow:0 1px 3px rgba(0,0,0,.5) !important; }
/* v28 — LIQUID (fond = photo de profil plein cadre, PAS de médaillon) & FROST/Glass doux (même fond photo + médaillon conservé). --card-profile exposé par card.php. */
body[data-layout="liquid"] .card-wrap .card-inner,
body[data-layout="frost"] .card-wrap .card-inner{
  background:var(--card-hero, var(--card-profile, none)) center/cover no-repeat, #0b0f14 !important; }
body[data-layout="liquid"] .card-wrap .card-avatar-wrap,
body[data-layout="liquid"] .card-wrap .card-avatar-frame{ display:none !important; }
/* voile sombre léger derrière le contenu pour garantir la lisibilité du texte clair */
body[data-layout="liquid"] .card-wrap .card-inner::after,
body[data-layout="frost"] .card-wrap .card-inner::after{ content:""; position:absolute !important; inset:0 !important; z-index:0 !important; pointer-events:none !important;
  background:linear-gradient(180deg, rgba(6,10,16,.28) 0%, rgba(6,10,16,.14) 40%, rgba(6,10,16,.52) 100%) !important; }
/* v28b — LIQUID & FROST : chips du héro à DROITE (le layout les mettait à gauche) */
body[data-layout="liquid"] .card-wrap .h-badges-float,
body[data-layout="frost"] .card-wrap .h-badges-float,
body[data-layout="liquid"] .card-wrap .card-inner > .h-badges-float,
body[data-layout="frost"] .card-wrap .card-inner > .h-badges-float{
  left:auto !important; right:12px !important; justify-content:flex-end !important; transform:none !important; }
/* ============================================================
   RESHAPING v29 — JOUR/NUIT (piloté par body[data-mode] calculé par card.php)
   Chaque layout garde son identité le jour ; variante sombre la nuit.
   ============================================================ */
/* STUDIO — jour : pêche (défaut) · nuit : chaud sombre, accents clairs */
body[data-layout="studio"][data-mode="dark"]{ background:#140f15 !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner{ background:linear-gradient(180deg,#241823 0%,#160f16 62%,#100b11 100%) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .card-name{ color:#fbeee6 !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .card-title{ color:color-mix(in srgb,var(--card-accent) 72%,#fff) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .card-tagline{ color:rgba(255,246,240,.86) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .modules-page .mod-icon{ background:rgba(255,255,255,.06) !important; border-color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; box-shadow:0 4px 14px rgba(0,0,0,.28) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .modules-page .mod-label{ color:color-mix(in srgb,var(--card-accent) 62%,#fff) !important; text-shadow:0 0 8px color-mix(in srgb,var(--card-accent) 30%,transparent) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:color-mix(in srgb,var(--card-accent) 66%,#fff) !important; border-color:color-mix(in srgb,var(--card-accent) 60%,#fff) !important; }
body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .card-footer, body[data-layout="studio"][data-mode="dark"] .card-wrap .card-inner .card-footer *{ color:rgba(255,246,240,.82) !important; }
/* ============================================================
   RESHAPING v30 — JOUR/NUIT généralisé. NUIT = gris très foncé #23252b (pas noir).
   Générique = layouts "surface" (studio, linear, premium, aqua, organic, bento, tactile, editorial/Portrait).
   Spéciaux gérés à part : aurora, neon (sombres nativement → variante jour), liquid, frost (photo), brutal, magazine.
   ============================================================ */
/* --- NUIT générique (surface) --- */
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]){ background:#23252b !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner{ background:#23252b !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .card-name{ color:#f3f4f6 !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .card-title{ color:color-mix(in srgb,var(--card-accent) 72%,#fff) !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .card-tagline{ color:rgba(240,242,245,.82) !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .modules-page .mod-icon{ background:rgba(255,255,255,.055) !important; border-color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; box-shadow:0 4px 14px rgba(0,0,0,.3) !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .modules-page .mod-icon i,
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .modules-page .mod-label{ color:color-mix(in srgb,var(--card-accent) 62%,#fff) !important; text-shadow:0 0 8px color-mix(in srgb,var(--card-accent) 26%,transparent) !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .card-footer,
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .card-footer *{ color:rgba(240,242,245,.8) !important; }
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-mode="dark"]:not([data-layout="aurora"]):not([data-layout="neon"]):not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]):not([data-layout="magazine"]) .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:color-mix(in srgb,var(--card-accent) 66%,#fff) !important; border-color:color-mix(in srgb,var(--card-accent) 58%,#fff) !important; }
/* --- MAGAZINE (Éditorial) nuit : papier sombre --- */
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner{ background:#1b1917 !important; }
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .card-name{ color:#f6efe6 !important; }
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .card-title,
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .card-tagline{ color:rgba(246,239,230,.82) !important; }
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .modules-page .mod-icon{ background:rgba(255,255,255,.05) !important; border-color:color-mix(in srgb,var(--card-accent) 55%,#fff) !important; }
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .modules-page .mod-label,
body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .card-footer, body[data-mode="dark"][data-layout="magazine"] .card-wrap .card-inner .card-footer *{ color:rgba(246,239,230,.86) !important; }
/* --- BRUTAL nuit : gris très foncé, accents vifs conservés --- */
body[data-mode="dark"][data-layout="brutal"]{ background:#23252b !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner{ background:#23252b !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-name{ color:#f4f5f7 !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-title,
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-tagline,
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-footer, body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-footer *{ color:rgba(240,242,245,.82) !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-label{ color:rgba(240,242,245,.9) !important; }
/* --- AURORA jour : aube claire (garde les lueurs mais fond clair) --- */
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner{ background:radial-gradient(120% 80% at 50% 0%, #fff3e6 0%, #ffe6d2 45%, #ffd9c7 100%) !important; }
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .card-name{ color:#3a2416 !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .card-title,
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .card-tagline,
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .card-footer, body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .card-footer *{ color:#7a4a2c !important; }
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .modules-page .mod-icon{ background:rgba(255,255,255,.6) !important; border-color:color-mix(in srgb,var(--card-accent) 50%,#a05a30) !important; }
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-mode="light"][data-layout="aurora"] .card-wrap .card-inner .modules-page .mod-label{ color:#a05a30 !important; text-shadow:none !important; }
/* --- NEON jour : fond clair, accent conservé --- */
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner{ background:#f4f6fb !important; }
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .card-name{ color:#141018 !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .card-title,
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .card-tagline,
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .card-footer, body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .card-footer *{ color:#3a3550 !important; }
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .modules-page .mod-icon{ background:#fff !important; border-color:color-mix(in srgb,var(--card-accent) 55%,#111) !important; box-shadow:0 4px 14px rgba(20,16,24,.1) !important; }
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-mode="light"][data-layout="neon"] .card-wrap .card-inner .modules-page .mod-label{ color:color-mix(in srgb,var(--card-accent) 70%,#111) !important; text-shadow:none !important; }

/* ============================================================
   GLASS LAYOUTS — base COMMUNE Liquid + Glass Doux (frost)
   Un SEUL verre = le panneau .bloo-fluid-panel. Toutes les zones
   verre internes du layout (identité, section modules, chaque bouton)
   sont neutralisées → damier de disques colorisés, identique à Liquid.
   frost = mêmes règles + identité à gauche / médaillon à droite.
   ============================================================ */
/* GLOBAL : labels des boutons/modules centrés avec l'icône (tous layouts) */
body[data-layout] .card-wrap .card-inner .modules-page .mod-btn{ display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; text-align:center !important; }
body[data-layout] .card-wrap .card-inner .modules-page .mod-label{ text-align:center !important; width:100% !important; display:block !important; }
/* --- panneau verre unique (glass commun ; la marge haute est définie par layout) --- */
body[data-layout="liquid"] .card-wrap .card-inner .bloo-fluid-panel,
body[data-layout="frost"]  .card-wrap .card-inner .bloo-fluid-panel{
  padding:16px 15px 15px !important; border-radius:30px !important;
  background:rgba(20,22,28,.46) !important; -webkit-backdrop-filter:blur(22px) saturate(1.1) !important; backdrop-filter:blur(22px) saturate(1.1) !important;
  border:1px solid rgba(255,255,255,.17) !important; box-shadow:none !important;
  display:flex !important; flex-direction:column !important; }
/* --- neutraliser TOUTE zone verre interne (le verre = uniquement le panneau) --- */
body[data-layout="liquid"] .card-wrap .card-inner .card-identity,
body[data-layout="frost"]  .card-wrap .card-inner .card-identity,
body[data-layout="liquid"] .card-wrap .card-inner .modules-section,
body[data-layout="frost"]  .card-wrap .card-inner .modules-section,
body[data-layout="liquid"] .card-wrap .card-inner .modules-page-wrap,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page-wrap,
body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-btn,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-btn,
body[data-layout="liquid"] .card-wrap .card-inner .contact-actions,
body[data-layout="frost"]  .card-wrap .card-inner .contact-actions{
  background:transparent !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; border:none !important; }
body[data-layout="liquid"] .card-wrap .card-inner .card-identity,
body[data-layout="frost"]  .card-wrap .card-inner .card-identity{ border-radius:0 !important; padding-left:0 !important; padding-right:0 !important; }
body[data-layout="liquid"] .card-wrap .card-inner .modules-section,
body[data-layout="frost"]  .card-wrap .card-inner .modules-section{ flex:0 0 auto !important; justify-content:flex-start !important; padding-left:0 !important; padding-right:0 !important; }
body[data-layout="liquid"] .card-wrap .card-inner .contact-actions,
body[data-layout="frost"]  .card-wrap .card-inner .contact-actions{ padding-left:2px !important; padding-right:2px !important; }
/* --- grille 4 colonnes + disques colorisés par l'accent (le "damier") --- */
body[data-layout="liquid"] .card-wrap .card-inner .modules-page,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page{ grid-template-columns:repeat(4,1fr) !important; gap:clamp(5px,1.4vh,10px) 6px !important; }
body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-icon{ width:clamp(40px,11vw,50px) !important; height:clamp(40px,11vw,50px) !important; margin-left:auto !important; margin-right:auto !important;
  background:color-mix(in srgb,var(--card-accent) 26%, rgba(255,255,255,.05)) !important; border:1px solid color-mix(in srgb,var(--card-accent) 62%,#fff) !important; box-shadow:0 3px 10px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.16) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 42%,#fff) !important; text-shadow:0 1px 4px rgba(0,0,0,.5) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-label,
body[data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-label{ color:#fff !important; text-shadow:0 1px 3px rgba(0,0,0,.5) !important; }
/* --- CTA : primaire blanc, ghost lisible, aucune ombre/zone --- */
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--primary,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:#fff !important; border:1px solid #fff !important; box-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#15131a !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:rgba(255,255,255,.08) !important; border:1.5px solid rgba(255,255,255,.85) !important; box-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#fff !important; text-shadow:0 1px 3px rgba(0,0,0,.5) !important; }
/* --- footer = bandeau verre (même couleur que le panneau) ; liens/logo = couleur des icônes --- */
body[data-layout="liquid"] .card-wrap .card-inner .card-footer,
body[data-layout="frost"]  .card-wrap .card-inner .card-footer{
  margin:auto 18px calc(8px + env(safe-area-inset-bottom,0px)) 18px !important; width:auto !important; position:relative !important; z-index:2 !important;
  padding:10px 14px !important; border-radius:22px !important;
  background:rgba(20,22,28,.52) !important; -webkit-backdrop-filter:blur(22px) saturate(1.1) !important; backdrop-filter:blur(22px) saturate(1.1) !important;
  border:1px solid rgba(255,255,255,.17) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .card-footer, body[data-layout="liquid"] .card-wrap .card-inner .card-footer *,
body[data-layout="frost"]  .card-wrap .card-inner .card-footer, body[data-layout="frost"]  .card-wrap .card-inner .card-footer *{ color:color-mix(in srgb,var(--card-accent) 42%,#fff) !important; text-shadow:0 1px 2px rgba(0,0,0,.35) !important; }
/* --- identité NUIT : nom clair, titre accent, société = couleur des icônes, tagline clair --- */
body[data-layout="liquid"] .card-wrap .card-inner .card-name,
body[data-layout="frost"]  .card-wrap .card-inner .card-name{ color:#f6f7f9 !important; text-shadow:0 1px 6px rgba(0,0,0,.5) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .card-title,
body[data-layout="frost"]  .card-wrap .card-inner .card-title{ color:color-mix(in srgb,var(--card-accent) 72%,#fff) !important; text-shadow:0 1px 4px rgba(0,0,0,.5) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .card-company,
body[data-layout="frost"]  .card-wrap .card-inner .card-company{ color:color-mix(in srgb,var(--card-accent) 42%,#fff) !important; text-shadow:0 1px 4px rgba(0,0,0,.45) !important; }
body[data-layout="liquid"] .card-wrap .card-inner .card-tagline,
body[data-layout="frost"]  .card-wrap .card-inner .card-tagline{ color:rgba(240,242,245,.85) !important; }
/* --- JOUR (mode clair) : verre clair + textes foncés (LIQUID + FROST) --- */
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .bloo-fluid-panel,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .bloo-fluid-panel{ background:rgba(255,255,255,.52) !important; border:1px solid rgba(255,255,255,.7) !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-name,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-name{ color:#20161d !important; text-shadow:0 1px 2px rgba(255,255,255,.5) !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-title,
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-tagline,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-title,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-tagline{ color:#3a2f3a !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-company,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-company{ color:color-mix(in srgb,var(--card-accent) 72%,#111) !important; text-shadow:0 1px 2px rgba(255,255,255,.55) !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-icon{ background:color-mix(in srgb,var(--card-accent) 22%,#fff) !important; border:1px solid color-mix(in srgb,var(--card-accent) 55%,#333) !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon i,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 72%,#111) !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-label,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .modules-page .mod-label{ color:#241a24 !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-footer,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-footer{ background:rgba(255,255,255,.58) !important; border:1px solid rgba(255,255,255,.7) !important; }
body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-footer, body[data-mode="light"][data-layout="liquid"] .card-wrap .card-inner .card-footer *,
body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-footer, body[data-mode="light"][data-layout="frost"]  .card-wrap .card-inner .card-footer *{ color:color-mix(in srgb,var(--card-accent) 72%,#111) !important; text-shadow:0 1px 2px rgba(255,255,255,.45) !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost,
body[data-tier][data-mode="light"][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:rgba(0,0,0,.04) !important; border:1.5px solid color-mix(in srgb,var(--card-accent) 55%,#333) !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="liquid"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label,
body[data-tier][data-mode="light"][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="frost"]  .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:color-mix(in srgb,var(--card-accent) 72%,#111) !important; text-shadow:none !important; }
/* ===== LIQUID uniquement : portrait plein cadre, contenu au 2/3, pas de médaillon, identité centrée ===== */
body[data-layout="liquid"] .card-wrap .card-avatar-wrap,
body[data-layout="liquid"] .card-wrap .card-avatar-frame{ display:none !important; }
body[data-layout="liquid"] .card-wrap .card-inner .bloo-fluid-panel{ margin:27vh 18px 0 !important; }
/* ===== GLASS DOUX (frost) uniquement : identité à GAUCHE, médaillon à DROITE ===== */
body[data-layout="frost"] .card-wrap .card-inner .bloo-fluid-panel{ margin:30vh 18px 0 !important; }
body[data-layout="frost"] .card-wrap .card-inner .frost-header{ display:flex !important; flex-direction:row !important; align-items:center !important; gap:14px !important; width:100% !important; margin-bottom:8px !important; }
body[data-layout="frost"] .card-wrap .card-inner .frost-header .card-identity{ order:1 !important; flex:1 1 auto !important; text-align:left !important; margin:0 !important; padding:0 !important; min-width:0 !important; }
body[data-layout="frost"] .card-wrap .card-inner .frost-header .card-avatar-wrap{ order:2 !important; flex:0 0 auto !important; margin:0 !important; padding:0 !important; display:block !important; }
body[data-layout="frost"] .card-wrap .card-inner .frost-header .card-avatar-frame{ width:86px !important; height:86px !important; margin:0 !important; padding-top:0 !important; border-radius:22px !important; overflow:hidden !important; background:transparent !important; border:2px solid rgba(255,255,255,.55) !important; box-shadow:0 6px 18px rgba(0,0,0,.35) !important; }
body[data-layout="frost"] .card-wrap .card-inner .frost-header .card-avatar-frame img,
body[data-layout="frost"] .card-wrap .card-inner .frost-header .card-avatar{ width:100% !important; height:100% !important; object-fit:cover !important; border-radius:inherit !important; }
body[data-layout="frost"] .card-wrap .card-inner .card-name{ text-align:left !important; }
body[data-layout="frost"] .card-wrap .card-inner .card-name::after{ left:0 !important; transform:none !important; }
body[data-layout="frost"] .card-wrap .card-inner .card-title,
body[data-layout="frost"] .card-wrap .card-inner .card-company,
body[data-layout="frost"] .card-wrap .card-inner .card-tagline{ text-align:left !important; margin-inline:0 !important; }
/* ============================================================
   NÉO-BRUTALISTE (brutal) — aplats vifs, traits noirs épais, ombres DURES,
   CAPITALES. Colorisation par --card-accent (page + CTA primaire + chips).
   Pastilles multicolores (palette brutaliste). Jour/nuit.
   Structure : card.php enveloppe avatar→CTA dans .bloo-brutal-sheet (feuille blanche),
   footer hors feuille sur la page accent.
   ============================================================ */
body[data-layout="brutal"]{ --bru-1:#5BD1D7; --bru-2:#F98B7E; --bru-3:#9BE15D; --bru-4:#B197FC; --bru-5:#FFD84D; --bru-6:#FF9EC4; --bru-7:#7FB2FF; --bru-8:#FFB86B; }
/* capitales partout (police Lexend locale, déjà chargée) */
body[data-layout="brutal"] .card-wrap .card-inner .card-name,
body[data-layout="brutal"] .card-wrap .card-inner .card-title,
body[data-layout="brutal"] .card-wrap .card-inner .card-company,
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-label,
body[data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn__label,
body[data-layout="brutal"] .card-wrap .card-inner .card-footer{ text-transform:uppercase !important; letter-spacing:.01em !important; font-family:'Lexend','Inter',sans-serif !important; }
/* page = aplat vif accent */
body[data-layout="brutal"] .card-wrap .card-inner{ background:var(--card-accent) !important; }
body[data-layout="brutal"] .card-wrap .card-header{ display:none !important; }
body[data-layout="brutal"] .card-wrap .card-inner::after,
body[data-layout="brutal"] .card-wrap .card-inner::before{ display:none !important; }
/* feuille blanche brutaliste */
body[data-layout="brutal"] .card-wrap .card-inner .bloo-brutal-sheet{
  margin:16px 14px !important; background:#fff !important; border:3px solid #0a0a0a !important; border-radius:6px !important;
  box-shadow:7px 7px 0 #0a0a0a !important; display:flex !important; flex-direction:column !important; overflow:hidden !important; padding:0 0 14px !important; }
/* photo = bandeau plein largeur, trait noir en bas */
body[data-layout="brutal"] .card-wrap .card-inner .card-avatar-wrap{ margin:0 !important; padding:0 !important; width:100% !important; display:block !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-avatar-frame{ width:100% !important; height:auto !important; aspect-ratio:16/10 !important; border:0 !important; border-bottom:3px solid #0a0a0a !important; border-radius:0 !important; margin:0 !important; overflow:hidden !important; box-shadow:none !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-avatar-frame img,
body[data-layout="brutal"] .card-wrap .card-inner .card-avatar-frame .card-avatar{ width:100% !important; height:100% !important; object-fit:cover !important; border-radius:0 !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-avatar-frame .card-avatar{ background:var(--card-accent) !important; color:#0a0a0a !important; font-size:56px !important; font-weight:800 !important; }
/* identité : capitales énormes noires, à gauche */
body[data-layout="brutal"] .card-wrap .card-inner .card-identity{ text-align:left !important; padding:12px 14px 4px !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-name{ color:#0a0a0a !important; font-weight:800 !important; font-size:clamp(26px,8vw,36px) !important; line-height:.95 !important; letter-spacing:-.01em !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-name::after{ display:none !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-title{ color:#0a0a0a !important; font-weight:800 !important; font-size:clamp(11px,3.4vw,14px) !important; margin-top:5px !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-company{ color:#0a0a0a !important; font-weight:600 !important; opacity:.75 !important; }
/* grille : pastilles vives à bord noir + ombre dure */
body[data-layout="brutal"] .card-wrap .card-inner .modules-section{ padding:2px 14px 0 !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page{ grid-template-columns:repeat(4,1fr) !important; gap:12px 8px !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn{ display:flex !important; flex-direction:column !important; align-items:center !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-icon{ width:clamp(42px,12vw,52px) !important; height:clamp(42px,12vw,52px) !important; border-radius:9px !important; border:2.5px solid #0a0a0a !important; box-shadow:3px 3px 0 #0a0a0a !important; margin:0 auto !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-icon i{ color:#0a0a0a !important; text-shadow:none !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-label{ color:#0a0a0a !important; font-weight:700 !important; font-size:9px !important; text-shadow:none !important; margin-top:5px !important; }
/* cycle palette multicolore */
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+1) .mod-icon{ background:var(--bru-1) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+2) .mod-icon{ background:var(--bru-2) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+3) .mod-icon{ background:var(--bru-3) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+4) .mod-icon{ background:var(--bru-4) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+5) .mod-icon{ background:var(--bru-5) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+6) .mod-icon{ background:var(--bru-6) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+7) .mod-icon{ background:var(--bru-7) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(8n+8) .mod-icon{ background:var(--bru-8) !important; }
/* CTA brutalistes */
body[data-layout="brutal"] .card-wrap .card-inner .contact-actions{ padding:8px 14px 4px !important; background:transparent !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; border:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn{ border-radius:9px !important; border:3px solid #0a0a0a !important; box-shadow:4px 4px 0 #0a0a0a !important; font-weight:800 !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#0a0a0a !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:#fff !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#0a0a0a !important; text-shadow:none !important; }
/* chips héro brutalistes (noir, bord épais, ombre dure) */
body[data-layout="brutal"] .card-wrap .h-badges-float,
body[data-layout="brutal"] .card-wrap .card-inner > .h-badges-float{ left:auto !important; right:12px !important; justify-content:flex-end !important; transform:none !important; }
body[data-layout="brutal"] .card-wrap .h-badge{ background:#0a0a0a !important; border:2.5px solid #0a0a0a !important; border-radius:9px !important; box-shadow:3px 3px 0 rgba(0,0,0,.4) !important; color:#fff !important; }
body[data-layout="brutal"] .card-wrap .h-badge i, body[data-layout="brutal"] .card-wrap .h-badge span, body[data-layout="brutal"] .card-wrap .h-badge{ color:#fff !important; }
/* footer : capitales noires sur la page accent */
body[data-layout="brutal"] .card-wrap .card-inner .card-footer{ background:transparent !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; border:none !important; margin:0 !important; width:100% !important; padding:8px 14px calc(8px + env(safe-area-inset-bottom,0px)) !important; }
body[data-layout="brutal"] .card-wrap .card-inner .card-footer, body[data-layout="brutal"] .card-wrap .card-inner .card-footer *{ color:#0a0a0a !important; font-weight:700 !important; text-shadow:none !important; }
/* ===== JOUR/NUIT ===== */
/* NUIT : page sombre teintée accent, feuille gris foncé #23252b, texte clair, footer clair */
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner{ background:color-mix(in srgb, var(--card-accent) 26%, #16171c) !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .bloo-brutal-sheet{ background:#23252b !important; border-color:#0a0a0a !important; box-shadow:7px 7px 0 #0a0a0a !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-name,
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-title,
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-company{ color:#f3f4f6 !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-avatar-frame{ border-bottom-color:#0a0a0a !important; }
body[data-tier][data-mode="dark"][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:#2c2f37 !important; }
body[data-tier][data-mode="dark"][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="dark"][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#f3f4f6 !important; }
body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-footer, body[data-mode="dark"][data-layout="brutal"] .card-wrap .card-inner .card-footer *{ color:#f3f4f6 !important; }
/* ============================================================
   PREMIUM — ivoire, serif, filets fins, sobre/élégant/intemporel
   ============================================================ */
body[data-layout="premium"] .card-wrap .card-inner .card-name,
body[data-layout="premium"] .card-wrap .card-inner .card-title,
body[data-layout="premium"] .card-wrap .card-inner .card-company{ font-family:Georgia,'Times New Roman',serif !important; }
body[data-mode="light"][data-layout="premium"] .card-wrap .card-inner{ background:#FBF8F1 !important; }
body[data-mode="light"][data-layout="premium"] .card-wrap .card-inner .card-name{ color:#241f17 !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-name{ font-weight:600 !important; letter-spacing:.3px !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-name::after{ width:46px !important; height:1px !important; opacity:1 !important; background:var(--card-accent) !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-title{ font-style:italic !important; color:var(--card-accent) !important; font-weight:600 !important; }
body[data-layout="premium"] .card-wrap .card-inner .modules-section{ border-top:1px solid color-mix(in srgb,var(--card-accent) 28%, transparent) !important; border-bottom:1px solid color-mix(in srgb,var(--card-accent) 28%, transparent) !important; margin:8px 22px !important; padding:12px 0 4px !important; }
body[data-layout="premium"] .card-wrap .card-inner .modules-page .mod-icon{ background:transparent !important; border:1px solid color-mix(in srgb,var(--card-accent) 42%, #cfc7b6) !important; box-shadow:none !important; }
body[data-layout="premium"] .card-wrap .card-inner .modules-page .mod-icon i{ color:var(--card-accent) !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="premium"] .card-wrap .card-inner .modules-page .mod-label{ color:#3a352c !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; border:1px solid var(--card-accent) !important; box-shadow:none !important; letter-spacing:.4px !important; }
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#fff !important; }
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:transparent !important; border:1px solid color-mix(in srgb,var(--card-accent) 50%,#aaa) !important; box-shadow:none !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#3a352c !important; }
/* ============================================================
   AQUA — teal lumineux, arrondis généreux, glossy, frais/moderne
   ============================================================ */
body[data-layout="aqua"] .card-wrap .card-inner .card-name,
body[data-layout="aqua"] .card-wrap .card-inner .card-title{ font-family:'Space Grotesk','Inter',sans-serif !important; }
body[data-mode="light"][data-layout="aqua"] .card-wrap .card-inner{ background:linear-gradient(180deg,#ecfdff 0%, #d7f4fb 52%, #c5ecf5 100%) !important; }
body[data-mode="light"][data-layout="aqua"] .card-wrap .card-inner .card-name{ color:#0b3a44 !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-title{ color:var(--card-accent) !important; font-weight:600 !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-name::after{ background:var(--card-accent) !important; height:3px !important; border-radius:3px !important; }
body[data-layout="aqua"] .card-wrap .card-avatar-frame{ border-radius:50% !important; border:4px solid #fff !important; box-shadow:0 10px 28px color-mix(in srgb,var(--card-accent) 38%, transparent) !important; }
body[data-layout="aqua"] .card-wrap .card-inner .modules-page .mod-icon{ border-radius:50% !important; background:linear-gradient(160deg, color-mix(in srgb,var(--card-accent) 32%,#fff), color-mix(in srgb,var(--card-accent) 12%,#fff)) !important; border:1px solid color-mix(in srgb,var(--card-accent) 40%,#fff) !important; box-shadow:0 6px 16px color-mix(in srgb,var(--card-accent) 22%, transparent), inset 0 1px 0 rgba(255,255,255,.7) !important; }
body[data-layout="aqua"] .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 82%,#023) !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="aqua"] .card-wrap .card-inner .modules-page .mod-label{ color:#0b3a44 !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn{ border-radius:999px !important; }
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:linear-gradient(160deg, color-mix(in srgb,var(--card-accent) 90%,#fff), var(--card-accent)) !important; box-shadow:0 8px 20px color-mix(in srgb,var(--card-accent) 34%,transparent) !important; border:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#fff !important; }
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:rgba(255,255,255,.6) !important; border:1.5px solid color-mix(in srgb,var(--card-accent) 55%,#fff) !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:color-mix(in srgb,var(--card-accent) 80%,#023) !important; }
/* ============================================================
   ORGANIQUE — lin, formes organiques (blobs), serif chaleureux, humain/calme
   ============================================================ */
body[data-layout="organic"] .card-wrap .card-inner .card-name,
body[data-layout="organic"] .card-wrap .card-inner .card-title,
body[data-layout="organic"] .card-wrap .card-inner .card-company{ font-family:Georgia,'Times New Roman',serif !important; }
body[data-mode="light"][data-layout="organic"] .card-wrap .card-inner{ background:#F3EEE1 !important; }
body[data-mode="light"][data-layout="organic"] .card-wrap .card-inner .card-name{ color:#33301f !important; }
body[data-layout="organic"] .card-wrap .card-inner .card-title{ font-style:italic !important; color:color-mix(in srgb,var(--card-accent) 78%, #2f5a3a) !important; font-weight:600 !important; }
body[data-layout="organic"] .card-wrap .card-inner .card-name::after{ background:color-mix(in srgb,var(--card-accent) 70%, #2f5a3a) !important; border-radius:3px !important; }
body[data-layout="organic"] .card-wrap .card-avatar-frame{ border-radius:56% 44% 57% 43% / 43% 57% 43% 57% !important; border:3px solid #fff !important; box-shadow:0 8px 20px rgba(80,70,50,.2) !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-page .mod-icon{ border-radius:58% 42% 55% 45% / 45% 55% 45% 55% !important; background:color-mix(in srgb,var(--card-accent) 18%, #efe7d6) !important; border:1px solid color-mix(in srgb,var(--card-accent) 34%, #d6cbb2) !important; box-shadow:0 4px 12px rgba(80,70,50,.16) !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 74%, #33301f) !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="organic"] .card-wrap .card-inner .modules-page .mod-label{ color:#4a4030 !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn{ border-radius:20px !important; }
body[data-tier][data-mode][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:color-mix(in srgb,var(--card-accent) 82%, #2f5a3a) !important; border:none !important; box-shadow:0 6px 16px rgba(80,70,50,.2) !important; }
body[data-tier][data-mode][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label{ color:#fff !important; }
body[data-tier][data-mode][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:transparent !important; border:1.5px solid color-mix(in srgb,var(--card-accent) 48%,#b9ad92) !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="organic"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#4a4030 !important; }
/* ============================================================
   BENTO — tuiles modulaires de tailles variées, rythme structuré, riche.
   Chaque tuile = résumé (icône + libellé) ; clic → panneau détail (openSlide).
   ============================================================ */
body[data-layout="bento"] .card-wrap .card-inner .card-name,
body[data-layout="bento"] .card-wrap .card-inner .card-title{ font-family:'Space Grotesk','Inter',sans-serif !important; }
body[data-mode="light"][data-layout="bento"] .card-wrap .card-inner{ background:#eef0f4 !important; }
body[data-mode="light"][data-layout="bento"] .card-wrap .card-inner .card-name{ color:#20232a !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-section{ padding:2px 14px 0 !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page{ grid-template-columns:repeat(4,1fr) !important; grid-auto-rows:62px !important; gap:8px !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn{ display:flex !important; flex-direction:column !important; align-items:flex-start !important; justify-content:space-between !important; text-align:left !important; padding:9px 10px !important; border-radius:16px !important; background:color-mix(in srgb,var(--card-accent) 12%, #fff) !important; border:1px solid color-mix(in srgb,var(--card-accent) 20%, #e3e3e8) !important; box-shadow:0 4px 14px rgba(20,20,40,.06) !important; overflow:hidden !important; height:100% !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-icon{ width:30px !important; height:30px !important; border-radius:9px !important; background:color-mix(in srgb,var(--card-accent) 88%,#fff) !important; border:none !important; box-shadow:none !important; margin:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-icon i{ color:#fff !important; font-size:13px !important; text-shadow:none !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-label{ text-align:left !important; width:100% !important; font-weight:600 !important; font-size:11px !important; margin:0 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(6n+1){ grid-column:span 2 !important; grid-row:span 2 !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(6n+1) .mod-icon{ width:40px !important; height:40px !important; border-radius:12px !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(6n+1) .mod-icon i{ font-size:18px !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(6n+1) .mod-label{ font-size:14px !important; }
body[data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn:nth-child(6n+4){ grid-column:span 2 !important; }
/* nuit bento : tuiles sur gris foncé */
body[data-mode="dark"][data-layout="bento"] .card-wrap .card-inner .modules-page .mod-btn{ background:color-mix(in srgb,var(--card-accent) 16%, #2a2d34) !important; border:1px solid color-mix(in srgb,var(--card-accent) 26%, #3a3d44) !important; box-shadow:0 4px 14px rgba(0,0,0,.28) !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .card-inner .modules-page .mod-label{ color:#eef0f4 !important; }
/* ============================================================
   TACTILE — neumorphisme (relief doux, bosses/creux)
   ============================================================ */
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner{ background:#e6e9ef !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .card-name{ color:#363b45 !important; }
body[data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ border:none !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ background:#e6e9ef !important; box-shadow:5px 5px 10px #c4c8d1, -5px -5px 10px #ffffff !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon i{ color:var(--card-accent) !important; text-shadow:none !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-label{ color:#4a4f5a !important; text-shadow:none !important; }
body[data-tier][data-mode][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn{ border:none !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; box-shadow:5px 5px 12px #c4c8d1, -5px -5px 12px #ffffff !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:#e6e9ef !important; box-shadow:5px 5px 12px #c4c8d1, -5px -5px 12px #ffffff !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#4a4f5a !important; }
/* nuit tactile : neumorphisme sombre */
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ background:#23252b !important; box-shadow:5px 5px 10px #17181c, -5px -5px 10px #2f323a !important; }
body[data-tier][data-mode="dark"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:#23252b !important; box-shadow:5px 5px 12px #17181c, -5px -5px 12px #2f323a !important; }
body[data-tier][data-mode="dark"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ box-shadow:5px 5px 12px #17181c, -5px -5px 12px #2f323a !important; }
/* ============================================================
   CORRECTIFS SURFACES — neutraliser la photo de fond (.card-inner::before)
   sur les layouts à surface pleine ; PREMIUM la garde en HERO haut.
   ============================================================ */
/* aqua / organic / bento / tactile : pas de photo de fond, surface propre */
body[data-layout="aqua"] .card-wrap .card-inner::before,
body[data-layout="organic"] .card-wrap .card-inner::before,
body[data-layout="bento"] .card-wrap .card-inner::before,
body[data-layout="tactile"] .card-wrap .card-inner::before{ display:none !important; }
/* ces 4 layouts : l'avatar (médaillon) n'a plus besoin de l'espace hero de 80px, on le réduit */
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="bento"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-wrap{ padding-top:22px !important; }
/* PREMIUM : la photo de fond devient un HERO en haut (36%), ivoire en dessous, médaillon chevauchant à gauche */
body[data-layout="premium"] .card-wrap .card-inner::before{ display:none !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-avatar-wrap{ padding-top:0 !important; margin-top:-82px !important; padding-left:22px !important; text-align:left !important; display:block !important; position:relative !important; z-index:3 !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-avatar-frame{ width:124px !important; height:124px !important; border-radius:50% !important; border:4px solid #FBF8F1 !important; box-shadow:0 6px 18px rgba(0,0,0,.22) !important; margin:0 !important; }
body[data-mode="dark"][data-layout="premium"] .card-wrap .card-inner .card-avatar-frame{ border-color:#23252b !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-identity{ text-align:left !important; padding:10px 20px 4px !important; }
body[data-layout="premium"] .card-wrap .card-inner .card-name::after{ margin-left:0 !important; left:0 !important; transform:none !important; }
/* CTA primaire : encre lisible sur l'accent (--card-accent-ink calculée par card.php) */
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="premium"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="aqua"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i,
body[data-tier][data-mode][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i{ color:var(--card-accent-ink,#fff) !important; }
/* médaillon avatar visible (CSS de layout historiques le masquaient) — aqua/organic/bento/tactile */
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="bento"] .card-wrap .card-inner .card-avatar-wrap,
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-wrap{ display:flex !important; justify-content:center !important; align-items:center !important; margin-top:0 !important; padding-top:24px !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-frame,
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-frame,
body[data-layout="bento"] .card-wrap .card-inner .card-avatar-frame,
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ display:block !important; width:94px !important; height:94px !important; margin:0 auto !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-frame img, body[data-layout="aqua"] .card-wrap .card-inner .card-avatar,
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-frame img, body[data-layout="organic"] .card-wrap .card-inner .card-avatar,
body[data-layout="bento"] .card-wrap .card-inner .card-avatar-frame img, body[data-layout="bento"] .card-wrap .card-inner .card-avatar,
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame img, body[data-layout="tactile"] .card-wrap .card-inner .card-avatar{ width:100% !important; height:100% !important; object-fit:cover !important; }
/* bento : médaillon carré arrondi (cohérent tuiles) ; tactile : relief neumorphique */
body[data-layout="bento"] .card-wrap .card-inner .card-avatar-frame{ border-radius:18px !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:6px 6px 12px #c4c8d1, -6px -6px 12px #ffffff !important; border:none !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:6px 6px 12px #17181c, -6px -6px 12px #2f323a !important; border:none !important; }
/* ============================================================
   ORGANIQUE v2 — hero photo à bord ORGANIQUE + médaillon rond chevauchant (promesse) ; nom NET (jour)
   ============================================================ */
/* nom net : retire l'ombre de texte (flou) */
body[data-layout="organic"] .card-wrap .card-inner .card-name{ text-shadow:none !important; }
/* HERO : card-header (cartes cover) + ::before (cartes à image de fond) = bandeau haut à bord organique */
body[data-layout="organic"] .card-wrap .card-header{ height:clamp(118px,18vh,205px) !important; min-height:0 !important; overflow:hidden !important; border-radius:0 0 44% 44% / 0 0 22% 22% !important; }
body[data-layout="organic"] .card-wrap .card-header .card-header-img{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-layout="organic"] .card-wrap .card-inner::before{ display:block !important; inset:0 0 auto 0 !important; height:clamp(118px,18vh,205px) !important; opacity:1 !important; background-position:center 28% !important; border-radius:0 0 44% 44% / 0 0 22% 22% !important; }
/* médaillon rond +25% (≈118px), remonté pour chevaucher le bas du hero, centré */
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-wrap{ display:flex !important; justify-content:center !important; align-items:flex-start !important; margin-top:-58px !important; padding-top:0 !important; position:relative !important; z-index:3 !important; }
body[data-layout="organic"] .card-wrap .card-inner .card-avatar-frame{ width:clamp(129px,34vw,193px) !important; height:clamp(129px,34vw,193px) !important; border-radius:50% !important; border:5px solid #F3EEE1 !important; box-shadow:0 8px 22px rgba(80,70,50,.25) !important; margin:0 auto !important; }
body[data-mode="dark"][data-layout="organic"] .card-wrap .card-inner .card-avatar-frame{ border-color:#23252b !important; }
body[data-mode="dark"][data-layout="organic"] .card-wrap .card-inner .card-avatar-frame{ border-color:#23252b !important; }
/* ============================================================
   GLOBAL — OMBRES PORTÉES réduites au strict minimum (toutes cartes / tous layouts)
   Les ombres structurelles (brutal dur / tactile neumorphique) sont réduites, pas supprimées.
   ============================================================ */
body[data-layout] .card-wrap .card-inner .modules-page .mod-icon,
body[data-layout] .card-wrap .card-inner .modules-page .mod-btn,
body[data-layout] .card-wrap .card-inner .contact-actions .card-action-btn,
body[data-layout] .card-wrap .card-inner .card-avatar-frame,
body[data-layout] .card-wrap .card-inner .bloo-fluid-panel,
body[data-layout] .card-wrap .card-inner .bloo-brutal-sheet,
body[data-layout] .card-wrap .h-badge{ box-shadow:0 1px 2px rgba(0,0,0,.06) !important; }
/* BRUTAL : ombre dure réduite (identité conservée) */
body[data-layout="brutal"] .card-wrap .card-inner .bloo-brutal-sheet{ box-shadow:4px 4px 0 #0a0a0a !important; }
body[data-layout="brutal"] .card-wrap .card-inner .modules-page .mod-icon{ box-shadow:2px 2px 0 #0a0a0a !important; }
body[data-tier][data-mode][data-btnshape][data-layout="brutal"] .card-wrap .card-inner .contact-actions .card-action-btn{ box-shadow:2px 2px 0 #0a0a0a !important; }
/* TACTILE : neumorphisme adouci (le relief EST l'identité) */
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon,
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame,
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary,
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ box-shadow:3px 3px 6px #cfd3db, -3px -3px 6px #ffffff !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon,
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame,
body[data-tier][data-mode="dark"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--primary,
body[data-tier][data-mode="dark"][data-btnshape][data-layout="tactile"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ box-shadow:3px 3px 6px #17181c, -3px -3px 6px #2f323a !important; }
/* organic : compaction pour tenir sur petits écrans (footer visible, pas de scroll) */
body[data-layout="organic"] .card-wrap .card-inner .card-identity{ padding-top:6px !important; padding-bottom:2px !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-section{ padding-top:2px !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-page{ gap:clamp(6px,1.3vh,12px) 8px !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-page .mod-icon{ width:clamp(42px,11vw,52px) !important; height:clamp(42px,11vw,52px) !important; }
body[data-layout="organic"] .card-wrap .card-inner .modules-page .mod-label{ margin-top:3px !important; font-size:11px !important; }
/* ============================================================
   TACTILE v2 — boutons à icône EMBOSSÉS (neumorphique en creux) + ombre réduite
   ============================================================ */
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ background:#e6e9ef !important; box-shadow:inset 3px 3px 5px #cfd3db, inset -3px -3px 5px #ffffff !important; border:none !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon i{ color:var(--card-accent) !important; text-shadow:1px 1px 1px rgba(255,255,255,.75) !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ background:#23252b !important; box-shadow:inset 3px 3px 5px #161719, inset -3px -3px 5px #30333b !important; border:none !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 80%,#fff) !important; text-shadow:1px 1px 1px rgba(0,0,0,.45) !important; }
/* avatar : relief bosse doux réduit */
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:4px 4px 8px #cfd3db, -4px -4px 8px #ffffff !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:4px 4px 8px #161719, -4px -4px 8px #30333b !important; }
/* GLOBAL — chips du hero (QR + langue) : plus d'air par rapport au bord (ne collent plus) */
body[data-layout] .card-wrap .h-badges-float,
body[data-layout] .card-wrap .card-inner > .h-badges-float{ top:14px !important; right:16px !important; gap:9px !important; align-items:center !important; }
/* ORGANIQUE — hero plus grand sur grand écran (desktop), petits écrans inchangés (fit garanti) */
@media (min-width:700px){
  body[data-layout="organic"] .card-wrap .card-header{ height:280px !important; }
  body[data-layout="organic"] .card-wrap .card-inner::before{ height:280px !important; }
  body[data-layout="organic"] .card-wrap .card-inner .card-avatar-wrap{ margin-top:-70px !important; }
}
/* ============================================================
   TACTILE — image illustrative : bandeau haut ÉLONGÉ + COURT, cadre neumorphique (bosse)
   + layout complet (avatar, nom, boutons embossés, 2 CTA, footer). Fit petits écrans garanti.
   ============================================================ */
body[data-layout="tactile"] .card-wrap .card-header{ display:block !important; height:clamp(92px,14vh,150px) !important; min-height:0 !important; margin:14px 16px 4px !important; border-radius:22px !important; overflow:hidden !important; }
body[data-mode="light"][data-layout="tactile"] .card-wrap .card-header{ box-shadow:5px 5px 12px #cfd3db, -5px -5px 12px #ffffff !important; }
body[data-mode="dark"][data-layout="tactile"] .card-wrap .card-header{ box-shadow:5px 5px 12px #161719, -5px -5px 12px #30333b !important; }
body[data-layout="tactile"] .card-wrap .card-header .card-header-img{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-layout="tactile"] .card-wrap .card-header .card-header-tint,
body[data-layout="tactile"] .card-wrap .card-header .card-header-gradient{ display:none !important; }
/* avatar après le bandeau, taille modérée */
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-wrap{ padding-top:18px !important; margin-top:0 !important; }
body[data-layout="tactile"] .card-wrap .card-inner .card-avatar-frame{ width:137px !important; height:137px !important; border-radius:50% !important; }
body[data-layout="tactile"] .card-wrap .card-inner .card-identity{ padding-top:6px !important; padding-bottom:2px !important; }
/* compaction grille tactile (fit) */
body[data-layout="tactile"] .card-wrap .card-inner .modules-section{ padding-top:2px !important; }
body[data-layout="tactile"] .card-wrap .card-inner .modules-page{ gap:clamp(6px,1.2vh,12px) 8px !important; }
body[data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-icon{ width:clamp(44px,11vw,52px) !important; height:clamp(44px,11vw,52px) !important; }
body[data-layout="tactile"] .card-wrap .card-inner .modules-page .mod-label{ margin-top:4px !important; font-size:11px !important; }
/* ============================================================
   GLOBAL — grille de boutons centrée verticalement dans l'espace dispo
   (distance égale entre l'identité au-dessus et les CTA en-dessous).
   Exclut les layouts à panneau (liquid/frost/brutal) qui ont leur propre flux.
   ============================================================ */
body[data-layout]:not([data-layout="liquid"]):not([data-layout="frost"]):not([data-layout="brutal"]) .card-wrap .card-inner .modules-section{ flex:1 1 auto !important; display:flex !important; flex-direction:column !important; justify-content:center !important; }
/* ============================================================
   TACTILE 2 — neumorphisme RELIEF INVERSÉ : boutons en BOSSE (extrudés/saillants).
   Même base que Tactile (surface, image illustrative, CTA, avatar) ; seul le relief des boutons s'inverse.
   ============================================================ */
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner{ background:#e6e9ef !important; }
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner .card-name{ color:#363b45 !important; }
body[data-layout="tactile2"] .card-wrap .card-inner .card-name{ text-shadow:none !important; }
/* boutons module en BOSSE (raised) */
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-icon{ background:linear-gradient(145deg,#f3f6fc,#d0d5df) !important; border:none !important; box-shadow:6px 6px 10px #b2b8c6, -6px -6px 10px #ffffff !important; }
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-icon i{ color:var(--card-accent) !important; text-shadow:-1px -1px 1px rgba(255,255,255,.7) !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-icon{ background:linear-gradient(145deg,#2a2d35,#191b20) !important; border:none !important; box-shadow:6px 6px 10px #0e0f11, -6px -6px 10px #353942 !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-icon i{ color:color-mix(in srgb,var(--card-accent) 80%,#fff) !important; }
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-label{ color:#4a4f5a !important; text-shadow:none !important; }
/* CTA neumorphiques (bosse) */
body[data-tier][data-mode][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn{ border:none !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; box-shadow:5px 5px 9px #b2b8c6, -5px -5px 9px #ffffff !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--primary .card-action-btn__label,
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--primary i{ color:var(--card-accent-ink,#fff) !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:linear-gradient(145deg,#f3f6fc,#d0d5df) !important; box-shadow:5px 5px 9px #b2b8c6, -5px -5px 9px #ffffff !important; }
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-tier][data-mode="light"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#4a4f5a !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost{ background:linear-gradient(145deg,#2a2d35,#191b20) !important; box-shadow:5px 5px 9px #0e0f11, -5px -5px 9px #353942 !important; }
body[data-tier][data-mode="dark"][data-btnshape][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--primary{ background:var(--card-accent) !important; box-shadow:5px 5px 9px #0e0f11, -5px -5px 9px #353942 !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost i,
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .contact-actions .card-action-btn--ghost .card-action-btn__label{ color:#eef0f4 !important; }
/* avatar néumorphique (bosse) 119px descendu */
body[data-layout="tactile2"] .card-wrap .card-inner::before{ display:none !important; }
body[data-layout="tactile2"] .card-wrap .card-inner .card-avatar-wrap{ display:flex !important; justify-content:center !important; align-items:center !important; padding-top:18px !important; margin-top:0 !important; }
body[data-layout="tactile2"] .card-wrap .card-inner .card-avatar-frame{ display:block !important; width:137px !important; height:137px !important; border-radius:50% !important; margin:0 auto !important; border:none !important; }
body[data-layout="tactile2"] .card-wrap .card-inner .card-avatar-frame img, body[data-layout="tactile2"] .card-wrap .card-inner .card-avatar{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:7px 7px 12px #b2b8c6, -7px -7px 12px #ffffff !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-inner .card-avatar-frame{ box-shadow:7px 7px 12px #0e0f11, -7px -7px 12px #353942 !important; }
/* image illustrative : bandeau haut néumorphique */
body[data-layout="tactile2"] .card-wrap .card-header{ display:block !important; height:clamp(92px,14vh,150px) !important; min-height:0 !important; margin:14px 16px 4px !important; border-radius:22px !important; overflow:hidden !important; }
body[data-mode="light"][data-layout="tactile2"] .card-wrap .card-header{ box-shadow:7px 7px 12px #b6bcc9, -7px -7px 12px #ffffff !important; }
body[data-mode="dark"][data-layout="tactile2"] .card-wrap .card-header{ box-shadow:7px 7px 12px #0e0f11, -7px -7px 12px #353942 !important; }
body[data-layout="tactile2"] .card-wrap .card-header .card-header-img{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-layout="tactile2"] .card-wrap .card-header .card-header-tint, body[data-layout="tactile2"] .card-wrap .card-header .card-header-gradient{ display:none !important; }
/* compaction */
body[data-layout="tactile2"] .card-wrap .card-inner .modules-page{ gap:clamp(11px,2vh,18px) 13px !important; }
body[data-layout="tactile2"] .card-wrap .card-inner .modules-page .mod-icon{ width:clamp(44px,11vw,52px) !important; height:clamp(44px,11vw,52px) !important; }
/* ============================================================
   AQUA v2 (18/09) — HERO photo arrondi (remis + plus haut) + avatar +35% chevauchant
   ============================================================ */
body[data-layout="aqua"] .card-wrap .card-header{ display:block !important; height:clamp(150px,24vh,210px) !important; min-height:0 !important; overflow:hidden !important; margin:0 !important; border-radius:0 0 30px 30px !important; }
body[data-layout="aqua"] .card-wrap .card-header .card-header-img{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-layout="aqua"] .card-wrap .card-header .card-header-tint, body[data-layout="aqua"] .card-wrap .card-header .card-header-gradient{ display:none !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-wrap{ display:flex !important; justify-content:center !important; align-items:flex-start !important; margin-top:-72px !important; padding-top:0 !important; position:relative !important; z-index:3 !important; }
body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-frame{ width:127px !important; height:127px !important; margin:0 auto !important; }
@media (min-width:700px){
  body[data-layout="aqua"] .card-wrap .card-header{ height:250px !important; }
  body[data-layout="aqua"] .card-wrap .card-inner .card-avatar-wrap{ margin-top:-84px !important; }
}
/* ============================================================
   PREMIUM v2 (18/09) — HERO card-header plus haut + avatar +35% chevauchant (gauche)
   ============================================================ */
body[data-layout="premium"] .card-wrap .card-header{ display:block !important; height:clamp(190px,26vh,240px) !important; min-height:0 !important; overflow:hidden !important; margin:0 !important; border-bottom:1px solid color-mix(in srgb,var(--card-accent) 34%, #d8cdb5) !important; }
body[data-layout="premium"] .card-wrap .card-header .card-header-img{ width:100% !important; height:100% !important; object-fit:cover !important; }
body[data-layout="premium"] .card-wrap .card-header .card-header-tint, body[data-layout="premium"] .card-wrap .card-header .card-header-gradient{ display:none !important; }
/* ============================================================
   BENTO v5 (18/09) — grille propre 4 col, tuiles egales, REGROUPEMENT par couleur
   de categorie (communication/rendez-vous/localisation/infos) + adjacence logique.
   ============================================================ */
body[data-tier][data-mode][data-btnshape][data-layout="bento"] .card-wrap .card-inner .modules-section{ display:flex !important; flex-direction:column !important; justify-content:center !important; min-height:0 !important; }
body[data-layout="bento"] .card-wrap .bento-mosaic{ display:grid !important; grid-template-columns:repeat(4,1fr) !important; grid-auto-rows:auto !important; gap:8px !important; padding:2px !important; align-content:center !important; }
body[data-layout="bento"] .card-wrap .bento-tile.b22, body[data-layout="bento"] .card-wrap .bento-tile.bw{ grid-column:span 1 !important; grid-row:span 1 !important; }
body[data-layout="bento"] .card-wrap .bento-tile{ position:relative !important; display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; text-align:center !important; gap:6px !important; border:none !important; border-radius:16px !important; padding:11px 6px !important; min-height:78px !important; overflow:hidden !important; background:color-mix(in srgb,var(--card-accent) 10%, #fff) !important; box-shadow:0 2px 5px rgba(20,20,40,.05) !important; }
body[data-layout="bento"] .card-wrap .bento-tile .mod-icon{ width:38px !important; height:38px !important; border-radius:11px !important; background:var(--card-accent) !important; display:flex !important; align-items:center !important; justify-content:center !important; box-shadow:none !important; margin:0 !important; flex:0 0 auto !important; }
body[data-layout="bento"] .card-wrap .bento-tile .mod-icon i{ color:#fff !important; font-size:16px !important; text-shadow:none !important; }
body[data-layout="bento"] .card-wrap .bento-tile .mod-label{ font-size:10px !important; font-weight:600 !important; color:#3a3d44 !important; text-align:center !important; line-height:1.12 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; max-width:100% !important; margin:0 !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="comm"]{ background:color-mix(in srgb,#3b82f6 14%, #fff) !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="comm"] .mod-icon{ background:#3b6fd6 !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="rdv"]{ background:color-mix(in srgb,#f59e0b 17%, #fff) !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="rdv"] .mod-icon{ background:#e08b0a !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="loc"]{ background:color-mix(in srgb,#10b981 15%, #fff) !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="loc"] .mod-icon{ background:#0e9f70 !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="infos"]{ background:color-mix(in srgb,#8b5cf6 14%, #fff) !important; }
body[data-layout="bento"] .card-wrap .bento-tile[data-cat="infos"] .mod-icon{ background:#7c5cf0 !important; }
body[data-layout="bento"] .card-wrap .bento-tile.mod-disabled{ opacity:.4 !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile{ background:color-mix(in srgb,var(--card-accent) 16%, #23252b) !important; box-shadow:0 2px 5px rgba(0,0,0,.26) !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile .mod-label{ color:#e7e9ee !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile[data-cat="comm"]{ background:color-mix(in srgb,#3b82f6 22%, #23252b) !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile[data-cat="rdv"]{ background:color-mix(in srgb,#f59e0b 22%, #23252b) !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile[data-cat="loc"]{ background:color-mix(in srgb,#10b981 22%, #23252b) !important; }
body[data-mode="dark"][data-layout="bento"] .card-wrap .bento-tile[data-cat="infos"]{ background:color-mix(in srgb,#8b5cf6 22%, #23252b) !important; }
/* ============================================================
   LIQUID & GLASS DOUX — responsive maximise petits ecrans (iPhone SE 375x667)
   Compacte le contenu du panneau pour que CTA + footer tiennent sans scroll.
   ============================================================ */
@media (max-height:700px){
  body[data-layout="liquid"] .card-wrap .card-identity,
  body[data-layout="frost"] .card-wrap .card-identity{ padding-top:22px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .card-name,
  body[data-layout="frost"] .card-wrap .card-inner .card-name{ font-size:25px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .card-title,
  body[data-layout="frost"] .card-wrap .card-inner .card-title{ font-size:12px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .card-company,
  body[data-layout="frost"] .card-wrap .card-inner .card-company{ font-size:11px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .modules-section,
  body[data-layout="frost"] .card-wrap .card-inner .modules-section{ padding-top:4px !important; padding-bottom:2px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .modules-page,
  body[data-layout="frost"] .card-wrap .card-inner .modules-page{ gap:6px 5px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon,
  body[data-layout="frost"] .card-wrap .card-inner .modules-page .mod-icon{ width:44px !important; height:44px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-icon i,
  body[data-layout="frost"] .card-wrap .card-inner .modules-page .mod-icon i{ font-size:18px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .modules-page .mod-label,
  body[data-layout="frost"] .card-wrap .card-inner .modules-page .mod-label{ font-size:9.5px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .contact-actions,
  body[data-layout="frost"] .card-wrap .card-inner .contact-actions{ padding-top:4px !important; padding-bottom:4px !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .card-action-btn,
  body[data-layout="frost"] .card-wrap .card-inner .card-action-btn{ padding-top:9px !important; padding-bottom:9px !important; }
}
@media (max-height:700px){
  body[data-layout="liquid"] .card-wrap .card-inner .bloo-fluid-panel{ margin-top:16vh !important; }
  body[data-layout="frost"] .card-wrap .card-inner .bloo-fluid-panel{ margin-top:18vh !important; }
  body[data-layout="liquid"] .card-wrap .card-inner .card-identity,
  body[data-layout="frost"] .card-wrap .card-inner .card-identity{ padding-top:16px !important; }
}