/* Pet Aftercare Tracking feature page */
.trk-hero h1{max-width:17ch}
.bframe{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 34px 80px rgba(0,60,90,.18);border:1px solid rgba(0,124,179,.12)}
.bframe .bar{height:30px;display:flex;align-items:center;gap:6px;padding:0 14px;background:#f3f8fb;border-bottom:1px solid #e2edf4}
.bframe .bar i{width:10px;height:10px;border-radius:50%;background:#ff5f57}.bframe .bar i:nth-child(2){background:#febc2e}.bframe .bar i:nth-child(3){background:#28c840}
.bframe .bar span{margin-left:12px;flex:1;max-width:280px;height:16px;border-radius:8px;background:#e4eef5}
.bframe img{display:block;width:100%;height:auto}
.panelcard{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 18px 44px rgba(0,60,90,.16);border:1px solid rgba(0,124,179,.12)}
.panelcard img{display:block;width:100%;height:auto}
.trk-stage{position:relative;max-width:1080px;margin:60px auto 0}
.trk-stage .float{position:absolute;right:-36px;bottom:-40px;width:250px}
.trk-stage .float.l{left:-36px;right:auto;bottom:auto;top:40px;width:230px}
/* custody */
.cust-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.cust-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.cust-cards .card{padding:22px}
.cust-cards h3{font-size:17px;margin-bottom:6px;color:var(--ink-deep)}
.cust-cards p{font-size:14.5px}
.cust-shots{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.cust-shots .panelcard:nth-child(2){margin-top:48px}
.cap{font-size:12.5px;color:var(--body);text-align:center;margin-top:10px;font-weight:600;letter-spacing:.02em}
/* station flow */
.stflow{background:#009bdd;padding:96px 0;color:#fff}
.stflow .kicker{color:#d9f1fc}
.stflow h2{color:#fff;text-align:center}
.stflow .lead{color:#eaf7fe;text-align:center;max-width:680px;margin:18px auto 0}
/* Step pills: no horizontal scroller. Desktop wraps centered rows; <=640px is a two-column grid with full wrapped labels. */
.strail{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0;margin:44px 0 26px}
.strail button{flex:none;max-width:100%;min-height:44px;font-family:inherit;font-weight:700;font-size:13px;line-height:1.25;letter-spacing:.05em;text-transform:uppercase;text-align:left;padding:10px 18px;border-radius:100px;border:1.5px solid rgba(255,255,255,.55);background:rgba(255,255,255,.14);color:#fff;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .18s}
.strail button b{flex:none;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.25);display:grid;place-items:center;font-size:12px;line-height:1}
.strail button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.strail button.on{background:#fff;color:var(--ink-deep);border-color:#fff}
.strail button.on b{background:#009bdd;color:#fff}
.st-panel{display:none;grid-template-columns:1fr 1fr;gap:28px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.5);border-radius:22px;padding:34px}
.st-panel.on{display:grid}
.st-panel h3{color:#fff;font-size:24px;margin-bottom:10px}
.st-panel p,.st-panel li{color:#f2faff;font-size:15.5px}
.st-panel ul{display:grid;gap:10px}
.st-panel li{padding-left:26px;position:relative}
.st-panel li::before{content:"";position:absolute;left:0;top:8px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.25)}
.st-panel .opt{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.22);padding:4px 10px;border-radius:99px;margin-bottom:12px}
.custom-flow{display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:center;margin-top:64px}
.custom-flow h3{color:#fff;font-size:26px;margin-bottom:12px}
.custom-flow p{color:#eaf7fe}
.custom-flow .bframe{box-shadow:0 30px 70px rgba(0,40,70,.3)}
/* hardware */
.hw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.hw-grid .card{padding:24px}
.hw-grid h3{font-size:17px;margin-bottom:6px;color:var(--ink-deep)}
.hw-grid p{font-size:14.5px}
/* notes */
.chiprow{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 6px}
.chiprow span{font-size:13px;font-weight:700;color:var(--ink-deep);background:#d9f1fc;padding:7px 14px;border-radius:99px}
.slot{border:2px dashed rgba(0,124,179,.35);border-radius:22px;background:repeating-linear-gradient(45deg,#f5fbff,#f5fbff 12px,#eef7fd 12px,#eef7fd 24px);min-height:340px;display:grid;place-items:center;text-align:center;padding:30px;color:var(--ink);font-weight:700}
.slot small{display:block;font-weight:500;color:var(--body);margin-top:6px}
/* audience tabs */
.aud .day-panel .shot{border:none;border-radius:0;overflow:visible}
.aud .day-panel ul{display:grid;gap:8px;margin-top:14px}
.aud .day-panel li{padding-left:24px;position:relative;font-size:15.5px;color:var(--body)}
.aud .day-panel li::before{content:"";position:absolute;left:0;top:9px;width:10px;height:10px;border-radius:50%;background:#12a3e3}
.aud .day-panel{grid-template-columns:1.1fr .9fr}
.aud .note{margin-top:14px;font-size:14px;background:#eef8fe;border-radius:12px;padding:12px 16px;color:var(--ink-deep)}
@media (max-width:1100px){.trk-stage .float{right:-6px;width:210px}.trk-stage .float.l{display:none}}
@media (max-width:980px){.hw-grid{grid-template-columns:1fr 1fr}.cust-grid,.custom-flow{grid-template-columns:1fr}.st-panel{grid-template-columns:1fr}}
@media (max-width:860px){.aud .day-panel{grid-template-columns:1fr}}
@media (max-width:640px){
 .trk-stage{margin-top:40px}.trk-stage .float{position:relative;right:auto;bottom:auto;width:66%;margin:-18px 0 0 auto}
 .cust-cards,.hw-grid{grid-template-columns:1fr}
 .cust-shots{grid-template-columns:1fr 1fr;gap:12px}.cust-shots .panelcard:nth-child(2){margin-top:28px}
 .stflow{padding:64px 0}.st-panel{padding:24px}.st-panel h3{font-size:21px}
 .strail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:32px 0 20px}
 .strail button{width:100%;min-width:0;justify-content:flex-start;font-size:12.5px;letter-spacing:0;text-transform:none;padding:8px 12px;gap:8px;border-radius:16px;overflow-wrap:break-word;hyphens:auto;hyphenate-limit-chars:10 4 4}
 .strail button b{width:22px;height:22px;font-size:11px}
 .strail button:last-child:nth-child(odd){grid-column:1/-1}
 .slot{min-height:220px}
 .bframe .bar{height:22px}.bframe .bar i{width:8px;height:8px}.bframe .bar span{display:none}
}
@media (max-width:359px){
 .strail{gap:6px}
 .strail button{font-size:12px;padding:8px;gap:6px;overflow-wrap:anywhere}
}