/* =====================================================================
   TBS Premium Layer — additive theme & motion upgrade
   Loaded after each page's own styles. Remove the two <link>/<script>
   tags to switch it off completely.
   Levels:  html.pm-a  (refined motion, same fonts)
            html.pm-b  (A + editorial serif headings & gold hairlines)
            html.pm-c  (B + cinematic: gold-flow text, spotlight, grain)
   ===================================================================== */
:root{--pm-gold:#D4A843;--pm-gold-2:#F0D48E;--pm-gold-3:#9C7426;--pm-ease:cubic-bezier(.16,1,.3,1);--pm-serif:'Cormorant Garamond',Georgia,'Times New Roman',serif}

/* ---------- 1. Hero entrance: headline lines rise out of a mask ---------- */
.pm-js .pm-line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.pm-js .pm-line>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--pm-ease)}
.pm-js.pm-loaded .pm-line>span{transform:none}
.pm-js .pm-line:nth-child(2)>span{transition-delay:.12s}
.pm-js .pm-line:nth-child(3)>span{transition-delay:.24s}
.pm-js .pm-line:nth-child(4)>span{transition-delay:.36s}
.pm-js .pm-fade{opacity:0;transform:translateY(14px);transition:opacity .9s var(--pm-ease),transform .9s var(--pm-ease)}
.pm-js.pm-loaded .pm-fade{opacity:1;transform:none}

/* ---------- 2. Scroll reveals: soft rise + de-blur, children staggered ---------- */
.pm-js .pm-rv{opacity:0;transform:translateY(26px);filter:blur(6px);transition:opacity 1s var(--pm-ease),transform 1s var(--pm-ease),filter 1s var(--pm-ease);transition-delay:var(--pm-d,0s)}
.pm-js .pm-rv.pm-in{opacity:1;transform:none;filter:none}

/* ---------- 3. Section headings: gold hairline draws in under the eyebrow ---------- */
.pm-js .eyebrow{position:relative}
.pm-js .eyebrow::after{content:'';position:absolute;left:0;bottom:-.55rem;height:1px;width:56px;background:linear-gradient(90deg,var(--pm-gold),transparent);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--pm-ease) .2s}
.pm-js .pm-in .eyebrow::after,.pm-js .eyebrow.pm-in::after{transform:scaleX(1)}

/* ---------- 4. Cards: gold light sweep + border glow on hover ---------- */
.pm-card{position:relative;isolation:isolate}
.pm-card::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(240,212,142,.55),rgba(212,168,67,.05) 40%,rgba(212,168,67,.05) 60%,rgba(240,212,142,.4));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .5s var(--pm-ease);pointer-events:none;z-index:2}
.pm-card::after{content:'';position:absolute;top:0;bottom:0;left:-75%;width:50%;background:linear-gradient(100deg,transparent,rgba(240,212,142,.10),transparent);transform:skewX(-18deg);pointer-events:none;z-index:2;transition:left 0s}
.pm-card:hover::before{opacity:1}
.pm-card:hover::after{left:130%;transition:left 1.1s var(--pm-ease)}

/* ---------- 5. Buttons: soft lift + glow ---------- */
.btn-gold,.btn-lime{transition:transform .35s var(--pm-ease),box-shadow .35s var(--pm-ease),filter .35s}
.btn-gold:hover{box-shadow:0 14px 40px rgba(212,168,67,.35),0 0 0 1px rgba(240,212,142,.4) inset}

/* ---------- 6. Scroll progress bar in gold gradient ---------- */
.prog-fill,#pf{background:linear-gradient(90deg,var(--pm-gold-3),var(--pm-gold-2),var(--pm-gold))!important}

/* ======================= Level B: editorial ======================= */
html.pm-b .hero-h1,html.pm-b .page-h1,html.pm-b .sec-h2,html.pm-b section h2:not(.fn-h){font-family:var(--pm-serif)!important;font-weight:500!important;letter-spacing:-.01em}
html.pm-b .hero-h1{font-size:clamp(3.2rem,7vw,6.4rem)!important;line-height:1.02!important}
html.pm-b .page-h1{line-height:1.08!important}
html.pm-b .hero-h1 em,html.pm-b .page-h1 em,html.pm-b section h2 em{font-style:italic}
html.pm-b section.section+section.section,html.pm-b section.section-alt{position:relative}
html.pm-b section.section::before{content:'';position:absolute;top:0;left:50%;width:min(1200px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(212,168,67,.28),transparent)}

/* ======================= Level C: cinematic ======================= */
html.pm-c .hero-h1 em,html.pm-c .page-h1 em,html.pm-c section h2 em{background:linear-gradient(100deg,var(--pm-gold-3) 0%,var(--pm-gold-2) 25%,var(--pm-gold) 50%,var(--pm-gold-2) 75%,var(--pm-gold-3) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:pm-flow 7s linear infinite}
@keyframes pm-flow{to{background-position:-200% 0}}
html.pm-c .pm-spot{position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(520px circle at var(--pm-x,50%) var(--pm-y,30%),rgba(212,168,67,.075),transparent 60%);transition:opacity .4s}
html.pm-c body::after{content:'';position:fixed;inset:-50%;pointer-events:none;z-index:9998;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:pm-grain 1.2s steps(4) infinite}
@keyframes pm-grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(0,0)}}

/* ---------- Accessibility: honour reduced-motion everywhere ---------- */
@media (prefers-reduced-motion:reduce){
  .pm-js .pm-line>span,.pm-js .pm-fade,.pm-js .pm-rv{transform:none!important;opacity:1!important;filter:none!important;transition:none!important}
  html.pm-c .hero-h1 em,html.pm-c section h2 em{animation:none}
  html.pm-c body::after{animation:none}
  .pm-card::after{display:none}
}
@media (hover:none){.pm-card::after{display:none}html.pm-c .pm-spot{display:none}}

