/**
 * Printable Industry — brand palette overrides for Archi
 * Primary accent: cyan #00CFE0 (replaces Archi gold #FAB702)
 * Secondary / eco: #62D26F
 * Surfaces: #1B1F22 / #2A3238 · Text: #F2F4F6
 * Orange from logo facets: tiny details only (not used as theme primary).
 */

:root {
  --pi-bg: #1B1F22;
  --pi-surface: #2A3238;
  --pi-surface-2: #232a30;
  --pi-border: #3a444c;
  --pi-accent: #00CFE0;
  --pi-accent-eco: #62D26F;
  --pi-text: #F2F4F6;
  --pi-muted: #9aa7ae;
  --pi-logo-orange: #FF6900;
  --pi-mail: #f0a06a;

  --pi-font-display: "Sora", system-ui, sans-serif;
  --pi-font-body: "Source Sans 3", system-ui, sans-serif;
  /* Échelle = Dashboard /pi-control/ (référence globale site) */
  --pi-text-xs: 0.7rem;      /* boutons / code */
  --pi-text-sm: 0.8125rem;  /* inputs / nav */
  --pi-text-base: 0.875rem; /* corps */
  --pi-text-md: 1.05rem;
  --pi-text-lg: 1.15rem;
  --pi-text-xl: 1.25rem;    /* h1 */
  --pi-on-accent: #1B1F22;
  --pi-leading: 1.45;
  --pi-leading-tight: 1.3;
  --pi-radius-btn: 4px;
  --pi-radius-card: 10px;
  --pi-pad-btn: 3px 8px;
  --pi-pad-card: 14px;
  --pi-pad-input: 6px 8px;

  --archi-color-primary: #00CFE0;
}

