.service-landing { --sl-text:#11192d; --sl-muted:#596983; --sl-violet:#6219ef; --sl-pink:#df4388; width:100%; color:var(--sl-text); }
.service-landing *, .service-landing *::before, .service-landing *::after { box-sizing:border-box; }
.service-landing__hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(400px,.9fr); column-gap:38px; row-gap:16px; align-items:start; align-content:start; min-height:590px; padding:clamp(42px,5vw,68px); overflow:hidden; background:radial-gradient(circle at 88% 15%,rgba(111,32,242,.1),transparent 30%),linear-gradient(135deg,#fbf9ff,#fff); border:1px solid #e8e3f1; border-radius:22px; box-shadow:0 22px 58px rgba(32,28,56,.075); }
.service-landing__eyebrow { margin-bottom:20px; color:#56688b; font-size:12px; font-weight:600; letter-spacing:.035em; text-transform:uppercase; }
.service-landing__eyebrow::before { content:'/'; margin-right:6px; color:var(--sl-violet); font-weight:800; }
.service-landing__hero-heading { grid-column:1 / -1; min-width:0; width:100%; }
.service-landing__hero h1 { width:100%; max-width:none; margin:0; color:var(--sl-text); font-size:clamp(40px,4.7vw,62px); font-weight:700; line-height:1.06; letter-spacing:-.04em; overflow-wrap:anywhere; }
.service-landing__hero-copy > p { max-width:680px; margin:0; color:#455675; font-size:17px; line-height:1.65; }
.service-landing__hero-actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:30px; }
.service-landing__hero-actions button,.service-landing__hero-actions a { display:inline-flex; min-height:50px; align-items:center; justify-content:center; gap:13px; padding:12px 23px; font-size:14px; font-weight:700; border-radius:10px; cursor:pointer; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease; }
.service-landing__hero-actions button { color:#fff; background:linear-gradient(105deg,#5810e8,#7a1cef 60%,#cc3b82); border:0; box-shadow:0 12px 28px rgba(91,20,227,.25); }
.service-landing__hero-actions a { color:var(--sl-violet); background:#fff; border:1px solid #cdbdf1; }
.service-landing__hero-actions button:hover,.service-landing__hero-actions a:hover { transform:translateY(-2px); box-shadow:0 15px 32px rgba(82,26,190,.18); }
.service-landing__hero-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-width:590px; margin-top:38px; overflow:hidden; background:rgba(255,255,255,.84); border:1px solid #e7e2ef; border-radius:14px; }
.service-landing__hero-stats div { padding:18px 20px; border-left:1px solid #e9e5f1; }
.service-landing__hero-stats div:first-child { border-left:0; }
.service-landing__hero-stats strong,.service-landing__hero-stats span { display:block; }
.service-landing__hero-stats strong { color:var(--sl-violet); font-size:22px; }
.service-landing__hero-stats span { margin-top:4px; color:var(--sl-muted); font-size:11px; }
.service-landing__hero-media { position:relative; display:flex; align-items:center; justify-content:center; min-width:0; }
.service-landing__hero-media::before { content:''; position:absolute; inset:10% 3%; background:radial-gradient(circle,rgba(111,38,242,.12),transparent 68%); border-radius:50%; }
.service-landing__hero-media img { position:relative; z-index:1; display:block; width:100%; max-height:500px; object-fit:contain; filter:drop-shadow(0 28px 35px rgba(43,20,92,.13)); }
.service-landing__section { margin-top:80px; scroll-margin-top:100px; }
.service-landing__section-heading { max-width:850px; margin-bottom:34px; }
.service-landing__section-heading h2 { margin:0; color:var(--sl-text); font-size:clamp(34px,3.7vw,50px); font-weight:700; line-height:1.12; letter-spacing:-.03em; }
.service-landing__section-heading > p { margin:18px 0 0; color:#52627e; font-size:15px; line-height:1.6; }
.service-landing__types-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.service-type-card { position:relative; display:flex; min-width:0; min-height:245px; flex-direction:column; padding:25px; overflow:hidden; color:var(--sl-text); text-decoration:none; background:#fff; border:1px solid #e9e5f1; border-radius:16px; box-shadow:0 13px 32px rgba(32,28,56,.055); transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease; }
.service-type-card::after { content:''; position:absolute; right:-45px; bottom:-55px; width:130px; height:130px; background:radial-gradient(circle,rgba(101,25,239,.09),transparent 68%); border-radius:50%; }
.service-type-card:hover { color:var(--sl-text); border-color:rgba(101,25,239,.27); box-shadow:0 19px 42px rgba(32,28,56,.1); transform:translateY(-4px); }
.service-type-card__top { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.service-type-card__number { color:#8a6bc9; font-size:11px; font-weight:700; }
.service-type-card__icon { display:flex; flex:0 0 46px; width:46px; height:46px; align-items:center; justify-content:center; overflow:hidden; color:var(--sl-violet); background:linear-gradient(135deg,rgba(103,8,199,.09),rgba(216,66,101,.07)); border:1px solid rgba(103,8,199,.11); border-radius:12px; transition:transform .25s ease,background-color .25s ease,border-color .25s ease; }
.service-type-card__icon img { display:block; width:28px; height:28px; object-fit:contain; }
.service-type-card__icon svg { width:25px; height:25px; }
.service-type-card:hover .service-type-card__icon { border-color:rgba(103,8,199,.2); background-color:rgba(255,255,255,.85); transform:scale(1.05) rotate(-2deg); }
.service-type-card__task { margin-top:18px; color:var(--sl-pink); font-size:11px; font-weight:700; letter-spacing:.025em; text-transform:uppercase; }
.service-type-card strong { margin-top:9px; font-size:21px; line-height:1.25; }
.service-type-card__text { margin-top:11px; color:var(--sl-muted); font-size:13px; line-height:1.5; }
.service-type-card__arrow { position:relative; z-index:1; margin-top:auto; padding-top:20px; color:var(--sl-violet); font-size:23px; }
.service-results-grid,.service-process-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }
.service-results-grid article,.service-process-grid article { min-width:0; padding:25px; background:linear-gradient(145deg,#fff,#fcfbff); border:1px solid #e9e5f1; border-radius:16px; }
.service-results-grid article > span,.service-process-grid article > span { display:flex; width:42px; height:42px; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:700; background:linear-gradient(135deg,var(--sl-violet),var(--sl-pink)); border-radius:11px; box-shadow:0 9px 20px rgba(100,25,239,.19); }
.service-results-grid h3,.service-process-grid h3 { margin:22px 0 0; font-size:19px; }
.service-results-grid p,.service-process-grid p { margin:10px 0 0; color:var(--sl-muted); font-size:13px; line-height:1.55; }
.service-landing__cases { position:relative; padding:clamp(36px,5vw,56px); overflow:hidden; background:radial-gradient(circle at 88% 8%,rgba(216,66,101,.18),transparent 27%),#0a1020; border-radius:21px; }
.service-landing__section-heading--light h2 { color:#fff; }
.service-landing__section-heading--light .service-landing__eyebrow,.service-landing__section-heading--light > p { color:rgba(255,255,255,.65); }
.service-landing__cases .main-cases-list { margin-top:30px; }
.service-technologies-list { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.service-technologies-list span { display:flex; min-width:0; min-height:92px; flex:1 1 140px; max-width:200px; flex-direction:column; align-items:center; gap:10px; padding:15px; color:#352c50; font-size:14px; font-weight:700; text-align:center; background:#fff; border:1px solid #e8e3f0; border-radius:14px; box-shadow:0 12px 28px rgba(32,28,56,.05); }
.service-technologies-list img { display:block; width:auto; max-width:100%; height:auto; margin:auto 0 0; object-fit:contain; }
.service-technologies-list strong { margin-top:auto; font:inherit; }
.service-landing__process { padding:clamp(34px,5vw,52px); background:linear-gradient(135deg,rgba(103,8,199,.045),rgba(216,66,101,.05)); border:1px solid #e8e3f1; border-radius:20px; }
.service-process-grid article { background:rgba(255,255,255,.88); }
.service-prices-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.service-prices-grid article { display:flex; min-height:210px; flex-direction:column; padding:27px; background:#fff; border:1px solid #e7e1f0; border-radius:17px; box-shadow:0 14px 34px rgba(32,28,56,.06); }
.service-prices-grid h3 { margin:0; font-size:19px; }
.service-prices-grid strong { display:block; margin-top:25px; color:var(--sl-violet); font-size:27px; }
.service-prices-grid a { margin-top:auto; padding-top:23px; color:var(--sl-violet); font-size:13px; font-weight:700; text-decoration:none; }
.service-prices-grid a span { margin-left:9px; font-size:18px; }
.service-prices-note { margin:18px 0 0; color:var(--sl-muted); font-size:13px; }
.service-faq-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.service-faq-list details { min-width:0; padding:0 22px; background:#fff; border:1px solid #e8e3f0; border-radius:14px; }
.service-faq-list summary { display:grid; grid-template-columns:minmax(0,1fr) 30px; gap:18px; align-items:center; min-height:70px; font-size:15px; font-weight:700; cursor:pointer; list-style:none; }
.service-faq-list summary::-webkit-details-marker { display:none; }
.service-faq-list summary span { display:flex; width:30px; height:30px; align-items:center; justify-content:center; color:var(--sl-violet); font-size:21px; background:#f2ecff; border-radius:50%; transition:transform .2s ease; }
.service-faq-list details[open] summary span { transform:rotate(45deg); }
.service-faq-list details p { margin:0; padding:0 38px 20px 0; color:var(--sl-muted); font-size:13px; line-height:1.6; }
.service-landing__seo-text { margin-top:65px; padding:28px; color:#61708a; font-size:13px; line-height:1.7; background:#fbf9ff; border:1px solid #ebe7f2; border-radius:16px; }
.service-landing__seo-text > :first-child { margin-top:0; }.service-landing__seo-text > :last-child { margin-bottom:0; }
.service-landing__cta { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:30px; align-items:center; margin-top:80px; padding:clamp(32px,5vw,52px); overflow:hidden; color:#fff; background:radial-gradient(circle at 10% 12%,rgba(255,255,255,.18),transparent 30%),linear-gradient(110deg,#5710e8,#7a1eef 58%,#d33f84); border-radius:20px; box-shadow:0 20px 52px rgba(83,19,199,.24); }
.service-landing__cta > div > span { color:rgba(255,255,255,.7); font-size:12px; font-weight:600; text-transform:uppercase; }
.service-landing__cta h2 { margin:12px 0 0; color:#fff; font-size:clamp(28px,3vw,42px); line-height:1.15; }
.service-landing__cta p { margin:13px 0 0; color:rgba(255,255,255,.76); font-size:14px; }
.service-landing__cta button { min-width:235px; min-height:55px; padding:13px 25px; color:var(--sl-violet); font-size:15px; font-weight:700; background:#fff; border:0; border-radius:11px; cursor:pointer; box-shadow:0 12px 28px rgba(43,12,107,.2); }
.service-landing__cta button span { margin-left:13px; font-size:20px; }
@media (max-width:1199.98px) { .service-landing__hero { grid-template-columns:minmax(0,1fr) 390px; }.service-landing__types-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.service-results-grid,.service-process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:991.98px) { .service-landing__hero { grid-template-columns:1fr; }.service-landing__hero-media { max-width:620px; margin:0 auto; }.service-landing__hero-media img { max-height:430px; }.service-landing__section { margin-top:60px; }.service-landing__cta { grid-template-columns:1fr; }.service-landing__cta button { width:100%; } }
@media (max-width:767.98px) { .service-landing__hero { min-height:0; padding:32px 20px; }.service-landing__hero h1 { font-size:clamp(36px,10vw,48px); }.service-landing__hero-copy > p { font-size:15px; }.service-landing__types-grid,.service-results-grid,.service-process-grid,.service-prices-grid,.service-faq-list { grid-template-columns:1fr; }.service-technologies-list span { flex-basis:calc(50% - 6px); max-width:calc(50% - 6px); }.service-landing__cases,.service-landing__process { padding:30px 20px; }.service-landing__cta { margin-top:60px; padding:30px 20px; } }
@media (max-width:479.98px) { .service-landing__hero-actions { display:grid; }.service-landing__hero-actions button,.service-landing__hero-actions a { width:100%; }.service-landing__hero-stats div { padding:15px 10px; }.service-landing__hero-stats strong { font-size:18px; }.service-landing__hero-stats span { font-size:9px; }.service-technologies-list span { min-height:75px; font-size:12px; }.service-faq-list details { padding:0 17px; } }