:root{
  --bg:#050505;
  --bg-soft:#0b0b0b;
  --panel:#111111;
  --panel-2:#171717;
  --text:#f7f3ec;
  --muted:#a9a39b;
  --orange:#ff5a01;
  --orange-2:#ff7a1a;
  --cream:#fce9da;
  --olive:#415820;
  --line:#2a2a2a;
  --max:1280px;
  --radius:22px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 86% 9%, rgba(255,90,1,.12), transparent 26rem),
    var(--bg);
  color:var(--text);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.5;
  overflow-x:hidden;
}

body.menu-open{overflow:hidden}
button,a{font:inherit}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{color:inherit}

.noise{
  position:fixed;
  inset:0;
  z-index:999;
  pointer-events:none;
  opacity:.025;
  background-image:
    linear-gradient(90deg, transparent 49%, #fff 50%, transparent 51%),
    linear-gradient(0deg, transparent 49%, #fff 50%, transparent 51%);
  background-size:7px 7px;
  mix-blend-mode:overlay;
}

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 clamp(20px,4vw,58px);
  background:rgba(5,5,5,.82);
  border-bottom:1px solid rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:900;
  letter-spacing:-.03em;
}
.brand img{
  width:48px;
  height:48px;
  object-fit:contain;
  filter:drop-shadow(0 0 18px rgba(255,90,1,.08));
}
.brand span{font-size:1.05rem}

.main-nav{
  display:flex;
  align-items:center;
  gap:30px;
  color:#c9c4bd;
  font-size:.88rem;
  font-weight:700;
}
.main-nav a{
  position:relative;
  padding:10px 0;
}
.main-nav a::after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:4px;
  height:2px;
  background:var(--orange);
  transition:.25s ease;
}
.main-nav a:hover::after{right:0}
.main-nav a:hover{color:#fff}

.nav-toggle{
  display:none;
  width:44px;height:44px;
  border:1px solid var(--line);
  border-radius:50%;
  background:#0d0d0d;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:4px;
}
.nav-toggle span{width:18px;height:2px;background:#fff;border-radius:99px}

.section{
  width:min(var(--max), calc(100% - 40px));
  margin-inline:auto;
}

.hero{
  min-height:calc(100vh - 82px);
  display:grid;
  grid-template-columns:1fr .92fr;
  align-items:center;
  gap:clamp(40px,7vw,110px);
  padding-block:80px 90px;
}

.eyebrow{
  margin:0 0 18px;
  color:var(--orange);
  font-size:.74rem;
  font-weight:900;
  letter-spacing:.18em;
}

.hero h1,
.section-heading h2,
.about h2,
.contact h2{
  margin:0;
  font-size:clamp(3.2rem,7vw,7.7rem);
  line-height:.87;
  letter-spacing:-.07em;
  text-transform:uppercase;
}
.hero h1 span{
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.6);
}
.hero-text{
  max-width:650px;
  margin:32px 0 0;
  color:#bbb5ad;
  font-size:clamp(1rem,1.6vw,1.2rem);
}
.hero-text strong{color:#fff}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:32px;
}

.btn{
  min-height:50px;
  padding:0 20px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid transparent;
  font-size:.88rem;
  font-weight:900;
  letter-spacing:.03em;
  cursor:pointer;
  transition:.25s ease;
}
.btn-primary{
  color:#080808;
  background:var(--orange);
  border-color:var(--orange);
}
.btn-primary:hover{
  transform:translateY(-2px);
  background:var(--orange-2);
}
.btn-ghost{
  background:#0e0e0e;
  border-color:#2f2f2f;
}
.btn-ghost:hover{border-color:#666;transform:translateY(-2px)}

.hero-meta{
  margin-top:40px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.hero-meta span{
  padding:7px 11px;
  border:1px solid #292929;
  border-radius:999px;
  color:#908a82;
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.hero-visual{
  min-height:620px;
  position:relative;
  display:grid;
  place-items:center;
}
.hero-frame{
  width:min(86%,540px);
  aspect-ratio:4/5;
  border:1px solid #2e2e2e;
  padding:10px;
  background:#0c0c0c;
  transform:rotate(2.3deg);
  position:relative;
  z-index:3;
  box-shadow:0 40px 80px rgba(0,0,0,.45);
}
.placeholder-image{
  width:100%;
  height:100%;
  position:relative;
  overflow:hidden;
  background:#171717;
}
.hero-placeholder{
  background:
    linear-gradient(145deg, transparent 0 55%, rgba(255,90,1,.42) 55% 59%, transparent 59%),
    radial-gradient(circle at 62% 26%, rgba(255,90,1,.42), transparent 14rem),
    linear-gradient(150deg,#0d0d0d 0 45%, #242424 45% 62%, #101010 62%);
}
.hero-placeholder::before{
  content:"";
  position:absolute;
  inset:12% 16%;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50% 50% 44% 56%/60% 44% 56% 40%;
  transform:rotate(-12deg);
}
.placeholder-copy{
  position:absolute;
  left:22px;
  right:22px;
  bottom:22px;
  display:grid;
  gap:4px;
}
.placeholder-copy strong{font-size:1.25rem;letter-spacing:.06em}
.placeholder-copy small{color:#aaa}
.shot-index{
  width:max-content;
  color:var(--orange);
  font-weight:900;
  letter-spacing:.15em;
}

.floating-logo{
  position:absolute;
  right:-2%;
  bottom:-3%;
  width:min(46%,300px);
  z-index:6;
  pointer-events:none;
}
.floating-logo img{
  width:100%;
  height:auto;
  object-fit:contain;
  background:transparent;
  filter:drop-shadow(0 18px 35px rgba(0,0,0,.82)) drop-shadow(0 0 18px rgba(255,90,1,.16));
}
.orbit{
  position:absolute;
  border:1px solid rgba(255,90,1,.48);
  border-radius:50%;
}
.orbit-one{width:76%;aspect-ratio:1;transform:rotate(-18deg)}
.orbit-two{width:92%;aspect-ratio:1;border-color:rgba(255,255,255,.12);transform:rotate(22deg)}

to{transform:translateX(-50%)}
}

.portfolio,.series,.about,.contact{padding-block:120px}

.section-heading{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:42px;
}
.section-heading h2,.about h2,.contact h2{
  font-size:clamp(2.8rem,6vw,6.8rem);
}
.section-heading>p{
  max-width:520px;
  margin:0;
  color:#8f8982;
}
.section-heading.compact{align-items:center}

.filter-bar{
  display:flex;
  gap:10px;
  overflow:auto;
  padding-bottom:16px;
  scrollbar-width:none;
}
.filter-bar::-webkit-scrollbar{display:none}
.filter{
  white-space:nowrap;
  border:1px solid #292929;
  background:#0e0e0e;
  color:#a6a099;
  border-radius:999px;
  padding:10px 15px;
  font-size:.8rem;
  font-weight:800;
  cursor:pointer;
  transition:.2s ease;
}
.filter:hover{color:#fff;border-color:#555}
.filter.is-active{
  color:#050505;
  background:var(--orange);
  border-color:var(--orange);
}

.photo-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:240px;
  gap:14px;
  margin-top:16px;
}
.photo-card{
  grid-column:span 4;
  grid-row:span 2;
  position:relative;
  overflow:hidden;
  border-radius:16px;
  border:1px solid #242424;
  background:#111;
  cursor:pointer;
  isolation:isolate;
  transition:.25s ease;
}
.photo-card.tall{grid-row:span 3}
.photo-card.wide{grid-column:span 8}
.photo-card:hover{transform:translateY(-4px);border-color:#484848}
.photo-card.is-hidden{display:none}
.photo-card .placeholder-image{transition:.45s ease}
.photo-card:hover .placeholder-image{transform:scale(1.035)}
.photo-card .placeholder-image::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg, transparent 38%, rgba(0,0,0,.87));
}

.p1{
  background:
    radial-gradient(circle at 48% 24%, #4b311e 0 5%, transparent 5.5%),
    linear-gradient(145deg, transparent 0 42%, #773110 42% 44%, transparent 44%),
    linear-gradient(120deg,#1c1c1c,#0b0b0b 55%,#4a1b07);
}
.p2{background:linear-gradient(145deg,#121212 20%,#4c571f 20% 38%,#151515 38% 68%,#5b230c 68%)}
.p3{background:radial-gradient(circle at 62% 35%,#543016,transparent 24%),linear-gradient(135deg,#0f0f0f,#2a2a2a)}
.p4{background:linear-gradient(35deg,#171717 0 43%,#b4470b 43% 46%,#262626 46% 72%,#101010 72%)}
.p5{background:radial-gradient(circle at 38% 32%,#444b26,transparent 20%),linear-gradient(160deg,#0a0a0a,#2a1a12)}
.p6{background:linear-gradient(155deg,#171717 0 32%,#5a1f08 32% 34%,#2d2d2d 34% 65%,#0c0c0c 65%)}

.photo-overlay{
  position:absolute;
  z-index:3;
  left:0;right:0;bottom:0;
  padding:22px;
  transform:translateY(24px);
  transition:.3s ease;
}
.photo-card:hover .photo-overlay{transform:none}
.photo-overlay p{
  color:var(--orange);
  margin:0 0 4px;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.photo-overlay h3{margin:0;font-size:1.25rem}
.photo-overlay span{
  display:block;
  margin-top:10px;
  opacity:0;
  color:#bfb9b2;
  font-size:.75rem;
  transition:.3s ease;
}
.photo-card:hover .photo-overlay span{opacity:1}

.series-list{
  border-top:1px solid var(--line);
}
.series-card{
  min-height:150px;
  display:grid;
  grid-template-columns:70px 150px 1fr 54px;
  align-items:center;
  gap:24px;
  border-bottom:1px solid var(--line);
  transition:.25s ease;
}
.series-card:hover{
  background:#0d0d0d;
  padding-inline:12px;
}
.series-number{
  color:#777;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
}
.series-art{
  width:120px;
  height:86px;
  border:1px solid #292929;
}
.a1{background:linear-gradient(145deg,#111 40%,#ff5a01 40% 45%,#2d2d2d 45%)}
.a2{background:linear-gradient(35deg,#151515,#435520)}
.a3{background:radial-gradient(circle at 40% 45%,#71300d,transparent 28%),#151515}
.series-info p{
  margin:0 0 5px;
  color:var(--orange);
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.12em;
}
.series-info h3{margin:0;font-size:clamp(1.15rem,2.4vw,1.7rem)}
.series-info span{color:#858079;font-size:.78rem}
.series-card button{
  width:48px;height:48px;
  border-radius:50%;
  border:1px solid #333;
  background:#111;
  font-size:1.1rem;
  cursor:pointer;
}
.series-card:hover button{background:var(--orange);color:#090909;border-color:var(--orange)}

.about{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:80px;
  align-items:center;
}
.about-logo-wrap{
  min-height:520px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle,rgba(255,90,1,.18),transparent 42%),
    linear-gradient(145deg,#101010,#070707);
  border:1px solid #222;
  border-radius:24px;
  overflow:hidden;
}
.about-logo-wrap img{
  width:min(82%,520px);
  filter:drop-shadow(0 28px 55px rgba(0,0,0,.72));
}
.about-copy .lead{
  margin:28px 0 16px;
  color:#dfdad4;
  font-size:1.18rem;
  max-width:680px;
}
.about-copy>p:not(.eyebrow):not(.lead){color:#918b84;max-width:680px}

.about-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:34px;
}
.about-stats div{
  min-height:104px;
  padding:16px;
  background:#0e0e0e;
  border:1px solid #262626;
  border-radius:14px;
}
.about-stats strong{display:block;color:var(--orange);font-size:1.4rem}
.about-stats span{color:#8d877f;font-size:.75rem}

.contact-panel{
  padding:clamp(28px,5vw,68px);
  border-radius:28px;
  border:1px solid #292929;
  background:
    linear-gradient(120deg,rgba(255,90,1,.12),transparent 35%),
    #0e0e0e;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:50px;
}
.contact-panel p:not(.eyebrow){
  max-width:620px;
  color:#aaa49d;
}
.contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.site-footer{
  min-height:120px;
  padding:30px clamp(20px,4vw,58px);
  border-top:1px solid #1f1f1f;
  background:#020202;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:20px;
  color:#77716b;
  font-size:.76rem;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-weight:900;
}
.footer-brand img{width:34px;height:34px;object-fit:contain}
.footer-note{text-align:right}

.lightbox{
  width:min(1100px,calc(100% - 32px));
  padding:0;
  border:1px solid #2b2b2b;
  border-radius:20px;
  background:#090909;
  color:#fff;
}
.lightbox::backdrop{background:rgba(0,0,0,.88);backdrop-filter:blur(8px)}
.lightbox-close{
  position:absolute;
  top:14px;right:14px;
  z-index:4;
  width:44px;height:44px;
  border-radius:50%;
  border:1px solid #333;
  background:rgba(0,0,0,.6);
  color:#fff;
  font-size:1.5rem;
  cursor:pointer;
}
.lightbox-stage{display:grid;grid-template-columns:1.4fr .6fr;min-height:650px}
.lightbox-placeholder{
  min-height:650px;
  background:
    radial-gradient(circle at 52% 30%,rgba(255,90,1,.35),transparent 20%),
    linear-gradient(145deg,#161616,#292929 46%,#0a0a0a);
}
.lightbox-copy{
  align-self:end;
  padding:32px;
}
.lightbox-copy p{margin:0;color:var(--orange);font-size:.7rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.lightbox-copy h3{margin:6px 0;font-size:2rem}
.lightbox-copy span{color:#888}

@media (max-width:1000px){
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:70px}
  .hero-visual{min-height:540px}
  .hero-frame{width:min(72%,500px)}
 .hero-logo-mark{right:4%;width:33%}

  .section-heading{align-items:flex-start;flex-direction:column}
  .photo-grid{grid-auto-rows:190px}
  .photo-card{grid-column:span 6}
  .photo-card.wide{grid-column:span 12}

  .about{grid-template-columns:1fr;gap:44px}
  .about-logo-wrap{min-height:420px}
  .contact-panel{align-items:flex-start;flex-direction:column}

  .site-footer{grid-template-columns:1fr;text-align:left}
  .footer-note{text-align:left}

  .lightbox-stage{grid-template-columns:1fr}
  .lightbox-placeholder{min-height:65vh}
}

@media (max-width:760px){
  .site-header{height:70px}
  .brand img{width:40px;height:40px}
  .nav-toggle{display:flex}
  .main-nav{
    position:fixed;
    inset:70px 0 auto 0;
    min-height:calc(100vh - 70px);
    padding:36px 22px;
    background:rgba(5,5,5,.98);
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
    transform:translateX(100%);
    transition:.28s ease;
  }
  .main-nav a{font-size:1.7rem}
  body.menu-open .main-nav{transform:none}

  .section{width:min(100% - 28px,var(--max))}
  .hero{min-height:auto;padding-block:55px 65px}
  .hero h1{font-size:clamp(3.3rem,15vw,5rem)}
  .hero-visual{min-height:470px}
  .hero-frame{width:84%}
 .floating-logo{width:44%;right:-1%}
  .orbit-one{width:88%}
  .orbit-two{width:105%}

  .portfolio,.series,.about,.contact{padding-block:82px}
  .section-heading h2,.about h2,.contact h2{font-size:clamp(2.8rem,14vw,4.5rem)}

  .photo-grid{
    display:block;
  }
  .photo-card{
    min-height:420px;
    margin-bottom:12px;
  }
  .photo-card.wide{min-height:300px}

  .series-card{
    grid-template-columns:36px 92px 1fr;
    gap:12px;
    padding:18px 0;
  }
  .series-art{width:88px;height:70px}
  .series-card button{display:none}

  .about-logo-wrap{min-height:350px}
  .about-stats{grid-template-columns:1fr}

  .contact-actions{width:100%}
  .contact-actions .btn{width:100%}

  .lightbox{width:calc(100% - 16px)}
  .lightbox-placeholder{min-height:55vh}
}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}


/* v0.2 — tratamiento del logo transparente */
.brand img,.footer-brand img,.about-logo-wrap img,.identity-mark img,.floating-logo img{background:transparent;}
.identity-strip{
  min-height:320px;
  padding-block:72px;
  display:grid;
  grid-template-columns:minmax(220px,.72fr) 1.28fr;
  gap:clamp(34px,7vw,96px);
  align-items:center;
}
.identity-mark{position:relative;min-height:250px;display:grid;place-items:center;}
.identity-mark::before{
  content:"";position:absolute;width:78%;aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(255,90,1,.34);box-shadow:0 0 80px rgba(255,90,1,.08);
}
.identity-mark img{
  position:relative;width:min(90%,340px);height:auto;object-fit:contain;
  filter:drop-shadow(0 20px 30px rgba(0,0,0,.75));
}
.identity-copy h2{
  margin:0;font-size:clamp(2.2rem,4.8vw,5rem);line-height:.92;
  letter-spacing:-.06em;text-transform:uppercase;
}
.identity-copy p:not(.eyebrow){max-width:720px;color:#928c85;margin-top:22px;}
@media (max-width:760px){
  .identity-strip{grid-template-columns:1fr;gap:20px;padding-block:60px;}
  .identity-mark{min-height:220px;}
  .identity-mark img{width:min(76%,300px);}
}


/* v0.3 — tratamiento unificado del logo transparente */
.brand img,
.floating-logo img,
.identity-mark img,
.about-logo-wrap img,
.footer-brand img {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none;
}

.floating-logo,
.identity-mark,
.footer-brand {
  background: transparent;
}

/* El panel de "Sobre mí" conserva la atmósfera del sitio,
   pero ya no simula una caja detrás del archivo del logo. */
.about-logo-wrap {
  background:
    radial-gradient(circle at 50% 48%, rgba(255,90,1,.09), transparent 44%),
    transparent;
  border-color: rgba(255,255,255,.08);
}


.logo-credit{
  margin-top:18px !important;
  font-size:.72rem;
  color:#69645f !important;
  letter-spacing:.03em;
}
.logo-credit a{
  color:#9d968f;
  text-decoration:none;
  border-bottom:1px solid rgba(255,90,1,.38);
  transition:.2s ease;
}
.logo-credit a:hover{
  color:var(--orange);
  border-bottom-color:var(--orange);
}


/* v0.4.0 — fotografías reales y visor de sesión */
.portfolio-photo{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center center;
  transition:transform .45s ease;
}
.photo-card:hover .portfolio-photo{
  transform:scale(1.025);
}
.session-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 45%, rgba(0,0,0,.86));
  pointer-events:none;
  z-index:1;
}
.session-card .photo-overlay{
  z-index:2;
}

.series-photo{
  width:120px;
  height:86px;
  object-fit:cover;
  border:1px solid #292929;
  display:block;
}
.series-session{
  cursor:pointer;
}

.session-lightbox{
  width:min(1500px, calc(100% - 24px));
  max-width:none;
  height:min(94vh, 1000px);
  padding:0;
  overflow:hidden;
  border:1px solid #242424;
  border-radius:18px;
  background:#060606;
  color:#fff;
}
.session-lightbox::backdrop{
  background:rgba(0,0,0,.94);
  backdrop-filter:blur(10px);
}
.session-viewer{
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
}
.session-viewer-header{
  min-height:88px;
  padding:18px 78px 16px 22px;
  border-bottom:1px solid #1f1f1f;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#090909;
}
.session-viewer-header p{
  margin:0 0 2px;
  color:var(--orange);
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.14em;
}
.session-viewer-header h3{
  margin:0;
  font-size:1.35rem;
}
.session-viewer-header span{
  display:block;
  margin-top:2px;
  color:#858079;
  font-size:.78rem;
}
.session-counter{
  color:#8d8780;
  font-size:.78rem;
  font-weight:800;
  white-space:nowrap;
}

.session-stage{
  position:relative;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#020202;
  touch-action:pan-y;
}
.session-stage img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  user-select:none;
  -webkit-user-drag:none;
}
.session-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  width:48px;
  height:64px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.50);
  color:#fff;
  font-size:2rem;
  cursor:pointer;
  backdrop-filter:blur(8px);
  transition:.2s ease;
}
.session-nav:hover{
  background:var(--orange);
  color:#050505;
  border-color:var(--orange);
}
.session-nav.prev{left:16px}
.session-nav.next{right:16px}

.session-thumbs{
  min-height:92px;
  padding:12px 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  overflow-x:auto;
  background:#090909;
  border-top:1px solid #1f1f1f;
  scrollbar-width:thin;
}
.session-thumb{
  width:58px;
  height:68px;
  padding:0;
  border:1px solid #2a2a2a;
  background:#111;
  border-radius:7px;
  overflow:hidden;
  opacity:.58;
  cursor:pointer;
  flex:0 0 auto;
  transition:.2s ease;
}
.session-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.session-thumb:hover{
  opacity:.9;
  border-color:#666;
}
.session-thumb.is-active{
  opacity:1;
  border-color:var(--orange);
  box-shadow:0 0 0 1px var(--orange);
}

@media (max-width:760px){
  .session-lightbox{
    width:100%;
    height:100dvh;
    max-height:none;
    border:0;
    border-radius:0;
  }
  .session-viewer-header{
    min-height:78px;
    padding:14px 60px 12px 14px;
  }
  .session-viewer-header h3{font-size:1.05rem}
  .session-nav{
    width:40px;
    height:56px;
    opacity:.78;
  }
  .session-nav.prev{left:6px}
  .session-nav.next{right:6px}
  .session-thumbs{
    justify-content:flex-start;
    min-height:82px;
    padding:9px 12px;
  }
  .session-thumb{
    width:52px;
    height:62px;
  }
  .series-photo{
    width:88px;
    height:70px;
  }
}


/* v0.4.1 — visor en modo "ajustar imagen completa" */
.session-stage{
  padding:24px 86px;
}

.session-stage img{
  width:auto !important;
  height:auto !important;
  max-width:92% !important;
  max-height:92% !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block;
  transform:none !important;
}

@media (max-width:760px){
  .session-stage{
    padding:18px 48px;
  }

  .session-stage img{
    max-width:100% !important;
    max-height:94% !important;
  }
}

@media (max-width:430px){
  .session-stage{
    padding:12px 42px;
  }

  .session-stage img{
    max-width:100% !important;
    max-height:92% !important;
  }
}


/* v0.4.2 — corrección definitiva del visor: imagen completa, sin recorte */
.session-stage{
  position:relative !important;
  display:block !important;
  padding:0 !important;
  overflow:hidden !important;
  min-width:0;
  min-height:0;
}

.session-stage > #sessionImage{
  position:absolute !important;
  top:20px !important;
  right:82px !important;
  bottom:20px !important;
  left:82px !important;

  width:calc(100% - 164px) !important;
  height:calc(100% - 40px) !important;
  max-width:none !important;
  max-height:none !important;

  object-fit:contain !important;
  object-position:center center !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
}

@media (max-width:760px){
  .session-stage > #sessionImage{
    top:12px !important;
    right:46px !important;
    bottom:12px !important;
    left:46px !important;
    width:calc(100% - 92px) !important;
    height:calc(100% - 24px) !important;
  }
}

@media (max-width:430px){
  .session-stage > #sessionImage{
    top:10px !important;
    right:38px !important;
    bottom:10px !important;
    left:38px !important;
    width:calc(100% - 76px) !important;
    height:calc(100% - 20px) !important;
  }
}


[hidden]{display:none!important}


/* v0.4.25 — fotografía destacada real en hero */
.hero-featured{
  position:relative;
  overflow:hidden;
  cursor:pointer;
  background:#080808;
}
.hero-featured-photo{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 28%;
  transition:transform .45s ease;
}
.hero-featured:hover .hero-featured-photo{
  transform:scale(1.018);
}
.hero-featured::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 20%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.82) 100%);
  pointer-events:none;
}
.hero-featured-overlay{
  position:absolute;
  z-index:3;
  left:18px;
  right:18px;
  bottom:18px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
}
.hero-featured-overlay > div:first-child{
  display:grid;
  gap:2px;
}
.hero-featured-overlay strong{
  font-size:1.35rem;
  line-height:1.1;
}
.hero-featured-overlay small{
  color:#c3bdb5;
  font-size:.75rem;
}
.hero-hearts{
  min-width:72px;
  height:38px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(0,0,0,.56);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  color:var(--orange);
  font-weight:900;
  backdrop-filter:blur(10px);
}
.hero-hearts span{
  color:#fff;
  font-size:.8rem;
}

@media (max-width:760px){
  .hero-featured-overlay{
    left:14px;
    right:14px;
    bottom:14px;
  }
  .hero-featured-overlay strong{font-size:1.12rem}
  .hero-hearts{
    min-width:64px;
    height:34px;
  }
}


/* v0.4.40 — simplified portfolio home + future sessions */
.photo-card[hidden]{display:none !important;}
.portfolio-more{display:flex;justify-content:center;margin-top:34px;}
.sessions-coming{padding-top:110px;}
.coming-soon-card{max-width:860px;margin:0 auto;border:1px solid rgba(255,255,255,.12);padding:clamp(34px,6vw,72px);text-align:center;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012));}
.coming-soon-card h3{margin:.4rem 0 .8rem;font-size:clamp(2rem,6vw,4.5rem);}
.coming-soon-card p{color:#9f9a93;margin:0 auto;max-width:560px;}
.coming-soon-kicker{font-size:.72rem;letter-spacing:.24em;color:var(--orange);font-weight:700;}


/* v0.4.41 — página exclusiva de galería completa */
.portfolio-page{
  background:
    radial-gradient(circle at 20% -10%,rgba(255,90,1,.12),transparent 30rem),
    #050505;
}
.portfolio-header{
  position:sticky;
  top:0;
  z-index:80;
  min-height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:10px clamp(18px,4vw,56px);
  background:rgba(5,5,5,.88);
  border-bottom:1px solid rgba(255,255,255,.07);
  backdrop-filter:blur(16px);
}
.portfolio-brand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.03em}
.portfolio-brand img{width:44px;height:44px;object-fit:contain}
.portfolio-brand span{font-size:1rem}
.portfolio-back{
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:9px 14px;
  color:#ddd7cf;
  font-size:.86rem;
  font-weight:800;
  transition:.2s ease;
}
.portfolio-back:hover{border-color:rgba(255,90,1,.7);color:#fff;background:rgba(255,90,1,.08)}
.portfolio-gallery-shell{width:min(1500px,calc(100% - 32px));margin:0 auto;padding:64px 0 72px}
.portfolio-gallery-intro{max-width:760px;margin-bottom:38px}
.portfolio-gallery-intro h1{margin:.2rem 0 12px;font-size:clamp(3rem,8vw,6.4rem);line-height:.88;letter-spacing:-.07em}
.portfolio-gallery-intro>p:not(.eyebrow){max-width:650px;color:#aaa39a;font-size:1rem}
.portfolio-gallery-count{display:inline-flex;align-items:baseline;gap:8px;margin-top:8px;color:#bdb6ad;font-size:.9rem}
.portfolio-gallery-count strong{font-size:1.35rem;color:#fff}
.portfolio-all-gallery{columns:4 260px;column-gap:14px}
.gallery-item{
  position:relative;
  width:100%;
  margin:0 0 14px;
  padding:0;
  break-inside:avoid;
  display:block;
  overflow:hidden;
  border:0;
  border-radius:16px;
  background:#111;
  cursor:zoom-in;
  text-align:left;
}
.gallery-item img{width:100%;height:auto;transition:transform .35s ease,filter .35s ease}
.gallery-item::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.8),transparent 45%);
  opacity:0;
  transition:.25s ease;
}
.gallery-item:hover img{transform:scale(1.025);filter:saturate(1.04)}
.gallery-item:hover::after,.gallery-item:focus-visible::after{opacity:1}
.gallery-caption{
  position:absolute;
  z-index:2;
  left:14px;
  right:14px;
  bottom:12px;
  display:flex;
  flex-direction:column;
  gap:2px;
  opacity:0;
  transform:translateY(7px);
  transition:.25s ease;
  pointer-events:none;
}
.gallery-item:hover .gallery-caption,.gallery-item:focus-visible .gallery-caption{opacity:1;transform:none}
.gallery-caption strong{font-size:.92rem;color:#fff}
.gallery-caption small{font-size:.76rem;color:#d8d2cb}
.gallery-item:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.portfolio-gallery-footer{
  width:min(1500px,calc(100% - 32px));
  margin:0 auto;
  padding:28px 0 40px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  justify-content:space-between;
  gap:16px;
  color:#8f8982;
  font-size:.84rem;
}
.portfolio-gallery-footer a{color:#fff;font-weight:800}
.portfolio-photo-lightbox{
  width:min(96vw,1500px);
  height:min(94vh,1100px);
  padding:0;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:#050505;
  color:#fff;
  overflow:hidden;
}
.portfolio-photo-lightbox::backdrop{background:rgba(0,0,0,.88);backdrop-filter:blur(8px)}
.portfolio-photo-lightbox figure{height:100%;margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto}
.portfolio-photo-lightbox figure>img{width:100%;height:100%;object-fit:contain;background:#030303}
.portfolio-photo-lightbox figcaption{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 54px 14px 18px;border-top:1px solid rgba(255,255,255,.08);background:#0b0b0b}
.portfolio-photo-lightbox figcaption>div{display:flex;flex-direction:column;min-width:0}
.portfolio-photo-lightbox figcaption strong{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.portfolio-photo-lightbox figcaption span,.portfolio-photo-lightbox figcaption small{color:#9f9992;font-size:.78rem}
.portfolio-lightbox-close{
  position:absolute;z-index:5;right:12px;top:12px;width:40px;height:40px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(0,0,0,.55);font-size:1.6rem;line-height:1;cursor:pointer
}
.portfolio-lightbox-nav{
  position:absolute;z-index:5;top:50%;translate:0 -50%;width:44px;height:58px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.45);font-size:2rem;cursor:pointer
}
.portfolio-lightbox-nav.prev{left:10px;border-radius:0 12px 12px 0}
.portfolio-lightbox-nav.next{right:10px;border-radius:12px 0 0 12px}
.portfolio-lightbox-nav:hover,.portfolio-lightbox-close:hover{background:rgba(255,90,1,.72)}
@media (max-width:700px){
  .portfolio-header{min-height:64px;padding-inline:14px}
  .portfolio-brand img{width:38px;height:38px}
  .portfolio-back{padding:8px 11px;font-size:.78rem}
  .portfolio-gallery-shell{width:min(100% - 20px,1500px);padding-top:42px}
  .portfolio-gallery-intro{margin-bottom:24px}
  .portfolio-gallery-intro h1{font-size:clamp(2.8rem,15vw,4.3rem)}
  .portfolio-all-gallery{columns:2 145px;column-gap:8px}
  .gallery-item{margin-bottom:8px;border-radius:10px}
  .gallery-caption{display:none}
  .portfolio-photo-lightbox{width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0}
  .portfolio-photo-lightbox figcaption{padding:11px 48px 12px 12px}
  .portfolio-lightbox-nav{width:38px;height:52px}
  .portfolio-gallery-footer{width:min(100% - 20px,1500px);flex-direction:column}
}


/* v0.4.42 — portafolio completo por tarjetas/sesiones */
.portfolio-cards-shell{padding-top:58px;}
.portfolio-cards-intro{max-width:900px;}
.portfolio-cards-intro>p:not(.eyebrow){max-width:760px;}
.portfolio-full-grid{margin-top:42px;}
.portfolio-full-grid .photo-card[hidden]{display:block !important;}
.portfolio-full-grid .photo-card{min-height:0;}
@media (max-width:760px){
  .portfolio-cards-shell{padding-top:38px;}
  .portfolio-full-grid{margin-top:26px;}
  .portfolio-full-grid .photo-card{min-height:420px;}
  .portfolio-full-grid .photo-card.wide{min-height:320px;}
}


/* v0.4.44 — más espacio entre Sesiones, Sobre mí y Contacto */
#sesiones,
#sobre-mi,
#contacto{
  margin-top:clamp(48px,6vw,90px);
}

#sesiones{
  margin-bottom:clamp(28px,4vw,60px);
}

#sobre-mi{
  margin-bottom:clamp(28px,4vw,60px);
}

@media (max-width:760px){
  #sesiones,
  #sobre-mi,
  #contacto{
    margin-top:34px;
  }

  #sesiones,
  #sobre-mi{
    margin-bottom:22px;
  }
}


/* v0.4.45 — enlaces del apartado Detrás de la cámara */
.about-link{
  color:inherit;
  font-weight:700;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  transition:opacity .2s ease, border-color .2s ease;
}
.about-link:hover{
  opacity:.72;
}


/* v0.4.46 — colaboraciones, sesiones y eventos: composición limpia solo con texto */
#contacto .contact-actions,
#contacto .cta-actions,
#contacto .collab-actions,
#contacto .action-row{
  display:none !important;
}

#contacto .contact-card,
#contacto .contact-copy,
#contacto .contact-content{
  max-width:820px;
}

#contacto .contact-card{
  padding:clamp(28px,4vw,48px);
}

#contacto .contact-card p,
#contacto .contact-copy p,
#contacto .contact-content p{
  max-width:68ch;
  line-height:1.75;
}

#contacto .contact-card h2,
#contacto .contact-copy h2,
#contacto .contact-content h2{
  margin-bottom:16px;
}

footer .version,
footer .build-info,
footer .changelog,
footer .footer-version{
  display:none !important;
}


/* v0.4.47 — centrado de Colaboraciones / Sesiones / Eventos */
#contacto .contact-card,
#contacto .contact-copy,
#contacto .contact-content{
  margin-left:auto;
  margin-right:auto;
  text-align:center;
}

#contacto .contact-card p,
#contacto .contact-copy p,
#contacto .contact-content p{
  margin-left:auto;
  margin-right:auto;
}

/* v0.4.47 — animación popup para botones naranjas */
:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  a[class*="btn"][style*="orange"],
  button[class*="btn"][style*="orange"]
){
  transform-origin:center;
  transition:
    transform .22s cubic-bezier(.2,.8,.2,1),
    box-shadow .22s ease,
    filter .22s ease;
  will-change:transform;
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  a[class*="btn"][style*="orange"],
  button[class*="btn"][style*="orange"]
):hover{
  transform:translateY(-3px) scale(1.07);
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  filter:brightness(1.06);
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  a[class*="btn"][style*="orange"],
  button[class*="btn"][style*="orange"]
):active{
  transform:translateY(-1px) scale(1.02);
}

@media (prefers-reduced-motion: reduce){
  :is(
    .btn-primary,
    .button-primary,
    .cta-primary,
    .primary-btn,
    .btn-accent,
    .accent-btn,
    .hero-cta,
    .portfolio-cta
  ){
    transition:none;
  }
  :is(
    .btn-primary,
    .button-primary,
    .cta-primary,
    .primary-btn,
    .btn-accent,
    .accent-btn,
    .hero-cta,
    .portfolio-cta
  ):hover{
    transform:none;
  }
}


/* v0.4.48 — centrado completo del bloque de contacto */
#contacto .contact-panel{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:280px;
}

#contacto .contact-panel > div{
  width:min(100%,760px);
  margin-inline:auto;
  text-align:center;
}

#contacto .contact-panel .eyebrow,
#contacto .contact-panel h2,
#contacto .contact-panel p{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

#contacto .contact-panel p:not(.eyebrow){
  max-width:58ch;
}

@media (max-width:760px){
  #contacto .contact-panel{
    min-height:240px;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
}


/* v0.4.49 — degradado naranja + popup refinado en todos los botones principales */
:root{
  --orange-strong:#ff5a12;
  --orange-mid:#ff7a1a;
  --orange-base:#ff9b3d;
  --orange-glow:rgba(255,105,24,.34);
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
){
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    linear-gradient(135deg,
      var(--orange-strong) 0%,
      var(--orange-mid) 46%,
      var(--orange-base) 100%) !important;
  background-size:160% 160% !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:
    0 8px 20px rgba(0,0,0,.16),
    0 2px 8px var(--orange-glow);
  transform:translateZ(0);
  transform-origin:center;
  transition:
    transform .24s cubic-bezier(.18,.89,.32,1.28),
    box-shadow .24s ease,
    filter .24s ease,
    background-position .35s ease;
  will-change:transform;
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
)::before{
  content:"";
  position:absolute;
  inset:-35% -55%;
  z-index:-1;
  background:linear-gradient(
    115deg,
    transparent 35%,
    rgba(255,255,255,.26) 48%,
    transparent 61%
  );
  transform:translateX(-55%) rotate(4deg);
  transition:transform .48s ease;
  pointer-events:none;
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
):hover{
  transform:translateY(-5px) scale(1.075);
  background-position:100% 50% !important;
  filter:saturate(1.08) brightness(1.04);
  box-shadow:
    0 16px 32px rgba(0,0,0,.24),
    0 6px 18px rgba(255,96,20,.34);
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
):hover::before{
  transform:translateX(55%) rotate(4deg);
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
):active{
  transform:translateY(-1px) scale(1.025);
  box-shadow:
    0 7px 16px rgba(0,0,0,.18),
    0 3px 10px rgba(255,96,20,.26);
}

:is(
  .btn-primary,
  .button-primary,
  .cta-primary,
  .primary-btn,
  .btn-accent,
  .accent-btn,
  .hero-cta,
  .portfolio-cta,
  .btn.orange,
  .button.orange,
  a.btn-primary,
  button.btn-primary
):focus-visible{
  outline:3px solid rgba(255,167,88,.48);
  outline-offset:4px;
}

@media (hover:none){
  :is(
    .btn-primary,
    .button-primary,
    .cta-primary,
    .primary-btn,
    .btn-accent,
    .accent-btn,
    .hero-cta,
    .portfolio-cta,
    .btn.orange,
    .button.orange,
    a.btn-primary,
    button.btn-primary
  ):hover{
    transform:none;
  }
}

@media (prefers-reduced-motion:reduce){
  :is(
    .btn-primary,
    .button-primary,
    .cta-primary,
    .primary-btn,
    .btn-accent,
    .accent-btn,
    .hero-cta,
    .portfolio-cta,
    .btn.orange,
    .button.orange,
    a.btn-primary,
    button.btn-primary
  ){
    transition:none;
  }

  :is(
    .btn-primary,
    .button-primary,
    .cta-primary,
    .primary-btn,
    .btn-accent,
    .accent-btn,
    .hero-cta,
    .portfolio-cta,
    .btn.orange,
    .button.orange,
    a.btn-primary,
    button.btn-primary
  )::before{
    display:none;
  }
}


/* v0.4.50 — visualizador del portafolio más estético */
.session-lightbox{
  width:min(1240px, calc(100% - 28px)) !important;
  height:min(92dvh, 900px) !important;
  max-height:92dvh !important;
  padding:0 !important;
  border-radius:28px !important;
  border:1px solid rgba(255,255,255,.08) !important;
  background:
    radial-gradient(circle at top left, rgba(255,122,26,.14), transparent 28%),
    radial-gradient(circle at bottom right, rgba(255,122,26,.08), transparent 24%),
    linear-gradient(180deg, rgba(17,17,17,.98), rgba(7,7,7,.98)) !important;
  box-shadow:
    0 40px 90px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,255,255,.02);
  overflow:hidden;
}

.session-lightbox::backdrop{
  background:
    radial-gradient(circle at center, rgba(255,110,30,.08), transparent 26%),
    rgba(0,0,0,.84);
  backdrop-filter:blur(14px) saturate(1.15);
}

.session-viewer{
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
}

.session-viewer-header{
  position:relative;
  min-height:94px;
  padding:20px 88px 18px 24px;
  border-bottom:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01));
  backdrop-filter:blur(10px);
}

.session-viewer-header::after{
  content:"";
  position:absolute;
  left:24px;
  right:24px;
  bottom:-1px;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,122,26,.55), transparent);
}

.session-viewer-header p{
  color:#ff9b3d;
  letter-spacing:.16em;
}

.session-viewer-header h3{
  font-size:1.45rem;
  letter-spacing:.01em;
}

.session-viewer-header span,
.session-counter{
  color:#b2aba3;
}

.lightbox-close{
  top:18px !important;
  right:18px !important;
  width:46px !important;
  height:46px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.1) !important;
  background:rgba(255,255,255,.04) !important;
  color:#fff !important;
  backdrop-filter:blur(12px);
  box-shadow:0 10px 30px rgba(0,0,0,.24);
  transition:transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.lightbox-close:hover{
  transform:scale(1.08);
  background:rgba(255,122,26,.16) !important;
  border-color:rgba(255,122,26,.5) !important;
  box-shadow:0 14px 30px rgba(255,90,18,.18);
}

.session-stage{
  position:relative !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.02), transparent 48%),
    linear-gradient(180deg, #111, #060606) !important;
  isolation:isolate;
}

.session-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--session-bg-image);
  background-size:cover;
  background-position:center;
  filter:blur(36px) saturate(1.18);
  transform:scale(1.12);
  opacity:.28;
  z-index:0;
  transition:opacity .28s ease, background-image .28s ease;
}

