/* One gutter shared with the continuous vertical guides.
   Full-bleed photographs and moving panels retain their own composition. */
:root{--gutter:clamp(22px,6vw,108px)}
@media(max-width:760px){:root{--gutter:22px}}
.mist-label,.mist-tagline,.details-caption{left:var(--gutter)}
.mist-film,.stock-video-credit{right:var(--gutter)}
.mist-bottom,.details-top{left:var(--gutter);right:var(--gutter)}
.mist-tagline{max-width:calc(100% - 2 * var(--gutter))}
.details-caption{right:var(--gutter)}
.details-gallery-intro,.map-section{padding-left:var(--gutter);padding-right:var(--gutter)}
.rocio-camps-intro-content{padding-left:var(--gutter);padding-right:var(--gutter)}
/* Calculator used to acquire an extra centered inset on wide monitors. */
.roi-simulation .roi-calculator{max-width:none;margin-left:0;margin-right:0}
/* The ornamental quote no longer pushes the entire ROI copy off the guide. */
.roi-section{grid-template-columns:minmax(0,1fr);gap:24px}
.roi-section .quote-body{min-width:0}
/* Local column alignment remains intact; outer edges follow the page grid. */
.intro,.about,.services,.process,.film,.contact,.roi-section,.roi-simulation{padding-left:var(--gutter);padding-right:var(--gutter)}
.portfolio>.section-meta,.portfolio-heading,.gallery-heading,.extra-projects{margin-left:var(--gutter);margin-right:var(--gutter)}
.panorama-top,.featured-meta,.hero-nav,.camera-bottom{left:var(--gutter);right:var(--gutter)}
.panorama-copy,.camera-label,.camera-message{left:var(--gutter)}
.panorama-side{right:var(--gutter)}
@media(max-width:767px){.rocio-camps-intro-content{padding-left:var(--gutter);padding-right:var(--gutter)}}

/* Hero copy shares the exact container edges of the fixed guides. */
#inicio .mist-ui{left:var(--gutter);right:var(--gutter);width:auto}
#inicio .mist-ui .mist-label,#inicio .mist-ui .mist-tagline{left:0;margin-left:0;padding-left:0}
#inicio .mist-ui .mist-tagline{max-width:100%}
#inicio .mist-ui .mist-film{right:0;margin-right:0}
#inicio .mist-bottom{left:var(--gutter);right:var(--gutter);width:auto;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
#inicio .mist-bottom>a{margin-left:auto;text-align:right}
.section-meta>span:last-child,.section-foot>span:last-child{text-align:right}
