/* Welcome-page design; other page layouts remain unchanged. */
.platform-home {
  --sidebar:270px;
  --header:76px;
  background:#062443;
  color:#fff
}
.platform-home .header {
  height:76px;
  padding:0 25px;
  box-shadow:none;
  background:#fff
}
.platform-home .header>.brand:first-child {
  width:207px;
  height:72px
}
.platform-home .header>.brand:first-child img {
  width:218px;
  height:218px;
  top:-68px;
  left:-9px
}
.platform-home .sidebar {
  background:linear-gradient(140deg,#001b2c,#001726);
  padding:28px 16px 18px
}
.platform-home .platform-brand {
  margin:0 11px 28px;
  gap:16px
}
.platform-home .platform-brand strong {
  font-size:38px;
  letter-spacing:-1px
}
.platform-home .platform-brand .ui-icon {
  color:#00b3fa;
  width:44px;
  height:44px
}
.platform-home .nav-caption {
  font-size:10px;
  letter-spacing:.13em;
  color:#ecf4ff;
  margin:0 10px 12px
}
.platform-home .sidebar nav {
  gap:8px
}
.platform-home .sidebar nav a,.platform-home .sidebar nav button {
  padding:14px 15px;
  gap:18px;
  min-height:57px;
  font-size:16px;
  color:#f1f5ff;
  line-height:1.4;
  border-radius:10px
}
.platform-home .sidebar nav .ui-icon {
  width:29px;
  height:29px
}
.platform-home .sidebar nav a[aria-current=page] {
  background:linear-gradient(110deg,#0085ff,#0048dc);
  box-shadow:0 3px 10px #0002
}
.platform-home .nav-divider {
  background:#8ba8bf60;
  margin:19px 8px 12px
}
.platform-home .platform-body {
  background:#092b4a;
  position:relative;
  isolation:isolate;
  min-height:calc(100vh - 76px)
}
.platform-home .platform-body:before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(0deg,#082b4af5 0%,#092f4f80 25%,#082b4a00 80%),linear-gradient(90deg,#153b5bd9 0%,#153b5b9c 30%,transparent 67%),url('../../assets/ipqi-office.webp') right top/cover no-repeat;
  pointer-events:none
}
.platform-home main {
  max-width:none;
  min-height:calc(100vh - 122px);
  padding:50px 42px 34px;
  background:none
}
.accueil-hero {
  position:relative;
  min-height:290px;
  padding:0 8px 22px;
  isolation:isolate
}
.accueil-hero .eyebrow {
  color:#f3f7ff;
  font-size:12px;
  letter-spacing:.22em;
  margin:0 0 20px
}
.accueil-hero h1 {
  font-size:clamp(36px,3.35vw,64px);
  line-height:1.12;
  font-weight:750;
  letter-spacing:-.04em;
  margin:0 0 15px;
  color:#f8fbff;
  max-width:920px
}
.accueil-hero h1 em {
  color:#0084ff;
  font-style:normal
}
.accueil-hero>p:last-of-type {
  max-width:700px;
  font-size:19px;
  line-height:1.48;
  color:#f4f7ff;
  margin:0
}
.hero-glass {
  position:absolute;
  right:19%;
  top:0;
  width:240px;
  height:230px;
  z-index:-1;
  opacity:.8
}
.hero-glass>span {
  position:absolute;
  display:grid;
  place-items:center;
  width:76px;
  height:86px;
  border:1px solid #a0ddffc0;
  border-radius:7px;
  background:linear-gradient(135deg,#6dcaff55,#389bec20);
  box-shadow:inset 0 0 16px #8dd5ff30,0 5px 20px #001b3b33;
  backdrop-filter:blur(3px);
  transform:skewY(5deg);
  color:#d4efff
}
.hero-glass .ui-icon {
  width:42px;
  height:42px;
  stroke-width:1.5
}
.hero-glass>span:nth-child(1) {
  right:0;
  top:0
}
.hero-glass>span:nth-child(2) {
  right:82px;
  top:55px
}
.hero-glass>span:nth-child(3) {
  right:153px;
  top:128px
}
.hero-glass>span:nth-child(4) {
  right:68px;
  top:156px;
  width:65px;
  height:68px
}
.accueil-cards {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px
}
.accueil-card {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:23px;
  border:2px solid white;
  padding:27px 34px 23px;
  min-height:344px;
  display:flex;
  flex-direction:column;
  color:#052958;
  box-shadow:0 0 0 2px #0082ff,0 0 19px #0082ff90;
  background:linear-gradient(115deg,#fff 2%,#daedff 60%,#83beff)
}
.accueil-green {
  background:linear-gradient(115deg,#f2fff8,#c0f3df 75%,#7fe0bc);
  box-shadow:0 0 0 2px #00c467,0 0 19px #00c46770
}
.accueil-tile {
  height:68px;
  width:72px;
  border-radius:19px;
  background:linear-gradient(145deg,#008bff,#0051d8);
  color:white;
  display:grid;
  place-items:center;
  box-shadow:0 4px 8px #0870d440;
  margin-bottom:13px
}
.accueil-tile .ui-icon {
  height:43px;
  width:43px;
  stroke-width:1.7
}
.accueil-green .accueil-tile {
  background:linear-gradient(145deg,#00ac50,#00772b);
  box-shadow:0 4px 8px #00803c30
}
.accueil-card .eyebrow {
  font-size:11px;
  font-weight:800;
  letter-spacing:.18em;
  margin:0 0 3px;
  color:#042756
}
.accueil-card h2 {
  font-size:clamp(23px,1.9vw,36px);
  font-weight:750;
  letter-spacing:-.045em;
  color:#052958;
  margin:0 0 7px;
  position:relative
}
.accueil-copy {
  font-size:18px;
  line-height:1.37;
  max-width:64%;
  margin:0 0 15px;
  color:#052958;
  flex:1
}
.accueil-card .button {
  width:100%;
  border-radius:15px;
  padding:17px 14px;
  font-size:19px;
  min-height:60px;
  background:linear-gradient(120deg,#0067ef,#0041b4);
  box-shadow:0 5px 9px #0053a955;
  color:#fff;
  gap:24px;
  position:relative
}
.accueil-card .button span {
  font-size:28px;
  font-weight:400
}
.accueil-green .button {
  background:linear-gradient(120deg,#009c40,#006b26);
  box-shadow:0 5px 9px #007b3755
}
.accueil-art {
  position:absolute;
  right:18px;
  top:8px;
  width:43%;
  height:250px;
  z-index:-1;
  pointer-events:none
}
.art-orbit {
  position:absolute;
  inset:-25px -40px 20px -45px;
  border:32px solid #008cff20;
  border-radius:50%;
  transform:rotate(-30deg)
}
.form-art .art-orbit {
  border-color:#00bc7320
}
.mock-laptop {
  position:absolute;
  top:65px;
  right:0;
  width:90%;
  height:157px;
  background:#d3eaff;
  border:5px solid #0054c5;
  border-radius:10px;
  transform:perspective(600px) rotateY(-15deg) rotateZ(-7deg) skewX(-9deg);
  box-shadow:10px 14px 18px #0056b74d
}
.mock-laptop:after {
  content:'';
  position:absolute;
  bottom:-12px;
  left:-18px;
  right:-9px;
  height:9px;
  background:linear-gradient(#99c8ff,#347acb);
  border-radius:0 0 15px 15px
}
.mock-toolbar {
  height:21px;
  background:#0661c8;
  color:#a2d0ff;
  font-size:20px;
  line-height:10px;
  padding:3px 10px
}
.mock-search {
  margin:8px;
  height:21px;
  display:flex;
  gap:7px;
  align-items:center;
  background:#fff;
  border-radius:4px;
  padding:3px;
  color:#2779c4
}
.mock-search .ui-icon {
  height:14px;
  width:14px
}
.mock-search i {
  width:60%;
  height:4px;
  background:#aad2f4
}
.mock-row {
  display:flex;
  align-items:center;
  gap:8px;
  margin:9px;
  color:#5eacde;
  font-size:13px
}
.mock-row b {
  background:#8bc8e9;
  color:white;
  width:15px;
  height:15px;
  text-align:center;
  border-radius:3px
}
.mock-row i {
  width:67%;
  height:5px;
  background:#9ec9ee
}
.mock-magnifier {
  display:grid;
  place-items:center;
  position:absolute;
  right:2px;
  bottom:7px;
  width:67px;
  height:67px;
  background:linear-gradient(140deg,#00a5ff,#0064e6);
  border-radius:50%;
  color:white;
  box-shadow:2px 6px 10px #0053b466
}
.mock-magnifier .ui-icon {
  width:48px;
  height:48px;
  stroke-width:2.8
}
.mock-document {
  position:absolute;
  width:74%;
  height:171px;
  right:8px;
  top:45px;
  background:linear-gradient(120deg,#fff,#edfff8);
  border:2px solid #fff;
  border-radius:10px;
  padding:24px 15px;
  transform:rotate(-10deg);
  box-shadow:4px 12px 14px #11754835
}
.mock-document i {
  display:block;
  height:15px;
  margin:0 0 15px;
  border-left:15px solid #89e5c5;
  border-bottom:9px solid #a1efd5;
  border-radius:5px
}
.mock-document i:first-child {
  height:20px;
  background:#a1efd5;
  border:0
}
.mock-plus {
  position:absolute;
  right:0;
  bottom:5px;
  display:grid;
  place-items:center;
  width:80px;
  height:80px;
  border-radius:50%;
  font-size:65px;
  line-height:1;
  font-weight:650;
  background:linear-gradient(130deg,#02c96a,#008339);
  color:white;
  box-shadow:4px 8px 12px #0a7e4850;
  transform:rotate(-10deg)
}
.platform-home .platform-body footer {
  color:#c5d9e9;
  background:transparent;
  border:0;
  padding:12px 20px;
  font-size:10px
}
.platform-home footer a {
  color:#d9edff
}
html[data-accueil-theme=light] .platform-home .platform-body {
  background:#e8f3fc
}
html[data-accueil-theme=light] .platform-home .platform-body:before {
  opacity:.28
}
html[data-accueil-theme=light] .accueil-hero h1,html[data-accueil-theme=light] .accueil-hero p {
  color:#082b50
}
html[data-accueil-theme=light] .platform-home footer,html[data-accueil-theme=light] .platform-home footer a {
  color:#315575
}
@media(min-width:1650px) {
  .platform-home main {
    padding:50px 45px 35px 80px
  }
  .accueil-hero {
    min-height:290px
  }
  .accueil-card {
    min-height:350px
  }
  .accueil-copy {
    max-width:63%;
    font-size:20px
  }
  .accueil-art {
    height:260px
  }
  .mock-laptop {
    height:165px
  }
  .accueil-card h2 {
    font-size:35px
  }
}
@media(max-width:1250px) {
  .platform-home {
    --sidebar:225px
  }
  .platform-home main {
    padding:35px 27px
  }
  .accueil-hero {
    min-height:265px
  }
  .accueil-hero>p:last-of-type {
    max-width:590px;
    font-size:17px
  }
  .hero-glass {
    right:4%;
    opacity:.45
  }
  .accueil-cards {
    gap:23px
  }
  .accueil-card {
    padding:23px;
    min-height:340px
  }
  .accueil-copy {
    font-size:16px;
    max-width:79%
  }
  .accueil-art {
    opacity:.55;
    right:10px;
    width:43%;
    top:17px
  }
  .accueil-card .button {
    font-size:16px
  }
  .accueil-card h2 {
    font-size:26px
  }
  .platform-home .sidebar nav a,.platform-home .sidebar nav button {
    font-size:14px;
    gap:15px;
    padding-inline:12px
  }
}
@media(max-width:1000px) {
  .accueil-hero h1 {
    font-size:36px
  }
  .accueil-hero>p:last-of-type {
    font-size:16px
  }
  .accueil-cards {
    grid-template-columns:1fr
  }
  .accueil-card {
    min-height:325px
  }
  .accueil-copy {
    max-width:64%;
    font-size:18px
  }
  .accueil-art {
    width:36%;
    opacity:.85
  }
  .accueil-hero {
    min-height:270px
  }
  .accueil-tile {
    width:61px;
    height:60px
  }
  .accueil-card h2 {
    font-size:31px
  }
  .hero-glass {
    display:none
  }
}
@media(max-width:760px) {
  .platform-home {
    --header:76px
  }
  .platform-home .header {
    padding:0 14px;
    gap:10px
  }
  .platform-home .header>.brand:first-child {
    width:160px;
    height:65px
  }
  .platform-home .header>.brand:first-child img {
    width:182px;
    height:182px;
    top:-57px
  }
  .platform-home .menu-toggle {
    padding:8px
  }
  .platform-home main {
    padding:32px 21px 23px
  }
  .platform-home .platform-body:before {
    background-size:auto 650px;
    background-repeat:no-repeat;
    background-position:68% top;
    opacity:.9
  }
  .accueil-hero {
    padding:0 0 23px;
    min-height:0
  }
  .accueil-hero h1 {
    font-size:35px
  }
  .accueil-hero>p:last-of-type {
    font-size:16px;
    max-width:95%
  }
  .accueil-hero .eyebrow {
    font-size:10px;
    letter-spacing:.15em
  }
  .accueil-cards {
    gap:23px;
    margin-top:12px
  }
  .accueil-card {
    padding:24px;
    min-height:338px;
    border-radius:20px
  }
  .accueil-copy {
    max-width:76%;
    font-size:16px
  }
  .accueil-card h2 {
    font-size:27px
  }
  .accueil-art {
    width:39%;
    opacity:.65;
    right:8px;
    top:26px
  }
  .accueil-card .button {
    font-size:16px;
    border-radius:12px;
    padding:12px 10px;
    min-height:54px
  }
  .platform-home .sidebar {
    width:265px
  }
}
@media(max-width:380px) {
  .platform-home .header {
    padding-inline:10px;
    gap:6px
  }
  .platform-home .header>.brand:first-child {
    width:132px
  }
  .platform-home .header>.brand:first-child img {
    width:163px;
    height:163px;
    top:-51px
  }
  .accueil-hero h1 {
    font-size:31px
  }
  .accueil-card {
    padding:21px
  }
  .accueil-copy {
    max-width:100%
  }
  .accueil-art {
    opacity:.3
  }
  .accueil-card h2 {
    font-size:25px
  }
}
/* SHARED SIDEBAR */
.sidebar-account {
  margin-top:auto;
  padding-top:28px;
  color:#eaf3ff
}
.sidebar-person {
  display:flex;
  align-items:center;
  gap:12px;
  padding:18px 5px;
  border-block:1px solid #a6bed44d;
  color:#f1f6ff;
  font-size:13px;
  min-width:0
}
.sidebar-person>span:nth-child(2) {
  min-width:0;
  flex:1
}
.sidebar-person strong {
  display:block;
  font-size:13px;
  font-weight:500
}
.sidebar-person small {
  display:block;
  font-size:12px;
  line-height:1.65;
  margin-top:3px;
  overflow-wrap:anywhere
}
.person-avatar {
  display:grid;
  place-items:center;
  flex-shrink:0;
  width:43px;
  height:43px;
  border-radius:50%;
  background:#8395a8;
  color:white;
  overflow:hidden
}
.person-avatar .ui-icon {
  height:34px;
  width:34px
}
.person-avatar img {
  width:100%;
  height:100%;
  object-fit:cover
}
.theme-controls {
  display:flex;
  align-items:center;
  justify-content:space-evenly;
  padding:20px 8px 1px;
  gap:16px
}
.theme-controls>.ui-icon {
  width:25px;
  height:25px
}
.theme-toggle {
  display:block;
  position:relative;
  width:55px;
  height:30px;
  min-height:0;
  border:0;
  border-radius:30px;
  background:#72849a;
  padding:3px;
  box-shadow:none
}
.theme-toggle[aria-checked=true] {
  background:#0085ff
}
.theme-toggle>span {
  display:block;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#fff;
  transition:transform .2s;
  box-shadow:0 1px 4px #00172c55
}
.theme-toggle[aria-checked=true]>span {
  transform:translateX(25px)
}
.theme-toggle:hover {
  transform:none;
  background:#687c92
}
.theme-toggle[aria-checked=true]:hover {
  background:#0074eb
}
@media(max-width:760px) {
  .accueil-art {
    opacity:.18
  }
  .accueil-copy {
    max-width:100%;
    position:relative
  }
  .accueil-hero {
    text-shadow:0 1px 6px #001b2c80
  }
  .platform-home .platform-body:before {
    background-image:linear-gradient(90deg,#062b48d9,#062b4855),linear-gradient(0deg,#082b4a,transparent 75%),url("../../assets/ipqi-office.webp")
  }
}