/* QH Trust widgets — qhbeta5 brand + Monaco dark. Prefix --qhw-* (site already uses --qh-*). */
:root{
  --qhw-section-y:80px;
  --qhw-bg:#000;
  --qhw-bg-header:#111;
  --qhw-surface:#0d0d0f;
  --qhw-surface-2:#1a1a1a;
  --qhw-surface-3:#292929;
  --qhw-border:rgba(255,255,255,.10);
  --qhw-border-strong:rgba(255,255,255,.18);
  --qhw-text:#fff;
  --qhw-text-body:#b8bcc4;
  --qhw-text-muted:rgba(255,255,255,.62);
  --qhw-accent:#fff;
  --qhw-accent-soft:#d0d0d0;
  --qhw-accent-glow:rgba(255,255,255,.14);
  --qhw-font-head:"DM Sans","Inter Tight","Inter",system-ui,sans-serif;
  --qhw-font-body:"Inter",system-ui,sans-serif;
  --qhw-font-ui:"Roboto","Inter",system-ui,sans-serif;
  --qhw-radius-btn:10px;
  --qhw-radius-card:20px;
  --qhw-container:1200px;
  --qhw-ease:cubic-bezier(.25,.46,.45,.94);
  --qhw-ease-ui:cubic-bezier(.23,1,.32,1);
}

html:has(.qhw-hero),
body:has(.qhw-hero),
body:has(.qhw-hero) .elementor,
body:has(.qhw-hero) .elementor-section,
body:has(.qhw-hero) .elementor-element.e-con,
body:has(.qhw-hero) .site,
body:has(.qhw-hero) #page,
body:has(.qhw-hero) .elementor-widget-wrap{
  background:var(--qhw-bg)!important;
}
html:has(.qhw-hero),
body:has(.qhw-hero){
  color:var(--qhw-text-body);
}
body:has(.qhw-hero) .elementor-section,
body:has(.qhw-hero) .e-con,
body:has(.qhw-hero) .elementor-column,
body:has(.qhw-hero) .elementor-widget{
  --padding-top:0px;
  --padding-bottom:0px;
  --padding-left:0px;
  --padding-right:0px;
}

.qhw-hero,.qhw-arch,.qhw-catnav-wrap,.qhw-rows,.qhw-cta{font-family:var(--qhw-font-body);color:var(--qhw-text-body);font-size:16px;line-height:1.625;box-sizing:border-box;-webkit-font-smoothing:antialiased;background:var(--qhw-bg)}
.qhw-hero *,.qhw-arch *,.qhw-catnav-wrap *,.qhw-rows *,.qhw-cta *{box-sizing:border-box}
.qhw-hero img,.qhw-arch img,.qhw-cta img{max-width:100%;display:block}
.qhw-hero a,.qhw-arch a,.qhw-catnav a,.qhw-rows a,.qhw-cta a{text-decoration:none}
html:has(.qhw-catnav),
body:has(.qhw-catnav){scroll-behavior:smooth;scroll-padding-top:calc(var(--qhw-stick-top,0px) + var(--qhw-nav-h,60px) + 16px)}
.qhw-container{width:min(var(--qhw-container),100% - 48px);margin-inline:auto}