.session-stage::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at center, transparent 0%, rgba(0,0,0,.12) 60%, rgba(0,0,0,.34) 100%),
    linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.18));
  z-index:0;
}

#sessionImage,
#portfolioSessionImage{
  position:absolute !important;
  top:22px !important;
  right:88px !important;
  bottom:22px !important;
  left:88px !important;
  width:calc(100% - 176px) !important;
  height:calc(100% - 44px) !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center center !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  transform:scale(.985);
  transition:opacity .28s ease, transform .34s ease, box-shadow .34s ease;
  border-radius:18px;
  box-shadow:0 22px 44px rgba(0,0,0,.42);
  z-index:1;
  background:transparent !important;
}

#sessionImage.is-visible,
#portfolioSessionImage.is-visible{
  opacity:1;
  transform:scale(1);
}

.session-nav{
  top:50%;
  transform:translateY(-50%);
  width:54px;
  height:74px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  color:#fff;
  backdrop-filter:blur(12px);
  box-shadow:0 14px 32px rgba(0,0,0,.24);
  transition:transform .22s ease, background .22s ease, border-color .22s ease, box-shadow .22s ease;
  z-index:3;
}

.session-nav:hover{
  transform:translateY(-50%) scale(1.08);
  color:#fff;
  border-color:rgba(255,122,26,.5);
  background:linear-gradient(180deg, rgba(255,122,26,.22), rgba(255,90,18,.12));
  box-shadow:0 18px 30px rgba(255,90,18,.22);
}

.session-nav.prev{left:18px}
.session-nav.next{right:18px}

.session-thumbs{
  min-height:104px;
  padding:14px 18px 16px;
  gap:10px;
  justify-content:flex-start;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0)),
    #090909;
  border-top:1px solid rgba(255,255,255,.06);
  scrollbar-width:thin;
}

.session-thumbs::-webkit-scrollbar{
  height:8px;
}
.session-thumbs::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.14);
  border-radius:999px;
}

.session-thumb{
  width:66px;
  height:78px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:#101010;
  opacity:.62;
  transform:translateY(0);
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  transition:transform .22s ease, opacity .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.session-thumb img{
  border-radius:12px;
}

.session-thumb:hover{
  opacity:.94;
  transform:translateY(-3px);
  border-color:rgba(255,255,255,.22);
  box-shadow:0 12px 22px rgba(0,0,0,.28);
}

.session-thumb.is-active{
  opacity:1;
  transform:translateY(-4px) scale(1.03);
  border-color:rgba(255,122,26,.9);
  box-shadow:
    0 0 0 1px rgba(255,122,26,.95),
    0 12px 28px rgba(255,90,18,.18);
}

@media (max-width:760px){
  .session-lightbox{
    width:100% !important;
    height:100dvh !important;
    max-height:none !important;
    border-radius:0 !important;
    border:0 !important;
  }

  .session-viewer-header{
    min-height:82px;
    padding:16px 66px 14px 16px;
  }

  .session-viewer-header h3{
    font-size:1.08rem;
  }

  #sessionImage,
  #portfolioSessionImage{
    top:14px !important;
    right:56px !important;
    bottom:14px !important;
    left:56px !important;
    width:calc(100% - 112px) !important;
    height:calc(100% - 28px) !important;
    border-radius:14px;
  }

  .session-nav{
    width:42px;
    height:58px;
    border-radius:14px;
  }

  .session-nav.prev{left:8px}
  .session-nav.next{right:8px}

  .session-thumbs{
    min-height:90px;
    padding:10px 12px 12px;
  }

  .session-thumb{
    width:54px;
    height:64px;
    border-radius:12px;
  }
}

@media (max-width:430px){
  #sessionImage,
  #portfolioSessionImage{
    top:12px !important;
    right:48px !important;
    bottom:12px !important;
    left:48px !important;
    width:calc(100% - 96px) !important;
    height:calc(100% - 24px) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .lightbox-close,
  .session-nav,
  .session-thumb,
  #sessionImage,
  #portfolioSessionImage,
  .session-stage::before{
    transition:none !important;
  }
}


/* v0.4.51 — Acreditaciones */
.accreditations{
  padding-block:120px;
}

.accreditation-heading{
  margin-bottom:46px;
}

.accreditation-timeline{
  position:relative;
  max-width:980px;
  margin:0 auto;
  padding-left:42px;
}

.accreditation-timeline::before{
  content:"";
  position:absolute;
  left:13px;
  top:18px;
  bottom:22px;
  width:1px;
  background:linear-gradient(
    180deg,
    rgba(255,90,18,.9),
    rgba(255,155,61,.4) 54%,
    rgba(255,255,255,.08)
  );
}

.accreditation-card{
  position:relative;
  display:grid;
  grid-template-columns:130px 1fr;
  gap:26px;
  padding:28px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:24px;
  background:
    radial-gradient(circle at top right, rgba(255,122,26,.12), transparent 28%),
    linear-gradient(145deg, #121212, #0a0a0a);
  box-shadow:0 22px 50px rgba(0,0,0,.2);
  overflow:hidden;
}

.accreditation-card::before{
  content:"";
  position:absolute;
  left:-35px;
  top:42px;
  width:14px;
  height:14px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff5a12,#ff9b3d);
  box-shadow:
    0 0 0 5px #070707,
    0 0 0 6px rgba(255,122,26,.36),
    0 0 28px rgba(255,90,18,.48);
}

.accreditation-card::after{
  content:"";
  position:absolute;
  inset:auto -80px -110px auto;
  width:230px;
  height:230px;
  border-radius:50%;
  border:1px solid rgba(255,122,26,.08);
  box-shadow:
    0 0 0 24px rgba(255,122,26,.03),
    0 0 0 52px rgba(255,122,26,.018);
  pointer-events:none;
}

.accreditation-year{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:160px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(145deg,rgba(255,90,18,.16),rgba(255,155,61,.05)),
    #0b0b0b;
}

.accreditation-year span{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  color:#ff8a28;
  font-size:2.1rem;
  font-weight:900;
  letter-spacing:.08em;
}

.accreditation-content{
  position:relative;
  z-index:1;
}

.accreditation-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}

.accreditation-badge{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(255,122,26,.24);
  background:rgba(255,122,26,.08);
  color:#ff9b3d;
  font-size:.66rem;
  font-weight:900;
  letter-spacing:.12em;
}

.accreditation-number{
  color:rgba(255,255,255,.18);
  font-size:2.4rem;
  font-weight:900;
  line-height:1;
}

