.vr-page section {position:relative;}

.vr-hero {position:relative; min-height:80vh; display:flex; align-items:center; justify-content:center; text-align:center;}
.vr-hero-bg {position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:0;}
.vr-hero-overlay {position:absolute; inset:0; background:rgba(36,33,31,0.55);}
.vr-hero-content {position:relative; max-width:600px; margin:0 auto; display:flex; flex-direction:column; gap:var(--space-4); color:white;}
.vr-hero-content h1, .vr-hero-content p {color:white;}

.vr-cards {display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:var(--space-5);}
.vr-card {display:flex; flex-direction:column; gap:var(--space-3);}

.vr-types {max-width:700px;}
.vr-types-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-5); margin-top:var(--space-5);}

.vr-experience {display:flex; flex-direction:column; gap:var(--space-7);}
.vr-row {display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); align-items:center;}
.vr-row.reverse {direction:rtl;}
.vr-row.reverse > * {direction:ltr;}

.vr-atmosphere {position:relative;}
.vr-atmosphere img {width:100%; height:500px; object-fit:cover; border-radius:0;}
.vr-atmosphere-overlay {position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; max-width:600px; margin:auto; color:white; gap:var(--space-4); background:rgba(36,33,31,0.45);}

.vr-process .vr-steps {display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--space-4); margin-top:var(--space-5);}

.vr-3col {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-5);}

.vr-disclaimer {max-width:700px; margin:0 auto; text-align:center; background:var(--color-surface-alt); padding:var(--space-5); border-radius:var(--radius-md);}

.vr-cta {background:var(--color-text-primary); color:white; text-align:center;}
.vr-cta-inner {max-width:600px; margin:0 auto; display:flex; flex-direction:column; gap:var(--space-4);}

@media (max-width:1024px){
.vr-cards, .vr-3col {grid-template-columns:1fr 1fr;}
.vr-row {grid-template-columns:1fr;}
.vr-process .vr-steps {grid-template-columns:1fr 1fr;}
}

@media (max-width:640px){
.vr-cards, .vr-3col, .vr-types-grid, .vr-process .vr-steps {grid-template-columns:1fr;}
.vr-hero {min-height:70vh; padding:var(--space-6) var(--space-3);}
}
