/* 1.1.119 hero (front page only, after hero-199.css). Base from 1.1.116-118 minus the turning halos, ripples, sparkles and sheen. REVERT = re-upload 1.1.118. */
.h116{--h116-teal:111,216,202;--h116-cream:237,228,211}
.h116 .h116-ring{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:0 0 16px}
.h116 .h116-ring svg{position:relative;z-index:1;display:block}
/* ---------- incoming-call card (desktop hero visual only; static card) ---------- */
.h116 .h116-card{display:none}
@media (min-width:1025px){
  .h116 .h116-card{
    /* 1.1.116 QA fix: in-flow under the mock (right-aligned), so it never covers the mock's footer note */
    display:flex;align-items:center;gap:14px;position:relative;z-index:5;margin:18px 0 0 auto;width:max-content;
    min-width:260px;max-width:300px;padding:12px 18px 12px 14px;border-radius:16px;
    background:rgba(11,42,61,.95);border:1px solid rgba(var(--h116-teal),.35);
    box-shadow:0 18px 44px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.03) inset;
    color:#EDE4D3;pointer-events:none;
  }
}
.h116 .h116-card-icon{position:relative;flex:0 0 40px;width:40px;height:40px;margin:4px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#3DBFAE;color:#0B2A3D}
.h116 .h116-card-icon svg{position:relative;z-index:1}
.h116 .h116-card-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto}
.h116 .h116-card-k{font-size:.66rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6FD8CA;line-height:1.2}
.h116 .h116-card-v{font-size:.9rem;font-weight:600;color:#EDE4D3;line-height:1.3}
/* still waveform (static on purpose) */
.h116 .h116-card-eq{display:flex;align-items:center;gap:3px;height:18px;flex:0 0 auto}
.h116 .h116-card-eq i{display:block;width:3px;height:18px;border-radius:2px;background:rgba(var(--h116-teal),.8)}
.h116 .h116-card-eq i:nth-child(1){transform:scaleY(.45)}
.h116 .h116-card-eq i:nth-child(2){transform:scaleY(.9)}
.h116 .h116-card-eq i:nth-child(3){transform:scaleY(.6)}
.h116 .h116-card-eq i:nth-child(4){transform:scaleY(.35)}
/* static sparkle on the card corner (menu-board accent, no motion) */
.h116 .h116-card-spark{position:absolute;right:-9px;top:-11px;width:20px;height:20px;fill:#6FD8CA;filter:drop-shadow(0 0 5px rgba(111,216,202,.5))}
/* ---------- 1.1.116 QA fix: "More below" cue in a reserved slot under the checklist (tablet/mobile) ---------- */
.h116 .h116-cue-slot{display:none}
@media (max-width:1024px){
  .h116 .h116-cue-slot{display:flex;justify-content:flex-start;min-height:56px;margin-top:1.25rem}
  .h116 .h116-cue-slot .c1111-cue--inflow{position:static;left:auto;bottom:auto;transform:none;z-index:1}
}
@media (min-width:601px) and (max-width:1024px){.h116 .h116-cue-slot{justify-content:center}}

/* ---------- 1.1.116: calm the pre-existing hero motion so the phone ring stays the one focal motion.
   Nothing removed, only slowed. Ticker unchanged (30s linear). Skipped entirely for reduced motion. ---------- */
@keyframes h116Dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.82)}}
@media (prefers-reduced-motion:no-preference){
  :root:not(#_h) body .hero.h116 .ai-badge-dot{animation:h116Dot 4.8s ease-in-out infinite}
  :root:not(#_h) body .hero.h116 .orb-float-1{animation-duration:36s}
  :root:not(#_h) body .hero.h116 .orb-float-2{animation-duration:46s}
  :root:not(#_h) body .hero.h116 .orb-float-3{animation-duration:56s}
  :root:not(#_h) body .hero.h116 .aerial-pan{animation-duration:180s}
  :root:not(#_h) body .hero.h116 .aerial-pin{animation-duration:9s}
  :root:not(#_h) body .hero.h116 .aerial-pin.p2{animation-delay:3s}
  :root:not(#_h) body .hero.h116 .aerial-pin.p3{animation-delay:6s}
}
/* ---------- 1.1.117 "Phone Ring" gradient words (static base; 1.1.119 liquid layer sits on top) ----------
   Gradient stops on navy #0E3247: teal #6FD8CA 7.9:1, mint #9FE1D3 9.1:1, cream #EDE4D3 10.6:1,
   warm light #F2D7A6 9.6:1, sheen #FFF8EC 12.7:1 (all well above 4.5:1).
   Fallback without background-clip:text = solid cream. Reduced motion = static gradient, no sheen. */
:root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .hero-askmaps-em.h116-word{
  position:relative;isolation:isolate;white-space:nowrap;
  color:#EDE4D3;-webkit-text-fill-color:#EDE4D3;
}
:root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h116-fill{
  color:#EDE4D3;-webkit-text-fill-color:#EDE4D3;text-shadow:none;
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  :root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h116-fill{
    background-image:linear-gradient(100deg,#6FD8CA 0%,#9FE1D3 32%,#EDE4D3 62%,#F2D7A6 84%,#EDE4D3 100%);
    background-size:100% 100%;background-position:0 0;
    background-repeat:no-repeat;
    -webkit-background-clip:text;background-clip:text;
    color:transparent;-webkit-text-fill-color:transparent;
    padding:0 .08em;margin:0 -.08em; /* italic overhang stays inside the painted box */
  }
  :root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h116-fill::selection{-webkit-text-fill-color:#0B2A3D;color:#0B2A3D;background:#EDE4D3}
}
/* soft glow behind the words (behind the fill, inside the em's own stacking context) */
:root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h116-word::before{
  content:"";position:absolute;z-index:-1;left:-6%;right:-6%;top:12%;bottom:4%;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(111,216,202,.22),rgba(111,216,202,.08) 60%,rgba(111,216,202,0));
}
:root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h118-stack{display:inline-grid;vertical-align:baseline}
:root:not(#_h) body .hero.hero--askmaps.h116 .hero199-copy .h118-stack>*{grid-area:1/1}
/* 1.1.119 "drip" hero (replaces the 1.1.116-118 halo/sparkle/sheen). Front page only.
   One slow focal motion: after load, glossy teal-to-cream liquid settles into "Phone Ring" once (~3.6s),
   then every 9.6s a single droplet forms under the "g" (3s), falls (1.2s, ease-in) and lands as a soft
   ripple with a small map pin (1.5s). transform + opacity only; drip is absolutely positioned (no CLS);
   paused off-screen; reduced motion = static filled words, no drip. REVERT = re-upload 1.1.118. */
:root:not(#_h) body .hero.h116 h1{position:relative}
/* liquid layer: masked window rises while its text counter-moves, so the letters stay put */
:root:not(#_h) body .hero.h116 .d119-liq{justify-self:stretch;display:block;margin:-.3em -.12em;pointer-events:none;transform:translateY(100%);will-change:transform;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10' preserveAspectRatio='none'%3E%3Cpath d='M0 10V6Q10 0 20 6T40 6V10Z'/%3E%3C/svg%3E") 0 0/.9em .22em repeat-x,linear-gradient(#000,#000) 0 .21em/100% 100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10' preserveAspectRatio='none'%3E%3Cpath d='M0 10V6Q10 0 20 6T40 6V10Z'/%3E%3C/svg%3E") 0 0/.9em .22em repeat-x,linear-gradient(#000,#000) 0 .21em/100% 100% no-repeat}
:root:not(#_h) body .hero.h116 .d119-liq-in{display:block;padding:.3em .12em;white-space:nowrap;transform:translateY(-100%);will-change:transform}
:root:not(#_h) body .hero.h116 .d119-liq-in::before{content:attr(data-text);color:#9FE1D3;-webkit-text-fill-color:transparent;
  background:linear-gradient(180deg,transparent 29%,rgba(255,255,255,.8) 34%,rgba(255,255,255,0) 44%),linear-gradient(180deg,#FFFBF2 14%,#D4F3EB 34%,#7FDCCF 56%,#3DBFAE 78%,#2A9E90 96%);
  -webkit-background-clip:text;background-clip:text}
@keyframes d119Up{to{transform:none}}
/* drip (injected by JS at the "g") */
.d119-drip{position:absolute;left:0;top:0;width:0;height:0;pointer-events:none;z-index:2;opacity:0;--fall:.5em}
.d119-drip i{position:absolute;display:block;opacity:0}
.d119-bead{left:-.08em;top:-.02em;width:.16em;height:.11em;border-radius:50%;transform-origin:50% 0;background:radial-gradient(circle at 40% 35%,#F7F2E7,#6FD8CA 55%,#2A9E90)}
.d119-drop{left:-.11em;top:0;width:.22em;height:.31em;transform-origin:50% 0}
.d119-drop svg,.d119-pin svg{display:block;width:100%;height:100%;overflow:visible}
.d119-rip{left:-.5em;top:calc(var(--fall) + .26em);width:1em;height:.16em;border-radius:50%;border:2px solid rgba(159,225,211,.95);box-shadow:0 0 12px rgba(111,216,202,.5),inset 0 0 6px rgba(111,216,202,.35)}
.d119-rip+.d119-rip{border-color:rgba(237,228,211,.5);box-shadow:none}
.d119-pin{left:-.09em;top:calc(var(--fall) - .06em);width:.18em;height:.25em;transform-origin:50% 100%}
@keyframes d119Drop{
  0%{opacity:0;transform:translateY(0) scale(.25,.1);animation-timing-function:ease-out}
  6%{opacity:1}
  26%{opacity:1;transform:translateY(0) scale(.9,.85);animation-timing-function:ease-in-out}
  31%{opacity:1;transform:translateY(.02em) scale(.8,1.25);animation-timing-function:cubic-bezier(.55,0,.95,.45)}
  43.5%{opacity:1;transform:translateY(var(--fall)) scale(.75,1.35);animation-timing-function:ease-out}
  44.6%,100%{opacity:0;transform:translateY(var(--fall)) scale(1.5,.3)}}
@keyframes d119Bead{0%{opacity:0;transform:scale(0)}6%,26%{opacity:1;transform:scale(1)}31%{opacity:1;transform:scale(1.1,1.4)}34%{opacity:1;transform:scale(1,.55)}38%{opacity:1;transform:scale(.8,.8)}55%,100%{opacity:0;transform:scale(.3)}}
@keyframes d119Rip{0%,43.5%{opacity:0;transform:scale(.12)}45%{opacity:.9;transform:scale(.22)}60%,100%{opacity:0;transform:scale(1)}}
@keyframes d119Pin{0%,44%{opacity:0;transform:scale(0)}50%{opacity:1;transform:translateY(-.06em) scale(1.08)}54%{opacity:1;transform:scale(1)}66%{opacity:1;transform:scale(1)}76%,100%{opacity:0;transform:scale(.9)}}
@media (prefers-reduced-motion:no-preference){
  :root:not(#_h) body .hero.h116.h116-on .d119-liq,:root:not(#_h) body .hero.h116.h116-on .d119-liq-in{animation:d119Up 3.6s cubic-bezier(.33,.1,.2,1) .2s forwards}
  .h116-on .d119-drip{opacity:1}
  .h116-on .d119-drop{animation:d119Drop 9.6s 4s infinite}
  .h116-on .d119-bead{animation:d119Bead 9.6s 4s infinite}
  .h116-on .d119-rip{animation:d119Rip 9.6s 4s infinite cubic-bezier(.2,.6,.35,1)}
  .h116-on .d119-rip+.d119-rip{animation-delay:4.3s}
  .h116-on .d119-pin{animation:d119Pin 9.6s 4s infinite ease-in-out}
}
.h116-paused .d119-drip i,:root:not(#_h) body .hero.h116.h116-paused :is(.d119-liq,.d119-liq-in){animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){:root:not(#_h) body .hero.h116 :is(.d119-liq,.d119-liq-in){transform:none!important;animation:none!important}.d119-drip{display:none!important}}
