/* Progressive enhancement styles. Safe to remove: the site works without them. */
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
.site-header{transition:box-shadow .2s,border-color .2s}
.site-header.is-scrolled{box-shadow:0 8px 24px -16px rgba(11,26,34,.45)}

/* scroll-in reveal: only applied after enhance.js has run */
.reveal-ready .rv{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,.7,.2,1),transform .6s cubic-bezier(.2,.7,.2,1)}
.reveal-ready .rv.rv-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal-ready .rv{opacity:1;transform:none;transition:none}}

/* card and link micro-interactions */
.sector,.post-link,.team li img,.btn{transition:transform .18s,box-shadow .18s,background-color .15s,color .15s,border-color .15s,filter .15s}
.sector:hover{transform:translateY(-3px);box-shadow:0 18px 30px -22px rgba(11,26,34,.5)}
.btn:active{transform:translateY(1px)}
.post-link:hover{box-shadow:0 18px 30px -22px rgba(11,26,34,.5)}
@media(prefers-reduced-motion:reduce){.sector:hover{transform:none}.btn:active{transform:none}}

/* mobile menu eases in */
@keyframes navdrop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.js .nav-open .nav-links{animation:navdrop .2s ease}}
@media(prefers-reduced-motion:reduce){.js .nav-open .nav-links{animation:none}}

/* services sidebar: current section */
.svc-nav a[aria-current="true"]{color:var(--accent);border-left-color:var(--accent);font-weight:650}

/* back to top */
.to-top{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:40;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--text);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s;box-shadow:0 10px 24px -14px rgba(11,26,34,.55)}
.to-top svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.to-top.is-on{opacity:1;visibility:visible;transform:none}
.to-top:hover{border-color:var(--accent);color:var(--accent)}

