*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:#18344b;font-family:"DM Sans",sans-serif}.wrap{width:min(1160px,calc(100% - 44px));margin:auto}a{text-decoration:none;color:inherit}.top{background:#0d263e;color:#d8e4ea;font-size:11px}.topin{height:36px;display:flex;justify-content:space-between;align-items:center}.top a{color:#8ce1b0}header{height:78px;position:sticky;top:0;background:#fff;z-index:5;border-bottom:1px solid #eaf0ef}.navrow{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand>b{background:#16a568;color:white;border-radius:10px;width:42px;height:42px;display:grid;place-items:center;font:800 17px Manrope}.brand strong,.brand small{display:block}.brand strong{font:800 14px Manrope;letter-spacing:.08em}.brand small{font-size:8px;color:#82929a;letter-spacing:.1em;margin-top:4px}nav{display:flex;align-items:center;gap:30px;font-size:12px;font-weight:700;color:#506777}nav a:hover{color:#16a568}.navbtn{background:#102b46;color:white;padding:13px 17px;border-radius:5px}#menu{display:none}.hero{background:linear-gradient(120deg,#f4faf6,#edf3f6);padding:88px 0 75px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:60px}.eyebrow{color:#16a568;font-size:10px;font-weight:800;letter-spacing:.16em}.hero h1,.section h2{font:800 clamp(37px,4.5vw,58px)/1.12 Manrope;letter-spacing:-.055em;color:#102b46;margin:22px 0}.hero em,.section h2 em{font-style:normal;color:#16a568}.lead{font-size:15px;line-height:1.85;color:#657986;max-width:550px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 18px;border:0;border-radius:5px;font:700 11px "DM Sans";cursor:pointer;gap:16px}.green{background:#16a568;color:white}.pale{border:1px solid #d4dfdf;color:#28465b;background:white}.dark{background:#102b46;color:white;margin-top:24px}.experience{display:flex;align-items:center;gap:13px;margin-top:38px}.experience>b{font:800 29px Manrope;color:#16a568}.experience strong,.experience small{display:block}.experience strong{font-size:11px}.experience small{font-size:10px;color:#82929a;margin-top:4px}.hero-art{height:350px;display:grid;place-items:center;position:relative}.art-card{background:#102b46;color:white;border-radius:15px;width:min(365px,90%);padding:30px;box-shadow:0 25px 60px #102b4630;transform:rotate(-3deg)}.art-card small{font-size:8px;letter-spacing:.15em;color:#aac0cb}.art-card h2{font:700 26px/1.3 Manrope;margin:27px 0}.art-card h2 em{color:#68d99d;font-style:normal}.bars{height:105px;display:flex;align-items:end;gap:9px;border-bottom:1px solid #ffffff2b;padding:0 4px 10px}.bars i{flex:1;background:linear-gradient(#5bd99b,#13885e);height:45%;border-radius:4px 4px 0 0}.bars i:nth-child(2n){height:75%;background:linear-gradient(#8bc2df,#397fa7)}.bars i:nth-child(3n){height:92%}.art-card p{font-size:9px;color:#b9cbd3;margin:17px 0 0}.float{position:absolute;background:white;padding:13px 16px;border-radius:8px;box-shadow:0 10px 30px #102b461a;font-size:10px;font-weight:700}.f1{top:45px;left:0}.f2{bottom:34px;right:0}.section{padding:95px 0}.heading{display:flex;align-items:end;justify-content:space-between;gap:35px;margin-bottom:38px}.heading h2{font-size:42px;margin:16px 0 0}.heading>p{max-width:370px;color:#758690;font-size:12px;line-height:1.8}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.cards article{border:1px solid #e1e9e8;border-radius:8px;padding:23px 20px;min-height:390px;display:flex;flex-direction:column}.cards article.featured{background:#f3faf5;border-color:#d7ecdf}.ico{width:42px;height:42px;background:#e3f7e9;color:#13a568;border-radius:8px;display:grid;place-items:center;font-size:23px}.cards article>small{font-size:8px;letter-spacing:.15em;color:#91a0a6;margin-top:19px}.cards h3{font:700 17px/1.35 Manrope;margin:10px 0}.cards p,.cards li{font-size:10px;line-height:1.75;color:#71818b}.cards ul{padding-left:15px;margin:8px 0 20px}.cards li::marker{color:#16a568}.cards article>a{margin-top:auto;border-top:1px solid #e4ece8;padding-top:15px;color:#11945e;font-size:10px;font-weight:700}.about{background:#f4f8f6}.about-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:95px;align-items:center}.profile{height:440px;max-width:360px;margin:auto;position:relative;border-radius:160px 160px 10px 10px;background:linear-gradient(145deg,#e7f2ed,#dce8ed);overflow:visible;display:flex;justify-content:center;align-items:end}.profile img{height:100%;width:100%;object-fit:contain;object-position:center bottom;border-radius:inherit}.photo-placeholder{height:100%;width:100%;display:grid;place-items:center;font:800 80px Manrope;color:#16a568}.tag{position:absolute;right:-27px;top:35px;background:white;border-radius:50%;height:100px;width:100px;display:grid;place-content:center;text-align:center;font-size:8px;line-height:1.5;color:#73858e;box-shadow:0 8px 24px #102b4615}.tag b{font:800 19px Manrope;color:#16a568}.about h2{font-size:42px}.about p{font-size:12px;line-height:1.9;color:#71818c}.about p.big{font-size:15px;color:#3d596a}.stats{display:flex;gap:27px;border-top:1px solid #dce6e2;padding-top:20px;margin-top:22px}.stats b,.stats small{display:block}.stats b{font:800 25px Manrope;color:#16a568}.stats small{font-size:8px;color:#7b8b93;max-width:95px;line-height:1.5}.markets{background:#102b46;color:white}.markets .heading h2{color:white}.markets .heading>p{color:#b6c5ce}.market-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.market-grid article{background:#173750;border:1px solid #ffffff24;border-radius:9px;padding:29px}.market-grid article>small{font-size:9px;letter-spacing:.15em;color:#a9bfca}.market-grid h3{font:700 22px Manrope;margin:22px 0 8px}.market-grid p{font-size:11px;line-height:1.7;color:#b6c6cf}.pills{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.pills span{font-size:9px;padding:8px 10px;border:1px solid #ffffff2c;border-radius:4px;color:#dce7eb}.market-grid a{font-size:10px;font-weight:700;color:#7ce0a7}.disclaimer{font-size:9px;color:#93a9b5;line-height:1.7;margin-top:20px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.steps article{border-top:2px solid #dce8e2;padding-top:18px}.steps b{font:700 12px Manrope;color:#16a568}.steps h3{font:700 16px Manrope;margin:15px 0 7px}.steps p{font-size:10px;color:#7a8a93;line-height:1.7}.contact{background:#f2f7f5}.contact-grid{display:grid;grid-template-columns:1fr .9fr;gap:85px}.contact h2{font:800 42px/1.2 Manrope;letter-spacing:-.05em;color:#102b46;margin:18px 0}.contact-grid>div>p{font-size:12px;color:#71818c;line-height:1.7}.contactline{display:flex;align-items:center;gap:13px;margin-top:22px}.contactline>b{width:40px;height:40px;background:#def5e7;color:#13a568;border-radius:8px;display:grid;place-items:center}.contactline small,.contactline strong{display:block}.contactline small{font-size:8px;letter-spacing:.14em;color:#8999a0}.contactline strong{font-size:12px;margin-top:4px}.contact form{background:white;padding:28px;border-radius:9px;box-shadow:0 12px 35px #102b4610}.contact form h3{font:700 20px Manrope;margin:0 0 6px}.contact form p{font-size:10px;color:#84939b}.contact label{display:block;font-size:10px;font-weight:700;margin:13px 0 6px}.contact input,.contact select,.contact textarea{width:100%;border:1px solid #dfe7e7;border-radius:5px;padding:11px;font:11px "DM Sans"}.contact form button{width:100%;margin-top:17px}.note{display:block;font-size:8px;line-height:1.5;color:#99a5aa;margin-top:10px}footer{background:#0b2237;color:#dce6eb;padding-top:30px}.foot{display:flex;justify-content:space-between;align-items:center;padding-bottom:25px}.foot .brand strong{color:white}.foot .brand small{color:#9aadb8}.foot p,.foot>a:last-child{font-size:10px;color:#9fb1ba}.foot>a:last-child{color:#7ce0a7;font-weight:700}.copyright{border-top:1px solid #ffffff1c;padding:16px 0;font-size:9px;color:#8da1ad}.whatsapp{position:fixed;right:20px;bottom:20px;background:#20c66b;color:white;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:27px;box-shadow:0 8px 25px #0a74443b;z-index:9}
@media(max-width:950px){.cards{grid-template-columns:repeat(2,1fr)}.hero-grid{gap:25px}.about-grid{gap:50px}.contact-grid{gap:40px}}
@media(max-width:680px){.wrap{width:calc(100% - 34px)}.topin{font-size:9px}header{height:68px}#menu{display:block;border:0;background:none;font-size:24px;color:#17344b}nav{display:none;position:absolute;top:68px;left:0;right:0;background:white;padding:20px;box-shadow:0 12px 20px #102b4618;flex-direction:column;align-items:stretch;gap:18px}nav.open{display:flex}.navbtn{text-align:center}.hero{padding:55px 0}.hero-grid,.about-grid,.contact-grid{grid-template-columns:1fr}.hero h1{font-size:40px}.hero-art{height:300px}.float{font-size:9px;padding:10px}.f1{left:-3px}.f2{right:-3px}.section{padding:68px 0}.heading{display:block}.heading h2,.about h2{font-size:34px}.heading>p{margin-top:15px}.cards,.market-grid{grid-template-columns:1fr}.cards article{min-height:0}.profile{height:390px;width:82%}.about-grid{gap:45px}.stats{gap:15px}.stats b{font-size:22px}.steps{grid-template-columns:1fr 1fr;gap:24px 15px}.contact h2{font-size:35px}.contact form{padding:22px}.foot{align-items:flex-start;flex-direction:column;gap:17px}.foot p{margin:0}}
/* Requested refinements: round profile photo and visible email contact */
.profile{width:330px;height:330px;border-radius:50%;overflow:hidden;background:#e7f2ed;box-shadow:0 18px 45px #102b4617}
.profile img{width:100%;height:100%;object-fit:cover;object-position:center 25%;border-radius:50%}
.profile .tag{right:-22px;top:12px}
.top-contact{display:flex;gap:0;align-items:center}
.contact form>p a{color:#11945e;font-weight:700}
@media(max-width:680px){.profile{width:285px;height:285px}.profile .tag{right:-14px}.top-contact{gap:4px;font-size:8px}}
/* Premium refinement: fast, CSS-only interactions; no animation library required */
:root{--navy:#102b46;--green:#16a568}body{-webkit-font-smoothing:antialiased}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #42bd83;outline-offset:3px}.hero{background:radial-gradient(circle at 85% 18%,#d3efe1 0,transparent 32%),linear-gradient(120deg,#f8fcfa,#eaf2f7)}.hero h1{max-width:760px}.cards article{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.cards article:hover{transform:translateY(-6px);box-shadow:0 20px 40px #102b4614;border-color:#a6d9bf}.btn{transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 12px 28px #102b461a}.profile{border-radius:50%;width:350px;height:350px;overflow:hidden;box-shadow:0 25px 55px #102b461d;border:7px solid white}.profile img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center 22%}.profile .tag{right:0;top:0}.contact-shortcuts{display:flex;gap:22px;align-items:center}.detail-links{background:#f7faf9}.detail-links h2,.faq h2{font:800 clamp(32px,4vw,43px)/1.18 Manrope;letter-spacing:-.04em;margin:18px 0 30px}.detail-links h2 em,.faq h2 em{font-style:normal;color:#16a568}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.detail-grid a{display:flex;justify-content:space-between;gap:15px;align-items:center;background:white;border:1px solid #dfeae5;border-radius:10px;padding:22px;font:700 14px Manrope;transition:.2s}.detail-grid a:hover{border-color:#16a568;transform:translateY(-3px)}.detail-grid span{color:#16a568}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.faq details{border:1px solid #dfeae5;border-radius:9px;padding:20px;background:#fff}.faq summary{font:700 13px Manrope;cursor:pointer}.faq details p{font-size:12px;line-height:1.8;color:#647887}.contactline strong{overflow-wrap:anywhere}@media(max-width:680px){.contact-shortcuts>a:first-child{display:none}.detail-grid,.faq-grid{grid-template-columns:1fr}.profile{width:280px;height:280px}.topin{gap:6px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
.service-detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px}.service-detail-grid article{background:#f6faf8;border:1px solid #e1ebe6;border-radius:12px;padding:26px}.service-detail-grid h2{font:700 19px Manrope;color:#102b46}.service-detail-grid p{font-size:13px;line-height:1.8;color:#647887}@media(max-width:680px){.service-detail-grid{grid-template-columns:1fr}}
/* Readability improvements + WhatsApp button clearance */
body {
font-size: 16px;
line-height: 1.65;
}
.top { font-size: 12px; }
.topin { min-height: 40px; height: auto; }
nav { font-size: 13px; }
.brand small { font-size: 9px; }
.lead { font-size: 16px; line-height: 1.8; }
.experience strong { font-size: 13px; }
.experience small { font-size: 11px; }
.eyebrow { font-size: 11px; }
.cards article > small,
.market-grid article > small { font-size: 10px; }
.cards p,
.cards li { font-size: 12px; line-height: 1.8; }
.cards h3 { font-size: 18px; }
.cards article > a { font-size: 12px; }
.heading > p,
.about p,
.market-grid p,
.steps p,
.contact-grid > div > p {
font-size: 14px;
line-height: 1.8;
}
.market-grid h3 { font-size: 23px; }
.pills span { font-size: 11px; }
.disclaimer { font-size: 11px; line-height: 1.8; }
.steps h3 { font-size: 17px; }
.contact h2 { line-height: 1.25; }
.contact form h3 { font-size: 21px; }
.contact form p { font-size: 12px; line-height: 1.6; }
.contact label { font-size: 12px; }
.contact input,
.contact select,
.contact textarea {
font-size: 14px;
padding: 13px;
}
.contact form button { font-size: 13px; }
.note { font-size: 10px; line-height: 1.7; }
.contactline small { font-size: 10px; }
.contactline strong { font-size: 13px; }
.foot p,
.foot > a:last-child { font-size: 12px; }
.copyright { font-size: 11px; }
.service-detail-grid p { font-size: 14px; line-height: 1.8; }
.whatsapp {
right: 20px;
bottom: 90px;
width: 58px;
height: 58px;
font-size: 29px;
}
@media (max-width: 680px) {
.top { font-size: 10px; }
.brand small { font-size: 8px; }
.hero h1 { line-height: 1.2; }
.heading > p,
.about p,
.market-grid p,
.steps p,
.contact-grid > div > p { font-size: 14px; }
.cards p,
.cards li { font-size: 13px; }
.contact form p { font-size: 12px; }
.contact input,
.contact select,
.contact textarea { font-size: 16px; }
.whatsapp {
right: 16px;
bottom: 86px;
width: 56px;
height: 56px;
}
}
/* Premium typography polish: elegant, clear and consistent */
:root {
--font-body: "DM Sans", "Segoe UI", Arial, sans-serif;
--font-heading: "Manrope", "Segoe UI", Arial, sans-serif;
}
html {
text-rendering: optimizeLegibility;
-webkit-text-size-adjust: 100%;
}
body {
font-family: var(--font-body);
font-size: 16px;
line-height: 1.7;
letter-spacing: 0.005em;
color: #29465b;
}
h1, h2, h3, h4,
.brand strong,
.btn,
.navbtn {
font-family: var(--font-heading);
text-rendering: optimizeLegibility;
}
h1, h2, h3 {
letter-spacing: -0.035em;
}
.hero h1 {
font-size: clamp(40px, 4.7vw, 60px);
line-height: 1.12;
font-weight: 800;
letter-spacing: -0.045em;
}
.section h2,
.heading h2,
.about h2,
.contact h2 {
line-height: 1.18;
letter-spacing: -0.04em;
}
.lead {
font-size: 17px;
line-height: 1.85;
color: #5f7482;
letter-spacing: 0;
}
.eyebrow {
font-size: 11px;
line-height: 1.5;
letter-spacing: 0.18em;
font-weight: 800;
}
nav {
font-size: 13px;
letter-spacing: 0.01em;
}
.brand strong {
font-size: 14px;
letter-spacing: 0.075em;
}
.brand small {
font-size: 9px;
line-height: 1.5;
letter-spacing: 0.11em;
}
.cards h3,
.market-grid h3,
.steps h3,
.contact form h3 {
font-weight: 750;
line-height: 1.35;
letter-spacing: -0.025em;
}
.cards p,
.cards li,
.heading > p,
.about p,
.market-grid p,
.steps p,
.contact-grid > div > p,
.service-detail-grid p,
.faq details p {
font-size: 14px;
line-height: 1.85;
letter-spacing: 0;
}
.cards article > small,
.market-grid article > small {
font-size: 10px;
line-height: 1.6;
letter-spacing: 0.14em;
font-weight: 700;
}
.cards article > a,
.market-grid a {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.01em;
}
.pills span {
font-size: 11px;
line-height: 1.4;
font-weight: 600;
}
.contact form h3 {
font-size: 22px;
}
.contact form p {
font-size: 12px;
line-height: 1.7;
}
.contact label {
font-size: 12px;
line-height: 1.5;
font-weight: 700;
color: #29465b;
}
.contact input,
.contact select,
.contact textarea {
font-family: var(--font-body);
font-size: 14px;
line-height: 1.5;
color: #18344b;
}
.contact input::placeholder,
.contact textarea::placeholder {
color: #84939d;
opacity: 1;
}
.btn,
.navbtn {
font-size: 12px;
font-weight: 800;
letter-spacing: 0.015em;
}
.contactline small {
font-size: 10px;
line-height: 1.5;
letter-spacing: 0.13em;
}
.contactline strong {
font-size: 13px;
line-height: 1.5;
font-weight: 700;
}
.note,
.disclaimer {
font-size: 11px;
line-height: 1.75;
}
.foot p,
.foot > a:last-child {
font-size: 12px;
line-height: 1.7;
}
.copyright {
font-size: 11px;
line-height: 1.7;
}
@media (max-width: 680px) {
body { font-size: 16px; }
.hero h1 {
font-size: clamp(36px, 9vw, 43px);
line-height: 1.16;
}
.lead { font-size: 16px; }
.cards p,
.cards li,
.heading > p,
.about p,
.market-grid p,
.steps p,
.contact-grid > div > p,
.service-detail-grid p,
.faq details p {
font-size: 14px;
line-height: 1.8;
}
.contact input,
.contact select,
.contact textarea {
font-size: 16px;
}
}
/* Blue typography theme */
body {
color: #174a7e;
}
h1, h2, h3, h4,
.hero h1, .section h2, .heading h2,
.about h2, .contact h2 {
color: #123f70;
}
.lead,
.heading > p,
.about p,
.cards p,
.cards li,
.market-grid p,
.steps p,
.contact-grid > div > p,
.service-detail-grid p,
.faq details p {
color: #426789;
}
nav {
color: #285b8d;
}
.brand strong,
.contactline strong,
.contact label,
.contact form h3,
.cards h3,
.steps h3,
.market-grid h3 {
color: #174a7e;
}
.contact input,
.contact select,
.contact textarea {
color: #174a7e;
}
.contact input::placeholder,
.contact textarea::placeholder {
color: #7892ad;
}
.foot p,
.copyright {
color: #b7cbe0;
}
/* Keep the existing green brand accents for emphasis and calls to action. */
/* High-contrast text for dark blue sections (India / US tax cards) */
.markets {
color: #f4f8ff;
}
.markets .heading h2,
.markets .heading h2 em {
color: #ffffff;
}
.markets .heading > p {
color: #d4e3f2;
}
.market-grid article {
background: #1b3d59;
border-color: #496982;
}
.market-grid article > small {
color: #c5d9eb;
}
.market-grid h3 {
color: #ffffff;
}
.market-grid p {
color: #d5e3ef;
}
.market-grid .pills span {
color: #f0f6fc;
border-color: #6b879e;
background: #214764;
}
.market-grid a {
color: #70efb0;
}
/* Keep qualification / experience text clear wherever it appears */
.experience strong,
.stats small,
.tag {
color: #234f75;
}
.experience small {
color: #617d96;
}
/* Specific contrast corrections requested */
.art-card h2 {
color: #ffffff !important;
}
.art-card h2 em {
color: #68e0a0 !important;
}
/* Qualification badge: strong red text for clear visibility */
.tag,
.about .tag {
color: #c62828 !important;
}
.tag b,
.about .tag b {
color: #c62828 !important;
}
/* Footer brand descriptor: bright white on the dark footer */
.foot .brand small {
color: #ffffff !important;
}
/* Brighter, clearer freelancer tagline under the brand name */
.brand small,
.foot .brand small {
color: #087a55 !important;
font-size: 10px;
font-weight: 800;
letter-spacing: 0.12em;
line-height: 1.6;
opacity: 1;
}
@media (max-width: 680px) {
.brand small,
.foot .brand small {
color: #087a55 !important;
font-size: 9px;
font-weight: 800;
letter-spacing: 0.09em;
}
}
/* High-contrast qualification badge: readable on every screen */
.tag,
.profile .tag,
.about .tag {
background: #fff4cc !important;
color: #7f1d1d !important;
border: 2px solid #b45309;
font-size: 10px;
font-weight: 800;
line-height: 1.55;
text-shadow: none;
box-shadow: 0 8px 24px rgba(16, 43, 70, 0.18);
}
.tag b,
.profile .tag b,
.about .tag b {
color: #b91c1c !important;
font-size: 20px;
font-weight: 900;
line-height: 1.2;
}
/* Consistent circular badges for experience and qualifications */
.tag,
.profile .tag,
.about .tag,
.qualification-badge {
width: 112px !important;
height: 112px !important;
min-width: 112px;
border-radius: 50% !important;
box-sizing: border-box;
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 12px !important;
white-space: normal;
overflow-wrap: anywhere;
line-height: 1.35;
background: #fff4cc !important;
color: #7f1d1d !important;
border: 2px solid #b45309;
box-shadow: 0 8px 24px rgba(16, 43, 70, 0.18);
}
.tag b,
.profile .tag b,
.about .tag b,
.qualification-badge b {
display: block;
color: #b91c1c !important;
font-size: 20px;
font-weight: 900;
line-height: 1.15;
margin-bottom: 3px;
}
.tag span,
.profile .tag span,
.about .tag span,
.qualification-badge span {
display: block;
max-width: 100%;
font-size: 9px;
line-height: 1.3;
font-weight: 800;
color: #7f1d1d !important;
}
@media (max-width: 680px) {
.tag,
.profile .tag,
.about .tag,
.qualification-badge {
width: 100px !important;
height: 100px !important;
min-width: 100px;
padding: 10px !important;
}
.tag span,
.profile .tag span,
.about .tag span,
.qualification-badge span {
font-size: 8px;
}
}
/* Fix the actual clipping: the profile wrapper must not crop its badge.
The portrait itself remains circular through the image border-radius. */
.profile {
overflow: visible !important;
position: relative;
}
.profile img {
border-radius: 50% !important;
}
/* Keep the 10+ badge fully inside its own circle and above the portrait. */
.profile > .tag,
.profile .tag {
position: absolute !important;
top: 12px !important;
right: 0 !important;
left: auto !important;
z-index: 3 !important;
width: 112px !important;
height: 112px !important;
min-width: 112px !important;
border-radius: 50% !important;
padding: 12px !important;
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
overflow: visible !important;
white-space: normal;
overflow-wrap: anywhere;
line-height: 1.3;
}
@media (max-width: 680px) {
.profile > .tag,
.profile .tag {
width: 100px !important;
height: 100px !important;
min-width: 100px !important;
right: -4px !important;
top: 8px !important;
}
}