.balones-page { overflow: hidden; }
.balones-page section { position: relative; }
.balones-hero { padding-block: var(--space-7); }
.balones-hero::after, .balones-criteria::after, .balones-closing::after { position: absolute; inset: 10% -8% auto auto; width: 42%; height: 80%; border: 2px solid rgb(255 255 255 / 12%); border-radius: 50%; content: ""; pointer-events: none; }
.balones-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 6vw, 5rem); min-height: 35rem; align-items: center; }
.balones-hero__copy, .balones-hero__visual, .balones-types__header, .balones-types__grid > *, .balones-catalog__intro, .balones-criteria__copy, .balones-criteria__modules, .balones-context__copy, .balones-context__media, .balones-faq__content, .balones-faq__image { min-width: 0; }
.balones-hero__copy { width: min(100%, 32.5rem); display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.balones-hero__copy > * { margin: 0; }
.balones-breadcrumb { display: flex; flex-wrap: wrap; gap: var(--space-2); color: rgb(255 255 255 / 78%); font-size: var(--font-size-sm); }
.balones-hero__signature { color: var(--color-lime); font-size: var(--font-size-xs); font-weight: var(--font-weight-bold); letter-spacing: var(--tracking-label); }
.balones-hero h1 { color: var(--color-white); font-size: clamp(3rem, 5.4vw, 4rem); }
.balones-hero__lead { max-width: 31rem; font-size: var(--font-size-lg); line-height: var(--line-height-lg); }
.balones-hero__support { max-width: 30rem; color: rgb(255 255 255 / 84%); }
.balones-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.balones-hero__guide-link { color: var(--color-white); }
.balones-hero__visual { width: 100%; height: min(33rem, 50vw); overflow: hidden; border-radius: var(--radius-panel); }
.balones-hero__visual img { width: 100%; height: 100%; object-fit: cover; object-position: 66% center; }
.balones-types, .balones-context { padding-block: var(--space-10); }
.balones-types__header { width: min(100%, 32.5rem); margin-bottom: var(--space-7); }
.balones-types__header h2::after { display: block; width: 3rem; height: .25rem; margin-top: var(--space-3); background: var(--color-lime); content: ""; }
.balones-types__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-5); }
.balones-type-card { display: grid; grid-template-rows: auto 1fr; min-width: 0; overflow: hidden; border: var(--border-default); border-radius: var(--radius-card); background: var(--color-white); color: var(--color-charcoal); text-decoration: none; transition: transform var(--transition-fast), border-color var(--transition-fast); }
.balones-type-card:hover { border-color: var(--color-charcoal); transform: translateY(-1px); }
.balones-type-card img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.balones-type-card__content { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); }
.balones-type-card__content strong { font-family: var(--font-heading); font-size: var(--font-size-xl); letter-spacing: var(--tracking-heading); line-height: 1; }
.balones-type-card__content span { font-size: var(--font-size-sm); line-height: var(--line-height-sm); }
.balones-type-card__content em { margin-top: auto; font-style: normal; font-size: var(--font-size-sm); font-weight: var(--font-weight-bold); text-decoration: underline; text-underline-offset: .18em; }
.balones-type-card--night .balones-type-card__content { background: var(--color-night); color: var(--color-white); }
.balones-catalog { padding-block: var(--space-10); }
.balones-catalog__intro { width: min(100%, 42.5rem); margin-bottom: var(--space-7); }
.balones-catalog__hint { color: var(--color-muted); font-size: var(--font-size-sm); }
.balones-criteria { padding-block: var(--space-10); }
.balones-criteria__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 7vw, 7rem); align-items: start; }
.balones-criteria__copy { width: min(100%, 33.75rem); }
.balones-criteria__copy p { color: var(--color-ivory); }
.balones-criteria__copy img { width: 100%; max-width: 32rem; aspect-ratio: 3 / 2; margin-top: var(--space-6); border-radius: var(--radius-card); object-fit: cover; }
.balones-criteria__modules { display: grid; grid-template-columns: 1fr; gap: 0; }
.balones-criteria__modules article { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); gap: var(--space-3); min-width: 0; padding: var(--space-5) 0; border-top: 1px solid rgb(255 255 255 / 24%); }
.balones-criteria__modules article:last-child { border-top: 2px solid var(--color-lime); }
.balones-criteria__modules span { color: var(--color-lime); font-family: var(--font-heading); font-size: 1.5rem; font-weight: var(--font-weight-bold); }
.balones-criteria__modules h3 { margin-bottom: var(--space-2); color: var(--color-white); }
.balones-criteria__modules p { max-width: 22.5rem; margin: 0; color: var(--color-ivory); font-size: var(--font-size-sm); }
.balones-context__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-6); align-items: start; }
.balones-context__copy { width: min(100%, 30rem); }
.balones-context__media { position: relative; width: 100%; }
.balones-context__media > img { width: 100%; aspect-ratio: 16 / 10; border-radius: var(--radius-panel); object-fit: cover; object-position: 65% center; }
.balones-context__notes { position: absolute; bottom: var(--space-4); left: var(--space-4); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: min(calc(100% - 2rem), 44rem); gap: var(--space-3); }
.balones-context__notes a { display: flex; min-width: 0; flex-direction: column; gap: var(--space-2); padding: var(--space-3); background: rgb(255 255 255 / 94%); color: var(--color-charcoal); font-size: var(--font-size-xs); line-height: var(--line-height-xs); text-decoration: none; }
.balones-context__notes b { color: var(--color-night); font-size: var(--font-size-sm); }
.balones-faq { padding-block: var(--space-10); }
.balones-faq__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-6); align-items: start; }
.balones-faq__content { width: min(100%, 42.5rem); }
.balones-faq__items { border-top: var(--border-default); }
.balones-faq__items article { border-bottom: var(--border-default); }
.balones-faq__items h3 { margin: 0; }
.balones-faq__items button { display: flex; width: 100%; min-height: 3rem; justify-content: space-between; padding: var(--space-3) 0; border: 0; border-radius: 0; background: transparent; color: var(--color-charcoal); font-family: var(--font-heading); font-size: 1.5rem; font-weight: var(--font-weight-bold); letter-spacing: var(--tracking-heading); text-align: left; }
.balones-faq__items button:hover { background: transparent; color: var(--color-pitch); transform: none; }
.balones-faq__items button span { margin-left: var(--space-3); font-family: var(--font-body); }
.balones-faq__items article > div { max-width: 42rem; padding-bottom: var(--space-4); }
.balones-faq__items article > div p { margin-bottom: var(--space-3); }
.balones-faq__image { width: 100%; margin: 0; overflow: hidden; border-radius: var(--radius-card); }
.balones-faq__image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.balones-closing { padding-block: var(--space-9); text-align: center; }
.balones-closing__content { display: flex; width: min(100%, 35rem); min-width: 0; margin-inline: auto; flex-direction: column; align-items: center; gap: var(--space-4); }
.balones-closing__content > * { margin: 0; }
.balones-closing__content h2 { color: var(--color-ivory); }
.balones-closing__content p:not(.eyebrow) { color: rgb(255 255 255 / 86%); }

