/* ============================================================
   Quantova — refined glass finish (corporate, subtle)
   Loaded last. To disable: remove the glass.css <link> in
   includes/head.php (after home-restore.css). Nothing else depends on it.
   ============================================================ */

/* ---------- Tokens: frosted white on light sections, smoked glass on dark ---------- */
:root{
  --g-bg:linear-gradient(150deg,rgba(255,255,255,.92),rgba(255,255,255,.70));
  --g-bd:rgba(255,255,255,.95);
  --g-ring:rgba(18,32,51,.08);
  --g-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 0 0 1px rgba(18,32,51,.06),0 16px 36px -18px rgba(18,32,51,.22);
  --g-shadow-hover:0 1px 0 rgba(255,255,255,.95) inset,0 0 0 1px rgba(245,102,40,.28),0 24px 48px -20px rgba(18,32,51,.30);
  --g-blur:saturate(165%) blur(16px);
}
.nav,.footer,.breadcrumb,.q-home-hero,.q-page-hero,.q-detail-hero,.q-catalog-intro,.q-about-intro,.q-dark,.section-dark{
  --g-bg:linear-gradient(150deg,rgba(255,255,255,.085),rgba(255,255,255,.03));
  --g-bd:rgba(255,255,255,.13);
  --g-ring:rgba(0,0,0,.35);
  --g-shadow:0 1px 0 rgba(255,255,255,.10) inset,0 0 0 1px rgba(255,255,255,.07),0 20px 44px -22px rgba(0,0,0,.75);
  --g-shadow-hover:0 1px 0 rgba(255,255,255,.14) inset,0 0 0 1px rgba(245,102,40,.40),0 26px 52px -22px rgba(0,0,0,.85);
  --g-blur:saturate(150%) blur(18px);
}

/* ---------- Ambient colour behind the glass (very soft) ---------- */
body .q-section:not(.q-dark):not(.section-dark),
body .section:not(.section-dark),
body .q-industries-bar{
  background-image:
    radial-gradient(45% 50% at 96% 0%,rgba(245,102,40,.04),transparent 70%),
    radial-gradient(45% 50% at 2% 100%,rgba(70,110,200,.04),transparent 72%);
}
body .q-dark,body .section-dark{
  background-image:
    radial-gradient(55% 70% at 90% 0%,rgba(245,102,40,.13),transparent 70%),
    radial-gradient(50% 60% at 6% 100%,rgba(60,100,190,.12),transparent 72%);
}

/* ---------- Header and menus: solid dark (as before) with a fine glass edge ----------
   The page behind the header is light, so the header must stay (almost) opaque,
   otherwise it turns grey. Only a thin highlight and a soft shadow are added. */
