/* ERYX MAROC | intégration premium, structure et optimisation web. */
/* =========================================================
   Sections principales : hero, à propos, certifications,
   services, domaines, méthode, références, portfolio, contact.
   ========================================================= */
.hero{background:radial-gradient(circle at 15% 10%,rgba(10,123,69,.13),transparent 35%),linear-gradient(180deg,#fff 0%,#f3fbf6 100%)}
.hero-actions,.trust-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.hero-actions{margin-top:26px}.trust-row{margin-top:26px;color:#547064;font-weight:700;font-size:.9rem}.trust-row span{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:#fff}
.hero-visual{position:relative;min-height:500px}.hero-showcase{position:relative;min-height:500px;border-radius:var(--radius-lg);overflow:hidden;background:#071f17;border:1px solid rgba(10,123,69,.12);box-shadow:var(--shadow);transform:perspective(1000px) rotateY(-4deg) rotateX(2deg)}
.hero-slide{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .65s var(--ease),transform .75s var(--ease);pointer-events:none}.hero-slide.is-active{opacity:1;transform:none;pointer-events:auto}.hero-slide img{width:100%;height:100%;object-fit:cover;filter:saturate(1.04)}.hero-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,31,23,.04) 0%,rgba(7,31,23,.78) 100%)}
.hero-slide-caption{position:absolute;left:28px;right:28px;bottom:96px;z-index:1;padding:20px;border-radius:24px;color:#fff;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}.hero-slide-caption h3{margin:12px 0 4px;color:#fff}.hero-slide-caption strong{display:block;color:#d9f7e5;margin-bottom:8px}.hero-slide-caption p{color:#eaf8ef;font-size:.95rem;margin:0}.hero-dots{right:26px;top:24px;bottom:auto;z-index:2}
.video-card{position:absolute;left:24px;bottom:24px;z-index:3;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.56);border-radius:20px;padding:14px 18px;color:#fff;background:rgba(7,31,23,.64);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 20px 50px rgba(7,31,23,.22)}.video-card span{width:40px;height:40px;border-radius:50%;background:var(--green);display:grid;place-items:center}.video-card .icon{width:18px;height:18px}
.glass-panel{padding:32px;border-radius:var(--radius-lg);background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.74);box-shadow:var(--shadow-soft);backdrop-filter:blur(18px)}.clean-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}.clean-list li{display:flex;align-items:center;gap:10px;font-weight:700;color:#244236}.clean-list .icon{width:18px;height:18px;color:var(--green)}
.cert-grid{grid-template-columns:.9fr 1.1fr}.cert-slider{position:relative;min-height:520px;border-radius:var(--radius-lg);background:linear-gradient(135deg,#f6fcf8,#fff);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}.cert-card{position:absolute;inset:0;padding:22px;display:grid;grid-template-rows:1fr auto;opacity:0;transform:translateX(26px);pointer-events:none;transition:opacity .55s var(--ease),transform .55s var(--ease)}.cert-card.is-active{opacity:1;transform:none;pointer-events:auto}.cert-card img{width:100%;height:300px;object-fit:cover;border-radius:24px;border:1px solid rgba(10,123,69,.12)}.cert-card-body{padding:20px 4px 10px}.cert-card-body h3{margin:12px 0 4px}.cert-card-body strong{display:block;color:var(--green);font-size:.92rem;margin-bottom:8px}.cert-card-body p{font-size:.96rem}.slider-dots{position:absolute;right:24px;bottom:22px;display:flex;gap:8px}.slider-dots button{width:9px;height:9px;border:0;border-radius:999px;background:#b6d9c6;transition:.25s}.slider-dots button.is-active{width:28px;background:var(--green)}
.flip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.flip-card{height:330px;perspective:1100px}.flip-card-inner{position:relative;width:100%;height:100%;transition:transform .75s var(--ease);transform-style:preserve-3d}.flip-card:hover .flip-card-inner,.flip-card:focus-within .flip-card-inner{transform:rotateY(180deg)}.flip-card-face{position:absolute;inset:0;border-radius:26px;overflow:hidden;backface-visibility:hidden;box-shadow:var(--shadow-soft)}.flip-front{padding:24px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;background-image:linear-gradient(180deg,rgba(7,31,23,.05),rgba(7,31,23,.78)),var(--card-image);background-size:cover;background-position:center;isolation:isolate;border:1px solid rgba(255,255,255,.22)}.flip-front::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(135deg,rgba(255,255,255,.24) 0%,rgba(255,255,255,.08) 34%,rgba(10,123,69,.14) 62%,rgba(7,31,23,.30) 100%);backdrop-filter:blur(1.8px) saturate(1.08);-webkit-backdrop-filter:blur(1.8px) saturate(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 -88px 96px rgba(7,31,23,.42);pointer-events:none}.flip-front .tag,.flip-front h3{position:relative;z-index:1}.flip-front .service-icon{z-index:1}.flip-front h3{color:#fff;margin:12px 0 0;text-shadow:0 10px 24px rgba(0,0,0,.32)}.service-icon{position:absolute;top:20px;left:20px;width:50px;height:50px;border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.28),rgba(255,255,255,.10));border:1px solid rgba(255,255,255,.34);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);display:grid;place-items:center}.service-icon .icon{width:25px;height:25px}.flip-back{padding:28px;background:#fff;transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:center;border:1px solid var(--line)}.flip-back p{font-size:.96rem}
.domain-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.domain-card{border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow-soft);overflow:hidden}.domain-card>img{width:100%;height:174px;object-fit:cover;background:#eaf8ef}.domain-card-body{padding:24px}.domain-card-body>span{width:48px;height:48px;border-radius:16px;background:var(--green-3);display:grid;place-items:center;color:var(--green);margin-bottom:18px}.domain-card .icon{width:24px;height:24px}
.method-section{background:radial-gradient(circle at 80% 0%,rgba(255,255,255,.25),transparent 30%),linear-gradient(135deg,#0a7b45,#07472f);color:#fff}.process-line{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:42px}.process-line:before{content:"";position:absolute;top:48px;left:12%;right:12%;height:4px;border-radius:999px;background:rgba(255,255,255,.22)}.process-progress{position:absolute;top:48px;left:12%;height:4px;border-radius:999px;background:#fff;box-shadow:0 0 28px rgba(255,255,255,.65);width:0;animation:processLoad 4s ease-in-out infinite}.process-step{position:relative;padding:30px;border-radius:26px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(16px);z-index:1}.process-step span{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#fff;color:var(--green);font-weight:900;margin-bottom:22px}.process-step h3,.process-step p{color:#fff}.process-step p{opacity:.86}@keyframes processLoad{0%{width:0}45%{width:38%}75%{width:76%}100%{width:76%}}
.references-section .section-head h2,.references-section .section-head p{color:#fff}.references-section .section-head p{opacity:.78}.reference-marquee{overflow:hidden;margin-top:34px}.marquee-track{display:flex;gap:18px;width:max-content;animation:marquee 32s linear infinite}.reference-card{width:280px;min-height:174px;padding:16px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);backdrop-filter:blur(12px);display:grid;gap:12px}.reference-card img{height:92px;width:100%;object-fit:cover;border-radius:16px}.reference-card strong{display:block;color:#fff;line-height:1.25}.reference-card span{color:#bce6cc;font-size:.88rem}@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.portfolio-marquee{overflow:hidden;margin-top:8px;padding:8px 0 22px}.portfolio-track{display:flex;gap:22px;width:max-content;animation:marquee 44s linear infinite}.portfolio-track:hover{animation-play-state:paused}.portfolio-card{width:330px;flex:0 0 330px;background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow-soft);overflow:hidden}.portfolio-media{position:relative;width:100%;border:0;padding:0;background:none}.portfolio-media img{width:100%;height:220px;object-fit:cover}.play-badge{position:absolute;right:16px;bottom:16px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(7,31,23,.65);backdrop-filter:blur(14px)}.play-badge .icon{width:20px;height:20px}.portfolio-body{padding:22px}.tag-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.contact-grid{align-items:start}.contact-section h2,.contact-section p,.contact-section .eyebrow{color:#fff}.contact-section .eyebrow{background:rgba(255,255,255,.12)}.contact-card{margin-top:26px;padding:24px;border-radius:24px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);display:grid;gap:10px;color:#fff}.contact-card a,.contact-card span{color:#fff;font-weight:800;display:flex;align-items:flex-start;gap:10px}.contact-card .icon{width:18px;height:18px;margin-top:3px;color:#c9f5d8}.contact-form{padding:30px;border-radius:28px;background:#fff;box-shadow:var(--shadow);display:grid;gap:18px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form label{display:grid;gap:8px;font-size:.9rem;font-weight:800;color:#223b31}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #d7e7de;border-radius:15px;padding:13px 14px;background:#fbfffc;color:var(--dark);outline:0;transition:.2s}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(10,123,69,.1)}.contact-form textarea{min-height:132px;resize:vertical}.phone-field{display:flex;border:1px solid #d7e7de;border-radius:15px;background:#fbfffc;overflow:hidden}.phone-field:focus-within{border-color:var(--green);box-shadow:0 0 0 4px rgba(10,123,69,.1)}.phone-field .prefix{display:flex;align-items:center;padding:0 13px;background:#eef8f2;border-right:1px solid #d7e7de;font-weight:900;white-space:nowrap}.phone-field input{border:0;border-radius:0;background:transparent;box-shadow:none!important}.hp-field{position:absolute!important;left:-9999px!important}.alert{padding:13px 15px;border-radius:14px;font-weight:700}.alert.success{background:#e8f8ee;color:#09643a}.alert.error{background:#fff0f0;color:#9b1c1c}

/* Bouton vidéo de la section À propos. */
.about-actions{margin-top:24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.about-actions .btn .icon{width:18px;height:18px}