/* Q-DASH design system */
:root {
  --qd-navy: #17283A;
  --qd-navy-dark: #0D1B2A;
  --qd-navy-soft: #21384F;
  --qd-orange: #F15A24;
  --qd-orange-hover: #D94B18;
  --qd-white: #FFFFFF;
  --qd-bg: #F5F7FA;
  --qd-surface: #FFFFFF;
  --qd-surface-soft: #EEF3F8;
  --qd-text: #172033;
  --qd-muted: #64748B;
  --qd-border: #DCE4EC;
  --qd-success: #08A05C;
  --qd-blue: #2457D6;
  --qd-radius-sm: 12px;
  --qd-radius-md: 18px;
  --qd-radius-lg: 24px;
  --qd-radius: var(--qd-radius-md);
  --qd-shadow-sm: 0 8px 24px rgba(23, 40, 58, .08);
  --qd-shadow-md: 0 18px 44px rgba(23, 40, 58, .12);
  --qd-shadow: var(--qd-shadow-md);
}

/* Arabic font support and RTL improvements */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700&display=swap');

* {
  font-family: 'Cairo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
  overflow-x: hidden;
}

body { color: var(--qd-text); background: var(--qd-white); }
body { overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
.form-trap {
  position:fixed!important;
  inset:0 auto auto 0!important;
  width:1px!important;
  height:1px!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:none!important;
}
.form-trap>*{
  position:absolute!important;
  inset:0!important;
  box-sizing:border-box!important;
  width:1px!important;
  max-width:1px!important;
  min-width:0!important;
  height:1px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  clip-path:inset(50%)!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:none!important;
}
.icon-fallback { display:inline-block; width:1em; height:1em; border:2px solid currentColor; border-radius:50%; opacity:.45; }
body > header { border-color: var(--qd-border) !important; }
body > header h1 { color: var(--qd-navy) !important; letter-spacing: -.04em; }
body > header h1::after { content: " powered by Q-DASH"; color: var(--qd-muted); font-size: .55rem; font-weight: 600; letter-spacing: 0; display: block; }
body > header [data-lucide="message-square"] { color: var(--qd-orange) !important; }

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(36, 87, 214, .35);
  outline-offset: 3px;
}

#home { min-height: 680px; max-height: 860px; background: var(--qd-navy); }
#home .hero-slide { background-color: var(--qd-navy); }
#home h1 { text-wrap: balance; letter-spacing: -.035em; }
#home p { max-width: 760px; }

section { position: relative; }
section.bg-gray-50 { background-color: var(--qd-bg) !important; }
section h2 { color: var(--qd-navy) !important; letter-spacing: -.025em; text-wrap: balance; }

.bg-blue-700, .bg-blue-600 { background-color: var(--qd-navy) !important; }
.hover\:bg-blue-800:hover, .hover\:bg-blue-700:hover { background-color: var(--qd-navy) !important; }
.bg-orange-600, .bg-orange-500 { background-color: var(--qd-orange) !important; }
.bg-green-600 { background-color: var(--qd-success) !important; }
.text-blue-700, .text-blue-600 { color: var(--qd-navy) !important; }
.text-orange-600, .text-orange-500 { color: var(--qd-orange) !important; }

.rounded-lg, .rounded-xl, .rounded-2xl { border-radius: var(--qd-radius) !important; }
.shadow-lg, .shadow-xl { box-shadow: var(--qd-shadow) !important; }

#features .bg-white, #services .bg-white, #pricing .bg-white {
  border: 1px solid var(--qd-border);
  box-shadow: 0 10px 30px rgba(23, 40, 58, .06) !important;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
#features .bg-white:hover, #services .bg-white:hover, #pricing .bg-white:hover {
  transform: translateY(-4px);
  border-color: rgba(36, 87, 214, .24);
  box-shadow: var(--qd-shadow) !important;
}

footer { background: var(--qd-navy) !important; }

