
.pg{padding-top:96px}
.pg-hero{position:relative;min-height:62vh;display:flex;align-items:flex-end;overflow:hidden}
.pg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pg-hero .ai-tag{position:absolute;top:12px;right:16px;z-index:3}
.pg-panel{position:relative;z-index:2;border-radius:30px;padding:24px 22px 26px;margin:0 0 28px;max-width:760px;background:rgba(22,17,13,.62);color:#fff}
.pg-panel>*{position:relative;z-index:2}
.pg-panel h1{font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.08;text-wrap:balance}
.crumb{font-size:.9rem;opacity:.85;margin-bottom:10px}.crumb a{color:#fff}
.pg-body{display:grid;gap:16px;padding-top:28px;padding-bottom:110px}
.pg-sec{border-radius:26px;padding:22px 22px 24px;background:#1f1813;color:#f6efe7}
.pg-sec>*{position:relative;z-index:2}
.pg-sec h2{font-size:1.6rem;margin-bottom:10px;text-wrap:balance}
.pg-sec p,.pg-sec li{line-height:1.6;color:#e9ded2}.pg-sec p+p{margin-top:10px}
.pg-sec ul,.pg-sec ol{margin:10px 0 0 1.2em;display:grid;gap:6px}
.soon{color:#f6efe7;opacity:.9;margin:0}
.all-svc{padding:48px 0;background:#16110d}.all-svc h2{color:#fff;font-size:2rem}
.svc-links{list-style:none;padding:0;margin:18px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.svc-links a{display:block;border-radius:18px;padding:14px 16px;color:#fff;text-decoration:none;background:rgba(255,255,255,.08)}
.svc-links a>*{position:relative;z-index:2}
.all-links{font-size:.9rem;line-height:1.9}.all-links a{color:inherit}
@media (prefers-reduced-transparency:reduce){.pg-panel{background:#16110d}}
.how-steps{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px;counter-reset:s}
.how-steps li{counter-increment:s;position:relative;padding:14px 14px 14px 54px;border-radius:18px;background:rgba(255,255,255,.06)}
.how-steps li::before{content:counter(s);position:absolute;left:14px;top:12px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#efa22f;color:#16110d;font-weight:700}
.pg-sec a{color:#f6c27a}.note{font-style:italic}
.pg-sec{transition:box-shadow .3s ease}.pg-sec:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 10px 30px rgba(0,0,0,.25)}
/* mobile hero (David 2214-2216: 'covering the hero image', 'make it more transparent') */
.dock{transition:transform .35s ease}.dock.dock-hide{transform:translateY(160%)}
@media (max-width:600px){
  .hero-ui{position:static;padding:0}
  .hero-panel{position:absolute;left:10px;right:10px;bottom:calc(80px + var(--sab));--a:.16;--blur:13px;padding:14px 16px 14px;border-radius:24px}
  .hero-panel h1{font-size:clamp(28px,8vw,32px);line-height:1.08;text-shadow:0 1px 14px rgba(0,0,0,.55)}
  .hero-panel .lede{font-size:.98rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 1px 10px rgba(0,0,0,.6)}
  .hero-panel .ctas{display:none}
  .hero .seg{position:absolute;top:78px;left:10px;right:10px;order:0;padding:3px;align-self:auto}
  .hero .seg button{min-height:36px;padding:0 12px;font-size:.88rem}
  .hero>.ai-tag{top:128px;bottom:auto}
  .nav.lg,.dock.lg,.seg.lg{--a:.2;--blur:13px}
  .pg-hero{min-height:58svh}
  .pg-panel{background:rgba(22,17,13,.34);-webkit-backdrop-filter:blur(13px);backdrop-filter:blur(13px);padding:16px 16px 18px}
  .pg-panel h1{font-size:clamp(26px,7.4vw,32px);text-shadow:0 1px 14px rgba(0,0,0,.55)}
  .pg-panel .lede{text-shadow:0 1px 10px rgba(0,0,0,.6)}
}
@media (prefers-reduced-transparency:reduce){.hero-panel,.pg-panel{background:#16110d!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}}
