/* ThirdEye V6: Figtree type, pill buttons, cleaner header + hero, scroll reveal, tidy-ups */

/* ---------- Type ---------- */
body,button,input,select,textarea{font-family:Figtree,Arial,Helvetica,sans-serif}
h1,h2,h3,h4{font-family:Figtree,Arial,Helvetica,sans-serif}
h2{letter-spacing:-.035em}

/* ---------- Buttons: pill shape, white text on orange ---------- */
.btn{border-radius:999px;padding:14px 28px;font-weight:600;transition:background .2s ease,border-color .2s ease,transform .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn.orange,.btn.orange:visited{background:var(--orange);border-color:var(--orange);color:#fff}
.btn.orange:hover{background:#fc6901;border-color:#fc6901;color:#fff}
.btn.orange .arrow{color:#fff}
.btn.ghost{border-radius:999px}
.reel-dialog-close,.view-controls,.view-controls button{border-radius:999px}
.reel-play{color:#fff}
.reel-play svg{fill:#fff}
.team-toggle-icon{color:#fff}
.toast-media .image-badge,.shockwave-media .image-badge{color:#fff;border-radius:999px}
.hero .hero-intro .text-link{border-radius:999px}

/* ---------- Header: logo left, centered nav, orange active bar, pill Connect ---------- */
.site-header{background:#fff;border-bottom:0;box-shadow:0 1px 0 rgba(16,50,59,.08),0 6px 20px rgba(16,50,59,.04)}
.header-inner{position:relative}
.desktop-nav{flex:1;justify-content:center;align-self:stretch;gap:clamp(22px,2.7vw,42px)}
.desktop-nav .nav-link{font-size:clamp(14px,1.05vw,15px);font-weight:500;color:var(--ink);min-height:0;height:100%}
.desktop-nav .nav-link:not(.nav-cta):after{bottom:0;height:3px;background:var(--orange);border-radius:3px 3px 0 0}
.desktop-nav .nav-cta{position:absolute;right:0;top:50%;transform:translateY(-50%);height:46px;padding:0 26px;border-radius:999px;color:#fff;font-weight:700;gap:14px;background:var(--orange);border-color:var(--orange)}
.desktop-nav .nav-cta:hover{background:#fc6901;border-color:#fc6901}
.mobile-panel .nav-cta{border-radius:999px;color:#fff;padding:0 22px}

/* ---------- Hero: text higher, gradient from the left, stacked like the example ---------- */
.hero{min-height:min(74vh,700px);align-items:center;padding:110px 0 120px!important}
.hero .hero-figure img{object-position:50% 70%}
.hero .hero-figure::after{background:linear-gradient(90deg,rgba(9,50,60,.96) 0%,rgba(9,50,60,.86) 28%,rgba(9,50,60,.45) 56%,rgba(9,50,60,.08) 100%),linear-gradient(0deg,rgba(6,24,30,.35) 0%,rgba(6,24,30,0) 40%)}
.hero .hero-figure figcaption{display:none}
.hero .eyebrow{color:rgba(255,255,255,.72);font-size:12px;letter-spacing:.24em}
.hero .eyebrow .dot{display:none}
.hero .hero-layout{display:block;max-width:680px;margin-top:18px}
.hero h1{font-size:clamp(44px,5.4vw,80px);line-height:1.02;letter-spacing:-.04em;font-weight:700}
.hero .hero-intro{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:0;padding:0;margin-top:26px;max-width:520px;justify-self:auto}
.hero .hero-intro p{font-size:clamp(17px,1.35vw,20px);line-height:1.55;margin:0 0 32px;max-width:500px;color:rgba(255,255,255,.88)}
.hero .hero-intro .btn,.hero .hero-intro .text-link{width:auto;display:inline-flex;min-height:52px;margin:0 10px 10px 0;padding:0 28px;justify-content:center;gap:14px}
@media (max-width:760px){
 .hero{min-height:600px;padding:76px 0 80px!important;align-items:flex-end}
 .hero .hero-figure img{object-position:58% 60%}
 .hero .hero-figure::after{background:linear-gradient(0deg,rgba(9,50,60,.97) 0%,rgba(9,50,60,.85) 50%,rgba(9,50,60,.45) 100%)}
 .hero .hero-intro .btn,.hero .hero-intro .text-link{width:100%;margin-right:0}
}

/* ---------- Scroll reveal: grey first, then into colour ---------- */
.te-split .te-w{opacity:.14;transition:opacity .6s ease}
.te-split.te-on .te-w{opacity:1}
.te-fade{opacity:.18;transition:opacity 1s ease .1s}
.te-fade.te-on{opacity:1}
@media (prefers-reduced-motion:reduce){.te-split .te-w,.te-fade{opacity:1!important;transition:none}}

/* ---------- Tidy-ups: hide reviewer notes and placeholders ---------- */
.scale-strip,.toast-review-note,.shockwave-review-note,.leadership-review-note,.testimonial-review-note,.quotes-placeholder-label,.quote-draft,#lookbook-download,.toast-media figcaption,.shockwave-media figcaption{display:none!important}
.quote-role{line-height:1.5}
/* fix 1 */
.te-split .te-w{display:inline!important;white-space:normal}
.hero h1>span{white-space:nowrap}
@media (max-width:420px){.hero h1>span{white-space:normal}}