.accreditation-type{
  margin:0 0 7px;
  color:#ff8a28;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.12em;
}

.accreditation-content h3{
  margin:0 0 14px;
  color:#fff;
  font-size:clamp(1.65rem,3vw,2.65rem);
  line-height:1.03;
}

.accreditation-content > p:not(.accreditation-type){
  max-width:660px;
  margin:0;
  color:#aaa49d;
  line-height:1.75;
}

.accreditation-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}

.accreditation-meta span{
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.025);
  color:#8f8982;
  font-size:.72rem;
  font-weight:800;
}

.accreditation-future{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:64px;
  margin-top:18px;
  padding:12px 16px;
  color:#706b66;
  font-size:.78rem;
}

.accreditation-dot{
  position:absolute;
  left:-34px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#242424;
  border:2px solid #090909;
  box-shadow:0 0 0 1px rgba(255,255,255,.08);
}

.accreditation-future p{
  margin:0;
}

.about-stats{
  grid-template-columns:repeat(4,1fr);
}

@media (max-width:1000px){
  .about-stats{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:760px){
  .accreditations{
    padding-block:82px;
  }

  .accreditation-timeline{
    padding-left:28px;
  }

  .accreditation-timeline::before{
    left:7px;
  }

  .accreditation-card{
    grid-template-columns:1fr;
    gap:18px;
    padding:20px;
    border-radius:20px;
  }

  .accreditation-card::before{
    left:-27px;
    top:34px;
    width:12px;
    height:12px;
  }

  .accreditation-year{
    min-height:74px;
    justify-content:flex-start;
    padding:0 18px;
  }

  .accreditation-year span{
    writing-mode:horizontal-tb;
    transform:none;
    font-size:1.65rem;
  }

  .accreditation-topline{
    align-items:flex-start;
  }

  .accreditation-number{
    font-size:2rem;
  }

  .accreditation-future{
    padding-left:6px;
  }

  .accreditation-dot{
    left:-25px;
  }
}

@media (max-width:520px){
  .about-stats{
    grid-template-columns:1fr 1fr;
  }
}


/* v0.4.52 — acreditación Harajuku Fashion Walk con paleta del evento */
.harajuku-accreditation{
  --hfw-pink:#f26ab7;
  --hfw-pink-soft:#f78fc7;
  --hfw-coral:#ef7280;
  --hfw-peach:#f5a77b;
  --hfw-yellow:#f0cf73;
  --hfw-mint:#9bd8b4;
  --hfw-blue:#91b9df;
  --hfw-lilac:#b89bd7;
  --hfw-black:#050505;
  --hfw-white:#ffffff;

  border-color:rgba(242,106,183,.26);
  background:
    radial-gradient(circle at 86% 4%,rgba(242,106,183,.25),transparent 29%),
    radial-gradient(circle at 16% 88%,rgba(145,185,223,.10),transparent 25%),
    linear-gradient(145deg,#111 0%,#080808 58%,#0b070a 100%);
  box-shadow:
    0 24px 56px rgba(0,0,0,.32),
    0 0 0 1px rgba(242,106,183,.04);
}

.harajuku-accreditation::before{
  background:linear-gradient(
    135deg,
    var(--hfw-pink) 0%,
    var(--hfw-coral) 18%,
    var(--hfw-peach) 34%,
    var(--hfw-yellow) 49%,
    var(--hfw-mint) 64%,
    var(--hfw-blue) 80%,
    var(--hfw-lilac) 100%
  );
  box-shadow:
    0 0 0 5px #070707,
    0 0 0 6px rgba(242,106,183,.46),
    0 0 30px rgba(242,106,183,.42);
}

.harajuku-accreditation::after{
  width:300px;
  height:155px;
  right:-76px;
  bottom:-62px;
  border-radius:50%;
  border:18px solid rgba(5,5,5,.68);
  box-shadow:
    0 0 0 2px rgba(242,106,183,.11),
    0 0 0 26px rgba(242,106,183,.025);
  transform:rotate(-14deg);
}

.harajuku-accreditation .accreditation-year{
  position:relative;
  overflow:hidden;
  border-color:rgba(242,106,183,.24);
  background:
    linear-gradient(145deg,rgba(242,106,183,.25),rgba(184,155,215,.09)),
    #0a0a0a;
}

.harajuku-accreditation .accreditation-year::before{
  content:"";
  position:absolute;
  inset:auto -38px 14px 20px;
  height:42px;
  border-radius:50%;
  background:var(--hfw-black);
  transform:rotate(-14deg);
  opacity:.92;
}

.harajuku-accreditation .accreditation-year span{
  position:relative;
  z-index:1;
  color:var(--hfw-white);
  text-shadow:0 2px 18px rgba(242,106,183,.3);
}

.harajuku-accreditation .accreditation-badge{
  border-color:rgba(242,106,183,.34);
  background:
    linear-gradient(90deg,
      rgba(242,106,183,.18),
      rgba(239,114,128,.14),
      rgba(240,207,115,.12),
      rgba(155,216,180,.10),
      rgba(145,185,223,.12),
      rgba(184,155,215,.14));
  color:#fff;
}

.harajuku-accreditation .accreditation-type{
  background:linear-gradient(
    90deg,
    var(--hfw-pink),
    var(--hfw-coral),
    var(--hfw-yellow),
    var(--hfw-mint),
    var(--hfw-blue),
    var(--hfw-lilac)
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.harajuku-accreditation .accreditation-content h3{
  color:#fff;
}

.harajuku-accreditation .accreditation-content h3::after{
  content:"";
  display:block;
  width:94px;
  height:4px;
  margin-top:12px;
  border-radius:999px;
  background:linear-gradient(
    90deg,
    var(--hfw-pink),
    var(--hfw-coral),
    var(--hfw-yellow),
    var(--hfw-mint),
    var(--hfw-blue),
    var(--hfw-lilac)
  );
}

.harajuku-accreditation .accreditation-number{
  background:linear-gradient(
    135deg,
    var(--hfw-pink),
    var(--hfw-peach),
    var(--hfw-yellow),
    var(--hfw-mint),
    var(--hfw-blue),
    var(--hfw-lilac)
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  opacity:.9;
}

.harajuku-accreditation .accreditation-meta span{
  border-color:rgba(242,106,183,.16);
  background:rgba(242,106,183,.045);
  color:#bdb5bb;
}

.harajuku-accreditation .accreditation-meta span:hover{
  border-color:rgba(242,106,183,.38);
  color:#fff;
}

#acreditaciones .accreditation-timeline::before{
  background:linear-gradient(
    180deg,
    #f26ab7 0%,
    #ef7280 18%,
    #f0cf73 38%,
    #9bd8b4 56%,
    #91b9df 75%,
    #b89bd7 90%,
    rgba(255,255,255,.07) 100%
  );
}

@media (max-width:760px){
  .harajuku-accreditation .accreditation-year::before{
    inset:22px -20px auto 44%;
    width:110px;
    height:28px;
  }
}


/* =========================================================
   v0.4.53 — REDISEÑO GENERAL 1000%
   ========================================================= */
:root{
  --bg:#070707;--bg-soft:#0d0d0d;--panel:#111;--panel-2:#151515;
  --line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.14);
  --text:#f5f2ee;--muted:#aaa39b;--muted-2:#77716b;
  --orange-1:#ff5815;--orange-2:#ff7a1a;--orange-3:#ff9d43;
  --orange-glow:rgba(255,104,25,.28);--radius-xl:32px;--radius-lg:24px;--radius-md:18px;
  --shadow-xl:0 34px 80px rgba(0,0,0,.42);--shadow-lg:0 22px 50px rgba(0,0,0,.28);
}
html{scroll-behavior:smooth;background:var(--bg)}
body.site-v0453{position:relative;overflow-x:hidden;background:radial-gradient(circle at 8% 4%,rgba(255,91,20,.07),transparent 24%),radial-gradient(circle at 88% 18%,rgba(255,155,61,.045),transparent 20%),linear-gradient(180deg,#070707 0%,#090909 48%,#060606 100%);color:var(--text)}
body.site-v0453::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.42),transparent 72%)}
body.site-v0453::after{content:"";position:fixed;width:420px;height:420px;right:-180px;top:34vh;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(255,110,25,.08),transparent 68%);filter:blur(18px);pointer-events:none}
.skip-link{position:fixed;left:16px;top:16px;z-index:9999;transform:translateY(-160%);padding:10px 14px;border-radius:12px;background:#fff;color:#000;font-weight:900;text-decoration:none;transition:transform .2s ease}.skip-link:focus{transform:none}

/* Header premium */
.site-header{height:78px;padding-inline:clamp(18px,4vw,56px);border-bottom:1px solid rgba(255,255,255,.055);background:rgba(7,7,7,.72);backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 10px 28px rgba(0,0,0,.12)}
.brand{gap:10px}.brand img{filter:drop-shadow(0 8px 18px rgba(255,92,20,.16))}.brand span{letter-spacing:.04em}
.main-nav{gap:6px}.main-nav a{position:relative;padding:10px 13px;border-radius:12px;color:#9f9891;transition:color .2s ease,background .2s ease,transform .2s ease}.main-nav a::after{content:"";position:absolute;left:50%;right:50%;bottom:4px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--orange-1),var(--orange-3));transition:left .22s ease,right .22s ease}.main-nav a:hover{color:#fff;background:rgba(255,255,255,.035);transform:translateY(-1px)}.main-nav a:hover::after,.main-nav a.is-active::after{left:14px;right:14px}.main-nav a.is-active{color:#fff;background:rgba(255,255,255,.04)}

/* Section rhythm */
.section{position:relative;padding-block:clamp(96px,10vw,150px)}.section + .section{border-top:1px solid rgba(255,255,255,.035)}.section-heading{margin-bottom:clamp(34px,5vw,58px)}.section-heading h2,.about h2,.contact h2{letter-spacing:-.035em}.eyebrow{display:inline-flex;align-items:center;gap:10px}.eyebrow::before{content:"";width:28px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--orange-1),var(--orange-3));box-shadow:0 0 18px var(--orange-glow)}

/* Hero stronger hierarchy */
.hero{position:relative;min-height:min(900px,calc(100dvh - 78px));align-items:center;isolation:isolate}.hero::before{content:"";position:absolute;inset:8% 52% 8% -18%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(255,94,20,.14),transparent 64%);filter:blur(26px)}.hero-copy{position:relative;z-index:2}.hero-copy h1{line-height:.88;letter-spacing:-.065em;text-shadow:0 16px 44px rgba(0,0,0,.2)}.hero-copy .lead{max-width:62ch;color:#aaa39b;line-height:1.8}.hero-actions{gap:12px;flex-wrap:wrap}.hero-visual{position:relative;filter:drop-shadow(0 34px 42px rgba(0,0,0,.26))}.hero-frame{border-radius:32px;border:1px solid rgba(255,255,255,.10);box-shadow:0 36px 80px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.025);overflow:hidden}.hero-frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 54%,rgba(0,0,0,.24))}.hero-orbit,.orbit-one,.orbit-two{opacity:.68}

/* Cards 2.0 */
.photo-card{border-radius:24px;border:1px solid rgba(255,255,255,.075);background:#101010;box-shadow:0 16px 38px rgba(0,0,0,.18);overflow:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease}.photo-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.06) 58%,rgba(0,0,0,.78) 100%)}.photo-card:hover{transform:translateY(-8px) scale(1.012);border-color:rgba(255,125,36,.30);box-shadow:0 28px 58px rgba(0,0,0,.34),0 8px 26px rgba(255,92,20,.08)}.photo-card img{transition:transform .65s cubic-bezier(.2,.8,.2,1),filter .35s ease}.photo-card:hover img{transform:scale(1.055);filter:saturate(1.04) contrast(1.02)}.photo-overlay{z-index:2;padding:22px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.8))}.photo-overlay p{color:#ff9c45}.photo-overlay h3{margin-top:4px;letter-spacing:-.025em}.photo-overlay span{color:#b4ada6}
.portfolio-preview{position:relative}.portfolio-preview::before{content:"";position:absolute;inset:12% -8% auto auto;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,122,26,.06),transparent 68%);filter:blur(8px);pointer-events:none}

/* Sessions */
.series{position:relative}.series::before{content:"";position:absolute;inset:18% 8% auto auto;width:220px;height:220px;border:1px solid rgba(255,255,255,.035);border-radius:50%;box-shadow:0 0 0 26px rgba(255,255,255,.012),0 0 0 56px rgba(255,255,255,.008)}.series .empty-state,.series-empty,.coming-soon{border:1px solid rgba(255,255,255,.07);border-radius:26px;background:radial-gradient(circle at top right,rgba(255,122,26,.09),transparent 30%),linear-gradient(145deg,#111,#0a0a0a);box-shadow:var(--shadow-lg)}

/* About */
.about{align-items:center;gap:clamp(46px,7vw,86px)}.about-logo-wrap{border-radius:32px;background:radial-gradient(circle at 50% 45%,rgba(255,122,26,.12),transparent 44%),linear-gradient(145deg,#0f0f0f,#090909);border:1px solid rgba(255,255,255,.065);box-shadow:var(--shadow-xl);overflow:hidden}.about-logo-wrap::after{content:"";position:absolute;inset:16px;border:1px solid rgba(255,255,255,.035);border-radius:24px;pointer-events:none}.about-copy .lead{font-size:clamp(1.1rem,1.5vw,1.32rem);line-height:1.75}.about-stats{gap:12px}.about-stats>div{min-height:104px;padding:18px;border-radius:18px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.025);transition:transform .24s ease,border-color .24s ease,background .24s ease}.about-stats>div:hover{transform:translateY(-4px);border-color:rgba(255,122,26,.20);background:rgba(255,122,26,.035)}.about-stats strong{color:#fff}.about-stats span{color:#8f8982}

/* Accreditation */
.accreditation-card{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}.accreditation-card:hover{transform:translateY(-6px);box-shadow:0 32px 70px rgba(0,0,0,.36),0 8px 30px rgba(242,106,183,.08)}.harajuku-accreditation{overflow:hidden}.harajuku-accreditation .accreditation-content{padding-block:4px}.harajuku-accreditation .accreditation-meta span{transition:transform .2s ease,border-color .2s ease,color .2s ease}.harajuku-accreditation .accreditation-meta span:hover{transform:translateY(-2px)}

/* Contact */
.contact-panel{position:relative;min-height:360px!important;padding:clamp(36px,6vw,70px)!important;border:1px solid rgba(255,255,255,.075);border-radius:32px;background:radial-gradient(circle at 50% 0%,rgba(255,122,26,.12),transparent 34%),linear-gradient(145deg,#121212,#090909);box-shadow:var(--shadow-xl);overflow:hidden}.contact-panel::before,.contact-panel::after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;border:1px solid rgba(255,122,26,.07);pointer-events:none}.contact-panel::before{left:-80px;bottom:-80px;box-shadow:0 0 0 28px rgba(255,122,26,.018)}.contact-panel::after{right:-70px;top:-70px;box-shadow:0 0 0 24px rgba(255,122,26,.014)}.contact-panel>div{position:relative;z-index:1}.contact-panel h2{margin-bottom:16px}.contact-panel p:not(.eyebrow){font-size:clamp(1rem,1.4vw,1.14rem);line-height:1.8}

/* Footer */
.site-footer{padding-block:34px;border-top:1px solid rgba(255,255,255,.055);background:rgba(5,5,5,.74)}.site-footer a{transition:color .2s ease,opacity .2s ease}.site-footer a:hover{color:#fff}

/* Buttons */
:is(.btn-primary,.button-primary,.cta-primary,.primary-btn,.btn-accent,.accent-btn,.hero-cta,.portfolio-cta,.btn.orange,.button.orange,a.btn-primary,button.btn-primary){min-height:48px;padding-inline:18px;border-radius:14px;font-weight:900;letter-spacing:.01em}

/* Portfolio page */
body.portfolio-page{min-height:100dvh}.portfolio-gallery-header{position:sticky;top:0;z-index:40;background:rgba(7,7,7,.78);border-bottom:1px solid rgba(255,255,255,.055);backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 10px 28px rgba(0,0,0,.14)}.portfolio-full-grid{gap:18px}.portfolio-full-grid .photo-card{min-height:360px}.portfolio-gallery-footer{border-top:1px solid rgba(255,255,255,.055);background:#070707}

@keyframes synthReveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.site-v0453 .section-heading,.site-v0453 .about-copy,.site-v0453 .contact-panel,.site-v0453 .accreditation-card{animation:synthReveal .6s ease both}

@media(max-width:1000px){.site-header{height:72px}.hero{min-height:auto}}
@media(max-width:760px){.section{padding-block:82px}.site-header{padding-inline:14px}.main-nav{backdrop-filter:blur(20px)}.main-nav a{width:100%;padding:13px 14px}.hero{padding-top:44px}.hero-frame{border-radius:24px}.photo-card{border-radius:20px}.contact-panel{min-height:310px!important;border-radius:24px}.about-logo-wrap{border-radius:24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.site-v0453 .section-heading,.site-v0453 .about-copy,.site-v0453 .contact-panel,.site-v0453 .accreditation-card{animation:none}}


/* =========================================================
   v0.4.54 — MOTION SYSTEM / REDISEÑO 1000%
   ========================================================= */

:root{
  --motion-orange:#ff6a18;
  --motion-orange-2:#ff9d43;
  --motion-ease:cubic-bezier(.2,.8,.2,1);
  --motion-spring:cubic-bezier(.18,.89,.32,1.22);
}

/* Fondo vivo, sutil y no invasivo */
.ambient-motion{
  position:fixed;
  inset:0;
  z-index:-5;
  overflow:hidden;
  pointer-events:none;
}
.ambient-orb{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(32px);
  opacity:.26;
  will-change:transform;
}
.ambient-orb-a{
  width:420px;
  height:420px;
  top:-160px;
  left:-120px;
  background:radial-gradient(circle,#ff5a12 0%,rgba(255,90,18,.35) 34%,transparent 70%);
  animation:ambientFloatA 16s ease-in-out infinite alternate;
}
.ambient-orb-b{
  width:360px;
  height:360px;
  right:-140px;
  top:34%;
  background:radial-gradient(circle,#ff9b3d 0%,rgba(255,155,61,.22) 34%,transparent 72%);
  animation:ambientFloatB 20s ease-in-out infinite alternate;
}
.ambient-orb-c{
  width:300px;
  height:300px;
  left:34%;
  bottom:-160px;
  background:radial-gradient(circle,#ff6a18 0%,rgba(255,106,24,.16) 38%,transparent 73%);
  animation:ambientFloatC 18s ease-in-out infinite alternate;
}
.ambient-grain{
  position:absolute;
  inset:0;
  opacity:.025;
  background-image:
    radial-gradient(circle at 20% 30%,#fff 0 1px,transparent 1px),
    radial-gradient(circle at 80% 70%,#fff 0 1px,transparent 1px);
  background-size:17px 17px,23px 23px;
  mix-blend-mode:soft-light;
}

@keyframes ambientFloatA{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(90px,70px,0) scale(1.12)}
}
@keyframes ambientFloatB{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(-120px,55px,0) scale(1.08)}
}
@keyframes ambientFloatC{
  from{transform:translate3d(0,0,0) scale(.94)}
  to{transform:translate3d(80px,-55px,0) scale(1.13)}
}

/* Revelado progresivo al hacer scroll */
.motion-reveal{
  opacity:0;
  transform:translateY(28px) scale(.985);
  filter:blur(5px);
  transition:
    opacity .78s var(--motion-ease),
    transform .88s var(--motion-ease),
    filter .72s ease;
}
.motion-reveal.motion-in{
  opacity:1;
  transform:none;
  filter:none;
}
.motion-reveal[data-motion-delay="1"]{transition-delay:.06s}
.motion-reveal[data-motion-delay="2"]{transition-delay:.12s}
.motion-reveal[data-motion-delay="3"]{transition-delay:.18s}
.motion-reveal[data-motion-delay="4"]{transition-delay:.24s}

/* Encabezados con línea viva */
.section-heading h2,
.about h2,
.contact h2,
.accreditation-heading h2{
  position:relative;
}
.section-heading h2::after,
.about h2::after,
.contact h2::after,
.accreditation-heading h2::after{
  content:"";
  display:block;
  width:0;
  height:3px;
  margin-top:14px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff5a12,#ff9b3d);
  box-shadow:0 0 18px rgba(255,100,20,.28);
  transition:width .8s var(--motion-ease);
}
.motion-in .section-heading h2::after,
.section-heading.motion-in h2::after,
.about.motion-in h2::after,
.contact.motion-in h2::after,
.accreditation-heading.motion-in h2::after{
  width:72px;
}

/* Hero con movimiento orgánico */
.hero-frame{
  transform-origin:center;
  animation:heroBreath 7s ease-in-out infinite;
}
@keyframes heroBreath{
  0%,100%{transform:translateY(0) rotate(.001deg)}
  50%{transform:translateY(-10px) rotate(.25deg)}
}
.orbit-one{
  animation:orbitSlow 28s linear infinite;
  transform-origin:center;
}
.orbit-two{
  animation:orbitSlowReverse 34s linear infinite;
  transform-origin:center;
}
@keyframes orbitSlow{to{transform:rotate(360deg)}}
@keyframes orbitSlowReverse{to{transform:rotate(-360deg)}}

/* Tarjetas: profundidad + spotlight + tilt */
.photo-card,
.accreditation-card,
.about-stats > div,
.contact-panel{
  --mx:50%;
  --my:50%;
}
.photo-card::before,
.accreditation-card::before,
.about-stats > div::before,
.contact-panel .motion-spotlight{
  pointer-events:none;
}
.photo-card{
  transform-style:preserve-3d;
  perspective:900px;
}
.photo-card .photo-overlay{
  transform:translateZ(18px);
}
.photo-card:hover{
  border-color:rgba(255,122,26,.34);
}
.photo-card.motion-tilt{
  transform:
    perspective(900px)
    rotateX(var(--tilt-x,0deg))
    rotateY(var(--tilt-y,0deg))
    translateY(-7px)
    scale(1.01);
}
.photo-card .motion-card-glow,
.accreditation-card .motion-card-glow,
.contact-panel .motion-card-glow{
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:0;
  background:
    radial-gradient(circle at var(--mx) var(--my),
      rgba(255,156,67,.19),
      rgba(255,90,18,.07) 22%,
      transparent 48%);
  transition:opacity .25s ease;
  z-index:1;
}
.photo-card:hover .motion-card-glow,
.accreditation-card:hover .motion-card-glow,
.contact-panel:hover .motion-card-glow{
  opacity:1;
}

/* Botones naranjas: popup + barrido de luz */
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
){
  position:relative;
  isolation:isolate;
  overflow:hidden;
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    0 4px 14px rgba(255,90,18,.16);
}
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
)::after{
  content:"";
  position:absolute;
  top:-80%;
  bottom:-80%;
  left:-45%;
  width:30%;
  z-index:-1;
  transform:rotate(18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  transition:left .58s var(--motion-ease);
}
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
):hover::after{
  left:120%;
}
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
):hover{
  transform:translateY(-5px) scale(1.07);
  box-shadow:
    0 18px 34px rgba(0,0,0,.28),
    0 8px 24px rgba(255,90,18,.27);
}

/* Acreditación Harajuku: degradado animado muy sutil */
.harajuku-accreditation{
  background-size:140% 140%;
}
.harajuku-accreditation::after{
  animation:harajukuOrbit 10s ease-in-out infinite alternate;
}
.harajuku-accreditation .accreditation-badge{
  position:relative;
  overflow:hidden;
}
.harajuku-accreditation .accreditation-badge::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);
  transform:translateX(-130%);
  animation:badgeShine 4.8s ease-in-out infinite;
}
@keyframes badgeShine{
  0%,58%{transform:translateX(-130%)}
  82%,100%{transform:translateX(130%)}
}
@keyframes harajukuOrbit{
  from{transform:rotate(-14deg) translateY(0)}
  to{transform:rotate(-9deg) translateY(-8px)}
}

/* Contacto: halo de respiración */
.contact-panel{
  animation:contactGlow 8s ease-in-out infinite;
}
@keyframes contactGlow{
  0%,100%{box-shadow:0 28px 70px rgba(0,0,0,.30),0 0 0 rgba(255,100,20,0)}
  50%{box-shadow:0 32px 78px rgba(0,0,0,.36),0 0 42px rgba(255,100,20,.06)}
}

/* Visor: transición de imagen más elegante */
#sessionImage,
#portfolioSessionImage{
  transition:
    opacity .32s ease,
    transform .42s var(--motion-ease),
    filter .34s ease,
    box-shadow .34s ease !important;
}
#sessionImage.is-visible,
#portfolioSessionImage.is-visible{
  animation:imageViewerReveal .42s var(--motion-ease);
}
@keyframes imageViewerReveal{
  from{opacity:0;transform:scale(.972);filter:blur(4px)}
  to{opacity:1;transform:scale(1);filter:none}
}
.session-thumb.is-active{
  animation:thumbPulse 2.6s ease-in-out infinite;
}
@keyframes thumbPulse{
  0%,100%{box-shadow:0 0 0 1px rgba(255,122,26,.9),0 12px 28px rgba(255,90,18,.15)}
  50%{box-shadow:0 0 0 2px rgba(255,155,61,.72),0 14px 32px rgba(255,90,18,.25)}
}

/* Menú activo con punto luminoso */
.main-nav a.is-active{
  position:relative;
}
.main-nav a.is-active::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:-3px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#ff8a28;
  box-shadow:0 0 12px rgba(255,106,24,.9);
  transform:translateX(-50%);
}

/* Entrada de página */
body{
  animation:pageFadeIn .5s ease both;
}
@keyframes pageFadeIn{
  from{opacity:0}
  to{opacity:1}
}

@media (hover:none),(pointer:coarse){
  .photo-card.motion-tilt{
    transform:none !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .ambient-orb,
  .hero-frame,
  .orbit-one,
  .orbit-two,
  .contact-panel,
  .harajuku-accreditation::after,
  .harajuku-accreditation .accreditation-badge::after,
  .session-thumb.is-active,
  body{
    animation:none !important;
  }

  .motion-reveal{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
    transition:none !important;
  }

  .photo-card.motion-tilt{
    transform:none !important;
  }
}


/* =========================================================
   v0.4.55 — MOTION SYSTEM 2.0 / POLISH 1000%
   ========================================================= */

/* Scroll progress */
.scroll-progress{
  position:fixed;
  inset:0 0 auto 0;
  height:3px;
  z-index:9999;
  pointer-events:none;
  background:rgba(255,255,255,.025);
}
.scroll-progress span{
  display:block;
  width:100%;
  height:100%;
  transform-origin:left center;
  transform:scaleX(0);
  background:linear-gradient(90deg,#ff5413,#ff791d,#ff9e46);
  box-shadow:
    0 0 14px rgba(255,91,19,.6),
    0 0 26px rgba(255,126,28,.2);
  will-change:transform;
}

/* Cursor aura only desktop */
.cursor-aura{
  position:fixed;
  left:0;
  top:0;
  width:260px;
  height:260px;
  z-index:-1;
  pointer-events:none;
  border-radius:50%;
  opacity:0;
  transform:translate3d(-50%,-50%,0);
  background:radial-gradient(circle,rgba(255,105,24,.10),rgba(255,105,24,.035) 34%,transparent 68%);
  filter:blur(8px);
  transition:opacity .3s ease;
  will-change:transform;
}
body.has-pointer .cursor-aura{opacity:1}

/* Header auto hide / reveal */
.site-header,
.portfolio-gallery-header{
  transition:
    transform .34s cubic-bezier(.2,.8,.2,1),
    background .25s ease,
    box-shadow .25s ease;
  will-change:transform;
}
.site-header.nav-hidden,
.portfolio-gallery-header.nav-hidden{
  transform:translateY(-110%);
}
.site-header.nav-scrolled,
.portfolio-gallery-header.nav-scrolled{
  background:rgba(7,7,7,.90);
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}

/* Kinetic title reveal */
.motion-title{
  overflow:hidden;
}
.motion-title > span{
  display:inline-block;
  transform:translateY(115%);
  opacity:0;
  transition:
    transform .72s cubic-bezier(.16,1,.3,1),
    opacity .52s ease;
}
.motion-title.motion-title-in > span{
  transform:none;
  opacity:1;
}

/* Sections breathe more with soft separators */
.section::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:min(880px,78%);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);
}

/* Cards: animated inner border */
.photo-card,
.accreditation-card,
.contact-panel,
.about-logo-wrap{
  position:relative;
}
.photo-card .motion-border,
.accreditation-card .motion-border,
.contact-panel .motion-border,
.about-logo-wrap .motion-border{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  border-radius:inherit;
  padding:1px;
  opacity:0;
  background:linear-gradient(
    120deg,
    transparent 5%,
    rgba(255,86,18,.75) 28%,
    rgba(255,158,70,.50) 52%,
    transparent 76%
  );
  background-size:220% 220%;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  transition:opacity .25s ease;
  animation:borderSweep 4.8s linear infinite;
}
.photo-card:hover .motion-border,
.accreditation-card:hover .motion-border,
.contact-panel:hover .motion-border,
.about-logo-wrap:hover .motion-border{
  opacity:.82;
}
@keyframes borderSweep{
  from{background-position:180% 0}
  to{background-position:-40% 100%}
}

/* Portfolio cards: image entrance + stronger hover hierarchy */
.photo-card .photo-overlay{
  transition:transform .34s ease,background .34s ease;
}
.photo-card:hover .photo-overlay{
  transform:translateY(-4px) translateZ(22px);
}
.photo-card .photo-overlay h3{
  transition:transform .28s ease,color .28s ease;
}
.photo-card:hover .photo-overlay h3{
  transform:translateX(3px);
  color:#fff;
}
.photo-card .photo-overlay span{
  transition:opacity .28s ease,transform .28s ease;
}
.photo-card:hover .photo-overlay span{
  opacity:1;
  transform:translateX(4px);
}

/* Staggered gallery loading */
.motion-stagger{
  opacity:0;
  transform:translateY(34px) scale(.98);
  filter:blur(5px);
}
.motion-stagger.motion-stagger-in{
  opacity:1;
  transform:none;
  filter:none;
  transition:
    opacity .72s ease,
    transform .86s cubic-bezier(.16,1,.3,1),
    filter .72s ease;
  transition-delay:var(--stagger-delay,0ms);
}

/* Magnetic buttons */
.motion-magnetic{
  transform:translate3d(var(--mag-x,0),var(--mag-y,0),0);
}
.motion-magnetic:hover{
  transform:
    translate3d(var(--mag-x,0),calc(var(--mag-y,0) - 4px),0)
    scale(1.055);
}

/* Button aura */
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
){
  box-shadow:
    0 10px 24px rgba(0,0,0,.22),
    0 5px 18px rgba(255,89,18,.16);
}
:is(
  .btn-primary,.button-primary,.cta-primary,.primary-btn,
  .btn-accent,.accent-btn,.hero-cta,.portfolio-cta,
  .btn.orange,.button.orange,a.btn-primary,button.btn-primary
):hover{
  box-shadow:
    0 20px 38px rgba(0,0,0,.30),
    0 10px 30px rgba(255,89,18,.32);
}

/* Hero text: subtle light sweep */
.hero h1{
  position:relative;
}
.hero h1::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.11) 48%,transparent 66%);
  transform:translateX(-130%);
  mix-blend-mode:screen;
  pointer-events:none;
  animation:heroTextShine 7s ease-in-out infinite;
}
@keyframes heroTextShine{
  0%,68%{transform:translateX(-130%)}
  86%,100%{transform:translateX(130%)}
}

