.hero-cinematic {
  min-height: 760px;
}

.hero-media-wrap { will-change: transform; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.hero-media-wrap picture { display: block; height: 100%; }

.site-header { transition: box-shadow .25s ease, background-color .25s ease; }
.site-header.is-scrolled { background-color: rgba(255,255,255,.98); box-shadow: 0 12px 35px rgba(11,31,53,.08); }

.hero-media {
  animation: hero-breathe 16s ease-out both;
  transform-origin: 68% center;
}

.hero-glow { position: absolute; z-index: 1; left: 63%; top: 42%; width: 34vw; height: 34vw; border-radius: 999px; background: radial-gradient(circle, rgba(216,184,117,.18), rgba(216,184,117,0) 68%); pointer-events: none; mix-blend-mode: screen; transition: transform 1s cubic-bezier(.2,.7,.2,1); }
.hero-scan { position: absolute; z-index: 2; inset: 0 auto 0 45%; width: 1px; background: linear-gradient(transparent, rgba(216,184,117,.7), transparent); opacity: .42; animation: hero-scan 6.5s ease-in-out infinite; }

.hero-overlay {
  background: linear-gradient(90deg, rgba(6, 18, 32, .98) 0%, rgba(8, 24, 42, .92) 40%, rgba(8, 24, 42, .48) 68%, rgba(8, 24, 42, .2) 100%), linear-gradient(0deg, rgba(5, 17, 30, .45), transparent 45%);
}

.hero-grid {
  background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 90px 90px;
  mask-image: linear-gradient(90deg, black, transparent 70%);
}

.hero-title {
  max-width: 780px;
  text-wrap: balance;
  text-shadow: 0 10px 45px rgba(0,0,0,.25);
}
.hero-title span,.hero-title em { display: block; }
.hero-title em { color: #d8b875; font-style: normal; }
.hero-enter { opacity: 0; transform: translateY(28px); animation: hero-enter .9s cubic-bezier(.18,.75,.25,1) forwards; }
.hero-enter--1 { animation-delay: .12s; }.hero-enter--2 { animation-delay: .25s; }.hero-enter--3 { animation-delay: .4s; }.hero-enter--4 { animation-delay: .54s; }.hero-enter--5 { animation-delay: .68s; }

.btn-on-dark {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 7px;
  padding: .7rem 1.2rem;
  color: white;
  font-size: 14px;
  font-weight: 700;
  transition: background-color .25s ease, border-color .25s ease, transform .25s ease;
}

.btn-on-dark:hover { background: white; border-color: white; color: #0b1f35; transform: translateY(-2px); }

.btn-shine { position: relative; overflow: hidden; }
.btn-shine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.35) 50%, transparent 65%); transform: translateX(-120%); transition: transform .7s ease; }
.btn-shine:hover::after { transform: translateX(120%); }

.scroll-cue { align-items: center; gap: .75rem; writing-mode: vertical-rl; }
.scroll-cue span { animation: scroll-pulse 1.8s ease-in-out infinite; }
.hero-note { animation: note-rise .8s .55s cubic-bezier(.2,.75,.25,1) both; }

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .75s cubic-bezier(.2,.75,.25,1), transform .75s cubic-bezier(.2,.75,.25,1);
}

.reveal[data-reveal="left"] { transform: translateX(-28px); }
.reveal[data-reveal="right"] { transform: translateX(28px); }
.reveal.is-visible { opacity: 1; transform: translate(0, 0); }

.service-card.reveal:nth-child(2), .feature-line.reveal:nth-child(2) { transition-delay: 90ms; }
.service-card.reveal:nth-child(3) { transition-delay: 180ms; }
.service-card.reveal:nth-child(4) { transition-delay: 270ms; }