html body .nav{
  background:#0b0d12!important;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 10px 28px -16px rgba(0,0,0,.55);
}
html body .nav.scrolled{background:rgba(11,13,18,.97)!important;-webkit-backdrop-filter:saturate(170%) blur(14px);backdrop-filter:saturate(170%) blur(14px)}
body .mega-menu{
  background:linear-gradient(160deg,#1a1f29,#12151c);
  border:1px solid rgba(255,255,255,.12);border-radius:14px;
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 28px 56px -18px rgba(0,0,0,.7);
}
body .mega-item a{border-radius:8px;transition:background .2s,color .2s}
body .mega-item a:hover{background:rgba(255,255,255,.07)}
@media(max-width:1150px){
  html body .nav-links{
    background:#0b0d12!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    box-shadow:0 30px 50px -24px rgba(0,0,0,.8);
  }
  body .hamburger{border-radius:12px}
}

/* ---------- Cards and panels: glass surfaces ---------- */
body .q-card,body .q-info-card,body .q-proof-card,body .q-job-card,body .svc-cap-card,
body .q-form-panel,body .q-about-values-panel,body .q-zen-card,
body .qs-card,body .qs-cap-card,body .qs-project-details>div,body .qs-delivery,body .qs-extra .svc-section,
body .qs-faq details,body .qs-process li{
  background:var(--g-bg);
  border:1px solid var(--g-bd);
  box-shadow:var(--g-shadow);
  transition:transform .35s cubic-bezier(.22,.68,.3,1),box-shadow .35s,border-color .3s,background .3s;
}
body .q-card,body .q-form-panel,body .q-about-values-panel,body .q-zen-card,body .qs-card{border-radius:18px}
body .q-form-panel,body .q-zen-card{-webkit-backdrop-filter:var(--g-blur);backdrop-filter:var(--g-blur)}
body .q-card-links a{border-radius:999px}

/* Industry chips (motion.css forces solid grey, so override with !important) */
body .q-industries-motion .q-industry-links a,body .q-industry-links a{
  background:var(--g-bg)!important;border:1px solid var(--g-bd)!important;box-shadow:var(--g-shadow);
}
body .q-industries-motion .q-industry-links a:hover,body .q-industry-links a:hover{box-shadow:var(--g-shadow-hover);border-color:rgba(245,102,40,.45)!important}

/* Process page rows are stacked (sticky) on top of each other, so they stay
   opaque; only a fine edge highlight is added. */
body .page-process .q-process-row{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 26px 65px rgba(18,21,28,.12)!important}

@media(hover:hover){
  body .q-card:hover,body .q-card:focus-within,body .qs-card:hover,body .q-info-card:hover,body .q-proof-card:hover,body .q-job-card:hover{
    transform:translateY(-4px);box-shadow:var(--g-shadow-hover);border-color:rgba(245,102,40,.35);
  }
}
@media(hover:none){
  body .q-card:active,body .qs-card:active,body .btn-primary:active{transform:scale(.985)}
}

/* ---------- Buttons ---------- */
body .btn-primary,body .qs-button{
  background-image:linear-gradient(180deg,#ff8a4c 0%,#f56628 58%,#e25a1c 100%);
  border-color:rgba(255,255,255,.28);
  box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 -1px 0 rgba(0,0,0,.12) inset,0 10px 22px -10px rgba(245,102,40,.65);
  transition:transform .25s cubic-bezier(.22,.68,.3,1),box-shadow .25s,filter .25s;
}
body .btn-primary:hover,body .qs-button:hover{
  filter:brightness(1.05);
  box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 -1px 0 rgba(0,0,0,.12) inset,0 16px 28px -12px rgba(245,102,40,.75);
}
@media(hover:hover){body .btn-primary:hover,body .qs-button:hover{transform:translateY(-2px)}}
body .btn-ghost,body .btn-ghost-dark{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset;
}
body .btn-ghost:hover,body .btn-ghost-dark:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}

/* ---------- Forms: soft focus glow ---------- */
body .form-group input,body .form-group textarea,body .form-group select{
  border-radius:12px;transition:border-color .25s,box-shadow .25s,background .25s;
}
body .form-group input:focus,body .form-group textarea:focus,body .form-group select:focus{
  border-color:var(--accent);box-shadow:0 0 0 4px rgba(245,102,40,.18);
}

/* ---------- Footer ---------- */
body .footer{
  border-top:1px solid rgba(255,255,255,.08);
  background-image:radial-gradient(60% 80% at 85% 0%,rgba(245,102,40,.10),transparent 70%),radial-gradient(50% 70% at 5% 100%,rgba(60,100,190,.10),transparent 72%);
}
body .footer-hover-line{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);border-radius:14px;
  padding:14px 18px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
}

/* ---------- Imagery: rounded, soft depth ---------- */
body .qs-hero-art img,body .q-about-photo img,body .q-zen-visual img,body .q-card-image img{border-radius:inherit}
body .qs-hero-art,body .q-about-photo,body .q-zen-visual{border-radius:20px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.10),0 30px 60px -28px rgba(0,0,0,.55)}
body .q-card-image,body .qs-card-art{border-top-left-radius:inherit;border-top-right-radius:inherit}