/* ======================= 8K finish (same fonts) ======================= */
/* gold flowing shine on emphasised words — colour only, font untouched */
html.pm-8k .hero-h1 em,html.pm-8k .page-h1 em,html.pm-8k section h2 em{background:linear-gradient(100deg,var(--pm-gold-3) 0%,var(--pm-gold-2) 25%,var(--pm-gold) 50%,var(--pm-gold-2) 75%,var(--pm-gold-3) 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:pm-flow 9s linear infinite}
/* soft gold light that follows the cursor (desktop only) */
html.pm-8k .pm-spot{position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(560px circle at var(--pm-x,50%) var(--pm-y,30%),rgba(212,168,67,.06),transparent 60%)}
/* fine gold hairline between sections */
html.pm-8k section.section{position:relative}
html.pm-8k section.section::before{content:'';position:absolute;top:0;left:50%;width:min(1200px,90%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(212,168,67,.26),transparent)}
/* images unveil with a clean wipe + slow settle */
.pm-js .pm-img{clip-path:inset(0 0 100% 0);transform:scale(1.08);transition:clip-path 1.3s var(--pm-ease),transform 1.8s var(--pm-ease)}
.pm-js .pm-img.pm-in{clip-path:inset(0 0 0 0);transform:none}
/* hero depth: background glow drifts slower than the page */
html.pm-8k .pm-par{will-change:transform}
/* crisp rendering */
html.pm-8k body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html.pm-8k ::selection{background:rgba(212,168,67,.35);color:#fff}
@media (prefers-reduced-motion:reduce){html.pm-8k .hero-h1 em,html.pm-8k .page-h1 em,html.pm-8k section h2 em{animation:none}.pm-js .pm-img{clip-path:none;transform:none;transition:none}}
@media (hover:none){html.pm-8k .pm-spot{display:none}}

/* stop sideways wobble on phones (marquee/hero glow spilling past screen edge) */
html,body{overflow-x:clip}

/* ---------- Clean desktop header ----------
   Desktop shows: Services · Industries · Results · About · Founder · Contact  |  Client login  |  2 buttons.
   Home (logo links home) and Presence stay in the HTML, the mobile menu and the footer. */
@media (min-width:1061px){
  .nav-inner{gap:1.5rem}
  .nav-logo{width:68px}
  .nav-brand{gap:.8rem}
  .nav-sub{display:none}
  .nav-name{font-size:1rem;letter-spacing:.01em}
  .nav-links{gap:.15rem}
  .nav-links a{padding:.45rem .8rem;font-size:.72rem;letter-spacing:.06em;white-space:nowrap}
  .nav-links a[href$="index.html"],.nav-links a[href$="our-presence.html"]{display:none}
  .nav-links a[href$="services.html"]{order:1}
  .nav-links a[href$="industries.html"]{order:2}
  .nav-links a[href$="case-studies.html"]{order:3}
  .nav-links a[href$="about.html"]{order:4}
  .nav-links a[href$="founder.html"]{order:5}
  .nav-links a[href$="contact.html"]{order:6}
  .nav-links a[href*="client-portal"]{order:7;color:var(--dim)!important;font-size:.68rem;margin-left:.6rem;padding-left:1.1rem;border-left:1px solid rgba(255,255,255,.12)!important;border-radius:0!important;display:inline-flex;align-items:center;gap:.4rem}
  .nav-links a[href*="client-portal"]::before{content:'';width:12px;height:12px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat}
  .nav-links a[href*="client-portal"]:hover{color:var(--pm-gold)!important;background:transparent}
  .nav-actions{gap:.6rem}
  /* secondary button: quiet gold outline instead of a glowing cream pill */
  .nav-actions .btn-score{background:transparent!important;color:var(--pm-gold)!important;border:1px solid rgba(212,168,67,.45)!important;animation:none!important;box-shadow:none!important;padding:.6rem 1rem!important}
  .nav-actions .btn-score::after{display:none}
  .nav-actions .btn-score:hover{background:rgba(212,168,67,.08)!important;border-color:var(--pm-gold)!important;transform:none;box-shadow:none}
  .nav-actions .btn-score .score-tag{background:rgba(212,168,67,.16)!important;color:var(--pm-gold)!important}
  .nav-actions .btn-gold{padding:.65rem 1.2rem;box-shadow:none}
}
@media (min-width:1061px) and (max-width:1380px){
  .nav-inner{gap:1rem}
  .nav-links a{padding:.45rem .55rem}
  .nav-links a[href*="client-portal"]{margin-left:.3rem;padding-left:.8rem}
}
@media (min-width:1061px) and (max-width:1220px){
  .nav-text{display:none}
}
@media (min-width:1061px) and (max-width:1140px){
  .nav-actions .btn-score{display:none!important}
}
@media (min-width:1281px){.nav-actions .btn-score .score-tag{display:inline-block!important}}
/* mobile menu: the header blur made the open menu see-through, so drop it on small screens */
@media (max-width:1060px){.nav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(5,5,7,.98)!important}.nav-links.open{background:#0a0a0c!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}

/* ---------- Static, crisp logo (no pulse/fade) ---------- */
.nav-logo,.nav-logo:hover{animation:none!important;transform:none!important;opacity:1!important;filter:none!important;transition:none!important;will-change:auto;image-rendering:auto;-webkit-backface-visibility:hidden;backface-visibility:hidden}
@media (min-width:1061px){.nav-logo{width:76px!important;height:76px!important}}
@media (max-width:1060px){.nav-logo{width:62px!important;height:62px!important}}
@media (max-width:640px){.nav-logo{width:54px!important;height:54px!important}}