/* BADBAN V12 — brand-only refinements: work tiles, footer boat, loader. Remove this file + its <link> to revert. */
:root{ --color-muted:#2c6670; --color-border:rgba(2,110,129,.22); }

/* ---- WORK TILES: sharp corners (photo text stays visible), brand colours only ---- */
.work-tile__visual,.work-tile__img{ border-radius:0 !important; }
.work-tile__visual{ box-shadow:0 0 0 0 var(--color-accent) !important; transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out); }
.work-tile:hover .work-tile__visual{ box-shadow:12px 12px 0 0 var(--color-accent) !important; transform:translate(-4px,-4px); }
[dir='rtl'] .work-tile:hover .work-tile__visual{ box-shadow:-12px 12px 0 0 var(--color-accent) !important; transform:translate(4px,-4px); }
.work-tile__view{ border-radius:0; background:var(--color-accent); color:var(--color-ink); }
.work-tile__caption{ position:relative; margin-top:1.4rem; padding-top:1.1rem; border-top:1px solid rgba(2,110,129,.3); }
.work-tile__caption::before{ content:""; position:absolute; inset-block-start:-2px; inset-inline-start:0; height:3px; width:48px; background:var(--color-accent); transition:width .7s var(--ease-out); }
.work-tile:hover .work-tile__caption::before{ width:100%; }
.work-tile__title{ color:var(--color-ink); }
.work-tile__meta{ color:var(--color-primary); font-weight:600; }