/* inline form validation */
.field-err{margin:2px 0 0;font-size:.9rem;font-weight:600;color:#b3261e}
:root[data-theme="dark"] .field-err{color:#ff9b93}
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:#b3261e;box-shadow:0 0 0 1px #b3261e}
:root[data-theme="dark"] input[aria-invalid="true"],:root[data-theme="dark"] select[aria-invalid="true"],:root[data-theme="dark"] textarea[aria-invalid="true"]{border-color:#ff9b93;box-shadow:0 0 0 1px #ff9b93}
.check .field-err{grid-column:2}

/* learn page: sticky register bar (phones only) */
.reg-bar{display:none}
@media(max-width:800px){
  .reg-bar{display:block;position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px max(16px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:var(--bg);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .25s}
  .reg-bar.is-on{transform:none}
  .reg-bar .btn{width:100%}
  .to-top{bottom:calc(max(16px,env(safe-area-inset-bottom)) + 4px)}
  .learn-page .to-top{bottom:84px}
}
@media print{.to-top,.reg-bar{display:none!important}}

/* step lists: current step follows the scroll */
.steps li{transition:box-shadow .3s}
.steps li h3{transition:color .3s}
.steps li.is-active{box-shadow:-4px 0 0 var(--accent)}
.steps li.is-active h3{color:var(--accent)}
.steps li.is-done{box-shadow:-4px 0 0 var(--line)}
@media(prefers-reduced-motion:reduce){.steps li,.steps li h3{transition:none}}

/* how we work: scenes that draw themselves */
.hww-list{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.hww-list{grid-template-columns:1fr}}
.hww-scene{margin:0;padding:22px 22px 20px;border:1px solid var(--line);border-radius:12px;background:var(--bg);height:100%;box-sizing:border-box}
.hww-num{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--accent);color:var(--accent);font-weight:700;font-size:.9rem}
.hww-scene h3{margin:10px 0 6px;font-size:1.2rem;line-height:1.3}
.hww-scene svg{display:block;width:100%;height:auto;max-height:210px;color:var(--text);fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.hww-scene svg text{fill:currentColor;stroke:none;font-size:12.5px;font-style:italic;font-family:inherit}
.hww-scene svg .acc{stroke:var(--accent)}
.hww-scene svg .fill-acc{fill:var(--accent);stroke:none}
.hww-scene figcaption{margin:8px 0 0;color:var(--accent);font-weight:600;font-size:.95rem}
.hww-cta{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.hww-cta p{margin:0;font-weight:600}
.hww-ready .hww-scene .d{stroke-dasharray:1;stroke-dashoffset:1}
.hww-ready .hww-scene .t{opacity:0}
.hww-ready .hww-scene figcaption{opacity:0;transform:translateY(6px)}
.hww-scene.is-drawn .d{stroke-dashoffset:0;transition:stroke-dashoffset .9s ease calc(var(--i,0)*.3s + .1s)}
.hww-scene.is-drawn .t{opacity:1;transition:opacity .5s ease calc(var(--i,0)*.3s + .5s)}
.hww-scene.is-drawn figcaption{opacity:1;transform:none;transition:opacity .6s ease 1.7s,transform .6s ease 1.7s}
@media print{.hww-ready .hww-scene .d{stroke-dashoffset:0}.hww-ready .hww-scene .t,.hww-ready .hww-scene figcaption{opacity:1;transform:none}}

/* how we work as a player (class .hwp is added by enhance.js; without it the four scenes stay a plain grid) */
.hwp .hww-list{display:block;position:relative;margin:28px 0 0;max-width:960px}
.hwp .hww-list>li{display:none}
.hwp .hww-list>li.is-current{display:block;animation:hwpin .45s ease both}
@keyframes hwpin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hwp .hww-scene{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto auto 1fr;column-gap:32px;align-content:start;padding:28px 32px;min-height:340px}
.hwp .hww-scene .hww-num{grid-column:1;grid-row:1;justify-self:start}
.hwp .hww-scene h3{grid-column:1;grid-row:2;font-size:clamp(1.35rem,2.6vw,1.9rem);margin:14px 0 10px}
.hwp .hww-scene figcaption{grid-column:1;grid-row:3;align-self:start;font-size:1.05rem}
.hwp .hww-scene svg{grid-column:2;grid-row:1/4;align-self:center;max-height:300px}
@media(max-width:760px){
  .hwp .hww-scene{grid-template-columns:1fr;grid-template-rows:auto;padding:20px 18px;min-height:0}
  .hwp .hww-scene .hww-num,.hwp .hww-scene h3,.hwp .hww-scene figcaption,.hwp .hww-scene svg{grid-column:1;grid-row:auto}
  .hwp .hww-scene svg{margin:8px 0 4px;max-height:230px}
}
.hwp-ctl{display:flex;align-items:center;gap:10px;margin-top:16px;max-width:960px}
.hwp-btn{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--bg);color:var(--text);display:grid;place-items:center;cursor:pointer;padding:0;transition:border-color .15s,color .15s}
.hwp-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hwp-play{border-color:var(--accent);color:var(--accent)}
.hwp-play svg path[d^="M8 5l"]{fill:currentColor}
.hwp-btn:hover{border-color:var(--accent);color:var(--accent)}
.hwp-btn:focus-visible,.hwp-dot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.hwp-dots{display:flex;flex:1;gap:8px;margin-left:6px}
.hwp-dot{flex:1;position:relative;height:44px;padding:0;border:0;background:none;cursor:pointer}
.hwp-dot::before{content:"";position:absolute;left:0;right:0;top:50%;height:5px;margin-top:-2.5px;border-radius:3px;background:var(--line)}
.hwp-dot i{position:absolute;left:0;right:0;top:50%;height:5px;margin-top:-2.5px;border-radius:3px;background:var(--accent);transform:scaleX(0);transform-origin:left}
.hwp .hww-cta{margin-top:24px}
@media(prefers-reduced-motion:reduce){.hwp .hww-list>li.is-current{animation:none}}
@media print{.hwp-ctl{display:none}.hwp .hww-list>li{display:block}}

/* social icons: always one horizontal row (selectors are specific so footer list styles cannot stack them) */
ul.social,.site-footer ul.social,.details ul.social{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px}
ul.social>li,.site-footer ul.social>li,.details ul.social>li{display:block;flex:0 0 auto;width:auto;margin:0;padding:0;border:0}
ul.social>li::before,ul.social>li::after{content:none}
.social a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid currentColor;color:inherit;opacity:.8;text-decoration:none;transition:opacity .15s,background-color .15s,transform .15s}
.social a:hover,.social a:focus-visible{opacity:1;background:rgba(127,127,127,.2)}
.social a:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.social svg{width:18px;height:18px;fill:currentColor;stroke:none}
.social svg.ln{fill:none;stroke:currentColor;stroke-width:1.8}
.social svg.ln circle:last-child{fill:currentColor;stroke:none}
@media(prefers-reduced-motion:reduce){.social a{transition:none}}