/* Node UAE — main stylesheet */
:root{
  --ink:#1A1A1A; --paper:#EFEEEA; --card:#F8F7F4;
  --red:#FF3333; --orange:#FF9150; --label-red:#C22A17;
  --muted:#55534E; --muted-d:#B5B3AD; --soft-d:#DAD8D2; --grey:#8F8D87;
  --line-d:#3A3A38; --line-d2:#333331;
  --grad:linear-gradient(90deg,var(--red),var(--orange));
  --display:'Sora','Archivo',system-ui,sans-serif;
  --body:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --gutter:clamp(20px,6.6vw,96px);
  --sec:clamp(72px,9vw,128px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:opacity .15s}
a:hover{opacity:.8}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--orange);color:var(--ink);padding:10px 16px;border-radius:999px;font-weight:700}
.skip-link:focus{top:12px}

.wrap{width:100%;max-width:1440px;margin:0 auto;padding-inline:var(--gutter)}
.wrap--narrow{max-width:900px}

/* ---------- Type ---------- */
.eyebrow{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:18px}
.eyebrow--orange{color:var(--orange)}
.eyebrow--red{color:var(--label-red)}
.h2{font-family:var(--display);font-weight:600;font-size:clamp(36px,4.6vw,60px);line-height:1.05;letter-spacing:-.033em;max-width:760px}
.h2--sm{font-size:clamp(34px,3.8vw,52px)}
.h2--xl{font-size:clamp(42px,5.4vw,72px);line-height:1.02}
.h3{font-family:var(--display);font-weight:600;font-size:clamp(23px,2vw,28px);line-height:1.2}
.h3--lg{font-size:clamp(24px,2.1vw,30px)}
.h4{font-size:22px;font-weight:700;line-height:1.3}
.muted{color:var(--muted)}

/* ---------- Pills (from the logo's "o") ---------- */
.pill-dot{width:36px;height:12px;border-radius:999px;background:var(--grad);flex:none}
.pill-tag{width:56px;height:20px;border-radius:999px;background:var(--grad)}
.pill-tag--sm{width:44px;height:16px}
.track{border:2px solid currentColor;border-radius:999px;padding:4px}
.track__fill{height:22px;width:var(--w,50%);border-radius:999px;background:var(--grad)}
.track--sm{padding:3px}
.track--sm .track__fill{height:16px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 34px;border-radius:999px;font:700 17px/1 var(--body);border:2px solid transparent;cursor:pointer;white-space:nowrap}
.btn--grad{background:var(--grad);color:var(--ink)}
.btn--ghost{border-color:var(--paper);color:var(--paper);font-weight:600}
.btn--sm{min-height:48px;padding:0 26px;font-size:16px}
.btn--block{width:100%}
.btn:hover{opacity:.9}

/* ---------- Header ---------- */
.site-header{background:var(--ink);color:var(--paper)}
.nav{height:96px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav__logo{height:38px;width:auto}
.nav__menu{display:flex;align-items:center;gap:36px}
.nav__list{display:flex;gap:36px;font-size:16px;font-weight:500;color:#CFCDC7}
.nav__toggle{display:none;width:48px;height:48px;border-radius:999px;border:2px solid var(--line-d);background:none;cursor:pointer;position:relative}
.nav__toggle-bar,.nav__toggle-bar::before,.nav__toggle-bar::after{position:absolute;left:50%;width:20px;height:2px;background:var(--paper);transform:translateX(-50%);transition:transform .2s,opacity .2s}
.nav__toggle-bar{top:50%}
.nav__toggle-bar::before,.nav__toggle-bar::after{content:"";left:0;transform:none}
.nav__toggle-bar::before{top:-6px}.nav__toggle-bar::after{top:6px}
.nav__toggle[aria-expanded="true"] .nav__toggle-bar{background:transparent}
.nav__toggle[aria-expanded="true"] .nav__toggle-bar::before{transform:translateY(6px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] .nav__toggle-bar::after{transform:translateY(-6px) rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{background:var(--ink);color:var(--paper)}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:72px;align-items:center;padding-block:clamp(48px,6.6vw,96px) clamp(64px,7.2vw,104px)}
.hero__copy{display:flex;flex-direction:column;gap:32px}
.hero__copy .eyebrow{margin:0}
.hero__title{font-family:var(--display);font-weight:600;font-size:clamp(46px,5.9vw,84px);line-height:1.02;letter-spacing:-.036em}
.hero__lead{max-width:580px;font-size:clamp(18px,1.4vw,20px);color:var(--muted-d)}
.hero__ctas{display:flex;flex-wrap:wrap;gap:16px;padding-top:8px}

.status{border:2px solid var(--line-d);border-radius:40px;padding:36px;display:flex;flex-direction:column;gap:18px}
.status__label{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--grey)}
.status__row{display:flex;flex-direction:column;gap:8px}
.status__meta{display:flex;justify-content:space-between;font-weight:600;font-size:16px}
.status__verb{color:var(--grey);font-weight:500}
.status .track{color:var(--paper)}
/* single load moment: bars charge up */
@media (prefers-reduced-motion:no-preference){
  .status .track__fill{animation:charge 1.1s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--d,0ms) + 250ms)}
  @keyframes charge{from{width:8%}to{width:var(--w)}}
}

