@layer cv2-area, cv2-legacy;

:root{
  --ar-page:#f2f3f5;
  --ar-inset-dark:var(--cv2-dark,#1b1b1d);
  --ar-white:#ffffff;
  --ar-whatsapp:#25d366;
  --ar-card:#ffffff;
  --ar-card-2:#f6f7f8;
  --ar-card-3:#eceef1;
  --ar-ink:var(--color-heading,#575a6d);
  --ar-ink-2:var(--color-text-secondary,#575a6d);
  --ar-ink-3:var(--color-text-muted,#6b6f78);
  --ar-ink-4:#a7abb3;
  --ar-line:rgba(18,19,22,.07);
  --ar-line-2:rgba(18,19,22,.12);
  --ar-accent:var(--cv2-primary,#2f80ed);
  
  --ar-accent-soft:color-mix(in srgb,var(--ar-accent) 10%,#ffffff);
  
  --ar-dark:var(--cv2-dark,#1b1b1d);
  
  --ar-dark-3:var(--cv2-dark-3,#333336);
  --ar-on-dark:var(--cv2-on-dark,#f4f4f5);
  --ar-on-dark-2:var(--cv2-on-dark-2,#a1a1a8);
  --ar-dark-line:var(--cv2-dark-line,rgba(255,255,255,.08));
  --ar-mint:#96f6cc;
  --ar-card-glass:color-mix(in srgb,var(--ar-card) 90%,transparent);
  --ar-ok:#22a06b;
  --ar-warn:#e8a33d;
  --ar-bad:#e5484d;
  --ar-r-xl:28px;
  --ar-r-lg:22px;
  --ar-r-md:16px;
  --ar-r-sm:12px;
  --ar-pill:999px;
  --ar-sh-card:0 1px 2px rgba(16,18,22,.04),0 10px 30px -14px rgba(16,18,22,.16);
  --ar-sh-float:0 1px 2px rgba(16,18,22,.05),0 14px 34px -14px rgba(16,18,22,.22);
  --ar-sh-inner:0 1px 2px rgba(16,18,22,.05),0 6px 16px -8px rgba(16,18,22,.12);
  --ar-sh-btn:inset 0 1px 0 rgba(255,255,255,.95),0 1px 2px rgba(16,18,22,.08),0 6px 14px -6px rgba(16,18,22,.18);
  --ar-sh-dark-btn:inset 0 1px 0 rgba(255,255,255,.14),0 2px 4px rgba(0,0,0,.18),0 8px 18px -8px rgba(0,0,0,.45);
  --ar-btn-light:linear-gradient(180deg,#ffffff 0%,#f1f2f4 100%);
  --ar-btn-dark:linear-gradient(180deg,var(--cv2-dark-hi,#2b2b2e) 0%,var(--cv2-dark-lo,#151517) 100%);
  --ar-grad-popular:var(--color-dual,var(--CoreV2-primary,#2563eb));
  --ar-price-fade:linear-gradient(180deg,var(--ar-ink) 35%,#8d9097 100%);
  --ar-price-fade-dark:linear-gradient(180deg,var(--cv2-on-dark,#ffffff) 35%,var(--cv2-on-dark-2,#8d8d93) 100%);
  --ar-ease:cubic-bezier(.2,.7,.2,1);
  --ar-gap:clamp(12px,1.6vw,20px);
  --ar-section-y:clamp(40px,6vw,88px);}
html[data-theme="dark"],html.dark-mode{
  --ar-page:var(--cv2-dark,#1b1b1d);
  
  --ar-card:color-mix(in srgb,var(--cv2-dark,#1b1b1d) 95%,#fff);
  --ar-card-2:color-mix(in srgb,var(--cv2-dark,#1b1b1d) 91%,#fff);
  --ar-card-3:color-mix(in srgb,var(--cv2-dark,#1b1b1d) 86%,#fff);
  --ar-ink:#f3f4f6;
  --ar-ink-2:#c9ccd2;
  --ar-ink-3:#8e929a;
  --ar-ink-4:#676b73;
  --ar-line:rgba(255,255,255,.07);
  --ar-line-2:rgba(255,255,255,.12);
  --ar-accent-soft:color-mix(in srgb,var(--ar-accent) 18%,var(--cv2-dark,#1b1b1d));
  
  --ar-dark:var(--cv2-dark,#1b1b1d);
  
  --ar-dark-3:#222225;
  --ar-sh-card:inset 0 1px 0 rgba(255,255,255,.03),0 12px 30px -14px rgba(0,0,0,.7);
  --ar-sh-float:inset 0 1px 0 rgba(255,255,255,.04),0 16px 36px -14px rgba(0,0,0,.8);
  --ar-sh-inner:inset 0 1px 0 rgba(255,255,255,.04),0 6px 16px -8px rgba(0,0,0,.6);
  --ar-sh-btn:inset 0 1px 0 rgba(255,255,255,.07),0 2px 8px rgba(0,0,0,.45);
  --ar-btn-light:linear-gradient(180deg,#2a2b30 0%,#202125 100%);
  --ar-price-fade:linear-gradient(180deg,#ffffff 35%,#8d8d93 100%)}
