/* OVIIGI PORTFOLIO CSS ISOLE V443H */
/* OVIIGI PORTFOLIO PREMIUM V442 */
.ov-portfolio,.ov-portfolio *,.ov-portfolio *:before,.ov-portfolio *:after{box-sizing:border-box}
/* Comportement global HTML exclu du composant */
.ov-portfolio{
 color:#fff;
 font-family:Arial,Helvetica,sans-serif;
}
.ov-portfolio{
 padding:48px 18px 64px;
 background:radial-gradient(ellipse at 50% 25%,#123e80,#06132b 70%);
}
.ov-shell{
 max-width:1220px;
 margin:auto;
 padding:42px 35px 38px;
 overflow:hidden;
 position:relative;
 border:1px solid #3074bf70;
 border-radius:28px;
 background:linear-gradient(145deg,#0a2248,#07172f 75%);
 box-shadow:0 24px 65px #0007,inset 0 0 50px #1465c51c;
}
.ov-heading{text-align:center}
.ov-eyebrow{
 color:#6ab7ff;
 letter-spacing:3px;
 font-size:12px;
 font-weight:700;
}
.ov-portfolio h1{
 font-size:clamp(25px,3.5vw,43px);
 margin:15px 0;
 line-height:1.18;
}
.ov-heading p{
 color:#c0d5ef;
 font-size:15px;
 margin:0 auto;
 max-width:680px;
 line-height:1.6;
}
.ov-stage{
 position:relative;
 display:flex;
 justify-content:center;
 align-items:center;
 min-height:440px;
 margin:28px 0 8px;
 isolation:isolate;
}
.ov-glow{
 position:absolute;
 width:65%;
 height:65%;
 border-radius:50%;
 background:#166aff55;
 filter:blur(75px);
 z-index:-1;
}
.ov-monitor{
 width:min(66%,690px);
 min-width:0;
 position:relative;
 z-index:3;
 filter:drop-shadow(0 22px 25px #0009);
}
.ov-screen{
 padding:9px;
 border:2px solid #42608c;
 border-radius:15px 15px 7px 7px;
 background:#07101e;
 box-shadow:inset 0 0 0 1px #8aa8cc55;
}
.ov-screen iframe{
 display:block;
 width:100%;
 height:310px;
 border:0;
 border-radius:5px;
 background:#102a50;
 pointer-events:none;
}
.ov-stand{
 width:21%;
 height:33px;
 margin:auto;
 background:linear-gradient(90deg,#213a5b,#6983a3,#213a5b);
 clip-path:polygon(35% 0,65% 0,78% 100%,22% 100%);
}
.ov-foot{
 width:39%;
 height:10px;
 margin:auto;
 border-radius:50% 50% 8px 8px;
 background:#7e9ab7;
}
.ov-side{
 position:absolute;
 width:30%;
 max-width:300px;
 opacity:.52;
 transform:scale(.83);
 filter:brightness(.75);
 z-index:1;
}
.ov-side.left{left:-4%}
.ov-side.right{right:-4%}
.ov-side .ov-screen iframe{height:230px}
.ov-phone{
 position:absolute;
 right:15%;
 bottom:18px;
 z-index:5;
 width:118px;
 padding:7px;
 border:3px solid #7798be;
 border-radius:22px;
 background:#07101e;
 box-shadow:0 14px 28px #000b;
}
.ov-phone:before{
 content:"";
 display:block;
 width:35px;
 height:5px;
 margin:1px auto 6px;
 border-radius:9px;
 background:#a1bad5;
}
.ov-phone iframe{
 display:block;
 width:100%;
 height:206px;
 border:0;
 border-radius:11px;
 background:#102a50;
 pointer-events:none;
}
.ov-nav{
 position:absolute;
 z-index:7;
 top:43%;
 border:1px solid #63aeff77;
 border-radius:50%;
 width:42px;
 height:42px;
 background:#0b2c58eb;
 color:white;
 font-size:26px;
 cursor:pointer;
}
.ov-prev{left:0}
.ov-next{right:0}
.ov-nav:hover,.ov-nav:focus-visible{
 background:#1764bb;
 outline:2px solid #8acaff;
}
.ov-dots{
 display:flex;
 justify-content:center;
 gap:10px;
 margin:14px 0 22px;
}
.ov-dot{
 width:9px;
 height:9px;
 padding:0;
 border:0;
 border-radius:20px;
 background:#57718f;
 cursor:pointer;
}
.ov-dot[aria-current="true"]{
 width:30px;
 background:#47aaff;
}
.ov-cards{
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 gap:13px;
}
.ov-card{
 text-align:left;
 min-width:0;
 border:1px solid #2c598b;
 border-radius:15px;
 background:#0c2851;
 padding:18px 15px;
 color:white;
 cursor:pointer;
 transition:border-color .2s,transform .2s,background .2s;
}
.ov-card:hover{transform:translateY(-3px)}
.ov-card[aria-pressed="true"]{
 border-color:#53b5ff;
 background:#11386c;
 box-shadow:inset 0 0 25px #258aff1b;
}
.ov-card strong{
 display:block;
 font-size:14px;
 margin:8px 0;
}
.ov-card small{
 display:block;
 font-size:12px;
 line-height:1.5;
 color:#b8cce6;
}
.ov-card .symbol{font-size:25px;color:#6fc2ff}
.ov-caption{
 text-align:center;
 color:#90b0d4;
 font-size:12px;
 margin:18px 0 0;
}
.ov-live{
 position:absolute;
 width:1px;
 height:1px;
 overflow:hidden;
 clip-path:inset(50%);
}
@media(max-width:850px){
 .ov-shell{padding:35px 18px}
 .ov-stage{min-height:340px}
 .ov-monitor{width:75%}
 .ov-screen iframe{height:245px}
 .ov-side{width:31%}
 .ov-side .ov-screen iframe{height:180px}
 .ov-phone{right:8%;width:95px}
 .ov-phone iframe{height:158px}
 .ov-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
 .ov-portfolio{padding:24px 10px 36px}
 .ov-shell{padding:28px 13px 24px;border-radius:19px}
 .ov-heading p{font-size:13px}
 .ov-stage{min-height:280px;margin-top:22px}
 .ov-monitor{width:87%}
 .ov-screen{padding:5px}
 .ov-screen iframe{height:205px}
 .ov-side{display:none}
 .ov-phone{
  right:1%;
  bottom:15px;
  width:75px;
  padding:4px;
  border-radius:15px;
 }
 .ov-phone iframe{height:119px}
 .ov-nav{width:31px;height:31px;font-size:20px}
 .ov-prev{left:0}
 .ov-next{right:0}
 .ov-cards{gap:9px}
 .ov-card{padding:13px 10px}
 .ov-card strong{font-size:12px}
 .ov-card small{font-size:11px}
}
@media(prefers-reduced-motion:reduce){
 .ov-portfolio,.ov-portfolio *,.ov-portfolio *:before,.ov-portfolio *:after{
  scroll-behavior:auto!important;
  transition:none!important;
 }
}

/* OVIIGI PORTFOLIO CADRAGE V442 */
.ov-screen iframe,
.ov-phone iframe {
 transform-origin:top left;
 max-width:none;
}
