
:root {
  color-scheme: dark;
  font-family: Arial,Helvetica,sans-serif;
}

* { box-sizing:border-box; }

body {
  margin:0;
  color:#fff;
  background:linear-gradient(150deg,#09182d,#102b47 55%,#09182d);
}

.topbar {
  background:#153e72;
  border-bottom:1px solid #315b85;
}

.top-inner {
  max-width:1160px;
  margin:auto;
  padding:20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}

.brand {
  color:#fff;
  font-size:25px;
  font-weight:900;
  text-decoration:none;
  letter-spacing:1px;
}

.brand span {
  display:block;
  font-size:9px;
  letter-spacing:2px;
}

.back {
  color:#c6e7ff;
  text-decoration:none;
  font-size:13px;
}

main {
  max-width:1120px;
  margin:auto;
  padding:65px 20px 90px;
}

.intro {
  text-align:center;
  max-width:780px;
  margin:0 auto 38px;
}

.eyebrow {
  color:#8be8d0;
  font-size:12px;
  font-weight:800;
  letter-spacing:2px;
  margin-bottom:15px;
}

h1 {
  font-size:clamp(30px,4vw,48px);
  line-height:1.2;
  margin:0 0 18px;
}

.intro p {
  color:#bbd0e3;
  line-height:1.7;
  font-size:16px;
}

.panel {
  max-width:850px;
  margin:0 auto 75px;
  padding:32px;
  background:linear-gradient(135deg,#174b61,#102d47);
  border:1px solid #328e91;
  border-radius:24px;
  box-shadow:0 20px 55px rgba(0,0,0,.18);
}

.panel-heading {
  display:flex;
  gap:16px;
  align-items:center;
  margin-bottom:25px;
}

.symbol {
  color:#9affdf;
  font-size:38px;
}

h2 {
  font-size:clamp(24px,3vw,34px);
  margin:0 0 12px;
}

.panel-heading h2 {
  font-size:23px;
  margin:0 0 6px;
}

.panel-heading p {
  margin:0;
  color:#c1d9e3;
  font-size:14px;
}

form {
  display:grid;
  gap:13px;
}

label {
  font-size:14px;
  font-weight:700;
}

input {
  width:100%;
  padding:17px;
  border:1px solid #6794a8;
  border-radius:12px;
  background:#f8fbff;
  color:#102440;
  font-size:16px;
}

button {
  padding:17px;
  border:0;
  border-radius:12px;
  color:#fff;
  font-weight:800;
  font-size:15px;
  cursor:pointer;
  background:linear-gradient(110deg,#128f9c,#19b89f);
}

button:hover { filter:brightness(1.1); }

.result {
  margin-top:20px;
  padding:17px;
  border:1px solid #65d8bd;
  border-radius:12px;
  background:#174b55;
  color:#e0fff5;
  line-height:1.6;
  overflow-wrap:anywhere;
}

.disclaimer {
  margin:19px 0 0;
  color:#b9d0db;
  font-size:12px;
  line-height:1.7;
}

.steps {
  text-align:center;
}

.steps-grid {
  margin-top:30px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  text-align:left;
}

.step {
  padding:26px;
  border-radius:18px;
  background:linear-gradient(140deg,#183957,#10263e);
  border:1px solid #315673;
}

.number {
  display:inline-block;
  color:#88e8d0;
  font-size:24px;
  font-weight:900;
  margin-bottom:20px;
}

.step h3 {
  font-size:17px;
  line-height:1.4;
  margin:0 0 12px;
}

.step p {
  color:#b9d0e3;
  font-size:14px;
  line-height:1.7;
  margin:0;
}

footer {
  padding:25px;
  text-align:center;
  color:#b5cce0;
  background:#081729;
  font-size:12px;
}

@media(max-width:800px) {
  .steps-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media(max-width:560px) {
  .top-inner { padding:17px 15px; }
  .brand { font-size:21px; }
  .back { font-size:11px; }
  main { padding:48px 16px 65px; }
  .panel { padding:22px 17px; }
  .steps-grid { grid-template-columns:1fr; }
}


/* OVIIGI TRANSFERT HERO CSS V50208D333 */

body {
  background:
    radial-gradient(
      ellipse at 76% 14%,
      rgba(0,117,193,.18),
      transparent 45%
    ),
    linear-gradient(
      145deg,
      #03152c,
      #062b4c 53%,
      #03162d
    );
}

main > .transfer-hero {
  max-width: 1120px;
  margin: 0 auto 38px;
  min-height: 320px;
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  align-items: center;
  gap: 20px;
  text-align: left;
}

.transfer-hero-content {
  position: relative;
  z-index: 2;
}

.transfer-hero .eyebrow {
  color: #10e5cf;
  font-size: 11px;
  letter-spacing: 3px;
  margin-bottom: 15px;
}

.transfer-hero h1 {
  color: #fff;
  font-size: clamp(34px,4.3vw,54px);
  line-height: 1.13;
  font-weight: 850;
  letter-spacing: -1.4px;
  margin-bottom: 17px;
}

.transfer-hero h1 span {
  color: #16e8d0;
}

.transfer-hero-content > p {
  max-width: 530px;
  margin: 0;
  color: #c8d9ea;
  font-size: 16px;
  line-height: 1.65;
}

.transfer-hero-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 23px;
  margin-top: 27px;
}

.transfer-hero-benefit {
  display: flex;
  align-items: center;
  gap: 9px;
}

.transfer-benefit-icon {
  color: #19e7d1;
  font-size: 28px;
  line-height: 1;
}

.transfer-hero-benefit strong {
  display: block;
  color: #fff;
  font-size: 12px;
  line-height: 1.35;
}

.transfer-hero-benefit small {
  display: block;
  color: #c4d9e7;
  font-size: 10px;
  margin-top: 3px;
}

.transfer-hero-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  overflow: hidden;
}

.transfer-globe-placeholder {
  position: relative;
  width: min(100%,330px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}

.transfer-globe-sphere {
  position: relative;
  width: 77%;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(29,235,237,.7);
  background:
    radial-gradient(
      circle at 34% 29%,
      rgba(21,205,244,.52),
      transparent 44%
    ),
    radial-gradient(
      circle at 67% 75%,
      #075a99,
      #052e5b 65%,
      #03152e
    );
  box-shadow:
    0 0 45px rgba(0,190,239,.35),
    inset -24px -18px 35px rgba(0,9,36,.55);
}

.transfer-globe-sphere span {
  color: #2cf5f3;
  font-size: 100px;
  font-weight: 800;
  text-shadow: 0 0 25px rgba(0,245,245,.6);
}

.transfer-globe-orbit {
  position: absolute;
  width: 110%;
  height: 45%;
  border: 4px solid rgba(12,234,225,.75);
  border-radius: 50%;
  transform: rotate(-28deg);
  box-shadow: 0 0 24px rgba(0,230,225,.35);
}

@media screen and (max-width:760px) {
  main > .transfer-hero {
    grid-template-columns: 1fr;
    gap: 5px;
    text-align: center;
    margin-bottom: 26px;
  }

  .transfer-hero h1 {
    font-size: clamp(30px,8vw,40px);
    letter-spacing: -.6px;
  }

  .transfer-hero-content > p {
    margin: 0 auto;
    font-size: 14px;
  }

  .transfer-hero-benefits {
    justify-content: center;
    gap: 15px;
    margin-top: 22px;
  }

  .transfer-hero-benefit {
    text-align: left;
  }

  .transfer-hero-visual {
    min-height: 210px;
  }

  .transfer-globe-placeholder {
    width: 220px;
  }

  .transfer-globe-sphere span {
    font-size: 70px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .transfer-globe-placeholder,
  .transfer-globe-orbit {
    animation: none !important;
  }
}


/* OVIIGI TRANSFERT GLOBE WEBP CSS V50208D336 */

main > .transfer-hero .transfer-hero-visual {
  position: relative;
  min-height: 310px;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
}

main > .transfer-hero .transfer-globe-image {
  display: block;
  width: min(115%, 500px);
  max-width: none;
  height: auto;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  background: transparent;
  filter: drop-shadow(
    0 0 20px rgba(0, 201, 238, .12)
  );
}

@media screen and (max-width: 760px) {
  main > .transfer-hero .transfer-hero-visual {
    min-height: 0;
    margin-top: 8px;
    overflow: hidden;
  }

  main > .transfer-hero .transfer-globe-image {
    width: min(100%, 330px);
    max-width: 100%;
    height: auto;
  }
}

@media screen and (min-width: 761px) {
  main > .transfer-hero .transfer-hero-visual {
    margin-right: -15px;
  }
}


/* OVIIGI TRANSFERT RESPONSIVE V50208D339 */

/* Ordinateur : conserver le Hero en deux colonnes */
@media (min-width: 901px) {
  main > .transfer-hero {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  }

  main > .transfer-hero .transfer-globe-image {
    width: min(115%, 500px);
  }
}

/* Tablette et mobile */
@media (max-width: 900px) {
  main > .transfer-hero {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    min-height: 0 !important;
    gap: 14px !important;
    text-align: center !important;
    margin-bottom: 24px !important;
  }

  main > .transfer-hero .transfer-hero-content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  main > .transfer-hero .transfer-hero-content > p {
    margin-left: auto;
    margin-right: auto;
  }

  main > .transfer-hero .transfer-hero-benefits {
    justify-content: center;
    gap: 14px;
    margin-top: 20px;
  }

  main > .transfer-hero .transfer-hero-visual {
    width: 100%;
    min-width: 0;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden;
  }

  main > .transfer-hero .transfer-globe-image {
    width: min(100%, 380px) !important;
    max-width: 100% !important;
    height: auto;
    margin: 0 auto;
  }

  main > .steps .steps-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Téléphone */
@media (max-width: 600px) {
  main {
    padding-left: 16px;
    padding-right: 16px;
  }

  main > .transfer-hero {
    gap: 8px !important;
  }

  main > .transfer-hero h1 {
    font-size: clamp(29px, 7.5vw, 38px);
    line-height: 1.16;
  }

  main > .transfer-hero .transfer-hero-benefits {
    gap: 12px;
  }

  main > .transfer-hero .transfer-globe-image {
    width: min(100%, 310px) !important;
  }

  main > .panel {
    width: 100%;
    max-width: 100%;
    padding: 22px 17px;
    border-radius: 19px;
  }

  main > .steps .steps-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px;
  }

  main > .steps .step {
    padding: 20px;
  }

  main > .steps .number {
    margin-bottom: 12px;
  }
}


/* OVIIGI TRANSFERT SECTIONS V50208D343 */

main > .transfer-extra {
  margin: 88px auto 0;
  max-width: 1120px;
}

main > .transfer-extra .transfer-section-heading {
  text-align: center;
  max-width: 760px;
  margin: 0 auto 34px;
}

main > .transfer-extra .transfer-section-heading .eyebrow {
  color: #17e1d0;
  font-size: 11px;
  letter-spacing: 2.5px;
}

main > .transfer-extra .transfer-section-heading h2 {
  color: #fff;
  font-size: clamp(26px, 3vw, 36px);
  line-height: 1.2;
  margin: 0 0 14px;
}

main > .transfer-extra .transfer-section-heading h2 span {
  color: #17e6d0;
}

main > .transfer-extra .transfer-section-heading p {
  color: #b9d1e3;
  font-size: 15px;
  line-height: 1.7;
  margin: 0;
}

main > .transfer-extra .transfer-extra-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

main > .transfer-extra .transfer-extra-card {
  min-width: 0;
  padding: 25px 21px 27px;
  border: 1px solid rgba(48, 165, 185, .38);
  border-radius: 18px;
  background: linear-gradient(
    145deg,
    #153956 0%,
    #0c2843 100%
  );
  box-shadow: 0 12px 32px rgba(0, 0, 0, .12);
  transition:
    border-color .2s ease,
    transform .2s ease;
}

main > .transfer-extra .transfer-extra-card:hover {
  border-color: rgba(27, 230, 210, .7);
  transform: translateY(-3px);
}

main > .transfer-extra .transfer-extra-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 47px;
  height: 47px;
  margin-bottom: 20px;
  border: 1px solid rgba(36, 221, 210, .4);
  border-radius: 13px;
  background: rgba(14, 170, 175, .12);
  color: #4cf3dd;
  font-size: 26px;
  font-weight: 700;
}

main > .transfer-extra .transfer-extra-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 17px;
  line-height: 1.35;
}

main > .transfer-extra .transfer-extra-card p {
  margin: 0;
  color: #b8d0e2;
  font-size: 13px;
  line-height: 1.75;
}

main > .transfer-information {
  margin-top: 94px;
}

main > .transfer-information .transfer-extra-card {
  border-color: rgba(51, 135, 178, .4);
  background: linear-gradient(
    145deg,
    #112f4d,
    #0b223b
  );
}

main > .transfer-information .transfer-info-notice {
  max-width: 850px;
  margin: 28px auto 0;
  padding: 16px 20px;
  border: 1px solid rgba(29, 202, 188, .25);
  border-radius: 12px;
  background: rgba(12, 103, 116, .12);
  color: #bdd8e4;
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
}

@media (max-width: 900px) {
  main > .transfer-extra .transfer-extra-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  main > .transfer-extra {
    margin-top: 62px;
  }

  main > .transfer-extra .transfer-section-heading {
    margin-bottom: 24px;
  }

  main > .transfer-extra .transfer-section-heading h2 {
    font-size: 26px;
  }

  main > .transfer-extra .transfer-section-heading p {
    font-size: 14px;
  }

  main > .transfer-extra .transfer-extra-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  main > .transfer-extra .transfer-extra-card {
    padding: 20px;
  }

  main > .transfer-extra .transfer-extra-icon {
    width: 42px;
    height: 42px;
    margin-bottom: 14px;
  }

  main > .transfer-information {
    margin-top: 66px;
  }
}

@media (prefers-reduced-motion: reduce) {
  main > .transfer-extra .transfer-extra-card {
    transition: none;
  }
}


/* OVIIGI TRANSFERT PANNEAU V50208D345 */

main > .transfer-why-panel {
  max-width: 1120px;
  margin: 82px auto 0;
  padding: 36px 36px 34px;
  border: 1px solid rgba(30, 221, 218, .48);
  border-radius: 25px;
  background:
    radial-gradient(ellipse at 45% 0%,
      rgba(0, 159, 194, .13), transparent 65%),
    linear-gradient(135deg, #082c49, #05213b);
  box-shadow:
    0 0 28px rgba(0, 201, 222, .07),
    inset 0 1px 0 rgba(110, 246, 244, .08);
}

main > .transfer-why-panel .transfer-why-top {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  margin-bottom: 36px;
}

main > .transfer-why-panel .transfer-why-emblem {
  display: grid;
  place-items: center;
  width: 94px;
  height: 94px;
  border: 2px solid rgba(24, 224, 218, .55);
  border-radius: 50%;
  background: rgba(0, 182, 201, .10);
  color: #24f1e0;
  box-shadow: 0 0 25px rgba(0, 222, 231, .12);
}

main > .transfer-why-panel .transfer-why-emblem svg {
  width: 54px;
  height: 54px;
}

main > .transfer-why-panel .transfer-why-intro h2 {
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(23px, 2.5vw, 33px);
  line-height: 1.2;
}

main > .transfer-why-panel .transfer-why-intro p {
  max-width: 660px;
  margin: 0;
  color: #bcd3e5;
  font-size: 15px;
  line-height: 1.65;
}

main > .transfer-why-panel .transfer-why-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-height: 50px;
  padding: 12px 25px;
  border-radius: 13px;
  background: linear-gradient(110deg, #18d5c3, #20edcb);
  color: #062a3a;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

main > .transfer-why-panel .transfer-why-action:hover {
  filter: brightness(1.08);
}

main > .transfer-why-panel .transfer-why-action:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
}

main > .transfer-why-panel .transfer-why-features {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

main > .transfer-why-panel .transfer-why-feature {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  padding: 7px 18px;
}

main > .transfer-why-panel .transfer-why-feature:first-child {
  padding-left: 0;
}

main > .transfer-why-panel .transfer-why-feature + .transfer-why-feature {
  border-left: 1px solid rgba(28, 194, 211, .32);
}

main > .transfer-why-panel .transfer-why-feature-icon {
  flex: 0 0 38px;
  color: #26f0e3;
  font-size: 36px;
  line-height: 1;
  text-align: center;
  text-shadow: 0 0 15px rgba(0, 241, 235, .28);
}

main > .transfer-why-panel .transfer-why-feature h3 {
  margin: 0 0 9px;
  color: #77edeb;
  font-size: 15px;
  line-height: 1.3;
}

main > .transfer-why-panel .transfer-why-feature p {
  margin: 0;
  color: #c1d2e2;
  font-size: 13px;
  line-height: 1.65;
}

@media (max-width: 900px) {
  main > .transfer-why-panel {
    padding: 26px;
  }

  main > .transfer-why-panel .transfer-why-top {
    grid-template-columns: 75px minmax(0, 1fr);
    gap: 17px;
  }

  main > .transfer-why-panel .transfer-why-emblem {
    width: 70px;
    height: 70px;
  }

  main > .transfer-why-panel .transfer-why-emblem svg {
    width: 41px;
    height: 41px;
  }

  main > .transfer-why-panel .transfer-why-action {
    grid-column: 2;
    justify-self: start;
  }

  main > .transfer-why-panel .transfer-why-features {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 0;
  }

  main > .transfer-why-panel .transfer-why-feature:nth-child(3) {
    border-left: 0;
    padding-left: 0;
  }
}

@media (max-width: 600px) {
  main > .transfer-why-panel {
    margin-top: 60px;
    padding: 23px 18px;
    border-radius: 20px;
  }

  main > .transfer-why-panel .transfer-why-top {
    grid-template-columns: 55px minmax(0, 1fr);
    gap: 13px;
    margin-bottom: 25px;
  }

  main > .transfer-why-panel .transfer-why-emblem {
    width: 52px;
    height: 52px;
  }

  main > .transfer-why-panel .transfer-why-emblem svg {
    width: 32px;
    height: 32px;
  }

  main > .transfer-why-panel .transfer-why-intro h2 {
    font-size: 21px;
  }

  main > .transfer-why-panel .transfer-why-intro p {
    font-size: 13px;
  }

  main > .transfer-why-panel .transfer-why-action {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 44px;
    font-size: 14px;
  }

  main > .transfer-why-panel .transfer-why-features {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  main > .transfer-why-panel .transfer-why-feature,
  main > .transfer-why-panel .transfer-why-feature:first-child,
  main > .transfer-why-panel .transfer-why-feature:nth-child(3) {
    padding: 17px 0;
    border-left: 0;
  }

  main > .transfer-why-panel .transfer-why-feature + .transfer-why-feature {
    border-left: 0;
    border-top: 1px solid rgba(28, 194, 211, .25);
  }
}


/* OVIIGI TRANSFERT NEON V50208D346 */

/* Contour lumineux continu sur les quatre cotes */
main > .transfer-why-panel {
  position: relative;
  isolation: isolate;

  border: 1px solid rgba(39, 242, 227, .88);

  box-shadow:
    0 0 7px rgba(25, 241, 226, .50),
    0 0 20px rgba(10, 222, 220, .28),
    0 0 42px rgba(0, 198, 218, .14),
    inset 0 0 9px rgba(31, 237, 224, .10);

  transition:
    box-shadow .3s ease,
    border-color .3s ease;
}

/* Renforcement elegant au survol */
@media (hover: hover) {
  main > .transfer-why-panel:hover {
    border-color: rgba(65, 255, 238, 1);

    box-shadow:
      0 0 10px rgba(25, 241, 226, .65),
      0 0 28px rgba(10, 222, 220, .35),
      0 0 52px rgba(0, 198, 218, .18),
      inset 0 0 12px rgba(31, 237, 224, .12);
  }
}

/* Lueur maitrisee sur telephone */
@media (max-width: 600px) {
  main > .transfer-why-panel {
    box-shadow:
      0 0 6px rgba(25, 241, 226, .42),
      0 0 16px rgba(10, 222, 220, .22),
      inset 0 0 7px rgba(31, 237, 224, .08);
  }
}


/* OVIIGI TRANSFERT BORDURE BROSSEE V50208D347 */

/* Reflets clairs irreguliers sur les quatre bordures */
main > .transfer-why-panel {
  position: relative;
  isolation: isolate;

  border: 1px solid transparent;

  background:
    radial-gradient(
      ellipse at 24% 0%,
      rgba(12, 173, 196, .18),
      transparent 58%
    ) padding-box,

    linear-gradient(
      135deg,
      #082c49,
      #05213b
    ) padding-box,

    conic-gradient(
      from 15deg,
      #167b99 0deg,
      #44e9e0 28deg,
      #13758c 68deg,
      #1598a7 110deg,
      #6cf8ec 151deg,
      #16718b 195deg,
      #32cfcf 240deg,
      #85fff0 283deg,
      #167b99 330deg,
      #167b99 360deg
    ) border-box;

  box-shadow:
    0 0 9px rgba(21, 205, 213, .18),
    0 0 24px rgba(11, 170, 190, .10),
    inset 0 0 10px rgba(38, 229, 216, .06);
}

/* Finition satinee douce au survol */
@media (hover: hover) {
  main > .transfer-why-panel:hover {
    border-color: transparent;

    box-shadow:
      0 0 12px rgba(38, 229, 216, .24),
      0 0 29px rgba(11, 170, 190, .14),
      inset 0 0 12px rgba(38, 229, 216, .08);
  }
}

/* Sur mobile : reflets presents mais discrets */
@media (max-width: 600px) {
  main > .transfer-why-panel {
    box-shadow:
      0 0 8px rgba(21, 205, 213, .16),
      0 0 17px rgba(11, 170, 190, .08),
      inset 0 0 7px rgba(38, 229, 216, .05);
  }
}


/* OVIIGI TRANSFERT INFO PREMIUM V50208D349 */

main > .transfer-information .transfer-info-grid {
  align-items: stretch;
}

main > .transfer-information .transfer-extra-card {
  position: relative;
  min-width: 0;
  overflow: hidden;

  border: 1px solid transparent;
  border-radius: 19px;

  background:
    radial-gradient(
      ellipse at 25% 0%,
      rgba(35, 205, 215, .12),
      transparent 70%
    ) padding-box,

    linear-gradient(
      145deg,
      #123653,
      #09233c
    ) padding-box,

    conic-gradient(
      from 35deg,
      #185d79,
      #33bfc2,
      #19617b,
      #68e9dd,
      #175c79,
      #299da8,
      #185d79
    ) border-box;

  box-shadow:
    0 7px 22px rgba(0, 9, 28, .15),
    0 0 12px rgba(14, 191, 203, .07);

  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

main > .transfer-information .transfer-extra-card:hover {
  border-color: transparent;
  transform: translateY(-3px);

  box-shadow:
    0 10px 27px rgba(0, 9, 28, .23),
    0 0 18px rgba(23, 218, 214, .17);
}

main > .transfer-information .transfer-extra-icon {
  display: grid;
  place-items: center;
  color: #38eadc;
  background:
    linear-gradient(
      145deg,
      rgba(23, 203, 211, .16),
      rgba(12, 87, 120, .16)
    );
  box-shadow:
    inset 0 1px 0 rgba(91, 249, 235, .14),
    0 0 12px rgba(17, 204, 211, .08);
}

main > .transfer-information .transfer-extra-icon svg {
  width: 25px;
  height: 25px;
  display: block;
}

main > .transfer-information .transfer-extra-card h3 {
  color: #f4ffff;
}

main > .transfer-information .transfer-extra-card p {
  color: #bed5e5;
}

@media (max-width: 600px) {
  main > .transfer-information .transfer-extra-card {
    border-radius: 16px;
  }

  main > .transfer-information .transfer-extra-icon svg {
    width: 23px;
    height: 23px;
  }
}

@media (prefers-reduced-motion: reduce) {
  main > .transfer-information .transfer-extra-card {
    transition: none;
  }
}


/* OVIIGI TRANSFERT CARTES COMPACTES V461K */
@media (max-width: 600px) {

  main > .steps .steps-grid {
    gap: 9px !important;
  }

  main > .steps .step {
    padding: 15px 17px !important;
  }

  main > .steps .number {
    margin-bottom: 7px !important;
    font-size: 22px;
    line-height: 1.2;
  }

  main > .steps .step h3 {
    margin-bottom: 7px !important;
    font-size: 16px;
    line-height: 1.35;
  }

  main > .steps .step p {
    font-size: 13.5px;
    line-height: 1.5;
  }

}


/* OVIIGI TRANSFERT GRILLE EQUILIBREE V461M */
@media (min-width: 801px) {

  main > .steps .steps-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 16px;
  }

  main > .steps .steps-grid > .step {
    grid-column: span 2;
    min-width: 0;
  }

  main > .steps .steps-grid > .step:nth-child(4) {
    grid-column: 2 / span 2;
  }

  main > .steps .steps-grid > .step:nth-child(5) {
    grid-column: 4 / span 2;
  }

}
