/* ==========================================================================
   /ppc-management-melbourne · September 2026 redesign. Loaded after
   ind-wdp.css and svx.css; every class here is .ppx-* (the page's own).
   Motion rests complete: the "before" states are gated by classes sv-ppc.js
   adds (.is-arm, then .is-go once the part is on screen), and ind-wdp.css
   switches every animation off under reduced motion. Loops pause off screen
   through ind-wdp's .is-live rule.
   ========================================================================== */

main[data-svc="ppc"]{--px-card:linear-gradient(180deg,#101318,#0B0C10);--px-deep:#0A0B0E;--px-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --px-paper:#EEE8DA;--px-paper-2:#E4DCCB;--px-ink:#1E1B16;--px-ink-2:#5B5448}

/* ============ RESULTS: before and after the takeover ============ */

.ppx-trend{position:relative;display:block;height:96px;margin:18px 0 20px}
.ppx-trend svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ppx-trend__before{fill:rgba(255,255,255,.025)}
.ppx-trend__base{stroke:rgba(255,255,255,.1);stroke-width:1;vector-effect:non-scaling-stroke}
.ppx-trend__old{fill:none;stroke:rgba(255,255,255,.35);stroke-width:2;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.ppx-trend__new{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;stroke-dasharray:1 1}
.ppx-trend__take{stroke:var(--gold);stroke-width:1.5;stroke-dasharray:4 4;vector-effect:non-scaling-stroke}
.ppx-trend__dot,.ppx-trend__end{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%}
.ppx-trend__dot{left:var(--tx);top:var(--ty);background:var(--gold);box-shadow:0 0 0 4px rgba(244,160,0,.2)}
.ppx-trend__end{left:100%;top:var(--ey);background:var(--teal);box-shadow:0 0 0 4px rgba(79,191,160,.2)}

.ppx-after__all{display:flex;justify-content:center;margin-top:36px}

/* ============ COMPARISON: the account's settings ============ */
.ppx-set{border-radius:26px;border:1px solid var(--edge-2);background:var(--px-card);overflow:hidden}
.ppx-set__head,.ppx-set__row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.1fr) minmax(0,1.1fr);align-items:center}
.ppx-set__head{padding:16px 22px;border-bottom:1px solid var(--edge);background:#121419;font-size:13px;font-weight:700;color:var(--text-dim)}
.ppx-set__head .ppx-set__us{padding-left:44px;color:var(--text)}
.ppx-set__head .ppx-set__us b{color:var(--gold)}
.ppx-set__head .ppx-set__us em{font-style:normal;font-weight:600;color:var(--teal)}
.ppx-set__head .ppx-set__them{padding-left:44px}
.ppx-set__row{position:relative;padding:12px 22px;border-top:1px solid rgba(255,255,255,.05)}
.ppx-set__row:first-of-type{border-top:0}
.ppx-set__k{display:flex;align-items:center;gap:12px;padding-right:16px;font-size:15px;font-weight:700;color:var(--text)}
.ppx-set__k b{font:700 12px/1 var(--px-mono);color:var(--text-dim)}
/* the two settings share one track; the thumb sits under ours */
.ppx-set__row::before{content:"";position:absolute;top:8px;bottom:8px;left:calc(22px + (100% - 44px) * .8 / 3);right:22px;border-radius:14px;background:#08090B;border:1px solid rgba(255,255,255,.06)}
.ppx-set__row::after{content:"";position:absolute;top:11px;bottom:11px;left:calc(25px + (100% - 44px) * .8 / 3);width:calc((100% - 44px) * 1.1 / 3 - 6px);border-radius:11px;
  background:linear-gradient(180deg,rgba(244,160,0,.2),rgba(244,160,0,.1));border:1px solid var(--gold-line);box-shadow:0 8px 20px -12px rgba(244,160,0,.7);
  transition:transform .7s var(--ease);transition-delay:calc(var(--i) * .12s)}
html.el8-js .ppx-set.is-arm .ppx-set__row::after{transform:translateX(calc(100% + 6px))}
.ppx-set__row .ppx-set__us,.ppx-set__row .ppx-set__them{position:relative;z-index:1;display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:center;padding:10px 16px 10px 16px;font-size:14.5px;line-height:1.45}
.ppx-set__row .ppx-set__us{color:var(--text)}
.ppx-set__row .ppx-set__us i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--teal);color:#0A1512;font-size:12px;font-style:normal;font-weight:800}
.ppx-set__row .ppx-set__them{color:var(--text-dim)}
.ppx-set__row .ppx-set__them i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--coral-line);color:var(--coral);font-size:11px;font-style:normal}
.ppx-set__row .ppx-set__them span{text-decoration:line-through;text-decoration-color:rgba(255,122,107,.6)}
.ppx-set__cta{display:flex;justify-content:center;margin-top:32px}