.image-frame { position: relative; margin-right: 2rem; }
.image-frame::before { content: ""; position: absolute; inset: 2rem -2rem -2rem 2rem; z-index: -1; background: #e7dfd1; }
.image-frame img { filter: saturate(.82) contrast(1.03); }
.image-accent { position: absolute; inset: 1.25rem; border: 1px solid rgba(255,255,255,.5); pointer-events: none; }
.floating-proof { position: absolute; right: -1rem; bottom: 2.5rem; display: grid; max-width: 230px; gap: .25rem; border-left: 3px solid #a77a32; background: #0b1f35; padding: 1.2rem 1.4rem; color: white; box-shadow: 0 20px 50px rgba(11,31,53,.22); }
.floating-proof strong { font-family: "Manrope", sans-serif; font-size: 15px; }
.floating-proof span { color: #cbd5e1; font-size: 12px; line-height: 1.6; }
.feature-line { display: flex; gap: 1rem; border-top: 1px solid #dfe4ea; padding-top: 1.25rem; }
.feature-line > span { color: #a77a32; font-size: 11px; font-weight: 700; letter-spacing: .1em; }
.feature-line h3 { color: #0b1f35; font-size: 14px; font-weight: 700; }
.feature-line p { margin-top: .4rem; color: #64748b; font-size: 12px; line-height: 1.65; }

.metric strong { display: inline-block; transition: transform .3s ease, color .3s ease; }
.metric:hover strong { color: #d8b875; transform: translateY(-2px); }
.service-card::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 3px; background: #a77a32; transition: right .35s ease; }
.service-card:hover::after { right: 0; }

.expertise-tab { display: grid; width: 100%; grid-template-columns: 26px 1fr auto; align-items: center; gap: .75rem; border: 1px solid transparent; padding: .9rem .8rem; text-align: left; color: #aeb9c6; transition: background-color .25s ease, border-color .25s ease, color .25s ease, transform .25s ease; }
.expertise-tab span { color: #d8b875; font-size: 10px; font-weight: 700; }
.expertise-tab strong { font-size: 12px; line-height: 1.45; }
.expertise-tab i { opacity: 0; transform: translateX(-5px); color: #d8b875; font-style: normal; transition: opacity .25s ease, transform .25s ease; }
.expertise-tab:hover,.expertise-tab.is-active { border-color: rgba(216,184,117,.22); background: rgba(255,255,255,.06); color: #fff; transform: translateX(3px); }
.expertise-tab.is-active i { opacity: 1; transform: translateX(0); }
.expertise-panel { animation: expertise-enter .42s cubic-bezier(.2,.75,.25,1) both; }
.htmx-indicator { opacity: 0; transition: opacity .2s ease; }
.htmx-request .htmx-indicator,.htmx-request.htmx-indicator { opacity: 1; }
.htmx-request .htmx-indicator span,.htmx-request.htmx-indicator span { animation: htmx-loader .8s ease-in-out infinite alternate; }

.whatsapp-fab { position: fixed; z-index: 48; inset-inline-end: clamp(1rem, 2.2vw, 2rem); bottom: calc(clamp(1rem, 2.2vw, 2rem) + env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; gap: .7rem; color: white; filter: drop-shadow(0 14px 25px rgba(11,31,53,.24)); }
.whatsapp-fab__icon { position: relative; display: grid; width: 58px; height: 58px; flex: none; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; background: #20b45a; box-shadow: inset 0 1px 0 rgba(255,255,255,.22); transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.whatsapp-fab__icon::before { content: ""; position: absolute; inset: -5px; z-index: -1; border: 1px solid rgba(37,211,102,.42); border-radius: inherit; animation: whatsapp-pulse 2.8s ease-out infinite; }
.whatsapp-fab__icon svg { width: 30px; height: 30px; }
.whatsapp-fab__label { pointer-events: none; position: absolute; inset-inline-end: calc(100% + .7rem); width: max-content; max-width: 230px; border-radius: 7px; background: #0b1f35; padding: .65rem .85rem; color: white; font-size: 12px; font-weight: 700; opacity: 0; transform: translateX(7px); transition: opacity .22s ease, transform .22s ease; }
.whatsapp-fab:hover .whatsapp-fab__icon,.whatsapp-fab:focus-visible .whatsapp-fab__icon { background: #169b4a; transform: translateY(-3px); box-shadow: 0 12px 28px rgba(32,180,90,.3); }
.whatsapp-fab:hover .whatsapp-fab__label,.whatsapp-fab:focus-visible .whatsapp-fab__label { opacity: 1; transform: translateX(0); }
.whatsapp-fab:focus-visible { outline: none; }
.whatsapp-fab:focus-visible .whatsapp-fab__icon { outline: 3px solid rgba(216,184,117,.75); outline-offset: 3px; }

@keyframes hero-breathe { from { transform: scale(1.065); } to { transform: scale(1); } }
@keyframes hero-enter { to { opacity: 1; transform: translateY(0); } }
@keyframes hero-scan { 0%,100% { transform: translateX(-14vw); opacity: 0; } 20%,80% { opacity: .42; } 50% { transform: translateX(34vw); } }
@keyframes expertise-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes htmx-loader { from { transform: translateX(-20%); } to { transform: translateX(220%); } }
@keyframes note-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scroll-pulse { 0%,100% { transform: translateY(0); opacity: .45; } 50% { transform: translateY(7px); opacity: 1; } }
@keyframes whatsapp-pulse { 0% { opacity: .75; transform: scale(.88); } 70%,100% { opacity: 0; transform: scale(1.24); } }

html[dir="rtl"] .hero-media-wrap picture { transform: scaleX(-1); }
html[dir="rtl"] .hero-overlay { background: linear-gradient(270deg, rgba(6, 18, 32, .98) 0%, rgba(8, 24, 42, .92) 40%, rgba(8, 24, 42, .48) 68%, rgba(8, 24, 42, .2) 100%), linear-gradient(0deg, rgba(5, 17, 30, .45), transparent 45%); }
html[dir="rtl"] .hero-grid { mask-image: linear-gradient(270deg, black, transparent 70%); }
html[dir="rtl"] .hero-note { right: auto !important; left: 2rem; }
html[dir="rtl"] .metric { border-left: 0; border-right: 1px solid rgba(255,255,255,.16); padding-left: 0; padding-right: 1.5rem; }
html[dir="rtl"] .image-frame { margin-right: 0; margin-left: 2rem; }
html[dir="rtl"] .image-frame::before { inset: 2rem 2rem -2rem -2rem; }
html[dir="rtl"] .floating-proof { right: auto; left: -1rem; border-left: 0; border-right: 3px solid #a77a32; }
html[dir="rtl"] .expertise-tab:hover,html[dir="rtl"] .expertise-tab.is-active { transform: translateX(-3px); }
html[dir="rtl"] .expertise-tab i { transform: translateX(5px); }
html[dir="rtl"] .expertise-tab.is-active i { transform: translateX(0); }

@media (max-width: 1023px) {
  .hero-overlay { background: linear-gradient(90deg, rgba(6,18,32,.94), rgba(6,18,32,.7)), linear-gradient(0deg, rgba(6,18,32,.58), transparent); }
  .hero-media { object-position: 64% center; }
  html[dir="rtl"] .hero-overlay { background: linear-gradient(270deg, rgba(6,18,32,.94), rgba(6,18,32,.7)), linear-gradient(0deg, rgba(6,18,32,.58), transparent); }
}

@media (max-width: 640px) {
  .hero-cinematic, .hero-cinematic .site-container { min-height: 700px; }
  .hero-cinematic .site-container { padding-top: 4rem; padding-bottom: 4rem; }
  .hero-overlay { background: linear-gradient(90deg, rgba(6,18,32,.94), rgba(6,18,32,.74)); }
  .hero-title { font-size: clamp(2.5rem, 12.5vw, 3.25rem); line-height: 1.02; }
  .hero-content > p:nth-of-type(2) { font-size: 1rem; line-height: 1.8; }
  .hero-scan { left: 42%; }
  .image-frame { margin-right: 1rem; }
  .image-frame::before { inset: 1rem -1rem -1rem 1rem; }
  .image-frame img { height: 450px; }
  .floating-proof { right: -.25rem; bottom: 1.5rem; }
  .link-arrow { min-height: 44px; align-items: center; }
  .footer-list a { display: inline-flex; min-height: 40px; align-items: center; }
  .expertise-panel { padding: 1.75rem; }
  .form-row + .btn-primary { width: 100%; }
  html[dir="rtl"] .image-frame { margin-right: 0; margin-left: 1rem; }
  html[dir="rtl"] .image-frame::before { inset: 1rem 1rem -1rem -1rem; }
  html[dir="rtl"] .floating-proof { right: auto; left: -.25rem; }
  html[dir="rtl"] .metric { padding-left: 0; padding-right: 1rem; }
  .whatsapp-fab__icon { width: 54px; height: 54px; }
  .whatsapp-fab__icon svg { width: 28px; height: 28px; }
  .whatsapp-fab__label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal, .reveal[data-reveal] { opacity: 1; transform: none; }
}