/* ---- FOOTER BOAT: bigger, calm, with reflection and foam ---- */
.footer__sea .seaband__boat{
  width:clamp(150px,16vw,250px);
  filter:brightness(1.3) saturate(1.2) drop-shadow(0 10px 14px rgba(0,0,0,.45));
  animation:seabandDrift 64s linear infinite, boatRide 6.5s ease-in-out infinite;
}
.footer__sea .seaband__boat::after{
  content:""; position:absolute; inset:96% 6% auto; height:55%;
  background:inherit; transform:scaleY(-1); opacity:.26; filter:blur(2px);
  -webkit-mask-image:linear-gradient(#000,transparent 75%); mask-image:linear-gradient(#000,transparent 75%);
}
.footer__sea .seaband__boat::before{
  content:""; position:absolute; inset:auto 4% 4%; height:12px; z-index:-1;
  background:radial-gradient(closest-side,rgba(244,241,233,.7),transparent); filter:blur(3px);
}
.footer__sea{ background:linear-gradient(180deg,rgba(2,110,129,0) 0%,rgba(2,110,129,.22) 50%,rgba(3,60,72,.7) 100%); }
.footer__sea::before{
  content:""; position:absolute; inset:0 20% auto; height:1px; z-index:0;
  background:linear-gradient(90deg,transparent,rgba(232,166,19,.55),transparent);
}

/* ---- LOADER: full-screen night voyage with a big wordmark ---- */
.loader{ overflow:hidden; background:radial-gradient(90% 70% at 50% 15%,#06505e 0%,#04262d 50%,#010d11 100%); }
.loader__sea{
  position:absolute; inset:0; width:auto; height:auto; border:0; border-radius:0; box-shadow:none;
  background:linear-gradient(180deg,#010d11 0%,#04262d 45%,#035566 80%,#026e81 100%);
}
.loader.is-exiting .loader__sea{ transform:none; opacity:1; }
.scene__wave{ inset-inline:-10%; width:120%; }
.loader__brand{
  position:absolute; inset-inline:0; inset-block-start:20%; z-index:5; direction:ltr;
  display:flex; justify-content:center; gap:clamp(.3rem,1.8vw,1.6rem);
  font-family:var(--font-en); font-weight:700; line-height:1; font-size:clamp(3.4rem,13vw,11rem);
  pointer-events:none;
}
.loader__brand span{
  opacity:0; transform:translateY(45%); filter:blur(14px);
  background:linear-gradient(180deg,var(--color-paper) 40%,var(--color-accent));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:brandLetter 1.2s var(--ease-out) forwards; animation-delay:calc(var(--i) * .1s + .15s);
}
@keyframes brandLetter{ to{ opacity:1; transform:none; filter:blur(0); } }
.loader__slogan{ position:absolute; z-index:5; inset-inline:0; inset-block-start:calc(20% + clamp(4rem,14vw,11.6rem)); }
.loader__track{ display:block; position:absolute; inset:auto 0 0; height:3px; z-index:6; background:rgba(129,179,178,.18); }
.loader__bar{ display:block; width:100%; height:100%; transform-origin:0 50%; background:linear-gradient(90deg,var(--color-primary),var(--color-accent)); box-shadow:0 0 18px rgba(232,166,19,.8); }
[dir='rtl'] .loader__bar{ transform-origin:100% 50%; background:linear-gradient(270deg,var(--color-primary),var(--color-accent)); }
.loader__hud{ z-index:6; }
@media (prefers-reduced-motion:reduce){ .loader__brand span{ animation:none; opacity:1; transform:none; filter:none; } }
.scene__wave{ direction:ltr; }
.loader__hud{ inset-block-end:auto; inset-block-start:calc(20% + clamp(6.2rem,17vw,14rem)); flex-direction:column-reverse; align-items:center; justify-content:center; gap:.6rem; }
.loader__percent{ color:var(--color-accent); }
.scene__wave svg{ max-width:none; width:200%; }
.footer__sea .seaband__boat{ inset-block-end:clamp(-22px,-1.4vw,-10px); filter:brightness(1.45) saturate(1.3) drop-shadow(0 0 1px rgba(232,166,19,.9)) drop-shadow(0 0 14px rgba(232,166,19,.35)); }

/* no big faded BADBAN watermark behind the intro section */
.intro::after, [lang='fa'] .intro::after{ content:none !important; display:none !important; }

/* ---- LOADER v2: no treasure light before arrival, softer moon glare, extra atmosphere ---- */
.scene__goal::before,.voyage__goal::before{ opacity:0; }
.loader.is-arrived .scene__goal::before{ opacity:1; animation:treasureBurst 1s ease-out forwards; }
.loader.is-arrived .scene__goal{ filter:drop-shadow(0 0 18px rgba(232,166,19,.9)); }
.scene__moon{ width:88px; height:88px; inset-block-start:7%; }
.scene__glare{ width:120px; inset-inline-end:calc(11% - 16px); inset-block-start:calc(7% + 80px);
  -webkit-mask-image:radial-gradient(60% 100% at 50% 0,#000 20%,transparent 75%); mask-image:radial-gradient(60% 100% at 50% 0,#000 20%,transparent 75%); }
.loader__sea{ box-shadow:inset 0 0 240px rgba(0,0,0,.55); }
.scene__sea::before{ content:""; position:absolute; inset-inline:0; inset-block-start:-110px; height:140px; pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(129,179,178,.16),transparent); }
.scene__stars::before,.scene__stars::after{ content:""; position:absolute; width:110px; height:2px; border-radius:2px; opacity:0;
  background:linear-gradient(90deg,transparent,#fff6d9); transform:rotate(18deg); animation:shoot 5.5s ease-in infinite; }
.scene__stars::before{ inset-block-start:12%; inset-inline-start:58%; animation-delay:.9s; }
.scene__stars::after{ inset-block-start:30%; inset-inline-start:22%; animation-delay:3.4s; }
@keyframes shoot{ 0%{opacity:0;transform:translate(0,0) rotate(18deg)} 4%{opacity:1} 14%{opacity:0;transform:translate(-260px,85px) rotate(18deg)} 100%{opacity:0} }
[dir='rtl'] .scene__stars::before,[dir='rtl'] .scene__stars::after{ transform:rotate(18deg); }
.loader__brand{ filter:drop-shadow(0 0 28px rgba(232,166,19,.22)); }
.loader__slogan::after{ content:""; display:block; width:0; height:2px; margin:.9rem auto 0; background:linear-gradient(90deg,transparent,var(--color-accent),transparent); animation:sloganLine 1.4s var(--ease-out) 1.5s forwards; }
@keyframes sloganLine{ to{ width:min(240px,50vw); } }
@media (prefers-reduced-motion:reduce){ .scene__stars::before,.scene__stars::after{ display:none; } }
.loader__hud{ inset-block-start:calc(20% + clamp(7.6rem,19vw,15.4rem)); }
/* the ship is positioned every frame by JS; a CSS transition only made it lag behind the gold trail */
.scene__ship{ transition:none !important; }

/* footer boat: boat.png faces LEFT — mirror it only in LTR (travels left→right), keep native in RTL */
.footer__sea .seaband__boat{ animation:seabandDrift 64s linear infinite, boatRideFlip 6.5s ease-in-out infinite; }
[dir='rtl'] .footer__sea .seaband__boat{ animation:seabandDrift 64s linear infinite, boatRide 6.5s ease-in-out infinite; }
@media (prefers-reduced-motion:reduce){
  .footer__sea .seaband__boat,[dir='rtl'] .footer__sea .seaband__boat{ animation:none; inset-inline-start:12%; }
  .footer__sea .seaband__boat{ transform:scaleX(-1); } [dir='rtl'] .footer__sea .seaband__boat{ transform:none; }
}