/* Stats micro-animation */
.about-stats > div{
  overflow:hidden;
}
.about-stats > div strong{
  display:inline-block;
  transition:transform .26s cubic-bezier(.18,.89,.32,1.28),color .26s ease;
}
.about-stats > div:hover strong{
  transform:translateY(-2px) scale(1.07);
  color:#ff9b3d;
}

/* Accreditation line pulses */
.accreditation-timeline::before{
  background-size:100% 220%;
  animation:timelineFlow 8s ease-in-out infinite;
}
@keyframes timelineFlow{
  0%,100%{background-position:0 0}
  50%{background-position:0 100%}
}
.accreditation-card::before{
  animation:accreditationPulse 2.8s ease-in-out infinite;
}
@keyframes accreditationPulse{
  0%,100%{transform:scale(1)}
  50%{transform:scale(1.18)}
}

/* Contact text entrance */
.contact-panel.motion-in h2{
  animation:contactTitleRise .7s cubic-bezier(.16,1,.3,1) .05s both;
}
.contact-panel.motion-in p{
  animation:contactTextRise .7s cubic-bezier(.16,1,.3,1) .14s both;
}
@keyframes contactTitleRise{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:none}
}
@keyframes contactTextRise{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:none}
}

/* Image viewer motion polish */
.session-nav{
  overflow:hidden;
}
.session-nav::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at center,rgba(255,255,255,.12),transparent 62%);
  opacity:0;
  transition:opacity .22s ease;
}
.session-nav:hover::after{opacity:1}

.session-thumbs{
  scroll-snap-type:x proximity;
}
.session-thumb{
  scroll-snap-align:center;
}

/* Portfolio page entrance */
.portfolio-full-grid .photo-card{
  content-visibility:auto;
  contain-intrinsic-size:360px;
}

/* Mobile tweaks */
@media (max-width:760px){
  .scroll-progress{height:2px}
  .cursor-aura{display:none}
  .site-header.nav-hidden,
  .portfolio-gallery-header.nav-hidden{
    transform:none;
  }
  .photo-card .motion-border,
  .accreditation-card .motion-border,
  .contact-panel .motion-border,
  .about-logo-wrap .motion-border{
    animation:none;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .motion-title > span,
  .motion-stagger,
  .motion-magnetic{
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
    filter:none !important;
  }
  .hero h1::after,
  .accreditation-timeline::before,
  .accreditation-card::before,
  .photo-card .motion-border,
  .accreditation-card .motion-border,
  .contact-panel .motion-border,
  .about-logo-wrap .motion-border{
    animation:none !important;
  }
}


/* =========================================================
   v0.4.56 — MENÚ + FOOTER REDISEÑADOS AL 1000%
   ========================================================= */

/* ---------- MENÚ PRINCIPAL FLOTANTE ---------- */
.site-header{
  width:min(1440px,calc(100% - 28px)) !important;
  height:72px !important;
  top:12px !important;
  margin:12px auto 0 !important;
  padding:0 12px 0 14px !important;
  border:1px solid rgba(255,255,255,.085) !important;
  border-radius:22px !important;
  background:
    linear-gradient(180deg,rgba(20,20,20,.90),rgba(8,8,8,.90)) !important;
  box-shadow:
    0 18px 44px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
  backdrop-filter:blur(22px) saturate(1.25) !important;
  overflow:visible;
}

.site-header::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(
    100deg,
    transparent 6%,
    rgba(255,91,20,.18),
    rgba(255,158,70,.10),
    transparent 70%
  );
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  pointer-events:none;
}

.brand,
.portfolio-brand{
  min-width:max-content;
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 10px 6px 6px;
  border-radius:16px;
  transition:background .22s ease,transform .22s ease;
}
.brand:hover,
.portfolio-brand:hover{
  background:rgba(255,255,255,.035);
  transform:translateY(-1px);
}

.brand-mark{
  position:relative;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,118,28,.12),transparent 62%),
    rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.07);
}
.brand-mark img{
  width:40px !important;
  height:40px !important;
  object-fit:contain;
}
.brand-mark i{
  position:absolute;
  right:3px;
  bottom:3px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff5714,#ff9b3d);
  box-shadow:
    0 0 0 2px #0a0a0a,
    0 0 12px rgba(255,100,20,.8);
  animation:brandStatusPulse 2.8s ease-in-out infinite;
}
@keyframes brandStatusPulse{
  0%,100%{transform:scale(.9);opacity:.75}
  50%{transform:scale(1.18);opacity:1}
}

.brand-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1.05;
}
.brand-copy strong{
  color:#fff;
  font-size:.98rem;
  letter-spacing:-.03em;
}
.brand-copy small{
  margin-top:4px;
  color:#77716b;
  font-size:.57rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.main-nav{
  height:54px;
  padding:5px;
  gap:2px !important;
  border:1px solid rgba(255,255,255,.055);
  border-radius:17px;
  background:rgba(255,255,255,.022);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.02);
}

.main-nav a{
  min-height:42px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 13px !important;
  border-radius:12px;
  color:#918b84;
  overflow:hidden;
  transition:
    color .22s ease,
    background .22s ease,
    transform .22s ease,
    box-shadow .22s ease;
}

.main-nav a small{
  color:#57534f;
  font-size:.53rem;
  font-weight:900;
  letter-spacing:.08em;
  transition:color .22s ease;
}

.main-nav a span{
  position:relative;
  z-index:1;
  font-size:.77rem;
  font-weight:850;
  letter-spacing:.015em;
}

.main-nav a::after{
  inset:auto 12px 5px 12px !important;
  width:auto !important;
  height:2px !important;
  transform:scaleX(0);
  transform-origin:center;
  background:linear-gradient(90deg,#ff5513,#ff9e45) !important;
  box-shadow:0 0 12px rgba(255,99,20,.38);
  transition:transform .25s ease !important;
}

.main-nav a::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 50% 120%,rgba(255,103,22,.13),transparent 58%);
  opacity:0;
  transition:opacity .24s ease;
}

.main-nav a:hover,
.main-nav a.is-active{
  color:#fff !important;
  background:rgba(255,255,255,.045) !important;
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.main-nav a:hover small,
.main-nav a.is-active small{
  color:#ff8d30;
}

.main-nav a:hover::after,
.main-nav a.is-active::after{
  transform:scaleX(1);
}

.main-nav a:hover::before,
.main-nav a.is-active::before{
  opacity:1;
}

/* remove old active menu dot */
.main-nav a.is-active::before{
  width:auto !important;
  height:auto !important;
  left:0 !important;
  bottom:0 !important;
  transform:none !important;
  box-shadow:none !important;
}

/* Hamburger premium */
.nav-toggle{
  position:relative;
  width:48px !important;
  height:48px !important;
  border-radius:15px !important;
  border:1px solid rgba(255,255,255,.085) !important;
  background:rgba(255,255,255,.035) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:background .24s ease,border-color .24s ease,transform .24s ease;
}
.nav-toggle:hover{
  border-color:rgba(255,112,25,.35) !important;
  background:rgba(255,108,23,.07) !important;
  transform:scale(1.04);
}
.nav-toggle span{
  position:absolute;
  left:14px;
  width:18px !important;
  height:2px !important;
  transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s ease,top .28s ease;
}
.nav-toggle span:nth-child(1){top:15px}
.nav-toggle span:nth-child(2){top:22px}
.nav-toggle span:nth-child(3){top:29px}
body.menu-open .nav-toggle span:nth-child(1){
  top:22px;
  transform:rotate(45deg);
}
body.menu-open .nav-toggle span:nth-child(2){
  opacity:0;
  transform:scaleX(.2);
}
body.menu-open .nav-toggle span:nth-child(3){
  top:22px;
  transform:rotate(-45deg);
}

/* ---------- MOBILE MENU ---------- */
@media (max-width:760px){
  body.menu-open{overflow:hidden}

  .site-header{
    width:calc(100% - 20px) !important;
    height:66px !important;
    top:10px !important;
    margin-top:10px !important;
    padding:0 8px 0 9px !important;
    border-radius:19px !important;
  }

  .brand-mark{
    width:42px;
    height:42px;
    border-radius:13px;
  }
  .brand-mark img{
    width:36px !important;
    height:36px !important;
  }
  .brand-copy strong{font-size:.93rem}
  .brand-copy small{font-size:.51rem}

  .main-nav{
    position:fixed !important;
    inset:86px 10px 10px 10px !important;
    height:auto !important;
    min-height:0 !important;
    padding:72px 18px 24px !important;
    display:flex;
    flex-direction:column;
    align-items:stretch !important;
    justify-content:center;
    gap:7px !important;
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;
    background:
      radial-gradient(circle at 80% 12%,rgba(255,99,20,.14),transparent 26%),
      linear-gradient(160deg,rgba(18,18,18,.985),rgba(5,5,5,.99)) !important;
    box-shadow:0 26px 70px rgba(0,0,0,.48);
    backdrop-filter:blur(24px);
    transform:translateY(-14px) scale(.985);
    opacity:0;
    pointer-events:none;
    transition:
      transform .34s cubic-bezier(.16,1,.3,1),
      opacity .25s ease !important;
  }

  .main-nav::before{
    content:"NAVEGACIÓN";
    position:absolute;
    top:24px;
    left:28px;
    color:#5f5a55;
    font-size:.59rem;
    font-weight:900;
    letter-spacing:.2em;
  }

  body.menu-open .main-nav{
    transform:none !important;
    opacity:1;
    pointer-events:auto;
  }

  .main-nav a{
    width:100%;
    min-height:64px;
    padding:0 16px !important;
    gap:13px;
    border:1px solid transparent;
    opacity:0;
    transform:translateY(14px);
    transition:
      opacity .3s ease,
      transform .42s cubic-bezier(.16,1,.3,1),
      background .2s ease,
      border-color .2s ease !important;
  }

  body.menu-open .main-nav a{
    opacity:1;
    transform:none;
  }

  body.menu-open .main-nav a:nth-child(1){transition-delay:.04s}
  body.menu-open .main-nav a:nth-child(2){transition-delay:.08s}
  body.menu-open .main-nav a:nth-child(3){transition-delay:.12s}
  body.menu-open .main-nav a:nth-child(4){transition-delay:.16s}
  body.menu-open .main-nav a:nth-child(5){transition-delay:.20s}

  .main-nav a small{
    min-width:28px;
    color:#ff8730;
    font-size:.66rem;
  }
  .main-nav a span{
    font-size:1.45rem;
    letter-spacing:-.035em;
  }
  .main-nav a:hover,
  .main-nav a.is-active{
    border-color:rgba(255,115,27,.16);
    background:rgba(255,112,25,.055) !important;
  }
}

/* ---------- HEADER PORTAFOLIO COMPLETO ---------- */
.portfolio-header{
  width:min(1440px,calc(100% - 28px));
  min-height:72px !important;
  top:12px !important;
  margin:12px auto 0;
  padding:8px 10px !important;
  border:1px solid rgba(255,255,255,.085) !important;
  border-radius:22px !important;
  background:
    linear-gradient(180deg,rgba(20,20,20,.91),rgba(7,7,7,.91)) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.28);
  backdrop-filter:blur(22px) saturate(1.2) !important;
}

.portfolio-back{
  min-height:46px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 16px !important;
  border-radius:14px !important;
  border-color:rgba(255,255,255,.08) !important;
  background:rgba(255,255,255,.025);
}
.portfolio-back > span{
  color:#ff8b30;
  font-size:1.1rem;
  transition:transform .22s ease;
}
.portfolio-back:hover{
  border-color:rgba(255,113,25,.35) !important;
  background:rgba(255,108,23,.07) !important;
  transform:translateY(-1px);
}
.portfolio-back:hover > span{
  transform:translateX(-3px);
}

/* ---------- FOOTER PRINCIPAL ---------- */
.site-footer{
  position:relative;
  min-height:0 !important;
  padding:0 !important;
  display:block !important;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.06) !important;
  background:
    radial-gradient(circle at 82% 0%,rgba(255,101,21,.095),transparent 28%),
    linear-gradient(180deg,#080808,#030303) !important;
  color:#8c8680;
}

.site-footer::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  width:min(760px,70%);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,#ff6718,transparent);
  box-shadow:0 0 20px rgba(255,102,22,.26);
}

.site-footer::after{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:-180px;
  bottom:-220px;
  border-radius:50%;
  border:1px solid rgba(255,119,27,.07);
  box-shadow:
    0 0 0 40px rgba(255,119,27,.018),
    0 0 0 84px rgba(255,119,27,.01);
  pointer-events:none;
}

.footer-shell{
  position:relative;
  z-index:1;
  width:min(1380px,calc(100% - 40px));
  margin:0 auto;
  padding:64px 0 26px;
}

.footer-primary{
  display:grid;
  grid-template-columns:minmax(280px,1.15fr) minmax(220px,.65fr) minmax(300px,1fr);
  gap:clamp(36px,7vw,110px);
  align-items:start;
  padding-bottom:48px;
}