/* ---------- hero ---------- */
.qhw-hero{position:relative;width:100%;min-height:0;padding:var(--qhw-section-y,80px) 0;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;isolation:isolate;border-bottom:1px solid var(--qhw-border)}
.qhw-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3;opacity:.55}
.qhw-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(60% 55% at 50% 0%,var(--qhw-accent-glow),transparent 70%),linear-gradient(180deg,rgba(0,0,0,.35),#000 98%)}
.qhw-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--qhw-border) 1px,transparent 1px),linear-gradient(90deg,var(--qhw-border) 1px,transparent 1px);background-size:72px 72px;opacity:.35;-webkit-mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent);mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent)}
.qhw-hero h1,.qhw-hero .qhw-hero__title{margin:0;font:500 clamp(40px,2.2rem + 3.4vw,84px)/1.06 var(--qhw-font-head);letter-spacing:-.035em;color:#fff}
.qhw-hl{background:linear-gradient(100deg,#fff 0%,#c8c8c8 50%,#fff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.qhw-hero p{margin:28px auto 0;max-width:760px;font:400 clamp(17px,1rem + .45vw,22px)/1.5 var(--qhw-font-body);color:var(--qhw-text-body);letter-spacing:-.01em}

/* ---------- architecture ---------- */
.qhw-arch{padding:var(--qhw-section-y,80px) 0}
.qhw-arch__frame{display:block;position:relative;max-width:1040px;margin-inline:auto;padding:clamp(10px,2vw,22px);border-radius:var(--qhw-radius-card);background:#fff;border:1px solid var(--qhw-border-strong)}
.qhw-arch__frame img{width:100%;height:auto;border-radius:12px}

/* ---------- sticky category nav ---------- */
.qhw-catnav-wrap{position:relative;z-index:70}
/* Sticky: a sticky element can only travel inside its parent, and the nav's own
   Elementor wrapper is only as tall as the 64px bar, so it never stuck. The
   top-level Elementor section/container that holds the bar is a direct child of
   the page-tall .elementor wrapper, so that is what must be sticky. */
body:not(.elementor-editor-active) .elementor-top-section:has(.qhw-catnav-wrap:not([data-sticky="0"])),
body:not(.elementor-editor-active) .e-con.e-parent:has(.qhw-catnav-wrap:not([data-sticky="0"])){position:sticky;top:var(--qhw-stick-top,0px);z-index:70}
.qhw-catnav{position:relative;z-index:50;width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) 40px;align-items:center;gap:8px;padding:0 max(16px,calc((100% - var(--qhw-container)) / 2));background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-block:1px solid var(--qhw-border);transform:translateY(var(--qhw-nav-shift,0px));transition:opacity .2s ease}
.qhw-catnav button.qhw-catnav__arrow{appearance:none;-webkit-appearance:none;position:relative;width:36px;height:36px;min-width:36px;min-height:36px;margin:0;padding:0;border:1px solid rgba(255,255,255,.22)!important;border-radius:50%!important;background:transparent!important;background-image:none!important;box-shadow:none!important;color:#fff!important;line-height:0;cursor:pointer}
.qhw-catnav button.qhw-catnav__arrow::before{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff}
.qhw-catnav button.qhw-catnav__arrow.is-prev::before{transform:translate(-30%,-50%) rotate(45deg)}
.qhw-catnav button.qhw-catnav__arrow.is-next::before{transform:translate(-70%,-50%) rotate(-135deg)}
.qhw-catnav button.qhw-catnav__arrow:hover:not(:disabled){border-color:#fff!important;background:rgba(255,255,255,.08)!important}
.qhw-catnav button.qhw-catnav__arrow:disabled{opacity:.22;cursor:default}
.qhw-catnav__in{display:flex;align-items:center;gap:8px;overflow-x:auto;padding:12px 4px;scrollbar-width:none;min-width:0;scroll-padding-inline:16px}
.qhw-catnav__in::-webkit-scrollbar{display:none}
.qhw-chip{flex:0 0 auto;padding:8px 16px;border-radius:999px;border:1px solid var(--qhw-border);font:500 14px/20px var(--qhw-font-ui);color:var(--qhw-text-body);transition:background-color .15s,color .15s,border-color .15s,transform .16s var(--qhw-ease-ui);scroll-snap-align:none;scroll-margin-inline:32px}
.qhw-chip:hover{color:#fff;border-color:var(--qhw-border-strong)}
.qhw-chip.is-active{background:#fff;color:#000;border-color:#fff}
.qhw-chip:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* ---------- 12 rows ---------- */
.qhw-rows{padding:var(--qhw-section-y,80px) 0}
.qhw-row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,5vw,80px);padding:clamp(40px,5vw,72px) 0;border-top:1px solid var(--qhw-border);scroll-margin-top:calc(var(--qhw-stick-top,0px) + var(--qhw-nav-h,60px) + 16px)}
.qhw-row:last-child{border-bottom:1px solid var(--qhw-border)}
.qhw-row h2{margin:0;font:500 clamp(30px,1.5rem + 1.6vw,48px)/1.1 var(--qhw-font-head);letter-spacing:-.03em;color:#fff;position:sticky;top:calc(var(--qhw-stick-top,0px) + var(--qhw-nav-h,60px) + 16px);align-self:start;z-index:1;transform:none!important}
.qhw-row ul{margin:0;padding:0;list-style:none;display:grid;gap:0}
.qhw-row li{position:relative;padding:14px 0 14px 34px;border-bottom:1px solid rgba(255,255,255,.06);font:400 17px/1.5 var(--qhw-font-body);color:var(--qhw-text-body);transition:color .2s}
.qhw-row li:last-child{border-bottom:0}
.qhw-row li:hover{color:#fff}
.qhw-row li::before{content:"";position:absolute;left:0;top:19px;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.10) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 10.4l2.6 2.6L14 7.4'/%3E%3C/svg%3E") center/20px no-repeat;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}

/* ---------- CTA ---------- */
.qhw-cta{padding:var(--qhw-section-y,80px) 0}
.qhw-cta__card{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;align-items:center;padding:clamp(32px,6vw,88px);border-radius:28px;background:radial-gradient(80% 120% at 100% 0%,rgba(255,255,255,.12),transparent 60%),var(--qhw-surface);border:1px solid var(--qhw-border)}
.qhw-cta h2{margin:0 0 36px;font:500 clamp(28px,1.4rem + 1.6vw,50px)/1.12 var(--qhw-font-head);letter-spacing:-.03em;color:#fff}
.qhw-cta__img{justify-self:center;width:min(100%,360px)}

.qhw-catnav.is-done{opacity:0;pointer-events:none}
body:has(.qhw-catnav) .elementor,
body:has(.qhw-catnav) .e-con,
body:has(.qhw-catnav) .e-con-inner,
body:has(.qhw-catnav) .elementor-widget,
body:has(.qhw-catnav) .elementor-widget-wrap,
body:has(.qhw-catnav) .page_wrap,
body:has(.qhw-catnav) .page_content_wrap,
body:has(.qhw-catnav) .content_wrap{
  overflow:visible !important;
}
.qhw-rows,.qhw-cta,.qhw-arch{background:var(--qhw-bg)}

/* ---------- scroll reveal ---------- */
.qhw-js .qhw-reveal{opacity:0;transform:translateY(24px)}
.qhw-js .qhw-reveal--scale{transform:scale(.96)}
.qhw-js .qhw-reveal.is-visible{animation:qhw-fade-up .7s var(--qhw-ease) var(--qhw-delay,0s) forwards}
.qhw-js .qhw-reveal--scale.is-visible{animation-name:qhw-scale-in;animation-duration:.9s}
.qhw-js .qhw-chip.qhw-reveal.is-visible{animation-name:qhw-fade-up}
.elementor-editor-active .qhw-reveal{opacity:1!important;transform:none!important;animation:none!important}
@keyframes qhw-fade-up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes qhw-scale-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.qhw-reveal{opacity:1!important;transform:none!important;animation:none!important}html:has(.qhw-catnav){scroll-behavior:auto}.qhw-hero__video{display:none}}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .qhw-row{grid-template-columns:1fr;gap:20px}
  .qhw-row h2{position:static}
  .qhw-cta__card{grid-template-columns:1fr}
  .qhw-cta__img{width:200px;justify-self:start}
  html:has(.qhw-catnav){scroll-padding-top:calc(var(--qhw-stick-top,0px) + var(--qhw-nav-h,60px) + 12px)}
}
@media (max-width:767px){
  :root{--qhw-section-y:50px}
}
@media (max-width:640px){
  .qhw-container{width:min(var(--qhw-container),100% - 32px)}
  .qhw-hero{min-height:auto}
  .qhw-row li{font-size:16px;padding-left:30px}
  .qhw-btn--lg{width:100%}
  .qhw-catnav{grid-template-columns:32px minmax(0,1fr) 32px;gap:6px;padding:0 12px}
  .qhw-catnav button.qhw-catnav__arrow{width:32px;height:32px;min-width:32px;min-height:32px}
  .qhw-catnav__in{padding:10px 2px}
}

/* ---------- buttons (qhbeta5) ---------- */
.qhw-btn{display:inline-flex;align-items:center;justify-content:center;font:500 16px/19px var(--qhw-font-ui);padding:15px 30px;border-radius:var(--qhw-radius-btn);border:0;cursor:pointer;transition:background-color .15s,transform .16s var(--qhw-ease-ui);white-space:nowrap}
.qhw-btn:active{transform:scale(.97)}
.qhw-btn--light{background:#fff;color:#000}
.qhw-btn--light:hover{background:#e9e9e9;color:#000}
.qhw-btn--lg{padding:18px 40px}
.qhw-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}