/* ---- Typography (échelle intermédiaire, anti “gros titre IA”) ---- */
html {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body,
.site-content,
#wrapper,
#content,
p,
li,
td,
input,
textarea,
select,
button,
.btn,
.widget,
.pi-portal {
  font-family: var(--pi-font-body) !important;
  font-size: var(--pi-text-base);
  line-height: var(--pi-leading);
  font-weight: 400;
  letter-spacing: 0.01em;
}

h1, h2, h3, h4, h5, h6,
.page-title,
.blog-read,
#primary-menu,
#mainmenu,
.mainmenu,
.pi-brand,
.pi-site-footer h3 {
  font-family: var(--pi-font-display) !important;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: var(--pi-leading-tight);
}

h1, .page-title, .pi-portal h1 {
  font-size: var(--pi-text-xl) !important; /* 24px */
  font-weight: 600;
  margin: 0 0 0.6em;
}

h2, .pi-portal h2 {
  font-size: var(--pi-text-lg) !important; /* 20px */
  font-weight: 500;
  margin: 0 0 0.55em;
}

h3 {
  font-size: var(--pi-text-md) !important; /* 17px */
  font-weight: 500;
}

h4, h5, h6 {
  font-size: var(--pi-text-base) !important;
  font-weight: 500;
}

p {
  font-size: var(--pi-text-base);
  margin: 0 0 0.85em;
  max-width: 42rem;
}

small, .pi-muted, .pi-footer-tag {
  font-size: var(--pi-text-sm);
}

/* Nav — taille modérée */
#primary-menu > li > a,
#mainmenu > li > a,
.mainmenu > li > a,
.mobile_mainmenu a {
  font-family: var(--pi-font-display) !important;
  font-size: var(--pi-text-sm) !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase;
}

/* Archi souvent force des titres énormes — on recadre */
.big-title,
.ultra-big,
.title-huge,
.de_tab h1,
.hero h1,
.banner h1,
.page-heading h1 {
  font-size: var(--pi-text-xl) !important;
  line-height: var(--pi-leading-tight) !important;
}

/* ---- Base surfaces & text ---- */
html,
body,
.site-content,
#wrapper,
#content,
.de-navbar-left #content.content-side,
.de-navbar-left .maincontent {
  background-color: var(--pi-bg) !important;
  color: var(--pi-text);
}

body,
p,
.site-content,
.text-light,
.text-white,
h1, h2, h3, h4, h5, h6,
.page-title,
.blog-read,
.de_tab .de_nav li span {
  color: var(--pi-text);
}

a {
  color: var(--pi-accent);
}
a:hover,
a:focus,
a:active {
  color: var(--pi-accent-eco);
}

/* ---- Focus rings ---- */
:focus-visible {
  outline: 2px solid var(--pi-accent) !important;
  outline-offset: 2px;
}
a:focus,
button:focus,
.btn:focus,
input:focus,
textarea:focus,
select:focus {
  outline-color: var(--pi-accent);
  box-shadow: 0 0 0 2px rgba(0, 207, 224, 0.35);
}

/* ---- Buttons / CTAs — texte foncé sur fond cyan (contraste) ---- */
.btn-primary,
.btn-bg,
a.btn-primary,
a.btn-bg,
.btn-line:hover,
a.btn-line:hover,
input[type="submit"],
button[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.pi-btn,
a.pi-btn,
button.pi-btn,
.pi-portal .pi-btn,
.pi-portal a.pi-btn,
.pi-portal button.pi-btn {
  background-color: var(--pi-accent) !important;
  border-color: var(--pi-accent) !important;
  color: var(--pi-on-accent, #1B1F22) !important;
  font-family: var(--pi-font-display) !important;
  font-size: var(--pi-text-xs) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  padding: var(--pi-pad-btn) !important;
  border-radius: var(--pi-radius-btn) !important;
}

.btn-primary:hover,
.btn-bg:hover,
a.btn-primary:hover,
a.btn-bg:hover,
input[type="submit"]:hover,
button[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.pi-btn:hover,
a.pi-btn:hover,
button.pi-btn:hover {
  background-color: var(--pi-accent-eco) !important;
  border-color: var(--pi-accent-eco) !important;
  color: var(--pi-on-accent, #1B1F22) !important;
}

/* Secondaire : contour cyan, texte cyan (pas de fond bleu plein) */
.pi-btn-secondary,
a.pi-btn-secondary,
button.pi-btn-secondary,
.pi-portal .pi-btn-secondary {
  background-color: transparent !important;
  border: 1px solid var(--pi-accent) !important;
  color: var(--pi-accent) !important;
}

.pi-btn-secondary:hover,
a.pi-btn-secondary:hover {
  background-color: rgba(0, 207, 224, 0.12) !important;
  color: var(--pi-accent) !important;
}

/* Profile hub primary CTA — logo orange (download area, license PDF) */
.pi-portal .pi-btn.pi-btn-accent,
.pi-profile-hub .pi-btn.pi-btn-accent,
a.pi-btn.pi-btn-accent {
  background-color: var(--pi-logo-orange, #ff6900) !important;
  border-color: var(--pi-logo-orange, #ff6900) !important;
  color: #1b1f22 !important;
}

.pi-portal .pi-btn.pi-btn-accent:hover,
.pi-profile-hub .pi-btn.pi-btn-accent:hover,
a.pi-btn.pi-btn-accent:hover {
  background-color: #ff8533 !important;
  border-color: #ff8533 !important;
  color: #1b1f22 !important;
}

/* Secondary / eco CTA */
.btn-secondary,
a.btn-secondary,
.btn-eco,
a.btn-eco,
.pi-cta-eco {
  background-color: var(--pi-accent-eco) !important;
  border-color: var(--pi-accent-eco) !important;
  color: var(--pi-bg) !important;
}

.btn-line,
a.btn-line {
  border-color: var(--pi-accent) !important;
  color: var(--pi-accent) !important;
}

/* ---- Navigation / menu active ---- */
#mainmenu a.active,
#mainmenu li.active > a,
#mainmenu li:hover > a,
.menu-item.current-menu-item > a,
.menu-item.current-menu-ancestor > a,
header .mainmenu a:hover,
.de-menu-profile,
#mainmenu li li a:hover {
  color: var(--pi-accent) !important;
}

#mainmenu li li a:hover,
#mainmenu li li.current-menu-item > a {
  background-color: var(--pi-surface) !important;
}

/* Header — backer session row (below HOME / PROFILE) */
#mainmenu,
.mobile_mainmenu,
#primary-menu {
  flex-wrap: wrap;
  align-items: center;
}

#mainmenu > li.pi-menu-session,
.mobile_mainmenu > li.pi-menu-session,
#primary-menu > li.pi-menu-session {
  flex: 0 0 100%;
  width: 100%;
  margin: 8px 0 0;
  padding: 8px 0 0;
  border-top: 1px solid var(--pi-border);
  list-style: none;
}

.pi-header-session {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  font-family: var(--pi-font-body) !important;
  font-size: var(--pi-text-sm) !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: var(--pi-muted);
  line-height: 1.4;
}

.pi-header-session__dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--pi-accent-eco);
  box-shadow: 0 0 10px rgba(98, 210, 111, 0.55);
}

.pi-header-session__label {
  color: var(--pi-muted);
}

.pi-header-session__name {
  color: var(--pi-text) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.pi-header-session__name:hover {
  color: var(--pi-accent) !important;
}

.pi-header-session__sep {
  color: var(--pi-border);
}

.pi-header-session__out {
  color: var(--pi-accent) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: none !important;
}

.pi-header-session__out:hover {
  color: var(--pi-accent-eco) !important;
}

#mainmenu > li.pi-menu-profile-signed-in > a::after,
.mobile_mainmenu > li.pi-menu-profile-signed-in > a::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 6px;
  border-radius: 50%;
  background: var(--pi-accent-eco);
  vertical-align: middle;
  box-shadow: 0 0 8px rgba(98, 210, 111, 0.5);
}

/* ---- Section accents / dividers / icons ---- */
.id-color,
.color,
span.id-color,
i.id-color,
.text-primary,
.de_count .timer,
.icon_box i,
.feature-box i,
.wm-icon,
.tiny-border,
.separator span,
.de-separator span,
blockquote::before,
.owl-theme .owl-controls .owl-page.active span,
.owl-dot.active span {
  color: var(--pi-accent) !important;
}

.tiny-border,
.separator,
.de-separator,
.hr-line,
.border-bottom-primary {
  border-color: var(--pi-accent) !important;
  background-color: var(--pi-accent);
}

/* ---- Surfaces / cards / header / footer ---- */
header,
header.transparent,
header.header-light,
footer,
#subheader,
.box-border,
.feature-box,
.de_tab.tab_steps .de_nav li span,
.pricing-table,
.blog-list .post-content,
.container-fluid.bg-grey {
  background-color: var(--pi-surface);
}

#subheader,
.page-header,
.de-page-title {
  background-color: var(--pi-bg);
  color: var(--pi-text);
}

/* ---- Sticky / fixed black top header bar ----
 * Archi theme_mod `header_fixed` is already on (class .header-fixed).
 * Parent CSS only fixes desktop; under 991px it resets to position:relative.
 * Keep bar sticky on desktop + mobile with opaque brand background.
 */
#site-header.site-header,
#site-header.site-header.header-fixed,
#site-header.site-header.header-autoshow {
  position: sticky !important;
  top: 0 !important;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 9999;
  background-color: rgba(27, 31, 34, 0.92) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

#site-header.site-header.is-stuck,
#site-header.site-header.header-fixed.is-stuck {
  background-color: #1B1F22 !important;
}

