/* Shared styles for Zaur content pages (about, security, partner agreement, work pages, 404) */
@font-face{font-family:DM;src:url(dm-sans.ttf)format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url(barlow-condensed.ttf)format("truetype");font-weight:700;font-display:swap}
:root{--ink:#171815;--bone:#ecebe3;--orange:#ff7143;--blue:#9fd0ff;--muted:#8c9080;--soft:#adafa5;--line:#33342e;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px;scrollbar-width:thin;scrollbar-color:#ff7143 #171815}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#171815}
::-webkit-scrollbar-thumb{background:#ff7143;border-radius:999px;border:2px solid #171815}::-webkit-scrollbar-thumb:hover{background:#ff8b64}
body{background:var(--ink);color:var(--bone);-webkit-font-smoothing:antialiased;margin:0;font-family:DM,Arial,sans-serif;overflow-x:clip}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer;color:inherit;border:0;background:0 0}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--orange);outline-offset:5px}
::selection{background:var(--orange);color:var(--ink)}
h1,h2,h3,p,figure,blockquote{margin:0}
a svg,button svg{flex-shrink:0;transition:transform .25s}
a:hover>svg{transform:translate(2px,-2px)}
.display{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:-2px;line-height:.9}
.display span{color:var(--orange)}
.wrap{padding-left:4.5%;padding-right:4.5%}
@media (min-width:1550px){.wrap{padding-left:max(4.5%,50vw - 725px);padding-right:max(4.5%,50vw - 725px)}}

