/* Mobile-first review, 05/10/2026. Original photographs and previous variants preserved. */
#app > [data-story="obj001"] .scroll-cue{top:auto;bottom:8px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 40px);text-align:center;display:block;font-size:9px;z-index:4;padding:0;border:0;border-radius:0;background:none;color:#151515}
[data-story="obj001"] .story-state-icon{width:72px;height:44px;min-height:44px;border:0;border-radius:999px;background:#8a8a8f;color:#151515;box-shadow:inset 0 0 0 1px #00000014;transition:background-color .2s;transform:none;padding:0}
[data-story="obj001"] .story-state-icon svg{display:none}
[data-story="obj001"] .story-state-icon::after{content:'';display:grid;place-items:center;position:absolute;inset:auto;left:4px;top:4px;width:36px;height:36px;border:0;border-radius:50%;background:#fff;color:#555;font:23px/1 Arial,sans-serif;box-shadow:0 2px 5px #0003;animation:none;opacity:1;transform:translateX(0);transition:transform .2s,color .2s}
[data-story="obj001"] .story-state-icon[aria-pressed="true"]{background:#21A663;border:0;box-shadow:inset 0 0 0 1px #00000014}
[data-story="obj001"] .story-state-icon[aria-pressed="true"]::after{opacity:1;transform:translateX(28px);color:#151515}
[data-story="obj001"] .story-state-icon:hover{transform:none;background:#707078}
[data-story="obj001"] .story-state-icon[aria-pressed="true"]:hover{background:#19844e}
.firmas-preview-label{display:none!important}
.home-collection.firmas-story{height:330svh}
.firmas-card .firmas-preview picture,.firmas-card .firmas-preview .firmas-final{transition:none;will-change:opacity,transform}
.firmas-actions{border:0;gap:12px}
.firmas-card .firmas-actions button{flex:1;justify-content:center;min-height:48px;height:48px;border:1px solid #151515;border-radius:0;background:#fff;font-size:12px;padding:0 12px}
.firmas-card .firmas-actions .firmas-buy{background:#151515;color:#fff}
.firmas-card .firmas-actions button:hover,.firmas-card .firmas-actions button:focus-visible{background:#1749d7;border-color:#1749d7;color:#fff}
.story-link,.obj1-clean-top [data-buy],.obj1-end-bottom [data-buy]{min-height:48px;border:1px solid currentColor;border-radius:0;padding:14px 18px;background:#151515;color:#fff}
@media(max-width:820px){
 #app > [data-story="obj001"] .story-bottom{bottom:32px}
 .firmas-pair{left:16px;right:16px;gap:18px;top:14%;bottom:3%}
 .firmas-card .firmas-preview picture img{padding:0}
 .firmas-card .firmas-actions button{font-size:11px;padding:0 8px}
 [data-story="obj001"] .story-on{will-change:opacity;backface-visibility:hidden}
 .obj1-explore .obj1-collage{padding:0}
 .obj1-explore .obj1-collage-heading{padding:30px 20px}
 .obj1-explore .obj1-collage-grid{gap:0}
 .obj1-explore .obj1-collage-card{width:100%;margin:0;align-self:stretch}
 .obj1-explore .obj1-collage-card img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:0}
 .obj1-explore .obj1-collage-bed-wide img{object-position:85% center}
 .obj1-explore .obj1-collage-living img{object-position:15% center}
 .obj2-page .obj2-scene-wide img{object-position:85% center}
 .obj1-explore .obj1-collage-card figcaption{display:none}
 .obj1-explore .obj1-collage-statement{order:-1;width:100%;padding:16px 20px 32px;align-self:stretch}
 .obj1-explore .obj1-collage .obj1-explore-end{padding:52px 20px 120px}
 .obj2-page .obj2-blue-details{padding:0;gap:0}
 .obj2-page .obj2-blue-details figure{margin:0}
 .obj2-page .obj2-blue-details img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:0}
 .obj2-page .obj2-atmospheres{padding:0}
 .obj2-page .obj2-scene-wide{width:100%;margin:0!important}
 .obj2-page .obj2-atmospheres img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:0}
 .obj2-page .obj2-atmospheres-close{padding:48px 20px 100px}
 .obj2-color-shift h2{font-size:clamp(56px,17vw,100px)}
 .home-campaign-photo{width:100%;margin:0;border-radius:0;aspect-ratio:4/5;height:auto}
 .home-campaign-photo img{aspect-ratio:4/5;object-fit:cover}
}
@media(prefers-reduced-motion:reduce){
 .home-collection.firmas-story{height:auto}
 #app > [data-story="obj001"] .scroll-cue{display:none}
 [data-story="obj001"] .story-state-icon::after{transition:none}
 .firmas-card .firmas-preview picture,.firmas-card .firmas-preview .firmas-final{will-change:auto}
}

/* Slim visual track inside a 44px touch target. */
[data-story="obj001"] .story-state-icon,[data-story="obj001"] .story-state-icon:hover,[data-story="obj001"] .story-state-icon[aria-pressed="true"],[data-story="obj001"] .story-state-icon[aria-pressed="true"]:hover{width:58px;height:44px;background:transparent;box-shadow:none;border:0}
[data-story="obj001"] .story-state-icon::before{content:"";position:absolute;inset:7px 0;border-radius:999px;background:#8a8a8f;transition:background-color .2s}
[data-story="obj001"] .story-state-icon[aria-pressed="true"]::before{background:#21a663}
[data-story="obj001"] .story-state-icon::after{content:"";display:block;left:3px;top:10px;width:24px;height:24px;box-shadow:0 1px 3px #0003;transition:transform .2s;animation:none;opacity:1}
[data-story="obj001"] .story-state-icon[aria-pressed="true"]::after{transform:translateX(28px)}
.story-link,.firmas-card .firmas-actions button,.home-campaign-actions button,.obj1-clean-top [data-buy],.obj1-end-bottom [data-buy],.obj1-primary-buy,.obj1-mobile-buy button,.obj2-atmospheres-close button{border-radius:0}
@media(prefers-reduced-motion:reduce){[data-story="obj001"] .story-state-icon::after{display:block;transition:none}}
/* Browser-owned opacity/transform timelines avoid JS scroll-event stepping. */
@supports(animation-timeline:view()){
 @media(max-width:820px) and (prefers-reduced-motion:no-preference){
  #app > [data-story="obj001"]{view-timeline-name:--power;view-timeline-axis:block;view-timeline-inset:0}
  #app > [data-story="obj001"] .story-on,#app > [data-story="obj001"] .story-stage::before{animation:mobile-light linear both;animation-timeline:--power;animation-range:contain 0% contain 100%}
  #app > [data-story="obj001"] .scroll-cue{animation:mobile-cue linear both;animation-timeline:--power;animation-range:contain 0% contain 20%}
  .obj1-color-shift{view-timeline-name:--blue;view-timeline-inset:66px 0}
  .obj1-color-shift-blue{animation:mobile-light linear both;animation-timeline:--blue;animation-range:contain -30% contain 45%;will-change:opacity}
  .radial-row{animation:mobile-row cubic-bezier(.22,1,.36,1) both;animation-timeline:--blue;animation-range:contain -30% contain 25%;will-change:transform,opacity}
  .radial-row:nth-child(2){animation-range:contain -24% contain 31%}.radial-row:nth-child(3){animation-range:contain -18% contain 37%}.radial-row:nth-child(4){animation-range:contain -12% contain 43%}
  .obj2-color-shift{view-timeline-name:--dark;view-timeline-inset:66px 0}
  .obj2-color-shift-dark{animation:mobile-light linear both;animation-timeline:--dark;animation-range:contain 0% contain 100%;will-change:opacity}
  .home-collection.firmas-story{view-timeline-name:--objects;view-timeline-inset:66px 0}
  .firmas-card .firmas-preview picture{animation:mobile-lamps linear both;animation-timeline:--objects;animation-range:contain 0% contain 100%}
  .firmas-card .firmas-final{animation:mobile-symbols linear both;animation-timeline:--objects;animation-range:contain 0% contain 100%}
 }
}
@keyframes mobile-light{from{opacity:0}to{opacity:1}}
@keyframes mobile-cue{from{opacity:1}to{opacity:0}}
@keyframes mobile-row{from{opacity:0;transform:translate3d(-110%,0,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes mobile-lamps{0%,53%,96%,100%{opacity:0;transform:translate3d(0,8px,0)}61%,88%{opacity:1;transform:translate3d(0,0,0)}}
@keyframes mobile-symbols{0%,53%,96%,100%{opacity:1}61%,88%{opacity:0}}

@supports(animation-timeline:view()){@media(max-width:820px) and (prefers-reduced-motion:no-preference){
 #app > [data-story="obj002"]{view-timeline-name:--second;view-timeline-inset:0}
 .obj002-general{animation:mobile-second-a linear both;animation-timeline:--second;animation-range:contain 0% contain 100%}
 .obj002-superior{animation:mobile-second-b linear both;animation-timeline:--second;animation-range:contain 0% contain 100%}
 .obj002-detalle{animation:mobile-second-c linear both;animation-timeline:--second;animation-range:contain 0% contain 100%}
 #app > [data-story="obj002"] .scroll-cue{animation:mobile-cue linear both;animation-timeline:--second;animation-range:contain 0% contain 16%}
}}
@keyframes mobile-second-a{0%,22%{opacity:1;transform:scale(1)}38%,100%{opacity:0;transform:scale(1.012)}}
@keyframes mobile-second-b{0%,18%,78%,100%{opacity:0;transform:scale(1.018)}36%,62%{opacity:1;transform:scale(1.012)}}
@keyframes mobile-second-c{0%,58%{opacity:0;transform:scale(1.016)}76%,100%{opacity:1;transform:scale(1.008)}}