/* Presentation layers are intentionally unstyled until visual design begins. */
@import url("./base/reset.css?v=3");
@import url("./base/variables.css");
@import url("./base/accessibility.css");
@import url("./layout/site-shell.css");
@import url("./layout/header.css?v=8");
@import url("./layout/footer.css?v=8");
@import url("./layout/responsive.css");
@import url("./components/navigation.css?v=2");
@import url("./components/cards.css");
@import url("./components/gallery.css");
@import url("./components/modal.css");
@import url("./components/buttons.css");
@import url("./components/page-transition.css");
@import url("./pages/home.css?v=8");
@import url("./pages/works.css?v=9");
@import url("./pages/blog.css?v=12");
@import url("./pages/contact.css");
@import url("./pages/type-expand.css?v=4");
@import url("./pages/about.css");
@import url("./vendor/splitting.css");
@import url("./vendor/splitting-cells.css");

/* ---- Quiet page-load reveal: only the opening copy moves in. ---- */[data-page="home"] .AboutColumns_AboutColumnsContainer_PageTitle,
[data-page="about"] .intro,
[data-page="contact"] .contact-hero,
[data-page="blog"] main.reveal-top .blog-hero,
[data-page="resume"] main.reveal-top > h1 {
  opacity: 0;
  transform: translateY(1.1rem);
}

[data-page="home"] main.reveal-top.is-revealed .AboutColumns_AboutColumnsContainer_PageTitle,
[data-page="about"] main.reveal-top.is-revealed .intro,
[data-page="contact"] main.reveal-top.is-revealed .contact-hero,
[data-page="blog"] main.reveal-top.is-revealed .blog-hero,
[data-page="resume"] main.reveal-top.is-revealed > h1 {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 1100ms cubic-bezier(0.16, 1, 0.3, 1), transform 1400ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Hold page content until the transition cover is ready, so an incoming page
   never paints bare before the fade (prevents the double-flash on non-home pages).
   Photos runs its own demo engine without the cover, so keep it visible. */
main#main-content {
  opacity: 0;
}

/* Language switch EN/TR: fade the whole page out before navigating so the
   swap doesn't happen abruptly. */
body.lang-switching {
  opacity: 0;
  transition: opacity 0.35s ease;
}

body.pt-ready main#main-content,
body[data-page="photos"] main#main-content {
  opacity: 1;
  transition: opacity 400ms ease;
}

/* Project detail pages: slower, smoother fade-in entrance */
body[data-page="work-detail"].pt-ready main#main-content {
  transition: opacity 1400ms cubic-bezier(0.16, 1, 0.3, 1);
}

@media (prefers-reduced-motion: reduce) {
  [data-page="home"] .AboutColumns_AboutColumnsContainer_PageTitle,
  [data-page="about"] .intro,
  [data-page="contact"] .contact-hero,
  [data-page="blog"] main.reveal-top .blog-hero,
  [data-page="resume"] main.reveal-top > h1 {
    opacity: 1;
    transform: none;
    transition: none;
  }

/* Type-expand project descriptions: full-contrast text in both themes. */
html[data-theme="light"] .te-block,
html[data-theme="light"] .te-block p,
html[data-theme="light"] .te-skills,
[data-theme="light"] .te-block,
[data-theme="light"] .te-block p,
[data-theme="light"] .te-skills {
  color: #111111 !important;
}
html[data-theme="dark"] .te-block,
html[data-theme="dark"] .te-block p,
html[data-theme="dark"] .te-skills,
[data-theme="dark"] .te-block,
[data-theme="dark"] .te-block p,
[data-theme="dark"] .te-skills {
  color: #ffffff !important;
}
}