/* Start custom CSS for html, class: .elementor-element-9a892af */@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Manrope:wght@300;400;500;600;700&display=swap');
/* =========================================================
GALLERY PAGE
========================================================= */
.vip-gallery {
--navy: #0A2947;
--cream: #F3E4C9;
--sage: #D3D4C0;
--brown: #8B5E3C;
font-family: 'Manrope', sans-serif;
color: var(--navy);
background: var(--cream);
overflow: hidden;
line-height: 1.7;
}
.vip-gallery *,
.vip-gallery *::before,
.vip-gallery *::after {
box-sizing: border-box;
}
.vip-gallery img {
display: block;
max-width: 100%;
}
.vip-gallery a {
text-decoration: none;
}
/* =========================================================
HERO
========================================================= */
.vg-hero {
position: relative;
min-height: 560px;
display: flex;
align-items: center;
overflow: hidden;
background: var(--navy);
}
.vg-hero-bg {
position: absolute;
inset: 0;
background-image:
url('https://escortsworld.in/wp-content/uploads/2026/09/bg1.jpg');
background-size: cover;
background-position: center;
}
.vg-hero-overlay {
position: absolute;
inset: 0;
background:
linear-gradient(
90deg,
rgba(10,41,71,.96) 0%,
rgba(10,41,71,.78) 48%,
rgba(10,41,71,.40) 100%
);
}
.vg-hero-content {
position: relative;
z-index: 2;
width: min(1180px, calc(100% - 50px));
margin: auto;
padding: 100px 0;
}
.vg-overline {
display: block;
margin-bottom: 18px;
font-size: 11px;
font-weight: 700;
letter-spacing: 3px;
color: var(--sage);
}
.vg-hero h1 {
margin: 0;
font-family: 'Cormorant Garamond', serif;
font-size: clamp(70px, 9vw, 115px);
line-height: .82;
font-weight: 500;
letter-spacing: -3px;
color: var(--cream);
}
.vg-hero h1 span {
display: block;
color: var(--sage);
}
.vg-hero-content p {
max-width: 610px;
margin: 35px 0 0;
font-size: 14px;
line-height: 1.9;
font-weight: 300;
color: rgba(243,228,201,.76);
}
/* =========================================================
LUXURY NOTE
========================================================= */
.vg-luxury-section {
padding: 65px 0;
background: var(--navy);
}
.vg-luxury-inner {
width: min(1000px, calc(100% - 50px));
margin: auto;
padding: 42px 55px;
text-align: center;
border: 1px solid rgba(243,228,201,.20);
background:
linear-gradient(
135deg,
rgba(243,228,201,.06),
rgba(211,212,192,.03)
);
}
.vg-luxury-label {
display: block;
margin-bottom: 15px;
font-size: 10px;
font-weight: 700;
letter-spacing: 3px;
text-transform: uppercase;
color: var(--sage);
}
.vg-luxury-inner h2 {
margin: 0;
font-family: 'Cormorant Garamond', serif;
font-size: clamp(35px, 4vw, 52px);
line-height: 1;
font-weight: 500;
color: var(--cream);
}
.vg-luxury-inner p {
max-width: 720px;
margin: 18px auto 0;
font-size: 11px;
line-height: 1.8;
color: rgba(243,228,201,.65);
}
.vg-luxury-inner p strong {
color: var(--sage);
font-weight: 700;
}
/* =========================================================
INTRO
========================================================= */
.vg-intro {
padding: 110px 0;
background: var(--cream);
}
.vg-intro-inner {
width: min(1180px, calc(100% - 50px));
margin: auto;
display: grid;
grid-template-columns: 220px 1fr;
gap: 70px;
}
.vg-intro-label,
.vg-small-title {
display: block;
font-size: 10px;
font-weight: 700;
letter-spacing: 2.5px;
text-transform: uppercase;
color: var(--brown);
}
.vg-intro-content {
max-width: 850px;
}
.vg-intro-content h2 {
margin: 0 0 25px;
font-family: 'Cormorant Garamond', serif;
font-size: clamp(50px, 5vw, 72px);
line-height: .94;
font-weight: 500;
color: var(--navy);
}
.vg-intro-content h2 em {
color: var(--brown);
font-weight: 400;
}
.vg-intro-content p {
max-width: 790px;
margin: 0;
font-size: 14px;
line-height: 1.95;
color: rgba(10,41,71,.68);
}
/* =========================================================
GALLERY
========================================================= */
.vg-gallery {
padding: 115px 0 125px;
background: var(--sage);
}
.vg-section-heading {
width: min(1180px, calc(100% - 50px));
margin: 0 auto 55px;
display: grid;
grid-template-columns: 1fr 360px;
gap: 60px;
align-items: end;
}
.vg-section-heading h2 {
margin: 16px 0 0;
font-family: 'Cormorant Garamond', serif;
font-size: clamp(52px, 5vw, 75px);
line-height: .9;
font-weight: 500;
color: var(--navy);
}
.vg-section-heading h2 span {
display: block;
color: var(--brown);
}
.vg-section-heading > p {
margin: 0;
font-size: 13px;
line-height: 1.9;
color: rgba(10,41,71,.68);
}
/* =========================================================
GRID
========================================================= */
.vg-grid {
width: min(1180px, calc(100% - 50px));
margin: auto;
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 22px;
}
/* =========================================================
CARD
========================================================= */
.vg-card {
overflow: hidden;
background: var(--cream);
transition:
transform .35s ease,
box-shadow .35s ease;
}
.vg-card:hover {
transform: translateY(-8px);
box-shadow:
0 22px 55px rgba(10,41,71,.15);
}
/* IMAGE */
.vg-image {
height: 390px;
overflow: hidden;
background: var(--navy);
}
.vg-image img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform .7s ease;
}
.vg-card:hover .vg-image img {
transform: scale(1.06);
}
/* CARD CONTENT */
.vg-card-info {
padding: 24px 22px 25px;
}
.vg-profile-number {
display: block;
margin-bottom: 7px;
font-family: 'Cormorant Garamond', serif;
font-size: 18px;
color: var(--brown);
}
.vg-card-info h3 {
margin: 0;
font-family: 'Cormorant Garamond', serif;
font-size: 29px;
line-height: 1;
font-weight: 600;
color: var(--navy);
}
.vg-card-info p {
min-height: 43px;
margin: 10px 0 15px;
font-size: 11px;
line-height: 1.65;
color: rgba(10,41,71,.62);
}
/* NUMBER */
.vg-contact-number {
padding: 12px 0;
border-top: 1px solid rgba(10,41,71,.12);
border-bottom: 1px solid rgba(10,41,71,.12);
font-size: 13px;
font-weight: 600;
letter-spacing: .4px;
color: var(--navy);
}
/* BUTTONS */
.vg-buttons {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
margin-top: 14px;
}
.vg-buttons a {
display: flex;
align-items: center;
justify-content: center;
min-height: 43px;
padding: 8px;
font-size: 9px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
transition:
background .3s ease,
color .3s ease,
transform .3s ease;
}
.vg-buttons a:hover {
transform: translateY(-2px);
}
.vg-call {
background: var(--navy);
color: var(--cream);
}
.vg-call:hover {
background: var(--brown);
}
.vg-whatsapp {
background: var(--brown);
color: var(--cream);
}
.vg-whatsapp:hover {
background: var(--navy);
}
/* =========================================================
CTA
========================================================= */
.vg-cta {
padding: 120px 0;
background: var(--navy);
}
.vg-cta-inner {
width: min(900px, calc(100% - 50px));
margin: auto;
text-align: center;
}
.vg-cta-inner .vg-small-title {
color: var(--sage);
}
.vg-cta-inner h2 {
margin: 18px 0 25px;
font-family: 'Cormorant Garamond', serif;
font-size: clamp(52px, 6vw, 78px);
line-height: .9;
font-weight: 500;
color: var(--cream);
}
.vg-cta-inner h2 em {
color: var(--sage);
font-weight: 400;
}
.vg-cta-inner p {
max-width: 650px;
margin: auto;
font-size: 13px;
line-height: 1.9;
color: rgba(243,228,201,.68);
}
.vg-cta-buttons {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 12px;
margin-top: 32px;
}
.vg-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 52px;
padding: 0 28px;
font-size: 10px;
font-weight: 700;
letter-spacing: 1.3px;
text-transform: uppercase;
transition:
transform .3s ease,
background .3s ease;
}
.vg-btn:hover {
transform: translateY(-3px);
}
.vg-btn-light {
background: var(--cream);
color: var(--navy);
}
.vg-btn-light:hover {
background: var(--sage);
}
.vg-cta .vg-btn-outline {
border: 1px solid rgba(243,228,201,.5);
color: var(--cream);
background: transparent;
}
.vg-cta .vg-btn-outline:hover {
border-color: var(--cream);
background: rgba(243,228,201,.08);
}
/* =========================================================
TABLET
========================================================= */
@media (max-width: 1050px) {
.vg-grid {
grid-template-columns:
repeat(2, minmax(0, 1fr));
}
.vg-section-heading {
grid-template-columns: 1fr 300px;
}
}
/* =========================================================
MOBILE
========================================================= */
@media (max-width: 700px) {
.vg-hero {
min-height: 520px;
}
.vg-hero-content {
width: calc(100% - 32px);
padding: 80px 0;
}
.vg-hero h1 {
font-size: 70px;
letter-spacing: -2px;
}
.vg-hero-content p {
font-size: 13px;
}
/* LUXURY */
.vg-luxury-section {
padding: 35px 0;
}
.vg-luxury-inner {
width: calc(100% - 32px);
padding: 35px 22px;
}
.vg-luxury-inner h2 {
font-size: 36px;
line-height: 1.05;
}
.vg-luxury-inner p {
font-size: 10px;
}
/* INTRO */
.vg-intro {
padding: 80px 0;
}
.vg-intro-inner {
width: calc(100% - 32px);
display: block;
}
.vg-intro-label {
margin-bottom: 28px;
}
.vg-intro-content h2 {
font-size: 50px;
}
/* GALLERY */
.vg-gallery {
padding: 80px 0;
}
.vg-section-heading {
width: calc(100% - 32px);
display: block;
margin-bottom: 40px;
}
.vg-section-heading h2 {
font-size: 53px;
}
.vg-section-heading > p {
margin-top: 25px;
}
.vg-grid {
width: calc(100% - 32px);
grid-template-columns: 1fr;
gap: 20px;
}
.vg-image {
height: 500px;
}
.vg-card-info {
padding: 25px;
}
.vg-card-info h3 {
font-size: 32px;
}
/* CTA */
.vg-cta {
padding: 80px 0;
}
.vg-cta-inner {
width: calc(100% - 32px);
}
.vg-cta-inner h2 {
font-size: 52px;
}
.vg-cta-buttons {
flex-direction: column;
}
.vg-btn {
width: 100%;
}
}
/* =========================================================
SMALL MOBILE
========================================================= */
@media (max-width: 430px) {
.vg-hero h1 {
font-size: 60px;
}
.vg-intro-content h2,
.vg-section-heading h2,
.vg-cta-inner h2 {
font-size: 45px;
}
.vg-image {
height: 430px;
}
.vg-buttons {
grid-template-columns: 1fr 1fr;
}
}/* End custom CSS */