/*
Template: services.css
Version: 1.0.0
Author: Perspective3 Studio
*/

/* Section: Services (hero, packages, descriptions, CTA) */
 :root { --p3s-white:#f8f9ff; --p3s-ink:#1d2347; --p3s-soft-ink:#4a4f71; --p3s-border:rgba(76, 88, 153, 0.24); --p3s-blue:#4f8dff; --p3s-violet:#7f4fff; --p3s-magenta:#d745cb; --p3s-dark-a:#081530; --p3s-dark-b:#171437; --p3s-radius:16px; --p3s-header-h:86px; }
body { background:radial-gradient(1200px 800px at 70% 10%, rgba(90, 30, 130, 0.55), transparent 55%), radial-gradient(900px 700px at 35% 30%, rgba(0, 120, 190, 0.35), transparent 60%), linear-gradient(90deg, #061828 0%, #071c2a 55%, #1a1430 100%); }
.p3s-services { color:var(--p3s-white); padding-bottom:90px; }
body.page-template-page-services .p3s-services { margin-top:calc(-1 * var(--p3s-header-h)); }
body.page-template-page-services .p3s-services__hero { padding-top:var(--p3s-header-h); }
body.admin-bar.page-template-page-services { --p3s-header-h:118px; }
body.page-template-page-services .site-header { position:relative; z-index:30; background:rgba(8, 19, 47, 0.34); backdrop-filter:blur(6px); border-bottom:1px solid rgba(255, 255, 255, 0.12); }
.p3s-services__hero { width:100vw; margin-left:calc(50% - 50vw); min-height:clamp(420px, 56vw, 560px); position:relative; background-size:cover; background-position:center; overflow:hidden; }
.p3s-services__hero::before { position:absolute; inset:0; content:''; background:radial-gradient(circle at 12% 28%, rgba(255, 255, 255, 0.25) 0.6px, transparent 1.4px), radial-gradient(circle at 78% 18%, rgba(255, 255, 255, 0.22) 0.7px, transparent 1.6px), radial-gradient(circle at 62% 66%, rgba(255, 255, 255, 0.2) 0.6px, transparent 1.3px), radial-gradient(1100px 540px at 80% 10%, rgba(233, 98, 221, 0.34), transparent 64%), radial-gradient(900px 520px at 20% 100%, rgba(104, 148, 255, 0.24), transparent 65%); background-size:auto, auto, auto, auto, auto; pointer-events:none; }
.p3s-services__hero::after { content:''; position:absolute; inset:0; background-image:radial-gradient(rgba(255, 255, 255, 0.12) 0.8px, transparent 0.8px); background-size:3px 3px; opacity:0.26; mix-blend-mode:screen; pointer-events:none; }
.p3s-services__hero-inner { position:absolute; bottom:4vh; left:50%; transform:translateX(-50%); z-index:1; width:min(1180px, calc(100% - 48px)); margin:0; padding:0 4vw; }
.p3s-services__kicker, .p3s-services__lead, .p3s-services h1, .p3s-services h2, .p3s-services h3, .p3s-services p { margin:0; }
.p3s-services__kicker { display:inline-block; position:relative; padding-left:18px; font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:rgba(248, 249, 255, 0.84); }
.p3s-services__kicker::before { content:''; position:absolute; left:0; top:7px; width:6px; height:6px; border-radius:999px; background:#00d1b2; box-shadow:0 0 0 4px rgba(0, 209, 178, 0.14); }
.p3s-services__kicker::after { content:''; position:absolute; left:-14vw; top:8px; width:14vw; height:2px; border-radius:999px; background:linear-gradient( 90deg, rgba(46, 91, 255, 0) 0%, rgba(46, 91, 255, 0.55) 35%, rgba(0, 209, 178, 0.75) 100% ); opacity:0.95; }
.p3s-services h1 { margin:2vh 0; font-size:clamp(34px, 5.3vw, 66px); line-height:1.05; letter-spacing:-0.02em; max-width:80vw; }
.p3s-services__lead { margin-top:18px; max-width:52ch; line-height:1.8; color:rgba(248, 249, 255, 0.86); font-size:clamp(15px, 1.2vw, 19px); }
.p3s-services__btn { display:inline-flex; align-items:center; justify-content:center; margin-top:26px; min-height:50px; padding:0 32px; border-radius:11px; border:1px solid rgba(255, 255, 255, 0.42); color:var(--p3s-white); text-decoration:none; font-weight:600; font-size:27px; background:rgba(16, 30, 70, 0.22); backdrop-filter:blur(2px); }
.p3s-services__packages { position:relative; width:100vw; margin-left:calc(50% - 50vw); padding:clamp(56px, 7vw, 88px) 0; color:var(--p3s-ink); z-index:1; }
.p3s-services__packages::before { content:''; position:absolute; inset:0; z-index:-1; border-radius:0; background:radial-gradient(900px 380px at 95% 5%, rgba(206, 164, 255, 0.2), transparent 66%), radial-gradient(700px 350px at 5% 70%, rgba(154, 184, 255, 0.2), transparent 65%), linear-gradient(180deg, rgba(247, 245, 255, 0.62) 0%, rgba(239, 235, 255, 0.62) 100%); }
.p3s-services__packages .p3s-services__section-head, .p3s-services__packages .p3s-services__package-grid { width:min(1180px, calc(100% - 48px)); margin-left:auto; margin-right:auto; }
.p3s-services__section-head--center { text-align:center; }
.p3s-services h2 { font-size:clamp(34px, 4.3vw, 55px); line-height:1.08; letter-spacing:-0.02em; }
.p3s-services__section-head p { margin-top:12px; color:var(--p3s-soft-ink); font-size:clamp(16px, 1.25vw, 24px); line-height:1.7; }
.p3s-services__package-grid { margin-top:clamp(30px, 4vw, 44px); display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(18px, 2.3vw, 28px); }
.p3s-services__package-card { --bullet-1:#6ecbff; --bullet-2:#62b4ff; --bullet-3:#7098ff; --bullet-4:#857cff; --bullet-5:#9d66ff; border-radius:10px; border:1px solid var(--p3s-border); background:linear-gradient(180deg, rgba(249, 249, 255, 0.98), rgba(242, 241, 255, 0.96)); overflow:hidden; box-shadow:0 20px 42px rgba(77, 53, 151, 0.2), 0 4px 10px rgba(34, 24, 75, 0.08); }
.p3s-services__package-head { position:relative; padding:28px 24px 24px; color:#fff; text-align:center; background:radial-gradient(700px 260px at 85% 0%, rgba(255, 255, 255, 0.2), transparent 60%), linear-gradient(112deg, #3e73df 0%, #6c47df 50%, #c94ec5 100%); }
.p3s-services__package-head::before { content:''; position:absolute; inset:0; background-image:radial-gradient(circle at 8% 16%, rgba(255, 255, 255, 0.92) 0 1.2px, transparent 2px), radial-gradient(circle at 19% 42%, rgba(255, 255, 255, 0.7) 0 0.9px, transparent 1.8px), radial-gradient(circle at 31% 25%, rgba(255, 255, 255, 0.82) 0 1.1px, transparent 1.9px), radial-gradient(circle at 43% 64%, rgba(255, 255, 255, 0.62) 0 0.8px, transparent 1.7px), radial-gradient(circle at 56% 22%, rgba(255, 255, 255, 0.9) 0 1.2px, transparent 2px), radial-gradient(circle at 68% 51%, rgba(255, 255, 255, 0.75) 0 1px, transparent 1.8px), radial-gradient(circle at 79% 34%, rgba(255, 255, 255, 0.82) 0 1.1px, transparent 1.9px), radial-gradient(circle at 91% 18%, rgba(255, 255, 255, 0.7) 0 0.9px, transparent 1.8px), radial-gradient(circle at 14% 76%, rgba(255, 255, 255, 0.66) 0 0.8px, transparent 1.7px), radial-gradient(circle at 37% 82%, rgba(255, 255, 255, 0.78) 0 1px, transparent 1.8px), radial-gradient(circle at 62% 78%, rgba(255, 255, 255, 0.72) 0 0.9px, transparent 1.8px), radial-gradient(circle at 86% 74%, rgba(255, 255, 255, 0.86) 0 1.1px, transparent 1.9px); opacity:0.62; pointer-events:none; animation:p3sStarDrift 9s ease-in-out infinite alternate; }
.p3s-services__package-head::after { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(220px 90px at 18% 20%, rgba(255, 255, 255, 0.14), transparent 70%), radial-gradient(240px 100px at 74% 32%, rgba(255, 255, 255, 0.12), transparent 72%); mix-blend-mode:screen; animation:p3sStarTwinkle 5.2s ease-in-out infinite alternate; }
.p3s-services__package-card:nth-child(1) .p3s-services__package-head { background:radial-gradient(700px 260px at 85% 0%, rgba(255, 255, 255, 0.2), transparent 60%), linear-gradient(112deg, #5a9bff 0%, #4d6ce0 58%, #4353c7 100%); }
.p3s-services__package-card:nth-child(2) .p3s-services__package-head { background:radial-gradient(700px 260px at 85% 0%, rgba(255, 255, 255, 0.2), transparent 60%), linear-gradient(112deg, #3f79ec 0%, #7252ea 62%, #8746dc 100%); }
.p3s-services__package-card:nth-child(3) .p3s-services__package-head { background:radial-gradient(700px 260px at 85% 0%, rgba(255, 255, 255, 0.2), transparent 60%), linear-gradient(112deg, #8652e8 0%, #b64fd4 55%, #d949bf 100%); }
.p3s-services__package-card:nth-child(2) { --bullet-1:#6e74ff; --bullet-2:#7b6eff; --bullet-3:#8a68ff; --bullet-4:#9a61ff; --bullet-5:#a95aff; }
.p3s-services__package-card:nth-child(3) { --bullet-1:#bf68e5; --bullet-2:#c45edc; --bullet-3:#cb57d5; --bullet-4:#d14ece; --bullet-5:#d845c6; }
.p3s-services__package-head h3 { font-size:clamp(28px, 2.7vw, 38px); }
.p3s-services__price { margin-top:8px; font-size:clamp(36px, 3.4vw, 50px); line-height:1.1; font-weight:700; }
.p3s-services__package-body { padding:28px 24px 24px; }
.p3s-services__package-body ul { list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.p3s-services__package-body li { color:#3f456b; font-size:18px; line-height:1.5; position:relative; padding-left:19px; }
.p3s-services__package-body li::before { content:''; position:absolute; left:0; top:11px; width:8px; height:8px; border-radius:999px; background:var(--bullet-1); box-shadow:0 0 0 3px rgba(255, 255, 255, 0.55); }
.p3s-services__package-body li:nth-child(2)::before { background:var(--bullet-2); }
.p3s-services__package-body li:nth-child(3)::before { background:var(--bullet-3); }
.p3s-services__package-body li:nth-child(4)::before { background:var(--bullet-4); }
.p3s-services__package-body li:nth-child(5)::before { background:var(--bullet-5); }
.p3s-services__btn--solid:not(.btn-official) { margin-top:24px; width:100%; font-size:19px; background:linear-gradient(90deg, #4677e7, #843dd8); border:0; border-radius:13px; }
.p3s-services__package-card:nth-child(3) .p3s-services__btn--solid:not(.btn-official) { background:linear-gradient(90deg, #8b45e8, #d643bc); }
.p3s-services__package-body .btn-official { margin-top:24px; }
.p3s-services__info { width:100vw; margin-left:calc(50% - 50vw); margin-top:0; padding:clamp(56px, 8vw, 92px) 0; background:transparent; }
.p3s-services__info .p3s-services__section-head { width:min(1180px, calc(100% - 48px)); margin:0 auto; }
.p3s-services__info .p3s-services__section-head h2 { color:var(--p3s-white); }
.p3s-services__info .p3s-services__section-head p { color:rgba(248, 249, 255, 0.78); }
.p3s-services__info-grid { width:min(1180px, calc(100% - 48px)); margin:clamp(28px, 4vw, 40px) auto 0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:clamp(16px, 1.8vw, 22px); }
.p3s-services__info-card { border:1px solid rgba(248, 249, 255, 0.15); border-radius:var(--p3s-radius); padding:24px; background:rgba(13, 32, 71, 0.42); }
.p3s-services__icon { width:50px; height:50px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; background:rgba(115, 146, 255, 0.24); border:1px solid rgba(145, 183, 255, 0.4); color:#d9e8ff; font-size:18px; font-weight:700; }
.p3s-services__info-card h3 { margin-top:14px; color:var(--p3s-white); font-size:30px; }
.p3s-services__info-card p { margin-top:10px; color:rgba(248, 249, 255, 0.78); line-height:1.65; font-size:17px; }
body.page-template-page-services { --p3s-header-h:108px; }
body.admin-bar.page-template-page-services { --p3s-header-h:140px; }
.p3s-services__hero-inner { top:calc(var(--p3s-header-h) + 20px); bottom:auto; }
.p3s-services__package-card { border-radius:10px; border:1px solid var(--p3s-border); background:linear-gradient(180deg, rgba(249, 249, 255, 0.98), rgba(242, 241, 255, 0.96)); box-shadow:0 20px 42px rgba(77, 53, 151, 0.16), 0 4px 10px rgba(34, 24, 75, 0.08); padding:22px; overflow:visible; }
.p3s-services__package-head { padding:0; text-align:left; color:inherit; background:transparent; }
.p3s-services__package-head::before, .p3s-services__package-head::after { display:none; }
.p3s-services__package-head h3 { margin-top:0; font-size:31px; color:#21274d; }
.p3s-services__price { margin-top:8px; font-size:clamp(34px, 3vw, 44px); line-height:1.1; font-weight:700; color:#21274d; }
.p3s-services__package-body { padding:16px 0 0; }
.p3s-services__package-body ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.p3s-services__package-body li { margin-top:0; color:#434a73; line-height:1.65; font-size:17px; position:relative; padding-left:18px; }
.p3s-services__package-body li::before { content:''; position:absolute; left:0; top:11px; width:7px; height:7px; border-radius:999px; background:#5f86f2; box-shadow:none; }
.p3s-services__package-body li:nth-child(2)::before, .p3s-services__package-body li:nth-child(3)::before, .p3s-services__package-body li:nth-child(4)::before, .p3s-services__package-body li:nth-child(5)::before { background:#5f86f2; }
.p3s-services__package-body .btn-official { margin-top:18px; }
.p3s-services__package-grid { counter-reset:p3sPackage; }
.p3s-services__package-card { counter-increment:p3sPackage; border-radius:10px; border:1px solid var(--p3s-border); background:linear-gradient(180deg, rgba(249, 249, 255, 0.98), rgba(242, 241, 255, 0.96)); box-shadow:0 20px 42px rgba(77, 53, 151, 0.16), 0 4px 10px rgba(34, 24, 75, 0.08); padding:22px; }
.p3s-services__package-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:0; background:transparent; color:inherit; }
.p3s-services__package-head::before { content:counter(p3sPackage); width:42px; height:42px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; color:#2a2f52; font-size:24px; font-weight:700; border:1px solid rgba(92, 108, 193, 0.35); background:rgba(108, 132, 230, 0.09); box-shadow:none; position:static; animation:none; }
.p3s-services__package-head::after { display:none; }
.p3s-services__price { margin:0; padding:10px 14px; border-radius:14px; border:1px solid rgba(145, 183, 255, 0.4); background:rgba(110, 142, 255, 0.14); color:#3456bf; font-size:18px; font-weight:700; line-height:1; letter-spacing:0.02em; white-space:nowrap; }
.p3s-services__package-head h3 { order:2; flex-basis:100%; margin-top:14px; font-size:31px; color:#21274d; }
.p3s-services__package-body { padding:10px 0 0; }
.p3s-services__package-desc { margin:0 0 12px; color:#434a73; line-height:1.65; font-size:17px; }
.p3s-services__package-body ul { list-style:disc; margin:0; padding-left:18px; }
.p3s-services__package-body li { color:#434a73; line-height:1.65; font-size:17px; padding-left:0; }
.p3s-services__package-body li + li { margin-top:6px; }
.p3s-services__package-body li::marker { color:#6f84ea; }
.p3s-services__package-body li::before, .p3s-services__package-body li:nth-child(2)::before, .p3s-services__package-body li:nth-child(3)::before, .p3s-services__package-body li:nth-child(4)::before, .p3s-services__package-body li:nth-child(5)::before { content:none; display:none; }
.p3s-services__package-body .btn-official { margin-top:18px; }
.p3s-services__package-card:nth-child(1) .p3s-services__package-head, .p3s-services__package-card:nth-child(2) .p3s-services__package-head, .p3s-services__package-card:nth-child(3) .p3s-services__package-head { background:transparent; }

/* Section: Animations services (interactions et highlights) */
@keyframes p3sStarDrift { 0% { transform:translate3d(0, 0, 0) scale(1); }100% { transform:translate3d(-10px, 7px, 0) scale(1.015); } }
@keyframes p3sStarTwinkle { 0% { opacity:0.35; }100% { opacity:0.82; } }

/* Media queries : desktop (larges ecrans et interactions souris) */
@media (prefers-reduced-motion:reduce) { .p3s-services__package-head::before, .p3s-services__package-head::after { animation:none; } }

/* Media queries : tablet (tablettes et ecrans intermediaires) */
@media (max-width:1100px) { :root { --p3s-header-h:116px; }body.admin-bar.page-template-page-services { --p3s-header-h:146px; } }
@media (max-width:1100px) { .p3s-services__package-body li, .p3s-services__info-card p { font-size:16px; }.p3s-services__info-card h3 { font-size:24px; } }
@media (max-width:900px) { body.page-template-page-services { --p3s-header-h:74px; }body.admin-bar.page-template-page-services { --p3s-header-h:104px; }.p3s-services__hero-inner, .p3s-services__info .p3s-services__section-head, .p3s-services__info-grid { width:min(1180px, calc(100% - 28px)); }.p3s-services__packages .p3s-services__section-head, .p3s-services__packages .p3s-services__package-grid { width:min(1180px, calc(100% - 28px)); }.p3s-services__package-grid, .p3s-services__info-grid { grid-template-columns:1fr; }.p3s-services__btn, .p3s-services__btn--solid { width:100%; }.p3s-services__btn { font-size:20px; }.p3s-services__package-body li, .p3s-services__info-card p { font-size:15px; } }
@media (max-width:1100px) { body.page-template-page-services { --p3s-header-h:94px; }body.admin-bar.page-template-page-services { --p3s-header-h:126px; } }
@media (max-width:1100px) { .p3s-services__hero { min-height:auto; }.p3s-services__hero-inner { position:relative; left:auto; top:auto; bottom:auto; transform:none; width:min(1180px, calc(100% - 28px)); margin:0 auto; padding:calc(var(--p3s-header-h) + 20px) 4vw 24px; } }

/* Media queries : mobile (petits ecrans) */
@media (max-width:640px) { body.page-template-page-services { --p3s-header-h:90px; }body.admin-bar.page-template-page-services { --p3s-header-h:136px; } }