/* WP admin bar offsets */
.admin-bar #site-header.site-header,
.admin-bar #site-header.site-header.header-fixed {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  .admin-bar #site-header.site-header,
  .admin-bar #site-header.site-header.header-fixed {
    top: 46px !important;
  }
}

/* Override Archi mobile reset (position: relative under 991px) */
@media only screen and (max-width: 991px) {
  #site-header.site-header,
  #site-header.site-header.header-fixed,
  #site-header.site-header.header-autoshow {
    position: sticky !important;
    top: 0 !important;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9999;
    background-color: rgba(27, 31, 34, 0.95) !important;
  }

  .admin-bar #site-header.site-header,
  .admin-bar #site-header.site-header.header-fixed {
    top: 46px !important;
  }

  /* Keep open mobile nav readable above page content */
  #site-header .header-mobile.open .mmenu_wrapper,
  #site-header .header-mobile .mobile_nav {
    background-color: #1B1F22;
  }
}

/* ---- Forms ---- */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
textarea,
select,
.wpcf7-form-control {
  background-color: var(--pi-surface) !important;
  border-color: #3a444c !important;
  color: var(--pi-text) !important;
}

/* ---- Slider / Revolution / overlays accents ---- */
.rs-layer .id-color,
.tp-caption .id-color,
.rev-btn,
.uranus.tparrows,
.hesperiden .tp-bullet.selected,
.tp-bullet.selected,
.tparrows:hover {
  color: var(--pi-accent) !important;
  border-color: var(--pi-accent) !important;
}

