/*
  Çınar Med V3
  Visual thesis: logo-led clinical engineering — extended geometric type,
  precise orange routing lines and tactile specimen photography.
*/

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("../fonts/sora-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-weight: 300 800;
  font-display: swap;
  src: url("../fonts/sora-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --display: "Sora", "Manrope", "Segoe UI", sans-serif;
  --serif: var(--display);
  --v3-rule: rgba(31, 34, 30, 0.16);
}

body {
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

.hero-title,
.atlas-intro__title,
.focus-chapter__copy h2,
.section-title,
.display-title,
.page-title,
.explorer-stage__meta strong,
.consultation-step h3,
.consultation-direct strong,
.contact-stage__card a,
.catalog-card h2,
.catalog-card h3,
.brochure-product h4,
.catalog-group__head h3,
.editorial-copy p,
.principle h3,
.contact-item a,
.contact-item strong,
.contact-form__head h2,
.mega-menu__intro strong {
  font-family: var(--display);
}

.hero-title em,
.atlas-intro__title em,
.focus-chapter__copy h2 em,
.section-title em,
.display-title em,
.page-title em {
  font-style: normal;
  font-weight: 720;
}

.hero-title,
.page-title,
.section-title,
.display-title,
.atlas-intro__title,
.focus-chapter__copy h2 {
  letter-spacing: -0.065em;
}

.nav-link,
.nav-menu-button,
.header-cta,
.button,
.eyebrow,
.section-index,
.hero-kicker,
.catalog-card__brand,
.brochure-product__brand,
.product-row__brand {
  font-family: var(--display);
}

.nav-link,
.nav-menu-button,
.header-cta {
  font-weight: 720;
}

.mega-menu__intro strong {
  font-size: 2.15rem;
  font-weight: 620;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

/* Logo-led type scale */
.hero-slider--v2 .hero-title {
  max-width: 780px;
  font-size: clamp(4rem, 5.7vw, 6.85rem);
  font-weight: 470;
  line-height: 0.91;
}

.hero-slider--v2 .hero-title em {
  display: block;
  max-width: 720px;
}

.atlas-intro__title {
  max-width: 900px;
  font-size: clamp(3.6rem, 5.25vw, 6.2rem);
  font-weight: 450;
  line-height: 0.94;
}

.focus-chapter__copy h2 {
  max-width: 690px;
  font-size: clamp(3.15rem, 4.5vw, 5.25rem);
  font-weight: 470;
  line-height: 0.94;
}

.section-title {
  font-size: clamp(3.2rem, 4.8vw, 5.8rem);
  font-weight: 470;
  line-height: 0.95;
}

.display-title {
  font-weight: 470;
  line-height: 0.93;
}

.explorer-heading .section-title {
  font-size: clamp(3.4rem, 4.75vw, 5.6rem);
}

.explorer-stage__meta strong {
  font-size: clamp(2.8rem, 4vw, 4.8rem);
  font-weight: 520;
  letter-spacing: -0.06em;
  line-height: 0.95;
}

.portfolio-explorer .category-row strong {
  font-family: var(--display);
  font-size: clamp(1.45rem, 1.9vw, 2.35rem);
  font-weight: 520;
  letter-spacing: -0.045em;
}

.consultation-step > span,
.chapter-number,
.atlas-intro__index > span {
  font-family: var(--display);
  font-weight: 360;
  letter-spacing: -0.06em;
}

.consultation-step h3 {
  font-size: clamp(2rem, 3.1vw, 3.65rem);
  font-weight: 470;
  line-height: 1;
}

.consultation-direct strong {
  font-size: clamp(2.5rem, 4vw, 4.7rem);
  font-weight: 470;
}

.contact-stage__copy .display-title {
  max-width: 850px;
  font-size: clamp(3.8rem, 5.75vw, 6.8rem);
}

.contact-stage__card a {
  font-size: clamp(1.55rem, 2.1vw, 2.55rem);
  font-weight: 500;
}

.page-hero .page-title {
  max-width: 780px;
  font-size: clamp(3.8rem, 5.7vw, 6.8rem);
  font-weight: 470;
  line-height: 0.91;
}

.catalog-card h2,
.catalog-card h3,
.brochure-product h4 {
  font-weight: 520;
  letter-spacing: -0.05em;
  line-height: 1.04;
}

.brand-constellation .brand-track__item {
  font-family: var(--display);
  font-size: 1.25rem;
  font-weight: 650;
  letter-spacing: -0.035em;
}

/* New clinical visual ledger */
.visual-ledger {
  position: relative;
  overflow: hidden;
  padding-block: clamp(110px, 10vw, 164px);
}

.visual-ledger::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - min(710px, 46vw));
  width: 1px;
  background: var(--v3-rule);
  content: "";
}

.visual-ledger__head {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.42fr);
  align-items: end;
  gap: clamp(48px, 8vw, 124px);
  margin-bottom: clamp(54px, 6vw, 92px);
}

