/* WiQuall glass: clear controls above quieter, readable content surfaces. */
:root{
  color-scheme:light;
  --bg:#EDF2F5;--surface:#FAFDFD;--surface2:#E1EBEF;--ink:#102738;--muted:#4C6373;
  --line:#C5D4DC;--a1:#175486;--a2:#34785E;--label:#2D6C55;--on-accent:#FFFFFF;
  --ribbon-alpha:.055;
  --glass-control:#FFFFFF80;--glass-panel:#FFFFFF91;--glass-soft:#F9FCFCD9;--glass-input:#FFFFFFA6;
  --glass-line:#FFFFFFB3;--glass-edge:#FFFFFFD9;--glass-separator:#8AA7BA40;
  --glass-shadow:0 12px 38px #163C5414,inset 0 1px 0 #FFFFFFE6,inset 0 -1px 0 #A8BDCC38;
  --glass-raised:0 22px 60px #163C5424,inset 0 1px 0 #FFFFFF;
  --glass-blur:28px;--glass-glow:#FFFFFF70;--ambient-blue:#B8D6F25E;--ambient-green:#A3D5C344;
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#07131F;--surface:#112332;--surface2:#193141;--ink:#E5EFF7;--muted:#AFC1D1;
    --line:#345062;--a1:#8DBFEB;--a2:#83D3B4;--label:#92DABB;--on-accent:#081825;--err:#FFADA6;
    --ribbon-alpha:.08;
    --glass-control:#243C507D;--glass-panel:#172D3FAD;--glass-soft:#102433E0;--glass-input:#203A4C9C;
    --glass-line:#BBDBF12E;--glass-edge:#E2F4FF40;--glass-separator:#BBDBF124;
    --glass-shadow:0 14px 44px #00000038,inset 0 1px 0 #DEEDFF24,inset 0 -1px 0 #00000038;
    --glass-raised:0 24px 66px #00000055,inset 0 1px 0 #DEEDFF40;
    --glass-glow:#C7E6FF24;--ambient-blue:#244E855C;--ambient-green:#1E675333;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#07131F;--surface:#112332;--surface2:#193141;--ink:#E5EFF7;--muted:#AFC1D1;
  --line:#345062;--a1:#8DBFEB;--a2:#83D3B4;--label:#92DABB;--on-accent:#081825;--err:#FFADA6;
  --ribbon-alpha:.08;
  --glass-control:#243C507D;--glass-panel:#172D3FAD;--glass-soft:#102433E0;--glass-input:#203A4C9C;
  --glass-line:#BBDBF12E;--glass-edge:#E2F4FF40;--glass-separator:#BBDBF124;
  --glass-shadow:0 14px 44px #00000038,inset 0 1px 0 #DEEDFF24,inset 0 -1px 0 #00000038;
  --glass-raised:0 24px 66px #00000055,inset 0 1px 0 #DEEDFF40;
  --glass-glow:#C7E6FF24;--ambient-blue:#244E855C;--ambient-green:#1E675333;
}
/* Clip decorative borders and reveal masks at the viewport, without a new scroll container. */
html{overflow-x:clip}
body{
  margin-block:0;
  overflow-x:clip;
  background-color:var(--bg);
  background-image:radial-gradient(ellipse at 8% 6%,var(--ambient-blue),transparent 48%),radial-gradient(ellipse at 95% 28%,var(--ambient-green),transparent 46%);
  background-attachment:fixed;color:var(--ink);
}
.hero h1{hyphens:none}
/* Keep the opening copy close to the dock, with deliberate space for its expansion. */
body.wq-mobile-ready #home>.hero.wq-hero-particles>div:first-child{min-width:0;max-width:100%}
@media screen and (min-width:1200px){
  body.wq-mobile-ready #home>.hero.wq-hero-particles{align-items:start;padding-block:30px 36px}
  html[data-dock-placement="tr"] body.wq-mobile-ready #home>.hero.wq-hero-particles{margin-top:-52px;padding-top:0}
  body.wq-mobile-ready #home>.hero.wq-hero-particles>.seal.wq-seal-enhanced{margin-block:64px 0}
}
@media screen and (min-width:861px) and (max-width:1199px){
  body.wq-mobile-ready #home>.hero.wq-hero-particles{align-items:start;padding-block:24px 32px}
  body.wq-mobile-ready #home>.hero.wq-hero-particles>.seal.wq-seal-enhanced{margin-block:24px 0}
}
@media screen and (max-width:860px){
  body.wq-mobile-ready #home>.hero.wq-hero-particles{padding-block:12px 36px}
}
/* On a phone the actions and the cropped network share one row. */
@media screen and (max-width:760px){
  body.wq-mobile-ready #home>.hero.wq-hero-compact{
    display:grid;grid-template-columns:minmax(0,1fr);gap:12px;
    margin-top:0;padding-block:8px 24px;
  }
  body.wq-mobile-ready #home>.hero.wq-hero-compact>div:first-child{z-index:2}
  .wq-hero-compact .eyebrow{font-size:clamp(.55rem,1.85vw,.68rem);letter-spacing:.14em}
  .wq-hero-compact .lead{margin-bottom:0}
  .wq-mobile-hero-actions{position:relative;min-width:0;min-height:220px;isolation:isolate}
  .wq-mobile-hero-buttons{position:relative;z-index:3;width:52%;max-width:280px;padding-top:8px}
  .wq-mobile-hero-buttons .cta{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin:0}
  .wq-mobile-hero-buttons .cta .btn{
    display:flex;flex:none;width:100%;min-width:0;min-height:46px;padding:12px 10px;
    justify-content:center;gap:8px;font-size:clamp(.75rem,2.6vw,.92rem);line-height:1.25;
    white-space:normal;text-align:center;
  }
  .wq-mobile-hero-buttons .cta .btn svg{width:16px;height:16px;flex-shrink:0}
  .wq-mobile-hero-buttons .hire{margin:16px 0 0;font-size:clamp(.62rem,2vw,.76rem);line-height:1.6}
  body.wq-mobile-ready #home>.hero.wq-hero-compact>.wq-mobile-hero-actions>.seal.wq-seal-enhanced{
    position:absolute;inset:0 -30px auto auto;display:grid;place-items:center;
    width:clamp(210px,42vw,250px);max-width:none;height:220px;aspect-ratio:auto;margin:0;
  }
  body.wq-mobile-ready #home>.hero.wq-hero-compact .seal.wq-seal-enhanced>img{
    width:clamp(142px,30vw,184px);max-width:none;
  }
  #about>.about>.wq-mobile-profile{
    display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:14px;
    align-items:stretch;min-width:0;
  }
  #about .wq-mobile-profile>.photo{width:100%;min-width:0;margin:0;align-self:start}
  #about .wq-mobile-profile>.photo::before{inset:8px -5px -8px 5px;border-radius:22px 70px 22px 70px}
  #about .wq-mobile-profile>.photo>img{width:100%;height:auto;aspect-ratio:4/5;min-height:210px;object-fit:cover;border-radius:22px 70px 22px 70px}
  #about .wq-mobile-profile>.facts{
    display:grid;grid-template-columns:minmax(0,1fr);align-self:start;width:100%;min-width:0;
    margin:0;border-radius:20px;
  }
  #about .wq-mobile-profile>.facts>div{
    display:grid;gap:4px;padding:12px 11px;border:0;border-top:1px solid var(--glass-separator);min-width:0;
  }
  #about .wq-mobile-profile>.facts>div:first-child{border-top:0}
  #about .wq-mobile-profile>.facts small{font-size:clamp(.49rem,1.55vw,.62rem);line-height:1.2;letter-spacing:.12em}
  #about .wq-mobile-profile>.facts b{font-size:clamp(.70rem,2.25vw,.91rem);line-height:1.45;overflow-wrap:anywhere}
  #about .about{gap:28px}
}
@media screen and (max-width:380px){
  .wq-mobile-hero-buttons{width:53%}
  body.wq-mobile-ready #home>.hero.wq-hero-compact>.wq-mobile-hero-actions>.seal.wq-seal-enhanced{right:-36px}
  #about>.about>.wq-mobile-profile{gap:11px}
  #about .wq-mobile-profile>.facts>div{padding:10px 8px}
}
@media print{
  .wq-mobile-hero-actions{display:contents}
  .wq-mobile-profile{display:contents}
}
/* Navigation is a floating, refractive layer; its controls stay distinct. */
header.top{
  top:max(10px,env(safe-area-inset-top,0px));width:min(1120px,100%);margin:12px auto 0;
  border:1px solid var(--glass-line);border-radius:30px;background:var(--glass-control);
  backdrop-filter:blur(var(--glass-blur)) saturate(160%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(160%);
  box-shadow:var(--glass-shadow);
}
header.top .bar{padding:9px 16px}
.brand img{box-shadow:0 2px 10px #123E5718}
nav.main a{transition:background .25s,color .25s,box-shadow .25s}
nav.main a:hover,nav.main a.on,nav.main a[aria-current="page"]{background:var(--glass-input);box-shadow:inset 0 1px 0 var(--glass-edge);color:var(--ink)}
.lang,.icon-btn,.copy,.btn.ghost,.back{
  background:var(--glass-control);border-color:var(--glass-line);color:var(--ink);
  box-shadow:0 3px 14px #102E4310,inset 0 1px 0 var(--glass-edge);
  backdrop-filter:blur(18px) saturate(155%);-webkit-backdrop-filter:blur(18px) saturate(155%);
}
.lang{border-radius:999px}
.lang button,.lang a{color:var(--muted)}
.lang button[aria-pressed="true"],.lang a[aria-current="page"]{box-shadow:0 2px 8px #092F4726,inset 0 1px 0 #FFFFFF40}
.btn.primary{box-shadow:0 7px 20px color-mix(in srgb,var(--a1) 18%,transparent),inset 0 1px 0 #FFFFFF4D}
.icon-btn:hover,.copy:hover,.btn.ghost:hover{background:var(--glass-input);box-shadow:var(--glass-shadow);border-color:var(--glass-edge)}
.btn:active,.icon-btn:active,.copy:active{scale:.97}
html{scroll-padding-top:calc(var(--hdr,64px) + 26px)}
section{scroll-margin-top:calc(var(--hdr,64px) + 26px)}
/* Text-rich material is quieter and more opaque than the controls. */
.card,.vcard,.case,.case-full,.emp{
  background:var(--glass-soft);color:var(--ink);border-color:var(--glass-separator);
  border-radius:26px;box-shadow:0 7px 28px #102E430A,inset 0 1px 0 var(--glass-edge);
}
.card:hover,.vcard:hover,.case:hover,.case:focus-within,.case.open{border-color:color-mix(in srgb,var(--a2) 52%,var(--glass-line));box-shadow:var(--glass-shadow)}
.vcard{isolation:isolate}.vcard>div{background:var(--glass-soft)}
.case-top{background:var(--glass-soft);border-radius:0 0 25px 25px}
.case-media{border-radius:25px 25px 0 0}
.case-full::before{background:var(--surface);border-color:var(--a2)}
.chips span,.tag{background:var(--glass-panel);border-color:var(--glass-separator);color:var(--ink);box-shadow:inset 0 1px 0 var(--glass-edge)}
.tag{color:var(--label)}
.facts{border-radius:22px;border:1px solid var(--glass-separator);background:var(--glass-panel);box-shadow:inset 0 1px 0 var(--glass-edge);overflow:hidden}
.facts div:first-child{padding-left:18px}.facts div{border-color:var(--glass-separator)}
.facts div:nth-child(3){padding-left:18px}
.cform input[type=text],.cform input[type=email],.cform textarea{
  background:var(--glass-input);border-color:var(--glass-separator);color:var(--ink);border-radius:16px;
  box-shadow:inset 0 1px 3px #092A4310,0 1px 0 var(--glass-edge);
}
.cform input::placeholder,.cform textarea::placeholder{color:var(--muted);opacity:.85}
.cform [aria-invalid="true"]{border-color:var(--err)}
.cform .consent input{accent-color:var(--a2)}
.faq details{border-color:var(--glass-separator)}
.faq details[open]{background:var(--glass-panel);border-radius:20px;padding-left:18px;padding-right:18px;margin:6px -18px;box-shadow:inset 0 1px 0 var(--glass-edge)}
.rows,.rows>div,footer{border-color:var(--glass-separator)}
.legal{background:var(--glass-soft);border:1px solid var(--glass-separator);border-radius:28px;padding:clamp(24px,4vw,48px);margin-top:30px;box-shadow:var(--glass-shadow)}
.legal[hidden]{display:none}
.back{border:1px solid var(--glass-line);padding:9px 14px;border-radius:999px}
/* Focus and media treatment follow the same theme tokens. */
:focus-visible{outline-color:var(--a2);outline-offset:4px}
.wq-video-shell,.wq-video-shell video{background:var(--surface2)}
.wq-play-label,.wq-video-duration,.wq-video-error{
  color:var(--ink);background:var(--glass-control);border-color:var(--glass-line);
  box-shadow:0 3px 14px #102E4314,inset 0 1px 0 var(--glass-edge);
  backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);
}
.wq-play-icon{color:var(--on-accent);background:var(--grad);border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow)}
.wq-video-error{background:var(--surface)}
@media(max-width:1100px){
  header.top{border-radius:25px}
  header.top .bar{padding:6px 10px;gap:8px;flex-wrap:nowrap}
  header.top .brand{gap:8px;flex:0 1 auto;min-width:32px}
  header.top .brand img{flex:0 0 32px}
  header.top .bar .ctrl{flex:0 0 auto;gap:5px}
  header.top .bar .ctrl>.icon-btn{width:36px;height:36px;flex:0 0 36px}
  header.top .bar .lang :is(button,a){min-height:30px;padding:6px 7px}
  header.top nav.main{
    position:absolute;left:auto;right:0;top:calc(100% + 9px);z-index:25;
    box-sizing:border-box;width:min(292px,calc(100vw - 48px));max-width:100%;
    max-height:calc(100dvh - var(--hdr,54px) - max(10px,env(safe-area-inset-top,0px)) - 36px);
    display:none;flex-direction:column;align-items:stretch;gap:3px;margin:0;padding:8px;
    overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:8px;
    border:1px solid var(--glass-line);border-radius:22px;
    background:color-mix(in srgb,var(--surface) 98%,transparent);
    backdrop-filter:blur(var(--glass-blur)) saturate(150%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(150%);
    box-shadow:var(--glass-raised);transform-origin:calc(100% - 25px) top;
  }
  header.top nav.main.open{display:flex;animation:wq-mobile-nav-in .2s cubic-bezier(.2,.8,.2,1) both}
  header.top nav.main a{
    display:flex;align-items:center;flex:0 0 auto;box-sizing:border-box;width:100%;min-height:44px;
    padding:10px 14px;border:1px solid transparent;border-radius:14px;
    font-size:.94rem;line-height:1.45;white-space:normal;overflow-wrap:anywhere;text-align:left;
    color:var(--ink);outline-offset:-3px;
  }
  header.top nav.main a:hover,header.top nav.main a.on,header.top nav.main a[aria-current="page"]{
    border-color:var(--glass-separator);background:var(--glass-input);box-shadow:inset 0 1px 0 var(--glass-edge);
  }
  header.top nav.main a:focus-visible{border-color:var(--a2);background:var(--glass-input)}
}
@media(max-width:600px){
  header.top{border-radius:23px;margin-top:9px}
  header.top .bar{padding:5px 8px;gap:5px}
  header.top .brand{gap:6px}
  header.top .brand b{font-size:.84rem}
  header.top .bar .ctrl{gap:4px}
  header.top .bar .lang :is(button,a){padding-inline:6px}
  /* Reserve room for the portrait's offset border and entrance zoom. */
  .photo{width:calc(100% - 18px)}
  .card,.vcard,.case,.case-full,.emp{border-radius:22px}
  .case-top{border-radius:0 0 21px 21px}.case-media{border-radius:21px 21px 0 0}
}
@media(max-width:370px){header.top .brand b{display:none}}
@keyframes wq-mobile-nav-in{from{opacity:0;transform:translateY(-5px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  header.top,.lang,.icon-btn,.copy,.btn.ghost,nav.main,.wq-play-label,.wq-video-duration{background:var(--surface)}
}
@media(prefers-reduced-transparency:reduce){
  header.top,.lang,.icon-btn,.copy,.btn.ghost,.card,.vcard,.case,.emp,.facts,.wq-play-label,.wq-video-duration{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(max-width:1100px) and (prefers-reduced-transparency:reduce){header.top nav.main{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-contrast:more){
  :root:root{--glass-line:var(--ink);--glass-separator:var(--muted);--glass-soft:var(--surface);--glass-control:var(--surface);--glass-panel:var(--surface)}
}
@media(prefers-reduced-motion:reduce){
  .btn,.icon-btn,.copy,.lang,nav.main a{transition:none;scale:1}
  header.top nav.main.open{animation:none}
}
@media print{
  body{background:#FFF!important;color:#102738}
  header.top{display:none}
  .card,.vcard,.case,.case-full,.emp,.legal{box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
}