/* ---------- Polish ---------- */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
::selection{background:rgba(245,102,40,.9);color:#fff}

/* ---------- Mobile: lighter blur for speed ---------- */
@media(max-width:700px){
  :root,.nav,.footer,.q-dark,.section-dark{--g-blur:saturate(150%) blur(10px)}
  body .q-card,body .qs-card,body .qs-cap-card{border-radius:16px}
}

/* ---------- Older browsers without backdrop-filter: solid, still tidy ---------- */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body .q-form-panel,body .q-zen-card{background:#fff}
  body .footer-hover-line,body .btn-ghost,body .btn-ghost-dark{background:rgba(255,255,255,.08)}
}

/* ---------- Respect reduced-motion ---------- */
@media(prefers-reduced-motion:reduce){
  body .q-card,body .qs-card,body .btn-primary,body .qs-button{transition:none}
  body .q-card:hover,body .qs-card:hover,body .btn-primary:hover{transform:none}
}

/* ---------- Page hero (Careers, Contact, Process, Technologies ...): balanced size ---------- */
html body .q-motion-page-hero{min-height:clamp(430px,58svh,600px);padding:48px 0}
html body .q-motion-page-hero .q-hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,4.5vw,72px);align-items:center}
html body .q-motion-page-hero .q-title-mask h1{font-size:clamp(36px,3.9vw,54px);line-height:1.1;letter-spacing:-.035em;margin-bottom:20px}
html body .q-motion-page-hero .q-hero-copy p{font-size:clamp(16px,1.15vw,18px);line-height:1.7;max-width:540px;margin-bottom:24px}
html body .q-motion-page-hero .q-hero-image-shell{aspect-ratio:16/10;max-height:440px;width:100%;border-radius:20px;
  box-shadow:0 0 0 1px rgba(255,255,255,.10),0 30px 60px -28px rgba(0,0,0,.8);
  clip-path:inset(0 100% 0 0 round 20px);animation-name:q-media-unmask-soft}
@keyframes q-media-unmask-soft{from{clip-path:inset(0 100% 0 0 round 20px)}to{clip-path:inset(0 0 0 0 round 20px)}}
html body .page-index .q-motion-home-hero .q-home-copy h1{letter-spacing:-.04em}
@media(max-width:1000px){
  html body .q-motion-page-hero{min-height:0;padding:40px 0}
  html body .q-motion-page-hero .q-hero-grid{grid-template-columns:1fr;gap:28px}
  html body .q-motion-page-hero .q-hero-image-shell{max-height:360px}
}
@media(max-width:700px){
  html body .q-motion-page-hero{padding:32px 0}
  html body .q-motion-page-hero .q-title-mask h1{font-size:clamp(32px,9vw,42px)}
  html body .q-motion-page-hero .q-hero-image-shell{border-radius:16px;max-height:260px}
}
@media(prefers-reduced-motion:reduce){html body .q-motion-page-hero .q-hero-image-shell{clip-path:none;animation:none}}

/* =============================================================
   Quantova premium frosted-glass finish — visible, accessible,
   light corporate palette. All approved images remain unchanged.
   ============================================================= */
:root {
  --q-frost-surface: linear-gradient(148deg, rgba(255,255,255,.90) 0%, rgba(250,251,254,.78) 48%, rgba(246,249,253,.66) 100%);
  --q-frost-stroke: rgba(255,255,255,.95);
  --q-frost-depth: 0 1px 0 rgba(255,255,255,1) inset, 0 0 0 1px rgba(44,57,79,.085), 0 14px 36px -19px rgba(35,48,69,.27), 0 38px 65px -48px rgba(245,102,40,.27);
  --q-frost-lift: 0 1px 0 rgba(255,255,255,1) inset, 0 0 0 1px rgba(245,102,40,.22), 0 23px 46px -20px rgba(31,44,64,.32), 0 44px 80px -44px rgba(245,102,40,.30);
}

/* The original glass layer was ~90% flat white and lacked visible
   light sources behind the cards. These subtle accents create real
   transmitted depth without making the text hazy or low-contrast. */
body.q-site {
  background-color:#f8fafc;
  background-image:radial-gradient(ellipse 44% 28% at 8% 15%,rgba(255,192,159,.14),transparent 85%),radial-gradient(ellipse 50% 42% at 94% 35%,rgba(131,157,207,.12),transparent 85%);
  background-attachment:fixed;
}
body .q-home-services,body .q-stack-bar,body .q-industries-bar,
body .qs-catalog,body .qs-capabilities,body .qs-project-details,
body .q-about-values,body .q-section:not(.q-dark):not(.q-home-hero) {
  position:relative;
  isolation:isolate;
  background-image:radial-gradient(ellipse 48% 56% at 98% 12%,rgba(245,102,40,.075),transparent 77%),radial-gradient(ellipse 42% 54% at 1% 96%,rgba(117,160,219,.085),transparent 81%);
}
body .q-home-services>.container,body .qs-catalog>.qs-card-grid{position:relative;z-index:1}