.visual-ledger__head .section-lead {
  border-top: 1px solid var(--v3-rule);
  padding-top: 20px;
}

.visual-ledger__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(430px, 38vw) minmax(340px, 30vw);
  gap: 12px;
}

.visual-plate {
  position: relative;
  min-width: 0;
  overflow: hidden;
  background: var(--v2-ink);
  color: #fff;
  isolation: isolate;
  text-decoration: none;
}

.visual-plate--ent { grid-column: 1 / span 7; }
.visual-plate--spine { grid-column: 8 / -1; }
.visual-plate--surgical { grid-column: 1 / span 5; }
.visual-plate--compression { grid-column: 6 / -1; }

.visual-plate img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(0.2, 0.72, 0.2, 1), filter 500ms ease;
}

.visual-plate::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(18, 20, 18, 0.18) 66%, rgba(18, 20, 18, 0.88) 100%);
  content: "";
}

.visual-plate > span {
  position: absolute;
  z-index: 2;
  right: 26px;
  bottom: 24px;
  left: 26px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: end;
  gap: 4px 18px;
}

.visual-plate b {
  grid-row: 1 / span 2;
  color: var(--v2-orange);
  font-family: var(--display);
  font-size: 2.4rem;
  font-weight: 350;
  letter-spacing: -0.07em;
  line-height: 0.9;
}

.visual-plate small {
  color: #fff;
  font-family: var(--display);
  font-size: clamp(1rem, 1.5vw, 1.5rem);
  font-weight: 620;
  letter-spacing: -0.035em;
}

.visual-plate i {
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.visual-plate:hover img,
.visual-plate:focus-visible img {
  transform: scale(1.035);
  filter: saturate(1.05) contrast(1.02);
}

.visual-plate:focus-visible {
  outline: 3px solid var(--v2-orange);
  outline-offset: 4px;
}

/* Visual openings for catalog, about and contact */
.page-hero--no-image {
  min-height: 700px;
}

.page-hero--no-image .page-hero__inner {
  min-height: 700px;
}

.page-hero--no-image .page-hero__copy {
  position: relative;
  z-index: 2;
  width: min(760px, 48%);
}

.page-hero__visual-stack {
  position: absolute;
  z-index: 0;
  inset: 0 0 0 52%;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  grid-template-rows: 1fr 1fr;
  gap: 3px;
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
  background: var(--v2-ink);
}

.page-hero__visual-stack::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--v2-ink) 0%, rgba(23, 26, 23, 0.68) 12%, transparent 34%);
  content: "";
  pointer-events: none;
}

.page-hero__visual-stack img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.8) contrast(1.04);
}

.page-hero__visual-stack--catalog img:first-child {
  grid-row: 1 / span 2;
}

.page-hero__visual-stack--about,
.page-hero__visual-stack--contact {
  grid-template-columns: 1fr;
}

.page-hero__visual-stack--about img:first-child,
.page-hero__visual-stack--contact img:first-child {
  object-position: center 45%;
}

.page-hero__visual-stack--about img:last-child,
.page-hero__visual-stack--contact img:last-child {
  object-position: center 62%;
}

