/* ═══════════════════════════════════════════════════════════════════
   AVERYA design layer — v3 (owner direction 2026-08-25):
   · Palette: the site's own restrained blue system (NVIDIA/Meta/Apple
     one-accent discipline) — no token overrides, styles.css owns color.
   · Buttons: NVIDIA grammar — 2px radius, 44px, weight 700, flat.
   · Surfaces: the site's original Liquid Glass (Apple/Meta) — this
     layer no longer flattens chrome or squares cards.
   · Solutions use the homepage blue, cyan, violet and teal grain palettes.
   · No corner squares. Loaded LAST on every page.
   ═══════════════════════════════════════════════════════════════════ */

:root{
  --nv-r:2px;
  --nv-primary-dark:#1D4FD7;   /* pressed CTA — from --em-gradient */
  --nv-hairline-dark:rgba(255,255,255,.22);
}

/* ── BUTTONS — the NVIDIA grammar in the brand accent ───────────── */
.btn{
  border-radius:var(--nv-r);
  padding:11px 24px;min-height:44px;
  font-weight:700;letter-spacing:0;
  box-shadow:none;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.btn:hover{transform:none;box-shadow:none}
.btn:active{transform:none}
.btn-primary{background:var(--primary);box-shadow:none}
.btn-primary:hover{background:var(--nv-primary-dark);box-shadow:none}
/* secondary on light canvas — clear pane bordered in the accent */
.btn-ghost{
  background:transparent;
  border:2px solid var(--primary);
  color:var(--ink);
  -webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:none;
}
.btn-ghost:hover{background:rgba(37,99,235,.06);border-color:var(--nv-primary-dark);box-shadow:none}
/* secondary on dark surfaces — white outline */
.schedule-card .btn-light,
.contact-card .btn-light{
  background:transparent;border:1px solid #fff;color:#fff;box-shadow:none;
}
.schedule-card .btn-light:hover,
.contact-card .btn-light:hover{background:rgba(255,255,255,.10)}
.testimonial-card .btn-ghost{background:transparent;border:1px solid #fff;color:#fff;box-shadow:none}
.testimonial-card .btn-ghost:hover{background:rgba(255,255,255,.10);border-color:#fff}
.hero-actions .btn{border-radius:var(--nv-r)}
.hero-actions .btn-primary{box-shadow:none}
.hero-actions .btn-ghost{
  background:transparent;border:2px solid var(--primary);color:var(--ink);
  -webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;
}
.hero-actions .btn-ghost:hover{background:rgba(37,99,235,.06);border-color:var(--nv-primary-dark)}
.nav-cta{
  background:var(--primary);color:#fff;
  border-radius:var(--nv-r);
  font-weight:700;letter-spacing:0;
  box-shadow:none;
  min-height:40px;
}
.nav-cta:hover{background:var(--nv-primary-dark);transform:none;box-shadow:none}
.nav.over-dark .nav-cta{background:var(--primary);color:#fff}
.nav.over-dark .nav-cta:hover{background:var(--nv-primary-dark)}
/* the services pillar CTAs sit on light canvas — accent outline */
.pk-cta-row .btn-light{background:transparent;border:2px solid var(--primary);color:var(--ink);box-shadow:none}
.pk-cta-row .btn-light:hover{background:rgba(37,99,235,.06);border-color:var(--nv-primary-dark)}

/* ── ORDER — the NVIDIA band discipline that stays ──────────────── */
.schedule-card{text-align:start}
.schedule-card .schedule-title{margin-inline:0}
.schedule-buttons,.schedule-btn-group{justify-content:flex-start}
.schedule-note{text-align:start}

/* ── HIERARCHY — the fabius section-head ladder (owner-approved) ── */
.about-head{max-width:760px}
.about-head h2{
  font-size:clamp(30px,4.2vw,48px);
  font-weight:700;letter-spacing:-0.03em;line-height:1.12;
}
.about-head p{
  font-size:clamp(16px,1.7vw,18.5px);
  color:var(--ink-muted);line-height:1.6;
  margin-top:14px;
}
.pkg-head,.deep-section .pkg-head{max-width:760px}
.deep-lead{
  font-size:clamp(16px,1.7vw,18.5px);
  color:var(--ink-muted);line-height:1.6;
  max-width:64ch;
}

/* ── PICKER FIX — the spec panel is sticky again (a later duplicate
   rule in averya-picker.css had reverted it to relative) ─────────── */
.pk-spec{position:sticky;top:96px}
/* the picker grid rides the cream body canvas, not a tinted wash */
.pk.deep-section{background:none}

/* ── FOCUS — one accent focus signal ────────────────────────────── */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--primary);outline-offset:2px;
}

/* Solutions use the same four cool grain palettes as the homepage. */
.page-solutions{
  --primary:#2563eb;--primary-glow:#3b89ff;--nv-primary-dark:#1d4ed8;
  --em-gradient:linear-gradient(115deg,#2563eb 0%,#3b89ff 38%,#8b5cf6 70%,#6d28d9 100%);
  --glass-bg-light:linear-gradient(180deg,rgba(255,255,255,.96),rgba(242,245,255,.82));
}
.page-solutions #build{
  --pc:#2563eb;--motion-accent:#2563eb;--motion-accent-2:#1d4ed8;
  --motion-soft:#eaf2ff;--motion-deep:#091c48;--motion-rgb:37,99,235;
  --pg:linear-gradient(90deg,#1d4ed8,#2563eb 52%,#4f8bff);
}
.page-solutions #build .averya-bento .cap{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.24),transparent 56%),
  linear-gradient(180deg,rgba(10,20,45,0) 42%,rgba(10,20,45,.16) 100%),
  linear-gradient(150deg,#4f8bff 0%,#2563eb 45%,#1436a6 100%);
  background-blend-mode:overlay,normal,normal,normal;
}
.page-solutions #growth{
  --pc:#0891b2;--motion-accent:#0891b2;--motion-accent-2:#0e7490;
  --motion-soft:#e5f9fc;--motion-deep:#073b4a;--motion-rgb:8,145,178;
  --pg:linear-gradient(90deg,#0e7490,#0891b2 52%,#93ecf1);
}
.page-solutions #growth .averya-bento .cap{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.24),transparent 56%),
  linear-gradient(180deg,rgba(10,20,45,0) 42%,rgba(10,20,45,.16) 100%),
  linear-gradient(150deg,#93ecf1 0%,#67dfe7 45%,#22b9c8 100%);
  background-blend-mode:overlay,normal,normal,normal;
}
.page-solutions #systems{
  --pc:#7c3aed;--motion-accent:#7c3aed;--motion-accent-2:#6d28d9;
  --motion-soft:#f0eaff;--motion-deep:#201046;--motion-rgb:124,58,237;
  --pg:linear-gradient(90deg,#6d28d9,#7c3aed 52%,#b981ef);
}
.page-solutions #systems .averya-bento .cap{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.24),transparent 56%),
  linear-gradient(180deg,rgba(10,20,45,0) 42%,rgba(10,20,45,.16) 100%),
  linear-gradient(150deg,#b981ef 0%,#7c3aed 45%,#5b21b6 100%);
  background-blend-mode:overlay,normal,normal,normal;
}
.page-solutions #secure{
  --pc:#0e7490;--motion-accent:#0e7490;--motion-accent-2:#155e75;
  --motion-soft:#e6f7fc;--motion-deep:#082d42;--motion-rgb:14,116,144;
  --pg:linear-gradient(90deg,#155e75,#0e7490 52%,#35b8db);
}
.page-solutions #secure .averya-bento .cap{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.24),transparent 56%),
  linear-gradient(180deg,rgba(10,20,45,0) 42%,rgba(10,20,45,.16) 100%),
  linear-gradient(150deg,#35b8db 0%,#0e7490 45%,#07516b 100%);
  background-blend-mode:overlay,normal,normal,normal;
}
/* Readable ink follows the fill: white on blue/violet/teal, ink on cyan. */
.page-solutions .averya-bento .cap{--cap-ink:#fff;--cap-tag:rgba(0,0,0,.20)}
.page-solutions #growth .averya-bento .cap{--cap-ink:#073b4a;--cap-tag:rgba(255,255,255,.48)}
.page-solutions :is(#build,#growth,#systems,#secure) .averya-bento .cap :is(h3,p,.ic){color:var(--cap-ink);text-shadow:none}
.page-solutions :is(#build,#growth,#systems,#secure) .averya-bento .cap .tags span{color:var(--cap-ink);background:var(--cap-tag);border-color:transparent}
.page-solutions .nav.scrolled{background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(242,245,255,.78))}

/* Keep the solutions heading paint and interactive tints in its cool palette. */
.page-solutions .kinetic-title em{text-shadow:0 12px 30px rgba(37,99,235,var(--kt-glow))}
.page-solutions .kinetic-title em.em-ink{color:#6d28d9!important;-webkit-text-fill-color:#6d28d9!important}
.page-solutions .kinetic-title em.em-underline{background:linear-gradient(90deg,#2563eb,#8b5cf6) left calc(100% - .02em)/100% .14em no-repeat!important}
.page-solutions .about-head h2 em{background:var(--em-gradient) left bottom/100% .09em no-repeat}
.page-solutions :is(.btn-ghost,.pk-cta-row .btn-light):hover{background:rgba(37,99,235,.07)}

/* [picker-warm] ═══ service picker (service-*.html) — warm pillar takeover ═══
   --c / --pg arrive as INLINE style on <section class="pk" data-pillar="…">,
   so the variable swap needs !important (author-important beats inline-normal;
   every color-mix tint / aura / wash / chip / spec-panel accent then follows
   automatically, alpha percentages untouched). Cream canvas rule stays as-is.
   averya-picker.js copies computed --c into --pk-c on .pk-fly, so the fixed
   pill inherits the warm hue with no extra hook. */

/* pillar accents (spec table): build=orange · growth=sun · systems=ember · secure=bordeaux */
.pk[data-pillar="build"]   { --c:#F97316 !important; --pg:linear-gradient(90deg,#C93400,#F97316 52%,#F5A800) !important; }
.pk[data-pillar="growth"]  { --c:#F5A800 !important; --pg:linear-gradient(90deg,#E8420C,#F5A800 52%,#FFD469) !important; }
.pk[data-pillar="systems"] { --c:#C93400 !important; --pg:linear-gradient(90deg,#8B1E2D,#C93400 52%,#F97316) !important; }
.pk[data-pillar="secure"]  { --c:#8B1E2D !important; --pg:linear-gradient(90deg,#5E1420,#8B1E2D 52%,#C93400) !important; }

/* law-4 companions: --c-ink = the pillar's TEXT-safe accent on white (ember,
   bordeaux on the secure page); --c-on = text color ON a --c fill (near-black
   on sun/orange fills, white on ember/bordeaux). */
.pk[data-pillar] { --c-ink:#C93400; --c-on:#fff; }
.pk[data-pillar="secure"] { --c-ink:#8B1E2D; }
.pk[data-pillar="build"], .pk[data-pillar="growth"] { --c-on:#1d1d1f; }

/* ── text-on-white accents → --c-ink (never sun/orange text on white) ── */
.pk-crumb a:hover { color: var(--c-ink, #C93400); border-color: var(--c-ink, #C93400); }
.pk-item input:checked ~ .pk-ib strong { color: var(--c-ink, #C93400); }
.pk-spec-count b { color: var(--c-ink, #C93400); }
.pk-spec-list li b { color: var(--c-ink, #C93400); }
.pk-cat-head::before { color: var(--c-ink, #C93400); } /* numeral only; 9% tint chip bg stays pillar */
.pk-count { color: var(--c-ink, #C93400); }
/* focus indication needs ≥3:1 on cream — sun/orange fail, ink accent passes */
.pk-item input:focus-visible ~ .pk-box { outline-color: var(--c-ink, #C93400); }
.pk-form input:focus, .pk-form textarea:focus { border-color: var(--c-ink, #C93400); }

/* ── content ON pillar fills → --c-on (check glyph, counter chips) ── */
.pk-cat-n { color: var(--c-on, #fff); }
.pk-box::after { border-left-color: var(--c-on, #fff); border-bottom-color: var(--c-on, #fff); }

/* priority segment: navy #17123a → pillar fill with law-4 text */
.pk-pri button.is-on { background: var(--c, #C93400); color: var(--c-on, #fff); }

/* floating pill lives OUTSIDE .pk (after </main>) — kill the blue fallback;
   page-scoped :has() hook flips its numeral dark on the light-fill pillars */
.pk-fly-n { background: var(--pk-c, #C93400); }
body:has(.pk[data-pillar="build"]) .pk-fly-n,
body:has(.pk[data-pillar="growth"]) .pk-fly-n { color: #1d1d1f; }

/* ═══ WARM ACCENT — the solutions-showcase family owns the system's
   buttons and headings (owner, 2026-08-25). Ember #C93400 is the one
   interactive accent (AA on white); bordeaux #8B1E2D is its pressed
   depth; sun/orange live in gradients. PINNED exceptions the owner
   kept: the nav-bar CTA stays BMW blue, the hero cubes and the logo
   keep their own colors. ═══ */
:root{
  --primary:#C93400;
  --primary-glow:#F97316;
  --nv-primary-dark:#8B1E2D;
  --em-gradient:linear-gradient(115deg,#F5A800 0%,#F97316 40%,#E8420C 64%,#8B1E2D 100%);
}
/* nav CTA pinned to the blue the owner chose to keep */
.nav-cta,.nav.over-dark .nav-cta{background:#1C69D4;color:#fff}
.nav-cta:hover,.nav.over-dark .nav-cta:hover{background:#0653B6}
/* accent hover tints */
.btn-ghost:hover,.hero-actions .btn-ghost:hover,
.pk-cta-row .btn-light:hover{background:rgba(201,52,0,.07)}
.contact-card::before{background:radial-gradient(60% 60% at 70% 20%,rgba(201,52,0,.22),transparent 70%)}
/* ── HEADINGS — every emphasis paint on the warm ramp ── */
.cs-head h2 em,
.about-head h2 em,
.faq-head h2 em{
  background:linear-gradient(90deg,#F5A800,#E8420C 55%,#8B1E2D) left bottom/100% .09em no-repeat;
}
.hero-title em{
  background:linear-gradient(90deg,#F5A800,#E8420C 55%,#8B1E2D) left bottom/100% .09em no-repeat;
}
.kinetic-title em{text-shadow:0 12px 30px rgba(201,52,0,var(--kt-glow))}
.kinetic-title em.em-underline{
  background:linear-gradient(90deg,#C93400,#F5A800) left calc(100% - .02em)/100% .14em no-repeat!important;
}
.kinetic-title em.em-ink{
  -webkit-text-fill-color:#C93400!important;color:#C93400!important;
}
.faq-item.open{border-color:rgba(201,52,0,.30)}
/* hero CTA pair pinned to the blue design the owner kept */
.hero-actions .btn-primary{background:#1C69D4}
.hero-actions .btn-primary:hover{background:#0653B6}
.hero-actions .btn-ghost{border-color:#1C69D4}
.hero-actions .btn-ghost:hover{background:rgba(28,105,212,.06);border-color:#0653B6}

/* ═══ NVIDIA CARD FORM × APPLE LIQUID GLASS — the material stays
   (blur, gloss, translucency), the geometry goes technical: 2px
   corners + hairline edges on every card family. ═══ */
:root{--r-md:var(--nv-r);--r-lg:var(--nv-r);--r-feature:var(--nv-r)}
.about-card{border-radius:var(--nv-r);border:1px solid var(--hairline)}
.faq-item{border-radius:var(--nv-r)}
.averya-bento .cap,.averya-bento .cap.w3,
.deep-section .averya-bento .cap,.deep-section .averya-bento .cap.w3{border-radius:var(--nv-r)}
.averya-bento .cap .tags span{border-radius:var(--nv-r)}
.service-film-frame{border-radius:var(--nv-r)}
.pk-cat{border-radius:var(--nv-r)}
.pk-item{border-radius:var(--nv-r)}
.pk-spec{border-radius:var(--nv-r)}
.pk-box{border-radius:var(--nv-r)}
.art-feat,.art-card{border-radius:var(--nv-r);border:1px solid var(--hairline)}
.art-cover,.art-feat .art-cover,.artc-cover{border-radius:var(--nv-r)}
.artc-box,.artc-fig,.artc-toc,.artc-nums,.art-cta,.artc-foot-cta{border-radius:var(--nv-r)}
.tl-body{border-radius:var(--nv-r)}
.tl-disc{border-radius:var(--nv-r)}
.schedule-card{border-radius:var(--nv-r)}
.testimonial-card{border-radius:var(--nv-r)}
.cs-card-container{border-radius:var(--nv-r)}

/* the platforms arc carries twenty marks now */
.plat-arc{--n:20}

/* ═══ PLATFORMS CHAIN — twenty-six marks, back to a dense bead chain.
   Deeper curve (longer arc length), smaller tiles, and the static
   fallback spread lives INSIDE the mask window (6%–94%) so no tile
   dies half-faded at the ends. The travel animation keeps its uniform
   n-based stagger. ═══ */
.plat-arc{--n:26;height:300px}
.plat-i{
  width:56px;height:56px;border-radius:16px;
  offset-path:path("M 1180 50 C 880 320, 320 320, 20 50");
  offset-distance:calc(6% + var(--i) * (88% / (var(--n) - 1)));
}
.plat-i svg{width:30px;height:30px}
@media(max-width:980px){
  .plat-i{offset-path:path("M 940 46 C 700 280, 240 280, 0 46")}
}
@media(max-width:768px){
  .plat-i{width:30px;height:30px;border-radius:9px;
    offset-path:path("M 520 42 C 390 224, 130 224, 0 42")}
  .plat-i svg{width:17px;height:17px}
}

/* ═══ SOLUTIONS SHOWCASE — the four warm pillars as a genaya-style
   marketing row on the homepage. Same gouache skins as services.html
   (brand continuity), NVIDIA 2px geometry, staggered reveal via the
   .about-grid cascade, hover = arrow slide + chip lift only. ═══ */
.sol-grid{grid-template-columns:repeat(4,1fr);gap:12px;align-items:stretch;max-width:1060px;margin-inline:auto}
@media(max-width:1080px){.sol-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sol-grid{grid-template-columns:1fr}}
.sol-card{
  position:relative;display:flex;flex-direction:column;gap:10px;
  min-height:0;padding:18px;
  border-radius:var(--nv-r);border:1px solid rgba(255,255,255,.28);
  overflow:hidden;isolation:isolate;
  color:#fff;text-align:start;
  transition:border-color .25s var(--ease);
}
.sol-card h3{font-size:19px;font-weight:800;margin:0;color:inherit}
.sol-card p{font-size:13.5px;line-height:1.55;margin:0;color:inherit;opacity:.94;max-width:36ch}
.sol-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:2px}
.sol-chips span{
  font-family:var(--font-ui);font-size:11px;font-weight:600;
  padding:4px 9px;border-radius:var(--nv-r);
  background:rgba(6,10,24,.38);color:inherit;
  transition:transform .3s var(--ease);
}
.sol-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between}
.sol-count{font-size:12px;font-weight:700;padding:5px 10px;border-radius:var(--nv-r);background:rgba(6,10,24,.38)}
.sol-card .arrow{transition:transform .3s var(--ease)}
@media (hover:hover){
  .sol-card:hover{border-color:rgba(255,255,255,.55)}
  .sol-card:hover .arrow{transform:translateX(-5px)}
  .sol-card:hover .sol-chips span{transform:translateY(-2px)}
  .sol-card:hover .sol-chips span:nth-child(2){transition-delay:.05s}
  .sol-card:hover .sol-chips span:nth-child(3){transition-delay:.1s}
}
/* pillar skins — the services gouache anatomy, one gradient per solution */
.sol-build{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.32),transparent 56%),
  linear-gradient(180deg,rgba(9,28,72,0) 42%,rgba(9,28,72,.28) 100%),
  linear-gradient(150deg,#4F8BFF 0%,#2563EB 45%,#1436A6 100%);
  background-blend-mode:overlay,normal,normal,normal}
.sol-growth{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.32),transparent 56%),
  linear-gradient(180deg,rgba(6,45,58,0) 38%,rgba(6,45,58,.30) 100%),
  linear-gradient(150deg,#67E8F9 0%,#22D3EE 46%,#0891B2 100%);
  background-blend-mode:overlay,normal,normal,normal}
.sol-systems{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.32),transparent 56%),
  linear-gradient(180deg,rgba(30,16,70,0) 42%,rgba(30,16,70,.28) 100%),
  linear-gradient(150deg,#B98CFF 0%,#8B5CF6 45%,#5B21B6 100%);
  background-blend-mode:overlay,normal,normal,normal}
.sol-secure{background:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.32),transparent 56%),
  linear-gradient(180deg,rgba(7,35,52,0) 42%,rgba(7,35,52,.30) 100%),
  linear-gradient(150deg,#38BDF8 0%,#0284C7 45%,#075985 100%);
  background-blend-mode:overlay,normal,normal,normal}
/* light fills carry dark ink (AA) */
.sol-growth{color:#06282E}
.sol-growth .sol-chips span{background:rgba(255,255,255,.5)}
.sol-growth .sol-count{background:rgba(255,255,255,.5)}
.sol-growth{border-color:rgba(6,40,46,.2)}
@media (hover:hover){.sol-growth:hover{border-color:rgba(6,40,46,.42)}}

/* ═══ MOBILE CHAIN — the beads must READ as a chain on phones too:
   bigger tiles on a deeper curve, beads nearly touching. ═══ */
@media(max-width:768px){
  .plat-i{width:34px;height:34px;border-radius:10px;
    offset-path:path("M 520 40 C 400 262, 120 262, 0 40")}
  .plat-i svg{width:19px;height:19px}
  .plat-arc{height:280px}
}

/* ═══ MOBILE MENU — the fabius-landing pattern: a compact liquid-glass
   dropdown card under the nav, plain rows, one full-width CTA. The
   burger itself morphs to X; the in-sheet close button is redundant. ═══ */
.nav-mobile{
  top:66px;inset-inline:12px;width:auto;
  border-radius:20px;
  background:rgba(252,252,255,.94);
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 18px 44px -18px rgba(16,20,36,.28);
  max-height:calc(100dvh - 84px);
}
.nav-mobile-inner{padding:12px 12px 16px!important;display:flex;flex-direction:column;gap:4px}
.nm-close{display:none}
.nm-link-big{
  padding:13px 12px;border-radius:11px;
  background:none;border:0;box-shadow:none;
  font-size:16px;font-weight:600;
}
.nm-link-big .arrow{display:none}
.nm-link-big:hover{background:rgba(0,0,0,.045)}
.nm-link-big.cta{
  margin-top:6px;justify-content:center;
  background:#1C69D4;color:#fff;   /* owner-pinned blue, matches the bar CTA */
  border-radius:var(--nv-r);padding:13px 16px;
}
.nm-link-big.cta:hover{background:#0653B6}

/* ═══ CHAT — pinned to its original blue (owner, 2026-08-25). The chat
   sheet injects at runtime AFTER this layer, so these win on
   specificity (html prefix), not order. ═══ */
html .avc{--avc-blue:#2563EB}
html .avc-hello em{
  background:linear-gradient(115deg,#2563EB,#3b89ff 38%,#9dc0ff 60%,#1D4FD7);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
html .avc :focus-visible{outline-color:#2563EB}

/* ═══ NAV — part of the background until you scroll, then the glass
   pill (the fabius-landing feel). Over-dark pages keep their own glass. ═══ */
.nav{background:transparent;border-color:transparent;box-shadow:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:background .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.nav.scrolled{
  background:linear-gradient(180deg,rgba(255,255,255,.86) 0%,rgba(251,246,236,.72) 100%);
  -webkit-backdrop-filter:saturate(200%) blur(24px);backdrop-filter:saturate(200%) blur(24px);
  border-color:rgba(0,0,0,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.98),0 1px 2px rgba(0,0,0,.06),0 22px 48px -12px rgba(0,0,0,.20);
}
/* phones: the bar shows only logo + burger — the CTA lives inside the menu */
@media(max-width:980px){.nav-cta{display:none}}
/* menu open = the screen behind blurs, fabius-style */
.nav-scrim{background:rgba(18,14,34,.30);
  -webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15)}

/* ═══ CONTACT — owner-pinned blues on this page ═══ */
.contact-form .form-submit{background:var(--averya-surface-noise),#1C69D4;background-blend-mode:overlay,normal,normal,normal,normal;}
.contact-form .form-submit:hover{background:#0653B6}

/* process film: the stage counter strip ("לפני שלב 01 · 00/05") is
   deleted per owner (2026-08-25). Hidden here — the JS still tweens
   the node, so removing the DOM would throw GSAP target warnings. */
.process-convergence-meta{display:none}

/* phone: the big cube cluster starts lower so it clears the logo
   (the nav is transparent at the top now) */

/* solutions cards: the need-image rides the top half and melts into
   the pillar color (owner: "חצי-חצי, שישתלב עם הצבעים") */
.sol-media{display:block;margin:-22px -22px 2px;aspect-ratio:16/8.2;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 42%,rgba(0,0,0,.86) 62%,rgba(0,0,0,.45) 80%,rgba(0,0,0,.12) 92%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 42%,rgba(0,0,0,.86) 62%,rgba(0,0,0,.45) 80%,rgba(0,0,0,.12) 92%,transparent 100%)}
.sol-media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.06) contrast(1.03)}
.sol-card{min-height:0}
.sol-card h3{font-size:16px}

/* solutions cards v3 — the swan character treatment: papercraft
   character portrait up top with a name chip, melting into the warm
   band that carries the need-question. Calm hover: portrait breathes. */
.sol-media{position:relative;aspect-ratio:16/10;margin:-18px -18px 0;
  -webkit-mask-image:linear-gradient(180deg,#000 55%,rgba(0,0,0,.85) 72%,rgba(0,0,0,.35) 88%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 55%,rgba(0,0,0,.85) 72%,rgba(0,0,0,.35) 88%,transparent 100%)}
.sol-media img{transition:transform .5s var(--ease)}
@media (hover:hover){.sol-card:hover .sol-media img{transform:scale(1.035)}}
.sol-name{
  position:absolute;z-index:2;
  inset-block-start:10px;inset-inline-start:10px;
  padding:5px 11px;border-radius:var(--nv-r);
  background:rgba(255,255,255,.92);color:#1d1d1f;
  font-family:var(--font-ui);font-size:12px;font-weight:700;
}
.sol-chips{margin:8px 0 0}
.sol-card h3{margin-top:2px}

/* homepage hero: the grid texture is deleted per owner (2026-08-26) */
.hero-grid-bg{display:none}

/* Schedule card: the solution cards' paint layers, centered on the navigation CTA blue. */
:root{--averya-paint-noise:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px;
  --averya-blue-paint:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='170' height='170'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E") 0 0/180px,
  radial-gradient(96% 78% at 84% -8%,rgba(255,255,255,.32),transparent 56%),
  linear-gradient(180deg,rgba(9,28,72,0) 42%,rgba(9,28,72,.28) 100%),
  linear-gradient(150deg,#4F8BFF 0%,#1C69D4 45%,#0653B6 100%);
  --averya-grain-overlay:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E") 0 0/160px;}
.schedule-card,.averya-blue-grain{position:relative;background:var(--averya-blue-paint);
  background-color:#1C69D4;background-blend-mode:overlay,normal,normal,normal;isolation:isolate;overflow:hidden}
.sol-card::after,.schedule-card::before,.averya-blue-grain::before{content:"";position:absolute;inset:0;z-index:1;
  width:auto;height:auto;border-radius:inherit;pointer-events:none;filter:none;
  background:var(--averya-grain-overlay);mix-blend-mode:overlay}
.sol-card > *:not(.sol-media),.schedule-card > .schedule-grid,.averya-blue-grain > *{position:relative;z-index:2}
.averya-blue-grain h2,.averya-blue-grain .testimonial-quote{color:#fff}
.averya-blue-grain p{color:rgba(255,255,255,.9)}
.averya-blue-grain .btn-ghost{color:#fff;border-color:rgba(255,255,255,.6)}

/* Final interaction pass: match the accessibility product's compact glass
   menu, but keep the iPhone path immediate — no drawer/scrim transition. */
@media(max-width:980px){
  .nav-burger{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
  .nav-mobile{display:none;transform:none;transition:none;top:calc(66px + env(safe-area-inset-top));inset-inline:12px;width:auto;
    background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(251,246,236,.93));
    -webkit-backdrop-filter:saturate(180%) blur(24px);backdrop-filter:saturate(180%) blur(24px);
    border:1px solid rgba(0,0,0,.08);border-radius:18px;box-shadow:0 14px 36px rgba(0,0,0,.16)}
  body.menu-open .nav-mobile{display:block;transform:none}
  .nav-mobile-inner{padding:6px 6px 10px!important;gap:0}
  .nm-link-big{min-height:44px;padding:12px 14px;border-radius:12px;font-size:15px}
  .nm-link-big.cta{margin:8px 6px 0;padding:12px 16px}
  .nav-scrim{display:none;inset:calc(66px + env(safe-area-inset-top)) 0 0;opacity:1;visibility:visible;pointer-events:auto;transition:none;
    background:rgba(18,20,30,.24);-webkit-backdrop-filter:none;backdrop-filter:none}
  body.menu-open .nav-scrim{display:block;opacity:1;visibility:visible;transition:none}
}

/* Grain belongs to colored controls. White, black and clear controls stay clean. */
:where(.btn-primary,.nav-cta,.nm-link-big.cta,.form-submit,.pk-pri button.is-on,.avc-send,.avc-mic.is-live,.wrap>.home){position:relative;isolation:isolate}
:is(.btn-primary,.nav-cta,.nm-link-big.cta,.form-submit,.pk-pri button.is-on,.avc-send,.avc-mic.is-live,.wrap>.home):not(:disabled)::after{
 content:"";position:absolute;inset:0;width:auto;height:auto;border-radius:inherit;
 background:var(--averya-grain-overlay);mix-blend-mode:overlay;opacity:1;filter:grayscale(1);
 transform:none;transition:none;animation:none;pointer-events:none;z-index:1;
}
body:has(.hero-cover) .nav:not(.scrolled) .nav-cta::after{content:none}
@media(forced-colors:active){:is(.btn-primary,.nav-cta,.nm-link-big.cta,.form-submit,.pk-pri button.is-on,.avc-send,.avc-mic.is-live,.wrap>.home)::after{display:none}}

/* One cyan-to-violet grain finish for the booking panels across every page. */
:root{--averya-closing-paint:var(--averya-paint-noise),
 radial-gradient(ellipse at 0% 0%,rgba(103,232,249,.6),transparent 58%),
 linear-gradient(180deg,rgba(20,54,166,0),rgba(32,19,87,.34)),
 linear-gradient(115deg,#075985 0%,#2563EB 36%,#8B5CF6 70%,#5B21B6 100%)}
.schedule-card,.averya-blue-grain{background:var(--averya-closing-paint);background-color:#5B21B6;background-blend-mode:overlay,normal,normal,normal}

/* Neutral static grain for colored page, section and component backgrounds. */
:root{--averya-surface-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)' opacity='.5'/%3E%3C/svg%3E")}
