/* Vitrine: movimento leve e destinos livres do cabeçalho fixo. */
/* A short label separates the product value from other information. */
#product-shade .product-price-label{font:500 10px/1.3 var(--sans);color:var(--muted);letter-spacing:0;text-transform:none}
#product-shade .product-value{display:grid;gap:4px;min-width:0}

/* Suppress image-save callouts and native image dragging on the storefront. */
#topo img,#product-shade img,#topo .product-photo-link,#topo .featured-image-button{-webkit-touch-callout:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none}

/* Keep a loading indication until the selected photo is fully decoded. */
#product-shade #product-photo-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:8px 12px;border-radius:6px;background:var(--cream);color:var(--muted);font:400 11px/1.3 var(--sans);pointer-events:none}
#product-shade #product-photo-status[hidden]{display:none}

/* Mobile: reveal the buying section instead of making scrolling a discovery. */
@media(max-width:600px){
 #product-shade .product-modal-gallery>img{height:clamp(240px,44svh,380px);aspect-ratio:auto;object-fit:contain}
 #product-shade .product-photo-thumbnails{padding-block:6px;gap:8px}
 #product-shade .product-photo-thumbnail{width:38px;height:48px;min-width:38px}
 #product-shade .product-scroll-cue:not([hidden]){position:static;transform:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:36px;min-height:36px;padding:8px 18px;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;background:var(--cream);backdrop-filter:none;-webkit-backdrop-filter:none;font:500 11px/1.3 var(--sans)}
 #product-shade .product-scroll-cue>span{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}
 #product-shade .product-scroll-cue::before{display:none}
 #product-shade .product-scroll-cue svg{width:14px;height:14px}
}

/* The entire product card opens details; prices lead the buying information. */
#topo .product-card,#topo .featured-slide{cursor:pointer}
#topo .product-prices .current-price{font:700 18px/1.25 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
#topo #featured-section .featured-slide-info{flex-wrap:wrap;row-gap:6px}
#topo #featured-section .featured-slide-info>span{font:700 18px/1.25 var(--sans);color:var(--ink);padding-top:0;font-variant-numeric:tabular-nums}
#product-shade #modal-price{font:700 26px/1.2 var(--sans);color:var(--ink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
#product-shade .modal-prices{margin-top:16px;margin-bottom:22px}
@media(max-width:600px){
 #topo .product-prices .current-price,#topo #featured-section .featured-slide-info>span{font-size:16px}
 #product-shade #modal-price{font-size:24px}
}

/* A real product link makes the whole photo a single-click target. */
#topo .product-photo-link{display:block;width:100%;height:100%;touch-action:manipulation;cursor:pointer}
#topo .product-photo-link:focus-visible,#topo .featured-image-button:focus-visible{outline:2px solid var(--rose-dark);outline-offset:-3px}
#topo .featured-image-button{touch-action:manipulation}

/* Product details: consistent controls and a title-first mobile heading. */
#product-shade #size-options .product-option-values .size-choice{width:96px;min-width:96px;max-width:100%;font:400 11px/1.2 var(--sans);white-space:normal;overflow-wrap:anywhere;overflow:hidden}
#product-shade .product-option-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
#product-shade #modal-description[hidden],#product-shade .product-share-link[hidden]{display:none}
#product-shade .modal-prices{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
#product-shade .product-share-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;margin-left:auto;min-height:32px;padding:6px 8px;border:0;background:transparent;color:var(--muted);font:400 11px/1.2 var(--sans);cursor:pointer}
#product-shade .product-share-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
#product-shade .product-share-button:focus-visible{outline:2px solid var(--rose-dark);outline-offset:2px}
#product-shade .product-share-link{display:grid;gap:6px;margin-top:12px;font-size:11px}
#product-shade .product-share-link input{width:100%;min-width:0;padding:10px;border:1px solid var(--line);background:var(--cream);color:var(--ink);font-size:12px}
@media(max-width:600px){
 #product-shade #modal-category{display:none}
 #product-shade #product-heading{padding:20px 56px 16px 18px;min-width:0}
 #product-shade #product-heading h2{margin:0;font:500 clamp(22px,6vw,26px)/1.22 var(--serif);overflow-wrap:anywhere}
 #product-shade .product-share-button{min-height:40px}
}

/* Compact option controls, aligned with the modal's small labels and body copy. */
#product-shade .size-picker>#size-options{gap:12px}
#product-shade .product-option-group legend{margin-bottom:6px}
#product-shade .product-option-values{gap:8px}
#product-shade .product-option-values .size-choice{
 height:32px;min-height:32px;min-width:32px;padding:0 10px;
 font-size:11px;line-height:1.2
}
#product-shade .product-option-help{margin:0;font-size:10px;line-height:1.5}
@media(max-width:600px){
 #product-shade .product-option-values .size-choice{height:40px;min-height:40px;min-width:40px;padding-inline:10px}
}

