/*
Theme Name: Txelostudio Current
Theme URI: https://www.txelostudio.com/
Description: Child theme that brings the 2025 Lay Theme archive in line with the current Txelostudio site.
Author: Txelostudio
Template: lay
Version: 1.0.4
Text Domain: txelostudio-current
*/

:root {
  --tx-bg: #f5f5f5;
  --tx-paper: #fff;
  --tx-ink: #000;
  --tx-line: #111;
  --tx-gutter: clamp(20px, 3vw, 40px);
  --tx-header-height: 105px;
  --tx-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html { scroll-behavior: smooth; }

body.txelostudio-current {
  margin: 0;
  background: var(--tx-bg);
  color: var(--tx-ink);
  font-family: var(--tx-font);
  font-size: 20px;
  line-height: 1.18;
  -webkit-font-smoothing: antialiased;
}

body.txelostudio-current,
body.txelostudio-current button,
body.txelostudio-current input,
body.txelostudio-current select,
body.txelostudio-current textarea { font-family: var(--tx-font); }

body.txelostudio-current a { color: inherit; text-decoration: none; }
body.txelostudio-current a:hover,
body.txelostudio-current a:focus-visible { text-decoration: underline; text-underline-offset: .12em; }

/* The parent theme remains active underneath; its navigation is replaced, not edited. */
body.txelostudio-current > .sitetitle,
body.txelostudio-current > .laynav,
body.txelostudio-current > .lay-navbar,
body.txelostudio-current > .mobile-title,
body.txelostudio-current > .lay-mobile-icons-wrap,
body.txelostudio-current > .project-arrow { display: none !important; }
body.txelostudio-current #footer-region { display: none !important; }

.tx-skip {
  position: fixed;
  z-index: 10001;
  top: 8px;
  left: 8px;
  padding: 10px 14px;
  background: #000;
  color: #fff !important;
  transform: translateY(-150%);
}
.tx-skip:focus { transform: none; }

.tx-header {
  position: fixed;
  z-index: 9990;
  top: 0;
  right: 0;
  left: 0;
  height: var(--tx-header-height);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 28px;
  padding: 0 var(--tx-gutter);
  background: var(--tx-paper);
  border-bottom: 1px solid var(--tx-line);
}

.tx-brand { flex: 0 0 auto; font-weight: 700; letter-spacing: -.035em; }
.tx-nav { display: flex; align-items: center; gap: 24px; }
.tx-nav a, .tx-brand, .tx-actions a { white-space: nowrap; }
.tx-actions { margin-left: auto; display: flex; align-items: center; gap: 22px; }
.tx-actions svg { display: block; width: 20px; height: 20px; }
.tx-languages { display: flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .04em; }
.tx-languages a { opacity: .42; }
.tx-languages a[aria-current="page"] { opacity: 1; text-decoration: underline; text-underline-offset: .18em; }
.tx-account { margin-right: 22px; }
.tx-cart { display: flex; align-items: center; gap: 5px; }

.tx-menu-toggle {
  display: none;
  width: 42px;
  height: 42px;
  margin-left: auto;
  padding: 8px 0;
  border: 0;
  background: transparent;
  color: #000;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

.tx-main,
body.txelostudio-current .lay-content { padding-top: var(--tx-header-height); }
body.txelostudio-current .tx-main { padding-top: var(--tx-header-height); }
body.txelostudio-current.home .lay-content { display: none !important; }

.tx-hero {
  position: relative;
  height: calc(100vh - var(--tx-header-height));
  min-height: 560px;
  overflow: hidden;
  background: #fff;
}

.tx-slides { width: 100%; height: 100%; }
.tx-slide {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
	padding: 0;
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transition: opacity .45s ease, visibility .45s ease;
}
.tx-slide.is-active { opacity: 1; visibility: visible; }
.tx-slide img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.tx-slider-button {
  position: absolute;
  z-index: 3;
  top: 50%;
  width: 46px;
  height: 64px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  color: #000;
  font-size: 40px;
  font-weight: 200;
  line-height: 1;
  cursor: pointer;
}
.tx-slider-button:hover { opacity: .55; }
.tx-slider-button.prev { left: 14px; }
.tx-slider-button.next { right: 14px; }
.tx-slide-count { position: absolute; right: var(--tx-gutter); bottom: 22px; font-size: 14px; }

.tx-section { padding: clamp(72px, 10vw, 150px) var(--tx-gutter); }
.tx-section-title {
  margin: 0 0 42px;
  font-size: clamp(34px, 4.3vw, 66px);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: .98;
}
.tx-section-link { display: inline-block; margin-top: 34px; border-bottom: 1px solid currentColor; }

.tx-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.tx-product-card { min-width: 0; }
.tx-product-card img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: #ececec;
}
.tx-product-card h3 { margin: 12px 0 4px; font-size: 17px; font-weight: 400; line-height: 1.2; }
.tx-product-card .price { font-size: 15px; }

.tx-instagram { background: #fff; }
.tx-social-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tx-social-grid a { display: block; overflow: hidden; background: #eee; }
.tx-social-grid img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; transition: transform .35s ease; }
.tx-social-grid a:hover img { transform: scale(1.025); }

.tx-page { min-height: 70vh; padding: calc(var(--tx-header-height) + 128px) 3vw 128px; }
.tx-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.tx-portfolio-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.tx-project-card { position: relative; display: block; min-width: 0; }
.tx-project-media { overflow: hidden; aspect-ratio: 1 / 1; background: #e8e8e8; }
.tx-portfolio-grid .tx-project-card img { display: block; width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.tx-project-card h2 {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 2.08vw;
  box-sizing: border-box;
  background: rgb(217, 217, 217);
  color: #000;
  font-size: clamp(28px, 3.24vw, 52px);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: .02em;
  text-align: center;
  opacity: 0;
  transition: opacity .2s ease;
}
.tx-project-card:hover h2,
.tx-project-card:focus-visible h2 { opacity: 1; }

.tx-poster-page { padding-top: calc(var(--tx-header-height) + 38px); }
.tx-poster-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.8vw; }
.tx-poster-item { display: block; min-width: 0; aspect-ratio: 2 / 3; overflow: hidden; background: #ededed; cursor: zoom-in; }
.tx-poster-item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tx-poster-lightbox {
  width: 100vw;
  height: 100vh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 34px 70px;
  box-sizing: border-box;
  border: 0;
  background: rgba(255, 255, 255, .97);
  overflow: hidden;
}
.tx-poster-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.tx-poster-lightbox::backdrop { background: rgba(255, 255, 255, .82); }
.tx-poster-lightbox img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.tx-poster-lightbox button { position: fixed; z-index: 2; border: 0; background: transparent; color: #000; font: inherit; cursor: pointer; }
.tx-poster-lightbox-close { top: 18px; right: 24px; padding: 8px; font-size: 38px; line-height: 1; }
.tx-poster-lightbox-arrow { top: 50%; padding: 12px; transform: translateY(-50%); font-size: 52px; line-height: 1; }
.tx-poster-lightbox-prev { left: 12px; }
.tx-poster-lightbox-next { right: 12px; }

.tx-illustration-page { padding-top: calc(var(--tx-header-height) + 38px); }
.tx-illustration-grid { display: flex; flex-wrap: wrap; gap: 34px; align-items: stretch; }
.tx-illustration-item {
  flex-grow: var(--tx-ratio, 1);
  flex-basis: calc(var(--tx-ratio, 1) * 350px);
  min-width: 0;
  aspect-ratio: var(--tx-ratio, 1);
  overflow: hidden;
  background: #ededed;
  cursor: zoom-in;
}
.tx-illustration-item img { display: block; width: 100%; height: 100%; object-fit: cover; }

.tx-brand-page { padding-top: calc(var(--tx-header-height) + 38px); }
.tx-brand-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.8vw; }
.tx-brand-item { display: block; min-width: 0; aspect-ratio: 4 / 3; overflow: hidden; background: #ededed; cursor: zoom-in; }
.tx-brand-item img { display: block; width: 100%; height: 100%; object-fit: cover; }

.tx-project-page { padding: calc(var(--tx-header-height) + 58px) 3vw 128px; }
.tx-project-article { max-width: 1800px; margin: 0 auto; }
.tx-project-gallery { display: flex; flex-wrap: wrap; gap: 20px; align-items: stretch; }
.tx-project-gallery::after { content: ''; flex-grow: 999999; }
.tx-project-image { flex-grow: var(--tx-ratio, 1); flex-basis: calc(var(--tx-ratio, 1) * 435px); aspect-ratio: var(--tx-ratio, 1); margin: 0; min-width: 0; overflow: hidden; background: #ededed; }
.tx-project-image a { display: block; width: 100%; height: 100%; }
.tx-project-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.tx-project-copy { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); row-gap: 24px; padding: 42px 0 28px; font-size: 15px; line-height: 1.45; }
.tx-project-copy p { margin: 0 0 1em; }
.tx-project-copy-0 { grid-column: 1 / span 3; font-size: 16px; }
.tx-project-copy-main { grid-column: 1 / span 5; }
.tx-project-copy-1 { grid-column: 1 / span 5; }
.tx-project-copy-2 { grid-column: 7 / span 5; }

.tx-about-page { padding-top: calc(var(--tx-header-height) + 62px); }
.tx-about-content { max-width: 1500px; margin: 0 auto; }
.tx-about-section { padding: 48px 0; border-bottom: 1px solid var(--tx-line); font-size: clamp(18px, 2vw, 31px); line-height: 1.2; }
.tx-about-section:first-child { padding-top: 0; font-size: clamp(24px, 3.2vw, 53px); letter-spacing: -.025em; }
.tx-about-section h1,
.tx-about-section h2,
.tx-about-section h3 { margin: 0 0 24px; font-size: .55em; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; }
.tx-about-section p { margin: 0 0 .7em; }
.tx-about-section ul { columns: 2; margin: 0; padding: 0; list-style: none; }

/* Bring inherited Lay pages and WooCommerce into the same visual system. */
body.txelostudio-current:not(.home) .lay-content { min-height: 70vh; background: var(--tx-bg); }
body.txelostudio-current:not(.home) .lay-content img { height: auto; }
body.txelostudio-current .lay-textformat-parent,
body.txelostudio-current #lay-woocommerce { font-family: var(--tx-font); }
body.txelostudio-current .button,
body.txelostudio-current button.button,
body.txelostudio-current input.button {
  border: 1px solid #000;
  border-radius: 0;
  background: transparent;
  color: #000;
  font-weight: 400;
}

.tx-footer {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 40px;
  min-height: 220px;
  padding: 54px var(--tx-gutter) 40px;
  box-sizing: border-box;
  background: var(--tx-bg);
  border-top: 1px solid var(--tx-line);
  font-size: 19px;
}
.tx-footer-title { display: block; margin-bottom: 14px; }
.tx-footer a { display: table; margin-bottom: 5px; }

@media (max-width: 980px) {
  :root { --tx-header-height: 76px; }
  .tx-header { padding: 0 20px; }
  .tx-menu-toggle { display: block; }
  .tx-nav,
  .tx-actions {
    position: fixed;
    right: 0;
    left: 0;
    display: none;
    background: #fff;
  }
  .tx-nav {
    top: var(--tx-header-height);
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding: 18px 20px 8px;
    border-bottom: 0;
  }
  .tx-nav a { width: 100%; padding: 7px 0; font-size: 28px; }
  .tx-actions {
		top: calc(var(--tx-header-height) + 298px);
		align-items: center;
    margin: 0;
    padding: 10px 20px 24px;
    border-bottom: 1px solid #000;
  }
  .tx-header.is-open .tx-nav,
  .tx-header.is-open .tx-actions { display: flex; }
  .tx-account { margin-right: auto; }
  .tx-hero { min-height: 480px; }
  .tx-slide { padding: 54px 45px; }
  .tx-product-grid,
  .tx-portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tx-poster-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	.tx-brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	.tx-illustration-grid { gap: 20px; }
	.tx-illustration-item { flex-basis: calc(var(--tx-ratio, 1) * 260px); }
	.tx-project-image { flex-basis: calc(var(--tx-ratio, 1) * 360px); }
	.tx-project-copy { grid-template-columns: 1fr 1fr; column-gap: 40px; }
	.tx-project-copy-0 { grid-column: 1 / -1; }
	.tx-project-copy-main,
	.tx-project-copy-1,
	.tx-project-copy-2 { grid-column: auto; }
  .tx-social-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  body.txelostudio-current { font-size: 17px; }
  .tx-brand { font-size: 20px; }
  .tx-hero { height: calc(78svh - var(--tx-header-height)); min-height: 430px; }
  .tx-slide { padding: 38px 34px 58px; }
  .tx-slider-button { width: 34px; font-size: 31px; }
  .tx-slider-button.prev { left: 3px; }
  .tx-slider-button.next { right: 3px; }
  .tx-slide-count { right: 18px; bottom: 14px; }
  .tx-section { padding: 72px 20px; }
  .tx-section-title { margin-bottom: 28px; }
  .tx-product-grid,
  .tx-portfolio-grid { grid-template-columns: 1fr; gap: 34px; }
  .tx-page { padding: calc(var(--tx-header-height) + 30px) 20px 80px; }
	.tx-poster-page { padding-top: calc(var(--tx-header-height) + 20px); }
	.tx-brand-page { padding-top: calc(var(--tx-header-height) + 20px); }
	.tx-poster-grid { gap: 16px; }
	.tx-brand-grid { gap: 16px; }
	.tx-poster-lightbox { padding: 54px 44px 34px; }
	.tx-illustration-page { padding-top: calc(var(--tx-header-height) + 20px); }
	.tx-illustration-grid { display: block; }
	.tx-illustration-item { display: block; width: 100%; margin-bottom: 16px; }
	.tx-project-page { padding: calc(var(--tx-header-height) + 20px) 20px 80px; }
	.tx-project-gallery { display: block; }
	.tx-project-image { width: 100%; margin-bottom: 20px; }
	.tx-project-copy { grid-template-columns: 1fr; gap: 25px; padding-top: 45px; }
	.tx-project-copy-0,
	.tx-project-copy-main,
	.tx-project-copy-1,
	.tx-project-copy-2 { grid-column: auto; }
	.tx-about-section ul { columns: 1; }
  .tx-footer { grid-template-columns: 1fr; gap: 30px; min-height: 0; padding: 42px 20px; }
}

/* Full-bleed homepage carousel, overriding the parent theme's figure defaults. */
body.txelostudio-current.home .tx-slide {
  margin: 0 !important;
  padding: 0 !important;
}
body.txelostudio-current.home .tx-slide img {
	position: absolute;
	inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .tx-slide, .tx-project-card img, .tx-social-grid img { transition: none; }
}
