/* ==========================================================
   Hébergement Québec — harmonisation avec Alice Media
   ========================================================== */

:root {
  --alice-navy: #06264f;
  --alice-navy-dark: #031d3d;
  --alice-navy-deep: #02162f;
  --alice-green: #57ad4d;
  --alice-green-dark: #3f9238;
  --alice-green-soft: #eef8ec;

  --hq-blue: #0876d9;
  --hq-blue-dark: #0564bb;
  --hq-blue-soft: #eef6fd;

  --brand-text: #28384b;
  --brand-muted: #69798b;
  --brand-border: #dce4ec;
  --brand-bg: #ffffff;
  --brand-bg-soft: #f7f9fb;

  --brand-radius-sm: 7px;
  --brand-radius: 14px;
  --brand-radius-lg: 18px;
  --brand-shadow: 0 22px 60px rgba(5, 35, 72, 0.10);
  --brand-shadow-sm: 0 12px 30px rgba(5, 35, 72, 0.08);
  --brand-transition: 220ms ease;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  color:var(--brand-text);
  background:var(--brand-bg);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
button,input,textarea,select{font-family:inherit}
a{
  color:var(--alice-navy);
  text-decoration:none;
  transition:color var(--brand-transition),background-color var(--brand-transition),border-color var(--brand-transition),opacity var(--brand-transition),transform var(--brand-transition)
}
a:hover{color:var(--alice-green-dark)}

/* Boutons */
.btn-primary,.btn-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  border-radius:var(--brand-radius-sm);
  font-weight:700;
  letter-spacing:-.01em;
  cursor:pointer;
  transition:transform var(--brand-transition),background-color var(--brand-transition),border-color var(--brand-transition),box-shadow var(--brand-transition)
}
.btn-primary{
  padding:14px 28px;
  color:#fff;
  background:var(--hq-blue);
  border:1px solid var(--hq-blue);
  font-size:17px;
  box-shadow:0 10px 24px rgba(8,118,217,.18)
}
.btn-primary:hover{color:#fff;background:var(--hq-blue-dark);border-color:var(--hq-blue-dark);transform:translateY(-1px)}
.btn-secondary{
  padding:13px 26px;
  color:var(--alice-navy);
  background:#fff;
  border:1px solid #90a1b5;
  font-size:16px
}
.btn-secondary:hover{color:#fff;background:var(--alice-navy);border-color:var(--alice-navy)}

/* Header */
.site-header{
  position:sticky;
  top:0;
  z-index:60;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(15px);
  border-bottom:1px solid rgba(6,38,79,.10);
  box-shadow:0 8px 30px rgba(5,35,72,.04)
}
.site-header .inner{
  width:min(100% - 32px,1280px);
  max-width:1280px;
  min-height:76px;
  margin:0 auto;
  padding:10px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px
}
.logo{color:var(--alice-navy);font-weight:800;font-size:19px;letter-spacing:-.01em}
.logo span{color:var(--hq-blue)}
.logo small{display:block;margin-top:2px;color:var(--alice-green-dark);font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.top-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.top-nav a{position:relative;padding:10px 12px;border-radius:var(--brand-radius-sm);color:var(--alice-navy);font-size:14px;font-weight:650}
.top-nav a:not(.pill)::after{content:"";position:absolute;left:12px;right:12px;bottom:5px;height:2px;background:var(--alice-green);transform:scaleX(0);transform-origin:left;transition:transform var(--brand-transition)}
.top-nav a:not(.pill):hover::after{transform:scaleX(1)}
.top-nav .pill{color:#fff;background:var(--alice-navy);font-weight:700}
.top-nav .pill:hover{color:#fff;background:var(--alice-navy-dark)}

/* Hero */
.hero{
  position:relative;
  overflow:hidden;
  padding:64px 24px 68px;
  color:#fff;
  text-align:center;
  background:radial-gradient(circle at 70% 30%,rgba(8,118,217,.30),transparent 36%),linear-gradient(120deg,var(--alice-navy-deep) 0%,var(--alice-navy) 52%,var(--hq-blue) 100%)
}
.hero::after{content:"";position:absolute;width:520px;height:520px;right:-180px;bottom:-260px;border-radius:50%;background:rgba(255,255,255,.05);pointer-events:none}
.hero h1{position:relative;z-index:1;max-width:900px;margin:0 auto 16px;font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.12;letter-spacing:-.045em}
.hero h1 span{color:#8bc9ff}
.hero p.sub{position:relative;z-index:1;max-width:760px;margin:0 auto 28px;color:rgba(255,255,255,.86);font-size:clamp(1rem,2.5vw,1.22rem)}
.badges{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:32px}
.badge{padding:7px 14px;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);border-radius:99px;font-size:13px;font-weight:650;backdrop-filter:blur(8px)}
.badge::before{margin-right:6px}
.urgence{position:relative;z-index:1;margin-top:14px;color:rgba(255,255,255,.68);font-size:13px;font-style:italic}

/* Forfaits */
.forfaits{padding:84px 24px;background:var(--brand-bg-soft);text-align:center}
.forfaits h2,.reassurance h2,.proof h2,.faq h2{color:var(--alice-navy);font-weight:760;letter-spacing:-.035em}
.forfaits h2{margin-bottom:8px;font-size:clamp(1.8rem,4vw,2.35rem)}
.forfaits .sub2{margin-bottom:42px;color:var(--brand-muted);font-size:16px}
.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;width:min(100%,1080px);margin:0 auto}
.card{position:relative;width:290px;padding:32px 28px;text-align:left;background:#fff;border:1px solid var(--brand-border);border-radius:var(--brand-radius-lg);box-shadow:var(--brand-shadow-sm);transition:transform var(--brand-transition),box-shadow var(--brand-transition),border-color var(--brand-transition)}
.card:hover{transform:translateY(-5px);border-color:#cdd9e5;box-shadow:var(--brand-shadow)}
.card.recommande{border:2px solid var(--hq-blue);transform:translateY(-4px)}
.card.recommande:hover{transform:translateY(-8px)}
.badge-rec{position:absolute;top:-14px;left:50%;transform:translateX(-50%);padding:5px 14px;color:#fff;background:var(--hq-blue);border-radius:99px;box-shadow:0 8px 20px rgba(8,118,217,.22);font-size:11px;font-weight:800;white-space:nowrap}
.card .nom{margin-bottom:5px;color:var(--hq-blue);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.card .desc{margin-bottom:18px;color:var(--brand-muted);font-size:14px}
.card .prix{color:var(--alice-navy);font-size:36px;font-weight:800;letter-spacing:-.045em}
.card .prix span{color:var(--brand-muted);font-size:14px;font-weight:400;letter-spacing:0}
.card ul{margin:18px 0 24px;padding:0;list-style:none}
.card ul li{padding:7px 0;color:var(--brand-text);border-bottom:1px solid #edf1f5;font-size:14px}
.card ul li::before{content:"✓ ";color:var(--alice-green-dark);font-weight:800}
.card .btn-primary,.card .btn-secondary{width:100%;text-align:center;font-size:15px}
.card .btn-primary{padding:12px}
.card .btn-secondary{margin-top:8px;padding:11px}

/* Réassurance */
.reassurance{width:min(100% - 32px,980px);margin:0 auto;padding:76px 0;background:#fff;text-align:center}
.reassurance h2{margin-bottom:30px;font-size:1.55rem}
.re-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}
.re-item{width:210px;padding:18px;text-align:center}
.re-item .icon{margin-bottom:10px;font-size:32px}
.re-item strong{display:block;margin-bottom:5px;color:var(--alice-navy);font-size:14px}
.re-item span{color:var(--brand-muted);font-size:13px}

/* Preuve sociale */
.proof{padding:72px 24px;background:var(--brand-bg-soft);text-align:center;border-top:1px solid #edf1f5;border-bottom:1px solid #edf1f5}
.proof h2{margin-bottom:34px;font-size:1.55rem}
.stats{display:flex;flex-wrap:wrap;justify-content:center;gap:44px;margin-bottom:42px}
.stat strong{display:block;color:var(--hq-blue);font-size:40px;font-weight:800;line-height:1;letter-spacing:-.05em}
.stat span{color:var(--brand-muted);font-size:14px}
.testimonials{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;width:min(100%,960px);margin:0 auto}
.testi{width:280px;padding:24px;text-align:left;background:#fff;border:1px solid var(--brand-border);border-radius:var(--brand-radius);box-shadow:0 1px 0 rgba(5,35,72,.02)}
.testi p{margin-bottom:12px;color:var(--brand-text);font-size:14px;font-style:italic}
.testi .auteur{color:var(--alice-navy);font-size:13px;font-weight:700}
.testi .auteur span{color:var(--brand-muted);font-weight:400}
.adresse{margin-top:34px;color:var(--brand-muted);font-size:14px}
.adresse strong{color:var(--alice-navy)}

/* FAQ */
.faq{width:min(100% - 32px,760px);margin:0 auto;padding:72px 0}
.faq h2{margin-bottom:30px;text-align:center;font-size:1.55rem}
details{margin-bottom:10px;padding:16px 20px;background:#fff;border:1px solid var(--brand-border);border-radius:12px;transition:border-color var(--brand-transition),box-shadow var(--brand-transition)}
details[open]{border-color:#c8d6e4;box-shadow:var(--brand-shadow-sm)}
details summary{color:var(--alice-navy);font-size:15px;font-weight:650;cursor:pointer}
details p{margin-top:12px;color:var(--brand-text);font-size:14px;line-height:1.7}

/* CTA final */
.cta-final{padding:72px 24px;color:#fff;text-align:center;background:radial-gradient(circle at 70% 30%,rgba(8,118,217,.28),transparent 38%),linear-gradient(120deg,var(--alice-navy-deep),var(--alice-navy) 58%,var(--hq-blue))}
.cta-final h2{margin-bottom:12px;font-size:clamp(1.8rem,4vw,2.4rem);font-weight:760;letter-spacing:-.035em}
.cta-final p{margin-bottom:30px;color:rgba(255,255,255,.84);font-size:16px}
.cta-final .urgence2{margin-top:15px;color:rgba(255,255,255,.68);font-size:13px;font-style:italic}

/* Footer */
.site-footer{padding:44px 0;color:rgba(255,255,255,.72);background:var(--alice-navy-deep)}
.site-footer .inner,.site-footer .container{width:min(100% - 32px,1280px);max-width:1280px;margin:0 auto}
.footer-logo{width:125px;filter:brightness(0) invert(1);opacity:.95}
.footer-title{margin:0 0 10px;color:#fff;font-size:.98rem;font-weight:760}
.footer-links-col{display:flex;flex-direction:column;gap:8px}
.footer-links-col a{color:rgba(255,255,255,.72);font-size:.92rem}
.footer-links-col a:hover{color:#fff}
.footer-copy{margin:0;color:rgba(255,255,255,.54);font-size:.86rem}

/* Responsive */
@media(max-width:700px){
  .top-nav a{font-size:13px;padding:7px 9px}
}
@media(max-width:600px){
  .site-header .inner{min-height:auto;flex-direction:column;align-items:flex-start;padding:10px 0 12px}
  .card.recommande{transform:none}
  .card.recommande:hover{transform:translateY(-5px)}
  .re-item,.stat{width:45%}
  .hero{padding:52px 18px 58px}
  .forfaits,.proof,.cta-final{padding-left:18px;padding-right:18px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}
}


/* ==========================================================
   Hébergement Québec — pages secondaires migrées depuis CSS inline
   Généré par Canal 8 le 2026-08-27.
   ========================================================== */

/* Page addons.php — migrated from inline <style> */
:root{--bg:#f4f8ff;--ink:#0f172a;--muted:#5b6b84;--line:#d9e4f4;--brand:#0066cc;--deep:#0a1628;--shadow:0 12px 32px rgba(15,23,42,.10)}
    body.hq-page-addons *{box-sizing:border-box}body.hq-page-addons,body.hq-page-addons{margin:0;font-family:'Segoe UI',Inter,Arial,sans-serif;color:var(--ink);background:var(--bg)}
    body.hq-page-addons .hero{background:linear-gradient(135deg,var(--deep),var(--brand));color:#fff;padding:36px 20px 26px}
    body.hq-page-addons .heroin{max-width:1120px;margin:0 auto}
    body.hq-page-addons .eyebrow{display:inline-block;font-size:12px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-weight:700}
    body.hq-page-addons h1{margin:10px 0 8px;font-size:clamp(26px,3.6vw,38px)}
    body.hq-page-addons .lead{margin:0;opacity:.94;max-width:760px}
    body.hq-page-addons .progress{margin-top:14px;max-width:520px;height:8px;border-radius:999px;background:rgba(255,255,255,.28);overflow:hidden}
    body.hq-page-addons .progress span{display:block;height:100%;width:66.8%;background:#fff;animation:grow .8s ease}
    @keyframes grow{from{width:0}to{width:66.8%}}

    body.hq-page-addons .wrap{max-width:1120px;margin:0 auto;padding:18px 16px 40px}
    body.hq-page-addons .layout{display:grid;grid-template-columns:1fr 320px;gap:16px;align-items:start}
    body.hq-page-addons .card{background:#fff;border:1px solid #e7eef9;border-radius:16px;box-shadow:var(--shadow);padding:20px}
    body.hq-page-addons .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:10px}
    body.hq-page-addons .opt{position:relative;border:1px solid #d8e3f1;border-radius:14px;padding:12px;background:#fcfdff;transition:.18s ease;overflow:hidden}
    body.hq-page-addons .opt:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,73,145,.10);border-color:#b7d3f5}
    body.hq-page-addons .opt label{display:flex;align-items:flex-start;gap:10px;cursor:pointer}
    body.hq-page-addons .opt b{display:block;font-size:15px}
    body.hq-page-addons .opt small{color:#64748b;display:block;line-height:1.45}
    body.hq-page-addons .price{display:inline-block;margin-top:6px;color:#0058b8;font-size:12px;font-weight:700;background:#eaf3ff;padding:4px 8px;border-radius:999px}
    body.hq-page-addons .billing{margin-top:16px;padding:12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}
    body.hq-page-addons .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
    body.hq-page-addons .btn{border:0;background:linear-gradient(90deg,var(--brand),#0b78e6);color:#fff;padding:12px 16px;border-radius:12px;font-weight:800;cursor:pointer;position:relative;overflow:hidden}
    body.hq-page-addons .btn:before{content:"";position:absolute;inset:0 auto 0 -130%;width:120%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.32),transparent);transition:.45s}
    body.hq-page-addons .btn:hover:before{left:130%}
    body.hq-page-addons .link{display:inline-block;padding:12px 16px;border:1px solid #c9d6e8;border-radius:12px;color:#1e3a8a;background:#fff;text-decoration:none}

    body.hq-page-addons .side .kpi{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 12px}
    body.hq-page-addons .side .k{background:#f8fbff;border:1px solid #e3edf9;border-radius:10px;padding:10px}
    body.hq-page-addons .side .k b{display:block;color:#0066cc;font-size:19px}
    body.hq-page-addons .summary{border:1px solid #d7e7fb;background:#f4f9ff;border-radius:12px;padding:12px}
    body.hq-page-addons .summary .row{display:flex;justify-content:space-between;margin:7px 0;font-size:14px}
    body.hq-page-addons .summary .total{margin-top:10px;padding-top:10px;border-top:1px dashed #bcd4f4;font-weight:800}
    body.hq-page-addons .proof{margin-top:12px;font-size:13px;color:#334155;line-height:1.55}

    body.hq-page-addons .fade{opacity:0;transform:translateY(8px);animation:fade .5s ease forwards}
    body.hq-page-addons .d1{animation-delay:.07s}body.hq-page-addons .d2{animation-delay:.14s}
    @keyframes fade{to{opacity:1;transform:none}}

    body.hq-page-addons footer{background:#0a1628;color:#aaa;text-align:center;padding:22px;font-size:13px;margin-top:28px}
    body.hq-page-addons footer a{color:#7ec8ff}
    @media(max-width:980px){body.hq-page-addons .layout{grid-template-columns:1fr}body.hq-page-addons .grid{grid-template-columns:1fr}}

/* Page compte.php — migrated from inline <style> */
:root{--bg:#f4f8ff;--ink:#0f172a;--brand:#0066cc;--deep:#0a1628;--line:#dbe7f6}
    body.hq-page-compte *{box-sizing:border-box} body.hq-page-compte{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:var(--bg);color:var(--ink)}
    body.hq-page-compte .hero{background:linear-gradient(135deg,var(--deep),var(--brand));color:#fff;padding:34px 20px}
    body.hq-page-compte .heroin{max-width:1180px;margin:0 auto}
    body.hq-page-compte .wrap{max-width:1180px;margin:0 auto;padding:18px 16px 36px}
    body.hq-page-compte .layout{display:grid;grid-template-columns:260px 1fr;gap:16px}
    body.hq-page-compte .card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:0 8px 24px rgba(10,22,40,.08)}
    body.hq-page-compte .menu a{display:block;padding:10px 12px;border-radius:10px;text-decoration:none;color:#0f172a;margin-bottom:6px;border:1px solid #edf3fb;background:#f9fcff}
    body.hq-page-compte .menu a .ico{display:inline-flex;width:20px;justify-content:center;margin-right:8px}
    body.hq-page-compte .menu a:hover{border-color:#bdd7fa;background:#f2f8ff}
    body.hq-page-compte .status{display:inline-block;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700}
    body.hq-page-compte .s-pay{background:#fff4e5;color:#9a5a00}body.hq-page-compte .s-config{background:#e7f1ff;color:#0b57aa}body.hq-page-compte .s-live{background:#e8f8ef;color:#166534}body.hq-page-compte .s-other{background:#eef2f7;color:#334155}
    body.hq-page-compte .fgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    body.hq-page-compte .f{border:1px solid #e3edf9;background:#f8fbff;border-radius:10px;padding:10px}
    body.hq-page-compte .f b{display:block;font-size:12px;color:#64748b;text-transform:uppercase;margin-bottom:4px}
    body.hq-page-compte .actions{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
    body.hq-page-compte .btn{display:inline-block;padding:10px 12px;border-radius:10px;background:#0066cc;color:#fff;text-decoration:none;font-weight:700}
    body.hq-page-compte .btn.secondary{background:#fff;color:#1e3a8a;border:1px solid #c7d7ee}
    body.hq-page-compte .kpanel{margin-top:12px;border-top:1px dashed #d1dfef;padding-top:10px}
    body.hq-page-compte .chips span{display:inline-block;margin:3px 6px 0 0;padding:4px 8px;border-radius:999px;background:#edf5ff;border:1px solid #d3e4fa;font-size:12px}
    @media(max-width:960px){body.hq-page-compte .layout{grid-template-columns:1fr}body.hq-page-compte .fgrid{grid-template-columns:1fr}}

/* Page login.php — migrated from inline <style> */
body.hq-page-login{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:#f4f8ff;color:#0f172a}
    body.hq-page-login .hero{background:linear-gradient(135deg,#0a1628,#0066cc);color:#fff;padding:36px 20px;text-align:center}
    body.hq-page-login .wrap{max-width:560px;margin:0 auto;padding:24px 16px}
    body.hq-page-login .card{background:#fff;border:1px solid #e2ebf8;border-radius:14px;padding:20px;box-shadow:0 10px 28px rgba(10,22,40,.08)}
    body.hq-page-login .field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
    body.hq-page-login .field input{padding:11px;border:1px solid #d4deed;border-radius:10px;font-size:14px}
    body.hq-page-login .btn{width:100%;border:0;background:#0066cc;color:#fff;padding:12px;border-radius:10px;font-weight:700;cursor:pointer}
    body.hq-page-login .err{background:#feecec;border:1px solid #f1b6b6;color:#7f1d1d;padding:10px;border-radius:10px;margin-bottom:12px}

/* Page nouveau.php — migrated from inline <style> */
body.hq-page-nouveau *{box-sizing:border-box} body.hq-page-nouveau{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:#f4f8ff;color:#0f172a}
    body.hq-page-nouveau .hero{background:linear-gradient(135deg,#0a1628,#0066cc);color:#fff;padding:38px 20px;text-align:center}
    body.hq-page-nouveau .hero h1{margin:0 0 8px;font-size:clamp(26px,4vw,40px)}
    body.hq-page-nouveau .wrap{max-width:1080px;margin:0 auto;padding:24px 16px 38px}
    body.hq-page-nouveau .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
    body.hq-page-nouveau .card{background:#fff;border:1px solid #e2ebf8;border-radius:14px;padding:18px;box-shadow:0 8px 24px rgba(10,22,40,.08)}
    body.hq-page-nouveau .tag{font-size:12px;font-weight:700;color:#0059b3;background:#eaf3ff;border-radius:999px;padding:5px 9px;display:inline-block}
    body.hq-page-nouveau .price{font-size:32px;font-weight:800;margin:10px 0 4px;color:#0a1628}
    body.hq-page-nouveau .muted{color:#64748b;font-size:14px;margin-bottom:10px}
    body.hq-page-nouveau ul{list-style:none;padding:0;margin:0 0 14px}
    body.hq-page-nouveau li{padding:6px 0;border-bottom:1px solid #eef3fb;font-size:14px}
    body.hq-page-nouveau li:before{content:'✓ ';color:#0066cc;font-weight:700}
    body.hq-page-nouveau .btn{display:block;text-align:center;background:#0066cc;color:#fff;text-decoration:none;padding:11px 12px;border-radius:10px;font-weight:700}
    body.hq-page-nouveau .btn.secondary{background:#fff;color:#1e3a8a;border:1px solid #c7d7ee}
    body.hq-page-nouveau .top-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:14px}
    body.hq-page-nouveau .link{display:inline-block;background:#fff;color:#1e3a8a;border:1px solid #c7d7ee;padding:10px 12px;border-radius:10px;text-decoration:none;font-weight:600}
    @media(max-width:900px){body.hq-page-nouveau .cards{grid-template-columns:1fr}}

/* Page register.php — migrated from inline <style> */
:root{
      --bg:#f4f8ff; --ink:#0f172a; --muted:#5b6b84; --line:#d9e4f4;
      --brand:#0066cc; --brand2:#0096ff; --deep:#0a1628; --ok:#067647;
      --shadow:0 12px 32px rgba(15,23,42,.10); --r:16px;
    }
    body.hq-page-register *{box-sizing:border-box}
    body.hq-page-register,body.hq-page-register{margin:0;font-family:'Segoe UI',Inter,Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at top right,#e8f2ff 0,transparent 45%),var(--bg)}
    body.hq-page-register a{text-decoration:none;color:inherit}

    body.hq-page-register .hero{background:linear-gradient(135deg,var(--deep) 0%,var(--brand) 58%,var(--brand2) 100%);color:#fff;padding:46px 20px 34px;position:relative;overflow:hidden}
    body.hq-page-register .hero:before{content:"";position:absolute;inset:-60% auto auto -20%;width:420px;height:420px;border-radius:999px;background:rgba(255,255,255,.12);filter:blur(10px)}
    body.hq-page-register .heroin{max-width:1120px;margin:0 auto;position:relative}
    body.hq-page-register .eyebrow{display:inline-block;font-size:12px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);font-weight:700}
    body.hq-page-register h1{margin:12px 0 8px;font-size:clamp(28px,4vw,42px);line-height:1.1}
    body.hq-page-register .lead{margin:0;max-width:740px;opacity:.95}
    body.hq-page-register .progress{margin-top:16px;max-width:520px;height:8px;border-radius:999px;background:rgba(255,255,255,.28);overflow:hidden}
    body.hq-page-register .progress span{display:block;height:100%;width:33.4%;background:#fff;animation:grow .8s ease}
    @keyframes grow{from{width:0}to{width:33.4%}}

    body.hq-page-register .wrap{max-width:1120px;margin:-24px auto 0;padding:0 16px 40px}
    body.hq-page-register .layout{display:grid;grid-template-columns:1.25fr .75fr;gap:18px;align-items:start}
    body.hq-page-register .card{background:#fff;border:1px solid #e7eef9;border-radius:var(--r);box-shadow:var(--shadow);padding:22px}
    body.hq-page-register .kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 0}
    body.hq-page-register .k{background:#f8fbff;border:1px solid #e3edf9;border-radius:12px;padding:11px}
    body.hq-page-register .k b{display:block;color:var(--brand);font-size:20px;line-height:1.1}

    body.hq-page-register .grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    body.hq-page-register .field{display:flex;flex-direction:column;gap:5px}
    body.hq-page-register .field label{font-size:13px;font-weight:700}
    body.hq-page-register .field input,body.hq-page-register .field select,body.hq-page-register .field textarea{border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:14px;outline:none;transition:.18s ease}
    body.hq-page-register .field textarea{min-height:92px;resize:vertical}
    body.hq-page-register .field input:focus,body.hq-page-register .field select:focus,body.hq-page-register .field textarea:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,102,204,.12);transform:translateY(-1px)}
    body.hq-page-register .err{font-size:12px;color:#b42318}
    body.hq-page-register .btn{margin-top:14px;border:0;background:linear-gradient(90deg,var(--brand),#0b78e6);color:#fff;padding:13px 16px;border-radius:12px;font-weight:800;cursor:pointer;width:100%;position:relative;overflow:hidden}
    body.hq-page-register .btn:before{content:"";position:absolute;inset:0 auto 0 -130%;width:120%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.33),transparent);transition:.45s}
    body.hq-page-register .btn:hover:before{left:130%}
    body.hq-page-register .btn:hover{filter:brightness(1.06)}

    body.hq-page-register .proof{display:grid;gap:10px;margin-top:12px}
    body.hq-page-register .proof .row{display:flex;gap:8px;align-items:center;font-size:14px;color:#1e293b;padding:9px 10px;border:1px solid #e8eef8;background:#fafcff;border-radius:10px}
    body.hq-page-register .dot{width:8px;height:8px;border-radius:999px;background:var(--ok);box-shadow:0 0 0 6px rgba(6,118,71,.12)}

    body.hq-page-register .fade{opacity:0;transform:translateY(8px);animation:fade .5s ease forwards}
    body.hq-page-register .delay1{animation-delay:.06s}body.hq-page-register .delay2{animation-delay:.13s}body.hq-page-register .delay3{animation-delay:.2s}
    @keyframes fade{to{opacity:1;transform:none}}

    body.hq-page-register footer{background:#0a1628;color:#a6b5cc;text-align:center;padding:22px;font-size:13px}
    body.hq-page-register footer a{color:#8fd1ff}
    @media(max-width:950px){body.hq-page-register .layout{grid-template-columns:1fr}body.hq-page-register .grid{grid-template-columns:1fr}}

/* Page create.php — migrated from inline <style> */
body.hq-page-create{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:#f4f8ff;color:#0f172a}
    body.hq-page-create .hero{background:linear-gradient(135deg,#0a1628,#0066cc);color:#fff;padding:36px 20px}
    body.hq-page-create .wrap{max-width:1080px;margin:0 auto;padding:20px 16px}
    body.hq-page-create .card{background:#fff;border:1px solid #e5edf9;border-radius:14px;box-shadow:0 10px 30px rgba(10,22,40,.09);padding:22px}
    body.hq-page-create .ok,body.hq-page-create .ko{padding:12px;border-radius:10px;margin-bottom:14px}
    body.hq-page-create .ok{background:#e9f8ef;border:1px solid #a6dec1;color:#14532d}
    body.hq-page-create .ko{background:#feecec;border:1px solid #f0b2b2;color:#7f1d1d}
    body.hq-page-create .summary{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    body.hq-page-create .s{background:#f8fbff;border:1px solid #e3edf9;border-radius:10px;padding:10px}
    body.hq-page-create .s b{display:block;font-size:12px;text-transform:uppercase;color:#64748b;margin-bottom:4px}
    body.hq-page-create .actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
    body.hq-page-create .btn{display:inline-block;background:#0066cc;color:#fff;padding:12px 16px;border-radius:10px;text-decoration:none;font-weight:700;border:0;cursor:pointer}
    body.hq-page-create .link{display:inline-block;padding:12px 16px;border:1px solid #c9d6e8;border-radius:10px;color:#1e3a8a;text-decoration:none;background:#fff}
    @media(max-width:860px){body.hq-page-create .summary{grid-template-columns:1fr}}

/* Page create_account.php — migrated from inline <style> */
body.hq-page-create-account{font-family:Segoe UI,Arial,sans-serif;background:#f4f8ff;margin:0;color:#0f172a}
    body.hq-page-create-account .hero{background:linear-gradient(135deg,#0a1628,#0066cc);color:#fff;padding:28px 18px}
    body.hq-page-create-account .wrap{max-width:980px;margin:0 auto;padding:18px}
    body.hq-page-create-account .card{background:#fff;border:1px solid #e3edf9;border-radius:12px;padding:16px;box-shadow:0 8px 24px rgba(10,22,40,.08)}
    body.hq-page-create-account .grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}body.hq-page-create-account .f{display:flex;flex-direction:column;gap:4px}
    body.hq-page-create-account .f input,body.hq-page-create-account .f select{padding:10px;border:1px solid #d2dff0;border-radius:8px}
    body.hq-page-create-account .btn{padding:11px 14px;border:0;border-radius:8px;background:#0066cc;color:#fff;font-weight:700;cursor:pointer}
    body.hq-page-create-account .ok{background:#e9f8ef;border:1px solid #a6dec1;color:#14532d;padding:9px;border-radius:8px;margin-bottom:8px}
    body.hq-page-create-account .ko{background:#feecec;border:1px solid #f0b2b2;color:#7f1d1d;padding:9px;border-radius:8px;margin-bottom:8px}
    @media(max-width:900px){body.hq-page-create-account .grid{grid-template-columns:1fr}}

/* Page payment_cancel.php — migrated from inline <style> */
body.hq-page-payment-cancel{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:#f7f9fc;color:#0f172a}
    body.hq-page-payment-cancel .hero{background:linear-gradient(135deg,#0a1628 0%,#0066cc 100%);color:#fff;padding:34px 20px;text-align:center}
    body.hq-page-payment-cancel .wrap{max-width:900px;margin:0 auto;padding:24px 16px}
    body.hq-page-payment-cancel .card{background:#fff;border-radius:14px;box-shadow:0 10px 30px rgba(10,22,40,.08);padding:22px}
    body.hq-page-payment-cancel .ko{background:#feecec;border:1px solid #f0b2b2;color:#7f1d1d;padding:12px;border-radius:10px}
    body.hq-page-payment-cancel a.btn{display:inline-block;margin-top:16px;background:#0066cc;color:#fff;padding:11px 14px;border-radius:10px;text-decoration:none;font-weight:700}

/* Page payment_return.php — migrated from inline <style> */
body.hq-page-payment-return{margin:0;font-family:'Segoe UI',Arial,sans-serif;background:#f7f9fc;color:#0f172a}
    body.hq-page-payment-return .hero{background:linear-gradient(135deg,#0a1628 0%,#0066cc 100%);color:#fff;padding:34px 20px;text-align:center}
    body.hq-page-payment-return .wrap{max-width:900px;margin:0 auto;padding:24px 16px}
    body.hq-page-payment-return .card{background:#fff;border-radius:14px;box-shadow:0 10px 30px rgba(10,22,40,.08);padding:22px}
    body.hq-page-payment-return .ok{background:#e9f8ef;border:1px solid #a6dec1;color:#14532d;padding:12px;border-radius:10px}
    body.hq-page-payment-return .meta{margin-top:12px;font-size:13px;color:#475569}
    body.hq-page-payment-return a.btn{display:inline-block;margin-top:16px;background:#0066cc;color:#fff;padding:11px 14px;border-radius:10px;text-decoration:none;font-weight:700}
/* Correctif 2026-08-27 — neutraliser les cartes globales sur les pages secondaires */
body.hq-page-addons .card,
body.hq-page-compte .card,
body.hq-page-create .card,
body.hq-page-create-account .card,
body.hq-page-login .card,
body.hq-page-nouveau .card,
body.hq-page-payment-cancel .card,
body.hq-page-payment-return .card,
body.hq-page-register .card {
  width: auto;
  max-width: none;
  display: block;
  text-align: initial;
}
body.hq-page-register .layout,
body.hq-page-addons .layout,
body.hq-page-compte .layout {
  width: 100%;
}
body.hq-page-register .field,
body.hq-page-register .field input,
body.hq-page-register .field select,
body.hq-page-register .field textarea,
body.hq-page-addons .opt,
body.hq-page-compte .f {
  min-width: 0;
}

/* Correctif 2026-08-27 — isolation de la barre Krypton */
.header-container .btn,
.header-container button,
.header-container input[type="submit"],
.header-container .btn-primary,
.header-container .w-100 {
  width: auto !important;
  max-width: max-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.header-container .dropdown-menu .btn,
.header-container .dropdown-menu button,
.header-container .dropdown-menu input[type="submit"],
.header-container .dropdown-menu .w-100 {
  width: 100% !important;
  max-width: none;
  display: flex;
}
.header-container .alice-login-desktop .btn,
.header-container .alice-login-desktop button,
.header-container .alice-login-desktop input[type="submit"] {
  width: auto !important;
  min-width: 120px;
}