/* DODI PPC — Motion practice-page template (v2). Loaded after motion.css.
   Same identity as the home (Geist, one action blue, reading stops), different scene vocabulary and colour:
   each practice runs on its own tint (light) and deep tone (dark). */
body.pr{--tint:#D7E7EE;--deep:#0D3442}
.muted{color:color-mix(in srgb,var(--fg) 58%,transparent)}
/* hero: asymmetric, an ad that composes itself */
.hero2{min-height:100vh;padding:110px 0 70px;display:flex;align-items:center}
.hero2>.wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center;width:100%}
.hero2 .crumbs a{color:inherit}
.hero2 h1{font:600 clamp(44px,5.3vw,80px)/.98 var(--sans);letter-spacing:-.052em}
.hero2 h1 .line{display:block;overflow:hidden;padding-bottom:.07em}.hero2 h1 .line>span{display:inline-block;will-change:transform}
.hero2 .promise{font:500 clamp(20px,1.8vw,26px)/1.32 var(--sans);margin-top:24px;max-width:21em;letter-spacing:-.022em}
.hero2 .ctas{display:flex;gap:12px;margin-top:36px;flex-wrap:wrap}
.hero2 .btn.ghost{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--fg) 22%,transparent)}
.hero2 .note{margin-top:24px;font-size:14px}
.composer{position:relative;perspective:1400px}
.card-ad{background:#fff;border-radius:28px;padding:24px 28px 30px;box-shadow:0 50px 120px rgba(0,0,0,.16);font-family:Arial,"Helvetica Neue",sans-serif;color:#202124;transform-style:preserve-3d;will-change:transform;position:relative}
.card-ad .qb{display:flex;align-items:center;gap:10px;border-radius:999px;box-shadow:0 1px 6px rgba(32,33,36,.22);padding:12px 18px;font-size:16px;margin-bottom:26px;min-height:46px}
.card-ad .qb .caret{width:2px;height:18px;background:#1A73E8;animation:blink 1s steps(1) infinite;margin-left:-6px}
.card-ad .sp{font-weight:700;font-size:12.5px}.card-ad .dom{font-size:12.5px;color:#4d5156;margin:2px 0 6px}
.card-ad .ti{color:#1a0dab;font-size:21px;line-height:1.3;min-height:2.6em;position:relative}
.card-ad .de{font-size:14px;color:#4d5156;line-height:1.5;margin-top:6px}
.card-ad .sl{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.card-ad .sl span{font-size:13px;color:#1a0dab;padding:7px 12px;border-radius:999px;box-shadow:inset 0 0 0 1px #dadce0}
.card-ad .fade{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.card-ad .fade.in{opacity:1;transform:none}
.card-ad .org{margin-top:24px}.card-ad .org i{display:block;height:9px;border-radius:5px;background:#eceef1;margin:7px 0}.card-ad .org i:nth-child(1){width:34%}.card-ad .org i:nth-child(2){width:70%;height:12px;background:#dfe6f7}.card-ad .org i:nth-child(3){width:88%}
.pointer{position:absolute;left:80%;top:108%;width:24px;opacity:0;pointer-events:none;z-index:4;filter:drop-shadow(0 4px 8px rgba(0,0,0,.25))}
.ripple{position:absolute;width:14px;height:14px;border-radius:50%;background:rgba(26,115,232,.35);transform:translate(-50%,-50%) scale(0);pointer-events:none;z-index:3}
.toast{position:absolute;right:-22px;bottom:-30px;background:#0b0b0c;color:#fff;border-radius:18px;padding:14px 20px 14px 14px;font:500 14.5px var(--sans);display:flex;gap:12px;align-items:center;box-shadow:0 24px 60px rgba(0,0,0,.35);opacity:0;transform:translateY(18px) scale(.95);transition:opacity .5s var(--ease),transform .6s var(--ease);z-index:5}
.toast.in{opacity:1;transform:none}
.toast i{width:30px;height:30px;border-radius:50%;background:#1e8e3e;display:grid;place-items:center;font-style:normal;font-size:15px}
.toast small{display:block;color:#a1a1a6;font-size:12px;font-weight:400;margin-top:1px}
.composer .cap{position:static;display:block;font-size:12px;margin-top:46px;text-align:right;opacity:.6}
/* a day of searches */
.day-pin{height:100vh;display:flex;flex-direction:column;justify-content:center}
.day-top{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:end;margin-bottom:7vh}
.clock{font:600 clamp(84px,10.5vw,160px)/.86 var(--sans);letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.day-top h2{max-width:13em}
.day-top p{margin-top:16px;max-width:30em}
.axis{position:relative;height:300px;margin:0 48px}
.axis .ln{position:absolute;left:0;right:0;top:50%;height:1px;background:rgba(255,255,255,.22)}
.axis .open{position:absolute;top:calc(50% - 20px);height:40px;background:rgba(255,255,255,.08);border-radius:10px}
.axis .open span{position:absolute;left:12px;top:11px;font-size:12px;color:rgba(255,255,255,.6);white-space:nowrap}
.axis .tick{position:absolute;top:calc(50% + 26px);font-size:11.5px;color:rgba(255,255,255,.4);transform:translateX(-50%);font-variant-numeric:tabular-nums}
.axis .now{position:absolute;top:8%;bottom:8%;width:2px;background:var(--blue);box-shadow:0 0 22px var(--blue);border-radius:2px}
.axis .s{position:absolute;opacity:0;transform:translate(var(--tx,-50%),10px) scale(.92);transition:opacity .45s var(--ease),transform .55s var(--ease);white-space:nowrap}
.axis .s.in{opacity:1;transform:translate(var(--tx,-50%),0)}
.axis .s b{display:block;font:500 11.5px var(--sans);color:rgba(255,255,255,.55);margin:0 0 6px 4px;font-variant-numeric:tabular-nums}
.axis .s span{display:inline-block;font-size:14.5px;padding:9px 15px;border-radius:999px;background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.axis .s.out span{background:var(--blue);box-shadow:none;color:#fff}
.axis .l0{bottom:calc(50% + 14px)}.axis .l1{bottom:calc(50% + 82px)}.axis .l2{top:calc(50% + 50px)}.axis .l3{top:calc(50% + 118px)}
.day-sum{margin-top:2vh;font:500 clamp(18px,1.6vw,22px)/1.4 var(--sans);opacity:0;transform:translateY(10px);transition:all .6s var(--ease)}
.day-sum.in{opacity:1;transform:none}.day-sum b{color:#fff}
.day-sum small{display:block;font-size:12.5px;opacity:.6;margin-top:4px;font-weight:400}
/* words rise from a mask */
.rise{padding:6vh 0}
.rise-words{font:600 clamp(34px,4.4vw,64px)/1.14 var(--sans);letter-spacing:-.042em;max-width:17em}
.rise-words .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.rise-words .w>span{display:inline-block}
/* what we found: sites that get an Ad badge, then flip */
.found-pin{height:100vh;display:grid;grid-template-columns:.9fr 1.1fr;gap:6vw;align-items:center}
.big2{font:600 clamp(100px,12.5vw,190px)/.84 var(--sans);letter-spacing:-.07em;font-variant-numeric:tabular-nums}
.big2 small{font-size:.22em;letter-spacing:-.02em;font-weight:500;margin-left:12px;opacity:.55}
.sites{display:grid;grid-template-columns:repeat(var(--cols,5),1fr);gap:14px;perspective:1000px}
.site{aspect-ratio:4/3;position:relative;transform-style:preserve-3d;transition:transform .8s var(--ease)}
.site .f,.site .b{position:absolute;inset:0;border-radius:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.site .f{background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.08);padding:12px}
.site .f i{display:block;height:6px;border-radius:3px;background:#e7e7ea;margin:0 0 6px}.site .f i:nth-child(1){width:38%;background:#cfd0d6}.site .f i:nth-child(2){width:84%}.site .f i:nth-child(3){width:64%}.site .f i:nth-child(4){height:22%;margin-top:10px;background:var(--tint)}
.site .ad{position:absolute;right:8px;bottom:8px;font:600 10px var(--sans);padding:3px 8px;border-radius:999px;background:#1D1D1F;color:#fff;opacity:0;transform:scale(.4);transition:opacity .3s,transform .4s var(--ease)}
.site.ad-on .ad{opacity:1;transform:none}
.site .b{background:var(--deep);color:#fff;transform:rotateY(180deg);display:flex;align-items:flex-end;padding:12px;font:500 11.5px/1.25 var(--sans)}
.site.flip{transform:rotateY(180deg)}
/* stacking cards */
.stack{padding:18vh 0 8vh}
.cards{margin-top:9vh}
.scard{position:sticky;top:calc(92px + var(--i) * 18px);height:min(540px,68vh);border-radius:32px;background:#fff;color:#1D1D1F;display:grid;grid-template-columns:1fr 1.05fr;gap:44px;padding:46px;margin-bottom:5vh;box-shadow:0 30px 80px rgba(0,0,0,.08);transform-origin:50% 0;will-change:transform}
.scard .n{font:500 14px var(--sans);color:#86868B}
.scard h3{font:600 clamp(32px,3.4vw,50px)/1.02 var(--sans);letter-spacing:-.045em;margin:14px 0 18px}
.scard p{font-size:17.5px;color:#515154;max-width:22em}
.viz{border-radius:24px;background:var(--tint);position:relative;overflow:hidden;padding:28px;display:flex;align-items:center;justify-content:center}
.mini{background:#fff;border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.1);padding:20px;width:100%;max-width:360px;font-size:13px}
.mini .h{font:700 20px/1.12 var(--sans);letter-spacing:-.03em;margin:4px 0 8px}
.mini .m{color:#555;font-size:12px;margin-bottom:10px}
.mini .r{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid #eee;color:#333;font-size:12.5px}
.mini .bt{margin-top:12px;background:#111;color:#fff;border-radius:999px;text-align:center;font-weight:600;padding:11px}
.tabs{position:relative;width:100%;max-width:360px;height:260px}
.tabs .mini{position:absolute;left:0;right:0;transition:transform .8s var(--ease)}
.tabs .mini:nth-child(1){top:0;transform:translateY(0) scale(.9);opacity:.6}.tabs .mini:nth-child(2){top:34px;transform:scale(.95);opacity:.8}.tabs .mini:nth-child(3){top:68px}
.viz.go .tabs .mini:nth-child(1){transform:translateY(-14px) scale(.9)}.viz.go .tabs .mini:nth-child(3){transform:translateY(14px)}
.mcal .days{display:grid;grid-template-columns:repeat(5,1fr);text-align:center;font-size:11px;color:#777;margin:8px 0 12px}.mcal .days b{display:block;font-size:17px;color:#111}
.mcal .slots{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mcal .slots i{font-style:normal;text-align:center;border-radius:10px;box-shadow:inset 0 0 0 1px #d5dbe3;color:#1A63DB;padding:10px;font-weight:500;transition:all .4s .6s}
.viz.go .mcal .slots i.pick{background:#1A63DB;color:#fff;box-shadow:none}
.mcal .ok{margin-top:12px;color:#188038;font-weight:600;opacity:0;transition:opacity .5s 1.2s}.viz.go .mcal .ok{opacity:1}
.mchart .n2{font:600 46px/1 var(--sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.mchart svg{width:100%;height:110px;margin:10px 0 4px}
.mchart path.l{fill:none;stroke:#1A73E8;stroke-width:3;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600;transition:stroke-dashoffset 1.6s var(--ease) .2s}
.viz.go .mchart path.l{stroke-dashoffset:0}
/* proof: work rows + a continuous ribbon of reviews */
.proof{padding:16vh 0 12vh;overflow:hidden}
.ribbon{display:flex;margin-top:9vh}
.ribbon .rt{display:flex;gap:22px;padding-right:22px;will-change:transform}
.rq{flex:none;width:520px;border-radius:28px;padding:34px;background:#fff;color:#1D1D1F;box-shadow:0 20px 60px rgba(0,0,0,.06)}
.rq p{font:600 24px/1.25 var(--sans);letter-spacing:-.03em}
.rq span{display:block;margin-top:18px;font-size:13.5px;color:#6E6E73}
/* FAQ accordion */
.faq2{padding:14vh 0}
.acc{margin-top:7vh;border-top:1px solid color-mix(in srgb,var(--fg) 14%,transparent)}
.acc .it{border-bottom:1px solid color-mix(in srgb,var(--fg) 14%,transparent)}
.acc button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:center;width:100%;padding:26px 0;font:600 clamp(20px,1.9vw,27px)/1.25 var(--sans);letter-spacing:-.03em}
.acc button i{font-style:normal;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--fg) 20%,transparent);transition:transform .5s var(--ease),background .3s;flex:none;margin-left:24px}
.acc .it.open button i{transform:rotate(45deg);background:var(--blue);color:#fff;box-shadow:none}
.acc .ans{height:0;overflow:hidden}
.acc .ans p{padding:0 0 26px;max-width:46em;font-size:17px;line-height:1.55}
/* booking, split */
.book2{padding:20vh 0 14vh}
.book2 .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:center}
.checks{list-style:none;margin-top:34px}
.checks li{display:grid;grid-template-columns:34px 1fr;gap:6px;padding:14px 0;border-top:1px solid rgba(255,255,255,.14);font-size:16.5px}
.checks svg{width:22px;height:22px;margin-top:1px}
.checks svg path{fill:none;stroke:var(--blue);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:30;stroke-dashoffset:30}
.book2 .calframe{margin:0}
/* other practices: rows fill with that practice's tint */
.oth{padding:12vh 0 6vh}
.oth ul{list-style:none;margin-top:5vh}
.oth a{position:relative;display:flex;justify-content:space-between;align-items:baseline;padding:24px 20px;border-top:1px solid rgba(255,255,255,.14);font:600 clamp(26px,3vw,44px)/1.1 var(--sans);letter-spacing:-.04em;overflow:hidden;border-radius:4px;transition:color .4s}
.oth a:before{content:"";position:absolute;inset:0;background:var(--t);transform:scaleX(0);transform-origin:0 50%;transition:transform .6s var(--ease);z-index:-1;border-radius:20px}
.oth a span{font:400 15px var(--sans);opacity:.6;letter-spacing:0}
.oth a:hover{color:#1D1D1F}.oth a:hover:before{transform:scaleX(1)}
.oth li{position:relative;z-index:0}
@media (max-width:900px){
  .hero2>.wrap{grid-template-columns:1fr;gap:56px}
  .hero2{padding-top:96px}
  .toast{right:6px;bottom:-34px}
  .day-top{grid-template-columns:1fr;gap:14px;margin-bottom:4vh}
  .axis{margin:0;height:auto;min-height:44vh}
  .axis .ln,.axis .open,.axis .tick,.axis .now{display:none}
  .axis .s{position:static;display:block;margin:0 0 8px;transform:none!important}
  .axis .s b{display:inline;margin:0 8px 0 0}
  .day-top p{display:none}
  .clock{font-size:64px}
  .day-top h2{font-size:30px}
  .axis .s span{font-size:13.5px;padding:8px 13px;white-space:normal}
  .found-pin{grid-template-columns:1fr;gap:4vh;align-content:center}
  .sites{gap:8px}
  .scard{grid-template-columns:1fr;height:auto;min-height:72vh;padding:28px;gap:20px;top:calc(76px + var(--i) * 12px)}
  .viz{min-height:230px;padding:18px}
  .rq{width:300px;padding:24px}.rq p{font-size:19px}
  .book2 .wrap{grid-template-columns:1fr}
  .oth a{flex-direction:column;gap:6px;padding:20px 12px}
}
.quiz .q{font-weight:600;font-size:12.5px;margin:12px 0 6px;color:#111}
.quiz .o{display:flex;gap:6px;flex-wrap:wrap}
.quiz .o span{font-size:12px;padding:6px 11px;border-radius:999px;box-shadow:inset 0 0 0 1px #d5dbe3;color:#333;transition:all .4s}
.viz.go .quiz .o span.sel{background:#1A63DB;color:#fff;box-shadow:none}
.quiz .o:nth-of-type(2) span{transition-delay:.2s}.quiz .o:nth-of-type(3) span{transition-delay:.5s}