/* Theme Name: sandton-dstv-static-site (WPConvert) Theme URI: https://wpconvert.ai Author: WPConvert.ai Author URI: https://wpconvert.ai Description: This theme was automatically generated from your original site design using WPConvert.ai. It preserves your layout, colors, typography, header, footer, and page content, and makes it editable in WordPress. Version: 2.0.0 Requires at least: 6.0 Tested up to: 6.6 Requires PHP: 7.0 License: GPL v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: wpconvert Tags: landing page, responsive, custom header, custom footer */ /* External Stylesheets - @import statements MUST come before any CSS rules */ /* CSS Variables */ :root { } /* Inline Styles */ /* Extracted CSS from page */ import { } /* [EC-TW4-001] unwrapped @layer properties */ @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-border-style: solid; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-duration: initial; --tw-ease: initial; --tw-content: ""; --tw-animation-delay: 0s; --tw-animation-direction: normal; --tw-animation-duration: initial; --tw-animation-fill-mode: none; --tw-animation-iteration-count: 1; --tw-enter-blur: 0; --tw-enter-opacity: 1; --tw-enter-rotate: 0; --tw-enter-scale: 1; --tw-enter-translate-x: 0; --tw-enter-translate-y: 0; --tw-exit-blur: 0; --tw-exit-opacity: 1; --tw-exit-rotate: 0; --tw-exit-scale: 1; --tw-exit-translate-x: 0; --tw-exit-translate-y: 0; } } /* [EC-TW4-001] unwrapped @layer properties */ \n @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {\n *, :before, :after, ::backdrop {\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-translate-z: 0;\n --tw-rotate-x: initial;\n --tw-rotate-y: initial;\n --tw-rotate-z: initial;\n --tw-skew-x: initial;\n --tw-skew-y: initial;\n --tw-space-y-reverse: 0;\n --tw-space-x-reverse: 0;\n --tw-border-style: solid;\n --tw-leading: initial;\n --tw-font-weight: initial;\n --tw-tracking: initial;\n --tw-ordinal: initial;\n --tw-slashed-zero: initial;\n --tw-numeric-figure: initial;\n --tw-numeric-spacing: initial;\n --tw-numeric-fraction: initial;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-color: initial;\n --tw-shadow-alpha: 100%;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-color: initial;\n --tw-inset-shadow-alpha: 100%;\n --tw-ring-color: initial;\n --tw-ring-shadow: 0 0 #0000;\n --tw-inset-ring-color: initial;\n --tw-inset-ring-shadow: 0 0 #0000;\n --tw-ring-inset: initial;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-outline-style: solid;\n --tw-blur: initial;\n --tw-brightness: initial;\n --tw-contrast: initial;\n --tw-grayscale: initial;\n --tw-hue-rotate: initial;\n --tw-invert: initial;\n --tw-opacity: initial;\n --tw-saturate: initial;\n --tw-sepia: initial;\n --tw-drop-shadow: initial;\n --tw-drop-shadow-color: initial;\n --tw-drop-shadow-alpha: 100%;\n --tw-drop-shadow-size: initial;\n --tw-duration: initial;\n --tw-ease: initial;\n --tw-content: \"\";\n --tw-animation-delay: 0s;\n --tw-animation-direction: normal;\n --tw-animation-duration: initial;\n --tw-animation-fill-mode: none;\n --tw-animation-iteration-count: 1;\n --tw-enter-blur: 0;\n --tw-enter-opacity: 1;\n --tw-enter-rotate: 0;\n --tw-enter-scale: 1;\n --tw-enter-translate-x: 0;\n --tw-enter-translate-y: 0;\n --tw-exit-blur: 0;\n --tw-exit-opacity: 1;\n --tw-exit-rotate: 0;\n --tw-exit-scale: 1;\n --tw-exit-translate-x: 0;\n --tw-exit-translate-y: 0;\n }\n }\n /* [EC-TW4-001] unwrapped @layer properties */ @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) { *, :before, :after, ::backdrop { --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-border-style: solid; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-duration: initial; --tw-ease: initial; --tw-content: ""; --tw-animation-delay: 0s; --tw-animation-direction: normal; --tw-animation-duration: initial; --tw-animation-fill-mode: none; --tw-animation-iteration-count: 1; --tw-enter-blur: 0; --tw-enter-opacity: 1; --tw-enter-rotate: 0; --tw-enter-scale: 1; --tw-enter-translate-x: 0; --tw-enter-translate-y: 0; --tw-exit-blur: 0; --tw-exit-opacity: 1; --tw-exit-rotate: 0; --tw-exit-scale: 1; --tw-exit-translate-x: 0; --tw-exit-translate-y: 0; } } /* [EC-TW4-001] unwrapped @layer theme */ :root, :host { --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-black: #000; --spacing: .25rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --text-xs: .75rem; --text-xs--line-height: calc(1 / .75); --text-sm: .875rem; --text-sm--line-height: calc(1.25 / .875); --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75 / 1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75 / 1.25); --text-7xl: 4.5rem; --text-7xl--line-height: 1; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --tracking-tight: -.025em; --tracking-widest: .1em; --leading-relaxed: 1.625; --ease-in-out: cubic-bezier(.4, 0, .2, 1); --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; --aspect-video: 16 / 9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-background: var(--background); --color-foreground: var(--foreground); --color-border: var(--border); } @property --tw-animation-delay { syntax: "*"; inherits: false; initial-value: 0s; } @property --tw-animation-direction { syntax: "*"; inherits: false; initial-value: normal; } @property --tw-animation-duration { syntax: "*"; inherits: false; } @property --tw-animation-fill-mode { syntax: "*"; inherits: false; initial-value: none; } @property --tw-animation-iteration-count { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-enter-blur { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-enter-opacity { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-enter-rotate { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-enter-scale { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-enter-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-enter-translate-y { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-exit-blur { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-exit-opacity { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-exit-rotate { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-exit-scale { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-exit-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-exit-translate-y { syntax: "*"; inherits: false; initial-value: 0; } :root { --radius: .625rem; --background: oklch(100% 0 0); --foreground: oklch(12.9% .042 264.695); --card: oklch(100% 0 0); --card-foreground: oklch(12.9% .042 264.695); --popover: oklch(100% 0 0); --popover-foreground: oklch(12.9% .042 264.695); --primary: oklch(20.8% .042 265.755); --primary-foreground: oklch(98.4% .003 247.858); --secondary: oklch(96.8% .007 247.896); --secondary-foreground: oklch(20.8% .042 265.755); --muted: oklch(96.8% .007 247.896); --muted-foreground: oklch(55.4% .046 257.417); --accent: oklch(96.8% .007 247.896); --accent-foreground: oklch(20.8% .042 265.755); --destructive: oklch(57.7% .245 27.325); --destructive-foreground: oklch(98.4% .003 247.858); --border: oklch(92.9% .013 255.508); --input: oklch(92.9% .013 255.508); --ring: oklch(70.4% .04 256.788); --chart-1: oklch(64.6% .222 41.116); --chart-2: oklch(60% .118 184.704); --chart-3: oklch(39.8% .07 227.392); --chart-4: oklch(82.8% .189 84.429); --chart-5: oklch(76.9% .188 70.08); --sidebar: oklch(98.4% .003 247.858); --sidebar-foreground: oklch(12.9% .042 264.695); --sidebar-primary: oklch(20.8% .042 265.755); --sidebar-primary-foreground: oklch(98.4% .003 247.858); --sidebar-accent: oklch(96.8% .007 247.896); --sidebar-accent-foreground: oklch(20.8% .042 265.755); --sidebar-border: oklch(92.9% .013 255.508); --sidebar-ring: oklch(70.4% .04 256.788); } .dark { --background: oklch(12.9% .042 264.695); --foreground: oklch(98.4% .003 247.858); --card: oklch(20.8% .042 265.755); --card-foreground: oklch(98.4% .003 247.858); --popover: oklch(20.8% .042 265.755); --popover-foreground: oklch(98.4% .003 247.858); --primary: oklch(92.9% .013 255.508); --primary-foreground: oklch(20.8% .042 265.755); --secondary: oklch(27.9% .041 260.031); --secondary-foreground: oklch(98.4% .003 247.858); --muted: oklch(27.9% .041 260.031); --muted-foreground: oklch(70.4% .04 256.788); --accent: oklch(27.9% .041 260.031); --accent-foreground: oklch(98.4% .003 247.858); --destructive: oklch(70.4% .191 22.216); --destructive-foreground: oklch(98.4% .003 247.858); --border: oklch(100% 0 0 / .1); --input: oklch(100% 0 0 / .15); --ring: oklch(55.1% .027 264.364); --chart-1: oklch(48.8% .243 264.376); --chart-2: oklch(69.6% .17 162.48); --chart-3: oklch(76.9% .188 70.08); --chart-4: oklch(62.7% .265 303.9); --chart-5: oklch(64.5% .246 16.439); --sidebar: oklch(20.8% .042 265.755); --sidebar-foreground: oklch(98.4% .003 247.858); --sidebar-primary: oklch(48.8% .243 264.376); --sidebar-primary-foreground: oklch(98.4% .003 247.858); --sidebar-accent: oklch(27.9% .041 260.031); --sidebar-accent-foreground: oklch(98.4% .003 247.858); --sidebar-border: oklch(100% 0 0 / .1); --sidebar-ring: oklch(55.1% .027 264.364); } :root { --s-bg: oklch(97.4% .006 240); --s-surface: oklch(100% 0 0); --s-ink: oklch(22% .03 245); --s-muted: oklch(50% .03 245); --s-line: oklch(90% .013 240); --s-brand: oklch(33% .08 252); --s-accent: oklch(80% .17 75); --s-accent-ink: oklch(18% .03 80); --s-link: oklch(50% .17 255); --s-on-brand: oklch(100% 0 0); --s-hero: radial-gradient(ellipse at 50% 30%, oklch(42% .1 252), oklch(25% .07 252) 70%); } .site { background: var(--s-bg); color: var(--s-ink); min-height: 100vh; font: 400 17px / 1.55 Outfit, system-ui, sans-serif; } .banner-strip { --s-banner: #0164bc; background: var(--s-banner); align-items: center; gap: 12px; padding: 10px 16px; display: flex; } .banner-dish { flex: 0 0 auto; width: auto; height: 56px; display: block; } .banner-name { color: rgb(255, 255, 255); white-space: nowrap; letter-spacing: 0.2px; font-size: clamp(16px, 2.6vw, 27px); font-weight: 800; } .banner-name b { font-style: italic; font-weight: 900; } .banner-sep { color: rgb(255, 255, 255); opacity: 0.7; font-size: clamp(20px, 2.4vw, 32px); font-weight: 300; } .banner-tel { color: var(--s-banner); white-space: nowrap; background: rgb(255, 255, 255); border-radius: 999px; align-items: center; gap: 9px; margin-left: auto; padding: 9px 20px 9px 12px; font-size: clamp(15px, 2vw, 25px); font-weight: 800; line-height: 1; text-decoration: none; display: flex; } .banner-tel svg { flex: 0 0 auto; } .banner-tel:hover { background: var(--s-accent); color: var(--s-accent-ink); } @media (width <= 640px) { .banner-strip { gap: 10px; padding: 8px 12px; } .banner-name, .banner-sep { display: none; } .banner-dish { height: 44px; } .banner-tel { margin: 0px auto; padding: 8px 18px 8px 11px; font-size: 16px; } } .site a { color: var(--s-link); } .site .wrap { max-width: 1040px; margin: 0px auto; padding: 0px 20px; } .site-header { justify-content: space-between; align-items: center; gap: 12px; padding: 14px 0px; display: flex; position: relative; } .site .brand { color: var(--s-brand); font-size: 22px; font-weight: 800; line-height: 1.1; text-decoration: none; } .site .brand small { color: var(--s-muted); font-size: 13px; font-weight: 400; display: block; } .site .call { background: var(--s-accent); color: var(--s-accent-ink); white-space: nowrap; border-radius: 999px; padding: 10px 16px; font-weight: 800; text-decoration: none; } .site .header-actions { align-items: center; gap: 10px; display: flex; } .site .menu-btn { font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; background: var(--s-brand); color: var(--s-on-brand); cursor: pointer; white-space: nowrap; border: 0px; border-radius: 999px; padding: 10px 16px; font-weight: 800; } .site .site-nav { z-index: 30; background: var(--s-surface); border: 1px solid var(--s-line); border-radius: 12px; gap: 2px; min-width: 250px; padding: 8px; display: grid; position: absolute; top: calc(100% + 8px); right: 0px; box-shadow: oklch(0.22 0.03 245 / 0.18) 0px 12px 32px; } .site .site-nav a, .site .nav-group-toggle { text-align: left; width: 100%; color: var(--s-ink); font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; cursor: pointer; background: none; border: 0px; border-radius: 8px; padding: 10px 12px; font-weight: 600; text-decoration: none; display: block; } .site .site-nav a:hover, .site .nav-group-toggle:hover { background: var(--s-bg); } .site .nav-sub { border-left: 2px solid var(--s-line); gap: 2px; margin: 0px 0px 2px 6px; padding: 0px 0px 0px 12px; display: grid; } .site .top { gap: 28px; padding: 18px 0px 36px; display: grid; } .site h1 { letter-spacing: -0.02em; color: var(--s-brand); margin: 0px 0px 14px; font-size: clamp(32px, 6.4vw, 56px); font-weight: 800; line-height: 1.04; } .site .crumb { color: var(--s-muted); margin: 0px 0px 8px; font-size: 14px; } .site .lead { color: var(--s-muted); max-width: 46ch; margin: 0px 0px 18px; } .site .phone { color: var(--s-ink); font-size: clamp(28px, 6vw, 40px); font-weight: 800; text-decoration: none; display: inline-block; } .site .phone span { color: var(--s-muted); font-size: 14px; font-weight: 400; display: block; } .lead-form { background: var(--s-surface); border: 2px solid var(--s-brand); border-radius: 14px; gap: 12px; padding: 20px; display: grid; } .lead-form h2 { margin: 0px; font-size: 22px; font-weight: 800; } .lead-form label { gap: 4px; font-size: 14px; font-weight: 600; display: grid; } .lead-form textarea { resize: vertical; } .lead-form input, .lead-form select, .lead-form textarea { font: inherit; color: var(--s-ink); background: var(--s-bg); border: 1px solid var(--s-line); border-radius: 8px; width: 100%; min-height: 46px; padding: 12px; } .site :focus-visible { outline: 3px solid var(--s-accent); outline-offset: 2px; } .lead-form .row { gap: 12px; display: grid; } .lead-form button { font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; background: var(--s-accent); color: var(--s-accent-ink); cursor: pointer; border: 0px; border-radius: 10px; padding: 15px; font-size: 18px; font-weight: 800; } .site .note { color: var(--s-muted); margin: 0px; font-size: 13px; } .site .ok { color: var(--s-brand); margin: 0px; font-weight: 600; } .site .hero { background: var(--s-hero); text-align: center; padding: 48px 20px 150px; position: relative; overflow: hidden; } .site .hero .logo { width: min(440px, 78%); height: auto; margin: 0px auto; display: block; } .site .hero .cap { text-align: left; color: var(--s-on-brand); padding: 30px 0px 26px; position: absolute; bottom: 0px; left: 0px; right: 0px; } .site .hero .cap p { max-width: 30ch; margin: 0px; font-size: clamp(20px, 3.6vw, 30px); font-weight: 600; line-height: 1.2; } .site section { padding: 44px 0px; } .site h2.s { color: var(--s-brand); margin: 0px 0px 10px; font-size: clamp(26px, 4.4vw, 36px); font-weight: 800; line-height: 1.1; } .site .intro { max-width: 62ch; color: var(--s-muted); margin: 0px 0px 22px; } .site .svc { border-top: 1px solid var(--s-line); } .site .photos { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-top: 24px; display: grid; } .site .photos figure { margin: 0px; } .site .photos img { object-fit: cover; border-radius: 6px; width: 100%; height: 260px; display: block; } .site .photos figcaption { opacity: 0.8; margin-top: 6px; font-size: 14px; } .site .svc div, .site .area { border-bottom: 1px solid var(--s-line); gap: 4px; padding: 18px 0px; display: grid; } .site .svc h3, .site .area h3 { margin: 0px; font-size: 20px; font-weight: 700; } .site .area h3 a { color: var(--s-brand); } .site .svc p, .site .area p { color: var(--s-muted); max-width: 60ch; margin: 0px; } .site .chips { flex-wrap: wrap; gap: 8px; margin: 0px 0px 14px; padding: 0px; list-style: none; display: flex; } .site .chips.collapsed { max-height: 84px; overflow: hidden; mask-image: linear-gradient(rgb(0, 0, 0) 55%, rgba(0, 0, 0, 0) 100%); } .site .more-btn { border: 1px solid var(--s-brand); color: var(--s-brand); font-style: inherit; font-variant: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; cursor: pointer; background: none; border-radius: 999px; margin: 0px 0px 14px; padding: 6px 16px; font-size: 14px; font-weight: 600; display: inline-block; } .site .more-btn:hover { background: var(--s-brand); color: rgb(255, 255, 255); } .site .chips a { border: 1px solid var(--s-brand); color: var(--s-brand); border-radius: 999px; padding: 6px 14px; font-size: 15px; font-weight: 600; text-decoration: none; display: block; } .site .why { gap: 18px; display: grid; } .site .why h3 { margin: 0px 0px 2px; font-size: 18px; font-weight: 700; } .site .why p { color: var(--s-muted); margin: 0px; } .site details { border-bottom: 1px solid var(--s-line); padding: 14px 0px; } .site summary { cursor: pointer; font-size: 18px; font-weight: 600; } .site details p { color: var(--s-muted); max-width: 62ch; margin: 10px 0px 0px; } .site .cta { background: var(--s-brand); color: var(--s-on-brand); border-radius: 16px; justify-items: start; gap: 12px; padding: 30px 24px; display: grid; } .site .cta h2 { margin: 0px; font-size: clamp(24px, 4vw, 34px); font-weight: 800; line-height: 1.1; } .site .cta p { max-width: 52ch; margin: 0px; } .site footer { color: var(--s-muted); padding: 26px 0px 40px; font-size: 14px; } .site .socials { flex-wrap: wrap; gap: 10px; margin: 14px 0px 4px; padding: 0px; list-style: none; display: flex; } .site .socials a { border: 1px solid var(--s-line); width: 38px; height: 38px; color: var(--s-brand); background: var(--s-surface); border-radius: 50%; justify-content: center; align-items: center; transition: background 0.15s, color 0.15s, border-color 0.15s; display: inline-flex; } .site .socials a:hover { background: var(--s-brand); color: rgb(255, 255, 255); border-color: var(--s-brand); } .site .dstv-content { border-top: 1px solid var(--s-line); gap: 12px; margin-top: 8px; padding: 18px 0px; display: grid; } .site .dstv-content h3 { margin: 0px; font-size: 22px; font-weight: 700; } .site .dstv-content p { color: var(--s-muted); max-width: 70ch; margin: 0px; line-height: 1.65; } .site .dstv-content .reveal-links { color: var(--s-muted); } .site .reveal-links { margin: 10px 0px 0px; } .site .reveal-links a { color: rgba(0, 0, 0, 0); text-decoration: none; } .site .reveal-links ::selection { color: rgb(28, 28, 28); background: rgb(255, 233, 94); } @media (width >= 820px) { .site .top { grid-template-columns: 1.1fr 0.9fr; align-items: start; padding-top: 34px; } .lead-form .row { grid-template-columns: 1fr 1fr; } .site .svc div, .site .area { grid-template-columns: 320px 1fr; gap: 24px; } .site .why { grid-template-columns: repeat(3, 1fr); } } .site .trustpilot { text-align: center; border: 1px solid var(--s-line, oklch(90% 0 0)); border-radius: 14px; margin: 24px 0px; padding: 24px 16px; } .site .tp-stars { color: oklch(0.65 0.17 155); letter-spacing: 4px; margin: 0px; font-size: 28px; } .site .tp-btn { color: oklch(1 0 0); background: oklch(0.65 0.17 155); border-radius: 999px; margin-top: 8px; padding: 10px 18px; font-weight: 600; text-decoration: none; display: inline-block; } .site .mini-cta { background: var(--s-brand); color: var(--s-on-brand); border-radius: 14px; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 16px; margin: 28px 0px; padding: 16px 18px; display: flex; } .site .mini-cta p { margin: 0px; font-weight: 700; } .site .mini-cta div { flex-wrap: wrap; gap: 8px; display: flex; } .site .mini-cta a { background: var(--s-accent); color: var(--s-brand); border-radius: 999px; padding: 10px 16px; font-weight: 700; text-decoration: none; } .site .mini-cta a.alt { color: var(--s-on-brand); background: none; border: 1px solid; } .lead-form .ai-helper { justify-items: start; gap: 8px; display: grid; } .lead-form .ai-tip { white-space: pre-line; background: var(--s-bg); border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-left: 3px solid var(--s-accent); border-radius: 8px; margin: 0px; padding: 10px 12px; font-size: 0.92rem; line-height: 1.5; } .service-map { background: var(--muted, #eef2f7); z-index: 0; border-radius: 12px; width: 100%; height: 460px; margin: 1rem 0px; } .map-info { border: 1px solid; border-radius: 12px; gap: 0.25rem; margin-top: 1rem; padding: 1rem; display: grid; } .map-info p { margin: 0px; } .base-pin { color: rgb(255, 212, 0); text-align: center; background: rgb(1, 100, 188); border: 2px solid rgb(255, 255, 255); border-radius: 50%; font-size: 18px; line-height: 28px; } .site details.menu { position: relative; } .site details.menu > summary, .site .site-nav summary, .site details.more > summary { list-style: none; } .site details.menu > summary::-webkit-details-marker { display: none; } .site .site-nav summary::-webkit-details-marker { display: none; } .site details.more > summary::-webkit-details-marker { display: none; } .site details.more[open] > summary { display: none; } .site .site-header { position: relative; } @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-rotate-x { syntax: "*"; inherits: false; } @property --tw-rotate-y { syntax: "*"; inherits: false; } @property --tw-rotate-z { syntax: "*"; inherits: false; } @property --tw-skew-x { syntax: "*"; inherits: false; } @property --tw-skew-y { syntax: "*"; inherits: false; } @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-ordinal { syntax: "*"; inherits: false; } @property --tw-slashed-zero { syntax: "*"; inherits: false; } @property --tw-numeric-figure { syntax: "*"; inherits: false; } @property --tw-numeric-spacing { syntax: "*"; inherits: false; } @property --tw-numeric-fraction { syntax: "*"; inherits: false; } @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-shadow-color { syntax: "*"; inherits: false; } @property --tw-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-shadow-color { syntax: "*"; inherits: false; } @property --tw-inset-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-ring-color { syntax: "*"; inherits: false; } @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-ring-color { syntax: "*"; inherits: false; } @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-ring-inset { syntax: "*"; inherits: false; } @property --tw-ring-offset-width { syntax: ""; inherits: false; initial-value: 0; } @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; } @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-blur { syntax: "*"; inherits: false; } @property --tw-brightness { syntax: "*"; inherits: false; } @property --tw-contrast { syntax: "*"; inherits: false; } @property --tw-grayscale { syntax: "*"; inherits: false; } @property --tw-hue-rotate { syntax: "*"; inherits: false; } @property --tw-invert { syntax: "*"; inherits: false; } @property --tw-opacity { syntax: "*"; inherits: false; } @property --tw-saturate { syntax: "*"; inherits: false; } @property --tw-sepia { syntax: "*"; inherits: false; } @property --tw-drop-shadow { syntax: "*"; inherits: false; } @property --tw-drop-shadow-color { syntax: "*"; inherits: false; } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-drop-shadow-size { syntax: "*"; inherits: false; } @property --tw-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @property --tw-content { syntax: "*"; inherits: false; initial-value: ""; } @keyframes pulse { 50% { opacity: 0.5; } } @keyframes enter { 0% { opacity: var(--tw-enter-opacity, 1); transform: translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0)scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0)); filter: blur(var(--tw-enter-blur, 0)); } } @keyframes exit { 100% { opacity: var(--tw-exit-opacity, 1); transform: translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0)scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0)); filter: blur(var(--tw-exit-blur, 0)); } } @keyframes accordion-down { 0% { height: 0px; } 100% { height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto))))); } } @keyframes accordion-up { 0% { height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto))))); } 100% { height: 0px; } } @keyframes caret-blink { 0%, 70%, 100% { opacity: 1; } 20%, 50% { opacity: 0; } } /* From assets/0a7e9e0cc1.css */ /* From assets/0c034b0586.css */ /* From assets/19cde08953.css */ /* From assets/2b3093e697.css */ /* From assets/648ef29938.css */ /* From assets/0899b3d997.css */ import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/src/styles.css");import { updateStyle as __vite__updateStyle, removeStyle as __vite__removeStyle } from "/@vite/client" const __vite__id = "/dev-server/src/styles.css" const __vite__css = "/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */\n/* [EC-TW4-001] unwrapped @layer theme */ \n :root, :host {\n --font-sans: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\",\n \"Noto Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\",\n \"Segoe UI Symbol\", \"Noto Color Emoji\";\n --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n \"Courier New\", monospace;\n --color-black: #000;\n --spacing: .25rem;\n --container-sm: 24rem;\n --container-md: 28rem;\n --container-lg: 32rem;\n --text-xs: .75rem;\n --text-xs--line-height: calc(1 / .75);\n --text-sm: .875rem;\n --text-sm--line-height: calc(1.25 / .875);\n --text-base: 1rem;\n --text-base--line-height: calc(1.5 / 1);\n --text-lg: 1.125rem;\n --text-lg--line-height: calc(1.75 / 1.125);\n --text-xl: 1.25rem;\n --text-xl--line-height: calc(1.75 / 1.25);\n --text-7xl: 4.5rem;\n --text-7xl--line-height: 1;\n --font-weight-normal: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --tracking-tight: -.025em;\n --tracking-widest: .1em;\n --leading-relaxed: 1.625;\n --ease-in-out: cubic-bezier(.4, 0, .2, 1);\n --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;\n --aspect-video: 16 / 9;\n --default-transition-duration: .15s;\n --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);\n --default-font-family: var(--font-sans);\n --default-mono-font-family: var(--font-mono);\n --color-background: var(--background);\n --color-foreground: var(--foreground);\n --color-border: var(--border);\n }\n \n\n/* [EC-TW4-001] unwrapped @layer theme */ :root, :host { --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-black: #000; --spacing: .25rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --text-xs: .75rem; --text-xs--line-height: calc(1 / .75); --text-sm: .875rem; --text-sm--line-height: calc(1.25 / .875); --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75 / 1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75 / 1.25); --text-7xl: 4.5rem; --text-7xl--line-height: 1; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --tracking-tight: -.025em; --tracking-widest: .1em; --leading-relaxed: 1.625; --ease-in-out: cubic-bezier(.4, 0, .2, 1); --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; --aspect-video: 16 / 9; --default-transition-duration: .15s; --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-background: var(--background); --color-foreground: var(--foreground); --color-border: var(--border); } \n\n/* [EC-TW4-001] unwrapped @layer base */ *, ::after, ::before, ::backdrop { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } ::file-selector-button { box-sizing: border-box; border: 0px solid; margin: 0px; padding: 0px; } html, :host { text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0px; color: inherit; border-top-width: 1px; } abbr:where([title]) { text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { vertical-align: baseline; font-size: 75%; line-height: 0; position: relative; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0px; border-color: inherit; border-collapse: collapse; } progress { vertical-align: baseline; } summary { display: list-item; } ol, ul, menu { list-style: none; } img, svg, video, canvas, audio, iframe, embed, object { vertical-align: middle; display: block; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: rgba(0, 0, 0, 0); border-radius: 0px; } :where(select:is([multiple], [size])) optgroup { font-weight: bolder; } :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentcolor; } @supports (color: color-mix(in lab, red, red)) { ::placeholder { color: color-mix(currentcolor, transparent); } } } textarea { resize: vertical; } ::-webkit-search-decoration { appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0px; } ::-webkit-datetime-edit { padding-block: 0px; } ::-webkit-datetime-edit-year-field { padding-block: 0px; } ::-webkit-datetime-edit-month-field { padding-block: 0px; } ::-webkit-datetime-edit-day-field { padding-block: 0px; } ::-webkit-datetime-edit-hour-field { padding-block: 0px; } ::-webkit-datetime-edit-minute-field { padding-block: 0px; } ::-webkit-datetime-edit-second-field { padding-block: 0px; } ::-webkit-datetime-edit-millisecond-field { padding-block: 0px; } ::-webkit-datetime-edit-meridiem-field { padding-block: 0px; } ::-webkit-calendar-picker-indicator { line-height: 1; } button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; } ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button { height: auto; } ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } * { border-color: var(--color-border); } body { background-color: var(--color-background); color: var(--color-foreground); } \n\n\n\n/* [EC-TW4-001] unwrapped @layer base */ \n *, :after, :before, ::backdrop {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n ::file-selector-button {\n box-sizing: border-box;\n border: 0 solid;\n margin: 0;\n padding: 0;\n }\n\n html, :host {\n -webkit-text-size-adjust: 100%;\n tab-size: 4;\n line-height: 1.5;\n font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\");\n font-feature-settings: var(--default-font-feature-settings, normal);\n font-variation-settings: var(--default-font-variation-settings, normal);\n -webkit-tap-highlight-color: transparent;\n }\n\n hr {\n height: 0;\n color: inherit;\n border-top-width: 1px;\n }\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n h1, h2, h3, h4, h5, h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n a {\n color: inherit;\n -webkit-text-decoration: inherit;\n -webkit-text-decoration: inherit;\n text-decoration: inherit;\n }\n\n b, strong {\n font-weight: bolder;\n }\n\n code, kbd, samp, pre {\n font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n font-feature-settings: var(--default-mono-font-feature-settings, normal);\n font-variation-settings: var(--default-mono-font-variation-settings, normal);\n font-size: 1em;\n }\n\n small {\n font-size: 80%;\n }\n\n sub, sup {\n vertical-align: baseline;\n font-size: 75%;\n line-height: 0;\n position: relative;\n }\n\n sub {\n bottom: -.25em;\n }\n\n sup {\n top: -.5em;\n }\n\n table {\n text-indent: 0;\n border-color: inherit;\n border-collapse: collapse;\n }\n\n :-moz-focusring:where(:not(iframe)) {\n outline: auto;\n }\n\n progress {\n vertical-align: baseline;\n }\n\n summary {\n display: list-item;\n }\n\n ol, ul, menu {\n list-style: none;\n }\n\n img, svg, video, canvas, audio, iframe, embed, object {\n vertical-align: middle;\n display: block;\n }\n\n img, video {\n max-width: 100%;\n height: auto;\n }\n\n button, input, select, optgroup, textarea {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n ::file-selector-button {\n font: inherit;\n font-feature-settings: inherit;\n font-variation-settings: inherit;\n letter-spacing: inherit;\n color: inherit;\n opacity: 1;\n background-color: #0000;\n border-radius: 0;\n }\n\n :where(select:is([multiple], [size])) optgroup {\n font-weight: bolder;\n }\n\n :where(select:is([multiple], [size])) optgroup option {\n padding-inline-start: 20px;\n }\n\n ::file-selector-button {\n margin-inline-end: 4px;\n }\n\n ::placeholder {\n opacity: 1;\n }\n\n @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {\n ::placeholder {\n color: currentColor;\n }\n\n @supports (color: color-mix(in lab, red, red)) {\n ::placeholder {\n color: color-mix(in oklab, currentcolor 50%, transparent);\n }\n }\n }\n\n textarea {\n resize: vertical;\n }\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n ::-webkit-date-and-time-value {\n min-height: 1lh;\n text-align: inherit;\n }\n\n ::-webkit-datetime-edit {\n display: inline-flex;\n }\n\n ::-webkit-datetime-edit-fields-wrapper {\n padding: 0;\n }\n\n ::-webkit-datetime-edit {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-year-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-month-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-day-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-hour-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-minute-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-second-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-millisecond-field {\n padding-block: 0;\n }\n\n ::-webkit-datetime-edit-meridiem-field {\n padding-block: 0;\n }\n\n ::-webkit-calendar-picker-indicator {\n line-height: 1;\n }\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]) {\n appearance: button;\n }\n\n ::file-selector-button {\n appearance: button;\n }\n\n ::-webkit-inner-spin-button {\n height: auto;\n }\n\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n [hidden]:where(:not([hidden=\"until-found\"])) {\n display: none !important;\n }\n\n * {\n border-color: var(--color-border);\n }\n\n body {\n background-color: var(--color-background);\n color: var(--color-foreground);\n }\n \n\n@property --tw-animation-delay {\n syntax: \"*\";\n inherits: false;\n initial-value: 0s;\n}\n\n@property --tw-animation-direction {\n syntax: \"*\";\n inherits: false;\n initial-value: normal;\n}\n\n@property --tw-animation-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-animation-fill-mode {\n syntax: \"*\";\n inherits: false;\n initial-value: none;\n}\n\n@property --tw-animation-iteration-count {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-enter-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-enter-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-blur {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-opacity {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-exit-rotate {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-scale {\n syntax: \"*\";\n inherits: false;\n initial-value: 1;\n}\n\n@property --tw-exit-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-exit-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n:root {\n --radius: .625rem;\n --background: oklch(100% 0 0);\n --foreground: oklch(12.9% .042 264.695);\n --card: oklch(100% 0 0);\n --card-foreground: oklch(12.9% .042 264.695);\n --popover: oklch(100% 0 0);\n --popover-foreground: oklch(12.9% .042 264.695);\n --primary: oklch(20.8% .042 265.755);\n --primary-foreground: oklch(98.4% .003 247.858);\n --secondary: oklch(96.8% .007 247.896);\n --secondary-foreground: oklch(20.8% .042 265.755);\n --muted: oklch(96.8% .007 247.896);\n --muted-foreground: oklch(55.4% .046 257.417);\n --accent: oklch(96.8% .007 247.896);\n --accent-foreground: oklch(20.8% .042 265.755);\n --destructive: oklch(57.7% .245 27.325);\n --destructive-foreground: oklch(98.4% .003 247.858);\n --border: oklch(92.9% .013 255.508);\n --input: oklch(92.9% .013 255.508);\n --ring: oklch(70.4% .04 256.788);\n --chart-1: oklch(64.6% .222 41.116);\n --chart-2: oklch(60% .118 184.704);\n --chart-3: oklch(39.8% .07 227.392);\n --chart-4: oklch(82.8% .189 84.429);\n --chart-5: oklch(76.9% .188 70.08);\n --sidebar: oklch(98.4% .003 247.858);\n --sidebar-foreground: oklch(12.9% .042 264.695);\n --sidebar-primary: oklch(20.8% .042 265.755);\n --sidebar-primary-foreground: oklch(98.4% .003 247.858);\n --sidebar-accent: oklch(96.8% .007 247.896);\n --sidebar-accent-foreground: oklch(20.8% .042 265.755);\n --sidebar-border: oklch(92.9% .013 255.508);\n --sidebar-ring: oklch(70.4% .04 256.788);\n}\n\n.dark {\n --background: oklch(12.9% .042 264.695);\n --foreground: oklch(98.4% .003 247.858);\n --card: oklch(20.8% .042 265.755);\n --card-foreground: oklch(98.4% .003 247.858);\n --popover: oklch(20.8% .042 265.755);\n --popover-foreground: oklch(98.4% .003 247.858);\n --primary: oklch(92.9% .013 255.508);\n --primary-foreground: oklch(20.8% .042 265.755);\n --secondary: oklch(27.9% .041 260.031);\n --secondary-foreground: oklch(98.4% .003 247.858);\n --muted: oklch(27.9% .041 260.031);\n --muted-foreground: oklch(70.4% .04 256.788);\n --accent: oklch(27.9% .041 260.031);\n --accent-foreground: oklch(98.4% .003 247.858);\n --destructive: oklch(70.4% .191 22.216);\n --destructive-foreground: oklch(98.4% .003 247.858);\n --border: oklch(100% 0 0 / .1);\n --input: oklch(100% 0 0 / .15);\n --ring: oklch(55.1% .027 264.364);\n --chart-1: oklch(48.8% .243 264.376);\n --chart-2: oklch(69.6% .17 162.48);\n --chart-3: oklch(76.9% .188 70.08);\n --chart-4: oklch(62.7% .265 303.9);\n --chart-5: oklch(64.5% .246 16.439);\n --sidebar: oklch(20.8% .042 265.755);\n --sidebar-foreground: oklch(98.4% .003 247.858);\n --sidebar-primary: oklch(48.8% .243 264.376);\n --sidebar-primary-foreground: oklch(98.4% .003 247.858);\n --sidebar-accent: oklch(27.9% .041 260.031);\n --sidebar-accent-foreground: oklch(98.4% .003 247.858);\n --sidebar-border: oklch(100% 0 0 / .1);\n --sidebar-ring: oklch(55.1% .027 264.364);\n}\n\n:root {\n --s-bg: oklch(97.4% .006 240);\n --s-surface: oklch(100% 0 0);\n --s-ink: oklch(22% .03 245);\n --s-muted: oklch(50% .03 245);\n --s-line: oklch(90% .013 240);\n --s-brand: oklch(33% .08 252);\n --s-accent: oklch(80% .17 75);\n --s-accent-ink: oklch(18% .03 80);\n --s-link: oklch(50% .17 255);\n --s-on-brand: oklch(100% 0 0);\n --s-hero: radial-gradient(ellipse at 50% 30%, oklch(42% .1 252), oklch(25% .07 252) 70%);\n}\n\n.site {\n background: var(--s-bg);\n color: var(--s-ink);\n min-height: 100vh;\n font: 400 17px / 1.55 Outfit, system-ui, sans-serif;\n}\n\n.banner-strip {\n --s-banner: #0164bc;\n background: var(--s-banner);\n align-items: center;\n gap: 12px;\n padding: 10px 16px;\n display: flex;\n}\n\n.banner-dish {\n flex: none;\n width: auto;\n height: 56px;\n display: block;\n}\n\n.banner-name {\n color: #fff;\n white-space: nowrap;\n letter-spacing: .2px;\n font-size: clamp(16px, 2.6vw, 27px);\n font-weight: 800;\n}\n\n.banner-name b {\n font-style: italic;\n font-weight: 900;\n}\n\n.banner-sep {\n color: #fff;\n opacity: .7;\n font-size: clamp(20px, 2.4vw, 32px);\n font-weight: 300;\n}\n\n.banner-tel {\n color: var(--s-banner);\n white-space: nowrap;\n background: #fff;\n border-radius: 999px;\n align-items: center;\n gap: 9px;\n margin-left: auto;\n padding: 9px 20px 9px 12px;\n font-size: clamp(15px, 2vw, 25px);\n font-weight: 800;\n line-height: 1;\n text-decoration: none;\n display: flex;\n}\n\n.banner-tel svg {\n flex: none;\n}\n\n.banner-tel:hover {\n background: var(--s-accent);\n color: var(--s-accent-ink);\n}\n\n@media (width <= 640px) {\n .banner-strip {\n gap: 10px;\n padding: 8px 12px;\n }\n\n .banner-name, .banner-sep {\n display: none;\n }\n\n .banner-dish {\n height: 44px;\n }\n\n .banner-tel {\n margin: 0 auto;\n padding: 8px 18px 8px 11px;\n font-size: 16px;\n }\n}\n\n.site a {\n color: var(--s-link);\n}\n\n.site .wrap {\n max-width: 1040px;\n margin: 0 auto;\n padding: 0 20px;\n}\n\n.site-header {\n justify-content: space-between;\n align-items: center;\n gap: 12px;\n padding: 14px 0;\n display: flex;\n position: relative;\n}\n\n.site .brand {\n color: var(--s-brand);\n font-size: 22px;\n font-weight: 800;\n line-height: 1.1;\n text-decoration: none;\n}\n\n.site .brand small {\n color: var(--s-muted);\n font-size: 13px;\n font-weight: 400;\n display: block;\n}\n\n.site .call {\n background: var(--s-accent);\n color: var(--s-accent-ink);\n white-space: nowrap;\n border-radius: 999px;\n padding: 10px 16px;\n font-weight: 800;\n text-decoration: none;\n}\n\n.site .header-actions {\n align-items: center;\n gap: 10px;\n display: flex;\n}\n\n.site .menu-btn {\n font: inherit;\n background: var(--s-brand);\n color: var(--s-on-brand);\n cursor: pointer;\n white-space: nowrap;\n border: 0;\n border-radius: 999px;\n padding: 10px 16px;\n font-weight: 800;\n}\n\n.site .site-nav {\n z-index: 30;\n background: var(--s-surface);\n border: 1px solid var(--s-line);\n border-radius: 12px;\n gap: 2px;\n min-width: 250px;\n padding: 8px;\n display: grid;\n position: absolute;\n top: calc(100% + 8px);\n right: 0;\n box-shadow: 0 12px 32px oklch(22% .03 245 / .18);\n}\n\n.site .site-nav a, .site .nav-group-toggle {\n text-align: left;\n width: 100%;\n color: var(--s-ink);\n font: inherit;\n cursor: pointer;\n background: none;\n border: 0;\n border-radius: 8px;\n padding: 10px 12px;\n font-weight: 600;\n text-decoration: none;\n display: block;\n}\n\n.site .site-nav a:hover, .site .nav-group-toggle:hover {\n background: var(--s-bg);\n}\n\n.site .nav-sub {\n border-left: 2px solid var(--s-line);\n gap: 2px;\n margin: 0 0 2px 6px;\n padding: 0 0 0 12px;\n display: grid;\n}\n\n.site .top {\n gap: 28px;\n padding: 18px 0 36px;\n display: grid;\n}\n\n.site h1 {\n letter-spacing: -.02em;\n color: var(--s-brand);\n margin: 0 0 14px;\n font-size: clamp(32px, 6.4vw, 56px);\n font-weight: 800;\n line-height: 1.04;\n}\n\n.site .crumb {\n color: var(--s-muted);\n margin: 0 0 8px;\n font-size: 14px;\n}\n\n.site .lead {\n color: var(--s-muted);\n max-width: 46ch;\n margin: 0 0 18px;\n}\n\n.site .phone {\n color: var(--s-ink);\n font-size: clamp(28px, 6vw, 40px);\n font-weight: 800;\n text-decoration: none;\n display: inline-block;\n}\n\n.site .phone span {\n color: var(--s-muted);\n font-size: 14px;\n font-weight: 400;\n display: block;\n}\n\n.lead-form {\n background: var(--s-surface);\n border: 2px solid var(--s-brand);\n border-radius: 14px;\n gap: 12px;\n padding: 20px;\n display: grid;\n}\n\n.lead-form h2 {\n margin: 0;\n font-size: 22px;\n font-weight: 800;\n}\n\n.lead-form label {\n gap: 4px;\n font-size: 14px;\n font-weight: 600;\n display: grid;\n}\n\n.lead-form textarea {\n resize: vertical;\n}\n\n.lead-form input, .lead-form select, .lead-form textarea {\n font: inherit;\n color: var(--s-ink);\n background: var(--s-bg);\n border: 1px solid var(--s-line);\n border-radius: 8px;\n width: 100%;\n min-height: 46px;\n padding: 12px;\n}\n\n.site :focus-visible {\n outline: 3px solid var(--s-accent);\n outline-offset: 2px;\n}\n\n.lead-form .row {\n gap: 12px;\n display: grid;\n}\n\n.lead-form button {\n font: inherit;\n background: var(--s-accent);\n color: var(--s-accent-ink);\n cursor: pointer;\n border: 0;\n border-radius: 10px;\n padding: 15px;\n font-size: 18px;\n font-weight: 800;\n}\n\n.site .note {\n color: var(--s-muted);\n margin: 0;\n font-size: 13px;\n}\n\n.site .ok {\n color: var(--s-brand);\n margin: 0;\n font-weight: 600;\n}\n\n.site .hero {\n background: var(--s-hero);\n text-align: center;\n padding: 48px 20px 150px;\n position: relative;\n overflow: hidden;\n}\n\n.site .hero .logo {\n width: min(440px, 78%);\n height: auto;\n margin: 0 auto;\n display: block;\n}\n\n.site .hero .cap {\n text-align: left;\n color: var(--s-on-brand);\n padding: 30px 0 26px;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n}\n\n.site .hero .cap p {\n max-width: 30ch;\n margin: 0;\n font-size: clamp(20px, 3.6vw, 30px);\n font-weight: 600;\n line-height: 1.2;\n}\n\n.site section {\n padding: 44px 0;\n}\n\n.site h2.s {\n color: var(--s-brand);\n margin: 0 0 10px;\n font-size: clamp(26px, 4.4vw, 36px);\n font-weight: 800;\n line-height: 1.1;\n}\n\n.site .intro {\n max-width: 62ch;\n color: var(--s-muted);\n margin: 0 0 22px;\n}\n\n.site .svc {\n border-top: 1px solid var(--s-line);\n}\n\n.site .photos {\n grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n gap: 16px;\n margin-top: 24px;\n display: grid;\n}\n\n.site .photos figure {\n margin: 0;\n}\n\n.site .photos img {\n object-fit: cover;\n border-radius: 6px;\n width: 100%;\n height: 260px;\n display: block;\n}\n\n.site .photos figcaption {\n opacity: .8;\n margin-top: 6px;\n font-size: 14px;\n}\n\n.site .svc div, .site .area {\n border-bottom: 1px solid var(--s-line);\n gap: 4px;\n padding: 18px 0;\n display: grid;\n}\n\n.site .svc h3, .site .area h3 {\n margin: 0;\n font-size: 20px;\n font-weight: 700;\n}\n\n.site .area h3 a {\n color: var(--s-brand);\n}\n\n.site .svc p, .site .area p {\n color: var(--s-muted);\n max-width: 60ch;\n margin: 0;\n}\n\n.site .chips {\n flex-wrap: wrap;\n gap: 8px;\n margin: 0 0 14px;\n padding: 0;\n list-style: none;\n display: flex;\n}\n\n.site .chips.collapsed {\n max-height: 84px;\n overflow: hidden;\n -webkit-mask-image: linear-gradient(#000 55%, #0000 100%);\n mask-image: linear-gradient(#000 55%, #0000 100%);\n}\n\n.site .more-btn {\n border: 1px solid var(--s-brand);\n color: var(--s-brand);\n font: inherit;\n cursor: pointer;\n background: none;\n border-radius: 999px;\n margin: 0 0 14px;\n padding: 6px 16px;\n font-size: 14px;\n font-weight: 600;\n display: inline-block;\n}\n\n.site .more-btn:hover {\n background: var(--s-brand);\n color: #fff;\n}\n\n.site .chips a {\n border: 1px solid var(--s-brand);\n color: var(--s-brand);\n border-radius: 999px;\n padding: 6px 14px;\n font-size: 15px;\n font-weight: 600;\n text-decoration: none;\n display: block;\n}\n\n.site .why {\n gap: 18px;\n display: grid;\n}\n\n.site .why h3 {\n margin: 0 0 2px;\n font-size: 18px;\n font-weight: 700;\n}\n\n.site .why p {\n color: var(--s-muted);\n margin: 0;\n}\n\n.site details {\n border-bottom: 1px solid var(--s-line);\n padding: 14px 0;\n}\n\n.site summary {\n cursor: pointer;\n font-size: 18px;\n font-weight: 600;\n}\n\n.site details p {\n color: var(--s-muted);\n max-width: 62ch;\n margin: 10px 0 0;\n}\n\n.site .cta {\n background: var(--s-brand);\n color: var(--s-on-brand);\n border-radius: 16px;\n justify-items: start;\n gap: 12px;\n padding: 30px 24px;\n display: grid;\n}\n\n.site .cta h2 {\n margin: 0;\n font-size: clamp(24px, 4vw, 34px);\n font-weight: 800;\n line-height: 1.1;\n}\n\n.site .cta p {\n max-width: 52ch;\n margin: 0;\n}\n\n.site footer {\n color: var(--s-muted);\n padding: 26px 0 40px;\n font-size: 14px;\n}\n\n.site .socials {\n flex-wrap: wrap;\n gap: 10px;\n margin: 14px 0 4px;\n padding: 0;\n list-style: none;\n display: flex;\n}\n\n.site .socials a {\n border: 1px solid var(--s-line);\n width: 38px;\n height: 38px;\n color: var(--s-brand);\n background: var(--s-surface);\n border-radius: 50%;\n justify-content: center;\n align-items: center;\n transition: background .15s, color .15s, border-color .15s;\n display: inline-flex;\n}\n\n.site .socials a:hover {\n background: var(--s-brand);\n color: #fff;\n border-color: var(--s-brand);\n}\n\n.site .dstv-content {\n border-top: 1px solid var(--s-line);\n gap: 12px;\n margin-top: 8px;\n padding: 18px 0;\n display: grid;\n}\n\n.site .dstv-content h3 {\n margin: 0;\n font-size: 22px;\n font-weight: 700;\n}\n\n.site .dstv-content p {\n color: var(--s-muted);\n max-width: 70ch;\n margin: 0;\n line-height: 1.65;\n}\n\n.site .dstv-content .reveal-links {\n color: var(--s-muted);\n}\n\n.site .reveal-links {\n margin: 10px 0 0;\n}\n\n.site .reveal-links a {\n color: #0000;\n text-decoration: none;\n}\n\n.site .reveal-links ::selection {\n color: #1c1c1c;\n background: #ffe95e;\n}\n\n@media (width >= 820px) {\n .site .top {\n grid-template-columns: 1.1fr .9fr;\n align-items: start;\n padding-top: 34px;\n }\n\n .lead-form .row {\n grid-template-columns: 1fr 1fr;\n }\n\n .site .svc div, .site .area {\n grid-template-columns: 320px 1fr;\n gap: 24px;\n }\n\n .site .why {\n grid-template-columns: repeat(3, 1fr);\n }\n}\n\n.site .trustpilot {\n text-align: center;\n border: 1px solid var(--s-line, oklch(90% 0 0));\n border-radius: 14px;\n margin: 24px 0;\n padding: 24px 16px;\n}\n\n.site .tp-stars {\n color: oklch(65% .17 155);\n letter-spacing: 4px;\n margin: 0;\n font-size: 28px;\n}\n\n.site .tp-btn {\n color: oklch(100% 0 0);\n background: oklch(65% .17 155);\n border-radius: 999px;\n margin-top: 8px;\n padding: 10px 18px;\n font-weight: 600;\n text-decoration: none;\n display: inline-block;\n}\n\n.site .mini-cta {\n background: var(--s-brand);\n color: var(--s-on-brand);\n border-radius: 14px;\n flex-wrap: wrap;\n justify-content: space-between;\n align-items: center;\n gap: 10px 16px;\n margin: 28px 0;\n padding: 16px 18px;\n display: flex;\n}\n\n.site .mini-cta p {\n margin: 0;\n font-weight: 700;\n}\n\n.site .mini-cta div {\n flex-wrap: wrap;\n gap: 8px;\n display: flex;\n}\n\n.site .mini-cta a {\n background: var(--s-accent);\n color: var(--s-brand);\n border-radius: 999px;\n padding: 10px 16px;\n font-weight: 700;\n text-decoration: none;\n}\n\n.site .mini-cta a.alt {\n color: var(--s-on-brand);\n background: none;\n border: 1px solid;\n}\n\n.lead-form .ai-helper {\n justify-items: start;\n gap: 8px;\n display: grid;\n}\n\n.lead-form .ai-tip {\n white-space: pre-line;\n background: var(--s-bg);\n border: 1px solid var(--s-line);\n border-left: 3px solid var(--s-accent);\n border-radius: 8px;\n margin: 0;\n padding: 10px 12px;\n font-size: .92rem;\n line-height: 1.5;\n}\n\n.service-map {\n background: var(--muted, #eef2f7);\n z-index: 0;\n border-radius: 12px;\n width: 100%;\n height: 460px;\n margin: 1rem 0;\n}\n\n.map-info {\n border: 1px solid;\n border-radius: 12px;\n gap: .25rem;\n margin-top: 1rem;\n padding: 1rem;\n display: grid;\n}\n\n.map-info p {\n margin: 0;\n}\n\n.base-pin {\n color: #ffd400;\n text-align: center;\n background: #0164bc;\n border: 2px solid #fff;\n border-radius: 50%;\n font-size: 18px;\n line-height: 28px;\n}\n\n.site details.menu {\n position: relative;\n}\n\n.site details.menu > summary, .site .site-nav summary, .site details.more > summary {\n list-style: none;\n}\n\n.site details.menu > summary::-webkit-details-marker {\n display: none;\n}\n\n.site .site-nav summary::-webkit-details-marker {\n display: none;\n}\n\n.site details.more > summary::-webkit-details-marker {\n display: none;\n}\n\n.site details.more[open] > summary {\n display: none;\n}\n\n.site .site-header {\n position: relative;\n}\n\n@property --tw-translate-x {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-y {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-translate-z {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-rotate-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-rotate-z {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-x {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-skew-y {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-space-y-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-space-x-reverse {\n syntax: \"*\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-border-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-leading {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-font-weight {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-tracking {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ordinal {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-slashed-zero {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-figure {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-spacing {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-numeric-fraction {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-shadow-alpha {\n syntax: \"\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-inset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-shadow-alpha {\n syntax: \"\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-inset-ring-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-inset-ring-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-ring-inset {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ring-offset-width {\n syntax: \"\";\n inherits: false;\n initial-value: 0;\n}\n\n@property --tw-ring-offset-color {\n syntax: \"*\";\n inherits: false;\n initial-value: #fff;\n}\n\n@property --tw-ring-offset-shadow {\n syntax: \"*\";\n inherits: false;\n initial-value: 0 0 #0000;\n}\n\n@property --tw-outline-style {\n syntax: \"*\";\n inherits: false;\n initial-value: solid;\n}\n\n@property --tw-blur {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-brightness {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-contrast {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-grayscale {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-hue-rotate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-invert {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-opacity {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-saturate {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-sepia {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-color {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-drop-shadow-alpha {\n syntax: \"\";\n inherits: false;\n initial-value: 100%;\n}\n\n@property --tw-drop-shadow-size {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-duration {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-ease {\n syntax: \"*\";\n inherits: false\n}\n\n@property --tw-content {\n syntax: \"*\";\n inherits: false;\n initial-value: \"\";\n}\n\n@keyframes pulse {\n 50% {\n opacity: .5;\n }\n}\n\n@keyframes enter {\n from {\n opacity: var(--tw-enter-opacity, 1);\n transform: translate3d(var(--tw-enter-translate-x, 0),var(--tw-enter-translate-y, 0),0)scale3d(var(--tw-enter-scale, 1),var(--tw-enter-scale, 1),var(--tw-enter-scale, 1))rotate(var(--tw-enter-rotate, 0));\n filter: blur(var(--tw-enter-blur, 0));\n }\n}\n\n@keyframes exit {\n to {\n opacity: var(--tw-exit-opacity, 1);\n transform: translate3d(var(--tw-exit-translate-x, 0),var(--tw-exit-translate-y, 0),0)scale3d(var(--tw-exit-scale, 1),var(--tw-exit-scale, 1),var(--tw-exit-scale, 1))rotate(var(--tw-exit-rotate, 0));\n filter: blur(var(--tw-exit-blur, 0));\n }\n}\n\n@keyframes accordion-down {\n from {\n height: 0;\n }\n\n to {\n height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))));\n }\n}\n\n@keyframes accordion-up {\n from {\n height: var(--radix-accordion-content-height, var(--bits-accordion-content-height, var(--reka-accordion-content-height, var(--kb-accordion-content-height, var(--ngp-accordion-content-height, auto)))));\n }\n\n to {\n height: 0;\n }\n}\n\n@keyframes caret-blink {\n 0%, 70%, 100% {\n opacity: 1;\n }\n\n 20%, 50% {\n opacity: 0;\n }\n}\n" __vite__updateStyle(__vite__id, __vite__css) import.meta.hot.accept() import.meta.hot.prune(() => __vite__removeStyle(__vite__id)) /* From assets/f5f69c21dc.css */ /* Source extracted CSS */ /* From assets/styles.css */ /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */ /* [EC-TW4-001] unwrapped @layer base */ *, :after, :before, ::backdrop { box-sizing: border-box; border: 0 solid; margin: 0; padding: 0; } ::file-selector-button { box-sizing: border-box; border: 0 solid; margin: 0; padding: 0; } html, :host { -webkit-text-size-adjust: 100%; tab-size: 4; line-height: 1.5; font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; -webkit-text-decoration: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { vertical-align: baseline; font-size: 75%; line-height: 0; position: relative; } sub { bottom: -.25em; } sup { top: -.5em; } table { text-indent: 0; border-color: inherit; border-collapse: collapse; } :-moz-focusring:where(:not(iframe)) { outline: auto; } progress { vertical-align: baseline; } summary { display: list-item; } ol, ul, menu { list-style: none; } img, svg, video, canvas, audio, iframe, embed, object { vertical-align: middle; display: block; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: #0000; border-radius: 0; } ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: #0000; border-radius: 0; } :where(select:is([multiple], [size])) optgroup { font-weight: bolder; } :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentColor; } @supports (color: color-mix(in lab, red, red)) { ::placeholder { color: color-mix(in oklab, currentcolor 50%, transparent); } } } textarea { resize: vertical; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-datetime-edit { padding-block: 0; } ::-webkit-datetime-edit-year-field { padding-block: 0; } ::-webkit-datetime-edit-month-field { padding-block: 0; } ::-webkit-datetime-edit-day-field { padding-block: 0; } ::-webkit-datetime-edit-hour-field { padding-block: 0; } ::-webkit-datetime-edit-minute-field { padding-block: 0; } ::-webkit-datetime-edit-second-field { padding-block: 0; } ::-webkit-datetime-edit-millisecond-field { padding-block: 0; } ::-webkit-datetime-edit-meridiem-field { padding-block: 0; } ::-webkit-calendar-picker-indicator { line-height: 1; } :-moz-ui-invalid { box-shadow: none; } button, input:where([type="button"], [type="reset"], [type="submit"]) { appearance: button; } ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button { height: auto; } ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } * { border-color: var(--color-border); } body { background-color: var(--color-background); color: var(--color-foreground); } /* [EC-TW4-001] unwrapped @layer base */ body.wp-admin { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; } /* EC-CSS-001: Long-hand padding-left/right (NOT shorthand 'padding: 0 20px') so * compound selectors like .container.hero-grid (which sets padding-top: 74px) * keep their vertical padding. The shorthand resets ALL four sides at the same * specificity, which on Dabster Labs caused the hero badge to slide under the * fixed 74px nav. Horizontal gutter (20px each side) unchanged; vertical * defaults to the browser's 0 — same effective behavior for sites that do not * set padding-top via another selector. */ .container { max-width: 1200px; margin: 0 auto; padding-left: 20px; padding-right: 20px; } /* EC-CSS-009: :where() = 0 specificity, same reasoning as EC-BTN-104 above. A bare "h1, h2, h3, h4, h5, h6" list ties a site's own "h1, h2, h3 { font-weight: 400 }" on specificity (0,0,1) and, being emitted after the merged site CSS, wins — so a display face meant to render at 400 shipped bold everywhere. These declarations still beat the UA stylesheet, because author origin outranks user-agent origin regardless of specificity. */ :where(h1, h2, h3, h4, h5, h6) { font-weight: 700; margin: 0; } :where(button, .btn) { cursor: pointer; border: none; transition: all 0.3s; } /* EC-BTN-105: Neutralize the native form-control appearance that Tailwind v4 preflight (`appearance: button`) re-enables in WordPress, which paints a gray "button face" fill on bare