.footer-identity{
  max-width:430px;
}
.footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}
.footer-logo-wrap{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:17px;
  border:1px solid rgba(255,255,255,.07);
  background:
    radial-gradient(circle at center,rgba(255,106,24,.11),transparent 64%),
    rgba(255,255,255,.025);
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}
.footer-logo-wrap img{
  width:46px !important;
  height:46px !important;
}
.footer-brand > div{
  display:flex;
  flex-direction:column;
}
.footer-brand strong{
  color:#fff;
  font-size:1.1rem;
  letter-spacing:-.035em;
}
.footer-brand small{
  margin-top:4px;
  color:#6f6964;
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.footer-identity > p{
  max-width:40ch;
  margin:0;
  color:#88827b;
  line-height:1.75;
}
.footer-handle{
  display:inline-flex;
  margin-top:18px;
  padding:7px 11px;
  border:1px solid rgba(255,111,25,.15);
  border-radius:999px;
  background:rgba(255,107,24,.035);
  color:#ff9340;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.03em;
}

.footer-nav{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.footer-nav > p{
  margin:0 0 10px;
  color:#5e5954;
  font-size:.59rem;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.footer-nav a{
  width:max-content;
  min-width:180px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 10px;
  border-radius:10px;
  color:#aaa49e;
  font-size:.82rem;
  font-weight:800;
  transition:color .2s ease,background .2s ease,transform .2s ease;
}
.footer-nav a span{
  color:#55504c;
  font-size:.56rem;
  font-weight:900;
}
.footer-nav a:hover{
  color:#fff;
  background:rgba(255,255,255,.03);
  transform:translateX(4px);
}
.footer-nav a:hover span{
  color:#ff8b31;
}

.footer-manifesto{
  max-width:390px;
  justify-self:end;
}
.footer-kicker{
  margin:0 0 16px;
  color:#ff8730;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.16em;
}
.footer-manifesto strong{
  display:block;
  max-width:12ch;
  color:#fff;
  font-size:clamp(1.8rem,3vw,3.4rem);
  line-height:.93;
  letter-spacing:-.055em;
}
.footer-manifesto span{
  display:block;
  max-width:30ch;
  margin-top:15px;
  color:#79736d;
  line-height:1.65;
}

.footer-bottom{
  min-height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(255,255,255,.055);
  color:#5f5a55;
  font-size:.7rem;
  font-weight:700;
}
.footer-bottom p{margin:0}
.footer-bottom > span{
  color:#77716b;
}

/* ---------- FOOTER PORTAFOLIO ---------- */
.portfolio-gallery-footer{
  width:min(1440px,calc(100% - 28px)) !important;
  min-height:110px;
  margin:52px auto 24px !important;
  padding:22px 24px !important;
  display:grid !important;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:20px;
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:22px;
  background:
    radial-gradient(circle at 10% 50%,rgba(255,107,24,.065),transparent 28%),
    linear-gradient(145deg,#0d0d0d,#070707);
  box-shadow:0 18px 40px rgba(0,0,0,.20);
}

.portfolio-footer-brand{
  display:flex;
  align-items:center;
  gap:10px;
}
.portfolio-footer-brand img{
  width:42px;
  height:42px;
  object-fit:contain;
}
.portfolio-footer-brand > div{
  display:flex;
  flex-direction:column;
}
.portfolio-footer-brand strong{
  color:#fff;
  font-size:.9rem;
}
.portfolio-footer-brand span{
  margin-top:2px;
  color:#635e59;
  font-size:.61rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.1em;
}

.portfolio-gallery-footer > p{
  margin:0;
  color:#716b65;
  font-size:.72rem;
}
.portfolio-footer-note{
  justify-self:end;
  color:#8d8781;
  font-size:.72rem;
  font-style:italic;
}

/* Footer responsive */
@media (max-width:960px){
  .footer-primary{
    grid-template-columns:1fr 1fr;
    gap:46px;
  }
  .footer-manifesto{
    grid-column:1 / -1;
    justify-self:start;
  }
  .footer-manifesto strong{
    max-width:16ch;
  }
}

@media (max-width:700px){
  .portfolio-header{
    width:calc(100% - 20px);
    min-height:64px !important;
    top:10px !important;
    margin-top:10px;
    border-radius:19px !important;
  }
  .portfolio-brand .brand-copy small{
    display:none;
  }
  .portfolio-back{
    min-height:42px;
    padding:0 12px !important;
  }
  .portfolio-back strong{
    font-size:.75rem;
  }

  .footer-shell{
    width:min(100% - 28px,1380px);
    padding-top:48px;
  }
  .footer-primary{
    grid-template-columns:1fr;
    gap:38px;
    padding-bottom:38px;
  }
  .footer-manifesto{
    grid-column:auto;
  }
  .footer-manifesto strong{
    font-size:2.4rem;
  }
  .footer-nav a{
    width:100%;
    min-width:0;
    padding:10px 0;
    border-bottom:1px solid rgba(255,255,255,.035);
    border-radius:0;
  }
  .footer-bottom{
    min-height:84px;
    align-items:flex-start;
    justify-content:center;
    flex-direction:column;
    gap:5px;
    padding-block:18px;
  }

  .portfolio-gallery-footer{
    width:calc(100% - 20px) !important;
    grid-template-columns:1fr;
    gap:12px;
    margin-bottom:10px !important;
    padding:18px !important;
    text-align:left;
  }
  .portfolio-footer-note{
    justify-self:start;
  }
}

@media (prefers-reduced-motion:reduce){
  .brand-mark i{
    animation:none !important;
  }
}


/* =========================================================
   v0.4.57 — MENÚ + FOOTER + VISUALIZADOR 1000%
   ========================================================= */

/* ---------- MENÚ: nuevos refinamientos ---------- */
.site-header{
  gap:14px !important;
  justify-content:space-between !important;
}
.header-status{
  min-height:46px;
  padding:0 14px;
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));
  color:#cfc9c2;
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.header-status i,
.portfolio-header-status i,
.footer-availability i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:linear-gradient(135deg,#ff5c16,#ff9e46);
  box-shadow:0 0 14px rgba(255,99,20,.9);
  animation:tinyPulse 2.8s ease-in-out infinite;
  flex:0 0 auto;
}
@keyframes tinyPulse{
  0%,100%{transform:scale(.88);opacity:.72}
  50%{transform:scale(1.18);opacity:1}
}
.header-status span{
  white-space:nowrap;
}

.nav-backdrop{
  position:fixed;
  inset:0;
  z-index:98;
  background:
    radial-gradient(circle at top right,rgba(255,96,20,.09),transparent 28%),
    rgba(0,0,0,.56);
  opacity:0;
  pointer-events:none;
  backdrop-filter:blur(6px);
  transition:opacity .28s ease;
}
body.menu-open .nav-backdrop{
  opacity:1;
  pointer-events:auto;
}

.main-nav{
  position:relative;
}
.main-nav::after{
  content:"";
  position:absolute;
  inset:auto 20px 10px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);
  pointer-events:none;
}

@media (max-width:1100px){
  .header-status{
    display:none;
  }
}

@media (max-width:760px){
  .main-nav::after{
    display:none;
  }
}

/* ---------- HEADER PORTFOLIO REFINED ---------- */
.portfolio-header{
  gap:16px !important;
}
.portfolio-header-status{
  min-height:44px;
  padding:0 14px;
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:#c6c0ba;
  font-size:.72rem;
  font-weight:850;
}
@media (max-width:860px){
  .portfolio-header-status{
    display:none;
  }
}

/* ---------- FOOTER: look more editorial ---------- */
.footer-panel{
  position:relative;
  padding:24px 24px 22px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.012));
  box-shadow:
    0 18px 40px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.018);
  overflow:hidden;
}
.footer-panel::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top right,rgba(255,103,22,.07),transparent 28%);
  pointer-events:none;
}
.footer-handle-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
  align-items:center;
}
.footer-availability{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 11px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.022);
  color:#c1bbb4;
  font-size:.7rem;
  font-weight:820;
}
.footer-ribbon{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  padding:0 0 28px;
}
.footer-ribbon span{
  min-height:38px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
  color:#9f9891;
  font-size:.72rem;
  font-weight:820;
  transition:transform .22s ease,color .22s ease,border-color .22s ease,background .22s ease;
}
.footer-ribbon span:hover{
  transform:translateY(-2px);
  color:#fff;
  border-color:rgba(255,109,24,.22);
  background:rgba(255,109,24,.06);
}
.footer-bottom{
  padding-top:18px;
}
.footer-bottom > span{
  position:relative;
}
.footer-bottom > span::before{
  content:"";
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:8px;
  border-radius:50%;
  background:#ff7b25;
  vertical-align:middle;
}

.portfolio-gallery-footer{
  overflow:hidden;
}
.portfolio-gallery-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 90% 20%,rgba(255,101,21,.09),transparent 24%),
    linear-gradient(120deg,transparent,rgba(255,255,255,.012),transparent);
  pointer-events:none;
}
.portfolio-footer-tags{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
}
.portfolio-footer-tags span{
  min-height:34px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.022);
  color:#908983;
  font-size:.68rem;
  font-weight:820;
}
@media (max-width:700px){
  .footer-panel{
    padding:20px 18px 18px;
    border-radius:20px;
  }
  .footer-ribbon{
    padding-bottom:24px;
  }
  .portfolio-footer-tags{
    justify-content:flex-start;
  }
}

/* ---------- VISUALIZADOR ESTÉTICO ---------- */
.session-lightbox{
  width:min(1240px,calc(100% - 32px)) !important;
  max-width:1240px;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:28px !important;
  background:
    radial-gradient(circle at top right,rgba(255,102,22,.10),transparent 24%),
    linear-gradient(160deg,rgba(11,11,11,.985),rgba(5,5,5,.99)) !important;
  box-shadow:
    0 28px 80px rgba(0,0,0,.54),
    inset 0 1px 0 rgba(255,255,255,.025);
  overflow:hidden;
}
.session-lightbox::backdrop{
  background:
    radial-gradient(circle at center,rgba(255,92,18,.10),transparent 18%),
    rgba(0,0,0,.90) !important;
  backdrop-filter:blur(12px) saturate(1.08);
}
.session-aurora{
  position:absolute;
  inset:-30% -16% auto auto;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,103,22,.13),transparent 63%);
  filter:blur(24px);
  pointer-events:none;
  z-index:0;
}
.lightbox-close{
  top:18px !important;
  right:18px !important;
  width:48px !important;
  height:48px !important;
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(10,10,10,.55) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.24);
  backdrop-filter:blur(12px);
  transition:
    transform .24s ease,
    background .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}
.lightbox-close span{
  display:inline-block;
  transition:transform .24s ease;
}
.lightbox-close:hover{
  transform:translateY(-2px);
  background:rgba(255,106,24,.12) !important;
  border-color:rgba(255,106,24,.26) !important;
  box-shadow:0 14px 26px rgba(0,0,0,.3);
}
.lightbox-close:hover span{
  transform:rotate(90deg);
}

.session-viewer{
  position:relative;
  z-index:1;
  height:100%;
  grid-template-rows:auto minmax(0,1fr) auto !important;
}
.session-viewer-header{
  min-height:102px !important;
  padding:24px 88px 18px 24px !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.015),rgba(255,255,255,0)) !important;
}
.session-head-copy{
  display:flex;
  flex-direction:column;
}
.session-head-copy p{
  margin:0 0 5px !important;
}
.session-head-copy h3{
  font-size:clamp(1.25rem,2vw,1.7rem) !important;
}
.session-subline{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  align-items:center;
  margin-top:7px;
}
.session-viewer-header span{
  margin-top:0 !important;
}
.session-hint{
  color:#7a746d;
  font-size:.7rem;
  font-style:normal;
  letter-spacing:.01em;
}
.session-head-side{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}
.session-counter{
  min-height:40px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.022);
  color:#fff !important;
  font-size:.77rem !important;
  font-weight:900 !important;
}
.session-chip{
  min-height:28px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  background:rgba(255,111,26,.09);
  border:1px solid rgba(255,111,26,.16);
  color:#ff9540 !important;
  font-size:.62rem !important;
  font-weight:900 !important;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.session-stage{
  position:relative !important;
  display:grid !important;
  place-items:center !important;
  padding:22px 94px 18px !important;
  background:linear-gradient(180deg,#050505,#020202) !important;
  isolation:isolate;
}
.session-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at center,rgba(255,255,255,.03),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.01),transparent 24%,transparent 70%,rgba(255,255,255,.01));
  pointer-events:none;
}
.session-stage-backdrop{
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(180deg,rgba(3,3,3,.74),rgba(3,3,3,.60)),
    var(--session-bg-image);
  background-position:center;
  background-size:cover;
  filter:blur(36px) saturate(1.08);
  transform:scale(1.08);
  opacity:.44;
  pointer-events:none;
}
.session-image-shell{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  min-height:480px;
  display:grid;
  place-items:center;
  padding:20px;
  border-radius:26px;
  border:1px solid rgba(255,255,255,.055);
  background:
    linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.012));
  box-shadow:
    0 22px 54px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.02);
  overflow:hidden;
}
.session-image-shell::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 24%,transparent 70%,rgba(255,255,255,.02));
}
.session-stage > #sessionImage,
.session-stage > .session-image-shell > #sessionImage,
.session-stage > #portfolioSessionImage,
.session-stage > .session-image-shell > #portfolioSessionImage{
  position:relative !important;
  inset:auto !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:min(72vh,780px) !important;
  border-radius:18px;
  display:block;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
  box-shadow:
    0 20px 44px rgba(0,0,0,.28),
    0 0 0 1px rgba(255,255,255,.04);
  opacity:0;
  transform:translateY(10px) scale(.985);
  transition:opacity .32s ease,transform .42s cubic-bezier(.16,1,.3,1);
}
.session-stage > #sessionImage.is-visible,
.session-stage > .session-image-shell > #sessionImage.is-visible,
.session-stage > #portfolioSessionImage.is-visible,
.session-stage > .session-image-shell > #portfolioSessionImage.is-visible{
  opacity:1;
  transform:none;
}

.session-nav{
  top:50% !important;
  width:58px !important;
  height:58px !important;
  display:grid;
  place-items:center;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background:rgba(7,7,7,.52) !important;
  color:#fff !important;
  box-shadow:0 16px 34px rgba(0,0,0,.26);
  backdrop-filter:blur(16px);
}
.session-nav span{
  display:block;
  font-size:2rem;
  line-height:1;
  transition:transform .22s ease;
}
.session-nav:hover{
  transform:translateY(-50%) scale(1.05) !important;
  background:linear-gradient(135deg,#ff5a17,#ff9d45) !important;
  border-color:rgba(255,128,36,.7) !important;
  color:#0a0a0a !important;
}
.session-nav.prev:hover span{
  transform:translateX(-2px);
}
.session-nav.next:hover span{
  transform:translateX(2px);
}
.session-nav.prev{left:22px !important}
.session-nav.next{right:22px !important}

.session-filmstrip{
  padding:14px 18px 18px;
  border-top:1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,.018));
}
.session-filmstrip-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:10px;
}
.session-filmstrip-head > span:first-child{
  color:#fff;
  font-size:.74rem;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.session-filmstrip-note{
  color:#7e7871;
  font-size:.68rem;
}
.session-thumbs{
  min-height:108px !important;
  justify-content:flex-start !important;
  gap:12px !important;
  padding:4px 2px 2px !important;
  background:transparent !important;
  border-top:0 !important;
}
.session-thumb{
  width:78px !important;
  height:90px !important;
  position:relative;
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:16px !important;
  background:#111 !important;
  opacity:.72 !important;
  box-shadow:0 10px 20px rgba(0,0,0,.16);
  transition:
    transform .24s ease,
    opacity .24s ease,
    border-color .24s ease,
    box-shadow .24s ease !important;
}
.session-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.22));
  pointer-events:none;
}
.session-thumb img{
  object-fit:cover !important;
}
.session-thumb:hover{
  opacity:1 !important;
  transform:translateY(-3px);
  border-color:rgba(255,255,255,.16) !important;
}
.session-thumb.is-active{
  opacity:1 !important;
  transform:translateY(-4px);
  border-color:#ff8d35 !important;
  box-shadow:
    0 0 0 1px rgba(255,141,53,.7),
    0 16px 28px rgba(0,0,0,.24);
}
.session-thumb.is-active::before{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:-7px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff5a17,#ff9b45);
  box-shadow:0 0 12px rgba(255,99,20,.5);
}

@media (max-width:920px){
  .session-lightbox{
    width:min(100% - 16px,1240px) !important;
  }
  .session-viewer-header{
    padding:18px 76px 16px 18px !important;
  }
  .session-stage{
    padding:18px 72px 14px !important;
  }
  .session-image-shell{
    min-height:420px;
  }
}
@media (max-width:760px){
  .session-lightbox{
    width:100% !important;
    height:100dvh !important;
    max-height:none !important;
    border:0 !important;
    border-radius:0 !important;
  }
  .session-aurora{
    width:280px;
    height:280px;
  }
  .lightbox-close{
    top:12px !important;
    right:12px !important;
    width:44px !important;
    height:44px !important;
    border-radius:14px !important;
  }
  .session-viewer-header{
    min-height:90px !important;
    padding:16px 62px 14px 14px !important;
    align-items:flex-start !important;
  }
  .session-viewer-header h3{
    font-size:1.08rem !important;
  }
  .session-subline{
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
  }
  .session-head-side{
    display:none;
  }
  .session-stage{
    padding:14px 14px 10px !important;
  }
  .session-image-shell{
    min-height:calc(100dvh - 250px);
    padding:12px;
    border-radius:18px;
  }
  .session-stage > #sessionImage,
  .session-stage > .session-image-shell > #sessionImage,
  .session-stage > #portfolioSessionImage,
  .session-stage > .session-image-shell > #portfolioSessionImage{
    max-height:calc(100dvh - 300px) !important;
    border-radius:14px;
  }
  .session-nav{
    top:auto !important;
    bottom:18px;
    width:48px !important;
    height:48px !important;
    border-radius:15px !important;
  }
  .session-nav.prev{
    left:18px !important;
    transform:none !important;
  }
  .session-nav.next{
    right:18px !important;
    transform:none !important;
  }
  .session-nav:hover{
    transform:scale(1.02) !important;
  }
  .session-filmstrip{
    padding:12px 12px 14px;
  }
  .session-filmstrip-note{
    display:none;
  }
  .session-thumbs{
    min-height:84px !important;
    gap:10px !important;
  }
  .session-thumb{
    width:62px !important;
    height:72px !important;
    border-radius:14px !important;
  }
}
@media (prefers-reduced-motion:reduce){
  .header-status i,
  .portfolio-header-status i,
  .footer-availability i{
    animation:none !important;
  }
}


/* =========================================================
   v0.4.58 — animaciones 1000% + visualizador sin recorte + optimización
   ========================================================= */

:root{
  --ui-glow-orange: rgba(255,101,20,.22);
  --ui-glow-orange-strong: rgba(255,125,35,.36);
  --viewer-panel: rgba(255,255,255,.028);
  --viewer-stroke: rgba(255,255,255,.07);
  --viewer-soft-stroke: rgba(255,255,255,.04);
  --viewer-shadow: 0 28px 80px rgba(0,0,0,.48);
  --optimize-ease: cubic-bezier(.22,1,.36,1);
}

/* ---------- optimización visual/render ---------- */
.hero,
.portfolio-preview,
.photo-grid,
.portfolio-full-grid,
.accreditation-timeline,
.footer-shell,
.portfolio-gallery-intro,
.portfolio-gallery-footer{
  content-visibility:auto;
  contain-intrinsic-size: 1px 720px;
}

.photo-card,
.contact-panel,
.accreditation-card,
.footer-panel,
.hero-featured,
.hero-frame,
.portfolio-gallery-footer{
  backface-visibility:hidden;
  transform:translateZ(0);
}

.ambient-orb,
.cursor-aura{
  will-change:transform, opacity;
}

@media (pointer:coarse){
  .cursor-aura{
    display:none !important;
  }
}

/* ---------- revelado suave para bloques importantes ---------- */
.v0458-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:
    opacity .7s ease,
    transform .9s var(--optimize-ease);
  transition-delay:var(--v0458-delay, 0ms);
}
.v0458-reveal.v0458-in{
  opacity:1;
  transform:none;
}

/* ---------- menú aún más vivo ---------- */
.site-header,
.portfolio-header{
  position:sticky;
  top:0;
  backdrop-filter:blur(14px) saturate(1.08);
}

.site-header::after,
.portfolio-header::after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
  opacity:.0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.site-header.nav-scrolled::after,
.portfolio-header.nav-scrolled::after{
  opacity:1;
}

.main-nav a,
.portfolio-back{
  position:relative;
  overflow:hidden;
}
.main-nav a::before,
.portfolio-back::before{
  content:"";
  position:absolute;
  inset:auto 12px 7px;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#ff5a16,#ff9c45);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .26s ease;
  opacity:.95;
}
.main-nav a:hover::before,
.main-nav a.is-active::before,
.portfolio-back:hover::before{
  transform:scaleX(1);
}
.main-nav a:hover,
.portfolio-back:hover{
  transform:translateY(-1px);
}

/* ---------- botones naranja: pop-up + glow más fino ---------- */
.btn-primary,
.portfolio-back,
.portfolio-link,
.contact-panel a{
  position:relative;
  overflow:hidden;
}
.btn-primary::after,
.portfolio-back::after,
.portfolio-link::after,
.contact-panel a::after{
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  left:calc(var(--glow-x, 50%) - 80px);
  top:calc(var(--glow-y, 50%) - 80px);
  background:radial-gradient(circle, rgba(255,255,255,.28), transparent 60%);
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}
.btn-primary:hover::after,
.portfolio-back:hover::after,
.portfolio-link:hover::after,
.contact-panel a:hover::after{
  opacity:.48;
}
.btn-primary:hover,
.portfolio-back:hover,
.portfolio-link:hover,
.contact-panel a:hover{
  animation:v0458ButtonPop .34s var(--optimize-ease);
}
@keyframes v0458ButtonPop{
  0%{transform:translateY(0) scale(1)}
  55%{transform:translateY(-3px) scale(1.03)}
  100%{transform:translateY(-2px) scale(1.01)}
}

/* ---------- footer: pequeños movimientos y mejor aire ---------- */
.footer-panel,
.portfolio-gallery-footer{
  transition:
    transform .34s var(--optimize-ease),
    border-color .28s ease,
    box-shadow .28s ease;
}
.footer-panel:hover,
.portfolio-gallery-footer:hover{
  transform:translateY(-4px);
  border-color:rgba(255,125,35,.16);
  box-shadow:0 24px 60px rgba(0,0,0,.22), 0 0 0 1px rgba(255,120,28,.05);
}

/* ---------- visualizador refinado, sin recorte ---------- */
dialog.session-lightbox{
  overscroll-behavior:contain;
}
dialog.session-lightbox .session-viewer{
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  min-height:min(90dvh,980px);
}
dialog.session-lightbox .session-viewer-header{
  position:relative;
  overflow:hidden;
}
dialog.session-lightbox .session-viewer-header::after{
  content:"";
  position:absolute;
  inset:auto 24px 0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
  pointer-events:none;
}
dialog.session-lightbox .session-stage{
  display:grid !important;
  place-items:center !important;
  position:relative !important;
  min-width:0;
  min-height:min(62vh,760px);
  padding:22px !important;
  overflow:hidden !important;
  isolation:isolate;
  background:
    radial-gradient(circle at 50% 30%, rgba(255,255,255,.025), transparent 35%),
    linear-gradient(180deg,#050505,#030303) !important;
}
dialog.session-lightbox .session-stage-backdrop{
  opacity:.30 !important;
  transform:scale(1.12) !important;
  filter:blur(42px) saturate(1.04) !important;
}
dialog.session-lightbox .session-image-shell{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:28px;
  border-radius:28px;
  border:1px solid var(--viewer-stroke);
  background:
    linear-gradient(180deg,rgba(255,255,255,.024),rgba(255,255,255,.012)),
    radial-gradient(circle at top, rgba(255,255,255,.03), transparent 40%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 24px 70px rgba(0,0,0,.26);
  overflow:hidden;
}
dialog.session-lightbox .session-image-shell::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 26%,transparent 72%,rgba(255,255,255,.014));
  pointer-events:none;
}
dialog.session-lightbox .session-image-shell.is-loading::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(110deg,
      transparent 0%,
      rgba(255,255,255,.02) 28%,
      rgba(255,255,255,.08) 46%,
      rgba(255,255,255,.02) 62%,
      transparent 100%);
  transform:translateX(-120%);
  animation:v0458Shimmer 1.05s linear infinite;
  pointer-events:none;
}
@keyframes v0458Shimmer{
  to{transform:translateX(120%)}
}

/* reset absoluto definitivo del img */
dialog.session-lightbox .session-image-shell > #sessionImage,
dialog.session-lightbox .session-image-shell > #portfolioSessionImage,
html body dialog.session-lightbox img#sessionImage,
html body dialog.session-lightbox img#portfolioSessionImage{
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  display:block !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:min(70vh,760px) !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  padding:0 !important;
  border-radius:18px;
  background:transparent !important;
  box-shadow:
    0 22px 46px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,255,255,.04);
}
dialog.session-lightbox .session-stage.has-image .session-image-shell > #sessionImage,
dialog.session-lightbox .session-stage.has-image .session-image-shell > #portfolioSessionImage{
  filter:none;
}

/* navegación más limpia */
dialog.session-lightbox .session-nav{
  position:absolute !important;
  z-index:3;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:60px !important;
  height:60px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.11) !important;
  background:rgba(8,8,8,.55) !important;
  box-shadow:0 18px 34px rgba(0,0,0,.26);
}
dialog.session-lightbox .session-nav.prev{left:18px !important}
dialog.session-lightbox .session-nav.next{right:18px !important}
dialog.session-lightbox .session-nav:hover{
  background:linear-gradient(135deg,#ff5d17,#ff9d45) !important;
  box-shadow:0 18px 34px rgba(255,94,20,.24);
}
dialog.session-lightbox .session-nav:hover span{
  color:#141414;
}

/* cabecera / miniaturas */
dialog.session-lightbox .session-head-copy h3{
  text-wrap:balance;
}
dialog.session-lightbox .session-filmstrip{
  position:relative;
  overflow:hidden;
}
dialog.session-lightbox .session-filmstrip::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(255,255,255,.014),transparent 42%),
    radial-gradient(circle at center, rgba(255,255,255,.02), transparent 65%);
  pointer-events:none;
}
dialog.session-lightbox .session-thumbs{
  position:relative;
  z-index:1;
  scrollbar-color:rgba(255,255,255,.18) transparent;
}
dialog.session-lightbox .session-thumb{
  flex:0 0 auto;
  overflow:hidden;
}
dialog.session-lightbox .session-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover !important;
  transform:scale(1);
  transition:transform .24s ease;
}
dialog.session-lightbox .session-thumb:hover img,
dialog.session-lightbox .session-thumb.is-active img{
  transform:scale(1.04);
}