/* ============ FREE TOOLS: the scorecard leads ============ */
.ppx-tools{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);grid-auto-rows:auto;gap:12px 16px;margin:0;padding:0;list-style:none}
.ppx-tool{border-radius:22px;border:1px solid var(--edge);background:var(--px-card);transition:border-color .3s,transform .4s var(--ease)}
.ppx-tool:hover{border-color:var(--gold-line);transform:translateY(-3px)}
.ppx-tool{grid-column:2}
.ppx-tool a{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;height:100%;padding:12px;color:inherit}
.ppx-tool__peek{display:grid;place-items:center;border-radius:14px;background:var(--px-deep);border:1px solid rgba(255,255,255,.05)}
.ppx-tool__body{display:flex;flex-direction:column;min-width:0}
.ppx-tool__head{display:flex;align-items:center;gap:10px}
.ppx-tool__ic{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;border:1px solid var(--gold-line);background:var(--gold-soft);color:var(--gold)}
.ppx-tool__ic svg{width:17px;height:17px}
.ppx-tool__t{font:800 16.5px/1.25 var(--font-head);letter-spacing:-.012em}
.ppx-tool__d{margin:6px 0 8px;font-size:13.5px;line-height:1.5;color:var(--text-mid)}
.ppx-tool:not(.is-first) .ppx-tool__body{padding:4px 0 2px}
.ppx-tool__go{margin-top:auto;font-size:14px;font-weight:700;color:var(--gold)}
.ppx-tool__go b{display:inline-block;transition:transform .3s var(--ease)}
.ppx-tool:hover .ppx-tool__go b{transform:translateX(4px)}
.ppx-tool__first{align-self:flex-start;margin-bottom:12px;padding:5px 11px;border-radius:100px;background:var(--gold);font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#111}
.ppx-tool.is-first{grid-column:1;grid-row:1 / span 5;border-color:var(--gold-line);background:radial-gradient(90% 60% at 50% 0%,rgba(244,160,0,.1),transparent 70%),#0F1115}
.ppx-tool.is-first a{grid-template-columns:minmax(0,1fr);grid-template-rows:1fr auto;gap:22px;padding:20px}
.ppx-tool.is-first .ppx-tool__peek{min-height:260px}
.ppx-tool.is-first .ppx-tp{width:92%}
.ppx-tool.is-first .ppx-tool__t{font-size:21px}
.ppx-tool.is-first .ppx-tool__d{font-size:15px}
.ppx-tp{display:block;width:100%;height:auto;max-height:100%;overflow:visible}
.ppx-tool:not(.is-first) .ppx-tp{width:100%}

.ppx-tp__term rect{fill:rgba(79,191,160,.1);stroke:var(--teal-line)}
.ppx-tp__term.is-cut rect{fill:rgba(255,122,107,.08);stroke:var(--coral-line)}
.ppx-tp__term line,.ppx-tp__term path{stroke:var(--coral);stroke-width:1.8;stroke-linecap:round;fill:none}
.ppx-tp__term circle{fill:var(--coral-soft);stroke:var(--coral)}
.ppx-tp__term circle.is-ok{fill:var(--teal-soft);stroke:var(--teal)}
.ppx-tp__term path.is-ok{stroke:var(--teal)}
.ppx-tp__coin{fill:var(--gold);stroke:#B87700;stroke-width:1.5}
.ppx-tp__coin.is-in{fill:rgba(255,255,255,.15);stroke:rgba(255,255,255,.35)}
.ppx-tp__lbl{font:800 17px/1 var(--font-head);fill:var(--text-soft);text-anchor:middle}
.ppx-tp__lbl.is-gold{fill:var(--gold)}
.ppx-tp__arrow{fill:none;stroke:var(--text-dim);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ppx-tp__who{fill:none;stroke:var(--text-soft);stroke-width:2}
.ppx-tp__time{stroke:rgba(255,255,255,.15);stroke-width:1.5}
.ppx-tp__buy{fill:rgba(244,160,0,.75)}
.ppx-tp__month{fill:rgba(255,255,255,.02);stroke:rgba(255,255,255,.1)}
.ppx-tp__ideal{stroke:rgba(255,255,255,.25);stroke-width:1.5;stroke-dasharray:4 4}
.ppx-tp__spend{fill:none;stroke:var(--gold);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ppx-tp__now{fill:var(--gold);stroke:#0A0B0E;stroke-width:2}
.ppx-tp__base{stroke:rgba(255,255,255,.15)}
.ppx-tp__paid{fill:none;stroke:var(--gold);stroke-width:2.5;stroke-dasharray:6 5}
.ppx-tp__org{fill:none;stroke:var(--teal);stroke-width:3;stroke-linecap:round}
.ppx-tp__cross{fill:#0A0B0E;stroke:var(--text);stroke-width:2}

/* ============ PRICING: a flat fee against a percentage ============ */
.ppx-fee{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:32px;margin-bottom:56px;padding:26px 30px;border-radius:26px;
  border:1px solid var(--edge-2);background:var(--px-card)}

.ppx-cadence{display:flex;align-items:flex-start;gap:12px;max-width:940px;margin:24px auto 0;padding:14px 18px;border-radius:16px;border:1px solid var(--teal-line);background:var(--teal-soft);font-size:14.5px;line-height:1.55;color:var(--text)}
.ppx-cadence__ic svg{display:block;width:22px;height:22px;fill:none;stroke:var(--teal);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.ppx-fee__t{display:flex;gap:14px;margin:0;font-size:15.5px;line-height:1.62;color:var(--text-mid)}
.ppx-fee__t strong{display:block;margin-bottom:6px;font:800 20px/1.3 var(--font-head);letter-spacing:-.012em;color:var(--text)}
.ppx-fee__tick{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--teal);color:#0A1512;font-weight:800}

/* ============ VALUE: what PPC management is, and which page fits ============ */
.ppx-def{max-width:900px;margin:-6px 0 34px;padding:2px 0 2px 20px;border-left:3px solid var(--gold);font-size:17px;line-height:1.6;color:var(--text)}
.ppx-which{margin-top:30px}
.ppx-which__h{margin:0 0 14px;font:800 19px/1.25 var(--font-head);letter-spacing:-.012em}
.ppx-which__rows{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.ppx-which__row{position:relative;display:flex;flex-direction:column;gap:6px;height:100%;padding:16px 18px;border-radius:18px;border:1px solid var(--edge);background:var(--px-deep);color:inherit;text-decoration:none;transition:border-color .3s}
.ppx-which__row b{padding-right:22px;font:800 16px/1.3 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppx-which__row span{font-size:14px;line-height:1.5;color:var(--text-mid)}
.ppx-which__row i{position:absolute;right:16px;top:15px;font-style:normal;font-weight:700;color:var(--gold)}
a.ppx-which__row:hover,a.ppx-which__row:focus-visible{border-color:var(--gold-line)}
.ppx-which__row.is-here{border-color:var(--gold-line);background:linear-gradient(180deg,rgba(244,160,0,.1),rgba(244,160,0,.03))}

/* ============ WHY: the account's access screen ============ */

/* the "before" state, only while sv-ppc.js holds it: the typical agency's settings, until each row changes over */

@media (min-width:1081px) and (max-height:950px){
  main[data-svc="ppc"] .ppx-hero-sec .wdp-hero__cols{align-items:start}
}

/* ==========================================================================
   Wide tablets and below
   ========================================================================== */
@media (max-width:1180px){
  
  .ppx-tools{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ppx-tool{grid-column:auto}
  .ppx-tool.is-first{grid-row:auto;grid-column:1 / -1}
  .ppx-tool.is-first a{grid-template-columns:260px minmax(0,1fr);grid-template-rows:none}
  .ppx-tool.is-first .ppx-tool__peek{min-height:170px}
  .ppx-tool a{grid-template-columns:120px minmax(0,1fr)}
}
@media (max-width:1080px){
  
  
  
  
  .ppx-which__rows{grid-template-columns:repeat(2,minmax(0,1fr))}
  
  
  
  
  
  .ppx-fee{grid-template-columns:minmax(0,1fr)}
  
  
  .ppx-set__head,.ppx-set__row{grid-template-columns:minmax(0,.7fr) minmax(0,1.15fr) minmax(0,1.15fr)}
  .ppx-set__row::before{left:calc(22px + (100% - 44px) * .7 / 3)}
  .ppx-set__row::after{left:calc(25px + (100% - 44px) * .7 / 3);width:calc((100% - 44px) * 1.15 / 3 - 6px)}
}

/* ==========================================================================
   Phones
   ========================================================================== */
@media (max-width:700px){
  
  
  
  
  
  

  /* hero */
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  /* value */
  .ppx-def{margin:0 0 24px;padding-left:16px;font-size:15.5px}
  .ppx-which{margin-top:24px}
  .ppx-which__h{font-size:18px}
  .ppx-which__rows{grid-template-columns:minmax(0,1fr);gap:8px}
  .ppx-which__row{gap:3px;padding:12px 14px;border-radius:14px}
  .ppx-which__row b{font-size:15px}
  .ppx-which__row span{font-size:13.5px}
  .ppx-which__row i{top:12px;right:14px}
  
  
  
  
  
  
  
  
  
  
  

  /* audit framework */
  
  
  
  
  
  
  

  /* process */
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  /* expect */
  
  
  
  
  
  
  
  
  

  /* mistakes */
  
  
  
  
  

  /* free audit: no box on phones, so its swipe row can run to the screen's edges like the others */
  
  
  
  
  
  
  
  

  /* results */
  
  
  .ppx-trend{height:80px;margin:14px 0 16px}

  /* why: the access screen */
  
  
  
  
  
  
  
  
  
  
  
  

  /* comparison: each row stacks; ours on top, theirs struck under it */
  .ppx-set{border-radius:22px}
  .ppx-set__head{display:none}
  /* each row: the setting, then its two positions side by side, the switch on ours */
  .ppx-set__row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:0 6px;padding:12px 12px 13px}
  .ppx-set__row::before,.ppx-set__row::after{display:none}
  .ppx-set__k{grid-column:1 / -1;padding:0 0 8px;font-size:14.5px}
  .ppx-set__row .ppx-set__us,.ppx-set__row .ppx-set__them{grid-template-columns:18px minmax(0,1fr);gap:7px;align-items:start;padding:9px 10px;border-radius:11px;font-size:13px;line-height:1.4}
  .ppx-set__row .ppx-set__us{border:1px solid var(--gold-line);background:linear-gradient(180deg,rgba(244,160,0,.18),rgba(244,160,0,.08))}
  .ppx-set__row .ppx-set__them{border:1px solid rgba(255,255,255,.06);background:#08090B}
  .ppx-set__row .ppx-set__us i,.ppx-set__row .ppx-set__them i{width:18px;height:18px;font-size:10px}
  .ppx-set__cta .wdp-btn{width:100%}

  /* switching agencies (under the process) */
  
  
  
  
  
  
  
  
  
  
  
  
  

  /* industries */
  
  
  
  
  

  /* free tools */
  .ppx-tools .ppx-tool a,.ppx-tools .ppx-tool.is-first a{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;gap:14px;padding:16px}
  .ppx-tool .ppx-tool__peek,.ppx-tool.is-first .ppx-tool__peek{min-height:0;height:124px}
  .ppx-tool:not(.is-first) .ppx-tp{width:100%;margin:0}
  .ppx-tp{max-height:112px}
  .ppx-tool:hover{transform:none}

  /* pricing */
  .ppx-fee{gap:18px;margin-bottom:36px;padding:18px 16px;border-radius:22px}
  .ppx-fee__t{font-size:14.5px}
  .ppx-fee__t strong{font-size:18px}
  .ppx-fee__t strong{margin-bottom:0}
  .ppx-fee__more{display:none}
  
  
  .ppx-cadence{margin-top:18px;padding:14px 16px;font-size:14px}

  /* glossary: the panels become pages you swipe */
  
  
  
  
}

/* ============ TAB STAGES (owner, 1 Oct 2026, as on Google Ads, AEO, GEO and SEM): on wide screens a list of items
   becomes tabs (each item's heading is a real button) beside or over one panel holding the chosen item's words, and
   the section's picture follows the choice. Every item stays a full box stacked in one cell: the chosen one shows, the
   others show only their tab. Phones keep their swipe cards. ============ */

@keyframes ppsProg{to{transform:scaleX(1)}}

/* ============ RESULTS: the cases as tickets, the chosen one open as a report with its chart drawing the move (the
   Google Ads design, owner approved 1 Oct 2026); each report keeps the case's before-and-after line where the chart was ============ */
.ppr{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:22px;align-items:stretch}
.ppr__cases{display:grid;gap:10px;align-content:center}
.ppr__tab{position:relative;display:grid;gap:6px;width:100%;padding:18px 20px;border-radius:18px;border:1px solid var(--edge);background:#0C0E12;color:var(--text-mid);font:inherit;text-align:left;cursor:pointer;overflow:hidden;
  -webkit-tap-highlight-color:transparent;transition:border-color .3s,background-color .3s}
.ppr__tab:hover{border-color:var(--edge-2)}
.ppr__tab:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.ppr__tab.is-on{border-color:var(--gold-line);background:linear-gradient(90deg,rgba(244,160,0,.12),#0C0E12 85%)}
.ppr__tag{font:700 10.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.ppr__big{display:flex;align-items:baseline;gap:8px;font:800 34px/1 var(--font-head);letter-spacing:-.03em;color:var(--text-soft)}
.ppr__big i{font-style:normal;font-size:20px;color:var(--teal)}
.ppr__tab.is-on .ppr__big{color:var(--gold)}
.ppr__metric{font-size:14px;font-weight:600;color:var(--text-mid)}
.ppr__prog{position:absolute;left:20px;right:20px;bottom:0;height:2px;border-radius:2px;background:var(--gold);transform-origin:0 50%;transform:scaleX(0);opacity:0}
.ppr.is-playing .ppr__tab.is-on .ppr__prog{opacity:.85;animation:ppsProg var(--dur,7s) linear both}
.ppr__reports{display:grid}
.ppr__rep{display:grid;grid-template-rows:auto 1fr auto auto;gap:18px;min-width:0;padding:26px 28px;border-radius:24px;border:1px solid var(--edge-2);background:radial-gradient(70% 60% at 100% 0%,rgba(79,191,160,.08),transparent 60%),linear-gradient(180deg,#111418,#0B0D10)}
html.el8-js .ppr__rep{grid-area:1 / 1;visibility:hidden;opacity:0;transition:opacity .3s,visibility 0s .3s}
html.el8-js .ppr__rep.is-on{visibility:visible;opacity:1;transition:opacity .45s,visibility 0s}
html:not(.el8-js) .ppr__reports{gap:18px}
.ppr__top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 24px}
.ppr__k{font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}
.ppr__fig{margin:6px 0 0;font:800 clamp(56px,6vw,84px)/.95 var(--font-head);letter-spacing:-.045em;color:var(--gold)}
.ppr__metric-l{margin:6px 0 0;font:700 18px/1.25 var(--font-head);color:var(--text)}
.ppr__foot{display:inline-flex;align-items:center;gap:8px;margin:0;padding:8px 12px;border-radius:100px;border:1px solid var(--teal-line);background:var(--teal-soft);font-size:13px;font-weight:600;color:var(--teal)}

.ppr__steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.ppr__steps li{padding:14px 16px;border-radius:14px;border:1px solid var(--edge);background:#0C0E12}
.ppr__steps b{display:block;margin-bottom:6px;font:700 11px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}
.ppr__steps li.is-gold{border-color:var(--gold-line)}
.ppr__steps li.is-gold b{color:var(--gold)}
.ppr__steps p{margin:0;font-size:14.5px;line-height:1.55;color:var(--text-mid)}
.ppr__link{justify-self:start;color:var(--gold);font-weight:700;font-size:15px;text-decoration:none}
.ppr__link:hover{color:var(--text)}
@media (max-width:1000px){
  .ppr{grid-template-columns:minmax(0,1fr)}
  .ppr__cases{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ppr__big{font-size:28px}
}
@media (max-width:700px){
  .ppr{gap:12px}
  .ppr__reports{grid-row:1}
  .ppr__rep{gap:14px;padding:18px 16px;border-radius:20px}
  .ppr__fig{font-size:56px}
  .ppr__metric-l{font-size:16px}
  
  .ppr__steps{grid-template-columns:minmax(0,1fr);gap:8px}
  .ppr__steps li{padding:12px 14px}
  .ppr__steps p{font-size:14px}
  .ppr__cases{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .ppr__tab{gap:3px;padding:10px 10px;border-radius:14px}
  .ppr__tag,.ppr__metric{display:none}
  .ppr__big{justify-content:center;font-size:22px}
  .ppr__big i{font-size:14px}
}
@media (prefers-reduced-motion:reduce){
  .ppr *{animation:none!important;transition:none!important}
}
@keyframes ppsProg{to{transform:scaleX(1)}}

@keyframes pprDraw{from{clip-path:inset(-10% 100% -10% 0)}to{clip-path:inset(-10% 0 -10% 0)}}

@keyframes pprDraw{from{clip-path:inset(-10% 100% -10% 0)}to{clip-path:inset(-10% 0 -10% 0)}}

.ppr__proof{padding:6px 18px 4px;border-radius:16px;border:1px solid var(--edge);background:radial-gradient(60% 90% at 50% 100%,rgba(79,191,160,.06),transparent 70%),#0A0C0F}
.ppr__proof .ppx-trend{height:130px;margin:14px 6px 16px}
.ppr__proof .ppx-trend__new{stroke-dasharray:none}
.ppr__rep.is-on .ppx-trend__new{animation:pprDraw 1.6s var(--ease) .2s both}
.ppr__rep.is-on .ppx-trend__end{animation:pprEnd .4s 1.6s both}
@keyframes pprDraw{from{clip-path:inset(-20% 100% -20% 0)}to{clip-path:inset(-20% 0 -20% 0)}}
@keyframes pprEnd{from{opacity:0}}
@media (max-width:700px){.ppr__proof .ppx-trend{height:96px}}
@media (prefers-reduced-motion:reduce){.ppr__rep .ppx-trend__new,.ppr__rep .ppx-trend__end{animation:none!important}}

/* ============ PPC IN PLAIN ENGLISH: an ad account beside the shared glossary; each pinned part carries its pin
   (.pgp = the glossary picture) ============ */
.pgp{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.pgp-pin{position:absolute;right:-9px;top:-9px;z-index:2;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--gold);color:#111;
  box-shadow:0 0 0 3px #0B0D10;font:800 10.5px/1 var(--font-head);font-style:normal;letter-spacing:0;text-transform:none}
.pgp [data-slx-spot]{position:relative;border-radius:8px}
.pgp-acct{border-radius:20px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#13161B,#0C0E11);box-shadow:0 50px 100px -60px rgba(0,0,0,.95);overflow:visible}
.pgp-acct__bar{display:flex;align-items:center;gap:10px;height:34px;padding:0 14px;border-bottom:1px solid var(--edge);border-radius:20px 20px 0 0;background:#11141A;font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.pgp-acct__bar em{margin-left:auto;font-style:normal;letter-spacing:.12em;text-transform:uppercase;font-size:9px}
.pgp-camps{display:grid;gap:0;padding:6px 12px 4px}
.pgp-camps__head,.pgp-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.05fr) minmax(0,1.15fr) 58px;align-items:center;gap:10px;padding:9px 4px}
.pgp-camps__head{font:700 9.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);border-bottom:1px solid var(--edge)}
.pgp-camps__head > span[data-slx-spot]{justify-self:start;padding:2px 24px 2px 4px;margin-left:-4px}
.pgp-row{font-size:12px;color:var(--text-mid);border-bottom:1px solid var(--edge)}
.pgp-row:last-child{border-bottom:0}
.pgp-row > span{min-width:0;padding:3px 4px;margin:-3px -4px}
.pgp-row__name{display:flex;align-items:center;gap:7px;font-weight:700;color:var(--text);padding-right:24px!important}
.pgp-row__name i{flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--teal)}
.pgp-row__strat{justify-self:start;padding-right:24px!important;font:600 11.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--gold)}
.pgp-row__budget{display:grid;gap:4px;padding-right:24px!important}
.pgp-pace{display:block;height:4px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.pgp-pace i{display:block;height:100%;background:var(--teal)}
.pgp-row__share{font:800 14px/1 var(--font-head);color:var(--text)}
.pgp-nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:6px 12px 14px}
.pgp-m{display:grid;gap:5px;padding:9px 10px;border-radius:12px!important;border:1px solid var(--edge);background:#0D0F13}
.pgp-m span{font-size:10.5px;font-weight:600;color:var(--text-dim)}
.pgp-m > b:not(.pgp-pin){font:800 18px/1 var(--font-head);letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums}
.pgp-m--cpl > b:not(.pgp-pin),.pgp-m--roas > b:not(.pgp-pin){color:var(--teal)}
.pgp-side{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:10px}
.pgp-terms{grid-row:span 2;display:grid;align-content:start;gap:9px;padding:13px;border-radius:16px!important;border:1px solid var(--edge-2);background:#0E1116}
.pgp-terms__k{font:700 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.pgp-terms__q s{font:600 12.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-mid);text-decoration-color:var(--coral)}
.pgp-terms__row{display:flex;flex-wrap:wrap;gap:8px}
.pgp-chip{padding:5px 26px 5px 9px;border-radius:100px!important;font:700 11px/1 var(--font-body,inherit);font-style:normal}
.pgp-chip.is-match{border:1px solid var(--edge-2);color:var(--text-soft)}
.pgp-chip.is-neg{background:var(--coral);color:#1A0F10}
.pgp-code{display:grid;gap:4px;padding:10px 12px;border-radius:14px!important;border:1px solid var(--teal-line);background:#0A1210;font:500 10px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.pgp-code > b:not(.pgp-pin){font-weight:700;color:var(--teal);word-break:break-word}
.pgp-hist{display:flex;align-items:center;gap:8px;padding:10px 26px 10px 12px;border-radius:14px!important;border:1px dashed var(--edge-2);font-size:11.5px;color:var(--text-mid)}
.pgp-hist svg{flex:0 0 auto;width:16px;height:16px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round}
@media (max-width:700px){
  .pgp-camps__head,.pgp-row{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) 44px;gap:8px}
  .pgp-camps__head > span:nth-child(3),.pgp-row__budget{display:none!important}
  .pgp-row{font-size:11px}
  .pgp-nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pgp-side{grid-template-columns:minmax(0,1fr)}
  .pgp-terms{grid-row:auto}
  .pgp-pin{width:20px;height:20px;right:-7px;top:-7px;font-size:10px}
}

/* ============ PRICING: a fee range stays on one line (it wrapped "/mo" under the figure) ============ */
.ppx-fee-sec .svc-tier__fee{font-size:clamp(25px,2.25vw,32px);white-space:nowrap}
@media (max-width:700px){.ppx-fee-sec .svc-tier__fee{font-size:clamp(24px,7.4vw,30px)}}

/* (owner, 1 Oct 2026: a later tab's box sat over the earlier tabs, so only forward clicks worked) the stacked items
   let clicks through; only the tabs and the chosen item's content take them */
@media (min-width:1001px){
  html.el8-js [data-pps] [data-pps-item]{pointer-events:none}
  html.el8-js [data-pps] [data-pps-item].is-cur *{pointer-events:auto}
}

/* ============ WHAT YOU GET: the four disciplines on the shared tab stage; each panel is the discipline's words beside
   its worked example drawn large (kit/ppc/example). Phones: swipe cards, the example filling the spare room ============ */
.ppw__items{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.ppw-i{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:24px;border:1px solid var(--edge);background:#0E1014}
.ppw-i__h{margin:0;font:800 20px/1.2 var(--font-head);letter-spacing:-.015em;color:var(--text)}
.ppw-i__h .svt-tab{display:flex;align-items:center;gap:12px}
.ppw-i__h .svt-tab__n{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--gold)}
.ppw-i__body{display:flex;flex-direction:column-reverse;gap:16px;flex:1}
.ppw-i__k{display:none}
.ppw-i__copy p{margin:0;font-size:15px;line-height:1.62;color:var(--text-mid)}
.ppw-i__pic{display:grid;min-width:0;flex:1}
@media (min-width:1001px){
  html.el8-js .ppw[data-svt] .ppw__items{grid-template-columns:minmax(0,1fr);gap:0}
  html.el8-js .ppw[data-svt] .ppw-i{grid-area:1 / 1;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:68px auto;gap:10px;padding:0;border:0;background:none;visibility:hidden}
  html.el8-js .ppw[data-svt] .ppw-i.is-cur{visibility:visible}
  html.el8-js .ppw[data-svt] .ppw-i__h{grid-column:var(--c);grid-row:1;height:68px;font-size:inherit;visibility:visible}
  html.el8-js .ppw[data-svt] .ppw-i__t{font:800 16px/1.2 var(--font-head);letter-spacing:-.01em}
  html.el8-js .ppw[data-svt] .ppw-i__body{grid-column:1 / -1;grid-row:2;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:52px;margin-top:6px;min-height:420px;padding:34px 34px 34px 42px}
  html.el8-js .ppw[data-svt] .ppw-i__k{display:block;margin-bottom:14px;font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
  html.el8-js .ppw[data-svt] .ppw-i__copy p{font-size:17.5px;line-height:1.68;color:var(--text)}
  html.el8-js .ppw[data-svt] .is-cur [style*="--r:"]{animation:ppwIn .55s calc(var(--r) * 110ms + 120ms) var(--ease) both}
  html.el8-js .ppw[data-svt] .is-cur .ppw-x__sweep{animation:ppwSweep 1.5s .15s var(--ease) both}
}
@keyframes ppwIn{from{opacity:0;transform:translateY(10px)}}
@keyframes ppwSweep{from{opacity:.9;transform:translateY(0)}to{opacity:0;transform:translateY(340px)}}

/* the worked examples */
.ppw-x{position:relative;display:grid;align-content:start;gap:14px;min-width:0;padding:20px;border-radius:20px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#14171C,#0D0F13);overflow:hidden}
.ppw-x__top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:20px}
.ppw-x__top > b{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft)}
.ppw-x__eng{display:flex;gap:5px}
.ppw-x__sweep{position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:0;pointer-events:none}

/* 0 · the first look */
.ppw-find{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.ppw-find li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"lamp l v" ". ev ev";align-items:center;gap:10px 12px;padding:13px 15px;border-radius:14px;border:1px solid var(--edge);background:#0B0D11}
.ppw-find__lamp{grid-area:lamp;width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 4px rgba(255,122,107,.14)}
.ppw-find .is-warn .ppw-find__lamp{background:var(--gold);box-shadow:0 0 0 4px rgba(244,160,0,.14)}
.ppw-find__l{grid-area:l;min-width:0;font-size:14px;font-weight:600;color:var(--text)}
.ppw-find li > b{grid-area:v;font:700 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--coral);text-align:right}
.ppw-find .is-warn > b{color:var(--gold)}
.ppw-find__ev{grid-area:ev;display:flex;align-items:center;gap:6px;min-width:0}
.ppw-twice i{padding:4px 8px;border-radius:7px;border:1px solid var(--coral-line);background:rgba(255,122,107,.07);font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal;color:var(--coral)}
.ppw-twice em{font:800 12px/1 var(--font-head);font-style:normal;color:var(--coral)}
.ppw-share{position:relative;height:8px;border-radius:4px;background:rgba(79,191,160,.18);overflow:hidden}
.ppw-share i{position:absolute;inset:0;border-radius:4px;background:var(--coral);transform-origin:0 50%;transform:scaleX(calc(var(--v) / 100))}
.ppw-months{gap:5px}
.ppw-months i{flex:1;height:8px;border-radius:2px;background:rgba(255,255,255,.07)}
.ppw-months i:first-child{background:var(--gold)}
.ppw-verdict{display:flex;align-items:center;gap:10px;padding:13px 15px;border-radius:14px;border:1px solid var(--teal-line);background:rgba(79,191,160,.07)}
.ppw-verdict svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:var(--teal);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ppw-verdict span{font-size:14px;font-weight:600;color:var(--text)}
.ppw-verdict b{margin-left:auto;font:700 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--teal);text-align:right}

/* 1 · the account rebuilt */
.ppw-tree{display:grid;justify-items:center;padding-top:4px}
.ppw-tree__root{padding:10px 18px;border-radius:12px;border:1px solid var(--gold-line);background:rgba(244,160,0,.08);font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text)}
.ppw-tree__lines{display:block;width:100%;height:30px}
.ppw-tree__lines path{fill:none;stroke:var(--gold-line);stroke-width:1.5;vector-effect:non-scaling-stroke}
.ppw-tree__kids{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%}
.ppw-node{display:grid;align-content:start;gap:8px;padding:13px;border-radius:14px;border:1px solid var(--edge-2);background:#0B0D11}
.ppw-node__t{display:flex;align-items:flex-start;gap:8px;min-height:36px;font-size:13.5px;font-weight:600;line-height:1.35;color:var(--text)}
.ppw-node__t .pph-eng{margin-top:1px}
.ppw-node__ic{display:inline-grid;place-items:center;flex:0 0 auto;width:18px;height:18px;margin-top:1px;border-radius:6px;background:rgba(79,191,160,.14);font-style:normal}
.ppw-node__ic svg{width:12px;height:12px;fill:none;stroke:var(--teal);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ppw-node > b{font:700 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--teal)}
.ppw-node__bar{position:relative;display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.06);overflow:hidden}
.ppw-node__bar i{position:absolute;inset:0;border-radius:3px;background:var(--gold);transform-origin:0 50%;transform:scaleX(var(--v))}
.ppw-tree__cut{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;margin-top:14px;padding:11px 15px;border-radius:12px;border:1px dashed var(--coral-line);background:rgba(255,122,107,.04)}
.ppw-tree__cut s{font-size:13.5px;color:var(--text-dim);text-decoration-color:var(--coral)}
.ppw-tree__cut b{font:700 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--coral)}

/* 2 · a working morning */
.ppw-week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.ppw-week li{display:grid;gap:6px;text-align:center}
.ppw-week span{font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}
.ppw-week i{height:6px;border-radius:3px;background:rgba(255,255,255,.07)}
.ppw-week .is-done i{background:var(--teal)}
.ppw-week .is-now span{color:var(--gold)}
.ppw-week .is-now i{background:var(--gold);box-shadow:0 0 12px rgba(244,160,0,.55)}
.ppw-log{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.ppw-log li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:11px 14px;border-radius:13px;border:1px solid var(--edge);background:#0B0D11}
.ppw-log li > i{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.05);font-style:normal}
.ppw-log svg{width:15px;height:15px;fill:none;stroke:var(--text-mid);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ppw-log .is-up{background:rgba(79,191,160,.12)}.ppw-log .is-up svg{stroke:var(--teal)}
.ppw-log .is-cut{background:rgba(255,122,107,.12)}.ppw-log .is-cut svg{stroke:var(--coral)}
.ppw-log .is-move{background:rgba(244,160,0,.12)}.ppw-log .is-move svg{stroke:var(--gold)}
.ppw-log span{min-width:0;font-size:14px;color:var(--text)}
.ppw-log b{font:700 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-mid)}
.ppw-log b.is-up{color:var(--teal)}
.ppw-touch{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 4px 0;border-top:1px dashed var(--edge-2)}
.ppw-touch span{font-size:14px;color:var(--text-soft)}
.ppw-touch b{font:800 30px/1 var(--font-head);letter-spacing:-.02em;color:var(--gold)}

/* 3 · the one page report, on paper */
.ppw-x--paper{place-items:center;padding:16px 10px;border:0;background:none;overflow:visible}
.ppw-paper{width:min(100%,420px);display:grid;gap:12px;padding:24px 26px 20px;border-radius:6px;background:#F5F2EA;color:#1B1D21;box-shadow:0 40px 80px -36px rgba(0,0,0,.9);transform:rotate(-1.4deg)}
.ppw-paper__top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:2px solid #1B1D21}
.ppw-paper__top b{font:800 17px/1.2 var(--font-head);letter-spacing:-.01em}
.ppw-paper__top span{font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#7A7A72}
.ppw-paper__big{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:2px 14px;padding:6px 0 4px}
.ppw-paper__big span{grid-column:1 / -1;font-size:13px;font-weight:600;color:#5F5F58}
.ppw-paper__big b{font:800 46px/1 var(--font-head);letter-spacing:-.03em}
.ppw-paper__big em{display:inline-flex;align-items:center;gap:4px;justify-self:start;margin-bottom:6px;padding:5px 10px;border-radius:100px;background:#DDF2EA;font:700 13px/1 var(--font-body,inherit);font-style:normal;color:#11695A}
.ppw-paper__big em svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ppw-paper__row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-top:10px;border-top:1px dashed #CFCBBF}
.ppw-paper__row span{font-size:14px;color:#3B3C40}
.ppw-paper__row b{font:700 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:#1B1D21}
.ppw-paper__row.is-none span{color:#8B8A82;text-decoration:line-through;text-decoration-color:#C8473A}
.ppw-paper__row.is-none b{color:#11695A}

@media (max-width:700px){
  .ppw-i{padding:14px;border-radius:20px}
  .ppw-i__h{font-size:18px}
  .ppw-i__copy p{font-size:14.5px}
  .ppw-x{padding:14px;gap:11px;border-radius:16px}
  .ppw-find li{padding:10px 12px;gap:8px 10px}
  .ppw-find__l,.ppw-log span{font-size:13px}
  .ppw-tree__lines{display:none}
  .ppw-tree__kids{grid-template-columns:minmax(0,1fr);gap:7px;margin-top:10px}
  .ppw-node{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;padding:10px 12px}
  .ppw-node__t{min-height:0;font-size:13px}
  .ppw-node__bar{grid-column:1 / -1}
  .ppw-tree__cut{margin-top:8px;padding:9px 12px}
  .ppw-log li{padding:9px 11px;gap:10px}
  .ppw-touch b{font-size:24px}
  .ppw-paper{padding:18px 18px 16px;transform:rotate(-1deg)}
  .ppw-paper__big b{font-size:38px}
}
@media (prefers-reduced-motion:reduce){.ppw [style*="--r:"],.ppw-x__sweep{animation:none!important}}

/* ============ THE AUDIT: the six areas as the sample audit's scorecard (the shared tab stage, tabs in a column on wide
   screens) beside the chosen area's page of the report; phones swipe the pages. Verdicts colour each row: flag coral,
   mixed gold, pass teal ============ */
.ppa-sec .ppa-i.is-flag,.ppa-sec .ppa-checks .is-flag{--vc:var(--coral);--vl:var(--coral-line);--vb:rgba(255,122,107,.1)}
.ppa-sec .ppa-i.is-mixed,.ppa-sec .ppa-checks .is-mixed{--vc:var(--gold);--vl:var(--gold-line);--vb:rgba(244,160,0,.1)}
.ppa-sec .ppa-i.is-pass,.ppa-sec .ppa-checks .is-pass{--vc:var(--teal);--vl:var(--teal-line);--vb:rgba(79,191,160,.1)}
.ppa-cap{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.ppa-cap__k{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft)}
.ppa-cap__keep{padding:5px 11px;border-radius:100px;border:1px solid var(--teal-line);font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--teal)}
.ppa__items{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.ppa-i{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:24px;border:1px solid var(--edge);background:#0E1014}
.ppa-i__h{margin:0;font:800 18px/1.2 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppa-i__h .svt-tab{display:flex;align-items:center;gap:12px;width:100%}
.ppa-i__h .svt-tab__n{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--gold)}
.ppa-i__t{flex:1;min-width:0}
.ppa-i__bar{position:relative;flex:0 0 auto;width:64px;height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.ppa-i__bar i{position:absolute;inset:0;border-radius:3px;background:var(--vc);transform-origin:0 50%;transform:scaleX(var(--v))}
.ppa-i__v{flex:0 0 auto;min-width:54px;padding:5px 8px;border-radius:7px;background:var(--vb);font:800 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal;letter-spacing:.08em;text-align:center;color:var(--vc)}
.ppa-i__body{display:grid;align-content:start;gap:16px}
.ppa-page{display:grid;gap:14px}
.ppa-page__top{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ppa-page__n{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.ppa-page__top > b{font:800 24px/1.15 var(--font-head);letter-spacing:-.015em;color:var(--text)}
.ppa-page__score{margin-left:auto;font:600 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.ppa-page__score b{font:800 20px/1 var(--font-head);color:var(--vc)}
.ppa-stamp{padding:6px 11px;border:2px solid var(--vc);border-radius:8px;font:800 13px/1 var(--font-head);font-style:normal;letter-spacing:.16em;color:var(--vc);transform:rotate(-6deg)}
.ppa-page__find{position:relative;margin:0;padding:14px 18px 18px;border-radius:14px;border:1px solid var(--vl);background:var(--vb)}
.ppa-page__find span{position:relative;z-index:1;font:700 19px/1.4 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppa-page__find svg{position:absolute;left:18px;right:18px;bottom:8px;width:calc(100% - 36px);height:10px;transform-origin:0 50%}
.ppa-page__find path{fill:none;stroke:var(--vc);stroke-width:2.2;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.85}
.ppa-i__d{margin:0;font-size:15px;line-height:1.62;color:var(--text-mid)}
.ppa-checks{display:grid;gap:10px}
.ppa-checks__k{font:700 10.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}
.ppa-checks ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.ppa-checks li{display:flex;align-items:center;gap:10px;min-width:0;padding:10px 12px;border-radius:12px;border:1px solid var(--edge);background:#0B0D11;font-size:13.5px;line-height:1.35;color:var(--text)}
.ppa-checks li > i{display:grid;place-items:center;flex:0 0 auto;width:22px;height:22px;border-radius:7px;background:var(--vb);font-style:normal}
.ppa-checks svg{width:13px;height:13px;fill:none;stroke:var(--vc);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.ppa-sum{margin:14px 0 0;font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim)}
@media (min-width:1001px){
  html.el8-js .ppa[data-svt] .ppa__items{grid-template-columns:minmax(0,1fr);gap:0}
  html.el8-js .ppa[data-svt] .ppa-i{grid-area:1 / 1;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);grid-template-rows:repeat(var(--n),62px) 1fr;column-gap:22px;row-gap:8px;padding:0;border:0;background:none;visibility:hidden}
  html.el8-js .ppa[data-svt] .ppa-i.is-cur{visibility:visible}
  html.el8-js .ppa[data-svt] .ppa-i__h{grid-column:1;grid-row:var(--c);height:62px;visibility:visible}
  html.el8-js .ppa[data-svt] .ppa-i__t{font:800 16px/1.2 var(--font-head);letter-spacing:-.01em}
  html.el8-js .ppa[data-svt] .ppa-i__body{grid-column:2;grid-row:1 / -1;gap:18px;padding:28px 30px 30px}
  html.el8-js .ppa[data-svt] .is-cur .ppa-stamp{animation:ppaStamp .45s .25s cubic-bezier(.3,1.5,.5,1) both}
  html.el8-js .ppa[data-svt] .is-cur .ppa-page__find svg{animation:ppaPen .7s .45s var(--ease) both}
  html.el8-js .ppa[data-svt] .is-cur .ppa-checks li{animation:ppwIn .45s calc(var(--k, 0) * 70ms + 300ms) var(--ease) both}
}
@keyframes ppaStamp{from{opacity:0;transform:rotate(-6deg) scale(1.6)}}
@keyframes ppaPen{from{transform:scaleX(0)}}
@media (max-width:1000px){
  .ppa-i__h .svt-tab{flex-wrap:wrap;row-gap:10px}
  .ppa-page__n,.ppa-page__top > b{display:none}
  .ppa-page__score{margin-left:0}
}
@media (max-width:700px){
  .ppa-i{padding:14px;border-radius:20px;gap:12px}
  .ppa-i__h{font-size:17px}
  .ppa-i__bar{width:48px}
  .ppa-page__find{padding:12px 14px 16px}
  .ppa-page__find span{font-size:16px}
  .ppa-i__d{font-size:14px}
  .ppa-checks ul{grid-template-columns:minmax(0,1fr);gap:6px}
  .ppa-checks li{padding:8px 10px;font-size:13px}
}

/* ============ THE FREE AUDIT: one offer card, the copy and its one button beside the report's contents page ============ */
.ppo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:56px;margin-top:56px;padding:44px 48px;border-radius:28px;border:1px solid var(--gold-line);
  background:radial-gradient(80% 120% at 0% 0%,rgba(244,160,0,.09),transparent 55%),#0E1014}
.ppo__copy{display:grid;gap:14px;justify-items:start}
.ppo__k{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.ppo__h{margin:0;font:800 30px/1.12 var(--font-head);letter-spacing:-.025em;color:var(--text)}
.ppo__lead{margin:0;font-size:16px;line-height:1.62;color:var(--text-mid)}
.ppo__none{margin:0;padding:12px 15px;border-radius:13px;border:1px solid var(--teal-line);background:rgba(79,191,160,.06);font-size:14px;line-height:1.5;color:var(--text)}
.ppo__act{display:grid;gap:12px;margin-top:6px}
.ppo__act > b{font:800 18px/1.25 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppo__fine{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;color:var(--text-soft)}
.ppo__fine svg{flex:0 0 auto;width:16px;height:16px;fill:none;stroke:var(--teal);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.ppo__paper{display:grid;place-items:center;padding:10px}
.ppo-doc{width:min(100%,460px);display:grid;gap:14px;padding:26px 28px 24px;border-radius:6px;background:#F5F2EA;color:#1B1D21;box-shadow:0 44px 90px -40px rgba(0,0,0,.95);transform:rotate(1.2deg)}
.ppo-doc__top{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 12px;padding-bottom:12px;border-bottom:2px solid #1B1D21}
.ppo-doc__top b{font:800 22px/1.1 var(--font-head);letter-spacing:-.02em}
.ppo-doc__top span{grid-column:1;font:600 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:#6B6B63}
.ppo-doc__top em{grid-column:2;grid-row:1 / span 2;padding:6px 10px;border:2px solid #11695A;border-radius:7px;font:800 10.5px/1 var(--font-head);font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:#11695A;transform:rotate(-5deg)}
.ppo-doc__k{font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:#7A7A72}
.ppo-doc__list{display:grid;gap:0;margin:0;padding:0;list-style:none}
.ppo-doc__list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:11px 0;border-top:1px dashed #CFCBBF}
.ppo-doc__list li:first-child{border-top:0;padding-top:2px}
.ppo-doc__n{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#1B1D21;font:800 12px/1 var(--font-head);color:#F5F2EA}
.ppo-doc__list b{display:block;font:800 15px/1.25 var(--font-head);letter-spacing:-.01em}
.ppo-doc__list p{margin:3px 0 0;font-size:13px;line-height:1.45;color:#4A4B50}
@media (max-width:1000px){.ppo{grid-template-columns:minmax(0,1fr);gap:32px;padding:32px 28px}}
@media (max-width:700px){
  .ppo{margin-top:36px;padding:24px 18px;border-radius:22px;gap:26px}
  .ppo__h{font-size:24px}
  .ppo__lead{font-size:15px}
  .ppo__paper{padding:0}
  .ppo-doc{padding:20px 18px 18px;transform:rotate(.6deg)}
  .ppo-doc__top b{font-size:19px}
}
@media (prefers-reduced-motion:reduce){.ppa .ppa-stamp,.ppa .ppa-page__find svg,.ppa .ppa-checks li{animation:none!important}}
.ppo__act .svc-band__act{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:10px 20px}

/* ============ PROCESS, with switching agencies: one timeline (the account live the whole way, the steps' days on the
   rail, the chosen one lit) above the five steps on the shared tab stage ============ */
.ppt-line{--off:250px;display:grid;gap:12px;margin-bottom:18px;padding:22px 26px 16px;border-radius:24px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#121519,#0D0F13)}
.ppt-line__top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.ppt-line__top > b{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft)}
.ppt-line__live{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:100px;border:1px solid var(--teal-line);background:rgba(79,191,160,.06);font-size:12.5px;font-weight:600;color:var(--teal)}
.ppt-line__live i{width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(79,191,160,.2)}
.ppt-lane{display:grid;grid-template-columns:calc(var(--off) - 16px) minmax(0,1fr);align-items:center;gap:16px}
.ppt-lane > span{font-size:13.5px;font-weight:600;line-height:1.35;color:var(--text)}
.ppt-lane__bar{position:relative;display:block;height:12px;border-radius:6px}
.ppt-lane.is-run .ppt-lane__bar{background:linear-gradient(90deg,rgba(79,191,160,.55),var(--teal))}
.ppt-lane.is-keep .ppt-lane__bar{background:linear-gradient(90deg,rgba(244,160,0,.35),rgba(244,160,0,.75))}
.ppt-lane__bar b{position:absolute;left:var(--x);top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#EFFFF9;box-shadow:0 0 6px rgba(255,255,255,.7)}
.ppt-rail{position:relative;height:34px;margin:6px 0 0 var(--off)}
.ppt-rail::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--edge-2)}
.ppt-span{position:absolute;left:var(--a);width:var(--w);top:2px;bottom:2px;display:grid;place-items:center;border-radius:9px;border:1px dashed var(--edge-2);background:#0B0D11;transition:border-color .3s,background-color .3s}
.ppt-span b{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim);transition:color .3s}
.ppt-span.is-on{border:1px solid var(--gold);background:rgba(244,160,0,.16)}
.ppt-span.is-on b{color:var(--gold)}
.ppt-axis{position:relative;height:14px;margin-left:var(--off)}
.ppt-axis span{position:absolute;left:var(--x);top:0;white-space:nowrap;font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.ppt__items{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.ppt-i{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:24px;border:1px solid var(--edge);background:#0E1014}
.ppt-i__h{margin:0;font:800 19px/1.2 var(--font-head);letter-spacing:-.015em;color:var(--text)}
.ppt-i__h .svt-tab{display:flex;align-items:center;gap:12px}
.ppt-i__h .svt-tab__n{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--gold)}
.ppt-i__body{display:grid;gap:14px;flex:1;align-content:start}
.ppt-i__k{display:block;margin-bottom:8px;font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.ppt-i__copy p{margin:0;font-size:15px;line-height:1.62;color:var(--text-mid)}
.ppt-acct{display:grid;gap:8px;align-content:start;padding:16px 18px;border-radius:16px;border:1px solid var(--teal-line);background:rgba(79,191,160,.06)}
.ppt-acct__k{display:flex;align-items:center;gap:8px;font:700 10.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.ppt-acct__k i{width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px rgba(79,191,160,.2)}
.ppt-acct p{margin:0;font:700 16px/1.45 var(--font-head);letter-spacing:-.005em;color:var(--text)}
.ppt-note{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px;margin-top:18px;padding:18px 22px;border-radius:20px;border:1px solid var(--teal-line);background:rgba(79,191,160,.05)}
.ppt-note__ic{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(79,191,160,.12)}
.ppt-note__ic svg{width:22px;height:22px;fill:none;stroke:var(--teal);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ppt-note b{display:block;font:800 17px/1.25 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppt-note p{margin:4px 0 0;font-size:14.5px;line-height:1.55;color:var(--text-mid)}
@media (min-width:1001px){
  html.el8-js .ppt[data-svt] .ppt__items{grid-template-columns:minmax(0,1fr);gap:0}
  html.el8-js .ppt[data-svt] .ppt-i{grid-area:1 / 1;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));grid-template-rows:66px auto;gap:10px;padding:0;border:0;background:none;visibility:hidden}
  html.el8-js .ppt[data-svt] .ppt-i.is-cur{visibility:visible}
  html.el8-js .ppt[data-svt] .ppt-i__h{grid-column:var(--c);grid-row:1;height:66px;font-size:inherit;visibility:visible}
  html.el8-js .ppt[data-svt] .ppt-i__t{font:800 15px/1.2 var(--font-head);letter-spacing:-.01em}
  html.el8-js .ppt[data-svt] .ppt-i__body{grid-column:1 / -1;grid-row:2;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:40px;margin-top:6px;padding:28px 30px 28px 34px}
  html.el8-js .ppt[data-svt] .ppt-i__copy p{font-size:17px;line-height:1.66;color:var(--text)}
  html.el8-js .ppt[data-svt] .is-cur .ppt-acct{animation:ppwIn .5s .2s var(--ease) both}
}
@media (max-width:1000px){.ppt-line{--off:200px}}
@media (max-width:700px){
  .ppt-line{--off:0px;padding:16px 14px 12px;border-radius:20px;gap:10px}
  .ppt-line__top{flex-direction:column;align-items:flex-start;gap:8px}
  .ppt-line__live{font-size:11.5px;padding:5px 10px}
  .ppt-lane{grid-template-columns:minmax(0,1fr);gap:6px}
  .ppt-lane > span{font-size:12.5px}
  .ppt-lane__bar{height:9px}
  .ppt-rail{margin-top:2px;height:30px}
  .ppt-span b{font-size:10px}
  .ppt-axis span{font-size:9.5px}
  .ppt-axis span.is-end{left:auto!important;right:0}
  .ppt-i{padding:14px;border-radius:20px}
  .ppt-i__h{font-size:17px}
  .ppt-i__copy p{font-size:14.5px}
  .ppt-acct{padding:12px 14px}
  .ppt-acct p{font-size:14.5px}
  .ppt-note{grid-template-columns:minmax(0,1fr);gap:12px;padding:16px}
}
@media (prefers-reduced-motion:reduce){.ppt .ppt-acct{animation:none!important}}
.ppt-line__key{display:inline-flex;align-items:center;gap:8px;margin-left:auto;font-size:12px;color:var(--text-soft)}
.ppt-line__key i{width:5px;height:5px;border-radius:50%;background:#EFFFF9;box-shadow:0 0 0 3px var(--teal),0 0 8px rgba(255,255,255,.6)}
@media (max-width:700px){.ppt-line__key{margin-left:0;font-size:11.5px}}

/* ============ WHAT TO EXPECT, as gains: the chart's rows are the stages (the shared tab stage, rows in a column on wide
   screens beside one panel). Every line climbs in its own weeks, lit, and holds after ============ */
.ppe-cap{margin-bottom:14px;font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft)}
.ppe__items{display:grid;gap:16px;margin:0;padding:0;list-style:none}
.ppe-i{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:24px;border:1px solid var(--edge);background:#0E1014}
.ppe-i__h{margin:0;font:800 17px/1.25 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppe-i__h .svt-tab{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px 12px}
.ppe-i__h .svt-tab__n{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--gold)}
.ppe-i__plot{position:relative;grid-column:1 / -1;display:block;height:58px;padding-right:26px}
.ppe-i__up{position:absolute;right:0;top:2px;width:20px;height:20px;fill:none;stroke:var(--teal);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ppe-plot{display:block;width:100%;height:100%;overflow:visible}
.ppe-plot__win{fill:rgba(255,255,255,.04)}
.ppe-plot__line{fill:none;stroke:rgba(255,255,255,.2);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.ppe-plot__hot{fill:none;stroke:var(--gold);stroke-width:2.6;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.ppe-i__body{display:grid;gap:10px;align-content:start}
.ppe-i__when{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.ppe-i__t{font:800 22px/1.2 var(--font-head);letter-spacing:-.015em;color:var(--text)}
.ppe-i__body p{margin:0;font-size:15px;line-height:1.62;color:var(--text-mid)}
.ppe-i__body .ppe-i__see{display:grid;gap:4px;margin-top:6px;padding:12px 15px;border-radius:13px;border:1px solid var(--teal-line);background:rgba(79,191,160,.06);font-weight:600;color:var(--text)}
.ppe-i__see span{font:700 10.5px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--teal)}
.ppe-axis{display:none}
@media (min-width:1001px){
  html.el8-js .ppe[data-svt]{--lab:200px}
  html.el8-js .ppe[data-svt] .ppe__items{grid-template-columns:minmax(0,1fr);gap:0}
  html.el8-js .ppe[data-svt] .ppe-i{grid-area:1 / 1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-rows:repeat(var(--n),82px) 1fr;column-gap:24px;row-gap:10px;padding:0;border:0;background:none;visibility:hidden}
  html.el8-js .ppe[data-svt] .ppe-i.is-cur{visibility:visible}
  html.el8-js .ppe[data-svt] .ppe-i__h{grid-column:1;grid-row:var(--c);height:82px;font-size:15.5px;visibility:visible}
  html.el8-js .ppe[data-svt] .ppe-i__h .svt-tab{display:grid;grid-template-columns:30px var(--lab) minmax(0,1fr);gap:14px;padding:0 18px 0 16px}
  html.el8-js .ppe[data-svt] .ppe-i__plot{grid-column:auto;height:46px}
  html.el8-js .ppe[data-svt] .ppe-i:not(.is-cur) .ppe-plot__hot{stroke:rgba(244,160,0,.55)}
  html.el8-js .ppe[data-svt] .ppe-i:not(.is-cur) .ppe-plot__area{opacity:.45}
  html.el8-js .ppe[data-svt] .ppe-i__body{grid-column:2;grid-row:1 / -1;gap:12px;padding:30px 30px 28px}
  html.el8-js .ppe[data-svt] .ppe-i__t{font-size:26px}
  html.el8-js .ppe[data-svt] .ppe-i__body p{font-size:16.5px;color:var(--text)}
  html.el8-js .ppe[data-svt] .is-cur .ppe-i__see{animation:ppwIn .5s .2s var(--ease) both}
  html.el8-js .ppe-axis{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);column-gap:24px;margin-top:10px}
  html.el8-js .ppe-axis__in{display:grid;grid-template-columns:30px var(--lab,200px) minmax(0,1fr);gap:14px;padding:0 44px 0 16px}
  html.el8-js .ppe-axis__ticks{position:relative;grid-column:3;height:14px}
  html.el8-js .ppe-axis__ticks b{position:absolute;left:var(--x);transform:translateX(-50%);white-space:nowrap;font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
  html.el8-js .ppe-axis__ticks b:first-child{transform:none}
}
@media (max-width:700px){
  .ppe-i{padding:14px;border-radius:20px;gap:12px}
  .ppe-i__h{font-size:16px}
  .ppe-i__plot{height:50px}
  .ppe-i__t{font-size:19px}
  .ppe-i__body p{font-size:14.5px}
}
@media (prefers-reduced-motion:reduce){.ppe .ppe-i__see{animation:none!important}}

/* ============ MISTAKES: the month's bill (kit/ppc/bill) beside the seven mistakes as the shared expanding list
   (coral); the chosen mistake lights its part of the bill (.is-on), the rest dim ============ */
.ppm{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:start;gap:28px}
.ppm.is-solo{grid-template-columns:minmax(0,1fr)}
.ppm-bill{display:grid;gap:14px;padding:24px 24px 20px;border-radius:24px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#14171C,#0D0F13);box-shadow:0 50px 100px -60px rgba(0,0,0,.9)}
.ppm-bill__top{display:grid;gap:4px;padding-bottom:12px;border-bottom:1px dashed var(--edge-2)}
.ppm-bill__top b{font:700 11px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text)}
.ppm-bill__top span{font-size:13px;color:var(--text-soft)}
.ppm-bill__spend{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.ppm-bill__spend span{font-size:14px;font-weight:600;color:var(--text-mid)}
.ppm-bill__spend b{font:800 30px/1 var(--font-head);letter-spacing:-.02em;color:var(--text);font-variant-numeric:tabular-nums}
.ppm-bar{display:flex;gap:3px;height:24px}
.ppm-bar__seg{flex:var(--w) 1 0;min-width:6px;border-radius:5px;transition:opacity .3s}
.ppm-bar__seg.is-work{background:linear-gradient(90deg,rgba(79,191,160,.7),var(--teal))}
.ppm-bar__seg.is-leak{background:var(--coral)}
.ppm-bar__seg.is-leak[data-ppm-part="2"]{opacity:.82}.ppm-bar__seg.is-leak[data-ppm-part="3"]{opacity:.66}.ppm-bar__seg.is-leak[data-ppm-part="4"]{opacity:.9}
.ppm-lines{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.ppm-line{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:9px 10px;border-radius:11px;transition:opacity .3s,background-color .3s}
.ppm-line > i{width:12px;height:12px;border-radius:4px;background:var(--coral)}
.ppm-line.is-work > i{background:var(--teal)}
.ppm-line.is-fee > i{background:none;border:2px solid var(--gold)}
.ppm-line.is-miss > i{background:none;border:2px dashed var(--text-dim)}
.ppm-line span{min-width:0;font-size:14px;line-height:1.35;color:var(--text)}
.ppm-line b{font:700 13px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--coral);white-space:nowrap;font-variant-numeric:tabular-nums}
.ppm-line.is-work b{color:var(--teal)}
.ppm-line.is-fee{margin-top:6px;border-top:1px dashed var(--edge-2);border-radius:0 0 11px 11px;padding-top:12px}
.ppm-line.is-fee b{color:var(--gold)}
.ppm-line.is-miss span{color:var(--text-soft)}
.ppm-line.is-miss b{font-style:italic;color:var(--text-dim)}
.ppm-bill__report{display:none;margin:0;padding:11px 14px;border-radius:12px;border:1px dashed var(--coral-line);background:rgba(255,122,107,.06);font-size:13.5px;line-height:1.45;color:var(--text)}
.ppm-bill__sum{margin:0;padding-top:12px;border-top:1px dashed var(--edge-2);font:700 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;color:var(--text-soft)}
.ppm-bill.has-on .ppm-line,.ppm-bill.has-on .ppm-bar__seg{opacity:.32}
.ppm-bill.has-on .ppm-line.is-on,.ppm-bill.has-on .ppm-bar__seg.is-on{opacity:1}
.ppm-bill.has-on .ppm-line.is-on{background:rgba(255,122,107,.09)}
.ppm-bill.has-on .ppm-line.is-fee.is-on{background:rgba(244,160,0,.1)}
.ppm-bill.has-on .ppm-line.is-miss.is-on{background:rgba(255,255,255,.05)}
.ppm-bill.has-on .ppm-line.is-miss.is-on > i{border-color:var(--text-mid)}
.ppm-bill.has-on .ppm-bar__seg.is-on{box-shadow:0 0 0 2px #0D0F13,0 0 0 4px var(--coral)}
.ppm-bill__report.is-on{display:block;animation:ppwIn .4s var(--ease) both}
.ppm-i__ic{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border-radius:11px;border:1px solid var(--coral-line);background:rgba(255,122,107,.07);color:var(--coral)}
.ppm-i__ic svg{width:19px;height:19px;fill:none;stroke:var(--coral);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ppm-i__ic svg .is-blot{stroke:#FFB3A8}
.ppm__list .svc-acc__t{font:800 15.5px/1.3 var(--font-head);letter-spacing:-.01em}
.ppm__list .svc-acc__pad p{margin:0;font-size:15px;line-height:1.62;color:var(--text-mid)}
@media (min-width:1001px){.ppm__list .svc-acc__pad{padding-left:66px}}
@media (max-width:1000px){.ppm{grid-template-columns:minmax(0,1fr)}}
@media (max-width:700px){
  .ppm{gap:16px}
  .ppm-bill{padding:16px 14px 14px;border-radius:20px;gap:11px}
  .ppm-bill__spend b{font-size:24px}
  .ppm-bar{height:18px}
  .ppm-line{padding:6px 6px;gap:10px}
  .ppm-line span{font-size:13px}
  .ppm-line b{font-size:12px}
}
@media (prefers-reduced-motion:reduce){.ppm-bill__report{animation:none!important}}

/* ============ WHY ELEV8D: the account's change history for the same thirty days, a typical agency's beside ours
   (kit/ppc/history), with the tip to check your own ============ */
.ppy{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:56px}
.ppy__copy .wdp-head{margin-bottom:0}
.ppy__tip{display:flex;align-items:flex-start;gap:12px;margin:26px 0 0;padding:15px 17px;border-radius:16px;border:1px solid var(--teal-line);background:rgba(79,191,160,.06);font-size:15px;line-height:1.55;color:var(--text)}
.ppy__tip svg{flex:0 0 auto;width:20px;height:20px;margin-top:1px;fill:none;stroke:var(--teal);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ppy-pic{border-radius:24px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#14171C,#0D0F13);box-shadow:0 50px 100px -55px rgba(0,0,0,.95);overflow:hidden}
.ppy-pic__top{display:flex;align-items:center;gap:12px;height:44px;padding:0 18px;border-bottom:1px solid var(--edge);background:#11141A}
.ppy-pic__top b{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-mid)}
.ppy-pic__eng{display:flex;gap:5px;margin-left:auto}
.ppy-cols{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.ppy-col{display:grid;align-content:start;gap:12px;padding:18px 18px 20px}
.ppy-col.is-them{border-right:1px dashed var(--edge-2);background:rgba(0,0,0,.18)}
.ppy-col.is-us{background:radial-gradient(90% 70% at 100% 0%,rgba(79,191,160,.07),transparent 60%)}
.ppy-col__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--edge)}
.ppy-col__head b{font:800 15px/1.2 var(--font-head);letter-spacing:-.01em;color:var(--text)}
.ppy-col.is-them .ppy-col__head b{color:var(--text-mid)}
.ppy-col__head span{font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.ppy-col.is-them .ppy-col__head span{color:var(--coral)}
.ppy-col.is-us .ppy-col__head span{color:var(--teal)}
.ppy-log{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.ppy-log li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:5px 10px;padding:10px 12px;border-radius:12px;border:1px solid var(--edge);background:#0B0D11}
.ppy-log time{font:700 10.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.ppy-log__who{justify-self:end;padding:3px 8px;border-radius:100px;background:rgba(79,191,160,.12);font:700 10.5px/1.2 var(--font-body,inherit);color:var(--teal);white-space:nowrap}
.ppy-log__who.is-auto{background:rgba(255,122,107,.1);color:var(--coral)}
.ppy-log__what{grid-column:1 / -1;font-size:13.5px;line-height:1.4;color:var(--text)}
.ppy-col.is-them .ppy-log__what{color:var(--text-mid)}
.ppy-log li.ppy-log__gap{display:grid;place-items:center;min-height:78px;border:1px dashed var(--edge-2);background:repeating-linear-gradient(135deg,transparent 0 8px,rgba(255,255,255,.025) 8px 16px)}
.ppy-log__gap span{font-size:12.5px;font-style:italic;color:var(--text-soft);text-align:center}
.ppy-col__more{margin:2px 0 0;font-size:12.5px;font-weight:600;color:var(--teal)}
html.el8-js .ppy__pic:not(.is-in) .ppy-log li{opacity:0}
html.el8-js .ppy__pic.is-in .ppy-col.is-us .ppy-log li{animation:ppwIn .5s calc(var(--r) * 110ms + 250ms) var(--ease) both}
@media (max-width:1080px){.ppy{grid-template-columns:minmax(0,1fr);gap:32px}}
@media (max-width:700px){
  .ppy__tip{margin-top:20px;font-size:14px;padding:13px 14px}
  .ppy-cols{grid-template-columns:minmax(0,1fr)}
  .ppy-col{padding:14px 14px 16px;gap:10px}
  .ppy-col.is-them{border-right:0;border-bottom:1px dashed var(--edge-2)}
  .ppy-log li{padding:8px 10px}
  .ppy-log li.ppy-log__gap{min-height:44px}
  .ppy-log__what{font-size:13px}
}
@media (prefers-reduced-motion:reduce){html.el8-js .ppy__pic .ppy-log li{opacity:1;animation:none!important}}

/* ============ INDUSTRIES: the searches we bid on, by industry. A keyword sheet, a row per industry linking to its
   Google Ads page, two of its searches in exact match brackets ============ */
.ppi{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:56px}
.ppi__copy .wdp-head{margin-bottom:0}
.ppi__all{display:inline-flex;margin-top:22px}
.ppi-sheet{border-radius:24px;border:1px solid var(--edge-2);background:linear-gradient(180deg,#14171C,#0D0F13);box-shadow:0 50px 100px -55px rgba(0,0,0,.95);overflow:hidden}
.ppi-sheet__top{display:flex;align-items:center;gap:12px;height:46px;padding:0 18px;border-bottom:1px solid var(--edge);background:#11141A}
.ppi-sheet__top b{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-mid)}
.ppi-sheet__eng{display:flex;gap:5px;margin-left:auto}
.ppi-rows{display:grid;margin:0;padding:6px;list-style:none}
.ppi-row{display:grid;grid-template-columns:auto minmax(150px,.85fr) minmax(0,1.15fr) auto;align-items:center;gap:14px;padding:10px 12px;border-radius:14px;border:1px solid transparent;color:var(--text);text-decoration:none;transition:border-color .25s,background-color .25s}
.ppi-rows li + li .ppi-row{border-top-color:var(--edge)}
.ppi-row:hover,.ppi-row:focus-visible{border-color:var(--gold-line);background:rgba(244,160,0,.06);outline:none}
.ppi-row__ic{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(244,160,0,.1);color:var(--gold)}
.ppi-row__ic svg{width:18px;height:18px}
.ppi-row__t{font:800 14.5px/1.3 var(--font-head);letter-spacing:-.005em}
.ppi-row__q{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.ppi-row__q i{padding:5px 9px;border-radius:8px;border:1px solid var(--edge-2);background:#0B0D11;font:600 11.5px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;font-style:normal;color:var(--text-mid);white-space:nowrap}
.ppi-row__q i::before{content:"[";color:var(--gold)}
.ppi-row__q i::after{content:"]";color:var(--gold)}
.ppi-row__go svg{width:18px;height:18px;fill:none;stroke:var(--text-dim);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s,stroke .25s}
.ppi-row:hover .ppi-row__go svg,.ppi-row:focus-visible .ppi-row__go svg{stroke:var(--gold);transform:translateX(3px)}
@media (max-width:1180px){.ppi-row{grid-template-columns:auto minmax(0,1fr) auto}.ppi-row__q{grid-column:2 / 3;grid-row:2;flex-direction:row;flex-wrap:wrap}}
@media (max-width:1080px){.ppi{grid-template-columns:minmax(0,1fr);gap:28px}}
@media (max-width:700px){
  .ppi-rows{padding:4px}
  .ppi-row{gap:4px 12px;padding:10px 8px}
  .ppi-row__ic{width:30px;height:30px}
  .ppi-row__t{font-size:14px}
  .ppi-row__q i{font-size:10.5px;padding:4px 7px}
}

/* ============ FREE TOOLS: the start here card's preview is the scorecard itself (no hexagon: SEM's audit is a radar) ============ */
.ppx-tp--score{overflow:visible}
.ppx-tp__big{font:800 38px/1 var(--font-head);letter-spacing:-.03em;fill:var(--text)}
.ppx-tp__of{font:700 13px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:0;fill:var(--text-dim)}
.ppx-tp__pill{fill:rgba(255,122,107,.12);stroke:var(--coral-line)}
.ppx-tp__pilltx{font:700 9.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;fill:var(--coral);text-anchor:middle}
.ppx-tp__lab{font:600 10.5px/1 var(--font-body,inherit);fill:var(--text-mid)}
.ppx-tp__track{fill:rgba(255,255,255,.07)}
.ppx-tp__fill.is-bad{fill:var(--coral)}.ppx-tp__fill.is-mid{fill:var(--gold)}.ppx-tp__fill.is-ok{fill:var(--teal)}
.ppx-tool.is-first .ppx-tp--score{width:86%;max-width:380px}
.ppx-tool:not(.is-first) .ppx-tp--score{width:92%}

/* ============ PRICING: our fee as a band per plan (kit/ppc/fee), stepping up where the plan changes, against a 15% of
   spend fee climbing with every dollar ============ */
.ppf{position:relative;display:grid;gap:8px;min-width:0}
.ppf__key{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;font-size:12.5px;font-weight:600;color:var(--text-mid)}
.ppf__y{margin-right:auto;font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--text-soft)}
.ppf__lg{display:inline-flex;align-items:center;gap:7px}
.ppf__lg i{width:16px;height:10px;border-radius:3px;background:rgba(244,160,0,.55);border:1px solid var(--gold)}
.ppf__lg.is-pct i{height:0;border:0;border-top:2px dashed var(--coral);background:none}
.ppf svg{display:block;width:100%;height:auto;overflow:visible}
.ppf__grid{stroke:rgba(255,255,255,.06);stroke-width:1}
.ppf__axis{fill:none;stroke:var(--edge-2);stroke-width:1.4}
.ppf__band{fill:rgba(244,160,0,.32);stroke:var(--gold);stroke-width:1.4;vector-effect:non-scaling-stroke}
.ppf__band.is-open{fill:url(#none);fill:rgba(244,160,0,.22);stroke-dasharray:0}
.ppf__name{font:800 11.5px/1 var(--font-head);fill:var(--gold);text-anchor:middle}
.ppf__pct{fill:none;stroke:var(--coral);stroke-width:2.2;stroke-dasharray:7 6;vector-effect:non-scaling-stroke}
.ppf__pcttx{font:700 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;fill:var(--coral);text-anchor:end}
.ppf__tick{font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;fill:var(--text-dim);text-anchor:middle}
.ppf__x{justify-self:end;font:700 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-dim)}
.ppf__note{margin:0 0 18px;font:800 21px/1.3 var(--font-head);letter-spacing:-.015em;color:var(--text)}
.ppf__more{display:flex;gap:12px;margin:0}
html.el8-js .ppx-fee:not(.is-in) .ppf__band{opacity:0}
html.el8-js .ppx-fee.is-in .ppf__band{animation:ppfUp .55s calc(var(--k) * 140ms + 200ms) var(--ease) both;transform-box:fill-box;transform-origin:50% 100%}
@keyframes ppfUp{from{opacity:0;transform:scaleY(.2)}}
@media (max-width:700px){.ppf__note{font-size:18px;margin-bottom:12px}.ppf__key{font-size:11.5px}}
@media (prefers-reduced-motion:reduce){html.el8-js .ppx-fee .ppf__band{opacity:1;animation:none!important}}
.ppx-fee .ppx-fee__t{display:block}
.ppf__more .ppx-fee__tick{flex:0 0 auto}

/* ============ GLOSSARY PICTURE (the PPC pass): pins on words sit inline after them, so they never cover the text;
   pins on boxes keep the corner ============ */
.pgp-camps__head .pgp-pin,.pgp-row .pgp-pin,.pgp-chip .pgp-pin{position:relative;right:auto;top:auto;display:inline-grid;flex:0 0 auto;width:18px;height:18px;margin-left:6px;font-size:9.5px;vertical-align:middle}
.pgp-camps__head > span[data-slx-spot]{padding:2px 4px}
.pgp-row__name,.pgp-row__strat,.pgp-row__budget{padding-right:4px!important}
.pgp-row__strat{display:flex;flex-wrap:wrap;align-items:center;row-gap:4px}
.pgp-row__share{display:flex;align-items:center}
.pgp-row__budget .pgp-pin{position:absolute;right:-6px;top:-6px}
.pgp-chip{display:inline-flex;align-items:center;padding:4px 5px 4px 9px}

/* ============ PHONES (the PPC pass): each section's picture, card and dots inside one screen (about 700px); words in
   pictures stay readable; nothing said twice in one card ============ */
@media (max-width:700px){
  /* the audit: the report page carries the score and the stamp, so the tab drops its own bar and verdict */
  .ppa-i__h .ppa-i__bar,.ppa-i__h .ppa-i__v{display:none}
  /* the free audit: the contents page lists what you get; the copy beside it already explains each */
  .ppo-doc__list p{display:none}
  .ppo-doc__list li{padding:9px 0;align-items:center}
  /* the mistakes: the bill tightens so it and the chosen mistake fit together */
  .ppm-bill{gap:9px;padding:14px 13px 12px}
  .ppm-bill__top{padding-bottom:8px;gap:2px}
  .ppm-bill__spend b{font-size:22px}
  .ppm-bar{height:14px}
  .ppm-line{padding:4px 6px;gap:9px}
  .ppm-line.is-fee{margin-top:2px;padding-top:7px}
  .ppm-line span{font-size:12.5px}
  .ppm-bill__sum{padding-top:8px;font-size:10px}
  .ppm__list .svc-acc__pad p{font-size:14px}
  /* the free tools: the scorecard is the first card's picture, big enough to read */
  .ppx-tool.is-first .ppx-tool__peek{height:196px}
  .ppx-tool.is-first .ppx-tp--score{width:auto;height:176px;max-height:none}
  /* the fee chart: its labels at a readable size once the chart shrinks */
  .ppf__name{font-size:17px}
  .ppf__tick,.ppf__pcttx{font-size:15px}
}
@media (max-width:700px){.ppm-line{padding:3px 6px}.ppm-bill{gap:8px}.ppm-line.is-miss b{font-size:11px}}
/* the audit verdict is drawn from its data, so the tab's heading reads as the area alone (no "FLAG" in the outline) */
.ppa-i__v::before{content:attr(data-v)}

/* ============ OWNER REVIEW (2 Oct 2026): spacing on desktop, cards that fill their room on phones, pictures above
   their words, and nothing a phone hides for good: folded words open with "Read more" ============ */
/* read more: phones only; the + turns to × once open */
.ppx-more{display:none}
@media (max-width:700px){
  .ppx-more{display:inline-flex;align-items:center;gap:9px;min-height:44px;margin:0;padding:0 4px;border:0;background:none;color:var(--gold);font:700 14.5px/1 var(--font-body,inherit);cursor:pointer}
  .ppx-more i{position:relative;flex:0 0 auto;width:24px;height:24px;border-radius:50%;border:1px solid var(--gold-line)}
  .ppx-more i::before,.ppx-more i::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:2px;margin:-1px 0 0 -5px;border-radius:2px;background:currentColor;transition:transform .3s var(--ease)}
  .ppx-more i::after{transform:rotate(90deg)}
  .ppx-more[aria-expanded="true"] i::before{transform:rotate(45deg)}
  .ppx-more[aria-expanded="true"] i::after{transform:rotate(135deg)}
  .ppx-more:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:10px}
  .ppo-doc__list.is-open p{display:block}
  .ppo-doc__list.is-open li{align-items:start}
  .ppx-fee__more.is-open{display:inline}
  .ppx-fee__t .ppx-more{margin-top:2px}
}

/* what to expect (desktop; owner, 2 Oct 2026, second look: nothing pushed apart to fill room): the panel hugs the
   stage's words and what you see from us, its top level with the first row */
@media (min-width:1001px){
  html.el8-js .ppe[data-svt] .ppe-i__body{align-self:start}
}

/* why us: the typical agency's quiet spell stretches to the column's foot */
.ppy-col{display:flex;flex-direction:column}
.ppy-log{display:flex;flex-direction:column;flex:1}
.ppy-log li.ppy-log__gap{flex:1}

/* the free audit (desktop; owner, 2 Oct 2026, second look: room between the blocks and the buttons a little lower,
   never an empty middle): the words stay one group beside the contents page, the question and its buttons under a
   dashed rule */
@media (min-width:1001px){
  .ppo__copy{gap:20px}
  .ppo__lead{font-size:16.5px;line-height:1.7}
  .ppo__act{justify-self:stretch;margin-top:8px;padding-top:22px;border-top:1px dashed var(--edge-2)}
}
/* the free audit (phones): the contents page, then the question and its buttons under it */
@media (max-width:1000px){
  .ppo{display:flex;flex-direction:column;align-items:stretch}
  .ppo__copy{display:contents}
  .ppo > *,.ppo__copy > *{min-width:0}
  .ppo__paper{order:1;margin:8px 0 0}
  .ppo > .ppx-more{order:1;align-self:center}
  .ppo__act{order:2;margin-top:10px}
  .ppo__fine{order:3}
}
@media (max-width:700px){
  .ppo{gap:14px}
  .ppo__act{margin-top:6px}
  /* phones: the button full width, the text line centred under it, as the bands */
  .ppo__act .svc-band__act{display:grid;grid-template-columns:minmax(0,1fr);justify-items:stretch;gap:4px}
  .ppo__act .wdp-btn{width:100%;justify-content:center}
  .ppo__fine{justify-content:center}
  /* every button on a phone runs full width */
  .ppx-after__all .wdp-btn{width:100%;justify-content:center}
}

/* the mistakes (desktop): the open answer hugs its words; the list holds its tallest height under the last item
   (sv-ppc.js), so nothing below moves as the answers change */
@media (min-width:1001px){
  .ppm__list{align-content:start}
  html.el8-js .ppm__list .svc-acc__pad{min-height:0}
}

/* phones and tablets: swipe cards fill their room */
@media (max-width:1000px){
  /* the mistakes: the words sit in the middle of the card's room under the title */
  .ppm-i{display:flex;flex-direction:column}
  .ppm-i .svc-acc__body{display:flex;flex-direction:column;justify-content:center;flex:1}
  /* what to expect (owner, 2 Oct 2026, second look: nothing pushed apart): the chart takes the card's spare room, as
     the pictures do on SEM; the words and what you see stay together under it */
  .ppe-i__h{display:flex;flex:1}
  .ppe-i__h .svt-tab{flex:1;grid-template-rows:auto minmax(96px,1fr)}
  .ppe-i__plot{height:auto;align-self:stretch}
  /* the process: what happens to your account sits on the card's floor */
  .ppt-i__body{display:flex;flex-direction:column}
  .ppt-acct{margin-top:auto}
  /* what you get: the worked example above its words, centred in the room above them */
  .ppw-x{align-content:center}
}
@media (max-width:700px){
  /* the free tools: the picture takes the spare room, the words and the link stay together under it */
  .ppx-tools .ppx-tool a,.ppx-tools .ppx-tool.is-first a{grid-template-rows:minmax(124px,1fr) auto}
  .ppx-tool .ppx-tool__peek,.ppx-tool.is-first .ppx-tool__peek{height:auto;min-height:124px}
  .ppx-tool.is-first .ppx-tool__peek{min-height:196px}
  .ppx-tool__go{margin-top:4px}
  /* the comparison: the two columns keep their names */
  .ppx-set__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 6px;padding:12px 12px 10px;font-size:12px}
  .ppx-set__head .ppx-set__corner{display:none}
  .ppx-set__head .ppx-set__us,.ppx-set__head .ppx-set__them{padding-left:10px}
  .ppx-set__head .ppx-set__us em{display:block;margin-top:2px}
  /* the quote card and the account note: the icon beside the title, the words under them (as on SEM) */
  main[data-svc="ppc"] .svc-quote{grid-template-columns:auto minmax(0,1fr);gap:12px 16px;padding:18px 18px 20px}
  main[data-svc="ppc"] .svc-quote > div{display:contents}
  main[data-svc="ppc"] .svc-quote__doc{width:42px;height:52px;padding:10px 8px;gap:4px}
  main[data-svc="ppc"] .svc-quote__doc i{height:4px}
  main[data-svc="ppc"] .svc-quote__doc b{right:-8px;bottom:-8px;width:22px;height:22px;font-size:12px}
  main[data-svc="ppc"] .svc-quote h3{align-self:center;margin:0;font-size:19px;line-height:1.2}
  main[data-svc="ppc"] .svc-quote p,main[data-svc="ppc"] .svc-quote .wdp-btn{grid-column:1 / -1}
  .ppt-note{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px 14px}
  .ppt-note > div{display:contents}
  .ppt-note__ic{width:40px;height:40px;border-radius:12px}
  .ppt-note p{grid-column:1 / -1;margin:0}
  /* the glossary: one card at a time with only an edge of the next, as the page's other swipe cards */
  main[data-svc="ppc"] .slx__entry,main[data-svc="ppc"] .slx__entry:first-child{flex-basis:calc(100% - 22px)}
}
