/* ONE / an operational scene, with a static readable fallback. */
#tecnologia.control { display: block; position: relative; isolation: isolate; overflow: visible; padding: 38px clamp(20px,4vw,64px); background: #100b14; }
#tecnologia > img,#tecnologia > .shade { display: none; }
.one-scene { --one-progress: 0; position: relative; display: grid; grid-template-rows: auto minmax(310px,1fr) auto auto; gap: 18px; max-width: 1440px; margin: auto; padding: 28px 32px 22px; border: 1px solid #ffffff25; border-radius: 24px; overflow: hidden; background: radial-gradient(ellipse at 50% 45%,#65255140,transparent 64%),#160f1b; box-shadow: 0 40px 100px #0005; }
.one-scene::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .055; background: url('/site/assets/fronteira.webp') center/cover; }
#tecnologia .control-copy { position: relative; display: grid; grid-template-columns: 1.35fr 1fr; column-gap: 40px; align-items: end; margin: 0; max-width: none; }
#tecnologia .control-copy .index { grid-column: 1; margin: 0 0 8px; padding: 0; font-size: 12px; background: transparent; color: #d7a3cd; border: 0; opacity: 1; }
#tecnologia .control-copy .eyebrow { grid-column: 1; margin: 0 0 8px; font-size: 12px; }
#tecnologia .control-copy h2 { grid-column: 1; max-width: 27ch; font-size: clamp(28px,2.7vw,42px); line-height: 1.12; letter-spacing: -.04em; }
#tecnologia .control-copy > p:not(.index,.eyebrow) { grid-column: 2; grid-row: 1 / 4; font-size: 16px; line-height: 1.6; margin: 0; color: #d5c6d7; }
#tecnologia .pills { grid-column: 1/-1; display: flex; gap: 24px; margin: 18px 0 0; border-top: 1px solid #ffffff16; padding-top: 12px; }
#tecnologia .pills > span { padding: 0; border: 0; border-radius: 0; color: #d09aca; background: transparent; font-size: 12px; letter-spacing: .04em; }
#tecnologia .one-preview { position: relative; display: block; width: 100%; max-width: none; min-height: 350px; height: 100%; aspect-ratio: auto; padding: 0; margin: 0; border-radius: 16px; border: 1px solid #c88abb32; background: radial-gradient(ellipse at calc(25% + var(--one-progress) * 50%) 60%,#9c3a883b,transparent 65%),linear-gradient(135deg,#24132e,#100c15 62%,#271427); box-shadow: inset 0 0 90px #0004; container-type: normal; transform: none; }
#tecnologia .one-preview::before { opacity: .45; background-size: 40px 40px; }
#tecnologia .one-preview::after { width: 230px; height: 230px; left: 52%; top: 26%; border-color: #e7a4d74d; box-shadow: 0 0 0 35px #d994ce05,0 0 0 70px #d994ce05; transform: translateX(-50%) scale(calc(.85 + var(--one-progress) * .18)); }
#tecnologia .one-system-bar { min-height: 38px; padding: 0 22px; font-size: 12px; letter-spacing: .12em; }
#tecnologia .one-side { position: absolute; inset: 38px 0 0; display: block; padding: 26px 32px; background: none; }
#tecnologia .one-side::before { width: 47%; top: 52%; right: 15%; height: 1px; background: linear-gradient(90deg,transparent,#c578bacc,#c578ba15); transform-origin: left; transform: scaleX(calc(.3 + var(--one-progress) * .7)); }
#tecnologia .one-side img { position: absolute; left: 32px; top: 22px; width: 150px; max-width: 30%; filter: none; opacity: 1; }
#tecnologia .one-side > .one-side-copy { position: absolute; left: 32px; bottom: 28px; top: auto; right: auto; width: 51%; max-width: 580px; margin: 0; padding: 0; }
#tecnologia .one-side-copy small { display: block; font-size: clamp(25px,3.2vw,48px); letter-spacing: -.045em; font-weight: 600; color: #f4e6f1; line-height: 1.1; }
#tecnologia .one-side-copy h3 { max-width: 26ch; font-size: clamp(23px,2.1vw,32px); line-height: 1.18; margin: 10px 0; letter-spacing: -.035em; }
#tecnologia .one-side-copy p { max-width: 46ch; font-size: 14px; line-height: 1.5; color: #c9b8cd; }
#tecnologia .one-badges { margin-top: 16px; gap: 14px; }
#tecnologia .one-badges > span { font-size: 12px; padding: 0; border: 0; background: transparent; }
#tecnologia .one-access { position: absolute; top: 56px; right: 5%; bottom: 18px; width: 34%; padding: 0; min-height: 0; perspective: 1200px; }
#tecnologia .one-login { width: 100%; max-width: 360px; padding: 18px 22px; margin: 0; border-radius: 14px; transform: rotateY(calc(-9deg + var(--one-progress) * 9deg)) translateY(calc((.5 - var(--one-progress)) * 10px)); transform-origin: left center; background: #fbf7fbea; border: 1px solid #ffffffb3; box-shadow: -24px 24px 70px #0006; }
#tecnologia .one-login small { font-size: 12px; letter-spacing: .06em; }
#tecnologia .one-login h3 { font-size: 22px; line-height: 1.15; margin: 12px 0 8px; }
#tecnologia .one-login p,#tecnologia .one-login label,#tecnologia .one-password-label { font-size: 12px; line-height: 1.4; }
#tecnologia .one-login label { margin-top: 12px; }
#tecnologia .one-field { min-height: 34px; border-radius: 6px; margin-top: 4px; }
#tecnologia .one-password-label { margin-top: 10px; }
#tecnologia .one-login button { min-height: 36px; margin-top: 12px; border-radius: 6px; font-size: 12px; }
#tecnologia .one-login::before { display: none; }
#tecnologia .one-note { grid-row: 4; width: 100%; text-align: center; font-size: 12px; line-height: 1.4; margin: 0; color: #b8a7ba; }
#tecnologia .operation-steps { grid-row: 3; position: relative; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; margin: 0; padding: 0; border: 1px solid #ffffff1d; border-radius: 10px; overflow: hidden; }
#tecnologia .operation-steps article { position: relative; display: grid; grid-template-columns: 24px 1fr; grid-template-rows: auto 1fr; gap: 5px 10px; min-height: 0; padding: 16px; border: 0; border-right: 1px solid #ffffff16; cursor: pointer; background: #ffffff03; transition: background .4s,color .4s; }
#tecnologia .operation-steps article:last-child { border-right: 0; }
#tecnologia .operation-steps article::before { content: ''; position: absolute; inset: 0 0 auto; height: 2px; background: #de9bd2; transform: scaleX(0); transform-origin: left; transition: transform .5s; }
#tecnologia .operation-steps article.is-current { background: #a84e952a; }
#tecnologia .operation-steps article.is-current::before { transform: scaleX(1); }
#tecnologia .operation-steps article:focus-visible { outline: 2px solid #ecc6e5; outline-offset: -4px; }
#tecnologia .operation-steps small { grid-row: 1/3; color: #da96cc; font-size: 12px; padding-top: 2px; }
#tecnologia .operation-steps h3 { font-size: 16px; min-height: 0; line-height: 1.3; margin: 0; }
#tecnologia .operation-steps p { font-size: 14px; line-height: 1.45; margin: 0; color: #c9b9cd; }
@media(min-width:1100px) and (min-height:900px) {
 html.motion-enabled #tecnologia { height: 200svh; }
 html.motion-enabled #tecnologia .one-scene { position: sticky; top: 94px; height: calc(100svh - 120px); max-height: 900px; }
}
/* Fleet: photographic stage first, operational story directly beneath it. */
#estrutura.fleet { padding-top: 84px; padding-bottom: 84px; background: #100c13; }
#estrutura .heading { align-items: end; gap: 36px; }
#estrutura .heading h2 { max-width: 23ch; font-size: clamp(38px,4.8vw,72px); line-height: 1.08; }
#estrutura .heading > p { max-width: 48ch; font-size: 16px; }
#estrutura .fleet-carousel,html.motion-ready #estrutura .fleet-carousel.reveal { margin-top: 36px; }
#estrutura .fleet-experience { border-radius: 16px 16px 0 0; border-bottom: 0; box-shadow: none; }
#estrutura .cinematic-stage { height: clamp(460px,43vw,640px); }
#estrutura .cinema-deck { bottom: 115px; perspective: 1800px; }
#estrutura .cinema-card { width: 66%; height: 85%; border-radius: 10px; }
#estrutura .cinema-card img { object-fit: contain; background: #171019; }
#estrutura .cinema-card.is-active { box-shadow: 0 38px 80px #0008,0 0 55px #b761a526; }
#estrutura .fleet-browser { background: #1d1421; }
#estrutura .fleet-thumbs { gap: 8px; }
#estrutura .fleet-thumbs button { border-color: transparent; opacity: .65; }
#estrutura .fleet-thumbs button.active { opacity: 1; border-color: #ce8fc4; background: #d28ab91c; }
#estrutura .vehicle-feature { position: relative; display: block; margin: 0; padding: 32px; border: 1px solid #ffffff20; border-top: 0; border-radius: 0 0 16px 16px; background: linear-gradient(140deg,#211625,#120e17); }
#estrutura .vehicle-intro { position: static; display: grid; grid-template-columns: 1.2fr 1fr; gap: 10px 40px; margin-bottom: 28px; }
#estrutura .vehicle-intro > .eyebrow { grid-column: 1; margin: 0; font-size: 12px; }
#estrutura .vehicle-intro h2 { grid-column: 1; max-width: 23ch; font-size: clamp(28px,3vw,44px); line-height: 1.12; }
#estrutura .vehicle-intro > p:not(.eyebrow,.vehicle-signature) { grid-column: 2; grid-row: 1/3; max-width: 48ch; align-self: center; margin: 0; font-size: 16px; }
#estrutura .vehicle-signature { grid-column: 1/-1; font-size: 12px; margin: 8px 0 0; }
#estrutura .vehicle-benefits { display: flex; gap: 10px; align-items: stretch; }
#estrutura .vehicle-benefits details,#estrutura .vehicle-benefits details:first-child { flex: 1; min-width: 0; min-height: 210px; padding: 22px 18px; border: 1px solid #ffffff1a; border-radius: 8px; background: #ffffff03; transition: flex .65s var(--cinema-ease),background .4s,border-color .4s; }
#estrutura .vehicle-benefits details[open] { flex: 2.2; border-color: #bb75ac80; background: #a6539220; }
#estrutura .vehicle-benefits details:hover { transform: none; border-color: #cf8cb8; }
#estrutura .vehicle-benefits summary { display: block; min-height: 0; }
#estrutura .benefit-number { display: block; margin: 0 0 20px; font-size: 13px; color: #d491c8; }
#estrutura .vehicle-benefits small { font-size: 12px; line-height: 1.4; letter-spacing: .08em; color: #c997be; }
#estrutura .vehicle-benefits b { font-size: 18px; line-height: 1.25; }
#estrutura .vehicle-benefits p { max-width: 60ch; margin: 18px 0 0; font-size: 16px; line-height: 1.6; text-align: left; }
#estrutura .fleet-marquee { margin: 26px 0 0; padding: 16px 0; color: #ae70a1; border-color: #ffffff14; }
#estrutura .fleet-marquee .marquee-set { font-size: clamp(24px,3vw,44px); }
@media(max-width:1099px),(max-height:899px) {
 #tecnologia .one-scene { height: auto; position: relative; }
 #tecnologia .one-preview { min-height: 380px; }
}
@media(max-width:760px) {
 #tecnologia.control { padding: 28px 12px; }
 #tecnologia .one-scene { padding: 22px 16px 18px; gap: 20px; border-radius: 16px; grid-template-rows: auto auto auto auto; }
 #tecnologia .control-copy { display: block; }
 #tecnologia .control-copy h2 { font-size: clamp(28px,7vw,40px); max-width: 100%; margin-bottom: 18px; }
 #tecnologia .control-copy > p:not(.index,.eyebrow) { font-size: 16px; text-align: left; }
 #tecnologia .pills { flex-wrap: wrap; gap: 8px 16px; margin-top: 16px; }
 #tecnologia .one-preview { min-height: 0; display: flex; flex-direction: column; height: auto; padding: 62px 20px 24px; }
 #tecnologia .one-side { position: relative; inset: auto; padding: 0; }
 #tecnologia .one-side img { position: static; max-width: 150px; width: 140px; margin: 0 0 26px; }
 #tecnologia .one-side > .one-side-copy { position: static; width: 100%; }
 #tecnologia .one-side-copy small { font-size: 34px; }
 #tecnologia .one-side-copy h3 { font-size: 25px; max-width: 100%; }
 #tecnologia .one-side-copy p { font-size: 16px; }
 #tecnologia .one-badges { gap: 10px; }
 #tecnologia .one-access { position: relative; inset: auto; width: 100%; margin: 26px 0 0; }
 #tecnologia .one-login { padding: 24px; transform: none; max-width: 440px; }
 #tecnologia .one-login p,#tecnologia .one-login label,#tecnologia .one-password-label { font-size: 14px; }
 #tecnologia .one-field { min-height: 42px; }
 #tecnologia .one-login button { min-height: 44px; font-size: 14px; }
 #tecnologia .operation-steps { grid-template-columns: 1fr 1fr; }
 #tecnologia .operation-steps article { padding: 14px 10px; grid-template-columns: 1fr; }
 #tecnologia .operation-steps small { grid-row: auto; }
 #tecnologia .operation-steps h3 { font-size: 15px; }
 #tecnologia .operation-steps p { font-size: 14px; }
 #estrutura .heading { display: block; }
 #estrutura .heading > p { margin-top: 20px; }
 #estrutura .cinematic-stage { height: 470px; }
 #estrutura .cinema-deck { bottom: 185px; }
 #estrutura .cinema-card { width: 80%; }
 #estrutura .vehicle-feature { padding: 24px 16px; }
 #estrutura .vehicle-intro { display: block; }
 #estrutura .vehicle-intro h2 { font-size: 32px; margin: 12px 0 18px; }
 #estrutura .vehicle-signature { margin-top: 20px; }
 #estrutura .vehicle-benefits { flex-direction: column; }
 #estrutura .vehicle-benefits details,#estrutura .vehicle-benefits details:first-child { min-height: 0; padding: 20px; }
 #estrutura .benefit-number { float: left; margin: 2px 16px 16px 0; }
 #estrutura .vehicle-benefits p { clear: both; }
}
@media(prefers-reduced-motion:reduce) {
 #tecnologia .one-login,#tecnologia .one-preview::after { transform: none; }
 #estrutura .vehicle-benefits details { transition: none; }
}
.cinema-paused #tecnologia .one-login { transform: none; }

/* Photographic art direction: a quiet landscape behind the fleet introduction. */
#estrutura.fleet { position: relative; isolation: isolate; }
#estrutura.fleet::before { content: ''; position: absolute; z-index: -1; inset: 0 0 auto; height: min(900px,80%); pointer-events: none; background: linear-gradient(180deg,#100c135c 0%,#100c13ba 35%,#100c13 95%),linear-gradient(90deg,#100c13c9,#100c1340),url('/site/assets/fleet-curated-backdrop.webp') center 58% / cover no-repeat; }
#estrutura .heading { padding-top: 20px; }
#estrutura .fleet-experience { background: #100c13e8; box-shadow: 0 32px 90px #0005; }
#estrutura .cinema-card { background: #171019; border-color: #ffffff30; }
#estrutura .cinema-card.is-active { border-color: #d8a0cb85; box-shadow: 0 24px 65px #0008,0 0 35px #b364a315; }
#estrutura .fleet-cover img { object-position: center 58%; }
@media(max-width:760px) {
 #estrutura.fleet::before { height: 720px; background-position: center,center,60% center; }
 #estrutura .heading { padding-top: 0; }
}