body.viewer-open{
  overflow:hidden;
}

@media (max-width:980px){
  dialog.session-lightbox .session-stage{
    min-height:min(58vh,680px);
    padding:18px !important;
  }
  dialog.session-lightbox .session-image-shell{
    padding:20px;
  }
  dialog.session-lightbox .session-image-shell > #sessionImage,
  dialog.session-lightbox .session-image-shell > #portfolioSessionImage,
  html body dialog.session-lightbox img#sessionImage,
  html body dialog.session-lightbox img#portfolioSessionImage{
    max-height:min(64vh,660px) !important;
  }
}
@media (max-width:760px){
  dialog.session-lightbox .session-viewer{
    min-height:100dvh;
  }
  dialog.session-lightbox .session-stage{
    min-height:calc(100dvh - 238px);
    padding:14px 14px 76px !important;
  }
  dialog.session-lightbox .session-image-shell{
    padding:12px;
    border-radius:18px;
  }
  dialog.session-lightbox .session-image-shell > #sessionImage,
  dialog.session-lightbox .session-image-shell > #portfolioSessionImage,
  html body dialog.session-lightbox img#sessionImage,
  html body dialog.session-lightbox img#portfolioSessionImage{
    max-height:calc(100dvh - 320px) !important;
    border-radius:14px;
  }
  dialog.session-lightbox .session-nav{
    top:auto !important;
    bottom:14px;
    transform:none !important;
    width:46px !important;
    height:46px !important;
    border-radius:15px !important;
  }
  dialog.session-lightbox .session-nav.prev{left:14px !important}
  dialog.session-lightbox .session-nav.next{right:14px !important}
  dialog.session-lightbox .session-viewer-header{
    padding-right:60px !important;
  }
  dialog.session-lightbox .session-filmstrip{
    padding:12px 12px 14px !important;
  }
}
@media (max-width:430px){
  dialog.session-lightbox .session-stage{
    min-height:calc(100dvh - 230px);
    padding:12px 12px 70px !important;
  }
  dialog.session-lightbox .session-image-shell > #sessionImage,
  dialog.session-lightbox .session-image-shell > #portfolioSessionImage,
  html body dialog.session-lightbox img#sessionImage,
  html body dialog.session-lightbox img#portfolioSessionImage{
    max-height:calc(100dvh - 304px) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .v0458-reveal,
  dialog.session-lightbox .session-nav,
  dialog.session-lightbox .session-thumb img,
  dialog.session-lightbox .session-image-shell,
  dialog.session-lightbox .session-image-shell.is-loading::after{
    animation:none !important;
    transition:none !important;
  }
}


/* =========================================================
   v0.4.59 — visualizador full image + animaciones premium + optimización
   ========================================================= */
:root{
  --viewer-vh: 1vh;
  --ui-premium-glow: rgba(255,118,28,.18);
  --ui-premium-line: rgba(255,255,255,.08);
  --ui-premium-line-soft: rgba(255,255,255,.04);
}

html{
  scroll-behavior:smooth;
}

/* rendimiento general */
img{image-rendering:auto}
.photo-card,
.hero-copy,
.hero-visual,
.about-copy,
.contact-panel,
.footer-panel,
.portfolio-gallery-intro,
.portfolio-full-grid{
  contain:layout paint style;
}

/* menú aún más bonito */
.site-header,
.portfolio-header{
  transition:
    transform .38s cubic-bezier(.22,1,.36,1),
    background .28s ease,
    border-color .28s ease,
    box-shadow .28s ease;
}
.site-header.nav-scrolled,
.portfolio-header.nav-scrolled{
  box-shadow:0 16px 34px rgba(0,0,0,.18);
}
.main-nav a,
.portfolio-back,
.brand,
.portfolio-brand{
  transition:transform .28s cubic-bezier(.22,1,.36,1), color .22s ease, opacity .22s ease;
}
.main-nav a:hover,
.portfolio-back:hover,
.brand:hover,
.portfolio-brand:hover{
  transform:translateY(-2px);
}
.main-nav a::after{
  box-shadow:0 0 16px rgba(255,120,28,.3);
}

/* footer refinado */
.footer-shell,
.portfolio-gallery-footer{
  position:relative;
  overflow:hidden;
}
.footer-shell::after,
.portfolio-gallery-footer::after{
  content:"";
  position:absolute;
  inset:-20% auto auto -10%;
  width:240px;
  height:240px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,118,28,.08), transparent 68%);
  filter:blur(12px);
  pointer-events:none;
}
.footer-panel,
.portfolio-gallery-footer{
  transition:
    transform .34s cubic-bezier(.22,1,.36,1),
    border-color .28s ease,
    box-shadow .28s ease,
    background .28s ease;
}
.footer-panel:hover,
.portfolio-gallery-footer:hover{
  transform:translateY(-4px);
  border-color:rgba(255,125,35,.18);
  box-shadow:0 22px 50px rgba(0,0,0,.22),0 0 0 1px rgba(255,120,28,.05);
}

/* botones naranja más vivos */
.btn-primary,
.portfolio-back,
.portfolio-link,
.contact-panel a{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.btn-primary::before,
.portfolio-back::before,
.portfolio-link::before,
.contact-panel a::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at var(--glow-x,50%) var(--glow-y,50%), rgba(255,255,255,.22), transparent 42%);
  opacity:0;
  transition:opacity .24s ease;
  pointer-events:none;
  z-index:-1;
}
.btn-primary:hover::before,
.portfolio-back:hover::before,
.portfolio-link:hover::before,
.contact-panel a:hover::before{
  opacity:.72;
}
.btn-primary:hover,
.portfolio-back:hover,
.portfolio-link:hover,
.contact-panel a:hover{
  animation:v0459Popup .34s cubic-bezier(.22,1,.36,1);
}
@keyframes v0459Popup{
  0%{transform:translateY(0) scale(1)}
  55%{transform:translateY(-3px) scale(1.035)}
  100%{transform:translateY(-2px) scale(1.01)}
}

/* visualizador corregido de forma más agresiva */
dialog.session-lightbox{
  padding:clamp(8px, 1.2vw, 18px) !important;
  background:rgba(2,2,2,.78);
}
dialog.session-lightbox::backdrop{
  background:rgba(0,0,0,.84);
  backdrop-filter:blur(7px) saturate(1.02);
}
dialog.session-lightbox .session-viewer{
  width:min(96vw, 1360px);
  height:min(calc(var(--viewer-vh) * 92), 940px);
  margin:auto;
  border-radius:30px;
  overflow:hidden;
  border:1px solid var(--ui-premium-line);
  background:
    linear-gradient(180deg, rgba(20,20,20,.96), rgba(6,6,6,.98)),
    radial-gradient(circle at top, rgba(255,122,26,.05), transparent 40%);
  box-shadow:0 36px 100px rgba(0,0,0,.52);
  opacity:0;
  transform:translateY(18px) scale(.985);
  transition:opacity .28s ease, transform .42s cubic-bezier(.22,1,.36,1);
}
dialog.session-lightbox.is-ready .session-viewer{
  opacity:1;
  transform:none;
}
dialog.session-lightbox .session-viewer-header{
  position:relative;
  z-index:2;
}
dialog.session-lightbox .session-stage{
  position:relative !important;
  display:grid !important;
  place-items:center !important;
  min-width:0 !important;
  min-height:0 !important;
  padding:20px !important;
  overflow:hidden !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.015), rgba(255,255,255,0)),
    radial-gradient(circle at 50% 20%, rgba(255,122,26,.05), transparent 42%),
    #040404 !important;
}
dialog.session-lightbox .session-image-shell{
  position:relative;
  width:100%;
  height:100%;
  min-height:min(64vh, 720px);
  max-height:min(64vh, 720px);
  display:grid !important;
  place-items:center !important;
  padding:clamp(12px, 1.5vw, 22px);
  border-radius:28px;
  border:1px solid var(--ui-premium-line-soft);
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.01)),
    radial-gradient(circle at center, rgba(255,255,255,.02), transparent 68%);
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 24px 70px rgba(0,0,0,.26);
}
dialog.session-lightbox .session-image-shell::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent 24%, transparent 76%, rgba(255,255,255,.012));
}
dialog.session-lightbox .session-image-shell.is-loading::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg, transparent 0%, rgba(255,255,255,.015) 28%, rgba(255,255,255,.08) 48%, rgba(255,255,255,.015) 68%, transparent 100%);
  transform:translateX(-120%);
  animation:v0459Shimmer 1.1s linear infinite;
}
@keyframes v0459Shimmer{to{transform:translateX(120%)}}

dialog.session-lightbox .session-image-shell > #sessionImage,
dialog.session-lightbox .session-image-shell > #portfolioSessionImage,
html body dialog.session-lightbox img#sessionImage,
html body dialog.session-lightbox img#portfolioSessionImage{
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:0 auto !important;
  padding:0 !important;
  border-radius:18px;
  background:transparent !important;
  box-shadow:0 18px 40px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.04);
}

dialog.session-lightbox .session-nav{
  position:absolute !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:58px !important;
  height:58px !important;
  border-radius:18px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:rgba(10,10,10,.58) !important;
  box-shadow:0 18px 34px rgba(0,0,0,.28);
  backdrop-filter:blur(10px);
}
dialog.session-lightbox .session-nav.prev{left:18px !important}
dialog.session-lightbox .session-nav.next{right:18px !important}
dialog.session-lightbox .session-nav:hover{
  background:linear-gradient(135deg, #ff5c16, #ff9c45) !important;
  box-shadow:0 18px 34px rgba(255,94,20,.25);
}
dialog.session-lightbox .session-nav:hover span{color:#161616}

dialog.session-lightbox .session-thumb{
  transition:transform .24s ease, box-shadow .24s ease, opacity .24s ease, border-color .24s ease !important;
}
dialog.session-lightbox .session-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover !important;
  transition:transform .24s ease;
}
dialog.session-lightbox .session-thumb:hover img,
dialog.session-lightbox .session-thumb.is-active img{
  transform:scale(1.04);
}

dialog.session-lightbox .session-filmstrip{
  position:relative;
  overflow:hidden;
}
dialog.session-lightbox .session-filmstrip::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.012), transparent 38%), radial-gradient(circle at center, rgba(255,255,255,.02), transparent 66%);
  pointer-events:none;
}

@media (max-width:980px){
  dialog.session-lightbox .session-viewer{
    width:min(98vw, 1360px);
    height:min(calc(var(--viewer-vh) * 94), 920px);
  }
  dialog.session-lightbox .session-image-shell{
    min-height:min(60vh, 680px);
    max-height:min(60vh, 680px);
  }
}
@media (max-width:760px){
  dialog.session-lightbox{
    padding:0 !important;
  }
  dialog.session-lightbox .session-viewer{
    width:100vw;
    height:100dvh;
    border-radius:0;
    border:0;
  }
  dialog.session-lightbox .session-stage{
    padding:14px 14px 72px !important;
  }
  dialog.session-lightbox .session-image-shell{
    min-height:calc(100dvh - 308px);
    max-height:calc(100dvh - 308px);
    padding:10px;
    border-radius:18px;
  }
  dialog.session-lightbox .session-nav{
    top:auto !important;
    bottom:14px !important;
    transform:none !important;
    width:46px !important;
    height:46px !important;
    border-radius:14px !important;
  }
  dialog.session-lightbox .session-nav.prev{left:14px !important}
  dialog.session-lightbox .session-nav.next{right:14px !important}
}
@media (max-width:430px){
  dialog.session-lightbox .session-image-shell{
    min-height:calc(100dvh - 296px);
    max-height:calc(100dvh - 296px);
  }
}

@media (prefers-reduced-motion:reduce){
  dialog.session-lightbox .session-viewer,
  .footer-panel,
  .portfolio-gallery-footer,
  .site-header,
  .portfolio-header,
  .main-nav a,
  .portfolio-back,
  .btn-primary,
  .contact-panel a{
    transition:none !important;
    animation:none !important;
  }
}


/* v0.4.59 — stagger final */
.v459-card{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .62s ease, transform .72s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--v459-delay, 0ms);
}
.v459-card.v459-card-in{
  opacity:1;
  transform:none;
}


/* =========================================================
   v0.4.60 — VISUALIZADOR COMPLETO SIN RECORTES
   + animaciones refinadas + optimización
   ========================================================= */

:root{
  --viewer-safe-h: 100dvh;
}

/* Evita trabajo gráfico innecesario mientras está abierto el visor */
body.viewer-open .ambient-motion,
body.viewer-open .cursor-aura{
  opacity:0 !important;
  pointer-events:none !important;
}
body.viewer-open .ambient-orb{
  animation-play-state:paused !important;
}

/* ---------------------------------------------------------
   VISOR: el contenedor completo SIEMPRE cabe en la pantalla
   --------------------------------------------------------- */
html body dialog.session-lightbox{
  box-sizing:border-box !important;
  width:min(96vw, 1440px) !important;
  height:min(calc(var(--viewer-safe-h) - 16px), 980px) !important;
  max-width:none !important;
  max-height:calc(var(--viewer-safe-h) - 16px) !important;

  margin:auto !important;
  padding:0 !important;
  overflow:hidden !important;

  border:1px solid rgba(255,255,255,.09) !important;
  border-radius:28px !important;

  background:
    radial-gradient(circle at 82% 0%,rgba(255,110,26,.08),transparent 26%),
    linear-gradient(160deg,#101010 0%,#060606 64%,#030303 100%) !important;

  box-shadow:
    0 38px 110px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.025) !important;
}

html body dialog.session-lightbox::backdrop{
  background:rgba(0,0,0,.88) !important;
  backdrop-filter:blur(8px) saturate(1.04);
}

/* La cuadrícula se limita al 100% del dialog.
   Header + escenario flexible + filmstrip, sin desbordar. */
html body dialog.session-lightbox .session-viewer{
  box-sizing:border-box !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;

  display:grid !important;
  grid-template-rows:
    minmax(78px,auto)
    minmax(0,1fr)
    minmax(96px,auto) !important;

  margin:0 !important;
  overflow:hidden !important;

  border:0 !important;
  border-radius:inherit !important;

  opacity:1 !important;
  transform:none !important;
}

/* Header compacto para dejar más espacio a la foto */
html body dialog.session-lightbox .session-viewer-header{
  box-sizing:border-box !important;
  min-height:0 !important;
  height:auto !important;
  max-height:112px !important;

  padding:18px 82px 15px 20px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;

  overflow:hidden !important;
  flex-shrink:0 !important;
}

html body dialog.session-lightbox .session-head-copy{
  min-width:0;
}
html body dialog.session-lightbox .session-head-copy h3{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body dialog.session-lightbox .session-subline{
  min-width:0;
}
html body dialog.session-lightbox .session-hint{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Escenario: ocupa solamente el espacio restante */
html body dialog.session-lightbox .session-stage{
  box-sizing:border-box !important;

  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  max-height:none !important;

  position:relative !important;
  display:grid !important;
  place-items:center !important;

  padding:14px 78px !important;

  overflow:hidden !important;
  isolation:isolate !important;

  background:
    radial-gradient(circle at 50% 42%,rgba(255,255,255,.025),transparent 38%),
    linear-gradient(180deg,#050505,#020202) !important;
}

/* Fondo de la propia fotografía, solo ambiental */
html body dialog.session-lightbox .session-stage-backdrop{
  position:absolute !important;
  inset:-30px !important;

  background-image:
    linear-gradient(180deg,rgba(0,0,0,.52),rgba(0,0,0,.66)),
    var(--session-bg-image) !important;

  background-size:cover !important;
  background-position:center !important;

  filter:blur(38px) saturate(1.06) !important;
  transform:scale(1.08) !important;
  opacity:.38 !important;

  pointer-events:none !important;
}

/* Este panel YA NO impone altura mínima.
   Ese era el principal causante de que el visor se cortara. */
html body dialog.session-lightbox .session-image-shell{
  box-sizing:border-box !important;

  position:relative !important;
  z-index:2 !important;

  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;

  display:grid !important;
  place-items:center !important;

  padding:12px !important;
  overflow:hidden !important;

  border-radius:22px !important;
  border:1px solid rgba(255,255,255,.055) !important;

  background:
    linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,.007)) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 18px 48px rgba(0,0,0,.22) !important;
}

/* Regla final y definitiva:
   la foto completa siempre entra dentro de su panel. */
html body dialog.session-lightbox .session-image-shell > img#sessionImage,
html body dialog.session-lightbox .session-image-shell > img#portfolioSessionImage{
  position:static !important;
  inset:auto !important;

  display:block !important;

  width:100% !important;
  height:100% !important;

  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;

  margin:0 !important;
  padding:0 !important;

  object-fit:contain !important;
  object-position:center center !important;

  border-radius:14px !important;
  background:transparent !important;

  box-shadow:none !important;

  opacity:0;
  transform:scale(.988);
  filter:blur(2px);

  transition:
    opacity .24s ease,
    transform .36s cubic-bezier(.22,1,.36,1),
    filter .30s ease !important;
}

html body dialog.session-lightbox .session-image-shell > img#sessionImage.is-visible,
html body dialog.session-lightbox .session-image-shell > img#portfolioSessionImage.is-visible{
  opacity:1 !important;
  transform:scale(1) !important;
  filter:none !important;
}

/* shimmer mucho más liviano */
html body dialog.session-lightbox .session-image-shell.is-loading::after{
  content:"";
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      110deg,
      transparent 12%,
      rgba(255,255,255,.018) 34%,
      rgba(255,255,255,.07) 49%,
      rgba(255,255,255,.018) 64%,
      transparent 88%
    );

  transform:translateX(-120%);
  animation:v0460ViewerShimmer 1.15s linear infinite;
  pointer-events:none;
}

@keyframes v0460ViewerShimmer{
  to{transform:translateX(120%)}
}

/* Flechas integradas al borde, no roban espacio a la imagen */
html body dialog.session-lightbox .session-nav{
  position:absolute !important;
  z-index:5 !important;

  top:50% !important;
  transform:translateY(-50%) !important;

  width:52px !important;
  height:64px !important;

  display:grid !important;
  place-items:center !important;

  border-radius:17px !important;
  border:1px solid rgba(255,255,255,.10) !important;

  background:rgba(8,8,8,.58) !important;
  color:#fff !important;

  backdrop-filter:blur(8px);
  box-shadow:0 14px 30px rgba(0,0,0,.28);

  transition:
    transform .24s cubic-bezier(.22,1,.36,1),
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease !important;
}

html body dialog.session-lightbox .session-nav.prev{
  left:13px !important;
}
html body dialog.session-lightbox .session-nav.next{
  right:13px !important;
}

html body dialog.session-lightbox .session-nav:hover{
  transform:translateY(-50%) scale(1.06) !important;
  background:linear-gradient(135deg,#ff5a16,#ff9c45) !important;
  border-color:rgba(255,145,61,.55) !important;
  color:#111 !important;
  box-shadow:0 18px 34px rgba(255,94,20,.20) !important;
}

/* Filmstrip compacto y contenido dentro del visor */
html body dialog.session-lightbox .session-filmstrip{
  box-sizing:border-box !important;

  min-height:0 !important;
  max-height:122px !important;

  padding:9px 15px 12px !important;

  overflow:hidden !important;

  border-top:1px solid rgba(255,255,255,.055) !important;

  background:
    linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,.018)) !important;
}

html body dialog.session-lightbox .session-filmstrip-head{
  margin-bottom:7px !important;
}

html body dialog.session-lightbox .session-thumbs{
  box-sizing:border-box !important;

  height:76px !important;
  min-height:0 !important;
  max-height:76px !important;

  padding:2px 1px 4px !important;
  gap:9px !important;

  overflow-x:auto !important;
  overflow-y:hidden !important;

  justify-content:flex-start !important;

  background:transparent !important;
  border:0 !important;

  scrollbar-width:thin;
}

html body dialog.session-lightbox .session-thumb{
  box-sizing:border-box !important;

  width:58px !important;
  height:68px !important;

  flex:0 0 auto !important;

  border-radius:12px !important;
  opacity:.66 !important;

  animation:none !important;
}

html body dialog.session-lightbox .session-thumb.is-active{
  opacity:1 !important;
  transform:translateY(-2px) !important;
}

html body dialog.session-lightbox .session-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}

/* Botón cerrar siempre queda dentro del cuadro */
html body dialog.session-lightbox .lightbox-close{
  position:absolute !important;
  z-index:20 !important;

  top:14px !important;
  right:14px !important;

  width:44px !important;
  height:44px !important;

  border-radius:14px !important;
}

/* ---------- viewport mediano ---------- */
@media (max-width:1000px){
  html body dialog.session-lightbox{
    width:calc(100vw - 12px) !important;
    height:calc(var(--viewer-safe-h) - 12px) !important;
    max-height:calc(var(--viewer-safe-h) - 12px) !important;
    border-radius:22px !important;
  }

  html body dialog.session-lightbox .session-viewer{
    grid-template-rows:
      minmax(74px,auto)
      minmax(0,1fr)
      minmax(90px,auto) !important;
  }

  html body dialog.session-lightbox .session-viewer-header{
    max-height:100px !important;
    padding:14px 64px 12px 15px !important;
  }

  html body dialog.session-lightbox .session-hint{
    display:none !important;
  }

  html body dialog.session-lightbox .session-stage{
    padding:10px 62px !important;
  }
}

/* ---------- móvil: ocupa exactamente el área visible ---------- */
@media (max-width:760px){
  html body dialog.session-lightbox{
    width:100vw !important;
    height:var(--viewer-safe-h) !important;
    max-height:var(--viewer-safe-h) !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
    border-radius:0 !important;
  }

  html body dialog.session-lightbox .session-viewer{
    width:100vw !important;
    height:100% !important;

    grid-template-rows:
      minmax(70px,auto)
      minmax(0,1fr)
      84px !important;

    border-radius:0 !important;
  }

  html body dialog.session-lightbox .session-viewer-header{
    max-height:88px !important;
    padding:12px 58px 10px 12px !important;
  }

  html body dialog.session-lightbox .session-head-side,
  html body dialog.session-lightbox .session-hint{
    display:none !important;
  }

  html body dialog.session-lightbox .session-head-copy h3{
    font-size:1.02rem !important;
  }

  html body dialog.session-lightbox .session-subline{
    margin-top:3px !important;
  }

  html body dialog.session-lightbox .session-stage{
    min-height:0 !important;
    padding:8px 8px 58px !important;
  }

  html body dialog.session-lightbox .session-image-shell{
    min-height:0 !important;
    max-height:none !important;
    height:100% !important;

    padding:6px !important;

    border-radius:14px !important;
  }

  html body dialog.session-lightbox .session-image-shell > img#sessionImage,
  html body dialog.session-lightbox .session-image-shell > img#portfolioSessionImage{
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;

    object-fit:contain !important;
    border-radius:10px !important;
  }

  html body dialog.session-lightbox .session-nav{
    top:auto !important;
    bottom:8px !important;

    width:44px !important;
    height:44px !important;

    transform:none !important;

    border-radius:13px !important;
  }

  html body dialog.session-lightbox .session-nav.prev{
    left:9px !important;
  }

  html body dialog.session-lightbox .session-nav.next{
    right:9px !important;
  }

  html body dialog.session-lightbox .session-nav:hover{
    transform:scale(1.03) !important;
  }

  html body dialog.session-lightbox .session-filmstrip{
    height:84px !important;
    max-height:84px !important;

    padding:7px 9px !important;
  }

  html body dialog.session-lightbox .session-filmstrip-head{
    display:none !important;
  }

  html body dialog.session-lightbox .session-thumbs{
    height:68px !important;
    max-height:68px !important;
  }

  html body dialog.session-lightbox .session-thumb{
    width:52px !important;
    height:60px !important;
  }

  html body dialog.session-lightbox .lightbox-close{
    top:9px !important;
    right:9px !important;

    width:40px !important;
    height:40px !important;
  }

  /* blur costoso reducido en móvil */
  html body dialog.session-lightbox::backdrop{
    backdrop-filter:blur(3px) !important;
  }

  html body dialog.session-lightbox .session-stage-backdrop{
    filter:blur(24px) saturate(1.02) !important;
    opacity:.27 !important;
  }
}

