{"id":44,"date":"2026-11-15T17:05:52","date_gmt":"2026-11-15T17:05:52","guid":{"rendered":"https:\/\/tsandesh.com.np\/?page_id=44"},"modified":"2026-11-15T17:30:22","modified_gmt":"2026-11-15T17:30:22","slug":"website","status":"publish","type":"page","link":"https:\/\/tsandesh.com.np\/","title":{"rendered":"website"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"44\" class=\"elementor elementor-44\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-660eb6f elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"660eb6f\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-0d2e059\" data-id=\"0d2e059\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-db40173 elementor-widget elementor-widget-html\" data-id=\"db40173\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n  <meta charset=\"UTF-8\" \/>\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\r\n  <title>Sandesh \u2014 Digital Marketing & Technology Agency Nepal<\/title>\r\n  <meta name=\"description\" content=\"Sandesh is a performance-focused digital marketing and technology agency in Nepal offering web development, SEO, paid ads, branding, AI automation and e-commerce solutions.\" \/>\r\n  <meta name=\"robots\" content=\"index, follow\" \/>\r\n  <link rel=\"canonical\" href=\"https:\/\/tsandesh.com.np\/\" \/>\r\n  <meta name=\"theme-color\" content=\"#ffffff\" \/>\r\n\r\n  <meta property=\"og:title\" content=\"Sandesh \u2014 Digital Marketing & Technology Agency\" \/>\r\n  <meta property=\"og:description\" content=\"Web, marketing, creative and automation systems designed to turn attention into measurable growth.\" \/>\r\n  <meta property=\"og:url\" content=\"https:\/\/tsandesh.com.np\/\" \/>\r\n  <meta property=\"og:type\" content=\"website\" \/>\r\n  <meta name=\"twitter:card\" content=\"summary_large_image\" \/>\r\n\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\r\n  <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap\" rel=\"stylesheet\" \/>\r\n\r\n  <script type=\"application\/ld+json\">\r\n  {\r\n    \"@context\": \"https:\/\/schema.org\",\r\n    \"@type\": \"ProfessionalService\",\r\n    \"name\": \"Sandesh\",\r\n    \"description\": \"Digital marketing and technology agency in Nepal offering SEO, web development, social media, paid ads, AI automation and branding.\",\r\n    \"url\": \"https:\/\/tsandesh.com.np\/\",\r\n    \"telephone\": \"+977-9866275931\",\r\n    \"email\": \"info@tsandesh.com.np\",\r\n    \"address\": {\r\n      \"@type\": \"PostalAddress\",\r\n      \"addressLocality\": \"Kathmandu\",\r\n      \"addressCountry\": \"Nepal\"\r\n    },\r\n    \"sameAs\": [\r\n      \"https:\/\/www.facebook.com\/profile.php?id=61571086033511\",\r\n      \"https:\/\/www.instagram.com\/tsandesh\",\r\n      \"https:\/\/www.linkedin.com\/in\/sandeshthapa007\/\"\r\n    ],\r\n    \"priceRange\": \"$$\",\r\n    \"openingHours\": \"Mo-Su 09:00-18:00\"\r\n  }\r\n  <\/script>\r\n\r\n  <style>\r\n    :root {\r\n      --ink: #101114;\r\n      --ink-2: #35373d;\r\n      --muted: #70727a;\r\n      --paper: #f7f5f1;\r\n      --white: #ffffff;\r\n      --line: #dedbd5;\r\n      --red: #d9282f;\r\n      --red-dark: #b91d24;\r\n      --red-soft: #fff0f0;\r\n      --green: #25d366;\r\n      --radius-sm: 14px;\r\n      --radius: 22px;\r\n      --radius-lg: 34px;\r\n      --shadow: 0 24px 70px rgba(16, 17, 20, 0.08);\r\n      --max: 1180px;\r\n      --nav-h: 78px;\r\n      --font-body: \"DM Sans\", system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n      --font-display: \"Manrope\", var(--font-body);\r\n    }\r\n\r\n    * { box-sizing: border-box; }\r\n    html { scroll-behavior: smooth; }\r\n    body {\r\n      margin: 0;\r\n      font-family: var(--font-body);\r\n      color: var(--ink);\r\n      background: var(--paper);\r\n      line-height: 1.65;\r\n      overflow-x: hidden;\r\n      -webkit-font-smoothing: antialiased;\r\n    }\r\n    body.menu-open { overflow: hidden; }\r\n    a { color: inherit; text-decoration: none; }\r\n    button, input, select, textarea { font: inherit; }\r\n    button { cursor: pointer; }\r\n    img { max-width: 100%; display: block; }\r\n    ::selection { background: var(--red); color: #fff; }\r\n\r\n    .container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }\r\n    .section { padding: 112px 0; }\r\n    .section-tight { padding: 76px 0; }\r\n    .kicker {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 10px;\r\n      margin-bottom: 18px;\r\n      color: var(--red);\r\n      font-size: 12px;\r\n      font-weight: 800;\r\n      letter-spacing: .16em;\r\n      text-transform: uppercase;\r\n    }\r\n    .kicker::before { content: \"\"; width: 26px; height: 2px; background: currentColor; }\r\n    .display {\r\n      margin: 0;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(42px, 6vw, 82px);\r\n      line-height: .98;\r\n      letter-spacing: -.055em;\r\n      font-weight: 800;\r\n    }\r\n    .section-title {\r\n      margin: 0;\r\n      max-width: 820px;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(34px, 4.7vw, 58px);\r\n      line-height: 1.03;\r\n      letter-spacing: -.045em;\r\n      font-weight: 800;\r\n    }\r\n    .section-lead { max-width: 690px; margin: 22px 0 0; color: var(--muted); font-size: 18px; }\r\n    .accent { color: var(--red); }\r\n\r\n    .btn {\r\n      min-height: 52px;\r\n      display: inline-flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      gap: 10px;\r\n      border: 1px solid transparent;\r\n      border-radius: 999px;\r\n      padding: 0 24px;\r\n      font-weight: 800;\r\n      transition: transform .25s ease, box-shadow .25s ease, background .25s ease, color .25s ease, border-color .25s ease;\r\n    }\r\n    .btn:hover { transform: translateY(-2px); }\r\n    .btn-primary { background: var(--red); color: #fff; box-shadow: 0 14px 34px rgba(217, 40, 47, .24); }\r\n    .btn-primary:hover { background: var(--red-dark); box-shadow: 0 18px 42px rgba(217, 40, 47, .3); }\r\n    .btn-dark { background: var(--ink); color: #fff; }\r\n    .btn-dark:hover { background: #27282d; }\r\n    .btn-ghost { background: transparent; border-color: #c9c6c0; color: var(--ink); }\r\n    .btn-ghost:hover { border-color: var(--ink); background: #fff; }\r\n    .btn-light { background: #fff; color: var(--ink); }\r\n\r\n    \/* Nav *\/\r\n    .site-nav {\r\n      position: fixed;\r\n      inset: 0 0 auto;\r\n      height: var(--nav-h);\r\n      z-index: 1000;\r\n      display: flex;\r\n      align-items: center;\r\n      transition: background .25s ease, border-color .25s ease, box-shadow .25s ease;\r\n      border-bottom: 1px solid transparent;\r\n    }\r\n    .site-nav.scrolled {\r\n      background: rgba(247, 245, 241, .9);\r\n      backdrop-filter: blur(18px);\r\n      border-bottom-color: rgba(16, 17, 20, .08);\r\n      box-shadow: 0 10px 40px rgba(16,17,20,.05);\r\n    }\r\n    .nav-inner { width: min(var(--max), calc(100% - 40px)); margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 28px; }\r\n    .brand { display: inline-flex; align-items: center; gap: 11px; font-family: var(--font-display); font-size: 25px; font-weight: 800; letter-spacing: -.04em; }\r\n    .brand-mark { position: relative; width: 28px; height: 28px; border-radius: 9px; background: var(--red); transform: rotate(-8deg); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }\r\n    .brand-mark::before, .brand-mark::after { content: \"\"; position: absolute; background: #fff; border-radius: 999px; }\r\n    .brand-mark::before { width: 13px; height: 4px; left: 7px; top: 8px; }\r\n    .brand-mark::after { width: 8px; height: 4px; left: 7px; top: 15px; }\r\n    .desktop-nav { display: flex; align-items: center; gap: 4px; }\r\n    .desktop-nav a { padding: 11px 16px; color: var(--ink-2); font-size: 17px; font-weight: 800; letter-spacing: -.015em; border-radius: 999px; }\r\n    .desktop-nav a:hover, .desktop-nav a.active { background: #fff; color: var(--red); }\r\n    .nav-actions { display: flex; align-items: center; gap: 10px; }\r\n    .nav-actions .btn { min-height: 44px; padding: 0 18px; font-size: 14px; }\r\n    .menu-btn { display: none; width: 44px; height: 44px; border: 1px solid var(--line); background: #fff; border-radius: 50%; align-items: center; justify-content: center; position: relative; }\r\n    .menu-btn span, .menu-btn::before, .menu-btn::after { content: \"\"; position: absolute; width: 18px; height: 2px; border-radius: 3px; background: var(--ink); transition: .25s ease; }\r\n    .menu-btn::before { transform: translateY(-6px); }\r\n    .menu-btn::after { transform: translateY(6px); }\r\n    .menu-btn.active span { opacity: 0; }\r\n    .menu-btn.active::before { transform: rotate(45deg); }\r\n    .menu-btn.active::after { transform: rotate(-45deg); }\r\n\r\n    .mobile-panel {\r\n      position: fixed;\r\n      inset: var(--nav-h) 18px auto;\r\n      z-index: 999;\r\n      background: #fff;\r\n      border: 1px solid var(--line);\r\n      border-radius: 24px;\r\n      padding: 14px;\r\n      box-shadow: var(--shadow);\r\n      opacity: 0;\r\n      visibility: hidden;\r\n      transform: translateY(-10px);\r\n      transition: .25s ease;\r\n    }\r\n    .mobile-panel.open { opacity: 1; visibility: visible; transform: none; }\r\n    .mobile-panel a { display: flex; align-items: center; justify-content: space-between; padding: 15px 12px; border-radius: 12px; font-size: 18px; font-weight: 800; letter-spacing: -.015em; }\r\n    .mobile-panel a:hover { background: var(--paper); color: var(--red); }\r\n    .mobile-panel .btn { margin-top: 10px; color: #fff; }\r\n\r\n    \/* Hero *\/\r\n    .hero { position: relative; min-height: 850px; padding: 170px 0 92px; overflow: hidden; }\r\n    .hero::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 620px; height: 620px;\r\n      right: -230px; top: 10px;\r\n      border-radius: 50%;\r\n      background: radial-gradient(circle, rgba(217,40,47,.12), rgba(217,40,47,0) 68%);\r\n      pointer-events: none;\r\n    }\r\n    .hero::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 0; right: 0; bottom: 0; height: 1px;\r\n      background: linear-gradient(90deg, transparent, var(--line), transparent);\r\n    }\r\n    .hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); gap: 76px; align-items: center; }\r\n    .hero-copy { position: relative; z-index: 2; }\r\n    .availability { display: inline-flex; align-items: center; gap: 10px; padding: 8px 13px; background: #fff; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-2); font-size: 13px; font-weight: 700; }\r\n    .availability i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(37,211,102,.1); }\r\n    .hero .display { margin-top: 26px; max-width: 800px; }\r\n    .hero-copy > p { max-width: 650px; margin: 26px 0 0; color: var(--ink-2); font-size: clamp(18px, 2vw, 21px); }\r\n    .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }\r\n    .hero-note { display: flex; gap: 18px; align-items: center; margin-top: 24px; color: var(--muted); font-size: 13px; }\r\n    .hero-note strong { color: var(--ink); }\r\n    .hero-proof { display: grid; grid-template-columns: repeat(3, max-content); gap: 32px; margin-top: 54px; }\r\n    .hero-proof strong { display: block; font-family: var(--font-display); font-size: 26px; letter-spacing: -.04em; }\r\n    .hero-proof span { color: var(--muted); font-size: 13px; }\r\n\r\n    .hero-stage { position: relative; z-index: 2; min-height: 560px; display: grid; place-items: center; }\r\n    .hero-stage::before { content: \"\"; position: absolute; inset: 8% 6%; border: 1px solid var(--line); border-radius: 44px; transform: rotate(5deg); }\r\n    .hero-stage::after { content: \"\"; position: absolute; inset: 14% 0 0 15%; background: var(--red); border-radius: 44px; transform: rotate(-4deg); opacity: .08; }\r\n    .growth-card {\r\n      position: relative;\r\n      z-index: 2;\r\n      width: min(100%, 470px);\r\n      background: #131417;\r\n      color: #fff;\r\n      border: 1px solid rgba(255,255,255,.1);\r\n      border-radius: 32px;\r\n      padding: 28px;\r\n      box-shadow: 0 40px 90px rgba(16,17,20,.24);\r\n    }\r\n    .growth-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; }\r\n    .growth-top small { color: #a8a9ae; font-weight: 700; }\r\n    .live { display: inline-flex; gap: 7px; align-items: center; color: #b9ffcf; font-size: 12px; font-weight: 700; }\r\n    .live::before { content: \"\"; width: 7px; height: 7px; border-radius: 50%; background: #64eb8d; box-shadow: 0 0 0 5px rgba(100,235,141,.12); }\r\n    .growth-number { margin: 30px 0 6px; font-family: var(--font-display); font-size: 58px; line-height: 1; letter-spacing: -.06em; font-weight: 800; }\r\n    .growth-number span { color: #ff6d73; font-size: 16px; letter-spacing: 0; }\r\n    .growth-sub { color: #97999f; font-size: 13px; }\r\n    .chart { display: flex; align-items: end; gap: 8px; height: 170px; margin-top: 30px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.08); }\r\n    .bar { flex: 1; height: var(--h); background: #303238; border-radius: 8px 8px 3px 3px; transform-origin: bottom; animation: grow 1s .2s both cubic-bezier(.2,.8,.2,1); }\r\n    .bar.hot { background: linear-gradient(180deg, #ff5b62, #d9282f); }\r\n    @keyframes grow { from { transform: scaleY(.05); opacity: .3; } to { transform: scaleY(1); opacity: 1; } }\r\n    .chart-labels { display: flex; justify-content: space-between; margin-top: 9px; color: #73757a; font-size: 10px; }\r\n    .mini-card { position: absolute; z-index: 3; background: #fff; border: 1px solid var(--line); box-shadow: 0 18px 50px rgba(16,17,20,.12); border-radius: 18px; padding: 14px 16px; }\r\n    .mini-card strong { display: block; font-family: var(--font-display); font-size: 19px; letter-spacing: -.03em; }\r\n    .mini-card span { color: var(--muted); font-size: 11px; }\r\n    .mini-a { left: -18px; top: 75px; }\r\n    .mini-b { right: -8px; bottom: 48px; }\r\n\r\n    \/* Proof strip *\/\r\n    .proof-strip { background: var(--ink); color: #fff; }\r\n    .proof-grid { display: grid; grid-template-columns: 1.2fr repeat(4, 1fr); gap: 28px; align-items: center; }\r\n    .proof-grid > div { padding: 25px 0; }\r\n    .proof-intro { color: #b7b8bd; font-size: 14px; }\r\n    .proof-stat { border-left: 1px solid rgba(255,255,255,.14); padding-left: 26px !important; }\r\n    .proof-stat strong { display: block; font-family: var(--font-display); font-size: 31px; letter-spacing: -.04em; }\r\n    .proof-stat span { color: #9fa1a7; font-size: 12px; }\r\n\r\n    \/* Services *\/\r\n    .section-head { display: flex; align-items: end; justify-content: space-between; gap: 42px; margin-bottom: 54px; }\r\n    .section-head .section-lead { max-width: 440px; margin: 0; }\r\n    .service-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }\r\n    .service-card {\r\n      grid-column: span 4;\r\n      position: relative;\r\n      min-height: 320px;\r\n      display: flex;\r\n      flex-direction: column;\r\n      background: #fff;\r\n      border: 1px solid var(--line);\r\n      border-radius: var(--radius);\r\n      padding: 28px;\r\n      overflow: hidden;\r\n      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;\r\n    }\r\n    .service-card:nth-child(1), .service-card:nth-child(6) { grid-column: span 8; }\r\n    .service-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: #c9c5be; }\r\n    .service-index { color: var(--red); font-size: 12px; font-weight: 800; letter-spacing: .12em; }\r\n    .service-card h3 { margin: 50px 0 12px; max-width: 460px; font-family: var(--font-display); font-size: 27px; line-height: 1.12; letter-spacing: -.04em; }\r\n    .service-card p { margin: 0 0 22px; max-width: 520px; color: var(--muted); font-size: 14px; }\r\n    .service-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; }\r\n    .service-tags span { padding: 6px 9px; background: var(--paper); border-radius: 999px; color: var(--ink-2); font-size: 11px; font-weight: 700; }\r\n    .service-arrow { position: absolute; right: 24px; top: 23px; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; transition: .25s ease; }\r\n    .service-card:hover .service-arrow { background: var(--red); border-color: var(--red); color: #fff; transform: rotate(45deg); }\r\n\r\n    \/* Process *\/\r\n    .process { background: #fff; }\r\n    .process-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; }\r\n    .process-copy { position: sticky; top: 120px; }\r\n    .process-copy .section-lead { font-size: 16px; }\r\n    .steps { border-top: 1px solid var(--line); }\r\n    .step { display: grid; grid-template-columns: 78px 1fr; gap: 18px; padding: 34px 0; border-bottom: 1px solid var(--line); }\r\n    .step-num { color: var(--red); font-family: var(--font-display); font-weight: 800; }\r\n    .step h3 { margin: 0 0 8px; font-family: var(--font-display); font-size: 25px; letter-spacing: -.035em; }\r\n    .step p { margin: 0; color: var(--muted); }\r\n\r\n    \/* Work *\/\r\n    .work-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }\r\n    .case-card { position: relative; min-height: 400px; padding: 32px; border-radius: 28px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); background: #fff; }\r\n    .case-card.dark { background: var(--ink); border-color: var(--ink); color: #fff; }\r\n    .case-card.red { background: var(--red); border-color: var(--red); color: #fff; }\r\n    .case-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }\r\n    .case-number { opacity: .45; }\r\n    .case-card h3 { margin: 0; max-width: 520px; font-family: var(--font-display); font-size: clamp(29px, 3vw, 43px); line-height: 1.04; letter-spacing: -.045em; }\r\n    .case-card p { margin: 16px 0 0; color: var(--muted); }\r\n    .case-card.dark p { color: #a7a9af; }\r\n    .case-card.red p { color: rgba(255,255,255,.75); }\r\n    .case-metric { position: absolute; right: 28px; top: 84px; font-family: var(--font-display); font-size: clamp(54px, 8vw, 98px); line-height: .9; font-weight: 800; letter-spacing: -.07em; opacity: .08; }\r\n\r\n    \/* Pricing *\/\r\n    .pricing { background: var(--ink); color: #fff; }\r\n    .pricing .section-lead { color: #a8a9af; }\r\n    .pricing-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 50px; }\r\n    .price-card { position: relative; display: flex; flex-direction: column; min-height: 560px; padding: 28px; border: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: #18191d; }\r\n    .price-card.featured { background: #fff; color: var(--ink); transform: translateY(-12px); }\r\n    .popular { position: absolute; top: 14px; right: 14px; background: var(--red); color: #fff; border-radius: 999px; padding: 6px 9px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }\r\n    .plan { color: #a6a8ad; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }\r\n    .featured .plan { color: var(--red); }\r\n    .price { margin: 20px 0 8px; font-family: var(--font-display); font-size: 44px; line-height: 1; letter-spacing: -.055em; font-weight: 800; }\r\n    .price small { font-family: var(--font-body); font-size: 13px; color: #8d8f95; letter-spacing: 0; }\r\n    .price-copy { min-height: 75px; color: #9fa1a7; font-size: 13px; }\r\n    .featured .price-copy { color: var(--muted); }\r\n    .feature-list { list-style: none; padding: 22px 0 0; margin: 22px 0 30px; border-top: 1px solid rgba(255,255,255,.1); }\r\n    .featured .feature-list { border-color: var(--line); }\r\n    .feature-list li { position: relative; padding: 7px 0 7px 22px; color: #d7d8db; font-size: 13px; }\r\n    .featured .feature-list li { color: var(--ink-2); }\r\n    .feature-list li::before { content: \"\u2713\"; position: absolute; left: 0; color: #ff6268; font-weight: 800; }\r\n    .price-card .btn { margin-top: auto; width: 100%; }\r\n\r\n    \/* Why *\/\r\n    .why-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; }\r\n    .why-quote { padding: 38px; background: var(--red); color: #fff; border-radius: 30px; }\r\n    .why-quote p { margin: 0; font-family: var(--font-display); font-size: clamp(28px, 3.6vw, 46px); line-height: 1.06; letter-spacing: -.04em; font-weight: 750; }\r\n    .why-quote small { display: block; margin-top: 34px; opacity: .72; }\r\n    .why-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }\r\n    .why-item { min-height: 180px; padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 20px; }\r\n    .why-item strong { display: block; margin-bottom: 9px; font-family: var(--font-display); font-size: 19px; letter-spacing: -.03em; }\r\n    .why-item p { margin: 0; color: var(--muted); font-size: 13px; }\r\n\r\n    \/* Contact *\/\r\n    .contact-wrap { display: grid; grid-template-columns: .85fr 1.15fr; background: #fff; border: 1px solid var(--line); border-radius: 32px; overflow: hidden; box-shadow: var(--shadow); }\r\n    .contact-info { padding: 48px; background: var(--red); color: #fff; }\r\n    .contact-info .kicker { color: #fff; opacity: .8; }\r\n    .contact-info h2 { margin: 0; font-family: var(--font-display); font-size: clamp(38px, 4vw, 54px); line-height: 1.02; letter-spacing: -.045em; }\r\n    .contact-info > p { color: rgba(255,255,255,.75); }\r\n    .contact-items { display: grid; gap: 12px; margin-top: 38px; }\r\n    .contact-item { padding: 16px 0; border-top: 1px solid rgba(255,255,255,.2); }\r\n    .contact-item small { display: block; opacity: .62; margin-bottom: 2px; }\r\n    .contact-item strong { font-weight: 700; }\r\n    .whatsapp-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 26px; padding: 12px 16px; background: #fff; color: #0c5e2a; border-radius: 999px; font-weight: 800; }\r\n    .contact-form { padding: 48px; }\r\n    .form-head h3 { margin: 0; font-family: var(--font-display); font-size: 30px; letter-spacing: -.04em; }\r\n    .form-head p { margin: 8px 0 28px; color: var(--muted); }\r\n    .field-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }\r\n    .field { position: relative; }\r\n    .field.full { grid-column: 1 \/ -1; }\r\n    .field label { display: block; margin-bottom: 7px; color: var(--ink-2); font-size: 12px; font-weight: 800; }\r\n    .field input, .field select, .field textarea { width: 100%; border: 1px solid var(--line); outline: none; background: var(--paper); border-radius: 13px; padding: 13px 14px; color: var(--ink); transition: border-color .2s ease, box-shadow .2s ease; }\r\n    .field textarea { min-height: 120px; resize: vertical; }\r\n    .field input:focus, .field select:focus, .field textarea:focus { border-color: var(--red); box-shadow: 0 0 0 4px rgba(217,40,47,.08); }\r\n    .field.error input, .field.error select, .field.error textarea { border-color: var(--red); }\r\n    .error-msg { display: none; color: var(--red); font-size: 11px; margin-top: 5px; }\r\n    .field.error .error-msg { display: block; }\r\n    .contact-form .btn { width: 100%; margin-top: 18px; border: 0; }\r\n    .privacy { margin: 12px 0 0; color: var(--muted); font-size: 11px; text-align: center; }\r\n\r\n    \/* Footer *\/\r\n    footer { padding: 40px 0 26px; background: var(--ink); color: #fff; }\r\n    .footer-top { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 56px; padding-bottom: 38px; border-bottom: 1px solid rgba(255,255,255,.12); }\r\n    .footer-brand p { max-width: 330px; color: #92949a; font-size: 13px; }\r\n    .footer-col strong { display: block; margin-bottom: 13px; font-size: 13px; }\r\n    .footer-col a, .footer-col span { display: block; width: fit-content; padding: 4px 0; color: #9da0a6; font-size: 13px; }\r\n    .footer-col a:hover { color: #fff; }\r\n    .footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 24px; color: #777a80; font-size: 12px; }\r\n    .socials { display: flex; gap: 14px; }\r\n\r\n    .float-wa { position: fixed; right: 24px; bottom: 24px; z-index: 900; width: 55px; height: 55px; display: grid; place-items: center; border-radius: 50%; background: var(--green); color: #fff; font-weight: 900; box-shadow: 0 15px 35px rgba(37,211,102,.3); transition: transform .2s ease; }\r\n    .float-wa:hover { transform: translateY(-3px) scale(1.03); }\r\n    .to-top { position: fixed; right: 26px; bottom: 91px; z-index: 899; width: 44px; height: 44px; border: 1px solid var(--line); background: #fff; border-radius: 50%; color: var(--ink); opacity: 0; visibility: hidden; transform: translateY(8px); transition: .2s ease; }\r\n    .to-top.show { opacity: 1; visibility: visible; transform: none; }\r\n\r\n    .reveal { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }\r\n    .reveal.in { opacity: 1; transform: none; }\r\n\r\n    @media (max-width: 1050px) {\r\n      .desktop-nav { display: none; }\r\n      .menu-btn { display: inline-flex; }\r\n      .hero { min-height: auto; }\r\n      .hero-grid { grid-template-columns: 1fr; gap: 56px; }\r\n      .hero-copy { max-width: 820px; }\r\n      .hero-stage { min-height: 520px; }\r\n      .proof-grid { grid-template-columns: repeat(4, 1fr); }\r\n      .proof-intro { grid-column: 1 \/ -1; padding-bottom: 0 !important; }\r\n      .proof-stat:first-of-type { border-left: 0; padding-left: 0 !important; }\r\n      .service-card { grid-column: span 6 !important; }\r\n      .process-layout, .why-grid, .contact-wrap { grid-template-columns: 1fr; }\r\n      .process-copy { position: static; }\r\n      .pricing-grid { grid-template-columns: repeat(2, 1fr); }\r\n      .price-card.featured { transform: none; }\r\n      .footer-top { grid-template-columns: repeat(2, 1fr); }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      :root { --nav-h: 70px; }\r\n      .container, .nav-inner { width: min(100% - 28px, var(--max)); }\r\n      .section { padding: 82px 0; }\r\n      .section-tight { padding: 60px 0; }\r\n      .site-nav .nav-actions .btn { display: none; }\r\n      .hero { padding: 135px 0 72px; }\r\n      .hero-proof { grid-template-columns: repeat(3, 1fr); gap: 12px; }\r\n      .hero-proof strong { font-size: 22px; }\r\n      .hero-stage { min-height: 430px; }\r\n      .growth-card { padding: 21px; border-radius: 24px; }\r\n      .growth-number { font-size: 45px; }\r\n      .mini-card { display: none; }\r\n      .section-head { display: block; margin-bottom: 34px; }\r\n      .section-head .section-lead { margin-top: 18px; }\r\n      .service-grid, .work-grid, .pricing-grid, .why-list, .field-grid { grid-template-columns: 1fr; }\r\n      .service-card { grid-column: 1 \/ -1 !important; min-height: 290px; }\r\n      .service-card h3 { margin-top: 44px; }\r\n      .work-grid { gap: 14px; }\r\n      .case-card { min-height: 340px; }\r\n      .price-card { min-height: auto; }\r\n      .why-grid { gap: 24px; }\r\n      .contact-info, .contact-form { padding: 30px 22px; }\r\n      .field.full { grid-column: auto; }\r\n      .proof-grid { grid-template-columns: repeat(2, 1fr); gap: 0; }\r\n      .proof-stat { border-left: 0; padding-left: 0 !important; border-top: 1px solid rgba(255,255,255,.12); }\r\n      .proof-stat:nth-child(even) { padding-left: 18px !important; border-left: 1px solid rgba(255,255,255,.12); }\r\n      .footer-top { grid-template-columns: 1fr 1fr; gap: 30px; }\r\n      .footer-brand { grid-column: 1 \/ -1; }\r\n      .footer-bottom { align-items: flex-start; flex-direction: column; }\r\n    }\r\n\r\n    @media (max-width: 440px) {\r\n      .hero-actions .btn { width: 100%; }\r\n      .hero-proof { gap: 8px; }\r\n      .hero-proof strong { font-size: 19px; }\r\n      .hero-proof span { font-size: 11px; }\r\n      .chart { height: 140px; }\r\n      .footer-top { grid-template-columns: 1fr; }\r\n      .footer-brand { grid-column: auto; }\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }\r\n      .reveal { opacity: 1; transform: none; }\r\n    }\r\n  \r\n\r\n    \/* ===== WHITE + RED + BLACK ONLY THEME ===== *\/\r\n    :root {\r\n      --ink: #000000;\r\n      --ink-2: #000000;\r\n      --muted: #000000;\r\n      --paper: #ffffff;\r\n      --white: #ffffff;\r\n      --line: #000000;\r\n      --red: #d9282f;\r\n      --red-dark: #d9282f;\r\n      --red-soft: #ffffff;\r\n      --green: #d9282f;\r\n      --shadow: none;\r\n    }\r\n\r\n    html, body { background: #ffffff !important; color: #000000 !important; }\r\n    body, p, span, small, label, input, select, textarea { color: #000000; }\r\n    ::selection { background: #d9282f; color: #000000; }\r\n\r\n    \/* Only white surfaces *\/\r\n    .site-nav,\r\n    .site-nav.scrolled,\r\n    .mobile-panel,\r\n    .hero,\r\n    .proof-strip,\r\n    .service-card,\r\n    .process,\r\n    .case-card,\r\n    .case-card.dark,\r\n    .case-card.red,\r\n    .pricing,\r\n    .price-card,\r\n    .price-card.featured,\r\n    .why-quote,\r\n    .why-item,\r\n    .contact-wrap,\r\n    .contact-info,\r\n    .contact-form,\r\n    footer,\r\n    .growth-card,\r\n    .mini-card,\r\n    .availability,\r\n    .field input,\r\n    .field select,\r\n    .field textarea,\r\n    .service-tags span,\r\n    .menu-btn,\r\n    .to-top,\r\n    .float-wa,\r\n    .whatsapp-link {\r\n      background: #ffffff !important;\r\n      color: #000000 !important;\r\n      box-shadow: none !important;\r\n    }\r\n\r\n    \/* Remove tinted \/ gradient decoration *\/\r\n    .hero::before,\r\n    .hero-stage::after { background: transparent !important; }\r\n    .hero::after { background: #000000 !important; }\r\n    .brand-mark {\r\n      background: #ffffff !important;\r\n      border: 2px solid #d9282f !important;\r\n      box-shadow: none !important;\r\n    }\r\n    .brand-mark::before,\r\n    .brand-mark::after { background: #d9282f !important; }\r\n\r\n    \/* Navigation *\/\r\n    .site-nav { border-bottom: 1px solid transparent !important; }\r\n    .site-nav.scrolled { border-bottom-color: #000000 !important; backdrop-filter: none !important; }\r\n    .desktop-nav a { color: #000000 !important; }\r\n    .desktop-nav a:hover,\r\n    .desktop-nav a.active { color: #d9282f !important; background: #ffffff !important; }\r\n    .mobile-panel { border: 1px solid #000000 !important; }\r\n    .mobile-panel a { color: #000000 !important; }\r\n    .mobile-panel a:hover { background: #ffffff !important; color: #d9282f !important; }\r\n\r\n    \/* Buttons: white background, red\/black text *\/\r\n    .btn,\r\n    .btn-primary,\r\n    .btn-dark,\r\n    .btn-light,\r\n    .btn-ghost,\r\n    .mobile-panel .btn,\r\n    .contact-form .btn {\r\n      background: #ffffff !important;\r\n      box-shadow: none !important;\r\n    }\r\n    .btn-primary,\r\n    .mobile-panel .btn,\r\n    .contact-form .btn {\r\n      color: #d9282f !important;\r\n      border: 2px solid #d9282f !important;\r\n    }\r\n    .btn-dark,\r\n    .btn-ghost,\r\n    .btn-light {\r\n      color: #000000 !important;\r\n      border: 2px solid #000000 !important;\r\n    }\r\n    .btn:hover { background: #ffffff !important; transform: translateY(-2px); }\r\n    .btn-primary:hover { color: #000000 !important; border-color: #000000 !important; }\r\n    .btn-dark:hover,\r\n    .btn-ghost:hover,\r\n    .btn-light:hover { color: #d9282f !important; border-color: #d9282f !important; }\r\n\r\n    \/* Text hierarchy *\/\r\n    .kicker,\r\n    .accent,\r\n    .service-index,\r\n    .step-num,\r\n    .featured .plan,\r\n    .feature-list li::before,\r\n    .growth-number span,\r\n    .live,\r\n    .error-msg,\r\n    .footer-col a:hover,\r\n    .desktop-nav a:hover,\r\n    .desktop-nav a.active { color: #d9282f !important; }\r\n\r\n    .section-lead,\r\n    .hero-copy > p,\r\n    .hero-note,\r\n    .hero-note strong,\r\n    .hero-proof span,\r\n    .proof-intro,\r\n    .proof-stat span,\r\n    .service-card p,\r\n    .service-tags span,\r\n    .step p,\r\n    .case-card p,\r\n    .case-card.dark p,\r\n    .case-card.red p,\r\n    .pricing .section-lead,\r\n    .plan,\r\n    .price small,\r\n    .price-copy,\r\n    .feature-list li,\r\n    .why-item p,\r\n    .contact-info > p,\r\n    .contact-item small,\r\n    .form-head p,\r\n    .field label,\r\n    .privacy,\r\n    .footer-brand p,\r\n    .footer-col a,\r\n    .footer-col span,\r\n    .footer-bottom,\r\n    .growth-top small,\r\n    .growth-sub,\r\n    .chart-labels,\r\n    .mini-card span,\r\n    .availability { color: #000000 !important; }\r\n\r\n    \/* Borders and surfaces *\/\r\n    .availability,\r\n    .hero-stage::before,\r\n    .growth-card,\r\n    .mini-card,\r\n    .service-card,\r\n    .service-arrow,\r\n    .case-card,\r\n    .price-card,\r\n    .why-quote,\r\n    .why-item,\r\n    .contact-wrap,\r\n    .field input,\r\n    .field select,\r\n    .field textarea,\r\n    .menu-btn,\r\n    .to-top,\r\n    .float-wa,\r\n    .whatsapp-link { border-color: #000000 !important; }\r\n\r\n    .service-card:hover,\r\n    .price-card.featured,\r\n    .why-quote,\r\n    .contact-info { border-color: #d9282f !important; }\r\n\r\n    .service-tags span { border: 1px solid #000000 !important; }\r\n    .steps,\r\n    .step,\r\n    .chart,\r\n    .footer-top,\r\n    .contact-item,\r\n    .proof-stat { border-color: #000000 !important; }\r\n\r\n    \/* Dashboard *\/\r\n    .growth-card { border: 2px solid #000000 !important; }\r\n    .live::before,\r\n    .availability i { background: #d9282f !important; box-shadow: none !important; }\r\n    .bar { background: #000000 !important; }\r\n    .bar.hot { background: #d9282f !important; }\r\n    .chart { border-top: 1px solid #000000 !important; }\r\n\r\n    \/* Proof *\/\r\n    .proof-strip { border-top: 1px solid #000000; border-bottom: 1px solid #000000; }\r\n    .proof-stat strong { color: #d9282f !important; }\r\n\r\n    \/* Service interactions *\/\r\n    .service-card:hover { box-shadow: none !important; }\r\n    .service-arrow { color: #000000 !important; background: #ffffff !important; }\r\n    .service-card:hover .service-arrow {\r\n      background: #ffffff !important;\r\n      border-color: #d9282f !important;\r\n      color: #d9282f !important;\r\n    }\r\n\r\n    \/* Case studies *\/\r\n    .case-card.dark,\r\n    .case-card.red { color: #000000 !important; }\r\n    .case-card.dark { border: 2px solid #000000 !important; }\r\n    .case-card.red { border: 2px solid #d9282f !important; }\r\n    .case-card.red h3,\r\n    .case-card.red .case-meta { color: #d9282f !important; }\r\n    .case-metric { color: #d9282f !important; opacity: .12 !important; }\r\n\r\n    \/* Pricing *\/\r\n    .pricing { border-top: 1px solid #000000; border-bottom: 1px solid #000000; }\r\n    .price-card { border: 1px solid #000000 !important; }\r\n    .price-card.featured { border: 2px solid #d9282f !important; }\r\n    .popular {\r\n      background: #ffffff !important;\r\n      color: #d9282f !important;\r\n      border: 1px solid #d9282f !important;\r\n    }\r\n    .feature-list { border-color: #000000 !important; }\r\n\r\n    \/* Why + contact *\/\r\n    .why-quote { border: 2px solid #d9282f !important; }\r\n    .why-quote p { color: #d9282f !important; }\r\n    .why-quote small { color: #000000 !important; opacity: 1 !important; }\r\n    .contact-info { border-right: 1px solid #000000; }\r\n    .contact-info .kicker { color: #d9282f !important; opacity: 1 !important; }\r\n    .contact-info h2 { color: #000000 !important; }\r\n    .whatsapp-link { color: #d9282f !important; border: 2px solid #d9282f !important; }\r\n    .field input:focus,\r\n    .field select:focus,\r\n    .field textarea:focus { box-shadow: none !important; border-color: #d9282f !important; }\r\n    input::placeholder,\r\n    textarea::placeholder { color: #000000 !important; opacity: 1; }\r\n\r\n    \/* Footer + floating controls *\/\r\n    footer { border-top: 1px solid #000000; }\r\n    .footer-col strong { color: #d9282f !important; }\r\n    .float-wa { color: #d9282f !important; border: 2px solid #d9282f !important; }\r\n    .to-top { color: #000000 !important; }\r\n\r\n    @media (max-width: 1050px) {\r\n      .proof-stat,\r\n      .proof-stat:nth-child(even) { border-color: #000000 !important; }\r\n    }\r\n\r\n\r\n    \/* ===== REFINED FOOTER ===== *\/\r\n    .site-footer {\r\n      position: relative;\r\n      padding: 0 !important;\r\n      background: #ffffff !important;\r\n      color: #000000 !important;\r\n      border-top: 2px solid #000000 !important;\r\n      overflow: hidden;\r\n    }\r\n    .site-footer::before {\r\n      content: '';\r\n      position: absolute;\r\n      top: -1px;\r\n      right: 6%;\r\n      width: 110px;\r\n      height: 3px;\r\n      background: #d9282f;\r\n    }\r\n    .footer-cta {\r\n      display: flex;\r\n      align-items: flex-end;\r\n      justify-content: space-between;\r\n      gap: 40px;\r\n      padding: 72px 0 66px;\r\n      border-bottom: 1px solid #000000;\r\n    }\r\n    .footer-kicker {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 9px;\r\n      margin-bottom: 16px;\r\n      color: #d9282f !important;\r\n      font-size: 12px;\r\n      font-weight: 800;\r\n      letter-spacing: .13em;\r\n      text-transform: uppercase;\r\n    }\r\n    .footer-kicker::before {\r\n      content: '';\r\n      width: 26px;\r\n      height: 2px;\r\n      background: #d9282f;\r\n    }\r\n    .footer-cta h2 {\r\n      margin: 0;\r\n      max-width: 780px;\r\n      color: #000000;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(48px, 7vw, 92px);\r\n      line-height: .91;\r\n      letter-spacing: -.065em;\r\n      font-weight: 800;\r\n    }\r\n    .footer-cta h2 span { color: #d9282f !important; }\r\n    .footer-cta-btn {\r\n      flex: 0 0 auto;\r\n      display: inline-flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      gap: 18px;\r\n      min-width: 195px;\r\n      min-height: 58px;\r\n      padding: 0 24px;\r\n      border: 2px solid #d9282f;\r\n      border-radius: 999px;\r\n      color: #d9282f !important;\r\n      font-weight: 800;\r\n      transition: transform .2s ease, background .2s ease, color .2s ease;\r\n    }\r\n    .footer-cta-btn:hover {\r\n      background: #d9282f !important;\r\n      color: #ffffff !important;\r\n      transform: translateY(-3px);\r\n    }\r\n    .footer-cta-btn:hover span { color: #ffffff !important; }\r\n\r\n    .footer-main {\r\n      display: grid;\r\n      grid-template-columns: minmax(250px, .9fr) minmax(0, 2.1fr);\r\n      gap: clamp(50px, 8vw, 120px);\r\n      padding: 58px 0 54px;\r\n      border-bottom: 1px solid #000000;\r\n    }\r\n    .footer-brand-block { max-width: 360px; }\r\n    .footer-logo { width: fit-content; margin-bottom: 22px; font-size: 26px; }\r\n    .footer-brand-block p {\r\n      margin: 0;\r\n      color: #000000 !important;\r\n      font-size: 14px;\r\n      line-height: 1.75;\r\n    }\r\n    .footer-availability {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 8px;\r\n      margin-top: 26px;\r\n      padding: 9px 12px;\r\n      border: 1px solid #000000;\r\n      border-radius: 999px;\r\n      color: #000000 !important;\r\n      font-size: 11px;\r\n      font-weight: 800;\r\n      letter-spacing: .02em;\r\n    }\r\n    .footer-availability > span {\r\n      width: 7px;\r\n      height: 7px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n    }\r\n\r\n    .footer-links {\r\n      display: grid;\r\n      grid-template-columns: .8fr 1.15fr 1.35fr;\r\n      gap: clamp(28px, 5vw, 70px);\r\n    }\r\n    .footer-heading {\r\n      margin: 0 0 18px;\r\n      color: #d9282f !important;\r\n      font-size: 11px;\r\n      font-weight: 800;\r\n      letter-spacing: .12em;\r\n      text-transform: uppercase;\r\n    }\r\n    .footer-group > a:not(.footer-contact-link) {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 12px;\r\n      width: 100%;\r\n      padding: 7px 0;\r\n      color: #000000 !important;\r\n      font-size: 13px;\r\n      font-weight: 650;\r\n      border-bottom: 1px solid transparent;\r\n      transition: color .2s ease, border-color .2s ease, padding-left .2s ease;\r\n    }\r\n    .footer-group > a:not(.footer-contact-link) span {\r\n      opacity: 0;\r\n      transform: translateX(-5px);\r\n      color: #d9282f !important;\r\n      transition: .2s ease;\r\n    }\r\n    .footer-group > a:not(.footer-contact-link):hover {\r\n      padding-left: 4px;\r\n      color: #d9282f !important;\r\n      border-bottom-color: #d9282f;\r\n    }\r\n    .footer-group > a:not(.footer-contact-link):hover span {\r\n      opacity: 1;\r\n      transform: none;\r\n    }\r\n    .footer-contact-group { min-width: 0; }\r\n    .footer-contact-link {\r\n      display: block;\r\n      padding: 11px 0 12px;\r\n      border-top: 1px solid #000000;\r\n      color: #000000 !important;\r\n    }\r\n    .footer-contact-link small {\r\n      display: block;\r\n      margin-bottom: 3px;\r\n      color: #d9282f !important;\r\n      font-size: 10px;\r\n      font-weight: 800;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n    }\r\n    .footer-contact-link strong {\r\n      display: block;\r\n      color: #000000 !important;\r\n      font-size: 13px;\r\n      line-height: 1.45;\r\n      word-break: break-word;\r\n    }\r\n    a.footer-contact-link:hover strong { color: #d9282f !important; }\r\n\r\n    .footer-bottom-new {\r\n      display: grid;\r\n      grid-template-columns: 1fr auto 1fr;\r\n      align-items: center;\r\n      gap: 28px;\r\n      min-height: 78px;\r\n      font-size: 11px;\r\n      font-weight: 700;\r\n    }\r\n    .footer-copy { color: #000000 !important; }\r\n    .footer-socials {\r\n      display: flex;\r\n      justify-content: center;\r\n      gap: 22px;\r\n    }\r\n    .footer-socials a,\r\n    .footer-backtop {\r\n      color: #000000 !important;\r\n      transition: color .2s ease;\r\n    }\r\n    .footer-socials a span { color: #d9282f !important; }\r\n    .footer-socials a:hover,\r\n    .footer-backtop:hover { color: #d9282f !important; }\r\n    .footer-backtop { justify-self: end; }\r\n\r\n    @media (max-width: 980px) {\r\n      .footer-cta { align-items: flex-start; flex-direction: column; }\r\n      .footer-main { grid-template-columns: 1fr; gap: 42px; }\r\n      .footer-brand-block { max-width: 600px; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .footer-cta { padding: 54px 0 48px; gap: 28px; }\r\n      .footer-cta h2 { font-size: clamp(44px, 14vw, 70px); }\r\n      .footer-cta-btn { width: 100%; }\r\n      .footer-main { padding: 44px 0 42px; }\r\n      .footer-links { grid-template-columns: 1fr 1fr; gap: 36px 28px; }\r\n      .footer-contact-group { grid-column: 1 \/ -1; }\r\n      .footer-bottom-new {\r\n        grid-template-columns: 1fr auto;\r\n        padding: 22px 0;\r\n        row-gap: 18px;\r\n      }\r\n      .footer-socials {\r\n        grid-column: 1 \/ -1;\r\n        grid-row: 1;\r\n        justify-content: flex-start;\r\n        flex-wrap: wrap;\r\n      }\r\n      .footer-copy { grid-column: 1; grid-row: 2; }\r\n      .footer-backtop { grid-column: 2; grid-row: 2; }\r\n    }\r\n\r\n    @media (max-width: 440px) {\r\n      .footer-links { grid-template-columns: 1fr; }\r\n      .footer-contact-group { grid-column: auto; }\r\n      .footer-socials { gap: 14px; }\r\n      .footer-bottom-new { grid-template-columns: 1fr; }\r\n      .footer-copy,\r\n      .footer-backtop,\r\n      .footer-socials { grid-column: 1; grid-row: auto; justify-self: start; }\r\n    }\r\n\r\n\r\n    \/* ===== FINAL POLISH \u2014 EDITORIAL WHITE \/ RED \/ BLACK ===== *\/\r\n    :root {\r\n      --line-soft: rgba(0, 0, 0, .14);\r\n      --line-mid: rgba(0, 0, 0, .28);\r\n      --ease-premium: cubic-bezier(.2,.75,.25,1);\r\n    }\r\n\r\n    \/* Global rhythm *\/\r\n    body { letter-spacing: -.008em; }\r\n    .container { width: min(1200px, calc(100% - 56px)); }\r\n    .section { padding: clamp(92px, 10vw, 138px) 0; }\r\n    .section-tight { padding: clamp(58px, 7vw, 82px) 0; }\r\n    .section-head {\r\n      align-items: end;\r\n      gap: 52px;\r\n      margin-bottom: 54px;\r\n      padding-bottom: 28px;\r\n      border-bottom: 1px solid var(--line-soft);\r\n    }\r\n    .section-title { max-width: 900px; line-height: .99; letter-spacing: -.055em; }\r\n    .section-lead { line-height: 1.72; }\r\n    .kicker { margin-bottom: 20px; }\r\n\r\n    \/* Accessibility \/ interaction polish *\/\r\n    a, button, input, select, textarea { outline-offset: 4px; }\r\n    a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {\r\n      outline: 2px solid #d9282f;\r\n    }\r\n\r\n    \/* Navigation *\/\r\n    .site-nav,\r\n    .site-nav.scrolled {\r\n      background: rgba(255,255,255,.98) !important;\r\n      border-bottom: 1px solid var(--line-soft) !important;\r\n    }\r\n    .site-nav { transition: height .28s var(--ease-premium), border-color .28s ease; }\r\n    .site-nav.scrolled { height: 70px; }\r\n    .brand { letter-spacing: -.035em; }\r\n    .brand-mark { width: 24px; height: 24px; border-width: 1.5px !important; }\r\n    .desktop-nav { gap: 14px; }\r\n    .desktop-nav a {\r\n      position: relative;\r\n      padding: 12px 2px;\r\n      border-radius: 0;\r\n      font-size: 16px;\r\n      font-weight: 800;\r\n      letter-spacing: -.015em;\r\n      transition: color .2s ease;\r\n    }\r\n    .desktop-nav a::after {\r\n      content: '';\r\n      position: absolute;\r\n      left: 0;\r\n      right: 100%;\r\n      bottom: 7px;\r\n      height: 1.5px;\r\n      background: #d9282f;\r\n      transition: right .25s var(--ease-premium);\r\n    }\r\n    .desktop-nav a:hover::after,\r\n    .desktop-nav a.active::after { right: 0; }\r\n    .nav-actions .btn { min-height: 42px; border-width: 1.5px !important; }\r\n\r\n    \/* Buttons *\/\r\n    .btn {\r\n      min-height: 54px;\r\n      border-width: 1.5px !important;\r\n      letter-spacing: -.01em;\r\n      transition: transform .22s var(--ease-premium), color .22s ease, border-color .22s ease !important;\r\n    }\r\n    .btn:hover { transform: translateY(-2px); }\r\n    .btn span { transition: transform .22s var(--ease-premium); }\r\n    .btn:hover span { transform: translate(2px,-2px); }\r\n\r\n    \/* Hero *\/\r\n    .hero { min-height: 820px; padding: 176px 0 110px; }\r\n    .hero-grid { gap: clamp(54px, 7vw, 90px); }\r\n    .hero .display { max-width: 760px; font-size: clamp(52px, 6.7vw, 94px); }\r\n    .hero-copy > p { max-width: 610px; font-size: clamp(17px, 1.7vw, 20px); line-height: 1.72; }\r\n    .availability {\r\n      border: 0 !important;\r\n      border-bottom: 1px solid #d9282f !important;\r\n      border-radius: 0;\r\n      padding: 0 0 7px;\r\n      font-size: 11px;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n    }\r\n    .availability i { width: 6px; height: 6px; }\r\n    .hero-note { margin-top: 20px; }\r\n    .hero-proof { margin-top: 60px; gap: 0; border-top: 1px solid var(--line-soft); max-width: 610px; }\r\n    .hero-proof > div { min-width: 0; padding: 20px 30px 0 0; }\r\n    .hero-proof > div + div { padding-left: 30px; border-left: 1px solid var(--line-soft); }\r\n    .hero-proof strong { color: #000 !important; font-size: 25px; }\r\n    .hero-stage::before { inset: 7% 4%; border-color: var(--line-soft) !important; border-radius: 34px; transform: rotate(3deg); }\r\n    .growth-card {\r\n      width: min(100%, 480px);\r\n      padding: 30px;\r\n      border: 1.5px solid #000 !important;\r\n      border-radius: 26px;\r\n    }\r\n    .growth-card::before {\r\n      content: '';\r\n      display: block;\r\n      width: 44px;\r\n      height: 2px;\r\n      margin-bottom: 24px;\r\n      background: #d9282f;\r\n    }\r\n    .growth-number { font-size: clamp(40px, 5vw, 60px); letter-spacing: -.055em; }\r\n    .chart { margin-top: 28px; border-color: var(--line-soft) !important; }\r\n    .mini-card { border-color: var(--line-mid) !important; border-radius: 16px; }\r\n\r\n    \/* Proof strip *\/\r\n    .proof-strip { border-color: var(--line-soft) !important; }\r\n    .proof-grid { align-items: stretch; }\r\n    .proof-intro { font-size: 15px; line-height: 1.65; }\r\n    .proof-stat { border-color: var(--line-soft) !important; }\r\n    .proof-stat strong { font-size: 27px; }\r\n\r\n    \/* Services *\/\r\n    .service-grid { gap: 18px; }\r\n    .service-card {\r\n      min-height: 330px;\r\n      padding: 34px 32px 32px;\r\n      border: 1px solid var(--line-soft) !important;\r\n      border-radius: 18px;\r\n      transition: transform .28s var(--ease-premium), border-color .28s ease !important;\r\n    }\r\n    .service-card:hover { transform: translateY(-5px); border-color: #d9282f !important; }\r\n    .service-card h3 { font-size: 25px; line-height: 1.08; letter-spacing: -.035em; }\r\n    .service-card p { max-width: 470px; line-height: 1.72; }\r\n    .service-arrow { width: 38px; height: 38px; border-color: var(--line-mid) !important; }\r\n    .service-tags { gap: 7px; }\r\n    .service-tags span {\r\n      padding: 7px 10px;\r\n      border-color: var(--line-soft) !important;\r\n      border-radius: 999px;\r\n      font-size: 10px;\r\n      font-weight: 700;\r\n    }\r\n\r\n    \/* Process *\/\r\n    .process { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }\r\n    .steps { border-color: var(--line-soft) !important; }\r\n    .step { padding: 30px 0; border-color: var(--line-soft) !important; }\r\n    .step h3 { margin-bottom: 8px; font-size: 21px; letter-spacing: -.025em; }\r\n    .step p { max-width: 580px; }\r\n    .step-num { font-size: 11px; letter-spacing: .1em; }\r\n\r\n    \/* Work *\/\r\n    .work-grid { gap: 18px; }\r\n    .case-card,\r\n    .case-card.dark,\r\n    .case-card.red {\r\n      min-height: 430px;\r\n      border: 1px solid var(--line-soft) !important;\r\n      border-radius: 20px;\r\n      transition: transform .28s var(--ease-premium), border-color .28s ease !important;\r\n    }\r\n    .case-card:hover,\r\n    .case-card.dark:hover,\r\n    .case-card.red:hover { transform: translateY(-5px); border-color: #d9282f !important; }\r\n    .case-card h3 { max-width: 540px; font-size: clamp(27px, 3vw, 37px); }\r\n    .case-meta { padding-bottom: 15px; border-bottom: 1px solid var(--line-soft); }\r\n    .case-metric { opacity: .09 !important; }\r\n\r\n    \/* Pricing *\/\r\n    .pricing { border-color: var(--line-soft) !important; }\r\n    .pricing-grid { gap: 16px; }\r\n    .price-card,\r\n    .price-card.featured {\r\n      padding: 34px 28px 30px;\r\n      border: 1px solid var(--line-soft) !important;\r\n      border-radius: 18px;\r\n      transition: transform .28s var(--ease-premium), border-color .28s ease !important;\r\n    }\r\n    .price-card:hover { transform: translateY(-5px); border-color: #000 !important; }\r\n    .price-card.featured { border-color: #d9282f !important; }\r\n    .price-card.featured::before {\r\n      content: '';\r\n      position: absolute;\r\n      top: 0;\r\n      left: 28px;\r\n      width: 58px;\r\n      height: 2px;\r\n      background: #d9282f;\r\n    }\r\n    .price { font-size: 42px; letter-spacing: -.055em; }\r\n    .feature-list { border-color: var(--line-soft) !important; }\r\n    .feature-list li { border-color: var(--line-soft) !important; }\r\n    .popular { border-width: 1px !important; }\r\n\r\n    \/* About *\/\r\n    .why-grid { gap: clamp(50px, 8vw, 100px); }\r\n    .why-quote {\r\n      border: 1.5px solid #d9282f !important;\r\n      border-radius: 20px;\r\n      padding: clamp(34px, 5vw, 56px);\r\n    }\r\n    .why-quote p { font-size: clamp(29px, 3.6vw, 47px); line-height: 1.06; letter-spacing: -.045em; }\r\n    .why-item { border-color: var(--line-soft) !important; padding: 22px 0; }\r\n\r\n    \/* Contact *\/\r\n    .contact-wrap {\r\n      border: 1px solid #000 !important;\r\n      border-radius: 22px;\r\n    }\r\n    .contact-info { padding: clamp(38px, 5vw, 60px); border-right-color: var(--line-soft) !important; }\r\n    .contact-info::before {\r\n      content: '';\r\n      display: block;\r\n      width: 54px;\r\n      height: 2px;\r\n      margin-bottom: 34px;\r\n      background: #d9282f;\r\n    }\r\n    .contact-info h2 { font-size: clamp(40px, 4.5vw, 60px); }\r\n    .contact-item { border-color: var(--line-soft) !important; }\r\n    .contact-form { padding: clamp(38px, 5vw, 60px); }\r\n    .field input,\r\n    .field select,\r\n    .field textarea {\r\n      border: 0 !important;\r\n      border-bottom: 1px solid var(--line-mid) !important;\r\n      border-radius: 0;\r\n      padding-left: 0;\r\n      padding-right: 0;\r\n    }\r\n    .field input:focus,\r\n    .field select:focus,\r\n    .field textarea:focus { border-bottom-color: #d9282f !important; }\r\n    input::placeholder,\r\n    textarea::placeholder { opacity: .48 !important; }\r\n\r\n    \/* Footer *\/\r\n    .site-footer { border-top: 1px solid #000 !important; }\r\n    .footer-cta { padding-top: clamp(70px, 8vw, 105px); padding-bottom: clamp(62px, 7vw, 90px); border-color: var(--line-soft); }\r\n    .footer-cta h2 { max-width: 860px; font-size: clamp(52px, 7.4vw, 98px); }\r\n    .footer-cta-btn { border-width: 1.5px; }\r\n    .footer-cta-btn:hover { background: #fff !important; color: #000 !important; border-color: #000; }\r\n    .footer-cta-btn:hover span { color: #d9282f !important; }\r\n    .footer-main { border-color: var(--line-soft); }\r\n    .footer-availability,\r\n    .footer-contact-link { border-color: var(--line-soft); }\r\n    .footer-group > a:not(.footer-contact-link):hover { border-bottom-color: var(--line-soft); }\r\n    .footer-bottom-new { min-height: 86px; }\r\n\r\n    \/* Floating controls *\/\r\n    .float-wa,\r\n    .to-top { width: 50px; height: 50px; border-width: 1.5px !important; }\r\n    .float-wa:hover,\r\n    .to-top:hover { border-color: #d9282f !important; color: #d9282f !important; }\r\n\r\n    @media (max-width: 1050px) {\r\n      .container, .nav-inner { width: min(100% - 36px, 1200px); }\r\n      .section-head { align-items: start; }\r\n      .service-card { min-height: 300px; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .container, .nav-inner { width: min(100% - 28px, 1200px); }\r\n      .section { padding: 82px 0; }\r\n      .section-tight { padding: 52px 0; }\r\n      .section-head { margin-bottom: 38px; padding-bottom: 22px; }\r\n      .hero { padding: 126px 0 74px; }\r\n      .hero .display { font-size: clamp(48px, 15vw, 72px); }\r\n      .hero-proof { grid-template-columns: repeat(3,1fr); }\r\n      .hero-proof > div { padding: 16px 10px 0 0; }\r\n      .hero-proof > div + div { padding-left: 12px; }\r\n      .growth-card { padding: 24px 20px; }\r\n      .service-card { min-height: auto; padding: 28px 24px; }\r\n      .case-card, .case-card.dark, .case-card.red { min-height: 360px; }\r\n      .price-card, .price-card.featured { padding: 30px 24px; }\r\n      .contact-wrap { border-radius: 18px; }\r\n      .contact-info { border-right: 0 !important; border-bottom: 1px solid var(--line-soft); }\r\n    }\r\n\r\n  \r\n    \/* ===== WHATSAPP BRAND + CLEAN WORDMARK OVERRIDES ===== *\/\r\n    .brand { gap: 0 !important; }\r\n    .brand-mark { display: none !important; }\r\n\r\n    .whatsapp-link {\r\n      background: #25D366 !important;\r\n      color: #ffffff !important;\r\n      border: 2px solid #25D366 !important;\r\n      box-shadow: 0 10px 24px rgba(37, 211, 102, .22) !important;\r\n    }\r\n    .whatsapp-link:hover {\r\n      background: #20bd5a !important;\r\n      border-color: #20bd5a !important;\r\n      color: #ffffff !important;\r\n      transform: translateY(-2px);\r\n    }\r\n    .whatsapp-link .wa-icon { width: 20px; height: 20px; flex: 0 0 20px; }\r\n\r\n    .float-wa {\r\n      background: #25D366 !important;\r\n      color: #ffffff !important;\r\n      border: 2px solid #25D366 !important;\r\n      box-shadow: 0 14px 32px rgba(37, 211, 102, .30) !important;\r\n    }\r\n    .float-wa svg { width: 28px; height: 28px; display: block; }\r\n    .float-wa:hover {\r\n      background: #20bd5a !important;\r\n      color: #ffffff !important;\r\n      border-color: #20bd5a !important;\r\n      transform: translateY(-3px) scale(1.04);\r\n    }\r\n\r\n\r\n    \/* ===== CONTACT GROWTH ANIMATION ===== *\/\r\n    .contact-motion {\r\n      display: flex;\r\n      align-items: center;\r\n      gap: 16px;\r\n      margin-top: 28px;\r\n      padding-top: 22px;\r\n      border-top: 1px solid #000000;\r\n    }\r\n    .contact-motion-bars {\r\n      width: 76px;\r\n      height: 46px;\r\n      display: flex;\r\n      align-items: flex-end;\r\n      justify-content: center;\r\n      gap: 5px;\r\n      flex: 0 0 auto;\r\n    }\r\n    .contact-motion-bars i {\r\n      display: block;\r\n      width: 8px;\r\n      height: 100%;\r\n      background: #d9282f;\r\n      border-radius: 999px 999px 2px 2px;\r\n      transform-origin: bottom;\r\n      animation: contactGrowth 1.5s ease-in-out infinite;\r\n    }\r\n    .contact-motion-bars i:nth-child(1) { height: 26%; animation-delay: -.60s; }\r\n    .contact-motion-bars i:nth-child(2) { height: 43%; animation-delay: -.45s; }\r\n    .contact-motion-bars i:nth-child(3) { height: 62%; animation-delay: -.30s; }\r\n    .contact-motion-bars i:nth-child(4) { height: 81%; animation-delay: -.15s; }\r\n    .contact-motion-bars i:nth-child(5) { height: 100%; animation-delay: 0s; }\r\n    .contact-motion-copy small {\r\n      display: block;\r\n      margin-bottom: 3px;\r\n      color: #d9282f !important;\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .13em;\r\n    }\r\n    .contact-motion-copy strong {\r\n      display: block;\r\n      color: #000000 !important;\r\n      font-family: var(--font-display);\r\n      font-size: 20px;\r\n      line-height: 1.1;\r\n      letter-spacing: -.025em;\r\n    }\r\n    @keyframes contactGrowth {\r\n      0%, 100% { transform: scaleY(.38); opacity: .38; }\r\n      50% { transform: scaleY(1); opacity: 1; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .contact-motion-bars i { animation: none; transform: scaleY(1); opacity: 1; }\r\n    }\r\n    @media (max-width: 560px) {\r\n      .contact-motion { gap: 12px; }\r\n      .contact-motion-bars { width: 62px; height: 40px; gap: 4px; }\r\n      .contact-motion-bars i { width: 7px; }\r\n      .contact-motion-copy strong { font-size: 18px; }\r\n    }\r\n\r\n  \r\n\r\n    \/* ===== HERO SERVICES ROTATOR ===== *\/\r\n    .service-orbit {\r\n      position: relative;\r\n      width: min(100%, 520px);\r\n      min-height: 540px;\r\n      display: grid;\r\n      place-items: center;\r\n      isolation: isolate;\r\n    }\r\n    .service-orbit::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 370px;\r\n      height: 370px;\r\n      border-radius: 50%;\r\n      border: 1px solid #000;\r\n      opacity: .08;\r\n      animation: servicePulse 4.8s ease-in-out infinite;\r\n    }\r\n    .orbit-ring {\r\n      position: absolute;\r\n      border: 1px solid #000;\r\n      border-radius: 50%;\r\n      opacity: .12;\r\n      pointer-events: none;\r\n    }\r\n    .orbit-ring-one { width: 440px; height: 440px; animation: orbitSpin 24s linear infinite; }\r\n    .orbit-ring-two { width: 505px; height: 505px; border-style: dashed; animation: orbitSpinReverse 34s linear infinite; }\r\n    .orbit-ring-one::before,\r\n    .orbit-ring-two::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 9px;\r\n      height: 9px;\r\n      background: var(--red);\r\n      border-radius: 50%;\r\n      top: 50%;\r\n      left: -5px;\r\n      transform: translateY(-50%);\r\n    }\r\n    .service-display-card {\r\n      position: relative;\r\n      z-index: 4;\r\n      width: min(100%, 415px);\r\n      min-height: 405px;\r\n      display: flex;\r\n      flex-direction: column;\r\n      padding: 30px;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      border-radius: 30px;\r\n      box-shadow: 16px 16px 0 rgba(217,40,47,.10);\r\n      overflow: hidden;\r\n    }\r\n    .service-display-card::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 120px;\r\n      height: 120px;\r\n      border: 18px solid var(--red);\r\n      border-radius: 50%;\r\n      top: -72px;\r\n      right: -55px;\r\n      opacity: .12;\r\n    }\r\n    .service-display-top,\r\n    .service-display-foot {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 20px;\r\n    }\r\n    .service-display-kicker,\r\n    .service-display-count,\r\n    .service-display-foot {\r\n      font-size: 11px;\r\n      font-weight: 800;\r\n      letter-spacing: .14em;\r\n    }\r\n    .service-display-kicker { color: var(--red); }\r\n    .service-display-count { color: #000; }\r\n    .service-display-count b { color: var(--red); font-size: 15px; }\r\n    .service-display-icon {\r\n      width: 72px;\r\n      height: 72px;\r\n      margin-top: 44px;\r\n      display: grid;\r\n      place-items: center;\r\n      border: 2px solid var(--red);\r\n      border-radius: 20px;\r\n      color: var(--red);\r\n      font-family: var(--font-display);\r\n      font-size: 25px;\r\n      font-weight: 850;\r\n      letter-spacing: -.06em;\r\n      transform: rotate(-3deg);\r\n      transition: transform .45s cubic-bezier(.2,.8,.2,1), background .3s ease, color .3s ease;\r\n    }\r\n    .service-display-copy { margin-top: 26px; }\r\n    .service-display-type {\r\n      display: block;\r\n      margin-bottom: 7px;\r\n      color: var(--red);\r\n      font-size: 11px;\r\n      font-weight: 850;\r\n      letter-spacing: .18em;\r\n    }\r\n    .service-display-copy h2 {\r\n      max-width: 330px;\r\n      color: #000;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(30px, 3.4vw, 43px);\r\n      line-height: .98;\r\n      letter-spacing: -.055em;\r\n    }\r\n    .service-display-copy p {\r\n      max-width: 330px;\r\n      margin-top: 14px;\r\n      color: #000;\r\n      font-size: 13px;\r\n      line-height: 1.65;\r\n      opacity: .68;\r\n    }\r\n    .service-display-card.is-changing .service-display-icon,\r\n    .service-display-card.is-changing .service-display-copy {\r\n      animation: serviceSwap .56s cubic-bezier(.2,.8,.2,1) both;\r\n    }\r\n    .service-progress {\r\n      height: 3px;\r\n      margin-top: auto;\r\n      background: rgba(0,0,0,.12);\r\n      overflow: hidden;\r\n    }\r\n    .service-progress span {\r\n      display: block;\r\n      width: 100%;\r\n      height: 100%;\r\n      background: var(--red);\r\n      transform-origin: left center;\r\n      animation: serviceTimer 2.8s linear infinite;\r\n    }\r\n    .service-display-foot {\r\n      margin-top: 14px;\r\n      color: #000;\r\n      letter-spacing: .06em;\r\n    }\r\n    .service-swipe { color: var(--red); }\r\n    .service-swipe b { display: inline-block; animation: nextArrow 1.1s ease-in-out infinite; }\r\n    .orbit-chip {\r\n      position: absolute;\r\n      z-index: 5;\r\n      min-width: 70px;\r\n      height: 42px;\r\n      display: grid;\r\n      place-items: center;\r\n      padding: 0 14px;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      border-radius: 999px;\r\n      color: #000;\r\n      box-shadow: 5px 5px 0 rgba(217,40,47,.12);\r\n      font-size: 11px;\r\n      font-weight: 900;\r\n      letter-spacing: .13em;\r\n    }\r\n    .orbit-chip-a { top: 56px; left: 8px; animation: chipFloatA 4.5s ease-in-out infinite; }\r\n    .orbit-chip-b { top: 82px; right: -2px; animation: chipFloatB 5s ease-in-out -1s infinite; }\r\n    .orbit-chip-c { bottom: 80px; left: -5px; animation: chipFloatB 5.4s ease-in-out -.4s infinite; }\r\n    .orbit-chip-d { bottom: 48px; right: 18px; animation: chipFloatA 4.8s ease-in-out -1.7s infinite; }\r\n\r\n    @keyframes serviceSwap {\r\n      0% { opacity: 0; transform: translateY(18px) scale(.98); }\r\n      100% { opacity: 1; transform: translateY(0) scale(1); }\r\n    }\r\n    @keyframes serviceTimer { from { transform: scaleX(0); } to { transform: scaleX(1); } }\r\n    @keyframes orbitSpin { to { transform: rotate(360deg); } }\r\n    @keyframes orbitSpinReverse { to { transform: rotate(-360deg); } }\r\n    @keyframes servicePulse { 0%,100% { transform: scale(.96); opacity: .04; } 50% { transform: scale(1.05); opacity: .1; } }\r\n    @keyframes chipFloatA { 0%,100% { transform: translate3d(0,0,0) rotate(-2deg); } 50% { transform: translate3d(0,-12px,0) rotate(2deg); } }\r\n    @keyframes chipFloatB { 0%,100% { transform: translate3d(0,0,0) rotate(2deg); } 50% { transform: translate3d(0,11px,0) rotate(-2deg); } }\r\n    @keyframes nextArrow { 0%,100% { transform: translateX(0); } 50% { transform: translateX(5px); } }\r\n\r\n    @media (max-width: 1100px) {\r\n      .service-orbit { width: min(100%, 560px); margin-inline: auto; }\r\n      .orbit-ring-two { width: 490px; height: 490px; }\r\n    }\r\n    @media (max-width: 620px) {\r\n      .hero-stage { min-height: 495px !important; }\r\n      .service-orbit { min-height: 475px; width: 100%; }\r\n      .service-display-card { width: min(88vw, 390px); min-height: 380px; padding: 25px; border-radius: 25px; box-shadow: 10px 10px 0 rgba(217,40,47,.1); }\r\n      .service-display-icon { width: 62px; height: 62px; margin-top: 34px; font-size: 22px; }\r\n      .service-display-copy h2 { font-size: clamp(30px, 9.4vw, 40px); }\r\n      .orbit-ring-one { width: 84vw; height: 84vw; max-width: 410px; max-height: 410px; }\r\n      .orbit-ring-two { width: 94vw; height: 94vw; max-width: 455px; max-height: 455px; }\r\n      .orbit-chip { min-width: 60px; height: 36px; padding: 0 11px; font-size: 9px; }\r\n      .orbit-chip-a { top: 32px; left: 0; }\r\n      .orbit-chip-b { top: 50px; right: 0; }\r\n      .orbit-chip-c { bottom: 48px; left: 2px; }\r\n      .orbit-chip-d { bottom: 25px; right: 6px; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .orbit-ring,\r\n      .service-orbit::before,\r\n      .orbit-chip,\r\n      .service-progress span,\r\n      .service-swipe b { animation: none !important; }\r\n    }\r\n\r\n\r\n\r\n    \/* ===== ADVANCED INTERACTIVE HERO ENGINE ===== *\/\r\n    .hero-stage { perspective: 1200px; }\r\n    .hero-stage::before,\r\n    .hero-stage::after { display: none !important; }\r\n\r\n    .growth-engine {\r\n      --rx: 0deg;\r\n      --ry: 0deg;\r\n      --px: 0px;\r\n      --py: 0px;\r\n      position: relative;\r\n      width: min(100%, 590px);\r\n      min-height: 610px;\r\n      display: grid;\r\n      place-items: center;\r\n      isolation: isolate;\r\n      transform-style: preserve-3d;\r\n    }\r\n    .growth-engine::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: 5% 0;\r\n      background-image:\r\n        linear-gradient(rgba(0,0,0,.055) 1px, transparent 1px),\r\n        linear-gradient(90deg, rgba(0,0,0,.055) 1px, transparent 1px);\r\n      background-size: 38px 38px;\r\n      mask-image: radial-gradient(circle at center, #000 35%, transparent 78%);\r\n      -webkit-mask-image: radial-gradient(circle at center, #000 35%, transparent 78%);\r\n      pointer-events: none;\r\n    }\r\n    .growth-engine::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 8%; right: 8%; top: 50%;\r\n      height: 1px;\r\n      background: #d9282f;\r\n      opacity: .16;\r\n      transform: translateY(-50%);\r\n      box-shadow: 0 -170px 0 rgba(217,40,47,.08), 0 170px 0 rgba(217,40,47,.08);\r\n      pointer-events: none;\r\n    }\r\n\r\n    .engine-orbit {\r\n      position: absolute;\r\n      z-index: 1;\r\n      border: 1px solid rgba(0,0,0,.13);\r\n      border-radius: 50%;\r\n      pointer-events: none;\r\n    }\r\n    .engine-orbit.outer {\r\n      width: 530px;\r\n      height: 530px;\r\n      border-style: dashed;\r\n      animation: engineOrbit 34s linear infinite;\r\n    }\r\n    .engine-orbit.inner {\r\n      width: 445px;\r\n      height: 445px;\r\n      animation: engineOrbitReverse 24s linear infinite;\r\n    }\r\n    .engine-orbit::before,\r\n    .engine-orbit::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 8px; height: 8px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      box-shadow: 0 0 0 6px rgba(217,40,47,.08);\r\n    }\r\n    .engine-orbit::before { top: 50%; left: -4px; transform: translateY(-50%); }\r\n    .engine-orbit::after { top: -4px; left: 50%; transform: translateX(-50%); }\r\n\r\n    .engine-scan {\r\n      position: absolute;\r\n      z-index: 2;\r\n      width: 470px;\r\n      height: 470px;\r\n      border-radius: 50%;\r\n      overflow: hidden;\r\n      pointer-events: none;\r\n      opacity: .3;\r\n    }\r\n    .engine-scan::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 9%; right: 9%; top: 0;\r\n      height: 1px;\r\n      background: linear-gradient(90deg, transparent, #d9282f, transparent);\r\n      animation: engineScan 4.2s ease-in-out infinite;\r\n    }\r\n\r\n    .engine-shell {\r\n      position: relative;\r\n      z-index: 5;\r\n      width: min(100%, 420px);\r\n      min-height: 450px;\r\n      padding: 27px;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      border-radius: 30px;\r\n      box-shadow: 14px 14px 0 rgba(217,40,47,.12);\r\n      transform: rotateX(var(--rx)) rotateY(var(--ry)) translate3d(var(--px), var(--py), 34px);\r\n      transform-style: preserve-3d;\r\n      transition: transform .22s ease-out, box-shadow .35s ease;\r\n      overflow: hidden;\r\n    }\r\n    .engine-shell::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 170px; height: 170px;\r\n      right: -105px; top: -105px;\r\n      border: 24px solid #d9282f;\r\n      border-radius: 50%;\r\n      opacity: .09;\r\n      pointer-events: none;\r\n    }\r\n    .growth-engine:hover .engine-shell { box-shadow: 18px 18px 0 rgba(217,40,47,.14); }\r\n\r\n    .engine-head {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 18px;\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .14em;\r\n      text-transform: uppercase;\r\n    }\r\n    .engine-live { display: inline-flex; align-items: center; gap: 9px; color: #000; }\r\n    .engine-live i {\r\n      width: 8px; height: 8px; border-radius: 50%; background: #d9282f;\r\n      box-shadow: 0 0 0 5px rgba(217,40,47,.1);\r\n      animation: engineLive 1.6s ease-in-out infinite;\r\n    }\r\n    .engine-counter { color: #000; }\r\n    .engine-counter b { color: #d9282f; font-size: 14px; }\r\n\r\n    .engine-core-row {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 20px;\r\n      margin-top: 38px;\r\n    }\r\n    .engine-icon {\r\n      position: relative;\r\n      width: 78px; height: 78px;\r\n      display: grid; place-items: center;\r\n      border: 2px solid #d9282f;\r\n      border-radius: 22px;\r\n      color: #d9282f;\r\n      font-family: var(--font-display);\r\n      font-size: 24px;\r\n      font-weight: 900;\r\n      letter-spacing: -.06em;\r\n      transform: rotate(-4deg) translateZ(24px);\r\n    }\r\n    .engine-icon::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: 8px;\r\n      border: 1px solid rgba(217,40,47,.24);\r\n      border-radius: 15px;\r\n      animation: engineCore 2.2s ease-in-out infinite;\r\n    }\r\n    .engine-mode { text-align: right; }\r\n    .engine-mode span { display: block; color: #d9282f; font-size: 9px; font-weight: 900; letter-spacing: .16em; }\r\n    .engine-mode strong { display: block; margin-top: 5px; color: #000; font-family: var(--font-display); font-size: 20px; letter-spacing: -.03em; }\r\n\r\n    .engine-copy { margin-top: 28px; min-height: 138px; }\r\n    .engine-copy small { color: #d9282f; font-size: 10px; font-weight: 900; letter-spacing: .18em; }\r\n    .engine-copy h2 {\r\n      max-width: 340px;\r\n      margin-top: 8px;\r\n      color: #000;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(30px, 3.4vw, 42px);\r\n      line-height: .98;\r\n      letter-spacing: -.055em;\r\n    }\r\n    .engine-copy p { max-width: 340px; margin-top: 13px; color: #000; opacity: .64; font-size: 12px; line-height: 1.65; }\r\n    .engine-shell.is-changing .engine-icon,\r\n    .engine-shell.is-changing .engine-copy,\r\n    .engine-shell.is-changing .engine-metrics { animation: engineSwap .58s cubic-bezier(.2,.8,.2,1) both; }\r\n\r\n    .engine-metrics {\r\n      display: grid;\r\n      grid-template-columns: repeat(3,1fr);\r\n      gap: 7px;\r\n      margin-top: 8px;\r\n    }\r\n    .engine-metric {\r\n      min-width: 0;\r\n      padding: 11px 10px;\r\n      border: 1px solid rgba(0,0,0,.18);\r\n      border-radius: 13px;\r\n      background: #fff;\r\n    }\r\n    .engine-metric span { display: block; color: #d9282f; font-size: 8px; font-weight: 900; letter-spacing: .1em; }\r\n    .engine-metric strong {\r\n      display: block;\r\n      margin-top: 4px;\r\n      overflow: hidden;\r\n      color: #000;\r\n      font-family: var(--font-display);\r\n      font-size: 13px;\r\n      line-height: 1.1;\r\n      text-overflow: ellipsis;\r\n      white-space: nowrap;\r\n    }\r\n\r\n    .engine-progress { height: 3px; margin-top: 19px; background: rgba(0,0,0,.12); overflow: hidden; }\r\n    .engine-progress span { display: block; width: 100%; height: 100%; background: #d9282f; transform-origin: left; animation: engineTimer 3.4s linear infinite; }\r\n    .engine-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 13px; }\r\n    .engine-foot-copy { color: #000; font-size: 9px; font-weight: 900; letter-spacing: .11em; }\r\n    .engine-controls { display: flex; gap: 7px; }\r\n    .engine-control {\r\n      width: 34px; height: 34px;\r\n      display: grid; place-items: center;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      border-radius: 50%;\r\n      color: #000;\r\n      font-size: 15px;\r\n      cursor: pointer;\r\n      transition: background .2s ease, color .2s ease, transform .2s ease;\r\n    }\r\n    .engine-control:hover { background: #d9282f; color: #fff; border-color: #d9282f; transform: translateY(-2px); }\r\n\r\n    .engine-node {\r\n      --scale: 1;\r\n      position: absolute;\r\n      z-index: 8;\r\n      left: var(--x); top: var(--y);\r\n      min-width: 58px;\r\n      height: 34px;\r\n      padding: 0 10px;\r\n      transform: translate(-50%,-50%) scale(var(--scale));\r\n      border: 1px solid #000;\r\n      border-radius: 999px;\r\n      background: #fff;\r\n      color: #000;\r\n      box-shadow: 4px 4px 0 rgba(217,40,47,.1);\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .1em;\r\n      cursor: pointer;\r\n      transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease;\r\n    }\r\n    .engine-node:hover { --scale: 1.08; box-shadow: 6px 6px 0 rgba(217,40,47,.14); }\r\n    .engine-node.active { --scale: 1.08; background: #d9282f; color: #fff; border-color: #d9282f; box-shadow: 5px 5px 0 rgba(0,0,0,.11); }\r\n    .engine-node::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 4px; height: 4px;\r\n      left: 50%; bottom: -11px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      opacity: 0;\r\n      transform: translateX(-50%);\r\n    }\r\n    .engine-node.active::after { opacity: 1; animation: nodePing 1.1s ease-in-out infinite; }\r\n\r\n    .engine-tag {\r\n      position: absolute;\r\n      z-index: 7;\r\n      display: flex;\r\n      align-items: center;\r\n      gap: 8px;\r\n      padding: 10px 12px;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      color: #000;\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .09em;\r\n      box-shadow: 5px 5px 0 rgba(217,40,47,.09);\r\n      pointer-events: none;\r\n    }\r\n    .engine-tag::before { content: \"\"; width: 7px; height: 7px; border-radius: 50%; background: #d9282f; }\r\n    .engine-tag-a { left: -6px; bottom: 80px; transform: rotate(-3deg); animation: engineFloatA 4.8s ease-in-out infinite; }\r\n    .engine-tag-b { right: 0; top: 88px; transform: rotate(3deg); animation: engineFloatB 5.2s ease-in-out -.8s infinite; }\r\n\r\n    .hero-live-service {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 9px;\r\n      margin-top: 18px;\r\n      color: #000;\r\n      font-size: 12px;\r\n      font-weight: 800;\r\n    }\r\n    .hero-live-service > span:first-child { color: #d9282f; font-size: 9px; font-weight: 900; letter-spacing: .12em; }\r\n    .hero-live-service strong { position: relative; min-width: 210px; font-weight: 800; }\r\n    .hero-live-service strong::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 0; bottom: -5px;\r\n      width: 100%; height: 1px;\r\n      background: linear-gradient(90deg,#d9282f,transparent);\r\n      transform-origin: left;\r\n      animation: liveUnderline 3.4s linear infinite;\r\n    }\r\n\r\n    @keyframes engineOrbit { to { transform: rotate(360deg); } }\r\n    @keyframes engineOrbitReverse { to { transform: rotate(-360deg); } }\r\n    @keyframes engineScan { 0%,100% { transform: translateY(25px); opacity: 0; } 18%,82% { opacity: 1; } 50% { transform: translateY(420px); } }\r\n    @keyframes engineLive { 0%,100% { transform: scale(.7); opacity: .45; } 50% { transform: scale(1); opacity: 1; } }\r\n    @keyframes engineCore { 0%,100% { transform: scale(.8); opacity: .2; } 50% { transform: scale(1); opacity: .7; } }\r\n    @keyframes engineSwap { 0% { opacity: 0; transform: translateY(15px) scale(.985); } 100% { opacity: 1; transform: translateY(0) scale(1); } }\r\n    @keyframes engineTimer { from { transform: scaleX(0); } to { transform: scaleX(1); } }\r\n    @keyframes nodePing { 0%,100% { transform: translateX(-50%) scale(.55); opacity: .35; } 50% { transform: translateX(-50%) scale(1.45); opacity: 1; } }\r\n    @keyframes engineFloatA { 0%,100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-11px) rotate(2deg); } }\r\n    @keyframes engineFloatB { 0%,100% { transform: translateY(0) rotate(3deg); } 50% { transform: translateY(10px) rotate(-2deg); } }\r\n    @keyframes liveUnderline { from { transform: scaleX(0); } to { transform: scaleX(1); } }\r\n\r\n    @media (max-width: 1180px) {\r\n      .growth-engine { width: min(100%, 620px); margin-inline: auto; }\r\n    }\r\n    @media (max-width: 650px) {\r\n      .hero-stage { min-height: 560px !important; }\r\n      .growth-engine { min-height: 540px; width: 100%; }\r\n      .engine-shell { width: min(86vw, 400px); min-height: 430px; padding: 23px; border-radius: 25px; box-shadow: 10px 10px 0 rgba(217,40,47,.11); }\r\n      .engine-orbit.outer { width: 94vw; height: 94vw; max-width: 470px; max-height: 470px; }\r\n      .engine-orbit.inner { width: 80vw; height: 80vw; max-width: 405px; max-height: 405px; }\r\n      .engine-scan { width: 86vw; height: 86vw; max-width: 425px; max-height: 425px; }\r\n      .engine-node { min-width: 48px; height: 30px; padding: 0 8px; font-size: 8px; }\r\n      .engine-tag { display: none; }\r\n      .engine-core-row { margin-top: 30px; }\r\n      .engine-icon { width: 66px; height: 66px; font-size: 21px; }\r\n      .engine-copy { min-height: 136px; }\r\n      .engine-copy h2 { font-size: clamp(29px,9vw,38px); }\r\n      .engine-metric { padding: 9px 7px; }\r\n      .engine-metric strong { font-size: 11px; }\r\n      .growth-engine::before { background-size: 28px 28px; }\r\n    }\r\n    @media (max-width: 430px) {\r\n      .hero-stage { min-height: 525px !important; }\r\n      .growth-engine { min-height: 510px; }\r\n      .engine-shell { width: min(88vw, 360px); min-height: 410px; padding: 20px; }\r\n      .engine-copy { min-height: 132px; }\r\n      .engine-metrics { gap: 5px; }\r\n      .engine-metric span { font-size: 7px; }\r\n      .engine-node { min-width: 44px; height: 28px; }\r\n      .engine-node:nth-of-type(n+7) { display: none; }\r\n      .hero-live-service { align-items: flex-start; }\r\n      .hero-live-service strong { min-width: 0; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .engine-orbit, .engine-scan::before, .engine-live i, .engine-icon::after,\r\n      .engine-progress span, .engine-node.active::after, .engine-tag,\r\n      .hero-live-service strong::after { animation: none !important; }\r\n      .engine-shell { transform: none !important; }\r\n    }\r\n\r\n\r\n\r\n    \/* ===== VIDEO-LIKE INFOGRAPHIC HERO ===== *\/\r\n    .hero-stage { perspective: none !important; min-height: 590px; }\r\n    .info-film {\r\n      position: relative;\r\n      width: min(100%, 560px);\r\n      min-height: 570px;\r\n      padding: 22px;\r\n      background: #fff;\r\n      border: 1px solid #000;\r\n      border-radius: 30px;\r\n      box-shadow: 14px 14px 0 rgba(217,40,47,.12);\r\n      overflow: hidden;\r\n      isolation: isolate;\r\n    }\r\n    .info-film::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: 0;\r\n      background-image: linear-gradient(rgba(0,0,0,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.035) 1px, transparent 1px);\r\n      background-size: 32px 32px;\r\n      pointer-events: none;\r\n      z-index: -1;\r\n    }\r\n    .info-film::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 170px; height: 170px;\r\n      right: -96px; top: -96px;\r\n      border: 22px solid #d9282f;\r\n      border-radius: 50%;\r\n      opacity: .09;\r\n      pointer-events: none;\r\n    }\r\n    .film-head,.film-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; }\r\n    .film-head { position:relative; z-index:5; padding: 2px 2px 15px; border-bottom: 1px solid rgba(0,0,0,.15); }\r\n    .film-brand { display:flex; align-items:center; gap:9px; color:#000; font-size:9px; font-weight:900; letter-spacing:.14em; }\r\n    .film-brand i { width:8px; height:8px; border-radius:50%; background:#d9282f; box-shadow:0 0 0 5px rgba(217,40,47,.10); animation:filmLive 1.4s ease-in-out infinite; }\r\n    .film-counter { color:#000; font-size:10px; font-weight:900; letter-spacing:.1em; }\r\n    .film-counter b { color:#d9282f; font-family:var(--font-display); font-size:17px; }\r\n    .film-stage { position:relative; min-height: 445px; }\r\n    .film-scene {\r\n      position:absolute; inset:0;\r\n      display:grid; grid-template-rows:auto 1fr auto;\r\n      padding: 27px 4px 8px;\r\n      opacity:0; visibility:hidden; transform:translateX(28px) scale(.985);\r\n      transition: opacity .58s ease, transform .65s cubic-bezier(.2,.8,.2,1), visibility .58s;\r\n      pointer-events:none;\r\n    }\r\n    .film-scene.active { opacity:1; visibility:visible; transform:translateX(0) scale(1); pointer-events:auto; }\r\n    .film-scene.leaving { opacity:0; transform:translateX(-28px) scale(.985); }\r\n    .film-scene-copy { position:relative; z-index:3; max-width: 410px; }\r\n    .film-scene-copy.compact { max-width: 470px; }\r\n    .film-kicker { color:#d9282f; font-size:9px; font-weight:900; letter-spacing:.18em; }\r\n    .film-scene-copy h2 { margin-top:7px; color:#000; font-family:var(--font-display); font-size:clamp(31px,3.6vw,46px); line-height:.96; letter-spacing:-.055em; }\r\n    .film-scene-copy h2 em { color:#d9282f; font-style:normal; }\r\n    .film-scene-copy p { max-width:390px; margin-top:12px; color:#000; opacity:.64; font-size:12px; line-height:1.65; }\r\n    .film-caption { display:flex; align-items:center; justify-content:center; gap:12px; padding-top:10px; color:#000; font-size:8px; font-weight:900; letter-spacing:.14em; }\r\n    .film-caption b { color:#d9282f; font-size:14px; animation:captionArrow 1.1s ease-in-out infinite; }\r\n\r\n    .plan-graphic { position:relative; width:300px; height:230px; margin: 2px auto 0; align-self:center; }\r\n    .plan-core { position:absolute; left:50%; top:50%; width:112px; height:112px; display:grid; place-content:center; text-align:center; border:2px solid #d9282f; border-radius:50%; transform:translate(-50%,-50%); background:#fff; z-index:4; animation:coreBreath 2.2s ease-in-out infinite; }\r\n    .plan-core span { color:#d9282f; font-size:8px; font-weight:900; letter-spacing:.18em; }\r\n    .plan-core strong { color:#000; font-family:var(--font-display); font-size:27px; letter-spacing:-.06em; }\r\n    .plan-ring { position:absolute; left:50%; top:50%; border:1px solid rgba(0,0,0,.18); border-radius:50%; transform:translate(-50%,-50%); }\r\n    .pr1 { width:210px; height:210px; animation:ringSpin 14s linear infinite; }\r\n    .pr2 { width:265px; height:265px; border-style:dashed; animation:ringSpinReverse 20s linear infinite; }\r\n    .plan-chip { position:absolute; z-index:5; min-width:54px; height:28px; display:grid; place-items:center; padding:0 8px; background:#fff; border:1px solid #000; border-radius:999px; color:#000; font-size:8px; font-weight:900; letter-spacing:.12em; box-shadow:4px 4px 0 rgba(217,40,47,.10); animation:chipPop 2.8s ease-in-out infinite; }\r\n    .pc1{left:17px;top:22px}.pc2{right:13px;top:27px;animation-delay:-.4s}.pc3{right:0;top:103px;animation-delay:-.8s}.pc4{right:24px;bottom:13px;animation-delay:-1.2s}.pc5{left:15px;bottom:19px;animation-delay:-1.6s}.pc6{left:-1px;top:105px;animation-delay:-2s}\r\n\r\n    .build-flow { position:relative; align-self:center; min-height:235px; display:grid; grid-template-columns:92px 1fr 112px 1fr 92px; align-items:center; gap:8px; padding: 6px 5px; }\r\n    .flow-stack { display:grid; gap:9px; position:relative; z-index:4; }\r\n    .flow-stack span { height:29px; display:grid; place-items:center; border:1px solid #000; border-radius:999px; background:#fff; color:#000; font-size:8px; font-weight:900; letter-spacing:.12em; }\r\n    .flow-out span { border-color:#d9282f; color:#d9282f; }\r\n    .flow-core { position:relative; z-index:5; width:118px; height:118px; display:grid; place-content:center; text-align:center; border:2px solid #d9282f; border-radius:28px; background:#fff; transform:rotate(-3deg); box-shadow:8px 8px 0 rgba(217,40,47,.1); }\r\n    .flow-core small { color:#d9282f; font-size:7px; font-weight:900; letter-spacing:.14em; }\r\n    .flow-core strong { color:#000; font-family:var(--font-display); font-size:29px; letter-spacing:-.06em; }\r\n    .flow-core i { position:absolute; inset:9px; border:1px solid rgba(217,40,47,.25); border-radius:20px; animation:buildPulse 1.8s ease-in-out infinite; }\r\n    .flow-line { height:1px; background:#000; position:relative; overflow:visible; }\r\n    .flow-line::after { content:\"\"; position:absolute; width:7px; height:7px; top:50%; left:0; border-radius:50%; background:#d9282f; transform:translate(-50%,-50%); animation:dataMove 1.45s linear infinite; }\r\n    .fl2::after,.fr2::after{animation-delay:-.48s}.fl3::after,.fr3::after{animation-delay:-.96s}.fr1::after,.fr2::after,.fr3::after{animation-direction:reverse}\r\n\r\n    .growth-chart { align-self:center; display:grid; grid-template-columns: 1.05fr .95fr; gap:18px; align-items:end; min-height:235px; padding:4px 8px; }\r\n    .growth-bars { height:190px; display:flex; align-items:end; gap:9px; padding:12px 12px 0; border-left:1px solid #000; border-bottom:1px solid #000; }\r\n    .growth-bars i { flex:1; max-width:32px; height:var(--h); background:#d9282f; transform-origin:bottom; animation:barGrow 1.1s cubic-bezier(.2,.8,.2,1) both; }\r\n    .growth-bars i:nth-child(2){animation-delay:.12s}.growth-bars i:nth-child(3){animation-delay:.24s}.growth-bars i:nth-child(4){animation-delay:.36s}.growth-bars i:nth-child(5){animation-delay:.48s}\r\n    .growth-metrics { display:grid; gap:8px; }\r\n    .growth-metrics div { padding:10px 11px; border:1px solid #000; border-radius:13px; background:#fff; }\r\n    .growth-metrics strong { display:block; color:#d9282f; font-family:var(--font-display); font-size:25px; line-height:1; }\r\n    .growth-metrics span { display:block; margin-top:5px; color:#000; font-size:7px; font-weight:900; letter-spacing:.12em; }\r\n    .growth-tags { grid-column:1\/-1; display:flex; gap:7px; flex-wrap:wrap; }\r\n    .growth-tags span { padding:6px 8px; border:1px solid #000; border-radius:999px; background:#fff; color:#000; font-size:7px; font-weight:900; letter-spacing:.1em; animation:tagBlink 2.2s ease-in-out infinite; }\r\n    .growth-tags span:nth-child(2){animation-delay:-.4s}.growth-tags span:nth-child(3){animation-delay:-.8s}.growth-tags span:nth-child(4){animation-delay:-1.2s}\r\n\r\n    .scale-graphic { align-self:center; min-height:235px; padding: 4px 7px 0; }\r\n    .scale-graphic svg { width:100%; height:155px; overflow:visible; }\r\n    .scale-grid { fill:none; stroke:#000; stroke-width:1; opacity:.11; }\r\n    .scale-path { fill:none; stroke:#d9282f; stroke-width:4; stroke-linecap:round; stroke-dasharray:560; stroke-dashoffset:560; animation:drawScale 2.4s cubic-bezier(.2,.8,.2,1) forwards; }\r\n    .scale-dot { fill:#fff; stroke:#d9282f; stroke-width:3; opacity:0; animation:dotReveal .35s ease forwards; }\r\n    .sd1{animation-delay:.7s}.sd2{animation-delay:1.05s}.sd3{animation-delay:1.4s}.sd4{animation-delay:1.9s}\r\n    .scale-results { display:flex; justify-content:space-between; gap:8px; margin-top:2px; }\r\n    .scale-results span { flex:1; padding:8px 6px; border:1px solid #000; border-radius:10px; text-align:center; color:#000; font-size:7px; font-weight:900; letter-spacing:.08em; background:#fff; }\r\n    .scale-results b { color:#d9282f; font-size:12px; }\r\n    .scale-services { display:flex; justify-content:center; flex-wrap:wrap; gap:7px; margin-top:8px; }\r\n    .scale-services span { padding:5px 8px; border-radius:999px; background:#d9282f; color:#fff; font-size:7px; font-weight:900; letter-spacing:.1em; }\r\n\r\n    .film-timeline { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; padding: 12px 2px 8px; border-top:1px solid rgba(0,0,0,.15); }\r\n    .film-dot { position:relative; display:flex; align-items:center; gap:7px; padding:0; border:0; background:none; color:#000; opacity:.35; cursor:pointer; font:inherit; transition:.25s ease; }\r\n    .film-dot span { font-size:7px; font-weight:900; letter-spacing:.1em; }\r\n    .film-dot i { position:relative; flex:1; height:2px; background:rgba(0,0,0,.16); overflow:hidden; }\r\n    .film-dot i::after { content:\"\"; position:absolute; inset:0; background:#d9282f; transform:scaleX(0); transform-origin:left; }\r\n    .film-dot.active { opacity:1; }\r\n    .film-dot.active i::after { animation:filmTimer 3.5s linear forwards; }\r\n    .film-foot { padding:4px 2px 0; color:#000; opacity:.45; font-size:7px; font-weight:900; letter-spacing:.12em; }\r\n\r\n    @keyframes filmLive{0%,100%{transform:scale(.78);opacity:.45}50%{transform:scale(1.15);opacity:1}}\r\n    @keyframes captionArrow{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}\r\n    @keyframes coreBreath{0%,100%{transform:translate(-50%,-50%) scale(.96)}50%{transform:translate(-50%,-50%) scale(1.03)}}\r\n    @keyframes ringSpin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}\r\n    @keyframes ringSpinReverse{from{transform:translate(-50%,-50%) rotate(360deg)}to{transform:translate(-50%,-50%) rotate(0)}}\r\n    @keyframes chipPop{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}\r\n    @keyframes buildPulse{0%,100%{transform:scale(.94);opacity:.35}50%{transform:scale(1);opacity:1}}\r\n    @keyframes dataMove{from{left:0}to{left:100%}}\r\n    @keyframes barGrow{from{transform:scaleY(.05);opacity:.25}to{transform:scaleY(1);opacity:1}}\r\n    @keyframes tagBlink{0%,100%{opacity:.45}50%{opacity:1}}\r\n    @keyframes drawScale{to{stroke-dashoffset:0}}\r\n    @keyframes dotReveal{to{opacity:1;transform:scale(1)}}\r\n    @keyframes filmTimer{from{transform:scaleX(0)}to{transform:scaleX(1)}}\r\n\r\n    @media (max-width: 620px) {\r\n      .hero-stage { min-height: 540px !important; }\r\n      .info-film { width:min(92vw,430px); min-height:530px; padding:18px; border-radius:25px; box-shadow:10px 10px 0 rgba(217,40,47,.11); }\r\n      .film-stage { min-height:410px; }\r\n      .film-scene { padding-top:22px; }\r\n      .film-scene-copy h2 { font-size:clamp(30px,9.5vw,39px); }\r\n      .plan-graphic { transform:scale(.86); transform-origin:center; margin-top:-6px; }\r\n      .build-flow { grid-template-columns:70px 1fr 96px 1fr 70px; gap:5px; }\r\n      .flow-core { width:98px; height:98px; border-radius:23px; }\r\n      .flow-core strong { font-size:24px; }\r\n      .flow-stack span { height:25px; font-size:7px; }\r\n      .growth-chart { min-height:218px; gap:10px; }\r\n      .growth-bars { height:168px; gap:6px; }\r\n      .growth-metrics strong { font-size:21px; }\r\n      .scale-graphic svg { height:145px; }\r\n      .film-caption { gap:8px; font-size:7px; }\r\n      .film-dot span { display:none; }\r\n      .film-dot i { height:3px; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .film-brand i,.film-caption b,.plan-core,.plan-ring,.plan-chip,.flow-core i,.flow-line::after,.growth-bars i,.growth-tags span,.scale-path,.scale-dot,.film-dot.active i::after { animation:none !important; }\r\n      .scale-path { stroke-dashoffset:0; }\r\n      .scale-dot { opacity:1; }\r\n      .film-scene { transition:none; }\r\n    }\r\n\r\n  \r\n\r\n    \/* ===== HERO BALANCE REFINEMENT ===== *\/\r\n    .hero {\r\n      min-height: 780px;\r\n      padding: 158px 0 96px;\r\n    }\r\n    .hero-grid {\r\n      grid-template-columns: minmax(0, 1fr) minmax(430px, .94fr);\r\n      gap: clamp(46px, 6vw, 76px);\r\n      align-items: center;\r\n    }\r\n    .hero .display {\r\n      max-width: 690px;\r\n      margin-top: 22px;\r\n      font-size: clamp(44px, 5vw, 70px);\r\n      line-height: 1.01;\r\n      letter-spacing: -.05em;\r\n    }\r\n    .hero-copy > p {\r\n      max-width: 590px;\r\n      margin-top: 22px;\r\n      font-size: clamp(16px, 1.45vw, 19px);\r\n      line-height: 1.7;\r\n    }\r\n    .hero-actions { margin-top: 28px; }\r\n    .hero-note { margin-top: 18px; }\r\n    .hero-live-service { margin-top: 24px; }\r\n    .hero-proof { margin-top: 42px; max-width: 590px; }\r\n    .hero-stage { min-height: 560px; }\r\n    .info-film { width: min(100%, 540px); min-height: 550px; }\r\n\r\n    @media (max-width: 1050px) {\r\n      .hero { min-height: auto; padding: 145px 0 88px; }\r\n      .hero-grid { grid-template-columns: 1fr; gap: 54px; }\r\n      .hero-copy { max-width: 760px; }\r\n      .hero .display { max-width: 720px; font-size: clamp(46px, 7vw, 66px); }\r\n      .hero-copy > p { max-width: 650px; }\r\n      .hero-stage { min-height: 550px; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .hero { padding: 118px 0 68px; }\r\n      .hero-grid { gap: 42px; }\r\n      .hero .display {\r\n        max-width: 100%;\r\n        margin-top: 20px;\r\n        font-size: clamp(40px, 11.8vw, 56px);\r\n        line-height: 1.02;\r\n        letter-spacing: -.045em;\r\n      }\r\n      .hero-copy > p { margin-top: 18px; font-size: 16px; line-height: 1.65; }\r\n      .hero-actions { margin-top: 24px; }\r\n      .hero-note { margin-top: 16px; gap: 10px; flex-wrap: wrap; }\r\n      .hero-live-service { margin-top: 20px; }\r\n      .hero-proof { margin-top: 32px; }\r\n      .hero-proof strong { font-size: 22px; }\r\n      .hero-stage { min-height: 520px !important; }\r\n      .info-film { min-height: 515px; }\r\n    }\r\n\r\n\r\n    \/* ===== FINAL TYPE SCALE + RESEARCH-STYLE BUSINESS INFOGRAPHIC ===== *\/\r\n    body { font-size: 15px; }\r\n    .hero { min-height: auto !important; padding: 148px 0 84px !important; }\r\n    .hero .container { width: min(1260px, calc(100% - 56px)); }\r\n    .hero-grid {\r\n      grid-template-columns: minmax(410px, .82fr) minmax(610px, 1.18fr) !important;\r\n      gap: clamp(40px, 5vw, 66px) !important;\r\n      align-items: center;\r\n    }\r\n    .hero .display {\r\n      max-width: 650px !important;\r\n      margin-top: 21px !important;\r\n      font-size: clamp(44px, 5.15vw, 68px) !important;\r\n      line-height: 1.01 !important;\r\n      letter-spacing: -.048em !important;\r\n    }\r\n    .hero-copy > p {\r\n      max-width: 565px !important;\r\n      margin-top: 18px !important;\r\n      font-size: clamp(15px, 1.35vw, 17px) !important;\r\n      line-height: 1.7 !important;\r\n    }\r\n    .hero-actions { margin-top: 26px !important; }\r\n    .hero-note { margin-top: 17px !important; font-size: 12px !important; }\r\n    .hero-live-service { margin-top: 21px !important; font-size: 10px !important; }\r\n    .hero-live-service strong { font-size: 11px !important; }\r\n    .hero-proof { margin-top: 34px !important; max-width: 560px !important; }\r\n    .hero-proof strong { font-size: 21px !important; }\r\n    .hero-proof span { font-size: 11px !important; }\r\n\r\n    .section { padding: clamp(80px, 8vw, 108px) 0 !important; }\r\n    .section-tight { padding: clamp(48px, 5vw, 64px) 0 !important; }\r\n    .section-title { font-size: clamp(30px, 3.6vw, 46px) !important; line-height: 1.05 !important; }\r\n    .section-lead { font-size: 15px !important; line-height: 1.7 !important; }\r\n    .service-card h3 { font-size: 22px !important; }\r\n    .step h3 { font-size: 19px !important; }\r\n    .case-card h3 { font-size: clamp(25px, 2.7vw, 34px) !important; }\r\n    .price { font-size: 36px !important; }\r\n    .why-quote p { font-size: clamp(27px, 3vw, 38px) !important; }\r\n    .contact-info h2 { font-size: clamp(34px, 3.7vw, 48px) !important; }\r\n    .form-head h3 { font-size: 25px !important; }\r\n    .footer-cta h2 { font-size: clamp(40px, 5.4vw, 70px) !important; line-height: .96 !important; }\r\n\r\n    .hero-stage { min-height: 600px !important; perspective: none !important; }\r\n    .business-paper {\r\n      width: min(100%, 690px);\r\n      background: #fff;\r\n      border: 1px solid rgba(0,0,0,.23);\r\n      overflow: hidden;\r\n      position: relative;\r\n    }\r\n    .business-paper::before {\r\n      content: '';\r\n      position: absolute;\r\n      inset: 0;\r\n      background-image: linear-gradient(rgba(0,0,0,.028) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.028) 1px, transparent 1px);\r\n      background-size: 34px 34px;\r\n      pointer-events: none;\r\n    }\r\n    .business-paper-head,\r\n    .business-paper-foot {\r\n      position: relative;\r\n      z-index: 2;\r\n      min-height: 38px;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 18px;\r\n      padding: 0 18px;\r\n      color: #000;\r\n      background: rgba(255,255,255,.96);\r\n      font-size: 8px;\r\n      font-weight: 900;\r\n      letter-spacing: .13em;\r\n      text-transform: uppercase;\r\n    }\r\n    .business-paper-head { border-bottom: 1px solid rgba(0,0,0,.16); }\r\n    .business-paper-foot { border-top: 1px solid rgba(0,0,0,.16); }\r\n    .business-paper-foot b { color: #d9282f; font-size: 11px; }\r\n    .paper-live { display: inline-flex; align-items: center; gap: 7px; }\r\n    .paper-live i { width: 6px; height: 6px; border-radius: 50%; background: #d9282f; animation: paperLive 1.4s ease-in-out infinite; }\r\n\r\n    .growth-paper-row {\r\n      position: relative;\r\n      z-index: 2;\r\n      min-height: 254px;\r\n      display: grid;\r\n      grid-template-columns: 1.08fr .92fr;\r\n      background: rgba(255,255,255,.94);\r\n      border-bottom: 1px solid rgba(0,0,0,.16);\r\n      transition: background .35s ease;\r\n    }\r\n    .growth-paper-row:nth-of-type(3) { border-bottom: 0; }\r\n    .growth-paper-row::after {\r\n      content: '';\r\n      position: absolute;\r\n      left: 0;\r\n      top: 0;\r\n      width: 2px;\r\n      height: 0;\r\n      background: #d9282f;\r\n      transition: height 3.8s linear;\r\n    }\r\n    .growth-paper-row.active::after { height: 100%; }\r\n    .growth-paper-row.active { background: #fff; }\r\n    .growth-paper-row.diagram-only { grid-template-columns: 1fr; }\r\n    .growth-paper-row.diagram-only .paper-diagram { border-right: 0; padding: 18px 30px 20px; }\r\n    .growth-paper-row.diagram-only .growth-svg { width: min(100%, 720px); }\r\n    .paper-diagram {\r\n      min-width: 0;\r\n      display: grid;\r\n      place-items: center;\r\n      padding: 20px 14px 18px 18px;\r\n      border-right: 1px solid rgba(0,0,0,.16);\r\n    }\r\n    .growth-svg { width: 100%; height: auto; overflow: visible; }\r\n    .growth-svg text { font-family: var(--font-body); fill: #000; }\r\n    .node-box, .node-circle { fill: #fff; stroke: #000; stroke-width: 1.4; }\r\n    .group-box { fill: rgba(255,255,255,.75); stroke: #000; stroke-width: 1.2; stroke-dasharray: 5 4; }\r\n    .focus-node { stroke: #d9282f; stroke-width: 2.2; }\r\n    .lead-circle { fill: #d9282f; stroke: #d9282f; stroke-width: 1.5; }\r\n    .svg-label { font-size: 11px; font-weight: 800; letter-spacing: .04em; }\r\n    .svg-title { font-size: 12px; font-weight: 900; letter-spacing: -.02em; }\r\n    .svg-mini { font-size: 8px; font-weight: 700; opacity: .72; }\r\n    .svg-red { fill: #d9282f !important; opacity: 1; }\r\n    .svg-white { fill: #fff !important; }\r\n    .flow-path { fill: none; stroke: #000; stroke-width: 1.6; stroke-dasharray: 7 5; animation: paperDash 1.35s linear infinite; }\r\n    .flow-red { stroke: #d9282f; stroke-width: 2; }\r\n    .soft-link { fill: none; stroke: #000; stroke-width: 1; opacity: .25; }\r\n    .loop-path { fill: none; stroke: #d9282f; stroke-width: 1.6; stroke-dasharray: 7 5; animation: paperDash 1.6s linear infinite reverse; }\r\n    .signal { fill: #d9282f; transform-box: fill-box; transform-origin: center; animation: signalPulse 1.25s ease-in-out infinite; }\r\n    .signal-b { animation-delay: -.4s; }\r\n    .signal-c { animation-delay: -.8s; }\r\n\r\n    .paper-copy {\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n      padding: 28px 26px;\r\n      min-width: 0;\r\n    }\r\n    .paper-kicker {\r\n      width: fit-content;\r\n      margin-bottom: 12px;\r\n      padding-bottom: 4px;\r\n      border-bottom: 1px solid #d9282f;\r\n      color: #d9282f !important;\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .13em;\r\n    }\r\n    .paper-copy h2 {\r\n      margin: 0;\r\n      color: #000;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(20px, 2vw, 27px);\r\n      line-height: 1.12;\r\n      letter-spacing: -.035em;\r\n      font-weight: 800;\r\n    }\r\n    .paper-copy h2 span { color: #d9282f; }\r\n    .paper-copy p {\r\n      margin: 12px 0 0;\r\n      color: #000 !important;\r\n      font-size: 11px;\r\n      line-height: 1.72;\r\n      opacity: .72;\r\n    }\r\n    .paper-flow-label {\r\n      margin-top: 16px;\r\n      color: #000;\r\n      font-size: 8px;\r\n      font-weight: 900;\r\n      letter-spacing: .08em;\r\n      white-space: nowrap;\r\n    }\r\n    .paper-flow-label b { color: #d9282f; padding: 0 4px; }\r\n\r\n    .growth-paper-row:not(.active) .lead-circle,\r\n    .growth-paper-row:not(.active) .focus-node { opacity: .78; }\r\n    .growth-paper-row.active .focus-node { animation: focusPulse 1.8s ease-in-out infinite; }\r\n\r\n    @keyframes paperDash { to { stroke-dashoffset: -24; } }\r\n    @keyframes signalPulse { 0%,100% { transform: scale(.7); opacity: .35; } 50% { transform: scale(1.45); opacity: 1; } }\r\n    @keyframes focusPulse { 0%,100% { stroke-width: 1.7; } 50% { stroke-width: 3.2; } }\r\n    @keyframes paperLive { 0%,100% { opacity: .35; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.25); } }\r\n\r\n    @media (max-width: 1120px) {\r\n      .hero .container { width: min(100% - 40px, 1180px); }\r\n      .hero-grid { grid-template-columns: 1fr !important; gap: 42px !important; }\r\n      .hero-copy { max-width: 720px; }\r\n      .hero-stage { min-height: auto !important; }\r\n      .business-paper { width: min(100%, 760px); margin-inline: auto; }\r\n    }\r\n    @media (max-width: 720px) {\r\n      .hero { padding: 118px 0 68px !important; }\r\n      .hero .container { width: min(100% - 28px, 1180px); }\r\n      .hero .display { font-size: clamp(39px, 12vw, 54px) !important; }\r\n      .hero-copy > p { font-size: 15px !important; }\r\n      .hero-proof { margin-top: 28px !important; }\r\n      .business-paper-head, .business-paper-foot { padding: 0 12px; }\r\n      .business-paper-foot span:last-child { display: none; }\r\n      .growth-paper-row { grid-template-columns: 1fr; min-height: 0; }\r\n      .paper-diagram { border-right: 0; border-bottom: 1px solid rgba(0,0,0,.13); padding: 14px 10px 10px; }\r\n      .growth-paper-row.diagram-only .paper-diagram { border-bottom: 0; padding: 14px 12px 16px; }\r\n      .paper-copy { padding: 22px 20px 24px; }\r\n      .paper-copy h2 { font-size: 23px; }\r\n      .paper-copy p { font-size: 11.5px; }\r\n      .growth-svg { max-height: 205px; }\r\n      .footer-cta h2 { font-size: clamp(36px, 11vw, 52px) !important; }\r\n    }\r\n    @media (max-width: 440px) {\r\n      .paper-flow-label { white-space: normal; line-height: 1.6; }\r\n      .business-paper-head { font-size: 7px; }\r\n      .business-paper-head > span:first-child { max-width: 150px; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .flow-path, .loop-path, .signal, .focus-node, .paper-live i { animation: none !important; }\r\n      .growth-paper-row::after { transition: none; height: 100%; }\r\n    }\r\n\r\n\r\n\r\n    \/* ===== HERO \u2014 ALL SERVICES STACK ===== *\/\r\n    .hero-stage { min-height: 590px !important; display: grid; place-items: center; }\r\n    .hero-services-stack {\r\n      position: relative;\r\n      width: min(100%, 590px);\r\n      padding: 18px;\r\n      background: #ffffff;\r\n      border: 1px solid #000000;\r\n      border-radius: 26px;\r\n      overflow: hidden;\r\n      box-shadow: 14px 14px 0 rgba(217,40,47,.10);\r\n      isolation: isolate;\r\n    }\r\n    .hero-services-stack::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      top: 0;\r\n      left: -35%;\r\n      width: 34%;\r\n      height: 2px;\r\n      background: #d9282f;\r\n      animation: heroStackScan 4.6s ease-in-out infinite;\r\n      z-index: 4;\r\n    }\r\n    .hero-services-stack::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: 170px;\r\n      height: 170px;\r\n      right: -125px;\r\n      top: -125px;\r\n      border: 22px solid #d9282f;\r\n      border-radius: 50%;\r\n      opacity: .08;\r\n      pointer-events: none;\r\n    }\r\n    .hero-services-head {\r\n      display: flex;\r\n      align-items: flex-start;\r\n      justify-content: space-between;\r\n      gap: 20px;\r\n      padding: 6px 4px 18px;\r\n      border-bottom: 1px solid #000;\r\n    }\r\n    .hero-services-head > div:first-child span {\r\n      display: block;\r\n      margin-bottom: 5px;\r\n      color: #d9282f;\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .15em;\r\n    }\r\n    .hero-services-head > div:first-child strong {\r\n      display: block;\r\n      color: #000;\r\n      font-family: var(--font-display);\r\n      font-size: 24px;\r\n      line-height: 1;\r\n      letter-spacing: -.035em;\r\n    }\r\n    .hero-services-count {\r\n      display: flex;\r\n      align-items: baseline;\r\n      gap: 7px;\r\n      color: #000;\r\n    }\r\n    .hero-services-count b {\r\n      color: #d9282f;\r\n      font-family: var(--font-display);\r\n      font-size: 30px;\r\n      line-height: 1;\r\n    }\r\n    .hero-services-count span {\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .12em;\r\n    }\r\n    .hero-services-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(2, minmax(0,1fr));\r\n      gap: 8px;\r\n      padding: 16px 0;\r\n    }\r\n    .hero-service-tile {\r\n      min-width: 0;\r\n      min-height: 66px;\r\n      display: grid;\r\n      grid-template-columns: 28px minmax(0,1fr) 22px;\r\n      align-items: center;\r\n      gap: 8px;\r\n      padding: 10px 10px 10px 11px;\r\n      background: #fff;\r\n      color: #000;\r\n      border: 1px solid #000;\r\n      border-radius: 12px;\r\n      transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;\r\n    }\r\n    .hero-service-tile:hover { transform: translateY(-2px); border-color: #d9282f; }\r\n    .hero-service-tile.active {\r\n      background: #d9282f;\r\n      color: #fff;\r\n      border-color: #d9282f;\r\n      transform: translateY(-2px);\r\n    }\r\n    .hst-num {\r\n      color: #d9282f;\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .08em;\r\n    }\r\n    .hero-service-tile.active .hst-num { color: #fff; }\r\n    .hst-copy { min-width: 0; }\r\n    .hst-copy b {\r\n      display: block;\r\n      overflow: hidden;\r\n      color: inherit;\r\n      font-family: var(--font-display);\r\n      font-size: 14px;\r\n      line-height: 1.05;\r\n      letter-spacing: -.02em;\r\n      text-overflow: ellipsis;\r\n      white-space: nowrap;\r\n    }\r\n    .hst-copy small {\r\n      display: block;\r\n      margin-top: 5px;\r\n      color: #000;\r\n      font-size: 8px;\r\n      font-weight: 900;\r\n      letter-spacing: .11em;\r\n      opacity: .58;\r\n    }\r\n    .hero-service-tile.active .hst-copy small { color: #fff; opacity: .8; }\r\n    .hst-arrow {\r\n      display: grid;\r\n      place-items: center;\r\n      font-size: 13px;\r\n      transition: transform .25s ease;\r\n    }\r\n    .hero-service-tile:hover .hst-arrow,\r\n    .hero-service-tile.active .hst-arrow { transform: translate(2px,-2px); }\r\n    .hero-services-foot {\r\n      min-height: 50px;\r\n      display: grid;\r\n      grid-template-columns: auto minmax(0,1fr);\r\n      align-items: center;\r\n      gap: 15px;\r\n      padding: 13px 4px 2px;\r\n      border-top: 1px solid #000;\r\n    }\r\n    .hero-services-foot > span {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 8px;\r\n      color: #000;\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .12em;\r\n      white-space: nowrap;\r\n    }\r\n    .hero-services-foot > span i {\r\n      width: 7px;\r\n      height: 7px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      box-shadow: 0 0 0 5px rgba(217,40,47,.10);\r\n      animation: heroServiceLive 1.5s ease-in-out infinite;\r\n    }\r\n    .hero-services-foot strong {\r\n      min-width: 0;\r\n      overflow: hidden;\r\n      color: #d9282f;\r\n      font-family: var(--font-display);\r\n      font-size: 14px;\r\n      text-align: right;\r\n      text-overflow: ellipsis;\r\n      white-space: nowrap;\r\n    }\r\n    @keyframes heroStackScan {\r\n      0% { left: -35%; opacity: 0; }\r\n      15% { opacity: 1; }\r\n      75% { opacity: 1; }\r\n      100% { left: 105%; opacity: 0; }\r\n    }\r\n    @keyframes heroServiceLive {\r\n      0%,100% { transform: scale(.8); opacity: .45; }\r\n      50% { transform: scale(1.15); opacity: 1; }\r\n    }\r\n    @media (max-width: 1050px) {\r\n      .hero-stage { min-height: auto !important; }\r\n      .hero-services-stack { width: min(100%, 720px); }\r\n    }\r\n    @media (max-width: 620px) {\r\n      .hero-services-stack { padding: 14px; border-radius: 20px; box-shadow: 9px 9px 0 rgba(217,40,47,.10); }\r\n      .hero-services-head > div:first-child strong { font-size: 21px; }\r\n      .hero-services-count b { font-size: 26px; }\r\n      .hero-services-grid { grid-template-columns: 1fr; gap: 7px; }\r\n      .hero-service-tile { min-height: 58px; }\r\n      .hst-copy b { font-size: 14px; }\r\n      .hero-services-foot { grid-template-columns: 1fr; gap: 7px; }\r\n      .hero-services-foot strong { text-align: left; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .hero-services-stack::before,\r\n      .hero-services-foot > span i { animation: none !important; }\r\n    }\r\n\r\n\r\n    \/* ===== WEBSITE OPEN \u2014 CIRCULAR SERVICE INTRO ===== *\/\r\n    .service-intro {\r\n      position: fixed;\r\n      inset: 0;\r\n      z-index: 99999;\r\n      display: grid;\r\n      place-items: center;\r\n      background: #fff;\r\n      color: #000;\r\n      overflow: hidden;\r\n      transition: opacity .75s cubic-bezier(.2,.7,.2,1), visibility .75s;\r\n    }\r\n    .service-intro.is-leaving {\r\n      opacity: 0;\r\n      visibility: hidden;\r\n      pointer-events: none;\r\n    }\r\n    .service-intro::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: min(72vw, 760px);\r\n      aspect-ratio: 1;\r\n      border: 1px solid rgba(0,0,0,.08);\r\n      border-radius: 50%;\r\n      transform: scale(.7);\r\n      opacity: 0;\r\n      animation: introRingIn .9s .12s cubic-bezier(.2,.8,.2,1) forwards;\r\n    }\r\n    .service-intro::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      width: min(51vw, 540px);\r\n      aspect-ratio: 1;\r\n      border: 1px dashed rgba(217,40,47,.36);\r\n      border-radius: 50%;\r\n      animation: introDashedRing 18s linear infinite, introFade .8s .2s both;\r\n    }\r\n    .intro-stage {\r\n      position: relative;\r\n      width: min(86vw, 840px);\r\n      aspect-ratio: 1;\r\n      max-height: 88vh;\r\n    }\r\n    .intro-stage svg {\r\n      position: absolute;\r\n      inset: 0;\r\n      width: 100%;\r\n      height: 100%;\r\n      overflow: visible;\r\n      pointer-events: none;\r\n    }\r\n    .intro-spoke {\r\n      stroke: rgba(0,0,0,.12);\r\n      stroke-width: 1;\r\n      stroke-dasharray: 3 7;\r\n      opacity: 0;\r\n      animation: introSpokeIn .55s var(--d, .3s) ease forwards;\r\n    }\r\n    .intro-center {\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      width: clamp(142px, 17vw, 190px);\r\n      aspect-ratio: 1;\r\n      transform: translate(-50%,-50%) scale(.65);\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      color: #fff;\r\n      display: grid;\r\n      place-items: center;\r\n      text-align: center;\r\n      box-shadow: 0 0 0 12px rgba(217,40,47,.08), 0 0 0 24px rgba(217,40,47,.035);\r\n      opacity: 0;\r\n      animation: introCenterIn .72s .05s cubic-bezier(.2,.85,.2,1.15) forwards, introCenterPulse 2s 1s ease-in-out infinite;\r\n      z-index: 4;\r\n    }\r\n    .intro-center strong {\r\n      display: block;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(31px, 4vw, 48px);\r\n      line-height: .9;\r\n      letter-spacing: -.05em;\r\n    }\r\n    .intro-center span {\r\n      display: block;\r\n      margin-top: 9px;\r\n      font-size: 8px;\r\n      font-weight: 900;\r\n      letter-spacing: .18em;\r\n      text-transform: uppercase;\r\n    }\r\n    .intro-services {\r\n      position: absolute;\r\n      inset: 0;\r\n      z-index: 5;\r\n    }\r\n    .intro-service {\r\n      --tx: 0px;\r\n      --ty: 0px;\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      width: clamp(118px, 15vw, 164px);\r\n      min-height: 48px;\r\n      padding: 9px 10px;\r\n      transform: translate(-50%,-50%) translate(0,0) scale(.25);\r\n      border: 1px solid #000;\r\n      border-radius: 999px;\r\n      background: #fff;\r\n      color: #000;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      gap: 7px;\r\n      text-align: center;\r\n      font-size: clamp(8px, .9vw, 10px);\r\n      font-weight: 850;\r\n      line-height: 1.18;\r\n      letter-spacing: .02em;\r\n      opacity: 0;\r\n      box-shadow: 0 6px 20px rgba(0,0,0,.04);\r\n      animation: introServiceOut .66s var(--delay) cubic-bezier(.18,.82,.2,1.12) forwards;\r\n      transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;\r\n    }\r\n    .intro-service i {\r\n      width: 7px;\r\n      height: 7px;\r\n      border-radius: 50%;\r\n      flex: 0 0 auto;\r\n      background: #d9282f;\r\n      box-shadow: 0 0 0 4px rgba(217,40,47,.1);\r\n    }\r\n    .intro-service.is-active {\r\n      background: #d9282f;\r\n      border-color: #d9282f;\r\n      color: #fff;\r\n    }\r\n    .intro-service.is-active i { background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.18); }\r\n    .intro-caption {\r\n      position: absolute;\r\n      left: 50%;\r\n      bottom: 2%;\r\n      transform: translateX(-50%);\r\n      color: #000;\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .16em;\r\n      text-transform: uppercase;\r\n      white-space: nowrap;\r\n      opacity: 0;\r\n      animation: introFade .7s 1s forwards;\r\n    }\r\n    .intro-caption b { color: #d9282f; }\r\n    .intro-skip {\r\n      position: absolute;\r\n      top: 24px;\r\n      right: 28px;\r\n      z-index: 8;\r\n      border: 0;\r\n      background: transparent;\r\n      color: #000;\r\n      padding: 8px 0;\r\n      font: inherit;\r\n      font-size: 9px;\r\n      font-weight: 900;\r\n      letter-spacing: .14em;\r\n      text-transform: uppercase;\r\n      cursor: pointer;\r\n      opacity: 0;\r\n      animation: introFade .5s .8s forwards;\r\n    }\r\n    .intro-skip::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 0;\r\n      right: 0;\r\n      bottom: 3px;\r\n      height: 1px;\r\n      background: #d9282f;\r\n      transform-origin: left;\r\n      transform: scaleX(.28);\r\n      transition: transform .2s ease;\r\n    }\r\n    .intro-skip:hover::after { transform: scaleX(1); }\r\n    body.intro-lock { overflow: hidden; }\r\n\r\n    @keyframes introRingIn { to { transform: scale(1); opacity: 1; } }\r\n    @keyframes introDashedRing { to { transform: rotate(360deg); } }\r\n    @keyframes introFade { from { opacity: 0; } to { opacity: 1; } }\r\n    @keyframes introSpokeIn { to { opacity: 1; } }\r\n    @keyframes introCenterIn { to { transform: translate(-50%,-50%) scale(1); opacity: 1; } }\r\n    @keyframes introCenterPulse {\r\n      0%,100% { box-shadow: 0 0 0 12px rgba(217,40,47,.08), 0 0 0 24px rgba(217,40,47,.035); }\r\n      50% { box-shadow: 0 0 0 18px rgba(217,40,47,.05), 0 0 0 34px rgba(217,40,47,.02); }\r\n    }\r\n    @keyframes introServiceOut {\r\n      0% { transform: translate(-50%,-50%) translate(0,0) scale(.25); opacity: 0; }\r\n      65% { opacity: 1; }\r\n      100% { transform: translate(-50%,-50%) translate(var(--tx),var(--ty)) scale(1); opacity: 1; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .intro-stage { width: min(96vw, 620px); }\r\n      .service-intro::before { width: 88vw; }\r\n      .service-intro::after { width: 61vw; }\r\n      .intro-service { width: 108px; min-height: 42px; padding: 7px 8px; font-size: 7.5px; }\r\n      .intro-center { width: 128px; }\r\n      .intro-caption { bottom: 1%; font-size: 7px; letter-spacing: .12em; }\r\n      .intro-skip { top: 15px; right: 17px; }\r\n    }\r\n    @media (max-width: 430px) {\r\n      .intro-stage { width: 100vw; }\r\n      .service-intro::before { width: 96vw; }\r\n      .service-intro::after { width: 67vw; }\r\n      .intro-service { width: 92px; min-height: 38px; font-size: 6.7px; line-height: 1.1; }\r\n      .intro-service i { width: 5px; height: 5px; box-shadow: 0 0 0 3px rgba(217,40,47,.1); }\r\n      .intro-center { width: 105px; }\r\n      .intro-center strong { font-size: 29px; }\r\n      .intro-center span { margin-top: 6px; font-size: 6px; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .service-intro::before, .service-intro::after, .intro-center, .intro-service, .intro-spoke, .intro-caption, .intro-skip { animation-duration: .01ms !important; animation-delay: 0ms !important; }\r\n    }\r\n\r\n\r\n    \/* ===== CIRCULAR SERVICES \u2014 EMBEDDED IN HERO ===== *\/\r\n    .hero-circle-wrap {\r\n      position: relative;\r\n      min-height: 610px !important;\r\n      display: grid;\r\n      place-items: center;\r\n      overflow: visible;\r\n    }\r\n    .hero-circle-wrap::before,\r\n    .hero-circle-wrap::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      aspect-ratio: 1;\r\n      border-radius: 50%;\r\n      pointer-events: none;\r\n    }\r\n    .hero-circle-wrap::before {\r\n      width: min(92%, 565px);\r\n      transform: translate(-50%,-50%);\r\n      border: 1px solid rgba(0,0,0,.10);\r\n    }\r\n    .hero-circle-wrap::after {\r\n      width: min(66%, 405px);\r\n      transform: translate(-50%,-50%);\r\n      border: 1px dashed rgba(217,40,47,.42);\r\n      animation: introDashedRing 20s linear infinite;\r\n    }\r\n    .hero-circle-stage {\r\n      width: min(100%, 610px);\r\n      max-height: none;\r\n      z-index: 2;\r\n    }\r\n    .hero-circle-stage .intro-center {\r\n      width: clamp(128px, 12vw, 158px);\r\n      box-shadow: 0 0 0 10px rgba(217,40,47,.08), 0 0 0 22px rgba(217,40,47,.035);\r\n    }\r\n    .hero-circle-stage .intro-center strong { font-size: clamp(30px, 3vw, 40px); }\r\n    .hero-circle-stage .intro-service {\r\n      width: clamp(112px, 10.5vw, 145px);\r\n      min-height: 44px;\r\n      padding: 8px 9px;\r\n      font-size: clamp(7.5px, .72vw, 9.5px);\r\n      text-decoration: none;\r\n    }\r\n    .hero-circle-stage .intro-service:hover,\r\n    .hero-circle-stage .intro-service:focus-visible {\r\n      border-color: #d9282f;\r\n      outline: none;\r\n    }\r\n    .hero-circle-stage .intro-caption { bottom: 0; }\r\n    .hero-circle-stage .intro-spoke { stroke: rgba(0,0,0,.15); }\r\n\r\n    @media (max-width: 1050px) {\r\n      .hero-circle-wrap { min-height: 570px !important; }\r\n      .hero-circle-stage { width: min(92vw, 610px); }\r\n    }\r\n    @media (max-width: 720px) {\r\n      .hero-circle-wrap { min-height: 500px !important; margin-top: 6px; }\r\n      .hero-circle-wrap::before { width: min(90vw, 455px); }\r\n      .hero-circle-wrap::after { width: min(63vw, 320px); }\r\n      .hero-circle-stage { width: min(96vw, 500px); }\r\n      .hero-circle-stage .intro-service { width: 102px; min-height: 40px; font-size: 7.2px; }\r\n      .hero-circle-stage .intro-center { width: 112px; }\r\n    }\r\n    @media (max-width: 430px) {\r\n      .hero-circle-wrap { min-height: 435px !important; }\r\n      .hero-circle-stage { width: 100%; }\r\n      .hero-circle-stage .intro-service { width: 88px; min-height: 36px; padding: 6px 7px; font-size: 6.4px; }\r\n      .hero-circle-stage .intro-center { width: 94px; }\r\n      .hero-circle-stage .intro-center strong { font-size: 26px; }\r\n      .hero-circle-stage .intro-caption { font-size: 6.6px; }\r\n    }\r\n\r\n\r\n\r\n    \/* ===== HERO CONTENT \u2014 FINAL ALIGNMENT \/ EDITORIAL BALANCE ===== *\/\r\n    .hero {\r\n      padding: 138px 0 78px !important;\r\n      overflow: hidden;\r\n    }\r\n    .hero .container {\r\n      width: min(1220px, calc(100% - 56px)) !important;\r\n    }\r\n    .hero-grid {\r\n      grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr) !important;\r\n      gap: clamp(50px, 5.8vw, 78px) !important;\r\n      align-items: center !important;\r\n    }\r\n    .hero-copy {\r\n      width: 100%;\r\n      max-width: 590px;\r\n      padding-top: 4px;\r\n    }\r\n    .availability {\r\n      display: inline-flex !important;\r\n      align-items: center;\r\n      gap: 8px;\r\n      margin: 0 !important;\r\n      padding: 0 0 8px !important;\r\n      border: 0 !important;\r\n      border-bottom: 1px solid #d9282f !important;\r\n      border-radius: 0 !important;\r\n      color: #000 !important;\r\n      font-size: 10px !important;\r\n      font-weight: 850 !important;\r\n      letter-spacing: .105em !important;\r\n      line-height: 1.2;\r\n      text-transform: uppercase;\r\n    }\r\n    .availability i {\r\n      width: 6px !important;\r\n      height: 6px !important;\r\n      background: #d9282f !important;\r\n      box-shadow: 0 0 0 4px rgba(217,40,47,.09);\r\n    }\r\n    .hero .display {\r\n      max-width: 585px !important;\r\n      margin: 22px 0 0 !important;\r\n      font-size: clamp(46px, 4.45vw, 62px) !important;\r\n      line-height: .99 !important;\r\n      letter-spacing: -.052em !important;\r\n      text-wrap: balance;\r\n    }\r\n    .hero-copy > p {\r\n      max-width: 545px !important;\r\n      margin: 20px 0 0 !important;\r\n      color: #000 !important;\r\n      opacity: .72;\r\n      font-size: clamp(15px, 1.25vw, 17px) !important;\r\n      line-height: 1.68 !important;\r\n    }\r\n    .hero-actions {\r\n      margin-top: 27px !important;\r\n      gap: 10px !important;\r\n    }\r\n    .hero-actions .btn {\r\n      min-height: 48px !important;\r\n      padding: 0 20px !important;\r\n      font-size: 12px !important;\r\n      border-radius: 10px !important;\r\n    }\r\n    .hero-actions .btn-ghost {\r\n      background: #fff !important;\r\n      color: #000 !important;\r\n      border-color: #000 !important;\r\n    }\r\n\r\n    .hero-assurance {\r\n      width: 100%;\r\n      max-width: 565px;\r\n      margin-top: 26px;\r\n      border-top: 1px solid #000;\r\n      border-bottom: 1px solid #000;\r\n    }\r\n    .hero-assurance .hero-note {\r\n      display: flex !important;\r\n      align-items: center !important;\r\n      gap: 10px !important;\r\n      margin: 0 !important;\r\n      padding: 12px 0 !important;\r\n      border-bottom: 1px solid rgba(0,0,0,.13);\r\n      color: #000 !important;\r\n      font-size: 10.5px !important;\r\n      line-height: 1.45;\r\n    }\r\n    .hero-note strong { color: #000 !important; font-weight: 900; }\r\n    .hero-note-sep { color: #d9282f; font-weight: 900; }\r\n    .hero-note-whatsapp {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 7px;\r\n      font-weight: 750;\r\n    }\r\n    .hero-note-whatsapp::before {\r\n      content: '';\r\n      width: 6px;\r\n      height: 6px;\r\n      flex: 0 0 auto;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n    }\r\n\r\n    .hero-assurance .hero-live-service {\r\n      display: grid !important;\r\n      grid-template-columns: 96px minmax(0,1fr);\r\n      align-items: center !important;\r\n      gap: 15px !important;\r\n      margin: 0 !important;\r\n      padding: 12px 0 !important;\r\n      border-bottom: 1px solid rgba(0,0,0,.13);\r\n      color: #000 !important;\r\n    }\r\n    .hero-live-service > span:first-child {\r\n      color: #d9282f !important;\r\n      font-size: 8px !important;\r\n      font-weight: 950 !important;\r\n      letter-spacing: .16em !important;\r\n      white-space: nowrap;\r\n    }\r\n    .hero-live-service strong {\r\n      min-width: 0 !important;\r\n      color: #000 !important;\r\n      font-size: 11.5px !important;\r\n      font-weight: 850 !important;\r\n      line-height: 1.35;\r\n    }\r\n    .hero-live-service strong::after { display: none !important; }\r\n\r\n    .hero-assurance .hero-proof {\r\n      display: grid !important;\r\n      grid-template-columns: repeat(3, minmax(0,1fr)) !important;\r\n      gap: 0 !important;\r\n      max-width: none !important;\r\n      margin: 0 !important;\r\n      border: 0 !important;\r\n    }\r\n    .hero-assurance .hero-proof > div {\r\n      min-width: 0 !important;\r\n      padding: 15px 15px 16px 0 !important;\r\n    }\r\n    .hero-assurance .hero-proof > div + div {\r\n      padding-left: 18px !important;\r\n      border-left: 1px solid rgba(0,0,0,.13) !important;\r\n    }\r\n    .hero-assurance .hero-proof strong {\r\n      display: block;\r\n      color: #d9282f !important;\r\n      font-size: 23px !important;\r\n      line-height: 1 !important;\r\n      letter-spacing: -.035em !important;\r\n    }\r\n    .hero-assurance .hero-proof span {\r\n      display: block;\r\n      margin-top: 5px;\r\n      color: #000 !important;\r\n      opacity: .66;\r\n      font-size: 9.5px !important;\r\n      font-weight: 700;\r\n      line-height: 1.3;\r\n    }\r\n\r\n    .hero-circle-wrap {\r\n      min-height: 570px !important;\r\n    }\r\n    .hero-circle-stage {\r\n      width: min(100%, 570px) !important;\r\n    }\r\n\r\n    @media (max-width: 1120px) {\r\n      .hero { padding: 132px 0 72px !important; }\r\n      .hero .container { width: min(100% - 40px, 1120px) !important; }\r\n      .hero-grid {\r\n        grid-template-columns: 1fr !important;\r\n        gap: 44px !important;\r\n      }\r\n      .hero-copy { max-width: 700px; }\r\n      .hero .display { max-width: 650px !important; font-size: clamp(46px, 7vw, 62px) !important; }\r\n      .hero-copy > p { max-width: 610px !important; }\r\n      .hero-assurance { max-width: 620px; }\r\n      .hero-circle-wrap { min-height: 550px !important; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .hero { padding: 112px 0 58px !important; }\r\n      .hero .container { width: min(100% - 28px, 1120px) !important; }\r\n      .hero-grid { gap: 32px !important; }\r\n      .availability { font-size: 8.5px !important; letter-spacing: .085em !important; }\r\n      .hero .display {\r\n        margin-top: 18px !important;\r\n        font-size: clamp(37px, 10.7vw, 48px) !important;\r\n        line-height: 1 !important;\r\n      }\r\n      .hero-copy > p {\r\n        margin-top: 16px !important;\r\n        font-size: 14px !important;\r\n        line-height: 1.62 !important;\r\n      }\r\n      .hero-actions { margin-top: 22px !important; }\r\n      .hero-actions .btn { min-height: 46px !important; font-size: 11.5px !important; }\r\n      .hero-assurance { margin-top: 22px; }\r\n      .hero-assurance .hero-note {\r\n        gap: 7px !important;\r\n        padding: 10px 0 !important;\r\n        font-size: 9.5px !important;\r\n        flex-wrap: wrap;\r\n      }\r\n      .hero-note-sep { display: none; }\r\n      .hero-note-whatsapp { width: 100%; }\r\n      .hero-assurance .hero-live-service {\r\n        grid-template-columns: 84px minmax(0,1fr);\r\n        gap: 10px !important;\r\n        padding: 10px 0 !important;\r\n      }\r\n      .hero-assurance .hero-proof > div { padding: 13px 8px 14px 0 !important; }\r\n      .hero-assurance .hero-proof > div + div { padding-left: 10px !important; }\r\n      .hero-assurance .hero-proof strong { font-size: 19px !important; }\r\n      .hero-assurance .hero-proof span { font-size: 8.3px !important; }\r\n      .hero-circle-wrap { min-height: 480px !important; }\r\n    }\r\n\r\n    @media (max-width: 430px) {\r\n      .hero .display { font-size: clamp(35px, 10.8vw, 44px) !important; }\r\n      .hero-actions { display: grid !important; grid-template-columns: 1fr !important; }\r\n      .hero-actions .btn { width: 100% !important; }\r\n      .hero-assurance .hero-live-service { grid-template-columns: 1fr; gap: 4px !important; }\r\n      .hero-assurance .hero-proof strong { font-size: 18px !important; }\r\n      .hero-assurance .hero-proof span { font-size: 7.8px !important; }\r\n      .hero-circle-wrap { min-height: 420px !important; }\r\n    }\r\n\r\n\r\n\r\n    \/* ===== REFINED NAVIGATION ===== *\/\r\n    .nav-inner {\r\n      gap: 34px !important;\r\n    }\r\n\r\n    .desktop-nav {\r\n      gap: 30px !important;\r\n    }\r\n\r\n    .desktop-nav a {\r\n      position: relative;\r\n      padding: 9px 0 !important;\r\n      font-size: 15px !important;\r\n      line-height: 1.2;\r\n      font-weight: 700 !important;\r\n      letter-spacing: -.01em !important;\r\n    }\r\n\r\n    .desktop-nav a::after {\r\n      left: 0 !important;\r\n      right: 100% !important;\r\n      bottom: 3px !important;\r\n      height: 1.5px !important;\r\n    }\r\n\r\n    .desktop-nav a:hover::after,\r\n    .desktop-nav a.active::after {\r\n      right: 0 !important;\r\n    }\r\n\r\n    .nav-actions .btn {\r\n      min-height: 44px !important;\r\n      padding: 0 18px !important;\r\n      font-size: 13px !important;\r\n      font-weight: 800 !important;\r\n    }\r\n\r\n    @media (max-width: 1050px) {\r\n      .mobile-panel {\r\n        padding: 8px 14px 14px !important;\r\n        border-radius: 18px !important;\r\n      }\r\n\r\n      .mobile-panel a:not(.btn) {\r\n        padding: 14px 2px !important;\r\n        border-radius: 0 !important;\r\n        border-bottom: 1px solid rgba(0,0,0,.12);\r\n        font-size: 16px !important;\r\n        font-weight: 700 !important;\r\n      }\r\n\r\n      .mobile-panel a:not(.btn):hover {\r\n        padding-left: 5px !important;\r\n      }\r\n\r\n      .mobile-panel .btn {\r\n        min-height: 46px !important;\r\n        margin-top: 14px !important;\r\n        font-size: 13px !important;\r\n      }\r\n    }\r\n\r\n\r\n    \/* ===== FAQ SECTION ===== *\/\r\n    .faq-section {\r\n      background: #ffffff;\r\n      border-top: 1px solid rgba(0,0,0,.14);\r\n    }\r\n\r\n    .faq-layout {\r\n      display: grid;\r\n      grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr);\r\n      gap: clamp(50px, 8vw, 110px);\r\n      align-items: start;\r\n    }\r\n\r\n    .faq-intro {\r\n      position: sticky;\r\n      top: 118px;\r\n    }\r\n\r\n    .faq-intro .section-title {\r\n      max-width: 520px;\r\n      font-size: clamp(34px, 4.2vw, 52px);\r\n      line-height: 1.02;\r\n    }\r\n\r\n    .faq-intro .section-lead {\r\n      max-width: 470px;\r\n      margin-top: 20px;\r\n    }\r\n\r\n    .faq-contact-link {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 10px;\r\n      margin-top: 28px;\r\n      padding-bottom: 6px;\r\n      border-bottom: 1.5px solid #d9282f;\r\n      color: #d9282f !important;\r\n      font-size: 14px;\r\n      font-weight: 800;\r\n    }\r\n\r\n    .faq-contact-link span {\r\n      color: #d9282f !important;\r\n      transition: transform .22s var(--ease-premium);\r\n    }\r\n\r\n    .faq-contact-link:hover span { transform: translate(3px,-3px); }\r\n\r\n    .faq-list {\r\n      border-top: 1px solid #000000;\r\n    }\r\n\r\n    .faq-item {\r\n      border-bottom: 1px solid #000000;\r\n    }\r\n\r\n    .faq-item summary {\r\n      list-style: none;\r\n      display: grid;\r\n      grid-template-columns: minmax(0, 1fr) 42px;\r\n      gap: 24px;\r\n      align-items: center;\r\n      padding: 27px 0;\r\n      cursor: pointer;\r\n      color: #000000;\r\n      font-family: var(--font-body);\r\n      font-size: clamp(16px, 1.45vw, 19px);\r\n      line-height: 1.4;\r\n      letter-spacing: -.012em;\r\n      font-weight: 700;\r\n    }\r\n\r\n    .faq-item summary::-webkit-details-marker { display: none; }\r\n\r\n    .faq-icon {\r\n      position: relative;\r\n      width: 38px;\r\n      height: 38px;\r\n      border: 1px solid #000000;\r\n      border-radius: 50%;\r\n      transition: border-color .22s ease, transform .3s var(--ease-premium);\r\n    }\r\n\r\n    .faq-icon::before,\r\n    .faq-icon::after {\r\n      content: '';\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      width: 14px;\r\n      height: 1.5px;\r\n      background: #000000;\r\n      transform: translate(-50%, -50%);\r\n      transition: transform .28s var(--ease-premium), background .22s ease;\r\n    }\r\n\r\n    .faq-icon::after {\r\n      transform: translate(-50%, -50%) rotate(90deg);\r\n    }\r\n\r\n    .faq-item[open] .faq-icon {\r\n      border-color: #d9282f;\r\n      transform: rotate(180deg);\r\n    }\r\n\r\n    .faq-item[open] .faq-icon::before,\r\n    .faq-item[open] .faq-icon::after { background: #d9282f; }\r\n\r\n    .faq-item[open] .faq-icon::after {\r\n      transform: translate(-50%, -50%) rotate(0deg);\r\n    }\r\n\r\n    .faq-answer {\r\n      max-width: 760px;\r\n      padding: 0 70px 28px 0;\r\n      color: #000000;\r\n      font-size: 14px;\r\n      line-height: 1.72;\r\n    }\r\n\r\n    .faq-answer p { margin: 0; }\r\n\r\n    .faq-item[open] summary { color: #d9282f; }\r\n\r\n    @media (max-width: 900px) {\r\n      .faq-layout { grid-template-columns: 1fr; gap: 42px; }\r\n      .faq-intro { position: static; }\r\n      .faq-intro .section-title, .faq-intro .section-lead { max-width: 720px; }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .faq-item summary {\r\n        grid-template-columns: minmax(0, 1fr) 34px;\r\n        gap: 16px;\r\n        padding: 19px 0;\r\n        font-size: 15.5px;\r\n      }\r\n      .faq-icon { width: 32px; height: 32px; }\r\n      .faq-answer { padding: 0 48px 20px 0; font-size: 13.5px; }\r\n    }\r\n\r\n\r\n    \/* ===== SERVICES DROPDOWN NAV ===== *\/\r\n    .desktop-nav { gap: 22px !important; }\r\n    .desktop-nav > a,\r\n    .nav-dropdown > .nav-dropdown-toggle {\r\n      min-height: 70px;\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 5px;\r\n      padding: 0 !important;\r\n      font-size: 15px !important;\r\n      font-weight: 750 !important;\r\n      white-space: nowrap;\r\n    }\r\n\r\n    .nav-dropdown { position: relative; display: flex; align-items: stretch; }\r\n    .nav-dropdown-toggle { cursor: pointer; }\r\n    .nav-chevron {\r\n      display: inline-block;\r\n      margin-top: -2px;\r\n      color: #d9282f !important;\r\n      font-size: 14px;\r\n      line-height: 1;\r\n      transition: transform .22s var(--ease-premium);\r\n    }\r\n    .nav-dropdown:hover .nav-chevron,\r\n    .nav-dropdown:focus-within .nav-chevron,\r\n    .nav-dropdown.open .nav-chevron { transform: rotate(180deg); }\r\n\r\n    .services-dropdown {\r\n      position: absolute;\r\n      top: calc(100% - 2px);\r\n      left: 50%;\r\n      width: 520px;\r\n      padding: 18px;\r\n      background: #fff;\r\n      border: 1px solid rgba(0,0,0,.16);\r\n      border-top: 2px solid #d9282f;\r\n      border-radius: 0 0 18px 18px;\r\n      box-shadow: 0 22px 50px rgba(0,0,0,.10) !important;\r\n      opacity: 0;\r\n      visibility: hidden;\r\n      pointer-events: none;\r\n      transform: translate(-50%, 10px);\r\n      transition: opacity .2s ease, transform .24s var(--ease-premium), visibility .2s ease;\r\n    }\r\n    .nav-dropdown:hover .services-dropdown,\r\n    .nav-dropdown:focus-within .services-dropdown,\r\n    .nav-dropdown.open .services-dropdown {\r\n      opacity: 1;\r\n      visibility: visible;\r\n      pointer-events: auto;\r\n      transform: translate(-50%, 0);\r\n    }\r\n\r\n    .services-dropdown-head {\r\n      display: flex;\r\n      align-items: baseline;\r\n      justify-content: space-between;\r\n      gap: 20px;\r\n      padding: 2px 4px 13px;\r\n      border-bottom: 1px solid rgba(0,0,0,.13);\r\n    }\r\n    .services-dropdown-head > span {\r\n      color: #d9282f !important;\r\n      font-size: 11px;\r\n      font-weight: 900;\r\n      letter-spacing: .12em;\r\n      text-transform: uppercase;\r\n    }\r\n    .services-dropdown-head small { color: #666 !important; font-size: 10px; }\r\n\r\n    .services-dropdown-grid {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: 2px 14px;\r\n      padding: 10px 0 9px;\r\n    }\r\n    .services-dropdown-grid > a {\r\n      display: grid;\r\n      grid-template-columns: 25px 1fr;\r\n      gap: 9px;\r\n      align-items: start;\r\n      padding: 10px 8px !important;\r\n      border-radius: 9px !important;\r\n      transition: background .18s ease, transform .18s ease !important;\r\n    }\r\n    .services-dropdown-grid > a::after { display: none !important; }\r\n    .services-dropdown-grid > a:hover {\r\n      background: #fff5f5 !important;\r\n      transform: translateX(2px);\r\n    }\r\n    .services-dropdown-grid b {\r\n      padding-top: 2px;\r\n      color: #d9282f;\r\n      font-size: 9px;\r\n      letter-spacing: .05em;\r\n    }\r\n    .services-dropdown-grid strong {\r\n      display: block;\r\n      color: #000 !important;\r\n      font-size: 12.5px;\r\n      line-height: 1.25;\r\n      letter-spacing: -.01em;\r\n    }\r\n    .services-dropdown-grid small {\r\n      display: block;\r\n      margin-top: 3px;\r\n      color: #777 !important;\r\n      font-size: 9.5px;\r\n      font-weight: 600;\r\n      line-height: 1.35;\r\n    }\r\n    .services-dropdown-all {\r\n      display: flex !important;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      padding: 11px 7px 2px !important;\r\n      border-top: 1px solid rgba(0,0,0,.13);\r\n      color: #d9282f !important;\r\n      font-size: 11px !important;\r\n      font-weight: 850 !important;\r\n    }\r\n    .services-dropdown-all::after { display: none !important; }\r\n\r\n    \/* Mobile expandable services *\/\r\n    .mobile-services { border-radius: 12px; overflow: hidden; }\r\n    .mobile-services-toggle {\r\n      width: 100%;\r\n      min-height: 48px;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      padding: 11px 12px;\r\n      border: 0;\r\n      background: transparent;\r\n      color: #000;\r\n      text-align: left;\r\n      font-size: 15px;\r\n      font-weight: 800;\r\n      letter-spacing: -.015em;\r\n    }\r\n    .mobile-services-meta { display: inline-flex; align-items: center; gap: 10px; font-size: 11px; color: #d9282f !important; }\r\n    .mobile-services-meta i { font-style: normal; font-size: 15px; transition: transform .2s ease; }\r\n    .mobile-services.open .mobile-services-meta i { transform: rotate(180deg); }\r\n    .mobile-services-list {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      max-height: 0;\r\n      overflow: hidden;\r\n      padding: 0 8px;\r\n      opacity: 0;\r\n      border-top: 1px solid transparent;\r\n      transition: max-height .28s var(--ease-premium), opacity .2s ease, padding .28s ease, border-color .2s ease;\r\n    }\r\n    .mobile-services.open .mobile-services-list {\r\n      max-height: 420px;\r\n      padding: 8px;\r\n      opacity: 1;\r\n      border-top-color: rgba(0,0,0,.12);\r\n    }\r\n    .mobile-services-list a {\r\n      min-width: 0;\r\n      padding: 9px 7px !important;\r\n      color: #333 !important;\r\n      font-size: 11.5px !important;\r\n      font-weight: 700 !important;\r\n      line-height: 1.25;\r\n    }\r\n    .mobile-services-list a:hover { color: #d9282f !important; }\r\n\r\n    @media (max-width: 1180px) and (min-width: 1051px) {\r\n      .desktop-nav { gap: 16px !important; }\r\n      .desktop-nav > a,\r\n      .nav-dropdown > .nav-dropdown-toggle { font-size: 14px !important; }\r\n      .services-dropdown { width: 480px; }\r\n    }\r\n\r\n    @media (max-width: 440px) {\r\n      .mobile-services-list { grid-template-columns: 1fr; }\r\n      .mobile-services.open .mobile-services-list { max-height: 520px; }\r\n    }\r\n\r\n\r\n    \/* ===== FOOTER SOCIAL ALIGNMENT \u2014 RIGHT SIDE ===== *\/\r\n    @media (min-width: 721px) {\r\n      .footer-bottom-new {\r\n        grid-template-columns: 1fr auto auto !important;\r\n        column-gap: clamp(24px, 3vw, 42px) !important;\r\n      }\r\n      .footer-socials {\r\n        justify-self: end !important;\r\n        justify-content: flex-end !important;\r\n        gap: clamp(16px, 2vw, 24px) !important;\r\n      }\r\n      .footer-backtop {\r\n        justify-self: end !important;\r\n      }\r\n    }\r\n\r\n    @media (max-width: 720px) {\r\n      .footer-socials {\r\n        justify-self: start !important;\r\n        justify-content: flex-start !important;\r\n      }\r\n    }\r\n<\/style>\r\n\r\n  <style>\r\n    \/* Social icons under footer availability *\/\r\n    .footer-brand-socials {\r\n      display: flex;\r\n      flex-wrap: wrap;\r\n      gap: 10px;\r\n      margin-top: 16px;\r\n    }\r\n    .footer-brand-socials a {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      gap: 8px;\r\n      min-height: 38px;\r\n      padding: 0 12px;\r\n      border: 1px solid rgba(0,0,0,.22);\r\n      border-radius: 999px;\r\n      background: #fff;\r\n      color: #000 !important;\r\n      font-size: 11px;\r\n      font-weight: 800;\r\n      line-height: 1;\r\n      transition: border-color .2s ease, color .2s ease, transform .2s ease;\r\n    }\r\n    .footer-brand-socials a svg {\r\n      width: 16px;\r\n      height: 16px;\r\n      flex: 0 0 16px;\r\n      fill: currentColor;\r\n      stroke: currentColor;\r\n      stroke-width: 1.6;\r\n    }\r\n    .footer-brand-socials a:nth-child(2) svg { fill: none; }\r\n    .footer-brand-socials a:nth-child(2) svg .dot { fill: currentColor; stroke: none; }\r\n    .footer-brand-socials a:hover,\r\n    .footer-brand-socials a:focus-visible {\r\n      color: #d9282f !important;\r\n      border-color: #d9282f;\r\n      transform: translateY(-2px);\r\n    }\r\n    .footer-bottom-new {\r\n      grid-template-columns: 1fr auto !important;\r\n    }\r\n    .footer-backtop { grid-column: 2; }\r\n\r\n    @media (max-width: 720px) {\r\n      .footer-brand-socials { gap: 8px; }\r\n      .footer-brand-socials a {\r\n        min-height: 36px;\r\n        padding: 0 10px;\r\n        font-size: 10.5px;\r\n      }\r\n      .footer-bottom-new {\r\n        grid-template-columns: 1fr auto !important;\r\n      }\r\n      .footer-copy { grid-column: 1 !important; grid-row: auto !important; }\r\n      .footer-backtop { grid-column: 2 !important; grid-row: auto !important; }\r\n    }\r\n\r\n    @media (max-width: 440px) {\r\n      .footer-brand-socials a {\r\n        width: calc(50% - 4px);\r\n        justify-content: flex-start;\r\n      }\r\n      .footer-bottom-new { grid-template-columns: 1fr !important; }\r\n      .footer-copy, .footer-backtop { grid-column: 1 !important; }\r\n    }\r\n\r\n    \/* ===== FOOTER COPYRIGHT \u2014 CENTERED ===== *\/\r\n    .footer-bottom-new {\r\n      display: flex !important;\r\n      align-items: center !important;\r\n      justify-content: center !important;\r\n      min-height: 78px;\r\n      text-align: center;\r\n    }\r\n    .footer-copy {\r\n      width: 100%;\r\n      text-align: center !important;\r\n      justify-self: center !important;\r\n    }\r\n    .footer-backtop { display: none !important; }\r\n\r\n    @media (max-width: 720px) {\r\n      .footer-bottom-new {\r\n        display: flex !important;\r\n        justify-content: center !important;\r\n        padding: 20px 0;\r\n      }\r\n      .footer-copy { text-align: center !important; }\r\n    }\r\n  \r\n\r\n    \/* ===== HERO MOTION \u2014 ORBIT + FLOAT + COUNT-UP ===== *\/\r\n    .hero-motion-wrap {\r\n      position: relative;\r\n      min-height: 570px !important;\r\n      display: grid;\r\n      place-items: center;\r\n      perspective: none !important;\r\n      isolation: isolate;\r\n    }\r\n    .hero-motion-wrap::before,\r\n    .hero-motion-wrap::after { display: none !important; }\r\n    .hero-motion-scene {\r\n      position: relative;\r\n      width: min(100%, 545px);\r\n      aspect-ratio: 1;\r\n      display: grid;\r\n      place-items: center;\r\n    }\r\n    .hero-orbit {\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      aspect-ratio: 1;\r\n      border-radius: 50%;\r\n      pointer-events: none;\r\n    }\r\n    .hero-orbit-outer {\r\n      width: 88%;\r\n      transform: translate(-50%,-50%);\r\n      border: 1px solid rgba(0,0,0,.16);\r\n    }\r\n    .hero-orbit-red {\r\n      width: 66%;\r\n      border: 1.5px dashed rgba(217,40,47,.72);\r\n      animation: heroOrbitRed 18s linear infinite;\r\n    }\r\n    .hero-orbit-runner {\r\n      position: absolute;\r\n      left: 50%;\r\n      top: 50%;\r\n      width: 88%;\r\n      aspect-ratio: 1;\r\n      transform: translate(-50%,-50%);\r\n      border-radius: 50%;\r\n      animation: heroRunnerSpin 12s linear infinite;\r\n      pointer-events: none;\r\n    }\r\n    .hero-orbit-runner span {\r\n      position: absolute;\r\n      left: 50%;\r\n      top: -5px;\r\n      width: 10px;\r\n      height: 10px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      box-shadow: 0 0 0 6px rgba(217,40,47,.08);\r\n      transform: translateX(-50%);\r\n    }\r\n    .hero-growth-core {\r\n      position: relative;\r\n      z-index: 5;\r\n      width: min(62%, 315px);\r\n      min-height: 305px;\r\n      padding: 27px 25px 24px;\r\n      background: #fff;\r\n      border: 2px solid #000;\r\n      border-radius: 28px;\r\n      box-shadow: 16px 16px 0 rgba(217,40,47,.08);\r\n      animation: heroCoreFloat 6s ease-in-out infinite;\r\n    }\r\n    .hero-core-top {\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: space-between;\r\n      gap: 16px;\r\n      padding-bottom: 16px;\r\n      border-bottom: 1px solid rgba(0,0,0,.14);\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .12em;\r\n      text-transform: uppercase;\r\n    }\r\n    .hero-live-dot {\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 7px;\r\n      color: #d9282f !important;\r\n    }\r\n    .hero-live-dot::before {\r\n      content: \"\";\r\n      width: 7px;\r\n      height: 7px;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n      animation: heroLivePulse 1.8s ease-in-out infinite;\r\n    }\r\n    .hero-core-number { margin-top: 30px; }\r\n    .hero-core-number strong {\r\n      display: block;\r\n      color: #d9282f !important;\r\n      font-family: var(--font-display);\r\n      font-size: clamp(56px, 6.2vw, 76px);\r\n      line-height: .86;\r\n      letter-spacing: -.07em;\r\n      font-weight: 800;\r\n    }\r\n    .hero-core-number span {\r\n      display: block;\r\n      margin-top: 9px;\r\n      color: #000 !important;\r\n      font-size: 10px;\r\n      font-weight: 900;\r\n      letter-spacing: .13em;\r\n      text-transform: uppercase;\r\n    }\r\n    .hero-growth-core p {\r\n      margin: 23px 0 0;\r\n      max-width: 245px;\r\n      color: #000 !important;\r\n      font-size: 12px;\r\n      line-height: 1.55;\r\n    }\r\n    .hero-core-track {\r\n      position: relative;\r\n      height: 3px;\r\n      margin-top: 22px;\r\n      overflow: hidden;\r\n      background: rgba(0,0,0,.12);\r\n    }\r\n    .hero-core-track span {\r\n      position: absolute;\r\n      inset: 0;\r\n      background: #d9282f;\r\n      transform-origin: left;\r\n      animation: heroTrack 4.2s cubic-bezier(.2,.75,.25,1) infinite;\r\n    }\r\n    .hero-core-steps {\r\n      display: grid;\r\n      grid-template-columns: repeat(4,1fr);\r\n      gap: 5px;\r\n      margin-top: 9px;\r\n    }\r\n    .hero-core-steps span {\r\n      color: #000 !important;\r\n      font-size: 7px;\r\n      font-weight: 850;\r\n      text-align: center;\r\n      text-transform: uppercase;\r\n      letter-spacing: .04em;\r\n      opacity: .62;\r\n    }\r\n    .hero-float-chip {\r\n      position: absolute;\r\n      z-index: 7;\r\n      display: inline-flex;\r\n      align-items: center;\r\n      gap: 8px;\r\n      min-height: 42px;\r\n      padding: 0 14px;\r\n      border: 1px solid #000;\r\n      border-radius: 999px;\r\n      background: #fff;\r\n      color: #000 !important;\r\n      font-size: 10px;\r\n      font-weight: 850;\r\n      white-space: nowrap;\r\n      box-shadow: 0 8px 24px rgba(0,0,0,.045);\r\n      transition: border-color .2s ease, color .2s ease, transform .2s ease;\r\n    }\r\n    .hero-float-chip i {\r\n      width: 7px;\r\n      height: 7px;\r\n      flex: 0 0 auto;\r\n      border-radius: 50%;\r\n      background: #d9282f;\r\n    }\r\n    .hero-float-chip:hover,\r\n    .hero-float-chip:focus-visible {\r\n      border-color: #d9282f;\r\n      color: #d9282f !important;\r\n      outline: none;\r\n    }\r\n    .chip-web { left: 1%; top: 19%; animation: heroChipFloatA 5.5s ease-in-out infinite; }\r\n    .chip-seo { right: 0; top: 23%; animation: heroChipFloatB 6.2s .3s ease-in-out infinite; }\r\n    .chip-ads { left: 0; bottom: 20%; animation: heroChipFloatB 5.8s .7s ease-in-out infinite; }\r\n    .chip-ai { right: 2%; bottom: 17%; animation: heroChipFloatA 6.5s .5s ease-in-out infinite; }\r\n    .hero-mini-stat {\r\n      position: absolute;\r\n      z-index: 6;\r\n      min-width: 112px;\r\n      padding: 11px 13px;\r\n      border: 1px solid rgba(0,0,0,.32);\r\n      border-radius: 14px;\r\n      background: #fff;\r\n    }\r\n    .hero-mini-stat small {\r\n      display: block;\r\n      color: #000 !important;\r\n      font-size: 8px;\r\n      font-weight: 800;\r\n      letter-spacing: .08em;\r\n      text-transform: uppercase;\r\n      opacity: .6;\r\n    }\r\n    .hero-mini-stat strong {\r\n      display: block;\r\n      margin-top: 3px;\r\n      color: #d9282f !important;\r\n      font-family: var(--font-display);\r\n      font-size: 21px;\r\n      line-height: 1;\r\n      letter-spacing: -.04em;\r\n    }\r\n    .hero-mini-stat-a { left: 8%; top: 5%; transform: rotate(-3deg); }\r\n    .hero-mini-stat-b { right: 6%; bottom: 5%; transform: rotate(3deg); }\r\n\r\n    @keyframes heroOrbitRed {\r\n      from { transform: translate(-50%,-50%) rotate(0deg); }\r\n      to { transform: translate(-50%,-50%) rotate(360deg); }\r\n    }\r\n    @keyframes heroRunnerSpin {\r\n      from { transform: translate(-50%,-50%) rotate(0deg); }\r\n      to { transform: translate(-50%,-50%) rotate(-360deg); }\r\n    }\r\n    @keyframes heroCoreFloat {\r\n      0%,100% { transform: translateY(0); }\r\n      50% { transform: translateY(-9px); }\r\n    }\r\n    @keyframes heroChipFloatA {\r\n      0%,100% { transform: translateY(0) rotate(-1deg); }\r\n      50% { transform: translateY(-9px) rotate(1.5deg); }\r\n    }\r\n    @keyframes heroChipFloatB {\r\n      0%,100% { transform: translateY(0) rotate(1deg); }\r\n      50% { transform: translateY(8px) rotate(-1.5deg); }\r\n    }\r\n    @keyframes heroLivePulse {\r\n      0%,100% { transform: scale(.72); opacity: .45; }\r\n      50% { transform: scale(1.18); opacity: 1; }\r\n    }\r\n    @keyframes heroTrack {\r\n      0% { transform: scaleX(0); }\r\n      58%,82% { transform: scaleX(1); }\r\n      100% { transform: scaleX(0); transform-origin: right; }\r\n    }\r\n\r\n    @media (max-width: 1120px) {\r\n      .hero-motion-wrap { min-height: 545px !important; }\r\n      .hero-motion-scene { width: min(90vw, 535px); }\r\n    }\r\n    @media (max-width: 720px) {\r\n      .hero-motion-wrap { min-height: 470px !important; }\r\n      .hero-motion-scene { width: min(94vw, 455px); }\r\n      .hero-growth-core { width: min(64%, 280px); min-height: 272px; padding: 23px 20px 20px; border-radius: 24px; box-shadow: 11px 11px 0 rgba(217,40,47,.07); }\r\n      .hero-core-number { margin-top: 24px; }\r\n      .hero-core-number strong { font-size: clamp(50px, 15vw, 66px); }\r\n      .hero-growth-core p { margin-top: 18px; font-size: 11px; }\r\n      .hero-float-chip { min-height: 36px; padding: 0 10px; font-size: 8.5px; }\r\n      .hero-mini-stat { min-width: 94px; padding: 9px 10px; }\r\n      .hero-mini-stat strong { font-size: 18px; }\r\n    }\r\n    @media (max-width: 430px) {\r\n      .hero-motion-wrap { min-height: 405px !important; }\r\n      .hero-motion-scene { width: min(100%, 390px); }\r\n      .hero-growth-core { width: 62%; min-height: 235px; padding: 19px 16px 17px; border-radius: 21px; }\r\n      .hero-core-top { font-size: 7.5px; padding-bottom: 12px; }\r\n      .hero-core-number { margin-top: 20px; }\r\n      .hero-core-number strong { font-size: 48px; }\r\n      .hero-core-number span { font-size: 7.5px; }\r\n      .hero-growth-core p { font-size: 9.5px; line-height: 1.45; }\r\n      .hero-core-track { margin-top: 16px; }\r\n      .hero-core-steps span { font-size: 5.8px; }\r\n      .hero-float-chip { min-height: 31px; padding: 0 8px; gap: 5px; font-size: 7px; }\r\n      .hero-float-chip i { width: 5px; height: 5px; }\r\n      .hero-mini-stat { min-width: 82px; padding: 8px; }\r\n      .hero-mini-stat small { font-size: 6.4px; }\r\n      .hero-mini-stat strong { font-size: 16px; }\r\n      .hero-mini-stat-a { left: 5%; top: 4%; }\r\n      .hero-mini-stat-b { right: 4%; bottom: 4%; }\r\n    }\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .hero-orbit-red,\r\n      .hero-orbit-runner,\r\n      .hero-growth-core,\r\n      .hero-float-chip,\r\n      .hero-live-dot::before,\r\n      .hero-core-track span { animation: none !important; }\r\n      .hero-count { transition: none !important; }\r\n    }\r\n\r\n<\/style>\r\n\r\n<\/head>\r\n<body>\r\n\r\n  <nav class=\"site-nav\" id=\"navbar\" aria-label=\"Main navigation\">\r\n    <div class=\"nav-inner\">\r\n      <a href=\"#home\" class=\"brand\" aria-label=\"Sandesh home\"><span>Sandesh.<\/span><\/a>\r\n\r\n      <div class=\"desktop-nav\">\r\n        <a href=\"#home\" class=\"active\">Home<\/a>\r\n        <a href=\"#about\">About<\/a>\r\n\r\n        <div class=\"nav-dropdown\">\r\n          <a href=\"#services\" class=\"nav-dropdown-toggle\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n            Services <span class=\"nav-chevron\" aria-hidden=\"true\">\u2304<\/span>\r\n          <\/a>\r\n          <div class=\"services-dropdown\" role=\"menu\" aria-label=\"Services\">\r\n            <div class=\"services-dropdown-head\">\r\n              <span>Services<\/span>\r\n              <small>Choose what you need<\/small>\r\n            <\/div>\r\n            <div class=\"services-dropdown-grid\">\r\n              <a href=\"#web\" role=\"menuitem\"><b>01<\/b><span><strong>Web Development<\/strong><small>Sites, CMS & web apps<\/small><\/span><\/a>\r\n              <a href=\"#software\" role=\"menuitem\"><b>02<\/b><span><strong>Software & SaaS<\/strong><small>Custom systems & APIs<\/small><\/span><\/a>\r\n              <a href=\"#mobile\" role=\"menuitem\"><b>03<\/b><span><strong>Mobile Apps<\/strong><small>iOS & Android products<\/small><\/span><\/a>\r\n              <a href=\"#marketing\" role=\"menuitem\"><b>04<\/b><span><strong>Marketing & Ads<\/strong><small>Meta, Google & growth<\/small><\/span><\/a>\r\n              <a href=\"#seo\" role=\"menuitem\"><b>05<\/b><span><strong>SEO & Leads<\/strong><small>Organic growth & funnels<\/small><\/span><\/a>\r\n              <a href=\"#branding\" role=\"menuitem\"><b>06<\/b><span><strong>Branding & UI\/UX<\/strong><small>Identity & product design<\/small><\/span><\/a>\r\n              <a href=\"#ai\" role=\"menuitem\"><b>07<\/b><span><strong>AI Automation<\/strong><small>Chatbots & workflows<\/small><\/span><\/a>\r\n              <a href=\"#ecommerce\" role=\"menuitem\"><b>08<\/b><span><strong>E-commerce<\/strong><small>Stores & conversion<\/small><\/span><\/a>\r\n            <\/div>\r\n            <a href=\"#services\" class=\"services-dropdown-all\">View all services <span>\u2197<\/span><\/a>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <a href=\"#work\">Work<\/a>\r\n        <a href=\"#faq\">FAQ<\/a>\r\n        <a href=\"#contact\">Contact<\/a>\r\n      <\/div>\r\n\r\n      <div class=\"nav-actions\">\r\n        <a class=\"btn btn-dark\" href=\"#contact\">Start a project <span>\u2197<\/span><\/a>\r\n        <button class=\"menu-btn\" id=\"menuBtn\" aria-label=\"Open navigation menu\" aria-expanded=\"false\"><span><\/span><\/button>\r\n      <\/div>\r\n    <\/div>\r\n  <\/nav>\r\n\r\n  <div class=\"mobile-panel\" id=\"mobilePanel\" aria-hidden=\"true\">\r\n    <a href=\"#home\">Home <span>01<\/span><\/a>\r\n    <a href=\"#about\">About <span>02<\/span><\/a>\r\n\r\n    <div class=\"mobile-services\">\r\n      <button class=\"mobile-services-toggle\" type=\"button\" aria-expanded=\"false\">\r\n        <span>Services<\/span><span class=\"mobile-services-meta\">03 <i aria-hidden=\"true\">\u2304<\/i><\/span>\r\n      <\/button>\r\n      <div class=\"mobile-services-list\" aria-hidden=\"true\">\r\n        <a href=\"#web\">Web Development<\/a>\r\n        <a href=\"#software\">Software & SaaS<\/a>\r\n        <a href=\"#mobile\">Mobile Apps<\/a>\r\n        <a href=\"#marketing\">Marketing & Ads<\/a>\r\n        <a href=\"#seo\">SEO & Lead Generation<\/a>\r\n        <a href=\"#branding\">Branding & UI\/UX<\/a>\r\n        <a href=\"#ai\">AI Automation<\/a>\r\n        <a href=\"#ecommerce\">E-commerce<\/a>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <a href=\"#work\">Work <span>04<\/span><\/a>\r\n    <a href=\"#faq\">FAQ <span>05<\/span><\/a>\r\n    <a href=\"#contact\">Contact <span>06<\/span><\/a>\r\n    <a class=\"btn btn-primary\" href=\"#contact\">Start a project \u2197<\/a>\r\n  <\/div>\r\n\r\n  <main>\r\n    <header class=\"hero\" id=\"home\">\r\n      <div class=\"container hero-grid\">\r\n        <div class=\"hero-copy reveal\">\r\n          <span class=\"availability\"><i aria-hidden=\"true\"><\/i> Kathmandu-based \u00b7 working worldwide<\/span>\r\n          <h1 class=\"display\">Digital systems built to <span class=\"accent\">move business.<\/span><\/h1>\r\n          <p>Sandesh combines technology, performance marketing, creative and AI automation to turn attention into measurable growth.<\/p>\r\n          <div class=\"hero-actions\">\r\n            <a class=\"btn btn-primary\" href=\"#contact\">Get a free consultation <span>\u2197<\/span><\/a>\r\n            <a class=\"btn btn-ghost\" href=\"#work\">See selected work<\/a>\r\n          <\/div>\r\n          <div class=\"hero-assurance\" aria-label=\"Project and service highlights\">\r\n            <div class=\"hero-note\">\r\n              <span class=\"hero-note-item\"><strong>No pressure.<\/strong> Tell us the goal first.<\/span>\r\n              <span class=\"hero-note-sep\" aria-hidden=\"true\">\u2022<\/span>\r\n              <span class=\"hero-note-item hero-note-whatsapp\">Reply via WhatsApp<\/span>\r\n            <\/div>\r\n            <div class=\"hero-live-service\">\r\n              <span>ALL SERVICES<\/span>\r\n              <strong id=\"heroActiveService\">Website &amp; Web Development<\/strong>\r\n            <\/div>\r\n            <div class=\"hero-proof\">\r\n              <div><strong>360\u00b0<\/strong><span>Digital strategy<\/span><\/div>\r\n              <div><strong>24\/7<\/strong><span>Growth mindset<\/span><\/div>\r\n              <div><strong>100%<\/strong><span>Client focus<\/span><\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hero-stage reveal hero-motion-wrap\" aria-label=\"Animated digital growth system\">\r\n          <div class=\"hero-motion-scene\">\r\n            <div class=\"hero-orbit hero-orbit-outer\" aria-hidden=\"true\"><\/div>\r\n            <div class=\"hero-orbit hero-orbit-red\" aria-hidden=\"true\"><\/div>\r\n            <div class=\"hero-orbit-runner\" aria-hidden=\"true\"><span><\/span><\/div>\r\n\r\n            <a class=\"hero-float-chip chip-web\" href=\"#web\"><i><\/i><span>Web systems<\/span><\/a>\r\n            <a class=\"hero-float-chip chip-seo\" href=\"#seo\"><i><\/i><span>SEO + leads<\/span><\/a>\r\n            <a class=\"hero-float-chip chip-ads\" href=\"#marketing\"><i><\/i><span>Paid growth<\/span><\/a>\r\n            <a class=\"hero-float-chip chip-ai\" href=\"#ai\"><i><\/i><span>AI automation<\/span><\/a>\r\n\r\n            <div class=\"hero-growth-core\">\r\n              <div class=\"hero-core-top\">\r\n                <span>Growth system<\/span>\r\n                <span class=\"hero-live-dot\">Live<\/span>\r\n              <\/div>\r\n              <div class=\"hero-core-number\">\r\n                <strong class=\"hero-count\" data-count=\"340\" data-suffix=\"%\">0%<\/strong>\r\n                <span>growth signal<\/span>\r\n              <\/div>\r\n              <p>Strategy, technology and marketing moving as one system.<\/p>\r\n              <div class=\"hero-core-track\" aria-hidden=\"true\"><span><\/span><\/div>\r\n              <div class=\"hero-core-steps\">\r\n                <span>Strategy<\/span><span>Build<\/span><span>Market<\/span><span>Automate<\/span>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"hero-mini-stat hero-mini-stat-a\">\r\n              <small>Digital stack<\/small><strong>360\u00b0<\/strong>\r\n            <\/div>\r\n            <div class=\"hero-mini-stat hero-mini-stat-b\">\r\n              <small>Client focus<\/small><strong>100%<\/strong>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/header>\r\n\r\n    <section class=\"proof-strip section-tight\" aria-label=\"Performance highlights\">\r\n      <div class=\"container proof-grid\">\r\n        <div class=\"proof-intro\">A digital partner for brands that want practical execution, not empty buzzwords.<\/div>\r\n        <div class=\"proof-stat\"><strong>500+<\/strong><span>orders in 3 months<\/span><\/div>\r\n        <div class=\"proof-stat\"><strong>14K+<\/strong><span>paid campaign reach<\/span><\/div>\r\n        <div class=\"proof-stat\"><strong>340%<\/strong><span>organic traffic growth<\/span><\/div>\r\n        <div class=\"proof-stat\"><strong>1M+<\/strong><span>short-form views<\/span><\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section\" id=\"services\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head reveal\">\r\n          <div>\r\n            <span class=\"kicker\">What we do<\/span>\r\n            <h2 class=\"section-title\">One partner for your <span class=\"accent\">digital growth stack.<\/span><\/h2>\r\n          <\/div>\r\n          <p class=\"section-lead\">From product and web engineering to performance marketing and automation, every service is tied back to a business outcome.<\/p>\r\n        <\/div>\r\n\r\n        <div class=\"service-grid\">\r\n          <article class=\"service-card reveal\" id=\"web\">\r\n            <span class=\"service-index\">01 \u00b7 BUILD<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>Website & Web Development<\/h3>\r\n            <p>Custom websites, CMS and web applications designed around speed, usability, security and conversion.<\/p>\r\n            <div class=\"service-tags\"><span>Custom builds<\/span><span>WordPress<\/span><span>Webflow<\/span><span>E-commerce<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"software\">\r\n            <span class=\"service-index\">02 \u00b7 ENGINEER<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>Custom Software & SaaS<\/h3>\r\n            <p>Tailored software products, APIs and cloud solutions built to streamline operations and solve complex business problems.<\/p>\r\n            <div class=\"service-tags\"><span>SaaS products<\/span><span>APIs<\/span><span>Cloud<\/span><span>Integrations<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"mobile\">\r\n            <span class=\"service-index\">03 \u00b7 MOBILE<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>Mobile App Development<\/h3>\r\n            <p>Native and cross-platform mobile apps for iOS and Android with thoughtful UX and production-ready delivery.<\/p>\r\n            <div class=\"service-tags\"><span>Flutter<\/span><span>React Native<\/span><span>iOS<\/span><span>Android<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"marketing\">\r\n            <span class=\"service-index\">04 \u00b7 ACQUIRE<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>Digital Marketing & Paid Ads<\/h3>\r\n            <p>Data-led Meta, Google and LinkedIn campaigns built to generate qualified traffic, leads and sales.<\/p>\r\n            <div class=\"service-tags\"><span>Meta Ads<\/span><span>Google Ads<\/span><span>Retargeting<\/span><span>Analytics<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"seo\">\r\n            <span class=\"service-index\">05 \u00b7 DISCOVER<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>SEO & Lead Generation<\/h3>\r\n            <p>Technical SEO, content and conversion funnels that create compounding organic visibility and high-intent enquiries.<\/p>\r\n            <div class=\"service-tags\"><span>Technical SEO<\/span><span>Content<\/span><span>Funnels<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"branding\">\r\n            <span class=\"service-index\">06 \u00b7 POSITION<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>Branding & UI\/UX Design<\/h3>\r\n            <p>Brand identities and interface systems that make businesses easier to trust, recognize and choose.<\/p>\r\n            <div class=\"service-tags\"><span>Brand strategy<\/span><span>Identity<\/span><span>UI\/UX<\/span><span>Prototyping<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"ai\">\r\n            <span class=\"service-index\">07 \u00b7 AUTOMATE<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>AI & Automation Solutions<\/h3>\r\n            <p>AI chatbots, automated workflows and smart integrations that reduce repetitive work and improve response speed.<\/p>\r\n            <div class=\"service-tags\"><span>AI chatbots<\/span><span>Make<\/span><span>Zapier<\/span><span>Custom AI<\/span><\/div>\r\n          <\/article>\r\n          <article class=\"service-card reveal\" id=\"ecommerce\">\r\n            <span class=\"service-index\">08 \u00b7 SELL<\/span><span class=\"service-arrow\">\u2197<\/span>\r\n            <h3>E-commerce Solutions<\/h3>\r\n            <p>Conversion-focused stores, payment integrations and e-commerce marketing that turn browsing into buying.<\/p>\r\n            <div class=\"service-tags\"><span>Shopify<\/span><span>WooCommerce<\/span><span>Payments<\/span><span>Analytics<\/span><\/div>\r\n          <\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section process\" id=\"process\">\r\n      <div class=\"container process-layout\">\r\n        <div class=\"process-copy reveal\">\r\n          <span class=\"kicker\">How we work<\/span>\r\n          <h2 class=\"section-title\">Less chaos. More <span class=\"accent\">momentum.<\/span><\/h2>\r\n          <p class=\"section-lead\">A simple four-stage process keeps strategy, creative, technology and measurement moving in the same direction.<\/p>\r\n          <a class=\"btn btn-ghost\" href=\"#contact\" style=\"margin-top:28px\">Discuss your project \u2197<\/a>\r\n        <\/div>\r\n        <div class=\"steps\">\r\n          <article class=\"step reveal\"><span class=\"step-num\">01<\/span><div><h3>Discover the real goal<\/h3><p>We start with the business objective, customer, constraints and current data\u2014not a list of trendy deliverables.<\/p><\/div><\/article>\r\n          <article class=\"step reveal\"><span class=\"step-num\">02<\/span><div><h3>Design the system<\/h3><p>We map the right combination of product, creative, acquisition and automation around the outcome you need.<\/p><\/div><\/article>\r\n          <article class=\"step reveal\"><span class=\"step-num\">03<\/span><div><h3>Build & launch<\/h3><p>We move from idea to production with clear milestones, focused execution and practical feedback loops.<\/p><\/div><\/article>\r\n          <article class=\"step reveal\"><span class=\"step-num\">04<\/span><div><h3>Measure & improve<\/h3><p>We track the signals that matter, identify friction and iterate so the system gets stronger over time.<\/p><\/div><\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section\" id=\"work\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head reveal\">\r\n          <div><span class=\"kicker\">Selected work<\/span><h2 class=\"section-title\">Built for attention. <span class=\"accent\">Designed for action.<\/span><\/h2><\/div>\r\n          <p class=\"section-lead\">A snapshot of the outcomes and growth problems our work is designed to address.<\/p>\r\n        <\/div>\r\n        <div class=\"work-grid\">\r\n          <article class=\"case-card dark reveal\"><div class=\"case-meta\"><span>SEO \/ Growth<\/span><span class=\"case-number\">01<\/span><\/div><div><div class=\"case-metric\">340%<\/div><h3>Organic traffic grew 340% in six months.<\/h3><p>Keyword research \u00b7 On-page optimization \u00b7 Link building<\/p><\/div><\/article>\r\n          <article class=\"case-card red reveal\"><div class=\"case-meta\"><span>E-commerce<\/span><span class=\"case-number\">02<\/span><\/div><div><div class=\"case-metric\">500+<\/div><h3>From zero to 500+ orders in three months.<\/h3><p>AI product feed \u00b7 Meta Ads \u00b7 Store optimisation<\/p><\/div><\/article>\r\n          <article class=\"case-card reveal\"><div class=\"case-meta\"><span>AI Automation<\/span><span class=\"case-number\">03<\/span><\/div><div><div class=\"case-metric\">20H<\/div><h3>Saved 20+ hours every week with AI workflows.<\/h3><p>AI chatbots \u00b7 Content automation \u00b7 Lead scoring<\/p><\/div><\/article>\r\n          <article class=\"case-card dark reveal\"><div class=\"case-meta\"><span>Video Marketing<\/span><span class=\"case-number\">04<\/span><\/div><div><div class=\"case-metric\">1M+<\/div><h3>Short-form content generated 1M+ views in two weeks.<\/h3><p>Reels \u00b7 TikTok \u00b7 YouTube Shorts \u00b7 Viral hooks<\/p><\/div><\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section pricing\" id=\"pricing\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head reveal\">\r\n          <div><span class=\"kicker\">Pricing plans<\/span><h2 class=\"section-title\">Choose a plan that matches your <span class=\"accent\">growth stage.<\/span><\/h2><\/div>\r\n          <p class=\"section-lead\">Clear starting points for common needs. Larger or more complex projects can be scoped separately.<\/p>\r\n        <\/div>\r\n        <div class=\"pricing-grid\">\r\n          <article class=\"price-card reveal\">\r\n            <span class=\"plan\">Starter<\/span><div class=\"price\">$499 <small>\/mo<\/small><\/div><p class=\"price-copy\">For smaller businesses building a credible digital foundation.<\/p>\r\n            <ul class=\"feature-list\"><li>5-page website development<\/li><li>SEO for 10 keywords<\/li><li>3 social platforms<\/li><li>Monthly reporting<\/li><li>48-hour email support<\/li><\/ul>\r\n            <a href=\"#contact\" class=\"btn btn-light\">Get started \u2197<\/a>\r\n          <\/article>\r\n          <article class=\"price-card featured reveal\">\r\n            <span class=\"popular\">Most popular<\/span><span class=\"plan\">Professional<\/span><div class=\"price\">$999 <small>\/mo<\/small><\/div><p class=\"price-copy\">For growing brands ready to combine acquisition, content and web.<\/p>\r\n            <ul class=\"feature-list\"><li>Website + custom web app<\/li><li>SEO + lead gen for 25 keywords<\/li><li>Meta & Google Ads<\/li><li>4 blogs per month<\/li><li>Branding & UI\/UX<\/li><li>Weekly reviews<\/li><\/ul>\r\n            <a href=\"#contact\" class=\"btn btn-primary\">Get started \u2197<\/a>\r\n          <\/article>\r\n          <article class=\"price-card reveal\">\r\n            <span class=\"plan\">Business<\/span><div class=\"price\">$1,999 <small>\/mo<\/small><\/div><p class=\"price-copy\">For established teams needing a broader technology and marketing mix.<\/p>\r\n            <ul class=\"feature-list\"><li>Software \/ SaaS development<\/li><li>Mobile app development<\/li><li>50+ keyword SEO<\/li><li>Multi-channel advertising<\/li><li>AI automation<\/li><li>Dedicated account manager<\/li><\/ul>\r\n            <a href=\"#contact\" class=\"btn btn-light\">Get started \u2197<\/a>\r\n          <\/article>\r\n          <article class=\"price-card reveal\">\r\n            <span class=\"plan\">Enterprise<\/span><div class=\"price\">Custom<\/div><p class=\"price-copy\">For complex, cross-functional requirements that need a dedicated scope.<\/p>\r\n            <ul class=\"feature-list\"><li>Full-stack development<\/li><li>Comprehensive digital marketing<\/li><li>Advanced AI & automation<\/li><li>Enterprise SEO<\/li><li>Custom APIs & integrations<\/li><li>Dedicated team support<\/li><\/ul>\r\n            <a href=\"#contact\" class=\"btn btn-light\">Request quote \u2197<\/a>\r\n          <\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section\" id=\"about\">\r\n      <div class=\"container why-grid\">\r\n        <div class=\"why-quote reveal\"><p>\u201cGood digital work should make the business easier to understand, easier to choose and easier to grow.\u201d<\/p><small>Our working principle at Sandesh<\/small><\/div>\r\n        <div class=\"reveal\">\r\n          <span class=\"kicker\">Why Sandesh<\/span>\r\n          <h2 class=\"section-title\">Practical execution, backed by <span class=\"accent\">care.<\/span><\/h2>\r\n          <div class=\"why-list\" style=\"margin-top:34px\">\r\n            <article class=\"why-item\"><strong>100% Genuine<\/strong><p>Authentic, licensed software from trusted vendors with quality and compliance in mind.<\/p><\/article>\r\n            <article class=\"why-item\"><strong>Expert Support<\/strong><p>Responsive guidance and clear communication throughout delivery and beyond.<\/p><\/article>\r\n            <article class=\"why-item\"><strong>Trusted Partner<\/strong><p>We focus on long-term usefulness instead of shipping work that looks good but does not perform.<\/p><\/article>\r\n            <article class=\"why-item\"><strong>Cost-Effective<\/strong><p>Solutions are chosen around business value, complexity and the return they can reasonably create.<\/p><\/article>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n\r\n\r\n    <section class=\"section faq-section\" id=\"faq\">\r\n      <div class=\"container faq-layout\">\r\n        <div class=\"faq-intro reveal\">\r\n          <span class=\"kicker\">Frequently asked questions<\/span>\r\n          <h2 class=\"section-title\">Questions before we <span class=\"accent\">start?<\/span><\/h2>\r\n          <p class=\"section-lead\">Straight answers about timelines, pricing, support and how projects usually work with Sandesh.<\/p>\r\n          <a class=\"faq-contact-link\" href=\"#contact\">Still have a question? Ask us <span>\u2197<\/span><\/a>\r\n        <\/div>\r\n\r\n        <div class=\"faq-list reveal\">\r\n          <details class=\"faq-item\" open>\r\n            <summary>What services do you provide?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>We work across web development, custom software, mobile apps, SEO, paid advertising, branding and UI\/UX, AI automation, e-commerce, hosting and digital consulting.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>How much does a project cost?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>Pricing depends on scope, complexity and the level of ongoing support required. You can use the plans above as starting points, or contact us for a custom quote based on your exact requirements.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>How long does a website or digital project take?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>A focused website can often move quickly, while custom software, apps and larger marketing systems need more planning and development time. After the initial discussion, we provide a clearer scope and delivery timeline.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>Do you work with clients outside Nepal?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>Yes. Sandesh is based in Kathmandu, Nepal, and can work remotely with businesses and teams worldwide using online meetings, shared project tools and regular progress updates.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>Can you handle both development and marketing?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>Yes. We can combine development, SEO, paid ads, content, design and automation so the website or product and the growth strategy work together instead of being handled in isolation.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>Do you provide support after launch?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>Yes. Ongoing support can include maintenance, improvements, marketing, SEO, campaign management, analytics and automation updates depending on the project and support plan.<\/p><\/div>\r\n          <\/details>\r\n\r\n          <details class=\"faq-item\">\r\n            <summary>How do we get started?<span class=\"faq-icon\" aria-hidden=\"true\"><\/span><\/summary>\r\n            <div class=\"faq-answer\"><p>Send a short enquiry with your goals, current challenges and the service you need. We\u2019ll review it, discuss the best next step and then define the scope, timeline and budget before work begins.<\/p><\/div>\r\n          <\/details>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"section\" id=\"contact\">\r\n      <div class=\"container contact-wrap reveal\">\r\n        <div class=\"contact-info\">\r\n          <span class=\"kicker\">Let's grow together<\/span>\r\n          <h2>Have a project in mind?<\/h2>\r\n          <p>Tell us what you are trying to achieve. We\u2019ll help you identify the right next move.<\/p>\r\n          <div class=\"contact-items\">\r\n            <div class=\"contact-item\"><small>Call us<\/small><strong><a href=\"tel:+9779866275931\">+977 9866275931<\/a><\/strong><\/div>\r\n            <div class=\"contact-item\"><small>Email<\/small><strong><a href=\"mailto:info@tsandesh.com.np\">info@tsandesh.com.np<\/a><\/strong><\/div>\r\n            <div class=\"contact-item\"><small>Location<\/small><strong>Kathmandu, Nepal<\/strong><\/div>\r\n            <div class=\"contact-item\"><small>Hours<\/small><strong>Mon\u2013Sun \u00b7 9:00\u201318:00<\/strong><\/div>\r\n          <\/div>\r\n          <div class=\"contact-motion\" aria-label=\"Ready for your next project\">\r\n            <div class=\"contact-motion-bars\" aria-hidden=\"true\">\r\n              <i><\/i><i><\/i><i><\/i><i><\/i><i><\/i>\r\n            <\/div>\r\n            <div class=\"contact-motion-copy\">\r\n              <small>READY FOR YOUR NEXT PROJECT<\/small>\r\n              <strong>Let\u2019s make it move.<\/strong>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <form class=\"contact-form\" id=\"contactForm\" novalidate>\r\n          <div class=\"form-head\"><h3>Quick enquiry<\/h3><p>Fill this in and we\u2019ll open WhatsApp with your details ready to send.<\/p><\/div>\r\n          <div class=\"field-grid\">\r\n            <div class=\"field\"><label for=\"fullName\">Full name<\/label><input id=\"fullName\" name=\"name\" type=\"text\" autocomplete=\"name\" placeholder=\"Your name\" \/><span class=\"error-msg\">Please enter your name.<\/span><\/div>\r\n            <div class=\"field\"><label for=\"email\">Email address<\/label><input id=\"email\" name=\"email\" type=\"email\" autocomplete=\"email\" placeholder=\"you@company.com\" \/><span class=\"error-msg\">Enter a valid email.<\/span><\/div>\r\n            <div class=\"field\"><label for=\"phone\">Phone number<\/label><input id=\"phone\" name=\"phone\" type=\"tel\" autocomplete=\"tel\" placeholder=\"+977 ...\" \/><span class=\"error-msg\">Enter your phone number.<\/span><\/div>\r\n            <div class=\"field\"><label for=\"company\">Company \/ brand<\/label><input id=\"company\" name=\"company\" type=\"text\" autocomplete=\"organization\" placeholder=\"Company name\" \/><span class=\"error-msg\">Enter your company or brand.<\/span><\/div>\r\n            <div class=\"field full\"><label for=\"service\">I'm interested in\u2026<\/label><select id=\"service\" name=\"service\"><option value=\"\">Choose a service<\/option><option>Website & Web Development<\/option><option>Custom Software & SaaS<\/option><option>Mobile App Development<\/option><option>Digital Marketing & Paid Ads<\/option><option>SEO & Lead Generation<\/option><option>Branding & UI\/UX Design<\/option><option>AI & Automation Solutions<\/option><option>E-commerce Solutions<\/option><option>Domain & Hosting<\/option><option>Training & Consulting<\/option><option>Other<\/option><\/select><span class=\"error-msg\">Select a service.<\/span><\/div>\r\n            <div class=\"field full\"><label for=\"message\">Tell us about your project<\/label><textarea id=\"message\" name=\"message\" placeholder=\"What are you trying to improve, launch or grow?\"><\/textarea><span class=\"error-msg\">Add a short project description.<\/span><\/div>\r\n          <\/div>\r\n          <button class=\"btn btn-primary\" type=\"submit\" id=\"submitBtn\">Send on WhatsApp \u2197<\/button>\r\n          <p class=\"privacy\">Your details stay in your browser until you choose to send the WhatsApp message.<\/p>\r\n        <\/form>\r\n      <\/div>\r\n    <\/section>\r\n  <\/main>\r\n\r\n  <footer class=\"site-footer\" id=\"footer\">\r\n    <div class=\"container\">\r\n      <div class=\"footer-cta\">\r\n        <div>\r\n          <span class=\"footer-kicker\">Have an idea?<\/span>\r\n          <h2>Let's build something<br><span>that performs.<\/span><\/h2>\r\n        <\/div>\r\n        <a class=\"footer-cta-btn\" href=\"#contact\">Start a project <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n      <\/div>\r\n\r\n      <div class=\"footer-main\">\r\n        <div class=\"footer-brand-block\">\r\n          <a href=\"#home\" class=\"brand footer-logo\" aria-label=\"Sandesh home\"><span>Sandesh.<\/span><\/a>\r\n          <p>Digital products, marketing and automation built to turn attention into measurable business growth.<\/p>\r\n          <div class=\"footer-availability\"><span aria-hidden=\"true\"><\/span> Available for new projects<\/div>\r\n          <div class=\"footer-brand-socials\" aria-label=\"Social media links\">\r\n            <a href=\"https:\/\/www.facebook.com\/profile.php?id=61571086033511\" target=\"_blank\" rel=\"noopener\" aria-label=\"Facebook\" title=\"Facebook\">\r\n              <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M14 8h3V4.5c-.52-.07-2.31-.22-4.44-.22-4.44 0-7.48 2.71-7.48 7.69V16H2v4h3.08v10h4.72V20h3.58l.57-4H9.8v-3.64C9.8 11.2 10.12 10.4 12.17 10.4H14V8Z\" transform=\"scale(.75) translate(4 0)\"\/><\/svg>\r\n              <span>Facebook<\/span>\r\n            <\/a>\r\n            <a href=\"https:\/\/www.instagram.com\/tsandesh\" target=\"_blank\" rel=\"noopener\" aria-label=\"Instagram\" title=\"Instagram\">\r\n              <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"5\" ry=\"5\"\/><circle cx=\"12\" cy=\"12\" r=\"4.2\"\/><circle cx=\"17.4\" cy=\"6.7\" r=\"1\" class=\"dot\"\/><\/svg>\r\n              <span>Instagram<\/span>\r\n            <\/a>\r\n            <a href=\"https:\/\/www.linkedin.com\/in\/sandeshthapa007\/\" target=\"_blank\" rel=\"noopener\" aria-label=\"LinkedIn\" title=\"LinkedIn\">\r\n              <svg viewBox=\"0 0 24 24\" aria-hidden=\"true\"><rect x=\"3\" y=\"9\" width=\"4\" height=\"12\" rx=\"1\"\/><circle cx=\"5\" cy=\"5\" r=\"2\"\/><path d=\"M10 9h4v1.7c1.05-1.28 2.43-2.05 4.2-2.05 3.2 0 4.8 2.05 4.8 5.85V21h-4v-5.75c0-1.75-.63-2.85-2.08-2.85-1.72 0-2.92 1.17-2.92 3.53V21h-4V9Z\"\/><\/svg>\r\n              <span>LinkedIn<\/span>\r\n            <\/a>\r\n            <a href=\"https:\/\/wa.me\/9779866275931\" target=\"_blank\" rel=\"noopener\" aria-label=\"WhatsApp\" title=\"WhatsApp\">\r\n              <svg viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path d=\"M19.11 17.43c-.27-.14-1.58-.78-1.82-.87-.24-.09-.42-.14-.6.14-.18.27-.69.87-.84 1.05-.15.18-.31.2-.58.07-.27-.14-1.13-.42-2.16-1.33-.8-.71-1.34-1.59-1.5-1.86-.16-.27-.02-.42.12-.55.12-.12.27-.31.4-.46.13-.16.18-.27.27-.45.09-.18.04-.34-.02-.47-.07-.14-.6-1.44-.82-1.97-.22-.52-.44-.45-.6-.46h-.51c-.18 0-.47.07-.71.34-.24.27-.93.91-.93 2.22s.95 2.58 1.09 2.76c.13.18 1.87 2.86 4.53 4.01.63.27 1.13.44 1.51.56.64.2 1.21.17 1.67.1.51-.08 1.58-.65 1.8-1.27.22-.62.22-1.15.16-1.27-.07-.11-.25-.18-.52-.31Zm-3.05 8.25h-.01a10.07 10.07 0 0 1-5.13-1.4l-.37-.22-3.81 1 1.02-3.71-.24-.38a10.05 10.05 0 1 1 8.54 4.71Zm0-22.68A12.99 12.99 0 0 0 5.02 22.85L3.18 29.6l6.9-1.81A12.99 12.99 0 1 0 16.06 3Z\"\/><\/svg>\r\n              <span>WhatsApp<\/span>\r\n            <\/a>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <nav class=\"footer-links\" aria-label=\"Footer navigation\">\r\n          <div class=\"footer-group\">\r\n            <p class=\"footer-heading\">Explore<\/p>\r\n            <a href=\"#services\">Services <span>\u2197<\/span><\/a>\r\n            <a href=\"#process\">Process <span>\u2197<\/span><\/a>\r\n            <a href=\"#work\">Work <span>\u2197<\/span><\/a>\r\n            <a href=\"#pricing\">Pricing <span>\u2197<\/span><\/a>\r\n            <a href=\"#about\">About <span>\u2197<\/span><\/a>\r\n            <a href=\"#faq\">FAQ <span>\u2197<\/span><\/a>\r\n          <\/div>\r\n\r\n          <div class=\"footer-group\">\r\n            <p class=\"footer-heading\">Services<\/p>\r\n            <a href=\"#web\">Web development<\/a>\r\n            <a href=\"#marketing\">Digital marketing<\/a>\r\n            <a href=\"#seo\">SEO & lead generation<\/a>\r\n            <a href=\"#branding\">Branding & UI\/UX<\/a>\r\n            <a href=\"#ai\">AI automation<\/a>\r\n          <\/div>\r\n\r\n          <div class=\"footer-group footer-contact-group\">\r\n            <p class=\"footer-heading\">Contact<\/p>\r\n            <a class=\"footer-contact-link\" href=\"tel:+9779866275931\">\r\n              <small>Call<\/small>\r\n              <strong>+977 9866275931<\/strong>\r\n            <\/a>\r\n            <a class=\"footer-contact-link\" href=\"mailto:info@tsandesh.com.np\">\r\n              <small>Email<\/small>\r\n              <strong>info@tsandesh.com.np<\/strong>\r\n            <\/a>\r\n            <div class=\"footer-contact-link\">\r\n              <small>Based in<\/small>\r\n              <strong>Kathmandu, Nepal<\/strong>\r\n            <\/div>\r\n          <\/div>\r\n        <\/nav>\r\n      <\/div>\r\n\r\n      <div class=\"footer-bottom-new\">\r\n        <div class=\"footer-copy\">\u00a9 <span id=\"year\"><\/span> Sandesh. All rights reserved.<\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n  <button class=\"to-top\" id=\"toTop\" aria-label=\"Back to top\">\u2191<\/button>\r\n  <a class=\"float-wa\" href=\"https:\/\/wa.me\/9779866275931?text=Namaste%20Sandesh%20%F0%9F%99%8F%0A%0AI%20came%20across%20your%20website%20and%20I'm%20interested%20in%20working%20with%20you.\" target=\"_blank\" rel=\"noopener\" aria-label=\"Chat with Sandesh on WhatsApp\">\r\n    <svg viewBox=\"0 0 32 32\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M19.11 17.43c-.27-.14-1.58-.78-1.82-.87-.24-.09-.42-.14-.6.14-.18.27-.69.87-.84 1.05-.15.18-.31.2-.58.07-.27-.14-1.13-.42-2.16-1.33-.8-.71-1.34-1.59-1.5-1.86-.16-.27-.02-.42.12-.55.12-.12.27-.31.4-.46.13-.16.18-.27.27-.45.09-.18.04-.34-.02-.47-.07-.14-.6-1.44-.82-1.97-.22-.52-.44-.45-.6-.46h-.51c-.18 0-.47.07-.71.34-.24.27-.93.91-.93 2.22s.95 2.58 1.09 2.76c.13.18 1.87 2.86 4.53 4.01.63.27 1.13.44 1.51.56.64.2 1.21.17 1.67.1.51-.08 1.58-.65 1.8-1.27.22-.62.22-1.15.16-1.27-.07-.11-.25-.18-.52-.31Zm-3.05 8.25h-.01a10.07 10.07 0 0 1-5.13-1.4l-.37-.22-3.81 1 1.02-3.71-.24-.38a10.05 10.05 0 1 1 8.54 4.71Zm0-22.68A12.99 12.99 0 0 0 5.02 22.85L3.18 29.6l6.9-1.81A12.99 12.99 0 1 0 16.06 3Z\"\/><\/svg>\r\n  <\/a>\r\n\r\n  <script>\r\n    (() => {\r\n      const nav = document.getElementById('navbar');\r\n      const menuBtn = document.getElementById('menuBtn');\r\n      const mobilePanel = document.getElementById('mobilePanel');\r\n      const toTop = document.getElementById('toTop');\r\n      const navLinks = [...document.querySelectorAll('.desktop-nav > a, .nav-dropdown > .nav-dropdown-toggle')];\r\n      const sections = [...document.querySelectorAll('main [id]')];\r\n\r\n      const mobileServices = mobilePanel.querySelector('.mobile-services');\r\n      const mobileServicesToggle = mobilePanel.querySelector('.mobile-services-toggle');\r\n      const mobileServicesList = mobilePanel.querySelector('.mobile-services-list');\r\n      const desktopDropdown = document.querySelector('.nav-dropdown');\r\n      const desktopDropdownToggle = document.querySelector('.nav-dropdown-toggle');\r\n\r\n      const setMobileServices = (open) => {\r\n        if (!mobileServices || !mobileServicesToggle || !mobileServicesList) return;\r\n        mobileServices.classList.toggle('open', open);\r\n        mobileServicesToggle.setAttribute('aria-expanded', String(open));\r\n        mobileServicesList.setAttribute('aria-hidden', String(!open));\r\n      };\r\n\r\n      const setMenu = (open) => {\r\n        menuBtn.classList.toggle('active', open);\r\n        mobilePanel.classList.toggle('open', open);\r\n        menuBtn.setAttribute('aria-expanded', String(open));\r\n        mobilePanel.setAttribute('aria-hidden', String(!open));\r\n        document.body.classList.toggle('menu-open', open);\r\n        if (!open) setMobileServices(false);\r\n      };\r\n\r\n      menuBtn.addEventListener('click', () => setMenu(!mobilePanel.classList.contains('open')));\r\n      mobileServicesToggle?.addEventListener('click', () => setMobileServices(!mobileServices.classList.contains('open')));\r\n      mobilePanel.querySelectorAll('a').forEach(link => link.addEventListener('click', () => setMenu(false)));\r\n\r\n      desktopDropdownToggle?.addEventListener('click', e => {\r\n        if (window.matchMedia('(pointer: coarse)').matches && window.innerWidth > 1050) {\r\n          if (!desktopDropdown.classList.contains('open')) {\r\n            e.preventDefault();\r\n            desktopDropdown.classList.add('open');\r\n            desktopDropdownToggle.setAttribute('aria-expanded', 'true');\r\n          }\r\n        }\r\n      });\r\n      document.addEventListener('click', e => {\r\n        if (desktopDropdown && !desktopDropdown.contains(e.target)) {\r\n          desktopDropdown.classList.remove('open');\r\n          desktopDropdownToggle?.setAttribute('aria-expanded', 'false');\r\n        }\r\n      });\r\n      document.addEventListener('keydown', e => {\r\n        if (e.key === 'Escape') {\r\n          setMenu(false);\r\n          desktopDropdown?.classList.remove('open');\r\n          desktopDropdownToggle?.setAttribute('aria-expanded', 'false');\r\n        }\r\n      });\r\n\r\n      const onScroll = () => {\r\n        nav.classList.toggle('scrolled', window.scrollY > 18);\r\n        toTop.classList.toggle('show', window.scrollY > 700);\r\n\r\n        let current = 'home';\r\n        for (const section of sections) {\r\n          if (section.getBoundingClientRect().top <= 130) current = section.id;\r\n        }\r\n        navLinks.forEach(link => {\r\n          const href = link.getAttribute('href').slice(1);\r\n          link.classList.toggle('active', href === current || (href === 'services' && ['web','software','mobile','marketing','seo','branding','ai','ecommerce'].includes(current)));\r\n        });\r\n      };\r\n\r\n      window.addEventListener('scroll', onScroll, { passive: true });\r\n      onScroll();\r\n      toTop.addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' }));\r\n      document.getElementById('year').textContent = new Date().getFullYear();\r\n\r\n      if ('IntersectionObserver' in window) {\r\n        const observer = new IntersectionObserver(entries => {\r\n          entries.forEach(entry => {\r\n            if (entry.isIntersecting) {\r\n              entry.target.classList.add('in');\r\n              observer.unobserve(entry.target);\r\n            }\r\n          });\r\n        }, { threshold: 0.12, rootMargin: '0px 0px -40px' });\r\n        document.querySelectorAll('.reveal').forEach(el => observer.observe(el));\r\n      } else {\r\n        document.querySelectorAll('.reveal').forEach(el => el.classList.add('in'));\r\n      }\r\n\r\n\r\n\r\n      \/\/ Advanced interactive hero services engine\r\n      const growthEngine = document.getElementById('growthEngine');\r\n      const engineShell = document.getElementById('engineShell');\r\n      const serviceCurrent = document.getElementById('serviceCurrent');\r\n      const serviceTotal = document.getElementById('serviceTotal');\r\n      const serviceIcon = document.getElementById('serviceIcon');\r\n      const serviceType = document.getElementById('serviceType');\r\n      const serviceName = document.getElementById('serviceName');\r\n      const serviceDesc = document.getElementById('serviceDesc');\r\n      const serviceFocus = document.getElementById('serviceFocus');\r\n      const serviceStack = document.getElementById('serviceStack');\r\n      const serviceOutcome = document.getElementById('serviceOutcome');\r\n      const serviceProgress = document.getElementById('serviceProgress');\r\n      const heroActiveService = document.getElementById('heroActiveService');\r\n      const servicePrev = document.getElementById('servicePrev');\r\n      const serviceNext = document.getElementById('serviceNext');\r\n      const serviceNodes = [...document.querySelectorAll('.engine-node[data-service]')];\r\n\r\n      const heroServices = [\r\n        { icon: '<\/>', type: 'BUILD', name: 'Website & Web Development', desc: 'Fast, conversion-focused websites and web applications built for modern brands.', focus: 'Conversion', stack: 'Web + CMS', outcome: 'More leads' },\r\n        { icon: '{}', type: 'ENGINEER', name: 'Custom Software & SaaS', desc: 'Purpose-built software, APIs and cloud systems that simplify complex business operations.', focus: 'Systems', stack: 'API + Cloud', outcome: 'Scale ops' },\r\n        { icon: 'APP', type: 'MOBILE', name: 'Mobile App Development', desc: 'Practical mobile experiences designed for usability, performance and long-term scale.', focus: 'Product', stack: 'iOS + Android', outcome: 'User growth' },\r\n        { icon: '\u2197', type: 'GROW', name: 'Digital Marketing & Paid Ads', desc: 'Performance campaigns across Meta and Google focused on reach, leads and measurable return.', focus: 'ROAS', stack: 'Meta + Google', outcome: 'More sales' },\r\n        { icon: '01', type: 'RANK', name: 'SEO & Lead Generation', desc: 'Technical SEO, content and conversion funnels that compound visibility and qualified enquiries.', focus: 'Organic', stack: 'SEO + Content', outcome: 'Rank + leads' },\r\n        { icon: 'Aa', type: 'DESIGN', name: 'Branding & UI\/UX Design', desc: 'Clear identities and digital interfaces that make your business easier to recognize and trust.', focus: 'Clarity', stack: 'Brand + UI', outcome: 'More trust' },\r\n        { icon: 'AI', type: 'AUTOMATE', name: 'AI & Automation Solutions', desc: 'Smart workflows, chatbots and automations that reduce repetitive work and improve response speed.', focus: 'Efficiency', stack: 'AI + Workflow', outcome: 'Save time' },\r\n        { icon: 'CART', type: 'SELL', name: 'E-commerce Solutions', desc: 'Online stores engineered around smooth shopping, reliable operations and higher conversion.', focus: 'Commerce', stack: 'Store + CRO', outcome: 'Sell more' },\r\n        { icon: 'WWW', type: 'HOST', name: 'Domain & Hosting', desc: 'Reliable domain, hosting and deployment support to keep your digital presence fast and available.', focus: 'Uptime', stack: 'DNS + Hosting', outcome: 'Stay online' },\r\n        { icon: '\u2192', type: 'GUIDE', name: 'Training & Consulting', desc: 'Hands-on digital guidance and team training built around your actual tools, goals and workflow.', focus: 'Strategy', stack: 'Audit + Training', outcome: 'Move faster' }\r\n      ];\r\n\r\n      if (engineShell && serviceName) {\r\n        let serviceIndex = 0;\r\n        let serviceTimer;\r\n        const reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n        serviceTotal.textContent = String(heroServices.length).padStart(2, '0');\r\n\r\n        const restartProgress = () => {\r\n          if (!serviceProgress || reduceMotion) return;\r\n          serviceProgress.style.animation = 'none';\r\n          void serviceProgress.offsetWidth;\r\n          serviceProgress.style.animation = '';\r\n        };\r\n\r\n        const renderService = (index, restart = true) => {\r\n          serviceIndex = (index + heroServices.length) % heroServices.length;\r\n          const item = heroServices[serviceIndex];\r\n          engineShell.classList.remove('is-changing');\r\n          void engineShell.offsetWidth;\r\n          serviceIcon.textContent = item.icon;\r\n          serviceType.textContent = item.type;\r\n          serviceName.textContent = item.name;\r\n          serviceDesc.textContent = item.desc;\r\n          serviceFocus.textContent = item.focus;\r\n          serviceStack.textContent = item.stack;\r\n          serviceOutcome.textContent = item.outcome;\r\n          serviceCurrent.textContent = String(serviceIndex + 1).padStart(2, '0');\r\n          if (heroActiveService) heroActiveService.textContent = item.name;\r\n          serviceNodes.forEach((node, idx) => {\r\n            const active = idx === serviceIndex;\r\n            node.classList.toggle('active', active);\r\n            node.setAttribute('aria-pressed', active ? 'true' : 'false');\r\n          });\r\n          engineShell.classList.add('is-changing');\r\n          if (restart) restartProgress();\r\n        };\r\n\r\n        const stopAuto = () => { if (serviceTimer) window.clearInterval(serviceTimer); };\r\n        const startAuto = () => {\r\n          stopAuto();\r\n          if (!reduceMotion) serviceTimer = window.setInterval(() => renderService(serviceIndex + 1), 3400);\r\n        };\r\n\r\n        serviceNodes.forEach((node, idx) => {\r\n          node.setAttribute('aria-label', `Show ${heroServices[idx].name}`);\r\n          node.setAttribute('aria-pressed', idx === 0 ? 'true' : 'false');\r\n          node.addEventListener('click', () => { renderService(idx); startAuto(); });\r\n        });\r\n        servicePrev?.addEventListener('click', () => { renderService(serviceIndex - 1); startAuto(); });\r\n        serviceNext?.addEventListener('click', () => { renderService(serviceIndex + 1); startAuto(); });\r\n\r\n        if (growthEngine && !reduceMotion && window.matchMedia('(pointer:fine)').matches) {\r\n          growthEngine.addEventListener('pointermove', (event) => {\r\n            const rect = growthEngine.getBoundingClientRect();\r\n            const nx = ((event.clientX - rect.left) \/ rect.width - .5) * 2;\r\n            const ny = ((event.clientY - rect.top) \/ rect.height - .5) * 2;\r\n            growthEngine.style.setProperty('--ry', `${nx * 4.2}deg`);\r\n            growthEngine.style.setProperty('--rx', `${ny * -3.6}deg`);\r\n            growthEngine.style.setProperty('--px', `${nx * 5}px`);\r\n            growthEngine.style.setProperty('--py', `${ny * 5}px`);\r\n          });\r\n          growthEngine.addEventListener('pointerleave', () => {\r\n            growthEngine.style.setProperty('--ry', '0deg');\r\n            growthEngine.style.setProperty('--rx', '0deg');\r\n            growthEngine.style.setProperty('--px', '0px');\r\n            growthEngine.style.setProperty('--py', '0px');\r\n          });\r\n        }\r\n\r\n        growthEngine?.addEventListener('mouseenter', stopAuto);\r\n        growthEngine?.addEventListener('mouseleave', startAuto);\r\n        renderService(0, false);\r\n        startAuto();\r\n      }\r\n\r\n\r\n      \/\/ Video-like hero infographic timeline\r\n      const infoFilm = document.getElementById('infoFilm');\r\n      if (infoFilm) {\r\n        const filmScenes = [...infoFilm.querySelectorAll('.film-scene')];\r\n        const filmDots = [...infoFilm.querySelectorAll('.film-dot')];\r\n        const filmCurrent = document.getElementById('filmCurrent');\r\n        const activeServiceLabel = document.getElementById('heroActiveService');\r\n        const filmLabels = [\r\n          'Strategy \u00b7 Web \u00b7 SEO \u00b7 Ads \u00b7 AI',\r\n          'Web \u00b7 SaaS \u00b7 App \u00b7 Automation',\r\n          'SEO \u00b7 Paid Ads \u00b7 Content \u00b7 Branding',\r\n          'E-commerce \u00b7 Hosting \u00b7 Training \u00b7 Scale'\r\n        ];\r\n        const reduceFilmMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n        let filmIndex = 0;\r\n        let filmInterval;\r\n\r\n        const animateCounts = (scene) => {\r\n          scene.querySelectorAll('.countup').forEach(el => {\r\n            const target = Number(el.dataset.count || 0);\r\n            const suffix = el.dataset.suffix || '';\r\n            if (reduceFilmMotion) { el.textContent = target + suffix; return; }\r\n            const started = performance.now();\r\n            const duration = 900;\r\n            const tick = (now) => {\r\n              const p = Math.min(1, (now - started) \/ duration);\r\n              const eased = 1 - Math.pow(1 - p, 3);\r\n              el.textContent = Math.round(target * eased) + suffix;\r\n              if (p < 1 && scene.classList.contains('active')) requestAnimationFrame(tick);\r\n            };\r\n            requestAnimationFrame(tick);\r\n          });\r\n        };\r\n\r\n        const showFilmScene = (next) => {\r\n          next = (next + filmScenes.length) % filmScenes.length;\r\n          filmScenes.forEach((scene, idx) => {\r\n            scene.classList.remove('leaving');\r\n            if (idx === filmIndex && idx !== next) scene.classList.add('leaving');\r\n            scene.classList.toggle('active', idx === next);\r\n          });\r\n          filmDots.forEach((dot, idx) => {\r\n            dot.classList.remove('active');\r\n            void dot.offsetWidth;\r\n            dot.classList.toggle('active', idx === next);\r\n          });\r\n          filmIndex = next;\r\n          if (filmCurrent) filmCurrent.textContent = String(next + 1).padStart(2, '0');\r\n          if (activeServiceLabel) activeServiceLabel.textContent = filmLabels[next];\r\n          animateCounts(filmScenes[next]);\r\n        };\r\n\r\n        const stopFilm = () => { if (filmInterval) clearInterval(filmInterval); };\r\n        const startFilm = () => {\r\n          stopFilm();\r\n          if (!reduceFilmMotion) filmInterval = setInterval(() => showFilmScene(filmIndex + 1), 3500);\r\n        };\r\n        filmDots.forEach((dot, idx) => dot.addEventListener('click', () => { showFilmScene(idx); startFilm(); }));\r\n        infoFilm.addEventListener('mouseenter', stopFilm);\r\n        infoFilm.addEventListener('mouseleave', startFilm);\r\n        showFilmScene(0);\r\n        startFilm();\r\n      }\r\n\r\n      const form = document.getElementById('contactForm');\r\n      const submitBtn = document.getElementById('submitBtn');\r\n      const fields = {\r\n        fullName: document.getElementById('fullName'),\r\n        email: document.getElementById('email'),\r\n        phone: document.getElementById('phone'),\r\n        company: document.getElementById('company'),\r\n        service: document.getElementById('service'),\r\n        message: document.getElementById('message')\r\n      };\r\n\r\n      const valid = (key, field) => {\r\n        const value = field.value.trim();\r\n        if (key === 'email') return \/^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$\/.test(value);\r\n        if (key === 'phone') return value.length >= 7;\r\n        if (key === 'service') return value.length > 0;\r\n        if (key === 'message') return value.length >= 5;\r\n        return value.length >= 2;\r\n      };\r\n\r\n      Object.entries(fields).forEach(([key, field]) => {\r\n        const run = () => field.closest('.field').classList.toggle('error', !valid(key, field));\r\n        field.addEventListener('blur', run);\r\n        field.addEventListener('input', () => { if (field.closest('.field').classList.contains('error')) run(); });\r\n      });\r\n\r\n      form.addEventListener('submit', e => {\r\n        e.preventDefault();\r\n        let ok = true;\r\n        Object.entries(fields).forEach(([key, field]) => {\r\n          const isValid = valid(key, field);\r\n          field.closest('.field').classList.toggle('error', !isValid);\r\n          if (!isValid) ok = false;\r\n        });\r\n        if (!ok) {\r\n          const first = form.querySelector('.field.error input, .field.error select, .field.error textarea');\r\n          if (first) first.focus();\r\n          return;\r\n        }\r\n\r\n        const lines = [\r\n          'Namaste Sandesh \ud83d\ude4f',\r\n          '',\r\n          \"I came across your website and I'm interested in working with you.\",\r\n          '',\r\n          `\ud83d\udc64 Name: ${fields.fullName.value.trim()}`,\r\n          `\u2709\ufe0f Email: ${fields.email.value.trim()}`,\r\n          `\ud83d\udcf1 Phone: ${fields.phone.value.trim()}`,\r\n          `\ud83c\udfe2 Company: ${fields.company.value.trim()}`,\r\n          `\u26a1 Service: ${fields.service.value}`,\r\n          `\ud83d\udcac Message: ${fields.message.value.trim()}`\r\n        ];\r\n        const url = 'https:\/\/wa.me\/9779866275931?text=' + encodeURIComponent(lines.join('\\n'));\r\n        window.open(url, '_blank', 'noopener');\r\n\r\n        const old = submitBtn.textContent;\r\n        submitBtn.textContent = 'WhatsApp opened \u2713';\r\n        setTimeout(() => { submitBtn.textContent = old; }, 2400);\r\n      });\r\n    })();\r\n  <\/script>\r\n\r\n<script>\r\n  (() => {\r\n    const paper = document.getElementById('businessGrowthPaper');\r\n    if (!paper) return;\r\n    const rows = [...paper.querySelectorAll('.growth-paper-row')];\r\n    const counter = document.getElementById('growthStoryCurrent');\r\n    const reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    let index = 0;\r\n    let timer;\r\n    const show = (next) => {\r\n      index = (next + rows.length) % rows.length;\r\n      rows.forEach((row, i) => row.classList.toggle('active', i === index));\r\n      if (counter) counter.textContent = String(index + 1).padStart(2, '0');\r\n    };\r\n    const start = () => {\r\n      if (reduce) return;\r\n      clearInterval(timer);\r\n      timer = setInterval(() => show(index + 1), 4000);\r\n    };\r\n    paper.addEventListener('mouseenter', () => clearInterval(timer));\r\n    paper.addEventListener('mouseleave', start);\r\n    show(0);\r\n    start();\r\n  })();\r\n<\/script>\r\n\r\n\r\n\r\n\r\n\r\n<script>\r\n  (() => {\r\n    const stage = document.getElementById('introStage');\r\n    const serviceWrap = document.getElementById('introServices');\r\n    const services = serviceWrap ? [...serviceWrap.querySelectorAll('.intro-service')] : [];\r\n    const svg = document.getElementById('introSpokes');\r\n    const leftTicker = document.getElementById('heroActiveService');\r\n    if (!stage || !services.length) return;\r\n\r\n    const reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    let active = 0;\r\n    let activeTimer;\r\n\r\n    function layoutCircle() {\r\n      const rect = stage.getBoundingClientRect();\r\n      const mobile = window.innerWidth <= 720;\r\n      const tiny = window.innerWidth <= 430;\r\n      const radiusX = rect.width * (tiny ? .36 : mobile ? .39 : .405);\r\n      const radiusY = rect.height * (tiny ? .33 : mobile ? .35 : .385);\r\n\r\n      if (svg) svg.innerHTML = '';\r\n      services.forEach((item, i) => {\r\n        const label = item.querySelector('span');\r\n        if (label) {\r\n          if (!item.dataset.full) item.dataset.full = label.textContent.trim();\r\n          label.textContent = mobile ? (item.dataset.short || item.dataset.full) : item.dataset.full;\r\n        }\r\n        const angle = (-90 + (360 \/ services.length) * i) * Math.PI \/ 180;\r\n        const x = Math.cos(angle) * radiusX;\r\n        const y = Math.sin(angle) * radiusY;\r\n        item.style.setProperty('--tx', `${x.toFixed(1)}px`);\r\n        item.style.setProperty('--ty', `${y.toFixed(1)}px`);\r\n\r\n        if (svg) {\r\n          const line = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'line');\r\n          const cx = 500, cy = 500;\r\n          const sx = cx + Math.cos(angle) * 115;\r\n          const sy = cy + Math.sin(angle) * 115;\r\n          const ex = cx + Math.cos(angle) * 365;\r\n          const ey = cy + Math.sin(angle) * 365;\r\n          line.setAttribute('x1', sx); line.setAttribute('y1', sy);\r\n          line.setAttribute('x2', ex); line.setAttribute('y2', ey);\r\n          line.setAttribute('class', 'intro-spoke');\r\n          line.style.setProperty('--d', `${.18 + i*.04}s`);\r\n          svg.appendChild(line);\r\n        }\r\n      });\r\n    }\r\n\r\n    function setActive(i) {\r\n      active = (i + services.length) % services.length;\r\n      services.forEach((s, idx) => s.classList.toggle('is-active', idx === active));\r\n      const name = services[active].dataset.serviceName || services[active].textContent.trim();\r\n      if (leftTicker) leftTicker.textContent = name;\r\n    }\r\n\r\n    function start() {\r\n      if (reduce) return;\r\n      clearInterval(activeTimer);\r\n      activeTimer = setInterval(() => setActive(active + 1), 1500);\r\n    }\r\n\r\n    services.forEach((service, i) => {\r\n      service.addEventListener('mouseenter', () => { clearInterval(activeTimer); setActive(i); });\r\n      service.addEventListener('mouseleave', start);\r\n      service.addEventListener('focus', () => { clearInterval(activeTimer); setActive(i); });\r\n      service.addEventListener('blur', start);\r\n    });\r\n\r\n    layoutCircle();\r\n    requestAnimationFrame(layoutCircle);\r\n    window.addEventListener('resize', layoutCircle, { passive: true });\r\n    setActive(0);\r\n    start();\r\n  })();\r\n<\/script>\r\n\r\n\r\n<script>\r\n  (() => {\r\n    const counter = document.querySelector('.hero-count');\r\n    const ticker = document.getElementById('heroActiveService');\r\n    const reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\r\n    const services = [\r\n      'Website & Web Development',\r\n      'SEO & Lead Generation',\r\n      'Digital Marketing & Paid Ads',\r\n      'AI & Automation Solutions'\r\n    ];\r\n\r\n    if (ticker) {\r\n      let serviceIndex = 0;\r\n      const rotateService = () => {\r\n        serviceIndex = (serviceIndex + 1) % services.length;\r\n        ticker.animate(\r\n          [{ opacity: 1, transform: 'translateY(0)' }, { opacity: 0, transform: 'translateY(-5px)' }],\r\n          { duration: 180, easing: 'ease', fill: 'forwards' }\r\n        ).finished.then(() => {\r\n          ticker.textContent = services[serviceIndex];\r\n          ticker.animate(\r\n            [{ opacity: 0, transform: 'translateY(5px)' }, { opacity: 1, transform: 'translateY(0)' }],\r\n            { duration: 260, easing: 'ease', fill: 'forwards' }\r\n          );\r\n        }).catch(() => {});\r\n      };\r\n      if (!reduce) setInterval(rotateService, 2200);\r\n    }\r\n\r\n    if (!counter) return;\r\n    const target = Number(counter.dataset.count || 0);\r\n    const suffix = counter.dataset.suffix || '';\r\n    if (reduce) {\r\n      counter.textContent = `${target}${suffix}`;\r\n      return;\r\n    }\r\n\r\n    let played = false;\r\n    const run = () => {\r\n      if (played) return;\r\n      played = true;\r\n      const start = performance.now();\r\n      const duration = 1500;\r\n      const tick = (now) => {\r\n        const p = Math.min(1, (now - start) \/ duration);\r\n        const eased = 1 - Math.pow(1 - p, 3);\r\n        counter.textContent = `${Math.round(target * eased)}${suffix}`;\r\n        if (p < 1) requestAnimationFrame(tick);\r\n      };\r\n      requestAnimationFrame(tick);\r\n    };\r\n\r\n    if ('IntersectionObserver' in window) {\r\n      const io = new IntersectionObserver((entries) => {\r\n        if (entries.some(entry => entry.isIntersecting)) {\r\n          run();\r\n          io.disconnect();\r\n        }\r\n      }, { threshold: .35 });\r\n      io.observe(counter);\r\n    } else {\r\n      run();\r\n    }\r\n  })();\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Sandesh \u2014 Digital Marketing &#038; Technology Agency Nepal Sandesh. Home About Services \u2304 Services Choose what you need 01Web DevelopmentSites, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-44","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/pages\/44","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=44"}],"version-history":[{"count":4,"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/pages\/44\/revisions"}],"predecessor-version":[{"id":48,"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=\/wp\/v2\/pages\/44\/revisions\/48"}],"wp:attachment":[{"href":"https:\/\/tsandesh.com.np\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=44"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}