/* Page hero. The same block is in services.css and google-presence.css. */
.intro{padding:clamp(120px,11vw,160px) var(--gut) clamp(48px,6vw,80px)}
.intro-cap{font-size:15px;line-height:1.4;max-width:360px}
.intro-h1{margin-top:clamp(24px,3vw,40px);font-size:clamp(44px,5.6vw,80px);font-weight:600;letter-spacing:-.04em;line-height:1}
.intro-h1 .ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.intro-h1 .ln > span{display:block;text-wrap:balance}
.js .intro-h1 .ln > span{animation:intro-rise 1s var(--ease) both}
.js .intro-h1 .ln:nth-child(2) > span{animation-delay:.12s}
@keyframes intro-rise{from{transform:translateY(105%)}}

.tally{padding:clamp(72px,9vw,120px) var(--gut)}
.tally-head{margin-bottom:18px;text-wrap:balance}
.tally-head h2{display:inline;font-size:clamp(28px,2.8vw,40px);font-weight:600;letter-spacing:-.035em;line-height:1.05}
.tally-chip{margin-left:10px;vertical-align:baseline;background:var(--surface);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-strong)}
.tally-grid{display:grid;grid-template-columns:1fr 1fr 1.15fr;border:1px solid var(--line)}
.tally-grid > div{padding:24px 26px 28px}
.tally-grid > div + div{border-left:1px solid var(--line)}
.tally-in label{display:block;font-size:14px;font-weight:500}
.tally-num{display:block;width:100%;margin-top:10px;border:0;border-bottom:2px solid var(--line-strong);border-radius:0;background:transparent;color:var(--fg);font:inherit;font-size:clamp(44px,4.6vw,66px);font-weight:600;letter-spacing:-.04em;padding:2px 0 8px}
.tally-num:hover{border-bottom-color:var(--fg)}
.tally-num:focus{outline:none;border-bottom-color:var(--focus)}
.tally-num:focus-visible{outline:none;box-shadow:0 3px 0 var(--focus)}
.tally-range{display:block;width:100%;height:44px;margin-top:10px;accent-color:var(--fg);cursor:pointer}
.tally-out{display:flex;flex-direction:column;justify-content:flex-end}
.tally-out b{font-size:clamp(56px,6.4vw,96px);font-weight:600;letter-spacing:-.05em;line-height:.9;font-variant-numeric:tabular-nums}
.tally-out span{font-size:18px;font-weight:500;margin-top:12px;max-width:26ch}
.tally-note{font-size:15px;color:var(--mute);margin-top:16px;max-width:64ch}
@media (max-width:860px){
  .tally-grid{grid-template-columns:1fr}
  .tally-grid > div + div{border-left:0;border-top:1px solid var(--line)}
}

/* Evens the statement caption, whose middle line ran long. */
/* Keeps single words off the last line of the band cells on phones. */

.gp{width:min(360px,100%);background:#fff;color:var(--ink);border-radius:26px;padding:20px;box-shadow:var(--ring),var(--shadow),inset 0 0 0 1px var(--ui-line);text-align:left}
.gp .top{display:flex;justify-content:space-between;align-items:center}
.gp h6{font-size:22px;font-weight:600;letter-spacing:-.03em;margin-top:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gp .meta{font-size:13px;color:var(--ui-mute);margin-top:2px}
.gp .stars{color:#F5A623;letter-spacing:2px}
.gp .btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.gp .btns span{height:40px;border-radius:999px;display:grid;place-items:center;font-size:13px;font-weight:600;border:1px solid var(--ui-line);overflow:hidden;padding:0 8px;white-space:nowrap;text-overflow:ellipsis}
.gp .btns span:first-child{background:#1A73E8;color:#fff;border-color:#1A73E8}
.gp-hours{font-size:13px;color:var(--ui-mute);margin-top:8px}
.gp-hours b{color:#188038;font-weight:600}
.gp-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px}
.gp-photos i{--tile:linear-gradient(135deg,#E9E4DC,#CFC6B8);height:64px;border-radius:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23191B25' stroke-opacity='.4' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='3'/%3E%3Ccircle cx='9' cy='10' r='1.8'/%3E%3Cpath d='m4 18 5-5 4 4 3-3 4 4'/%3E%3C/svg%3E") center/22px no-repeat,var(--tile)}
.gp-photos i:nth-child(2){--tile:linear-gradient(135deg,#DDE3EC,#B9C3D3)}
.gp-photos i:nth-child(3){--tile:linear-gradient(135deg,#E6E0E8,#C9BFCF)}
.gp-svcs{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.gp-svcs span{font-size:12px;font-weight:500;padding:6px 10px;border:1px solid var(--ui-line);border-radius:999px}
/* site.css turns .sample white inside .on-color bands; these chips sit on white cards. */
.gp .sample,.page-google .rcard .sample{background:rgba(25,27,37,.08);color:var(--ink)}

.pledge-wrap{padding:clamp(80px,9vw,120px) var(--gut);border-top:1px solid var(--line)}
.pledge{border-radius:28px;padding:clamp(26px,4vw,56px);background:var(--green);color:#fff}
.pledge h2{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:500}
.pledge-big{font-size:clamp(30px,3.6vw,52px);font-weight:600;letter-spacing:-.035em;line-height:1.08;max-width:22ch;margin-top:clamp(28px,4vw,48px);text-wrap:balance}
.pledge-cond{font-size:clamp(17px,1.5vw,20px);margin-top:22px;max-width:56ch;opacity:.92}
.pledge-foot{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;margin-top:28px;padding-top:18px;border-top:1px solid rgba(255,255,255,.3);font-size:15px}
.pledge-foot a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px;font-weight:500}
.pledge-foot a:focus-visible{outline-color:#fff}