/* Pantallas bajas / móvil horizontal */
@media (max-height:650px){
  html body dialog.session-lightbox .session-viewer{
    grid-template-rows:
      62px
      minmax(0,1fr)
      70px !important;
  }

  html body dialog.session-lightbox .session-viewer-header{
    height:62px !important;
    max-height:62px !important;
    padding:8px 58px 7px 12px !important;
  }

  html body dialog.session-lightbox .session-head-copy p,
  html body dialog.session-lightbox .session-hint,
  html body dialog.session-lightbox .session-head-side{
    display:none !important;
  }

  html body dialog.session-lightbox .session-subline{
    margin-top:2px !important;
  }

  html body dialog.session-lightbox .session-filmstrip{
    height:70px !important;
    max-height:70px !important;
    padding:5px 8px !important;
  }

  html body dialog.session-lightbox .session-filmstrip-head{
    display:none !important;
  }

  html body dialog.session-lightbox .session-thumbs{
    height:58px !important;
    max-height:58px !important;
  }

  html body dialog.session-lightbox .session-thumb{
    width:46px !important;
    height:54px !important;
  }
}

/* ---------------------------------------------------------
   ANIMACIONES: mejor sensación, menos coste
   --------------------------------------------------------- */
.v460-reveal{
  opacity:0;
  transform:translateY(18px);
  transition:
    opacity .58s ease,
    transform .72s cubic-bezier(.22,1,.36,1);
}

.v460-reveal.v460-in{
  opacity:1;
  transform:none;
}

.photo-card,
.footer-panel,
.accreditation-card,
.contact-panel{
  transition:
    transform .28s cubic-bezier(.22,1,.36,1),
    border-color .22s ease,
    box-shadow .25s ease !important;
}

/* No repetir pulsaciones infinitas en miniaturas activas */
.session-thumb.is-active{
  animation:none !important;
}

/* Reduce blur/glow continuos en dispositivos que lo necesitan */
@media (max-width:760px), (prefers-reduced-motion:reduce){
  .ambient-orb{
    animation:none !important;
  }

  .hero-frame,
  .contact-panel,
  .accreditation-card::before{
    animation:none !important;
  }

  .v460-reveal{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }

  html body dialog.session-lightbox .session-image-shell.is-loading::after{
    animation:none !important;
  }
}


html.page-hidden .ambient-orb,
html.page-hidden .hero-frame,
html.page-hidden .contact-panel{
  animation-play-state:paused !important;
}


/* =========================================================
   v0.4.61 — FOOTER COMPACTO
   ========================================================= */

/* Elimina el peso visual del footer anterior */
.site-footer.compact-footer{
  min-height:0 !important;
  padding:0 !important;
  border-top:1px solid rgba(255,255,255,.055) !important;
  background:
    radial-gradient(circle at 84% 0%,rgba(255,104,22,.05),transparent 28%),
    linear-gradient(180deg,#070707,#040404) !important;
}

.site-footer.compact-footer::after{
  display:none !important;
}

.compact-footer-inner{
  width:min(1380px,calc(100% - 40px));
  min-height:116px;
  margin:0 auto;
  padding:24px 0;

  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:28px;
}

.compact-footer-brand{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:max-content;
}

.compact-footer-logo{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;

  border-radius:15px;
  border:1px solid rgba(255,255,255,.065);

  background:
    radial-gradient(circle at center,rgba(255,109,25,.09),transparent 65%),
    rgba(255,255,255,.018);
}

.compact-footer-logo img{
  width:39px !important;
  height:39px !important;
  object-fit:contain;
}

.compact-footer-brand > div{
  display:flex;
  flex-direction:column;
  line-height:1.05;
}

.compact-footer-brand strong{
  color:#fff;
  font-size:.96rem;
  letter-spacing:-.025em;
}

.compact-footer-brand span{
  margin-top:4px;
  color:#67615c;
  font-size:.56rem;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.compact-footer-line{
  margin:0;
  justify-self:center;

  color:#88817b;
  font-size:.76rem;
  font-weight:700;
  text-align:center;
}

.compact-footer-meta{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:9px;

  color:#605b56;
  font-size:.68rem;
  font-weight:750;
  white-space:nowrap;
}

.compact-footer-dot{
  width:4px;
  height:4px;
  border-radius:50%;
  background:#ff7e29;
  box-shadow:0 0 9px rgba(255,114,27,.42);
}

/* Footer del portafolio: compacto y coherente */
.portfolio-gallery-footer.compact-portfolio-footer{
  position:relative;

  width:min(1380px,calc(100% - 28px)) !important;
  min-height:82px !important;
  margin:36px auto 16px !important;
  padding:14px 18px !important;

  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:20px;

  border:1px solid rgba(255,255,255,.06) !important;
  border-radius:19px !important;

  background:
    radial-gradient(circle at 12% 50%,rgba(255,108,23,.045),transparent 28%),
    linear-gradient(145deg,#0b0b0b,#060606) !important;

  box-shadow:0 14px 34px rgba(0,0,0,.16) !important;
}

.portfolio-gallery-footer.compact-portfolio-footer::before,
.portfolio-gallery-footer.compact-portfolio-footer::after{
  display:none !important;
}

.portfolio-gallery-footer.compact-portfolio-footer > p{
  margin:0;
  color:#66605b;
  font-size:.69rem;
  font-weight:750;
}

/* Ya no necesitamos hover elevado en un footer tan pequeño */
.site-footer.compact-footer,
.portfolio-gallery-footer.compact-portfolio-footer{
  transform:none !important;
}

/* Responsive */
@media (max-width:760px){
  .compact-footer-inner{
    width:min(100% - 28px,1380px);
    min-height:0;
    padding:22px 0;

    grid-template-columns:1fr;
    gap:14px;
    justify-items:center;
    text-align:center;
  }

  .compact-footer-line{
    justify-self:center;
  }

  .compact-footer-meta{
    justify-content:center;
    flex-wrap:wrap;
  }

  .portfolio-gallery-footer.compact-portfolio-footer{
    min-height:72px !important;
    margin:28px 10px 10px !important;
    width:calc(100% - 20px) !important;
    padding:12px 14px !important;
  }

  .portfolio-gallery-footer.compact-portfolio-footer .compact-footer-brand span{
    display:none;
  }
}

@media (max-width:460px){
  .compact-footer-line{
    font-size:.7rem;
  }

  .compact-footer-meta{
    font-size:.64rem;
  }

  .portfolio-gallery-footer.compact-portfolio-footer{
    align-items:flex-start;
    flex-direction:column;
    gap:8px;
  }
}


/* =========================================================
   v0.4.62 — Historia “Detrás de la cámara”
   ========================================================= */
.about-story{
  display:grid;
  gap:18px;
  margin-top:24px;
}

.about-story p{
  margin:0;
  max-width:66ch;
  color:#a7a09a;
  line-height:1.82;
}

.about-story .about-story-lead{
  color:#d2ccc5;
  font-size:clamp(1.08rem,1.45vw,1.28rem);
  line-height:1.72;
}

.about-story strong{
  color:#fff;
}

.about-story-quote{
  position:relative;
  margin:10px 0 2px;
  padding:22px 24px 22px 26px;

  display:grid;
  gap:8px;

  border:1px solid rgba(255,255,255,.065);
  border-radius:20px;

  background:
    radial-gradient(circle at 100% 0%,rgba(255,110,25,.08),transparent 32%),
    linear-gradient(145deg,rgba(255,255,255,.026),rgba(255,255,255,.012));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.02),
    0 18px 38px rgba(0,0,0,.14);

  overflow:hidden;
}

.about-story-quote::before{
  content:"";
  position:absolute;
  left:0;
  top:18px;
  bottom:18px;
  width:3px;

  border-radius:999px;

  background:linear-gradient(
    180deg,
    #ff5815,
    #ff9d43
  );

  box-shadow:0 0 15px rgba(255,103,21,.35);
}

.about-story-quote span{
  color:#89827c;
  font-size:.72rem;
  font-weight:820;
  letter-spacing:.03em;
}

.about-story-quote strong{
  max-width:42ch;

  color:#fff;
  font-size:clamp(1rem,1.3vw,1.16rem);
  line-height:1.55;
  letter-spacing:-.015em;
}

.about-link{
  position:relative;
  color:#ff9341;
  font-weight:850;
  text-decoration:none;
}

.about-link::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:-2px;
  height:1px;

  background:linear-gradient(90deg,#ff5a16,#ff9d45);

  transition:right .24s ease;
}

.about-link:hover::after{
  right:0;
}

@media (max-width:760px){
  .about-story{
    gap:16px;
  }

  .about-story p{
    line-height:1.75;
  }

  .about-story-quote{
    padding:19px 18px 19px 22px;
    border-radius:17px;
  }
}


/* =========================================================
   v0.4.63 — MOTION SYSTEM UNIFICADO + POLISH 1000%
   ========================================================= */

:root{
  --scroll-shift:0px;
  --motion-orange:#ff6418;
  --motion-orange-soft:#ff9c45;
  --motion-ease-463:cubic-bezier(.22,1,.36,1);
}

/* Page entrance */
body.site-v0453{
  opacity:.985;
  transition:opacity .36s ease;
}
body.site-v0453.motion-ready{
  opacity:1;
}

/* Ambient background moves with one global CSS variable */
.ambient-motion{
  transform:translate3d(0,calc(var(--scroll-shift) * -.22),0);
  transition:transform .08s linear;
}
.ambient-orb{
  will-change:transform;
}

/* Unified reveal */
.motion-reveal-463{
  opacity:0;
  transform:translateY(22px) scale(.993);
  filter:blur(3px);

  transition:
    opacity .66s ease,
    transform .82s var(--motion-ease-463),
    filter .52s ease;

  transition-delay:var(--motion-delay-463,0ms);
}

.motion-reveal-463.motion-in-463{
  opacity:1;
  transform:none;
  filter:none;
}

/* Titles: controlled underline animation */
.motion-title-463::after{
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .76s var(--motion-ease-463) !important;
}
.motion-in-463 .motion-title-463::after,
.motion-title-463.motion-in-463::after{
  transform:scaleX(1);
}

/* Hero visual parallax with CSS vars */
.hero-visual{
  transform:
    translate3d(
      var(--hero-x-463,0px),
      var(--hero-y-463,0px),
      0
    );
  transition:transform .42s var(--motion-ease-463);
}

/* Premium cards: pointer spotlight + very subtle tilt */
.photo-card,
.accreditation-card,
.about-logo-wrap{
  --pointer-x:50%;
  --pointer-y:50%;
  transform-style:preserve-3d;
}

.photo-card::before,
.accreditation-card::after,
.about-logo-wrap::before{
  background:
    radial-gradient(
      circle at var(--pointer-x) var(--pointer-y),
      rgba(255,146,55,.12),
      rgba(255,96,20,.045) 24%,
      transparent 52%
    ) !important;
}

.motion-tilt-463.photo-card,
.motion-tilt-463.accreditation-card,
.motion-tilt-463.about-logo-wrap{
  transform:
    perspective(1000px)
    rotateX(var(--tilt-x-463,0deg))
    rotateY(var(--tilt-y-463,0deg))
    translateY(-5px) !important;
}

/* Orange buttons: magnetic pop + cursor glow */
.motion-magnetic-463{
  transform:
    translate3d(
      var(--magnetic-x-463,0px),
      var(--magnetic-y-463,0px),
      0
    );
  transition:
    transform .28s var(--motion-ease-463),
    box-shadow .24s ease,
    filter .24s ease !important;
}

.motion-magnetic-463:hover{
  transform:
    translate3d(
      var(--magnetic-x-463,0px),
      calc(var(--magnetic-y-463,0px) - 3px),
      0
    )
    scale(1.025);
}

/* About story becomes more editorial */
.about-story{
  position:relative;
}
.about-story::before{
  content:"";
  position:absolute;
  left:-22px;
  top:4px;
  bottom:4px;
  width:1px;

  background:linear-gradient(
    180deg,
    transparent,
    rgba(255,105,23,.38) 18%,
    rgba(255,153,66,.16) 72%,
    transparent
  );
}
.about-story > p{
  position:relative;
}
.about-story > p::before{
  content:"";
  position:absolute;
  left:-26px;
  top:.8em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#171717;
  border:1px solid rgba(255,119,27,.40);
  box-shadow:0 0 10px rgba(255,102,20,.12);
}
.about-story > p:hover::before{
  background:#ff7c26;
  box-shadow:0 0 15px rgba(255,107,22,.42);
}

/* Accreditation pulse is now subtle, not infinite-heavy */
.accreditation-dot{
  box-shadow:0 0 0 0 rgba(255,111,25,.22);
  animation:accreditationDot463 3.8s ease-in-out infinite;
}
@keyframes accreditationDot463{
  0%,100%{box-shadow:0 0 0 0 rgba(255,111,25,.0)}
  50%{box-shadow:0 0 0 7px rgba(255,111,25,.05)}
}

/* Compact footer still feels alive without growing */
.compact-footer-logo{
  transition:
    transform .34s var(--motion-ease-463),
    border-color .24s ease,
    box-shadow .24s ease;
}
.compact-footer-brand:hover .compact-footer-logo{
  transform:translateY(-2px) rotate(-2deg);
  border-color:rgba(255,123,31,.18);
  box-shadow:0 12px 26px rgba(255,93,19,.07);
}

/* Viewer entrance is cinematic but quick */
dialog.session-lightbox .session-viewer{
  opacity:0;
  transform:translateY(14px) scale(.988);
  transition:
    opacity .25s ease,
    transform .38s var(--motion-ease-463);
}

dialog.session-lightbox .session-viewer.motion-viewer-in-463{
  opacity:1;
  transform:none;
}

dialog.session-lightbox .session-stage::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;

  background:
    linear-gradient(
      110deg,
      transparent 18%,
      rgba(255,255,255,.025) 40%,
      rgba(255,255,255,.065) 50%,
      rgba(255,255,255,.025) 60%,
      transparent 82%
    );

  transform:translateX(-130%);
}

dialog.session-lightbox .session-stage.motion-image-loaded-463::after{
  animation:imageSweep463 .56s ease-out;
}

@keyframes imageSweep463{
  0%{
    opacity:0;
    transform:translateX(-130%);
  }
  28%{opacity:.6}
  100%{
    opacity:0;
    transform:translateX(130%);
  }
}

/* Thumb active state: no continuous pulse, only clean highlight */
dialog.session-lightbox .session-thumb.is-active{
  animation:none !important;
  box-shadow:
    0 0 0 1px rgba(255,137,49,.74),
    0 12px 26px rgba(255,94,20,.12) !important;
}

/* Mobile motion kept lightweight */
@media (max-width:760px){
  .ambient-motion{
    transform:none !important;
  }

  .motion-reveal-463{
    transform:translateY(12px);
    filter:none;
    transition-duration:.45s,.55s;
  }

  .about-story::before,
  .about-story > p::before{
    display:none;
  }

  .accreditation-dot{
    animation:none !important;
  }
}

/* Respect system preference */
@media (prefers-reduced-motion:reduce){
  .motion-reveal-463,
  .hero-visual,
  .motion-magnetic-463,
  .motion-tilt-463,
  dialog.session-lightbox .session-viewer,
  .compact-footer-logo{
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
    filter:none !important;
  }

  .ambient-orb,
  .accreditation-dot,
  dialog.session-lightbox .session-stage::after{
    animation:none !important;
  }
}

/* Pause decorative motion while tab is hidden */
html.motion-paused-463 .ambient-orb,
html.motion-paused-463 .accreditation-dot{
  animation-play-state:paused !important;
}


/* =========================================================
   v0.4.64 — VIDEOS
   ========================================================= */
.videos{
  position:relative;
  padding-block:118px;
}

.videos::before{
  content:"";
  position:absolute;
  width:360px;
  height:360px;
  right:2%;
  top:12%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,103,20,.055),transparent 68%);
  filter:blur(10px);
  pointer-events:none;
}

.video-section-heading{
  margin-bottom:42px;
}

.video-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px;
}

.video-card{
  --pointer-x:50%;
  --pointer-y:50%;

  position:relative;
  min-width:0;

  display:grid;
  grid-template-columns:minmax(180px,240px) minmax(0,1fr);
  gap:24px;
  align-items:center;

  padding:18px;

  border:1px solid rgba(255,255,255,.07);
  border-radius:26px;

  background:
    radial-gradient(circle at var(--pointer-x) var(--pointer-y),rgba(255,111,25,.09),transparent 34%),
    linear-gradient(145deg,#101010,#080808);

  box-shadow:
    0 20px 46px rgba(0,0,0,.21),
    inset 0 1px 0 rgba(255,255,255,.022);

  overflow:hidden;
  cursor:pointer;

  transform-style:preserve-3d;

  transition:
    transform .34s cubic-bezier(.22,1,.36,1),
    border-color .26s ease,
    box-shadow .28s ease;
}

.video-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(115deg,transparent 20%,rgba(255,255,255,.02) 48%,transparent 68%);
  transform:translateX(-110%);
  transition:transform .72s cubic-bezier(.22,1,.36,1);
}

.video-card:hover{
  transform:translateY(-6px);
  border-color:rgba(255,120,30,.20);
  box-shadow:
    0 30px 62px rgba(0,0,0,.29),
    0 10px 30px rgba(255,92,19,.06);
}

.video-card:hover::after{
  transform:translateX(110%);
}

.video-card-media{
  position:relative;
  aspect-ratio:9/16;

  border-radius:20px;
  overflow:hidden;

  background:#050505;
  box-shadow:
    0 18px 38px rgba(0,0,0,.30),
    0 0 0 1px rgba(255,255,255,.04);
}

.video-card-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;

  background:
    linear-gradient(180deg,rgba(0,0,0,.05),transparent 42%,rgba(0,0,0,.52));
}

.video-card-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;

  transition:
    transform .68s cubic-bezier(.22,1,.36,1),
    filter .34s ease;
}

.video-card:hover .video-card-media img{
  transform:scale(1.035);
  filter:saturate(1.05) contrast(1.02);
}

.video-play{
  position:absolute;
  z-index:3;
  left:50%;
  top:50%;

  width:62px;
  height:62px;

  display:grid;
  place-items:center;

  transform:translate(-50%,-50%);

  border:1px solid rgba(255,255,255,.20);
  border-radius:50%;

  background:rgba(7,7,7,.58);
  color:#fff;

  backdrop-filter:blur(12px);
  box-shadow:0 16px 34px rgba(0,0,0,.30);

  transition:
    transform .30s cubic-bezier(.22,1,.36,1),
    background .24s ease,
    border-color .24s ease;
}

.video-play svg{
  width:25px;
  height:25px;
  fill:currentColor;
  transform:translateX(2px);
}

.video-card:hover .video-play{
  transform:translate(-50%,-50%) scale(1.09);
  background:linear-gradient(135deg,#ff5b16,#ff9d45);
  border-color:rgba(255,160,77,.72);
  color:#090909;
}

.video-card-duration,
.video-card-format{
  position:absolute;
  z-index:4;
  top:12px;

  min-height:29px;
  padding:0 9px;

  display:inline-flex;
  align-items:center;

  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;

  background:rgba(4,4,4,.56);
  color:#fff;

  backdrop-filter:blur(8px);

  font-size:.61rem;
  font-weight:900;
  letter-spacing:.06em;
}

.video-card-duration{
  right:12px;
}

.video-card-format{
  left:12px;
  color:#ff963f;
}

.video-card-copy{
  min-width:0;
}

.video-card-copy p{
  margin:0 0 8px;

  color:#ff913b;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.14em;
}

.video-card-copy h3{
  margin:0;

  color:#fff;
  font-size:clamp(1.65rem,3vw,3rem);
  line-height:.95;
  letter-spacing:-.055em;
}

.video-card-copy span{
  display:block;
  margin-top:12px;

  color:#8b847e;
  font-size:.76rem;
  font-weight:730;
  line-height:1.55;
}

/* ---------------------------------------------------------
   Video viewer
   --------------------------------------------------------- */
.video-lightbox{
  box-sizing:border-box;

  width:min(1040px,calc(100% - 28px));
  max-width:1040px;
  height:min(92dvh,940px);
  max-height:92dvh;

  margin:auto;
  padding:0;

  overflow:hidden;

  border:1px solid rgba(255,255,255,.09);
  border-radius:28px;

  background:
    radial-gradient(circle at 84% 0%,rgba(255,104,21,.08),transparent 26%),
    linear-gradient(160deg,#101010,#050505 68%,#020202);

  color:#fff;

  box-shadow:
    0 38px 110px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.025);
}

.video-lightbox::backdrop{
  background:rgba(0,0,0,.90);
  backdrop-filter:blur(8px);
}

.video-lightbox-close{
  position:absolute;
  z-index:20;
  top:14px;
  right:14px;

  width:44px;
  height:44px;

  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;

  background:rgba(8,8,8,.62);
  color:#fff;

  font-size:1.45rem;
  cursor:pointer;

  backdrop-filter:blur(10px);

  transition:
    transform .24s ease,
    border-color .24s ease,
    background .24s ease;
}

.video-lightbox-close:hover{
  transform:rotate(90deg);
  border-color:rgba(255,116,26,.30);
  background:rgba(255,105,22,.10);
}

.video-viewer{
  height:100%;

  display:grid;
  grid-template-rows:auto minmax(0,1fr);

  overflow:hidden;
}

.video-viewer-header{
  min-height:92px;
  padding:18px 74px 15px 20px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  border-bottom:1px solid rgba(255,255,255,.06);

  background:
    linear-gradient(180deg,rgba(255,255,255,.018),transparent);
}

.video-viewer-header p{
  margin:0 0 4px;

  color:#ff8d36;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.14em;
}

.video-viewer-header h3{
  margin:0;

  font-size:clamp(1.18rem,2vw,1.55rem);
  letter-spacing:-.025em;
}

.video-viewer-header span{
  display:block;
  margin-top:4px;

  color:#827c76;
  font-size:.74rem;
}

.video-viewer-chip{
  min-height:32px;
  padding:0 11px;

  display:inline-flex !important;
  align-items:center;

  border:1px solid rgba(255,114,26,.16);
  border-radius:999px;

  background:rgba(255,107,22,.055);

  color:#ff9340 !important;

  font-size:.59rem !important;
  font-weight:900 !important;
  letter-spacing:.11em;
}

.video-viewer-stage{
  position:relative;
  min-height:0;

  display:grid;
  place-items:center;

  padding:18px;

  overflow:hidden;

  background:#020202;
  isolation:isolate;
}

.video-viewer-glow{
  position:absolute;
  inset:-42px;

  background-size:cover;
  background-position:center;

  filter:blur(42px) saturate(1.05);
  transform:scale(1.08);
  opacity:.30;

  pointer-events:none;
}

.video-viewer-stage video{
  position:relative;
  z-index:2;

  display:block;

  width:auto;
  height:100%;

  max-width:100%;
  max-height:100%;

  aspect-ratio:9/16;
  object-fit:contain;

  border-radius:20px;

  background:#000;

  box-shadow:
    0 26px 64px rgba(0,0,0,.42),
    0 0 0 1px rgba(255,255,255,.045);
}

/* player native UI should remain readable */
.video-viewer-stage video:focus{
  outline:1px solid rgba(255,133,45,.46);
  outline-offset:4px;
}

body.video-viewer-open{
  overflow:hidden;
}

/* Motion integration */
.motion-tilt-463.video-card{
  transform:
    perspective(1000px)
    rotateX(var(--tilt-x-463,0deg))
    rotateY(var(--tilt-y-463,0deg))
    translateY(-5px) !important;
}

@media (max-width:900px){
  .video-grid{
    grid-template-columns:1fr;
  }

  .video-card{
    grid-template-columns:minmax(150px,200px) 1fr;
  }
}

@media (max-width:620px){
  .videos{
    padding-block:86px;
  }

  .video-grid{
    gap:16px;
  }

  .video-card{
    grid-template-columns:120px minmax(0,1fr);
    gap:15px;

    padding:12px;

    border-radius:21px;
  }

  .video-card-media{
    border-radius:16px;
  }

  .video-play{
    width:48px;
    height:48px;
  }

  .video-play svg{
    width:20px;
    height:20px;
  }

  .video-card-copy h3{
    font-size:1.6rem;
  }

  .video-card-copy span{
    font-size:.68rem;
  }

  .video-card-duration,
  .video-card-format{
    top:8px;
    min-height:25px;
    padding:0 7px;
    font-size:.54rem;
  }

  .video-card-duration{right:8px}
  .video-card-format{left:8px}

  .video-lightbox{
    width:100vw;
    height:100dvh;
    max-height:100dvh;

    border:0;
    border-radius:0;
  }

  .video-viewer-header{
    min-height:80px;
    padding:12px 58px 10px 12px;
  }

  .video-viewer-chip{
    display:none !important;
  }

  .video-viewer-stage{
    padding:10px;
  }

  .video-viewer-stage video{
    width:100%;
    height:100%;

    max-width:100%;
    max-height:100%;

    border-radius:14px;
  }

  .video-lightbox-close{
    top:9px;
    right:9px;

    width:40px;
    height:40px;
  }
}

@media (prefers-reduced-motion:reduce){
  .video-card,
  .video-card-media img,
  .video-play,
  .video-lightbox-close{
    transition:none !important;
    transform:none !important;
  }
}


/* =========================================================
   v0.4.65 — VIDEO COMPLETO, SIN RECORTE
   ========================================================= */

:root{
  --video-safe-h:100dvh;
}

/* El cuadro completo siempre debe entrar en la pantalla real */
html body dialog.video-lightbox{
  box-sizing:border-box !important;

  width:min(1000px,calc(100vw - 20px)) !important;
  height:min(calc(var(--video-safe-h) - 14px),940px) !important;
  max-width:none !important;
  max-height:calc(var(--video-safe-h) - 14px) !important;

  margin:auto !important;
  padding:0 !important;

  overflow:hidden !important;
}

/* Header + área del video, sin alturas mínimas conflictivas */
html body dialog.video-lightbox .video-viewer{
  box-sizing:border-box !important;

  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-height:100% !important;

  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) !important;

  overflow:hidden !important;
}