@media (max-width: 767px) {
  body > header .h-16 { height: 4.5rem; }
  body > header .flex.space-x-3 > a:not(:first-child) { display: none; }
  #home { height: auto !important; min-height: 720px; }
  #home .hero-slide { min-height: 720px; }
  #home h1 { font-size: 2.35rem !important; }
  section { padding-top: 4rem !important; padding-bottom: 4rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .motion-item, .motion-card, .reveal-item { opacity: 1 !important; transform: none !important; }
  .qd-card-details { max-height:none; opacity:1; transform:none; }
}

.qd-container { width: min(1180px, calc(100% - 2rem)); margin-inline: auto; }
.qd-section { padding: 5.5rem 0; }
.qd-section-muted { background: var(--qd-bg); }
.qd-section-dark { color: #fff; background: linear-gradient(135deg, var(--qd-navy), #0d1d2d); }
.qd-heading { max-width: 760px; margin: 0 auto 3rem; text-align: center; }
.qd-heading > span, .article-kicker { display: inline-block; margin-bottom: .7rem; color: var(--qd-orange); font-size: .82rem; font-weight: 800; letter-spacing: .06em; }
.qd-heading::after { content:""; display:block; width:54px; height:3px; margin:1.2rem auto 0; background:var(--qd-orange); border-radius:999px; transform:scaleX(0); transition:transform .5s ease .15s; }
.qd-heading.is-visible::after { transform:scaleX(1); }
.qd-heading h2 { margin: 0 0 1rem; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.25; }
.qd-heading p { margin: 0; color: var(--qd-muted); font-size: 1.08rem; line-height: 1.9; }
.qd-heading-light h2, .qd-heading-light p { color: #fff !important; }
.qd-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .75rem 1.3rem; border-radius: 12px; font-weight: 800; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease; }
.qd-button:hover { transform: translateY(-2px); }
.qd-button-primary { color: #fff; background: var(--qd-orange); box-shadow: 0 10px 22px rgba(241,90,36,.22); }
.qd-button-secondary { color: #fff; background: var(--qd-navy); }
.qd-button-light { color: var(--qd-navy); background: #fff; border: 1px solid var(--qd-border); }
.qd-icon { display: grid; width: 48px; height: 48px; place-items: center; color: var(--qd-blue); background: rgba(36,87,214,.08); border-radius: 14px; }
.qd-icon svg { width: 24px; height: 24px; transition: transform .2s ease; }
.qd-grid, .sector-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:stretch; }
.qd-card, .sector-card, .article-card { position:relative; min-width:0; padding:1.4rem; background:var(--qd-surface); border:1px solid var(--qd-border); border-radius:var(--qd-radius-md); box-shadow:var(--qd-shadow-sm); transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease; }
.qd-card::after, .sector-card::after, .article-card::after { content:""; position:absolute; inset-inline-start:1.4rem; bottom:0; width:0; height:3px; background:var(--qd-orange); border-radius:999px; transition:width .24s ease; }
.qd-card:hover, .sector-card:hover, .article-card:hover { transform:translateY(-6px); border-color:rgba(241,90,36,.45); box-shadow:var(--qd-shadow-md); }
.qd-card:hover::after, .sector-card:hover::after, .article-card:hover::after { width:54px; }
.sector-card:hover .qd-icon svg { transform: rotate(-5deg) scale(1.08); }
.sector-card h3 { margin: 1rem 0 .5rem; font-size: 1.05rem; }
.sector-card p { margin: 0 0 .7rem; color: var(--qd-muted); line-height: 1.75; }
.sector-card small { display: block; min-height: 3.2rem; color: #45566b; line-height: 1.6; }
.sector-card a, .article-more { display:inline-block; margin-top:1rem; color:var(--qd-orange); font-weight:800; text-decoration:none; }
.qd-card-toggle { padding:0; color:var(--qd-navy); background:transparent; border:0; font:inherit; font-weight:800; cursor:pointer; }
.qd-card-toggle::after { content:" +"; color:var(--qd-orange); }
.qd-card-toggle[aria-expanded="true"]::after { content:" −"; }
.qd-card-details { max-height:0; overflow:hidden; opacity:0; color:var(--qd-muted); line-height:1.7; transform:translateY(-4px); transition:max-height .32s ease,opacity .24s ease,transform .24s ease,margin .24s ease; }
.qd-card.is-expanded .qd-card-details { max-height:8rem; margin-top:.75rem; opacity:1; transform:none; }
@media (hover:hover) { .qd-card--interactive:hover .qd-card-details { max-height:8rem; margin-top:.75rem; opacity:1; transform:none; } }
.service-split { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.feature-panel { overflow: hidden; position: relative; padding: clamp(2rem,4vw,3.5rem); border: 1px solid var(--qd-border); border-radius: 26px; box-shadow: var(--qd-shadow); }
.feature-panel::after { content:""; position:absolute; inset:auto -70px -90px auto; width:220px; height:220px; border-radius:50%; background:currentColor; opacity:.035; }
.feature-panel-api { color: var(--qd-navy); background: linear-gradient(145deg,#fff,#eef4ff); }
.feature-panel-whatsapp { color: var(--qd-navy); background: linear-gradient(145deg,#fff,#edfff6); }
.feature-panel h2 { margin: 0 0 1rem; font-size: clamp(1.8rem,3vw,2.5rem); }
.feature-panel p { color: var(--qd-muted); line-height: 1.85; }
.check-list { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; padding: 0; margin: 1.5rem 0 2rem; list-style: none; }
.check-list li::before { content:"✓"; margin-inline-end:.5rem; color:var(--qd-green); font-weight:900; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; align-items:stretch; }
.benefit-card.qd-card--dark { display:flex; min-height:190px; flex-direction:column; justify-content:center; text-align:start; color:#fff; background:var(--qd-navy-soft); border-color:rgba(255,255,255,.13); box-shadow:0 12px 30px rgba(0,0,0,.16); }
.benefit-card .qd-icon { margin-bottom:1rem; color:#fff; background:var(--qd-orange); }
.benefit-card svg { width:25px; height:25px; margin:0; color:inherit; }
.benefit-card h3 { margin:0; color:#fff; font-size:1.08rem; line-height:1.6; }
.steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; padding:0; list-style:none; counter-reset:steps; }
.step-card { position:relative; padding:1.4rem 1rem; text-align:center; background:#fff; border:1px solid var(--qd-border); border-radius:18px; }
.step-card span { display:grid; width:38px; height:38px; margin:0 auto 1rem; place-items:center; color:#fff; background:var(--qd-blue); border-radius:50%; font-weight:900; }
.step-card h3 { margin:0; font-size:.96rem; line-height:1.6; }
.faq-layout { display:block; }
.faq-layout .qd-heading { position:static; margin:0 auto 2.5rem; text-align:center; }
.faq-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.2rem; align-items:start; }
.faq-item { margin-bottom:.75rem; background:#fff; border:1px solid var(--qd-border); border-radius:16px; }
.faq-item h3 { margin:0; }
.faq-item button { display:flex; width:100%; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem; border:0; color:var(--qd-navy); background:transparent; text-align:start; font:inherit; font-weight:800; cursor:pointer; }
.faq-symbol { font-size:1.4rem; transition:transform .2s ease; }
.faq-item button[aria-expanded="true"] .faq-symbol { transform:rotate(45deg); }
.faq-answer { display:grid; grid-template-rows:0fr; transition:grid-template-rows .25s ease; }
.faq-answer > p { overflow:hidden; margin:0; padding:0 1.2rem; color:var(--qd-muted); line-height:1.8; }
.faq-item.is-open .faq-answer { grid-template-rows:1fr; }
.faq-item.is-open .faq-answer > p { padding-bottom:1.2rem; }
.home-articles, .articles-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.2rem; align-items:stretch; }
.article-card-icon { display:grid; width:48px; height:48px; place-items:center; color:#fff; background:linear-gradient(135deg,var(--qd-blue),var(--qd-navy)); border-radius:14px; font-size:.72rem; font-weight:900; }
.article-card h2, .article-card h3 { margin:.65rem 0; font-size:1.18rem; line-height:1.55; }
.article-card h2 a, .article-card h3 a { color:var(--qd-navy); text-decoration:none; }
.article-card > p:not(.article-meta-line) { color:var(--qd-muted); line-height:1.75; }
.article-meta-line { margin:1rem 0 .2rem; color:var(--qd-muted); font-size:.78rem; }
.section-action { margin-top:2rem; text-align:center; }
.final-cta { color:#fff; background:var(--qd-blue); }
.final-cta-inner { display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.final-cta h2 { color:#fff !important; margin:.25rem 0; font-size:clamp(1.8rem,3vw,2.7rem); }
.cta-actions { display:flex; flex-wrap:wrap; gap:.75rem; }

.about-layout { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr); gap:3rem; align-items:center; }
.about-layout > div:first-child { max-width:690px; }
.about-values { padding:1.35rem; background:var(--qd-surface-soft); border:1px solid var(--qd-border); border-radius:var(--qd-radius-lg); }
.about-values-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.about-values-grid > div { position:relative; min-height:132px; padding:1.2rem; text-align:start; background:var(--qd-white); border:1px solid var(--qd-border); border-radius:var(--qd-radius-md); box-shadow:var(--qd-shadow-sm); }
.about-values-grid > div::before { content:""; position:absolute; inset-inline-start:0; top:1rem; bottom:1rem; width:3px; background:var(--qd-orange); border-radius:999px; }
.about-values-grid .text-blue-700 { color:var(--qd-navy)!important; font-size:1.5rem; }
.pricing-footer-cta { display:grid; grid-template-columns:1fr auto; align-items:center; gap:1.5rem; margin-top:1.5rem; padding:1.6rem 1.8rem; color:#fff; text-align:start; background:var(--qd-navy); border:1px solid rgba(241,90,36,.45); border-radius:var(--qd-radius-lg); box-shadow:var(--qd-shadow-md); }
.pricing-footer-cta h3 { margin:0 0 .35rem; color:#fff; }
.pricing-footer-cta p { margin:0; color:rgba(255,255,255,.76); }
.pricing-footer-cta .qd-button { grid-column:2; grid-row:1 / span 2; }
.steps-grid::before { content:""; position:absolute; top:2.6rem; inset-inline:7%; height:2px; z-index:0; background:linear-gradient(90deg,var(--qd-orange),var(--qd-navy)); transform:scaleX(0); transform-origin:center; animation:qdStepLine .8s ease .3s forwards; }
.steps-grid { position:relative; }
.step-card { z-index:1; }
@keyframes qdStepLine { to { transform:scaleX(1); } }
@keyframes qdWhatsappPulse { 0%,88%,100% { box-shadow:0 12px 32px rgba(22,163,74,.3); } 94% { box-shadow:0 12px 32px rgba(22,163,74,.3),0 0 0 10px rgba(8,160,92,.12); } }
.whatsapp-float { animation:qdWhatsappPulse 6s ease-in-out infinite; }

/* Content and article pages */
.content-page { margin:0; background:var(--qd-bg); }
.content-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem max(1rem,calc((100% - 1180px)/2)); background:#fff; border-bottom:1px solid var(--qd-border); }
.content-nav { display:flex; flex-wrap:wrap; align-items:center; gap:1rem; }
.content-nav a { color:var(--qd-navy); text-decoration:none; font-weight:700; }
.content-nav a.active { color:var(--qd-blue); box-shadow:inset 0 -2px currentColor; }
.brand-link { color:var(--qd-navy); font-size:1.35rem; font-weight:900; text-decoration:none; }
.brand-link small { display:block; color:var(--qd-muted); font-size:.55rem; }
.content-page main { width:min(1180px,calc(100% - 2rem)); margin:auto; }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:.5rem; padding:1.2rem 0; color:var(--qd-muted); font-size:.85rem; }
.breadcrumbs a { color:var(--qd-blue); }
.content-hero, .article-header { padding:clamp(2.5rem,7vw,5.5rem) max(1rem,5vw); text-align:center; background:#fff; border:1px solid var(--qd-border); border-radius:24px; }
.content-hero h1, .article-header h1 { max-width:900px; margin:0 auto 1rem; color:var(--qd-navy); font-size:clamp(2.1rem,5vw,3.8rem); line-height:1.25; }
.content-hero > p, .article-lead { max-width:760px; margin:0 auto; color:var(--qd-muted); font-size:1.1rem; line-height:1.9; }
.article-search { display:block; max-width:560px; margin:2rem auto 0; text-align:start; }
.article-search span { display:block; margin-bottom:.5rem; font-weight:800; }
.article-search input { width:100%; padding:.9rem 1rem; border:1px solid var(--qd-border); border-radius:12px; font:inherit; }
.articles-grid { margin:2rem 0 5rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.article-meta { display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; margin-top:1.5rem; color:var(--qd-muted); font-size:.82rem; }
.article-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:2rem; padding:2rem 0 5rem; align-items:start; }
.article-cover { width:100%; margin-top:1.25rem; aspect-ratio:1200/630; object-fit:cover; border-radius:20px; }
.hero-slide.active h1,.hero-slide.active p,.hero-slide.active a { animation:qdHeroIn .6s ease both; }
.hero-slide.active p { animation-delay:.08s; }.hero-slide.active a { animation-delay:.15s; }
@keyframes qdHeroIn { from { opacity:0; transform:translateY(18px) } to { opacity:1; transform:none } }
.article-toc { position:sticky; top:1rem; padding:1.2rem; background:#fff; border:1px solid var(--qd-border); border-radius:16px; }
.article-sidebar { display:grid; gap:1rem; position:sticky; top:1rem; }
.article-sidebar .article-toc { position:static; }
.article-related { display:grid; gap:.75rem; padding:1.2rem; background:#fff; border:1px solid var(--qd-border); border-radius:16px; }
.article-related a { color:var(--qd-blue); text-decoration:none; font-size:.88rem; line-height:1.5; }
.author-card { display:flex; align-items:center; gap:1rem; margin:2rem 0; padding:1.2rem; background:var(--qd-bg); border-radius:16px; }
.author-avatar { display:grid; flex:0 0 52px; width:52px; height:52px; place-items:center; color:#fff; background:linear-gradient(135deg,var(--qd-orange),var(--qd-navy)); border-radius:50%; font-weight:900; }
.author-card p { margin:.25rem 0 0; font-size:.9rem; line-height:1.6; }
.article-toc ol { padding-inline-start:1.2rem; }
.article-toc li { margin:.65rem 0; }
.article-toc a { color:var(--qd-blue); text-decoration:none; }
.article-content { padding:clamp(1.4rem,4vw,3rem); background:#fff; border:1px solid var(--qd-border); border-radius:20px; }
.article-content section { margin-bottom:2.8rem; }
.article-content h2 { font-size:1.7rem; }
.article-content h3 { margin-top:1.5rem; }
.article-content p { color:#3d4d61; font-size:1.04rem; line-height:2; }
.article-cta { padding:2rem; background:var(--qd-bg); border-inline-start:4px solid var(--qd-orange); border-radius:16px; }

/* Progressive motion: content remains visible until JS opts in. */
.motion-ready .motion-item, .motion-ready .motion-card, .motion-ready .reveal-item { opacity:0; transform:translateY(22px) scale(.985); transition:opacity .52s cubic-bezier(.2,.7,.2,1),transform .52s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,border-color .25s ease; transition-delay:calc(var(--motion-order,0) * 65ms); }
.motion-ready .motion-item.is-visible, .motion-ready .motion-card.is-visible, .motion-ready .reveal-item.is-visible { opacity:1; transform:none; }
.motion-card { will-change:transform; }
.motion-card:hover { border-color:rgba(241,90,36,.38)!important; box-shadow:var(--qd-shadow-md)!important; }

@media (max-width: 900px) { .sector-grid,.home-articles,.benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .steps-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .articles-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 767px) { .qd-section{padding:4rem 0!important}.service-split,.faq-layout,.article-layout,.about-layout{grid-template-columns:1fr}.sector-grid,.home-articles,.benefit-grid,.articles-grid{grid-template-columns:1fr}.steps-grid{grid-template-columns:1fr}.steps-grid::before{display:none}.check-list{grid-template-columns:1fr}.faq-layout .qd-heading,.article-toc{position:static}.final-cta-inner{align-items:flex-start;flex-direction:column}.content-header{position:static}.content-hero,.article-header{border-radius:18px}.article-content{padding:1.25rem}.cta-actions,.cta-actions .qd-button{width:100%}.about-values-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pricing-footer-cta{grid-template-columns:1fr}.pricing-footer-cta .qd-button{grid-column:auto;grid-row:auto;width:100%} }

/* Ensure proper RTL text rendering */
[dir="rtl"] {
  text-align: right;
}
[dir="ltr"] { text-align:left; }
@media (max-width:1200px) { .faq-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .faq-list { grid-template-columns:1fr; } }

.whatsapp-widget { display:none!important; }
[dir="rtl"] .whatsapp-widget { left:max(20px, env(safe-area-inset-left, 0px)); right:auto; }
[dir="ltr"] .whatsapp-widget { right:max(20px, env(safe-area-inset-right, 0px)); left:auto; }
.whatsapp-float { display:grid; width:58px; height:58px; min-height:0; padding:0; place-items:center; border:0; border-radius:50%; color:#fff; background:#16a34a; box-shadow:0 12px 32px rgba(22,163,74,.34); cursor:pointer; transition:transform .2s ease,box-shadow .2s ease; }
.whatsapp-float:hover { transform:scale(1.06); box-shadow:0 16px 38px rgba(22,163,74,.42); }
.whatsapp-float svg { width:30px; height:30px; }
.whatsapp-chat { display:none; width:min(360px,calc(100vw - 32px)); overflow:hidden; background:#fff; border:1px solid var(--qd-border); border-radius:20px; box-shadow:0 22px 60px rgba(23,40,58,.22); }
.whatsapp-chat { max-height:calc(100dvh - 110px - env(safe-area-inset-bottom, 0px)); overflow-y:auto; overscroll-behavior:contain; }
.whatsapp-widget.is-open .whatsapp-chat { display:block; animation:qdHeroIn .2s ease both; }
.whatsapp-chat header { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.2rem; color:#fff; background:#128c7e; }
.whatsapp-chat header button { border:0; color:#fff; background:transparent; font-size:1.7rem; cursor:pointer; }
.whatsapp-chat-body { padding:1.2rem; background:#f1f7f5; }
.whatsapp-chat-body p { margin:0 0 .5rem; padding:1rem; background:#fff; border-radius:14px; line-height:1.7; }
.whatsapp-chat-body small { color:var(--qd-muted); }
.whatsapp-chat-action { display:block; margin:1rem; padding:.85rem; color:#fff; background:#16a34a; border-radius:12px; text-align:center; text-decoration:none; font-weight:800; }

/* Phase 3 visual refinement */
#home .hero-slide::before { content:""; position:absolute; inset:0; z-index:1; background:radial-gradient(circle at 18% 28%,rgba(241,90,36,.2),transparent 24%),linear-gradient(110deg,rgba(13,29,45,.96),rgba(23,40,58,.78)); }
#home .hero-slide > .absolute { z-index:0; }
#home .hero-slide > .relative { z-index:2; }
#home .hero-slide .text-center { max-width:850px; margin-inline:auto; }
#home h1 { text-shadow:0 4px 24px rgba(0,0,0,.22); }
.hero-trust { position:absolute; z-index:21; left:50%; transform:translateX(-50%); bottom:4.8rem; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:min(820px,calc(100% - 7rem)); padding:.75rem; color:#fff; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:18px; backdrop-filter:blur(14px); box-shadow:0 16px 40px rgba(0,0,0,.14); }
.hero-trust span { display:grid; gap:.15rem; padding:.35rem 1rem; text-align:center; font-size:.78rem; color:rgba(255,255,255,.78); }
.hero-trust span+span { border-inline-start:1px solid rgba(255,255,255,.16); }
.hero-trust strong { color:#fff; font-size:.95rem; }
.whatsapp-quick-options { display:flex; flex-wrap:wrap; gap:.45rem; margin:1rem 0; }
.whatsapp-quick-options button { padding:.45rem .7rem; color:var(--qd-navy); background:#fff; border:1px solid #cfe5dd; border-radius:999px; font:inherit; font-size:.75rem; font-weight:700; cursor:pointer; }
.whatsapp-message-label span { display:block; margin-bottom:.35rem; font-size:.78rem; font-weight:800; }
.whatsapp-message-label textarea { box-sizing:border-box; width:100%; resize:vertical; padding:.7rem; border:1px solid #cfe5dd; border-radius:12px; font:inherit; }
.pricing-request-link { display:block; margin-top:.75rem; color:var(--qd-blue); font-weight:800; text-align:center; text-decoration:none; }
.pricing-comparison { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:1rem; max-width:900px; margin:1.5rem auto 0; padding:1rem 1.2rem; background:var(--qd-bg); border:1px solid var(--qd-border); border-radius:16px; }
.pricing-comparison strong { color:var(--qd-navy); }
.pricing-comparison span { color:var(--qd-muted); }
.pricing-comparison a { color:#fff; background:var(--qd-navy); padding:.65rem 1rem; border-radius:999px; text-decoration:none; font-weight:800; }
.sms-usage-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; margin-top:.75rem; padding:1rem; color:var(--qd-muted); background:var(--qd-bg); border:1px solid var(--qd-border); border-radius:14px; font-size:.82rem; }
.sms-usage-summary strong { display:block; color:var(--qd-navy); font-size:1rem; }
.sms-usage-summary.is-multiple { border-color:rgba(241,90,36,.45); background:#fff7f2; }
.sms-usage-summary.is-high { border-color:#b84b3e; background:#fff1ef; }
@media(max-width:520px){.sms-usage-summary{grid-template-columns:1fr}}
.site-menu-toggle { display:none; border:0; cursor:pointer; }
@media (max-width:1180px) { .slider-prev,.slider-next { display:none!important; } }
@media (max-width:700px) { .hero-trust { bottom:5rem; width:calc(100% - 2rem); grid-template-columns:1fr; } .hero-trust span { display:none; } .hero-trust span:first-child { display:grid; } }
@media (max-width:700px) { .pricing-comparison { grid-template-columns:1fr; text-align:center; } }
@media (max-width:700px) { body { padding-bottom:calc(82px + env(safe-area-inset-bottom, 0px)); } .whatsapp-widget { inset-inline-end:16px; bottom:calc(22px + env(safe-area-inset-bottom, 0px)); } .whatsapp-float { width:52px; height:52px; } }

/* Booking page: current Q-DASH identity */
.booking-page .gradient-hero{background:linear-gradient(135deg,var(--qd-navy-dark),var(--qd-navy));border-bottom:4px solid var(--qd-orange)}
.booking-page .gradient-hero h1,.booking-page .gradient-hero p{color:#fff}.booking-page .text-blue-600,.booking-page .text-blue-700{color:var(--qd-navy)!important}.booking-page .bg-blue-600,.booking-page .bg-blue-700{background:var(--qd-orange)!important}.booking-page .hover\:bg-blue-700:hover{background:var(--qd-orange-hover)!important}
/* Booking plans selector: premium Q-DASH card system */
.booking-plans-panel{
  position:sticky;
  top:5.75rem;
  overflow:hidden;
  padding:1.15rem!important;
  border:1px solid rgba(23,40,58,.12)!important;
  border-top:4px solid var(--qd-orange)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%)!important;
  box-shadow:0 22px 55px rgba(23,40,58,.14)!important;
}
.booking-plans-panel>h3{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  margin:0 0 .45rem!important;
  padding:.15rem 0 1rem!important;
  color:var(--qd-navy)!important;
  border-bottom:1px solid var(--qd-border);
  text-align:center;
  font-size:1.05rem!important;
  font-weight:900!important;
}
.booking-plans-panel>h3+*{margin-top:.75rem}
.booking-plan-card{
  position:relative;
  display:flex!important;
  min-height:126px;
  margin:0 0 .85rem!important;
  padding:1rem 1.05rem!important;
  overflow:hidden;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.2rem;
  color:var(--qd-navy)!important;
  border:1.5px solid var(--qd-border)!important;
  border-radius:17px!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(23,40,58,.065);
  text-align:center!important;
  text-decoration:none;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
.booking-plan-card::before{
  content:"";
  position:absolute;
  inset-block:14px;
  inset-inline-start:0;
  width:4px;
  border-radius:0 5px 5px 0;
  background:transparent;
  transition:background .22s ease,transform .22s ease;
}
[dir="ltr"] .booking-plan-card::before{border-radius:5px 0 0 5px}
.booking-plan-card:hover{
  transform:translateY(-4px);
  border-color:rgba(241,90,36,.62)!important;
  background:#fffaf7!important;
  box-shadow:0 15px 32px rgba(23,40,58,.13);
}
.booking-plan-card:hover::before{background:var(--qd-orange);transform:scaleY(1.04)}
.booking-plan-card.is-selected{
  padding-inline-end:3rem!important;
  border-color:var(--qd-orange)!important;
  background:linear-gradient(145deg,#fff8f3 0%,#fff1e8 100%)!important;
  box-shadow:0 14px 32px rgba(241,90,36,.18),inset 0 0 0 1px rgba(241,90,36,.07)!important;
}
.booking-plan-card.is-selected::before{background:var(--qd-orange)}
.booking-plan-card.is-selected:after{
  content:"✓";
  position:absolute;
  top:.85rem;
  inset-inline-end:.85rem;
  display:grid;
  width:29px;
  height:29px;
  place-items:center;
  color:#fff;
  background:var(--qd-orange);
  border:3px solid #fff;
  border-radius:50%;
  box-shadow:0 5px 13px rgba(241,90,36,.3);
  font-size:.85rem;
  font-weight:900;
}
.booking-plan-card strong,
.booking-plan-card h4,
.booking-plan-card .font-bold{
  color:var(--qd-navy)!important;
  font-weight:900!important;
}
.booking-plan-card .text-blue-600,
.booking-plan-card .text-blue-700{
  margin:.15rem 0!important;
  color:var(--qd-orange)!important;
  font-size:1.18rem!important;
  font-weight:900!important;
}
.booking-plan-card p,
.booking-plan-card .text-gray-500,
.booking-plan-card .text-gray-600{
  color:var(--qd-muted)!important;
  line-height:1.55!important;
}
.booking-plan-card .bg-orange-500,
.booking-plan-card .bg-orange-600{
  position:absolute;
  top:.7rem;
  inset-inline-start:.7rem;
  padding:.25rem .55rem!important;
  color:#fff!important;
  background:var(--qd-orange)!important;
  border-radius:999px!important;
  box-shadow:0 5px 12px rgba(241,90,36,.2);
  font-size:.68rem!important;
  font-weight:900!important;
}
.booking-plans-panel .booking-plan-card:last-child{margin-bottom:0!important}
@media(max-width:1023px){
  .booking-plans-panel{position:relative;top:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
  .booking-plans-panel>h3,.booking-plans-panel>p{grid-column:1/-1}
  .booking-plan-card{margin:0!important;min-height:138px}
}
@media(max-width:760px){
  .booking-plans-panel{grid-template-columns:1fr;padding:1rem!important}
  .booking-plan-card{min-height:118px}
}
.booking-request-form input,.booking-request-form textarea{background:#fff;color:var(--qd-navy);border-color:#b9c4ce}.booking-request-form input:focus,.booking-request-form textarea:focus{outline:0;border-color:var(--qd-orange)!important;box-shadow:0 0 0 4px rgba(241,90,36,.13)!important}.booking-request-form input::placeholder,.booking-request-form textarea::placeholder{color:#718096;opacity:1}

/* Slider Styles */
.clients-slider, .projects-slider {
  display: flex;
  transition: transform 0.5s ease-in-out;
}

.clients-slider-container, .projects-slider-container {
  overflow: hidden;
  position: relative;
}

.client-slide, .project-slide {
  flex-shrink: 0;
}

/* Responsive slider widths */
@media (max-width: 639px) {
  .client-slide {
    width: 50%; /* 2 slides per row on mobile */
  }
  .project-slide {
    width: 100%; /* 1 slide per row on mobile */
  }
}

@media (min-width: 640px) and (max-width: 767px) {
  .client-slide {
    width: 33.333333%; /* 3 slides per row on small screens */
  }
  .project-slide {
    width: 50%; /* 2 slides per row on small screens */
  }
}

@media (min-width: 768px) {
  .client-slide {
    width: 25%; /* 4 slides per row on desktop */
  }
  .project-slide {
    width: 33.333333%; /* 3 slides per row on desktop */
  }
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Animation utilities */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out;
}

/* Smooth transitions for all interactive elements */
* {
  transition: all 0.2s ease-in-out;
}

/* Hover effects for cards */
.card-hover:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Button hover effects */
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Gradient text effect */
.gradient-text {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Loading animation */
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: .5;
  }
}

.animate-pulse {
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

/* Mobile menu styles */
.mobile-menu {
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}

.mobile-menu.open {
  transform: translateX(0);
}

/* Custom focus styles for accessibility */
button:focus,
a:focus {
  outline: 2px solid #3b82f6;
  outline-offset: 2px;
}

/* Print styles */
@media print {
  header,
  footer,
  button {
    display: none !important;
  }
  
  body {
    font-size: 12pt;
    line-height: 1.4;
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  .bg-gray-50 {
    background-color: #ffffff !important;
  }
  
  .text-gray-600 {
    color: #000000 !important;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  
  html {
    scroll-behavior: auto;
  }
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
  .dark-mode-auto {
    background-color: #1f2937;
    color: #f9fafb;
  }
  
  .dark-mode-auto .bg-white {
    background-color: #374151;
  }
  
  .dark-mode-auto .text-gray-900 {
    color: #f9fafb;
  }
  
  .dark-mode-auto .text-gray-600 {
    color: #d1d5db;
  }
}

/* Custom utility classes */
.text-gradient {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.bg-gradient-primary {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.shadow-custom {
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Responsive typography */
@media (max-width: 640px) {
  h1 {
    font-size: 2rem;
  }
  
  h2 {
    font-size: 1.5rem;
  }
  
  p {
    font-size: 0.875rem;
  }
}

/* Custom animations */
@keyframes slideInFromRight {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideInFromLeft {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

.slide-in-right {
  animation: slideInFromRight 0.6s ease-out;
}

.slide-in-left {
  animation: slideInFromLeft 0.6s ease-out;
}

/* Sticky header styles */
.sticky-header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 50;
  backdrop-filter: blur(10px);
  background-color: rgba(255, 255, 255, 0.95);
}

/* Custom form styles */
.form-input {
  border: 2px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  transition: border-color 0.2s ease-in-out;
}

.form-input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* Custom button styles */
.btn-custom {
  position: relative;
  overflow: hidden;
}

.btn-custom::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s;
}

.btn-custom:hover::before {
  left: 100%;
}

/* Card hover effects */
.feature-card {
  transition: all 0.3s ease;
  cursor: pointer;
}

.feature-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* Pricing card highlight */
.pricing-card-featured {
  position: relative;
  transform: scale(1.05);
  z-index: 10;
}

.pricing-card-featured::before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: linear-gradient(45deg, #f59e0b, #ef4444, #8b5cf6);
  border-radius: 1rem;
  z-index: -1;
}

/* Pricing Slider Styles */
.pricing-slider {
  display: flex;
  transition: transform 0.5s ease-in-out;
  width: 100%;
  /* Ensure proper RTL support */
  direction: ltr; /* Force LTR for slider calculations */
}

.pricing-slide {
  flex-shrink: 0;
  width: 100%;
  /* Ensure proper spacing */
  padding: 0 0.5rem;
}

@media (min-width: 640px) {
  .pricing-slide {
    width: 50%;
  }
}

@media (min-width: 768px) {
  .pricing-slide {
    width: 33.333333%;
  }
}

.pricing-slider-container {
  overflow: hidden;
  width: 100%;
  /* Ensure proper RTL support */
  direction: ltr; /* Force LTR for container */
}

/* RTL specific adjustments for pricing slider */
[dir="rtl"] .pricing-slider {
  /* In RTL, we need to ensure the slider works correctly */
  transform-origin: left center;
}

[dir="rtl"] .pricing-slider-container {
  /* Ensure proper overflow handling in RTL */
  direction: ltr;
}

/* Service icon animations */
.service-icon {
  transition: transform 0.3s ease;
}

.service-card:hover .service-icon {
  transform: scale(1.1) rotate(5deg);
}

/* Contact form styles */
.contact-form {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

/* Footer link hover effects */
.footer-link {
  transition: color 0.2s ease;
}

.footer-link:hover {
  color: #3b82f6;
}

/* Mobile navigation improvements */
@media (max-width: 768px) {
  .mobile-nav-toggle {
    display: block;
  }
  
  .desktop-nav {
    display: none;
  }
  
  .mobile-nav {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.9);
    backdrop-filter: blur(10px);
    z-index: 1000;
  }
}

/* Loading states */
.loading {
  position: relative;
}

.loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid #f3f3f3;
  border-top: 2px solid #3b82f6;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Success/Error message styles */
.message {
  padding: 1rem;
  border-radius: 0.5rem;
  margin: 1rem 0;
}

.message.success {
  background-color: #d1fae5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}

.message.error {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}

.message.info {
  background-color: #dbeafe;
  color: #1e40af;
  border: 1px solid #93c5fd;
}

/* Custom tooltip */
.tooltip {
  position: relative;
}

.tooltip::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #1f2937;
  color: white;
  padding: 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.tooltip:hover::before {
  opacity: 1;
}

/* Responsive grid improvements */
@media (max-width: 1024px) {
  .grid-cols-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .grid-cols-2,
  .grid-cols-3 {
    grid-template-columns: 1fr;
  }
}

/* Custom selection color */
::selection {
  background-color: #3b82f6;
  color: white;
}

::-moz-selection {
  background-color: #3b82f6;
  color: white;
}

/* Hero Slider Styles */
.hero-slider {
  position: relative;
  width: 100%;
  height: 100%;
}

.hero-slide {
  opacity: 0;
  visibility: hidden;
  transition: all 0.8s ease-in-out;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.hero-slide.active {
  opacity: 1;
  visibility: visible;
}

.hero-slide.prev {
  transform: translateX(-100%);
}

.hero-slide.next {
  transform: translateX(100%);
}

/* Slider controls */
.slider-dot {
  cursor: pointer;
  transition: all 0.3s ease;
}

.slider-dot.active {
  opacity: 1;
  transform: scale(1.2);
}

.slider-prev,
.slider-next {
  cursor: pointer;
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
}

.slider-prev:hover,
.slider-next:hover {
  transform: translateY(-50%) scale(1.1);
}

/* Background image support for slides */
.hero-slide[data-bg] {
  background-image: var(--bg-image);
}

/* Slide animations */
@keyframes slideInRight {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideInLeft {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideOutLeft {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(-100%);
    opacity: 0;
  }
}

@keyframes slideOutRight {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(100%);
    opacity: 0;
  }
}

.slide-in-right {
  animation: slideInRight 0.8s ease-out;
}

.slide-in-left {
  animation: slideInLeft 0.8s ease-out;
}

.slide-out-left {
  animation: slideOutLeft 0.8s ease-out;
}

.slide-out-right {
  animation: slideOutRight 0.8s ease-out;
}

/* Pause animation on hover */
.hero-slider:hover .hero-slide {
  animation-play-state: paused;
}

/* Mobile slider adjustments */
@media (max-width: 768px) {
  .slider-prev,
  .slider-next {
    width: 40px;
    height: 40px;
    padding: 8px;
  }
  
  .slider-prev {
    left: 10px;
  }
  
  .slider-next {
    right: 10px;
  }
  
  .slider-dot {
    width: 12px;
    height: 12px;
  }
}

/* Touch support for slider */
.hero-slider {
  touch-action: pan-y;
}

/* Accessibility improvements for slider */
.slider-dot:focus,
.slider-prev:focus,
.slider-next:focus {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

/* Slider progress indicator */
.slider-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  background: rgba(255, 255, 255, 0.3);
  width: 0%;
  transition: width 0.1s ease;
}

.slider-progress.active {
  background: rgba(255, 255, 255, 0.8);
}


/* ===== DASHSMS GLOBAL SHELL ===== */
:root{
  --dashsms-header-height:72px;
  --dashsms-navy:#17283a;
  --dashsms-orange:#f15a24;
}

html{
  scroll-padding-top:calc(var(--dashsms-header-height) + 16px);
}

body{
  padding-top:var(--dashsms-header-height) !important;
  transform:none!important;
  filter:none!important;
  perspective:none!important;
}

body.feature-card,
body.feature-card:hover,
body.animate-fade-in-up{
  transform:none!important;
  box-shadow:none!important;
  animation:none!important;
}

section[id]{
  scroll-margin-top:calc(var(--dashsms-header-height) + 16px);
}

.dashsms-global-header,
.dashsms-global-header *{
  box-sizing:border-box;
}

.dashsms-global-header{
  position:fixed;
  top:0;
  right:0;
  left:0;
  z-index:2147483000;
  height:var(--dashsms-header-height);
  background:rgba(255,255,255,.98);
  border-bottom:1px solid #e4eaf1;
  box-shadow:0 8px 24px rgba(23,40,58,.10);
  backdrop-filter:blur(14px);
}

.dashsms-global-header__inner{
  width:min(1280px, calc(100% - 32px));
  height:100%;
  margin:auto;
  display:flex;
  align-items:center;
  gap:22px;
  position:relative;
  min-width:0;
  isolation:isolate;
}

.dashsms-global-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--dashsms-navy);
  text-decoration:none;
  flex:0 0 auto;
}

.dashsms-global-brand__icon{
  width:26px;
  height:22px;
  border:3px solid var(--dashsms-orange);
  border-radius:4px;
  position:relative;
}

.dashsms-global-brand__icon::after{
  content:"";
  position:absolute;
  bottom:-7px;
  right:2px;
  width:8px;
  height:8px;
  border-left:3px solid var(--dashsms-orange);
  transform:skew(-28deg);
}

.dashsms-global-brand__text{
  display:grid;
  line-height:1;
}

.dashsms-global-brand__text strong{
  font-size:20px;
}

.dashsms-global-brand__text small{
  margin-top:6px;
  font-size:7px;
  letter-spacing:1.4px;
  color:#8290a3;
}

.dashsms-global-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex:1 1 auto;
  min-width:0;
  overflow:visible;
}

.dashsms-global-nav a{
  position:relative;
  padding:10px 12px;
  color:#536176;
  font-size:14px;
  font-weight:700;
  text-decoration:none;
  border-radius:10px;
  white-space:nowrap;
  min-width:max-content;
  flex-shrink:0;
  overflow:visible;
  text-overflow:clip;
  transition:.2s ease;
}

.dashsms-global-nav a:hover,
.dashsms-global-nav a.active,
.dashsms-global-nav a[aria-current="page"]{
  color:var(--dashsms-orange);
  background:#fff3ee;
}

.dashsms-global-nav a.active::after,
.dashsms-global-nav a[aria-current="page"]::after{
  content:"";
  position:absolute;
  right:12px;
  left:12px;
  bottom:2px;
  height:2px;
  border-radius:999px;
  background:var(--dashsms-orange);
}

.dashsms-global-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  min-width:max-content;
}

.dashsms-global-lang,
.dashsms-global-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border-radius:12px;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  flex-shrink:0;
}

.site-menu-toggle{
  width:42px;
  height:40px;
  padding:9px;
  flex:0 0 42px;
  border:1px solid #dfe5ec;
  border-radius:11px;
  color:var(--dashsms-navy);
  background:#fff;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:4px;
  position:relative;
  z-index:30;
  overflow:hidden;
  pointer-events:auto!important;
  touch-action:manipulation;
}

.site-menu-toggle svg{
  display:block!important;
  width:24px!important;
  height:24px!important;
  color:var(--dashsms-navy)!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}

.site-menu-toggle[aria-expanded="true"]{
  color:#fff;
  background:var(--dashsms-orange);
  border-color:var(--dashsms-orange);
}
.site-menu-toggle[aria-expanded="true"] svg{color:#fff!important}

.dashsms-skip-link{
  position:absolute;
  inset-block-start:0;
  inset-inline-start:1rem;
  z-index:2147483647;
  padding:.7rem 1rem;
  color:#fff;
  background:var(--dashsms-navy);
  border-radius:0 0 10px 10px;
  text-decoration:none;
  transform:translateY(-200%);
  transition:transform .16s ease;
}

.dashsms-skip-link:focus,
.dashsms-skip-link:focus-visible{
  transform:translateY(0);
}

.dashsms-global-lang{
  color:#425066;
  background:#f3f5f8;
}

.dashsms-global-cta--orange{
  color:#fff;
  background:var(--dashsms-orange);
}

.dashsms-global-cta--navy{
  color:#fff;
  background:var(--dashsms-navy);
}

.dashsms-floating-actions{
  position:fixed;
  inset-inline-start:20px;
  bottom:20px;
  z-index:2147483646;
  display:grid;
  gap:10px;
}

.dashsms-floating-action{
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  box-shadow:0 12px 30px rgba(23,40,58,.24);
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}

.dashsms-floating-action:hover{
  transform:translateY(-3px) scale(1.04);
  box-shadow:0 16px 36px rgba(23,40,58,.30);
}

.dashsms-floating-action svg{
  width:26px;
  height:26px;
}

.dashsms-floating-action--whatsapp{
  background:#18b663;
}

.dashsms-floating-action--phone{
  background:var(--dashsms-orange);
}

.dashsms-floating-contact{
  position:absolute!important;
  inset:0!important;
  z-index:2147483646!important;
  width:auto;
  height:auto;
  font-size:0;
  line-height:0;
  pointer-events:none;
  transform:none!important;
  filter:none!important;
  contain:none!important;
}

.dashsms-back-to-top{
  position:absolute;
  inset-inline-end:max(20px, env(safe-area-inset-right, 0px));
  bottom:max(88px, calc(88px + env(safe-area-inset-bottom, 0px)));
  z-index:2;
  width:46px;
  height:46px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
  color:#fff;
  background:var(--dashsms-navy);
  box-shadow:0 12px 30px rgba(23,40,58,.25);
  cursor:pointer;
  pointer-events:auto;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .2s ease, visibility .2s ease, transform .2s ease, background .2s ease;
}

.dashsms-back-to-top.is-visible{
  opacity:1;
  visibility:visible;
  transform:none;
}

.dashsms-back-to-top:hover{background:var(--dashsms-orange)}
.dashsms-back-to-top svg{width:24px;height:24px}
.dashsms-back-to-top:focus-visible{outline:3px solid rgba(241,90,36,.35);outline-offset:3px}

.dashsms-floating-whatsapp,
.dashsms-floating-phone{
  position:absolute!important;
  bottom:max(20px, env(safe-area-inset-bottom, 0px));
  z-index:1;
  width:54px;
  height:54px;
  padding:0;
  overflow:hidden;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#fff;
  text-decoration:none;
  font-size:0;
  line-height:0;
  box-shadow:0 12px 30px rgba(23,40,58,.25);
  pointer-events:auto;
}

.dashsms-floating-whatsapp{
  inset-inline-start:max(20px, env(safe-area-inset-left, 0px));
  inset-inline-end:auto;
  background:#18b663;
}

.dashsms-floating-phone{
  inset-inline-end:max(20px, env(safe-area-inset-right, 0px));
  inset-inline-start:auto;
  background:#f15a24;
}

.dashsms-floating-whatsapp svg,
.dashsms-floating-phone svg{
  width:26px!important;
  height:26px!important;
  flex:none;
}

.dashsms-floating-whatsapp span,
.dashsms-floating-phone span{
  display:none!important;
}

.dashsms-floating-actions,
.whatsapp-widget{
  display:none!important;
}

@media (max-width:1350px){
  .dashsms-global-actions .dashsms-global-cta--navy{display:none}
}

@media (max-width:1180px){
  .dashsms-global-header__inner{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
  }
  .dashsms-global-nav{
    position:absolute;
    inset-block-start:calc(100% + 1px);
    inset-inline:0;
    display:none;
    max-height:calc(100dvh - var(--dashsms-header-height) - 16px);
    padding:12px;
    overflow-y:auto;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    background:#fff;
    border:1px solid #e4eaf1;
    border-top:0;
    border-radius:0 0 16px 16px;
    box-shadow:0 18px 36px rgba(23,40,58,.16);
    z-index:20;
    visibility:hidden;
    opacity:0;
    pointer-events:none!important;
  }
  .dashsms-global-nav:not(.is-open){display:none!important}
  .dashsms-global-nav.is-open{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .dashsms-global-nav a{
    width:100%;
    min-width:0;
    padding:11px 13px;
    text-align:start;
  }
  .site-menu-toggle{display:flex!important}
}

@media (max-width:820px){
  :root{--dashsms-header-height:64px}
  .dashsms-global-header__inner{
    width:calc(100% - 20px);
    gap:10px;
  }
  .dashsms-global-brand__text small{display:none}
  .dashsms-global-brand__text strong{font-size:17px}
  .dashsms-global-nav{
    gap:4px;
  }
  .dashsms-global-nav a{
    padding:8px 9px;
    font-size:12px;
  }
  .dashsms-global-actions .dashsms-global-cta,
  .dashsms-global-lang{
    min-height:36px;
    padding:0 10px;
    font-size:11px;
  }
}

@media (max-width:620px){
  .dashsms-global-actions{
    gap:6px;
  }
  .dashsms-global-actions .dashsms-global-cta--orange{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  .dashsms-global-actions .dashsms-global-cta--navy{display:none!important}
  .dashsms-global-actions{position:relative;z-index:30}
  .dashsms-global-brand{min-width:0}
  .dashsms-global-brand__text{min-width:0}
  .dashsms-global-brand__text strong{white-space:nowrap}
  .dashsms-floating-actions{
    inset-inline-start:14px;
    bottom:14px;
  }
  .dashsms-floating-action{
    width:48px;
    height:48px;
  }
  .dashsms-floating-whatsapp,
  .dashsms-floating-phone{
    bottom:max(14px, env(safe-area-inset-bottom, 0px));
    width:48px;
    height:48px;
  }
  .dashsms-floating-whatsapp{inset-inline-start:max(14px, env(safe-area-inset-left, 0px))}
  .dashsms-floating-phone{inset-inline-end:max(14px, env(safe-area-inset-right, 0px))}
  .dashsms-back-to-top{
    inset-inline-end:max(14px, env(safe-area-inset-right, 0px));
    bottom:max(76px, calc(76px + env(safe-area-inset-bottom, 0px)));
    width:42px;
    height:42px;
  }
}

/* Mobile app experience only. Desktop and tablet remain unchanged. */
.dashsms-bottom-nav,.dashsms-install-sheet,.dashsms-mobile-booking{display:none}
@media (max-width:767px){
  :root{--dashsms-mobile-nav-height:68px}
  html,body{max-width:100%;overflow-x:hidden}
  html{scrollbar-width:none}
  html::-webkit-scrollbar{width:0;height:0}
  body{padding-bottom:calc(var(--dashsms-mobile-nav-height) + 28px + env(safe-area-inset-bottom,0px))!important}
  body>section,body>main{max-width:100%;overflow-x:clip}
  .qd-container,.max-w-7xl,.content-page main{width:calc(100% - 28px)!important;max-width:none!important;margin-inline:auto!important;padding-inline:0!important}
  .qd-section,#features,#services,#pricing,#clients,#projects{padding-block:52px!important}
  .mb-16,.mb-12{margin-bottom:28px!important}

  #features .grid,#services .grid,.sector-grid,.benefit-grid,.steps-grid,.home-articles,.articles-grid{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;width:100%!important
  }
  #features .grid>div,#services .grid>div,.sector-card,.benefit-card,.step-card,.article-card,.feature-panel{
    box-sizing:border-box!important;width:100%!important;min-width:0!important;margin:0!important;padding:22px!important;
    border:1px solid #e2e8f0!important;border-radius:18px!important;background:#fff!important;color:var(--dashsms-navy)!important;
    box-shadow:0 8px 24px rgba(23,40,58,.08)!important;transform:none!important;text-align:start!important
  }
  #features h3,#features p,#services h3,#services p,.sector-card h3,.sector-card p,.article-card h3,.article-card p{color:inherit!important;text-align:start!important}
  #features .grid>div>div,#features .grid>div>svg,#services .grid>div>svg,.sector-card .qd-icon{margin-inline:0!important}
  .sector-card a,.article-more,.pricing-request-link,.section-action .qd-button,.feature-panel .qd-button{
    display:flex!important;align-items:center;justify-content:center;width:100%!important;min-height:48px;padding:10px 14px!important;
    border-radius:12px!important;font-weight:700;text-align:center
  }

  .pricing-slider-container{overflow:visible!important}
  .pricing-slider{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;transform:none!important;width:100%!important}
  .pricing-slide{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:10px 0 0!important;transform:none!important}
  .pricing-slide>div{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:24px 20px!important;border-radius:18px!important;overflow-wrap:anywhere}
  .pricing-slide ul{padding-inline:0 18px!important;text-align:start!important}
  .pricing-slide a{min-height:48px;border-radius:12px!important;font-weight:700}
  #pricingPrev,#pricingNext,#pricingDots{display:none!important}

  .articles-viewport{overflow:visible!important;padding:0!important}
  .articles-track{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;transform:none!important}
  .article-slide{box-sizing:border-box!important;width:100%!important;min-width:0!important;padding:0!important}
  .articles-controls{display:none!important}
  .articles-grid{margin-bottom:32px!important}

  .clients-slider-container,.projects-slider-container{overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .clients-slider-container::-webkit-scrollbar,.projects-slider-container::-webkit-scrollbar{display:none}
  .clients-slider,.projects-slider{width:max-content!important;transform:none!important;gap:0}
  .client-slide,.project-slide{width:calc(100vw - 54px)!important;max-width:360px!important;padding:0 8px!important;scroll-snap-align:start}
  .client-slide>div,.project-slide>div{border:1px solid #e2e8f0!important;border-radius:18px!important;box-shadow:0 8px 24px rgba(23,40,58,.08)!important}

  .dashsms-global-header{padding-top:env(safe-area-inset-top,0px)!important;height:calc(64px + env(safe-area-inset-top,0px))!important}
  .dashsms-mobile-booking{display:flex!important;align-items:center;justify-content:center;min-height:48px!important;color:#fff!important;background:var(--dashsms-orange)!important}
  .dashsms-bottom-nav{
    position:fixed;inset-inline:0;bottom:0;z-index:2147483600;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
    min-height:var(--dashsms-mobile-nav-height);padding:6px 5px env(safe-area-inset-bottom,0px);background:rgba(255,255,255,.98);
    border-top:1px solid #dfe5ec;box-shadow:0 -8px 24px rgba(23,40,58,.12);pointer-events:auto
  }
  .dashsms-bottom-nav a,.dashsms-bottom-nav button{display:flex;min-width:0;min-height:54px;padding:4px 2px;align-items:center;justify-content:center;flex-direction:column;gap:2px;border:0;border-radius:10px;color:#64748b;background:transparent;text-decoration:none;font:inherit;cursor:pointer}
  .dashsms-bottom-nav span{font-size:20px;line-height:1}.dashsms-bottom-nav small{max-width:100%;overflow:hidden;font-size:10px;font-weight:700;white-space:nowrap;text-overflow:ellipsis}
  .dashsms-bottom-nav .active,.dashsms-bottom-nav [aria-current=page]{color:var(--dashsms-orange);background:#fff3ee}
  .dashsms-bottom-nav :focus-visible{outline:3px solid rgba(241,90,36,.3);outline-offset:-2px}

  .dashsms-floating-whatsapp{left:max(14px,env(safe-area-inset-left,0px))!important;right:auto!important;bottom:calc(var(--dashsms-mobile-nav-height) + 14px + env(safe-area-inset-bottom,0px))!important}
  .dashsms-floating-phone{right:max(14px,env(safe-area-inset-right,0px))!important;left:auto!important;bottom:calc(var(--dashsms-mobile-nav-height) + 14px + env(safe-area-inset-bottom,0px))!important}
  .dashsms-back-to-top{inset-inline-end:auto!important;right:max(14px,env(safe-area-inset-right,0px))!important;bottom:calc(var(--dashsms-mobile-nav-height) + 76px + env(safe-area-inset-bottom,0px))!important}

  .dashsms-install-sheet[hidden]{display:none!important}
  .dashsms-install-sheet{
    position:fixed;inset-inline:14px;bottom:calc(var(--dashsms-mobile-nav-height) + 12px + env(safe-area-inset-bottom,0px));z-index:2147483647;
    display:grid;grid-template-columns:48px 1fr;gap:12px;padding:18px;color:var(--dashsms-navy);background:#fff;border:1px solid #dfe5ec;border-radius:20px;
    box-shadow:0 24px 70px rgba(23,40,58,.24);pointer-events:auto;text-align:start
  }
  .dashsms-install-icon{display:grid;width:48px;height:48px;place-items:center;color:#fff;background:var(--dashsms-orange);border-radius:14px;font-weight:800;font-size:22px}
  .dashsms-install-sheet h2{margin:0 0 5px;font-size:17px}.dashsms-install-sheet p{margin:0;color:#64748b;font-size:13px;line-height:1.6}
  .dashsms-install-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .dashsms-install-actions button{min-height:48px;border:0;border-radius:12px;font:inherit;font-weight:700;cursor:pointer}
  .dashsms-install-actions button:first-child{color:#fff;background:var(--dashsms-orange)}.dashsms-install-actions button:last-child{color:var(--dashsms-navy);background:#eef2f6}
  .dashsms-install-close{position:absolute;top:7px;inset-inline-end:8px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;font-size:24px;cursor:pointer}

  /* Booking: never retain desktop grid width or RTL horizontal offset on phones. */
  body.booking-page{width:100%!important;min-width:0!important;overflow-x:hidden!important}
  body.booking-page>.gradient-hero,
  body.booking-page>.max-w-6xl,
  body.booking-page>footer{
    box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
    margin-inline:0!important;inset-inline:auto!important;transform:none!important
  }
  body.booking-page>.max-w-6xl{padding:24px 14px!important}
  body.booking-page>.max-w-6xl>.grid{
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:16px!important;
    width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;transform:none!important
  }
  body.booking-page>.max-w-6xl>.grid>div,
  body.booking-page .booking-plans-panel,
  body.booking-page .booking-request-form,
  body.booking-page .booking-request-form> :not(.form-trap),
  body.booking-page .booking-plan-card{
    box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important;
    margin-inline:0!important;left:auto!important;right:auto!important;transform:none!important
  }
  body.booking-page .booking-plans-panel{position:static!important;padding:18px!important}
  body.booking-page .booking-request-form{padding:18px!important;overflow:hidden!important}
  body.booking-page .booking-request-form input,
  body.booking-page .booking-request-form textarea,
  body.booking-page .booking-request-form select,
  body.booking-page .booking-request-form button{
    box-sizing:border-box!important;width:100%!important;max-width:100%!important;min-width:0!important
  }
  body.booking-page .booking-request-form textarea{resize:vertical!important}
  body.booking-page .booking-request-form>.form-trap{
    position:fixed!important;inset:0 auto auto 0!important;width:1px!important;max-width:1px!important;height:1px!important;
    margin:0!important;padding:0!important;clip-path:inset(50%)!important;overflow:hidden!important;pointer-events:none!important
  }
}