/* dx-home-v2-2026-10 — shorter home: price line, client names, packages, repair line, WhatsApp buttons (prefix hp-) */
.hp-wa-btn{ display:inline-flex; align-items:center; gap:8px; }
.hp-wa-btn svg{ width:17px; height:17px; color:#25D366; flex:none; }

/* hero: starting prices + 3 promises */
.hp-from{ margin-top:18px; font-size:13.5px; line-height:1.7; color:var(--mist); display:flex; flex-wrap:wrap; align-items:center; gap:2px 10px; }
.hp-from b{ color:var(--white); font-weight:600; white-space:nowrap; }
html[data-theme="light"] .hp-from b{ color:#0B1220; }
.hp-from i{ width:4px; height:4px; border-radius:50%; background:var(--cyan); opacity:.7; }
.hp-from a{ color:var(--cyan); font-weight:600; white-space:nowrap; }
html[data-theme="light"] .hp-from a{ color:#0891B2; }
.hp-checks{ list-style:none; margin:16px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px; font-size:13px; color:var(--mist); }
.hp-checks li{ display:flex; align-items:center; gap:7px; }
.hp-checks li::before{ content:""; width:15px; height:15px; flex:none; border-radius:50%; background:rgba(34,197,94,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%2322c55e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat; }

/* clients & projects: one moving line (dx-home-v3) */
.hp-clients{ --hp-card:rgba(14,18,32,.72); --hp-card-line:rgba(255,255,255,.08); --hp-name:#F5F7FF; --hp-muted:#8B93A7;
  padding:30px 0 34px !important; overflow:hidden; position:relative; }
html[data-theme="light"] .hp-clients{ --hp-card:rgba(255,255,255,.88); --hp-card-line:rgba(15,23,42,.07); --hp-name:#0B1220; --hp-muted:#5b6479; }
.hp-clients-k{ font-size:11.5px; color:var(--hp-muted); text-align:center; margin:0 0 18px; padding:0 20px; }
.hp-k-store{ --k1:#A855F7; } .hp-k-system{ --k1:#3D5AFE; } .hp-k-travel{ --k1:#F59E0B; } .hp-k-health{ --k1:#14B8A6; } .hp-k-brand{ --k1:#0891B2; }
.hp-loop{ position:relative; overflow:hidden; padding:8px 0 12px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent); mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent); }
.hp-loop-track{ display:flex; width:max-content; animation:hpLoop 70s linear infinite; }
.hp-loop:hover .hp-loop-track{ animation-play-state:paused; }
.hp-loop-set{ list-style:none; margin:0; padding:0 7px; display:flex; gap:14px; }
@keyframes hpLoop{ to{ transform:translateX(-50%); } }
.hp-work{ display:flex; align-items:center; gap:12px; padding:12px 20px 12px 14px; border-radius:999px; white-space:nowrap;
  background:var(--hp-card); border:1px solid var(--hp-card-line); box-shadow:0 8px 24px rgba(15,23,60,.06);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); transition:transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s, box-shadow .3s; }
.hp-work:hover{ transform:translateY(-3px); border-color:color-mix(in srgb, var(--k1) 55%, transparent); box-shadow:0 14px 34px color-mix(in srgb, var(--k1) 20%, transparent); }
.hp-work-ic{ width:34px; height:34px; flex:none; padding:8px; border-radius:50%; fill:none; stroke:var(--k1); stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
  background:color-mix(in srgb, var(--k1) 12%, transparent); }
.hp-work-txt{ display:flex; flex-direction:column; gap:1px; }
.hp-work-txt strong{ font:600 15px/1.2 'Space Grotesk',sans-serif; color:var(--hp-name); }
.hp-work-txt small{ font-size:12.5px; color:var(--hp-muted); }
@media (max-width:600px){
  .hp-work{ padding:9px 16px 9px 10px; gap:10px; } .hp-work-ic{ width:30px; height:30px; padding:7px; }
  .hp-work-txt strong{ font-size:14px; } .hp-work-txt small{ font-size:11.5px; }
  .hp-loop-track{ animation-duration:55s; }
}
@media (prefers-reduced-motion:reduce){
  .hp-loop{ -webkit-mask-image:none; mask-image:none; }
  .hp-loop-track{ animation:none; width:auto; } .hp-loop-set{ flex-wrap:wrap; justify-content:center; padding:0 16px; } .hp-loop-set[aria-hidden]{ display:none; }
}

/* "already have a website?" line under services */
.hp-fix{ margin-top:18px; display:flex; flex-wrap:wrap; align-items:center; gap:8px 18px; padding:18px 22px; border-radius:16px;
  border:1px dashed rgba(34,211,238,.35); background:rgba(34,211,238,.04); color:inherit; transition:border-color .25s, background .25s; }
.hp-fix:hover{ border-color:var(--cyan); background:rgba(34,211,238,.08); }
.hp-fix-k{ font-size:11px; color:var(--cyan); }
.hp-fix-t{ flex:1 1 320px; font-size:14.5px; color:var(--mist); line-height:1.55; }
.hp-fix-a{ font-weight:600; font-size:14px; white-space:nowrap; }
html[data-theme="light"] .hp-fix{ background:rgba(8,145,178,.05); border-color:rgba(8,145,178,.35); }
html[data-theme="light"] .hp-fix-k{ color:#0891B2; }

/* packages */
.hp-pk-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(12px,1.4vw,22px); }
.hp-pk{ position:relative; display:flex; flex-direction:column; gap:10px; padding:clamp(22px,2vw,32px); border-radius:22px;
  background:var(--panel); border:1px solid var(--line); }
html[data-theme="light"] .hp-pk{ background:#fff; border-color:rgba(15,23,42,.09); box-shadow:0 14px 40px rgba(30,41,80,.07); }
.hp-pk--main{ border-color:transparent; background:linear-gradient(var(--panel),var(--panel)) padding-box, linear-gradient(135deg,var(--blue),var(--violet)) border-box; border:1.5px solid transparent; }
html[data-theme="light"] .hp-pk--main{ background:linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg,#3D5AFE,#A855F7) border-box; }
.hp-pk-k{ font-size:11px; color:var(--cyan); }
html[data-theme="light"] .hp-pk-k{ color:#0891B2; }
.hp-pk h3{ font-size:clamp(20px,1.6vw,26px); font-weight:600; margin:0; }
.hp-pk-for{ color:var(--mist); font-size:14px; line-height:1.6; margin:0; min-height:3.2em; }
.hp-pk-price{ font:700 clamp(26px,2.2vw,36px)/1.15 'Space Grotesk',sans-serif; letter-spacing:-.02em; margin:6px 0 2px; }
.hp-pk-price small{ font:500 13px/1 Inter,sans-serif; color:var(--mist); letter-spacing:0; }
.hp-pk ul{ list-style:none; margin:4px 0 8px; padding:14px 0 0; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:9px; flex:1; }
html[data-theme="light"] .hp-pk ul{ border-color:rgba(15,23,42,.08); }
.hp-pk li{ display:flex; gap:9px; font-size:14px; line-height:1.45; }
.hp-pk li::before{ content:''; display:inline-block; width:1em; height:1em; background:currentColor; -webkit-mask:var(--dx-i-check) center/contain no-repeat; mask:var(--dx-i-check) center/contain no-repeat; color:#22c55e; flex-shrink:0; margin-top:.22em; }
.hp-pk .btn{ justify-content:center; text-align:center; }
.hp-pk-more{ margin-top:22px; text-align:center; color:var(--mist); font-size:14.5px; }
.hp-pk-more a{ color:var(--cyan); font-weight:600; }
html[data-theme="light"] .hp-pk-more a{ color:#0891B2; }

.hp-cta-small{ margin-top:18px !important; font-size:14px; color:var(--mist); }
.hp-cta-small a{ color:var(--cyan); font-weight:600; }

@media (max-width:900px){ .hp-pk-grid{ grid-template-columns:1fr; max-width:560px; margin:0 auto; } .hp-pk-for{ min-height:0; } }
@media (max-width:560px){
  .hp-from{ font-size:12.5px; } .hp-from i{ display:none; } .hp-from b::after{ content:""; }
  .hp-checks{ font-size:12.5px; gap:6px 14px; }
  .hp-clients ul{ gap:8px 20px; }
  .hp-fix{ padding:16px; }
}

/* AI front desk */
.hp-ai{ --ai-win:#fff; --ai-line:rgba(15,23,42,.08); --ai-text:#0B1220; --ai-muted:#64748b; --ai-in:#0B1220; --ai-bot:#F1F4FA; }
html:not([data-theme="light"]) .hp-ai{ --ai-win:#0E1220; --ai-line:rgba(255,255,255,.09); --ai-text:#F5F7FF; --ai-muted:#8B93A7; --ai-in:linear-gradient(135deg,#3D5AFE,#7C3AED); --ai-bot:#161B2E; }
.hp-ai-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(28px,5vw,80px); align-items:center; max-width:1320px; margin:0 auto; }
.hp-ai-copy h2{ font-size:clamp(26px,3vw,40px); font-weight:600; line-height:1.1; margin:0 0 16px; }
.hp-ai-copy > p{ color:var(--mist); font-size:15.5px; line-height:1.7; max-width:56ch; margin:0; }
.hp-ai-feats{ list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.hp-ai-feats li{ display:flex; flex-direction:column; gap:3px; padding:14px 16px; border-radius:14px; border:1px solid var(--ai-line); background:color-mix(in srgb, var(--ai-win) 70%, transparent); }
.hp-ai-feats b{ font:600 14.5px/1.3 'Space Grotesk',sans-serif; display:flex; align-items:center; gap:8px; }
.hp-ai-feats b::before{ content:""; width:8px; height:8px; border-radius:50%; background:linear-gradient(135deg,#22D3EE,#A855F7); }
.hp-ai-feats span{ font-size:13px; color:var(--mist); line-height:1.5; }
.hp-ai-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }

.hp-ai-demo{ position:relative; padding:0 0 34px 0; }
.hp-ai-demo::before{ content:""; position:absolute; inset:8% 6% 14%; z-index:-1; border-radius:40px; filter:blur(50px);
  background:radial-gradient(circle at 30% 30%, rgba(61,90,254,.35), transparent 60%), radial-gradient(circle at 75% 70%, rgba(168,85,247,.3), transparent 60%); }
.hp-ai-win{ border-radius:22px; overflow:hidden; background:var(--ai-win); border:1px solid var(--ai-line); box-shadow:0 30px 80px rgba(20,30,80,.16); color:var(--ai-text); }
.hp-ai-head{ display:flex; align-items:center; gap:12px; padding:14px 16px; border-bottom:1px solid var(--ai-line); flex-wrap:wrap; }
.hp-ai-avatar{ width:38px; height:38px; border-radius:12px; background:linear-gradient(135deg,#22D3EE,#3D5AFE 55%,#A855F7); position:relative; flex:none; }
.hp-ai-avatar i{ position:absolute; inset:11px; border-radius:50%; border:2.5px solid #fff; border-bottom-color:transparent; animation:hpSpin 3s linear infinite; }
@keyframes hpSpin{ to{ transform:rotate(360deg); } }
.hp-ai-name{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:140px; }
.hp-ai-name strong{ font:600 15px/1.2 'Space Grotesk',sans-serif; }
.hp-ai-name small{ font-size:12px; color:var(--ai-muted); display:flex; align-items:center; gap:6px; }
.hp-ai-name small i{ width:7px; height:7px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 0 rgba(34,197,94,.5); animation:hpPulse 2s infinite; }
@keyframes hpPulse{ 70%{ box-shadow:0 0 0 7px rgba(34,197,94,0); } 100%{ box-shadow:0 0 0 0 rgba(34,197,94,0); } }
.hp-ai-tabs{ display:flex; gap:4px; padding:3px; border-radius:999px; background:color-mix(in srgb, var(--ai-muted) 12%, transparent); }
.hp-ai-tabs button{ appearance:none; border:0; background:transparent; color:var(--ai-muted); font:600 12px/1 Inter,sans-serif; padding:7px 11px; border-radius:999px; cursor:pointer; transition:background .25s,color .25s; }
.hp-ai-tabs button.is-on{ background:linear-gradient(135deg,#3D5AFE,#A855F7); color:#fff; }
.hp-ai-tabs button:focus-visible{ outline:2px solid #22D3EE; outline-offset:2px; }
.hp-ai-body{ height:clamp(300px,30vw,360px); padding:18px 16px; display:flex; flex-direction:column; justify-content:flex-end; gap:10px; overflow:hidden; }
.hp-ai-body[dir="rtl"]{ font-family:'Noto Kufi Arabic',Inter,sans-serif; }
.hp-msg{ margin:0; max-width:82%; padding:11px 14px; border-radius:18px; font-size:14px; line-height:1.5;
  opacity:0; transform:translateY(10px) scale(.98); transition:opacity .35s ease, transform .45s cubic-bezier(.2,.8,.2,1); }
.hp-msg.is-in{ opacity:1; transform:none; }
.hp-msg--in{ align-self:flex-end; background:var(--ai-in); color:#fff; border-bottom-right-radius:6px; }
.hp-msg--bot{ align-self:flex-start; background:var(--ai-bot); border-bottom-left-radius:6px; }
.hp-ai-body[dir="rtl"] .hp-msg--in{ align-self:flex-start; border-radius:18px 18px 18px 6px; }
.hp-ai-body[dir="rtl"] .hp-msg--bot{ align-self:flex-end; border-radius:18px 18px 6px 18px; }
.hp-typing{ align-self:flex-start; display:inline-flex; gap:4px; padding:12px 14px; border-radius:18px 18px 18px 6px; background:var(--ai-bot); }
.hp-ai-body[dir="rtl"] .hp-typing{ align-self:flex-end; }
.hp-typing i{ width:7px; height:7px; border-radius:50%; background:var(--ai-muted); animation:hpDot 1.1s infinite ease-in-out; }
.hp-typing i:nth-child(2){ animation-delay:.15s } .hp-typing i:nth-child(3){ animation-delay:.3s }
@keyframes hpDot{ 0%,80%,100%{ opacity:.3; transform:none } 40%{ opacity:1; transform:translateY(-3px) } }
.hp-ai-input{ display:flex; align-items:center; justify-content:space-between; margin:0 14px 14px; padding:7px 7px 7px 16px; border-radius:999px; border:1px solid var(--ai-line); color:var(--ai-muted); font-size:13.5px; }
.hp-ai-input i{ width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg,#3D5AFE,#A855F7) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12l16-8-6 16-2-6z' fill='none' stroke='%23fff' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat; }
.hp-ai-lead{ position:absolute; left:-18px; bottom:0; display:flex; align-items:center; gap:12px; padding:12px 16px 12px 12px; border-radius:16px;
  background:var(--ai-win); color:var(--ai-text); border:1px solid var(--ai-line); box-shadow:0 18px 44px rgba(20,30,80,.2);
  opacity:0; transform:translateY(14px) scale(.96); transition:opacity .4s ease, transform .5s cubic-bezier(.2,.8,.2,1); pointer-events:none; max-width:calc(100% - 20px); }
.hp-ai-lead.is-on{ opacity:1; transform:none; }
.hp-ai-lead-ic{ width:38px; height:38px; flex:none; border-radius:11px; background:#22c55e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 8a6 6 0 1 1 12 0c0 7 3 8 3 8H3s3-1 3-8M10 20a2 2 0 0 0 4 0' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat; }
.hp-ai-lead span{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.hp-ai-lead small{ font-size:11.5px; color:var(--ai-muted); }
.hp-ai-lead strong{ font:600 14px/1.3 'Space Grotesk',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:900px){ .hp-ai-grid{ grid-template-columns:1fr; } .hp-ai-lead{ left:10px; } }
@media (max-width:520px){ .hp-ai-feats{ grid-template-columns:1fr; } .hp-ai-tabs{ width:100%; justify-content:space-between; } .hp-ai-tabs button{ flex:1; } .hp-msg{ font-size:13.5px; max-width:88%; } }
@media (prefers-reduced-motion:reduce){ .hp-msg,.hp-ai-lead{ transition:none; } .hp-ai-avatar i,.hp-typing i,.hp-ai-name small i{ animation:none; } }

/* slim closing bar (dx-home-v3) */
.hp-end{ padding-top:clamp(24px,4vw,56px) !important; padding-bottom:clamp(56px,7vw,110px) !important; }
.hp-end-bar{ max-width:1320px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:18px 40px; flex-wrap:wrap;
  padding:clamp(22px,2.6vw,40px) clamp(22px,3vw,48px); border-radius:clamp(20px,2vw,32px); position:relative; overflow:hidden;
  background:linear-gradient(120deg, rgba(61,90,254,.10), rgba(34,211,238,.06) 45%, rgba(168,85,247,.10)); border:1px solid rgba(61,90,254,.18); }
.hp-end-bar::after{ content:""; position:absolute; inset:-40% -10%; background:conic-gradient(from 0deg, transparent, rgba(61,90,254,.12), transparent 30%); animation:hpSpin 14s linear infinite; pointer-events:none; }
.hp-end-txt{ position:relative; z-index:1; flex:1 1 420px; min-width:0; }
.hp-end-txt .kicker{ margin-bottom:8px; }
.hp-end-txt h2{ font-size:clamp(20px,1.9vw,32px); font-weight:600; line-height:1.18; margin:0; max-width:30ch; text-wrap:balance; }
.hp-end-actions{ position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px; }
@media (max-width:560px){ .hp-end-actions{ width:100%; } .hp-end-actions .btn{ flex:1 1 auto; justify-content:center; } }
@media (prefers-reduced-motion:reduce){ .hp-end-bar::after{ animation:none; } }

/* soft moving light behind the AI section */
.hp-ai{ position:relative; overflow:hidden; }
.hp-ai::before{ content:""; position:absolute; width:60vw; height:60vw; max-width:900px; max-height:900px; right:-18vw; top:-10%; z-index:-1; border-radius:50%;
  background:radial-gradient(circle, rgba(61,90,254,.14), transparent 62%); animation:hpFloat 16s ease-in-out infinite alternate; pointer-events:none; }
@keyframes hpFloat{ to{ transform:translate(-8vw, 10%) scale(1.1); } }
@media (prefers-reduced-motion:reduce){ .hp-ai::before{ animation:none; } }

/* big screens / TVs (same idea as home-fit.css) */
@media (min-width:2200px){
  .hp-from{ font-size:.94vw; margin-top:1.25vw; }
  .hp-checks{ font-size:.9vw; margin-top:1.1vw; gap:.55vw 1.25vw; }
  .hp-checks li::before{ width:1.05vw; height:1.05vw; background-size:.75vw; }
  .hp-work-txt strong{ font-size:1.05vw; } .hp-work-txt small{ font-size:.85vw; } .hp-work-ic{ width:2.4vw; height:2.4vw; padding:.55vw; }
  .hp-clients-k{ font-size:.78vw; }
  .hp-end-txt h2{ font-size:1.9vw; } .hp-end-bar{ max-width:min(90vw, 1320px + 20vw); }
}

/* client reviews: one moving line of real Google reviews (dx-home-v5) */
.hp-rev{ --rv-card:rgba(14,18,32,.78); --rv-line:rgba(255,255,255,.09); --rv-text:#F5F7FF; --rv-muted:#8B93A7; padding-left:0 !important; padding-right:0 !important; overflow:hidden; }
html[data-theme="light"] .hp-rev{ --rv-card:#fff; --rv-line:rgba(15,23,42,.08); --rv-text:#0B1220; --rv-muted:#5b6479; }
.hp-rev-head{ max-width:1320px; margin:0 auto 26px; padding:0 clamp(20px,5vw,64px); display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:18px 30px; }
.hp-rev-head h2{ font-size:clamp(26px,3vw,40px); font-weight:600; margin:0; }
.hp-rev-badge{ display:flex; align-items:center; gap:12px; padding:12px 18px 12px 14px; border-radius:16px; background:var(--rv-card); border:1px solid var(--rv-line); color:var(--rv-text) !important; box-shadow:0 10px 30px rgba(20,30,80,.08); transition:transform .3s, border-color .3s; }
.hp-rev-badge:hover{ transform:translateY(-2px); border-color:#4285F4; }
.hp-rev-badge svg{ width:30px; height:30px; flex:none; }
.hp-rev-badge span{ display:flex; flex-direction:column; gap:2px; }
.hp-rev-badge strong{ font:700 20px/1 'Space Grotesk',sans-serif; display:flex; align-items:center; gap:8px; }
.hp-rev-badge strong i{ font-style:normal; color:#FBBC05; font-size:15px; letter-spacing:1px; }
.hp-rev-badge small{ font-size:12.5px; color:var(--rv-muted); }
.hp-rev-loop .hp-loop-track{ animation-duration:80s; }
.hp-rev-loop .hp-loop-set{ gap:18px; align-items:stretch; }
.hp-rev-card{ width:min(380px, 78vw); white-space:normal; display:flex; flex-direction:column; gap:14px; padding:22px 22px 18px; border-radius:20px;
  background:var(--rv-card); border:1px solid var(--rv-line); box-shadow:0 12px 34px rgba(20,30,80,.07); color:var(--rv-text); transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s; }
.hp-rev-card:hover{ transform:translateY(-4px); box-shadow:0 20px 44px rgba(61,90,254,.14); }
.hp-rev-stars b{ color:rgba(150,150,170,.35); font-size:16px; letter-spacing:2px; } .hp-rev-stars b.on{ color:#FBBC05; }
.hp-rev-card blockquote{ margin:0; font-size:15px; line-height:1.6; display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical; overflow:hidden; }
.hp-rev-who{ margin-top:auto; display:flex; align-items:center; gap:11px; }
.hp-rev-init{ width:38px; height:38px; flex:none; border-radius:50%; display:grid; place-items:center; color:#fff; font:700 15px/1 'Space Grotesk',sans-serif; background:linear-gradient(135deg,#3D5AFE,#A855F7); }
.hp-rev-who > span:not(.hp-rev-init){ display:flex; flex-direction:column; min-width:0; }
.hp-rev-who strong{ font:600 14.5px/1.25 'Space Grotesk',sans-serif; }
.hp-rev-who small{ font-size:12.5px; color:var(--rv-muted); }
.hp-rev-src{ margin-left:auto; font-size:12.5px; font-weight:600; color:#4285F4 !important; white-space:nowrap; }
.hp-rev-more{ text-align:center; margin:18px 20px 0; font-size:14px; color:var(--rv-muted); }
.hp-rev-more a{ color:var(--cyan); font-weight:600; }
html[data-theme="light"] .hp-rev-more a{ color:#0891B2; }
@media (min-width:2200px){ .hp-rev-card{ width:24vw; } .hp-rev-card blockquote{ font-size:1vw; } .hp-rev-head h2{ font-size:2.6vw; } }

/* compact services grid (dx-home-v6) */
.hp-svc{ --sv-card:rgba(14,18,32,.72); --sv-line:rgba(255,255,255,.08); --sv-text:#F5F7FF; --sv-muted:#8B93A7; }
html[data-theme="light"] .hp-svc{ --sv-card:rgba(255,255,255,.9); --sv-line:rgba(15,23,42,.08); --sv-text:#0B1220; --sv-muted:#5b6479; }
.hp-svc-head{ max-width:1320px; margin:0 auto 24px; display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 30px; }
.hp-svc-head h2{ font-size:clamp(24px,2.6vw,36px); font-weight:600; line-height:1.12; margin:0; max-width:24ch; text-wrap:balance; }
.hp-svc-grid{ max-width:1320px; margin:0 auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(10px,1.1vw,18px); }
.hp-svc-card{ position:relative; display:flex; flex-direction:column; gap:8px; padding:20px 20px 18px; border-radius:18px; overflow:hidden;
  background:var(--sv-card); border:1px solid var(--sv-line); color:var(--sv-text) !important; text-decoration:none; isolation:isolate;
  transition:transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s, box-shadow .35s; }
.hp-svc-card::before{ content:""; position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .4s;
  background:radial-gradient(120% 90% at 0% 0%, rgba(61,90,254,.14), transparent 55%), radial-gradient(120% 90% at 100% 100%, rgba(168,85,247,.12), transparent 55%); }
.hp-svc-card:hover{ transform:translateY(-4px); border-color:rgba(61,90,254,.4); box-shadow:0 18px 40px rgba(61,90,254,.14); }
.hp-svc-card:hover::before{ opacity:1; }
.hp-svc-card:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; }
.hp-svc-ic{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center; margin-bottom:4px;
  background:linear-gradient(135deg, rgba(61,90,254,.14), rgba(168,85,247,.14)); transition:transform .4s cubic-bezier(.2,.8,.2,1), background .4s; }
.hp-svc-ic svg{ width:22px; height:22px; fill:none; stroke:#3D5AFE; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:stroke .4s; }
html:not([data-theme="light"]) .hp-svc-ic svg{ stroke:#8EA2FF; }
.hp-svc-card:hover .hp-svc-ic{ transform:rotate(-6deg) scale(1.06); background:linear-gradient(135deg,#3D5AFE,#A855F7); }
.hp-svc-card:hover .hp-svc-ic svg{ stroke:#fff; }
.hp-svc-card strong{ font:600 16.5px/1.25 'Space Grotesk',sans-serif; }
.hp-svc-line{ font-size:13.5px; line-height:1.5; color:var(--sv-muted); flex:1; }
.hp-svc-tag{ font-size:12.5px; font-weight:600; color:#3D5AFE; display:flex; align-items:center; gap:6px; margin-top:4px; }
html:not([data-theme="light"]) .hp-svc-tag{ color:#8EA2FF; }
.hp-svc-tag i{ font-style:normal; transition:transform .3s; } .hp-svc-card:hover .hp-svc-tag i{ transform:translateX(4px); }
@media (max-width:1000px){ .hp-svc-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px){ .hp-svc-card{ padding:16px; } .hp-svc-ic{ width:38px; height:38px; } .hp-svc-card strong{ font-size:15px; } .hp-svc-line{ font-size:12.5px; } }
@media (min-width:2200px){ .hp-svc-grid,.hp-svc-head{ max-width:min(90vw, 1320px + 20vw); } .hp-svc-card strong{ font-size:1.1vw; } .hp-svc-line{ font-size:.9vw; } .hp-svc-head h2{ font-size:2.4vw; } }

/* reviews: smaller (dx-home-v6) */
.hp-rev{ padding-top:clamp(36px,5vw,72px) !important; padding-bottom:clamp(36px,5vw,72px) !important; }
.hp-rev-head{ margin-bottom:16px; align-items:center; }
.hp-rev-head .kicker{ margin-bottom:6px; }
.hp-rev-head h2{ font-size:clamp(20px,1.8vw,28px); }
.hp-rev-badge{ padding:8px 14px 8px 10px; border-radius:12px; gap:10px; }
.hp-rev-badge svg{ width:22px; height:22px; }
.hp-rev-badge strong{ font-size:16px; } .hp-rev-badge strong i{ font-size:12.5px; } .hp-rev-badge small{ font-size:11.5px; }
.hp-rev-loop .hp-loop-set{ gap:12px; }
.hp-rev-card{ width:min(300px, 74vw); padding:16px 16px 14px; gap:10px; border-radius:16px; }
.hp-rev-stars b{ font-size:13px; }
.hp-rev-card blockquote{ font-size:13.5px; line-height:1.55; -webkit-line-clamp:4; }
.hp-rev-init{ width:30px; height:30px; font-size:12.5px; }
.hp-rev-who strong{ font-size:13.5px; } .hp-rev-who small,.hp-rev-src{ font-size:11.5px; }
.hp-rev-more{ margin-top:12px; font-size:13px; }
@media (min-width:2200px){ .hp-rev-card{ width:19vw; } .hp-rev-card blockquote{ font-size:.86vw; } .hp-rev-head h2{ font-size:1.8vw; } }

/* prices: 3 cards + 2 wide cards (AI, social media) — dx-home-v7 */
.hp-pk-grid{ grid-template-columns:repeat(6,minmax(0,1fr)); }
.hp-pk{ grid-column:span 2; }
.hp-pk--wide{ grid-column:span 3; }
.hp-pk-row{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:18px; align-items:start; flex:1; }
.hp-pk--wide ul{ margin-top:0; border-top:0; padding-top:4px; }
.hp-pk--wide .hp-pk-for{ min-height:0; }
.hp-pk--ai{ background:linear-gradient(var(--panel),var(--panel)) padding-box, linear-gradient(135deg,#22D3EE,#A855F7) border-box; border:1.5px solid transparent; position:relative; overflow:hidden; }
html[data-theme="light"] .hp-pk--ai{ background:linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg,#22D3EE,#A855F7) border-box; }
.hp-pk-price small{ white-space:nowrap; }
@media (max-width:1100px){ .hp-pk-row{ grid-template-columns:1fr; gap:8px; } }
@media (max-width:900px){ .hp-pk-grid{ grid-template-columns:1fr; } .hp-pk, .hp-pk--wide{ grid-column:auto; } }

/* prices slider (dx-home-v8): swipe on phones, drag / arrows on computers */
.hp-slider{ max-width:1320px; margin:0 auto; position:relative; }
.hp-slider-bar{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.hp-swipe{ display:inline-flex; align-items:center; gap:10px; font-size:13px; font-weight:600; color:var(--mist); padding:7px 14px 7px 10px; border-radius:999px;
  border:1px solid var(--line); background:color-mix(in srgb, var(--panel) 70%, transparent); transition:opacity .5s, transform .5s; }
html[data-theme="light"] .hp-swipe{ background:#fff; border-color:rgba(15,23,42,.08); color:#5b6479; }
.hp-swipe.is-gone{ opacity:0; transform:translateY(-4px); }
.hp-swipe-hand{ width:22px; height:22px; position:relative; flex:none; }
.hp-swipe-hand::before{ content:""; position:absolute; inset:0; background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233D5AFE' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11V5.5a1.5 1.5 0 0 1 3 0V11m0-1.5a1.5 1.5 0 0 1 3 0V11m0-.5a1.5 1.5 0 0 1 3 0v4.5a6 6 0 0 1-6 6h-1a5 5 0 0 1-4-2l-3-4a1.5 1.5 0 0 1 2.3-1.9L9 15'/%3E%3C/svg%3E");
  animation:hpHand 1.8s ease-in-out infinite; }
@keyframes hpHand{ 0%,100%{ transform:translateX(4px); } 50%{ transform:translateX(-6px) rotate(-8deg); } }
.hp-slider-nav{ display:flex; align-items:center; gap:8px; margin-left:auto; }
.hp-slider-count{ font-size:12px; color:var(--mist); margin-right:4px; min-width:56px; text-align:right; }
.hp-arrow{ appearance:none; width:44px; height:44px; border-radius:50%; display:grid; place-items:center; cursor:pointer;
  border:1px solid var(--line); background:var(--panel); color:inherit; transition:transform .25s, background .25s, opacity .25s, border-color .25s; }
html[data-theme="light"] .hp-arrow{ background:#fff; border-color:rgba(15,23,42,.1); }
.hp-arrow svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.hp-arrow:hover{ transform:scale(1.08); border-color:#3D5AFE; }
.hp-arrow[data-hp-next]:not(:disabled){ background:linear-gradient(135deg,#3D5AFE,#A855F7); color:#fff; border-color:transparent; box-shadow:0 8px 22px rgba(61,90,254,.3); }
.hp-arrow:disabled{ opacity:.35; cursor:default; transform:none; }
.hp-arrow:focus-visible{ outline:2px solid var(--cyan); outline-offset:3px; }
.hp-slider-view{ position:relative; margin:0 -8px; }
.hp-slider-view::before,.hp-slider-view::after{ content:""; position:absolute; top:0; bottom:0; width:34px; z-index:2; pointer-events:none; transition:opacity .3s; }
.hp-slider-view::before{ left:0; background:linear-gradient(90deg, var(--void), transparent); opacity:0; }
.hp-slider-view::after{ right:0; background:linear-gradient(270deg, var(--void), transparent); }
html[data-theme="light"] .hp-slider-view::before{ background:linear-gradient(90deg, #f4f6fc, transparent); }
html[data-theme="light"] .hp-slider-view::after{ background:linear-gradient(270deg, #f4f6fc, transparent); }
.hp-slider.at-start .hp-slider-view::before{ opacity:0; } .hp-slider:not(.at-start) .hp-slider-view::before{ opacity:1; }
.hp-slider.at-end .hp-slider-view::after{ opacity:0; }
.hp-pk-track{ display:flex !important; gap:16px; overflow-x:auto; overflow-y:visible; scroll-snap-type:x mandatory; scroll-behavior:smooth; scrollbar-width:none;
  padding:8px 8px 18px 0; cursor:grab; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
/* dx-perf-2026-10c: no left padding, so the first card already sits on a snap point when the page
   opens. With 8px the browser scrolled the slider by itself during loading, Chrome took that as a
   visitor scroll and stopped measuring "Largest Contentful Paint" (PageSpeed: NO_LCP, no score). */
.hp-pk-track::-webkit-scrollbar{ display:none; }
.hp-pk-track.is-drag{ cursor:grabbing; scroll-snap-type:none; scroll-behavior:auto; }
.hp-pk-track.is-drag *{ user-select:none; pointer-events:none; }
.hp-pk-track:focus-visible{ outline:2px solid var(--cyan); outline-offset:4px; border-radius:24px; }
.hp-pk-track .hp-pk{ flex:0 0 clamp(270px, calc((100% - 32px) / 3), 420px); scroll-snap-align:start; grid-column:auto !important;
  transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s, opacity .45s; }
.hp-pk-track .hp-pk:hover{ transform:translateY(-6px); box-shadow:0 22px 50px rgba(61,90,254,.14); }
.hp-pk-track .hp-pk-for{ min-height:3.2em; }
.hp-dots{ display:flex; justify-content:center; gap:8px; margin-top:6px; }
.hp-dots i{ width:8px; height:8px; border-radius:999px; background:color-mix(in srgb, var(--mist) 35%, transparent); transition:width .35s, background .35s; }
.hp-dots i.on{ width:26px; background:linear-gradient(90deg,#3D5AFE,#A855F7); }
@media (max-width:900px){ .hp-pk-track .hp-pk{ flex-basis:min(330px, 82vw); } .hp-slider-count{ display:none; } }
@media (max-width:560px){ .hp-swipe{ font-size:12px; } .hp-arrow{ width:40px; height:40px; } }
@media (min-width:2200px){ .hp-slider{ max-width:min(90vw, 1320px + 20vw); } .hp-pk-track .hp-pk{ flex-basis:calc((100% - 32px) / 3); max-width:none; } }
@media (prefers-reduced-motion:reduce){ .hp-swipe-hand::before{ animation:none; } .hp-pk-track{ scroll-behavior:auto; } }

/* phones: the marketing block is covered by the "Ads & social media" service card */
@media (max-width:760px){ #performance-marketing{ display:none; } }

/* projects line: cards with a website link (dx-home-clients-2026-10) */
.hp-work-link{ display:flex; align-items:center; gap:inherit; color:inherit !important; text-decoration:none; }
.hp-work:has(.hp-work-link){ padding:0; } .hp-work-link{ padding:12px 18px 12px 14px; }
@media (max-width:600px){ .hp-work-link{ padding:9px 14px 9px 10px; } }
.hp-work-go{ font-style:normal; font-size:13px; color:var(--k1); margin-left:2px; transition:transform .25s; }
.hp-work:hover .hp-work-go{ transform:translate(2px,-2px); }
.hp-work-link:focus-visible{ outline:2px solid var(--k1); outline-offset:3px; border-radius:999px; }