/* header */
.site-header{z-index:20;background:#171815ee;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);justify-content:space-between;align-items:center;height:91px;display:flex;position:sticky;top:0}
.logo-window{width:132px;height:29px;display:block;position:relative;overflow:hidden}
.logo-window img{width:168px;max-width:none;height:auto;position:absolute;top:-15px;left:-17px}
.header-actions{display:flex;align-items:center;gap:26px}
.header-login{display:inline-flex;align-items:center;gap:9px;height:44px;padding:0 18px;border-radius:999px;font-size:12px;font-weight:600;color:var(--blue);background:#9fd0ff14;border:1px solid #9fd0ff55;transition:background .25s,color .25s,transform .25s,box-shadow .25s}
.header-login:hover{background:var(--blue);color:#0f1a26;transform:translateY(-2px);box-shadow:0 10px 26px -10px #9fd0ffaa}
.header-login svg{transition:none}
.header-cta{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:14px;padding:0 6px 0 20px;height:48px;border-radius:999px;border:1px solid var(--orange);color:var(--bone);font-size:13px;font-weight:600;overflow:hidden;transition:color .35s,transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;animation:cta-glow 3.2s ease-in-out infinite}
.header-cta::before{content:"";position:absolute;inset:0;background:var(--orange);transform:translateX(-101%);transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:-1}
.header-cta .dot{width:7px;height:7px;border-radius:50%;background:var(--orange);animation:cta-dot 1.8s ease-out infinite;flex-shrink:0}
.header-cta .lbl{position:relative;display:inline-block;overflow:hidden;height:1.3em;line-height:1.3em}
.header-cta .lbl span{display:block;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.header-cta .lbl span+span{position:absolute;left:0;top:100%;white-space:nowrap}
.header-cta .arr{width:36px;height:36px;border-radius:50%;background:var(--orange);color:var(--ink);display:flex;align-items:center;justify-content:center;transition:background .35s,color .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.header-cta .arr svg{transition:none}
.header-cta:hover{color:var(--ink);transform:translateY(-2px);box-shadow:0 10px 30px -8px #ff7143aa;animation:none}
.header-cta:hover::before{transform:translateX(0)}
.header-cta:hover .lbl span{transform:translateY(-100%)}
.header-cta:hover .arr{background:var(--ink);color:var(--orange);transform:rotate(45deg)}
.header-cta:hover .dot{background:var(--ink);animation:none}
@keyframes cta-glow{0%,100%{box-shadow:0 0 0 0 #ff714300}50%{box-shadow:0 0 28px -4px #ff714388}}
@keyframes cta-dot{0%{box-shadow:0 0 0 0 #ff714399}100%{box-shadow:0 0 0 9px #ff714300}}

/* page hero: centred, full-width headline */
.hero{text-align:center;padding-top:70px;padding-bottom:30px}
.kicker{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:24px;letter-spacing:-.3px;line-height:1.1;color:var(--muted)}
.kicker b{color:var(--orange);font-weight:700}
.hero h1{font-size:clamp(58px,9vw,150px);margin-top:22px}
.hero .lead{margin:30px auto 0;color:var(--soft);font-size:17px;line-height:1.8;max-width:68ch}
.hero .lead b{color:var(--bone);font-weight:400}
.hero .meta{margin-top:18px;font-size:13px;color:var(--muted)}
.hero-logo{display:flex;justify-content:center;align-items:center;gap:18px;margin-top:6px}
.hero-logo img{height:auto;display:block}
.hero-logo .wordmark{font-family:Barlow,Impact,sans-serif;font-weight:700;font-size:56px;letter-spacing:-1px;line-height:1}
.hero-logo .wordmark i{font-style:normal;color:var(--orange)}
.actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px 30px;margin-top:38px}
.button{border-radius:2px;justify-content:center;align-items:center;gap:22px;min-height:53px;padding:0 24px;font-size:13px;font-weight:600;transition:background .25s,transform .25s,color .25s;display:inline-flex}
.button:hover{transform:translateY(-2px)}
.orange-button{background:var(--orange);color:#191a15}.orange-button:hover{background:#ff8b64}
.ghost-button{color:var(--bone);box-shadow:inset 0 0 0 1px #5a5c52}.ghost-button:hover{box-shadow:inset 0 0 0 1px var(--orange);color:var(--orange)}
.text-link{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--bone)}
.text-link:hover{color:var(--orange)}

/* content rows: heading left, prose right, spread across the page */
.rows{padding-top:60px;padding-bottom:40px}
.row{display:grid;grid-template-columns:.4fr .6fr;gap:70px;align-items:start}
.row+.row{margin-top:90px}
.row h2{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(38px,4vw,60px);letter-spacing:-1px;line-height:.92;position:sticky;top:120px}
.row h2 span{color:var(--orange)}
.prose p{color:var(--soft);font-size:16px;line-height:1.85;max-width:62ch}
.prose p+p{margin-top:18px}
.prose p b{color:var(--bone);font-weight:400}
.prose a{color:var(--orange);text-decoration:underline;text-underline-offset:3px}
.prose h3{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:30px;letter-spacing:-.5px;line-height:.95;margin:40px 0 12px}
.prose h3:first-child{margin-top:0}
.prose h3 span{color:var(--orange)}
.note{margin-top:26px;color:var(--muted);font-size:13.5px;line-height:1.8;max-width:62ch;border-left:3px solid var(--orange);padding-left:16px}
.note b{color:var(--bone);font-weight:400}
.built{margin-top:30px;font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:28px;letter-spacing:-.5px;line-height:1.35}
.built i{font-style:normal;color:var(--orange);font-family:DM,Arial,sans-serif;font-weight:400;font-size:18px;padding:0 10px;vertical-align:2px}
.built small{display:block;font-family:DM,Arial,sans-serif;font-weight:400;text-transform:none;letter-spacing:0;font-size:13px;color:var(--muted);margin-bottom:10px}
.prose .built{font-size:28px;color:var(--bone);max-width:none;line-height:1.35;margin-top:30px}
.prose .note{font-size:13.5px;color:var(--muted);line-height:1.8;margin-top:26px}
.stats{display:flex;flex-wrap:wrap;justify-content:center;gap:20px 70px;padding-top:50px;padding-bottom:20px;text-align:center}
.stats div{font-family:Barlow,Impact,sans-serif;font-weight:700;font-size:clamp(54px,6vw,88px);line-height:1;color:var(--orange);letter-spacing:-1px}
.stats small{display:block;font-family:DM,Arial,sans-serif;font-weight:400;font-size:13px;color:var(--muted);letter-spacing:0;margin-top:8px}
.stats-note{text-align:center;color:var(--muted);font-size:12.5px;margin-top:4px}

/* statements: big lines of text, centred */
.statements{text-align:center;padding-top:80px;padding-bottom:40px}
.statements p{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(34px,4.4vw,66px);letter-spacing:-1px;line-height:.98;max-width:22ch;margin:0 auto}
.statements p span{color:var(--orange)}
.statements p+p{margin-top:34px}
.statements small{display:block;font-family:DM,Arial,sans-serif;font-weight:400;text-transform:none;letter-spacing:0;font-size:15px;line-height:1.7;color:var(--soft);max-width:52ch;margin:14px auto 0}

/* people */
.people{display:flex;flex-wrap:wrap;justify-content:center;gap:60px 90px;padding-top:30px}
.person{width:min(340px,100%);text-align:center}
.person .ph{width:180px;height:180px;border-radius:50%;margin:0 auto;background:#22231f center/cover no-repeat;display:grid;place-items:center;color:#55584d;font-family:Barlow,Impact,sans-serif;font-size:64px}
.person h3{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:36px;letter-spacing:-.5px;line-height:.95;margin-top:24px}
.person .role{color:var(--orange);font-size:13px;font-weight:600;margin-top:8px}
.person p{color:var(--soft);font-size:14.5px;line-height:1.75;margin-top:14px}

/* client quote: stays hidden until a real quote is added */
.quote{text-align:center;padding-top:80px;padding-bottom:20px}
.quote[hidden]{display:none}
.quote blockquote{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(34px,4.2vw,62px);letter-spacing:-1px;line-height:.98;max-width:24ch;margin:0 auto;position:relative}
.quote blockquote::before{content:"“";display:block;color:var(--orange);font-size:1.6em;line-height:.6;margin-bottom:8px}
.quote figcaption{margin-top:22px;color:var(--muted);font-size:14px}
.quote figcaption b{color:var(--bone);font-weight:400}

/* placeholder you still need to fill in */
.todo{color:var(--orange);background:#ff714314;border-bottom:1px dashed var(--orange);padding:0 4px}

/* closing call to action */
.closer{text-align:center;padding-top:110px;padding-bottom:110px}
.closer h2{font-size:clamp(56px,8.6vw,132px)}
.closer p{color:var(--soft);font-size:16px;line-height:1.8;max-width:56ch;margin:24px auto 0}

/* footer */
.footer{padding-top:50px;padding-bottom:44px}
.footer-grid{display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:center;gap:30px}
.footer-brand p{margin-top:14px;color:var(--muted);font-size:12px}
.footer-links{display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:center;font-size:13px}
.footer-links.right{justify-content:flex-end}
.footer-links a{color:var(--bone);transition:color .2s}.footer-links a:hover{color:var(--orange)}

/* door chooser */
.door{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px}
.door[hidden]{display:none}
.door-bg{position:absolute;inset:0;background:#0b0c0acc;backdrop-filter:blur(8px)}
.door-box{position:relative;width:min(960px,100%);background:var(--ink);padding:54px 56px 56px;animation:door-in .35s cubic-bezier(.2,.7,.2,1)}
@keyframes door-in{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.door-x{position:absolute;top:14px;right:18px;font-size:30px;line-height:1;color:var(--muted);padding:6px}.door-x:hover{color:var(--orange)}
.door-k{font-size:9px;letter-spacing:1.4px;font-weight:600;text-transform:uppercase;color:var(--muted)}
.door h2{font-size:clamp(48px,6vw,84px);margin-top:16px}
.door-opts{display:grid;grid-template-columns:1fr 1fr;gap:0 60px;margin-top:40px}
.door-opt{display:grid;gap:14px;padding:30px 0 26px;position:relative;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.door-opt+.door-opt::before{content:"";position:absolute;left:-30px;top:30px;bottom:26px;width:1px;background:var(--line)}
.door-opt:hover{transform:translateX(8px)}
.door-big{font-family:Barlow,Impact,sans-serif;font-weight:700;text-transform:uppercase;font-size:40px;letter-spacing:-1px;line-height:.92;transition:color .25s}
.door-opt:hover .door-big{color:var(--orange)}
.door-sub{color:var(--soft);font-size:14px;line-height:1.75;max-width:40ch}
.door-go{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:600;color:var(--orange);margin-top:6px}
.door-call{margin-top:26px;font-size:13px;color:var(--muted)}
.door-call a{color:var(--bone);text-decoration:underline;text-underline-offset:3px}.door-call a:hover{color:var(--orange)}

.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

@media (max-width:900px){
  .row{grid-template-columns:1fr;gap:20px}.row h2{position:static}.row+.row{margin-top:64px}
  .door-box{padding:40px 24px 30px}.door-opts{grid-template-columns:1fr}.door-opt+.door-opt::before{left:0;right:0;top:0;bottom:auto;width:auto;height:1px}.door-big{font-size:32px}
}
@media (max-width:760px){
  .wrap{padding-left:6%;padding-right:6%}
  .site-header{height:75px}.logo-window{width:110px;height:25px}.logo-window img{width:140px;top:-12px;left:-14px}
  .header-actions{gap:12px}.header-login{height:40px;padding:0 14px}.header-cta{height:42px;gap:8px;padding-left:14px;font-size:11px}.header-cta .arr{width:30px;height:30px}
  .hero{padding-top:44px}.hero h1{font-size:clamp(50px,15vw,84px)}.hero .lead{font-size:15px}.kicker{font-size:19px}
  .prose p{font-size:15px}.prose .built{font-size:22px}
  .closer{padding-top:80px;padding-bottom:80px}.closer h2{font-size:clamp(54px,15vw,90px)}
  .footer-grid{grid-template-columns:1fr;gap:26px}.footer-links,.footer-links.right{justify-content:flex-start;gap:14px 24px}
}
@media (max-width:420px){.header-login{display:none}}
@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation:none!important}.reveal{opacity:1;transform:none}}