/* About-page image narrative */
.identity-gallery {
  display: grid;
  min-height: 760px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-template-rows: minmax(340px, 1fr) minmax(300px, 0.78fr);
  gap: 12px;
  margin-top: clamp(76px, 8vw, 126px);
}

.identity-gallery figure {
  position: relative;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  background: var(--v2-ink);
}

.identity-gallery__primary { grid-column: 1 / span 8; }
.identity-gallery__secondary { grid-column: 9 / -1; }
.identity-gallery__detail { grid-column: 4 / -1; }

.identity-gallery img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.identity-gallery figcaption {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2px 14px;
  border-left: 3px solid var(--v2-orange);
  padding: 14px 16px;
  background: rgba(18, 20, 18, 0.88);
  color: #fff;
  backdrop-filter: blur(10px);
}

.identity-gallery figcaption span {
  grid-row: 1 / span 2;
  color: var(--v2-orange);
  font-family: var(--display);
  font-size: 1.5rem;
  font-weight: 400;
}

.identity-gallery figcaption strong {
  font-family: var(--display);
  font-weight: 620;
}

.identity-gallery figcaption small {
  color: rgba(255, 255, 255, 0.63);
}

.contact-visual {
  position: relative;
  margin: 48px 0 40px;
  overflow: hidden;
  background: var(--v2-ink);
}

.contact-visual img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.contact-visual figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  max-width: 72%;
  border-left: 3px solid var(--v2-orange);
  padding: 16px 18px;
  background: rgba(18, 20, 18, 0.9);
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.74rem;
  font-weight: 620;
}

/* 404 is treated as a final visual plate, not a dead end */
.error-page {
  position: relative;
  overflow: hidden;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  gap: clamp(40px, 8vw, 140px);
  padding-inline: max(40px, calc((100vw - 1420px) / 2));
  text-align: left;
}

.error-page::after {
  width: 100%;
  height: min(72vh, 760px);
  background: linear-gradient(90deg, rgba(23, 26, 23, 0.12), transparent 28%), url("../images/detail-surgical.webp") center / cover no-repeat;
  clip-path: polygon(9% 0, 100% 0, 100% 100%, 0 100%);
  content: "";
}

.error-page > div {
  position: relative;
  z-index: 1;
}

.error-page .brand {
  justify-content: flex-start !important;
}

.error-page__code {
  font-family: var(--display);
  font-size: clamp(7rem, 13vw, 13rem);
  font-weight: 340;
  line-height: 0.78;
}

.error-page h1 {
  font-family: var(--display);
  font-size: clamp(2.35rem, 3.7vw, 4.1rem);
  font-weight: 520;
  letter-spacing: -0.06em;
  line-height: 0.98;
}

.error-page p {
  margin-inline: 0;
}

.error-page .button-row {
  justify-content: flex-start !important;
}

@media (max-width: 1180px) {
  .hero-slider--v2 .hero-title {
    font-size: clamp(3.7rem, 6.1vw, 5.8rem);
  }

  .page-hero .page-title {
    font-size: clamp(3.5rem, 5.6vw, 5.6rem);
  }

  .visual-ledger__grid {
    grid-template-rows: 440px 340px;
  }
}

@media (min-width: 921px) and (max-height: 760px) {
  .hero-slider--v2 .hero-title {
    font-size: clamp(3.25rem, 4.8vw, 4.8rem);
  }

  .page-hero--no-image,
  .page-hero--no-image .page-hero__inner {
    min-height: calc(100svh - 122px);
  }
}

