/* ===== Inner pages: text on the right, an animated card scene on the left ===== */
.ph-split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center;text-align:right}
.ph-split .crumb{justify-content:flex-start}
.ph-split .lead{margin:26px 0 32px;max-width:560px}
.ph-split .actions{justify-content:flex-start}
@media (max-width:1000px){
  .ph-split{grid-template-columns:minmax(0,1fr);text-align:center}
  .ph-split .crumb,.ph-split .actions{justify-content:center}
  .ph-split .lead{margin:26px auto 32px}
  .ha{display:none}
}

.ha{--n:#081D48;--g:#C89D3E;--g1:#F1D98F;--g3:#A97A2E;--gl:#E9D4A6;--mu:#AEB9CF;
  position:relative;container-type:inline-size;color:#fff;direction:rtl;text-align:right;line-height:1.35;user-select:none}
.ha *,.ha *::before,.ha *::after{box-sizing:border-box}
.ha svg{display:block;overflow:visible}
.ha-stage{position:relative;font-size:3.3cqw;height:25em}
.ha-stage::before{content:"";position:absolute;inset:8% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(200,157,62,.16),transparent 70%);filter:blur(10px)}

.ha-card{position:relative;overflow:hidden;padding:1.1em;border-radius:1.1em;background:linear-gradient(160deg,rgba(28,52,104,.94),rgba(10,30,74,.94));
  border:1px solid rgba(233,212,166,.28);box-shadow:0 1.6em 3em rgba(2,10,30,.55),inset 0 1px 0 rgba(255,255,255,.10)}
.ha-card::after{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:40%;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(241,217,143,.13),transparent);transform:translateX(-170%) skewX(-18deg);animation:ha-sheen 9s cubic-bezier(.45,0,.2,1) 3s infinite}
.ha-main{position:absolute;top:2em;right:1em;width:19em;animation:ha-in 1s cubic-bezier(.2,.7,.2,1) both}
.ha-main>.ha-card{animation:ha-drift 11s ease-in-out infinite}
.ha-float{position:absolute;animation:ha-in 1.1s cubic-bezier(.2,.7,.2,1) both}
.ha-float>.ha-card{padding:.85em;animation:ha-drift 9s ease-in-out infinite reverse,ha-glow 6s ease-in-out infinite}
.ha-f1{left:0;top:.5em;width:11.5em;animation-delay:.5s}
.ha-f2{left:1.5em;bottom:.8em;width:11em;animation-delay:.85s}
.ha-f2>.ha-card{animation-duration:12s,6s;animation-delay:-4s,-2s}

.ha-head{display:flex;align-items:center;justify-content:space-between;gap:.6em;padding-bottom:.7em;margin-bottom:.6em;border-bottom:1px solid rgba(233,212,166,.16)}
.ha-title{display:flex;align-items:center;gap:.5em;font-size:.84em;font-weight:700}
.ha-title svg,.ha-ic{flex:none;width:1.5em;height:1.5em;stroke:var(--g);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ha-pill{font-size:.62em;color:var(--gl);padding:.3em .75em;border-radius:2em;border:1px solid rgba(233,212,166,.28);background:rgba(200,157,62,.08);white-space:nowrap}
.ha-k{display:block;font-size:.6em;color:var(--mu)}
.ha-b{display:block;font-size:.76em;font-weight:700}

/* checklist rows that tick one after another */
.ha-row{display:flex;align-items:center;justify-content:space-between;gap:.5em;padding:.5em 0;font-size:.68em;color:#E3E8F2;border-bottom:1px solid rgba(255,255,255,.05)}
.ha-row:last-child{border-bottom:0}
.ha-row em{font-style:normal;color:var(--g1);white-space:nowrap;opacity:0;animation:ha-pop .6s cubic-bezier(.2,.7,.2,1) both}
.ha-row:nth-child(1) em{animation-delay:1.3s}.ha-row:nth-child(2) em{animation-delay:1.7s}.ha-row:nth-child(3) em{animation-delay:2.1s}.ha-row:nth-child(4) em{animation-delay:2.5s}.ha-row:nth-child(5) em{animation-delay:2.9s}
.ha-prog{height:.3em;margin-top:.8em;border-radius:1em;background:rgba(255,255,255,.08);overflow:hidden}
.ha-prog i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--g3),var(--g1));transform-origin:100% 50%;animation:ha-fill 2.6s cubic-bezier(.45,0,.2,1) 1.2s both}

