/* Dickson Multimedia: page backgrounds + scroll effects */
body > div{overflow-x:clip!important}

/* ---------- Backgrounds ---------- */
.has-bg body > div:not(.bg-fx){background:transparent!important;position:relative;z-index:1}
.bg-fx{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.bg-fx .grain{position:absolute;inset:-50%;opacity:.08;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.bg-home{background:#000}
.bg-services{background:linear-gradient(160deg,#050D24 0%,#0E2260 55%,#1E3FA8 100%)}
.bg-tours{background:linear-gradient(160deg,#03190F 0%,#0A3D28 55%,#12694A 100%)}
.bg-contact{background:linear-gradient(160deg,#16040F 0%,#3A0E2E 55%,#6B1B52 100%)}

/* ---------- Reveal ---------- */
.fx .sr{opacity:0;transform:translateY(44px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.fx .sr.in{opacity:1;transform:none}
.fx .card.sr.in:hover{transform:translateY(-6px)}

/* ---------- Big outlined numbers that fill with orange ---------- */
.big-num{position:absolute;right:14px;bottom:-14px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(96px,11vw,170px);line-height:1;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(242,106,33,.45);background:linear-gradient(0deg,#F26A21 50%,transparent 50%);background-size:100% 200%;background-position:0 0;-webkit-background-clip:text;background-clip:text;transition:background-position 1.4s cubic-bezier(.2,.7,.2,1) .25s;pointer-events:none;z-index:0;opacity:.9}
.in > .big-num{background-position:0 100%}

/* ---------- Home: service cards ---------- */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes ang{to{--ang:360deg}}
.svc-card{position:relative;overflow:hidden;padding-bottom:104px!important}
.svc-card > *:not(.big-num){position:relative;z-index:1}
.svc-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--ang),transparent 0 62%,#F26A21 78%,#FFD0A8 86%,transparent 96%);-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 .35s ease;animation:ang 2.6s linear infinite;z-index:2;pointer-events:none}
.svc-card:hover::before{opacity:1}
.fx .svc-card{opacity:0;transform:translateY(90px) rotate(-4deg) scale(.94);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1),border-color .35s ease,background .35s ease}
.fx .svc-card.in{opacity:1;transform:none}
.fx .svc-card.in:hover{transition:transform .15s ease-out,border-color .35s ease,background .35s ease;transition-delay:0s!important}
.svc-card .big-num{font-size:110px;right:12px;bottom:-20px}

/* ---------- Services page rows ---------- */
.svc-row{position:relative;overflow:hidden}
.svc-row > *:not(.big-num){position:relative;z-index:1}
.fx .wipe{clip-path:inset(0 100% 0 0);transition:clip-path 1.1s cubic-bezier(.7,0,.2,1)}
.fx .in > .wipe{clip-path:inset(0)}
.fx .wipe img{transform:scale(1.2);transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.fx .in > .wipe img{transform:none}
@media (max-width:899px){.svc-row .big-num{top:14px;right:18px;bottom:auto;font-size:84px;z-index:3;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45))}}

/* pinned showcase (desktop) */
.show-shell{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:start}
.show-stage{position:sticky;top:110px;height:calc(100vh - 150px);min-height:420px;border-radius:24px;overflow:hidden;background:#000;box-shadow:0 40px 90px rgba(0,0,0,.5)}
.show-item{position:absolute;inset:0;clip-path:inset(0 0 100% 0);transition:clip-path 1s cubic-bezier(.7,0,.2,1)}
.show-item.on,.show-item.past{clip-path:inset(0)}
.show-item img{transform:scale(1.18);transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.show-item.on img{transform:none}
.show-item > div[aria-hidden]{padding:40px!important}
.show-item > div[aria-hidden] span:last-child{font-size:clamp(56px,6vw,96px)!important}
.show-count{position:absolute;left:24px;bottom:20px;z-index:50;font-family:'Space Grotesk',sans-serif;font-size:15px;letter-spacing:.12em;color:#fff;background:rgba(0,0,0,.45);backdrop-filter:blur(8px);padding:8px 14px;border-radius:999px}
.show-count b{color:#F26A21;font-size:18px}
.show-list{display:flex;flex-direction:column}
.show-on .svc-row{min-height:66vh;display:flex!important;align-items:flex-end;border-color:transparent!important;background:none!important;padding:0 0 10vh!important;transform:none!important}
.show-on .svc-row > div{opacity:.22;transform:translateX(48px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.show-on .svc-row.active > div{opacity:1;transform:none}
.show-on .svc-row .big-num{right:0;left:auto;top:6vh;bottom:auto;font-size:clamp(130px,12vw,190px);opacity:.6}
.show-on .svc-row.in > .big-num{background-position:0 0}
.show-on .svc-row.active > .big-num{background-position:0 100%;opacity:1}
.show-on .svc-row h2{font-size:clamp(34px,3.4vw,48px)!important}

/* ---------- Pinned tour days ---------- */
.pin-wrap{position:relative;height:320vh}
.pin-stick{position:sticky;top:72px;height:calc(100vh - 72px);display:flex;flex-direction:column;justify-content:center;gap:24px;overflow:hidden}
.pin-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.pin-label{font-size:13px;font-weight:800;letter-spacing:.18em;color:#F2C14E}
.pin-dots{display:flex;gap:8px}
.pin-dots i{width:28px;height:4px;border-radius:2px;background:#2B5A44;transition:background .3s ease,width .3s ease}
.pin-dots i.on{background:#F2C14E;width:44px}
.pin-track{display:flex;gap:20px;width:max-content;will-change:transform}
.pin-track .pin-card{width:min(440px,78vw);flex:0 0 auto}
.pin-track .pin-card .zoom{height:min(300px,32vh)!important}
.pin-track .pin-card span:nth-child(2){font-size:30px!important}

/* home: light + yellow sections */
.tone-yellow,.tone-light{background:transparent!important}
.tone-light .card:hover,.tone-yellow .card:hover{background:rgba(255,255,255,.65)!important}
.tone-light .track-rev{-webkit-text-stroke-color:#8F887F!important}
.tone-light .svc-card{background:rgba(255,255,255,.55)}
.tone-light .brand:hover{color:#F26A21!important}