@media (max-width: 920px) {
  .hero-slider--v2 .hero-title {
    font-size: clamp(3.15rem, 8.8vw, 5rem);
  }

  .visual-ledger__head {
    grid-template-columns: 1fr;
  }

  .visual-ledger__head .section-lead {
    max-width: 620px;
  }

  .visual-ledger__grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 460px 340px 420px;
  }

  .visual-plate--ent { grid-column: 1 / -1; }
  .visual-plate--spine { grid-column: 1; }
  .visual-plate--surgical { grid-column: 2; }
  .visual-plate--compression { grid-column: 1 / -1; }

  .page-hero--no-image,
  .page-hero--no-image .page-hero__inner {
    min-height: 780px;
  }

  .page-hero--no-image .page-hero__inner {
    align-items: flex-end;
    padding-block: 350px 74px;
  }

  .page-hero--no-image .page-hero__copy {
    width: min(720px, 100%);
  }

  .page-hero__visual-stack {
    inset: 0 0 50%;
    grid-template-columns: 1.2fr 0.8fr;
    clip-path: none;
  }

  .page-hero__visual-stack--about,
  .page-hero__visual-stack--contact {
    grid-template-columns: 1.2fr 0.8fr;
    grid-template-rows: 1fr;
  }

  .page-hero__visual-stack::after {
    background: linear-gradient(180deg, transparent 45%, var(--v2-ink) 100%);
  }

  .identity-gallery {
    min-height: 0;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 460px 340px;
  }

  .identity-gallery__primary { grid-column: 1 / -1; }
  .identity-gallery__secondary { grid-column: 1; }
  .identity-gallery__detail { grid-column: 2; }

  .error-page {
    grid-template-columns: 1fr;
    align-content: center;
    padding-block: 60px;
  }

  .error-page::after {
    position: absolute;
    z-index: 0;
    inset: 0 0 0 45%;
    width: auto;
    height: auto;
    opacity: 0.2;
  }
}

@media (max-width: 640px) {
  .hero-slider--v2 .hero-title {
    font-size: clamp(2.72rem, 12.3vw, 3.65rem);
    line-height: 0.94;
  }

  .atlas-intro__title,
  .focus-chapter__copy h2,
  .section-title,
  .explorer-heading .section-title,
  .contact-stage__copy .display-title {
    font-size: clamp(2.6rem, 12vw, 3.65rem);
    line-height: 0.96;
  }

  .portfolio-explorer .category-row strong {
    font-size: 1.45rem;
  }

  .visual-ledger {
    padding-block: 92px;
  }

  .visual-ledger__grid {
    display: flex;
    flex-direction: column;
  }

  .visual-plate {
    min-height: 360px;
  }

  .visual-plate:nth-child(even) {
    min-height: 430px;
  }

  .visual-plate > span {
    right: 18px;
    bottom: 18px;
    left: 18px;
  }

  .visual-plate b {
    font-size: 2rem;
  }

  .visual-plate small {
    font-size: 1rem;
  }

  .page-hero--no-image,
  .page-hero--no-image .page-hero__inner {
    min-height: 740px;
  }

  .page-hero--no-image .page-hero__inner {
    padding-block: 310px 70px;
  }

  .page-hero--no-image .page-title {
    font-size: clamp(2.68rem, 12.3vw, 3.65rem);
    line-height: 0.94;
  }

  .page-hero__visual-stack {
    inset-block-end: 56%;
  }

  .identity-gallery {
    display: flex;
    flex-direction: column;
    margin-top: 68px;
  }

  .identity-gallery figure {
    min-height: 340px;
  }

  .identity-gallery figure:first-child {
    min-height: 410px;
  }

  .contact-visual figcaption {
    position: relative;
    max-width: none;
  }
}

@media (max-width: 380px) {
  .hero-slider--v2 .hero-title,
  .page-hero--no-image .page-title {
    font-size: 2.42rem;
  }

  .hero-slider--v2 .hero-slide__inner {
    padding-block: 220px 228px;
  }

  .hero-slider--v2 .hero-copy__top {
    margin-bottom: 14px;
  }

  .hero-slider--v2 .hero-text {
    margin-top: 16px;
    font-size: 0.78rem;
    line-height: 1.55;
  }

  .hero-slider--v2 .button-row {
    margin-top: 20px;
  }

  .hero-slider--v2 .button {
    min-height: 52px;
  }

  .visual-plate,
  .visual-plate:nth-child(even) {
    min-height: 330px;
  }

  .page-hero--no-image .page-hero__inner {
    padding-top: 260px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .visual-plate img {
    transition: none;
  }
}