html body dialog.video-lightbox .video-viewer-header{
  box-sizing:border-box !important;

  min-height:0 !important;
  height:auto !important;
  max-height:94px !important;

  padding:15px 70px 13px 18px !important;

  flex-shrink:0 !important;
  overflow:hidden !important;
}

html body dialog.video-lightbox .video-viewer-header h3{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* El escenario ocupa solo el espacio restante */
html body dialog.video-lightbox .video-viewer-stage{
  box-sizing:border-box !important;

  position:relative !important;

  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;

  display:grid !important;
  place-items:center !important;

  padding:14px !important;

  overflow:hidden !important;
}

/* Regla definitiva: el elemento VIDEO conserva toda la imagen */
html body dialog.video-lightbox .video-viewer-stage > video#videoPlayer{
  position:relative !important;
  z-index:2 !important;

  display:block !important;

  width:auto !important;
  height:auto !important;

  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;

  margin:auto !important;
  padding:0 !important;

  aspect-ratio:auto !important;

  object-fit:contain !important;
  object-position:center center !important;

  background:#000 !important;

  border-radius:18px !important;

  box-shadow:
    0 22px 56px rgba(0,0,0,.38),
    0 0 0 1px rgba(255,255,255,.045) !important;
}

/* El fondo difuminado puede llenar; el video real no */
html body dialog.video-lightbox .video-viewer-glow{
  inset:-36px !important;
  background-size:cover !important;
  background-position:center !important;
  opacity:.26 !important;
  filter:blur(38px) saturate(1.03) !important;
}

/* Móvil: visor exactamente del tamaño de la pantalla visible */
@media (max-width:620px){
  html body dialog.video-lightbox{
    width:100vw !important;
    height:var(--video-safe-h) !important;
    max-height:var(--video-safe-h) !important;

    margin:0 !important;

    border:0 !important;
    border-radius:0 !important;
  }

  html body dialog.video-lightbox .video-viewer{
    grid-template-rows:auto minmax(0,1fr) !important;
  }

  html body dialog.video-lightbox .video-viewer-header{
    max-height:78px !important;
    padding:11px 54px 9px 11px !important;
  }

  html body dialog.video-lightbox .video-viewer-header p{
    margin-bottom:2px !important;
  }

  html body dialog.video-lightbox .video-viewer-header h3{
    font-size:1rem !important;
  }

  html body dialog.video-lightbox .video-viewer-header span{
    margin-top:2px !important;
    font-size:.68rem !important;
  }

  html body dialog.video-lightbox .video-viewer-stage{
    min-height:0 !important;
    padding:8px !important;
  }

  html body dialog.video-lightbox .video-viewer-stage > video#videoPlayer{
    width:auto !important;
    height:auto !important;

    max-width:100% !important;
    max-height:100% !important;

    object-fit:contain !important;

    border-radius:12px !important;
  }

  html body dialog.video-lightbox .video-lightbox-close{
    top:8px !important;
    right:8px !important;

    width:38px !important;
    height:38px !important;
  }

  html body dialog.video-lightbox::backdrop{
    backdrop-filter:blur(3px) !important;
  }

  html body dialog.video-lightbox .video-viewer-glow{
    filter:blur(22px) !important;
    opacity:.20 !important;
  }
}

/* Pantallas horizontales o de poca altura */
@media (max-height:650px){
  html body dialog.video-lightbox .video-viewer-header{
    max-height:58px !important;
    padding:7px 54px 6px 10px !important;
  }

  html body dialog.video-lightbox .video-viewer-header p,
  html body dialog.video-lightbox .video-viewer-chip{
    display:none !important;
  }

  html body dialog.video-lightbox .video-viewer-header h3{
    font-size:.95rem !important;
  }

  html body dialog.video-lightbox .video-viewer-stage{
    padding:6px !important;
  }
}


/* =========================================================
   v0.4.66 — VISUALIZADOR DE VIDEO PREMIUM
   ========================================================= */

.premium-video-lightbox{
  background:
    radial-gradient(circle at 75% -10%,rgba(255,112,26,.11),transparent 28%),
    radial-gradient(circle at 6% 84%,rgba(255,105,20,.045),transparent 24%),
    linear-gradient(155deg,#111 0%,#080808 44%,#030303 100%) !important;
}

.premium-video-header{
  position:relative;
  z-index:5;
  min-height:88px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.004)) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.04),0 12px 28px rgba(0,0,0,.10);
}

.video-viewer-identity{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}

.video-viewer-mark{
  width:44px;height:44px;flex:0 0 auto;display:grid;place-items:center;
  border-radius:14px;border:1px solid rgba(255,255,255,.07);
  background:radial-gradient(circle at center,rgba(255,108,24,.10),transparent 65%),rgba(255,255,255,.018);
  box-shadow:0 10px 24px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.025);
}
.video-viewer-mark img{width:37px;height:37px;object-fit:contain}
.video-viewer-copy{min-width:0}
.video-viewer-badges{display:flex;align-items:center;gap:7px}
.video-viewer-chip-soft{
  color:#8d8780 !important;border-color:rgba(255,255,255,.07) !important;background:rgba(255,255,255,.022) !important;
}

.premium-video-lightbox .video-viewer-stage{
  position:relative;
  padding:20px !important;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.026),transparent 34%),#020202 !important;
}

.premium-video-frame{
  position:relative;z-index:3;width:auto;height:auto;max-width:100%;max-height:100%;overflow:hidden;
  border-radius:24px;background:#000;
  box-shadow:0 28px 70px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.055),0 0 60px rgba(255,94,20,.035);
  isolation:isolate;
}
.premium-video-frame::before{
  content:"";position:absolute;z-index:4;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),inset 0 18px 34px rgba(255,255,255,.018),inset 0 -80px 90px rgba(0,0,0,.36);
}
.premium-video-frame::after{
  content:"";position:absolute;z-index:1;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 24%,transparent 68%,rgba(0,0,0,.18));
}

html body dialog.video-lightbox .premium-video-frame > video#videoPlayer{
  position:absolute !important;z-index:0 !important;inset:0 !important;display:block !important;
  width:100% !important;height:100% !important;min-width:0 !important;min-height:0 !important;
  max-width:none !important;max-height:none !important;margin:0 !important;padding:0 !important;
  object-fit:contain !important;object-position:center center !important;
  border:0 !important;border-radius:inherit !important;background:#000 !important;box-shadow:none !important;
}

.video-center-action{
  position:absolute;z-index:8;left:50%;top:50%;width:76px;height:76px;display:grid;place-items:center;
  transform:translate(-50%,-50%) scale(1);border:1px solid rgba(255,255,255,.20);border-radius:50%;
  background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.13),transparent 42%),rgba(8,8,8,.55);
  color:#fff;cursor:pointer;backdrop-filter:blur(14px) saturate(1.12);
  box-shadow:0 18px 42px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.10);
  transition:opacity .28s ease,transform .34s cubic-bezier(.22,1,.36,1),background .24s ease,border-color .24s ease;
}
.video-center-action:hover{
  transform:translate(-50%,-50%) scale(1.08);border-color:rgba(255,144,58,.54);
  background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.20),transparent 42%),linear-gradient(135deg,rgba(255,91,22,.94),rgba(255,156,68,.92));
  color:#090909;
}
.video-center-action-icon{width:32px;height:32px;display:grid;place-items:center}
.video-center-action svg{grid-area:1/1;width:31px;height:31px;fill:currentColor;transition:opacity .2s ease,transform .22s ease}
.video-center-action .video-icon-play{transform:translateX(2px)}
.premium-video-frame.is-playing .video-center-action{opacity:0;transform:translate(-50%,-50%) scale(.88);pointer-events:none}
.premium-video-frame.is-paused .video-icon-play{opacity:1}
.premium-video-frame.is-paused .video-icon-pause{opacity:0;transform:scale(.78)}
.premium-video-frame.is-playing .video-icon-play{opacity:0;transform:scale(.78)}
.premium-video-frame.is-playing .video-icon-pause{opacity:1}

.premium-video-controls{
  position:absolute;z-index:10;left:12px;right:12px;bottom:12px;padding:10px 11px 9px;
  border:1px solid rgba(255,255,255,.09);border-radius:18px;
  background:linear-gradient(180deg,rgba(22,22,22,.70),rgba(6,6,6,.78));
  backdrop-filter:blur(18px) saturate(1.15);
  box-shadow:0 18px 38px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.045);
  opacity:1;transform:translateY(0);transition:opacity .26s ease,transform .30s cubic-bezier(.22,1,.36,1);
}
.premium-video-frame.controls-hidden .premium-video-controls{opacity:0;transform:translateY(12px);pointer-events:none}

.video-progress-wrap{padding:0 2px 8px}
.video-progress,.video-volume{
  appearance:none;-webkit-appearance:none;display:block;width:100%;margin:0;cursor:pointer;background:transparent;
}
.video-progress{height:14px}
.video-progress::-webkit-slider-runnable-track{
  height:3px;border-radius:999px;
  background:linear-gradient(90deg,#ff6118 0%,#ff9e46 var(--video-progress-value,0%),rgba(255,255,255,.16) var(--video-progress-value,0%),rgba(255,255,255,.16) 100%);
  box-shadow:0 0 10px rgba(255,93,19,.10);
}
.video-progress::-moz-range-track{
  height:3px;border-radius:999px;
  background:linear-gradient(90deg,#ff6118 0%,#ff9e46 var(--video-progress-value,0%),rgba(255,255,255,.16) var(--video-progress-value,0%),rgba(255,255,255,.16) 100%);
}
.video-progress::-webkit-slider-thumb{
  appearance:none;-webkit-appearance:none;width:13px;height:13px;margin-top:-5px;border:2px solid #151515;border-radius:50%;
  background:#ff8c37;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 0 14px rgba(255,102,23,.36);
}
.video-progress::-moz-range-thumb{width:11px;height:11px;border:2px solid #151515;border-radius:50%;background:#ff8c37}

.video-control-row{display:flex;align-items:center;justify-content:space-between;gap:14px}
.video-control-group{display:flex;align-items:center;gap:9px}
.video-control-group-right{justify-content:flex-end}
.video-control-button{
  width:34px;height:34px;flex:0 0 auto;display:grid;place-items:center;padding:0;
  border:1px solid transparent;border-radius:11px;background:transparent;color:#fff;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,transform .22s cubic-bezier(.22,1,.36,1),color .2s ease;
}
.video-control-button:hover{
  transform:translateY(-1px);border-color:rgba(255,255,255,.07);background:rgba(255,255,255,.055);color:#ff9440;
}
.video-control-button svg{grid-area:1/1;width:19px;height:19px;fill:currentColor}
.control-pause-icon,.control-muted-icon{opacity:0}
.premium-video-frame.is-playing .control-play-icon{opacity:0}
.premium-video-frame.is-playing .control-pause-icon{opacity:1}
.premium-video-frame.is-muted .control-volume-icon{opacity:0}
.premium-video-frame.is-muted .control-muted-icon{opacity:1}

.video-time{display:flex;align-items:center;gap:5px;color:#d0cac3;font-size:.67rem;font-variant-numeric:tabular-nums;font-weight:800;white-space:nowrap}
.video-time i{color:#5d5853;font-style:normal}
.video-volume-shell{width:72px;display:flex;align-items:center}
.video-volume{height:16px}
.video-volume::-webkit-slider-runnable-track{height:3px;border-radius:999px;background:rgba(255,255,255,.16)}
.video-volume::-moz-range-track{height:3px;border-radius:999px;background:rgba(255,255,255,.16)}
.video-volume::-webkit-slider-thumb{
  appearance:none;-webkit-appearance:none;width:11px;height:11px;margin-top:-4px;border:0;border-radius:50%;background:#fff;
}
.video-volume::-moz-range-thumb{width:11px;height:11px;border:0;border-radius:50%;background:#fff}

.video-shortcuts-hint{
  position:absolute;z-index:7;top:12px;left:12px;display:flex;flex-wrap:wrap;gap:6px;
  transition:opacity .26s ease,transform .26s ease;
}
.video-shortcuts-hint span{
  min-height:26px;padding:0 8px;display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.08);
  border-radius:999px;background:rgba(5,5,5,.45);color:rgba(255,255,255,.58);
  font-size:.53rem;font-weight:800;letter-spacing:.03em;backdrop-filter:blur(9px);
}
.premium-video-frame.is-playing .video-shortcuts-hint{opacity:0;transform:translateY(-6px);pointer-events:none}

.premium-video-frame.is-playing{
  box-shadow:0 30px 78px rgba(0,0,0,.50),0 0 0 1px rgba(255,125,34,.08),0 0 62px rgba(255,92,19,.04);
}

.premium-video-frame:fullscreen{width:100vw !important;height:100vh !important;border-radius:0;background:#000}
.premium-video-frame:fullscreen > video#videoPlayer{object-fit:contain !important;border-radius:0 !important}
.premium-video-frame:fullscreen .premium-video-controls{
  left:clamp(12px,3vw,34px);right:clamp(12px,3vw,34px);bottom:clamp(12px,3vh,28px);
}

@media (max-width:620px){
  .premium-video-header{min-height:72px !important}
  .video-viewer-mark{width:38px;height:38px;border-radius:12px}
  .video-viewer-mark img{width:32px;height:32px}
  .video-viewer-badges{display:none}
  .premium-video-lightbox .video-viewer-stage{padding:8px !important}
  .premium-video-frame{border-radius:16px}
  .premium-video-controls{left:7px;right:7px;bottom:7px;padding:8px 8px 7px;border-radius:15px}
  .video-center-action{width:64px;height:64px}
  .video-center-action svg{width:27px;height:27px}
  .video-control-button{width:32px;height:32px}
  .video-volume-shell{display:none}
  .video-shortcuts-hint{display:none}
  .video-time{font-size:.62rem}
}

@media (max-width:380px){
  .video-time i,#videoDuration{display:none}
  .video-control-row{gap:7px}
  .video-control-group{gap:5px}
}

@media (max-height:650px){
  .premium-video-header{min-height:54px !important}
  .video-viewer-mark{width:34px;height:34px}
  .video-viewer-mark img{width:29px;height:29px}
  .video-center-action{width:56px;height:56px}
  .video-shortcuts-hint{display:none}
}

@media (prefers-reduced-motion:reduce){
  .video-center-action,.premium-video-controls,.video-control-button,.video-shortcuts-hint{transition:none !important}
}


/* =========================================================
   v0.4.68 — Protección de contenido visible
   ========================================================= */
[data-protected-media],
.portfolio-photo,
#sessionImage,
#portfolioSessionImage,
.video-card-media img,
#videoPlayer{
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
}

.session-image-shell,
.premium-video-frame{
  position:relative;
}

.media-watermark{
  position:absolute;
  z-index:30;
  right:14px;
  bottom:12px;

  min-height:28px;
  padding:0 9px;

  display:inline-flex;
  align-items:center;

  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;

  background:rgba(3,3,3,.38);
  color:rgba(255,255,255,.62);

  font-size:.55rem;
  font-weight:900;
  letter-spacing:.08em;

  text-shadow:0 1px 8px rgba(0,0,0,.65);
  backdrop-filter:blur(7px);

  pointer-events:none;
  user-select:none;
}

.video-watermark{
  bottom:86px;
}

@media(max-width:620px){
  .media-watermark{
    right:9px;
    bottom:8px;
    min-height:24px;
    padding:0 7px;
    font-size:.49rem;
  }

  .video-watermark{
    bottom:75px;
  }
}


/* =========================================================
   v0.4.69 — Animación flotante en loop para foto destacada
   ========================================================= */
.hero-frame.hero-featured{
  will-change:transform, box-shadow, filter;
  transform-origin:center center;
  animation:
    heroFeaturedFloat 7.8s ease-in-out infinite,
    heroFeaturedGlow 7.8s ease-in-out infinite;
}

.hero-frame.hero-featured::before{
  content:"";
  position:absolute;
  inset:-18px;
  z-index:-1;
  border-radius:32px;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,119,27,.22), transparent 62%),
    radial-gradient(circle at 78% 22%, rgba(255,176,108,.14), transparent 35%);
  filter:blur(18px);
  opacity:.78;
  pointer-events:none;
  animation:heroFeaturedAura 7.8s ease-in-out infinite;
}

.hero-frame.hero-featured::after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:6px;
  pointer-events:none;
  background:
    linear-gradient(115deg,
      transparent 0 28%,
      rgba(255,255,255,.06) 38%,
      rgba(255,255,255,.015) 46%,
      transparent 58%);
  mix-blend-mode:screen;
  opacity:.56;
  animation:heroFeaturedSheen 7.8s ease-in-out infinite;
}

.hero-featured-photo{
  will-change:transform;
}

.hero-featured:hover .hero-featured-photo,
.hero-featured:focus-visible .hero-featured-photo{
  transform:scale(1.03);
}

.orbit-one{
  animation:heroOrbitOne 16s linear infinite;
}

.orbit-two{
  animation:heroOrbitTwo 22s linear infinite;
}

@keyframes heroFeaturedFloat{
  0%{
    transform:translate3d(0, 0, 0) rotate(2.3deg) scale(1);
    box-shadow:0 38px 78px rgba(0,0,0,.42);
  }
  20%{
    transform:translate3d(0, -10px, 0) rotate(1.8deg) scale(1.006);
    box-shadow:0 45px 86px rgba(0,0,0,.46);
  }
  50%{
    transform:translate3d(0, -18px, 0) rotate(2.8deg) scale(1.012);
    box-shadow:0 54px 102px rgba(0,0,0,.54);
  }
  75%{
    transform:translate3d(0, -9px, 0) rotate(3.2deg) scale(1.006);
    box-shadow:0 46px 88px rgba(0,0,0,.48);
  }
  100%{
    transform:translate3d(0, 0, 0) rotate(2.3deg) scale(1);
    box-shadow:0 38px 78px rgba(0,0,0,.42);
  }
}

@keyframes heroFeaturedGlow{
  0%,100%{
    filter:drop-shadow(0 0 0 rgba(255,119,27,0));
  }
  50%{
    filter:drop-shadow(0 8px 22px rgba(255,119,27,.16));
  }
}

@keyframes heroFeaturedAura{
  0%,100%{
    opacity:.56;
    transform:scale(.96);
  }
  50%{
    opacity:.9;
    transform:scale(1.03);
  }
}

@keyframes heroFeaturedSheen{
  0%,100%{
    opacity:.18;
    transform:translateX(-1.5%);
  }
  35%{
    opacity:.42;
  }
  50%{
    opacity:.58;
    transform:translateX(1.5%);
  }
  75%{
    opacity:.3;
  }
}

@keyframes heroOrbitOne{
  0%{ transform:rotate(-18deg) scale(1); }
  50%{ transform:rotate(-9deg) scale(1.025); }
  100%{ transform:rotate(342deg) scale(1); }
}

@keyframes heroOrbitTwo{
  0%{ transform:rotate(22deg) scale(1); }
  50%{ transform:rotate(11deg) scale(.985); }
  100%{ transform:rotate(382deg) scale(1); }
}

@media (max-width:760px){
  .hero-frame.hero-featured{
    animation:
      heroFeaturedFloatMobile 7.2s ease-in-out infinite,
      heroFeaturedGlow 7.2s ease-in-out infinite;
  }

  .hero-frame.hero-featured::before{
    inset:-12px;
    filter:blur(14px);
  }

  @keyframes heroFeaturedFloatMobile{
    0%{
      transform:translate3d(0, 0, 0) rotate(2deg) scale(1);
      box-shadow:0 28px 62px rgba(0,0,0,.4);
    }
    50%{
      transform:translate3d(0, -10px, 0) rotate(2.8deg) scale(1.008);
      box-shadow:0 36px 76px rgba(0,0,0,.48);
    }
    100%{
      transform:translate3d(0, 0, 0) rotate(2deg) scale(1);
      box-shadow:0 28px 62px rgba(0,0,0,.4);
    }
  }
}

@media (prefers-reduced-motion: reduce){
  .hero-frame.hero-featured,
  .hero-frame.hero-featured::before,
  .hero-frame.hero-featured::after,
  .orbit-one,
  .orbit-two{
    animation:none !important;
  }
}


/* =========================================================
   v0.4.70 — Header sin estado de disponibilidad
   ========================================================= */
.site-header{
  grid-template-columns:auto 1fr auto;
}

.header-status{
  display:none !important;
}