/* Experience leads; the existing portfolio introduction becomes a quieter threshold. */
.portfolio-expertise { padding-top: 64px; padding-bottom: 68px; }
.portfolio-expertise .eyebrow { margin-bottom: 38px; }
.portfolio-expertise h1 { font: 400 clamp(52px, 6.7vw, 108px)/1.03 var(--serif); letter-spacing: -.055em; margin: 0; }
.portfolio-expertise h1 em { display: block; max-width: 18em; margin-top: 20px; font-size: .58em; line-height: 1.13; color: #756b4a; }
.expertise-columns { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(36px, 6vw, 100px); margin-top: 48px; }
.expertise-columns p { color: #4a4a44; font-size: 16px; line-height: 1.75; }
.expertise-columns p + p { margin-top: 20px; }
.expertise-context > .copy-es:first-child,
.expertise-context > .copy-en:nth-child(2) { font-size: 18px; line-height: 1.7; }
.expertise-columns strong { color: var(--black); font-weight: 600; }
.expertise-columns .copy-en { display: none; }
html:lang(en) .expertise-columns .copy-es { display: none; }
html:lang(en) .expertise-columns .copy-en { display: block; }
.expertise-columns .copy-es + .copy-en { margin-top: 0; }
.expertise-columns .copy-en + .copy-es { margin-top: 20px; }
html:lang(en) .expertise-columns .copy-en ~ .copy-en { margin-top: 20px; }
.project-text-link { color: var(--black); text-decoration: underline; text-decoration-color: var(--yellow); text-underline-offset: 5px; text-decoration-thickness: 2px; transition: text-decoration-color .35s ease; }
.project-text-link:hover { text-decoration-color: var(--black); }
.portfolio-expertise.brand-watermarked::before { width: clamp(190px, 22vw, 340px); height: clamp(190px, 22vw, 340px); top: 50px; background-image: url('/assets/portfolio-watermark.svg'); opacity: 1; }
.portfolio-opening { display: grid; grid-template-columns: 1fr 1fr; align-items: center; column-gap: 6vw; row-gap: 22px; padding-top: 38px; padding-bottom: 44px; border-top: 1px solid var(--line); }
.portfolio-opening .eyebrow { grid-column: 1 / -1; margin-bottom: 0; font-size: 12px; }
.portfolio-opening h2 { font-size: clamp(34px, 3.6vw, 55px); line-height: 1.08; }
.portfolio-opening h2 em { color: #756b4a; }
.portfolio-opening .portfolio-intro { margin-top: 0; gap: 32px; }
.portfolio-opening .portfolio-intro p { font-size: 15px; }
.portfolio-opening .opening-plus { width: 36px; height: 36px; }
.portfolio-mosaic .tile-carboneria > img { object-position: 72% center; }

/* A separate top-level lightbox is independent of the project-details dimensions. */
.gallery-header-actions { display: flex; align-items: center; gap: 24px; }
.gallery-expand { display: block; position: relative; width: 100%; height: 100%; border: 0; padding: 0; color: white; background: transparent; cursor: zoom-in; }
.gallery-expand > img { width: 100%; height: 100%; object-fit: contain; }
.gallery-expand-hint { position: absolute; top: 16px; right: 16px; display: inline-flex; align-items: center; gap: 9px; padding: 10px 12px; background: #11120fc9; font-size: 11px; pointer-events: none; }
.gallery-expand-hint svg { width: 18px; height: 18px; }
.photo-prev svg, .photo-next svg { display: block; width: 23px; height: 23px; margin: auto; }
dialog.photo-lightbox {
  position: fixed;
  inset: 0;
  box-sizing: border-box;
  width: 100vw;
  height: 100vh;
  height: 100dvh;
  min-width: 100vw;
  min-height: 100vh;
  min-height: 100dvh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  color: #fff;
  background: #050605;
}
.photo-lightbox::backdrop { background: #050605; }
.photo-lightbox[open] { animation: lightbox-fade .22s ease; }
.lightbox-stage { position: absolute; inset: 0; touch-action: pan-y; }
.lightbox-stage > img { width: 100%; height: 100%; object-fit: contain; }
.lightbox-toolbar {
  position: absolute;
  inset: 0 0 auto;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: max(18px, env(safe-area-inset-top)) max(28px, env(safe-area-inset-right)) 24px max(28px, env(safe-area-inset-left));
  background: linear-gradient(#050605d9, #05060570 70%, transparent);
}
#lightbox-title { font-size: 13px; line-height: 1.4; }
.lightbox-actions { display: flex; align-items: center; gap: 24px; flex-shrink: 0; }
.lightbox-return, .lightbox-close { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 44px; padding: 0; color: #fff; border: 0; background: transparent; font-size: 12px; }
.lightbox-return svg { width: 25px; height: 23px; }
.lightbox-close { width: 44px; }
.lightbox-close svg { width: 25px; height: 25px; }
.lightbox-prev, .lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 48px; height: 56px; border: 1px solid #ffffff35; color: #fff; background: #0506058c; }
.lightbox-prev { left: max(24px, env(safe-area-inset-left)); }
.lightbox-next { right: max(24px, env(safe-area-inset-right)); }
.lightbox-prev svg, .lightbox-next svg { width: 27px; height: 24px; }
.lightbox-prev:disabled, .lightbox-next:disabled { opacity: .25; cursor: default; }
.lightbox-count { position: absolute; bottom: max(20px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); padding: 10px 15px; background: #050605b3; font-size: 12px; }
@keyframes lightbox-fade { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 760px) {
  .portfolio-expertise { padding-top: 44px; padding-bottom: 46px; }
  .portfolio-expertise .eyebrow { margin-bottom: 28px; font-size: 12px; }
  .portfolio-expertise h1 { font-size: clamp(43px, 10vw, 72px); }
  .portfolio-expertise h1 em { font-size: .67em; margin-top: 20px; max-width: 13em; }
  .expertise-columns { grid-template-columns: 1fr; gap: 24px; margin-top: 32px; }
  .expertise-columns p, .expertise-context > .copy-es:first-child,
  .expertise-context > .copy-en:nth-child(2) { font-size: 15.5px; line-height: 1.72; }
  .portfolio-opening { grid-template-columns: 1fr; row-gap: 20px; padding-top: 30px; padding-bottom: 32px; }
  .portfolio-opening h2 { font-size: 37px; }
  .portfolio-opening .portfolio-intro { margin-top: 0; align-items: center; }
  .portfolio-opening .portfolio-intro p { font-size: 14px; }
  .gallery-header-actions { gap: 16px; }
  .gallery-expand-hint { top: 12px; right: 12px; padding: 8px 10px; }
  .lightbox-toolbar { padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); gap: 12px; }
  .lightbox-actions { gap: 12px; }
  .lightbox-return { gap: 8px; font-size: 11px; }
  #lightbox-title { font-size: 11px; max-width: 45%; }
  .lightbox-prev, .lightbox-next { width: 42px; height: 48px; }
  .lightbox-prev { left: max(12px, env(safe-area-inset-left)); }
  .lightbox-next { right: max(12px, env(safe-area-inset-right)); }
}
@media (prefers-reduced-motion: reduce) {
  .project-text-link { transition: none; }
  .photo-lightbox[open] { animation: none; }
}

/* Toque de Senson: a new wide project within the established mosaic. */
.tile-toque{grid-column:1/13;grid-row:19/24}.tile-toque>img{object-position:50% 45%}.gallery-info #gallery-description.long-description{white-space:pre-line}
@media(max-width:760px){.tile-toque{grid-column:1/3;grid-row:27/30}}