/* Styles for the front-page.php template. They used to be a <style> block inside the page;
   now they load from this cacheable file, after the theme's other stylesheets. */
/* Home page design form + anchor scrolling */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
#design-your-pet-id { scroll-margin-top: 90px; }
.mpdmv-home-designer { background: #EAF6FD; padding: 48px 16px; }
.mpdmv-home-designer-wrap { max-width: 1200px; margin: 0 auto; }
.mpdmv-home-designer-head { text-align: center; max-width: 760px; margin: 0 auto 28px; }
.mpdmv-home-designer-head h2 { color: #0B1E3D; margin: 0 0 12px; }
.mpdmv-home-designer-head p { color: #0B1E3D; margin: 0; }
.as-seen-on-section .as-seen-on-title { text-align: center; font-size: 28px; font-weight: 700; line-height: 1.2; color: #0B1E3D; margin: 0 0 18px; }
@media (max-width: 600px) { .mpdmv-home-designer { padding: 32px 12px; } }

/* ===== Mobile "Choose your state" lightbox (bottom sheet on phones, window on larger screens) ===== */
#mpdmv-lb{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100000;display:none;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#1d2b44;line-height:1.45;text-align:left}
#mpdmv-lb.is-mounted{display:block}
#mpdmv-lb *,#mpdmv-lb *:before,#mpdmv-lb *:after{box-sizing:border-box}
#mpdmv-lb .lb-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(11,30,61,.58);opacity:0;transition:opacity .25s ease}
#mpdmv-lb .lb-panel{position:absolute;left:0;right:0;bottom:0;max-height:94vh;max-height:94dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:#fff;border-radius:22px 22px 0 0;padding:10px 18px calc(18px + env(safe-area-inset-bottom));transform:translateY(100%);transition:transform .32s cubic-bezier(.2,.8,.2,1);box-shadow:0 -12px 40px rgba(11,30,61,.25);outline:0}
#mpdmv-lb.is-open .lb-backdrop{opacity:1}
#mpdmv-lb.is-open .lb-panel{transform:none}
#mpdmv-lb .lb-grab{width:42px;height:5px;border-radius:3px;background:#cfdbe8;margin:0 auto 10px}
#mpdmv-lb button{font:inherit;margin:0;-webkit-appearance:none;appearance:none;text-transform:none;letter-spacing:normal;box-shadow:none;text-shadow:none}
#mpdmv-lb .lb-close{position:absolute;top:10px;right:12px;width:40px;height:40px;padding:0;border:0;border-radius:50%;background:#EAF6FD;color:#0B1E3D;font-size:24px;line-height:1;cursor:pointer}
#mpdmv-lb .lb-close:focus-visible,#mpdmv-lb .lb-cta:focus-visible,#mpdmv-lb .lb-link:focus-visible,#mpdmv-lb .lb-ver:focus-visible{outline:3px solid #1CA7E0;outline-offset:2px}
#mpdmv-lb .lb-eyebrow{margin:6px 52px 2px 0;padding:0;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#1CA7E0}
#mpdmv-lb .lb-title{margin:0 52px 4px 0;padding:0;font-size:22px;line-height:1.2;font-weight:700;color:#0B1E3D;font-family:inherit}
#mpdmv-lb .lb-sub{margin:0 0 14px;padding:0;color:#5b6b82;font-size:14px}
#mpdmv-lb .lb-vers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 14px}
#mpdmv-lb .lb-vers[hidden]{display:none}
#mpdmv-lb .lb-ver{display:block;width:100%;padding:8px;border:2px solid #d9e4ef;border-radius:14px;background:#fff;text-align:left;cursor:pointer;color:#1d2b44}
#mpdmv-lb .lb-ver[aria-checked="true"]{border-color:#F7941D;box-shadow:0 0 0 3px rgba(247,148,29,.2)}
#mpdmv-lb .lb-thumb{display:block;position:relative;aspect-ratio:1031/638;border-radius:8px;overflow:hidden;background:#EAF6FD}
#mpdmv-lb .lb-thumb img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
#mpdmv-lb .lb-lbl{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:13px;font-weight:700;color:#0B1E3D}
#mpdmv-lb .lb-dot{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid #aab9cb;background:#fff}
#mpdmv-lb .lb-ver[aria-checked="true"] .lb-dot{border-color:#F7941D;background:radial-gradient(circle,#F7941D 0 45%,#fff 50%)}
#mpdmv-lb .lb-card{position:relative;aspect-ratio:1031/638;border-radius:16px;overflow:hidden;background:#EAF6FD;box-shadow:0 10px 28px rgba(11,30,61,.18);margin:0 0 6px}
#mpdmv-lb .lb-card img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;opacity:0;transition:opacity .2s}
#mpdmv-lb .lb-card img.is-ready{opacity:1}
#mpdmv-lb .lb-card:after,#mpdmv-lb .lb-thumb:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translateX(-100%);animation:mpdmvlbshine 1.2s infinite;pointer-events:none}
#mpdmv-lb .is-loaded:after{display:none}
#mpdmv-lb .lb-pet{position:absolute;display:block;overflow:hidden;margin:0;padding:0;background:#bfe6f7;opacity:0;transition:opacity .25s ease;pointer-events:none}
#mpdmv-lb .is-loaded .lb-pet{opacity:1}
#mpdmv-lb .is-failed .lb-pet{display:none}
#mpdmv-lb .lb-card .lb-pet img,#mpdmv-lb .lb-thumb .lb-pet img{position:absolute;top:0;left:0;display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;object-fit:cover;object-position:50% 30%;opacity:1;transition:none}
#mpdmv-lb .lb-pet svg{position:absolute;top:0;left:0;display:block;width:100%;height:100%;overflow:hidden}
#mpdmv-lb .lb-fail{position:absolute;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;padding:16px;text-align:center;font-size:14px;color:#5b6b82}
#mpdmv-lb .is-failed .lb-fail{display:flex}
@keyframes mpdmvlbshine{to{transform:translateX(100%)}}
#mpdmv-lb .lb-note{margin:0 0 14px;padding:0;font-size:12px;color:#7a8aa0}
#mpdmv-lb .lb-offer{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 10px}
#mpdmv-lb .lb-price{font-size:26px;font-weight:800;color:#0B1E3D}
#mpdmv-lb .lb-offer span{color:#5b6b82;font-size:14px}
#mpdmv-lb .lb-offer .lb-price{color:#0B1E3D;font-size:26px}
#mpdmv-lb .lb-trust{display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 0 14px;padding:0;list-style:none;font-size:13px;color:#1d2b44}
#mpdmv-lb .lb-trust li{margin:0;padding:0}
#mpdmv-lb .lb-trust li:before{content:"\2713";color:#1d9a5b;font-weight:800;margin-right:5px}
#mpdmv-lb .lb-cta{display:block;width:100%;padding:16px 18px;border:0;border-radius:14px;background:#F7941D;color:#0B1E3D;font-size:17px;font-weight:800;line-height:1.2;cursor:pointer;box-shadow:0 6px 16px rgba(247,148,29,.35)}
#mpdmv-lb .lb-cta:active{transform:translateY(1px)}
#mpdmv-lb .lb-link{display:block;width:100%;margin-top:8px;padding:12px;border:0;background:none;color:#5b6b82;font-size:14px;text-decoration:underline;cursor:pointer}
#mpdmv-lb .lb-body{display:flex;flex-direction:column}
#mpdmv-lb .lb-info{display:contents}
#mpdmv-lb .lb-head{order:1}#mpdmv-lb .lb-media{order:2}#mpdmv-lb .lb-offer{order:3}#mpdmv-lb .lb-trust{order:4}#mpdmv-lb .lb-cta{order:5}#mpdmv-lb .lb-link{order:6}
@media (min-width:700px){
  #mpdmv-lb .lb-panel{left:50%;right:auto;top:50%;bottom:auto;width:min(880px,94vw);border-radius:22px;padding:26px 28px 22px;transform:translate(-50%,-46%) scale(.97);opacity:0;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s}
  #mpdmv-lb.is-open .lb-panel{transform:translate(-50%,-50%);opacity:1}
  #mpdmv-lb .lb-grab{display:none}
  #mpdmv-lb .lb-close{top:14px;right:16px}
  #mpdmv-lb .lb-body{display:grid;grid-template-columns:1.15fr 1fr;gap:28px;align-items:start}
  #mpdmv-lb .lb-info{display:block;order:2}
  #mpdmv-lb .lb-media{order:1}
  #mpdmv-lb .lb-head,#mpdmv-lb .lb-offer,#mpdmv-lb .lb-trust,#mpdmv-lb .lb-cta,#mpdmv-lb .lb-link{order:0}
  #mpdmv-lb .lb-eyebrow,#mpdmv-lb .lb-title{margin-right:44px}
}
@media (prefers-reduced-motion:reduce){
  #mpdmv-lb .lb-backdrop,#mpdmv-lb .lb-panel,#mpdmv-lb .lb-pet{transition:none}
  #mpdmv-lb .lb-card:after,#mpdmv-lb .lb-thumb:after{animation:none}
}
