.photo-slot {
  min-height: 260px;
  display: flex;
  align-items: flex-end;
  padding: 24px;
  position: relative;
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  background: linear-gradient(145deg, #314a43, #687d72);
  color: #fff;
}
.photo-slot::before { content: ""; position: absolute; width: 72%; aspect-ratio: 1; right: -14%; top: -38%; border: 1px solid rgba(255,255,255,.38); border-radius: 50%; }
.photo-slot span { position: relative; font-size: 13px; letter-spacing: .04em; }
.photo-slot.portrait { min-height: 500px; margin: 35px 0; border-radius: 24px; }
.photo-slot.wide { min-height: 420px; background: linear-gradient(145deg, #8c1715, #bd6546); }
.photo-strip { display: grid; grid-template-columns: 1.1fr .8fr 1.1fr; gap: 18px; margin-bottom: 55px; }
.photo-strip .photo-slot:nth-child(2) { transform: translateY(28px); background: linear-gradient(145deg, #8c1715, #bd6546); }
.photo-strip .photo-slot:nth-child(3) { background: linear-gradient(145deg, #b68a4b, #675f57); }
.photo-collage { width: 100%; aspect-ratio: 16 / 9; margin-bottom: 55px; border-radius: 24px; background: url('/assets/images/travel-collage.png') center / cover no-repeat; box-shadow: 0 18px 45px rgba(54,42,32,.12); }
.about { display: grid; grid-template-columns: 1fr minmax(320px, .65fr); gap: clamp(48px, 8vw, 120px); align-items: center; }
.about-copy { min-width: 0; }
.about .person { width: min(100%, 520px); min-height: 0; aspect-ratio: 3 / 4; justify-self: end; margin: 0; background: url('/assets/images/natalya-portrait-studio.jpg') center / cover no-repeat; }
.contact-photo { min-height: 320px; margin-top: 35px; background: url('/assets/images/airport-sunset.png') center / cover no-repeat; }
.hero-photo { border: 0; border-radius: 24px; background: linear-gradient(180deg,transparent 45%,rgba(19,32,28,.62)),url('/assets/images/hero-japan.png') center / cover no-repeat; }
.hero-photo::before { content: ""; position: absolute; inset: 9%; border: 1px dashed rgba(255,255,255,.36); border-radius: 18px; }
.hero-photo::after { display: none; }
.hero-photo span { display: grid; gap: 18px; }
.hero-photo small { font: 600 12px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; }
.travel-moment { background: url('/assets/images/travel-moment.jpg') center / cover no-repeat; }
.case-grid { display: grid; grid-template-columns: minmax(280px, .72fr) 1.28fr; gap: clamp(45px, 8vw, 120px); align-items: center; }
.china-case { background: var(--soft); }
.kyrgyz-case { background: var(--paper); }
.case-photo { width: 100%; min-height: 0; aspect-ratio: 3 / 4; border-radius: 24px; }
.family-china { background: url('/assets/images/family-china.png') center / cover no-repeat; }
.couple-kyrgyz { background: url('/assets/images/couple-kyrgyzstan.png') center / cover no-repeat; }
.case-grid .case-copy > p:not(.eyebrow) { max-width: 720px; margin: 0; font-size: 20px; }
.case-grid .case-copy > p + p { margin-top: 1.65em; }
.travel-moment::before, .person::before { display: none; }
p br, h2 br {
  content: "";
  display: block;
  margin-top: 1.25em;
}
.hero-copy .lead p { margin: 0; }
.hero-copy .lead p + p { margin-top: 1.65em; }
.form .consent { grid-template-columns: auto 1fr; align-items: start; gap: 10px; font-size: 12px; font-weight: 400; line-height: 1.45; }
.form .consent input { margin-top: 3px; }
.form .consent a { color: var(--accent); }
@media (max-width: 850px) {
  .case-grid { grid-template-columns: 1fr; }
  .case-photo { width: min(100%, 520px); justify-self: center; }
  .photo-strip { grid-template-columns: 1fr; }
  .photo-strip .photo-slot:nth-child(2) { transform: none; }
  .about { grid-template-columns: 1fr; }
  .about .person { grid-row: auto; }
}

/* Viewport-aware opening screen and brand mark. */
.brand-logo { display: inline-flex; align-items: center; gap: 12px; white-space: nowrap; }
.brand-logo img { display: block; width: 54px; height: 54px; object-fit: contain; }
.brand-logo span { font: 600 22px/1 var(--display); }
.footer-logo { display: inline-flex; align-items: center; align-self: start; gap: 14px; text-decoration: none; }
.footer-logo img { display: block; width: 92px; height: 92px; object-fit: contain; }
.footer-logo span { font: 600 22px/1.05 var(--display); color: #fff; white-space: nowrap; }
.social-screen { min-height: calc(100svh - 82px); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: var(--paper); }
.social-screen h2 { max-width: 1100px; margin-bottom: 28px; }
.social-screen > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: clamp(20px, 2vw, 28px); }
.social-actions { display: flex; justify-content: center; gap: 18px; margin-top: 38px; }
.social-actions a { min-width: 190px; padding: 16px 28px; border: 1px solid var(--accent); border-radius: 999px; color: var(--accent); font-weight: 600; text-decoration: none; transition: .2s ease; }
.social-actions a:hover { background: var(--accent); color: #fff; }

@media (min-width: 851px) {
  .header { height: 82px; padding-block: 10px; position: sticky; }
  .header nav { position: absolute; left: 50%; transform: translateX(-50%); margin: 0; gap: clamp(28px, 2.4vw, 44px); }
  .header nav a { font-size: 16px; font-weight: 600; }
  .header .nav-cta { margin-left: auto; }
  .hero { height: calc(100svh - 82px); min-height: 620px; }
  .hero-copy { display: flex; flex-direction: column; justify-content: center; padding-block: clamp(30px, 5vh, 70px); }
  .hero-copy .eyebrow { margin-bottom: clamp(10px, 1.7vh, 20px); }
  .hero-copy h1 { font-size: clamp(58px, min(6.1vw, 9.5vh), 108px); margin-bottom: clamp(14px, 2.6vh, 30px); }
  .hero-copy .lead { font-size: clamp(16px, min(1.45vw, 2.35vh), 23px); line-height: 1.45; }
  .hero-copy .lead p + p { margin-top: clamp(10px, 1.6vh, 22px); }
  .hero-copy .button { margin-top: clamp(12px, 2vh, 22px); align-self: flex-start; }
  .hero-photo {
    width: min(100%, calc(100svh - 130px));
    height: auto;
    min-height: 0;
    aspect-ratio: 1 / 1;
    align-self: center;
    justify-self: center;
    background-color: #eee5d7;
    background-image: url('/assets/images/hero-japan.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .hero-photo span, .hero-photo::before { display: none; }

  .statement {
    min-height: calc(100svh - 82px);
    display: grid;
    grid-template-columns: minmax(420px, 1fr) minmax(440px, .95fr);
    grid-template-rows: auto auto auto;
    column-gap: clamp(45px, 6vw, 100px);
    align-content: center;
    align-items: start;
    padding-block: clamp(36px, 6vh, 72px);
  }
  .statement .travel-moment {
    grid-column: 1;
    grid-row: 1 / 4;
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
    margin: 0;
    align-self: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  .statement .eyebrow { grid-column: 2; margin-top: 0; }
  .statement h2 { grid-column: 2; font-size: clamp(52px, min(5.2vw, 8vh), 84px); margin-bottom: clamp(24px, 4vh, 42px); }
  .statement h2 br { margin-top: .18em; }
  .statement p:last-child { grid-column: 2; margin: 0; font-size: clamp(16px, min(1.35vw, 2.2vh), 20px); align-self: start; }

  #format {
    min-height: calc(100svh - 82px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: clamp(34px, 5vh, 62px);
  }
  #format .eyebrow { margin-bottom: clamp(10px, 1.4vh, 18px); }
  #format h2 {
    max-width: 1500px;
    margin-bottom: clamp(24px, 3.5vh, 42px);
    font-size: clamp(46px, min(5vw, 7.5vh), 76px);
    line-height: .96;
  }
  #format h2 br { margin-top: .14em; }
  #format .cards article { padding: clamp(20px, 2.2vw, 30px); }
  #format .cards span { font-size: clamp(40px, 4vw, 52px); }
  #format .cards h3 { margin: 14px 0 10px; font-size: clamp(28px, 2.4vw, 36px); }
  #format .cards p { margin: 0; font-size: clamp(14px, 1.15vw, 17px); line-height: 1.5; }

  .destinations-gallery,
  .destinations-copy {
    min-height: calc(100svh - 82px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-block: clamp(28px, 4vh, 50px);
  }
  .destinations-gallery .eyebrow { margin-bottom: clamp(16px, 2.2vh, 28px); }
  .destinations-gallery .photo-collage { width: 100%; height: auto; max-height: calc(100svh - 190px); aspect-ratio: 16 / 9; margin: 0; background-size: cover; background-color: var(--paper); }
  .destinations-copy h2 { max-width: 1550px; margin: 0 0 clamp(26px, 4vh, 48px); font-size: clamp(48px, min(5.4vw, 7.6vh), 82px); line-height: .98; }
  .destinations-copy > p { max-width: 980px; margin: 0; font-size: clamp(17px, 1.45vw, 22px); line-height: 1.55; }
  .destinations-copy > p br { margin-top: .55em; }

  #process,
  .case-grid,
  .about,
  .contact {
    min-height: calc(100svh - 82px);
    padding-block: clamp(32px, 5vh, 68px);
  }
  #process { display: flex; flex-direction: column; justify-content: center; }
  #process h2 { margin-bottom: clamp(20px, 3vh, 36px); font-size: clamp(42px, min(4.5vw, 6.7vh), 70px); }
  #process .steps li { padding: clamp(14px, 2vh, 25px) 0; }
  #process .steps h3 { margin: 0 0 8px; font-size: clamp(28px, 2.5vw, 36px); }
  #process .steps p { margin: 0; font-size: clamp(14px, 1.15vw, 17px); }

  .case-grid { gap: clamp(38px, 6vw, 90px); }
  .case-grid .case-photo { width: min(100%, 430px); max-height: calc(100svh - 150px); justify-self: center; }
  .case-grid h2 { margin-bottom: clamp(22px, 3vh, 36px); font-size: clamp(45px, min(5vw, 7vh), 76px); }
  .case-grid .case-copy > p:not(.eyebrow) { font-size: clamp(15px, 1.25vw, 19px); line-height: 1.55; }

  .about h2 { margin-bottom: clamp(20px, 3vh, 36px); font-size: clamp(48px, min(5.2vw, 7.3vh), 78px); }
  .about .lead { font-size: clamp(15px, min(1.35vw, 2.1vh), 20px); line-height: 1.48; }
  .about .lead br { margin-top: .65em; }
  .about .person { width: min(100%, 520px); max-height: calc(100svh - 150px); }

  .contact { align-items: center; }
  .contact h2 { margin-bottom: clamp(20px, 3vh, 34px); font-size: clamp(44px, min(4.8vw, 6.8vh), 72px); }
  .contact-photo { width: min(100%, 780px); min-height: 0; height: auto; aspect-ratio: 16 / 9; margin-top: clamp(18px, 2.5vh, 30px); background-size: cover; }
  .contact .form { padding: clamp(20px, 2.4vw, 30px); }
  .contact .form label { margin-bottom: 12px; }
}

@media (min-width: 851px) and (max-height: 760px) {
  .header { height: 70px; }
  .brand-logo img { width: 44px; height: 44px; }
  .hero, .statement, #format, .destinations-gallery, .destinations-copy, #process, .case-grid, .about, .contact { min-height: calc(100svh - 70px); }
  .hero { height: calc(100svh - 70px); }
  .section, .statement { padding-block: 28px; }
  .cards article { padding: 18px 22px; }
  .photo-collage { margin-bottom: 18px; }
}

@media (max-width: 850px) {
  .brand-logo img { width: 46px; height: 46px; }
  .brand-logo span { font-size: 19px; }
  .hero { min-height: auto; }
  .hero-photo { width: 100%; min-height: 0; aspect-ratio: 1 / 1; background-size: cover; background-color: #eee5d7; }
  .hero-photo span, .hero-photo::before { display: none; }
  .statement .travel-moment { min-height: 0; aspect-ratio: 4 / 3; margin: 0 0 46px; background-size: contain; background-color: #eee5d7; }
  .statement h2 br, #format h2 br { margin-top: .18em; }
  .section, .statement { padding-block: clamp(56px, 8vw, 80px); }
  .photo-collage { aspect-ratio: 16 / 9; margin-bottom: 32px; }
  .destinations-gallery .eyebrow { margin-bottom: 18px; }
  .destinations-gallery .photo-collage { background-size: cover; }
  .case-grid { gap: 34px; }
  .case-grid .case-photo { max-height: 62svh; width: auto; max-width: 100%; }
  .about { gap: 34px; }
  .about .person { justify-self: center; max-height: 68svh; width: auto; max-width: 100%; }
}

@media (max-width: 560px) {
  .brand-logo { gap: 8px; }
  .brand-logo img { width: 40px; height: 40px; }
  .brand-logo span { font-size: 16px; }
  h1 { font-size: clamp(48px, 15vw, 66px); }
  h2 { font-size: clamp(40px, 12.5vw, 56px); }
  .hero-copy { padding-block: 44px; }
  .hero-photo { width: 100%; min-height: 0; aspect-ratio: 1 / 1; background-size: cover; }
  .statement .travel-moment { margin-bottom: 34px; }
  .cards { gap: 12px; }
  .cards article { padding: 22px; }
  .case-grid .case-photo { width: 100%; max-height: none; }
  .destinations-gallery .photo-collage { height: auto; aspect-ratio: 16 / 10; }
  .about .person { width: 100%; max-height: none; }
  .social-screen { min-height: 82svh; }
  .social-actions { width: 100%; flex-direction: column; }
  .social-actions a { width: 100%; }
}

/* Photographs are clean: no technical placeholder borders or guide lines. */
.photo-slot,
.hero-photo,
.photo-collage {
  border: none !important;
  outline: none !important;
}
.photo-slot::before,
.hero-photo::before {
  display: none !important;
}
