/* ===========================================================================
   Arena Rise — inner pages (services.html, work.html).
   A compact page header instead of the home page's full-height film, plus the
   detailed service blocks. Everything else is inherited from the site layer.
   =========================================================================== */

/* ------------------------------------------------------- page header ----- */
.page-head{
  position:relative;isolation:isolate;
  margin-top:calc(var(--nav-h) * -1);
  padding-block:calc(var(--nav-h) + 92px) 84px;
  border-bottom:1px solid var(--site-line)}
.page-head__veil{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(90% 120% at 78% 0%,rgba(69,195,194,.13),transparent 62%)}
.page-head h1{
  font:var(--fw-black) clamp(38px,6.2vw,var(--fs-6xl))/1.15 var(--font-display);
  color:var(--text-strong);letter-spacing:0;margin-top:22px}
.page-head__lede{margin-top:24px;max-width:60ch;color:var(--text-muted);
  font-size:var(--fs-lg);line-height:var(--lh-relaxed)}
.page-head__top{display:flex;align-items:center;gap:16px}

@media (max-width:760px){
  .page-head{padding-block:calc(var(--nav-h) + 56px) 56px}
  .page-head__lede{font-size:var(--fs-md)}
}

/* --------------------------------------------------- service detail ------ */
.svc-list{display:flex;flex-direction:column}
.svc{
  display:grid;grid-template-columns:132px minmax(0,1fr);gap:0 28px;
  padding-block:56px;border-bottom:1px solid var(--site-line)}
.svc:last-child{border-bottom:0}
.svc__head{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.svc__icon{width:34px;height:34px;color:var(--ar-teal-400);flex:none}
.svc__num{font:var(--fw-black) var(--fs-3xl)/1 var(--font-display);color:var(--site-line-strong)}

.svc__body{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.svc__body h2{font:var(--fw-bold) clamp(24px,3vw,var(--fs-3xl))/var(--lh-snug) var(--font-display)}
.svc__lede{color:var(--text-body);max-width:62ch;line-height:var(--lh-relaxed)}

.svc__cols{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
  gap:32px 48px;width:100%;margin-top:6px;align-items:start}
.svc__label{display:block;margin-bottom:14px;color:var(--text-faint)}
.svc__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.svc__list li{position:relative;padding-inline-start:22px;font-size:var(--fs-sm);color:var(--text-muted)}
.svc__list li::before{content:"";position:absolute;inset-inline-start:0;top:.62em;
  width:6px;height:6px;background:var(--ar-teal-400)}

/* the payoff line, set apart from the checklist beside it */
.svc__outcome{
  border-inline-start:2px solid var(--ar-teal-400);
  padding-inline-start:20px;
  font-size:var(--fs-md);line-height:var(--lh-relaxed);color:var(--text-strong)}

.svc__cta{margin-top:8px}

@media (max-width:900px){
  .svc{grid-template-columns:1fr;gap:22px}
  .svc__head{flex-direction:row;align-items:center;gap:14px}
  .svc__cols{grid-template-columns:1fr;gap:26px}
}

/* ------------------------------------------------------------- about ----- */
/* every block on the page shares one rhythm: a narrow label column on the
   reading side, content beside it — so the page scans as one column of labels */
.abt-grid{display:grid;grid-template-columns:180px minmax(0,1fr);gap:0 40px;align-items:start}
.abt-grid__label{padding-top:6px}
.abt-story{border-bottom:1px solid var(--site-line)}

.abt-prose{display:flex;flex-direction:column;gap:22px;max-width:66ch}
.abt-prose p{font-size:var(--fs-lg);line-height:var(--lh-relaxed);color:var(--text-body)}
.abt-prose p:first-child{color:var(--text-strong)}

.abt-figures__label{display:block}

.abt-values{display:flex;flex-direction:column;gap:0}
.abt-value{padding-block:34px;border-bottom:1px solid var(--site-line);
  display:flex;flex-direction:column;gap:12px}
.abt-value:first-child{padding-top:0}
.abt-value:last-child{border-bottom:0;padding-bottom:0}
.abt-value__num{font:var(--fw-medium) var(--fs-3xs)/1 var(--font-sans);
  letter-spacing:var(--ls-widest);color:var(--ar-teal-400)}
.abt-value h2{font:var(--fw-bold) clamp(21px,2.4vw,var(--fs-2xl))/var(--lh-snug) var(--font-display)}
.abt-value__short{color:var(--text-body);max-width:60ch}
.abt-value__body{font-size:var(--fs-sm);color:var(--text-muted);max-width:62ch}

.abt-clients{list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px}
.abt-clients li{
  border:1px solid var(--site-line);padding:11px 18px;
  font-size:var(--fs-sm);color:var(--text-body);
  transition:border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard)}
.abt-clients li:hover{border-color:var(--ar-teal-400);color:var(--text-strong)}

.abt-facts{margin:0;display:flex;flex-direction:column;gap:0}
.abt-fact{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px;
  padding-block:15px;border-bottom:1px solid var(--site-line)}
.abt-fact:last-child{border-bottom:0}
.abt-fact dt{font:var(--fw-medium) var(--fs-3xs)/1.4 var(--font-sans);
  letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--text-faint)}
.abt-fact dd{margin:0;font-size:var(--fs-sm);color:var(--text-strong)}

@media (max-width:900px){
  .abt-grid{grid-template-columns:1fr;gap:18px}
  .abt-grid__label{padding-top:0}
  .abt-prose p{font-size:var(--fs-md)}
  .abt-fact{grid-template-columns:1fr;gap:6px}
}

/* ------------------------------------------------------- home teasers ---- */
/* the "see everything" link that closes a teaser block */
.more-link{
  display:inline-flex;align-items:center;gap:10px;margin-top:40px;
  font:var(--fw-medium) var(--fs-xs)/1 var(--font-sans);
  letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--ar-teal-300)}
.more-link svg{transition:transform 420ms var(--ease-out)}
.more-link:hover{color:var(--ar-teal-400)}
.more-link:hover svg{transform:translateX(-5px)}
[dir="ltr"] .more-link:hover svg{transform:translateX(5px)}
html:not([data-theme="dark"]) .more-link{color:var(--ar-teal-600)}