/* Frosted edge, restrained highlight and responsive depth. */
body .q-card,body .q-info-card,body .q-proof-card,body .q-job-card,
body .q-about-values-panel,body .q-form-panel,body .q-zen-card,
body .qs-card,body .qs-cap-card,body .qs-project-details>div,
body .qs-delivery,body .qs-extra .svc-section,body .qs-faq details,
body .qs-process li {
  background:var(--q-frost-surface);
  border:1px solid rgba(211,218,230,.76);
  box-shadow:var(--q-frost-depth);
  -webkit-backdrop-filter:saturate(145%) blur(12px);
  backdrop-filter:saturate(145%) blur(12px);
  transition:transform .35s cubic-bezier(.2,.7,.24,1),box-shadow .35s,border-color .3s,background .3s;
}
body .q-card,body .q-zen-card,body .q-about-values-panel,body .qs-card{border-radius:20px}
/* Fine light-catching line at the top of ordinary content cards. */
body .q-card::before,body .qs-card::before,body .q-zen-card::before {
  content:"";position:absolute;top:0;left:12%;right:12%;height:1px;
  pointer-events:none;z-index:3;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.98) 26%,rgba(255,255,255,.98) 74%,transparent);
}
body .q-card,body .qs-card,body .q-zen-card{position:relative;isolation:isolate}
body .qs-card::before{left:7%;right:7%}
body .q-card-image,body .qs-card-art{position:relative;overflow:hidden;isolation:isolate}
body .q-card-image::after,body .qs-card-art::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(165deg,rgba(255,255,255,.18),transparent 35%,transparent 70%,rgba(0,0,0,.07));opacity:.55;
}
body .q-card-image img,body .qs-card-art img{filter:none!important;image-rendering:auto}
body .qs-card-body,body .q-card-copy{position:relative;z-index:1}

/* More polished CTA and visual cues without creating fake glass-like icons. */
body .qs-text-link span,body .q-card-links a,body .q-link span{transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
body .qs-text-link span{box-shadow:0 1px 0 rgba(255,255,255,.92) inset,0 3px 10px rgba(245,102,40,.10)}
body .qs-text-link:hover span{transform:translateX(3px)}
body .qs-tabs a,body .qs-service-menu summary{
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 4px 14px rgba(28,43,68,.055);
}
body .qs-tabs a[aria-current=page]{background:#f56628;box-shadow:0 4px 14px rgba(245,102,40,.18);color:#161616}
body .q-zen-card,body .q-about-values-panel{
  background:linear-gradient(125deg,rgba(255,255,255,.88),rgba(241,247,255,.66) 64%,rgba(255,241,232,.67));
}
body .q-stack-grid>div{
  padding:20px 22px;border-radius:16px;border:1px solid rgba(214,222,233,.75);
  background:linear-gradient(145deg,rgba(255,255,255,.80),rgba(249,251,255,.64));
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 12px 25px -19px rgba(30,44,60,.24);
}
@media(hover:hover) {
  body .q-card:hover,body .qs-card:hover,body .q-zen-card:hover,
  body .q-info-card:hover,body .q-proof-card:hover,body .q-job-card:hover,
  body .qs-cap-card:hover,body .qs-process li:hover,body .qs-project-details>div:hover,
  body .qs-delivery:hover,body .qs-faq details:hover {
    box-shadow:var(--q-frost-lift);border-color:rgba(245,102,40,.35);
    transform:translateY(-5px);
  }
}
body a:focus-visible,body button:focus-visible,body summary:focus-visible{
  outline:3px solid #f56628;outline-offset:3px;
}
/* Preserve image contrast; only the card shell receives translucency. */
body .qs-hero-art,body .q-hero-image-shell,body .q-zen-visual{
  box-shadow:0 0 0 1px rgba(255,255,255,.9),0 0 0 2px rgba(44,57,79,.09),0 24px 50px -27px rgba(31,43,60,.45);
}
body .footer-hover-line{background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.17)}

@media(max-width:700px){
  body.q-site{background-attachment:scroll}
  body .q-card,body .qs-card,body .qs-cap-card,body .q-zen-card{border-radius:16px}
  body .q-stack-grid>div{padding:17px 18px}
  body .q-card,body .qs-card,body .qs-cap-card{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
}
@media(prefers-reduced-motion:reduce){
  body .q-card,body .qs-card,body .q-zen-card,body .qs-cap-card{transition:none}
  body .q-card:hover,body .qs-card:hover,body .q-zen-card:hover,body .qs-cap-card:hover{transform:none}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body .q-card,body .qs-card,body .qs-cap-card,body .q-zen-card,body .q-form-panel{background:#fff}
}
