/* ServAI first-10-second polish v2 — trust, interactive proof, mobile hierarchy, contrast, micro-motion. */
#heroV2 .hero10-trust{display:flex;align-items:center;gap:10px;margin-top:16px;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.055em;color:#aeb2b7}
#heroV2 .hero10-trust i{width:3px;height:3px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px rgba(200,164,100,.5)}
#heroV2 .hero10-ready{appearance:none;cursor:pointer;font:inherit}
#heroV2 .hero10-ready:hover,#heroV2 .hero10-ready:focus-visible{color:#efd59b;border-color:rgba(139,211,155,.55);background:rgba(139,211,155,.11);outline:none}
#heroV2 .hero10-proof-grid small{color:#92979d}
#heroV2 .hero10-proof-grid b{color:#f0f1f2}
#heroV2 .hero10-mission-link{appearance:none;border:0;background:none;padding:0;color:#e7cf9f;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-align:left}
#heroV2 .hero10-mission-link:hover,#heroV2 .hero10-mission-link:focus-visible{color:var(--gold);text-decoration:underline;text-underline-offset:3px;outline:none}
#heroV2 .hero10-proof-foot{font-size:9.5px;color:#a9adb2}
#heroV2 .hero10-proof-foot span:first-child{color:#a9adb2}
#heroV2 .hero10-proof-foot span:last-child{color:#e0bd7a}
#heroV2 .hero10-metric{opacity:0;transform:translateY(7px);animation:hero10MetricIn .44s ease forwards}
#heroV2 .hero10-metric:nth-child(1){animation-delay:.5s}#heroV2 .hero10-metric:nth-child(2){animation-delay:.62s}#heroV2 .hero10-metric:nth-child(3){animation-delay:.74s}#heroV2 .hero10-metric:nth-child(4){animation-delay:.86s}
@keyframes hero10MetricIn{to{opacity:1;transform:none}}
body.hero10-modal-open{overflow:hidden}
#heroV2 .hero10-flow-modal[hidden]{display:none}
#heroV2 .hero10-flow-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:22px}
#heroV2 .hero10-flow-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.76);backdrop-filter:blur(8px)}
#heroV2 .hero10-flow-panel{position:relative;width:min(720px,100%);max-height:min(760px,88vh);overflow:auto;padding:30px;border:1px solid rgba(200,164,100,.32);border-radius:20px;background:linear-gradient(155deg,#15120d,#070707 68%);box-shadow:0 40px 120px rgba(0,0,0,.7)}
#heroV2 .hero10-flow-panel>small{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;color:var(--gold)}
#heroV2 .hero10-flow-panel h2{margin:10px 46px 22px 0;font-size:clamp(28px,4vw,42px);line-height:1.04;letter-spacing:-.035em}
#heroV2 .hero10-flow-close{position:absolute;top:17px;right:17px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.03);color:#d7d9dc;font-size:24px;line-height:1;cursor:pointer}
#heroV2 .hero10-flow-close:hover{border-color:rgba(200,164,100,.45);color:var(--gold)}
#heroV2 .hero10-flow-steps{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.1);border-left:1px solid rgba(255,255,255,.1)}
#heroV2 .hero10-flow-steps>div{padding:18px;border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
#heroV2 .hero10-flow-steps b{display:block;font-family:var(--font-mono);font-size:9px;color:var(--gold);margin-bottom:9px}
#heroV2 .hero10-flow-steps strong{display:block;font-size:15px;margin-bottom:6px;color:#f0f1f2}
#heroV2 .hero10-flow-steps span{display:block;font-size:12px;line-height:1.5;color:#9fa4aa}
#heroV2 .hero10-flow-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
@media(max-width:960px){#heroV2 .hero10-trust{justify-content:center}}
@media(max-width:620px){
  #heroV2 .hero10-copy{padding-top:86px}
  #heroV2 .hero10-message h1{font-size:clamp(39px,12.2vw,54px)}
  #heroV2 .hero10-message .sub{max-width:36ch;line-height:1.5}
  #heroV2 .hero10-trust{font-size:8.4px;gap:7px;flex-wrap:wrap;justify-content:center;margin-top:12px}
  #heroV2 .hero10-grid{gap:18px}
  #heroV2 .hero10-proof{order:2;padding:15px}
  #heroV2 .hero10-proof-title{padding:15px 0 13px}
  #heroV2 .hero10-proof-title strong{font-size:24px}
  #heroV2 .hero10-proof-grid>div{padding:10px;min-height:62px}
  #heroV2 .hero10-proof-grid small{font-size:7.8px;margin-bottom:5px}
  #heroV2 .hero10-proof-grid b,#heroV2 .hero10-mission-link{font-size:11.5px}
  #heroV2 .hero10-proof-foot{font-size:8.5px;padding-top:11px}
  #heroV2 .hero10-functions{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;width:calc(100% + 36px);margin-left:-18px;padding:0 18px 7px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #heroV2 .hero10-functions::-webkit-scrollbar{display:none}
  #heroV2 .hero10-question{position:sticky;left:0;z-index:2;width:auto;min-width:max-content;margin-right:3px;padding:7px 10px 7px 0;background:linear-gradient(90deg,#050505 80%,transparent);text-align:left}
  #heroV2 .hero10-functions a{min-width:max-content;font-size:8.5px}
  #heroV2 .hero10-flow-modal{padding:12px;align-items:end}
  #heroV2 .hero10-flow-panel{max-height:88vh;border-radius:18px 18px 12px 12px;padding:22px 18px}
  #heroV2 .hero10-flow-steps{grid-template-columns:1fr}
  #heroV2 .hero10-flow-actions{display:grid}
  #heroV2 .hero10-flow-actions .btn{width:100%;justify-content:center;text-align:center}
}
@media(prefers-reduced-motion:reduce){#heroV2 .hero10-metric{opacity:1;transform:none;animation:none}}

/* Mobile correction pass M1–M3 · 2026-08-26 */
/* Modal is reparented to <body> by hero10-polish-v2.js so these rules must not depend on #heroV2 ancestry. */
.hero10-flow-modal[hidden]{display:none!important}
.hero10-flow-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:22px;overscroll-behavior:contain}
.hero10-flow-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(9px)}
.hero10-flow-panel{position:relative;z-index:1;width:min(720px,100%);max-height:min(760px,88dvh);overflow:auto;-webkit-overflow-scrolling:touch;padding:30px;border:1px solid rgba(200,164,100,.32);border-radius:20px;background:linear-gradient(155deg,#15120d,#070707 68%);box-shadow:0 40px 120px rgba(0,0,0,.7);overscroll-behavior:contain}
.hero10-flow-panel>small{font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;color:var(--gold)}
.hero10-flow-panel h2{margin:10px 46px 22px 0;font-size:clamp(28px,4vw,42px);line-height:1.04;letter-spacing:-.035em}
.hero10-flow-close{position:sticky;top:0;float:right;z-index:5;margin:-8px -4px 0 12px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(10,10,10,.92);backdrop-filter:blur(8px);color:#f1f2f3;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 6px 22px rgba(0,0,0,.4)}
.hero10-flow-close:hover,.hero10-flow-close:focus-visible{border-color:rgba(200,164,100,.55);color:var(--gold);outline:none}
.hero10-flow-steps{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.1);border-left:1px solid rgba(255,255,255,.1);clear:both}
.hero10-flow-steps>div{padding:18px;border-right:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.hero10-flow-steps b{display:block;font-family:var(--font-mono);font-size:9px;color:var(--gold);margin-bottom:9px}
.hero10-flow-steps strong{display:block;font-size:15px;margin-bottom:6px;color:#f0f1f2}
.hero10-flow-steps span{display:block;font-size:12px;line-height:1.5;color:#a8adb3}
.hero10-flow-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
body.hero10-modal-open .sticky-convert,body.hero10-modal-open #sfd-btn,body.hero10-modal-open #sfd-panel{visibility:hidden!important;pointer-events:none!important}

@media(max-width:620px){
  /* M1: keep status + opportunity title visually subordinate to the page headline. */
  #heroV2 .hero10-proof-title{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:center}
  #heroV2 .hero10-proof-title strong{font-size:20px;line-height:1.08;letter-spacing:-.025em;min-width:0}
  #heroV2 .hero10-ready{font-size:8px!important;line-height:1;letter-spacing:.055em!important;padding:6px 8px!important;min-height:28px;align-self:center}

  /* M2: viewport-owned dialog, always below the iPhone safe area with a persistent close action. */
  .hero10-flow-modal{place-items:start center;padding:calc(env(safe-area-inset-top,0px) + 14px) 10px calc(env(safe-area-inset-bottom,0px) + 14px)}
  .hero10-flow-panel{width:100%;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 28px);border-radius:16px;padding:18px 16px 20px;scroll-padding-top:52px}
  .hero10-flow-close{top:0;width:42px;height:42px;margin:-4px -2px 2px 10px;background:#11100e;border-color:rgba(200,164,100,.35)}
  .hero10-flow-panel h2{font-size:26px;line-height:1.08;margin:8px 4px 18px 0}
  .hero10-flow-steps{grid-template-columns:1fr}
  .hero10-flow-steps>div{padding:16px 14px}
  .hero10-flow-actions{display:grid}
  .hero10-flow-actions .btn{width:100%;justify-content:center;text-align:center}

  /* M3: when no modal is open, reduce Zahi's mobile footprint above the sticky conversion bar. */
  #sfd-btn{padding:10px 14px!important;font-size:12px!important;gap:7px!important;right:12px!important;border-radius:32px!important}
  #sfd-btn svg{width:15px!important;height:15px!important}
}
