/*
Theme Name: Moneeb Ahmed
Theme URI: https://moneebahmed.com
Author: Moneeb Ahmed
Description: Animated, playful and colourful personal-branding theme built for Moneeb Ahmed / SMA Trainings. Every heading, text, image, colour, service, course, FAQ and social link is editable from Appearance > Customize — no code needed. Includes loading animation, scroll-reveal animations, typewriter headline, animated counters and skill bars, marquee, tabs and FAQ accordion.
Version: 1.3.2
License: GNU General Public License v2 or later
Text Domain: moneeb-ahmed
Tags: customizer, one-column, custom-menu, featured-images
*/
:root{--purple:#6c3ce9;--pink:#ff4d8d;--orange:#ff8a00;--teal:#00b8a9;--blue:#2d9cdb;--yellow:#ffc91f;--ink:#232044;--muted:#5d5970;--cream:#fff9f1}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:'Poppins',system-ui,Arial,sans-serif;color:var(--ink);background:var(--cream);line-height:1.65;overflow-x:hidden}
h1,h2,h3,.logo{font-family:'Baloo 2','Poppins',sans-serif}
img{max-width:100%;height:auto;display:block}a{text-decoration:none;color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 22px;position:relative;z-index:2}
.btn{display:inline-block;padding:15px 30px;border-radius:999px;font-weight:700;font-size:15px;position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s;border:0;cursor:pointer;font-family:inherit}
.btn:hover{transform:translateY(-3px) scale(1.03)}
.btn::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:shine 3.2s infinite}
@keyframes shine{0%,60%{left:-80%}100%{left:160%}}
.btn-rainbow{background:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--teal),var(--blue),var(--purple),var(--pink));background-size:300% 100%;animation:gradMove 6s linear infinite;color:#fff;box-shadow:0 12px 26px rgba(255,77,141,.35)}
@keyframes gradMove{to{background-position:300% 0}}
.btn-white{background:#fff;color:var(--purple);box-shadow:0 12px 26px rgba(35,32,68,.18)}
.btn-purple{background:var(--purple);color:#fff;box-shadow:0 12px 26px rgba(108,60,233,.35)}
/* Preloader */
#loader{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#2b165f,#6c3ce9 55%,#ff4d8d);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;transition:opacity .7s,visibility .7s}
#loader.done{opacity:0;visibility:hidden}
.loader-name{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.loader-name span{font-family:'Baloo 2',sans-serif;font-size:clamp(30px,6vw,54px);font-weight:800;color:#fff;display:inline-block;animation:letterBounce 1s infinite}
.loader-name span:nth-child(odd){color:var(--yellow)}
@keyframes letterBounce{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-18px) rotate(-6deg)}60%{transform:translateY(4px) rotate(4deg)}}
.loader-sub{color:#e6dcff;font-weight:600;letter-spacing:3px;text-transform:uppercase;font-size:12px;animation:pulseText 1.2s ease-in-out infinite}
@keyframes pulseText{0%,100%{opacity:.45}50%{opacity:1}}
.loadbar{width:min(300px,70vw);height:10px;background:rgba(255,255,255,.22);border-radius:99px;overflow:hidden}
.loadbar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--yellow),var(--orange),var(--pink));animation:fillBar 1.6s ease forwards}
@keyframes fillBar{to{width:100%}}
.loader-rings{position:relative;width:74px;height:74px}
.loader-rings::before,.loader-rings::after{content:"";position:absolute;inset:0;border-radius:50%;border:5px solid transparent}
.loader-rings::before{border-top-color:var(--yellow);animation:spin .9s linear infinite}
.loader-rings::after{inset:12px;border-bottom-color:#fff;animation:spinRev 1.2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes spinRev{to{transform:rotate(-360deg)}}
/* Header */
#progress{position:fixed;top:0;left:0;height:5px;width:0;z-index:2000;background:linear-gradient(90deg,var(--pink),var(--orange),var(--yellow),var(--teal),var(--blue));border-radius:0 99px 99px 0}
body.admin-bar #progress{top:32px}
header.site-header{position:sticky;top:0;z-index:1000;background:rgba(255,249,241,.94);backdrop-filter:blur(8px);box-shadow:0 4px 24px rgba(35,32,68,.07);animation:dropIn .8s .9s both}
body.admin-bar header.site-header{top:32px}
@media(max-width:782px){body.admin-bar header.site-header{top:46px}}
@keyframes dropIn{from{transform:translateY(-100%);opacity:0}to{transform:none;opacity:1}}
.nav{display:flex;align-items:center;justify-content:space-between;padding:13px 22px;gap:16px}
.logo{font-size:clamp(19px,5.4vw,23px);font-weight:800;color:var(--ink);line-height:1.15;min-width:0;flex:0 1 auto;overflow-wrap:break-word}.logo b{color:var(--pink)}
.logo small{display:block;font-family:'Poppins';font-size:10.5px;letter-spacing:3px;color:var(--muted);text-transform:uppercase;font-weight:600}
.logo-img{display:flex;align-items:center;min-width:0;flex:0 1 auto}
.logo-img img{height:54px;width:auto;max-width:min(290px,60vw);object-fit:contain}
@media(max-width:640px){.logo-img img{height:42px}}
.custom-logo-link{display:flex;align-items:center;min-width:0;flex:0 1 auto}
.custom-logo{max-height:58px;width:auto;max-width:min(330px,60vw);object-fit:contain}
@media(max-width:640px){.custom-logo{max-height:46px}}
nav.links ul{display:flex;gap:25px;list-style:none}nav.links a{font-weight:600;font-size:14.5px;position:relative;padding:4px 0;display:inline-block}
nav.links a::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:0;border-radius:99px;background:linear-gradient(90deg,var(--pink),var(--orange));transition:width .3s}
nav.links a:hover::after{width:100%}
.burger{display:none;background:none;border:0;font-size:27px;cursor:pointer}
@media(max-width:900px){nav.links{display:none;position:absolute;top:66px;left:0;right:0;background:#fff;padding:18px 22px;box-shadow:0 20px 30px rgba(0,0,0,.12)}nav.links.open{display:block}nav.links ul{flex-direction:column;gap:13px}.burger{display:block}.nav .btn{display:none}}
/* Hero */
.hero{position:relative;padding:76px 0 90px;background:linear-gradient(160deg,#fff3e2 0%,#ffe9f3 38%,#e9e4ff 72%,#dff6ff 100%);overflow:hidden}
.blob{position:absolute;border-radius:50%;opacity:.55;animation:blobFloat 9s ease-in-out infinite;z-index:1}
.blob.b1{width:340px;height:340px;background:#ffd66e;top:-110px;left:-90px}
.blob.b2{width:260px;height:260px;background:#ff9ec4;bottom:-90px;right:6%;animation-delay:-3s}
.blob.b3{width:150px;height:150px;background:#7fe3d8;top:16%;right:32%;animation-delay:-6s}
@keyframes blobFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(28px,-26px) scale(1.08)}66%{transform:translate(-20px,18px) scale(.94)}}
.shape{position:absolute;font-size:26px;animation:floaty 5s ease-in-out infinite;z-index:1}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-18px) rotate(10deg)}}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:44px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.hero h1{font-size:clamp(34px,5.2vw,58px);line-height:1.1;font-weight:800}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(34px) rotate(3deg);animation:wordIn .7s cubic-bezier(.2,1.4,.4,1) forwards;animation-delay:calc(1s + var(--i)*0.09s)}
@keyframes wordIn{to{opacity:1;transform:none}}
.grad-text{background:linear-gradient(90deg,var(--pink),var(--orange),var(--purple),var(--blue),var(--pink));background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradMove 5s linear infinite}
.rotator{color:var(--purple);border-bottom:5px solid var(--yellow);white-space:nowrap;display:inline-block;max-width:100%;vertical-align:bottom}
.caret{display:inline-block;width:3px;height:.95em;background:var(--pink);vertical-align:-2px;margin-left:2px;animation:blink .8s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero p.lead{font-size:17.5px;color:var(--muted);margin:22px 0 30px;max-width:540px;animation:fadeUp 1s 1.9s both}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;animation:fadeUp 1s 2.1s both}
@keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.stats{display:flex;gap:36px;margin-top:44px;flex-wrap:wrap;animation:fadeUp 1s 2.3s both}
.stat b{font-family:'Baloo 2';font-size:34px;display:block}.stat:nth-child(1) b{color:var(--pink)}.stat:nth-child(2) b{color:var(--orange)}.stat:nth-child(3) b{color:var(--teal)}
.stat span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1.2px;font-weight:600}
.hero-photo{position:relative;text-align:center;animation:zoomPop 1.1s 1.4s cubic-bezier(.2,1.3,.4,1) both}
@keyframes zoomPop{from{opacity:0;transform:scale(.8) rotate(-4deg)}to{opacity:1;transform:none}}
.hero-photo img{width:min(370px,86%);aspect-ratio:1/1.05;object-fit:cover;border-radius:38% 62% 55% 45%/48% 42% 58% 52%;border:6px solid #fff;box-shadow:0 28px 55px rgba(108,60,233,.28);margin:0 auto;background:#e7deff;animation:morph 10s ease-in-out infinite}
@keyframes morph{0%,100%{border-radius:38% 62% 55% 45%/48% 42% 58% 52%}50%{border-radius:55% 45% 40% 60%/45% 58% 42% 55%}}
.chip{position:absolute;background:#fff;border-radius:999px;padding:9px 17px;font-weight:700;font-size:13.5px;box-shadow:0 14px 28px rgba(35,32,68,.16);animation:floaty 4.5s ease-in-out infinite}
.chip.c1{top:9%;left:0;color:#d6336c}.chip.c2{top:34%;right:-4px;color:#e67700;animation-delay:-1.5s}.chip.c3{bottom:13%;left:2%;color:#009688;animation-delay:-3s}.chip.c4{bottom:-8px;right:12%;color:var(--purple);animation-delay:-2.2s}
@media(max-width:520px){.chip.c2{right:0}.chip{font-size:12px;padding:7px 13px}}
/* Marquee */
.marquee{background:var(--ink);color:#fff;overflow:hidden;padding:15px 0;transform:rotate(-1.2deg) scale(1.02)}
.marquee-track{display:flex;width:max-content;animation:marquee 24s linear infinite;font-family:'Baloo 2';font-weight:700;font-size:17px;white-space:nowrap}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.marquee-track span{padding:0 16px}.marquee-track .dot{color:var(--yellow)}
/* Reveal system */
.rv{opacity:0;transform:translateY(46px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.9,.3,1);transition-delay:var(--d,0s)}
.rv-left{opacity:0;transform:translateX(-64px);transition:all .95s cubic-bezier(.2,.9,.3,1);transition-delay:var(--d,0s)}
.rv-right{opacity:0;transform:translateX(64px);transition:all .95s cubic-bezier(.2,.9,.3,1);transition-delay:var(--d,0s)}
.rv-zoom{opacity:0;transform:scale(.78);transition:all .95s cubic-bezier(.2,1.25,.35,1);transition-delay:var(--d,0s)}
.rv-flip{opacity:0;transform:perspective(700px) rotateX(48deg) translateY(30px);transform-origin:bottom;transition:all 1s cubic-bezier(.2,.9,.3,1);transition-delay:var(--d,0s)}
.in{opacity:1!important;transform:none!important}
section{padding:84px 0;position:relative}section.alt{background:#fff}
.kicker{text-align:center;font-weight:800;letter-spacing:2.5px;text-transform:uppercase;font-size:13px}
h2.title{font-size:clamp(29px,3.8vw,42px);text-align:center;margin:10px 0 12px;font-weight:800}
.sub{color:var(--muted);text-align:center;max-width:650px;margin:0 auto 48px}
.grid{display:grid;gap:24px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
@media(max-width:980px){.g4{grid-template-columns:repeat(2,1fr)}.g3,.g2{grid-template-columns:1fr}}
@media(max-width:560px){.g4{grid-template-columns:1fr}}
.card{background:#fff;border-radius:22px;padding:30px 26px;box-shadow:0 10px 30px rgba(35,32,68,.07);border-top:7px solid var(--c,#ccc);transition:transform .3s,box-shadow .3s;will-change:transform}
.card:hover{box-shadow:0 24px 44px rgba(35,32,68,.14)}
.card .icon{width:60px;height:60px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:17px;background:#f3f0ff}
.card:hover .icon{animation:wiggle .6s ease}
@keyframes wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-13deg) scale(1.15)}60%{transform:rotate(11deg) scale(1.1)}}
.card h3{font-size:20px;margin-bottom:8px}.card p{color:var(--muted);font-size:14.8px}
.card a.more{font-weight:700;font-size:14px;color:var(--c);display:inline-block;margin-top:14px}
/* Skills */
.skill{margin-bottom:22px}.skill .top{display:flex;justify-content:space-between;font-weight:700;font-size:15px;margin-bottom:8px;gap:10px}
.skill .top span:last-child{color:var(--muted);white-space:nowrap}
.bar{height:14px;background:#eee9df;border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;width:0;border-radius:99px;background:var(--c);transition:width 1.5s cubic-bezier(.2,.9,.3,1) .2s}
.in .bar i{width:var(--w)}
.pills{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.pill{background:#fff;border:2px solid #f0e9ff;padding:8px 16px;border-radius:999px;font-size:13.5px;font-weight:600;transition:.25s}
.pill:hover{transform:translateY(-4px) rotate(-2deg);background:var(--purple);color:#fff;border-color:var(--purple)}
/* Tabs */
.tabs{display:flex;justify-content:center;gap:12px;margin-bottom:38px;flex-wrap:wrap}
.tab{padding:12px 28px;border-radius:999px;border:2.5px solid var(--purple);background:#fff;color:var(--purple);font-weight:700;font-family:inherit;font-size:15px;cursor:pointer;transition:.3s}
.tab.active{background:var(--purple);color:#fff;transform:scale(1.06);box-shadow:0 12px 24px rgba(108,60,233,.3)}
.tabpane{display:none}.tabpane.active{display:grid;animation:tabIn .65s cubic-bezier(.2,1.2,.4,1)}
@keyframes tabIn{from{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:none}}
/* Process */
.step{text-align:center}.step .num{width:62px;height:62px;margin:0 auto 16px;border-radius:50%;color:#fff;font-family:'Baloo 2';font-size:23px;font-weight:800;display:flex;align-items:center;justify-content:center;background:var(--c);animation:pulseRing 2.4s infinite}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(35,32,68,.18)}70%{box-shadow:0 0 0 16px transparent}100%{box-shadow:0 0 0 0 transparent}}
/* FAQ */
.faq{max-width:780px;margin:0 auto}
.faq-item{background:#fff;border-radius:16px;margin-bottom:13px;box-shadow:0 8px 22px rgba(35,32,68,.06);overflow:hidden}
.faq-q{width:100%;text-align:left;background:none;border:0;padding:19px 22px;font:inherit;font-weight:700;font-size:15.5px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--ink)}
.faq-q .arr{transition:transform .4s;font-size:19px;color:var(--pink)}
.faq-item.open .arr{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .5s ease}
.faq-a p{padding:0 22px 19px;color:var(--muted);font-size:14.8px}
/* CTA / contact / form */
.cta{border-radius:28px;padding:58px 30px;text-align:center;color:#fff;background:linear-gradient(120deg,var(--purple),var(--pink),var(--orange),var(--purple));background-size:280% 100%;animation:gradMove 9s linear infinite;box-shadow:0 26px 50px rgba(255,77,141,.28)}
.cta h2{font-size:clamp(27px,3.6vw,40px);margin-bottom:12px}.cta p{max-width:540px;margin:0 auto 28px;color:#ffeef6}
form.contact-form{display:grid;gap:15px}form.contact-form .row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
@media(max-width:640px){form.contact-form .row{grid-template-columns:1fr}}
label{font-size:13.5px;font-weight:700;display:block;margin-bottom:6px}
input[type=text],input[type=email],input[type=tel],textarea,select{width:100%;padding:14px 16px;border:2px solid #e6e0f5;border-radius:13px;font:inherit;font-size:15px;background:#fff;transition:.25s}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 4px rgba(255,77,141,.14)}
.form-note{padding:16px 20px;border-radius:14px;font-weight:600;margin-bottom:22px}
.form-note.ok{background:#e6fbf4;border:1.5px solid var(--teal);color:#056b5e}
.form-note.err{background:#ffeef3;border:1.5px solid var(--pink);color:#a11344}
.hp{position:absolute;left:-9999px;opacity:0;height:0}
/* Footer */
footer.site-footer{background:var(--ink);color:#c9c4e8;padding:46px 0 26px}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.13);align-items:flex-start}
footer.site-footer a:hover{color:var(--yellow)}
.foot ul{list-style:none;display:flex;gap:22px;flex-wrap:wrap}
.socials{display:flex;gap:12px;margin-top:14px}
.socials a{width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:18px;transition:.25s}
.socials a:hover{background:var(--pink);transform:translateY(-4px)}
.copy{text-align:center;font-size:13.5px;padding-top:20px}
#toTop{position:fixed;right:20px;bottom:20px;width:52px;height:52px;border-radius:50%;border:0;background:linear-gradient(135deg,var(--pink),var(--orange));color:#fff;font-size:21px;cursor:pointer;box-shadow:0 14px 28px rgba(255,77,141,.4);opacity:0;pointer-events:none;transition:.4s;z-index:900}
#toTop.show{opacity:1;pointer-events:auto;animation:floaty 3s ease-in-out infinite}
/* Inner pages & blog */
.page-hero{background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;padding:64px 0;text-align:center}
.page-hero h1{font-size:clamp(30px,4.5vw,46px)}
.page-hero .sub{color:#ffe3ef;margin-bottom:0}
.content-area{padding:64px 0}
.entry-content{max-width:820px;margin:0 auto;font-size:16.5px}
.entry-content p{margin-bottom:18px;color:#3c3852}
.entry-content h2,.entry-content h3{margin:28px 0 12px}
.entry-content ul{margin:0 0 18px 22px}
.post-card{background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 10px 28px rgba(35,32,68,.08)}
.post-card .body{padding:24px}
.post-card h3{font-size:20px;margin-bottom:8px}
.post-card .meta{font-size:13px;color:var(--muted);margin-bottom:10px}
.post-card p{color:var(--muted);font-size:14.8px}
.pagination{display:flex;gap:10px;justify-content:center;margin-top:40px}
.pagination a,.pagination span{padding:10px 18px;border-radius:999px;background:#fff;font-weight:700;box-shadow:0 6px 16px rgba(35,32,68,.08)}
.pagination .current{background:var(--purple);color:#fff}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:640px){
.hero{padding:52px 0 64px}
.hero h1{font-size:33px;line-height:1.22}
.hero p.lead{font-size:16px}
.stats{gap:20px 26px;margin-top:34px}
.stat b{font-size:27px}
.logo small{letter-spacing:2px}
.chip.c2{right:0}
}
/* Menu dropdown (Services) */
nav.links ul li{position:relative}
nav.links ul .sub-menu{position:absolute;top:calc(100% + 6px);left:0;display:none;flex-direction:column;gap:2px;background:#fff;min-width:255px;padding:10px;border-radius:14px;box-shadow:0 22px 40px rgba(35,32,68,.16);z-index:1002;list-style:none}
nav.links ul li:hover>.sub-menu,nav.links ul li:focus-within>.sub-menu{display:flex}
nav.links ul .sub-menu a{display:block;padding:8px 12px;border-radius:9px;font-size:14px}
nav.links ul .sub-menu a:hover{background:#f6f2ff}
nav.links ul .sub-menu a::after{display:none}
@media(max-width:900px){nav.links ul .sub-menu{position:static;display:flex;box-shadow:none;min-width:0;padding:2px 0 8px 16px;background:transparent}}
/* Breadcrumbs (visible + matching schema) */
.crumbs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;font-weight:600;margin-bottom:16px;color:#e6dcff}
.crumbs a{color:#ffd66e}
.crumbs .sep{opacity:.6}
.page-hero .crumbs{color:#e6dcff}
/* Footer services column */
footer.site-footer .foot>ul{flex-direction:column;gap:9px}
footer.site-footer .sub-menu{display:none!important}
.foot h4{color:#fff;font-family:'Baloo 2';font-size:17px;margin-bottom:12px}
.foot .svc-col ul{flex-direction:column;gap:8px}
/* Blog cards: H2 titles (heading hierarchy) */
.post-card h2.post-card-title{font-size:20px;margin-bottom:8px;font-family:'Baloo 2'}
/* Author authority box on posts */
.author-box{display:flex;gap:20px;align-items:center;background:#fff;border-radius:20px;padding:24px;box-shadow:0 10px 28px rgba(35,32,68,.08);margin-top:44px}
.author-box img{width:92px;height:92px;border-radius:50%;object-fit:cover;flex:none}
@media(max-width:560px){.author-box{flex-direction:column;text-align:center}}
.post-navigation{display:flex;justify-content:space-between;gap:14px;margin-top:30px;font-weight:700;font-size:14.5px}
/* Inner service / courses / contact pages */
.svc-list{display:grid;gap:14px;margin:6px 0 0;padding:0;list-style:none}
.svc-list li{background:#fff;border-radius:14px;padding:15px 18px 15px 46px;position:relative;box-shadow:0 8px 20px rgba(35,32,68,.06);font-weight:600;font-size:15px}
.svc-list li::before{content:"\2713";position:absolute;left:15px;top:13px;width:22px;height:22px;border-radius:50%;background:var(--teal);color:#fff;font-size:13px;display:flex;align-items:center;justify-content:center;font-weight:800}
.svc-links{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:10px}
.svc-links a{background:#fff;border:2px solid #f0e9ff;padding:9px 18px;border-radius:999px;font-size:14px;font-weight:700;transition:.25s}
.svc-links a:hover{background:var(--purple);color:#fff;border-color:var(--purple);transform:translateY(-3px)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001s!important;transition-duration:.001s!important}}