/* Generated from src/lib/franchise-phone-solid.ts. */

.phone-model-anchor{display:none}
.phone-model-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.phone-model-credit{position:absolute;right:8px;bottom:2px;font:500 8px/1.3 'Manrope',sans-serif;color:var(--muted);z-index:3}
.phone-model-credit a{color:inherit}
.carousel-viewport[data-phone-model="ready"] .phone-3d{opacity:1!important;transform-style:preserve-3d}
.carousel-viewport[data-phone-model="ready"] .phone-body{transform-style:preserve-3d}
.carousel-viewport[data-phone-model="ready"] :is(.phone-side-left,.phone-side-right,.phone-frame,.phone-back){visibility:hidden!important}
.carousel-viewport[data-phone-model="ready"] .phone-front{background:none!important;border:0!important;box-shadow:none!important;overflow:visible!important;border-radius:0!important}
.carousel-viewport[data-phone-model="ready"] .phone-front::before,
.carousel-viewport[data-phone-model="ready"] .phone-front::after{display:none!important}
.carousel-viewport[data-phone-model="ready"] .phone-screen{bottom:auto!important;right:auto!important;border-radius:0!important;box-shadow:none!important;clip-path:polygon(100.0000011% 5.6765183%,99.9432897% 5.4113532%,99.7488012% 4.5020779%,99.0588748% 3.4547824%,97.9384784% 2.4895769%,96.4307030% 1.6435817%,94.5934430% 0.9492769%,92.4973583% 0.4333756%,90.2229203% 0.1156743%,87.6725129% 0.0000062%,86.5677252% 0.0000062%,12.3274896% 0.0000062%,9.7770822% 0.1156743%,7.5026442% 0.4333756%,5.4065595% 0.9492769%,3.5692995% 1.6435817%,2.0615241% 2.4895769%,0.9411277% 3.4547824%,0.2512013% 4.5020779%,0.0439348% 5.4711081%,0.0000014% 5.6765183%,0.0000014% 92.0662813%,0.0000014% 92.5278553%,0.0000014% 94.3234948%,0.2512013% 95.4979353%,0.9411277% 96.5452308%,2.0615241% 97.5104392%,3.5692995% 98.3564315%,5.4065595% 99.0507362%,7.5026442% 99.5666404%,9.7770822% 99.8843389%,12.3274896% 100.0000069%,15.1267617% 100.0000069%,87.6725129% 100.0000069%,90.2229203% 99.8843389%,92.4973583% 99.5666404%,94.5934430% 99.0507362%,96.4307030% 98.3564315%,97.9384784% 97.5104392%,99.0588748% 96.5452308%,99.7488012% 95.4979353%,100.0000011% 94.3234948%,100.0000011% 92.5035124%,100.0000011% 92.0553291%)}

.showcase-module:has(.phone-model-anchor) {
  --phone-ring-fit: .72;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  row-gap: 12px;
  padding: 88px var(--page-gutter) 82px;
  align-items: stretch;
  justify-content: normal;
}
.showcase-module:has(.phone-model-anchor) .showcase-heading {
  grid-row: 1;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  z-index: 3;
}
.showcase-module:has(.phone-model-anchor) .showcase-kicker { margin: 0 0 8px; }
.showcase-module:has(.phone-model-anchor) .showcase-title {
  margin: 0;
  font-size: clamp(1.7rem, 3.8vw, 3rem);
  line-height: 1.08;
}
.showcase-module:has(.phone-model-anchor) .showcase-sub {
  margin: 12px auto 0;
  max-width: 680px;
  font-size: clamp(.8rem, 1.05vw, .95rem);
  line-height: 1.45;
}
.showcase-module:has(.phone-model-anchor) .carousel-viewport {
  grid-row: 2;
  min-height: 0;
  padding: 98px 0 80px;
  box-sizing: border-box;
  overflow: clip;
  perspective-origin: 50% 50%;
}
.showcase-module:has(.phone-model-anchor) .phone-carousel-fit {
  position: relative;
  flex: 0 0 auto;
  width: 220px;
  height: 450px;
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  transform: scale3d(var(--phone-ring-fit), var(--phone-ring-fit), var(--phone-ring-fit));
}
.showcase-module:has(.phone-model-anchor) .ml-insight {
  grid-row: 3;
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  display: flex;
  width: fit-content;
  max-width: min(100%, 540px);
  margin: 0 auto;
  padding: 10px 14px;
  box-sizing: border-box;
  z-index: 3;
}
@media (max-width: 900px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .7; }
  .showcase-module:has(.phone-model-anchor) .phone-carousel-fit { width: 180px; height: 370px; }
  .showcase-module:has(.phone-model-anchor) .carousel-viewport { padding: 72px 0 60px; }
}
@media (max-width: 680px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .68; padding: 84px 16px 70px; row-gap: 10px; }
  .showcase-module:has(.phone-model-anchor) .phone-carousel-fit { width: 150px; height: 310px; }
  .showcase-module:has(.phone-model-anchor) .carousel-viewport { padding: 52px 0 42px; }
  .showcase-module:has(.phone-model-anchor) .showcase-sub { margin-top: 10px; }
  .showcase-module:has(.phone-model-anchor) .ml-insight { padding: 8px 10px; }
}
@media (max-width: 420px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .72; }
  .showcase-module:has(.phone-model-anchor) .phone-carousel-fit { width: 120px; height: 250px; }
  .showcase-module:has(.phone-model-anchor) .showcase-title { font-size: 1.65rem; }
  .showcase-module:has(.phone-model-anchor) .showcase-sub { font-size: .76rem; }
}
@media (max-height: 800px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .62; }
  .showcase-module:has(.phone-model-anchor) .carousel-viewport { padding-top: 76px; padding-bottom: 62px; }
}
@media (max-height: 680px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .52; padding-top: 82px; padding-bottom: 66px; }
  .showcase-module:has(.phone-model-anchor) .carousel-viewport { padding-top: 48px; padding-bottom: 40px; }
}
@media (max-height: 560px) {
  .showcase-module:has(.phone-model-anchor) { --phone-ring-fit: .42; row-gap: 8px; padding-top: 78px; padding-bottom: 62px; }
  .showcase-module:has(.phone-model-anchor) .showcase-title { font-size: 1.45rem; }
  .showcase-module:has(.phone-model-anchor) .showcase-sub { font-size: .7rem; margin-top: 6px; }
  .showcase-module:has(.phone-model-anchor) .carousel-viewport { padding-top: 24px; padding-bottom: 20px; }
}