.tp-bullet.selected,
.tp-tab.selected,
.tp-thumb.selected {
  background-color: var(--pi-accent) !important;
  border-color: var(--pi-accent) !important;
}

/* Preloader bar */
#jpreBar,
#jprePercentage {
  background: var(--pi-accent) !important;
  color: var(--pi-accent) !important;
}

/* ---- Hard override residual Archi gold ---- */
[style*="#fab702"],
[style*="#FAB702"],
[style*="#Fab702"] {
  /* Elementor/inline leftovers: push toward brand cyan when gold was used as accent text */
  color: var(--pi-accent) !important;
}

/* ---- Header logo sizing ---- */
#site-logo,
#site-logo a,
.site-logo,
.mobile_logo,
.mlogo_wrapper .mobile_logo {
  line-height: 0;
}

#site-logo img,
.site-logo img,
.logo img,
#logo img,
.mobile_logo img,
.custom-logo-link img,
.custom-logo {
  max-height: 52px;
  width: auto !important;
  height: auto !important;
  max-width: 220px;
  object-fit: contain;
  display: inline-block;
  vertical-align: middle;
}

/* Slogan next to logo wordmark — pastel eco green, desktop/tablet only.
   Archi renders #site-logo > a > img (not WP custom-logo-link). */
#site-logo.site-logo,
.octf-col.logo-col #site-logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  max-width: 100%;
  line-height: 0;
}
#site-logo.site-logo::after {
  content: "PRINT BETTER | WASTE LESS";
  flex: 0 0 auto;
  color: var(--pi-accent-eco, #62d26f);
  font-family: var(--pi-font-display, Sora, system-ui, sans-serif);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.15;
  text-transform: uppercase;
  white-space: nowrap;
  user-select: none;
  pointer-events: none;
}