/* Do not resample product photos with fractional hover zooms during scroll. */
#topo .product-image img,
#topo .product-card:hover .product-image img,
#topo .featured-image-button img,
#topo .featured-image-button:hover img{
 transform:none;filter:none;will-change:auto;transition:none
}

#topo,#novidades,#colecao,#sobre,#topo .section-heading,#filter-carousel{
  scroll-margin-top:var(--storefront-scroll-offset,110px)
}
.main-nav a{position:relative;padding-block:10px}
.main-nav a::after{
  content:"";position:absolute;inset:auto 0 3px;height:1px;
  background:currentColor;transform:scaleX(0);transform-origin:center;
  transition:transform .25s ease
}
.main-nav a:hover::after,.main-nav a[aria-current="location"]::after{transform:scaleX(1)}
.main-nav a[aria-current="location"]{color:var(--rose-dark)}
#topo>.section-divider{
  display:flex;align-items:center;justify-content:center;gap:12px;
  width:148px;height:8px;margin:28px auto 0;color:var(--rose-dark)
}
.section-divider::before,.section-divider::after{content:"";height:1px;flex:1;background:var(--line)}
.section-divider span{width:4px;height:4px;border:1px solid currentColor;transform:rotate(45deg);opacity:.55}
#topo>.section-divider+.collection{padding-top:40px;padding-bottom:42px}
#topo>.section-divider:has(+.story){margin-top:8px;margin-bottom:36px}
.story-art{position:relative}
#product-grid>.loading{
  grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:12px;min-height:160px
}
#product-grid>.loading::before{
  content:"";width:16px;height:16px;border:1px solid var(--line);border-top-color:var(--rose-dark);
  border-radius:50%;animation:storefront-spin .9s linear infinite
}
@keyframes storefront-spin{to{transform:rotate(360deg)}}
@media(max-width:600px){
  #topo>.section-divider{width:112px;margin-top:22px}
  #topo>.section-divider+.collection{padding-top:30px;padding-bottom:30px}
  #topo>.section-divider:has(+.story){margin-top:4px;margin-bottom:24px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .main-nav a::after{transition:none}
  #product-grid>.loading::before{animation:none}
}

/* A complete opening screen, followed by the highlights on the next scroll. */
@media(min-width:901px){
 #topo>.hero{min-height:max(510px,calc(100svh - var(--storefront-header-height,76px) - var(--storefront-announcement-height,32px) - var(--storefront-benefits-height,140px) - 66px))}
}
#topo .store-benefits .benefit-whatsapp-icon{fill:var(--muted);stroke:none}
:root[data-theme] .mobile-bar a[aria-current="location"]{color:var(--rose-dark)}
@media(max-width:600px){
 #topo>.hero{margin:11px 12px 0}
 #topo .hero-copy{order:1;padding:28px 20px 24px}
 #topo .hero h1{font-size:clamp(32px,8.8vw,43px);line-height:1.12;max-width:none;margin:10px 0 16px}
 #topo .hero-text{font-size:12px;line-height:1.8;margin-bottom:22px;max-width:none}
 #topo .hero-copy>.button{width:100%;justify-content:space-between;min-height:50px;padding-inline:22px}
 #topo .hero-photo{order:2;height:auto;min-height:0;aspect-ratio:1.18}
 #topo .hero-photo img{object-position:50% 35%}
 .mobile-bar{grid-template-columns:repeat(4,minmax(0,1fr))}
 .mobile-bar a,.mobile-bar button{min-width:0}
}

/* Give the information strip and the Instagram section their own breathing room. */
#topo>.benefits.store-benefits{margin-top:40px;padding-top:32px;padding-bottom:40px}
#topo>.story{margin-bottom:64px}
@media(max-width:600px){
 #topo>.hero{margin-top:10px}
 #topo .hero-copy{padding:24px 19px 22px}
 #topo .hero-text{margin-bottom:18px}
 #topo .hero-photo{height:var(--storefront-mobile-photo-height,300px);min-height:180px;aspect-ratio:auto;flex:none}
 #topo>.benefits.store-benefits{margin-top:24px;padding-top:12px;padding-bottom:20px}
 #topo>.story{margin-bottom:24px}
}


@media(max-width:600px){
 .header{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--cream)}
 :root[data-theme="dark"] .header{background:var(--cream)}
 #mobile-menu,#close-menu,.menu-links a{touch-action:manipulation}
 .menu-drawer{min-height:0;overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
}

/* Keep color summaries to one line without hiding the number of other choices. */
#topo .product-info{min-width:0}
#topo .product-info>.stock-note,#featured-section .featured-colors{display:flex;align-items:baseline;gap:6px;min-width:0;min-height:1.6em;line-height:1.6;white-space:nowrap;overflow:hidden}
#topo .card-color-names{display:block;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#topo .card-color-more{flex:none;white-space:nowrap;color:var(--rose-dark)}

/* Center the product photo inside its desktop gallery frame. */
@media(min-width:900px){
 #product-shade .product-modal-gallery{box-sizing:border-box;padding:18px 22px 8px}
 #product-shade .product-modal-gallery>img{object-fit:contain;object-position:center}
}