.ticker{border-top:1px solid var(--line-d2)}
.ticker__row{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:16px 20px;flex-wrap:wrap;padding-block:20px;font-family:var(--display);font-size:20px;font-weight:600;color:var(--grey)}
.ticker__dot{color:var(--orange);font-size:14px}

/* ---------- Sections ---------- */
.section{padding-block:var(--sec)}
.section--dark{background:var(--ink);color:var(--paper)}
.section--flush{padding-top:0}
.section__head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px 64px;margin-bottom:56px}
.section__intro{max-width:420px;font-size:18px;color:var(--muted)}
.section--dark .section__intro{color:var(--muted-d)}
#process .h2{margin-bottom:56px}

.grid{display:grid;gap:24px}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}

/* service cards */
.card{background:var(--card);border:2px solid var(--ink);border-radius:28px;padding:36px;display:flex;flex-direction:column;gap:18px}
.card__top{display:flex;justify-content:space-between;align-items:center}
.card__text{color:var(--muted)}
.card--dark{background:var(--ink);color:var(--paper)}
.card--dark .card__text{color:var(--muted-d)}
.chips{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px;margin-top:auto}
.chips li{font-size:14px;font-weight:600;line-height:1.3;padding:7px 14px;border-radius:999px;border:1.5px solid currentColor}

/* consulting */
.consult{border:2px solid var(--line-d);border-radius:28px;padding:40px;display:flex;flex-direction:column;gap:22px}
.consult__letter{font-family:var(--display);font-size:56px;font-weight:600;color:var(--orange);line-height:1}
.consult__text{color:var(--muted-d)}
.consult__list{border-top:2px solid var(--line-d);padding-top:22px;display:flex;flex-direction:column;gap:12px;font-size:16px;color:var(--soft-d)}

/* process */
.step{display:flex;flex-direction:column;gap:16px}
.step .track{color:var(--ink)}
.step__num{font-size:15px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding-top:8px}

/* why */
.why{border:2px solid var(--ink);border-radius:40px;background:var(--card);padding:clamp(32px,5.5vw,80px);display:grid;grid-template-columns:420px minmax(0,1fr);gap:clamp(40px,5.5vw,80px)}
.why__intro{display:flex;flex-direction:column;gap:20px}
.why__intro .eyebrow{margin:0}
.why__intro .muted{font-size:18px}
.why__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 48px}
.why__item{display:flex;flex-direction:column;gap:12px}

/* contact */
.contact{display:grid;grid-template-columns:minmax(0,1fr) 600px;gap:clamp(48px,6.6vw,96px);align-items:start}
.contact__copy{display:flex;flex-direction:column;gap:26px}
.contact__copy .eyebrow{margin:0}
.contact__lead{max-width:480px;font-size:19px;color:var(--muted-d)}
.contact__details{display:flex;flex-direction:column;gap:14px;padding-top:12px;font-size:18px;font-weight:600}
.contact__details a{border-bottom:1px solid var(--line-d)}
.contact__details .sep{color:var(--grey);font-weight:400}
.contact__addr{color:var(--muted-d);font-weight:400}