/* Fallback when WP custom logo markup is used */
.pi-header-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  max-width: 100%;
  vertical-align: middle;
  line-height: 0;
}
.pi-header-brand .custom-logo-link {
  flex: 0 0 auto;
  line-height: 0;
}
.pi-header-slogan {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  color: var(--pi-accent-eco, #62d26f);
  font-family: var(--pi-font-display, Sora, system-ui, sans-serif);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  line-height: 1.15;
  text-transform: uppercase;
  white-space: nowrap;
  user-select: none;
  pointer-events: none;
}

@media only screen and (max-width: 991px) {
  /* Keep header compact: hide slogan before nav / language switcher collide */
  #site-logo.site-logo::after,
  .pi-header-slogan {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  #site-logo img,
  .site-logo img,
  .mobile_logo img,
  .custom-logo {
    max-height: 44px;
    max-width: 180px;
  }
}

/* ---- Hide demo sidebar completely ---- */
#primary-sidebar,
aside.primary-sidebar,
.widget-area.primary-sidebar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Full-width main content (fix Archi col-8 + sidebar col-4 deformation) */
#content .maincontent,
#content .content-area,
.site-main,
.maincontent.col-lg-8,
.maincontent.col-md-8,
.content-area.col-lg-8,
.content-area.col-md-8,
.blog-page .col-md-8,
.page .col-md-8 {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
}

#content .row,
.site-content .row {
  display: block;
}

/* ============================================================
   CSS RÉFÉRENCE GLOBALE = Dashboard /pi-control/
   Tailles police / blocs / boutons — une seule source site entier.
   ============================================================ */

.page .page-content,
.page .entry-content,
.single-page,
#content {
  max-width: none;
}

/* Bloc portail — mêmes densités que PI Control */
.pi-portal {
  max-width: 860px !important;
  margin: 0 auto;
  padding: 18px 20px !important;
  color: var(--pi-text, #F2F4F6) !important;
  font-family: var(--pi-font-body) !important;
  font-size: var(--pi-text-base) !important; /* 0.875rem */
  line-height: var(--pi-leading);
}

.pi-portal h1,
.pi-portal h2,
.pi-portal h3 {
  font-family: var(--pi-font-display) !important;
  color: var(--pi-text, #F2F4F6) !important;
  margin: 0 0 12px;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: var(--pi-leading-tight);
}

.pi-portal h1 { font-size: var(--pi-text-xl) !important; } /* 1.25rem */
.pi-portal h2 { font-size: var(--pi-text-xl) !important; font-weight: 600; }
.pi-portal h3 { font-size: 1.05rem !important; margin: 0 0 10px; }

.pi-brand {
  font-family: var(--pi-font-display) !important;
  color: var(--pi-accent, #00CFE0) !important;
  letter-spacing: 0.08em;
  font-size: 0.75rem !important;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 0.35em;
}

.pi-card {
  background: var(--pi-surface, #2A3238) !important;
  border: 1px solid var(--pi-border, #3a444c) !important;
  border-radius: var(--pi-radius-card, 10px) !important;
  padding: var(--pi-pad-card, 14px) !important;
  margin-bottom: 14px;
}

.pi-lic-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.pi-badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: var(--pi-text-xs);
  font-weight: 600;
}
.pi-badge-active { background: #62D26F; color: #1B1F22; }
.pi-badge-pending { background: #00CFE0; color: #1B1F22; }
.pi-badge-suspended,
.pi-badge-expired { background: #8a6d1a; color: #F2F4F6; }
.pi-badge-revoked { background: #b03030; color: #F2F4F6; }

.pi-lic-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin: 12px 0;
  font-size: var(--pi-text-sm);
}
.pi-lic-meta code {
  background: #1B1F22;
  padding: 2px 6px;
  border-radius: 4px;
  color: #00CFE0;
  font-size: var(--pi-text-xs);
}

.pi-commercial-note {
  border-left: 3px solid #00CFE0;
  background: #1B1F22;
  padding: 8px 12px;
  margin: 12px 0;
  font-size: var(--pi-text-sm);
  line-height: 1.45;
}

.pi-assets { margin-top: 8px; }
.pi-asset {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid #3a444c;
}

.pi-dl-intro {
  line-height: 1.45;
  margin-bottom: 14px;
}
.pi-dl-intro p { margin: 0 0 0.7em; max-width: none; }

.pi-actions { margin-top: 12px; }
.pi-bad { color: #e74c3c; font-weight: 700; }

/* Download area actions row */
.pi-dl-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid var(--pi-border, #3a444c);
  align-items: center;
}

/* Quota-blocked download button — still visible, opens quota panel */
.pi-dl-btn--blocked {
  opacity: 0.55;
}
.pi-dl-btn--blocked:hover {
  opacity: 0.8;
}

/* Notice banner */
.pi-notice {
  padding: 10px 14px;
  border-radius: 6px;
  margin: 12px 0;
  font-size: 0.9em;
  line-height: 1.4;
}
.pi-notice--warn {
  background: rgba(231, 76, 60, 0.12);
  border-left: 3px solid #e74c3c;
  color: #f8d7da;
}

/* Ghost button variant (sign out, secondary actions) */
.pi-btn-ghost {
  background: transparent;
  border: 1px solid var(--pi-border, #3a444c);
  color: var(--pi-muted, #aaa);
  padding: 7px 14px;
  border-radius: 6px;
  font-size: 0.85em;
  cursor: pointer;
  text-decoration: none;
}
.pi-btn-ghost:hover { border-color: #ccc; color: #fff; }

.pi-quota-panel {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--pi-border, #3a444c);
}
.pi-quota-form {
  display: grid;
  gap: 8px;
  max-width: 520px;
}

/* Boutons — densités Dashboard /pi-control/ */
.pi-btn,
a.pi-btn,
button.pi-btn,
.pi-portal .pi-btn,
.pi-portal a.pi-btn,
.pi-portal button.pi-btn {
  background: #00CFE0 !important;
  color: #1B1F22 !important;
  border: 0 !important;
  border-radius: var(--pi-radius-btn, 4px) !important;
  padding: var(--pi-pad-btn, 3px 8px) !important;
  font-family: var(--pi-font-display) !important;
  font-size: var(--pi-text-xs, 0.7rem) !important;
  font-weight: 700 !important;
  cursor: pointer;
  text-decoration: none !important;
  display: inline-block;
  white-space: nowrap;
  margin: 1px;
  line-height: 1.3 !important;
}

.pi-btn:hover,
a.pi-btn:hover,
button.pi-btn:hover {
  background: #62D26F !important;
  color: #1B1F22 !important;
}

.pi-btn:disabled,
.pi-btn.pi-disabled {
  opacity: 0.6;
  cursor: wait;
}

.pi-btn-secondary,
a.pi-btn-secondary,
button.pi-btn-secondary {
  background: transparent !important;
  color: #00CFE0 !important;
  border: 1px solid #00CFE0 !important;
}

.pi-btn-secondary:hover,
a.pi-btn-secondary:hover {
  background: rgba(0, 207, 224, 0.12) !important;
  color: #00CFE0 !important;
}

.pi-muted { color: #9aa7ae !important; }
.pi-small { font-size: var(--pi-text-sm); }
.pi-error { border-color: #b03030; }
.pi-loading { text-align: center; padding: 24px; color: #9aa7ae; }
.pi-portal a:not(.pi-btn) { color: #00CFE0; }
.pi-portal code { color: #00CFE0; font-size: var(--pi-text-xs); }

/* Verify licence form */
.pi-verify-form {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.pi-verify-input {
  flex: 1;
  min-width: 220px;
  padding: var(--pi-pad-input, 6px 8px);
  border-radius: 6px;
  border: 1px solid var(--pi-border, #3a444c);
  background: var(--pi-bg, #1B1F22);
  color: var(--pi-text, #F2F4F6);
  font-family: var(--pi-font-body);
  font-size: var(--pi-text-sm);
}
.pi-verify-result { margin-top: 12px; }
.pi-ok, .pi-success { color: var(--pi-accent-eco, #62D26F); }

/* Formulaires auth / contact / license / quota */
.pi-portal label {
  display: block;
  margin: 8px 0;
  font-size: var(--pi-text-sm);
  color: #c5c8ce;
}
.pi-portal input,
.pi-portal textarea,
.pi-portal select {
  width: 100%;
  box-sizing: border-box;
  margin-top: 4px;
  padding: var(--pi-pad-input, 6px 8px);
  border-radius: 6px;
  border: 1px solid #3a444c;
  background: #1B1F22;
  color: #F2F4F6;
  font-family: var(--pi-font-body);
  font-size: var(--pi-text-sm);
}
.pi-portal input:focus,
.pi-portal textarea:focus,
.pi-portal select:focus {
  border-color: #00CFE0;
  outline: none;
}
.pi-check {
  display: flex !important;
  align-items: flex-start;
  gap: 8px;
}
.pi-check input { width: auto; margin-top: 3px; }
.pi-wiz-step { display: none; }
.pi-wiz-step.active { display: block; }

/* ---- Site footer ---- */
/* Hide Archi Elementor demo footer (Los Angeles / contact@archi.com) — PI footer is #pi-site-footer */
.site-footer .elementor-766,
footer.site-footer:has(.elementor-766) {
  display: none !important;
}

.pi-site-footer {
  background: #14181b;
  border-top: 1px solid #3a444c;
  color: #F2F4F6;
  padding: 40px 20px 28px;
  margin-top: 48px;
  font-family: var(--pi-font-body);
}
.pi-footer-inner {
  max-width: 920px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 28px 40px;
}
@media (max-width: 720px) {
  .pi-footer-inner { grid-template-columns: 1fr; }
}
.pi-site-footer h3 {
  color: #00CFE0;
  margin: 0 0 10px;
  font-size: 0.875rem !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
}
.pi-site-footer p {
  color: #9aa7ae;
  line-height: 1.55;
  margin: 0 0 10px;
  font-size: 15px;
  max-width: none;
}
.pi-site-footer a { color: #00CFE0; font-size: 15px; }
a[href^="mailto:"],
.pi-site-footer a[href^="mailto:"],
.pi-footer-mail a { color: var(--pi-mail, #f0a06a) !important; }
.pi-footer-tag {
  color: #62D26F !important;
  font-family: var(--pi-font-display) !important;
  font-weight: 600;
  letter-spacing: 0.08em;
  font-size: 12px !important;
  text-transform: uppercase;
}
.pi-footer-mail { margin-top: 12px !important; }

/* ---- Footer social icons ---- */
.pi-social-icons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}
.pi-social-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid #3a444c;
  border-radius: 8px;
  color: #F2F4F6 !important;
  background: #1B1F22;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.pi-social-icon:hover,
.pi-social-icon:focus-visible {
  color: #1B1F22 !important;
  background: #00CFE0;
  border-color: #00CFE0;
  outline: none;
}
.pi-social-icon svg {
  display: block;
  width: 20px;
  height: 20px;
}
.pi-social-icon.pi-social-kickstarter {
  padding: 0 !important;
  overflow: hidden !important;
  border-color: #05ce78 !important;
  background: #05ce78 !important;
  border-radius: 8px !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black); /* Safari overflow:hidden fix */
}
.pi-social-icon.pi-social-kickstarter:hover,
.pi-social-icon.pi-social-kickstarter:focus-visible {
  border-color: #00CFE0 !important;
  box-shadow: 0 0 0 2px #00CFE0 !important;
}
.pi-social-icon.pi-social-kickstarter img {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

/* License gate modal (download area) */
.pi-lic-gate-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: rgba(0, 0, 0, 0.72);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.pi-lic-gate-overlay[hidden] { display: none !important; }
.pi-lic-gate-dialog {
  width: min(920px, 100%);
  max-height: 92vh;
  background: var(--pi-surface, #2a3238);
  border: 1px solid var(--pi-border, #3a444c);
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
}
.pi-lic-gate-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--pi-border, #3a444c);
}
.pi-lic-gate-header h2 { margin: 0; font-size: 1.1rem; color: var(--pi-accent, #00cfe0); }
.pi-lic-gate-close {
  background: transparent;
  border: none;
  color: var(--pi-muted, #9aa7ae);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}
.pi-lic-gate-doc {
  flex: 1;
  overflow: auto;
  padding: 12px 16px;
  background: #1b1f22;
}
.pi-lic-gate-scroll { max-width: none; }
.pi-lic-gate-footer {
  padding: 14px 18px 18px;
  border-top: 1px solid var(--pi-border, #3a444c);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pi-lic-gate-check { margin: 0; }
.pi-lic-gate-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.9rem; }
.pi-lic-gate-field input { padding: 8px 10px; border-radius: 6px; border: 1px solid var(--pi-border, #3a444c); background: #1b1f22; color: inherit; }
.pi-lic-gate-otp { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }