/*==========================================================
  ORIGAMI — Theme layer  (loaded LAST on every page)
  Final say on typography, colour and effects:
  "fresh teal + azure" — calm base, one energetic accent.
  Rules: no gradient text, no dot textures, no glass/glow,
  one soft shadow, one radius family, dark only where needed.
==========================================================*/

html { font-size: 62.5%; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body,
body.hs-body {
  font-family: var(--font-body);
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
/* old rainbow strip on top of every page */
body::before, body.hs-body::before { display: none !important; }

/* ── Typography: bold geometric headings, calm Inter body ── */
h1, h2, h3, h4,
.panel-h1, .panel-h2,
.svc-heading, .svc-cat-title,
.prod-title,
.hs-hero-h1, .hs-section-h2, .hs-cta-h2,
.br-title, .br-cta h2,
.ab-hero h1, .ab-section-head h2, .ab-cta h2, .policy-hero h1 {
  font-family: var(--font-head);
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--ink);
}
.svc-cat-title, .prod-title { font-weight: 700; }

/* gradient text → solid teal */
.hero-tagline-accent, .svc-heading-accent, .prod-title-accent, .hs-hero-accent,
.hs-h2-accent, .br-title span, .panel-h2 span {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--teal) !important;
  font-weight: inherit;
}

/* small caps labels */
.svc-eyebrow, .panel-subhead, .hs-eyebrow, .br-eyebrow, .trust-eyebrow {
  font-family: var(--font-head);
  font-weight: 700;
  color: var(--teal);
}

/* ── Background decoration off ── */
.svc-bg-deco, .hero-fold-deco, .hero-pattern, .hs-hero-pattern, .hs-hero-deco,
.prod-card-bg::after { display: none !important; }

/* ── Sections ── */
.section-services { background: #fff; }
.panel-contact { background: #fff; }
.contact-right { background: var(--mist); }

/* ── Products: soft cards, quiet type ── */
.prod-title { color: var(--ink); }
.prod-desc, .prod-features li { color: var(--ink-2); }
.prod-features li { color: var(--ink); }
.prod-card-health .prod-card-bg { background: linear-gradient(170deg, #E6F5F2 0%, #DCF0ED 100%); }
.prod-card-civil  .prod-card-bg { background: linear-gradient(170deg, #E9F4F8 0%, #DDEEF5 100%); }
.prod-card-ads    .prod-card-bg { background: linear-gradient(170deg, #EEF4FF 0%, #E1EBFF 100%); }
.prod-card-ads .prod-btn-ads { background: var(--accent); border-color: var(--accent); box-shadow: none; }
.prod-card-ads .prod-btn-ads:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.prod-btn-fill, .prod-btn-outline { box-shadow: none; }
.prod-pill { border-color: var(--line); color: var(--ink); background: #fff; }
.prod-image-tag { border-color: var(--line); color: var(--ink); }

/* ── About panel: light ── */
.panel-about, .about-left, .about-right { background: #fff; }
.about-left { border-right: 1px solid var(--line); }
.about-right { background: var(--mist); }
.panel-about .panel-subhead { color: var(--teal); }
.panel-about .panel-h2, .panel-about .panel-h1 { color: var(--ink); }
.panel-about .panel-text { color: var(--ink-2); }
.about-stat-box { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.about-stat-box:hover { border-color: var(--teal); box-shadow: var(--shadow); background: #fff; }
.about-stat-num { font-family: var(--font-head); font-weight: 800; color: var(--teal); }
.about-stat-lbl { color: var(--ink-3); }
.about-quote { background: var(--ice); border: 1px solid #DCE3E1; backdrop-filter: none; }
.about-quote::before { color: rgba(47,107,255,0.25); }
.about-quote p { color: var(--ink); }
.about-quote cite { color: var(--ink-3); }
.value-item { background: #fff; border: 1px solid var(--line); box-shadow: none; }
.value-item:hover { background: var(--teal-soft); border-color: var(--teal); }
.value-item ion-icon { color: var(--teal); }
.value-item-body strong { color: var(--ink); }
.value-item-body span { color: var(--ink-2); }
.panel-about .btn-primary { background: var(--teal); box-shadow: none; }

/* ── Contact ── */
.demo-box { box-shadow: none; }
.contact-right .demo-box { background: var(--teal); }
.contact-right .demo-box h3, .contact-right .demo-box p, .demo-box-tag { color: #fff; }
.contact-right .demo-box .btn-ghost { border-color: rgba(255,255,255,0.7); color: #fff; }
.contact-right .demo-box .btn-ghost:hover { background: #fff; color: var(--teal); }
.contact-right .demo-box-ads { background: var(--ice); border: 1px solid #DCE3E1; }
.contact-right .demo-box-ads h3 { color: var(--ink); }
.contact-right .demo-box-ads p { color: var(--ink-2); }
.contact-right .demo-box-ads .demo-box-tag { color: var(--accent-dark); }
.contact-right .demo-box-ads .btn-ghost { border-color: var(--accent); color: var(--accent-dark); }
.contact-right .demo-box-ads .btn-ghost:hover { background: var(--accent); color: #fff; }

/* main form button = the main CTA of the contact view */
.form-submit, .btn-primary.form-submit { background: var(--accent) !important; box-shadow: none !important; }
.form-submit:hover { background: var(--accent-dark) !important; }

/* ── Fixed helpers (audio / go-top) ── */
.hero-audio-btn, .go-top-btn { box-shadow: var(--shadow-sm); }

/* ── Policy / About inner pages: light heroes ── */
.ab-hero, .policy-hero { background: var(--mist) !important; }
.ab-hero h1, .policy-hero h1 { color: var(--ink) !important; }
.ab-hero p, .policy-hero p { color: var(--ink-2) !important; }
.ab-eyebrow, .policy-eyebrow { background: var(--teal-soft) !important; color: var(--teal-dark) !important; border-color: transparent !important; }
.ab-stats { background: #fff; }
.ab-cta { background: var(--teal) !important; }
.ab-cta h2, .ab-cta p { color: #fff !important; }
.policy-contact-box { background: var(--mist) !important; color: var(--ink) !important; border: 1px solid var(--line); }
.policy-contact-box * { color: inherit; }

@media (max-width: 768px), (max-height: 520px) {
  html { scroll-padding-top: 8rem; }
}

/* slide/panel arrows only exist while the horizontal section is active */
body:not(.h-active) .panel-arrow,
body:not(.h-active) .panel-counter,
body:not(.h-active) .panel-dots { opacity: 0 !important; pointer-events: none !important; }

/* the fixed panel dots (right edge) must never sit on top of the Ads Manager card text */
@media (min-width: 769px) and (min-height: 521px) {
  .prod-card-ads .prod-card-inner { padding-right: 6.4rem; }
}

/* ── Scroll reveal — a small fade-up used across pages for a smoother feel ── */
.reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.23,1,0.32,1);
}
.reveal.revealed { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}