.form{background:var(--paper);color:var(--ink);border-radius:32px;padding:40px;display:flex;flex-direction:column;gap:20px}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.field{display:flex;flex-direction:column;gap:8px;border:0;margin:0;padding:0;min-width:0}
.field label,.field legend{font-size:15px;font-weight:600;padding:0}
.field legend{margin-bottom:10px}
.field input,.field textarea{width:100%;min-height:52px;border:2px solid var(--ink);border-radius:999px;padding:0 20px;font:16px var(--body);background:var(--card);color:var(--ink)}
.field textarea{border-radius:24px;padding:16px 20px;resize:vertical;min-height:120px}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(255,145,80,.35)}
.choice{display:flex;flex-wrap:wrap;gap:8px}
.choice__item{position:relative;cursor:pointer}
.choice__item input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.choice__item span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:2px solid var(--ink);font-size:14px;font-weight:600;transition:background .15s,color .15s}
.choice__item input:checked+span{background:var(--ink);color:var(--paper)}
.choice__item input:focus-visible+span{outline:3px solid var(--orange);outline-offset:2px}
.form__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__notice{padding:14px 18px;border-radius:18px;font-weight:600;font-size:15px}
.form__notice--ok{background:#E3F2E1;color:#1E5A24}
.form__notice--err{background:#FBE3DF;color:#8A1F10}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:var(--muted-d);padding-bottom:56px}
.site-footer .wrap{border-top:0}
.footer__top{display:flex;justify-content:space-between;align-items:flex-start;gap:48px;padding-top:48px;border-top:2px solid var(--line-d2);flex-wrap:wrap}
.footer__logo{height:84px;width:auto}
.footer__cols{display:flex;flex-wrap:wrap;gap:40px 72px;font-size:16px}
.footer__col{display:flex;flex-direction:column;gap:12px}
.footer__head{color:var(--paper);font-weight:700}
.footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:48px;padding-top:24px;border-top:1px solid var(--line-d2);font-size:14px}
.footer__legal{display:flex;gap:24px}

/* ---------- Generic pages / posts ---------- */
.page{padding-block:var(--sec)}
.page__title{margin-bottom:32px}
.entry+.entry{margin-top:32px}
.entry--card{background:var(--card);border:2px solid var(--ink);border-radius:28px;padding:32px}
.entry--card .h3{margin-bottom:6px}
.entry__img{border-radius:28px;margin-bottom:32px}
.entry__content{max-width:68ch}
.entry__content>*+*{margin-top:1em}
.entry__content h2,.entry__content h3{font-family:var(--display);font-weight:600;line-height:1.2;margin-top:1.6em}
.entry__content a,.link{text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:3px}
.entry__content ul{list-style:disc;padding-left:1.3em}
.entry__content ol{list-style:decimal;padding-left:1.3em}
.pager{margin-top:40px}
.pager .page-numbers{display:inline-flex;min-width:44px;height:44px;align-items:center;justify-content:center;border:2px solid var(--ink);border-radius:999px;padding:0 14px;margin-right:6px;font-weight:600}
.pager .current{background:var(--ink);color:var(--paper)}

/* ---------- Responsive ---------- */
@media (max-width:1180px){
  .hero__grid{grid-template-columns:1fr;gap:56px}
  .status{max-width:560px}
  .grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid--4{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
  .why{grid-template-columns:1fr}
  .contact{grid-template-columns:1fr}
  .form{max-width:680px}
}
@media (max-width:900px){
  .nav{height:80px;position:relative}
  .nav__logo{height:32px}
  .nav__toggle{display:block}
  .nav__menu{position:absolute;top:80px;left:0;right:0;z-index:50;background:var(--ink);flex-direction:column;align-items:stretch;gap:20px;padding:12px var(--gutter) 28px;border-bottom:1px solid var(--line-d2);display:none}
  .nav__menu.is-open{display:flex}
  .nav__list{flex-direction:column;gap:0;font-size:20px}
  .nav__list a{display:block;padding:14px 0;border-bottom:1px solid var(--line-d2)}
  .section__head{flex-direction:column;align-items:flex-start}
  .ticker__row{justify-content:flex-start;font-size:17px}
}
@media (max-width:640px){
  body{font-size:16px}
  .grid--3,.grid--4,.why__grid,.form__row{grid-template-columns:1fr}
  .card,.consult{padding:28px}
  .status{padding:26px;border-radius:32px}
  .form{padding:26px;border-radius:26px}
  .hero__ctas .btn{flex:1 1 100%}
  .why{border-radius:30px}
  .footer__logo{height:64px}
  .footer__cols{gap:32px 48px}
}
