/* CareKleen refresh: simpler hierarchy, stronger contrast, restrained motion. */
:root{--blue:#0876e8;--blue-deep:#111827;--ink:#111318;--muted:#606875;--paper:#fff;--line:#e4e7eb;--lime:#c9f36b}
body{background:#fff;color:#111318}
.site-header{background:rgba(255,255,255,.9);border-color:#1113180d}
.brand-blue{color:var(--blue)}.primary-nav a,.nav-cta{color:#242830}.nav-cta{border-color:#d7dce2}
.hero{min-height:650px;padding-top:72px;padding-bottom:44px}
.hero h1,.intro h2,.offer-heading h2,.home-service-layout h2,.proof h2,.about-copy h2,.journal h2,.contact h2{color:#111318}
.serif-accent{font-family:var(--display);font-style:normal;font-weight:600;letter-spacing:-.065em;color:var(--blue)}
.hero h1{font-size:clamp(57px,6.5vw,82px);letter-spacing:-.075em}
.hero-lede{max-width:350px;color:#606875;font-size:16px}
.button-primary{background:var(--lime);color:#101810}.button-primary:hover{box-shadow:0 8px 22px #b6d96755}
.hero-art{height:450px;border-radius:28px;background:#e8ece7;overflow:hidden;box-shadow:0 24px 60px #132a4310}
.hero-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;animation:photo-arrive 1.1s cubic-bezier(.2,.75,.2,1) both}
.hero-art:before{content:'';inset:auto;position:absolute;z-index:1;left:0;right:0;bottom:0;height:34%;background:linear-gradient(0deg,#0d1d2680,transparent);pointer-events:none}
.art-card{z-index:2;bottom:22px;left:22px;border-radius:9px;box-shadow:0 8px 28px #17233320}.card-spark{color:var(--blue)}
.hero-bottom{color:#69717c}.intro{padding-top:96px;padding-bottom:102px}.intro-heading{margin:30px 0 35px}
.intro h2,.offer-heading h2,.home-service-layout h2,.proof h2,.about-copy h2,.journal h2,.contact h2{font-size:clamp(42px,4.8vw,61px);letter-spacing:-.07em}
.service-card{min-height:365px;border-radius:12px}.commercial-card{background:#eaf3fd}.home-card{background:#f1f5e8}
.card-bottom h3{font-size:30px;letter-spacing:-.07em}.card-link b,.text-link span,.journal-card>a span{color:var(--blue)}
.quote-band{height:250px;background:#f5f7f9}.quote-inner p{font-size:32px;letter-spacing:-.05em}.quote-inner .serif-accent{color:var(--blue)}
.offerings{padding-top:100px;padding-bottom:105px}.home-services{background:#f5f7f2}
.home-service-list a:hover strong,.journal-card>a:hover{color:var(--blue)}.proof{padding-top:104px;padding-bottom:105px}.stat strong{color:var(--blue)}
.about{background:#f5f8fb}.journal{padding-top:100px;padding-bottom:105px}.contact-panel{background:#f2f6fa;border-radius:12px}
.footer{background:#101318}.footer .brand-blue{color:#68aaff}.menu-toggle span{background:#15181d}
.primary-nav a:hover,.nav-cta:hover{color:var(--blue)}
.button,.service-card,.journal-card,.offer-item,.about-art{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,color .2s ease}
.service-card:hover,.journal-card:hover{transform:translateY(-4px)}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.75,.2,1)}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.hero-copy>*{animation:fade-up .72s cubic-bezier(.2,.75,.2,1) both}
.hero-copy>*:nth-child(2){animation-delay:.08s}.hero-copy>*:nth-child(3){animation-delay:.16s}.hero-copy>*:nth-child(4){animation-delay:.24s}
@keyframes fade-up{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes photo-arrive{from{opacity:.65;transform:scale(1.035)}to{opacity:1;transform:scale(1)}}
@media(max-width:680px){.hero{padding-top:49px}.hero h1{font-size:clamp(54px,15vw,76px)}.hero-art{height:320px;border-radius:18px}.hero-art img{object-position:58% center}.intro{padding-top:68px;padding-bottom:68px}.service-card{min-height:345px}.intro-heading{margin:26px 0}.quote-band{height:220px}.quote-inner p{font-size:25px}.reveal{transform:translateY(12px)}.contact-panel{background:#f2f6fa}}
@media(prefers-reduced-motion:reduce){.reveal,.hero-copy>*,.hero-art img{animation:none!important;transition:none!important;opacity:1!important;transform:none!important}}
.brand{gap:0;width:138px;height:34px;overflow:hidden;display:flex;align-items:center}
.brand-wordmark{display:block;width:138px;height:30px;position:relative;overflow:hidden;flex:none}
.brand-wordmark img{position:absolute;width:164px;height:164px;max-width:none;left:-12px;top:-68px;object-fit:cover}
.footer-brand{background:#fff;border-radius:3px;padding:2px 3px;width:144px;height:36px}
.hero-art{overflow:hidden}
.photo-card img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center 45%;transition:transform .7s cubic-bezier(.2,.75,.2,1)}
.service-card:hover .photo-card img{transform:scale(1.04)}
.service-card .card-top,.service-card .card-bottom{z-index:3}
.service-card:after{content:'';position:absolute;z-index:1;inset:48% 0 0;background:linear-gradient(0deg,#fffefa 0%,#fffefaeb 65%,transparent)}
.commercial-card:after{background:linear-gradient(0deg,#f9fbfd 0%,#f9fbfdee 65%,transparent)}
.home-card:after{background:linear-gradient(0deg,#fbfcf7 0%,#fbfcf7ee 65%,transparent)}
.card-illustration.photo-card{inset:0;height:auto;margin:0;border-radius:inherit;overflow:hidden}
.card-illustration.photo-card img{height:100%}
.about-art{border-radius:14px;overflow:hidden;display:block}
.about-art>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.about-art:before{z-index:1;pointer-events:none}.about-art:after{z-index:1;pointer-events:none}
.about-small{z-index:2;background:#fffE;padding:11px 14px;border-radius:7px;right:18px;bottom:18px}
.journal-art{background:#e9edf1}
.journal-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .75s cubic-bezier(.2,.75,.2,1)}
.journal-card:hover .journal-art img{transform:scale(1.045)}
.quote-band{background-image:linear-gradient(90deg,#f5f7f9ed,#f5f7f9c7),url('carekleen-sri-lanka-hero.png');background-size:cover;background-position:center 47%}
.quote-orbit{opacity:.22}
/* Corporate portfolio */
.portfolio{padding-top:90px;padding-bottom:103px;background:#f7f9fc}
.portfolio-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:34px}
.portfolio-heading h2{font:700 clamp(40px,4.5vw,58px)/1.04 var(--display);letter-spacing:-.07em;margin:27px 0 0;color:#111318}
.portfolio-heading>p{font-size:12px;line-height:1.7;color:var(--muted);max-width:230px;margin:0 0 6px}
.portfolio-sheet{margin:0;padding:10px;background:#fff;border:1px solid #e7edf3;border-radius:16px;box-shadow:0 16px 48px #132a430b;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-color:#a7c5e6 #eff3f7;scroll-snap-type:x proximity}
.portfolio-sheet img{display:block;width:100%;height:auto;border-radius:10px;scroll-snap-align:start}
.client-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.client-grid li{min-width:0;overflow:hidden;border:1px solid #e8edf3;border-radius:12px;background:#f8fafc;box-shadow:0 5px 16px #142d4808;transition:transform .28s ease,box-shadow .28s ease}
.client-grid li:hover{transform:translateY(-3px);box-shadow:0 12px 24px #142d4814}
.client-logo{width:100%;aspect-ratio:2.3;background-image:url('carekleen-corporate-portfolio.png');background-size:600% auto;background-repeat:no-repeat;border-radius:11px}
.client-grid li:nth-child(-n+6) .client-logo{aspect-ratio:2.88}
.client-grid li:nth-child(n+7):nth-child(-n+12) .client-logo{aspect-ratio:2.44}
.client-grid li:nth-child(n+13):nth-child(-n+18) .client-logo{aspect-ratio:2.35}
.client-grid li:nth-child(n+19):nth-child(-n+27) .client-logo{aspect-ratio:3.05}
@media(max-width:680px){.brand{width:122px}.brand-wordmark{width:122px}.brand-wordmark img{left:-14px}.footer-brand{width:144px}.card-illustration.photo-card{inset:0}}
@media(min-width:681px) and (max-width:760px){.site-header{padding:0 4%}.primary-nav{gap:12px}.primary-nav a{font-size:10px}.brand{width:120px}.brand-wordmark{width:120px}.nav-cta{padding:10px 12px;font-size:10px}}
@media(max-width:900px){.client-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}}
@media(max-width:680px){.portfolio{padding-top:69px;padding-bottom:76px}.portfolio-heading{display:block;margin-bottom:24px}.portfolio-heading h2{font-size:43px;margin-top:24px}.portfolio-heading>p{margin-top:13px;font-size:11px}.client-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.client-grid li{border-radius:9px}.client-logo{border-radius:8px}}
.hotline-strip{height:34px;padding:0 6.4%;display:flex;align-items:center;justify-content:space-between;background:#111318;color:#e8ecf2;font-size:10px;letter-spacing:.02em}
.hotline-strip>a{display:flex;align-items:center;gap:7px;color:#fff}
.hotline-strip strong{color:var(--lime);font-size:11px;letter-spacing:.04em}
.hotline-strip a span{color:var(--lime);font-size:14px}
.contact-details{display:grid;gap:12px;margin-top:22px}
.contact-details>a,.contact-details>div{display:grid;grid-template-columns:58px 1fr 17px;gap:8px;align-items:center;max-width:370px}
.contact-details>div{grid-template-columns:58px 1fr}
.contact-details span{font-size:8px;letter-spacing:1.1px;color:#7c8999;font-weight:700}
.contact-details strong{font-size:11px;line-height:1.5;font-weight:600;color:#1d2a3b}
.contact-details b{font-size:14px;font-weight:400;color:var(--blue)}
.footer-contact{display:flex;align-items:center;justify-content:center;gap:20px;padding:18px 0;border-bottom:1px solid #ffffff20;color:#b8c5d4;font-size:10px}
.footer-contact a{display:inline-flex;align-items:center;gap:8px;color:#fff;font-size:11px}
.footer-contact strong{color:var(--lime);font-size:13px;letter-spacing:.04em}
.footer-contact b{color:var(--lime);font-size:14px;font-weight:400}
@media(max-width:680px){.hotline-strip{height:32px;padding:0 6%;font-size:9px}.hotline-strip strong{font-size:10px}.contact-details{gap:10px;margin-top:18px}.contact-details>a,.contact-details>div{grid-template-columns:51px 1fr 15px;gap:6px}.contact-details>div{grid-template-columns:51px 1fr}.contact-details strong{font-size:10px}.footer-contact{gap:6px;flex-direction:column;padding:15px 0}.footer-contact a{gap:6px}}

/* Improve readability for supporting labels and contact details. */
.eyebrow,.section-kicker{font-size:15px}
.section-kicker span{font-size:14px}
.card-top{font-size:14px}
.card-bottom p{font-size:16px}
.card-link,.text-link,.hero-note,.hero-bottom{font-size:15px}
.res-hero-copy .button{font-size:16px}
.footer-contact,.footer-contact a,.contact-details strong{font-size:16px}
.hotline-strip strong{font-size:16px}

/* Raise the remaining tiny readable text sizes. */
.contact-details span{font-size:11px}
.hotline-strip{font-size:11px}
@media(min-width:681px) and (max-width:760px){.primary-nav a,.nav-cta{font-size:11px}}
@media(max-width:680px){.hotline-strip{font-size:11px}.hotline-strip strong{font-size:11px}.contact-details strong{font-size:11px}}

/* Apply the same readable minimum to homepage labels. */
.art-label,.quote-caption,.journal-meta,.section-kicker span,.card-top,.tag-row span,
.home-service-list a span,.about-small,.contact-detail,.contact-form label,
.contact-form small,.footer-bottom{font-size:11px}

/* Readability pass: keep supporting copy comfortably legible at normal zoom. */
body{font-size:17px}
.hotline-strip{font-size:14px}
.primary-nav a,.nav-cta{font-size:14px}
.eyebrow,.section-kicker{font-size:14px}
.section-kicker span{font-size:13px}
.hero-lede{font-size:18px}
.hero-note,.hero-bottom{font-size:14px}
.button,.text-link{font-size:14px}
.card-top{font-size:13px}
.card-bottom p{font-size:17px}
.card-link{font-size:14px}
.intro-heading>p,.offer-item p,.home-service-layout p,.proof-copy>p,.about-copy>p,.contact-copy>p{font-size:17px}
.tag-row span{font-size:13px}
.home-service-list a span{font-size:13px}
.home-service-list a strong{font-size:16px}
.about-small,.contact-detail,.contact-form label,.contact-form small,.footer-bottom{font-size:14px}
.contact-details span{font-size:13px}
.contact-details strong{font-size:16px}
.footer-contact,.footer-contact a{font-size:14px}
.footer-contact strong{font-size:16px}
@media(max-width:680px){
  .hotline-strip{font-size:13px}
  .primary-nav a,.nav-cta{font-size:14px}
  .hero-lede{font-size:17px}
  .hero-note,.hero-bottom,.button,.text-link{font-size:14px}
  .intro-heading>p,.offer-item p,.home-service-layout p,.proof-copy>p,.about-copy>p,.contact-copy>p{font-size:16px}
  .card-bottom p{font-size:16px}
}

/* Final pass for the remaining small text visible in statistics, forms, and footer. */
.section-kicker,.section-kicker span{font-size:16px}
.proof-stats .stat span,.proof-stats .stat-note{font-size:15px}
.portfolio-heading>p{font-size:16px}
.contact-form label{font-size:15px}
.contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
.contact-form input::placeholder,.contact-form textarea::placeholder{font-size:16px}
.contact-form small{font-size:14px}
.footer-top>span,.footer-top .back-top{font-size:14px}
.footer-bottom,.footer-bottom a{font-size:15px}
.footer-contact,.footer-contact a{font-size:16px}
@media(max-width:680px){
  .section-kicker,.section-kicker span{font-size:14px}
  .proof-stats .stat span,.proof-stats .stat-note,.portfolio-heading>p{font-size:14px}
  .contact-form label{font-size:14px}
  .contact-form input,.contact-form select,.contact-form textarea{font-size:16px}
  .contact-form input::placeholder,.contact-form textarea::placeholder{font-size:16px}
  .footer-top>span,.footer-top .back-top,.footer-bottom,.footer-bottom a{font-size:14px}
  .footer-contact,.footer-contact a{font-size:15px}
}

/* Make journal actions large enough to read and tap comfortably. */
.journal-card>a,.journal-top>.text-link{font-size:16px;font-weight:700}
.journal-card>a span,.journal-top>.text-link span{font-size:20px;padding-left:8px}
@media(max-width:680px){
  .journal-card>a,.journal-top>.text-link{font-size:15px}
  .journal-card>a span,.journal-top>.text-link span{font-size:19px}
}