.balones-storefront { display: grid; grid-template-columns: minmax(15rem, 3fr) minmax(0, 9fr); gap: var(--space-5); align-items: start; }
.balones-filter-panel { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); padding: var(--space-5); border: var(--border-default); border-radius: var(--radius-card); background: var(--color-white); }
.balones-filter-panel__top { display: flex; min-width: 0; justify-content: space-between; gap: var(--space-3); align-items: center; }
.balones-filter-panel__top h3 { margin: 0; }
.balones-filter-panel__top button { min-height: 2.75rem; padding-inline: var(--space-2); background: transparent; color: var(--color-pitch); font-size: var(--font-size-xs); text-decoration: underline; }
.balones-filter-panel__top button:hover { background: transparent; transform: none; }
.balones-filter-panel__prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.balones-filter-panel__prices > div { min-width: 0; }
.balones-filter-panel__check { display: flex; min-height: 2.75rem; align-items: center; gap: var(--space-2); }
.balones-results-area { min-width: 0; }
.balones-results-toolbar { display: flex; min-width: 0; min-height: 2.75rem; margin-bottom: var(--space-4); justify-content: space-between; gap: var(--space-3); align-items: center; }
.balones-results-toolbar p { margin: 0; color: var(--color-muted); font-size: var(--font-size-sm); }
.balones-mobile-filter { display: none; }
.balones-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }
.balones-product-card { display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: var(--border-default); border-radius: var(--radius-card); background: var(--color-white); }
.balones-product-card__image { width: 100%; aspect-ratio: 1; background: var(--color-ivory); }
.balones-product-card__image img { width: 100%; height: 100%; object-fit: contain; }
.balones-product-card__body { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: var(--space-2); padding: var(--space-3); }
.balones-product-card__body > * { margin: 0; }
.balones-product-card h3 { font-size: 1.5rem; }
.balones-product-card__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-top: auto; padding-top: var(--space-2); }
.balones-product-card__actions button { min-width: 0; min-height: 2.75rem; padding-inline: var(--space-2); font-size: .75rem; }
.balones-empty { padding: var(--space-7); border: var(--border-default); background: var(--color-white); text-align: center; }
.balones-product-dialog { width: min(55rem, calc(100% - 2rem)); max-height: min(90vh, 48rem); padding: 0; border: 0; border-radius: var(--radius-panel); box-shadow: var(--shadow-elevated); }
.balones-product-dialog::backdrop { background: rgb(20 40 58 / 72%); }
.balones-product-dialog__inner { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
.balones-product-dialog__close { position: absolute; top: var(--space-3); right: var(--space-3); z-index: 1; min-height: 2.75rem; background: var(--color-white); }
.balones-product-dialog__image { min-width: 0; background: var(--color-ivory); }
.balones-product-dialog__image img { width: 100%; height: 100%; min-height: 26rem; object-fit: contain; }
.balones-product-dialog__content { display: flex; min-width: 0; flex-direction: column; gap: var(--space-3); padding: var(--space-6); }
.balones-product-dialog__content > * { margin: 0; }
.balones-product-dialog__content dl { display: grid; grid-template-columns: 1fr; gap: var(--space-2); }
.balones-product-attribute { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); padding-bottom: var(--space-2); border-bottom: var(--border-default); }
.balones-product-attribute dd { margin: 0; text-align: right; }
.balones-product-dialog__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }

