/* Recommendations have their own layout contract, independent of catalog cards. */
html body .frRecommendations{--fr-line:color-mix(in srgb,currentColor 24%,transparent);--fr-soft:color-mix(in srgb,currentColor 5%,transparent);width:100%;min-width:0;margin:24px 0 54px;color:inherit}
html body .frRail{display:grid;grid-auto-flow:column;grid-template-rows:1fr;grid-template-columns:none;grid-auto-columns:min(var(--fr-width,276px),calc(100% - 28px));gap:24px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding:4px;padding:8px 4px 18px;scrollbar-width:thin;scrollbar-color:var(--fr-line) transparent;max-width:100%;align-items:stretch;cursor:grab}
html body .frRail.is-dragging{scroll-snap-type:none;cursor:grabbing;user-select:none}
html body .frCard{display:flex;flex-direction:column;position:relative;min-width:0;width:100%;max-width:none;height:auto;margin:0;padding:0;color:inherit;background:transparent;border:0;text-decoration:none;scroll-snap-align:start;isolation:isolate}
html body .frMedia{display:block;position:relative;flex:none;aspect-ratio:4/5;width:100%;overflow:hidden;background:var(--fr-soft);border-radius:var(--fr-radius,12px)}
html body .frMedia img{display:block;position:static;width:100%;height:100%;object-fit:contain;max-width:100%;margin:0;padding:10px;transform:none}
html body .frCopy{display:flex;flex-direction:column;gap:10px;flex:1;padding:18px 2px 4px;min-width:0}
html body .frCopy>strong{display:block;font-family:var(--store-font-heading,var(--new-head,inherit));font-size:clamp(18px,1.6vw,24px);font-weight:600;line-height:1.25;overflow-wrap:anywhere;letter-spacing:normal;color:inherit}
html body .frPrice{font-size:14px;line-height:1.5;color:inherit}
html body .frCta{display:flex;justify-content:space-between;align-items:center;gap:10px;font:inherit;font-size:12px;line-height:1.4;border-top:1px solid var(--fr-line);padding-top:13px;margin-top:auto;min-height:44px}
html body .frPlaceholder{display:grid;place-content:center;height:100%;font-size:13px;padding:20px}
html body .fxArrow{display:inline-block;vertical-align:middle;width:1.2em;height:1.2em;flex:none;stroke-width:var(--fx-stroke,1.5);stroke-linecap:var(--fx-cap,round);stroke-linejoin:var(--fx-cap,round)}
html body .frCta .fxArrow{width:22px;height:22px}
html body .frNavigation{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px;font-size:12px}
html body .frNavigation[hidden]{display:none}
html body .frNavigation>div{display:flex;gap:8px}
html body .frNavigation button{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--fr-line);border-radius:var(--fr-radius,50%);background:transparent;color:inherit;padding:10px;cursor:pointer}
html body .frNavigation button:disabled{opacity:.3;cursor:default}
html body [data-fr-step="-1"] svg{transform:rotate(180deg)}
html body :is(.frRail,.frCard,.frNavigation button):focus-visible{outline:2px solid currentColor;outline-offset:3px}
/* The card treatment belongs to the storefront's art direction. */
[data-fx-card=gallery]{--fr-radius:2px}
html[data-fx-card=gallery] .frMedia{background:transparent;border-bottom:1px solid var(--fr-line)}
[data-fx-card=airy]{--fr-radius:38% 38% 8px 8px}
html[data-fx-card=airy] .frCopy{padding:22px 8px 4px}
[data-fx-card=round]{--fr-radius:30px}
[data-fx-card=block]{--fr-radius:0;--fx-stroke:2;--fx-cap:square}
html[data-fx-card=block] .frCard{border:2px solid currentColor;box-shadow:4px 4px 0 currentColor}
html[data-fx-card=block] .frCopy{padding:16px}
html[data-fx-card=block] .frCopy>strong{text-transform:uppercase}
[data-fx-card=folio]{--fr-radius:0}
html[data-fx-card=folio] .frMedia{padding:10px;border:1px solid var(--fr-line);box-shadow:inset 0 0 0 6px var(--store-bg,var(--bg,#fff))}
html[data-fx-card=folio] .frCopy{padding-inline:10px}
[data-fx-card=cameo]{--fr-radius:48% 48% 2px 2px;--fx-stroke:1}
html[data-fx-card=cameo] .frMedia{border:4px double currentColor;padding:10px}
html[data-fx-card=cameo] .frCopy{text-align:center}
[data-fx-card=theatre]{--fr-radius:48% 48% 0 0;--fx-stroke:1.2}
html[data-fx-card=theatre] .frMedia{border:4px double color-mix(in srgb,currentColor 45%,#b09255);padding:12px}
html[data-fx-card=theatre] .frCopy{border-bottom:3px double var(--fr-line);padding-bottom:14px}
[data-fx-card=ticket]{--fr-radius:0}
html[data-fx-card=ticket] .frCard{border:1px dashed var(--fr-line);padding:12px}
html[data-fx-card=ticket] .frCta{border-top-style:dashed}
[data-fx-card=paper]{--fr-radius:0}
html[data-fx-card=paper] .frMedia{clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,0 100%)}
html[data-fx-card=paper] .frMedia:after{content:'';position:absolute;right:0;top:0;width:24px;height:24px;background:var(--fr-line);clip-path:polygon(0 0,100% 100%,0 100%)}
[data-fx-card=technical]{--fr-radius:0;--fx-cap:square;--fx-stroke:1}
html[data-fx-card=technical] .frCard{border:1px solid var(--fr-line);padding:14px}
html[data-fx-card=technical] .frPrice,html[data-fx-card=technical] .frCta{font-family:monospace}
[data-fx-card=shelf]{--fr-radius:10px}
html[data-fx-card=shelf] .frMedia{border-bottom:6px solid var(--fr-line)}
[data-fx-card=sketch]{--fr-radius:4px 12px 6px 10px;--fx-stroke:1.8}
html[data-fx-card=sketch] .frMedia{border:2px solid currentColor}
[data-fx-card=stitch]{--fr-radius:16px}
html[data-fx-card=stitch] .frMedia{border:1px dashed currentColor;padding:9px;outline:1px dashed var(--fr-line);outline-offset:-7px}
[data-fx-card=orbit]{--fr-radius:50% 50% 12px 12px;--fx-stroke:1.2}
html[data-fx-card=orbit] .frMedia{border:1px solid var(--fr-line)}
[data-fx-card=window]{--fr-radius:12px 12px 0 0}
html[data-fx-card=window] .frMedia{border:1px solid currentColor;border-top-width:12px}
html[data-store-theme=veraneio] .frCard{border-top:4px double currentColor}
html[data-store-theme=recreio] .frCopy{background:repeating-linear-gradient(transparent 0 27px,var(--fr-soft) 27px 28px)}
html[data-store-theme=retalho] .frCard:nth-child(even) .frMedia{background:color-mix(in srgb,var(--new-accent,currentColor) 10%,transparent)}
/* Small drawn signatures connect a section heading to its imagery. */
/* Signatures are ornamental: inserting them must not shift the layout. */
.cvHead>div{position:relative}
.fxSignature{display:block;position:absolute;left:0;bottom:-14px;width:64px;height:10px;margin:0;overflow:visible;opacity:.65;pointer-events:none}
html body [data-fx-state=pending]{opacity:0}
html body [data-fx-state=running]{will-change:translate,opacity}
@media print{html body [data-fx-state]{opacity:1!important;translate:none!important;rotate:none!important;scale:none!important}}
.fxSignature path{fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 html body :is(.cvMedia,.frMedia){transition:transform .45s cubic-bezier(.2,.75,.25,1)}
 html body :is(.cvMedia,.frMedia)>img{transition:scale .65s cubic-bezier(.2,.75,.25,1)}
 html[data-fx-hover=zoom] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia)>img{scale:1.045}
 html[data-fx-hover=tilt] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia){transform:translateY(-4px) rotate(-1deg)}
 html[data-fx-hover=lift] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia){transform:translateY(-6px)}
 html[data-fx-hover=press] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia){transform:translate(-3px,-3px)}
 html[data-fx-hover=press] :is(.cvLink,.frCard):active :is(.cvMedia,.frMedia){transform:translate(1px,1px)}
 html[data-fx-hover=drift] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia){transform:translateY(-5px) rotate(.6deg)}
 html[data-fx-hover=frame] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia)>img{scale:1.035}
 html[data-fx-hover=frame] :is(.cvLink,.frCard):hover :is(.cvMedia,.frMedia){outline:1px solid currentColor;outline-offset:-8px}
 html body :is(.cvCta,.frCta,.dgProductCta,.summerMore,.portalOpen) .fxArrow{transition:translate .3s ease}
 html body :is(a,button):hover>.fxArrow,html body :is(.cvLink,.frCard):hover .fxArrow{translate:3px 0}
}
@media(max-width:760px){html body .frRail{gap:16px;grid-auto-columns:min(var(--fr-width,260px),calc(100% - 34px))}html body .frCopy>strong{font-size:19px}html body .frRecommendations{margin-bottom:34px}.fxSignature{width:52px}}
@media(prefers-reduced-motion:reduce){html body [data-fx-state]{opacity:1!important}html body .frRail{scroll-behavior:auto}html body :is(.cvMedia,.frMedia,.fxArrow,.fxSignature){animation:none!important;transition:none!important}}
