/* EVillaProje v3 — Kurumsal Özel Sayfa Stilleri */
body { font-family: 'Outfit', sans-serif; background-color: #f8fafc; color: #334155; }
.tadilat-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(26,54,93,0.85) 100%), url('../../img/modern_villa_land.png');
background-size: cover;
background-position: center;
padding: 120px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: 80px;
}
.tadilat-hero h1 { font-size: 52px; font-weight: 800; letter-spacing: -2px; margin-bottom: 20px; }
.tadilat-hero p { font-size: 20px; color: rgba(255,255,255,0.85); max-width: 800px; margin: 0 auto; line-height: 1.6; }
.section-header { text-align: center; margin-bottom: 60px; }
.section-header h2 { font-size: 36px; font-weight: 800; color: #061122; position: relative; display: inline-block; padding-bottom: 15px; }
.section-header h2::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 60px; height: 4px; background: #ff6b35; border-radius: 2px; }
.section-header p { font-size: 17px; color: #64748b; margin-top: 15px; max-width: 700px; margin-left: auto; margin-right: auto; }
.process-box { background: #fff; border-radius: 24px; padding: 40px 30px; box-shadow: 0 15px 35px rgba(0,0,0,0.03); border: 1px solid rgba(0,0,0,0.04); height: 100%; transition: all 0.3s; text-align: center; }
.process-box:hover { transform: translateY(-10px); box-shadow: 0 25px 50px rgba(255,107,53,0.1); border-color: rgba(255,107,53,0.2); }
.process-icon { width: 70px; height: 70px; background: rgba(255,107,53,0.1); color: #ff6b35; border-radius: 20px; display: flex; align-items: center; justify-content: center; font-size: 32px; margin: 0 auto 25px auto; }
.process-box h3 { font-size: 20px; font-weight: 700; color: #061122; margin-bottom: 15px; }
.process-box p { font-size: 15px; color: #64748b; line-height: 1.6; }
.tech-gallery-item { margin-bottom: 50px; background: #fff; border-radius: 30px; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.05); }
.tech-gallery-img { width: 100%; display: block; filter: grayscale(10%); transition: 0.5s; }
.tech-gallery-item:hover .tech-gallery-img { filter: grayscale(0%); }
.tech-content { padding: 40px; }
.tech-badge { background: #ff6b35; color: #fff; padding: 6px 15px; border-radius: 50px; font-size: 12px; font-weight: 700; text-transform: uppercase; margin-bottom: 15px; display: inline-block; }
.tech-content h4 { font-size: 24px; font-weight: 800; color: #061122; margin-bottom: 15px; }
.tech-content p { font-size: 16px; color: #64748b; line-height: 1.7; }
.faq-wrap { background: #fff; border-radius: 30px; padding: 50px; box-shadow: 0 15px 40px rgba(0,0,0,0.04); }
.faq-item { border-bottom: 1px solid #f1f5f9; padding: 25px 0; }
.faq-item:last-child { border-bottom: none; }
.faq-question { font-size: 18px; font-weight: 700; color: #061122; margin-bottom: 10px; display: flex; align-items: center; }
.faq-question i { color: #ff6b35; margin-right: 12px; font-size: 20px; }
.faq-answer { font-size: 15.5px; color: #64748b; line-height: 1.6; padding-left: 32px; }
.tadilat-cta { background: #061122; border-radius: 40px; padding: 80px 40px; color: #fff; text-align: center; margin: 80px 0; position: relative; overflow: hidden; }
.cta-btn { background: #ff6b35; color: #fff; padding: 18px 50px; border-radius: 50px; font-weight: 700; font-size: 18px; display: inline-block; transition: 0.3s; box-shadow: 0 15px 30px rgba(255,107,53,0.3); text-decoration: none !important; }
.cta-btn:hover { background: #e85a24; transform: scale(1.05); color: #fff; }
@media (max-width: 768px) {
.tadilat-hero h1 { font-size: 34px; }
.tadilat-hero { padding: 80px 20px; }
.tech-content { padding: 25px; }
.faq-wrap { padding: 25px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #f7f9fc;
}
.lux-tag-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.85) 0%, rgba(26,54,93,0.85) 100%), url('../../img/modern_villa_land.png');
background-size: cover;
background-position: center;
padding: 120px 0 140px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: -80px;
position: relative;
z-index: 1;
}
.lux-tag-hero h1 {
font-size: 52px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -1.5px;
}
.lux-tag-hero p {
font-size: 20px;
color: rgba(255,255,255,0.8);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.lux-discovery-section {
padding: 140px 0 80px 0;
}
.lux-tag-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 25px;
margin-bottom: 60px;
}
.lux-tag-feature-card {
background: #fff;
border-radius: 24px;
padding: 40px 30px;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(255,107,53,0.05);
transition: all 0.4s ease;
text-decoration: none !important;
}
.lux-tag-feature-card:hover {
transform: translateY(-10px);
box-shadow: 0 20px 50px rgba(255,107,53,0.12);
border-color: rgba(255,107,53,0.3);
}
.lux-tag-icon {
width: 75px;
height: 75px;
background: rgba(255,107,53,0.08);
color: #ff6b35;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 32px;
margin: 0 auto 20px auto;
transition: all 0.3s;
}
.lux-tag-feature-card:hover .lux-tag-icon {
background: #ff6b35;
color: #fff;
transform: scale(1.1);
}
.lux-tag-feature-card h3 {
font-size: 20px;
font-weight: 800;
color: #061122;
margin-bottom: 12px;
}
.lux-tag-feature-card p {
font-size: 14px;
color: #6c757d;
line-height: 1.5;
margin: 0;
}
.lux-tag-cloud-wrap {
background: rgba(255, 255, 255, 0.6);
backdrop-filter: blur(10px);
border-radius: 40px;
padding: 60px 50px;
border: 1px solid rgba(255, 255, 255, 0.4);
box-shadow: 0 20px 60px rgba(0,0,0,0.04);
}
.lux-cloud-title {
font-size: 24px;
font-weight: 800;
color: #061122;
margin-bottom: 40px;
text-align: center;
position: relative;
}
.lux-cloud-title::after {
content: '';
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 40px;
height: 4px;
background: #ff6b35;
border-radius: 2px;
}
.lux-tag-cloud {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 12px;
}
.lux-cloud-tag {
background: #fff;
padding: 10px 22px;
border-radius: 50px;
color: #4a5568;
font-size: 15px;
font-weight: 600;
text-decoration: none !important;
border: 1px solid #edf2f7;
transition: all 0.3s ease;
box-shadow: 0 4px 6px rgba(0,0,0,0.02);
}
.lux-cloud-tag:hover {
background: #ff6b35;
color: #fff;
border-color: #ff6b35;
transform: translateY(-3px) scale(1.05);
box-shadow: 0 10px 20px rgba(255,107,53,0.2);
}
.lux-cloud-tag span {
font-size: 11px;
opacity: 0.6;
margin-left: 6px;
background: rgba(0,0,0,0.05);
padding: 2px 8px;
border-radius: 10px;
}
.lux-cloud-tag:hover span {
background: rgba(255,255,255,0.2);
opacity: 1;
}
.lux-tag-cta {
background: #061122;
border-radius: 40px;
padding: 80px 40px;
color: #fff;
text-align: center;
margin-top: 80px;
position: relative;
overflow: hidden;
}
.lux-tag-cta h2 {
font-size: 36px;
font-weight: 800;
margin-bottom: 20px;
}
.lux-tag-cta p {
font-size: 18px;
color: rgba(255,255,255,0.7);
max-width: 600px;
margin: 0 auto 40px auto;
}
.btn-lux-call {
background: #ff6b35;
color: #fff;
padding: 18px 45px;
border-radius: 50px;
font-weight: 700;
text-decoration: none;
font-size: 18px;
display: inline-block;
transition: all 0.3s;
box-shadow: 0 15px 30px rgba(255,107,53,0.3);
}
.btn-lux-call:hover {
background: #e85a24;
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(255,107,53,0.4);
color: #fff;
}
@media (max-width: 768px) {
.lux-tag-hero h1 { font-size: 36px; }
.lux-tag-hero { padding: 80px 0 100px 0; border-radius: 0 !important; }
.lux-tag-cloud-wrap { padding: 40px 20px; border-radius: 20px; }
.lux-tag-cta { padding: 60px 20px; border-radius: 20px; }
}
.lux-projects-list-page {
padding: 60px 0;
background: #fcfdfd;
}
.lux-page-header {
margin-bottom: 40px;
text-align: center;
}
.lux-page-header h1 {
font-size: 32px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.lux-page-header p {
font-size: 16px;
color: #6c757d;
max-width: 600px;
margin: 0 auto;
font-weight: 500;
}
.lux-category-grid {
padding: 60px 0;
background: #fcfdfd;
}
.lux-cat-card {
background: #ffffff;
border-radius: 16px;
padding: 40px 30px;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-decoration: none !important;
}
.lux-cat-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
border-color: rgba(255,107,53,0.3);
}
.lux-cat-icon {
width: 75px;
height: 75px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 34px;
margin-bottom: 20px;
transition: all 0.3s ease;
}
.lux-cat-card:hover .lux-cat-icon {
background: #ff6b35;
color: #ffffff;
transform: scale(1.1) translateY(-5px);
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.lux-cat-title {
font-size: 20px;
font-weight: 800;
color: #061122;
margin-bottom: 12px;
transition: color 0.3s;
}
.lux-cat-card:hover .lux-cat-title {
color: #ff6b35;
}
.lux-cat-desc {
font-size: 14px;
color: #6c757d;
margin: 0;
line-height: 1.5;
font-weight: 500;
}
body {
font-family: 'Outfit', sans-serif;
background-color: #f8fafc;
}
.lux-discovery-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(26,54,93,0.85) 100%), url('../../img/hero_villa_sunset.png');
background-size: cover;
background-position: center;
padding: 120px 0 100px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: -40px;
position: relative;
z-index: 10;
}
.lux-discovery-hero h1 {
font-size: 56px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -2px;
}
.lux-discovery-hero p {
font-size: 21px;
color: rgba(255,255,255,0.85);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.lux-hub-title {
text-align: center;
margin-bottom: 50px;
position: relative;
}
.lux-hub-title h2 {
font-size: 32px;
font-weight: 800;
color: #061122;
margin-bottom: 10px;
}
.lux-hub-title p {
font-size: 16px;
color: #6c757d;
}
.lux-hub-title::after {
content: '';
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 4px;
background: #ff6b35;
border-radius: 2px;
}
.lux-catalog-hub {
padding: 100px 0 60px 0;
}
.lux-cat-card {
background: #fff;
border-radius: 24px;
padding: 30px;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: all 0.4s ease;
}
.lux-cat-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 50px rgba(255,107,53,0.1);
border-color: rgba(255,107,53,0.2);
}
.lux-cat-icon {
width: 65px; height: 65px;
background: rgba(255,107,53,0.08);
color: #ff6b35;
border-radius: 18px;
display: flex; align-items: center; justify-content: center;
font-size: 28px; margin-bottom: 20px;
}
.lux-cat-title { font-size: 19px; font-weight: 800; color: #061122; margin-bottom: 8px; }
.lux-cat-count { font-size: 13px; color: #6c757d; font-weight: 600; background: #f1f5f9; padding: 3px 12px; border-radius: 50px; margin-bottom: 20px; }
.lux-hub-btn {
width: 100%; padding: 12px; border-radius: 12px; font-weight: 700; font-size: 13px; text-transform: uppercase; transition: all 0.3s; text-decoration: none !important; margin-top: auto;
}
.btn-hub-view { background: #f8fafc; color: #061122; border: 1px solid #e2e8f0; margin-bottom: 8px; }
.btn-hub-view:hover { background: #061122; color: #fff; }
.btn-hub-pdf { background: #ff6b35; color: #fff; border: none; }
.btn-hub-pdf:hover { background: #e85a24; transform: scale(1.02); }
.lux-tags-hub {
padding: 80px 0;
background: rgba(255,107,53,0.02);
}
.lux-glass-cloud {
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(15px);
border-radius: 40px;
padding: 60px 40px;
border: 1px solid rgba(255, 255, 255, 0.5);
box-shadow: 0 20px 60px rgba(0,0,0,0.05);
}
.lux-tag-item {
background: #fff;
padding: 10px 20px;
border-radius: 50px;
color: #4a5568;
font-size: 14px;
font-weight: 600;
text-decoration: none !important;
border: 1px solid #edf2f7;
margin: 6px;
display: inline-block;
transition: all 0.3s;
}
.lux-tag-item:hover {
background: #ff6b35; color: #fff; border-color: #ff6b35; transform: translateY(-3px); box-shadow: 0 10px 20px rgba(255,107,53,0.2);
}
.lux-tag-item span { font-size: 10px; opacity: 0.6; margin-left: 5px; background: rgba(0,0,0,0.05); padding: 1px 6px; border-radius: 8px; }
.lux-popular-hub {
padding: 80px 0 100px 0;
}
.btn-all-projects {
background: transparent; border: 2px solid #ff6b35; color: #ff6b35; padding: 15px 40px; border-radius: 50px; font-weight: 800; text-decoration: none; display: inline-block; transition: all 0.3s;
}
.btn-all-projects:hover { background: #ff6b35; color: #fff; box-shadow: 0 15px 30px rgba(255,107,53,0.3); }
.lux-hub-cta {
background: #061122; border-radius: 40px; padding: 80px 40px; color: #fff; text-align: center; margin-bottom: 80px; position: relative; overflow: hidden;
}
.hub-cta-btn { background: #ff6b35; color: #fff; padding: 16px 45px; border-radius: 50px; font-weight: 700; text-decoration: none; font-size: 18px; display: inline-block; transition: all 0.3s; box-shadow: 0 15px 30px rgba(255,107,53,0.3); }
.hub-cta-btn:hover { background: #e85a24; transform: translateY(-5px); }
@media (max-width: 768px) {
.lux-discovery-hero h1 { font-size: 34px; }
.lux-discovery-hero p { font-size: 16px; }
.lux-hub-cta, .lux-glass-cloud { border-radius: 20px; padding: 40px 20px; }
}
.premium-consulting {
padding: 70px 0;
background-color: #fdfdfd;
font-family: 'Outfit', sans-serif;
}
.consulting-intro {
margin-bottom: 60px;
}
.c-subtitle {
color: #ff6b35;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 15px;
display: inline-block;
background: rgba(255, 107, 53, 0.1);
padding: 6px 15px;
border-radius: 5px;
}
.c-title {
color: #061122;
font-size: 38px;
font-weight: 800;
line-height: 1.3;
margin-bottom: 25px;
}
.c-lead {
font-size: 17px;
color: #4b5563;
line-height: 1.8;
}
.c-intro-img {
border-radius: 15px;
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
transition: transform 0.5s ease;
width: 100%;
}
.c-intro-img:hover {
transform: scale(1.02);
}
.section-headline {
text-align: center;
margin: 80px 0 50px 0;
position: relative;
}
.section-headline h2 {
font-size: 34px;
font-weight: 800;
color: #061122;
display: inline-block;
position: relative;
padding-bottom: 15px;
}
.section-headline h2::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 80px;
height: 4px;
background: #ff6b35;
border-radius: 2px;
}
.service-block {
background: #fff;
border-radius: 15px;
padding: 35px;
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
height: 100%;
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.service-block:hover {
box-shadow: 0 15px 35px rgba(6,17,34,0.08);
transform: translateY(-5px);
}
.service-block::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 4px;
height: 100%;
background: #061122;
transition: all 0.3s;
}
.service-block:hover::before {
background: #ff6b35;
}
.service-block h3 {
font-size: 20px;
font-weight: 700;
color: #061122;
margin-bottom: 20px;
display: flex;
align-items: center;
}
.service-block h3 i {
color: #ff6b35;
font-size: 24px;
margin-right: 12px;
}
.service-list {
list-style: none;
padding: 0;
margin: 0;
}
.service-list li {
font-size: 15px;
color: #6c757d;
padding: 10px 0 10px 22px;
position: relative;
border-bottom: 1px dashed rgba(0,0,0,0.05);
}
.service-list li:last-child {
border-bottom: none;
}
.service-list li::before {
content: '\F633';
font-family: 'bootstrap-icons';
position: absolute;
left: 0;
top: 11px;
color: #061122;
font-size: 14px;
font-weight: bold;
}
.mid-banner {
margin: 60px 0;
border-radius: 20px;
overflow: hidden;
position: relative;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.mid-banner img {
width: 100%;
height: auto;
display: block;
}
.mid-banner-overlay {
position: absolute;
bottom: 0; left: 0; right: 0;
padding: 30px;
background: linear-gradient(to top, rgba(6,17,34,0.9) 0%, rgba(6,17,34,0) 100%);
color: #fff;
}
.mid-banner-overlay h4 {
margin: 0;
font-weight: 700;
font-size: 24px;
}
.contact-highlight {
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
border-radius: 20px;
padding: 50px;
color: #fff;
text-align: center;
margin-top: 80px;
position: relative;
overflow: hidden;
}
.contact-highlight::after {
content: '\F5B4';
font-family: 'bootstrap-icons';
position: absolute;
font-size: 250px;
top: -50px;
right: -20px;
opacity: 0.03;
color: #fff;
pointer-events: none;
}
.contact-highlight h3 {
font-size: 30px;
font-weight: 800;
margin-bottom: 20px;
}
.contact-details {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 30px;
margin-top: 30px;
}
.c-item {
background: rgba(255,255,255,0.08);
padding: 15px 30px;
border-radius: 50px;
display: flex;
align-items: center;
backdrop-filter: blur(5px);
transition: all 0.3s;
}
.c-item:hover {
background: rgba(255,107,53,0.9);
}
.c-item i {
font-size: 20px;
margin-right: 15px;
color: #ff6b35;
}
.c-item:hover i {
color: #fff;
}
.c-item a {
color: #fff;
text-decoration: none;
font-weight: 500;
font-size: 16px;
}
.breadcrumbs {
background: #061122;
color: #fff;
padding: 40px 0;
margin-bottom: 0;
}
.breadcrumbs h2 { color: #fff; font-family: 'Outfit', sans-serif; font-weight: 700; }
.breadcrumbs a { color: #ff6b35; text-decoration: none; }
.premium-testimonials-section {
background-color: #f8f9fa;
padding: 80px 0;
}
.premium-testimonials-section .section-title {
text-align: center;
margin-bottom: 60px;
}
.premium-testimonials-section .section-title h2 {
font-size: 38px;
font-weight: 800;
color: #061122;
font-family: 'Outfit', sans-serif;
margin-bottom: 15px;
position: relative;
padding-bottom: 20px;
text-transform: capitalize;
}
.premium-testimonials-section .section-title h2::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 70px;
height: 4px;
background: #ff6b35;
border-radius: 2px;
}
.premium-testimonials-section .section-title p {
font-size: 17px;
color: #6c757d;
max-width: 700px;
margin: 0 auto;
}
.premium-test-card {
background: #fff;
border-radius: 20px;
padding: 40px;
box-shadow: 0 10px 40px rgba(0,0,0,0.04);
position: relative;
transition: all 0.4s ease;
border: 1px solid rgba(0,0,0,0.03);
display: flex;
flex-direction: column;
height: 100%;
z-index: 1;
overflow: hidden;
margin-bottom: 50px;
}
.premium-test-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 50px rgba(0,0,0,0.08);
border-color: rgba(255,107,53,0.15);
}
.premium-test-card::before {
content: '\201D';
position: absolute;
top: 10px;
right: 30px;
font-size: 150px;
color: rgba(255,107,53,0.04);
font-family: serif;
line-height: 1;
z-index: -1;
transition: color 0.4s ease;
}
.premium-test-card:hover::before {
color: rgba(255,107,53,0.08);
}
.t-author {
display: flex;
align-items: center;
margin-bottom: 25px;
}
.t-avatar {
width: 65px;
height: 65px;
border-radius: 50%;
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 700;
font-family: 'Outfit', sans-serif;
margin-right: 20px;
box-shadow: 0 8px 20px rgba(6,17,34,0.15);
}
.t-info h3 {
font-size: 19px;
font-weight: 700;
color: #061122;
margin: 0 0 5px 0;
font-family: 'Outfit', sans-serif;
}
.t-info h4 {
font-size: 13px;
color: #ff6b35;
margin: 0;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.t-stars {
color: #f5b301;
font-size: 14px;
margin-bottom: 20px;
}
.t-stars i { margin-right: 2px; }
.t-content {
font-size: 15.5px;
line-height: 1.8;
color: #4b5563;
font-style: italic;
flex-grow: 1;
margin: 0;
}
body {
font-family: 'Outfit', sans-serif;
background-color: #fdfdfd;
}
.spec-hero {
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
padding: 70px 0;
color: #fff;
text-align: center;
position: relative;
overflow: hidden;
}
.spec-hero::after {
content: '\F334';
font-family: 'bootstrap-icons';
position: absolute;
right: -20px;
bottom: -50px;
font-size: 250px;
color: rgba(255,255,255,0.03);
line-height: 1;
}
.spec-hero h1 {
font-size: 40px;
font-weight: 800;
margin-bottom: 15px;
position: relative;
z-index: 2;
}
.spec-hero p {
font-size: 18px;
color: rgba(255,255,255,0.8);
max-width: 700px;
margin: 0 auto;
position: relative;
z-index: 2;
}
.spec-intro-block {
background: #fff;
padding: 40px;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
margin-top: -40px;
position: relative;
z-index: 3;
border-top: 4px solid #ff6b35;
margin-bottom: 60px;
}
.spec-intro-block h3 {
font-size: 22px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
display: flex;
align-items: center;
}
.spec-intro-block h3 i {
color: #ff6b35;
margin-right: 12px;
font-size: 26px;
}
.spec-intro-block p {
font-size: 16px;
color: #4b5563;
line-height: 1.7;
margin-bottom: 0;
}
.spec-category-card {
background: #fff;
border-radius: 15px;
border: 1px solid rgba(0,0,0,0.05);
margin-bottom: 40px;
overflow: hidden;
box-shadow: 0 5px 20px rgba(0,0,0,0.02);
}
.spec-category-header {
background: #f8f9fa;
padding: 20px 30px;
border-bottom: 1px solid rgba(0,0,0,0.05);
display: flex;
align-items: center;
}
.spec-category-header i {
font-size: 24px;
color: #ff6b35;
margin-right: 15px;
}
.spec-category-header h4 {
margin: 0;
font-size: 20px;
font-weight: 800;
color: #061122;
text-transform: uppercase;
letter-spacing: 1px;
}
.spec-list {
list-style: none;
padding: 0;
margin: 0;
}
.spec-list li {
padding: 15px 30px;
border-bottom: 1px solid rgba(0,0,0,0.03);
display: flex;
align-items: flex-start;
}
.spec-list li:last-child {
border-bottom: none;
}
.spec-label {
min-width: 250px;
font-weight: 700;
color: #061122;
font-size: 15px;
flex-shrink: 0;
position: relative;
padding-left: 20px;
}
.spec-label::before {
content: '\F287';
font-family: 'bootstrap-icons';
position: absolute;
left: 0;
color: #ff6b35;
font-weight: bold;
}
.spec-value {
color: #4b5563;
font-size: 15px;
line-height: 1.6;
}
.delivery-section {
padding: 80px 0;
background: #f4f6f9;
}
.delivery-title {
text-align: center;
margin-bottom: 50px;
}
.delivery-title h2 {
font-size: 34px;
font-weight: 800;
color: #061122;
}
.package-card {
background: #fff;
border-radius: 20px;
padding: 40px;
height: 100%;
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
transition: all 0.3s;
position: relative;
border: 1px solid rgba(0,0,0,0.03);
}
.package-card:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.package-card.premium-pkg {
border: 2px solid #ff6b35;
}
.package-card.premium-pkg .pkg-badge {
position: absolute;
top: -15px;
right: 30px;
background: #ff6b35;
color: #fff;
padding: 8px 20px;
border-radius: 50px;
font-weight: 700;
font-size: 14px;
box-shadow: 0 5px 15px rgba(255,107,53,0.3);
}
.pkg-header {
text-align: center;
border-bottom: 1px solid rgba(0,0,0,0.05);
padding-bottom: 25px;
margin-bottom: 30px;
}
.pkg-header h3 {
font-size: 26px;
font-weight: 800;
color: #061122;
margin-bottom: 10px;
}
.pkg-header p {
color: #6c757d;
margin: 0;
font-size: 15px;
}
.responsibility-box {
margin-bottom: 25px;
}
.responsibility-box h5 {
font-size: 16px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
padding-left: 10px;
border-left: 3px solid #ff6b35;
}
.resp-list {
list-style: none;
padding: 0;
margin: 0;
}
.resp-list li {
font-size: 15px;
color: #4b5563;
padding: 8px 0;
display: flex;
}
.resp-list li i {
margin-right: 12px;
font-size: 18px;
margin-top: 2px;
}
.resp-servilla i { color: #28a745; }
.resp-customer i { color: #ffc107; }
@media(max-width: 768px){
.spec-list li { flex-direction: column; }
.spec-label { min-width: 100%; margin-bottom: 8px; border-bottom: 1px dashed #eee; padding-bottom: 5px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #f8fafc;
}
.brands-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(26,54,93,0.85) 100%), url('../../images/slider-background-3.webp');
background-size: cover;
background-position: center;
padding: 120px 0 100px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: -40px;
position: relative;
z-index: 10;
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.brands-hero h1 {
font-size: 52px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -1px;
}
.brands-hero p {
font-size: 20px;
color: rgba(255,255,255,0.85);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.premium-section-title {
text-align: center;
margin-bottom: 60px;
}
.premium-section-title h2 {
font-size: 36px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
position: relative;
display: inline-block;
}
.premium-section-title h2::after {
content: ''; position: absolute; width: 60px; height: 4px;
background: #ff6b35; bottom: -15px; left: 50%; transform: translateX(-50%); border-radius: 2px;
}
.premium-section-title p {
font-size: 18px; color: #6c757d; max-width: 700px; margin: 25px auto 0 auto;
}
.brands-section {
padding: 100px 0 60px 0;
}
.brand-category-wrap {
background: #fff;
border-radius: 20px;
padding: 50px 40px;
box-shadow: 0 15px 40px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.02);
margin-bottom: 40px;
}
.brand-cat-header {
display: flex;
align-items: center;
margin-bottom: 30px;
padding-bottom: 20px;
border-bottom: 2px dashed #edf2f7;
}
.brand-cat-header .cat-icon {
width: 60px; height: 60px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 15px;
display: flex; align-items: center; justify-content: center;
font-size: 28px;
margin-right: 20px;
}
.brand-cat-header h3 {
margin: 0;
font-size: 26px;
font-weight: 800;
color: #061122;
}
.brand-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 20px;
}
.brand-item {
background: #f8fafc;
border: 1px solid #edf2f7;
border-radius: 12px;
padding: 25px 20px;
text-align: center;
transition: all 0.3s;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 120px;
}
.brand-item:hover {
background: #fff;
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0,0,0,0.06);
border-color: rgba(255,107,53,0.3);
}
.brand-item-name {
font-size: 20px;
font-weight: 800;
color: #1a365d;
letter-spacing: 1px;
}
.brand-item-desc {
font-size: 13px;
color: #6c757d;
margin-top: 5px;
font-weight: 500;
}
.quality-standards {
background: #061122;
padding: 80px 0;
color: #fff;
border-radius: 30px;
margin: 40px 0 80px 0;
position: relative;
overflow: hidden;
}
.quality-standards::before {
content: ''; position: absolute; top:0; right:0; width: 50%; height: 100%;
background: radial-gradient(circle, rgba(255,107,53,0.15) 0%, rgba(6,17,34,0) 70%);
}
.quality-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 40px;
position: relative;
z-index: 2;
}
.q-feature {
text-align: center;
}
.q-feature i {
font-size: 40px;
color: #ff6b35;
margin-bottom: 20px;
display: block;
}
.q-feature h4 {
font-size: 20px;
font-weight: 800;
margin-bottom: 15px;
}
.q-feature p {
font-size: 15px;
color: rgba(255,255,255,0.7);
line-height: 1.6;
}
.lux-bottom-cta {
background-size: cover; background-position: center; border-radius: 0 !important; overflow: hidden; position: relative; padding: 80px 40px; margin: 60px 0; text-align: center; box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.lux-bottom-cta::before {
content: ''; position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(6,17,34,0.8) 100%); z-index: 1;
}
.lux-bottom-cta-content {
position: relative; z-index: 2; color: #fff;
}
.lux-bottom-cta h2 { font-size: 32px; font-weight: 800; margin-bottom: 15px; }
.lux-bottom-cta h2 b { color: #ff6b35; }
.lux-bottom-cta p { font-size: 18px; color: rgba(255,255,255,0.8); margin-bottom: 30px; }
.lux-bottom-btn {
background: #ff6b35; color: #fff; padding: 16px 35px; border-radius: 50px; font-weight: 800; text-decoration: none; display: inline-block; transition: all 0.3s; font-size: 16px; border: 2px solid #ff6b35;
}
.lux-bottom-btn:hover { background: transparent; color: #ff6b35; transform: scale(1.05); }
@media (max-width: 991px) {
.quality-grid { grid-template-columns: 1fr; gap: 30px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #fff;
}
.celik-hero-v2 {
background: #fdfdfd;
padding: 80px 0;
position: relative;
border-bottom: 1px solid rgba(0,0,0,0.03);
}
.hero-v2-content h1 {
font-size: 46px;
font-weight: 800;
color: #061122;
margin-bottom: 20px;
line-height: 1.2;
}
.hero-v2-content h1 span {
color: #ff6b35;
position: relative;
display: inline-block;
}
.hero-v2-content h1 span::after {
content: '';
position: absolute;
width: 100%;
height: 8px;
background: rgba(255,107,53,0.15);
bottom: 5px;
left: 0;
z-index: -1;
}
.hero-v2-content p {
font-size: 18px;
color: #4b5563;
line-height: 1.8;
margin-bottom: 35px;
}
.hero-tags {
display: flex;
flex-wrap: wrap;
gap: 15px;
margin-bottom: 40px;
}
.hero-tags span {
background: #fff;
border: 1px solid rgba(0,0,0,0.05);
padding: 8px 15px;
border-radius: 5px;
font-size: 15px;
color: #061122;
font-weight: 500;
box-shadow: 0 4px 10px rgba(0,0,0,0.02);
}
.hero-tags span i {
color: #ff6b35;
margin-right: 8px;
}
.hero-img-box {
position: relative;
border-radius: 20px;
overflow: hidden;
box-shadow: 0 20px 40px rgba(0,0,0,0.08);
}
.hero-img-box img {
width: 100%;
height: auto;
display: block;
}
.btn-premium-orange {
background: #ff6b35;
color: #fff;
padding: 15px 35px;
border-radius: 8px;
font-weight: 700;
text-decoration: none;
display: inline-block;
transition: all 0.3s;
box-shadow: 0 5px 20px rgba(255,107,53,0.3);
}
.btn-premium-orange:hover {
background: #e85a24;
color: #fff;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255,107,53,0.4);
}
.section-title-airy {
text-align: center;
margin-bottom: 60px;
}
.section-title-airy h2 {
font-size: 36px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.section-title-airy p {
font-size: 17px;
color: #6c757d;
max-width: 600px;
margin: 0 auto;
}
.airy-advantages {
padding: 100px 0;
background: #fafafa;
}
.adv-minimal {
padding: 20px;
transition: all 0.3s ease;
border-radius: 12px;
}
.adv-minimal:hover {
background: #fff;
box-shadow: 0 10px 30px rgba(0,0,0,0.04);
}
.adv-minimal-icon {
font-size: 32px;
color: #ff6b35;
margin-bottom: 15px;
}
.adv-minimal h4 {
font-size: 19px;
font-weight: 700;
color: #061122;
margin-bottom: 10px;
}
.adv-minimal p {
font-size: 15px;
color: #6c757d;
line-height: 1.6;
margin: 0;
}
.airy-tech-process {
padding: 90px 0;
background: #fff;
border-top: 1px solid rgba(0,0,0,0.03);
}
.tech-light-box {
background: #f8f9fa;
padding: 40px;
border-radius: 15px;
border-left: 4px solid #061122;
height: 100%;
}
.tech-light-box h3 {
font-size: 24px;
font-weight: 800;
color: #061122;
margin-bottom: 25px;
}
.tech-list-airy {
list-style: none;
padding: 0; margin: 0;
}
.tech-list-airy li {
font-size: 16px;
color: #4b5563;
padding: 12px 0;
border-bottom: 1px solid rgba(0,0,0,0.05);
display: flex;
align-items: center;
}
.tech-list-airy li i {
color: #ff6b35;
font-size: 20px;
margin-right: 15px;
}
.airy-form-section {
padding: 100px 0;
background: linear-gradient(180deg, #fff 0%, #f4f6f9 100%);
}
.form-content-area h2 {
font-size: 38px;
font-weight: 800;
color: #061122;
margin-bottom: 20px;
}
.form-content-area p {
font-size: 18px;
color: #4b5563;
line-height: 1.7;
margin-bottom: 40px;
}
.contact-pill {
display: inline-flex;
align-items: center;
background: #fff;
padding: 12px 25px;
border-radius: 50px;
box-shadow: 0 4px 15px rgba(0,0,0,0.05);
font-weight: 700;
color: #061122;
font-size: 18px;
border: 1px solid rgba(0,0,0,0.03);
}
.contact-pill i {
color: #ff6b35;
font-size: 22px;
margin-right: 12px;
}
.sleek-form-card {
background: #fff;
padding: 50px;
border-radius: 20px;
box-shadow: 0 20px 50px rgba(0,0,0,0.05);
border: 1px solid rgba(0,0,0,0.02);
}
.sleek-input {
background: #f8f9fa;
border: 1px solid #eee;
padding: 15px 20px;
border-radius: 8px;
box-shadow: none;
transition: all 0.3s;
}
.sleek-input:focus {
background: #fff;
border-color: #ff6b35;
box-shadow: 0 0 0 3px rgba(255,107,53,0.1);
}
.premium-process-section {
padding: 70px 0;
background-color: #fcfcfc;
font-family: 'Outfit', sans-serif;
}
.process-hero {
text-align: center;
margin-bottom: 70px;
}
.process-hero .p-subtitle {
color: #ff6b35;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
display: inline-block;
background: rgba(255, 107, 53, 0.1);
padding: 6px 15px;
border-radius: 5px;
margin-bottom: 15px;
}
.process-hero h2 {
color: #061122;
font-size: 42px;
font-weight: 800;
margin-bottom: 25px;
}
.process-hero p {
color: #4b5563;
font-size: 17px;
line-height: 1.8;
max-width: 800px;
margin: 0 auto;
}
.premium-timeline {
position: relative;
max-width: 900px;
margin: 0 auto;
padding-left: 50px;
}
.premium-timeline::before {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 20px;
width: 4px;
background: rgba(6, 17, 34, 0.05);
border-radius: 2px;
}
.timeline-item {
position: relative;
margin-bottom: 50px;
}
.timeline-item:last-child {
margin-bottom: 0;
}
.timeline-node {
position: absolute;
left: -50px;
top: 0;
width: 45px;
height: 45px;
background: #061122;
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
font-weight: 800;
z-index: 2;
box-shadow: 0 0 0 5px rgba(6, 17, 34, 0.1);
transition: all 0.3s ease;
}
.timeline-item:hover .timeline-node {
background: #ff6b35;
box-shadow: 0 0 0 5px rgba(255, 107, 53, 0.2);
transform: scale(1.1);
}
.timeline-content {
background: #fff;
border-radius: 15px;
padding: 40px;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.03);
transition: all 0.4s ease;
position: relative;
}
.timeline-item:hover .timeline-content {
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
transform: translateY(-5px);
}
.timeline-content::before {
content: '';
position: absolute;
top: 15px;
left: -10px;
border-style: solid;
border-width: 10px 10px 10px 0;
border-color: transparent #fff transparent transparent;
z-index: 1;
}
.timeline-content h3 {
font-size: 24px;
font-weight: 800;
color: #061122;
margin-bottom: 20px;
}
.timeline-content p {
color: #4b5563;
font-size: 15.5px;
line-height: 1.8;
margin-bottom: 15px;
}
.timeline-card-list {
background: rgba(6, 17, 34, 0.02);
border-radius: 10px;
padding: 20px 25px;
margin-top: 20px;
border-left: 3px solid #ff6b35;
}
.timeline-card-list ul {
list-style: none;
padding: 0;
margin: 0;
}
.timeline-card-list ul li {
font-size: 15px;
color: #061122;
padding: 8px 0;
border-bottom: 1px solid rgba(0,0,0,0.05);
display: flex;
align-items: center;
}
.timeline-card-list ul li:last-child {
border-bottom: none;
}
.timeline-card-list ul li i {
color: #ff6b35;
margin-right: 12px;
font-size: 18px;
}
.process-scheme-box {
max-width: 900px;
margin: 60px auto 0 auto;
background: #fff;
padding: 15px;
border-radius: 15px;
box-shadow: 0 15px 40px rgba(0,0,0,0.05);
text-align: center;
}
.process-scheme-box img {
border-radius: 10px;
width: 100%;
height: auto;
}
.architect-author-card {
max-width: 600px;
margin: 60px auto;
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
border-radius: 20px;
padding: 40px;
color: #fff;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0 15px 30px rgba(6, 17, 34, 0.15);
}
.architect-info h4 {
font-size: 24px;
font-weight: 800;
margin-bottom: 5px;
color: #fff;
}
.architect-info span {
color: #ff6b35;
font-size: 15px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
}
.architect-contact {
text-align: right;
}
.architect-contact a {
display: block;
color: rgba(255,255,255,0.8);
text-decoration: none;
font-size: 16px;
margin-bottom: 8px;
transition: color 0.3s;
}
.architect-contact a:hover {
color: #ff6b35;
}
.architect-contact a i {
margin-right: 8px;
color: #ff6b35;
}
@media (max-width: 768px) {
.premium-timeline { padding-left: 30px; }
.premium-timeline::before { left: 0; }
.timeline-node { left: -22px; width: 40px; height: 40px; font-size: 18px; }
.architect-author-card { flex-direction: column; text-align: center; }
.architect-contact { text-align: center; margin-top: 20px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #fdfdfd;
}
.guide-hero {
padding: 80px 0 60px 0;
text-align: center;
background: #fff;
border-bottom: 1px solid rgba(0,0,0,0.03);
}
.guide-badge {
display: inline-block;
background: rgba(255,107,53,0.1);
color: #ff6b35;
font-weight: 700;
font-size: 14px;
padding: 8px 20px;
border-radius: 50px;
margin-bottom: 20px;
letter-spacing: 1px;
text-transform: uppercase;
}
.guide-hero h1 {
font-size: 42px;
font-weight: 800;
color: #061122;
margin-bottom: 25px;
line-height: 1.3;
}
.guide-hero p.lead-text {
font-size: 20px;
color: #4b5563;
max-width: 800px;
margin: 0 auto;
line-height: 1.8;
}
.guide-content-section {
padding: 70px 0;
}
.quote-box {
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
color: #fff;
padding: 40px 50px;
border-radius: 20px;
position: relative;
margin-bottom: 50px;
box-shadow: 0 15px 40px rgba(6,17,34,0.1);
}
.quote-box::after {
content: '\F6B0';
font-family: 'bootstrap-icons';
position: absolute;
right: 30px;
bottom: -20px;
font-size: 120px;
color: rgba(255,255,255,0.03);
pointer-events: none;
}
.quote-box h3 {
color: #ff6b35;
font-weight: 800;
font-size: 24px;
margin-bottom: 15px;
}
.quote-box p {
font-size: 17px;
line-height: 1.8;
color: rgba(255,255,255,0.9);
margin-bottom: 0;
}
.intro-text-block {
margin-bottom: 60px;
}
.intro-text-block h4 {
font-size: 26px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.intro-text-block p {
font-size: 17px;
color: #4b5563;
line-height: 1.8;
margin-bottom: 20px;
}
.criteria-list-header {
font-size: 32px;
font-weight: 800;
color: #061122;
margin-bottom: 40px;
padding-bottom: 15px;
border-bottom: 3px solid #ff6b35;
display: inline-block;
}
.criterion-card {
background: #fff;
border-radius: 15px;
padding: 40px 40px 40px 100px;
margin-bottom: 30px;
position: relative;
box-shadow: 0 5px 20px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.02);
transition: all 0.3s ease;
overflow: hidden;
}
.criterion-card:hover {
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
transform: translateY(-3px);
border-color: rgba(255,107,53,0.3);
}
.criterion-card .big-number {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -15px;
font-size: 140px;
font-weight: 900;
color: rgba(6,17,34,0.03);
line-height: 1;
z-index: 1;
transition: color 0.3s;
}
.criterion-card:hover .big-number {
color: rgba(255,107,53,0.05);
}
.criterion-card .badge-num {
position: absolute;
top: 45px;
left: 40px;
background: #ff6b35;
color: #fff;
width: 35px;
height: 35px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
font-weight: 800;
font-size: 16px;
z-index: 2;
}
.criterion-card-content {
position: relative;
z-index: 2;
}
.criterion-card-content h4 {
font-size: 22px;
font-weight: 800;
color: #061122;
margin-bottom: 12px;
}
.criterion-card-content p {
font-size: 16.5px;
color: #4b5563;
line-height: 1.7;
margin-bottom: 0;
}
.guide-conclusion {
background: #f4f6f9;
padding: 40px;
border-radius: 15px;
margin-top: 50px;
border-left: 5px solid #061122;
}
.guide-conclusion p {
font-size: 17px;
color: #4b5563;
line-height: 1.8;
margin-bottom: 15px;
}
.guide-conclusion p:last-child {
margin-bottom: 0;
}
.author-cta-card {
background: #fff;
border: 2px solid #ff6b35;
border-radius: 20px;
padding: 40px;
margin-top: 60px;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 0 15px 30px rgba(255,107,53,0.1);
}
.author-details h4 {
font-size: 24px;
font-weight: 800;
color: #061122;
margin-bottom: 5px;
}
.author-details p {
color: #6c757d;
font-size: 16px;
margin: 0;
font-weight: 500;
}
.author-contact a {
display: inline-flex;
align-items: center;
background: #061122;
color: #fff;
text-decoration: none;
padding: 15px 30px;
border-radius: 50px;
font-weight: 700;
font-size: 18px;
transition: background 0.3s;
}
.author-contact a i {
color: #ff6b35;
margin-right: 12px;
font-size: 22px;
}
.author-contact a:hover {
background: #ff6b35;
}
.author-contact a:hover i {
color: #fff;
}
@media(max-width: 768px){
.criterion-card { padding: 30px 30px 30px 30px; }
.criterion-card .badge-num { position: relative; top: 0; left: 0; margin-bottom: 15px; }
.criterion-card .big-number { display: none; }
.author-cta-card { flex-direction: column; text-align: center; }
.author-contact { margin-top: 20px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #f7f9fc;
}
.lux-filter-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.85) 0%, rgba(26,54,93,0.85) 100%), url('../../images/slider-background-3.webp');
background-size: cover;
background-position: center;
padding: 80px 0 100px 0;
text-align: center;
color: #fff;
position: relative;
border-radius: 0 !important;
margin-bottom: 50px;
}
.lux-filter-hero h1 {
font-size: 42px;
font-weight: 800;
margin-bottom: 15px;
letter-spacing: -0.5px;
}
.lux-filter-hero p {
font-size: 18px;
color: rgba(255,255,255,0.8);
max-width: 600px;
margin: 0 auto 30px auto;
}
.lux-filter-glass-box {
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 20px;
padding: 30px;
max-width: 900px;
margin: 0 auto;
box-shadow: 0 20px 40px rgba(0,0,0,0.15);
transform: translateY(40px);
}
.lux-filter-row {
display: flex;
gap: 15px;
align-items: flex-end;
}
.lux-filter-group {
flex: 1;
text-align: left;
}
.lux-filter-group label {
display: block;
font-size: 14px;
font-weight: 700;
color: rgba(255,255,255,0.9);
margin-bottom: 8px;
text-transform: uppercase;
letter-spacing: 1px;
}
.lux-filter-control {
width: 100%;
background: #fff;
border: 1px solid transparent;
border-radius: 12px;
padding: 14px 20px;
font-size: 16px;
color: #061122;
font-weight: 500;
box-shadow: inset 0 2px 5px rgba(0,0,0,0.05);
outline: none;
transition: all 0.3s;
appearance: none;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff6b35' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: right 15px center;
background-size: 16px;
cursor: pointer;
}
.lux-filter-control:focus {
border-color: #ff6b35;
box-shadow: 0 0 0 4px rgba(255,107,53,0.15);
}
.lux-filter-btn {
background: #ff6b35;
color: #fff;
border: none;
border-radius: 12px;
padding: 14px 30px;
font-size: 16px;
font-weight: 800;
cursor: pointer;
transition: all 0.3s;
height: 52px;
text-transform: uppercase;
letter-spacing: 1px;
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.lux-filter-btn:hover {
background: #e85a24;
transform: translateY(-2px);
box-shadow: 0 15px 30px rgba(255,107,53,0.4);
}
.lux-results-section {
padding: 60px 0;
}
.lux-results-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 40px;
background: #fff;
padding: 20px 30px;
border-radius: 16px;
box-shadow: 0 10px 30px rgba(0,0,0,0.02);
border: 1px solid rgba(0,0,0,0.03);
}
.lux-results-title {
font-size: 20px;
font-weight: 800;
color: #061122;
margin: 0;
}
.lux-results-count {
background: rgba(255,107,53,0.1);
color: #e85a24;
padding: 5px 15px;
border-radius: 50px;
font-weight: 700;
font-size: 14px;
}
.lux-no-results {
background: #fff;
padding: 60px 20px;
text-align: center;
border-radius: 20px;
border: 1px dashed rgba(0,0,0,0.1);
}
.lux-no-results i {
font-size: 50px;
color: #ffc107;
margin-bottom: 20px;
}
@media(max-width: 991px) {
.lux-filter-row { flex-direction: column; align-items: stretch; gap: 20px;}
.lux-filter-glass-box { transform: translateY(20px); padding: 20px;}
.lux-filter-btn { width: 100%; }
.lux-filter-hero { padding-bottom: 50px; border-radius: 0 !important;}
}
.lux-category-grid {
padding: 80px 0;
background: #fcfdfd;
font-family: inherit;
}
.lux-hero-section {
text-align: center;
max-width: 800px;
margin: 0 auto 60px auto;
}
.lux-hero-title {
font-size: 38px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.lux-hero-subtitle {
font-size: 20px;
font-weight: 600;
color: #ff6b35;
margin-bottom: 25px;
}
.lux-hero-desc {
font-size: 16px;
color: #6c757d;
line-height: 1.8;
}
.lux-cat-card {
background: #ffffff;
border-radius: 16px;
padding: 40px 30px;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
text-decoration: none !important;
}
.lux-cat-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
border-color: rgba(255,107,53,0.3);
}
.lux-cat-icon {
width: 80px;
height: 80px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 36px;
margin-bottom: 25px;
transition: all 0.3s ease;
}
.lux-cat-card:hover .lux-cat-icon {
background: #ff6b35;
color: #ffffff;
transform: scale(1.1) translateY(-5px);
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.lux-cat-title {
font-size: 20px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
transition: color 0.3s;
line-height: 1.3;
}
.lux-cat-card:hover .lux-cat-title {
color: #ff6b35;
}
.lux-cat-desc {
font-size: 14px;
color: #6c757d;
margin: 0 0 20px 0;
line-height: 1.6;
font-weight: 500;
}
.lux-cat-list {
list-style: none;
padding: 0;
margin: auto 0 0 0;
text-align: left;
width: 100%;
}
.lux-cat-list li {
font-size: 14px;
color: #495057;
margin-bottom: 10px;
padding-left: 24px;
position: relative;
font-weight: 500;
line-height: 1.4;
}
.lux-cat-list li:last-child {
margin-bottom: 0;
}
.lux-cat-list li::before {
content: '\2713';
position: absolute;
left: 0;
top: -1px;
color: #ff6b35;
font-weight: 900;
font-size: 15px;
}
.lux-why-section {
padding: 80px 0;
background: #f8fbfb;
font-family: inherit;
}
.lux-why-hero {
text-align: center;
max-width: 900px;
margin: 0 auto 60px auto;
}
.lux-why-title {
font-size: 42px;
font-weight: 900;
color: #061122;
margin-bottom: 20px;
}
.lux-why-subtitle {
font-size: 22px;
font-weight: 700;
color: #ff6b35;
margin-bottom: 30px;
line-height: 1.4;
}
.lux-why-desc {
font-size: 16px;
color: #555;
line-height: 1.8;
}
.lux-why-card {
background: #ffffff;
border-radius: 16px;
padding: 40px;
display: flex;
align-items: flex-start;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
height: 100%;
gap: 25px;
}
.lux-why-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(0,0,0,0.08);
border-color: rgba(255,107,53,0.3);
}
.lux-why-icon {
flex-shrink: 0;
width: 70px;
height: 70px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
font-size: 32px;
transition: all 0.3s ease;
}
.lux-why-card:hover .lux-why-icon {
background: #ff6b35;
color: #ffffff;
transform: rotate(5deg) scale(1.05);
}
.lux-why-content h3 {
font-size: 20px;
font-weight: 800;
color: #061122;
margin-bottom: 12px;
line-height: 1.3;
}
.lux-why-content p {
font-size: 15px;
color: #6c757d;
margin: 0;
line-height: 1.6;
}
.lux-why-summary {
background: #061122;
border-radius: 20px;
padding: 60px;
margin-top: 60px;
color: #fff;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 40px;
}
.lux-why-summary-text {
flex: 1;
min-width: 300px;
}
.lux-why-summary-text h3 {
color: #fff;
font-weight: 800;
font-size: 32px;
margin-bottom: 20px;
}
.lux-why-summary-text p {
color: #a0aab5;
font-size: 16px;
line-height: 1.7;
margin-bottom: 30px;
}
.lux-why-list {
list-style: none;
padding: 0;
margin: 0;
}
.lux-why-list li {
font-size: 16px;
color: #e9ecef;
margin-bottom: 15px;
display: flex;
align-items: center;
font-weight: 500;
}
.lux-why-list li i {
color: #ff6b35;
font-size: 22px;
margin-right: 15px;
}
.lux-why-cta {
flex-shrink: 0;
text-align: center;
}
.lux-why-cta-btn {
display: inline-flex;
align-items: center;
justify-content: center;
background: #ff6b35;
color: #fff;
font-size: 18px;
font-weight: 700;
padding: 20px 40px;
border-radius: 50px;
text-decoration: none;
transition: all 0.3s;
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.lux-why-cta-btn:hover {
background: #e55a2b;
transform: translateY(-3px);
box-shadow: 0 15px 25px rgba(255,107,53,0.4);
color: #fff;
}
.lux-why-cta-btn i {
margin-left: 10px;
font-size: 22px;
}
@media (max-width: 768px) {
.lux-why-card {
flex-direction: column;
align-items: flex-start;
padding: 30px;
}
.lux-why-summary {
padding: 40px 30px;
}
}
:root {
--pr-dark: #061122;
--pr-orange: #ff6b35;
--pr-gray: #f8fbfb;
--pr-text: #6c757d;
}
body { font-family: inherit; }
.arsa-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(10,31,63,0.85) 100%), url('../../images/hero_villa_sunset.png') no-repeat center center;
background-size: cover;
color: #fff;
padding: 100px 0 80px 0;
position: relative;
overflow: hidden;
}
.arsa-hero::after {
content: '';
position: absolute;
right: -100px;
top: -100px;
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(255,107,53,0.15) 0%, rgba(0,0,0,0) 70%);
}
.arsa-hero-content {
max-width: 800px;
position: relative;
z-index: 2;
}
.arsa-hero h1 {
font-size: 48px;
font-weight: 900;
color: #fff;
margin-bottom: 20px;
line-height: 1.2;
}
.arsa-hero h2 {
font-size: 22px;
font-weight: 400;
color: #a0aab5;
margin-bottom: 30px;
line-height: 1.6;
}
.arsa-trust-list {
list-style: none;
padding: 0;
margin: 0 0 40px 0;
display: flex;
flex-wrap: wrap;
gap: 15px 30px;
}
.arsa-trust-list li {
font-size: 16px;
font-weight: 500;
display: flex;
align-items: center;
}
.arsa-trust-list li i {
color: var(--pr-orange);
font-size: 20px;
margin-right: 10px;
}
.arsa-cta-row {
display: flex;
gap: 20px;
flex-wrap: wrap;
}
.btn-premium-orange {
background: var(--pr-orange);
color: #fff;
padding: 18px 40px;
border-radius: 50px;
font-size: 18px;
font-weight: 800;
text-decoration: none;
transition: all 0.3s;
display: inline-flex;
align-items: center;
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.btn-premium-orange:hover {
background: #e55a2b;
transform: translateY(-3px);
color: #fff;
}
.btn-premium-outline {
background: transparent;
color: #fff;
border: 2px solid rgba(255,255,255,0.2);
padding: 18px 40px;
border-radius: 50px;
font-size: 18px;
font-weight: 700;
text-decoration: none;
transition: all 0.3s;
display: inline-flex;
align-items: center;
}
.btn-premium-outline:hover {
background: rgba(255,255,255,0.1);
border-color: #fff;
color: #fff;
}
.arsa-trust-bar {
background: #fff;
padding: 30px 0;
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
position: relative;
z-index: 10;
margin-top: -40px;
border-radius: 16px;
}
.trust-item {
display: flex;
align-items: center;
gap: 15px;
padding: 10px 20px;
}
.trust-icon {
font-size: 36px;
color: var(--pr-orange);
}
.trust-text h4 {
font-size: 18px;
font-weight: 800;
color: var(--pr-dark);
margin: 0 0 5px 0;
}
.trust-text p {
font-size: 14px;
color: var(--pr-text);
margin: 0;
}
.arsa-val-sec {
padding: 100px 0;
background: var(--pr-gray);
}
.val-title {
font-size: 36px;
font-weight: 900;
color: var(--pr-dark);
margin-bottom: 25px;
}
.val-desc {
font-size: 18px;
color: var(--pr-text);
line-height: 1.8;
margin-bottom: 30px;
}
.val-list {
list-style: none;
padding: 0;
margin-bottom: 30px;
}
.val-list li {
font-size: 16px;
padding-left: 30px;
position: relative;
margin-bottom: 12px;
font-weight: 600;
color: var(--pr-dark);
}
.val-list li::before {
content: '\2713';
position: absolute;
left: 0;
color: var(--pr-orange);
font-weight: bold;
font-size: 18px;
}
.val-img-box {
background: #fff;
border-radius: 20px;
padding: 40px;
box-shadow: 0 15px 40px rgba(0,0,0,0.05);
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.val-img-box h3 {
font-size: 24px;
font-weight: 800;
color: var(--pr-dark);
margin-bottom: 15px;
}
.val-img-box p {
color: var(--pr-text);
line-height: 1.6;
}
.arsa-steps-sec {
padding: 80px 0;
background: #fff;
}
.sec-header {
text-align: center;
margin-bottom: 60px;
}
.sec-header h2 {
font-size: 36px;
font-weight: 900;
color: var(--pr-dark);
}
.step-card {
background: var(--pr-gray);
border-radius: 16px;
padding: 40px 30px;
height: 100%;
position: relative;
border: 1px solid rgba(0,0,0,0.03);
transition: transform 0.3s;
}
.step-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 30px rgba(0,0,0,0.05);
}
.step-num {
position: absolute;
top: -20px;
left: 30px;
width: 50px;
height: 50px;
background: var(--pr-orange);
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
font-weight: 800;
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
.step-card h3 {
font-size: 22px;
font-weight: 800;
color: var(--pr-dark);
margin: 20px 0 15px 0;
}
.step-card p {
font-size: 15px;
color: var(--pr-text);
margin-bottom: 15px;
font-weight: 500;
}
.step-list {
list-style: none;
padding: 0;
margin: 0;
}
.step-list li {
font-size: 14px;
color: #495057;
margin-bottom: 8px;
padding-left: 20px;
position: relative;
}
.step-list li::before {
content: '';
position: absolute;
left: 0;
top: 6px;
width: 8px;
height: 8px;
background: var(--pr-orange);
border-radius: 50%;
}
.arsa-split-sec {
padding: 80px 0;
background: var(--pr-dark);
color: #fff;
}
.split-box {
background: rgba(255,255,255,0.03);
border: 1px solid rgba(255,255,255,0.08);
border-radius: 20px;
padding: 50px;
height: 100%;
}
.split-box h3 {
font-size: 30px;
font-weight: 800;
color: #fff;
margin-bottom: 20px;
}
.split-box p {
color: #a0aab5;
font-size: 16px;
line-height: 1.7;
margin-bottom: 25px;
}
.dark-list {
list-style: none;
padding: 0; margin: 0;
}
.dark-list li {
font-size: 16px;
color: #e9ecef;
margin-bottom: 12px;
display: flex;
align-items: flex-start;
}
.dark-list li i {
color: var(--pr-orange);
font-size: 22px;
margin-right: 12px;
margin-top: 2px;
}
.arsa-faq-sec {
padding: 80px 0;
background: #fff;
}
.faq-item {
background: var(--pr-gray);
border-radius: 12px;
padding: 25px 30px;
margin-bottom: 20px;
}
.faq-item h4 {
font-size: 20px;
font-weight: 800;
color: var(--pr-dark);
margin-bottom: 10px;
}
.faq-item p {
font-size: 16px;
color: var(--pr-text);
margin: 0;
line-height: 1.6;
}
.arsa-form-sec {
padding: 80px 0;
background: linear-gradient(to right, #fcfdfd, #f1f5f9);
}
.form-wrapper {
background: #fff;
border-radius: 24px;
padding: 50px;
box-shadow: 0 20px 50px rgba(0,0,0,0.08);
}
.form-title {
font-size: 32px;
font-weight: 900;
color: var(--pr-dark);
margin-bottom: 15px;
text-align: center;
}
.form-desc {
text-align: center;
color: var(--pr-text);
margin-bottom: 40px;
font-size: 16px;
}
.lux-input {
width: 100%;
padding: 16px 20px;
border: 1px solid #dee2e6;
border-radius: 12px;
font-size: 16px;
margin-bottom: 20px;
background: #f8fbfb;
transition: all 0.3s;
}
.lux-input:focus {
outline: none;
border-color: var(--pr-orange);
background: #fff;
box-shadow: 0 0 0 4px rgba(255,107,53,0.1);
}
.btn-submit {
width: 100%;
background: var(--pr-orange);
color: #fff;
padding: 18px;
border: none;
border-radius: 12px;
font-size: 18px;
font-weight: 800;
cursor: pointer;
transition: all 0.3s;
}
.btn-submit:hover {
background: #e55a2b;
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
}
:root {
--pr-dark: #061122;
--pr-orange: #ff6b35;
--pr-gray: #f8fbfb;
--pr-text: #6c757d;
}
body { font-family: inherit; }
.ins-hero {
background: linear-gradient(135deg, var(--pr-dark) 0%, #1a2a44 100%);
color: #fff;
padding: 100px 0 80px 0;
position: relative;
overflow: hidden;
text-align: center;
}
.ins-hero::before {
content: '';
position: absolute;
left: -100px;
bottom: -100px;
width: 300px;
height: 300px;
background: radial-gradient(circle, rgba(255,107,53,0.1) 0%, rgba(0,0,0,0) 70%);
}
.ins-hero-content {
max-width: 900px;
margin: 0 auto;
position: relative;
z-index: 2;
}
.ins-hero-label {
display: inline-block;
background: rgba(255,107,53,0.2);
color: #ff6b35;
padding: 8px 20px;
border-radius: 50px;
font-weight: 700;
font-size: 14px;
letter-spacing: 1px;
margin-bottom: 20px;
text-transform: uppercase;
}
.ins-hero h1 {
font-size: 46px;
font-weight: 900;
color: #fff;
margin-bottom: 25px;
line-height: 1.2;
}
.ins-hero p {
font-size: 18px;
font-weight: 400;
color: #a0aab5;
margin-bottom: 0;
line-height: 1.8;
}
.ins-content-wrap {
background: #fff;
padding: 60px 0;
}
.ins-article {
max-width: 850px;
margin: 0 auto;
font-size: 17px;
color: var(--pr-text);
line-height: 1.9;
}
.ins-article h2 {
font-size: 28px;
font-weight: 800;
color: var(--pr-dark);
margin: 50px 0 20px 0;
position: relative;
padding-bottom: 15px;
}
.ins-article h2::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 60px;
height: 4px;
background: var(--pr-orange);
border-radius: 2px;
}
.ins-article h3 {
font-size: 22px;
font-weight: 700;
color: var(--pr-dark);
margin: 35px 0 15px 0;
}
.ins-highlight-box {
background: var(--pr-gray);
border-left: 5px solid var(--pr-orange);
padding: 30px;
border-radius: 0 12px 12px 0;
margin: 40px 0;
}
.ins-highlight-box p {
margin: 0;
font-size: 18px;
font-weight: 500;
color: var(--pr-dark);
}
.ins-list {
list-style: none;
padding: 0;
margin: 20px 0 30px 0;
}
.ins-list li {
position: relative;
padding-left: 30px;
margin-bottom: 12px;
}
.ins-list li::before {
content: '\2713';
position: absolute;
left: 0;
top: -2px;
color: var(--pr-orange);
font-weight: 900;
font-size: 18px;
}
.ins-process-list {
counter-reset: ins-counter;
list-style: none;
padding: 0;
margin: 40px 0;
}
.ins-process-list li {
position: relative;
padding-left: 60px;
margin-bottom: 25px;
background: #fff;
border: 1px solid #eee;
padding-top: 20px;
padding-bottom: 20px;
border-radius: 12px;
box-shadow: 0 5px 15px rgba(0,0,0,0.02);
display: flex;
flex-direction: column;
justify-content: center;
}
.ins-process-list li::before {
counter-increment: ins-counter;
content: counter(ins-counter);
position: absolute;
left: -20px;
top: 50%;
transform: translateY(-50%);
width: 45px;
height: 45px;
background: var(--pr-orange);
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
font-weight: 800;
box-shadow: 0 5px 15px rgba(255,107,53,0.3);
}
.ins-process-list li strong {
font-size: 18px;
color: var(--pr-dark);
display: block;
margin-bottom: 5px;
}
.ins-cards-row {
display: flex;
gap: 20px;
margin: 30px 0;
flex-wrap: wrap;
}
.ins-card {
flex: 1;
min-width: 250px;
background: #fff;
border: 1px solid #eaeaea;
padding: 30px;
border-radius: 16px;
text-align: center;
transition: all 0.3s;
}
.ins-card:hover {
box-shadow: 0 10px 30px rgba(0,0,0,0.05);
border-color: rgba(255,107,53,0.3);
transform: translateY(-3px);
}
.ins-card i {
font-size: 40px;
color: var(--pr-orange);
margin-bottom: 15px;
}
.ins-card h4 {
font-size: 18px;
font-weight: 800;
color: var(--pr-dark);
margin-bottom: 10px;
}
.ins-card p {
font-size: 15px;
margin: 0;
line-height: 1.5;
}
.ins-cta-bottom {
background: var(--pr-gray);
padding: 60px;
border-radius: 20px;
text-align: center;
margin-top: 60px;
}
.ins-cta-bottom h3 {
font-size: 30px;
font-weight: 900;
color: var(--pr-dark);
margin-bottom: 15px;
margin-top: 0;
}
.ins-cta-bottom p {
font-size: 18px;
color: var(--pr-text);
margin-bottom: 30px;
}
.btn-ins-cta {
display: inline-flex;
align-items: center;
background: var(--pr-orange);
color: #fff;
font-size: 18px;
font-weight: 800;
padding: 18px 40px;
border-radius: 50px;
text-decoration: none;
box-shadow: 0 10px 20px rgba(255,107,53,0.3);
transition: all 0.3s;
}
.btn-ins-cta:hover {
background: #e55a2b;
transform: translateY(-3px);
color: #fff;
}
.premium-corporate {
padding: 80px 0;
background-color: #fdfdfd;
font-family: 'Outfit', sans-serif;
}
.corp-intro {
margin-bottom: 70px;
}
.corp-subtitle {
color: #ff6b35;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 15px;
display: block;
}
.corp-title {
color: #061122;
font-size: 42px;
font-weight: 800;
line-height: 1.2;
margin-bottom: 30px;
}
.corp-title span {
color: #ff6b35;
}
.corp-lead-text {
font-size: 18px;
color: #4b5563;
line-height: 1.8;
font-weight: 300;
margin-bottom: 25px;
}
.corp-p {
font-size: 15.5px;
color: #6c757d;
line-height: 1.8;
margin-bottom: 20px;
}
.value-cards-wrapper {
margin-top: 50px;
margin-bottom: 80px;
}
.value-card {
background: #fff;
padding: 40px 30px;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
text-align: center;
transition: all 0.3s ease;
height: 100%;
}
.value-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(255,107,53,0.1);
border-color: rgba(255,107,53,0.2);
}
.value-icon {
width: 70px;
height: 70px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 32px;
margin: 0 auto 20px auto;
}
.value-card h4 {
color: #061122;
font-weight: 700;
font-size: 20px;
margin-bottom: 15px;
}
.value-card p {
color: #6c757d;
font-size: 14.5px;
line-height: 1.6;
margin: 0;
}
.services-grid-section {
background: #061122;
border-radius: 20px;
padding: 60px;
color: #fff;
margin-top: 40px;
position: relative;
overflow: hidden;
}
.services-grid-section::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(255,107,53,0.1) 0%, rgba(6,17,34,0) 70%);
border-radius: 50%;
}
.services-title {
color: #fff;
font-weight: 700;
font-size: 32px;
margin-bottom: 40px;
position: relative;
z-index: 1;
}
.services-title::after {
content: '';
display: block;
width: 50px;
height: 3px;
background: #ff6b35;
margin-top: 15px;
}
.premium-list {
list-style: none;
padding: 0;
margin: 0;
position: relative;
z-index: 1;
}
.premium-list li {
font-size: 16px;
color: #b0c4de;
padding: 12px 0;
border-bottom: 1px solid rgba(255,255,255,0.05);
display: flex;
align-items: center;
}
.premium-list li:last-child {
border-bottom: none;
}
.premium-list li i {
color: #ff6b35;
font-size: 20px;
margin-right: 15px;
}
.corp-cta {
margin-top: 60px;
text-align: center;
padding: 40px;
background: rgba(255,107,53,0.05);
border-radius: 15px;
border: 1px solid rgba(255,107,53,0.1);
}
.corp-cta h5 {
color: #061122;
font-weight: 700;
font-size: 22px;
margin-bottom: 10px;
}
.corp-cta p {
color: #6c757d;
margin-bottom: 25px;
}
.btn-premium-solid {
background: linear-gradient(90deg, #ff6b35 0%, #e85a24 100%);
color: #fff;
padding: 12px 30px;
border-radius: 50px;
font-weight: 600;
text-decoration: none;
display: inline-block;
transition: all 0.3s;
box-shadow: 0 4px 15px rgba(255, 107, 53, 0.4);
}
.btn-premium-solid:hover {
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(255, 107, 53, 0.5);
color: #fff;
}
@media (max-width: 991px) {
.corp-title { font-size: 32px; }
.services-grid-section { padding: 40px 20px; }
.value-card { margin-bottom: 30px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #fdfdfd;
}
.contact-hero {
background: linear-gradient(135deg, #061122 0%, #1a365d 100%);
padding: 80px 0;
text-align: center;
color: #fff;
position: relative;
overflow: hidden;
}
.contact-hero::after {
content: '\F3E8';
font-family: 'bootstrap-icons';
position: absolute;
right: -20px;
bottom: -60px;
font-size: 250px;
color: rgba(255,255,255,0.03);
line-height: 1;
pointer-events: none;
}
.contact-hero h1 {
font-size: 46px;
font-weight: 800;
margin-bottom: 20px;
position: relative;
z-index: 2;
}
.contact-hero p {
font-size: 18px;
color: rgba(255,255,255,0.8);
max-width: 700px;
margin: 0 auto;
position: relative;
z-index: 2;
line-height: 1.7;
}
.hero-divider {
width: 60px;
height: 4px;
background: #ff6b35;
margin: 30px auto 0 auto;
border-radius: 2px;
position: relative;
z-index: 2;
}
.contact-info-section {
padding: 80px 0 60px 0;
position: relative;
z-index: 3;
margin-top: -60px;
}
.contact-card-box {
background: #fff;
border-radius: 20px;
padding: 40px 30px;
text-align: center;
box-shadow: 0 15px 40px rgba(0,0,0,0.06);
border: 1px solid rgba(0,0,0,0.02);
transition: all 0.4s ease;
height: 100%;
position: relative;
overflow: hidden;
}
.contact-card-box::before {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background: #061122;
transition: all 0.4s;
}
.contact-card-box:hover {
transform: translateY(-8px);
box-shadow: 0 20px 50px rgba(0,0,0,0.1);
}
.contact-card-box:hover::before {
background: #ff6b35;
}
.icon-wrapper {
width: 80px;
height: 80px;
background: rgba(255,107,53,0.1);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 25px auto;
transition: all 0.4s;
}
.contact-card-box:hover .icon-wrapper {
background: #ff6b35;
transform: scale(1.1);
}
.icon-wrapper i {
font-size: 32px;
color: #ff6b35;
transition: all 0.4s;
}
.contact-card-box:hover .icon-wrapper i {
color: #fff;
}
.contact-card-box h3 {
font-size: 22px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.contact-card-box p {
font-size: 16px;
color: #6c757d;
line-height: 1.7;
margin: 0;
}
.contact-card-box a {
color: #061122;
font-weight: 700;
text-decoration: none;
transition: color 0.3s;
display: inline-block;
font-size: 18px;
margin-top: 5px;
}
.contact-card-box a:hover {
color: #ff6b35;
}
.map-section {
padding-bottom: 80px;
}
.map-container {
background: #fff;
padding: 15px;
border-radius: 25px;
box-shadow: 0 15px 50px rgba(0,0,0,0.06);
position: relative;
}
.map-container iframe {
border-radius: 15px;
width: 100%;
height: 500px;
filter: grayscale(20%) contrast(1.1) brightness(1.05);
transition: filter 0.5s;
}
.map-container iframe:hover {
filter: none;
}
.map-badge {
position: absolute;
top: 35px;
right: 45px;
background: #061122;
color: #fff;
padding: 10px 25px;
border-radius: 50px;
font-weight: 800;
font-size: 15px;
box-shadow: 0 10px 20px rgba(6,17,34,0.3);
z-index: 10;
display: flex;
align-items: center;
pointer-events: none;
}
.map-badge i {
color: #ff6b35;
margin-right: 10px;
font-size: 20px;
}
@media(max-width: 768px){
.contact-info-section { margin-top: 0; padding-top: 60px; }
.map-container { padding: 10px; border-radius: 15px; }
.map-container iframe { height: 350px; }
.map-badge { top: 20px; right: 20px; padding: 8px 15px; font-size: 13px; }
}
body { font-family: 'Outfit', sans-serif; background-color: #f8fafc; color: #334155; }
.privacy-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(26,54,93,0.85) 100%), url('../../img/hero_villa_sunset.png');
background-size: cover;
background-position: center;
padding: 100px 0 120px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: -60px;
position: relative;
z-index: 1;
}
.privacy-hero span {
display: inline-block;
background: rgba(255,107,53,0.15);
color: #ff6b35;
padding: 6px 18px;
border-radius: 50px;
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 1px;
margin-bottom: 20px;
}
.privacy-hero h1 { font-size: 52px; font-weight: 800; letter-spacing: -2px; margin-bottom: 20px; }
.privacy-hero p { font-size: 19px; color: rgba(255,255,255,0.8); max-width: 700px; margin: 0 auto; line-height: 1.6; }
.privacy-content-wrap { padding: 120px 0 80px 0; }
.privacy-card {
background: #fff;
border-radius: 24px;
padding: 40px;
margin-bottom: 30px;
box-shadow: 0 15px 35px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: all 0.3s;
height: 100%;
}
.privacy-card:hover {
transform: translateY(-8px);
box-shadow: 0 25px 50px rgba(0,0,0,0.06);
border-color: rgba(255,107,53,0.2);
}
.privacy-card i {
width: 60px; height: 60px;
background: rgba(255,107,53,0.08);
color: #ff6b35;
border-radius: 15px;
display: flex; align-items: center; justify-content: center;
font-size: 24px; margin-bottom: 25px;
}
.privacy-card h2 { font-size: 22px; font-weight: 800; color: #061122; margin-bottom: 15px; }
.privacy-card p { font-size: 15.5px; color: #64748b; line-height: 1.7; margin: 0; }
.trust-banner {
background: #fff;
border-radius: 30px;
padding: 50px;
margin-top: 50px;
border: 1px solid #edf2f7;
text-align: center;
}
.trust-banner h3 { font-size: 24px; font-weight: 800; color: #061122; margin-bottom: 15px; }
.trust-banner p { color: #64748b; max-width: 800px; margin: 0 auto; }
@media (max-width: 768px) {
.privacy-hero h1 { font-size: 34px; }
.privacy-hero { padding: 80px 0 100px 0; }
.privacy-card { padding: 30px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #fdfdfd;
}
.edu-hero-section {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(26,54,93,0.85) 100%), url('../../images/slider-background-3.webp');
background-size: cover;
background-position: center;
padding: 120px 0 100px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: 60px;
position: relative;
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.edu-hero-section h1 {
font-size: 50px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -1px;
}
.edu-hero-section p {
font-size: 20px;
color: rgba(255,255,255,0.85);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.premium-section-title {
text-align: center;
margin-bottom: 50px;
}
.premium-section-title h2 {
font-size: 36px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
position: relative;
display: inline-block;
}
.premium-section-title h2::after {
content: ''; position: absolute; width: 60px; height: 4px;
background: #ff6b35; bottom: -15px; left: 50%; transform: translateX(-50%); border-radius: 2px;
}
.premium-section-title p {
font-size: 18px; color: #6c757d; max-width: 700px; margin: 25px auto 0 auto;
}
.edu-info-card {
background: #fff;
padding: 40px;
border-radius: 20px;
box-shadow: 0 15px 40px rgba(0,0,0,0.04);
border: 1px solid rgba(0,0,0,0.02);
height: 100%;
transition: all 0.3s;
}
.edu-info-card:hover {
box-shadow: 0 20px 50px rgba(255,107,53,0.08);
transform: translateY(-5px);
border-color: rgba(255,107,53,0.3);
}
.edu-info-card .icon-wrap {
width: 60px; height: 60px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 15px;
display: flex; align-items: center; justify-content: center;
font-size: 28px; margin-bottom: 20px;
}
.edu-info-card h3 {
font-size: 22px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
}
.edu-info-card p, .edu-info-card ul {
font-size: 16px;
line-height: 1.8;
color: #4b5563;
}
.edu-info-card ul {
padding-left: 20px;
}
.edu-info-card ul li {
margin-bottom: 10px;
}
.curriculum-wrap {
background: #fff;
padding: 50px;
border-radius: 20px;
box-shadow: 0 15px 40px rgba(0,0,0,0.04);
border: 1px solid rgba(0,0,0,0.02);
margin-bottom: 60px;
}
.curr-week {
margin-bottom: 30px;
padding-bottom: 30px;
border-bottom: 1px dashed #edf2f7;
}
.curr-week:last-child {
margin-bottom: 0; padding-bottom: 0; border-bottom: none;
}
.curr-week h4 {
font-size: 20px;
font-weight: 800;
color: #ff6b35;
margin-bottom: 15px;
display: flex;
align-items: center;
}
.curr-week h4 i { margin-right: 10px; font-size: 24px; color: #061122; }
.curr-week-content {
font-size: 16px;
color: #4b5563;
line-height: 1.8;
}
.lux-bottom-cta {
background-size: cover; background-position: center; border-radius: 0 !important; overflow: hidden; position: relative; padding: 80px 40px; margin: 60px 0; text-align: center; box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.lux-bottom-cta::before {
content: ''; position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(6,17,34,0.8) 100%); z-index: 1;
}
.lux-bottom-cta-content {
position: relative; z-index: 2; color: #fff;
}
.lux-bottom-cta h2 { font-size: 32px; font-weight: 800; margin-bottom: 15px; }
.lux-bottom-cta h2 b { color: #ff6b35; }
.lux-bottom-cta p { font-size: 18px; color: rgba(255,255,255,0.8); margin-bottom: 30px; }
.lux-bottom-btn {
background: #ff6b35; color: #fff; padding: 16px 35px; border-radius: 50px; font-weight: 800; text-decoration: none; display: inline-block; transition: all 0.3s; font-size: 16px;
}
.lux-bottom-btn:hover { background: #e85a24; color: #fff; transform: scale(1.05); }
body {
font-family: 'Outfit', sans-serif;
background-color: #fdfdfd;
}
.franchise-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(26,54,93,0.85) 100%), url('../../images/slider-background-3.webp');
background-size: cover;
background-position: center;
padding: 120px 0 100px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: 60px;
position: relative;
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.franchise-hero h1 {
font-size: 50px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -1px;
}
.franchise-hero p {
font-size: 20px;
color: rgba(255,255,255,0.85);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.premium-section-title {
text-align: center;
margin-bottom: 50px;
}
.premium-section-title h2 {
font-size: 36px;
font-weight: 800;
color: #061122;
margin-bottom: 15px;
position: relative;
display: inline-block;
}
.premium-section-title h2::after {
content: ''; position: absolute; width: 60px; height: 4px;
background: #ff6b35; bottom: -15px; left: 50%; transform: translateX(-50%); border-radius: 2px;
}
.premium-section-title p {
font-size: 18px; color: #6c757d; max-width: 700px; margin: 25px auto 0 auto;
}
.franchise-card {
background: #fff;
padding: 35px 30px;
border-radius: 20px;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.02);
height: 100%;
transition: all 0.3s;
position: relative;
overflow: hidden;
}
.franchise-card:hover {
box-shadow: 0 15px 40px rgba(255,107,53,0.08);
transform: translateY(-5px);
border-color: rgba(255,107,53,0.3);
}
.franchise-card .icon-wrap {
width: 60px; height: 60px;
background: rgba(255,107,53,0.1);
color: #ff6b35;
border-radius: 15px;
display: flex; align-items: center; justify-content: center;
font-size: 28px; margin-bottom: 20px;
}
.franchise-card h3 {
font-size: 22px;
font-weight: 800;
color: #061122;
margin-bottom: 20px;
}
.detail-list {
list-style: none; padding: 0; margin: 0;
}
.detail-list li {
padding: 12px 0;
border-bottom: 1px dashed #edf2f7;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 15px;
}
.detail-list li:last-child { border-bottom: none; padding-bottom: 0; }
.detail-list li span.label {
font-weight: 700; color: #4b5563;
}
.detail-list li span.value {
color: #ff6b35; font-weight: 800; text-align: right;
}
.check-list {
list-style: none; padding: 0; margin: 0;
}
.check-list li {
padding: 8px 0;
color: #6c757d;
font-size: 15px;
display: flex;
align-items: flex-start;
}
.check-list li i {
color: #ff6b35;
margin-right: 12px;
font-size: 18px;
margin-top: 2px;
}
.support-section {
background: #061122;
border-radius: 30px;
padding: 60px;
color: #fff;
margin-top: 40px;
position: relative;
overflow: hidden;
}
.support-section::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 400px;
height: 400px;
background: radial-gradient(circle, rgba(255,107,53,0.15) 0%, rgba(6,17,34,0) 70%);
border-radius: 50%;
}
.support-title {
color: #fff;
font-weight: 800;
font-size: 32px;
margin-bottom: 30px;
position: relative;
z-index: 1;
}
.support-title::after {
content: ''; display: block; width: 50px; height: 3px; background: #ff6b35; margin-top: 15px;
}
.support-item {
margin-bottom: 25px;
position: relative;
z-index: 1;
}
.support-item h5 {
font-size: 18px; font-weight: 700; color: #ff6b35; margin-bottom: 8px;
}
.support-item p {
font-size: 15px; color: #b0c4de; line-height: 1.6; margin: 0;
}
.lux-bottom-cta {
background-size: cover; background-position: center; border-radius: 0 !important; overflow: hidden; position: relative; padding: 80px 40px; margin: 60px 0; text-align: center; box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}
.lux-bottom-cta::before {
content: ''; position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(6,17,34,0.8) 100%); z-index: 1;
}
.lux-bottom-cta-content {
position: relative; z-index: 2; color: #fff;
}
.lux-bottom-cta h2 { font-size: 32px; font-weight: 800; margin-bottom: 15px; }
.lux-bottom-cta h2 b { color: #ff6b35; }
.lux-bottom-cta p { font-size: 18px; color: rgba(255,255,255,0.8); margin-bottom: 30px; }
.lux-bottom-btn {
background: #ff6b35; color: #fff; padding: 16px 35px; border-radius: 50px; font-weight: 800; text-decoration: none; display: inline-block; transition: all 0.3s; font-size: 16px; border: 2px solid #ff6b35;
}
.lux-bottom-btn:hover { background: transparent; color: #ff6b35; transform: scale(1.05); border-color: #ff6b35; }
@media (max-width: 991px) {
.support-section { padding: 40px 20px; }
}
body {
font-family: 'Outfit', sans-serif;
background-color: #f8fafc;
}
.lux-discovery-hero {
background: linear-gradient(135deg, rgba(6,17,34,0.92) 0%, rgba(26,54,93,0.85) 100%), url('../../img/hero_villa_sunset.png');
background-size: cover;
background-position: center;
padding: 120px 0 100px 0;
text-align: center;
color: #fff;
border-radius: 0 !important;
margin-bottom: -40px;
position: relative;
z-index: 10;
}
.lux-discovery-hero h1 {
font-size: 56px;
font-weight: 800;
margin-bottom: 20px;
letter-spacing: -2px;
}
.lux-discovery-hero p {
font-size: 21px;
color: rgba(255,255,255,0.85);
max-width: 800px;
margin: 0 auto;
line-height: 1.6;
}
.lux-hub-title {
text-align: center;
margin-bottom: 50px;
position: relative;
}
.lux-hub-title h2 {
font-size: 32px;
font-weight: 800;
color: #061122;
margin-bottom: 10px;
}
.lux-hub-title p {
font-size: 16px;
color: #6c757d;
}
.lux-hub-title::after {
content: '';
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 50px;
height: 4px;
background: #ff6b35;
border-radius: 2px;
}
.lux-catalog-hub {
padding: 100px 0 60px 0;
}
.lux-cat-card {
background: #fff;
border-radius: 24px;
padding: 30px;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
box-shadow: 0 10px 30px rgba(0,0,0,0.03);
border: 1px solid rgba(0,0,0,0.04);
transition: all 0.4s ease;
}
.lux-cat-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 50px rgba(255,107,53,0.1);
border-color: rgba(255,107,53,0.2);
}
.lux-cat-icon {
width: 65px; height: 65px;
background: rgba(255,107,53,0.08);
color: #ff6b35;
border-radius: 18px;
display: flex; align-items: center; justify-content: center;
font-size: 28px; margin-bottom: 20px;
}
.lux-cat-title { font-size: 19px; font-weight: 800; color: #061122; margin-bottom: 8px; }
.lux-cat-count { font-size: 13px; color: #6c757d; font-weight: 600; background: #f1f5f9; padding: 3px 12px; border-radius: 50px; margin-bottom: 20px; }
.lux-hub-btn {
width: 100%; padding: 12px; border-radius: 12px; font-weight: 700; font-size: 13px; text-transform: uppercase; transition: all 0.3s; text-decoration: none !important; margin-top: auto;
}
.btn-hub-view { background: #f8fafc; color: #061122; border: 1px solid #e2e8f0; margin-bottom: 8px; }
.btn-hub-view:hover { background: #061122; color: #fff; }
.btn-hub-pdf { background: #ff6b35; color: #fff; border: none; }
.btn-hub-pdf:hover { background: #e85a24; transform: scale(1.02); }
.lux-tags-hub {
padding: 80px 0;
background: rgba(255,107,53,0.02);
}
.lux-glass-cloud {
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(15px);
border-radius: 40px;
padding: 60px 40px;
border: 1px solid rgba(255, 255, 255, 0.5);
box-shadow: 0 20px 60px rgba(0,0,0,0.05);
}
.lux-tag-item {
background: #fff;
padding: 10px 20px;
border-radius: 50px;
color: #4a5568;
font-size: 14px;
font-weight: 600;
text-decoration: none !important;
border: 1px solid #edf2f7;
margin: 6px;
display: inline-block;
transition: all 0.3s;
}
.lux-tag-item:hover {
background: #ff6b35; color: #fff; border-color: #ff6b35; transform: translateY(-3px); box-shadow: 0 10px 20px rgba(255,107,53,0.2);
}
.lux-tag-item span { font-size: 10px; opacity: 0.6; margin-left: 5px; background: rgba(0,0,0,0.05); padding: 1px 6px; border-radius: 8px; }
.lux-popular-hub {
padding: 80px 0 100px 0;
}
.btn-all-projects {
background: transparent; border: 2px solid #ff6b35; color: #ff6b35; padding: 15px 40px; border-radius: 50px; font-weight: 800; text-decoration: none; display: inline-block; transition: all 0.3s;
}
.btn-all-projects:hover { background: #ff6b35; color: #fff; box-shadow: 0 15px 30px rgba(255,107,53,0.3); }
.lux-hub-cta {
background: #061122; border-radius: 40px; padding: 80px 40px; color: #fff; text-align: center; margin-bottom: 80px; position: relative; overflow: hidden;
}
.hub-cta-btn { background: #ff6b35; color: #fff; padding: 16px 45px; border-radius: 50px; font-weight: 700; text-decoration: none; font-size: 18px; display: inline-block; transition: all 0.3s; box-shadow: 0 15px 30px rgba(255,107,53,0.3); }
.hub-cta-btn:hover { background: #e85a24; transform: translateY(-5px); }
@media (max-width: 768px) {
.lux-discovery-hero h1 { font-size: 34px; }
.lux-discovery-hero p { font-size: 16px; }
.lux-hub-cta, .lux-glass-cloud { border-radius: 20px; padding: 40px 20px; }
}
.homepage-filter-overlay {
position: relative;
margin-top: -120px;
z-index: 99999;
padding: 0 15px;
pointer-events: auto;
}
.hp-lux-filter-glass-box {
background: rgba(255, 255, 255, 0.15);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 20px;
padding: 25px;
max-width: 1100px;
margin: 0 auto;
box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}
.hp-lux-filter-row { display: flex; gap: 15px; align-items: flex-end; }
.hp-lux-filter-group { flex: 1; text-align: left; }
.hp-lux-filter-group label {
display: block; font-size: 13px; font-weight: 800; color: #fff !important;
margin-bottom: 8px; text-transform: uppercase; letter-spacing: 1px;
text-shadow: 0 2px 5px rgba(0,0,0,0.8);
}
.hp-lux-filter-control {
width: 100%; height: 52px; background: rgba(255,255,255,0.95) !important; border: 1px solid transparent; border-radius: 12px;
padding: 0 20px; font-size: 15px; color: #061122 !important; font-weight: 700;
outline: none; transition: all 0.3s; opacity: 1 !important;
appearance: none; cursor: pointer;
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff6b35' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
background-repeat: no-repeat !important; background-position: right 15px center !important; background-size: 16px !important;
box-shadow: 0 2px 5px rgba(0,0,0,0.1) !important;
}
.hp-lux-filter-control:focus { background: #fff !important; box-shadow: 0 0 0 4px rgba(255,107,53,0.3) !important; }
.hp-lux-filter-btn {
background: #ff6b35 !important; color: #fff !important; border: none; border-radius: 12px;
padding: 0 30px; font-size: 15px; font-weight: 800; cursor: pointer; opacity: 1 !important;
transition: all 0.3s; height: 52px; text-transform: uppercase; letter-spacing: 1px;
box-shadow: 0 10px 20px rgba(255,107,53,0.3) !important; width: 100%;
display: flex; align-items: center; justify-content: center;
}
.hp-lux-filter-btn:hover { background: #e85a24 !important; transform: translateY(-2px); box-shadow: 0 15px 30px rgba(255,107,53,0.4) !important; }
@media(max-width: 991px) {
.homepage-filter-overlay { position: relative; bottom: auto; margin-top: -60px; z-index: 99999; padding: 0 20px; }
.hp-lux-filter-row { flex-direction: column; align-items: stretch; gap: 12px; }
.hp-lux-filter-glass-box { padding: 20px; background: linear-gradient(135deg, rgba(6,17,34,0.95) 0%, rgba(26,54,93,0.95) 100%); border:none; box-shadow: 0 10px 30px rgba(0,0,0,0.15); }
.hp-lux-filter-group label { text-shadow: none; color: rgba(255,255,255,0.8) !important; }
}
.related-posts-section {
padding: 70px 0;
background: #fcfcfc;
border-top: 1px solid rgba(0,0,0,0.03);
}
.related-section-title {
margin-bottom: 40px;
text-align: center;
}
.related-section-title h2 {
font-size: 32px;
font-weight: 800;
color: #061122;
display: inline-block;
position: relative;
}
.related-section-title h2::after {
content: '';
position: absolute;
width: 40px;
height: 4px;
background: #ff6b35;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
border-radius: 2px;
}
.rel-blog-card {
background: #fff;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0,0,0,0.04);
transition: all 0.4s ease;
border: 1px solid rgba(0,0,0,0.02);
height: 100%;
display: flex;
flex-direction: column;
}
.rel-blog-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 40px rgba(0,0,0,0.08);
}
.rel-blog-img {
aspect-ratio: 16/10;
overflow: hidden;
}
.rel-blog-img img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.6s ease;
}
.rel-blog-card:hover .rel-blog-img img {
transform: scale(1.05);
}
.rel-blog-content {
padding: 25px;
display: flex;
flex-direction: column;
flex-grow: 1;
}
.rel-blog-title {
font-size: 19px;
font-weight: 800;
line-height: 1.4;
margin-bottom: 12px;
}
.rel-blog-title a {
color: #061122;
text-decoration: none;
transition: color 0.3s;
}
.rel-blog-title a:hover {
color: #ff6b35;
}
.rel-blog-excerpt {
color: #6c757d;
font-size: 14.5px;
line-height: 1.6;
margin-bottom: 20px;
flex-grow: 1;
}
.rel-blog-btn {
color: #ff6b35;
font-weight: 700;
font-size: 14px;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0.5px;
transition: all 0.3s;
align-self: flex-start;
display: inline-flex;
align-items: center;
}
.rel-blog-btn i {
margin-left: 6px;
font-size: 16px;
transition: transform 0.3s;
}
.rel-blog-card:hover .rel-blog-btn i {
transform: translateX(5px);
color: #e85a24;
}
.premium-accordion-section {
padding: 60px 0;
background-color: #fdfdfd;
}
.premium-accordion-title {
text-align: center;
margin-bottom: 50px;
}
.premium-accordion-title h2 {
font-size: 32px;
font-weight: 800;
color: #061122;
font-family: 'Outfit', sans-serif;
position: relative;
padding-bottom: 15px;
}
.premium-accordion-title h2::after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 3px;
background: #ff6b35;
border-radius: 2px;
}
.premium-accordion {
max-width: 900px;
margin: 0 auto;
}
.premium-accordion .accordion-item {
background: #fff;
border: none;
border-radius: 12px !important;
margin-bottom: 20px;
box-shadow: 0 5px 25px rgba(0,0,0,0.04);
overflow: hidden;
transition: all 0.4s ease;
}
.premium-accordion .accordion-item:hover {
box-shadow: 0 10px 35px rgba(0,0,0,0.08);
}
.premium-accordion .accordion-button {
font-size: 17.5px;
font-weight: 600;
font-family: 'Outfit', sans-serif;
color: #061122;
background-color: #fff;
padding: 22px 30px;
box-shadow: none !important;
border: none;
border-left: 5px solid transparent;
transition: all 0.3s ease;
}
.premium-accordion .accordion-button:not(.collapsed) {
color: #ff6b35;
background-color: rgba(255, 107, 53, 0.03);
border-left: 5px solid #ff6b35;
}
.premium-accordion .accordion-button:not(.collapsed)::after {
filter: invert(53%) sepia(85%) saturate(2469%) hue-rotate(345deg) brightness(103%) contrast(101%);
}
.premium-accordion .accordion-body {
padding: 35px 30px;
font-size: 15.5px;
line-height: 1.8;
color: #4b5563;
background-color: #fff;
border-top: 1px solid rgba(0,0,0,0.04);
}
.premium-accordion .accordion-body h3,
.premium-accordion .accordion-body h4 {
color: #061122;
font-family: 'Outfit', sans-serif;
font-weight: 700;
margin-bottom: 15px;
}
.premium-accordion .accordion-body p {
margin-bottom: 15px;
}
:root {
--evp-accent: #ff6b35;
--evp-gold: #c8a97e;
--evp-dark: #0b1b36;
--evp-glass: rgba(255, 255, 255, 0.05);
}
.evp-ui-container {
font-family: 'Outfit', 'Poppins', sans-serif;
box-sizing: border-box;
}
.evp-desktop-banner {
position: relative;
width: 100%;
margin: 0;
padding: 60px 0;
background-color: #f7f9fa;
border-top: 1px solid #eaeaea;
border-bottom: 1px solid #eaeaea;
z-index: 10;
overflow: hidden;
}
.evp-desktop-banner::before {
content: '';
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
background-image: linear-gradient(rgba(11, 27, 54, 0.03) 1px, transparent 1px),
linear-gradient(90deg, rgba(11, 27, 54, 0.03) 1px, transparent 1px);
background-size: 30px 30px;
pointer-events: none;
}
.evp-banner-inner {
position: relative;
max-width: 1200px;
margin: 0 auto;
padding: 45px 50px;
background: linear-gradient(135deg, #0b1b36 0%, #1a3253 100%);
border-radius: 20px;
box-shadow: 0 30px 60px -15px rgba(11, 27, 54, 0.4);
display: flex;
align-items: center;
gap: 40px;
color: white;
overflow: hidden;
}
.evp-banner-inner::after {
content: '';
position: absolute;
top: -50%; left: -20%;
width: 50%; height: 200%;
background: radial-gradient(circle, rgba(200, 169, 126, 0.15) 0%, transparent 70%);
transform: rotate(30deg);
pointer-events: none;
}
.evp-banner-content {
flex: 1;
z-index: 2;
}
.evp-banner-content h2 {
margin: 0 0 12px 0;
font-size: 32px;
font-weight: 800;
letter-spacing: -0.5px;
line-height: 1.2;
}
.evp-banner-content h2 span {
color: var(--evp-gold);
background: linear-gradient(90deg, #e2ccaa, #c8a97e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: block;
margin-top: 4px;
}
.evp-banner-content p {
margin: 0;
color: #b0c4de;
font-size: 16px;
line-height: 1.6;
max-width: 90%;
}
.evp-banner-action {
z-index: 2;
display: flex;
flex-direction: column;
align-items: flex-end;
}
.evp-banner-action .btn-evp {
display: inline-flex;
align-items: center;
padding: 18px 36px;
background: linear-gradient(90deg, #ff6b35, #ff8255);
color: white !important;
text-decoration: none;
border-radius: 12px;
font-weight: 700;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 1px;
transition: all 0.3s ease;
box-shadow: 0 10px 20px rgba(255, 107, 53, 0.3), inset 0 2px 0 rgba(255,255,255,0.2);
}
.evp-banner-action .btn-evp:hover {
transform: translateY(-4px);
box-shadow: 0 15px 30px rgba(255, 107, 53, 0.4), inset 0 2px 0 rgba(255,255,255,0.2);
}
.evp-action-note {
margin-top: 12px;
font-size: 13px;
color: rgba(255,255,255,0.6);
font-weight: 400;
}
@media (max-width: 991px) {
.evp-desktop-banner { display: none; }
}
.evp-premium-banner {
box-sizing: border-box;
font-family: 'Inter', 'Poppins', sans-serif;
background: url('data:image/svg+xml;utf8,') center center, linear-gradient(145deg, #0b1b36 0%, #17345b 100%);
background-blend-mode: overlay;
border-radius: 16px;
padding: 32px 24px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 24px;
box-shadow: 0 20px 40px rgba(11, 27, 54, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.08);
position: relative;
overflow: hidden;
margin: 40px 0;
width: 100%;
color: #ffffff;
transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.5s ease;
}
.evp-premium-banner::before {
content: '';
position: absolute;
top: -40%;
left: -20%;
width: 60%;
height: 150%;
background: radial-gradient(ellipse at center, rgba(30, 115, 190, 0.25) 0%, transparent 60%);
transform: rotate(-45deg);
pointer-events: none;
}
.evp-premium-banner::after {
content: '';
position: absolute;
bottom: -20%;
right: -10%;
width: 50%;
height: 100%;
background: radial-gradient(circle, rgba(200, 169, 126, 0.15) 0%, transparent 60%);
pointer-events: none;
}
.evp-premium-banner:hover {
transform: translateY(-5px);
box-shadow: 0 30px 60px rgba(11, 27, 54, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.15);
border-color: rgba(255, 255, 255, 0.15);
}
.evp-premium-icon {
flex-shrink: 0;
width: 72px;
height: 72px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 24px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), inset 0 2px 0 rgba(255, 255, 255, 0.05);
position: relative;
z-index: 2;
margin: 0 auto;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.evp-premium-icon svg {
width: 34px;
height: 34px;
filter: drop-shadow(0 4px 6px rgba(200, 169, 126, 0.2));
transition: transform 0.4s ease;
}
.evp-premium-banner:hover .evp-premium-icon svg {
transform: scale(1.1);
}
.evp-premium-body {
flex-grow: 1;
z-index: 2;
}
.evp-premium-body h3 {
margin: 0 0 12px 0;
font-size: 22px;
font-weight: 800;
color: #ffffff;
line-height: 1.25;
letter-spacing: -0.5px;
text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.evp-premium-body h3 span.evp-highlight-gold {
color: #c8a97e;
background: linear-gradient(to right, #e2ccaa, #c8a97e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
.evp-premium-body p {
margin: 0;
font-size: 14.5px;
color: #b0c4de;
line-height: 1.6;
font-weight: 300;
}
.evp-premium-body p strong {
color: #ffffff;
font-weight: 500;
letter-spacing: 0.2px;
}
.evp-premium-action {
width: 100%;
z-index: 2;
position: relative;
}
.evp-btn-premium {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 16px 24px;
background: linear-gradient(90deg, #d32f2f 0%, #e53935 100%);
color: #ffffff !important;
font-size: 15px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
text-decoration: none;
border-radius: 12px;
transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
box-shadow: 0 10px 20px rgba(229, 57, 53, 0.25), inset 0 2px 0 rgba(255, 255, 255, 0.15);
border: none;
overflow: hidden;
position: relative;
}
.evp-btn-premium::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 50%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
transform: skewX(-20deg);
transition: 0.6s;
}
.evp-btn-premium:hover {
box-shadow: 0 15px 30px rgba(229, 57, 53, 0.35), inset 0 2px 0 rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.evp-btn-premium:hover::before {
left: 200%;
}
.evp-btn-premium svg {
margin-left: 12px;
width: 18px;
height: 18px;
transition: transform 0.3s ease;
}
.evp-btn-premium:hover svg {
transform: translateX(6px);
}
@media (min-width: 768px) {
.evp-premium-banner {
flex-direction: row;
text-align: left;
padding: 40px 48px;
gap: 36px;
border-radius: 20px;
}
.evp-premium-icon {
width: 88px;
height: 88px;
margin: 0;
border-radius: 28px;
}
.evp-premium-icon svg {
width: 42px;
height: 42px;
}
.evp-premium-body h3 {
font-size: 26px;
margin: 0 0 10px 0;
}
.evp-premium-body p {
font-size: 16px;
max-width: 90%;
}
.evp-premium-action {
width: auto;
flex-shrink: 0;
padding-left: 20px;
border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.evp-btn-premium {
display: inline-flex;
width: auto;
padding: 18px 36px;
font-size: 16px;
}
.evp-btn-premium svg {
width: 20px;
height: 20px;
}
}
@media (min-width: 1200px) {
.evp-premium-body h3 {
font-size: 28px;
}
.evp-premium-body p {
font-size: 17px;
}
}
.evp-payment-banner {
box-sizing: border-box;
font-family: 'Inter', 'Poppins', sans-serif;
background: url('data:image/svg+xml;utf8,') center center, linear-gradient(145deg, #0f172a 0%, #1e293b 100%);
background-blend-mode: overlay;
border-radius: 16px;
padding: 32px 24px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 24px;
box-shadow: 0 20px 40px rgba(15, 23, 42, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.08);
position: relative;
overflow: hidden;
margin: 40px 0;
width: 100%;
color: #ffffff;
transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.5s ease;
}
.evp-payment-banner::before {
content: '';
position: absolute;
top: -50%;
left: -20%;
width: 70%;
height: 150%;
background: radial-gradient(ellipse at center, rgba(16, 185, 129, 0.15) 0%, transparent 60%);
transform: rotate(-45deg);
pointer-events: none;
}
.evp-payment-banner::after {
content: '';
position: absolute;
bottom: -20%;
right: -10%;
width: 50%;
height: 100%;
background: radial-gradient(circle, rgba(200, 169, 126, 0.1) 0%, transparent 60%);
pointer-events: none;
}
.evp-payment-banner:hover {
transform: translateY(-5px);
box-shadow: 0 30px 60px rgba(15, 23, 42, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.15);
}
.evp-payment-icon {
flex-shrink: 0;
width: 72px;
height: 72px;
background: rgba(255, 255, 255, 0.03);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 24px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3), inset 0 2px 0 rgba(255, 255, 255, 0.05);
position: relative;
z-index: 2;
margin: 0 auto;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}
.evp-payment-icon svg {
width: 34px;
height: 34px;
filter: drop-shadow(0 4px 6px rgba(16, 185, 129, 0.3));
transition: transform 0.4s ease;
}
.evp-payment-banner:hover .evp-payment-icon svg {
transform: scale(1.1) rotate(3deg);
}
.evp-payment-body {
flex-grow: 1;
z-index: 2;
}
.evp-payment-body h3 {
margin: 0 0 12px 0;
font-size: 22px;
font-weight: 800;
color: #ffffff;
line-height: 1.25;
letter-spacing: -0.5px;
text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}
.evp-payment-body h3 span.evp-highlight-green {
color: #10b981;
background: linear-gradient(to right, #34d399, #10b981);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
.evp-payment-body h3 span.evp-highlight-gold {
color: #c8a97e;
background: linear-gradient(to right, #e2ccaa, #c8a97e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
display: inline-block;
}
.evp-payment-body p {
margin: 0;
font-size: 14.5px;
color: #cbd5e1;
line-height: 1.6;
font-weight: 300;
}
.evp-payment-body p strong {
color: #ffffff;
font-weight: 500;
letter-spacing: 0.2px;
}
.evp-payment-action {
width: 100%;
z-index: 2;
position: relative;
}
.evp-btn-payment {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 16px 24px;
background: linear-gradient(90deg, #0f766e 0%, #059669 100%);
color: #ffffff !important;
font-size: 15px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
text-decoration: none;
border-radius: 12px;
transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
box-shadow: 0 10px 20px rgba(5, 150, 105, 0.25), inset 0 2px 0 rgba(255, 255, 255, 0.2);
border: none;
overflow: hidden;
position: relative;
}
.evp-btn-payment::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 50%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
transform: skewX(-20deg);
transition: 0.6s;
}
.evp-btn-payment:hover {
box-shadow: 0 15px 30px rgba(5, 150, 105, 0.4), inset 0 2px 0 rgba(255, 255, 255, 0.3);
transform: translateY(-2px);
}
.evp-btn-payment:hover::before {
left: 200%;
}
.evp-btn-payment svg {
margin-left: 12px;
width: 18px;
height: 18px;
transition: transform 0.3s ease;
}
.evp-btn-payment:hover svg {
transform: translateX(6px);
}
@media (min-width: 768px) {
.evp-payment-banner {
flex-direction: row;
text-align: left;
padding: 40px 48px;
gap: 36px;
border-radius: 20px;
}
.evp-payment-icon {
width: 88px;
height: 88px;
margin: 0;
border-radius: 28px;
}
.evp-payment-icon svg {
width: 42px;
height: 42px;
}
.evp-payment-body h3 {
font-size: 26px;
margin: 0 0 10px 0;
}
.evp-payment-body p {
font-size: 16px;
max-width: 90%;
}
.evp-payment-action {
width: auto;
flex-shrink: 0;
padding-left: 20px;
border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.evp-btn-payment {
display: inline-flex;
width: auto;
padding: 18px 36px;
font-size: 16px;
}
.evp-btn-payment svg {
width: 20px;
height: 20px;
}
}
@media (min-width: 1200px) {
.evp-payment-body h3 {
font-size: 28px;
}
.evp-payment-body p {
font-size: 17px;
}
}