/* CANNI V8.2.128 — visual templates blend into homepage */
#homeView .v4-home .home-visual-template-v82128{width:100%;max-width:none;margin:0;padding:0;background:transparent!important;text-align:center;overflow:hidden}
#homeView .v4-home .home-visual-template-v82128 img{display:block;height:auto;object-fit:contain;background:transparent;margin:0 auto}
#homeView .v4-home .home-visual-template-v82128.is-landscape img{width:100%;max-width:none}
#homeView .v4-home .home-visual-template-v82128.is-portrait img{width:auto;max-width:min(100%,1080px)}
@media(max-width:700px){#homeView .v4-home .home-visual-template-v82128.is-portrait img{width:100%;max-width:100%}}

/* V296: template-specific CTA, shared with the admin preview. It deliberately
   owns its size instead of inheriting small generic form-button typography. */
#homeView .v4-home .home-visual-link-v293,
.home-visual-button-preview-v296 .home-visual-link-v293{padding:clamp(18px,2cqw,30px) 18px clamp(24px,2.4cqw,36px);text-align:center}
.home-visual-frame-v297 .home-visual-button-v296{
  box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;
  min-height:clamp(48px,4.4cqw,64px);min-width:min(100%,clamp(200px,26cqw,360px));max-width:100%;
  padding:clamp(12px,1.2cqw,18px) clamp(24px,2.5cqw,40px);
  font-family:inherit;font-size:clamp(16px,1.6cqw,24px);font-weight:500;line-height:1.45;letter-spacing:.06em;
  color:var(--home-button-color,#4b4138);-webkit-text-fill-color:var(--home-button-color,#4b4138);background:var(--home-button-background,#faf8f5);
  border:1px solid var(--home-button-border,#d9cfc3);border-radius:2px;box-shadow:none;
  text-align:center;text-decoration:none;white-space:normal;overflow-wrap:anywhere;
  transition:filter .15s ease;
}
a.home-visual-button-v296:hover{filter:brightness(.97)}
a.home-visual-button-v296:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.home-visual-button-v296[hidden]{display:none}
.home-visual-button-preview-v296{padding:18px;text-align:center;border:1px solid #e7e1da;margin-top:14px}
.home-visual-button-preview-v296>small{display:block;color:#81766b;margin-bottom:12px}
@container(max-width:700px){
  .home-visual-button-v296{font-size:16px;min-height:48px;width:min(100%,280px);padding:12px 24px}
}

/* V297: the positioning container is exactly the uncropped image rectangle.
   CTA height may grow for long text; it never shrinks the readable font. */
.home-visual-frame-v297{position:relative;width:100%;container-type:inline-size}
.home-visual-button-preview-v296 .home-visual-frame-v297>img{display:block;width:100%;height:auto;margin:0;max-width:none}
.home-visual-preview-viewport-v304{position:relative;width:100%;overflow:hidden}
.home-visual-preview-canvas-v304{position:absolute;left:50%;top:0;width:390px;transform-origin:top center}
.home-visual-button-preview-v296 [data-preview-width]{max-width:320px;margin:8px auto 16px}
.home-visual-placeholder-v297{aspect-ratio:1;display:grid;place-items:center;background:#f5f1eb;color:#81766b;font-size:14px}
#homeView .v4-home .home-visual-frame-v297[data-button-placement^="inside-"] .home-visual-link-v293,
.home-visual-frame-v297[data-button-placement^="inside-"] .home-visual-link-v293{
  position:absolute;left:5%;right:5%;bottom:var(--home-button-bottom,5%);
  padding:0;text-align:center;line-height:0;pointer-events:none;
}
.home-visual-frame-v297[data-button-placement="inside-left"] .home-visual-link-v293{text-align:left!important}
.home-visual-frame-v297[data-button-placement="inside-right"] .home-visual-link-v293{text-align:right!important}
.home-visual-frame-v297[data-button-placement^="inside-"] .home-visual-button-v296{
  width:clamp(176px,44.444444%,360px);width:clamp(176px,40cqw,360px);min-width:0;max-width:100%;
  min-height:48px;min-height:clamp(48px,4.4cqw,64px);
  padding:10px 12px;font-size:16px;font-size:clamp(16px,1.6cqw,24px);
  line-height:1.45;pointer-events:auto;vertical-align:bottom;
}
.home-visual-frame-v297[data-button-placement^="inside-"][data-image-ready="false"] .home-visual-link-v293{visibility:hidden}

/* V305: the phone composition stays visible even when inspecting a laptop.
   Device canvases use the exact same frame/CTA CSS as the storefront. */
.home-visual-preview-phone-v305{max-width:390px;margin:0 auto 24px}
.home-visual-preview-phone-v305>b{display:block;margin:0 0 10px;color:#4b4138;font-size:16px;font-weight:500}
.home-visual-preview-phone-v305 .home-visual-preview-viewport-v304{border:1px solid #e7e1da;box-sizing:content-box}
.home-visual-preview-device-v305{padding-top:18px;border-top:1px solid #e7e1da}