@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap");
:root{--green:#119c6e}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"DM Sans",sans-serif}.topbar{border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.logo{height:38px;width:38px;display:grid;place-items:center;background:var(--ink);color:#fff;border-radius:11px;font:800 19px Manrope,sans-serif;overflow:hidden;flex-shrink:0}.logo span{color:#8aa8ff}.profile-logo{background:#fff;padding:0}.profile-logo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}.brand b,.brand small{display:block;line-height:1.2}.brand b{font:800 15px Manrope,sans-serif}.brand small{font-size:10px;color:var(--muted);margin-top:4px}.eyebrow span{width:7px;height:7px;background:#17b67d;border-radius:50%}main{margin:auto}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:800;color:var(--blue);display:inline-flex;align-items:center;gap:8px}.wizard-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:27px;box-shadow:0 15px 45px rgba(30,52,95,.06)}.button{font:700 12px "DM Sans",sans-serif;border:1px solid transparent;border-radius:9px;padding:13px 16px;display:inline-flex;align-items:center;justify-content:center;gap:15px;cursor:pointer;text-decoration:none;transition:.15s}.primary{background:#25D366;color:#fff}.primary:hover:not(:disabled){background:#1fb85a}.primary:disabled{opacity:.4;cursor:not-allowed}.secondary{color:#344057}.secondary:hover{border-color:#b8c8ef}.full{width:100%}footer{border-top:1px solid var(--line);background:#fff;padding:22px max(22px,calc((100% - 1080px)/2));display:flex;align-items:center;gap:22px}footer>a:nth-child(2){margin-left:auto}footer>a:not(.brand),footer>span{font-size:10px;text-decoration:none}footer>a:not(.brand):hover{color:var(--blue)}
@media (max-width:600px) {.wizard-card{border-radius:16px}.button{padding:12px}footer{padding:20px 16px;gap:12px;flex-wrap:wrap}footer .brand{margin-right:auto}footer>a:nth-child(2){margin-left:0}}

/* Single-screen contact layout */
.contact-only{max-width:760px;margin-left:auto;margin-right:auto;text-align:left}
.wa-icon{font-size:20px;line-height:1}

.contact-divider{display:flex;align-items:center;gap:12px;color:#8792a5;font-size:9px;font-weight:800;letter-spacing:1px;margin:28px 0 14px}
.contact-divider:before,.contact-divider:after{content:"";height:1px;background:var(--line);flex:1}

@media (max-width:600px) {.contact-only{padding:20px 17px}.whatsapp-button{font-size:11px;gap:8px}}

/* WhatsApp-specific button styling */
.whatsapp-button.primary{background:#25D366;color:#fff;border-color:#25D366}
.whatsapp-button.primary:hover{background:#1fb85a;border-color:#1fb85a}
.whatsapp-button .wa-icon{display:inline-grid;place-items:center;width:25px;height:25px;flex:0 0 25px;color:#fff}
.whatsapp-button .wa-icon svg{display:block;width:25px;height:25px}
.whatsapp-button .wa-arrow{font-size:18px;line-height:1}

/* Mobile-first first-screen layout */
@media  (max-width: 600px) {
  .topbar{height:58px;padding:0 16px;position:sticky;top:0;z-index:20}

  main{max-width:100%;padding:18px 14px 22px}

  .eyebrow{font-size:9px;letter-spacing:1.15px}

  .wizard-card{padding:18px 16px;border-radius:18px}

  .whatsapp-button{min-height:56px;padding:13px 12px;gap:9px;font-size:13px;border-radius:12px}
  .whatsapp-button .wa-icon,.whatsapp-button .wa-icon svg{width:23px;height:23px;flex-basis:23px}

  .contact-divider{margin:18px 0 12px}

  footer{padding:14px 16px}
}
@media  (max-width: 390px) {
  main{padding-left:11px;padding-right:11px}

  .wizard-card{padding:16px 13px}

  .whatsapp-button{font-size:12px;gap:7px}

}

/* High-visibility information panels */

/* Direct-to-contact layout: remove hero spacing and lift the contact card */
@media  (max-width:600px) {
  main{padding:12px 12px 18px}
  .wizard-card{padding:17px 14px}

  .whatsapp-button{min-height:54px}

  .contact-divider{margin:15px 0 10px}

}

/* Compact hero: keeps the requested headline without pushing contact options too far down */
.compact-intro{text-align:center;margin:0 auto 16px}
.compact-intro .eyebrow{font-weight:800;display:inline-flex;align-items:center;gap:8px}
.compact-intro .eyebrow span{width:7px;height:7px;background:#17b67d;border-radius:50%;flex:0 0 7px}
.compact-intro h1{font:800 clamp(27px,5vw,40px)/1.08 Manrope,sans-serif}
.compact-intro h1 em{font-style:normal;color:var(--blue)}
.compact-intro p{margin:0 auto}
@media (max-width:600px) {
 .compact-intro{margin:0 auto 12px;padding:0 2px}
 .compact-intro .eyebrow{font-size:9px;letter-spacing:.9px;gap:6px}
 .compact-intro h1{font-size:clamp(25px,6.5vw,32px);line-height:1.07;letter-spacing:-.9px;margin:7px 0 6px}
 .compact-intro p{font-size:11px;max-width:350px}
}
@media (max-width:390px) {.compact-intro h1{font-size:25px}.compact-intro p{font-size:10.5px}}

/* Privacy Policy link: improve visibility and tap target on mobile */
footer .privacy-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:9px;color:var(--blue);font-size:12px;font-weight:700;text-decoration:underline;text-underline-offset:3px;position:relative;z-index:2;cursor:pointer;pointer-events:auto}footer .privacy-link:hover,footer .privacy-link:focus-visible{background:var(--pale);color:var(--blue-dark);outline:2px solid #b9caff;outline-offset:2px}

/* Header layout update: Privacy Policy and copyright beside the brand; no bottom footer */
.topbar{min-height:96px;height:auto;padding:18px max(22px,calc((100% - 1080px)/2));gap:24px}
.topbar .logo{width:66px;height:66px;border-radius:18px}
.topbar .brand{gap:16px}
.topbar .brand small{margin-top:5px}
.header-meta .privacy-link{border-radius:16px;text-decoration:none;transition:background .15s,border-color .15s}

@media (max-width:600px) {.topbar .logo{border-radius:12px}.topbar .brand{min-width:0}.topbar .brand small{margin-top:3px}.header-meta .privacy-link{border-radius:10px;white-space:nowrap}}
@media (max-width:380px) {.topbar{padding-left:9px;padding-right:9px}.topbar .brand{gap:6px}.topbar .logo{width:37px;height:37px}}

/* Enhanced TikTok showcase: clear profile destination, no fabricated video previews */
.tiktok-showcase{margin-top:13px;padding:16px;border:1px solid #dce2ec;border-radius:15px;background:linear-gradient(135deg,#fff 0%,#f8faff 100%);box-shadow:0 5px 18px rgba(25,36,55,.045)}

.tiktok-showcase h3{font:800 17px/1.25 Manrope,sans-serif;letter-spacing:-.3px;margin:2px 0 2px;color:var(--ink)}
.tiktok-profile-button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 14px;border-radius:10px;background:#11131b;color:#fff;text-decoration:none;font-size:12px;font-weight:800;transition:transform .15s,box-shadow .15s}
.tiktok-profile-button:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(17,19,27,.18)}

@media (max-width:600px) {.tiktok-showcase{padding:14px;margin-top:11px;border-radius:13px}.tiktok-showcase h3{font-size:16px}.tiktok-profile-button{min-height:45px}}

/* Facebook page card: placed directly below TikTok */
.facebook-showcase{margin-top:12px;padding:16px;border:1px solid #dce2ec;border-radius:15px;background:linear-gradient(135deg,#fff 0%,#f6f9ff 100%);box-shadow:0 5px 18px rgba(25,36,55,.045)}
.facebook-showcase h3{font:800 17px/1.25 Manrope,sans-serif;letter-spacing:-.3px;margin:0 0 3px;color:var(--ink)}

.facebook-profile-button{min-height:44px;display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 14px;border-radius:10px;background:#1877f2;color:#fff;text-decoration:none;font-size:12px;font-weight:800;transition:transform .15s,box-shadow .15s}
.facebook-profile-button:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(24,119,242,.2)}
@media (max-width:600px) {.facebook-showcase{padding:14px;margin-top:11px;border-radius:13px}.facebook-showcase h3{font-size:16px}.facebook-profile-button{min-height:45px}}

/* Premium complete-site refresh — layered on top of the original visual identity */
html{scroll-padding-top:96px}
.topbar{position:sticky;top:0;z-index:30;backdrop-filter:saturate(155%) blur(14px);background:rgba(255,255,255,.94);border-bottom-color:rgba(223,230,241,.9)}
.topbar .brand b{letter-spacing:-.55px}
.topbar .logo{box-shadow:0 4px 12px rgba(29,47,86,.12);outline:1px solid rgba(255,255,255,.9);outline-offset:-2px}
main{max-width:1040px;padding:30px 22px 72px}
.compact-intro{max-width:780px}
.compact-intro .eyebrow{border-radius:999px;padding:8px 13px}
.compact-intro p{max-width:600px}
.wizard-card.contact-only{max-width:760px;border:1px solid rgba(220,228,241,.95);border-radius:25px;box-shadow:var(--soft-shadow);background:rgba(255,255,255,.96)}

.whatsapp-button{box-shadow:0 8px 18px rgba(37,211,102,.16);border-radius:13px}
.whatsapp-button:hover{transform:translateY(-1px);box-shadow:0 12px 22px rgba(37,211,102,.2)}

.tiktok-showcase,.facebook-showcase{display:block;color:inherit;text-decoration:none;position:relative;overflow:hidden;border-radius:19px;padding:19px;border-color:#e1e7f1;background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(247,249,255,.96));box-shadow:0 8px 22px rgba(35,54,94,.055);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.tiktok-showcase:before,.facebook-showcase:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#25f4ee,#fe2c55,#315eea);opacity:.8}
.facebook-showcase:before{background:linear-gradient(90deg,#73a6ff,#1877f2)}
.tiktok-showcase:hover,.facebook-showcase:hover{transform:translateY(-2px);border-color:#c8d5f0;box-shadow:0 14px 28px rgba(35,54,94,.09)}
.tiktok-showcase:focus-visible,.facebook-showcase:focus-visible{outline:3px solid #9fb6ff;outline-offset:3px}

.tiktok-profile-button,.facebook-profile-button{border-radius:12px;pointer-events:none}

.site-section{margin:48px auto 0;max-width:960px;scroll-margin-top:112px}
.section-heading{text-align:center;margin:0 auto 23px;max-width:640px}
.section-kicker{display:inline-block;line-height:1.3}
.section-heading h2,.about-card h2,.terms-card h2{font:800 clamp(24px,3.6vw,32px)/1.2 Manrope,sans-serif;letter-spacing:-1px;color:var(--ink);margin:8px 0 8px}
.section-heading p{margin:0;color:var(--muted)}
.steps-grid{display:grid}
.step-card{position:relative;min-width:0;border:1px solid rgba(222,229,241,.96);border-radius:19px;background:linear-gradient(145deg,#fff 0%,#fafbff 100%);box-shadow:0 8px 24px rgba(35,54,94,.045);transition:transform .18s ease,box-shadow .18s ease}
.step-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(35,54,94,.075)}
.step-card h3{font:800 16px/1.3 Manrope,sans-serif;letter-spacing:-.25px;margin:0 0 9px}
.step-card p{font-size:12px;color:#69768b;margin:0}

.safety-panel{display:grid;grid-template-columns:55px minmax(0,1fr);border:1px solid #c9d8ff;border-radius:22px;box-shadow:0 12px 30px rgba(42,72,148,.06)}
.safety-panel-icon{width:52px;height:52px;border-radius:16px;background:#315eea;color:#fff;display:grid;place-items:center;font-size:26px;font-weight:800;box-shadow:0 8px 16px rgba(49,94,234,.18)}
.safety-panel h2{font:800 clamp(22px,3.2vw,29px)/1.2 Manrope,sans-serif;letter-spacing:-.7px;margin:7px 0 9px}
.safety-panel p{max-width:740px;color:#596981;margin:0 0 12px}
.about-card{display:grid;grid-template-columns:82px minmax(0,1fr);align-items:start;border:1px solid #e0e7f1;border-radius:23px;background:linear-gradient(135deg,#fff,#f9fbff);box-shadow:0 10px 28px rgba(35,54,94,.05)}
.about-card>img{width:82px;height:82px;border-radius:22px;object-fit:cover;border:3px solid #fff;box-shadow:0 5px 18px rgba(30,48,82,.13)}
.about-card h2{margin:7px 0 10px}
.about-card p,.terms-card p{font-size:12px;line-height:1.85;color:#647189;margin:0 0 11px}
.about-card .independent-note{color:#31507e;background:#f0f4ff;border-radius:10px;margin:8px 0 0}
.terms-card{border:1px solid #e0e7f1;border-radius:20px;background:#fff;box-shadow:0 8px 24px rgba(35,54,94,.04)}

.floating-whatsapp{position:fixed;z-index:25;right:max(18px,calc((100vw - 1080px)/2));display:flex;align-items:center;gap:9px;border-radius:999px;border:1px solid rgba(255,255,255,.4);background:linear-gradient(135deg,#27d96b,#16a85b);color:#fff;text-decoration:none;font-weight:800;box-shadow:0 10px 25px rgba(20,156,85,.26);transition:transform .16s ease,box-shadow .16s ease}
.floating-whatsapp-icon{width:21px;height:21px;flex:0 0 21px;display:block}.floating-whatsapp>span:first-child{font-size:19px}.floating-whatsapp:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(20,156,85,.32)}.floating-whatsapp:focus-visible{outline:3px solid #8ddcad;outline-offset:3px}
.site-footer{max-width:none;display:grid;grid-template-columns:auto minmax(150px,1fr) auto;align-items:center;gap:14px 25px;padding:25px max(22px,calc((100% - 1040px)/2));background:rgba(255,255,255,.96);border-top:1px solid #e3e9f2}
.footer-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.footer-brand img{width:42px;height:42px;object-fit:cover;border-radius:13px}.footer-brand b,.footer-brand small{display:block;line-height:1.3}.footer-brand b{font:800 14px Manrope,sans-serif}.footer-brand small{color:var(--muted);margin-top:3px}
.footer-note{color:#77839a;margin:0}
.footer-links{display:flex;gap:16px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.footer-links a{font-weight:700;text-decoration:none;color:#65738a}.footer-links a:hover{color:var(--blue)}
.footer-copyright{grid-column:1/-1;border-top:1px solid #edf0f5;padding-top:13px;color:#8a95a6}
@media (max-width:760px) {
 html{scroll-padding-top:85px}.steps-grid{grid-template-columns:1fr;gap:11px}.step-card{min-height:0;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:start}.step-card h3{grid-column:2;grid-row:1;margin:2px 25px 6px 0}.step-card p{grid-column:2;grid-row:2}.safety-panel{grid-template-columns:43px minmax(0,1fr);gap:13px;border-radius:19px}.safety-panel-icon{width:42px;height:42px;border-radius:13px;font-size:22px}.about-card{grid-template-columns:60px minmax(0,1fr);border-radius:20px}.about-card>img{width:60px;height:60px;border-radius:17px}.site-footer{grid-template-columns:minmax(0,1fr) auto;gap:14px 10px}.footer-note{grid-column:1/-1;grid-row:2}.footer-links{grid-column:1/-1;grid-row:3;justify-content:flex-start;gap:17px}.footer-copyright{grid-row:4}.site-section{scroll-margin-top:94px}
}
@media (max-width:420px) {.topbar{padding-left:10px;padding-right:10px}.topbar .brand{gap:7px}.topbar .logo{width:39px;height:39px}.header-meta{gap:6px}.compact-intro .eyebrow{padding:7px 9px}.compact-intro h1{letter-spacing:-1.1px}.compact-intro p{font-size:11px}.site-section{margin-top:31px}.about-card{grid-template-columns:48px minmax(0,1fr);gap:11px;padding:16px 12px}.about-card>img{width:48px;height:48px;border-radius:13px}.about-card h2{font-size:19px}.floating-whatsapp{font-size:11px}.footer-links{gap:12px}.footer-links a{font-size:10px}}
@media (prefers-reduced-motion:reduce) {html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Premium Mobile Polish readability, touch targets and calmer spacing */
:root{--body-size:16px;--body-leading:1.75}
body{font-size:var(--body-size);line-height:var(--body-leading);-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility}
.compact-intro{padding:12px 8px 16px}
.compact-intro .eyebrow{font-size:11px;letter-spacing:1.05px}
.compact-intro h1{font-size:clamp(36px,5.4vw,52px);line-height:1.12;letter-spacing:-1.6px;margin:18px 0 13px}
.compact-intro p{font-size:16px;line-height:1.7}
.wizard-card.contact-only{padding:30px}
.whatsapp-button{font-size:16px;min-height:60px}

.tiktok-showcase h3,.facebook-showcase h3{font-size:19px}
.tiktok-profile-button,.facebook-profile-button{font-size:14px;min-height:52px}

.section-heading h2,.about-card h2,.terms-card h2{line-height:1.2}
.section-heading p{font-size:15px;line-height:1.75}
.step-card p,
.safety-panel p,
.about-card p,
.terms-card p{font-size:14px;line-height:1.8}
.step-card h3{font-size:17px}

.floating-whatsapp{min-height:50px;padding:0 18px;font-size:14px;bottom:18px}
.footer-links a{font-size:13px;padding:5px 0}
.footer-copyright{font-size:12px}
.topbar .brand b{font-size:16px}
.topbar .brand small{font-size:11px}
.header-meta .privacy-link{display:inline-flex;align-items:center;justify-content:center}
@media (max-width:760px) {
 main{padding:26px 15px 66px}
 .compact-intro{padding:9px 3px 14px;margin-bottom:20px}
 .compact-intro h1{font-size:clamp(32px,8.2vw,42px);letter-spacing:-1.2px;line-height:1.12;margin:15px 0 11px}
 .compact-intro p{font-size:15px;line-height:1.7}
 .wizard-card.contact-only{padding:22px 18px;border-radius:22px}

 .tiktok-showcase,.facebook-showcase{padding:17px;border-radius:18px}
 .tiktok-showcase h3,.facebook-showcase h3{font-size:18px}

 .tiktok-profile-button,.facebook-profile-button{min-height:50px;font-size:14px}
 .site-section{margin-top:40px}
 .section-heading{margin-bottom:20px}
 .section-heading h2{font-size:clamp(24px,6.4vw,30px);letter-spacing:-.7px}
 .section-heading p{font-size:14px}
 .step-card{padding:19px 17px;column-gap:13px}
 .step-card p,
 .safety-panel p,
 .about-card p,
 .terms-card p{font-size:14px;line-height:1.8}
 .step-card h3{font-size:16px}

 .safety-panel{padding:21px 17px}
 .safety-panel h2{font-size:23px}
 .about-card{padding:19px 16px;gap:14px}
 .about-card h2{font-size:21px}
 .terms-card{padding:21px 18px}
 .floating-whatsapp{right:12px;bottom:12px;min-height:48px;padding:0 15px;font-size:13px}
 .site-footer{padding:22px 17px calc(26px + env(safe-area-inset-bottom))}
}
@media (max-width:420px) {
 .header-meta .privacy-link{font-size:11px;min-height:40px;padding:0 10px}

 .compact-intro .eyebrow{font-size:9px;letter-spacing:.6px}
 .compact-intro h1{font-size:clamp(30px,8vw,36px)}
 .wizard-card.contact-only{padding:18px 13px}

 .tiktok-showcase,.facebook-showcase{padding:15px}
 .tiktok-showcase h3,.facebook-showcase h3{font-size:16px}

 .section-heading h2{font-size:24px}
 .step-card p,
 .safety-panel p,
 .about-card p,
 .terms-card p{font-size:13.5px}
 .floating-whatsapp{right:10px;bottom:10px}
}
@media (hover:none) {.tiktok-showcase:hover,.facebook-showcase:hover,.step-card:hover{transform:none}}

/* Recovery proof gallery */

.proof-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.proof-card{overflow:hidden;min-width:0;background:rgba(255,255,255,.92);border:1px solid #dfe6f2;border-radius:20px;box-shadow:0 8px 24px rgba(26,48,86,.055);transition:transform .2s ease,box-shadow .2s ease}
.proof-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(26,48,86,.10)}
.proof-image-link{display:block;aspect-ratio:4/3;background:linear-gradient(135deg,#eef3ff,#f5f8fc);overflow:hidden}
.proof-image-link img{display:block;width:100%;height:100%;object-fit:cover}

.proof-card h3{margin:0 0 7px;color:#19243a;font-size:16px;line-height:1.35}
.proof-card p{margin:0;color:#68758a;font-size:13px;line-height:1.65;overflow-wrap:anywhere}
.proof-card-date{display:block;margin-top:10px;color:#8a95a6;font-size:11px}
.proof-empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:28px 22px;border:1px dashed #b9c8e5;border-radius:20px;background:linear-gradient(135deg,rgba(239,244,255,.88),rgba(255,255,255,.96))}
.proof-empty[hidden]{display:none}
.proof-empty-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:#e3ebff;color:#315fe1;font-size:25px}
.proof-empty h3{margin:3px 0 0;color:#1c2940;font-size:17px}
.proof-empty p{max-width:560px;margin:0;color:#68758a;font-size:13px;line-height:1.7}
.proof-empty code{padding:2px 5px;border-radius:5px;background:#e9eef8;color:#2d4f9f;font-size:.92em}

@media (max-width:760px) {.proof-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.proof-card{border-radius:16px}.proof-card-copy{padding:12px}.proof-card h3{font-size:14px}.proof-card p{font-size:12px}}
@media (max-width:460px) {.proof-gallery{grid-template-columns:1fr}.proof-image-link{aspect-ratio:16/10}.proof-empty{padding:24px 16px}}
@media (hover:none) {.proof-card:hover{transform:none;box-shadow:0 8px 24px rgba(26,48,86,.055)}}

/* Header shortcut to the Recovery Proofs gallery */
.header-meta{display:flex;align-items:center;flex-shrink:0}
.header-meta .proofs-header-link{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;text-decoration:none;white-space:nowrap;transition:background .18s,border-color .18s,transform .18s}
.header-meta .proofs-header-link:hover{transform:translateY(-1px)}
.header-meta .proofs-header-link:focus-visible,.header-meta .privacy-link:focus-visible{outline:3px solid #9bb5ff;outline-offset:2px}
@media (max-width:600px) {.header-meta .proofs-header-link{min-height:38px;padding:0 9px;font-size:10px;border-radius:10px}.header-meta .privacy-link{min-height:38px;padding:0 9px;font-size:10px}}
@media (max-width:380px) {.header-meta{gap:4px}.header-meta .proofs-header-link{padding:0 6px;font-size:9px;gap:3px}.header-meta .privacy-link{padding:0 6px;font-size:9px}}

/* Header refinement: distinct, visible action buttons; copyright removed from header */
.header-meta{gap:12px}
.header-meta .proofs-header-link{min-height:48px;padding:0 17px;border:1px solid #2f5fe7;background:linear-gradient(135deg,#315fe8 0%,#547af3 100%);color:#fff;font-size:13px;font-weight:800;box-shadow:0 5px 14px rgba(49,94,232,.22)}
.header-meta .proofs-header-link:hover{background:linear-gradient(135deg,#264fcf 0%,#4269e8 100%);border-color:#264fcf;box-shadow:0 7px 18px rgba(49,94,232,.28)}
.header-meta .proofs-header-link span[aria-hidden="true"]{font-size:16px}
.header-meta .privacy-link{min-height:48px;padding:0 17px;border:1px solid #cbd5e5;background:#fff;color:#34415a;font-size:13px;font-weight:800;box-shadow:0 3px 10px rgba(31,49,83,.07)}
.header-meta .privacy-link:hover{background:#f6f8ff;border-color:#9fb4ec;color:#244fc7}
@media (max-width:600px) {
 .topbar{min-height:unset;height:auto;padding:12px 12px 13px;gap:10px;flex-wrap:wrap;justify-content:center}
 .topbar .brand{flex:1 1 100%;justify-content:center;gap:9px}
 .topbar .logo{width:39px;height:39px}
 .header-meta{justify-content:center}
 .header-meta .proofs-header-link,.header-meta .privacy-link{min-height:43px;padding:0 15px;font-size:12px;border-radius:12px}
}
/* Order compact brand font sizes from wider to narrower breakpoints. */
@media (max-width:420px) {.topbar .brand b{font-size:14px}.topbar .brand small{font-size:10px}}
@media (max-width:380px) {.topbar .brand small{font-size:9px}}
@media (max-width:360px) {
 .header-meta{gap:7px}
 .header-meta .proofs-header-link,.header-meta .privacy-link{padding:0 10px;font-size:11px;min-height:41px}
}

/* Proof image display: show the entire uploaded screenshot without cropping. */
.proof-image-protected{position:relative;aspect-ratio:auto;overflow:hidden;background:#edf2fa;user-select:none;-webkit-user-select:none}
.proof-image-protected img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.proof-watermark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:12px;color:rgba(255,255,255,.78);font-size:clamp(10px,1.8vw,17px);font-weight:900;letter-spacing:.12em;text-align:center;text-shadow:0 2px 5px rgba(0,0,0,.78);transform:rotate(-22deg);pointer-events:none;user-select:none;-webkit-user-select:none}

/* Case metadata sits above the proof image for clearer context. */

.proof-card .proof-image-link{border-top:1px solid #e8edf6}

/* Premium case-status rows with inline SVG icons (HTML UI, not baked into proof image). */
.proof-card-copy{padding:15px 15px 13px}
.proof-status-list{display:grid;gap:9px;margin:0 0 14px}
.proof-status-item{display:flex;align-items:center;gap:11px;min-width:0;padding:11px 12px;border:1px solid;border-radius:14px}
.proof-status-icon{display:grid;place-items:center;flex:0 0 39px;width:39px;height:39px;border-radius:12px}
.proof-status-icon svg{display:block;width:22px;height:22px}
.proof-status-text{display:grid;gap:3px;min-width:0}
.proof-status-label{font-size:9px;font-weight:850;letter-spacing:.11em;line-height:1.25}
.proof-status-text strong{font-size:clamp(13px,1.35vw,16px);line-height:1.35;color:#19243a;overflow-wrap:anywhere}
.proof-status-suspended{background:linear-gradient(110deg,#fff0f2,#fff9fa);border-color:#ffd2d8}
.proof-status-suspended .proof-status-icon{background:#ffe0e5;color:#d92d43}
.proof-status-suspended .proof-status-label{color:#c92b42}
.proof-status-violation{background:linear-gradient(110deg,#fff7e9,#fffdf8);border-color:#ffe0ad}
.proof-status-violation .proof-status-icon{background:#ffebc7;color:#c8790a}
.proof-status-violation .proof-status-label{color:#ad690b}
@media (max-width:460px) {.proof-card-copy{padding:12px}.proof-status-item{gap:9px;padding:9px}.proof-status-icon{flex-basis:34px;width:34px;height:34px;border-radius:10px}.proof-status-icon svg{width:20px;height:20px}.proof-status-text strong{font-size:13px}.proof-status-label{font-size:8px}}

/* Compact Daily Bible Verse strip placed directly under the header */
.daily-verse-card:before{content:"";position:absolute;top:-45px;right:-20px;width:100px;height:100px;border-radius:50%;pointer-events:none}
.daily-verse-topline{display:flex;justify-content:center;align-items:center;flex-wrap:wrap}
.daily-verse-cross{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:7px;font-weight:800}
.daily-verse-label{font-weight:800}
.daily-verse-date{font-weight:800;letter-spacing:.4px;border-radius:999px;padding:4px 7px}
.daily-verse-card h2{font:800 16px/1.25 Manrope,sans-serif;letter-spacing:-.3px}
.daily-verse-text{position:relative;max-width:680px;margin:0 auto 3px;font:600 14px/1.5 "DM Sans",sans-serif}
.daily-verse-reference{position:relative;margin:0;font-size:10px;font-weight:800;letter-spacing:.2px}
.daily-verse-translation{position:relative;margin:4px auto 0;max-width:680px;font-size:11px;line-height:1.45}

.daily-verse-card button:focus-visible{outline:3px solid #b9caff;outline-offset:2px}
@media (max-width:600px) {.daily-verse-card{margin:10px 0 5px;padding:11px 10px 10px;border-radius:13px}.daily-verse-topline{gap:5px}.daily-verse-label{font-size:8px;letter-spacing:.8px}.daily-verse-card h2{font-size:15px}.daily-verse-text{font-size:13px;line-height:1.45}.daily-verse-translation{font-size:10px}}

/* Hybrid redesign: airy light page sections + readable deep-navy cards */
:root{--soft-shadow:0 14px 36px rgba(19,35,66,.09)}
.topbar,footer{background:rgba(255,255,255,.97);border-color:#dce4f0}
.topbar{box-shadow:0 6px 22px rgba(19,35,66,.06)}
.compact-intro h1{color:#17243b}.compact-intro p{color:#58677f}
.wizard-card.contact-only,
.wizard-card,
.about-card,
.terms-card,
.step-card{background:#fff;border-color:#dce4f0;box-shadow:0 10px 28px rgba(19,35,66,.06)}
.tiktok-showcase,
.facebook-showcase{background:#fff;border-color:#dce4f0;color:#18243a}
.step-card p{color:#56657c}
.safety-panel{background:linear-gradient(135deg,#eaf0ff,#fff 85%);border-color:#cad8f5}
/* Dark navy cards are intentional accents; all text meets a stronger contrast target. */
.daily-verse-card:before{background:rgba(126,151,255,.08)}
.daily-verse-text{color:#f4f7ff}
.daily-verse-reference{color:#aebeff}
.daily-verse-translation{color:#d0d9e9}

footer>a:not(.brand),footer>span{color:#596980}
@media (max-width:600px) {.daily-verse-card{box-shadow:0 8px 20px rgba(14,25,45,.16)}}

/* Final spacing adjustment: place the Daily Bible Verse immediately below the header links. */
main{padding-top:0}
.daily-verse-card{margin-top:0}
@media (max-width:600px) {main{padding-top:0}}

/* Compact vertical rhythm: lift the WhatsApp contact panel and following content. */
.compact-intro{margin-bottom:10px;padding-bottom:4px}
.compact-intro h1{margin-bottom:7px}

.wizard-card.contact-only{margin-top:0;padding-top:18px}

@media (max-width:600px) {
  .compact-intro{margin-bottom:7px;padding-top:5px;padding-bottom:2px}
  .compact-intro h1{margin-top:10px;margin-bottom:5px}
  .compact-intro p{line-height:1.45}
  .wizard-card.contact-only{padding-top:15px;padding-bottom:16px}

  .site-section{margin-top:28px}
}

/* Adaptive Daily Bible Verse card: match the user's system/browser theme. */
@media  (prefers-color-scheme: light)  {
  .daily-verse-card {
    background: linear-gradient(145deg, #ffffff 0%, #f1f6ff 100%);
    border-color: #d8e2f3;
    box-shadow: 0 10px 26px rgba(35, 63, 115, .10);
    color: #18243a;
  }
  .daily-verse-card:before { background: rgba(67, 108, 232, .07); }
  .daily-verse-cross { background: #e7edff; color: #315eea; }
  .daily-verse-label { color: #3156c9; }
  .daily-verse-date { background: #e9effa; color: #455675; }
  .daily-verse-card h2 { color: #18243a; }
  .daily-verse-text { color: #202f4a; }
  .daily-verse-reference { color: #315eea; }
  .daily-verse-translation { color: #52627b; }

}
@media  (prefers-color-scheme: dark)  {
  .daily-verse-card {
    background: radial-gradient(circle at 100% 0%, rgba(91,123,225,.18), transparent 34%), linear-gradient(145deg,#17243b 0%,#101a2c 100%);
    border-color: #34435e;
    box-shadow: 0 12px 28px rgba(0,0,0,.28);
    color: #f7f9ff;
  }
  .daily-verse-cross { background: #2c3c5e; color: #c5d0ff; }
  .daily-verse-label { color: #c0ccff; }
  .daily-verse-date { background: #29364d; color: #edf1ff; }
  .daily-verse-card h2 { color: #fff; }
  .daily-verse-text { color: #f4f7ff; }
  .daily-verse-reference { color: #c0ccff; }
  .daily-verse-translation { color: #e0e7f3; }

}

/* Stronger contrast for the main headline accent, distinct from the Bible verse card. */
@media  (prefers-color-scheme: light)  {
  .compact-intro h1 em { color: #dc2626; }
}
@media  (prefers-color-scheme: dark)  {
  .compact-intro h1 em { color: #f87171; }
  /* Keep the main headline readable because the page background remains light. */
  .compact-intro h1 { color: #192437 !important; -webkit-text-fill-color: #192437; }
}

/* Compact title-to-description spacing across content cards */
.step-card h3,
.tiktok-showcase h3,
.facebook-showcase h3,
.proof-card h3,
.about-card h2,
.terms-card h2,
.safety-panel h2 {
  padding-bottom: 8px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(133, 148, 173, 0.28);
}
.step-card,
.proof-card-copy,
.about-card,
.terms-card,
.safety-panel {
  row-gap: 10px;
}
.step-card h3,
.tiktok-showcase h3,
.facebook-showcase h3,
.proof-card h3 {
  margin-top: 0;
}
@media  (max-width: 760px)  {
  .step-card { padding-top: 15px; padding-bottom: 15px; }
  .step-card h3 { margin-top: 0; }

  .proof-card-copy { padding: 12px 14px 14px; }
  .about-card, .terms-card, .safety-panel { padding-top: 17px; padding-bottom: 17px; }
}

/* Final compact layout: only two process steps remain. */
.steps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.step-card { min-height: 0; padding: 16px 17px; }
.step-card h3 { margin-top: 0; margin-bottom: 5px; padding-bottom: 5px; line-height: 1.3; }
.step-card p { margin-top: 0; line-height: 1.65; }
@media  (max-width: 760px)  {
  .steps-grid { grid-template-columns: 1fr; gap: 9px; }
  .step-card { padding: 14px 15px; }
  .step-card h3 { margin-bottom: 4px; padding-bottom: 4px; }
  .step-card p { line-height: 1.6; }
}

/* clearer account-safety heading and tighter spacing. */

/* Back-to-albums control shown while browsing an individual proof album */
.proof-album-back{display:block;margin:0 0 14px;padding:10px 15px;border:1px solid #dce3ef;border-radius:12px;background:#fff;color:#344054;font:700 14px/1.2 inherit;cursor:pointer;box-shadow:0 2px 7px rgba(20,35,65,.04)}
.proof-album-back:hover{border-color:#9db5f8;background:#f7f9ff}
.proof-album-back:focus-visible{outline:3px solid rgba(49,95,225,.25);outline-offset:2px}
.proof-album-back[hidden]{display:none}

/* enforce a clear mobile proof order: status, proof image, then Back to albums. */
.proof-card{display:flex;flex-direction:column}
.proof-card .proof-card-copy{order:1}
.proof-card .proof-image-link{order:2}
.proof-card .proof-album-back-inline{order:3;position:relative;z-index:1}
@media (max-width:600px) {.proof-card .proof-album-back-inline{min-height:48px;margin:12px auto 16px;font-size:14px}}

/* album back button directly beneath the proof image */
.proof-album-back-inline{display:block;width:calc(100% - 24px);min-height:43px;margin:12px auto 14px;padding:10px 16px;border:1px solid #315fe1;border-radius:12px;background:linear-gradient(120deg,#315fe1,#5479f3);color:#fff;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 6px 14px rgba(49,95,225,.18)}
.proof-album-back-inline:hover{filter:brightness(1.04)}
.proof-album-back-inline:focus-visible{outline:3px solid rgba(49,95,225,.28);outline-offset:3px}

/* Dedicated Recovery Proofs shortcut below the Facebook Page card */
.recovery-proofs-showcase{display:block;position:relative;overflow:hidden;margin-top:13px;padding:18px;border:1px solid #d8e2ff;border-radius:18px;box-shadow:0 8px 22px rgba(49,94,234,.08);color:inherit;text-decoration:none;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.recovery-proofs-showcase:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#315eea,#7c9cff,#315eea)}
.recovery-proofs-showcase:hover{transform:translateY(-2px)}
.recovery-proofs-showcase:focus-visible{outline:3px solid #9fb6ff;outline-offset:3px}
.recovery-proofs-showcase h3{font:800 18px/1.25 Manrope,sans-serif;letter-spacing:-.35px;margin:0 0 3px;color:var(--ink)}
.recovery-proofs-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:15px 0 16px}
.recovery-proof-preview-item{position:relative;display:block;min-width:0;overflow:hidden;aspect-ratio:4/3;border:1px solid rgba(205,216,239,.95);border-radius:12px;background:#e9eef8}
.recovery-proof-preview-item img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%;transition:transform .22s ease}
.recovery-proofs-showcase:hover .recovery-proof-preview-item img{transform:scale(1.025)}
.recovery-proof-preview-item>span{position:absolute;inset:auto 0 0;padding:20px 8px 8px;background:linear-gradient(transparent,rgba(18,31,58,.82));color:#fff;font-size:11px;font-weight:800;line-height:1.3}
.recovery-proofs-button{min-height:49px;display:flex;align-items:center;justify-content:center;gap:9px;padding:11px 14px;background:linear-gradient(100deg,#315eea,#4e72f0);color:#fff;font-size:13px;font-weight:800;transition:transform .15s,box-shadow .15s}
.recovery-proofs-button:hover{box-shadow:0 9px 18px rgba(49,94,234,.24)}
@media (max-width:600px) {.recovery-proofs-showcase{padding:15px;margin-top:11px;border-radius:15px}.recovery-proofs-showcase h3{font-size:16px}.recovery-proofs-preview{gap:7px;margin:12px 0}.recovery-proof-preview-item{border-radius:10px}.recovery-proof-preview-item>span{font-size:10px;padding:17px 6px 6px}.recovery-proofs-button{min-height:47px;font-size:12px}}

/* bring the process section closer to Recovery Proofs and reduce mobile vertical waste. */
@media  (max-width: 600px)  {
  .wizard-card.contact-only {
    padding-bottom: 8px;
  }
  .recovery-proofs-showcase {
    padding-bottom: 11px;
  }
  .how-section {
    margin-top: 8px;
  }
  .how-section .section-heading {
    margin-bottom: 12px;
  }
  .how-section .section-kicker {
    line-height: 1.15;
  }
  .how-section .section-heading h2 {
    margin: 4px 0 5px;
    font-size: clamp(22px, 5.8vw, 27px);
    line-height: 1.16;
  }
  .how-section .section-heading p {
    font-size: 13px;
    line-height: 1.5;
  }
  .how-section .steps-grid {
    gap: 8px;
  }
  .how-section .step-card {
    padding: 12px 13px;
    column-gap: 11px;
    border-radius: 16px;
  }
  .how-section .step-card h3 {
    margin: 0 22px 4px 0;
    padding-bottom: 4px;
    font-size: 15px;
    line-height: 1.3;
  }
  .site-section:not(.how-section) {
    margin-top: 21px;
  }
}
@media  (max-width: 420px)  {
  .wizard-card.contact-only {
    padding-bottom: 7px;
  }
  .how-section .section-heading {
    margin-bottom: 10px;
  }
}

/* compact Remember, FAQ, About, Terms and footer spacing on mobile */
@media  (max-width: 600px)  {
  .site-section.safety-section { margin-top: 12px !important; }
  .safety-panel { padding: 16px 14px !important; gap: 10px !important; border-radius: 20px; }
  .safety-panel h2 { margin: 0 0 8px !important; font-size: clamp(20px, 5.4vw, 24px) !important; line-height: 1.18 !important; }
  .safety-panel p { margin: 7px 0 0 !important; font-size: 13px !important; line-height: 1.48 !important; }
  .safety-panel-icon { width: 42px !important; height: 42px !important; }
  .site-section.about-section, .site-section.terms-section { margin-top: 16px !important; }
  .about-card { padding: 15px 13px !important; gap: 10px !important; border-radius: 18px !important; }
  .about-card h2 { margin: 4px 0 6px !important; font-size: 19px !important; line-height: 1.2 !important; }
  .about-card p, .terms-card p { margin: 6px 0 0 !important; font-size: 12.5px !important; line-height: 1.5 !important; }
  .terms-card { padding: 16px 14px !important; border-radius: 18px !important; }
  .terms-card h2 { margin: 5px 0 2px !important; font-size: 19px !important; line-height: 1.2 !important; }
  .site-footer { padding: 15px 14px !important; gap: 10px !important; }
  .footer-brand img { width: 42px !important; height: 42px !important; }
  .footer-note { margin: 0 !important; font-size: 11px !important; line-height: 1.45 !important; }
  .footer-links { gap: 8px !important; }
}
@media  (max-width: 420px)  {
  .site-section.safety-section { margin-top: 9px !important; }
}

/* improve readability of the three process descriptions */

/* make the three process descriptions below their headings easier to read. */
@media  (max-width: 600px)  {
  .how-section .step-card p { font-size: 15px !important; line-height: 1.58 !important; }
}
@media  (max-width: 420px)  {
  .how-section .step-card p { line-height: 1.55 !important; }
}

/* improve readability of About This Website and account-safety text */
.about-card .section-kicker { font-size: 12px; line-height: 1.4; letter-spacing: 1.5px; }
.about-card h2 { font-size: clamp(25px, 3.8vw, 32px); line-height: 1.25; }
.about-card p { font-size: 16px; line-height: 1.75; }
.about-card .independent-note { font-size: 15.5px; line-height: 1.7; }
.safety-panel p { font-size: 16px; }
.safety-panel p:last-child { font-weight: 800; font-size: 17px; color: #234fc5; }
@media  (max-width: 760px)  {
 .about-card p, .about-card .independent-note { font-size: 15px !important; line-height: 1.7 !important; }
}
@media  (max-width: 420px)  {
 .about-card p, .about-card .independent-note { font-size: 14.5px !important; line-height: 1.65 !important; }
 .safety-panel p { font-size: 14.5px !important; line-height: 1.65 !important; }
 .safety-panel p:last-child { font-size: 16px !important; }
}

/* improve readability of Terms and footer text */
.terms-card .section-kicker{font-size:14px !important;line-height:1.5 !important;letter-spacing:1.7px !important;font-weight:800 !important}
.terms-card h2{font-size:clamp(24px,3vw,29px) !important;line-height:1.25 !important;margin:8px 0 0 !important}
.terms-card p{font-size:clamp(16px,2vw,18px) !important;line-height:1.75 !important}
.footer-brand b{font-size:18px !important;line-height:1.35 !important}
.footer-brand small{font-size:14px !important;line-height:1.5 !important}
.footer-note{font-size:15px !important;line-height:1.75 !important}
@media (max-width:600px) {
 .terms-card .section-kicker{font-size:13px !important}
 .terms-card h2{font-size:24px !important}
 .terms-card p{font-size:16px !important;line-height:1.75 !important}
 .footer-brand b{font-size:17px !important}
 .footer-brand small{font-size:13px !important}
 .footer-note{font-size:14px !important;line-height:1.7 !important}
}

/* add a distinct Free Web Tools link to the top navigation */
.header-meta .webtools-header-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:54px;padding:0 20px;border:1px solid #0f766e;border-radius:16px;background:linear-gradient(135deg,#0f766e 0%,#159b8c 100%);color:#fff;text-decoration:none;font-size:15px;font-weight:800;white-space:nowrap;box-shadow:0 5px 14px rgba(15,118,110,.18);transition:transform .16s,filter .16s,box-shadow .16s}
.header-meta .webtools-header-link:hover{filter:brightness(1.05);transform:translateY(-1px);box-shadow:0 7px 17px rgba(15,118,110,.22)}
.header-meta .webtools-header-link:focus-visible{outline:3px solid #72d9cd;outline-offset:3px}
@media (max-width:600px) {
 .header-meta{display:grid !important;grid-template-columns:1fr 1fr;gap:8px !important;width:100%;}
 .header-meta .proofs-header-link,.header-meta .privacy-link,.header-meta .webtools-header-link{min-height:42px;padding:0 8px;font-size:11px;border-radius:11px;gap:5px;}
 .header-meta .webtools-header-link{grid-column:1 / -1;min-height:40px;}
}
@media (max-width:380px) {.header-meta .proofs-header-link,.header-meta .privacy-link,.header-meta .webtools-header-link{font-size:10px;padding:0 6px;gap:4px}}

/* Consistent icons in all three header buttons */
.header-meta .header-icon{width:18px;height:18px;flex:0 0 18px;display:inline-block;}
@media (max-width:600px) {.header-meta .header-icon{width:15px;height:15px;flex-basis:15px;}}

/* consolidated mobile header layout rule; desktop remains untouched. */
@media  (max-width: 600px)  {
  body .topbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    justify-content: stretch !important;
    column-gap: 4px !important;
    height: auto !important;
    min-height: 0 !important;
  }
  body .topbar > .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    flex: initial !important;
  }
  body .topbar > .header-meta { display: contents !important; }
  body .topbar > .header-meta > .privacy-link {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 0 8px !important;
    font-size: 10px !important;
    white-space: nowrap !important;
    flex: initial !important;
  }
  body .topbar > .header-meta > .webtools-header-link { grid-column: 1 !important; grid-row: 2 !important; }
  body .topbar > .header-meta > .proofs-header-link { grid-column: 2 !important; grid-row: 2 !important; }
  body .topbar > .header-meta > .webtools-header-link,
  body .topbar > .header-meta > .proofs-header-link {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 6px !important;
    gap: 4px !important;
    justify-content: center !important;
    font-size: 10px !important;
    white-space: nowrap !important;
    flex: initial !important;
  }
  body .topbar .header-icon { width: 14px !important; height: 14px !important; flex: 0 0 14px !important; }
}
@media  (max-width: 380px)  {
  body .topbar > .brand { gap: 5px !important; }
  body .topbar > .brand .logo { width: 34px !important; height: 34px !important; flex: 0 0 34px !important; }
  body .topbar > .brand b { font-size: 13px !important; }
  body .topbar > .brand small { font-size: 9px !important; }
  body .topbar > .header-meta > .privacy-link { font-size: 10px !important; padding: 0 6px !important; }
  body .topbar > .header-meta > .webtools-header-link,
  body .topbar > .header-meta > .proofs-header-link { font-size: 10px !important; padding: 0 4px !important; gap: 3px !important; }
}

/* make the About section brand title more noticeable */
.about-card h2.about-brand-title { color: #315eea !important; text-shadow: 0 1px 0 rgba(49, 94, 234, 0.08); }

/* compact review summary with owner-editable reviews behind a button */

.view-reviews-button { display: inline-flex; align-items: center; gap: 8px; justify-content: center; border: 1px solid var(--border, #dce2ed); background: var(--card, #fff); color: var(--text, #202b40); font: inherit; font-weight: 700; cursor: pointer; }
.view-reviews-button:hover { border-color: #4969b5;  }
.view-reviews-button:focus-visible { outline: 3px solid rgba(73,105,181,.28); outline-offset: 2px; }
.view-reviews-button span { font-size: 18px; transition: transform .2s ease; }
.view-reviews-button[aria-expanded="true"] span { transform: rotate(180deg); }
.reviews-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.reviews-grid[hidden] { display: none; }
.review-card { min-width: 0; padding: 18px; border: 1px solid var(--border, #dce2ed); border-radius: 18px; background: var(--card, #fff); box-shadow: 0 8px 22px rgba(26, 44, 82, .04); }
@media  (max-width: 760px)  { .review-card { padding: 16px; border-radius: 16px; } }

/* horizontal swipeable review cards on mobile */
@media  (max-width: 760px)  {
  .reviews-grid {
    display: grid;
    grid-auto-flow: column;
    grid-template-columns: none;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 2px 2px 10px;
    margin-right: -2px;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .reviews-grid .review-card {
    width: 100%;
    box-sizing: border-box;
    scroll-snap-align: start;
  }
}

/* screenshot-first customer review gallery */

.view-reviews-button { white-space: nowrap; }
.reviews-grid { align-items: stretch; }
.review-proof-card { padding: 10px; overflow: hidden; }
.review-proof-image { position: relative; display: block; width: 100%; aspect-ratio: auto; overflow: hidden; padding: 0; border: 0; border-radius: 12px; background: var(--surface, #f2f5fa); text-align: left; }
.review-proof-image img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; object-position: center top; }
.review-proof-image:not(:disabled) { cursor: zoom-in; }
.review-proof-image:not(:disabled):focus-visible { outline: 3px solid rgba(73,105,181,.45); outline-offset: 3px; }
.review-proof-image.is-placeholder { cursor: default; }
.review-image-hint { position: absolute; left: 9px; bottom: 9px; padding: 5px 8px; border-radius: 8px; color: #fff; background: rgba(24, 34, 54, .78); font-size: 10px; line-height: 1.3; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.review-proof-caption { padding: 11px 5px 5px; }
.review-proof-status { display: block; margin-bottom: 5px; color: #5571ba; font-size: 10px; line-height: 1.4; font-weight: 800; letter-spacing: .08em; }
.review-proof-caption strong { display: block; color: var(--text, #202b40); font-size: 14px; line-height: 1.35; }
.review-proof-caption p { margin: 5px 0 0; color: var(--muted, #687386); font-size: 12px; line-height: 1.45; }
.review-placeholder { border-style: solid; }
.review-lightbox[hidden] { display: none; }
.review-lightbox { position: fixed; inset: 0; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 54px 18px 24px; background: rgba(7, 12, 24, .90); }
.review-lightbox-image { display: block; width: min(100%, 1000px); height: min(72vh, 1000px); min-height: 220px; background-repeat: no-repeat; background-position: center; background-size: contain; border-radius: 10px; box-shadow: 0 20px 70px rgba(0,0,0,.3); -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; }
.review-lightbox-close { position: absolute; top: 12px; right: 15px; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: rgba(255,255,255,.1); color: white; font-size: 30px; line-height: 1; cursor: pointer; }
.review-lightbox-help { margin: 0; color: rgba(255,255,255,.78); text-align: center; font-size: 12px; }
@media  (max-width: 760px)  {

  .review-proof-card { border-radius: 15px; }
  .review-proof-image { aspect-ratio: auto; border-radius: 10px; }
  .review-proof-status { font-size: 9px; }
}

@media  (prefers-reduced-motion: reduce)  { .review-lightbox, .review-proof-image, .view-reviews-button span { transition: none !important; } }

/* compact mobile review header and smaller screenshot cards */
@media  (max-width: 760px)  {

  .view-reviews-button { flex: 0 0 auto; }
  .reviews-grid {
    grid-auto-columns: 62%;
    gap: 10px;
    margin-top: 12px;
  }
  .review-proof-card { padding: 7px; }
  .review-proof-image { height: 220px; display: flex; align-items: flex-start; justify-content: center; }
  .review-proof-image img { width: 100%; height: 100%; object-fit: contain; object-position: top center; }
  .review-proof-caption { padding: 8px 3px 3px; }
  .review-proof-caption strong { font-size: 12px; }
  .review-proof-caption p { font-size: 10px; line-height: 1.4; }
}
@media  (max-width: 390px)  {

  .reviews-grid { grid-auto-columns: 66%; }
  .review-proof-image { height: 200px; }
}

/* clearer Customer Feedback heading and balanced View All Reviews action */

.view-reviews-button { min-height: 48px; padding: 12px 18px; font-size: 15px; line-height: 1.2; text-decoration: none; border-radius: 13px; }
.view-reviews-button .view-button-label { font-size: inherit; }
@media  (max-width: 760px)  {

  .view-reviews-button { min-height: 44px; padding: 11px 14px; font-size: 14px; gap: 7px; }
}
@media  (max-width: 390px)  {

  .view-reviews-button { min-height: 42px; padding: 10px 12px; font-size: 13px; }
}

/* Windows-style mini app windows for social links, proofs, and feedback. */

.tiktok-showcase, .facebook-showcase, .recovery-proofs-showcase {
  padding: 18px;
  border: 1px solid #cfd8e6;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 5px 17px rgba(31, 48, 79, .07);
}
.tiktok-showcase::before, .facebook-showcase::before, .recovery-proofs-showcase::before { display: none; }

.recovery-proofs-showcase { background: #fff; border-color: #cfd8e6; }
.recovery-proofs-showcase:hover { border-color: #aebbd2; box-shadow: 0 10px 22px rgba(31, 48, 79, .1); }
.recovery-proofs-button { border-radius: 7px; box-shadow: none; }
.tiktok-profile-button, .facebook-profile-button { border-radius: 7px; }

.windows-feedback-window {
  overflow: hidden;
  border: 1px solid #cfd8e6;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 7px 22px rgba(31, 48, 79, .075);
}

.windows-feedback-content { padding: 12px 14px 14px; }

.windows-feedback-content .view-reviews-button {
  min-height: 42px;
  padding: 9px 13px;
  border-radius: 8px;
  border-color: #cbd5e3;
  font-size: 13px;
  white-space: nowrap;
}
.windows-feedback-content .reviews-grid { margin-top: 2px; }
.windows-feedback-content .review-proof-card { border-radius: 10px; box-shadow: 0 2px 7px rgba(31,48,79,.045); }
@media  (max-width: 760px)  {

  .tiktok-showcase, .facebook-showcase, .recovery-proofs-showcase { padding: 14px; border-radius: 11px; }

  .windows-feedback-window { border-radius: 11px; }

  .windows-feedback-content { padding: 8px 10px 11px; }

  .windows-feedback-content .view-reviews-button { min-height: 38px; padding: 8px 9px; gap: 5px; font-size: 11px; }
  .windows-feedback-content .reviews-grid { grid-auto-columns: 62%; gap: 9px; padding-bottom: 8px; }
  .windows-feedback-content .review-proof-card { padding: 6px; }
  .windows-feedback-content .review-proof-image { height: 175px; }
}
@media  (max-width: 390px)  {

  .windows-feedback-content .view-reviews-button { font-size: 12px; }
  .windows-feedback-content .reviews-grid { grid-auto-columns: 70%; }
}

/* unified four-tile social collage; clean app-card styling without window controls. */
.social-collage {
  display: grid;
  width: 100%;
  margin-top: 18px;
}
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase,
.social-collage > .social-feedback-card {
  min-width: 0;
  width: auto;
  margin: 0;
}
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase {
  display: flex;
  flex-direction: column;
  border: 1px solid #dce5f3;
  background: linear-gradient(145deg, #ffffff 0%, #f6f9ff 100%);
  box-shadow: 0 8px 24px rgba(35,54,94,.065);
}
.social-collage > .tiktok-showcase { background: linear-gradient(145deg,#fff8fb,#fff0f6); border-color:#f4d7e4; }
.social-collage > .facebook-showcase { background: linear-gradient(145deg,#fff,#eff7ff); border-color:#d5e7ff; }
.social-collage > .recovery-proofs-showcase { background: linear-gradient(145deg,#fbfaff,#f1efff); border-color:#e1dcff; }
.social-collage .tiktok-profile-button,
.social-collage .facebook-profile-button,
.social-collage .recovery-proofs-button { margin-top: auto; }
.social-feedback-card { overflow: hidden; border: 1px solid #cfeedd; background: linear-gradient(145deg,#f5fff9,#e7fff2); box-shadow: 0 8px 24px rgba(35,90,65,.065); }

.social-feedback-card .view-reviews-button { min-height: 36px; padding: 7px 9px; font-size: 11px; border-radius: 9px; white-space: nowrap; }
.social-feedback-card .reviews-grid { overflow-x: auto; }
.social-feedback-card .review-image-hint { font-size: 9px; }
@media  (max-width: 600px)  {
  

  
  

  

  .social-feedback-card .view-reviews-button { min-height: 34px; font-size: 10px; padding: 6px 8px; }
}

/* equal-height collage cards per row; place View All Reviews below the screenshots. */
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase,
.social-collage > .social-feedback-card {
  box-sizing: border-box;
}
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase {
  display: flex;
  flex-direction: column;
}
.social-collage > .facebook-showcase .facebook-profile-button,
.social-collage > .recovery-proofs-showcase .recovery-proofs-button {
  margin-top: auto;
}
.social-feedback-card {
  display: flex;
  flex-direction: column;
}
.social-feedback-card .windows-feedback-content {
  display: flex;
  flex-direction: column;
}

.social-feedback-card .reviews-grid {
  flex: 0 0 auto;
}
.social-feedback-card .social-feedback-view-all {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin: 8px 0 0;
  white-space: nowrap;
}
@media  (max-width: 600px)  {
  .social-collage { grid-auto-rows: 1fr; }
  .social-collage > .tiktok-showcase,
  .social-collage > .facebook-showcase,
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card { height: 100%; align-self: stretch; }
}

/* compact mobile collage with balanced cards and smaller review thumbnails. */
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase {
  border-radius: 13px;
}
.social-collage .tiktok-showcase h3,
.social-collage .facebook-showcase h3,
.social-collage .recovery-proofs-showcase h3 { font-size: 13px; line-height: 1.2; }
.social-collage .tiktok-profile-button,
.social-collage .facebook-profile-button,
.social-collage .recovery-proofs-button { min-height: 33px; padding: 6px; border-radius: 8px; }
.social-feedback-card { border-radius: 13px; }

.social-feedback-card .windows-feedback-content { padding: 8px; }
.social-feedback-card .review-proof-card { border-radius: 7px; }
.social-feedback-card .review-image-hint { display: none; }
.social-feedback-card .social-feedback-view-all {
  min-height: 31px;
  padding: 6px;
  border-radius: 8px;
  font-size: 10px;
}
@media  (max-width: 360px)  {
  .social-collage { gap: 7px; }
}

/* align the View All Reviews button with the Recovery Proofs action. */
.social-feedback-card .windows-feedback-content {
  flex: 1 1 auto;
  min-height: 0;
}
.social-feedback-card .social-feedback-view-all {
  flex: 0 0 auto;
}

/* force the Customer Feedback action to the same bottom baseline as Recovery Proofs. */
.social-collage > .social-feedback-card { display: flex; flex-direction: column; }
.social-collage > .social-feedback-card .reviews-grid { flex: 0 0 auto; }
.social-collage > .social-feedback-card .social-feedback-view-all { display: flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; }
@media  (max-width: 600px)  {
  .social-collage > .social-feedback-card .windows-feedback-content { flex: 1 1 auto; }
}

/* slightly enlarge card content on mobile while preserving the balanced 2x2 layout. */
@media  (max-width: 600px)  {
  .social-feedback-card .windows-feedback-content { padding: 9px; }
  
}
@media  (max-width: 360px)  {
  .social-collage > .tiktok-showcase,
  .social-collage > .facebook-showcase,
  .social-collage > .recovery-proofs-showcase { padding: 8px; }

  .social-collage .tiktok-showcase h3,
  .social-collage .facebook-showcase h3,
  .social-collage .recovery-proofs-showcase h3 { font-size: 13px; }

  .social-feedback-card .windows-feedback-content { padding: 7px; }
  .social-feedback-card .social-feedback-view-all { font-size: 10px; }
}

/* enlarge the three Customer Feedback previews so more of each screenshot is visible above View All Reviews. */
@media  (max-width: 600px)  {
  .social-feedback-card .reviews-grid {
    margin-bottom: 0;
  }
  .social-feedback-card .review-proof-image {
    align-items: flex-start;
    justify-content: center;
  }
}
@media  (max-width: 360px)  {
  .social-feedback-card .review-proof-image {
    min-height: 125px;
  }
}

/* natural-ratio review previews. Avoid fixed-height letterboxing/stretching. */
.social-feedback-card .review-proof-card {
  overflow: hidden;
}
.social-feedback-card .review-proof-image {
  background: #f5f7fb;
  border-radius: 7px;
}
.social-feedback-card .review-proof-caption { display: none; }

/* mobile-only natural image sizing for Customer Feedback previews.
 Use each screenshot's intrinsic ratio instead of forcing every image into
 the first screenshot's ratio, which caused empty space/letterboxing on phones. */
@media  (max-width: 600px)  {
  .social-feedback-card .review-proof-card {
    flex-direction: column;
  }
}

/* mobile-only taller review previews, filling the marked space above View All Reviews without distorting screenshots. */
@media  (max-width: 360px)  {
  .social-feedback-card .review-proof-card { height: 166px; }
}

/* show two full, undistorted review screenshots in Customer Feedback.
 Keep the desktop layout stable and make the mobile previews use two equal columns. */
.social-feedback-card .reviews-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-columns: auto;
  overflow: hidden;
  gap: 8px;
  padding: 0;
  margin: 0;
  align-items: start;
}
.social-feedback-card .review-proof-card {
  min-width: 0;
  height: auto;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: 4px;
}
.social-feedback-card .review-proof-image {
  display: flex;
  width: 100%;
  height: 180px !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
}
.social-feedback-card .review-proof-image img {
  display: block;
  width: 100%;
  height: 100% !important;
  max-height: none;
  object-fit: contain !important;
  object-position: center center !important;
}
.social-feedback-card .social-feedback-view-all {
  width: 100%;
  box-sizing: border-box;
  margin-top: auto !important;
}
@media  (max-width: 360px)  {
  .social-feedback-card .review-proof-image {
    height: 150px !important;
  }
}

/* mobile-only landscape review previews.
 Keep the desktop appearance unchanged; on phones show the two review images
 side-by-side in landscape frames. Tapping a preview still opens the full image. */
@media  (max-width: 600px)  {
  .social-feedback-card .reviews-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-columns: auto;
    align-items: stretch;
    gap: 7px;
    overflow: visible;
  }

  .social-feedback-card .review-proof-card {
    display: flex;
    min-width: 0;
    height: auto;
    align-self: stretch;
    padding: 3px;
    border-radius: 9px;
    overflow: hidden;
  }

  .social-feedback-card .review-proof-image {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 4 / 3 !important;
    flex: 1 1 auto;
    overflow: hidden;
    padding: 0;
    border-radius: 7px;
    background: #f4f6fb;
  }

  .social-feedback-card .review-proof-image img {
    display: block;
    width: 100%;
    height: 100% !important;
    max-height: none;
    object-fit: cover !important;
    object-position: center 18% !important;
  }

  .social-feedback-card .review-image-hint {
    display: block;
    left: 3px;
    bottom: 3px;
    padding: 3px 4px;
    font-size: 6.5px;
    line-height: 1.2;
    border-radius: 5px;
  }

  
}

@media  (max-width: 360px)  {
  .social-feedback-card .reviews-grid { gap: 5px; }
  .social-feedback-card .review-proof-card { padding: 2px; }
}

/* green WhatsApp-inspired outer cards for the three process steps.
 Keep the existing step icon tiles, text, numbering, and WhatsApp floating button unchanged. */
.how-section .step-card:hover {
  border-color: #18c982;
  box-shadow: 0 15px 34px rgba(22, 190, 105, 0.17), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* compact vertical spacing from the process section through Terms.
 Keep all information and the existing desktop/mobile card designs. */
.site-section {
  margin-top: 30px;
}
.how-section {
  margin-top: 26px;
}
.how-section .section-heading {
  margin-bottom: 15px;
}
.how-section .section-heading h2 {
  margin-top: 5px;
  margin-bottom: 5px;
}
.how-section .step-card h3 {
  margin-bottom: 5px;
  padding-bottom: 5px;
}
.how-section .step-card p {
  line-height: 1.6;
}

.site-section.about-section,
.site-section.safety-section,
.site-section.terms-section {
  margin-top: 18px;
}
.about-card {
  padding: 21px;
  gap: 16px;
}
.about-card > img {
  width: 68px;
  height: 68px;
  border-radius: 18px;
}
.about-card h2 {
  margin-top: 4px;
  margin-bottom: 6px;
}
.about-card p,
.terms-card p {
  margin-bottom: 7px;
  line-height: 1.6;
}
.about-card .independent-note {
  margin-top: 6px;
  padding: 9px 11px;
}
.safety-panel {
  padding: 20px;
  gap: 14px;
}
.safety-panel h2 {
  margin-top: 3px;
  margin-bottom: 6px;
}
.safety-panel p {
  margin-bottom: 7px;
  line-height: 1.6;
}
.safety-panel p:last-child {
  margin-top: 1px;
  margin-bottom: 0;
}
.terms-card {
  padding: 19px 21px;
}
.terms-card h2 {
  margin-top: 5px;
  margin-bottom: 7px;
  position: relative;
  top: -8px;
}
.terms-card p:last-child {
  margin-bottom: 0;
}

@media  (max-width: 760px)  {
  .site-section { margin-top: 22px !important; }
  .how-section { margin-top: 8px !important; }
  .how-section .section-heading { margin-bottom: 11px !important; }
  .how-section .section-kicker { line-height: 1.1 !important; }
  .how-section .section-heading h2 {
    margin: 4px 0 4px !important;
    line-height: 1.16 !important;
  }
  .how-section .section-heading p {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
  .how-section .step-card h3 {
    padding-bottom: 4px !important;
  }
  .how-section .step-card p {
    font-size: 13px !important;
    line-height: 1.48 !important;
  }

  .site-section.about-section,
  .site-section.safety-section,
  .site-section.terms-section { margin-top: 12px !important; }
  .about-card {
    grid-template-columns: 43px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding: 13px 12px !important;
    border-radius: 16px !important;
  }
  .about-card > img { width: 43px !important; height: 43px !important; border-radius: 12px !important; }
  .about-card .section-kicker { font-size: 10px !important; line-height: 1.2 !important; }
  .about-card h2 { font-size: 18px !important; margin: 2px 0 5px !important; line-height: 1.18 !important; }
  .about-card p,
  .about-card .independent-note {
    margin: 5px 0 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
  .about-card .independent-note { background: transparent !important; }
  .safety-panel {
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 9px !important;
    padding: 12px !important;
    border-radius: 16px !important;
  }
  .safety-panel-icon { width: 36px !important; height: 36px !important; border-radius: 10px !important; font-size: 19px !important; }
  .safety-panel h2 { font-size: 17px !important; line-height: 1.2 !important; margin: 0 0 5px !important; padding-bottom: 5px !important; }
  .safety-panel p { margin: 5px 0 0 !important; font-size: 12px !important; line-height: 1.45 !important; }
  .safety-panel p:last-child { font-size: 13px !important; margin-top: 5px !important; }
  .terms-card { padding: 12px 13px !important; border-radius: 15px !important; }
  .terms-card .section-kicker { font-size: 11px !important; letter-spacing: 1.2px !important; line-height: 1.3 !important; }
  .terms-card h2 { font-size: 19px !important; line-height: 1.16 !important; margin: 4px 0 0 !important; }
  .terms-card p { font-size: 12px !important; line-height: 1.45 !important; margin: 0 !important; }
}
@media  (max-width: 420px)  {
  .site-section { margin-top: 18px !important; }
  .how-section { margin-top: 6px !important; }
  .how-section .step-card { padding: 11px 11px !important; column-gap: 9px !important; }
  .how-section .step-card h3 { font-size: 13.5px !important; }
  .how-section .step-card p { font-size: 12.5px !important; }
  .site-section.about-section,
  .site-section.safety-section,
  .site-section.terms-section { margin-top: 10px !important; }
  .about-card { grid-template-columns: 38px minmax(0, 1fr) !important; gap: 8px !important; padding: 11px 10px !important; }
  .about-card > img { width: 38px !important; height: 38px !important; border-radius: 10px !important; }
  .about-card h2 { font-size: 17px !important; }
  .about-card p,
  .about-card .independent-note,
  .terms-card p { font-size: 11.5px !important; line-height: 1.42 !important; }
  .safety-panel { grid-template-columns: 32px minmax(0, 1fr) !important; padding: 10px !important; gap: 8px !important; }
  .safety-panel-icon { width: 32px !important; height: 32px !important; }
  .safety-panel h2 { font-size: 16px !important; }
  .terms-card { padding: 11px !important; }
}

/* remove duplicated mini title bars from the Recovery Proofs and Customer Feedback tiles. */

.social-collage > .social-feedback-card .windows-feedback-content { padding-top: 14px; }
@media  (max-width: 600px)  {
  .social-collage > .social-feedback-card .reviews-grid { grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: minmax(0, 1fr); overflow: visible; gap: 7px; }
  .social-collage > .social-feedback-card .review-proof-image { height: clamp(86px, 25vw, 112px); }
  .social-collage > .social-feedback-card .review-image-hint { font-size: 9px; }
}

/* single, mobile-friendly featured customer review image. */
.social-feedback-card .reviews-grid-featured {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  grid-auto-columns: auto !important;
  gap: 8px !important;
  overflow: visible !important;
}
.social-feedback-card .reviews-grid-featured .review-proof-card {
  width: 100% !important;
  min-width: 0 !important;
  padding: 4px !important;
  height: auto !important;
}
.social-feedback-card .reviews-grid-featured .review-proof-image {
  display: block !important;
  width: 100% !important;
}
.social-feedback-card .reviews-grid-featured .review-image-hint {
  left: 8px !important;
  bottom: 8px !important;
  font-size: 10px !important;
  padding: 5px 7px !important;
}
@media  (max-width: 600px)  {
  .social-feedback-card .reviews-grid-featured .review-proof-image img {
    max-height: none !important;
    width: 100% !important;
  }
}

/* site-wide blue–purple–pink gradient theme.
 Preserve text contrast, existing functional colors, and the green WhatsApp CTA. */
:root {
  --ink: #172554;
  --muted: #526581;
  --blue: #315ff4;
  --blue-dark: #2448cb;
  --line: rgba(115, 139, 211, .24);
  --bg: #eaf4ff;
  --pale: #edf0ff;
}
html {
  background: linear-gradient(135deg, #dff7ff 0%, #e9e8ff 38%, #fce2fb 72%, #dff4ff 100%);
  min-height: 100%;
}
body {
  background: linear-gradient(135deg, #dff7ff 0%, #e9e8ff 38%, #fce2fb 72%, #dff4ff 100%) fixed !important;
  color: var(--ink);
}
.topbar,
footer {
  background: rgba(255, 255, 255, .78) !important;
  border-color: rgba(126, 149, 218, .22) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.wizard-card,
.about-card,
.safety-panel,
.terms-card,
.step-card,
.review-card,
.windows-feedback-window,
.proof-card {
  background: linear-gradient(135deg, rgba(255,255,255,.91) 0%, rgba(239,246,255,.86) 52%, rgba(255,239,252,.82) 100%);
  border-color: rgba(129, 150, 221, .30);
  box-shadow: 0 14px 34px rgba(72, 95, 171, .09);
}
.secondary {
  background: rgba(255,255,255,.84);
  border-color: rgba(128, 148, 208, .32);
}
.secondary:hover {
  background: linear-gradient(120deg, #edfaff, #f3edff, #fff0fb);
}

.button.secondary,
.view-reviews-button {
  background: linear-gradient(120deg, rgba(255,255,255,.96), rgba(241,247,255,.95), rgba(255,239,252,.95));
  border-color: rgba(116, 143, 232, .35);
}
.eyebrow,
.section-kicker {
  color: #315ff4;
}

.brand .logo:not(.profile-logo) {
  background: linear-gradient(135deg, #273b9c, #5579ff 55%, #cc55db);
}
a, button {
  -webkit-tap-highlight-color: transparent;
}
@media  (max-width: 600px)  {
  body {
    background: linear-gradient(160deg, #ddf7ff 0%, #e8eaff 45%, #fbe5fa 76%, #e0f4ff 100%) fixed !important;
  }
  .topbar,
  footer {
    background: rgba(255,255,255,.86) !important;
  }
}

/* safe defaults, responsive media, and accessible focus/reduced motion. */
img, video, canvas, svg {
  max-width: 100%;
}
img {
  height: auto;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid rgba(49, 95, 244, .72);
  outline-offset: 3px;
}
[hidden] {
  display: none !important;
}
@media  (prefers-reduced-motion: reduce)  {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* compact balanced feature cards; center descriptions without fixed-height stretching. */
.social-collage {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: clamp(10px, 1.5vw, 16px);
}
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase,
.social-collage > .social-feedback-card {
  height: auto;
  min-height: 0;
  align-self: stretch;
}
.social-collage > .tiktok-showcase,
.social-collage > .facebook-showcase,
.social-collage > .recovery-proofs-showcase {
  padding: clamp(11px, 1.5vw, 16px);
}
/* Keep headings at the top, place descriptions around the middle, and align actions. */
.social-collage > .tiktok-showcase .tiktok-profile-button,
.social-collage > .facebook-showcase .facebook-profile-button,
.social-collage > .recovery-proofs-showcase .recovery-proofs-button {
  margin-top: auto;
}
/* The review preview uses the flexible area between its summary and View All Reviews. */
.social-collage > .social-feedback-card > .windows-feedback-content {
  height: 100%;
  box-sizing: border-box;
  padding: clamp(10px, 1.5vw, 14px);
}

.social-collage > .social-feedback-card .reviews-grid-featured {
  align-content: stretch;
  margin: 0;
}
.social-collage > .social-feedback-card .review-proof-card,
.social-collage > .social-feedback-card .review-proof-image {
  min-height: 0;
}
.social-collage > .social-feedback-card .review-proof-image {
  height: 100%;
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.social-collage > .social-feedback-card .review-proof-image img {
  width: 100%;
  height: 100%;
  max-height: 250px;
  object-fit: contain;
}
@media  (max-width: 600px)  {
  .social-collage { gap: 9px; }
  .social-collage > .tiktok-showcase,
  .social-collage > .facebook-showcase,
  .social-collage > .recovery-proofs-showcase { padding: 10px; border-radius: 13px; }
  
  .social-collage > .social-feedback-card .windows-feedback-content { padding: 9px; }

  .social-collage > .social-feedback-card .reviews-grid-featured { min-height: 95px; }
  .social-collage > .social-feedback-card .review-proof-image { min-height: 95px; }
  .social-collage > .social-feedback-card .review-proof-image img { max-height: 180px; }
  
}
@media  (max-width: 359px)  {
  .social-collage { grid-template-columns: minmax(0, 1fr); }
  .social-collage > .tiktok-showcase,
  .social-collage > .facebook-showcase,
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card { height: auto; }
  .social-collage > .social-feedback-card .review-proof-image { min-height: 120px; }
}

/* slight readability boost for the three social/proof cards.
 Preserve layout, content, colors, destinations, and existing behavior. */
.social-collage .tiktok-profile-button,
.social-collage .facebook-profile-button,
.social-collage .recovery-proofs-button {
  font-size: 12px;
  line-height: 1.35;
}
@media  (max-width: 600px)  {
  
  .social-collage .tiktok-showcase h3,
  .social-collage .facebook-showcase h3,
  .social-collage .recovery-proofs-showcase h3 {
    font-size: 14px;
    line-height: 1.28;
  }
}

/* slow, clearly visible green soft-glow pulse for the account-recovery badge */
.compact-intro .eyebrow {
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(34, 197, 94, .92);
  color: #166534;
  background: linear-gradient(180deg, rgba(240, 253, 244, .98), rgba(255, 255, 255, .98));
  box-shadow: 0 0 0 1px rgba(34, 197, 94, .10),
              0 0 14px rgba(34, 197, 94, .24),
              0 0 28px rgba(34, 197, 94, .13);
  animation: eyebrow-fade-in 1s ease-out both,
             eyebrow-green-glow 3.6s ease-in-out 1s infinite;
}
.compact-intro .eyebrow > span {
  background: #22c55e;
  box-shadow: 0 0 7px rgba(34, 197, 94, .75), 0 0 14px rgba(34, 197, 94, .48);
}
@keyframes  eyebrow-fade-in  {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes  eyebrow-green-glow  {
  0%, 100% {
    border-color: rgba(34, 197, 94, .72);
    box-shadow: 0 0 0 1px rgba(34, 197, 94, .08),
                0 0 10px rgba(34, 197, 94, .20),
                0 0 20px rgba(34, 197, 94, .11);
  }
  50% {
    border-color: rgba(22, 163, 74, 1);
    box-shadow: 0 0 0 2px rgba(34, 197, 94, .14),
                0 0 20px rgba(34, 197, 94, .48),
                0 0 38px rgba(34, 197, 94, .28),
                0 0 52px rgba(34, 197, 94, .12);
  }
}
@media  (prefers-reduced-motion: reduce)  {
  .compact-intro .eyebrow {
    opacity: 1;
    transform: none;
    box-shadow: 0 0 10px rgba(34, 197, 94, .25), 0 0 20px rgba(34, 197, 94, .12);
  }
}

/* visible, independent fade-up reveal for units from WhatsApp to footer. */

/* animate WhatsApp buttons; reveal stays visible after first entry. */
.arc-scroll-reveal-enabled #floatingWhatsApp.arc-scroll-reveal-visible {
  animation: arc-wa-float 3.2s ease-in-out 650ms infinite;
}

#floatingWhatsApp:active, .whatsapp-button:active {
  transform: scale(.98);
}
/* keep the requested scroll-reveal transition even if the desktop OS
 advertises reduced motion; the generic accessibility rule above otherwise
 collapses all transitions to 0.01ms, making the effect appear absent. */

/* desktop-width refinement for the home page.
 Preserve existing mobile breakpoints and visual styling. */
@media  (min-width: 900px)  {
  body.home-page main {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 48px clamp(28px, 4vw, 52px) 64px;
  }
  body.home-page .compact-intro {
    max-width: 900px;
  }
  body.home-page .compact-intro h1 {
    letter-spacing: -1.8px;
  }
  body.home-page .compact-intro p {
    max-width: 720px;
    line-height: 1.7;
  }
  body.home-page .wizard-card.contact-only {
    padding: clamp(30px, 3vw, 42px);
    border-radius: 26px;
  }

  body.home-page .whatsapp-button {
    min-height: 64px;
    font-size: 16px;
    border-radius: 14px;
  }

  body.home-page .social-collage {
    gap: clamp(16px, 2vw, 24px);
    margin-top: 22px;
  }
  body.home-page .site-section {
    max-width: 1000px;
    margin-top: 36px;
  }
  body.home-page .site-footer {
    padding-left: max(32px, calc((100% - 1040px) / 2));
    padding-right: max(32px, calc((100% - 1040px) / 2));
  }
}

/* Premium green status badge styling */
.compact-intro .eyebrow.premium-status{position:relative;max-width:100%;padding:9px 13px;border:1px solid #83dba6;border-radius:999px;background:linear-gradient(110deg,#f1fff6 0%,#fff 52%,#f0fff5 100%);color:#285f40;box-shadow:0 0 0 1px rgba(43,190,105,.08),0 0 18px rgba(37,211,102,.22);gap:8px;vertical-align:middle;overflow:visible}
.compact-intro .eyebrow .status-pulse{position:relative;display:inline-block;width:9px;height:9px;min-width:9px;flex:0 0 9px;border-radius:50%;background:#20c66b;box-shadow:0 0 0 3px rgba(32,198,107,.12);animation:status-heartbeat 1.15s ease-in-out infinite}
.compact-intro .eyebrow .status-pulse:after{content:"";position:absolute;inset:-5px;border:1px solid rgba(32,198,107,.48);border-radius:50%;animation:status-ripple 1.5s ease-out infinite}
.compact-intro .eyebrow .status-label{display:inline-block;width:auto;height:auto;min-width:0;flex:0 1 auto;background:transparent;border-radius:0;color:inherit;white-space:normal}
@keyframes  status-heartbeat {0%,100%{transform:scale(1);box-shadow:0 0 0 3px rgba(32,198,107,.12),0 0 7px rgba(32,198,107,.3)}15%{transform:scale(1.22);box-shadow:0 0 0 5px rgba(32,198,107,.17),0 0 12px rgba(32,198,107,.5)}30%{transform:scale(1)}}
@keyframes  status-ripple {0%{transform:scale(.65);opacity:.85}75%,100%{transform:scale(1.55);opacity:0}}
@media (max-width:480px) {.compact-intro .eyebrow.premium-status{gap:6px;padding:8px 10px;letter-spacing:.65px}}
@media (prefers-reduced-motion:reduce) {.compact-intro .eyebrow .status-pulse,.compact-intro .eyebrow .status-pulse:after{animation:none!important}}

/* animated blue custom check badge beside Arisu in header and footer. */
.brand-copy{display:inline-flex;flex-direction:column;align-items:flex-start;min-width:0;line-height:1.25}
.brand-name-row{display:inline-flex;align-items:center;gap:7px;min-width:0;line-height:1.15}
.brand-name-row>b{display:inline-block!important;line-height:1.15!important}
.arisu-verified-badge{display:inline-grid;place-items:center;position:relative;flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:linear-gradient(145deg,#3294ff 0%,#1877f2 58%,#0b5fd7 100%);box-shadow:0 2px 7px rgba(24,119,242,.28),0 0 0 2px rgba(24,119,242,.10);animation:arisu-brand-badge-pop 2s ease-in-out infinite;transform-origin:center;vertical-align:middle}
.arisu-verified-badge:after{content:"";position:absolute;inset:-3px;border:1px solid rgba(24,119,242,.28);border-radius:50%;animation:arisu-brand-badge-glow 2s ease-out infinite;pointer-events:none}
.arisu-verified-badge svg{display:block;width:14px;height:14px;overflow:visible;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.arisu-verified-badge svg path{stroke-dasharray:24;stroke-dashoffset:24;animation:arisu-brand-check-draw 2s ease-in-out infinite}
@keyframes  arisu-brand-check-draw {0%,8%{stroke-dashoffset:24;opacity:.7}24%,42%{stroke-dashoffset:0;opacity:1}50%,100%{stroke-dashoffset:0;opacity:1}}
@keyframes  arisu-brand-badge-pop {0%,45%,100%{transform:scale(1);filter:brightness(1)}10%{transform:scale(.92)}20%{transform:scale(1.16);filter:brightness(1.14);box-shadow:0 3px 10px rgba(24,119,242,.4),0 0 0 4px rgba(24,119,242,.13)}30%{transform:scale(1);filter:brightness(1.04)}}
@keyframes  arisu-brand-badge-glow {0%,100%{transform:scale(.88);opacity:0}18%{opacity:.65}55%{transform:scale(1.35);opacity:0}}
@media (max-width:600px) {.brand-name-row{gap:5px}.arisu-verified-badge{width:18px;height:18px;flex-basis:18px}.arisu-verified-badge svg{width:12px;height:12px}}
@media (max-width:380px) {.arisu-verified-badge{width:16px;height:16px;flex-basis:16px}.arisu-verified-badge svg{width:10px;height:10px}}
@media (prefers-reduced-motion:reduce) {.arisu-verified-badge,.arisu-verified-badge:after,.arisu-verified-badge svg path{animation:none!important}.arisu-verified-badge svg path{stroke-dashoffset:0!important}}

/* Recovery-first step; only the checkmarks animate. */
@keyframes  recovery-check-draw  {
  0%, 8% { stroke-dashoffset: 24; }
  28%, 68% { stroke-dashoffset: 0; }
  82%, 100% { stroke-dashoffset: 24; }
}






/* matching contact availability card and static handshake icon. */

/* premium WhatsApp contact panel matching the approved reference. */
.whatsapp-feature-card{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:18px;row-gap:18px;align-items:start;margin:16px 0 0;padding:24px;border:1.5px solid #a9ccff;border-radius:22px;background:linear-gradient(135deg,#fff 0%,#f4f8ff 100%);box-shadow:0 10px 28px rgba(36,99,212,.08)}
.whatsapp-feature-icon{position:relative;isolation:isolate;display:grid;place-items:center;width:72px;height:72px;margin-top:2px;border-radius:22px;background:#dcf8ed;color:#fff}
.whatsapp-feature-icon:before{content:"";position:absolute;inset:8px;border-radius:17px;background:linear-gradient(145deg,#20c879,#008e58);box-shadow:0 5px 13px rgba(0,153,91,.2);z-index:-1}
.whatsapp-feature-icon:after{content:"";position:absolute;inset:0;border:2px solid rgba(31,194,125,.35);border-radius:24px;animation:waIconRipple 2.2s ease-out infinite;pointer-events:none}
.whatsapp-feature-icon svg{width:39px;height:39px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.08))}
.whatsapp-feature-content{min-width:0}
.whatsapp-feature-top{align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.whatsapp-feature-kicker{color:#1765ee;font-size:11px;line-height:1.4;font-weight:850;letter-spacing:2px}
.whatsapp-recommended{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid #b5f1d0;border-radius:999px;background:#e7fff1;color:#087542;font-size:10px;font-weight:850;white-space:nowrap}
.whatsapp-recommended span{font-size:19px;line-height:.8;color:#08a45a}
.whatsapp-feature-content h2{margin:14px 0 10px;color:#14234a;font:800 clamp(22px,3vw,34px)/1.1 Manrope,sans-serif;letter-spacing:-.9px}
.whatsapp-feature-content h2 span{color:#078b51}
.whatsapp-feature-content p{margin:0;color:#64718b;font-size:15px;line-height:1.55}
.whatsapp-feature-card .whatsapp-button{grid-column:1/-1;min-height:62px;border-radius:17px;background:linear-gradient(105deg,#20c879,#009b61);box-shadow:0 7px 18px rgba(0,168,100,.2);font-size:clamp(15px,2vw,19px);font-weight:800;gap:12px}
.whatsapp-feature-card .whatsapp-button .wa-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:0 0 32px}
.whatsapp-feature-card .whatsapp-button .wa-icon svg{width:32px;height:32px}
.whatsapp-feature-card .whatsapp-button:hover{filter:brightness(1.03);transform:translateY(-1px)}

@keyframes  waIconRipple {0%{transform:scale(.86);opacity:.75}75%,100%{transform:scale(1.34);opacity:0}}

@media (max-width:600px) {
 .whatsapp-feature-card{grid-template-columns:48px minmax(0,1fr);column-gap:13px;row-gap:14px;margin-top:12px;padding:15px 13px;border-radius:18px}
 .whatsapp-feature-icon{width:48px;height:48px;border-radius:15px;margin-top:4px}
 .whatsapp-feature-icon:before{inset:5px;border-radius:12px}
 .whatsapp-feature-icon:after{border-radius:17px}
 .whatsapp-feature-icon svg{width:29px;height:29px}
 .whatsapp-feature-top{align-items:flex-start;gap:7px}
 .whatsapp-recommended span{font-size:15px}
 .whatsapp-feature-content h2{font-size:clamp(19px,5.3vw,24px);line-height:1.13;letter-spacing:-.55px;margin:10px 0 7px}
 .whatsapp-feature-content p{font-size:12px;line-height:1.5}
 .whatsapp-feature-card .whatsapp-button{min-height:54px;padding:12px 10px;border-radius:13px;font-size:clamp(12px,3.4vw,15px);gap:8px}
 .whatsapp-feature-card .whatsapp-button .wa-icon,.whatsapp-feature-card .whatsapp-button .wa-icon svg{width:26px;height:26px;flex-basis:26px}
}
@media (max-width:360px) {.whatsapp-feature-card{grid-template-columns:42px minmax(0,1fr);gap:11px;padding:12px 10px}.whatsapp-feature-icon{width:42px;height:42px}.whatsapp-feature-content h2{font-size:18px}.whatsapp-feature-content p{font-size:11px}}
@media (prefers-reduced-motion:reduce) {.whatsapp-feature-icon:after{animation:none!important}}

/* pin the RECOMMENDED pill to the upper-right of the WhatsApp card. */
.whatsapp-feature-card{position:relative}
.whatsapp-feature-top{display:block;position:relative;padding-right:0}
.whatsapp-recommended{position:absolute;top:0;right:0;z-index:2}
.whatsapp-feature-kicker{display:block;max-width:calc(100% - 128px);min-height:20px}
.whatsapp-feature-content h2{margin-top:14px}
@media (max-width:600px) {
 .whatsapp-feature-top{display:block;padding-right:0}
 .whatsapp-recommended{position:absolute;top:0;right:0;font-size:8px;padding:6px 8px;gap:4px}
 .whatsapp-feature-kicker{max-width:calc(100% - 112px);font-size:9px;letter-spacing:1px;line-height:1.35;padding-top:4px}
 .whatsapp-feature-content h2{margin-top:10px}
}
@media (max-width:360px) {
 .whatsapp-recommended{font-size:7px;padding:5px 6px}
 .whatsapp-feature-kicker{max-width:calc(100% - 104px);font-size:8px;letter-spacing:.6px}
}

/* add balanced breathing room at the marked intro-to-contact transition
 and keep the WhatsApp, availability, and social blocks evenly separated. */
@media  (max-width: 600px)  {
  body.home-page .compact-intro {
    padding-bottom: 5px;
  }
}
@media  (max-width: 360px)  {
  body.home-page .compact-intro {
    margin-bottom: 17px;
  }
}

/* paired contact panels — WhatsApp | Available Hours. */
body.home-page .wizard-card.contact-only {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  align-items: stretch;
  column-gap: 14px;
  row-gap: 18px;
}
body.home-page .whatsapp-feature-card {
  min-width: 0;
}

body.home-page .contact-divider,
body.home-page .social-collage { grid-column: 1 / -1; }
@media  (max-width: 600px)  {
  body.home-page .wizard-card.contact-only {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding: 12px;
  }
  body.home-page .whatsapp-feature-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  body.home-page .whatsapp-recommended { margin-top: 6px; }

  body.home-page .contact-divider { margin-top: 18px; }
}
@media  (max-width: 360px)  {
  body.home-page .wizard-card.contact-only { padding: 9px; gap: 8px; }
  body.home-page .whatsapp-feature-card { padding: 9px 7px; }
  body.home-page .whatsapp-feature-content h2 { font-size: 15px; }
  body.home-page .whatsapp-feature-content p { font-size: 9px; }
}

/* compact vertically stacked contact panels, matching the approved slim-card reference. */
body.home-page .wizard-card.contact-only {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
body.home-page .compact-intro {
  margin-bottom: 14px;
  padding-bottom: 0;
}
body.home-page .whatsapp-feature-card {
  width: 100%;
  height: auto;
  margin: 0;
  border-width: 1.5px;
  box-sizing: border-box;
}
body.home-page .whatsapp-feature-icon {
  margin-top: 0;
}
@media  (max-width: 600px)  {
  body.home-page .compact-intro { margin-bottom: 12px; }

}

/* compact mobile first-screen layout so WhatsApp and Available Hours both show early.
 The Bible verse remains in the page, but follows the two contact cards on phones. */
@media  (max-width: 600px)  {
  main:has(.compact-intro) {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 8px 12px 22px !important;
  }
  main:has(.compact-intro) > .compact-intro {
    width: 100%;
    max-width: none;
    margin: 0 auto !important;
    padding: 0 2px !important;
  }
  main:has(.compact-intro) > .compact-intro h1 {
    margin: 4px 0 4px !important;
    font-size: clamp(24px, 6vw, 29px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.85px !important;
  }
  main:has(.compact-intro) > .compact-intro p {
    font-size: 11px !important;
    line-height: 1.32 !important;
    margin: 0 auto !important;
  }
  main:has(.compact-intro) > .wizard-card.contact-only {
    display: contents !important;
  }
  main:has(.compact-intro) .whatsapp-feature-card {
    width: 100%;
    margin: 0 !important;
    padding: 10px 11px !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 9px !important;
    row-gap: 7px !important;
    border-radius: 16px !important;
  }
  main:has(.compact-intro) .whatsapp-feature-icon {
    width: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    margin: 2px 0 0 !important;
  }
  main:has(.compact-intro) .whatsapp-feature-icon:before { inset: 4px !important; border-radius: 10px !important; }
  main:has(.compact-intro) .whatsapp-feature-icon:after { border-radius: 15px !important; }
  main:has(.compact-intro) .whatsapp-feature-icon svg { width: 25px !important; height: 25px !important; }
  main:has(.compact-intro) .whatsapp-feature-kicker {
    max-width: calc(100% - 104px) !important;
    font-size: 8px !important;
    letter-spacing: .75px !important;
    line-height: 1.25 !important;
    min-height: 18px !important;
    padding-top: 2px !important;
  }
  main:has(.compact-intro) .whatsapp-recommended { font-size: 7px !important; padding: 5px 6px !important; gap: 4px !important; }
  main:has(.compact-intro) .whatsapp-recommended span { font-size: 13px !important; }
  main:has(.compact-intro) .whatsapp-feature-content h2 {
    margin: 5px 0 4px !important;
    font-size: clamp(17px, 4.6vw, 20px) !important;
    line-height: 1.1 !important;
    letter-spacing: -.45px !important;
  }
  main:has(.compact-intro) .whatsapp-feature-content p { font-size: 10.5px !important; line-height: 1.35 !important; }
  main:has(.compact-intro) .whatsapp-feature-card .whatsapp-button {
    min-height: 42px !important;
    padding: 8px 9px !important;
    border-radius: 11px !important;
    font-size: clamp(11px, 3.1vw, 13px) !important;
    gap: 7px !important;
  }
  main:has(.compact-intro) .whatsapp-feature-card .whatsapp-button .wa-icon,
  main:has(.compact-intro) .whatsapp-feature-card .whatsapp-button .wa-icon svg { width: 22px !important; height: 22px !important; flex-basis: 22px !important; }
  main:has(.compact-intro) .contact-divider { order: 5; margin: 12px 0 6px !important; }
  main:has(.compact-intro) .social-collage { order: 6; margin-top: 8px !important; gap: 10px !important; }
  main:has(.compact-intro) .windows-feedback-window { order: 7; }
  main:has(.compact-intro) .review-lightbox[hidden] { display: none !important; }
  main:has(.compact-intro) > .site-section { order: 8; margin-top: 22px !important; }
}
@media  (max-width: 380px)  {
  main:has(.compact-intro) { padding-left: 9px !important; padding-right: 9px !important; gap: 7px !important; }
  main:has(.compact-intro) .whatsapp-feature-card { padding: 9px !important; }

}
@media  (prefers-reduced-motion: reduce)  {
  main:has(.compact-intro) .whatsapp-feature-icon:after { animation: none !important; }
}

/* approved contact-card hierarchy and restore the Bible verse to its original top position. */
body.home-page .whatsapp-feature-card { position: relative !important; }
body.home-page .whatsapp-feature-kicker {
  min-height: 0 !important;
}
body.home-page .whatsapp-feature-content p { margin-top: 0 !important; }

@media  (max-width: 600px)  {
  main:has(.compact-intro) > .daily-verse-card {
    order: 0 !important;
    display: block !important;
    margin: 0 0 7px !important;
    padding: 12px 10px !important;
  }
  main:has(.compact-intro) > .compact-intro { order: 1 !important; }
  main:has(.compact-intro) .whatsapp-feature-card { order: 2 !important; }
  body.home-page .whatsapp-recommended { top: 11px !important; right: 11px !important; }

}

/* match the user's second reference image — icon beside content,
 recommendation/status badge aligned to the upper-right, dark verse card. */
body.home-page main > .daily-verse-card {
  background: radial-gradient(circle at 94% 12%, rgba(79, 105, 181, .19) 0 72px, transparent 73px),
              linear-gradient(145deg, #17243d 0%, #111b30 72%, #102d35 100%) !important;
  color: #f5f7ff !important;
}
body.home-page .daily-verse-card h2,
body.home-page .daily-verse-card .daily-verse-text,
body.home-page .daily-verse-card .daily-verse-translation { color: #f5f7ff !important; }
body.home-page .daily-verse-card .daily-verse-label { color: #c6d5f7 !important; }
body.home-page .daily-verse-card .daily-verse-date { color: #f1f5ff !important; background: rgba(255,255,255,.09) !important; }
body.home-page .daily-verse-card .daily-verse-cross { background: #263b65 !important; color: #d9e5ff !important; }
body.home-page .compact-intro h1 em { color: #14234a !important; }

body.home-page .whatsapp-feature-card {
  display: grid !important;
  grid-template-columns: clamp(52px, 8vw, 82px) minmax(0, 1fr) !important;
  column-gap: clamp(12px, 2vw, 20px) !important;
  row-gap: 14px !important;
  align-items: start !important;
  padding: clamp(14px, 2.6vw, 23px) !important;
  margin-top: 14px !important;
  border: 1.5px solid #b7d2ff !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #ffffff 0%, #f6f9ff 100%) !important;
  box-shadow: 0 10px 26px rgba(36, 99, 212, .07) !important;
}
body.home-page .whatsapp-feature-icon {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: clamp(52px, 8vw, 82px) !important;
  height: clamp(52px, 8vw, 82px) !important;
  margin: 0 !important;
  border-radius: 22px !important;
  align-self: start !important;
}
body.home-page .whatsapp-feature-icon:before { inset: 8px !important; border-radius: 16px !important; }
body.home-page .whatsapp-feature-icon:after { border-radius: 22px !important; }
body.home-page .whatsapp-feature-icon svg { width: clamp(29px, 4.3vw, 42px) !important; height: clamp(29px, 4.3vw, 42px) !important; }
body.home-page .whatsapp-feature-content {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  position: static !important;
}
body.home-page .whatsapp-feature-top {
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}
body.home-page .whatsapp-feature-kicker {
  padding: 2px 0 0 !important;
  color: #1765d9 !important;
  font-size: clamp(9px, 1.25vw, 12px) !important;
  letter-spacing: clamp(.5px, .15vw, 1.5px) !important;
  font-weight: 850 !important;
}
body.home-page .whatsapp-recommended {
  inset: auto !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: clamp(5px, .8vw, 8px) clamp(7px, 1.2vw, 12px) !important;
  border: 1px solid #b5edcf !important;
  border-radius: 999px !important;
  background: #e7fff1 !important;
  color: #16754b !important;
  font-size: clamp(7px, .95vw, 10px) !important;
  line-height: 1.25 !important;
}
body.home-page .whatsapp-feature-content h2 {
  color: #14234a !important;
  font-size: clamp(19px, 2.5vw, 29px) !important;
  line-height: 1.18 !important;
  letter-spacing: -.55px !important;
}
body.home-page .whatsapp-feature-content h2 span { color: #078b51 !important; }
body.home-page .whatsapp-feature-content p {
  color: #64718b !important;
  font-size: clamp(11px, 1.45vw, 15px) !important;
  line-height: 1.45 !important;
}
body.home-page .whatsapp-feature-card .whatsapp-button {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  min-height: clamp(48px, 6vw, 64px) !important;
  margin: 0 !important;
  padding: 10px 14px !important;
  border-radius: 16px !important;
  font-size: clamp(13px, 1.8vw, 19px) !important;
}
body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon,
body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon svg { width: 28px !important; height: 28px !important; }

@media  (max-width: 600px)  {
  body.home-page .whatsapp-feature-card { column-gap: 12px !important; row-gap: 12px !important; margin-top: 12px !important; }

}
@media  (max-width: 370px)  {
  body.home-page .whatsapp-feature-icon { border-radius: 13px !important; }
  body.home-page .whatsapp-feature-icon svg { width: 26px !important; height: 26px !important; }

}

/* place availability title rows beside the icon and let the hours panel span the full card. */

/* compact first-screen contact layout based on the approved reference.
 Keep the Bible verse, recovery-status badge, heading and copy in their existing order. */
@media  (max-width: 600px)  {
  body.home-page main {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    max-width: 100% !important;
    padding: 0 12px 22px !important;
  }

  body.home-page main > .daily-verse-card {
    order: 0 !important;
    display: block !important;
    max-width: none !important;
    border-radius: 16px !important;
  }
  body.home-page .daily-verse-cross {
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
  }
  body.home-page .daily-verse-label {
    font-size: 7.5px !important;
    letter-spacing: .65px !important;
  }
  body.home-page .daily-verse-date {
    padding: 3px 6px !important;
    font-size: 7px !important;
    letter-spacing: .2px !important;
  }

  body.home-page main > .compact-intro {
    order: 1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto 2px !important;
    padding: 0 2px !important;
    text-align: center !important;
  }
  body.home-page .compact-intro .eyebrow.premium-status {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 6px 8px !important;
    font-size: 8px !important;
    line-height: 1.1 !important;
    letter-spacing: .4px !important;
  }
  body.home-page .compact-intro .eyebrow .status-pulse {
    width: 8px !important;
    height: 8px !important;
    min-width: 8px !important;
    flex-basis: 8px !important;
  }
  body.home-page .compact-intro .eyebrow .status-label {
    font-size: 8px !important;
    letter-spacing: .35px !important;
    white-space: nowrap !important;
  }
  body.home-page .compact-intro p {
    margin: 0 auto !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
  }

  body.home-page main > .wizard-card.contact-only {
    display: contents !important;
  }
  body.home-page .wizard-card.contact-only .whatsapp-feature-card {
    order: 2 !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 9px !important;
    row-gap: 7px !important;
    align-items: start !important;
    width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 1.5px solid #b7d2ff !important;
    border-radius: 16px !important;
    box-shadow: 0 7px 18px rgba(36, 99, 212, .06) !important;
  }
  body.home-page .whatsapp-feature-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 42px !important;
    height: 42px !important;
    margin: 0 !important;
    border-radius: 13px !important;
  }
  body.home-page .whatsapp-feature-icon:before {
    inset: 4px !important;
    border-radius: 10px !important;
  }
  body.home-page .whatsapp-feature-icon:after { border-radius: 15px !important; }
  body.home-page .whatsapp-feature-icon svg {
    width: 25px !important;
    height: 25px !important;
  }
  body.home-page .whatsapp-feature-content {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0 !important;
    position: static !important;
  }
  body.home-page .whatsapp-feature-top {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 5px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.home-page .whatsapp-feature-kicker {
    display: block !important;
    max-width: none !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
  }
  body.home-page .whatsapp-recommended {
    position: static !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin: 0 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }
  body.home-page .whatsapp-recommended span {
    font-size: 12px !important;
    line-height: .8 !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon,
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon svg {
    width: 22px !important;
    height: 22px !important;
    flex-basis: 22px !important;
  }

  /* Keep the same sections and text order; tighten only the vertical gaps. */
}

@media  (max-width: 370px)  {
  body.home-page .whatsapp-feature-card {
    padding: 8px !important;
    column-gap: 7px !important;
  }
  body.home-page .whatsapp-feature-icon {
    width: 36px !important;
    height: 36px !important;
  }
  body.home-page .whatsapp-feature-card { grid-template-columns: 36px minmax(0, 1fr) !important; }

  body.home-page .whatsapp-feature-kicker { font-size: 7px !important; letter-spacing: .25px !important; }

}

/* keep the RECOMMENDED badge in its own top-right area so it never overlaps the title or description. */
body.home-page .whatsapp-feature-top {
  position: relative !important;
  display: block !important;
  padding: 0 108px 0 0 !important;
  overflow: visible !important;
}
body.home-page .whatsapp-feature-kicker {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  white-space: normal !important;
  line-height: 1.3 !important;
}
body.home-page .whatsapp-recommended {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 3 !important;
  margin: 0 !important;
  white-space: nowrap !important;
}
body.home-page .whatsapp-feature-content h2 {
  position: relative !important;
  z-index: 1 !important;
  margin: 7px 0 4px !important;
  max-width: 100% !important;
}
body.home-page .whatsapp-feature-content p {
  position: relative !important;
  z-index: 1 !important;
  margin: 0 !important;
}
@media  (max-width: 370px)  {
  body.home-page .whatsapp-recommended {
    font-size: 5.8px !important;
    padding: 4px 5px !important;
  }
}

/* raise the WhatsApp title closer to its kicker while keeping RECOMMENDED clear above/right. */
body.home-page .whatsapp-feature-top {
  min-height: 22px !important;
  padding-right: 108px !important;
  margin: 0 !important;
}
body.home-page .whatsapp-feature-content h2 {
  margin-top: 1px !important;
  margin-bottom: 4px !important;
  clear: both !important;
}
@media  (max-width: 370px)  {
  body.home-page .whatsapp-feature-top {
    min-height: 21px !important;
    padding-right: 92px !important;
  }
  body.home-page .whatsapp-feature-content h2 {
    margin-top: 1px !important;
  }
}

/* use the WhatsApp brand glyph while preserving the floating button animation. */
#floatingWhatsApp.arc-scroll-reveal-visible { animation: arc-wa-float 3.2s ease-in-out 650ms infinite; }
@keyframes  arc-wa-float  {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -4px, 0); }
}

/* icon-only round floating WhatsApp button; retain the float animation. */
#floatingWhatsApp {
  width: 58px; height: 58px; min-height: 58px; padding: 0;
  aspect-ratio: 1 / 1; justify-content: center; gap: 0;
  border-radius: 50%; font-size: 0;
  box-shadow: 0 10px 25px rgba(20,156,85,.26);
}
#floatingWhatsApp .floating-whatsapp-icon { width: 30px; height: 30px; flex: 0 0 30px; }
#floatingWhatsApp:hover { transform: translateY(-2px); }
#floatingWhatsApp:active { transform: scale(.96); }
@media  (max-width: 760px)  { #floatingWhatsApp { width: 54px; height: 54px; min-height: 54px; padding: 0; } }
@media  (max-width: 420px)  { #floatingWhatsApp { width: 52px; height: 52px; min-height: 52px; } }

/* desktop contact-card alignment and restrained icon motion.
 Keep the established scroll-reveal system and mobile sizing intact. */
@media  (min-width: 761px)  {
  body.home-page .whatsapp-feature-card {
    grid-template-columns: 72px minmax(0, 1fr);
    column-gap: 18px;
    row-gap: 18px;
    align-items: start;
  }
  body.home-page .whatsapp-feature-top {
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    gap: 10px 16px !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  body.home-page .whatsapp-feature-kicker {
    flex: 1 1 240px;
    width: auto !important;
  }
  body.home-page .whatsapp-recommended {
    flex: 0 0 auto;
    line-height: 1.2;
    white-space: nowrap !important;
  }
  body.home-page .whatsapp-feature-content h2 {
    clear: none !important;
    overflow-wrap: normal;
  }

}
@media  (prefers-reduced-motion: no-preference)  {
  .whatsapp-feature-icon:after { animation: waIconRipple 2.2s ease-out infinite !important; }

  .whatsapp-feature-icon svg { transform-origin: 50% 50%; animation: whatsappIconBreathe 3.2s ease-in-out infinite; }
}

@keyframes  recommendedBoltPulse  {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}
@keyframes  whatsappIconBreathe  {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.045); }
}

/* respect reduced-motion preferences for decorative badges and contact icons.
   Keep layout and static icon appearance unchanged; disable motion only. */
@media (prefers-reduced-motion: reduce) {
  .compact-intro .eyebrow,
  .compact-intro .eyebrow .status-pulse,
  .compact-intro .eyebrow .status-pulse::after,
  .arisu-verified-badge,
  .arisu-verified-badge::after,
  body.home-page .whatsapp-feature-icon::after,
  body.home-page .whatsapp-feature-icon::before,
  body.home-page .whatsapp-feature-icon svg,
  body.home-page .whatsapp-feature-icon svg path {
    animation: none !important;
    transition: none !important;
  }

}

/* desktop contact-card spacing fix. Keep animation rules unchanged. */
@media  (min-width: 761px)  {
  body.home-page .wizard-card.contact-only {
    align-items: start;
    row-gap: 18px;
  }
  body.home-page .whatsapp-feature-card {
    width: 100%;
    height: auto;
    min-width: 0;
  }

}

/* desktop-only alignment correction:
 center the clock tile against the three-line heading block (kicker, title, intro),
 matching the WhatsApp icon's visual balance. The hours panel remains a full-width
 second row. Mobile rules and all animation/scroll-reveal code remain unchanged. */

/* modestly enlarge the availability clock and keep it aligned with the heading block.
 Also explicitly animate the recovery promise check on desktop, matching the existing check-draw
 animation used elsewhere. No HTML/JS, mobile layout, or scroll-reveal code is changed. */


/* approved sample: 82×82 desktop clock tile, aligned with the availability kicker.
 Keep the clock proportionate and match the WhatsApp icon tile's visual size. */

/* approved Contact Availability layout: 80px tile, 42px clock, aligned content. */

/* desktop recovery-promise check animation fix.
 Ensure the check is visible even when reduced motion is enabled; animate it on
 desktop when motion is allowed. The icon must never remain an empty green circle. */




/* clean status badge text only; preserve badge, glow, dot and check design. */
.compact-intro .eyebrow.premium-status > .status-label {
  color: #164E3B !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 transparent !important;
  filter: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  outline: 0 !important;
  text-decoration: none !important;
}

@media  (max-width: 600px)  {
  .compact-intro .eyebrow.premium-status > .status-label {
    color: #164E3B !important;
    text-shadow: none !important;
    filter: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }
}

/* restore desktop motion for the floating WhatsApp button and recovery check.
 These are small decorative animations requested by the site owner. Keep their
 existing size, position, colors, and markup unchanged. */
@media  (min-width: 761px)  {
  #floatingWhatsApp {
    animation: arc-wa-float 3.2s ease-in-out 650ms infinite !important;
    will-change: transform;
  }
}

/* keep the recovery promise check visible while it animates on desktop.
 The previous dash-draw loop left the green circle empty for much of each cycle.
 Keep the white check continuously visible and use a subtle pulse instead. */


@keyframes  recovery-promise-circle-pulse  {
  0%, 100% { transform: scale(1); filter: brightness(1); }
  50% { transform: scale(1.07); filter: brightness(1.08); }
}

@keyframes  recovery-promise-check-pulse  {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.12); opacity: 1; }
}

/* animated blue check badge at the end of the About title.
 Reuses the site's existing badge animation keyframes and keeps it decorative. */
.about-card h2.about-brand-title {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
}

.about-card .about-verified-badge {
  width: 29px;
  height: 29px;
  flex: 0 0 29px;
  vertical-align: middle;
  margin: 0;
}

.about-card .about-verified-badge svg {
  width: 17px;
  height: 17px;
}

@media  (max-width: 600px)  {
  .about-card h2.about-brand-title {
    gap: 7px;
  }
  .about-card .about-verified-badge {
    width: 23px;
    height: 23px;
    flex-basis: 23px;
  }
  .about-card .about-verified-badge svg {
    width: 14px;
    height: 14px;
  }
}

@media  (max-width: 380px)  {
  .about-card .about-verified-badge {
    width: 21px;
    height: 21px;
    flex-basis: 21px;
  }
  .about-card .about-verified-badge svg {
    width: 12px;
    height: 12px;
  }
}

/* compact desktop first-screen layout.
 Keep Bible Verse, intro, WhatsApp and Contact Availability in the same order,
 reduce wasted vertical spacing so more of the key content is visible above the fold.
 Desktop-only: mobile layout and all other sections remain in their existing flow. */
@media  (min-width: 761px)  {
  body.home-page main {
    padding-top: 10px !important;
    padding-bottom: 48px !important;
  }

  body.home-page main > .daily-verse-card {
    margin-top: 0 !important;
    margin-bottom: 9px !important;
  }

  body.home-page .daily-verse-topline {
    margin-bottom: 2px !important;
  }

  body.home-page .daily-verse-card .daily-verse-translation {
    margin-top: 3px !important;
  }

  body.home-page .compact-intro .eyebrow.premium-status {
    line-height: 1.15 !important;
  }

  body.home-page .whatsapp-feature-icon {
    margin-top: 0 !important;
  }

  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon,
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon svg {
    flex-basis: 25px !important;
  }

  /* Other content remains in the page flow after the three key sections. */
  body.home-page .contact-divider {
    margin-top: 14px !important;
  }
}

/* approved desktop first-screen composition.
 Only desktop breakpoints are changed here: the Bible verse, status badge,
 headline, WhatsApp panel and availability panel lead the page. Social cards
 remain in normal document flow below the availability panel, never removed. */
@media  (min-width: 761px)  {
  body.home-page .topbar {
    min-height: 76px !important;
    
    padding: 8px clamp(18px, 2.2vw, 36px) !important;
    gap: 16px !important;
  }

  body.home-page .topbar > .brand {
    gap: 12px !important;
  }

  body.home-page main {
    width: 100% !important;
    max-width: 1440px !important;
    margin: 0 auto !important;
    padding: 13px clamp(24px, 3.2vw, 50px) 64px !important;
  }

  body.home-page main > .daily-verse-card {
    display: block !important;
    width: 100% !important;
    max-width: 1360px !important;
    margin: 0 auto 9px !important;
    padding: 9px 24px 9px !important;
    min-height: 0 !important;
    border-radius: 17px !important;
    background: radial-gradient(circle at 94% 0%, rgba(38, 104, 208, .34), transparent 18%),
                linear-gradient(112deg, #0c3568 0%, #092752 54%, #074b68 100%) !important;
    border: 1px solid rgba(95, 145, 218, .33) !important;
    box-shadow: 0 12px 26px rgba(18, 48, 98, .14) !important;
  }

  body.home-page main > .daily-verse-card::before {
    top: -46px !important;
    right: -14px !important;
    width: 118px !important;
    height: 118px !important;
    background: rgba(45, 109, 214, .18) !important;
  }

  body.home-page .daily-verse-topline {
    gap: 7px !important;
    margin: 0 0 2px !important;
    min-height: 20px !important;
  }

  body.home-page .daily-verse-cross {
    width: 21px !important;
    height: 21px !important;
    border-radius: 6px !important;
    background: #1b58b7 !important;
    color: #fff !important;
    font-size: 13px !important;
  }

  body.home-page .daily-verse-label {
    color: #e3edff !important;
    font-size: 9px !important;
    letter-spacing: 1px !important;
  }

  body.home-page .daily-verse-date {
    padding: 3px 7px !important;
    color: #edf4ff !important;
    background: rgba(255, 255, 255, .1) !important;
    font-size: 8px !important;
  }

  body.home-page .daily-verse-card h2 {
    margin: 1px 0 3px !important;
    color: #fff !important;
    font-size: 21px !important;
    line-height: 1.1 !important;
    letter-spacing: -.6px !important;
  }

  body.home-page .daily-verse-card .daily-verse-text {
    max-width: 1120px !important;
    margin: 0 auto 1px !important;
    color: #f7faff !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
  }

  body.home-page .daily-verse-card .daily-verse-reference {
    margin: 1px 0 0 !important;
    color: #c4d8ff !important;
    font-size: 10px !important;
    line-height: 1.2 !important;
  }

  body.home-page .daily-verse-card .daily-verse-translation {
    max-width: 1080px !important;
    margin: 2px auto 0 !important;
    color: #f0f5ff !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
  }

  body.home-page .compact-intro {
    width: 100% !important;
    max-width: 900px !important;
    margin: 0 auto 10px !important;
    padding: 0 8px 0 !important;
    text-align: center !important;
  }

  body.home-page .compact-intro .eyebrow.premium-status {
    min-height: 36px !important;
    padding: 6px 12px !important;
    gap: 9px !important;
    border: 1px solid #8ee5ad !important;
    border-radius: 999px !important;
    background: linear-gradient(110deg, #f0fff5 0%, #fff 54%, #edfff4 100%) !important;
    color: #164e3b !important;
    box-shadow: 0 4px 14px rgba(24, 160, 91, .13) !important;
    font-size: 9px !important;
    letter-spacing: .75px !important;
  }

  body.home-page .compact-intro h1 {
    margin: 7px 0 3px !important;
    color: #102044 !important;
    font-size: clamp(36px, 2.55vw, 40px) !important;
    font-weight: 800 !important;
    line-height: 1.01 !important;
    letter-spacing: -1.5px !important;
  }

  body.home-page .compact-intro h1 em {
    color: #102044 !important;
    font-style: normal !important;
  }

  body.home-page .compact-intro p {
    margin: 0 auto !important;
    max-width: 720px !important;
    color: #5b6b88 !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
  }

  body.home-page .wizard-card.contact-only {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-content: start !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 1340px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    text-align: left !important;
  }

  body.home-page .wizard-card.contact-only .whatsapp-feature-card {
    display: grid !important;
    grid-template-columns: 62px minmax(0, 1fr) !important;
    column-gap: 18px !important;
    row-gap: 8px !important;
    align-items: start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 14px 20px 13px !important;
    border: 1px solid #dce5f3 !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .94) !important;
    box-shadow: 0 8px 22px rgba(31, 61, 111, .055) !important;
  }

  body.home-page .whatsapp-feature-icon {
    width: 62px !important;
    height: 62px !important;
    min-width: 62px !important;
    min-height: 62px !important;
    margin: 1px 0 0 !important;
    border-radius: 17px !important;
    background: #d9f7e8 !important;
  }

  body.home-page .whatsapp-feature-icon:before {
    inset: 7px !important;
    border-radius: 13px !important;
    background: linear-gradient(145deg, #16bd6b, #00964f) !important;
  }

  body.home-page .whatsapp-feature-icon:after {
    border-radius: 18px !important;
  }

  body.home-page .whatsapp-feature-icon svg {
    width: 34px !important;
    height: 34px !important;
  }

  body.home-page .whatsapp-feature-content {
    min-width: 0 !important;
  }

  body.home-page .whatsapp-feature-top {
    display: block !important;
    position: relative !important;
    min-height: 17px !important;
    padding-right: 150px !important;
  }

  body.home-page .whatsapp-feature-kicker {
    display: block !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 1px 0 0 !important;
    padding: 0 !important;
    color: #2563eb !important;
    font-size: 10px !important;
    line-height: 1.3 !important;
    letter-spacing: 1.2px !important;
  }

  body.home-page .whatsapp-recommended {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    font-size: 9px !important;
  }

  body.home-page .whatsapp-feature-content h2 {
    margin: 5px 0 3px !important;
    color: #102044 !important;
    font-size: clamp(22px, 1.8vw, 27px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.65px !important;
  }

  body.home-page .whatsapp-feature-content h2 span {
    color: #079447 !important;
  }

  body.home-page .whatsapp-feature-content p {
    margin: 0 !important;
    color: #596a89 !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
  }

  body.home-page .whatsapp-feature-card .whatsapp-button {
    grid-column: 1 / -1 !important;
    min-height: 48px !important;
    padding: 7px 14px !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: linear-gradient(105deg, #08b95a 0%, #00974e 100%) !important;
    box-shadow: 0 6px 14px rgba(0, 164, 85, .15) !important;
    color: #fff !important;
    font-size: 16px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    gap: 10px !important;
  }

  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon,
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon svg {
    width: 27px !important;
    height: 27px !important;
    flex: 0 0 27px !important;
  }

  /* Keep the next social row below the opening desktop viewport without hiding it. */
  body.home-page .contact-divider {
    margin: 30px 4px 12px !important;
  }

  body.home-page .social-collage {
    margin-top: 0 !important;
    gap: 16px !important;
  }

  /* Keep the floating contact shortcut at the actual viewport corner,
 outside the wide availability card rather than over its information row. */
  #floatingWhatsApp {
    right: clamp(18px, 2vw, 32px) !important;
    bottom: 18px !important;
  }


  /* Three standard steps share the first row; the two larger promise cards span the grid below. */
  .how-section .steps-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* keep the opening desktop view focused on Bible verse and contact methods.
 The existing social/proof collage is moved below the main information on desktop;
 mobile ordering stays controlled by the layout script in index.html. */
@media  (min-width: 900px)  {
  .desktop-social-destination {
    width: 100%;
    max-width: 1000px;
    margin: 42px auto 0;
  }
  .desktop-social-destination .contact-divider {
    margin-top: 24px;
    margin-bottom: 16px;
  }
  .desktop-social-destination .social-collage {
    margin-top: 0;
  }
}

/* approved larger desktop contact cards.
 Increase WhatsApp and availability card proportions for readability without
 stretching content; scope is desktop only so mobile layout remains unchanged. */
@media  (min-width: 900px)  {
  body.home-page main > .daily-verse-card {
    margin-bottom: clamp(12px, 1.1vw, 18px) !important;
  }
  body.home-page .daily-verse-topline { margin-bottom: 5px !important; }
  body.home-page .daily-verse-label { font-size: clamp(10px, .75vw, 12px) !important; }
  body.home-page .daily-verse-date { font-size: clamp(9px, .68vw, 11px) !important; }
  body.home-page .daily-verse-card h2 { font-size: clamp(24px, 1.8vw, 29px) !important; margin-bottom: 6px !important; }
  body.home-page .daily-verse-card .daily-verse-text { font-size: clamp(16px, 1.12vw, 19px) !important; line-height: 1.4 !important; }
  body.home-page .daily-verse-card .daily-verse-reference { font-size: clamp(12px, .85vw, 14px) !important; margin-top: 3px !important; }
  body.home-page .daily-verse-card .daily-verse-translation { font-size: clamp(12px, .85vw, 14px) !important; margin-top: 5px !important; }
  body.home-page .compact-intro { margin-bottom: clamp(14px, 1.2vw, 20px) !important; }
  body.home-page .compact-intro h1 { font-size: clamp(39px, 3vw, 48px) !important; line-height: 1.04 !important; margin-top: 10px !important; }
  body.home-page .compact-intro p { font-size: clamp(16px, 1.05vw, 18px) !important; }
  body.home-page .wizard-card.contact-only .whatsapp-feature-card {
    grid-template-columns: clamp(78px, 6.2vw, 94px) minmax(0, 1fr) !important;
    column-gap: clamp(18px, 1.6vw, 26px) !important;
    row-gap: 12px !important;
    padding: clamp(18px, 1.45vw, 24px) clamp(20px, 1.65vw, 28px) clamp(17px, 1.35vw, 22px) !important;
    border-radius: 23px !important;
  }
  body.home-page .whatsapp-feature-icon {
    width: clamp(78px, 6.2vw, 94px) !important; height: clamp(78px, 6.2vw, 94px) !important;
    min-width: clamp(78px, 6.2vw, 94px) !important; min-height: clamp(78px, 6.2vw, 94px) !important;
    border-radius: 21px !important;
  }
  body.home-page .whatsapp-feature-icon:before { inset: 9px !important; border-radius: 16px !important; }
  body.home-page .whatsapp-feature-icon svg { width: clamp(43px, 3.3vw, 52px) !important; height: clamp(43px, 3.3vw, 52px) !important; }
  body.home-page .whatsapp-feature-top { min-height: 20px !important; padding-right: clamp(150px, 13vw, 190px) !important; }

}

/* approved responsive Bible verse artwork, stronger availability readability, and lower social sections. */
.daily-verse-card {
  isolation: isolate !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: clamp(170px, 17vw, 220px) !important;
  max-width: 100% !important;
  padding: clamp(20px, 2.2vw, 32px) clamp(18px, 3vw, 48px) !important;
  margin: 0 auto clamp(16px, 1.6vw, 24px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(195,225,255,.42) !important;
  border-radius: clamp(16px, 1.5vw, 24px) !important;
  background: linear-gradient(90deg,rgba(3,35,82,.58),rgba(3,40,89,.34) 55%,rgba(3,35,82,.35)), url("verse-lake-photo.jpg?v=AFV263") center 52% / cover no-repeat !important;
  color: #fff !important;
  box-shadow: 0 12px 30px rgba(15,58,115,.17) !important;
  text-align: center !important;
}
.daily-verse-card::before { content: none !important; }
.daily-verse-topline { position: relative; z-index: 1; gap: 9px !important; margin-bottom: 7px !important; }
.daily-verse-cross { background: rgba(255,255,255,.16) !important; color: #fff !important; font-size: 17px !important; }
.daily-verse-label { color: #f0f7ff !important; font-size: clamp(9px,.72vw,12px) !important; letter-spacing: 1.35px !important; }
.daily-verse-date { color: #f0f7ff !important; background: rgba(4,35,81,.42) !important; font-size: clamp(9px,.68vw,11px) !important; }
.daily-verse-card h2 { position: relative; z-index: 1; color: #fff !important; font-size: clamp(23px,1.9vw,31px) !important; line-height: 1.2 !important; margin: 0 0 7px !important; text-shadow: 0 2px 8px rgba(0,20,52,.25); }
.daily-verse-card .daily-verse-text { position: relative; z-index: 1; max-width: 1120px !important; color: #fff !important; font-size: clamp(15px,1.22vw,20px) !important; line-height: 1.42 !important; font-weight: 700 !important; text-shadow: 0 2px 7px rgba(0,20,52,.42); }
.daily-verse-card .daily-verse-reference { position: relative; z-index: 1; color: #f3f7ff !important; font-size: clamp(12px,.88vw,15px) !important; margin-top: 3px !important; text-shadow: 0 1px 5px rgba(0,20,52,.35); }
.daily-verse-card .daily-verse-translation { position: relative; z-index: 1; max-width: 1050px !important; color: #f1f6ff !important; font-size: clamp(12px,.9vw,15px) !important; line-height: 1.45 !important; margin-top: 6px !important; text-shadow: 0 1px 5px rgba(0,20,52,.4); }

.desktop-social-destination { width: 100%; max-width: 100%; margin: clamp(12px,1.2vw,18px) auto 0; }
.desktop-social-destination .contact-divider { margin: 0 auto 10px !important; }
.desktop-social-destination .social-collage { margin-top: 0 !important; }
body.home-page .desktop-social-destination { order: 5 !important; }
@media  (min-width: 900px)  {
  body.home-page main { max-width: 1320px !important; padding-left: clamp(24px,3vw,48px) !important; padding-right: clamp(24px,3vw,48px) !important; }
  body.home-page .daily-verse-card { min-height: clamp(190px,17vw,235px) !important; }

}
@media  (max-width: 899px)  {
  body.home-page main { padding-left: 14px !important; padding-right: 14px !important; }
  .daily-verse-card { min-height: 215px !important; padding: 23px 15px !important; background-position: 68% center !important; }
  .daily-verse-topline { gap: 5px !important; }
  .daily-verse-card h2 { font-size: clamp(21px,5.8vw,27px) !important; }
  .daily-verse-card .daily-verse-text { font-size: clamp(14px,3.8vw,17px) !important; line-height: 1.45 !important; }
  .daily-verse-card .daily-verse-reference { font-size: 12px !important; }
  .daily-verse-card .daily-verse-translation { font-size: clamp(11px,3vw,13px) !important; }

  .desktop-social-destination { margin-top: 28px !important; }
}
@media  (max-width: 420px)  {
  .daily-verse-card { min-height: 225px !important; padding: 22px 12px !important; }
  .daily-verse-label { font-size: 8px !important; letter-spacing: .7px !important; }
  .daily-verse-date { font-size: 8px !important; }

}

/* restore the scenic Bible banner and compact desktop contact cards. */
@media  (min-width: 900px)  {
  body.home-page main > .daily-verse-card {
    min-height: clamp(150px, 13vw, 190px) !important;
    padding: clamp(18px, 1.7vw, 26px) clamp(24px, 3vw, 46px) !important;
    background-color: #14549b !important;
    background-image: linear-gradient(90deg, rgba(5,48,104,.20), rgba(5,48,104,.10) 55%, rgba(5,48,104,.12)), url("./verse-lake-photo.jpg?v=AFV263") !important;
    background-position: center 52% !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
  }
  body.home-page .wizard-card.contact-only {
    gap: 12px !important;
  }
  body.home-page .whatsapp-feature-card {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: 10px 15px !important;
    padding: 17px 20px !important;
    border-radius: 18px !important;
  }
  body.home-page .whatsapp-feature-icon,
  body.home-page .whatsapp-feature-icon svg {
    width: 54px !important;
    height: 54px !important;
  }
  body.home-page .whatsapp-feature-kicker {
    font-size: 10px !important;
    letter-spacing: 1px !important;
  }
  body.home-page .whatsapp-recommended {
    padding: 5px 9px !important;
    font-size: 9px !important;
  }
  body.home-page .whatsapp-feature-content h2 {
    font-size: clamp(19px, 1.45vw, 23px) !important;
    line-height: 1.25 !important;
    margin: 5px 0 4px !important;
    letter-spacing: -.3px !important;
  }
  body.home-page .whatsapp-feature-content p {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button {
    grid-column: 1 / -1 !important;
    min-height: 48px !important;
    padding: 9px 14px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    gap: 9px !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon,
  body.home-page .whatsapp-feature-card .whatsapp-button .wa-icon svg {
    width: 21px !important;
    height: 21px !important;
    flex-basis: 24px !important;
  }

}

/* unify all five process cards to the approved horizontal layout.
 Icon, number badge, and copy sit side-by-side on desktop and mobile. */
.how-section .steps-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 14px !important;
}
.how-section .step-card {
  display: grid !important;
  grid-template-columns: 64px 52px minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-items: start !important;
  column-gap: 18px !important;
  row-gap: 8px !important;
  width: 100%;
  min-height: 0 !important;
  padding: 19px 22px !important;
  border: 1.5px solid #65dfc6 !important;
  border-radius: 21px !important;
  background: linear-gradient(120deg, rgba(255,255,255,.98), rgba(250,253,255,.98)) !important;
  box-shadow: 0 7px 20px rgba(31, 113, 117, .045) !important;
}
.how-section .step-card h3 {
  grid-column: 3 !important;
  grid-row: 1 !important;
  align-self: center !important;
  margin: 2px 28px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  color: #101a38 !important;
  font: 800 clamp(17px, 1.65vw, 24px)/1.25 Manrope, sans-serif !important;
  letter-spacing: -.45px !important;
}
.how-section .step-card > p {
  grid-column: 3 !important;
  grid-row: 2 !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #53627f !important;
  font-size: 15px !important;
  line-height: 1.65 !important;
}
@media  (max-width: 760px)  {
  .how-section .step-card {
    grid-template-columns: 42px 38px minmax(0, 1fr) !important;
    border-radius: 17px !important;
  }
  .how-section .step-card h3 {
    font-size: 15px !important;
    letter-spacing: -.2px !important;
  }
}


/* closer scenic Bible verse banner styling for desktop and mobile. */
body.home-page main > .daily-verse-card {
  width: 100% !important;
  max-width: 100% !important;
  padding: clamp(18px, 1.65vw, 26px) clamp(18px, 3vw, 46px) !important;
  margin: 0 auto clamp(14px, 1.5vw, 22px) !important;
  border: 1px solid rgba(202, 230, 255, .5) !important;
  border-radius: clamp(16px, 1.5vw, 24px) !important;
  box-shadow: 0 10px 28px rgba(16, 66, 128, .17) !important;
}
body.home-page .daily-verse-topline { gap: 8px !important; margin-bottom: 6px !important; }
body.home-page .daily-verse-cross { width: auto !important; height: auto !important; padding: 0 2px !important; background: transparent !important; color: #fff !important; font-size: 15px !important; }
body.home-page .daily-verse-label,
body.home-page .daily-verse-date { color: #f5f9ff !important; font-size: clamp(8px, .68vw, 11px) !important; letter-spacing: 1.15px !important; }
body.home-page .daily-verse-date { background: transparent !important; padding: 0 !important; }
body.home-page .daily-verse-card h2 { margin: 0 0 7px !important; font-size: clamp(23px, 2vw, 32px) !important; line-height: 1.18 !important; color: #fff !important; text-shadow: 0 2px 7px rgba(5, 34, 72, .28) !important; }
body.home-page .daily-verse-card .daily-verse-text { max-width: 1180px !important; margin: 0 auto 2px !important; color: #fff !important; font-size: clamp(14px, 1.2vw, 19px) !important; line-height: 1.38 !important; font-weight: 750 !important; text-shadow: 0 1px 6px rgba(4, 30, 66, .4) !important; }
body.home-page .daily-verse-card .daily-verse-reference { margin-top: 2px !important; color: #eaf4ff !important; font-size: clamp(10px, .82vw, 13px) !important; font-style: italic !important; }
body.home-page .daily-verse-card .daily-verse-translation { max-width: 1180px !important; margin: 5px auto 0 !important; color: #edf6ff !important; font-size: clamp(10px, .86vw, 14px) !important; line-height: 1.38 !important; }
@media  (max-width: 899px)  {
  body.home-page main > .daily-verse-card { min-height: 0 !important; }
  body.home-page .daily-verse-topline { gap: 5px !important; }
  body.home-page .daily-verse-cross { font-size: 13px !important; }
  body.home-page .daily-verse-label,
  body.home-page .daily-verse-date { font-size: clamp(7px, 2.1vw, 9px) !important; letter-spacing: .75px !important; }
  body.home-page .daily-verse-card h2 { font-size: clamp(19px, 5.6vw, 26px) !important; margin-bottom: 8px !important; }
  body.home-page .daily-verse-card .daily-verse-text { font-size: clamp(13px, 3.7vw, 16px) !important; line-height: 1.43 !important; }
  body.home-page .daily-verse-card .daily-verse-reference { font-size: 11px !important; margin-top: 3px !important; }
  body.home-page .daily-verse-card .daily-verse-translation { font-size: clamp(10px, 3vw, 12px) !important; line-height: 1.42 !important; margin-top: 6px !important; }
}
@media  (max-width: 380px)  {
  body.home-page .daily-verse-topline { gap: 4px !important; }
}

/* mobile fix: force the scenic Bible banner asset to load and remove excess height. */
body.home-page main > .daily-verse-card {
  background-color: #14549b !important;
  background-image:
    linear-gradient(90deg, rgba(4, 44, 98, .10), rgba(4, 40, 88, .04) 52%, rgba(4, 35, 80, .08)),
    url("./verse-lake-photo.jpg?v=AFV263") !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center 52% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}
body.home-page main > .daily-verse-card::before {
  content: none !important;
  display: none !important;
}
@media  (max-width: 899px)  {
  body.home-page main > .daily-verse-card {
    padding: 18px 12px 15px !important;
    margin: 0 auto 12px !important;
    background-position: 68% center !important;
    border-radius: 17px !important;
  }
  body.home-page .daily-verse-topline {
    flex-wrap: wrap !important;
    row-gap: 5px !important;
    margin-bottom: 7px !important;
  }
  body.home-page .daily-verse-card .daily-verse-translation {
    margin-bottom: 0 !important;
  }
}
/* Keep the floating WhatsApp shortcut from crowding the contact cards on mobile. */
@media  (max-width: 600px)  {
  .floating-whatsapp {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    right: 12px !important;
    bottom: 82px !important;
  }
}

/* mobile first-screen spacing: reveal the full Contact Availability card sooner. */
@media  (max-width: 600px)  {
  body.home-page main {
    padding-top: 10px !important;
    padding-bottom: 28px !important;
  }
  body.home-page .daily-verse-card h2 {
    margin-bottom: 5px !important;
  }
  body.home-page .daily-verse-card .daily-verse-translation {
    margin-top: 3px !important;
  }
  body.home-page .compact-intro {
    gap: 0 !important;
  }
  body.home-page .whatsapp-feature-content h2 {
    letter-spacing: -.35px !important;
  }
  body.home-page .whatsapp-feature-content p {
    margin: 0 !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button {
    gap: 7px !important;
  }

  /* The main WhatsApp CTA is already visible; prevent the floating shortcut covering cards. */
  body.home-page .floating-whatsapp,
  body.home-page #floatingWhatsApp {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    right: 10px !important;
    bottom: 14px !important;
    opacity: .94 !important;
  }
}

/* reduce the mobile Bible banner height so Contact Availability appears sooner. */
@media  (max-width: 600px)  {
  body.home-page main > .daily-verse-card {
    margin-bottom: 8px !important;
  }
  body.home-page .daily-verse-topline {
    margin-bottom: 3px !important;
  }
}

/* preserve the full mountain/cross artwork and bring Contact Availability into view on mobile. */
@media  (max-width: 600px)  {
  body.home-page main > .daily-verse-card {
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 8px 10px 9px !important;
    margin: 0 auto 7px !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    overflow: hidden !important;
  }
  body.home-page .daily-verse-topline {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 4px !important;
    margin: 0 auto 3px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }
  body.home-page .daily-verse-cross { font-size: 10px !important; line-height: 1 !important; }
  body.home-page .daily-verse-label,
  body.home-page .daily-verse-date {
    font-size: clamp(6.5px, 1.65vw, 8px) !important;
    letter-spacing: .2px !important;
    line-height: 1.1 !important;
  }
  body.home-page .daily-verse-card h2 {
    font-size: clamp(17px, 4.6vw, 21px) !important;
    line-height: 1.08 !important;
    margin: 0 0 4px !important;
  }
  body.home-page .daily-verse-card .daily-verse-text {
    max-width: 100% !important;
    font-size: clamp(11px, 3.1vw, 13px) !important;
    line-height: 1.22 !important;
    margin: 0 auto 1px !important;
  }
  body.home-page .daily-verse-card .daily-verse-reference {
    font-size: 9px !important;
    line-height: 1.1 !important;
    margin-top: 2px !important;
  }
  body.home-page .daily-verse-card .daily-verse-translation {
    max-width: 100% !important;
    font-size: clamp(8.5px, 2.5vw, 10px) !important;
    line-height: 1.18 !important;
    margin: 3px auto 0 !important;
  }
  body.home-page .compact-intro {
    margin: 5px auto 8px !important;
    padding: 0 3px !important;
  }
  body.home-page .compact-intro .premium-status {
    padding: 5px 8px !important;
    margin-bottom: 5px !important;
  }
  body.home-page .compact-intro h1 {
    font-size: clamp(24px, 6.4vw, 29px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.8px !important;
    margin: 0 0 4px !important;
  }
  body.home-page .compact-intro > p {
    font-size: 10.5px !important;
    line-height: 1.25 !important;
    margin: 0 !important;
  }
  body.home-page .wizard-card.contact-only {
    gap: 8px !important;
  }
  body.home-page .whatsapp-feature-card {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 6px 9px !important;
    padding: 9px 10px !important;
    border-radius: 16px !important;
  }
  body.home-page .whatsapp-feature-icon,
  body.home-page .whatsapp-feature-icon svg {
    width: 36px !important;
    height: 36px !important;
  }
  body.home-page .whatsapp-feature-kicker { font-size: 8px !important; letter-spacing: .45px !important; }
  body.home-page .whatsapp-recommended { font-size: 7px !important; padding: 3px 5px !important; }
  body.home-page .whatsapp-feature-content h2 {
    font-size: clamp(15px, 4.3vw, 19px) !important;
    line-height: 1.12 !important;
    margin: 3px 0 !important;
  }
  body.home-page .whatsapp-feature-content p {
    font-size: 10.5px !important;
    line-height: 1.25 !important;
  }
  body.home-page .whatsapp-feature-card .whatsapp-button {
    min-height: 39px !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
    border-radius: 11px !important;
  }

}
@media  (max-width: 380px)  {
  body.home-page main > .daily-verse-card { padding: 7px 7px 8px !important; }
  body.home-page .daily-verse-label,
  body.home-page .daily-verse-date { font-size: 6.5px !important; letter-spacing: 0 !important; }
  body.home-page .daily-verse-card .daily-verse-text { font-size: 11px !important; }
  body.home-page .daily-verse-card .daily-verse-translation { font-size: 8.5px !important; }
}

/* adaptive first-screen layout for short and narrow phones */
@media  (max-width: 600px)  {
  html body.home-page main {
    padding: 8px 10px 18px !important;
  }
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 auto 6px !important;
    padding: 8px 10px 9px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    /* Background is intentionally controlled by the final mobile-only rule below. */
    overflow: hidden !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-topline {
    margin: 0 auto 3px !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-label,
  html body.home-page #daily-bible-verse .daily-verse-date {
    font-size: clamp(7px, 1.8vw, 8px) !important;
    letter-spacing: .1px !important;
    line-height: 1.15 !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-reference {
    margin: 2px auto 0 !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-translation {
    margin: 3px auto 0 !important;
  }
  html body.home-page main > .compact-intro {
    padding: 0 2px !important;
  }
  html body.home-page main > .compact-intro .premium-status {
    margin: 0 auto 5px !important;
    padding: 4px 8px !important;
    min-height: 0 !important;
  }
  html body.home-page main > .compact-intro h1,
  html body.home-page #introTitle {
    font-size: clamp(23px, 6.1vw, 28px) !important;
    line-height: 1.02 !important;
    letter-spacing: -.7px !important;
    margin: 0 0 4px !important;
  }
  html body.home-page main > .compact-intro > p {
    margin: 0 !important;
  }
  html body.home-page #contact .whatsapp-button {
    line-height: 1.15 !important;
  }
}
/* Short viewports need a little extra compression; widths still control text. */
@media  (max-width: 600px) and (max-height: 780px)  {
  html body.home-page main { padding-top: 6px !important; }
  html body.home-page main > .compact-intro { margin-top: 3px !important; margin-bottom: 5px !important; }
  html body.home-page #introTitle { font-size: clamp(22px, 5.8vw, 26px) !important; }
}

/* fix mobile availability row wrapping and icon overlap on narrow screens. */

/* compact Contact Availability for short mobile viewports without hiding details. */

/* finish mobile Contact Availability layout: readable details, safe spacing, no floating-button overlap. */
@media  (max-width: 600px)  {
  html, body { max-width: 100%; overflow-x: clip; }

  /* Keep the floating WhatsApp shortcut away from the schedule/details. */
  html body.home-page .floating-whatsapp,
  html body.home-page #floatingWhatsApp {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    right: 9px !important;
    bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* compact vertical rhythm below Contact Availability only.
 Keep the Bible verse, intro, WhatsApp and availability card styling untouched. */
body.home-page .contact-divider {
  margin-top: 10px !important;
  margin-bottom: 8px !important;
}
body.home-page .social-collage {
  margin-top: 8px !important;
  gap: 12px !important;
}
body.home-page .site-section {
  margin-top: 24px !important;
}
body.home-page .site-section .section-heading {
  margin-bottom: 12px !important;
}
body.home-page .site-section .steps-grid {
  gap: 10px !important;
}
body.home-page .site-section .step-card {
  margin-bottom: 0 !important;
}
body.home-page .desktop-social-destination .contact-divider {
  margin: 0 auto 8px !important;
}
body.home-page .desktop-social-destination .social-collage {
  margin-top: 0 !important;
}
body.home-page .about-card,
body.home-page .safety-panel,
body.home-page .terms-card {
  margin-top: 0 !important;
}
body.home-page .site-footer {
  margin-top: 18px !important;
}
@media  (min-width: 601px)  {
  body.home-page .site-section { margin-top: 28px !important; }
  body.home-page .social-collage { gap: 12px !important; }
}
@media  (max-width: 600px)  {
  body.home-page .contact-divider {
    margin: 8px 0 6px !important;
    gap: 8px !important;
  }
  body.home-page .social-collage {
    margin-top: 6px !important;
    gap: 8px !important;
  }
  body.home-page .site-section { margin-top: 18px !important; }
  body.home-page .site-section .section-heading { margin-bottom: 9px !important; }
  body.home-page .site-section .steps-grid { gap: 8px !important; }
  body.home-page .site-section .step-card { padding-top: 13px !important; padding-bottom: 13px !important; }
  body.home-page .about-card,
  body.home-page .safety-panel,
  body.home-page .terms-card { padding-top: 14px !important; padding-bottom: 14px !important; }
  body.home-page .site-footer { margin-top: 12px !important; }
}
@media  (max-width: 380px)  {
  body.home-page .social-collage { gap: 7px !important; }
  body.home-page .site-section { margin-top: 15px !important; }
}

/* Services showcase placed directly below social links, proofs and reviews. */
.desktop-social-destination .services-section { width:100%; max-width:1120px; margin:clamp(28px,3vw,44px) auto 0; padding:0; }
.services-heading { max-width:850px; margin-bottom:24px; }
.services-heading h2 { font-size:clamp(30px,4vw,48px); letter-spacing:-1.5px; }
.services-heading h2 span { color:#2865f5; }
.services-heading > p:first-of-type { font-size:16px; font-weight:700; color:#334b7b; }
.services-heading .services-intro { margin-top:8px; font-size:14px; }
.services-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; }
.service-card { min-width:0; padding:24px; border:1px solid #d3e1ff; border-radius:22px; background:rgba(255,255,255,.82); box-shadow:0 10px 28px rgba(55,90,170,.07); }
/* Recovery outer-card offset is defined once in the authoritative block at EOF. */
/* Account Deletion visual styling only; outer-card positioning is authoritative at EOF. */
.deletion-service-card { border-color:#f6d7e9; background:rgba(255,249,253,.88); }
.service-card-heading { display:grid; grid-template-columns:76px minmax(0,1fr); gap:17px; align-items:center; margin-bottom:18px; }
.service-icon { width:76px; height:76px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#6db2ff,#1764f4); border-radius:20px; box-shadow:0 7px 16px rgba(30,103,245,.18); }
.service-icon svg { width:36px; height:36px; }
.deletion-service-card .service-icon { background:linear-gradient(145deg,#ffb8d7,#e91e63); box-shadow:0 7px 16px rgba(233,30,99,.13); }
.service-card h3 { margin:0 0 6px; color:#101d43; font:800 clamp(19px,2vw,25px)/1.2 Manrope,sans-serif; letter-spacing:-.5px; }
.service-card-heading p { margin:0; color:#4b6086; font-size:14px; line-height:1.55; }
.service-check { display:inline-grid; place-items:center; width:21px; height:21px; margin-left:3px; border-radius:7px; background:#2671fa; color:white; font:800 13px/1 sans-serif; vertical-align:3px; }
.service-issue-list { display:grid; gap:6px; margin:0; padding:0; list-style:none; }
.service-issue-list li { display:flex; align-items:center; gap:10px; min-height:35px; padding:6px 12px; border-radius:12px; background:#edf4ff; color:#15264c; font-size:14px; line-height:1.35; }
.service-issue-list li::before { content:"✓"; flex:0 0 22px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#2671fa; color:white; font-size:13px; font-weight:800; }
.service-platforms { display:flex; flex-direction:column; align-items:stretch; min-width:0; margin-top:12px; padding:14px; border:1px solid #cfe0ff; border-radius:16px; background:rgba(255,255,255,.72); }
.service-platforms h4 { position:relative; z-index:1; display:block; flex:0 0 auto; margin:0 0 10px; color:#1858d8; font:800 15px/1.35 Manrope,sans-serif; }
.service-platform-list { position:relative; z-index:0; display:grid; flex:0 0 auto; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0; }
.service-platform { display:flex; align-items:center; gap:10px; min-width:0; padding:11px; border-radius:13px; }
.service-platform-facebook { background:#eaf3ff; color:#1257c8; }
.service-platform-instagram { background:#fff0f8; color:#a01880; }
.service-platform-logo { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:50%; background:#1877f2; color:#fff; }
.service-platform-logo svg { width:25px; height:25px; }
.service-platform-instagram .service-platform-logo { background:linear-gradient(135deg,#7b35db,#e1306c 60%,#ffb347); }
.service-platform strong,.service-platform small { display:block; overflow-wrap:anywhere; }
.service-platform strong { font-size:13px; line-height:1.3; }
.service-platform small { margin-top:3px; color:#586b8c; font-size:10px; line-height:1.35; }
.deletion-option { display:grid; grid-template-columns:60px minmax(0,1fr); align-items:center; gap:12px; margin-top:10px; padding:12px; border-radius:15px; background:#fff0f7; }
.deletion-option-icon { display:grid; place-items:center; width:60px; height:60px; border-radius:15px; color:#e31c5e; background:#ffe0ee; font-size:30px; font-weight:800; }
.deletion-option h4 { margin:0 0 4px; color:#182344; font-size:15px; line-height:1.3; }
.deletion-option p { margin:0; color:#4b6086; font-size:13px; line-height:1.5; }
.service-disclaimer { display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; align-items:start; margin-top:12px; padding:13px; border-radius:14px; background:#ffebf3; color:#c7154d; }
.service-disclaimer > span { display:grid; place-items:center; width:27px; height:27px; border-radius:50%; background:#e91e63; color:white; font-weight:800; }
.service-disclaimer p { margin:0; font-size:13px; line-height:1.55; }
.service-disclaimer strong { display:inline-block; margin-top:6px; font-weight:700; }
@media (max-width:700px)  {
 .desktop-social-destination .services-section { margin-top:25px; padding:0 1px; }
 .services-heading { margin-bottom:17px; padding:0 6px; }
 .services-heading h2 { font-size:clamp(27px,7vw,35px); letter-spacing:-1px; }
 .services-heading > p:first-of-type { font-size:14px; }
 .services-heading .services-intro { font-size:12px; line-height:1.6; }
 .services-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
 .service-card { padding:17px 14px; border-radius:18px; }
 .service-card-heading { grid-template-columns:54px minmax(0,1fr); gap:12px; margin-bottom:14px; align-items:start; }
 .service-icon { width:54px; height:54px; border-radius:15px; }
 .service-icon svg { width:28px; height:28px; }
 .service-card h3 { font-size:19px; }
 .service-card-heading p { font-size:12px; line-height:1.5; }
 .service-check { width:18px; height:18px; border-radius:6px; font-size:11px; vertical-align:2px; }
 .service-issue-list { gap:5px; }
 .service-issue-list li { min-height:32px; padding:6px 9px; gap:8px; font-size:12px; }
 .service-issue-list li::before { flex-basis:20px; width:20px; height:20px; font-size:12px; }
 .service-platforms { display:flex; flex-direction:column; margin-top:10px; padding:11px; border-radius:14px; }
 .service-platforms h4 { display:block; flex:0 0 auto; margin:0 0 10px; font-size:13px; }
 .service-platform-list { display:grid; flex:0 0 auto; gap:7px; margin:0; }
 .service-platform { gap:7px; padding:8px 7px; border-radius:11px; }
 .service-platform-logo { width:32px; height:32px; flex-basis:32px; }
 .service-platform-logo svg { width:20px; height:20px; }
 .service-platform strong { font-size:11px; }
 .service-platform small { font-size:9px; }
 .deletion-option { grid-template-columns:44px minmax(0,1fr); gap:10px; padding:10px; border-radius:13px; }
 .deletion-option-icon { width:44px; height:44px; border-radius:12px; font-size:24px; }
 .deletion-option h4 { font-size:13px; }
 .deletion-option p,.service-disclaimer p { font-size:11.5px; }
 .service-disclaimer { grid-template-columns:24px minmax(0,1fr); gap:8px; padding:10px; }
 .service-disclaimer > span { width:23px; height:23px; }
}

/* authoritative scenic Bible Verse background.
 Desktop rule is kept visually unchanged. An older mobile SVG declaration was removed
 because its more-specific selector was overriding every later mobile image update. */
html body #daily-bible-verse.daily-verse-card {
  background-image: linear-gradient(90deg, rgba(4,44,98,.18), rgba(4,40,88,.08) 52%, rgba(4,35,80,.10)), url("./verse-lake-photo.jpg?v=AFV263") !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-origin: border-box !important;
  background-clip: border-box !important;
}
@media  (max-width: 600px)  {
  /* Intentionally outranks the legacy compact-intro/main/id selector. */
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    background-repeat: no-repeat !important;
    background-color: #155a9a !important;
  }
}

/* compact Recovery Proofs card on desktop and mobile; prevent tall blank preview area. */
.social-collage > .recovery-proofs-showcase {
  height: auto;
  align-self: start;
  justify-self: stretch;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-preview {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
.social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
  min-width: 0;
}
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase { padding: 14px; }
}

/* mobile-only correction — Recovery Proofs must stay the same height as Customer Feedback. */
@media  (max-width: 600px)  {
  .social-collage { align-items: stretch; }
}

/* mobile Recovery Proofs previews use the larger, framed image style from Customer Feedback. Desktop remains unchanged. */
@media  (max-width: 600px)  {
  .social-collage .recovery-proofs-showcase .recovery-proofs-preview {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    border: 1px solid #d8e2ff !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 3px 12px rgba(30, 55, 110, .09) !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: top center !important;
    transform: none !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item > span {
    inset: auto 0 0 !important;
    padding: 28px 12px 10px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    background: linear-gradient(transparent, rgba(18,31,58,.88)) !important;
    text-align: left !important;
  }
}

/* desktop-only alignment — match Recovery Proofs card height to Customer Feedback. */
@media  (min-width: 601px)  {
  .social-collage {
    align-items: stretch;
  }
  .social-collage > .recovery-proofs-showcase {
    height: 100% !important;
    min-height: 0 !important;
    align-self: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    box-sizing: border-box;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proofs-preview {
    flex: 0 0 auto;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proofs-button {
    margin-top: auto !important;
    flex: 0 0 auto;
  }
}

/* desktop Recovery Proofs previews use portrait cards to match Customer Feedback.
 Mobile rules are intentionally left unchanged. */
@media  (min-width: 761px)  {
  .recovery-proofs-showcase .recovery-proofs-preview {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 12px;
  }
  .recovery-proofs-showcase .recovery-proof-preview-item {
    aspect-ratio: 3 / 5;
    min-height: 0;
    border-radius: 14px;
  }
  .recovery-proofs-showcase .recovery-proof-preview-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .recovery-proofs-showcase .recovery-proof-preview-item > span {
    font-size: 13px;
    padding: 30px 10px 10px;
  }
}

/* desktop fix — use higher-specificity selectors so the portrait
 preview ratio overrides the older 4:3 rule. Mobile styling remains unchanged. */
@media  (min-width: 761px)  {
  .social-collage .recovery-proofs-showcase .recovery-proofs-preview {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 12px !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    aspect-ratio: 3 / 5 !important;
    height: auto !important;
    overflow: hidden !important;
    position: relative !important;
    border-radius: 14px !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center top !important;
  }
}

/* transparent service status panel inspired by the approved mockup. */
.service-status-panel{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr);gap:14px;margin:14px 0 18px;padding:16px;border:1px solid #d5e3ff;border-radius:20px;background:linear-gradient(125deg,rgba(239,247,255,.96),rgba(255,255,255,.94) 48%,rgba(245,239,255,.96));box-shadow:0 10px 28px rgba(61,81,150,.08);color:#19294c}
.service-status-main{min-width:0;padding:3px 7px;display:flex;flex-direction:column;justify-content:center}
.service-status-label{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;color:#087b50;font-size:10px;font-weight:850;letter-spacing:.8px}
.service-status-dot{width:11px;height:11px;flex:0 0 11px;border-radius:50%;background:#13bf70;box-shadow:0 0 0 4px rgba(19,191,112,.13);animation:serviceStatusPulse 2s ease-in-out infinite}
.service-status-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin-left:auto;padding:6px 10px;border:1px solid #a8efd0;border-radius:999px;background:#e7fff3;color:#087b50;font-size:10px;letter-spacing:0;text-transform:none;white-space:nowrap}.service-status-pill .service-status-dot{position:relative;width:7px;height:7px;min-width:7px;flex:0 0 7px;margin:0;border-radius:50%;background:#13bf70;box-shadow:0 0 0 3px rgba(19,191,112,.13);animation:serviceStatusPulse 2s ease-in-out infinite}
.service-status-main h2{margin:0;color:#19294c;font-size:clamp(20px,2.2vw,28px);font-weight:850;line-height:1.15;letter-spacing:-.7px}
.service-status-main h2 span{color:#078957}
.service-status-main>p{margin:6px 0 0;color:#526b96;font-size:12px;line-height:1.5;max-width:360px}
.service-status-details{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;border:1px solid #dce7ff;border-radius:15px;background:rgba(255,255,255,.68);overflow:hidden}
.service-status-detail{display:flex;align-items:center;gap:10px;min-width:0;padding:13px}
.service-status-detail+.service-status-detail{border-left:1px solid #dce7ff}
.service-status-detail-icon{width:37px;height:37px;flex:0 0 37px;display:grid;place-items:center;border-radius:11px;background:#e5efff;color:#2867f6}
.service-status-detail-icon svg{width:23px;height:23px}
.service-status-detail>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.service-status-detail-label{color:#60769b;font-size:10px;line-height:1.3}
.service-status-detail strong{color:#075cf0;font-size:12px;line-height:1.3}
.service-status-detail small{color:#60769b;font-size:10px;line-height:1.35}
.service-benefit-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.service-benefit{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border:1px solid rgba(222,230,249,.9);border-radius:13px;background:rgba(255,255,255,.78)}
.service-benefit-icon{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:#e8f0ff;color:#2867f6}
.service-benefit-icon svg{width:22px;height:22px}
.service-benefit>span:last-child{display:flex;flex-direction:column;gap:3px;min-width:0}
.service-benefit strong{color:#1c2d50;font-size:11px;line-height:1.3}
.service-benefit small{color:#65789b;font-size:10px;line-height:1.35}
@keyframes  serviceStatusPulse {0%,100%{box-shadow:0 0 0 3px rgba(19,191,112,.11)}50%{box-shadow:0 0 0 6px rgba(19,191,112,.05)}}
@media (max-width:850px) {.service-status-panel{grid-template-columns:1fr}.service-status-main{padding:3px 2px 7px}.service-status-details{grid-template-columns:1fr 1fr}}
@media (max-width:560px) {.service-status-panel{gap:10px;margin:12px 0 15px;padding:12px;border-radius:17px}.service-status-main h2{font-size:21px}.service-status-main>p{font-size:11px}.service-status-details{grid-template-columns:1fr}.service-status-detail{padding:10px}.service-status-detail+.service-status-detail{border-left:0;border-top:1px solid #dce7ff}.service-status-detail-icon{width:33px;height:33px;flex-basis:33px}.service-status-detail strong{font-size:12px}.service-benefit-row{gap:6px}.service-benefit{flex-direction:column;align-items:flex-start;gap:7px;padding:9px 8px}.service-benefit-icon{width:31px;height:31px;flex-basis:31px}.service-benefit-icon svg{width:19px;height:19px}.service-benefit strong{font-size:10px}.service-benefit small{font-size:9px}}
@media (prefers-reduced-motion:reduce) {.service-status-dot{animation:none}}

/* restore the WhatsApp Preferred Contact card on mobile only.
 Keep the desktop layout unchanged. */
@media  (max-width: 600px)  {
  html body.home-page main > .compact-intro {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    order: 1 !important;
    margin: 10px 0 12px !important;
  }
  html body.home-page main > #contact.wizard-card.contact-only {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    order: 2 !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  html body.home-page #contact .whatsapp-feature-card {
    display: grid !important;
    gap: 8px 10px !important;
    margin: 0 !important;
    border: 1px solid #d8e4fb !important;
    border-radius: 17px !important;
    background: linear-gradient(135deg, #fff 0%, #f5f8ff 100%) !important;
    box-shadow: 0 7px 20px rgba(36, 99, 212, .08) !important;
    visibility: visible !important;
  }
  html body.home-page #contact .whatsapp-feature-icon,
  html body.home-page #contact .whatsapp-feature-icon svg {
    display: block !important;
    width: 46px !important;
    height: 46px !important;
  }
  html body.home-page #contact .whatsapp-feature-content {
    display: block !important;
  }
  html body.home-page #contact .whatsapp-feature-top {
    align-items: center !important;
    justify-content: space-between !important;
    gap: 5px !important;
    flex-wrap: wrap !important;
  }
  html body.home-page #contact .whatsapp-feature-content h2 {
    display: block !important;
  }
  html body.home-page #contact .whatsapp-feature-content p {
    display: block !important;
  }
  html body.home-page #contact .whatsapp-button {
    display: flex !important;
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  html body.home-page #contact .service-status-panel {
    order: 2 !important;
  }
}

/* tighten the mobile vertical rhythm above the intro, WhatsApp card, and service status.
 Desktop layout remains unchanged. */
@media  (max-width: 600px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    margin-bottom: 10px !important;
  }
  html body.home-page main > .compact-intro {
    margin-top: -7px !important;
    padding-top: 0 !important;
  }
  html body.home-page .compact-intro h1 {
    margin-top: 5px !important;
    margin-bottom: 4px !important;
  }
  html body.home-page .compact-intro p {
    margin-top: 0 !important;
    line-height: 1.35 !important;
  }
  html body.home-page main > #contact.wizard-card.contact-only {
    margin-bottom: 8px !important;
  }

  html body.home-page #contact .service-status-panel {
    margin-bottom: 10px !important;
  }
}

/* reduce excess gap between intro subtitle and WhatsApp preferred-contact card on mobile. */
@media  (max-width: 600px)  {
  html body.home-page main > .compact-intro .eyebrow {
    margin-bottom: 9px !important;
  }
  html body.home-page main > .compact-intro h1,
  html body.home-page #introTitle {
    margin-top: 9px !important;
    margin-bottom: 8px !important;
  }
  html body.home-page main > .compact-intro > p {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* compact WhatsApp contact card on mobile: recommended badge at upper-right,
 with tighter text spacing and no unnecessary gaps inside the content area. */
@media  (max-width: 600px)  {
  html body.home-page #contact .whatsapp-feature-card {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    row-gap: 7px !important;
    align-items: start !important;
    padding: 12px !important;
  }
  html body.home-page #contact .whatsapp-feature-content {
    position: relative !important;
    min-width: 0 !important;
  }
  html body.home-page #contact .whatsapp-feature-top {
    display: block !important;
    position: relative !important;
    min-height: 21px !important;
    padding: 0 0 0 0 !important;
    margin: 0 !important;
  }
  html body.home-page #contact .whatsapp-feature-kicker {
    display: block !important;
    max-width: calc(100% - 100px) !important;
    padding: 2px 0 0 !important;
    margin: 0 !important;
    letter-spacing: .55px !important;
  }
  html body.home-page #contact .whatsapp-recommended {
    display: inline-flex !important;
    position: absolute !important;
    top: -1px !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    font-size: 7px !important;
    line-height: 1.1 !important;
    gap: 3px !important;
    white-space: nowrap !important;
  }
  html body.home-page #contact .whatsapp-recommended span {
    font-size: 12px !important;
    line-height: .8 !important;
  }
  html body.home-page #contact .whatsapp-feature-content h2 {
    margin: 3px 0 3px !important;
    font-size: clamp(15px, 4.2vw, 18px) !important;
    line-height: 1.18 !important;
    letter-spacing: -.3px !important;
  }
  html body.home-page #contact .whatsapp-feature-content p {
    margin: 0 !important;
  }
  html body.home-page #contact .whatsapp-button {
    margin-top: 1px !important;
  }
}
@media  (max-width: 360px)  {
  html body.home-page #contact .whatsapp-feature-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    column-gap: 9px !important;
    padding: 10px !important;
  }
  html body.home-page #contact .whatsapp-recommended {
    font-size: 6.5px !important;
    padding: 4px 5px !important;
  }
  html body.home-page #contact .whatsapp-feature-content h2 {
    font-size: 15px !important;
  }
}

/* keep the smaller WhatsApp mark centered inside its existing green tile on mobile. */
@media  (max-width: 600px)  {
  html body.home-page #contact .whatsapp-feature-icon {
    display: grid !important;
    place-items: center !important;
    position: relative !important;
  }
  html body.home-page #contact .whatsapp-feature-icon > svg {
    display: block !important;
    position: static !important;
    inset: auto !important;
    place-self: center !important;
    margin: 0 !important;
    transform: none !important;
    width: 25px !important;
    height: 25px !important;
    max-width: 25px !important;
    max-height: 25px !important;
  }
}

/* remove social-card descriptions and let the real profile previews fill the freed space. */
.social-profile-preview {
  display: block;
  width: 100%;
  aspect-ratio: auto;
  flex: 0 0 auto;
  min-width: 0;
  min-height: 0;
  margin: 0 0 12px;
  overflow: hidden;
  border: 1px solid rgba(110, 139, 190, .42);
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 5px 16px rgba(13, 25, 48, .12);
}
.social-profile-preview img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 390px;
  object-fit: contain;
  object-position: center top;
}
.tiktok-profile-preview { border-color: rgba(254, 44, 85, .38); }
.facebook-page-preview { border-color: rgba(24, 119, 242, .42); }
@media  (max-width: 600px)  {
  .social-profile-preview {
    flex: 0 0 auto;
    min-height: 0;
    margin-bottom: 9px;
    border-radius: 9px;
  }
  .social-profile-preview img { max-height: 360px; }
}

/* reduce only the Customer Feedback screenshot height.
 Keep the surrounding cards/grid and Recovery Proofs images untouched. */
.social-feedback-card .reviews-grid-featured .review-proof-image {
  height: clamp(220px, 27vw, 300px) !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  background: #171b24 !important;
}
.social-feedback-card .reviews-grid-featured .review-proof-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
}
@media  (max-width: 600px)  {
  .social-feedback-card .reviews-grid-featured .review-proof-image {
    height: clamp(240px, 78vw, 300px) !important;
  }
}

/* match the Recovery Proofs button to the Customer Feedback button,
 and let both proof previews expand to use the available card space. */
.social-collage > .recovery-proofs-showcase {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  box-sizing: border-box;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-preview {
  width: 100% !important;
}
.social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
  display: block !important;
  position: relative !important;
  height: auto !important;
  width: 100% !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
}
.social-collage .recovery-proofs-showcase .recovery-proof-preview-item img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-button {
  min-height: 48px !important;
  
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 48px !important;
  margin-top: auto !important;
  padding: 8px 12px !important;
  line-height: 1.25 !important;
}

/* match social brand marks to the compact Recovery Proofs icon. */


/* tighten the extra top gap before the social collage on mobile.
 Keep card dimensions, logos, previews, and buttons unchanged. */
@media  (max-width: 600px)  {
  .social-collage {
    margin-top: 8px !important;
  }
}

/* nudge TikTok and Facebook logos up 2px for visual alignment with Recovery Proofs. */


/* Account Deletion uses the shared .service-platforms spacing. */
.deletion-service-platforms { margin-top: 12px; }

/* make only the “Offline” word red when outside published hours. */
.service-status-main h2 #serviceStatusHeadline.is-offline{color:#dc2626!important;}
.service-status-dot.is-offline{background:#dc2626!important;box-shadow:0 0 0 4px rgba(220,38,38,.16)!important;animation-name:serviceStatusPulseOffline!important;}
@keyframes  serviceStatusPulseOffline {0%,100%{box-shadow:0 0 0 3px rgba(220,38,38,.12)}50%{box-shadow:0 0 0 6px rgba(220,38,38,.05)}}
.service-status-pill-closed{border-color:#fecaca!important;background:#fef2f2!important;color:#b91c1c!important;}

/* align Recovery Proofs and Customer Feedback actions, and clarify preview spacing. */
.social-collage .recovery-proofs-showcase .recovery-proofs-button,
.social-collage > .social-feedback-card .social-feedback-view-all {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: auto !important;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-button {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  white-space: nowrap !important;
  font-size: 13px !important;
  text-align: center !important;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-button > span:first-child {
  display: inline !important;
  white-space: nowrap !important;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-button > span:last-child {
  display: inline !important;
  flex: 0 0 auto !important;
}
.social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
  border-radius: 18px !important;
}

/* compact the Recovery Proofs / Customer Feedback buttons to match the social-link buttons, and let proof images fill the freed space. */
.social-collage .recovery-proofs-showcase .recovery-proofs-button,
.social-collage > .social-feedback-card .social-feedback-view-all {
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  flex: 0 0 44px !important;
  padding: 7px 10px !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  line-height: 1.2 !important;
}
.social-collage .recovery-proofs-showcase .recovery-proofs-preview {
  display: flex !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 12px 0 12px !important;
}
.social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
  flex: 1 1 0 !important;
  min-height: 0 !important;
}
@media  (max-width: 600px)  {
  
  .social-collage .recovery-proofs-showcase .recovery-proofs-preview {
    gap: 10px !important;
    margin: 10px 0 10px !important;
  }
  .social-collage .recovery-proofs-showcase .recovery-proof-preview-item {
    flex: 1 1 0 !important;
    min-height: 0 !important;
  }
}

/* match the Customer Feedback heading/icon to the other social cards. */
.social-collage > .social-feedback-card {
  background: linear-gradient(145deg, #fbfaff 0%, #f1efff 100%) !important;
  border-color: #e1dcff !important;
}
.social-collage > .social-feedback-card .windows-feedback-content {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
/* Keep the last agreed fine-tuning: review preview 2px shorter at each edge (4px total), title 2px lower. */


/* shorten the Customer Feedback image by another 2px at the top and 2px at the bottom; leave Recovery Proofs images and buttons unchanged. */
.social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
  height: calc(clamp(220px, 27vw, 300px) - 24px) !important;
  min-height: 0 !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
}

/* Fine-tune the mobile Customer Feedback image frame without changing card width,
 Recovery Proofs previews, or buttons. */
@media  (max-width: 600px)  {
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    height: calc(clamp(240px, 78vw, 300px) - 53px) !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    box-sizing: border-box !important;
  }
}

/* Keep desktop Recovery Proofs and Customer Feedback cards aligned to the same height. */
@media  (min-width: 601px)  {
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    height: 545.34px !important;
    min-height: 545.34px !important;
    max-height: 545.34px !important;
    align-self: start !important;
    box-sizing: border-box !important;
  }
  .social-collage > .social-feedback-card > .windows-feedback-content {
    height: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
    box-sizing: border-box !important;
  }
}

/* reduce the Customer Feedback icon tile on desktop only; preserve mobile sizing. */


/* slightly raise the Customer Feedback star tile and heading on desktop only. */


/* desktop-only Customer Feedback image fit and button separation.
 Keep the card dimensions and mobile layout unchanged. */
@media  (min-width: 601px)  {
  .social-collage > .social-feedback-card .reviews-grid-featured {
    margin-bottom: 8px !important;
    min-height: 0 !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-card {
    height: 100% !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
  }
  .social-collage > .social-feedback-card .social-feedback-view-all {
    margin-top: 8px !important;
    flex: 0 0 44px !important;
  }
}

/* desktop showcase images use clean matching gradients instead of blurred/white side fills.
 Keep the original screenshots crisp and centered; mobile styling remains unchanged. */
@media  (min-width: 601px)  {
  .social-collage > .tiktok-showcase,
  .social-collage > .facebook-showcase {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
  }
  .social-collage > .tiktok-showcase .social-profile-preview,
  .social-collage > .facebook-showcase .social-profile-preview {
    position: relative !important;
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: stretch !important;
    justify-content: center !important;
    width: 100% !important;
    height: clamp(360px, 34vw, 455px) !important;
    min-height: 360px !important;
    max-height: 455px !important;
    box-sizing: border-box !important;
    margin: 0 0 12px !important;
    overflow: hidden !important;
    border-radius: 13px !important;
    isolation: isolate !important;
    box-shadow: 0 5px 16px rgba(13, 25, 48, .10) !important;
  }
  .social-collage > .tiktok-showcase .social-profile-preview {
    background: linear-gradient(135deg, #fbe2ff 0%, #e9baff 30%, #b99aff 66%, #f5d7ff 100%) !important;
    border-color: rgba(220, 123, 255, .42) !important;
  }
  .social-collage > .facebook-showcase .social-profile-preview {
    background: linear-gradient(135deg, #d8f1ff 0%, #a8dcff 35%, #75bfff 68%, #d7f1ff 100%) !important;
    border-color: rgba(57, 151, 255, .42) !important;
  }
  .social-collage > .tiktok-showcase .social-profile-preview img,
  .social-collage > .facebook-showcase .social-profile-preview img {
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: transparent !important;
  }
}

/* include the Customer Feedback portrait preview in the clean gradient treatment.
 Replace the plain pale side fill with a soft lavender-to-blue gradient; keep the
 original review screenshot sharp, centered, and at its natural portrait ratio. */
@media  (min-width: 601px)  {
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    background: linear-gradient(135deg,
      #fce7ff 0%,
      #f2e8ff 24%,
      #e4edff 55%,
      #e4f5ff 78%,
      #f8eaff 100%) !important;
    border: 1px solid rgba(151, 143, 255, .32) !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    background: transparent !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* match the requested desktop card dimensions exactly.
 Only applies on wide desktop layouts; tablet/mobile layout stays fluid. */
@media  (min-width: 1200px)  {
  .social-collage {
    grid-template-columns: repeat(2, 611.3px) !important;
    width: max-content !important;
    max-width: 100% !important;
    justify-content: start !important;
  }
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    width: 611.3px !important;
    min-width: 611.3px !important;
    max-width: 611.3px !important;
  }
}

/* align Recovery Proofs and Customer Feedback bottom controls on desktop.
 Keep the existing 611.3 x 543.33 card dimensions and mobile styles unchanged. */
@media  (min-width: 1200px)  {
  .social-collage {
    align-items: stretch !important;
  }
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proofs-button {
    margin-top: auto !important;
    flex: 0 0 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
  }
  .social-collage > .social-feedback-card > .windows-feedback-content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
    padding-bottom: 16px !important;
    box-sizing: border-box !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    margin-bottom: 8px !important;
  }
  .social-collage > .social-feedback-card .social-feedback-view-all {
    margin-top: auto !important;
    flex: 0 0 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
  }
}

/* add another 2px to the desktop-only Recovery Proofs bottom-button adjustment. */
@media  (min-width: 1200px)  {
  .social-collage > .recovery-proofs-showcase .recovery-proofs-button {
    transform: translateY(8px) !important;
  }
}

/* Original full-color social preview images are used on desktop and mobile. */
/* authoritative mobile alignment override.
 Keep both preview-to-button gaps exactly 6px, regardless of older CSS rules. */
@media  (max-width: 600px)  {
  .social-collage > .social-feedback-card > .windows-feedback-content {
    display: flex !important;
    flex-direction: column !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured {
    margin: 0 0 6px !important;
    flex: 0 0 auto !important;
  }
  
}

/* restore mobile Recovery Proofs thumbnails.
 Earlier flex rules allowed the preview items to collapse to zero height while the
 images had height:100%. Give the preview area the available card space, let both
 images share it, and keep exactly 6px between the final preview and its button. */
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 100% !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proofs-preview {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-height: 160px !important;
    width: 100% !important;
    margin: 12px 0 6px !important;
    overflow: visible !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item {
    display: block !important;
    position: relative !important;
    flex: 1 1 0 !important;
    min-height: 0 !important;
    height: auto !important;
    width: 100% !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    border: 1px solid #d8e2ff !important;
    border-radius: 12px !important;
    background: #f5f7ff !important;
    box-sizing: border-box !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center center !important;
    transform: none !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item > span {
    position: absolute !important;
    inset: auto 0 0 !important;
    padding: 20px 8px 7px !important;
    font-size: 10px !important;
    line-height: 1.25 !important;
    background: linear-gradient(transparent, rgba(18,31,58,.84)) !important;
    text-align: left !important;
  }
  
}

/* align the Facebook warning box with the TikTok warning box. */


/* discourage casual image dragging in proof/review previews. */
.recovery-proofs-preview img,
.reviews-grid-featured img,
.proof-gallery img,
.review-card img {
  -webkit-user-drag: none;
  user-select: none;
}

/* deter casual saving of proof/review preview images on desktop and mobile. */
.recovery-proofs-preview img,
.recovery-proof-preview-item img,
.reviews-grid-featured img,
.review-proof-image img,
.proof-gallery img,
.proof-image-link img,
.proof-card img,
.review-card img,
.review-proof-card img {
  -webkit-user-drag: none !important;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  
}

/* discourage casual saving/dragging of TikTok and Facebook profile previews. */
.social-profile-preview img,
.tiktok-profile-preview img,
.facebook-page-preview img {
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

/* no native image drag/callout in full-size viewer or protected previews. */
.review-lightbox,
.review-lightbox-image,
.social-profile-preview img,
.tiktok-profile-preview img,
.facebook-page-preview img,
.recovery-proofs-preview img,
.recovery-proof-preview-item img,
.reviews-grid-featured img,
.review-proof-image img,
.proof-gallery img,
.proof-image-link img,
.proof-card img,
.review-card img,
.review-proof-card img {
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  user-select: none;
  -webkit-user-select: none;
}
.review-lightbox-image::after {
  content: "OFFICIAL ARISU • DO NOT REUSE";
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%, -50%) rotate(-18deg);
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.5);
  border-radius: 6px;
  background: rgba(10,18,35,.32);
  color: rgba(255,255,255,.78);
  font-size: clamp(12px, 2vw, 20px);
  font-weight: 800; letter-spacing: .08em; text-align: center;
  pointer-events: none; white-space: nowrap;
}
.review-lightbox-image { position: relative; overflow: hidden; }

/* gently improve small-text readability on mobile without changing layout dimensions. */
@media  (max-width: 600px)  {
  .service-status-label { font-size: 11px; }
  .service-status-pill { font-size: 11px; }
  .service-status-main > p { font-size: 13px; line-height: 1.5; }
  .service-status-detail-label { font-size: 11px; }
  .service-status-detail strong { font-size: 13px; }
  .service-status-detail small { font-size: 11px; line-height: 1.4; }
  .service-benefit strong { font-size: 12px; line-height: 1.35; }
  .service-benefit small { font-size: 11px; line-height: 1.4; }
  .whatsapp-feature-kicker { font-size: 11px; }
  .whatsapp-recommended { font-size: 10px; }
  .whatsapp-feature-content > p { font-size: 13px; line-height: 1.45; }
}

/* reduce desktop scroll hitching without removing reveal motion.
 Keep only opacity + a small Y translation; avoid a permanent compositing layer for every card. */
.arc-scroll-reveal { opacity: 1; transform: none; }
.arc-scroll-reveal-enabled .arc-scroll-reveal {
  opacity: 0;
  transform: translateY(calc(12px + var(--arc-reveal-offset, 0px)));
  transition-property: opacity, transform !important;
  transition-duration: 420ms !important;
  transition-timing-function: cubic-bezier(.2, .7, .2, 1) !important;
  transition-delay: var(--arc-reveal-delay, 0ms) !important;
  will-change: auto;
  backface-visibility: visible;
}
.arc-scroll-reveal-enabled .arc-scroll-reveal.arc-scroll-reveal-visible {
  opacity: 1;
  transform: translateY(var(--arc-reveal-offset, 0px));
}
@media  (max-width: 600px)  {
  .arc-scroll-reveal-enabled .arc-scroll-reveal {
    transform: translateY(calc(11px + var(--arc-reveal-offset, 0px)));
    transition-duration: 460ms !important;
  }
}
/* Explicitly preserve the requested reveal even when the OS prefers reduced motion. */
@media  (prefers-reduced-motion: reduce)  {
  .arc-scroll-reveal-enabled .arc-scroll-reveal,
  .arc-scroll-reveal-enabled .arc-scroll-reveal:not(.arc-scroll-reveal-visible),
  .arc-scroll-reveal-enabled .arc-scroll-reveal.arc-scroll-reveal-visible {
    transition-property: opacity, transform !important;
    transition-duration: 420ms !important;
    transition-timing-function: cubic-bezier(.2, .7, .2, 1) !important;
    transition-delay: var(--arc-reveal-delay, 0ms) !important;
  }
}
@media  (prefers-reduced-motion: reduce) and (max-width: 600px)  {
  .arc-scroll-reveal-enabled .arc-scroll-reveal,
  .arc-scroll-reveal-enabled .arc-scroll-reveal:not(.arc-scroll-reveal-visible),
  .arc-scroll-reveal-enabled .arc-scroll-reveal.arc-scroll-reveal-visible {
    transition-duration: 460ms !important;
  }
}

/* Scroll-performance tuning: avoid a universal selector over every page element.
   Pause only the floating WhatsApp decoration and reduce sticky-header blur while
   the user is actively scrolling; scroll-reveal transitions remain unchanged. */
@media  (max-width: 760px)  {
  html.arc-is-scrolling #floatingWhatsApp {
    animation-play-state: paused !important;
  }

  .topbar {
    backdrop-filter: saturate(135%) blur(10px);
    -webkit-backdrop-filter: saturate(135%) blur(10px);
  }

  html.arc-is-scrolling .topbar {
    backdrop-filter: saturate(115%) blur(3px);
    -webkit-backdrop-filter: saturate(115%) blur(3px);
  }
}

/* Scam Awareness card styling. Its vertical offset is controlled by the single
   authoritative rule at the end of this stylesheet; this transform consumes that variable
   when scroll-reveal is not active, avoiding a second hard-coded position. */
.scam-awareness-card {
  --scam-pink: #d91f50;
  --scam-ink: #79243a;
  position: relative;
  transform: translateY(var(--arc-reveal-offset, 0px));
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  max-width: 1080px;
  box-sizing: border-box;
  margin: 12px auto 8px;
  padding: 15px 18px;
  border: 1px solid rgba(225, 65, 105, .25);
  border-radius: 18px;
  background: linear-gradient(112deg, #fff7fa 0%, #fff 58%, #fff0f5 100%);
  box-shadow: 0 8px 24px rgba(190, 64, 104, .08), inset 0 1px 0 rgba(255,255,255,.9);
  color: var(--scam-ink);
}
.scam-awareness-icon {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  color: var(--scam-pink);
  background: #ffe3ec;
  border-radius: 13px;
}
.scam-awareness-icon svg { display: block; width: 25px; height: 25px; }
.scam-awareness-content { flex: 1 1 auto; min-width: 0; }
.scam-awareness-content h2 {
  margin: 0 0 4px;
  color: #a51f43;
  font-size: clamp(13px, 1.35vw, 16px);
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: .035em;
}
.scam-awareness-content p {
  margin: 0;
  color: #69404b;
  font-size: clamp(12px, 1.15vw, 14px);
  line-height: 1.5;
}
.scam-awareness-tagline {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 8px;
  padding: 5px 11px;
  border-radius: 999px;
  background: #ffe5ed;
  color: #c21e4b;
  font-size: 12px;
  line-height: 1.25;
  font-weight: 800;
}
.scam-awareness-tagline span {
  display: inline-grid;
  place-items: center;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #d91f50;
  color: #fff;
  font-size: 12px;
}
.scam-awareness-arrow {
  flex: 0 0 auto;
  color: #e34870;
  font-size: 30px;
  line-height: 1;
  padding-left: 3px;
}
@media  (max-width: 600px)  {
  .scam-awareness-card {
    width: 100%;
    gap: 8px;
    margin: 6px auto 6px;
    padding: 10px 10px;
    border-radius: 15px;
  }
  .scam-awareness-icon {
    flex-basis: 36px;
    width: 36px;
    height: 36px;
    border-radius: 11px;
  }
  .scam-awareness-icon svg { width: 22px; height: 22px; }
  .scam-awareness-content h2 { font-size: 12px; letter-spacing: .015em; line-height: 1.25; margin-bottom: 2px; }
  .scam-awareness-content p { font-size: 11.5px; line-height: 1.38; }
  .scam-awareness-tagline { margin-top: 4px; padding: 4px 8px; font-size: 11px; }
  .scam-awareness-tagline span { width: 15px; height: 15px; font-size: 10px; }
  .scam-awareness-arrow { font-size: 25px; }
}
@media  (max-width: 360px)  {
  .scam-awareness-card { width: 100%; padding: 10px; gap: 8px; }
  .scam-awareness-icon { flex-basis: 32px; width: 32px; height: 32px; }
  .scam-awareness-content h2 { font-size: 11px; }
  .scam-awareness-content p { font-size: 11px; }
  .scam-awareness-arrow { display: none; }
}

/* reduce wasted top space before the scam reminder/social section. */
body.home-page .desktop-social-destination {
  margin-top: -18px !important;
}
@media  (max-width: 600px)  {
  body.home-page .desktop-social-destination {
    margin-top: -24px !important;
  }
}

/* stronger visibility and +2px font size for the social-media divider. */


/* tighten spacing before Services and strengthen the MY SERVICES label. */
.section-kicker {
  color: #315fe8 !important;
  font-size: calc(1em + 2px) !important;
  font-weight: 900 !important;
  letter-spacing: 1.6px !important;
  text-shadow: 0 1px 0 rgba(255,255,255,0.95);
}
/* Keep the compact baseline, but restore a real desktop gap after the social collage.
   The ID-qualified desktop rule wins over the legacy #services margin reset without
   changing the mobile/tablet rules or the heading's internal offset. */
body.home-page .services-section,
body.home-page #services {
  margin-top: 0 !important;
}
@media (min-width: 900px) {
  html body.home-page #desktopSocialDestination > #services {
    margin-top: 18px !important;
  }
}
@media  (max-width: 600px)  {
  .section-kicker {
    font-size: 15px !important;
    letter-spacing: 1.4px !important;
  }
  body.home-page .services-section,
  body.home-page #services {
    padding-top: 8px !important;
  }
}

/* prioritize readability of the About This Website section. */
body.home-page .about-card .section-kicker {
  color: #315eea !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: 1.7px !important;
  line-height: 1.45 !important;
}
body.home-page .about-card h2.about-brand-title {
  color: #1d2c50 !important;
  font-size: clamp(25px, 3.4vw, 32px) !important;
  font-weight: 850 !important;
  line-height: 1.28 !important;
  letter-spacing: -0.5px !important;
}
body.home-page .about-card p {
  color: #3f4f6b !important;
  font-size: 17px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}
body.home-page .about-card .independent-note {
  color: #293f68 !important;
  font-size: 16.5px !important;
  font-weight: 600 !important;
  line-height: 1.65 !important;
}
@media  (max-width: 600px)  {
  body.home-page .about-card .section-kicker {
    font-size: 12.5px !important;
    letter-spacing: 1.35px !important;
    line-height: 1.45 !important;
  }
  body.home-page .about-card h2.about-brand-title {
    font-size: 21px !important;
    line-height: 1.3 !important;
    letter-spacing: -0.35px !important;
  }
  body.home-page .about-card p {
    color: #3b4b66 !important;
    font-size: 14.5px !important;
    line-height: 1.65 !important;
    font-weight: 500 !important;
  }
  body.home-page .about-card .independent-note {
    color: #293f68 !important;
    font-size: 14.5px !important;
    line-height: 1.6 !important;
    font-weight: 600 !important;
  }
}

/* tighten mobile header alignment and the space above the intro heading. */
@media  (max-width: 600px)  {
  body .topbar {
    padding: 8px 12px 6px !important;
    row-gap: 2px !important;
    border-bottom: 1px solid rgba(205, 216, 233, .9) !important;
  }
  body .topbar > .brand {
    justify-self: start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }
  body .topbar > .header-meta > .privacy-link {
    min-height: 35px !important;
  }
  body .topbar > .header-meta > .webtools-header-link,
  body .topbar > .header-meta > .proofs-header-link {
    min-height: 38px !important;
  }
  body main {
    padding-top: 0 !important;
  }
  body .daily-verse-card {
    margin-bottom: 4px !important;
  }
  body .compact-intro {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  body .compact-intro h1 {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
  }
}

/* Mobile Service Status compact spacing and internal vertical rhythm.
   Combined adjacent rules without changing declaration order or values; desktop remains unchanged. */
@media  (max-width: 600px)  {
  html body.home-page #serviceStatus.service-status-panel {
    gap: 6px !important;
    padding: 8px !important;
  }
  html body.home-page #serviceStatus .service-status-label {
    gap: 6px !important;
  }
  html body.home-page #serviceStatus .service-status-detail {
    padding: 8px !important;
  }
  html body.home-page #serviceStatus.service-status-panel {
    padding-top: 6px !important;
    padding-bottom: 7px !important;
    row-gap: 5px !important;
  }
  html body.home-page #serviceStatus .service-status-main {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  html body.home-page #serviceStatus .service-status-label {
    margin-top: 0 !important;
    margin-bottom: 3px !important;
    line-height: 1.2 !important;
  }
  html body.home-page #serviceStatus .service-status-main h2 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.12 !important;
  }
  html body.home-page #serviceStatus .service-status-main > p {
    margin-top: 3px !important;
    margin-bottom: 0 !important;
    line-height: 1.38 !important;
  }
  html body.home-page #serviceStatus .service-status-details {
    margin-top: 1px !important;
  }
  html body.home-page #serviceStatus .service-status-detail {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    gap: 7px !important;
  }
  html body.home-page #serviceStatus .service-status-detail > div {
    gap: 2px !important;
  }
  html body.home-page #serviceStatus .service-status-detail-label,
  html body.home-page #serviceStatus .service-status-detail strong,
  html body.home-page #serviceStatus .service-status-detail small {
    line-height: 1.25 !important;
  }
  html body.home-page #serviceStatus .service-benefit-row {
    margin-top: 0 !important;
    gap: 5px !important;
  }
  html body.home-page #serviceStatus .service-benefit {
    padding: 6px !important;
    gap: 4px !important;
  }
}

/* reuse the MY SERVICES gradient divider above the Why Choose Arisu heading. */
html body.home-page .why-arisu-section .why-arisu-heading-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 420px);
  height: 12px;
  margin: 0 auto 9px;
  position: relative;
}
html body.home-page .why-arisu-section .why-arisu-heading-divider::before,
html body.home-page .why-arisu-section .why-arisu-heading-divider::after {
  content: "";
  display: block;
  flex: 1 1 auto;
  height: 2px;
  border-radius: 999px;
}
html body.home-page .why-arisu-section .why-arisu-heading-divider::before {
  background: linear-gradient(90deg, transparent 0%, #b9d7ff 100%);
}
html body.home-page .why-arisu-section .why-arisu-heading-divider::after {
  background: linear-gradient(90deg, #5288ff 0%, transparent 100%);
}
html body.home-page .why-arisu-section .why-arisu-heading-divider span {
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  border-radius: 50%;
  background: #39bdf8;
  box-shadow: 0 0 8px rgba(57, 189, 248, .3);
}

/* Why Choose Arisu — */
.why-arisu-section{margin-top:clamp(6px,calc(3vw - 16px),20px)}
.why-arisu-card{position:relative;overflow:hidden;padding:clamp(20px,3.2vw,38px);border:1px solid rgba(63,139,255,.5);border-radius:24px;background:radial-gradient(ellipse at 12% 0%,rgba(63,130,255,.13),transparent 42%),linear-gradient(145deg,#07152b 0%,#0b1b33 58%,#081326 100%);box-shadow:0 12px 34px rgba(18,57,110,.13),inset 0 1px 0 rgba(255,255,255,.035);color:#f4f8ff}
.why-arisu-heading{margin:0 auto 22px;text-align:center;max-width:760px}.why-arisu-heading .section-kicker{color:#78b7ff;letter-spacing:.17em}.why-arisu-heading h2{color:#f7faff;margin:8px 0;font-size:clamp(1.7rem,3.5vw,2.65rem);line-height:1.12}.why-arisu-heading h2 span{color:#58a4ff}.why-arisu-heading p{color:#c1d0e6;margin:0;font-size:clamp(.92rem,1.5vw,1.05rem)}
.why-arisu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.why-arisu-item{display:flex;align-items:flex-start;gap:14px;padding:18px;border:1px solid rgba(104,157,221,.23);border-radius:17px;background:rgba(4,17,36,.55);min-width:0}.why-arisu-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:50%;color:#7dbbff;background:radial-gradient(circle at 35% 25%,rgba(43,133,255,.42),rgba(14,49,91,.8));box-shadow:0 0 20px rgba(30,117,255,.12)}.why-arisu-icon svg{width:25px;height:25px}.why-arisu-item strong,.why-arisu-item small{display:block}.why-arisu-item strong{color:#f5f8ff;font-size:1rem;line-height:1.35;margin:1px 0 5px}.why-arisu-item small{color:#c0cee2;font-size:.88rem;line-height:1.55}.why-arisu-note{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:13px;padding:12px 15px;border:1px solid rgba(49,153,229,.35);border-radius:14px;background:rgba(1,28,48,.56);text-align:center}.why-arisu-note>span{display:grid;place-items:center;width:23px;height:23px;flex:0 0 23px;border-radius:50%;background:#20b7ed;color:#06213b;font-weight:800}.why-arisu-note p{margin:0}.why-arisu-note strong,.why-arisu-note small{display:block}.why-arisu-note strong{font-size:.94rem;color:#f6faff}.why-arisu-note small{margin-top:3px;color:#b9cbe0;font-size:.77rem;line-height:1.45}
@media (max-width:640px) {.why-arisu-section{margin-top:4px}.why-arisu-card{padding:19px 14px;border-radius:19px}.why-arisu-heading{margin-bottom:18px}.why-arisu-heading h2{font-size:1.75rem}.why-arisu-grid{grid-template-columns:1fr;gap:9px}.why-arisu-item{padding:13px;gap:12px;border-radius:14px}.why-arisu-icon{width:42px;height:42px;flex-basis:42px}.why-arisu-item strong{font-size:.94rem}.why-arisu-item small{font-size:.82rem;line-height:1.45}.why-arisu-note{align-items:flex-start;text-align:left;padding:11px}.why-arisu-note small{font-size:.73rem}}

/* Account recovery experience + Facebook Page milestone */
.why-history-card{max-width:820px;margin:0 auto 22px;padding:clamp(20px,3vw,30px);border:1px solid rgba(104,157,221,.24);border-radius:20px;background:linear-gradient(145deg,rgba(4,17,36,.82),rgba(8,28,53,.72));box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.why-history-row{display:flex;align-items:center;gap:16px;min-width:0}
.why-history-icon{display:grid;place-items:center;flex:0 0 60px;width:60px;height:60px;border-radius:16px;background:rgba(39,116,255,.16);color:#78b7ff}
.why-history-icon svg{width:28px;height:28px}.why-history-copy{min-width:0;display:block}
.why-history-kicker{display:block;color:#91a8c6;font-size:.78rem;font-weight:650;letter-spacing:.055em;line-height:1.4;margin-bottom:5px}
.why-history-title{display:block;color:#f7faff;font-size:clamp(1.4rem,3vw,2rem);font-weight:750;line-height:1.2}
.why-history-copy p{margin:7px 0 0;color:#c0cee2;font-size:clamp(.92rem,1.7vw,1.04rem);line-height:1.5}
.why-history-divider{height:1px;margin:22px 0;background:rgba(164,190,222,.17)}
.why-history-page-link{text-decoration:none;border-radius:12px;transition:background .2s ease}
.why-history-page-link:hover,.why-history-page-link:focus-visible{background:rgba(79,147,235,.09);outline:2px solid rgba(120,183,255,.45);outline-offset:7px}
.why-history-facebook-icon{background:rgba(39,116,255,.16)}.why-history-facebook-icon svg{width:27px;height:27px}
.why-history-page-title{font-size:clamp(1.2rem,2.5vw,1.65rem)}.why-history-page-title span{display:inline-block;margin-left:4px;color:#78b7ff;font-size:.78em}
.why-history-footnote{margin:20px 0 0;color:#c0cee2;font-size:.95rem;line-height:1.65}
@media (max-width:640px) {.why-history-card{padding:20px 16px;margin-bottom:18px;border-radius:17px}.why-history-row{gap:13px;align-items:flex-start}.why-history-icon{width:50px;height:50px;flex-basis:50px;border-radius:14px}.why-history-icon svg{width:25px;height:25px}.why-history-kicker{font-size:.7rem}.why-history-title{font-size:1.65rem}.why-history-copy p{font-size:.93rem;line-height:1.5}.why-history-divider{margin:20px 0}.why-history-page-title{font-size:1.25rem}.why-history-footnote{margin-top:17px;font-size:.9rem;line-height:1.55}}

/* Option 6: Premium Light Gradient for Why Choose Arisu */
.why-arisu-section .why-arisu-card{
  isolation:isolate;
  color:#142344;
  border:1px solid rgba(107,174,255,.42);
  background:
    radial-gradient(ellipse at 4% 3%,rgba(91,215,255,.22),transparent 34%),
    radial-gradient(ellipse at 96% 15%,rgba(171,151,255,.22),transparent 36%),
    linear-gradient(135deg,#f9fdff 0%,#edf7ff 48%,#f7f3ff 100%);
  box-shadow:0 14px 38px rgba(47,112,190,.13),inset 0 1px 0 rgba(255,255,255,.95);
}
.why-arisu-section .why-arisu-card::before,
.why-arisu-section .why-arisu-card::after{
  content:"";position:absolute;z-index:-1;pointer-events:none;border-radius:50%;filter:blur(1px);
}
.why-arisu-section .why-arisu-card::before{
  width:340px;height:210px;right:-115px;top:-110px;
  background:linear-gradient(135deg,rgba(57,201,255,.2),rgba(104,110,255,.1),rgba(205,155,255,.13));
  transform:rotate(-22deg);
}
.why-arisu-section .why-arisu-card::after{
  width:280px;height:170px;left:-135px;bottom:-95px;
  background:linear-gradient(135deg,rgba(0,207,224,.15),rgba(82,154,255,.12),rgba(181,143,255,.12));
}
.why-arisu-section .why-arisu-heading .section-kicker{color:#1768db}
.why-arisu-section .why-arisu-heading h2{color:#101a3b}
.why-arisu-section .why-arisu-heading h2 span{color:#0879f9}
.why-arisu-section .why-arisu-heading p{color:#435778}
.why-arisu-section .why-history-card{
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.96);
  background:linear-gradient(135deg,rgba(255,255,255,.91) 0%,rgba(239,248,255,.94) 52%,rgba(247,241,255,.93) 100%);
  box-shadow:0 9px 26px rgba(52,118,196,.10),inset 0 1px 0 rgba(255,255,255,.98);
}
.why-arisu-section .why-history-card::before{
  content:"";position:absolute;pointer-events:none;right:-42px;bottom:-82px;width:260px;height:150px;
  border-radius:50%;transform:rotate(-15deg);
  background:linear-gradient(135deg,rgba(0,205,232,.17),rgba(48,142,255,.13),rgba(173,133,255,.18));
}
.why-arisu-section .why-history-row,
.why-arisu-section .why-history-footnote{position:relative;z-index:1}
.why-arisu-section .why-history-icon{
  background:linear-gradient(145deg,#29d8f4 0%,#087cff 62%,#6258f5 100%);
  color:#fff;box-shadow:0 8px 20px rgba(28,126,244,.19);
}
.why-arisu-section .why-history-kicker{color:#1768c8}
.why-arisu-section .why-history-title{color:#111b3b}
.why-arisu-section .why-history-copy p,
.why-arisu-section .why-history-footnote{color:#435879}
.why-arisu-section .why-history-divider{background:linear-gradient(90deg,rgba(70,155,239,.22),rgba(155,137,238,.2))}
.why-arisu-section .why-history-page-link:hover,
.why-arisu-section .why-history-page-link:focus-visible{background:rgba(68,151,255,.07);outline-color:rgba(54,137,244,.42)}
.why-arisu-section .why-arisu-item{
  border:1px solid rgba(255,255,255,.96);
  background:linear-gradient(110deg,rgba(255,255,255,.9),rgba(244,249,255,.93) 62%,rgba(250,246,255,.92));
  box-shadow:0 7px 20px rgba(48,107,174,.075),inset 0 1px 0 rgba(255,255,255,.98);
}
.why-arisu-section .why-arisu-item strong{color:#111b3b}
.why-arisu-section .why-arisu-item small{color:#465a7b}
.why-arisu-section .why-arisu-icon{
  color:#fff;background:linear-gradient(145deg,#28d7f1,#087dff 68%,#6257f3);
  box-shadow:0 7px 18px rgba(44,127,236,.17);
}
@media (max-width:640px) {
  .why-arisu-section .why-arisu-card{background:radial-gradient(ellipse at 3% 0%,rgba(91,215,255,.18),transparent 34%),radial-gradient(ellipse at 100% 18%,rgba(171,151,255,.17),transparent 34%),linear-gradient(135deg,#f9fdff 0%,#edf7ff 52%,#f7f3ff 100%)}
  .why-arisu-section .why-history-card::before{right:-85px;bottom:-70px;width:210px;height:120px}
}
@media (prefers-reduced-motion:reduce) {.why-arisu-section .why-history-page-link{transition:none}}

/* make the Facebook Page action explicit and prevent accidental taps on the whole history row. */
.why-arisu-section .why-history-page-link{cursor:default;pointer-events:none;background:transparent!important;outline:none!important}

/* Soft Glass purpose card, placed directly below About This Website. */
.purpose-section {
  margin-top: 15px !important;
  max-width: 960px;
}
.purpose-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  box-sizing: border-box;
  padding: clamp(21px, 3.1vw, 31px);
  border: 1px solid rgba(125, 163, 229, .34);
  border-radius: 22px;
  color: #243452;
  background:
    radial-gradient(ellipse at 0% 0%, rgba(89, 211, 244, .15), transparent 37%),
    radial-gradient(ellipse at 100% 4%, rgba(177, 153, 255, .17), transparent 39%),
    linear-gradient(135deg, #ffffff 0%, #f2f8ff 53%, #faf6ff 100%);
  box-shadow: 0 10px 28px rgba(58, 102, 170, .105), inset 0 1px 0 rgba(255, 255, 255, .98);
}
.purpose-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 210px;
  height: 130px;
  right: -98px;
  bottom: -76px;
  border-radius: 50%;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(72, 190, 241, .13), rgba(146, 133, 255, .12));
  transform: rotate(-18deg);
}
.purpose-kicker {
  display: inline-block;
  margin: 0 0 8px;
  color: #2469cf;
  font: 800 13px/1.4 Manrope, Arial, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.purpose-card h2 {
  max-width: 720px;
  margin: 0 0 13px;
  color: #172749;
  font: 800 clamp(23px, 3vw, 31px)/1.18 Manrope, Arial, sans-serif;
  letter-spacing: -.75px;
  text-wrap: balance;
}
.purpose-card > p {
  max-width: 790px;
  margin: 0 0 11px;
  color: #4b5e7c;
  font: 500 14.5px/1.72 Manrope, Arial, sans-serif;
}
.purpose-card > .purpose-mantra {
  margin-top: 14px;
  margin-bottom: 0;
  color: #2456a7;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.55;
  letter-spacing: .005em;
}
.purpose-signoff {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
  margin-top: 2px;
  padding-top: 2px;
  border-top: 1px solid rgba(115, 151, 212, .27);
}
.purpose-signoff-label {
  color: #687b98;
  font: 600 11px/1.5 Manrope, Arial, sans-serif;
  letter-spacing: .02em;
}
.purpose-creator-name {
  margin: 0;
  color: #264f9d;
  font: italic 800 clamp(20px, 2.5vw, 25px)/1.25 Georgia, "Times New Roman", serif;
  letter-spacing: -.35px;
}
.purpose-creator-role {
  color: #74839b;
  font: 600 10.5px/1.5 Manrope, Arial, sans-serif;
}
@media  (max-width: 760px)  {
  .purpose-section { margin-top: 13px !important; }
  .purpose-card {
    padding: 19px 16px 18px;
    border-radius: 19px;
    background:
      radial-gradient(ellipse at 0% 0%, rgba(89, 211, 244, .13), transparent 39%),
      radial-gradient(ellipse at 100% 3%, rgba(177, 153, 255, .14), transparent 38%),
      linear-gradient(135deg, #ffffff 0%, #f3f8ff 56%, #faf7ff 100%);
  }
  .purpose-kicker { margin-bottom: 7px; font-size: 12px; letter-spacing: .14em; }
  .purpose-card h2 { margin-bottom: 10px; font-size: clamp(21px, 5.5vw, 25px); line-height: 1.2; letter-spacing: -.45px; }
  .purpose-card > p { margin-bottom: 9px; font-size: 13px; line-height: 1.62; }
  .purpose-card > .purpose-mantra { margin-top: 11px; margin-bottom: 0; font-size: 12.5px; line-height: 1.55; }
  .purpose-signoff { margin-top: 2px; padding-top: 2px; gap: 2px; }
  .purpose-signoff-label { font-size: 10px; }
  .purpose-creator-name { font-size: 21px; }
  .purpose-creator-role { font-size: 9.5px; }
  .purpose-card::after { width: 155px; height: 100px; right: -83px; bottom: -62px; }
}
@media  (prefers-reduced-motion: reduce)  {
  .purpose-card { scroll-behavior: auto; }
}

/* compact ONLY the inner Account Recovery Experience / Pinoy Cyber Tech card on mobile.
 The outer Why Choose Arisu card, heading, Honest & Transparent card, and desktop styles remain unchanged. */
@media  (max-width: 640px)  {
  .why-arisu-section .why-history-card {
    padding: 9px 8px !important;
    margin-bottom: 11px !important;
    border-radius: 16px !important;
  }
  .why-arisu-section .why-history-row { gap: 8px !important; }
  .why-arisu-section .why-history-icon {
    width: 38px !important;
    height: 38px !important;
    flex-basis: 38px !important;
    border-radius: 11px !important;
  }
  .why-arisu-section .why-history-icon svg {
    width: 19px !important;
    height: 19px !important;
  }
  .why-arisu-section .why-history-kicker {
    margin-bottom: 2px !important;
    font-size: .62rem !important;
    line-height: 1.28 !important;
    letter-spacing: .04em !important;
  }
  .why-arisu-section .why-history-title {
    font-size: 1.22rem !important;
    line-height: 1.14 !important;
  }
  .why-arisu-section .why-history-page-title { font-size: 1.02rem !important; }
  .why-arisu-section .why-history-copy p {
    margin-top: 3px !important;
    font-size: .78rem !important;
    line-height: 1.34 !important;
  }
  .why-arisu-section .why-history-divider { margin: 8px 0 !important; }
  .why-arisu-section .why-history-footnote {
    margin-top: 7px !important;
    font-size: .76rem !important;
    line-height: 1.36 !important;
  }
}

/* compact legitimate-recovery notice inside Terms & Limitations. */
.terms-card .terms-intro { margin-bottom: 2px; }
.terms-security { position: static; top: auto; display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: start; gap: 16px; padding: 16px 16px 2px; border: 1px solid rgba(111, 161, 255, .28); border-radius: 20px; background: linear-gradient(135deg, rgba(238, 249, 255, .88), rgba(241, 244, 255, .82) 58%, rgba(255, 242, 253, .74)); }
.terms-security-icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; color: #fff; background: linear-gradient(145deg, #08bfe9 0%, #2468f5 72%, #6254f5 100%); box-shadow: 0 7px 16px rgba(45, 104, 226, .16); }
.terms-security-icon svg { display: block; width: 34px; height: 34px; }
.terms-security-copy h3 { margin: 0 0 6px; color: #172650; font-size: 18px; line-height: 1.25; font-weight: 750; letter-spacing: -.35px; }
.terms-security-copy p { margin: 0; color: #64718a; font-size: 14px; line-height: 1.55; }
@media  (max-width: 600px)  {
 .terms-security { grid-template-columns: 36px minmax(0, 1fr); gap: 10px; padding: 11px 11px 2px; border-radius: 13px; }
 .terms-security-icon { width: 36px; height: 36px; border-radius: 11px; }
 .terms-security-icon svg { width: 21px; height: 21px; }
 .terms-security-copy h3 { margin-bottom: 4px; font-size: 14px; line-height: 1.3; letter-spacing: -.2px; }
 .terms-security-copy p { font-size: 11.5px; line-height: 1.45; }
}

/* final Terms & Limitations security panel sizing and visual consistency. */
body.home-page .terms-card .terms-security {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 13px !important;
  margin-top: 2px !important;
  padding: 13px !important;
  border: 1px solid rgba(111, 161, 255, .32) !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(238,249,255,.94), rgba(241,244,255,.90) 58%, rgba(255,242,253,.86)) !important;
  box-shadow: 0 5px 16px rgba(55, 90, 170, .055) !important;
}
body.home-page .terms-card .terms-security-icon {
  display: grid !important; place-items: center !important; width: 52px !important; height: 52px !important;
  border-radius: 14px !important; color: #fff !important;
  background: linear-gradient(145deg, #08bfe9 0%, #2468f5 72%, #6254f5 100%) !important;
}
body.home-page .terms-card .terms-security-icon svg { width: 28px !important; height: 28px !important; }
body.home-page .terms-card .terms-security-copy h3 {
  margin: 0 0 5px !important; color: #172650 !important; font-size: 16px !important; line-height: 1.3 !important; font-weight: 750 !important; letter-spacing: -.25px !important;
}
body.home-page .terms-card .terms-security-copy p {
  margin: 0 !important; color: #64718a !important; font-size: 13px !important; line-height: 1.5 !important;
}
@media  (max-width: 600px)  {
  body.home-page .terms-card .terms-intro { margin-bottom: 2px !important; }
  body.home-page .terms-card .terms-security { grid-template-columns: 36px minmax(0, 1fr) !important; gap: 10px !important; padding: 11px 11px 2px !important; border-radius: 13px !important; }
  body.home-page .terms-card .terms-security-icon { width: 36px !important; height: 36px !important; border-radius: 10px !important; }
  body.home-page .terms-card .terms-security-icon svg { width: 21px !important; height: 21px !important; }
  body.home-page .terms-card .terms-security-copy h3 { margin-bottom: 4px !important; font-size: 14px !important; line-height: 1.3 !important; letter-spacing: -.15px !important; }
  body.home-page .terms-card .terms-security-copy p { font-size: 12px !important; line-height: 1.48 !important; }
}
@media  (max-width: 360px)  {
  body.home-page .terms-card .terms-security { grid-template-columns: 30px minmax(0, 1fr) !important; gap: 8px !important; padding: 9px 9px 2px !important; }
  body.home-page .terms-card .terms-security-icon { width: 30px !important; height: 30px !important; border-radius: 9px !important; }
  body.home-page .terms-card .terms-security-icon svg { width: 18px !important; height: 18px !important; }
  body.home-page .terms-card .terms-security-copy h3 { font-size: 13px !important; }
  body.home-page .terms-card .terms-security-copy p { font-size: 11.5px !important; }
}

/* tighter mobile spacing for the account-assistance process cards.
 Keep desktop layout unchanged; remove excess grid-row height caused by the icon spanning three rows. */
@media  (max-width: 760px)  {
  .how-section .step-card {
    grid-template-rows: auto auto !important;
    column-gap: 9px !important;
  }
  .how-section .step-card h3 {
    margin: 0 17px 0 0 !important;
    padding: 0 !important;
    line-height: 1.28 !important;
  }
  .how-section .step-card > p {
    margin: 0 !important;
    font-size: 12.5px !important;
  }
}
@media  (max-width: 380px)  {
  .how-section .step-card {
    grid-template-columns: 32px 30px minmax(0, 1fr) !important;
    column-gap: 7px !important;
  }
  .how-section .step-card h3 { font-size: 13px !important; }
  .how-section .step-card > p { font-size: 12px !important; }
}

/* lift process-card titles and descriptions on mobile only.
 Keep outer card layout, icons, badges, and desktop presentation unchanged. */
@media  (max-width: 380px)  {
  .how-section .step-card h3,
  .how-section .step-card > p {
    transform: translateY(-3px) !important;
  }
}

/* approved tighter mobile spacing inside the five process cards.
 Reduce the inner top/bottom padding and the title-to-description row gap.
 Desktop styling and the outer section layout remain unchanged. */
@media  (max-width: 760px)  {
  .how-section .steps-grid {
    gap: 7px !important;
  }
  .how-section .step-card {
    padding: 8px 9px 9px !important;
    row-gap: 1px !important;
  }
  .how-section .step-card h3 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(-2px) !important;
  }
  .how-section .step-card > p {
    margin-top: 0 !important;
    line-height: 1.44 !important;
    transform: translateY(-2px) !important;
  }
}
@media  (max-width: 380px)  {
  .how-section .step-card {
    padding: 7px 8px 8px !important;
    row-gap: 1px !important;
  }
}

/* authoritative mobile compact spacing for account-assistance steps.
 Higher specificity intentionally overrides legacy home-page rules. */


/* compact, aligned mobile process cards.
 Tightens inner vertical rhythm and lets long headings wrap cleanly.
 Desktop layout and outer section/container dimensions are untouched. */
@media  (max-width: 760px)  {
  body.home-page .site-section.how-section .section-heading {
    margin-bottom: 8px !important;
  }
  body.home-page .site-section.how-section .steps-grid {
    gap: 7px !important;
  }
  body.home-page .site-section.how-section .step-card {
    padding: 8px 9px !important;
    min-height: 0 !important;
  }
  body.home-page .site-section.how-section .step-card h3 {
    font-size: 14px !important;
    letter-spacing: -.25px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    transform: none !important;
  }
  body.home-page .site-section.how-section .step-card > p {
    font-size: 12px !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    transform: none !important;
  }
}
@media  (max-width: 380px)  {
  body.home-page .site-section.how-section .step-card {
    row-gap: 2px !important;
    padding: 7px 8px !important;
  }
  body.home-page .site-section.how-section .step-card h3 {
    font-size: 13px !important;
    line-height: 1.22 !important;
  }
  body.home-page .site-section.how-section .step-card > p {
    font-size: 11.5px !important;
    line-height: 1.38 !important;
  }
}

/* align process descriptions directly beneath their headings on mobile. */


/* remove excess gap between process-card titles and descriptions on mobile.
 Override legacy grid placement explicitly so descriptions follow titles immediately. */
@media  (max-width: 760px)  {
  body.home-page .site-section.how-section .step-card {
    grid-template-columns: 36px 34px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto !important;
    align-content: start !important;
    align-items: start !important;
    column-gap: 7px !important;
    row-gap: 0 !important;
  }

  body.home-page .site-section.how-section .step-card h3 {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: start !important;
    line-height: 1.24 !important;
  }

  body.home-page .site-section.how-section .step-card > p {
    grid-column: 3 !important;
    grid-row: 2 !important;
    align-self: start !important;
    line-height: 1.38 !important;
  }
}

@media  (max-width: 380px)  {
  body.home-page .site-section.how-section .step-card {
    grid-template-columns: 32px 30px minmax(0, 1fr) !important;
    column-gap: 6px !important;
  }
}

/* refined mobile title-to-description spacing across all five process cards. */
@media  (max-width: 760px)  {
  body.home-page .site-section.how-section .step-card h3 {
    margin: 0 !important;
    padding: 0 !important;
  }

  body.home-page .site-section.how-section .step-card > p {
    margin: 4px 0 0 !important;
    padding: 0 !important;
  }
}

/* reliable mobile spacing using a real text wrapper.
 Earlier grid rows were held apart by the icon/number row height, so changing margins alone did not visually close the gap.
 Desktop keeps the existing grid placement via display: contents. */


/* restore the desktop process-card text wrapper layout.
 Keep icon + number columns unchanged; let the copy occupy the full third column. */


/* desktop-only refinement for the five account-assistance cards.
 Adjust interior content only; deliberately preserve the existing outer card border and radius. */
@media  (min-width: 761px)  {
  body.home-page .site-section.how-section .step-card {
    grid-template-columns: 50px 42px minmax(0, 1fr) !important;
    column-gap: 13px !important;
    row-gap: 0 !important;
    padding: 15px 19px !important;
    /* Keep border, border-radius, background, and outer shadow unchanged. */
  }
}

/* lift the ENTIRE contents of the Why Choose Arisu outer card.
 The outer border, radius, background, and horizontal padding are preserved.
 Reducing only the top padding moves the kicker, title, description, history card,
 feature cards, and note upward together instead of moving the description alone. */
.why-arisu-section .why-arisu-card {
  padding-top: clamp(12px, 1.8vw, 22px) !important;
}
.why-arisu-section .why-arisu-heading p {
  position: static !important;
  top: auto !important;
}
@media  (max-width: 640px)  {
  .why-arisu-section .why-arisu-card {
    padding-top: 5px !important;
  }
  .why-arisu-section .why-arisu-heading {
    margin-bottom: 10px !important;
  }
}

/* targeted compact spacing for the Why Choose Arisu section only.
 Keep outer border, radius, background, and horizontal padding unchanged. */
body.home-page .why-arisu-section .why-arisu-heading p {
  position: static !important;
  top: auto !important;
}

/* compact the Why Choose Arisu section to match the tighter spacing reference.
 Only interior spacing changes; outer border, radius, background, and horizontal inset stay intact. */
body.home-page .why-arisu-section .why-arisu-card { padding-top: 0 !important; }
body.home-page .why-arisu-section .why-arisu-heading { margin-top: 0 !important; margin-bottom: 8px !important; }
body.home-page .why-arisu-section .why-arisu-heading .eyebrow,
body.home-page .why-arisu-section .why-arisu-heading .section-kicker { margin-bottom: 2px !important; }
body.home-page .why-arisu-section .why-arisu-heading h2 { margin-top: 2px !important; margin-bottom: 3px !important; }
body.home-page .why-arisu-section .why-arisu-heading p { margin-top: 0 !important; margin-bottom: 0 !important; transform: translateY(0px) !important; }

/* tighter mobile spacing and subtler inner card outlines for Why Choose Arisu.
 The outer section border/background and typography/icon sizes remain unchanged. */
body.home-page .why-arisu-section .why-history-card,
body.home-page .why-arisu-section .why-arisu-item {
  border-width: 1px !important;
  border-color: rgba(104, 157, 221, .16) !important;
  box-shadow: none !important;
}
body.home-page .why-arisu-section .why-history-card {
  padding: 9px 10px !important;
  margin-bottom: 6px !important;
  border-radius: 13px !important;
}
body.home-page .why-arisu-section .why-history-divider {
  margin: 6px 0 !important;
}
body.home-page .why-arisu-section .why-history-footnote {
  margin-top: 5px !important;
}
body.home-page .why-arisu-section .why-arisu-grid {
  gap: 5px !important;
}
body.home-page .why-arisu-section .why-arisu-item {
  padding: 7px 8px !important;
  gap: 10px !important;
  border-radius: 12px !important;
}
body.home-page .why-arisu-section .why-arisu-item strong {
  margin-top: 0 !important;
  margin-bottom: 3px !important;
}
body.home-page .why-arisu-section .why-arisu-note {
  margin-top: 5px !important;
  padding: 7px 9px !important;
}
@media  (max-width: 640px)  {
  body.home-page .why-arisu-section .why-arisu-item strong { margin-bottom: 2px !important; }
}

/* match the compact mobile card spacing used in Why Choose Arisu.
 Scoped only to Account Recovery and Account Deletion service cards. */
@media  (max-width: 700px)  {
  body.home-page .desktop-social-destination .services-section .service-card {
    padding: 12px 10px !important;
    border-width: 1px !important;
    border-color: rgba(104, 157, 221, .20) !important;
    border-radius: 15px !important;
    box-shadow: none !important;
  }
  body.home-page .desktop-social-destination .services-section .deletion-service-card {
    border-color: rgba(224, 128, 177, .22) !important;
  }
  body.home-page .desktop-social-destination .services-section .service-card-heading {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 13px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-icon svg {
    width: 25px !important;
    height: 25px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-card h3 {
    margin-bottom: 3px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-card-heading p {
    line-height: 1.4 !important;
  }
  body.home-page .desktop-social-destination .services-section .service-issue-list {
    gap: 4px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-issue-list li {
    min-height: 29px !important;
    padding: 4px 8px !important;
    gap: 7px !important;
    border-radius: 10px !important;
    line-height: 1.3 !important;
  }
  body.home-page .desktop-social-destination .services-section .service-issue-list li::before {
    flex-basis: 19px !important;
    width: 19px !important;
    height: 19px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-platforms {
    margin-top: 8px !important;
    padding: 8px !important;
    border-width: 1px !important;
    border-color: rgba(104, 157, 221, .20) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
  }
  body.home-page .desktop-social-destination .services-section .service-platforms h4 {
    margin-bottom: 7px !important;
  }
  
  body.home-page .desktop-social-destination .services-section .service-platform {
    gap: 6px !important;
    padding: 6px !important;
    border-radius: 10px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-platform-logo {
    width: 29px !important;
    height: 29px !important;
    flex-basis: 29px !important;
  }
  body.home-page .desktop-social-destination .services-section .deletion-option {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 8px !important;
    margin-top: 7px !important;
    padding: 7px !important;
    border-radius: 11px !important;
    border: 1px solid rgba(224, 128, 177, .12) !important;
  }
  body.home-page .desktop-social-destination .services-section .deletion-option-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
    font-size: 22px !important;
  }
  body.home-page .desktop-social-destination .services-section .deletion-option h4 {
    margin-bottom: 2px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-disclaimer {
    grid-template-columns: 21px minmax(0, 1fr) !important;
    gap: 7px !important;
    margin-top: 8px !important;
    padding: 8px !important;
    border: 1px solid rgba(224, 128, 177, .14) !important;
    border-radius: 11px !important;
  }
  body.home-page .desktop-social-destination .services-section .service-disclaimer > span {
    width: 21px !important;
    height: 21px !important;
  }
}

/* lift and compact the complete MY SERVICES heading on mobile.
 Keeps this adjustment scoped to the Services section; outer section styling remains intact. */
@media  (max-width: 700px)  {
  html body.home-page .desktop-social-destination .services-section {
    margin-top: 9px !important;
    padding-top: 0 !important;
  }
  html body.home-page .desktop-social-destination .services-section .services-heading {
    margin: 0 auto 12px !important;
    padding: 0 4px !important;
  }
  html body.home-page .desktop-social-destination .services-section .services-heading .section-kicker {
    display: block;
    margin: 0 0 3px !important;
    line-height: 1.25 !important;
  }
  html body.home-page .desktop-social-destination .services-section .services-heading h2 {
    margin: 3px 0 5px !important;
    line-height: 1.12 !important;
  }
  html body.home-page .desktop-social-destination .services-section .services-heading > p:first-of-type {
    margin: 0 !important;
    line-height: 1.35 !important;
  }
  html body.home-page .desktop-social-destination .services-section .services-heading .services-intro {
    margin: 4px 0 -22px !important;
    line-height: 1.45 !important;
  }
}

/* compact Account Deletion card on mobile and vertically align the warning copy.
 Scoped to the deletion card; no outer section border or other service card is changed. */
@media  (max-width: 700px)  {
  html body.home-page .desktop-social-destination .services-section .deletion-service-card {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card > .service-card-heading {
    margin-bottom: 0 !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .service-disclaimer {
    align-items: center !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .service-disclaimer > span {
    align-self: center !important;
    margin: 0 !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .service-disclaimer p {
    margin: 0 !important;
    line-height: 1.35 !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .service-disclaimer strong {
    display: inline !important;
    margin: 0 !important;
    font-weight: 700 !important;
  }
}

/* tighter mobile spacing across both service cards.
 Preserve outer section styling, icon sizes, and readable type. */
@media  (max-width: 700px)  {
  html body.home-page .desktop-social-destination .services-section .services-grid {
    gap: 8px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-card {
    padding: 8px 10px !important;
    border-radius: 17px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-card-heading {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    gap: 9px !important;
    margin-bottom: 8px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-card-heading .service-icon {
    width: 48px !important;
    height: 48px !important;
    border-radius: 13px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-card-heading p {
    margin-top: 2px !important;
    line-height: 1.38 !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-issue-list li {
    border-radius: 10px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-issue-list li::before {
    flex-basis: 22px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-platforms {
    margin-top: 5px !important;
    padding: 6px !important;
    border-radius: 12px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-platforms h4 {
    margin-bottom: 5px !important;
  }
  
  html body.home-page .desktop-social-destination .services-section .service-platform {
    gap: 6px !important;
    padding: 6px !important;
    border-radius: 10px !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .deletion-option {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 8px !important;
    margin-top: 5px !important;
    padding: 5px !important;
    border-radius: 11px !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .deletion-option-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .deletion-option h4 {
    margin-bottom: 1px !important;
    line-height: 1.3 !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .deletion-option p {
    line-height: 1.35 !important;
  }
  html body.home-page .desktop-social-destination .services-section .deletion-service-card .service-disclaimer {
    grid-template-columns: 21px minmax(0, 1fr) !important;
    gap: 6px !important;
    margin-top: 5px !important;
    padding: 6px 7px !important;
    border-radius: 10px !important;
  }
}

/* extra-compact mobile spacing for Why Choose Arisu.
 Preserve the outer card border, radius, background, horizontal inset, and type/icon sizes. */
@media  (max-width: 640px)  {
  body.home-page .why-arisu-section .why-arisu-card {
    padding-top: 0 !important;
    padding-bottom: 10px !important;
  }
  body.home-page .why-arisu-section .why-arisu-heading {
    margin-bottom: 4px !important;
  }
  body.home-page .why-arisu-section .why-arisu-heading .section-kicker {
    margin-bottom: 0 !important;
    line-height: 1.2 !important;
  }
  body.home-page .why-arisu-section .why-arisu-heading h2 {
    margin-top: 1px !important;
    margin-bottom: 1px !important;
    line-height: 1.12 !important;
  }
  body.home-page .why-arisu-section .why-arisu-heading p {
    margin: 0 !important;
    line-height: 1.38 !important;
  }
  body.home-page .why-arisu-section .why-history-card {
    padding: 6px 7px !important;
    margin-bottom: 4px !important;
    border-radius: 11px !important;
  }
  body.home-page .why-arisu-section .why-history-row {
    gap: 7px !important;
  }
  body.home-page .why-arisu-section .why-history-kicker {
    margin-bottom: 1px !important;
    line-height: 1.25 !important;
  }
  body.home-page .why-arisu-section .why-history-title {
    line-height: 1.12 !important;
  }
  body.home-page .why-arisu-section .why-history-copy p {
    margin-top: 3px !important;
    line-height: 1.35 !important;
  }
  body.home-page .why-arisu-section .why-history-divider {
    margin: 5px 0 !important;
  }
  body.home-page .why-arisu-section .why-history-footnote {
    margin-top: 4px !important;
    line-height: 1.38 !important;
  }
  body.home-page .why-arisu-section .why-arisu-grid {
    gap: 4px !important;
  }
  body.home-page .why-arisu-section .why-arisu-item {
    padding: 6px 7px !important;
    gap: 8px !important;
    border-radius: 10px !important;
  }
  body.home-page .why-arisu-section .why-arisu-item strong {
    margin: 0 0 1px !important;
    line-height: 1.25 !important;
  }
  body.home-page .why-arisu-section .why-arisu-item small {
    line-height: 1.32 !important;
  }
  body.home-page .why-arisu-section .why-arisu-note {
    margin-top: 4px !important;
    padding: 6px 7px !important;
    gap: 6px !important;
  }
  body.home-page .why-arisu-section .why-arisu-note p {
    margin: 0 !important;
    line-height: 1.32 !important;
  }
}

/* tighten the gap slightly above the Why Choose Arisu outer section on mobile.
 Keep the section's own padding, border, and inner card spacing unchanged. */
@media  (max-width: 640px)  {
  html body.home-page main > .why-arisu-section {
    margin-top: 8px !important;
  }
}

/* restore a little breathing room above the mobile process section.
 Only the section's outside spacing changes; card internals and desktop layout stay untouched. */
@media  (max-width: 640px)  {
  html body.home-page main > .site-section.how-section {
    margin-top: 6px !important;
  }
}

/* apply the compact mobile gap to the actual moved sections.
 desktop-layout.js moves #services and #why-choose-arisu inside #desktopSocialDestination,
 so target them there rather than as direct children of main. */
@media  (max-width: 640px)  {
  html body.home-page #desktopSocialDestination > #services {
    margin-bottom: 0 !important;
  }
  html body.home-page #desktopSocialDestination > #why-choose-arisu {
    margin-top: 8px !important;
  }
}

/* enforce the requested mobile text-size increases after legacy overrides.
 Higher-specificity selectors ensure the values actually win without changing layout. */
@media  (max-width: 600px)  {
  html body.home-page main > .compact-intro > p {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
  html body.home-page #contact .whatsapp-feature-kicker {
    font-size: 10px !important;
    line-height: 1.35 !important;
  }
  html body.home-page #contact .whatsapp-feature-content p {
    font-size: 12px !important;
    line-height: 1.45 !important;
  }
}
@media  (max-width: 370px)  {
  html body.home-page main > .compact-intro > p {
    font-size: 13px !important;
  }
  html body.home-page #contact .whatsapp-feature-kicker {
    font-size: 9px !important;
  }
  html body.home-page #contact .whatsapp-feature-content p {
    font-size: 11.5px !important;
  }
}

/* slightly enlarge the social-media divider label.
 Final override intentionally follows older rules that set a smaller mobile size. */

/* make the social-media divider label more visible without changing layout. */
body.home-page .contact-divider {
  font-size: 11px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}
@media  (max-width: 600px)  {
  body.home-page .contact-divider {
    font-size: 10px !important;
    letter-spacing: .75px !important;
  }
}
@media  (max-width: 370px)  {
  body.home-page .contact-divider {
    font-size: 9px !important;
    letter-spacing: .5px !important;
  }
}

/* final mobile alignment correction. Both buttons remain exactly 48px tall;
 move the Recovery Proofs button down 9px so its visible baseline matches View All Reviews.
 Mobile only; desktop layout is unchanged. */

/* authoritative equal-height outer cards for Recovery Proofs and Customer Feedback.
 Both cards stretch to the same grid-row height; the Customer Feedback card is the visual reference.
 This final override supersedes earlier conflicting fixed-height and mobile height rules. */
.social-collage {
  align-items: stretch !important;
}
.social-collage > .recovery-proofs-showcase,
.social-collage > .social-feedback-card {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    align-self: stretch !important;
  }
}

/* final exact-height match for the Recovery Proofs and Customer Feedback outer cards.
 Customer Feedback is the reference. Internal previews flex to fit without changing card width. */
.social-collage > .recovery-proofs-showcase,
.social-collage > .social-feedback-card {
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box !important;
}
.social-collage > .recovery-proofs-showcase .recovery-proofs-button {
  margin-top: auto !important;
  flex: 0 0 48px !important;
  height: 48px !important;
  min-height: 48px !important;
}
.social-collage > .social-feedback-card > .windows-feedback-content {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
.social-collage > .social-feedback-card .reviews-grid-featured {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}
.social-collage > .social-feedback-card .social-feedback-view-all {
  flex: 0 0 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  margin-top: auto !important;
}
.social-collage > .recovery-proofs-showcase .recovery-proofs-preview {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
.social-collage > .recovery-proofs-showcase .recovery-proof-preview-item {
  flex: 1 1 0 !important;
  height: auto !important;
  min-height: 0 !important;
}
.social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
}
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    height: clamp(360px, 96.5vw, 390px) !important;
    min-height: clamp(360px, 96.5vw, 390px) !important;
    max-height: clamp(360px, 96.5vw, 390px) !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-card,
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
  }
  .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}
@media  (min-width: 601px) and (max-width: 1199px)  {
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    height: 545.34px !important;
    min-height: 545.34px !important;
    max-height: 545.34px !important;
  }
}
@media  (min-width: 1200px)  {
  .social-collage > .recovery-proofs-showcase,
  .social-collage > .social-feedback-card {
    height: 543.33px !important;
    min-height: 543.33px !important;
    max-height: 543.33px !important;
  }
}

/* subtle mobile proof-preview refinement. Lift the Suspended preview slightly,
 and make the Disabled preview just a touch shorter so its visual weight better matches
 the Customer Feedback preview without changing the outer cards or button alignment. */
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase .recovery-proofs-preview {
    margin-top: 8px !important;
    gap: 8px !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item:first-child {
    flex: 1 1 0 !important;
  }
  .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item:nth-child(2) {
    flex: 0.97 1 0 !important;
  }
}

/* restore the established content inset. The requested 4px reduction
 applies to the review preview image itself, not to the card content padding. */
@media  (max-width: 600px)  {
  html body.home-page .social-collage > .social-feedback-card > .windows-feedback-content {
    box-sizing: border-box !important;
    padding-bottom: 8px !important;
  }
}

/* reduce the actual review preview image by 2px from the earlier adjustment. Keep outer preview card and button unchanged. */
@media  (max-width: 600px)  {

  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    height: calc(100% + 2px) !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 0 0 calc(100% + 2px) !important;
    box-sizing: border-box !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
  }
}

/* one authoritative Daily Bible Verse layout/background rule.
 Older base styles remain for the rest of the page, but this block controls the live card.
 Keep the existing horizontal padding; adjust only vertical spacing and mobile image crop. */
html body.home-page main > #daily-bible-verse.daily-verse-card {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  
  
  border-radius: 22px !important;
  overflow: hidden !important;
  background-image: linear-gradient(90deg, rgba(4,35,82,.25), rgba(4,35,82,.10) 52%, rgba(4,35,82,.10)), url("./verse-lake-photo.jpg?v=AFV263") !important;
  background-size: cover !important;
  background-position: center 52% !important;
  background-repeat: no-repeat !important;
  background-origin: border-box !important;
  background-clip: border-box !important;
  background-color: #155a9a !important;
}
@media  (min-width: 900px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    padding-top: 42px !important;
    padding-bottom: 40px !important;
    background-position: center 52% !important;
    background-size: cover !important;
  }
}
@media  (max-width: 899px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    padding-top: 30px !important;
    padding-bottom: 27px !important;
    background-position: center 52% !important;
  }
}
/* Mobile-only: zoom the photo slightly and shift its right-side cross inward so it stays visible. */
@media  (max-width: 600px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    margin-top: -3px !important;
    
    
    border-radius: 18px !important;
    background-size: auto 112% !important;
    background-position: 100% 52% !important;
    background-image: linear-gradient(90deg, rgba(4,35,82,.30), rgba(4,35,82,.16) 55%, rgba(4,35,82,.08)), url("./verse-lake-photo.jpg?v=AFV263") !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-topline {
    gap: 4px !important;
    margin-bottom: 5px !important;
    line-height: 1.25 !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-cross {
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    font-size: 12px !important;
  }
  html body.home-page #daily-bible-verse .daily-verse-label { font-size: 7.5px !important; letter-spacing: .35px !important; }
  html body.home-page #daily-bible-verse .daily-verse-date { font-size: 7px !important; letter-spacing: 0 !important; padding: 2px 4px !important; }
  html body.home-page #daily-bible-verse h2 { margin: 0 0 4px !important; font-size: 18px !important; line-height: 1.18 !important; letter-spacing: -.35px !important; }
  html body.home-page #daily-bible-verse .daily-verse-text { max-width: 100% !important; margin: 0 auto 3px !important; font-size: 13px !important; line-height: 1.35 !important; }
  html body.home-page #daily-bible-verse .daily-verse-reference { margin-top: 1px !important; font-size: 10px !important; line-height: 1.25 !important; }
  html body.home-page #daily-bible-verse .daily-verse-translation { max-width: 100% !important; margin-top: 4px !important; font-size: 11.5px !important; line-height: 1.35 !important; }
}
@media  (max-width: 380px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    
    
    background-size: auto 106% !important;
    background-position: 100% 52% !important;
  }
  html body.home-page #daily-bible-verse h2 { font-size: 17px !important; }
  html body.home-page #daily-bible-verse .daily-verse-text { font-size: 12.5px !important; }
  html body.home-page #daily-bible-verse .daily-verse-translation { font-size: 11px !important; }
}

/* compact premium glass combined-logo floating control. */
html body .floating-menu #floatingWhatsApp {
  width: 60px !important; height: 60px !important; min-width: 60px !important; min-height: 60px !important;
  padding: 0 !important; display: grid !important; place-items: center !important; overflow: visible !important;
  border: 1px solid rgba(224, 249, 255, .88) !important; border-radius: 50% !important;
  color: #fff !important; background: linear-gradient(145deg, rgba(220,248,255,.42), rgba(54,110,226,.56) 48%, rgba(18,37,100,.86)) !important;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.82), inset 0 -5px 12px rgba(6,24,84,.35), 0 7px 22px rgba(22,87,205,.34), 0 0 18px rgba(80,203,255,.25) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.4) !important; 
}
html body .floating-menu #floatingWhatsApp::after {
  content: ""; position: absolute; inset: 4px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; pointer-events: none;
}
html body .floating-menu #floatingWhatsApp .arisu-combined-icon {
  width: 100% !important; height: 100% !important; flex: 0 0 100% !important; display: block !important; opacity: 1 !important; transform: none !important;
  filter: drop-shadow(0 2px 4px rgba(0,18,70,.3));
}
html body .floating-menu[data-state="open"] #floatingWhatsApp .arisu-combined-icon { opacity: 0 !important; transform: scale(.75) rotate(45deg) !important; }
html body .floating-menu #floatingWhatsApp .floating-menu-close-icon { z-index: 2; color: #fff; text-shadow: 0 1px 8px rgba(0,15,60,.55); }
html body .floating-menu:not([data-state="open"]) #floatingWhatsApp::before {
  inset: -5px !important; border: 1.5px solid rgba(104,220,255,.68) !important; box-shadow: 0 0 14px rgba(63,173,255,.28); animation: arisuGlassRipple162 2.7s ease-out infinite !important;
}
html body .floating-menu:not([data-state="open"]) #floatingWhatsApp { animation: arisuGlassFloat162 4s ease-in-out infinite !important; }
@keyframes  arisuGlassRipple162  { 0% { opacity: .72; transform: scale(.94); } 80%,100% { opacity: 0; transform: scale(1.24); } }
@keyframes  arisuGlassFloat162  { 0%,100% { box-shadow: inset 0 1px 2px rgba(255,255,255,.82), inset 0 -5px 12px rgba(6,24,84,.35), 0 7px 22px rgba(22,87,205,.34), 0 0 18px rgba(80,203,255,.25); } 50% { box-shadow: inset 0 1px 2px rgba(255,255,255,.9), inset 0 -5px 12px rgba(6,24,84,.3), 0 9px 25px rgba(22,87,205,.4), 0 0 23px rgba(80,203,255,.34); } }
@media (prefers-reduced-motion:reduce)  { html body .floating-menu:not([data-state="open"]) #floatingWhatsApp, html body .floating-menu:not([data-state="open"]) #floatingWhatsApp::before { animation:none !important; } }

/* fix conflicting animation:none rule; visible double expanding-ring cue, no sparkle badge. */
html body .floating-menu {
  position: fixed !important; right: max(14px, calc((100vw - 1080px)/2)) !important;
  bottom: max(14px, env(safe-area-inset-bottom, 0px)) !important;
  display: flex !important; flex-direction: column !important; align-items: flex-end !important;
  gap: 8px !important; z-index: 9999 !important;
}
html body .floating-menu #floatingWhatsApp { position: relative !important; right: auto !important; bottom: auto !important; margin: 0 !important; }
html body .floating-menu #floatingWhatsApp::before {
  content: "" !important;
  position: absolute !important;
  inset: -3px !important;
  box-sizing: border-box !important;
  border: 2px solid rgba(89, 202, 255, .82) !important;
  border-radius: 50% !important;
  box-shadow: 0 0 14px rgba(75, 190, 255, .24), inset 0 0 5px rgba(75, 190, 255, .12) !important;
  opacity: .9; /* Must NOT be !important: keyframes animate opacity. */
  transform: scale(.96);
  pointer-events: none !important;
  animation: none !important;
}
/* CSS directly controls the continuous pulse; no JS class required. */

@media  (max-width: 600px)  {
  html body .floating-menu { right: max(12px, env(safe-area-inset-right, 0px)) !important; bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important; }
  html body .floating-menu #floatingWhatsApp { width: 56px !important; height: 56px !important; min-width: 56px !important; min-height: 56px !important; }
}
@media  (max-width: 360px)  { html body .floating-menu #floatingWhatsApp { width: 52px !important; height: 52px !important; min-width: 52px !important; min-height: 52px !important; } }

/* Floating shortcut menu: single source of truth for panel spacing and card sizing. */
html body.home-page .floating-menu {
  position: fixed !important;
  right: max(14px, env(safe-area-inset-right, 0px)) !important;
  bottom: max(14px, env(safe-area-inset-bottom, 0px)) !important;
  width: auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 10px !important;
  z-index: 9999 !important;
  isolation: isolate !important;
}
html body.home-page .floating-menu-items[hidden],
html body.home-page #floatingMenuItems[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
html body.home-page .floating-menu-items:not([hidden]) {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 5px !important;
  width: min(250px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  padding: 4px !important;
  margin: 0 0 2px !important;
  
  border-radius: 20px !important;
  
  
  
  
  overflow: hidden !important;
}
html body.home-page .floating-menu-item {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  flex: 0 0 auto !important;
  gap: 9px !important;
  width: calc(100% - 50px) !important;
  min-height: 40px !important;
  padding: 5px 9px !important;
  border-radius: 13px !important;
  color: #172a4a !important;
  font: 700 14px/1.25 Arial, sans-serif !important;
  text-decoration: none !important;
  overflow: hidden !important;
}
html body.home-page .floating-menu-item:focus-visible {
  outline: 3px solid #78baff !important;
  outline-offset: 2px !important;
}
html body.home-page .floating-menu-item-icon {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 31px !important;
  width: 31px !important;
  height: 31px !important;
  min-width: 31px !important;
  min-height: 31px !important;
  border-radius: 10px !important;
  color: #fff !important;
  font: 800 17px/1 Arial, sans-serif !important;
  overflow: hidden !important;
}
html body.home-page .floating-menu-item-icon svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
html body.home-page .floating-menu-item-icon.wa-shortcut { background: linear-gradient(145deg,#1ccf85,#079e65) !important; }
html body.home-page .floating-menu-item-icon.fb-shortcut { background: #1877f2 !important; }
html body.home-page .floating-menu-item-icon.tt-shortcut { background: #171923 !important; }
html body.home-page .floating-menu-item-icon.proofs-shortcut { background: #4267e8 !important; }
html body.home-page .floating-menu-item-icon.faq-shortcut { background: #e9efff !important; color: #3156bb !important; }
@media  (max-width: 600px)  {
  html body.home-page .floating-menu { right: max(12px, env(safe-area-inset-right, 0px)) !important; bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
  html body.home-page .floating-menu-items:not([hidden]) { width: min(186px, calc(100vw - 78px)) !important; max-width: calc(100vw - 78px) !important; border-radius: 17px !important; }
  html body.home-page .floating-menu-item { width: 100% !important; align-self: stretch !important; min-height: 38px !important; padding: 5px 9px !important; gap: 9px !important; font-size: 13px !important; }
}

/* keep footer content in a single, readable mobile flow. */
@media  (max-width: 600px)  {
  body.home-page .site-footer {
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: start !important;
  }
  body.home-page .site-footer > .footer-brand { grid-column: 1 !important; grid-row: 1 !important; }
  body.home-page .site-footer > .footer-note { grid-column: 1 !important; grid-row: 2 !important; }
  body.home-page .site-footer > .footer-location { grid-column: 1 !important; grid-row: 3 !important; min-width: 0; }
  body.home-page .site-footer > .footer-links { grid-column: 1 !important; grid-row: 4 !important; }
  body.home-page .site-footer > .footer-copyright { grid-column: 1 !important; grid-row: 5 !important; }
  body.home-page .footer-location-item { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
  body.home-page .footer-location-item svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: currentColor; stroke-width: 1.7; }
  body.home-page .footer-location { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
}

/* soften outer-card outlines from About This Website through the final content cards. */
@media  (max-width: 600px)  {
  body.home-page .about-card,
  body.home-page .why-arisu-section .why-arisu-card,
  body.home-page .why-arisu-section .why-history-card,
  body.home-page .why-arisu-section .why-arisu-item,
  body.home-page .safety-panel,
  body.home-page .terms-card {
    border-width: 0.75px !important;
    border-color: rgba(104, 132, 177, 0.22) !important;
  }
}

/* restore previously established spacing rhythm below the How It Works section.
   Spacing only: preserve current floating WhatsApp control and social-card sizing/layout. */
html body.home-page main > section.site-section.about-section,
html body.home-page main > section.site-section.purpose-section,
html body.home-page main > section.site-section.safety-section,
html body.home-page main > section.site-section.terms-section {
  margin-block-start: 6px !important;
  margin-block-end: 0 !important;
}
html body.home-page main > section.site-section.about-section + section.site-section.purpose-section,
html body.home-page main > section.site-section.purpose-section + section.site-section.safety-section,
html body.home-page main > section.site-section.safety-section + section.site-section.terms-section {
  margin-block-start: 6px !important;
}
html body.home-page main .about-card {
  padding-top: 8px !important;
  padding-bottom: 2px !important;
  row-gap: 8px !important;
}
html body.home-page main .purpose-card {
  padding-top: 3px !important;
  padding-bottom: 2px !important;
  gap: 9px !important;
}
@media  (max-width: 600px)  {
  html body.home-page main > section.site-section.about-section,
  html body.home-page main > section.site-section.purpose-section,
  html body.home-page main > section.site-section.safety-section,
  html body.home-page main > section.site-section.terms-section {
    margin-block-start: 4px !important;
    margin-block-end: 0 !important;
  }
  html body.home-page main > section.site-section.about-section + section.site-section.purpose-section,
  html body.home-page main > section.site-section.purpose-section + section.site-section.safety-section,
  html body.home-page main > section.site-section.safety-section + section.site-section.terms-section {
    margin-block-start: 4px !important;
  }
  html body.home-page main .about-card {
    padding: 6px 15px 2px !important;
    column-gap: 12px !important;
  }
  html body.home-page main .purpose-card {
    padding: 2px 15px 2px !important;
  }
}
@media  (max-width: 380px)  {
  html body.home-page main .about-card {
    padding: 5px 13px 2px !important;
    column-gap: 10px !important;
  }
  html body.home-page main .purpose-card {
    padding: 1px 13px 2px !important;
  }
}

/* show a simple straight divider only, without a rounded panel effect. */
.about-card p.about-description + p.independent-note {
  margin-top: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.about-card p.about-description + p.independent-note::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  margin: 0 0 10px;
  background: rgba(49, 80, 126, 0.22);
}

/* Premium gradient treatment for About This Website; keep Purpose label unchanged. */
body.home-page .about-card .section-kicker {
  display: inline-block !important;
  width: fit-content !important;
  padding: 5px 9px !important;
  border: 1px solid rgba(115, 145, 231, .24) !important;
  border-radius: 6px !important;
  background: linear-gradient(115deg, #edf5ff 0%, #e5eaff 52%, #f0e8ff 100%) !important;
  color: #315cc5 !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  letter-spacing: 1.15px !important;
  box-shadow: 0 2px 8px rgba(72, 105, 190, .08) !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
body.home-page .purpose-card .purpose-kicker {
  display: inline-block !important;
  width: fit-content !important;
  padding: 5px 9px !important;
  border-radius: 6px !important;
  background: #e7efff !important;
  color: #315cc5 !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: 1.15px !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
body.home-page .about-card .section-kicker {
  margin-bottom: 8px !important;
}
body.home-page .purpose-card .purpose-kicker {
  margin-bottom: 10px !important;
}

/* move the purpose text and creator divider slightly higher on mobile.
   This final, high-specificity block intentionally overrides only the matching mobile margins. */
@media  (max-width: 600px)  {
  html body.home-page main .purpose-card h2 { margin-bottom: 6px !important; }
  html body.home-page main .purpose-card > p:not(.purpose-mantra) { margin-bottom: 5px !important; }
  html body.home-page main .purpose-card > .purpose-mantra { margin-top: 7px !important; }
  html body.home-page main .purpose-card .purpose-signoff {
    margin-top: 2px !important;
    padding-top: 2px !important;
  }
}

/* definitive mobile card spacing: pull the PLEASE READ label up another 2px;
   retain zero outer top padding and the existing 2px bottom inset. */
@media  (max-width: 600px)  {
  html body.home-page main > section.site-section.safety-section .safety-panel {
    padding-block: 8px !important;
  }
  html body.home-page main > section.site-section.terms-section > .terms-card {
    padding-top: 0 !important;
    padding-bottom: 2px !important;
  }
  html body.home-page main > section.site-section.terms-section > .terms-card > .section-kicker {
    position: relative !important;
    top: -2px !important;
  }
}

/* bring the footer closer to the Legitimate Account Recovery card on mobile.
   Reduce the trailing main padding and footer gap; preserve the card's own spacing. */
@media  (max-width: 600px)  {
  html body.home-page main { padding-bottom: 8px !important; }
  html body.home-page .site-footer { margin-top: 4px !important; }
}

/* consolidate repeated mobile WhatsApp spacing adjustments.
   Preserve the final values from the previous consecutive rules. */
@media  (max-width: 600px)  {
  html body.home-page #contact .whatsapp-feature-card {
    padding-top: 5px !important;
  }
  html body.home-page #contact .whatsapp-feature-top,
  html body.home-page #contact .whatsapp-feature-kicker {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}

/* preserve a thin visible gap after the intro and between the two cards.
   Correct the previous negative margin that caused the WhatsApp card to overlap the subtitle. */

/* raise Service Status 4px closer to the WhatsApp card on mobile. */
@media  (max-width: 600px)  {
  html body.home-page main > .compact-intro {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }
  html body.home-page main > #contact.wizard-card.contact-only {
    gap: 4px !important;
  }
  html body.home-page #contact .whatsapp-feature-card {
    margin-top: 0 !important;
  }
}

/* repair desktop footer location icons and alignment.
   The SVGs previously had no desktop size/stroke rules, so their paths rendered as huge black shapes. */
@media  (min-width: 601px)  {
  body.home-page .site-footer > .footer-location {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px 8px !important;
    min-width: 0 !important;
    align-self: center !important;
  }
  body.home-page .site-footer .footer-location-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    white-space: nowrap;
  }
  body.home-page .site-footer .footer-location-item svg {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    flex: 0 0 16px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  body.home-page .site-footer .footer-location-separator {
    display: inline-block !important;
    color: #7d899c !important;
    line-height: 1 !important;
  }
}

/* desktop Service Status and Scam Awareness match the WhatsApp card width; repair footer note wrapping.
   Desktop-only refinements preserve the mobile card stack and spacing. */
@media  (min-width: 900px)  {
  html body.home-page main {
    max-width: 1320px !important;
    padding-left: clamp(32px, 3.7vw, 48px) !important;
    padding-right: clamp(32px, 3.7vw, 48px) !important;
  }

  /* The reference shows the availability panel spanning the full main content width. */
  html body.home-page main > #contact.wizard-card.contact-only {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }

  html body.home-page #contact .whatsapp-feature-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  html body.home-page #contact .service-status-main {
    min-width: 0 !important;
    padding: 3px 7px !important;
  }

  html body.home-page #contact .service-status-details {
    min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  }

  html body.home-page .desktop-social-destination {
    /* Keep the social/reminder section aligned to the same content rails as WhatsApp. */
    width: 100% !important;
    max-width: none !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Layout-only sizing for the reminder card; vertical positioning is controlled by
     the authoritative --arc-reveal-offset rule at the end of this stylesheet. */
  html body.home-page .desktop-social-destination > .scam-awareness-card {
    width: 100% !important;
    max-width: none !important;
    margin: 6px 0 8px !important;
    padding: 15px 18px !important;
    gap: 13px !important;
    border-radius: 18px !important;
  }

  html body.home-page .desktop-social-destination > .contact-divider {
    width: 100% !important;
    margin: 0 auto 10px !important;
  }

  /* Match the compact three-column desktop footer reference; links/copyright use lower rows. */
  html body.home-page .site-footer {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: minmax(180px, 0.9fr) minmax(260px, 1.1fr) minmax(280px, 1.4fr) !important;
    grid-template-rows: auto auto auto !important;
    align-items: center !important;
    column-gap: 25px !important;
    row-gap: 14px !important;
    padding: 28px clamp(32px, 4.4vw, 52px) 22px !important;
  }

  html body.home-page .site-footer > .footer-brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
  }

  html body.home-page .site-footer > .footer-note {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    align-self: center !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }

  html body.home-page .site-footer > .footer-location {
    grid-column: 3 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px 8px !important;
    min-width: 0 !important;
    margin: 0 !important;
    align-self: center !important;
  }

  html body.home-page .site-footer .footer-location-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  html body.home-page .site-footer .footer-location-item svg {
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    flex: 0 0 16px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }

  html body.home-page .site-footer .footer-location-separator {
    display: inline-block !important;
    line-height: 1 !important;
    color: #7d899c !important;
  }

  html body.home-page .site-footer > .footer-links {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    margin: 0 !important;
  }

  html body.home-page .site-footer > .footer-copyright {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    width: min(100%, 1040px) !important;
    margin: 0 !important;
    padding-top: 13px !important;
    border-top: 1px solid #edf0f5 !important;
  }
}

/* true desktop centering for the content sections from How It Works through Please Read.
   Keep one consistent width and equal viewport-side margins; mobile layout is untouched. */
@media  (min-width: 900px)  {
  html body.home-page main > section.site-section.how-section,
  html body.home-page main > section.site-section.about-section,
  html body.home-page main > section.site-section.purpose-section,
  html body.home-page main > section.site-section.safety-section,
  html body.home-page main > section.site-section.terms-section {
    position: relative !important;
    left: 50% !important;
    right: auto !important;
    width: min(1000px, calc(100vw - 64px)) !important;
    max-width: 1000px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
    box-sizing: border-box !important;
  }
}

/* Process heading: remove the kicker and keep the title 2px below the history card. */
html body.home-page .why-arisu-card > .process-heading-band {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  width: calc(100% + clamp(20px, 3.2vw, 38px) + clamp(20px, 3.2vw, 38px)) !important;
  max-width: none !important;
  margin-top: 2px !important;
  margin-bottom: 18px !important;
  margin-left: calc(0px - clamp(20px, 3.2vw, 38px)) !important;
  margin-right: calc(0px - clamp(20px, 3.2vw, 38px)) !important;
  padding: 2px 16px 2px !important;
  box-sizing: border-box !important;
  border-top: 1px solid rgba(112, 166, 255, .30) !important;
  border-bottom: 1px solid rgba(112, 166, 255, .30) !important;
  border-radius: 0 !important;
  background: linear-gradient(105deg, #e0f6ff 0%, #e7edff 50%, #fae4fa 100%) !important;
  text-align: center !important;
}
html body.home-page .why-arisu-card > .process-heading-band h2 {
  position: relative !important;
  top: 0 !important;
  margin: 0 0 6px !important;
  color: #152247 !important;
  line-height: 1.15 !important;
  letter-spacing: -.8px !important;
  font-size: clamp(30px, 4vw, 48px) !important;
}
html body.home-page .why-arisu-card > .process-heading-band p {
  margin: 0 !important;
  color: #435778 !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  transform: translateY(-2px) !important;
}
@media (max-width: 640px) {
  html body.home-page .why-arisu-card > .process-heading-band {
    width: calc(100% + 28px) !important;
    margin-top: 2px !important;
    margin-bottom: 14px !important;
    margin-left: -14px !important;
    margin-right: -14px !important;
    padding: 2px 12px 2px !important;
  }
  html body.home-page .why-arisu-card > .process-heading-band h2 {
    font-size: clamp(22px, 5.8vw, 25px) !important;
    margin: 0 0 5px !important;
    letter-spacing: -.5px !important;
  }
  html body.home-page .why-arisu-card > .process-heading-band p {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
}

/* Step 05 is the Facebook & Instagram assistance card, not a warranty card. */


/* place the account-safety reminder inside the Why Choose Arisu card,
   immediately below the account-choice note; the old standalone section is removed. */
html body.home-page .why-arisu-card > .safety-section-inline {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  position: static !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}
html body.home-page .why-arisu-card > .safety-section-inline .safety-panel {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 14px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 16px 18px !important;
  border: 1px solid rgba(132, 164, 255, .38) !important;
  border-radius: 18px !important;
  background: linear-gradient(115deg, rgba(255,255,255,.88), rgba(241,246,255,.88) 58%, rgba(252,239,255,.88)) !important;
  box-shadow: 0 8px 22px rgba(66, 91, 180, .07) !important;
}
html body.home-page .why-arisu-card > .safety-section-inline .safety-panel-icon {
  width: 48px !important; height: 48px !important; display: grid !important; place-items: center !important;
  border-radius: 15px !important; background: linear-gradient(145deg,#3c67f5,#2852e8) !important;
  color: #fff !important; box-shadow: 0 7px 16px rgba(48,91,232,.20) !important;
}
html body.home-page .why-arisu-card > .safety-section-inline h2 {
  margin: 0 0 8px !important; padding: 0 0 7px !important;
  border-bottom: 1px solid rgba(113,139,190,.25) !important;
  font-size: clamp(19px, 2.2vw, 25px) !important; line-height: 1.25 !important;
}
html body.home-page .why-arisu-card > .safety-section-inline .safety-panel p {
  margin: 0 0 7px !important; font-size: 14px !important; line-height: 1.55 !important;
}
html body.home-page .why-arisu-card > .safety-section-inline .safety-panel p:last-child {
  margin-bottom: 0 !important; color: #245be9 !important; font-weight: 700 !important;
}
@media  (max-width: 600px)  {
  html body.home-page .why-arisu-card > .safety-section-inline { margin-top: 8px !important; }
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel {
    grid-template-columns: 42px minmax(0,1fr) !important; gap: 10px !important;
    padding: 12px 11px !important; border-radius: 15px !important;
  }
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel-icon {
    width: 40px !important; height: 40px !important; border-radius: 12px !important;
  }
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel-icon svg { width: 23px !important; height: 23px !important; }
  html body.home-page .why-arisu-card > .safety-section-inline h2 { font-size: 18px !important; margin-bottom: 6px !important; padding-bottom: 6px !important; }
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel p { font-size: 12.5px !important; line-height: 1.45 !important; }
}

/* mobile-only two-column account recovery issue list. Desktop layout intentionally unchanged. */
@media  (max-width: 700px)  {
  html body.home-page .desktop-social-destination .services-section .service-issue-list {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 6px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-issue-list li {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 42px !important;
    padding: 7px 8px !important;
    gap: 7px !important;
    overflow-wrap: anywhere !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-issue-list li::before {
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
  }
  html body.home-page .desktop-social-destination .services-section .service-issue-list li:last-child {
    grid-column: 1 / -1 !important;
    width: 82% !important;
    justify-self: center !important;
  }
}

/* mobile-only Soft Blue Glass treatment for the reassurance note. Desktop styling/content remains unchanged. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-section .why-arisu-note {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    border: 1px solid rgba(123, 190, 255, .68) !important;
    border-radius: 15px !important;
    background: linear-gradient(125deg, rgba(232, 247, 255, .98) 0%, rgba(235, 241, 255, .97) 56%, rgba(249, 241, 255, .96) 100%) !important;
    box-shadow: 0 5px 16px rgba(48, 112, 190, .12), inset 0 1px 0 rgba(255,255,255,.95) !important;
    text-align: left !important;
  }
  html body.home-page .why-arisu-section .why-arisu-note > span {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 29px !important;
    width: 29px !important;
    height: 29px !important;
    border: 1px solid rgba(255,255,255,.78) !important;
    border-radius: 10px !important;
    color: #fff !important;
    background: linear-gradient(145deg, #17c8ed 0%, #2675f5 58%, #6557ed 100%) !important;
    box-shadow: 0 3px 9px rgba(45, 104, 226, .22) !important;
  }
  html body.home-page .why-arisu-section .why-arisu-note p {
    min-width: 0 !important;
    margin: 0 !important;
    line-height: 1.35 !important;
  }
  html body.home-page .why-arisu-section .why-arisu-note strong {
    color: #102b55 !important;
    font-size: .86rem !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
  }
  html body.home-page .why-arisu-section .why-arisu-note small {
    margin-top: 4px !important;
    color: #3d5677 !important;
    font-size: .75rem !important;
    line-height: 1.4 !important;
  }
}


/* Soft Blue Glass reassurance note on desktop and mobile. */
html body.home-page .why-arisu-section .why-arisu-note {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  margin-top: 10px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(123, 190, 255, .68) !important;
  border-radius: 15px !important;
  background: linear-gradient(125deg, rgba(232, 247, 255, .98) 0%, rgba(235, 241, 255, .97) 56%, rgba(249, 241, 255, .96) 100%) !important;
  box-shadow: 0 5px 16px rgba(48, 112, 190, .12), inset 0 1px 0 rgba(255,255,255,.95) !important;
  text-align: left !important;
}
html body.home-page .why-arisu-section .why-arisu-note > span {
  display: grid !important; place-items: center !important; flex: 0 0 30px !important;
  width: 30px !important; height: 30px !important;
  border: 1px solid rgba(255,255,255,.78) !important; border-radius: 10px !important;
  color: #fff !important; background: linear-gradient(145deg, #17c8ed 0%, #2675f5 58%, #6557ed 100%) !important;
  box-shadow: 0 3px 9px rgba(45, 104, 226, .22) !important;
}
html body.home-page .why-arisu-section .why-arisu-note-copy { min-width: 0 !important; margin: 0 !important; line-height: 1.4 !important; }
html body.home-page .why-arisu-section .why-arisu-note-copy strong { display: block !important; color: #102b55 !important; font-size: .94rem !important; line-height: 1.35 !important; font-weight: 800 !important; }
html body.home-page .why-arisu-section .why-arisu-note-copy small { display: block !important; margin-top: 4px !important; color: #3d5677 !important; font-size: .8rem !important; line-height: 1.45 !important; }
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-section .why-arisu-note { gap: 11px !important; margin-top: 8px !important; padding: 11px 12px !important; }
  html body.home-page .why-arisu-section .why-arisu-note-copy strong { font-size: .86rem !important; }
  html body.home-page .why-arisu-section .why-arisu-note-copy small { font-size: .75rem !important; }
}

/* lower the ARISU RECOVERY CONTACT divider 2px and raise its title 2px on desktop and mobile. */
html body.home-page .why-arisu-section .why-arisu-heading > .services-heading-divider {
  display: none !important;
}
html body.home-page .why-arisu-section .why-arisu-heading > .section-kicker {
  transform: translateY(-2px) !important;
}

/* subtle gradient divider above MY SERVICES on desktop and mobile. */
html body.home-page .services-section .services-heading-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(100%, 420px);
  height: 12px;
  margin: 0 auto 9px;
  position: relative;
}
html body.home-page .services-section .services-heading-divider::before,
html body.home-page .services-section .services-heading-divider::after {
  content: "";
  display: block;
  flex: 1 1 auto;
  height: 2px;
  border-radius: 999px;
}
html body.home-page .services-section .services-heading-divider::before {
  background: linear-gradient(90deg, rgba(93,151,255,0), #70a9ff 100%);
}
html body.home-page .services-section .services-heading-divider::after {
  background: linear-gradient(90deg, #2dbcf3 0%, rgba(45,188,243,0));
}
html body.home-page .services-section .services-heading-divider span {
  display: block;
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  margin: 0 10px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6dcfff, #3477f5);
  box-shadow: 0 0 0 3px rgba(79,151,255,.10), 0 1px 5px rgba(44,117,236,.22);
}
@media  (max-width: 700px)  {
  html body.home-page .services-section .services-heading-divider {
    width: min(92%, 320px);
    margin-bottom: 7px;
  }
}

/* make the offline status pulse visibly expand beyond the dot. */
html body.home-page #serviceStatus .service-status-dot {
  position: relative !important;
  isolation: isolate;
}
html body.home-page #serviceStatus .service-status-dot::after {
  content: "";
  position: absolute;
  inset: -3px;
  border: 1.5px solid rgba(19, 191, 112, .62);
  border-radius: 50%;
  pointer-events: none;
  animation: serviceStatusRingOnline 1.8s ease-out infinite;
}
html body.home-page #serviceStatus .service-status-dot.is-offline::after {
  border-color: rgba(220, 38, 38, .78);
  animation-name: serviceStatusRingOffline;
}
@keyframes  serviceStatusRingOnline  {
  0% { transform: scale(.72); opacity: .9; }
  100% { transform: scale(1.9); opacity: 0; }
}
@keyframes  serviceStatusRingOffline  {
  0% { transform: scale(.72); opacity: .95; }
  100% { transform: scale(1.9); opacity: 0; }
}
@media  (prefers-reduced-motion: reduce)  {
  html body.home-page #serviceStatus .service-status-dot::after { animation: none !important; }
}

/* raise only the header Privacy Policy button by 2px. */
html body .topbar > .header-meta > .privacy-link {
  transform: translateY(-2px) !important;
}

/* improve visibility of the social-media divider lines and label. */
html body.home-page .contact-divider {
  color: #34445d !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
  letter-spacing: 1px !important;
  text-shadow: 0 0 0.35px currentColor;
}
html body.home-page .contact-divider::before,
html body.home-page .contact-divider::after {
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #7dd3fc 0%, #3987f6 55%, #7dd3fc 100%) !important;
  opacity: 1 !important;
}
@media  (max-width: 600px)  {
  html body.home-page .contact-divider {
    font-size: 11px !important;
    letter-spacing: .75px !important;
  }
}
@media  (max-width: 370px)  {
  html body.home-page .contact-divider {
    font-size: 10px !important;
    letter-spacing: .4px !important;
  }
}

/* Aurora Glass header treatment — color-only; preserve layout and button colors. */
html body.home-page .topbar,
html body:not(.home-page) .topbar {
  background: linear-gradient(112deg,
    rgba(234, 244, 255, .96) 0%,
    rgba(237, 233, 254, .95) 52%,
    rgba(252, 231, 243, .94) 100%) !important;
  border-bottom: 1px solid rgba(151, 164, 220, .34) !important;
  box-shadow: 0 5px 22px rgba(91, 111, 176, .075),
              inset 0 1px 0 rgba(255, 255, 255, .88) !important;
  -webkit-backdrop-filter: saturate(155%) blur(16px);
  
}
html body.home-page .topbar .brand,
html body:not(.home-page) .topbar .brand {
  color: var(--ink);
}
@media  (prefers-reduced-transparency: reduce)  {
  html body.home-page .topbar,
  html body:not(.home-page) .topbar {
    background: linear-gradient(112deg, #EAF4FF 0%, #EDE9FE 52%, #FCE7F3 100%) !important;
  }
}

/* smart hide-on-scroll header; keeps layout flow stable. */
.topbar.topbar-scroll-aware {
  transition: transform 240ms cubic-bezier(.2, .7, .2, 1);
  will-change: transform;
}
.topbar.topbar-scroll-aware.topbar-scroll-hidden {
  transform: translateY(calc(-100% - 12px));
  pointer-events: none;
}
@media  (prefers-reduced-motion: reduce)  {
  .topbar.topbar-scroll-aware { transition: none !important; }
}

/* royal-blue primary header buttons with pearl-glass secondary action. */
html body .topbar > .header-meta > .proofs-header-link,
html body .topbar > .header-meta > .webtools-header-link {
  background: linear-gradient(115deg, #2563EB 0%, #4F46E5 100%) !important;
  color: #FFFFFF !important;
  border: 1px solid rgba(37, 67, 190, .32) !important;
  box-shadow: 0 3px 10px rgba(67, 82, 201, .18), inset 0 1px 0 rgba(255,255,255,.20) !important;
  font-weight: 750 !important;
  text-decoration: none !important;
  transition: box-shadow .18s ease, filter .18s ease, transform .18s ease !important;
}
html body .topbar > .header-meta > .proofs-header-link:hover,
html body .topbar > .header-meta > .webtools-header-link:hover {
  filter: brightness(1.06) saturate(1.04);
  box-shadow: 0 5px 14px rgba(67, 82, 201, .24), inset 0 1px 0 rgba(255,255,255,.24) !important;
}
html body .topbar > .header-meta > .privacy-link {
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(238,242,255,.94)) !important;
  color: #334155 !important;
  border: 1px solid #C7D2FE !important;
  box-shadow: 0 2px 8px rgba(71,85,150,.08), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
html body .topbar > .header-meta > .privacy-link:hover {
  background: linear-gradient(135deg, #FFFFFF, #E0E7FF) !important;
  border-color: #A5B4FC !important;
  color: #1E3A8A !important;
}
html body .topbar > .header-meta > .proofs-header-link:focus-visible,
html body .topbar > .header-meta > .webtools-header-link:focus-visible {
  outline: 3px solid #A5B4FC !important; outline-offset: 3px !important;
}
/* reduce Clear guidance note vertical padding by another 2px on mobile only. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-section .why-arisu-note {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }
}

/* reduce mobile Remember safety card vertical padding by another 2px per side. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel {
    padding-block: 6px !important;
  }
}

/* reduce the outer spacing below the Remember safety card by 4px on mobile. */


/* keep Clear Guidance lifted 4px and lift Remember another 4px on mobile. */


/* reduce only the bottom outer spacing after the Remember card by 8px on mobile. */


/* lift the Honest-through-Remember card group by another 2px on mobile. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-card > .why-arisu-grid {
    transform: translateY(-6px) !important;
  }
  html body.home-page .why-arisu-section .why-arisu-note {
    transform: translateY(-10px) !important;
  }
  html body.home-page .why-arisu-card > .safety-section-inline .safety-panel {
    transform: translateY(-14px) !important;
  }
}

/* reduce only the bottom padding of the Why Choose Arisu outer card by 8px on mobile. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-section .why-arisu-card {
    padding-bottom: 2px !important; /* previous effective value: 10px */
  }
}

/* reduce the outer card bottom spacing after Remember by another 2px on mobile. */
@media  (max-width: 640px)  {
  html body.home-page .why-arisu-card > .safety-section-inline {
    margin-bottom: -10px !important;
  }
}



/* reduce Daily Bible Verse card top and bottom padding by 4px on mobile. */

@media  (max-width: 380px)  {
  html body.home-page main > #daily-bible-verse.daily-verse-card {
    padding-top: 12px !important;
    padding-bottom: 11px !important;
  }
}
@media  (max-width: 600px) and (max-height: 780px)  {
  html body.home-page #daily-bible-verse.daily-verse-card {
    padding-top: 2px !important;
    padding-bottom: 3px !important;
  }
}

/* lift the account-recovery intro sentence 2px further (4px total). */
html body.home-page .compact-intro > p {
  transform: translateY(-4px);
}

/* remove only the outer green glow from the account-recovery badge; retain its green border and the dot/check styling. */
html body.home-page main > .compact-intro .eyebrow.premium-status {
  box-shadow: none !important;
  animation: eyebrow-fade-in 1s ease-out both !important;
}
@media  (prefers-reduced-motion: reduce)  {
  html body.home-page main > .compact-intro .eyebrow.premium-status {
    animation: none !important;
    opacity: 1;
    transform: none;
  }
}

/* lift the mobile intro heading and subtitle by 2px; lift the WhatsApp feature card 4px total. */
@media  (max-width: 600px)  {
  html body.home-page main > .compact-intro h1 {
    transform: translateY(-2px) !important;
  }
  html body.home-page main > .compact-intro > p {
    transform: translateY(-6px) !important; /* existing -4px plus another 2px */
  }
  html body.home-page #contact .whatsapp-feature-card {
    /* Keep the existing -8px visual offset separate from the shared reveal transform. */
    translate: 0 -8px !important;
  }
}


/* social card headers use text only; platform logos live in their action buttons.
   Tighten title-to-preview spacing by 2px without changing button placement or card structure. */
.social-collage .tiktok-showcase h3,
.social-collage .facebook-showcase h3 { margin-top: 0 !important; margin-bottom: 0 !important; }
.social-collage .social-profile-preview { margin-top: 2px !important; }
.social-collage .tiktok-profile-button,
.social-collage .facebook-profile-button { display: flex; align-items: center; justify-content: center; gap: 8px; }
.social-collage .tiktok-button-icon,
.social-collage .facebook-button-icon { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 24px; height: 24px; }
.social-collage .tiktok-button-icon svg { width: 23px; height: 23px; display: block; color: #fff; filter: drop-shadow(-1px 0 #fe2c55) drop-shadow(1px 0 #25f4ee); }
.social-collage .facebook-button-icon svg { width: 24px; height: 24px; display: block; color: #fff; }
@media  (max-width: 600px)  {
  .social-collage .tiktok-button-icon,
  .social-collage .facebook-button-icon { width: 22px; height: 22px; }
  .social-collage .tiktok-button-icon svg,
  .social-collage .facebook-button-icon svg { width: 22px; height: 22px; }
}

/* keep TikTok and Facebook action buttons equal in size; prevent Facebook label wrapping. */
.social-collage .tiktok-showcase .tiktok-profile-button,
.social-collage .facebook-showcase .facebook-profile-button {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 44px !important;
  white-space: nowrap !important;
  flex-wrap: nowrap !important;
  line-height: 1.2 !important;
}
@media  (max-width: 600px)  {
  .social-collage .tiktok-showcase .tiktok-profile-button,
  .social-collage .facebook-showcase .facebook-profile-button {
    min-height: 44px !important;
    white-space: nowrap !important;
  }
}


/* align both mobile headings, divider lines, previews, and action buttons. */
@media  (max-width: 600px)  {
  .social-collage > .recovery-proofs-showcase {
    padding-top: 8px; /* Lift Recovery Proofs content by 2px. */
  }

  .social-collage > .social-feedback-card {
    padding-top: 10px;
  }

  .social-collage > .social-feedback-card > .windows-feedback-content {
    padding-top: 0 !important;
  }

  /* Keep both headings on the same visual baseline. */

  /* The decorative heading arrow is removed from both cards. */

  /* Keep a deliberate 2px gap from divider to preview. */
  .social-collage > .recovery-proofs-showcase .recovery-proofs-preview,
  .social-collage > .social-feedback-card .reviews-grid-featured {
    margin-top: 2px !important;
  }

  /* Keep both action buttons 2px below their preview areas and lift them equally. */
  

  /* shorten the actual bordered Customer Feedback preview card by 6px
     at its bottom. Keep the View All Reviews button in normal flow and unchanged. */
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured {
    margin-bottom: 0 !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-card {
    height: calc(100% - 14px) !important;
    min-height: 0 !important;
    align-self: start !important;
    box-sizing: border-box !important;
  }
  
}

/* normalize mobile CTA typography and prevent labels being squeezed by icon flex sizing.
   Keep preview images/cards untouched; this block is authoritative only for the two action buttons. */
@media (max-width: 600px) {
  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proofs-button,
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all {
    position: relative !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    flex: 0 0 48px !important;
    margin: 0 !important;
    padding: 5px 10px !important;
    overflow: hidden !important;
    white-space: normal !important;
    text-decoration: none !important;
    transform: none !important;
  }

  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proofs-button-icon,
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all .feedback-button-icon {
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proofs-button-icon svg,
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all .feedback-button-icon svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 22px !important;
  }

  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proofs-button-label,
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all .view-button-label {
    display: block !important;
    box-sizing: border-box !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 4px 0 28px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all > span[aria-hidden="true"]:not(.feedback-button-icon) {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}

/* lift only the Customer Feedback / View All Reviews button by 6px on mobile.
   Keep the Recovery Proofs button, preview image, and card dimensions unchanged. */
@media (max-width: 600px) {
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all {
    transform: translateY(-6px) !important;
  }
}

/* raise only the TikTok and Facebook showcase titles by 8px total on mobile. */


/* one authoritative mobile divider rule for TikTok and Facebook titles.
   The line belongs to the same h3 box as the title, so legacy head-level borders/pseudo-elements cannot leave it behind. */


/* desktop regression fix: use the original full-color profile screenshots on desktop.
   The transparent desktop-clean assets were revealing large purple/blue frame areas and making the previews look broken.
   Mobile behavior remains unchanged; desktop card structure and dimensions are preserved. */
@media (min-width: 601px) {
  html body.home-page .social-collage > .tiktok-showcase .social-profile-preview .preview-original,
  html body.home-page .social-collage > .facebook-showcase .social-profile-preview .preview-original {
    display: block !important;
  }
}

/* Service Status uses the WhatsApp card's content width without a column-height flex-basis. */
@media (min-width: 601px) {
  html body.home-page main > #contact.wizard-card.contact-only > #serviceStatus.service-status-panel {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* remove the redundant WhatsApp sentence and lift only its card by 2px. */
body.home-page #contact .whatsapp-feature-card { margin-top: -2px !important; }

/* lower only the FASTEST CONTACT METHOD label by 2px. */
html body.home-page #contact .whatsapp-feature-kicker {
  transform: translateY(2px) !important;
}

/* remove the four social collage heading rows and place every preview 2px below its outer card border.
   Only top spacing is adjusted; side/bottom padding, previews, buttons, destinations, and other sections remain unchanged. */
html body.home-page .social-collage > .tiktok-showcase,
html body.home-page .social-collage > .facebook-showcase,
html body.home-page .social-collage > .recovery-proofs-showcase,
html body.home-page .social-collage > .social-feedback-card {
  padding-top: 0 !important;
}
/* lift only the TikTok and Facebook preview areas by an additional 2px.
   Their top margin is now 0px (previously 2px); Recovery Proofs and Customer Feedback retain their 2px spacing. */
html body.home-page .social-collage > .tiktok-showcase > .social-profile-preview,
html body.home-page .social-collage > .facebook-showcase > .social-profile-preview {
  margin-top: 0 !important;
}

html body.home-page .social-collage > .social-feedback-card > .windows-feedback-content {
  padding-top: 0 !important;
}

/* lower only the TikTok, Facebook Page, and Recovery Proofs image previews by 6px.
   Customer Feedback and all outer cards, buttons, and surrounding layout remain unchanged. */
html body.home-page .social-collage > .tiktok-showcase > .social-profile-preview,
html body.home-page .social-collage > .facebook-showcase > .social-profile-preview,
html body.home-page .social-collage > .recovery-proofs-showcase > .recovery-proofs-preview {
  transform: translateY(6px) !important;
}

/* reduce only the bottom padding of the TikTok, Facebook Page, and Recovery Proofs outer cards to 6px. */
html body.home-page .social-collage > .tiktok-showcase,
html body.home-page .social-collage > .facebook-showcase,
html body.home-page .social-collage > .recovery-proofs-showcase {
  padding-bottom: 6px !important;
}

/* Customer Feedback desktop preview frame.
   Keep the portrait screenshot centered and rounded inside a soft bordered frame.
   Maintain exactly 6px above and below the frame; mobile rules remain unchanged. */
@media (min-width: 601px) {
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    align-items: stretch !important;
    min-height: 0 !important;
    margin: 6px 0 6px !important;
    padding: 6px !important;
    border: 1px solid rgba(151, 143, 255, .32) !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #fce7ff 0%, #f2e8ff 24%, #e4edff 55%, #e4f5ff 78%, #f8eaff 100%) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-card {
    display: flex !important;
    align-items: stretch !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    box-sizing: border-box !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 14px !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    display: block !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    margin: 0 auto !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    background: transparent !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
  html body.home-page .social-collage > .social-feedback-card .social-feedback-view-all {
    margin-top: 0 !important;
    flex: 0 0 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
  }
}

/* Preserve the pre-existing Customer Feedback preview behavior on mobile. */
@media (max-width: 600px) {
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured {
    margin-top: 6px !important;
    margin-bottom: -4px !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-card {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    overflow: hidden !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-proof-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  html body.home-page .social-collage > .social-feedback-card .reviews-grid-featured .review-image-hint {
    display: none !important;
  }
}

/* resolve the conflicting parent/child transforms in Recovery Proofs.
   The preview container is intentionally 6px lower from the earlier positioning adjustment.
   Move each complete preview tile up 8px/10px so the net visible position is 2px/4px UP
   from its prior baseline. Do not transform the image separately; hover only scales it. */

html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img {
  
  transform: none !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase:hover .recovery-proof-preview-item img {
  transform: scale(1.025) !important;
}

/* Recovery Proofs preview returns to 4px top spacing; raise its button by 4px.
   Neutralize earlier wrapper/tile transforms so the spacing is deterministic. */
html body.home-page .social-collage > .recovery-proofs-showcase > .recovery-proofs-preview {
  margin-top: 4px !important;
  transform: none !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase > .recovery-proofs-preview > .recovery-proof-preview-item:first-child {
  transform: none !important;
}
/* move only the Disabled Accounts preview tile 2px further upward (4px total). */
html body.home-page .social-collage > .recovery-proofs-showcase > .recovery-proofs-preview > .recovery-proof-preview-item:nth-child(2) {
  transform: translateY(-8px) !important;
}
/* Keep the Recovery Proofs button positioning and lift in one rule. */
html body.home-page .social-collage > .recovery-proofs-showcase > .recovery-proofs-button {
  position: relative !important;
  transform: translateY(-7px) !important;
}

/* fix the real bottom-gap owners instead of padding the inner preview tiles.
   The Recovery Proofs and Customer Feedback outer cards now retain only a 2px bottom inset.
   Override the nested mobile content padding that previously kept an 8px gap. */
html body.home-page .social-collage > .recovery-proofs-showcase {
  padding-bottom: 2px !important;
  box-sizing: border-box !important;
}
html body.home-page .social-collage > .social-feedback-card {
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
}
html body.home-page .social-collage > .social-feedback-card > .windows-feedback-content {
  padding-bottom: 2px !important;
  box-sizing: border-box !important;
}

/* remove external-link arrows from TikTok/Facebook buttons and refine icon-label alignment. */
html body.home-page .social-collage .tiktok-profile-button,
html body.home-page .social-collage .facebook-profile-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-align: center !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}
html body.home-page .social-collage .tiktok-button-icon,
html body.home-page .social-collage .facebook-button-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: 17px !important;
  height: 17px !important;
  line-height: 1 !important;
}
html body.home-page .social-collage .tiktok-button-icon svg,
html body.home-page .social-collage .facebook-button-icon svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

/* TikTok/Facebook outer cards stay 4px higher; Recovery Proofs and Customer Feedback move an additional 4px upward. */
html body.home-page .social-collage > .tiktok-showcase,
html body.home-page .social-collage > .facebook-showcase {
  position: relative !important;
  top: -4px !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase,
html body.home-page .social-collage > .social-feedback-card {
  position: relative !important;
  top: -8px !important;
}

/* enlarge only the Suspended and Disabled preview images horizontally by 4px per side. Keep the tile labels, outer card, vertical size, and button positions unchanged. */
html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item {
  overflow: visible !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img {
  position: relative !important;
  left: -4px !important;
  width: calc(100% + 8px) !important;
  max-width: none !important;
  height: 100% !important;
  object-fit: cover !important;
  box-sizing: border-box !important;
}

/* restore rounded corners on the enlarged Suspended/Disabled preview images without changing tile dimensions or layout. */
html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item {
  box-shadow: none !important;
  filter: none !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img {
  border-radius: 11px !important;
}
html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item > span {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border-radius: 0 0 11px 11px !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.95), 0 0 5px rgba(0,0,0,.75) !important;
  padding: 8px 8px 7px !important;
}
@media (max-width: 600px) {
  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item img { border-radius: 9px !important; }
  html body.home-page .social-collage > .recovery-proofs-showcase .recovery-proof-preview-item > span { border-radius: 0 0 9px 9px !important; }
}

/* reduce only the Daily Bible Verse card top and bottom padding by 4px; preserve horizontal padding and layout. */
html body.home-page main > #daily-bible-verse.daily-verse-card { padding-top: 5px !important; padding-bottom: 5px !important; }
@media (max-width: 600px) { html body.home-page main > #daily-bible-verse.daily-verse-card { padding-top: 6px !important; padding-bottom: 6px !important; } }

/* Premium glass WhatsApp card; preserve its existing 4px lift and geometry. */
html body.home-page #contact .whatsapp-feature-card {
  position: relative !important;
  top: -4px !important;
  background: linear-gradient(118deg, rgba(255,255,255,.94) 0%, rgba(246,249,255,.88) 52%, rgba(235,248,255,.90) 100%) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  border-radius: 22px !important;
  box-shadow: 0 10px 28px rgba(57, 86, 170, .13), inset 0 1px 0 rgba(255,255,255,.95) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.12) !important;
  
  overflow: hidden;
}
html body.home-page #contact .whatsapp-feature-icon {
  background: linear-gradient(145deg, #35dc91 0%, #16b96d 56%, #07965b 100%) !important;
  border: 1px solid rgba(255,255,255,.76) !important;
  box-shadow: 0 7px 18px rgba(23, 176, 103, .22), inset 0 1px 0 rgba(255,255,255,.4) !important;
}
html body.home-page #contact .whatsapp-feature-icon::before {
  border: 1px solid rgba(255,255,255,.24) !important;
}
html body.home-page #contact .whatsapp-feature-kicker { color: #2f6890 !important; }
html body.home-page #contact .whatsapp-recommended {
  background: rgba(224, 246, 255, .82) !important;
  border: 1px solid rgba(155, 205, 237, .65) !important;
  color: #245c88 !important;
  border-radius: 999px !important;
}
html body.home-page #contact .whatsapp-feature-content h2 { color: #1b2b50 !important; }
html body.home-page #contact .whatsapp-feature-content h2 span { color: #168c59 !important; }
html body.home-page #contact .whatsapp-feature-card .whatsapp-button {
  background: linear-gradient(112deg, #20c878 0%, #13ad68 55%, #07985b 100%) !important;
  border: 1px solid rgba(255,255,255,.58) !important;
  color: #fff !important;
  border-radius: 15px !important;
  box-shadow: 0 7px 17px rgba(14, 166, 94, .22), inset 0 1px 0 rgba(255,255,255,.24) !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.08);
}
html body.home-page #contact .whatsapp-feature-card .whatsapp-button:hover {
  filter: brightness(1.035) !important;
  box-shadow: 0 9px 20px rgba(14, 166, 94, .26), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html body.home-page #contact .whatsapp-feature-card .whatsapp-button:focus-visible {
  outline: 3px solid rgba(32, 200, 120, .35) !important; outline-offset: 3px !important;
}



/* replace the divider above MY SERVICES with a subtle rounded heading card. */
html body.home-page .services-section > .services-heading {
  box-sizing: border-box;
  
  
  
  
  
  
}
html body.home-page .services-section > .services-heading .section-kicker {
  margin-top: 0 !important;
}
@media (max-width: 700px) {
  html body.home-page .services-section > .services-heading {
    width: 100%;
    margin-bottom: 18px !important;
    padding: 16px 14px 15px !important;
    border-radius: 16px !important;
  }
}

/* approved centered Premium Rounded Card preview for MY SERVICES. */
html body.home-page .services-section > .services-heading {
 text-align:center !important; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
 width:min(100%,1100px); padding:30px 28px 2px !important; margin:0 auto 24px !important;
 border:1px solid rgba(111,169,239,.55) !important; border-radius:26px !important;
 background:radial-gradient(ellipse at 0% 100%,rgba(211,231,255,.55),transparent 36%),radial-gradient(ellipse at 100% 0%,rgba(225,237,255,.48),transparent 32%),linear-gradient(145deg,rgba(255,255,255,.99),rgba(246,249,255,.98)) !important;
 box-shadow:0 10px 28px rgba(53,103,174,.09),inset 0 1px 0 rgba(255,255,255,.98) !important;
}
html body.home-page .services-section > .services-heading .section-kicker { display:inline-flex; align-items:center; justify-content:center; gap:9px; padding:8px 18px !important; margin:0 auto 5px !important; border:1px solid rgba(99,157,235,.28); border-radius:999px; background:linear-gradient(135deg,#edf5ff,#e1edff); box-shadow:0 4px 12px rgba(52,112,195,.10),inset 0 1px 0 rgba(255,255,255,.95); color:#2465c5 !important; letter-spacing:.09em; }
html body.home-page .services-section > .services-heading h2,html body.home-page .services-section > .services-heading > p { width:100%; text-align:center !important; margin-left:auto !important; margin-right:auto !important; }
html body.home-page .services-section > .services-heading .services-intro { max-width:760px; position:relative; top:-22px; margin-bottom:-22px !important; }
@media(max-width:700px){html body.home-page .services-section > .services-heading{width:100%;gap:8px;padding:22px 15px 2px !important;margin-bottom:18px !important;border-radius:20px !important;}html body.home-page .services-section > .services-heading .section-kicker{padding:7px 14px !important;margin-bottom:3px !important;}}

/* Keep the existing small offsets for content inside the MY SERVICES card only. */
html body.home-page .services-section > .services-heading .section-kicker {
  position: relative !important;
  top: 4px !important;
}
html body.home-page .services-section > .services-heading > h2 {
  position: relative !important;
  top: -4px !important;
}
html body.home-page .services-section > .services-heading > p:first-of-type {
  position: relative !important;
  top: -12px !important;
}

/* compact highlighted labels for the two Recovery Proofs preview images.
   Keep the existing small-label feel; use contrast and a restrained glow rather than oversized badges. */
html body.home-page .social-collage .recovery-proofs-showcase .recovery-proof-preview-item > span,
html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item > span {
  position: absolute !important;
  inset: auto 6px 6px 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 28px !important;
  box-sizing: border-box !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(67, 151, 255, .88) !important;
  border-radius: 8px !important;
  background: linear-gradient(110deg, rgba(3, 17, 48, .88), rgba(5, 35, 92, .90)) !important;
  box-shadow: 0 1px 5px rgba(0, 90, 220, .28), inset 0 1px 0 rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-size: clamp(9px, .82vw, 11px) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: .015em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.8) !important;
}
html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item:nth-child(1) > span::before {
  content: "!" !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  border: 1px solid #62b7ff !important;
  border-radius: 5px 5px 6px 6px !important;
  background: linear-gradient(145deg, #278bff, #0748c8) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-shadow: none !important;
  box-shadow: 0 0 4px rgba(0,132,255,.3) !important;
}
html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item:nth-child(2) > span {
  border-color: rgba(255, 93, 111, .88) !important;
  background: linear-gradient(110deg, rgba(25, 7, 15, .90), rgba(65, 8, 20, .91)) !important;
  box-shadow: 0 1px 5px rgba(255, 42, 72, .24), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item:nth-child(2) > span::before {
  content: "⊘" !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  border: 1px solid #ff8792 !important;
  border-radius: 50% !important;
  background: linear-gradient(145deg, #ff697b, #d91f3e) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-shadow: none !important;
  box-shadow: 0 0 4px rgba(255,45,75,.28) !important;
}
@media (max-width: 600px) {
  html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item > span {
    inset: auto 5px 5px 5px !important;
    min-height: 25px !important;
    gap: 4px !important;
    padding: 4px 6px !important;
    border-radius: 7px !important;
    font-size: clamp(9px, 2.5vw, 11px) !important;
    letter-spacing: 0 !important;
  }
  html body.home-page .recovery-proofs-showcase .recovery-proof-preview-item > span::before {
    flex-basis: 14px !important;
    width: 14px !important;
    height: 14px !important;
    font-size: 10px !important;
  }
}

/* restore the original static green lightning Recommended icon. */
html body.home-page #contact .whatsapp-recommended {
  gap: 6px;
  background: #e6f7fc;
  border-color: #b7e4ed;
  color: #315c70;
}
html body.home-page #contact .whatsapp-recommended .recommended-bolt {
  display: inline-block;
  flex: 0 0 auto;
  width: 13px;
  height: 16px;
  fill: #16a765;
  stroke: #16a765;
  stroke-width: .35;
  filter: none;
  animation: none !important;
  transform: none !important;
}
html body.home-page #contact .whatsapp-recommended .recommended-bolt path {
  animation: none !important;
  transform: none !important;
}

/* Soft green pulse for the closed floating shortcut on the home page; no layout changes. */
html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp::before {
  inset: -4px !important;
  border: 2px solid rgba(36, 220, 139, .88) !important;
  box-shadow: 0 0 0 1px rgba(37, 211, 102, .16), 0 0 12px rgba(37, 211, 102, .34) !important;
  animation: arisuWhatsAppRing497 1.8s cubic-bezier(.16,.62,.3,1) infinite !important;
}
html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp {
  animation: arisuWhatsAppHalo497 1.8s ease-in-out infinite !important;
}
@keyframes arisuWhatsAppRing497 {
  0% { opacity: .88; transform: scale(.94); border-width: 2px; }
  65% { opacity: .38; }
  100% { opacity: 0; transform: scale(1.55); border-width: 1px; }
}
@keyframes arisuWhatsAppHalo497 {
  0%, 100% { box-shadow: inset 0 1px 2px rgba(255,255,255,.82), inset 0 -5px 12px rgba(6,24,84,.35), 0 7px 22px rgba(22,87,205,.34), 0 0 12px rgba(37,211,102,.22); }
  50% { box-shadow: inset 0 1px 2px rgba(255,255,255,.9), inset 0 -5px 12px rgba(6,24,84,.3), 0 8px 24px rgba(22,87,205,.4), 0 0 19px rgba(37,211,102,.46); }
}
@media (prefers-reduced-motion: reduce) {
  html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp::before,
  html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp { animation: none !important; }
}

/* Keep the WhatsApp card icon static; the floating shortcut has its own separate pulse. */
/* remove animation from the WhatsApp card icon only.
   Keep the green tile, WhatsApp mark, static border, and card geometry unchanged. */
html body.home-page #contact .whatsapp-feature-icon::after {
  content: none !important;
  display: none !important;
  animation: none !important;
  transform: none !important;
}
html body.home-page #contact .whatsapp-feature-icon::before {
  animation: none !important;
}

/* Mobile-only soft floating shortcut pulse; desktop retains its separate pulse styling. */
@media (max-width: 767px) {
  html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp::before {
    inset: -3px !important;
    border-width: 1.5px !important;
    border-color: rgba(54, 218, 145, .58) !important;
    box-shadow: 0 0 0 1px rgba(37, 211, 102, .08), 0 0 7px rgba(37, 211, 102, .16) !important;
    animation: arisuMobileSoftRing499 3s cubic-bezier(.16,.62,.3,1) infinite !important;
  }
  html body.home-page .floating-menu:not([data-state="open"]) #floatingWhatsApp {
    animation: arisuMobileSoftHalo499 3s ease-in-out infinite !important;
  }
}
@keyframes arisuMobileSoftRing499 {
  0% { opacity: .58; transform: scale(.96); }
  70% { opacity: .22; }
  100% { opacity: 0; transform: scale(1.38); }
}
@keyframes arisuMobileSoftHalo499 {
  0%, 100% { box-shadow: inset 0 1px 2px rgba(255,255,255,.82), inset 0 -5px 12px rgba(6,24,84,.35), 0 7px 22px rgba(22,87,205,.34), 0 0 8px rgba(37,211,102,.12); }
  50% { box-shadow: inset 0 1px 2px rgba(255,255,255,.9), inset 0 -5px 12px rgba(6,24,84,.3), 0 8px 23px rgba(22,87,205,.38), 0 0 12px rgba(37,211,102,.22); }
}


/* Option 5 — 3D Glass Card for the floating shortcut menu.
   Scope is limited to the floating panel and its shortcut rows; geometry,
   mobile sizing, links, open/close behavior, and orb animation stay unchanged. */
html body.home-page .floating-menu-items:not([hidden]) {
  background: linear-gradient(145deg,
    rgba(255,255,255,.78) 0%,
    rgba(174,205,255,.48) 28%,
    rgba(161,125,255,.40) 62%,
    rgba(233,190,255,.50) 100%) !important;
  border: 1px solid rgba(255,255,255,.96) !important;
  box-shadow:
    0 18px 38px rgba(57,69,153,.24),
    0 5px 14px rgba(64,164,255,.16),
    inset 0 1px 0 rgba(255,255,255,.98),
    inset 0 -2px 0 rgba(109,115,255,.18) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.35) !important;
  
}
html body.home-page .floating-menu-item {
  background: linear-gradient(135deg,
    rgba(255,255,255,.76) 0%,
    rgba(240,245,255,.64) 52%,
    rgba(220,232,255,.58) 100%) !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 5px 12px rgba(44,69,139,.10),
    inset 0 1px 0 rgba(255,255,255,.96),
    inset 0 -1px 0 rgba(105,125,211,.10) !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
html body.home-page .floating-menu-item:hover {
  transform: translateY(-1px) !important;
  background: linear-gradient(135deg,
    rgba(255,255,255,.94) 0%,
    rgba(231,240,255,.84) 55%,
    rgba(228,220,255,.78) 100%) !important;
  box-shadow:
    0 8px 16px rgba(44,69,139,.15),
    inset 0 1px 0 rgba(255,255,255,1) !important;
}
html body.home-page .floating-menu-item:active {
  transform: translateY(0) scale(.99) !important;
}
@media (prefers-reduced-motion: reduce) {
  html body.home-page .floating-menu-item { transition: none !important; }
}


/* Restrained pearl-glass treatment for existing header actions. */
html body .topbar > .header-meta > .proofs-header-link,
html body .topbar > .header-meta > .webtools-header-link {
  background: linear-gradient(135deg, rgba(255,255,255,.78) 0%, rgba(232,241,255,.66) 100%) !important;
  color: #183766 !important;
  border: 1px solid rgba(119, 157, 224, .48) !important;
  -webkit-backdrop-filter: saturate(145%) blur(12px);
  
  box-shadow: 0 4px 14px rgba(53, 88, 157, .10),
              inset 0 1px 0 rgba(255,255,255,.92) !important;
}
html body .topbar > .header-meta > .proofs-header-link .header-icon,
html body .topbar > .header-meta > .webtools-header-link .header-icon {
  color: #2865d7;
}
html body .topbar > .header-meta > .proofs-header-link:hover,
html body .topbar > .header-meta > .webtools-header-link:hover {
  background: linear-gradient(135deg, rgba(255,255,255,.94) 0%, rgba(224,237,255,.86) 100%) !important;
  border-color: rgba(74, 123, 215, .62) !important;
  box-shadow: 0 6px 17px rgba(53, 88, 157, .15),
              inset 0 1px 0 rgba(255,255,255,.98) !important;
}
html body .topbar > .header-meta > .proofs-header-link:active,
html body .topbar > .header-meta > .webtools-header-link:active {
  transform: translateY(0) scale(.985);
}
html body .topbar > .header-meta > .proofs-header-link:focus-visible,
html body .topbar > .header-meta > .webtools-header-link:focus-visible {
  outline: 3px solid rgba(96, 150, 255, .72) !important;
}
@media (prefers-reduced-transparency: reduce) {
  html body .topbar > .header-meta > .proofs-header-link,
  html body .topbar > .header-meta > .webtools-header-link {
    background: linear-gradient(135deg, #FFFFFF 0%, #EAF1FF 100%) !important;
    -webkit-backdrop-filter: none;
    
  }
}
@media (prefers-reduced-motion: reduce) {
  html body .topbar > .header-meta > .proofs-header-link,
  html body .topbar > .header-meta > .webtools-header-link {
    transition: none !important;
  }
}



html body.home-page #contact .whatsapp-feature-card .whatsapp-button {
  position: relative !important;
  top: -8px !important;
}
html body.home-page #contact .whatsapp-feature-card {
  padding-bottom: 16px !important;
}
@media (max-width: 600px) {
  html body.home-page #contact .whatsapp-feature-card {
    padding-bottom: 0 !important;
  }
  html body.home-page #contact .whatsapp-feature-card .whatsapp-button {
    margin-bottom: -3px !important;
  }
}


html body.home-page #contact #serviceStatus.service-status-panel {
  position: relative !important;
  top: 0 !important;
  transform: translateY(-22px) !important;
}
@media (max-width: 600px) {
  html body.home-page #contact #serviceStatus.service-status-panel {
    top: 0 !important;
    transform: translateY(-24px) !important;
  }
}




html body.home-page #contact #serviceStatus > .service-status-main > h2,
html body.home-page #contact #serviceStatus > .service-status-details,
html body.home-page #contact #serviceStatus > .service-benefit-row {
  position: relative !important;
  top: 0 !important;
  transform: translateY(-8px) !important;
}



html body.home-page #contact #serviceStatus .service-status-label > span:first-child {
  position: relative !important;
  top: 0 !important;
  transform: translateY(-7px) !important;
}



html body.home-page #contact #serviceStatus.service-status-panel {
  padding-bottom: 8px !important;
}
@media (max-width: 600px) {
  html body.home-page #contact #serviceStatus.service-status-panel {
    padding-bottom: 0 !important;
  }
  html body.home-page #contact #serviceStatus > .service-benefit-row {
    margin-bottom: -1px !important;
  }
}



/* Preserve the existing scam-card offset on mobile/tablet. */
@media (max-width: 899px) {
  html body.home-page .desktop-social-destination > .scam-awareness-card,
  html body.home-page .scam-awareness-card {
    --arc-reveal-offset: -26px !important;
  }
}

/* Desktop-only: move the Scam Awareness card 6px upward without moving Service Status. */
@media (min-width: 900px) {
  html body.home-page .desktop-social-destination > .scam-awareness-card {
    --arc-reveal-offset: -32px !important;
  }
}



html body.home-page .contact-divider {
  translate: 0 -26px !important;
  --arc-reveal-offset: 0px !important;
}


html body.home-page .desktop-social-destination > .social-collage > .tiktok-showcase,
html body.home-page .desktop-social-destination > .social-collage > .facebook-showcase,
html body.home-page .desktop-social-destination > .social-collage > .recovery-proofs-showcase,
html body.home-page .desktop-social-destination > .social-collage > .social-feedback-card,
html body.home-page #contact > .social-collage > .tiktok-showcase,
html body.home-page #contact > .social-collage > .facebook-showcase,
html body.home-page #contact > .social-collage > .recovery-proofs-showcase,
html body.home-page #contact > .social-collage > .social-feedback-card {
  --arc-reveal-offset: -26px !important;
}



html body.home-page .services-section > .services-heading {
  position: relative !important;
  top: -34px !important;
}



html body.home-page .services-section > .services-grid > .service-card.recovery-service-card {
  --arc-reveal-offset: -42px !important;
}



html body.home-page .services-section > .services-grid > .service-card.deletion-service-card {
  position: relative !important;
  top: auto !important;
  translate: 0 -46px !important;
}
html body.home-page .why-arisu-section > .why-arisu-card {
  position: relative !important;
  top: auto !important;
  translate: 0 -50px !important;
}
/* Desktop-only outer-card spacing: keep a consistent 12px visual gap through Purpose, Terms, and About.
   Use one matching card offset plus one section margin rule; tablet/mobile positioning remains unchanged. */
@media (min-width: 900px) {
  html body.home-page main > section.site-section.purpose-section,
  html body.home-page main > section.site-section.terms-section,
  html body.home-page main > section.site-section.about-section {
    margin-block-start: 12px !important;
  }
  html body.home-page main > section.site-section.purpose-section > .purpose-card,
  html body.home-page main > section.site-section.terms-section > .terms-card,
  html body.home-page main > section.site-section.about-section > .about-card {
    position: relative !important;
    top: auto !important;
    translate: 0 -50px !important;
  }
}
@media (max-width: 899px) {
  html body.home-page main > section.site-section.purpose-section > .purpose-card {
    position: relative !important;
    top: auto !important;
    translate: 0 -58px !important;
  }
  html body.home-page main > section.site-section.terms-section > .terms-card {
    position: relative !important;
    top: auto !important;
    translate: 0 -64px !important;
  }
  html body.home-page main > section.site-section.about-section > .about-card {
    position: relative !important;
    top: auto !important;
    translate: 0 -70px !important;
  }
}


html body.home-page .site-footer {
  margin-top: -62px !important;
}



/* retain the text offsets, but collapse the creator block's reserved space. */
html body.home-page .purpose-card > h2 {
  position: relative;
  top: -6px;
}
html body.home-page .purpose-card > p:not(.purpose-mantra) {
  position: relative;
  top: -8px;
}
html body.home-page .purpose-card > .purpose-mantra {
  position: relative;
  top: -16px;
}
html body.home-page .purpose-card .purpose-signoff {
  position: relative;
  top: -14px;
  margin-top: 2px !important;
  margin-bottom: -14px !important;
  padding-top: 2px !important;
}


/* desktop-only spacing below WhatsApp card; leave Service Status position unchanged. */
@media (min-width: 900px) {
  html body.home-page #contact .whatsapp-feature-card {
    padding-bottom: 30px !important;
  }
}


/* reduce only the two requested headings on mobile; preserve desktop typography. */
@media (max-width: 640px) {
  html body.home-page .services-section > .services-heading h2 {
    font-size: clamp(23px, 6.2vw, 28px) !important;
    letter-spacing: -0.6px !important;
  }
  html body.home-page .why-arisu-section .why-arisu-heading h2 {
    font-size: 23px !important;
  }
}


/* Hot Pink + Electric Purple + White Core rotating light trails around the WhatsApp button border.
   Hot pink and electric-purple trails with bright white cores; geometry and timing stay unchanged. */
@property --wa-trace-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
@property --wa-trace-angle-reverse {
  syntax: "<angle>";
  inherits: false;
  initial-value: 180deg;
}
.whatsapp-feature-card .whatsapp-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.whatsapp-feature-card .whatsapp-button::before,
.whatsapp-feature-card .whatsapp-button::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  padding: 3px;
  border-radius: inherit;
  pointer-events: none;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
}
.whatsapp-feature-card .whatsapp-button::before {
  background: conic-gradient(
    from var(--wa-trace-angle),
    transparent 0deg 20deg,
    rgba(255, 61, 206, .28) 31deg,
    rgba(255, 61, 206, .78) 43deg,
    rgba(255, 255, 255, .98) 52deg,
    #ffffff 59deg,
    #ff3dce 64deg,
    rgba(168, 85, 247, .88) 72deg,
    transparent 84deg 360deg
  );
  filter: drop-shadow(0 0 4px rgba(255, 61, 206, .98));
  animation: wa-border-trace 2.8s linear infinite;
}
.whatsapp-feature-card .whatsapp-button::after {
  background: conic-gradient(
    from var(--wa-trace-angle-reverse),
    transparent 0deg 23deg,
    rgba(168, 85, 247, .28) 34deg,
    rgba(168, 85, 247, .78) 45deg,
    rgba(255, 255, 255, .98) 54deg,
    #ffffff 60deg,
    #a855f7 65deg,
    rgba(255, 61, 206, .82) 73deg,
    transparent 85deg 360deg
  );
  filter: drop-shadow(0 0 4px rgba(168, 85, 247, .98));
  animation: wa-border-trace-reverse 3.2s linear infinite;
}
.whatsapp-feature-card .whatsapp-button > * {
  position: relative;
  z-index: 1;
}
@keyframes wa-border-trace {
  to { --wa-trace-angle: 360deg; }
}
@keyframes wa-border-trace-reverse {
  to { --wa-trace-angle-reverse: -180deg; }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-feature-card .whatsapp-button::before,
  .whatsapp-feature-card .whatsapp-button::after {
    animation: none !important;
  }
  .whatsapp-feature-card .whatsapp-button::before {
    background: linear-gradient(135deg, transparent 35%, rgba(255, 61, 206, .82) 50%, transparent 65%);
    opacity: .35;
  }
  .whatsapp-feature-card .whatsapp-button::after {
    background: linear-gradient(45deg, transparent 35%, rgba(168, 85, 247, .78) 50%, transparent 65%);
    opacity: .3;
  }
}


/* fixed mobile bottom navigation with a dedicated Recovery Stories shortcut. */
.mobile-bottom-nav { display:none; }
@media screen and (max-width: 700px) {
  html body.home-page { padding-bottom: calc(84px + env(safe-area-inset-bottom)) !important; }
  /* Keep the restored floating quick-access menu available on mobile too. */
  html body.home-page .mobile-bottom-nav {
    /* Navigation is tap-only: suppress text selection, image callouts, and long-press menus. */
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    user-select:none;
    position:fixed;
    left:0; right:0; bottom:0;
    z-index:2147482500;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    align-items:end;
    gap:2px;
    padding:2px 8px calc(7px + env(safe-area-inset-bottom));
    min-height:72px;
    background:rgba(15,24,45,.97);
    border-top:1px solid rgba(174,198,255,.32);
    box-shadow:0 -8px 28px rgba(20,35,70,.18);
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
  }
  html body.home-page .mobile-nav-item {
    min-width:0;
    min-height:58px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    padding:3px 0;
    border:0;
    border-radius:12px;
    background:transparent;
    color:#e5edff;
    text-decoration:none;
    font:600 11px/1.1 "DM Sans",sans-serif;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
    touch-action:manipulation;
  }
  html body.home-page .mobile-nav-item svg {
    width:24px; height:24px;
    fill:none; stroke:currentColor; stroke-width:1.8;
    stroke-linecap:round; stroke-linejoin:round;
  }
  html body.home-page .mobile-nav-item.is-active { color:#fff; }
  html body.home-page .mobile-nav-item.is-active svg {
    filter:drop-shadow(0 0 7px rgba(74,123,255,.9));
    color:#8eb5ff;
  }
  html body.home-page .mobile-nav-stories { gap:2px; }
  html body.home-page .mobile-nav-story-avatar {
    position:relative;
    display:block;
    width:43px; height:43px;
    padding:3px;
    border-radius:50%;
    background:conic-gradient(#ff3f91,#8b5cf6,#2778ff,#20d6c4,#ff3f91);
    box-shadow:0 0 12px rgba(87,100,255,.3);
  }
  html body.home-page .mobile-nav-story-avatar img {
    display:block; width:100%; height:100%; object-fit:cover;
    border:2px solid #101a31; border-radius:50%;
    pointer-events:none;
    -webkit-touch-callout:none;
    -webkit-user-drag:none;
    -webkit-user-select:none;
    user-select:none;
  }
  html body.home-page .mobile-nav-story-count[data-loading="true"] {
    opacity:.88;
    background:#5b6b8d;
    font-weight:600;
  }
  html body.home-page .mobile-nav-story-count[data-loading="false"] {
    opacity:1;
    transition:opacity .16s ease, background-color .16s ease;
  }
  html body.home-page .mobile-nav-story-count {
    position:absolute; top:-3px; right:-4px;
    min-width:17px; height:17px; padding:0 4px;
    display:grid; place-items:center;
    border:2px solid #10182b; border-radius:12px;
    background:#f02e66; color:#fff;
    font:700 10px/1 Arial,sans-serif;
  }
  html body.home-page .mobile-nav-stories:active .mobile-nav-story-avatar { transform:scale(.96); }
}
@media (prefers-reduced-motion: reduce) {
  html body.home-page .mobile-nav-story-avatar { transition:none !important; }
}


/* refined compact profile header; preserve the existing header links and gradient. */
@media (max-width: 700px) {
  html body.home-page .topbar {
    padding: 10px 12px 11px;
    column-gap: 10px;
    row-gap: 8px;
  }
  html body.home-page .topbar > .brand {
    flex: 1 1 auto;
    justify-content: flex-start;
    min-width: 0;
    gap: 9px;
  }
  html body.home-page .topbar > .brand .logo {
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    border-radius: 13px;
  }
  html body.home-page .topbar > .brand .brand-copy { min-width: 0; }
  html body.home-page .topbar > .brand b {
    font-size: 15px;
    line-height: 1.15;
    letter-spacing: -.35px;
  }
  html body.home-page .topbar > .brand small {
    margin-top: 3px;
    font-size: 11px;
    line-height: 1.2;
  }
  html body.home-page .topbar .arisu-verified-badge {
    flex: 0 0 auto;
  }
  html body.home-page .topbar .header-meta {
    flex: 0 0 auto;
    gap: 6px;
  }
  html body.home-page .topbar .header-meta .privacy-link {
    min-height: 40px;
    padding: 0 11px;
    border-radius: 12px;
    font-size: 11px;
    white-space: nowrap;
  }
}
@media (max-width: 380px) {
  html body.home-page .topbar { padding-left: 9px; padding-right: 9px; }
  html body.home-page .topbar > .brand { gap: 7px; }
  html body.home-page .topbar > .brand .logo {
    width: 39px; height: 39px; flex-basis: 39px;
  }
  html body.home-page .topbar .header-meta .privacy-link {
    min-height: 37px; padding: 0 8px; font-size: 10px;
  }
}


/* keep the mobile header focused on the Arisu profile and Privacy Policy. */
@media (max-width: 700px) {
  html body.home-page .topbar > .header-meta {
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    grid-template-columns: none !important;
    justify-content: flex-end;
    gap: 0 !important;
  }
  html body.home-page .topbar > .header-meta > .proofs-header-link,
  html body.home-page .topbar > .header-meta > .webtools-header-link {
    display: none !important;
  }
  html body.home-page .topbar > .header-meta > .privacy-link {
    display: inline-flex !important;
    width: auto;
    flex: 0 0 auto;
  }
}


/* Option 3: Deep Black-Navy footer with a Violet Stories accent. */
@media (max-width: 700px) {
  html body.home-page .mobile-bottom-nav {
    background: rgba(16, 24, 39, .985) !important;
    border-top-color: rgba(167, 139, 250, .25) !important;
    box-shadow: 0 -8px 28px rgba(5, 10, 22, .28) !important;
  }
  html body.home-page .mobile-nav-item {
    color: #F8FAFF !important;
  }
  html body.home-page .mobile-nav-item.is-active {
    color: #FFFFFF !important;
  }
  html body.home-page .mobile-nav-item.is-active svg {
    color: #FFFFFF !important;
    filter: drop-shadow(0 0 5px rgba(255, 255, 255, .18)) !important;
  }
  html body.home-page .mobile-nav-stories {
    color: #D8C7FF !important;
  }
  html body.home-page .mobile-nav-stories .mobile-nav-story-avatar {
    box-shadow: 0 0 13px rgba(167, 139, 250, .48) !important;
  }
  html body.home-page .mobile-nav-stories .mobile-nav-story-count {
    background: #A855F7 !important;
    border-color: #101827 !important;
  }
}


/* apply the Deep Black-Navy + Violet footer style on desktop too. */
@media (min-width: 701px) {
  html body.home-page .site-footer {
    background: #101827 !important;
    color: #F8FAFF !important;
    border-top: 1px solid rgba(167, 139, 250, .25) !important;
  }
  html body.home-page .site-footer .footer-brand,
  html body.home-page .site-footer .footer-brand .brand-name-row,
  html body.home-page .site-footer .footer-brand small,
  html body.home-page .site-footer .footer-note,
  html body.home-page .site-footer .footer-location,
  html body.home-page .site-footer .footer-location-item,
  html body.home-page .site-footer .footer-copyright {
    color: #F8FAFF !important;
  }
  html body.home-page .site-footer .footer-links a {
    color: #F8FAFF !important;
    transition: color .2s ease, text-shadow .2s ease;
  }
  html body.home-page .site-footer .footer-links a:hover,
  html body.home-page .site-footer .footer-links a:focus-visible {
    color: #D8C7FF !important;
    text-shadow: 0 0 10px rgba(167, 139, 250, .42);
  }
  html body.home-page .site-footer .footer-copyright {
    border-top-color: rgba(167, 139, 250, .2) !important;
  }
}


/* desktop version of the five-item bottom navigation. */
@media (min-width: 701px) {
  html body.home-page .mobile-bottom-nav {
    position: relative !important;
    inset: auto !important;
    z-index: 5 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 8px !important;
    width: min(100% - 64px, 1040px) !important;
    margin: 22px auto 0 !important;
    padding: 12px 14px !important;
    min-height: 0 !important;
    border: 1px solid rgba(167, 139, 250, .22) !important;
    border-radius: 18px !important;
    background: #101827 !important;
    box-shadow: 0 10px 28px rgba(5, 10, 22, .2) !important;
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
  }
  html body.home-page .mobile-nav-item {
    min-width: 0 !important;
    min-height: 58px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 5px 4px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #F8FAFF !important;
    text-decoration: none !important;
    font: 600 12px/1.1 "DM Sans", sans-serif !important;
    cursor: pointer !important;
  }
  html body.home-page .mobile-nav-item svg {
    width: 23px !important;
    height: 23px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  html body.home-page .mobile-nav-item.is-active {
    color: #D8C7FF !important;
    background: rgba(167, 139, 250, .09) !important;
  }
  html body.home-page .mobile-nav-stories {
    color: #D8C7FF !important;
  }
  html body.home-page .mobile-nav-stories .mobile-nav-story-avatar {
    box-shadow: 0 0 13px rgba(167, 139, 250, .48) !important;
  }
  html body.home-page .mobile-nav-stories .mobile-nav-story-count {
    background: #A855F7 !important;
    border-color: #101827 !important;
  }
}
@media (min-width: 701px) and (prefers-reduced-motion: reduce) {
  html body.home-page .mobile-nav-item { transition: none !important; }
}


/* make desktop navigation float above page content, matching mobile behavior. */
@media (min-width: 701px) {
  html body.home-page {
    padding-bottom: 112px !important;
  }
  html body.home-page .mobile-bottom-nav {
    position: fixed !important;
    top: auto !important;
    right: auto !important;
    bottom: 18px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 2147482500 !important;
    width: min(720px, calc(100vw - 48px)) !important;
    max-width: 720px !important;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    min-height: 76px !important;
    background: rgba(16, 24, 39, .97) !important;
    border: 1px solid rgba(167, 139, 250, .28) !important;
    border-radius: 18px !important;
    box-shadow: 0 12px 34px rgba(5, 10, 22, .32) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-item {
    min-width: 0 !important;
    min-height: 54px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 4px !important;
    line-height: 1.15 !important;
    border-radius: 12px !important;
    font-size: 11px !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-item svg {
    width: 21px !important;
    height: 21px !important;
    flex: 0 0 21px !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-item.is-active {
    background: rgba(167, 139, 250, .12) !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-stories {
    gap: 3px !important;
    color: #D8C7FF !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-story-avatar {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    padding: 2px !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-story-avatar img {
    border-width: 1px !important;
  }
  html body.home-page .mobile-bottom-nav .mobile-nav-story-count {
    top: -4px !important;
    right: -5px !important;
    min-width: 14px !important;
    height: 14px !important;
    padding: 0 3px !important;
    font-size: 9px !important;
  }
  html body.home-page .site-footer {
    margin-top: 22px !important;
  }
}


/* enforce compact Stories sizing and keep fixed navigation clear of footer content. */
@media (min-width: 701px) {
  html body.home-page {
    padding-bottom: 150px !important;
  }
  html body.home-page .site-footer {
    padding-bottom: 120px !important;
    margin-top: 24px !important;
  }
  html body.home-page nav.mobile-bottom-nav {
    position: fixed !important;
    top: auto !important;
    right: auto !important;
    bottom: 18px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: min(680px, calc(100vw - 48px)) !important;
    min-height: 76px !important;
    height: auto !important;
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    overflow: visible !important;
    z-index: 2147482500 !important;
  }
  html body.home-page nav.mobile-bottom-nav > .mobile-nav-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 54px !important;
    height: auto !important;
    flex: initial !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 4px !important;
    overflow: visible !important;
  }
  html body.home-page nav.mobile-bottom-nav > .mobile-nav-stories {
    position: relative !important;
    transform: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
  html body.home-page nav.mobile-bottom-nav .mobile-nav-story-avatar {
    position: relative !important;
    display: block !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    flex: 0 0 32px !important;
    padding: 2px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }
  html body.home-page nav.mobile-bottom-nav .mobile-nav-story-avatar img {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
  }
  html body.home-page nav.mobile-bottom-nav .mobile-nav-story-count {
    position: absolute !important;
    top: -4px !important;
    right: -5px !important;
    width: auto !important;
    min-width: 14px !important;
    max-width: none !important;
    height: 14px !important;
    min-height: 14px !important;
    padding: 0 3px !important;
    font-size: 9px !important;
  }
  html body.home-page nav.mobile-bottom-nav .mobile-nav-item > span:not(.mobile-nav-story-avatar) {
    display: block !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }
}


/* compact mobile footer links and reduce excess vertical spacing. */
@media (max-width: 600px) {
  html body.home-page .site-footer > .about-link-section {
    margin-bottom: 4px !important;
  }
  html body.home-page .site-footer > .footer-location {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    row-gap: 4px !important;
    column-gap: 8px !important;
  }
  html body.home-page .site-footer > .footer-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    align-items: start !important;
    gap: 6px 12px !important;
    margin-top: 8px !important;
    margin-bottom: 0 !important;
    width: 100% !important;
  }
  html body.home-page .site-footer > .footer-links a {
    display: block !important;
    min-width: 0 !important;
    padding: 2px 0 !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere;
  }
  html body.home-page .site-footer > .footer-copyright {
    margin-top: 8px !important;
    padding-top: 8px !important;
    line-height: 1.35 !important;
  }
}


/* compact footer links with small inline icons for clearer scanning. */
@media (max-width: 600px) {
  html body.home-page .site-footer > .footer-links {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px 10px !important;
  }
  html body.home-page .site-footer > .footer-links a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-height: 24px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  html body.home-page .site-footer > .footer-links a svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    flex: 0 0 14px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
  }
  html body.home-page .site-footer > .footer-links a span {
    min-width: 0 !important;
  }
}
@media (min-width: 601px) {
  html body.home-page .site-footer > .footer-links a {
    display: inline-flex; align-items: center; gap: 6px;
  }
  html body.home-page .site-footer > .footer-links a svg {
    width: 14px; height: 14px; flex: 0 0 14px; fill: none; stroke: currentColor;
    stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  }
}


/* balance the compact mobile footer and preserve clearance for fixed bottom navigation. */
@media (max-width: 700px) {
  html body.home-page .site-footer {
    padding-bottom: 6px !important;
  }
  html body.home-page {
    padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  }
}


/* place copyright beside Contact in the compact mobile footer. */
@media (max-width:760px) {
  .site-footer {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    row-gap: 10px;
  }
  .site-footer > .about-link-section,
  .site-footer > .footer-location {
    grid-column: 1 / -1;
  }
  .site-footer > .footer-links {
    display: contents;
  }
  .site-footer > .footer-links a {
    min-width: 0;
    justify-self: start;
    padding: 2px 0;
  }
  .site-footer > .footer-copyright {
    grid-column: 2;
    grid-row: auto;
    align-self: center;
    justify-self: start;
    border-top: 0;
    padding-top: 2px;
    white-space: nowrap;
  }
}


/* place copyright in the final mobile footer grid cell beside Contact. */
@media (max-width: 760px) {
  html body.home-page .site-footer > .footer-links {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
    align-items: center !important;
    column-gap: 12px !important;
    row-gap: 7px !important;
  }
  html body.home-page .site-footer > .footer-links > .footer-copyright {
    display: inline-flex !important;
    grid-column: 2 !important;
    grid-row: 3 !important;
    align-self: center !important;
    justify-self: start !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 2px 0 !important;
    border: 0 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    color: #8a95a6 !important;
  }
}
@media (min-width: 761px) {
  html body.home-page .site-footer > .footer-links > .footer-copyright {
    margin-left: auto;
    border: 0;
    padding-top: 0;
    white-space: nowrap;
  }
}


/* reduce only the remaining space below the compact footer on mobile. */
@media (max-width: 700px) {
  html body.home-page {
    padding-bottom: calc(56px + env(safe-area-inset-bottom)) !important;
  }
}


/* use a clean, solid WhatsApp brand glyph in the bottom Contact navigation item. */
@media screen and (max-width:700px) {
  html body.home-page nav.mobile-bottom-nav .mobile-nav-item svg.whatsapp-nav-icon {
    fill: currentColor;
    stroke: none;
    stroke-width: 0;
    filter: none;
    overflow: visible;
  }
}