/* Light service cards inspired by the supplied mobile reference. */

:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-card{display:grid;position:relative;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr auto;align-items:stretch;padding:0;gap:0;border:1px solid #e3e9f1;border-radius:12px;background:#fff;overflow:hidden;box-shadow:0 3px 14px #1b365407}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-media{position:relative;grid-column:1;grid-row:1;align-self:stretch;width:100%;height:auto;aspect-ratio:3/2}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-image{display:block;width:100%;height:100%;aspect-ratio:3/2;border:0;border-bottom:1px solid #edf1f5;border-radius:0;background:#f5f8fc}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-image img{display:block;width:100%;height:100%;object-fit:contain}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-body,:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-copy{display:contents}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-meta{grid-column:1;grid-row:3;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 8px;min-width:0;margin:0;padding:0 12px 14px}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-short,:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-actions{display:none}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite,:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite:hover,:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite[aria-pressed]{display:none}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite:hover,:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite[aria-pressed=true]{color:#0081fb}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite .icon{width:22px;height:22px}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-favorite[aria-pressed=true] .icon{fill:currentColor}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .review-line{display:flex;align-items:center;align-self:center;gap:4px;min-width:0;margin:0;padding:0;font-size:12px;line-height:1.4;white-space:nowrap}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .review-line .icon{width:13px;height:13px;flex:none}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .review-line strong{color:#203044;font-weight:700}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .review-line span{color:#8491a2}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-headline{grid-column:1;grid-row:2;align-self:start;padding:14px 12px 0;margin:0 0 16px;min-height:74.9px;color:#25364b;font:500 14px/1.45 'DM Sans',Arial,sans-serif;letter-spacing:-.015em}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-headline a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;color:inherit;font:inherit;line-height:inherit}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-price{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;padding:0;margin:0 0 0 auto;color:#8390a0;font:400 13px/1.4 'DM Sans',Arial,sans-serif;white-space:nowrap}
:is(.alf-installed,.alf-app-page) :is(#service-grid,.related-grid) .service-price strong{margin:0;color:#172b43;font:700 13px/1.4 'DM Sans',Arial,sans-serif;letter-spacing:0}

.alf-app-page #alf-app-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media(max-width:640px){
:is(#service-grid,.related-grid) .service-card{display:grid;position:relative;grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr auto;align-items:stretch;padding:0;gap:0;border:1px solid #e3e9f1;border-radius:12px;background:#fff;overflow:hidden;box-shadow:0 3px 14px #1b365407}
:is(#service-grid,.related-grid) .service-media{position:relative;grid-column:1;grid-row:1;align-self:stretch;width:100%;height:auto;aspect-ratio:3/2}
:is(#service-grid,.related-grid) .service-image{display:block;width:100%;height:100%;aspect-ratio:3/2;border:0;border-bottom:1px solid #edf1f5;border-radius:0;background:#f5f8fc}
:is(#service-grid,.related-grid) .service-image img{display:block;width:100%;height:100%;object-fit:contain}
:is(#service-grid,.related-grid) .service-body,:is(#service-grid,.related-grid) .service-copy{display:contents}
:is(#service-grid,.related-grid) .service-meta{grid-column:1;grid-row:3;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px 8px;min-width:0;margin:0;padding:0 12px 14px}
:is(#service-grid,.related-grid) .service-short,:is(#service-grid,.related-grid) .service-actions{display:none}
:is(#service-grid,.related-grid) .service-favorite,:is(#service-grid,.related-grid) .service-favorite:hover,:is(#service-grid,.related-grid) .service-favorite[aria-pressed]{display:none}
:is(#service-grid,.related-grid) .service-favorite:hover,:is(#service-grid,.related-grid) .service-favorite[aria-pressed=true]{color:#0081fb}
:is(#service-grid,.related-grid) .service-favorite .icon{width:22px;height:22px}
:is(#service-grid,.related-grid) .service-favorite[aria-pressed=true] .icon{fill:currentColor}
:is(#service-grid,.related-grid) .review-line{display:flex;align-items:center;align-self:center;gap:4px;min-width:0;margin:0;padding:0;font-size:12px;line-height:1.4;white-space:nowrap}
:is(#service-grid,.related-grid) .review-line .icon{width:13px;height:13px;flex:none}
:is(#service-grid,.related-grid) .review-line strong{color:#203044;font-weight:700}
:is(#service-grid,.related-grid) .review-line span{color:#8491a2}
:is(#service-grid,.related-grid) .service-headline{grid-column:1;grid-row:2;align-self:start;padding:14px 12px 0;margin:0 0 16px;min-height:74.9px;color:#25364b;font:500 14px/1.45 'DM Sans',Arial,sans-serif;letter-spacing:-.015em}
:is(#service-grid,.related-grid) .service-headline a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;color:inherit;font:inherit;line-height:inherit}
:is(#service-grid,.related-grid) .service-price{display:flex;align-items:baseline;justify-content:flex-end;gap:4px;padding:0;margin:0 0 0 auto;color:#8390a0;font:400 13px/1.4 'DM Sans',Arial,sans-serif;white-space:nowrap}
:is(#service-grid,.related-grid) .service-price strong{margin:0;color:#172b43;font:700 13px/1.4 'DM Sans',Arial,sans-serif;letter-spacing:0}

:is(#service-grid,.related-grid),.alf-app-page #alf-app-services{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
@media(max-width:350px){:is(#service-grid,.related-grid) .service-headline{font-size:13px;min-height:70.55px;padding-inline:10px}:is(#service-grid,.related-grid) .review-line{font-size:11px;gap:3px}:is(#service-grid,.related-grid) .service-meta{padding-inline:10px}}
/* Badge size and alignment must not depend on inherited bold-text styles. */
#alf-app-nav b{display:flex;align-items:center;justify-content:center;box-sizing:border-box;top:0;left:calc(50% + 4px);right:auto;width:auto;min-width:18px;height:18px;padding:0 4px;border:2px solid #fff;border-radius:999px;font:700 10px/1 'DM Sans',Arial,sans-serif;font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap}
#alf-app-nav b[hidden]{display:none}



/* Compact app greeting; shared website header stays unchanged. */
.alf-app-page .alf-app-home{padding-top:96px}
.alf-home-welcome{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 14px}
.alf-home-welcome>div{min-width:0;flex:1}
.alf-home-welcome h1{margin:0 0 5px;font-size:25px;line-height:1.2;letter-spacing:-.65px;overflow-wrap:anywhere}
.alf-home-welcome p{font-size:14px;line-height:1.5;max-width:29ch}
.alf-welcome-wave{display:grid;place-items:center;flex:none;width:54px;height:54px;border-radius:18px;background:linear-gradient(145deg,#e4f1ff,#f2f7ff);color:#0081fb}
.alf-welcome-wave svg{width:39px;height:39px;transform-origin:65% 85%;animation:alf-greeting-wave 6s ease-in-out infinite}
.alf-app-page .alf-service-search{margin:0 0 14px}
.alf-app-page .alf-service-search input{height:48px;border-radius:12px}
.alf-app-page .alf-service-search svg{top:14px}
.alf-app-page .alf-service-count{margin-bottom:12px;font-size:12px}
@keyframes alf-greeting-wave{0%,45%,100%{transform:rotate(0)}8%,24%{transform:rotate(13deg)}16%,32%{transform:rotate(-9deg)}}
@media(max-width:350px){.alf-home-welcome h1{font-size:23px}.alf-home-welcome p{font-size:13px}.alf-welcome-wave{width:47px;height:47px}.alf-welcome-wave svg{width:35px;height:35px}}
@media(prefers-reduced-motion:reduce){.alf-welcome-wave svg{animation:none}}