:root { --bg-color: #2A2F2B; --card-bg: #343A35; --text-main: #EAE7E2; --text-muted: #949995; --gold: #B0935B; --border-color: rgba(255,255,255,0.1); } body { background-color: var(--bg-color); background-image: url("data:image/svg+xml,%3Csvg width='300' height='400' viewBox='0 0 300 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23B0935B' fill='none' stroke-width='2' opacity='0.2'%3E%3Cpath d='M300,0 Q200,50 150,100' stroke-width='3' /%3E%3Cline x1='150' y1='100' x2='150' y2='150' /%3E%3Cellipse cx='150' cy='200' rx='40' ry='50' /%3E%3Cpath d='M150,150 Q120,175 120,200 T150,250' /%3E%3Cpath d='M150,150 Q180,175 180,200 T150,250' /%3E%3Crect x='135' y='145' width='30' height='10' fill='%23B0935B' opacity='0.5' /%3E%3Crect x='135' y='245' width='30' height='10' fill='%23B0935B' opacity='0.5' /%3E%3Cline x1='150' y1='255' x2='150' y2='320' /%3E%3Cpath d='M150,255 Q140,280 145,310' /%3E%3Cpath d='M150,255 Q160,280 155,310' /%3E%3C/g%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-position: top right, top left; background-repeat: no-repeat, repeat; color: var(--text-main); font-family: 'Manrope', sans-serif; margin: 0; overflow-x: hidden; line-height: 1.5; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } img { pointer-events: none; } *, *::before, *::after { box-sizing: border-box; } .profile { text-align: center; padding: 120px 20px 40px; position: relative; max-width: 800px; margin: 0 auto; } .avatar { width: 120px; height: 120px; border-radius: 50%; border: 2px solid var(--gold); margin: 0 auto 25px; object-fit: cover; display: block; opacity: 0.9; } .main-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; color: var(--text-main); font-size: 48px; line-height: 1.1; margin: 0 0 15px; letter-spacing: 0.05em; text-transform: uppercase; } .description { font-family: 'Manrope', sans-serif; font-weight: 600; color: var(--gold); font-size: 13px; letter-spacing: 0.2em; text-transform: uppercase; margin: 0 0 20px; opacity: 1; } .slogan { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 400; color: var(--text-main); font-size: 20px; margin: 0; opacity: 1; } .header-divider { display: flex; align-items: center; justify-content: center; margin: 60px auto; width: 100%; max-width: 1200px; padding: 0 15px; box-sizing: border-box; color: var(--gold); opacity: 0.4; } .header-divider::before, .header-divider::after { content: ''; display: block; flex: 1; height: 1px; background: var(--gold); margin: 0 15px; opacity: 0.2; } .care-divider-line { width: auto; margin: 20px 20px; } .section-wrapper { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; } .main-grid { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; display: grid; grid-template-columns: 1fr; gap: 40px; } .service-card { background: var(--card-bg); border-radius: 2px; padding: 40px; text-align: center; box-shadow: none; border: none; border-top: 2px solid var(--gold); min-width: 0; position: relative; overflow: hidden; } .service-card::after, .care-card::after { content: ''; position: absolute; bottom: -30px; right: -40px; width: 150px; height: 150px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23B0935B' d='M21.52,8.54c-0.44-2.06-2.08-3.7-4.14-4.14C15.6,3.94,13.88,3.3,12,3.3c-1.88,0-3.6,0.64-5.38,1.1 C4.56,4.84,2.92,6.48,2.48,8.54C2.02,10.32,1.7,12,1.7,12s0.32,1.68,0.78,3.46c0.44,2.06,2.08,3.7,4.14,4.14 C8.4,20.06,10.12,20.7,12,20.7c1.88,0,3.6-0.64,5.38-1.1c2.06-0.44,3.7-2.08,4.14-4.14C21.98,13.68,22.3,12,22.3,12 S21.98,10.32,21.52,8.54z M12,19.3c-1.49,0-2.88-0.51-4.22-0.89c-1.55-0.33-2.8-1.58-3.13-3.13C4.26,13.72,4.05,12.5,4.05,12 c0-0.5,0.2-1.72,0.6-3.28c0.33-1.55,1.58-2.8,3.13-3.13C9.12,5.21,10.51,4.7,12,4.7c1.49,0,2.88,0.51,4.22,0.89 c1.55,0.33,2.8,1.58,3.13,3.13c0.39,1.56,0.6,2.78,0.6,3.28c0,0.5-0.2,1.72-0.6,3.28c-0.33,1.55-1.58,2.8-3.13,3.13 C14.88,18.79,13.49,19.3,12,19.3z'/%3E%3C/svg%3E"); background-repeat: no-repeat; opacity: 0.05; transform: rotate(-15deg); } .service-card:hover { transform: none; background: #3A403B; } .carousel-header { margin-bottom: 40px; padding: 0 30px; min-height: 90px; display: flex; align-items: center; justify-content: center; } .block-title { font-family: 'Manrope', sans-serif; font-weight: 600; color: var(--text-main); font-size: 14px; letter-spacing: 0.15em; text-transform: uppercase; margin-bottom: 0; border-bottom: 2px solid var(--gold); display: inline-block; padding-bottom: 10px; } .separator { display: none; } .swiper-container { width: 100%; max-width: 100%; margin: 0 auto; position: relative; } .swiper { width: 100%; padding: 0 !important; overflow: hidden !important; } .swiper-wrapper { display: flex; } .swiper-slide { width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 0; overflow: hidden; flex-shrink: 0; display: flex; justify-content: center; align-items: center; background: transparent; } .swiper-slide-active { } .swiper-slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; filter: none; transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1); transform: none; opacity: 1; filter: brightness(0.9); } .swiper-slide-active img { transform: none; filter: brightness(1); box-shadow: none; } .swiper-button-next, .swiper-button-prev { width: 45px !important; height: 45px !important; background: rgba(42, 47, 43, 0.8) !important; border: 1px solid var(--border-color) !important; border-radius: 0 !important; color: var(--gold) !important; top: 55% !important; transform: translateY(-50%) !important; z-index: 20; transition: all 0.3s ease; } .swiper-button-next::after, .swiper-button-prev::after { font-size: 18px !important; font-weight: bold !important; } .swiper-button-next { right: 20px !important; } .swiper-button-prev { left: 20px !important; } .swiper-button-next:hover, .swiper-button-prev:hover { background: var(--gold) !important; color: var(--bg-color) !important; border-color: var(--gold) !important; } .swiper-pagination-outer { margin-top: 20px; margin-bottom: 20px; display: flex; justify-content: center; align-items: center; } .swiper-pagination-bullet { width: 10px; height: 10px; background: var(--text-muted) !important; opacity: 0.2 !important; margin: 0 5px !important; } .swiper-pagination-bullet-active { background: var(--gold) !important; opacity: 1 !important; } .workflow-list { padding: 0 25px; text-align: center; } .workflow-list p { font-size: 14px; color: var(--text-muted); margin: 8px 0; line-height: 1.4; } .dark-card, .button-row, .tap-button-outline { margin: 12px 15px; } .dark-card { background: var(--card-bg); border-radius: 2px; padding: 25px; text-align: center; box-shadow: none; border: 1px solid var(--border-color); } .script-text { font-family: 'Cormorant Garamond', serif; color: var(--text-main); font-size: 22px; } .button-row { display: flex; gap: 10px; } .tap-button { flex: 1; background: var(--gold); color: var(--bg-color); text-align: center; padding: 16px; border-radius: 2px; font-weight: 700; text-decoration: none; } .tap-button-outline { display: block; border: 2px solid var(--gold); color: var(--gold); text-align: center; padding: 16px; border-radius: 2px; font-weight: 700; text-decoration: none; } .footer-location { text-align: center; font-size: 13px; opacity: 0.5; margin-top: 20px; padding-bottom: 40px; } .care-card { padding: 40px; text-align: center; background: var(--card-bg); border-radius: 2px; border: none; border-top: 2px solid var(--gold); box-shadow: none; min-width: 0; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; } .care-title { color: var(--gold); font-family: 'Cormorant Garamond', serif; font-size: 32px; font-weight: 400; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 30px; display: inline-block; border-bottom: 1px solid var(--gold); padding-bottom: 10px; } .care-features { margin-bottom: 30px; display: flex; flex-direction: column; gap: 10px; } .care-feature { font-family: 'Manrope', sans-serif; color: var(--text-main); font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; font-weight: 600; } .care-cta-text { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 400; color: var(--text-muted); font-size: 20px; line-height: 25px; margin: 0 0 25px; } .care-cta-button { display: inline-block; width: auto; min-width: 280px; height: auto; background: transparent; border: 1px solid var(--gold); color: var(--gold); border-radius: 0; text-decoration: none; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; font-size: 14px; padding: 18px 40px; margin: 0 auto; transition: all 0.3s ease; } .care-cta-button:hover { background: var(--gold); color: var(--bg-color); } .cooperation-title { font-family: "Cormorant Garamond", serif; font-weight: 400; color: var(--text-main); font-size: 32px; letter-spacing: 0.1em; text-align: center; margin: 20px 0 30px; } .cooperation-list { display: grid; grid-template-columns: 1fr; gap: 0; margin-bottom: 50px; border-top: 1px solid var(--border-color); } .cooperation-item { display: flex; align-items: flex-start; background: transparent; padding: 30px 0; border: none; margin-bottom: 0; border-bottom: 1px solid var(--border-color); transition: padding-left 0.3s ease; position: relative; background-image: url("data:image/svg+xml,%3Csvg width='40' height='20' viewBox='0 0 40 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0,20 Q10,5 20,20 T40,20' stroke='%23B0935B' fill='none' opacity='0.05' /%3E%3C/svg%3E"); background-position: bottom left; background-repeat: repeat-x; } .cooperation-item:hover { background: transparent; padding-left: 10px; } .coop-number { position: static; transform: none; width: auto; height: auto; background: transparent; color: var(--gold); border-radius: 0; font-family: 'Cormorant Garamond', serif; font-size: 24px; font-weight: 400; box-shadow: none; margin-right: 20px; line-height: 1; margin-top: -2px; } .coop-text { padding-left: 0; } .coop-name { font-family: "Manrope", sans-serif; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-main); font-size: 16px; margin-bottom: 2px; } .coop-desc { font-family: 'Manrope', sans-serif; color: var(--text-muted); font-size: 14px; line-height: 1.4; } .partners-block { margin-bottom: 80px; text-align: center; padding-top: 40px; position: relative; } .partners-block::before { content: ''; position: absolute; top: 0; left: 0; width: 100px; height: 100%; background-image: url("data:image/svg+xml,%3Csvg width='100' height='200' viewBox='0 0 100 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke='%23B0935B' stroke-width='4' opacity='0.15' stroke-linecap='round'%3E%3Cline x1='50' y1='0' x2='50' y2='200' /%3E%3Cline x1='45' y1='40' x2='55' y2='38' /%3E%3Cline x1='45' y1='120' x2='55' y2='118' /%3E%3Cpath d='M50,40 Q80,20 90,5' fill='none' stroke-width='2' /%3E%3Cpath d='M50,120 Q20,100 10,80' fill='none' stroke-width='2' /%3E%3Cpath d='M50,120 Q70,140 80,160' fill='none' stroke-width='2' /%3E%3C/g%3E%3C/svg%3E"); background-repeat: repeat-y; pointer-events: none; } .partners-title { font-family: "Cormorant Garamond", serif; font-weight: 400; color: var(--text-main); font-size: 36px; letter-spacing: 0.1em; margin-bottom: 40px; } .partners-grid { display: grid; grid-template-columns: repeat(2, 1fr); text-align: center; gap: 20px; padding: 0; } .partner-item { background: transparent; padding: 20px; border: 1px solid var(--border-color); transition: border-color 0.3s; } .partner-item:hover { border-color: var(--gold); } .partner-name { font-family: "Manrope", sans-serif; font-weight: 700; color: var(--text-main); font-size: 16px; line-height: 25px; margin-bottom: 5px; } .partner-desc { font-family: 'Manrope', sans-serif; font-weight: 400; color: var(--text-muted); font-size: 14px; line-height: 20px; } .contacts-block { background: var(--card-bg); border: none; border-top: 2px solid var(--gold); padding: 60px 40px; text-align: center; max-width: 800px; margin: 80px auto 40px; position: relative; border-radius: 2px; overflow: hidden; } .questions-title { font-family: "Cormorant Garamond", serif; font-weight: 400; color: var(--text-main); font-size: 36px; letter-spacing: 0.1em; text-align: center; margin: 0 0 25px; display: inline-block; border-bottom: 1px solid var(--gold); padding-bottom: 10px; } .contacts-block::after { content: ''; position: absolute; bottom: -30px; right: -40px; width: 150px; height: 150px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23B0935B' d='M21.52,8.54c-0.44-2.06-2.08-3.7-4.14-4.14C15.6,3.94,13.88,3.3,12,3.3c-1.88,0-3.6,0.64-5.38,1.1 C4.56,4.84,2.92,6.48,2.48,8.54C2.02,10.32,1.7,12,1.7,12s0.32,1.68,0.78,3.46c0.44,2.06,2.08,3.7,4.14,4.14 C8.4,20.06,10.12,20.7,12,20.7c1.88,0,3.6-0.64,5.38-1.1c2.06-0.44,3.7-2.08,4.14-4.14C21.98,13.68,22.3,12,22.3,12 S21.98,10.32,21.52,8.54z M12,19.3c-1.49,0-2.88-0.51-4.22-0.89c-1.55-0.33-2.8-1.58-3.13-3.13C4.26,13.72,4.05,12.5,4.05,12 c0-0.5,0.2-1.72,0.6-3.28c0.33-1.55,1.58-2.8,3.13-3.13C9.12,5.21,10.51,4.7,12,4.7c1.49,0,2.88,0.51,4.22,0.89 c1.55,0.33,2.8,1.58,3.13,3.13c0.39,1.56,0.6,2.78,0.6,3.28c0,0.5-0.2,1.72-0.6,3.28c-0.33,1.55-1.58,2.8-3.13,3.13 C14.88,18.79,13.49,19.3,12,19.3z'/%3E%3C/svg%3E"); background-repeat: no-repeat; opacity: 0.05; transform: rotate(-15deg); } .answer-text { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 400; color: var(--text-muted); font-size: 20px; text-align: center; margin: 0 0 30px; padding: 0; } .messengers-row { display: flex; justify-content: center; gap: 20px; margin-bottom: 30px; } .contacts-block, .footer-location, .designer-credit { -webkit-user-select: text; user-select: text; } .messenger-btn { width: 40px; height: 40px; color: var(--gold); transition: transform 0.2s; } .messenger-btn:active { transform: scale(0.95); } .call-button { margin-bottom: 0; } .footer-location { font-family: 'Manrope', sans-serif; font-weight: 300; color: var(--text-muted); font-size: 14px; line-height: 25px; width: 100%; max-width: 792px; margin: 0 auto 20px; padding: 0 20px; box-sizing: border-box; display: flex; align-items: center; gap: 10px; } .designer-credit { font-family: 'Manrope', sans-serif; font-size: 12px; text-align: center; margin-bottom: 20px; font-weight: 400; display: block; text-decoration: none; color: rgba(255, 255, 255, 0.2); letter-spacing: 1px; transition: all 0.3s ease; } .designer-credit:hover { color: var(--gold); transform: translateY(-2px); } @media (max-width: 767px) { body { background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); background-position: top left; background-repeat: repeat; } .profile { padding: 100px 15px 40px; } .main-title { font-size: 28px; line-height: 1.2; } .description { font-size: 12px; } .service-card, .care-card, .contacts-block { padding: 30px 20px; } .carousel-header { padding: 0; min-height: auto; margin-bottom: 25px; } .care-title, .cooperation-title, .partners-title, .questions-title { font-size: 24px; } .answer-text, .care-cta-text { font-size: 16px; } .block-title { font-size: 13px; } .swiper { overflow: hidden !important; } .swiper-slide { width: 85%; height: auto; aspect-ratio: 3 / 2; } .swiper-button-next, .swiper-button-prev { display: none !important; } .partners-grid { grid-template-columns: 1fr; gap: 15px; } .cooperation-item { padding: 20px 0; } .coop-number { font-size: 20px; margin-right: 15px; } .care-cta-button { width: 100%; min-width: auto; padding: 18px 20px; } } @media (min-width: 480px) and (max-width: 767px) { .partners-grid { grid-template-columns: 1fr 1fr; } } @media (min-width: 768px) and (max-width: 1023px) { .main-grid { max-width: 720px; } .swiper-slide { width: 100%; aspect-ratio: 3 / 2; } .swiper-button-next, .swiper-button-prev { display: flex !important; } .cooperation-list { grid-template-columns: 1fr 1fr; column-gap: 40px; border-top: none; } .partners-grid { grid-template-columns: repeat(3, 1fr); } } @media (min-width: 1024px) { .main-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; } .cooperation-list { grid-template-columns: repeat(3, 1fr); column-gap: 60px; border-top: none; } .partners-grid { grid-template-columns: repeat(3, 1fr); } .swiper-slide { width: 100%; height: auto; } .service-card:hover { transform: translateY(-5px); transition: transform 0.3s ease, background 0.3s ease; } } @media (min-width: 1440px) { .main-grid, .section-wrapper, .header-divider { max-width: 1400px; } .main-title { font-size: 56px; } .service-card, .care-card { padding: 50px; } }