/* gold chip */
.ha-chip{display:inline-block;font-style:normal;font-size:.62em;font-weight:700;color:var(--n);padding:.25em .8em;border-radius:2em;background:linear-gradient(135deg,#F1D98F,#C89D3E);opacity:0;animation:ha-pop .6s cubic-bezier(.2,.7,.2,1) 3.2s both}
.ha-line{display:flex;align-items:center;justify-content:space-between;gap:.5em;margin-top:.6em;padding-top:.55em;border-top:1px solid rgba(233,212,166,.14);font-size:.62em;color:var(--gl)}
.ha-line .ha-chip{font-size:1em}

/* seal with a slowly turning rim */
.ha-seal{position:relative;flex:none;width:2.7em;height:2.7em}
.ha-seal svg{width:100%;height:100%}
.ha-seal .rim{fill:none;stroke:#E4C068;stroke-width:1.4;stroke-dasharray:2.2 2.6;transform-origin:20px 20px;animation:ha-spin 30s linear infinite}
.ha-seal span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.82em;font-weight:700;color:var(--n);direction:ltr}
.ha-seal .chk{fill:none;stroke:var(--n);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20;animation:ha-draw .8s ease 2.4s forwards}
.ha-sealrow{display:flex;align-items:center;gap:.6em}

/* bar chart */
.ha-bars{display:flex;align-items:flex-end;gap:.45em;height:6.5em;padding:.4em .2em 0;border-radius:.7em;background:rgba(4,14,40,.35)}
.ha-bars i{flex:1;border-radius:.3em .3em 0 0;background:linear-gradient(180deg,rgba(241,217,143,.95),rgba(200,157,62,.35));transform-origin:50% 100%;animation:ha-grow 1.2s cubic-bezier(.2,.7,.2,1) both}
.ha-bars i:nth-child(odd){background:linear-gradient(180deg,rgba(174,185,207,.55),rgba(174,185,207,.12))}
.ha-bars i:nth-child(1){height:38%;animation-delay:1s}.ha-bars i:nth-child(2){height:46%;animation-delay:1.1s}.ha-bars i:nth-child(3){height:44%;animation-delay:1.2s}.ha-bars i:nth-child(4){height:58%;animation-delay:1.3s}
.ha-bars i:nth-child(5){height:55%;animation-delay:1.4s}.ha-bars i:nth-child(6){height:70%;animation-delay:1.5s}.ha-bars i:nth-child(7){height:66%;animation-delay:1.6s}.ha-bars i:nth-child(8){height:84%;animation-delay:1.7s}

/* month grid (VAT periods) */
.ha-months{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45em}
.ha-months span{display:flex;flex-direction:column;align-items:center;gap:.2em;padding:.55em .2em;border-radius:.6em;font-size:.6em;color:var(--mu);border:1px solid rgba(255,255,255,.07);background:rgba(4,14,40,.3);animation:ha-lit .6s ease both}
.ha-months span b{font-size:1.15em;color:#fff;font-weight:700}
.ha-months span:nth-child(1){animation-delay:1.2s}.ha-months span:nth-child(2){animation-delay:1.5s}.ha-months span:nth-child(3){animation-delay:1.8s}
.ha-months span:nth-child(4){animation-delay:2.1s}.ha-months span:nth-child(5){animation-delay:2.4s}
.ha-months span.now{animation:ha-now 2.4s ease-in-out 2.8s infinite}

/* browser window with a real screenshot */
.ha-win{padding:0;overflow:hidden}
.ha-winbar{display:flex;align-items:center;gap:.35em;padding:.55em .8em;background:rgba(4,14,40,.55);border-bottom:1px solid rgba(233,212,166,.16)}
.ha-winbar i{width:.5em;height:.5em;border-radius:50%;background:rgba(233,212,166,.35)}
.ha-winbar span{margin-right:auto;font-size:.56em;color:var(--mu);direction:ltr;padding:.15em .8em;border-radius:1em;background:rgba(255,255,255,.06)}
.ha-win img{display:block;width:100%;height:auto}
.ha-stat{display:flex;align-items:baseline;gap:.35em}
.ha-stat b{font-size:1.5em;line-height:1;font-weight:700;color:var(--g1);direction:ltr}
.ha-stat span{font-size:.66em;color:#E3E8F2}

/* fanned guide cards */
.ha-book{position:absolute;right:2em;width:16.5em;animation:ha-in 1s cubic-bezier(.2,.7,.2,1) both}
.ha-book>.ha-card{min-height:9.5em}
.ha-book.b1{top:1.2em;transform:rotate(5deg);animation-delay:.2s}
.ha-book.b2{top:5.4em;right:3.6em;transform:rotate(-3deg);animation-delay:.45s}
.ha-book.b3{top:9.6em;right:1.2em;animation-delay:.7s}
.ha-book.b1>.ha-card{animation:ha-drift 12s ease-in-out infinite;opacity:.82}
.ha-book.b2>.ha-card{animation:ha-drift 10s ease-in-out -3s infinite reverse;opacity:.92}
.ha-book.b3>.ha-card{animation:ha-drift 11s ease-in-out -6s infinite}
.ha-tag{display:inline-block;font-size:.58em;color:var(--g1);letter-spacing:.3px;margin-bottom:.35em}
.ha-sk{display:block;height:.42em;margin-top:.5em;border-radius:1em;background:rgba(255,255,255,.09)}
.ha-sk.s2{width:82%}.ha-sk.s3{width:64%}

/* authority tiles */
.ha-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55em}
.ha-tiles a{display:flex;flex-direction:column;gap:.3em;padding:.8em;border-radius:.8em;border:1px solid rgba(233,212,166,.18);background:rgba(4,14,40,.35);color:#fff;text-decoration:none;animation:ha-focus 8s ease-in-out infinite}
.ha-tiles a b{font-size:.68em}
.ha-tiles a small{font-size:.56em;color:var(--mu)}
.ha-tiles a:nth-child(2){animation-delay:2s}.ha-tiles a:nth-child(3){animation-delay:4s}.ha-tiles a:nth-child(4){animation-delay:6s}

/* calendar */
.ha-cal{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.35em;text-align:center}
.ha-cal span{font-size:.58em;color:var(--mu);padding:.45em 0;border-radius:.5em}
.ha-cal span.d{color:#fff;background:rgba(4,14,40,.35);border:1px solid rgba(255,255,255,.06)}
.ha-cal span.on{color:var(--n);font-weight:700;background:linear-gradient(135deg,#F1D98F,#C89D3E);animation:ha-now 2.4s ease-in-out 1.6s infinite}
.ha-slots{display:flex;gap:.4em;margin-top:.7em}
.ha-slots span{flex:1;text-align:center;font-size:.6em;padding:.4em 0;border-radius:2em;border:1px solid rgba(233,212,166,.25);color:var(--gl);direction:ltr}
.ha-slots span.on{color:var(--n);font-weight:700;background:var(--g1);opacity:0;animation:ha-pop .6s ease 2.6s both}
.ha-ring{position:relative;flex:none;width:2.2em;height:2.2em;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#F1D98F,#C89D3E)}
.ha-ring svg{width:1.1em;height:1.1em;stroke:var(--n);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ha-ring::before,.ha-ring::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid var(--g1);animation:ha-wave 2.8s ease-out infinite}
.ha-ring::after{animation-delay:1.4s}

@keyframes ha-in{from{opacity:0;transform:translate3d(0,1.4em,0)}to{opacity:1}}
@keyframes ha-drift{0%,100%{transform:translate3d(0,0,0) rotate(0)}25%{transform:translate3d(.25em,-.4em,0) rotate(-.5deg)}50%{transform:translate3d(0,-.7em,0)}75%{transform:translate3d(-.25em,-.35em,0) rotate(.5deg)}}
@keyframes ha-glow{0%,100%{border-color:rgba(233,212,166,.26)}50%{border-color:rgba(233,212,166,.6)}}
@keyframes ha-sheen{0%{transform:translateX(-170%) skewX(-18deg)}40%,100%{transform:translateX(330%) skewX(-18deg)}}
@keyframes ha-pop{from{opacity:0;transform:translate3d(-.5em,0,0)}to{opacity:1;transform:none}}
@keyframes ha-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ha-grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes ha-draw{to{stroke-dashoffset:0}}
@keyframes ha-spin{to{transform:rotate(360deg)}}
@keyframes ha-lit{from{border-color:rgba(255,255,255,.07)}to{border-color:rgba(233,212,166,.5);color:var(--g1)}}
@keyframes ha-now{0%,100%{box-shadow:0 0 0 0 rgba(241,217,143,.5)}50%{box-shadow:0 0 0 .35em rgba(241,217,143,0)}}
@keyframes ha-focus{0%,100%{border-color:rgba(233,212,166,.18);background:rgba(4,14,40,.35)}10%,22%{border-color:rgba(241,217,143,.7);background:rgba(200,157,62,.14)}}
@keyframes ha-wave{from{transform:scale(1);opacity:.8}to{transform:scale(1.9);opacity:0}}
@media (prefers-reduced-motion:reduce){.ha *,.ha *::before,.ha *::after{animation:none!important;opacity:1!important}.ha-card::after{display:none}}