@media (max-width: 74.9375rem) {
  .balones-types__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balones-storefront { grid-template-columns: 1fr; }
  .balones-filter-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balones-filter-panel__top { grid-column: 1 / -1; }
  .balones-filter-panel__prices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balones-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 62.4375rem) {
  .balones-hero__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); min-height: 31.25rem; gap: var(--space-5); }
  .balones-hero__visual { height: 28rem; }
  .balones-context__grid { grid-template-columns: 1fr; }
  .balones-context__copy { width: min(100%, 30rem); }
  .balones-context__notes { position: static; width: 100%; margin-top: var(--space-4); }
}
@media (max-width: 56.25rem) {
  .balones-criteria__grid { grid-template-columns: 1fr; }
  .balones-criteria__modules { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-5); }
  .balones-faq__grid { grid-template-columns: 1fr; }
  .balones-faq__image img { aspect-ratio: 16 / 9; }
}
@media (max-width: 47.9375rem) {
  .balones-hero { padding-block: var(--space-6); }
  .balones-hero__grid { grid-template-columns: 1fr; min-height: 0; }
  .balones-hero__copy { width: 100%; }
  .balones-hero h1 { font-size: 2.5rem; line-height: 1.1; }
  .balones-hero__visual { height: clamp(17.5rem, 80vw, 21.25rem); }
  .balones-hero__visual img { object-position: 58% center; }
  .balones-types, .balones-context, .balones-catalog, .balones-criteria, .balones-faq { padding-block: var(--space-8); }
  .balones-types__header { margin-bottom: var(--space-5); }
  .balones-types__grid { grid-template-columns: 1fr; }
  .balones-type-card { grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); grid-template-rows: 1fr; min-height: 10.5rem; }
  .balones-type-card img { height: 100%; aspect-ratio: auto; }
  .balones-criteria__modules { grid-template-columns: 1fr; }
  .balones-context__notes { grid-template-columns: 1fr; }
  .balones-filter-panel { display: none; }
  .balones-mobile-filter { display: inline-flex; min-height: 2.75rem; }
  .balones-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balones-product-dialog__inner { grid-template-columns: 1fr; }
  .balones-product-dialog__image img { min-height: 18rem; }
}
@media (max-width: 29.9375rem) {
  .balones-type-card { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .balones-type-card img { aspect-ratio: 4 / 5; height: auto; }
  .balones-product-grid { grid-template-columns: 1fr; }
  .balones-product-card__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .balones-product-dialog__content { padding: var(--space-4); }
}
@media (prefers-reduced-motion: reduce) { .balones-type-card { transition: none; } }
