

.passport-card { display:grid; grid-template-columns:.78fr 1.22fr; overflow:hidden; border:1px solid #d4c8b4; border-radius:30px; background:#f9f5eb; }
.passport-cover,.passport-story { min-height:570px; padding:clamp(32px,5vw,66px); }
.passport-cover { display:flex; flex-direction:column; align-items:center; justify-content:center; background:#1d1713; color:#fff7e7; text-align:center; }
.passport-cover > span { margin:32px 0 8px; color:#d5b56e; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.passport-cover h2 { font:500 22px/1 var(--serif); }
.passport-qr { width:150px; height:150px; margin:28px 0; padding:15px; display:grid; grid-template-columns:repeat(3,1fr); gap:7px; border-radius:14px; background:#fff9ec; }
.passport-qr i { background:#1d1713; }
.passport-qr i:nth-child(2),.passport-qr i:nth-child(6),.passport-qr i:nth-child(8) { border-radius:50%; background:#c9a45e; }
.passport-cover small { color:#b9aa99; }
.passport-story { display:flex; flex-direction:column; justify-content:center; }
.passport-story h2 { margin:18px 0; font:500 clamp(40px,5vw,66px)/.98 var(--serif); }
.passport-story > p { max-width:700px; color:#6b6358; font-size:17px; line-height:1.66; }
.passport-facts { margin:30px 0; display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #d9cfbd; border-bottom:1px solid #d9cfbd; }
.passport-facts span { padding:20px 16px; border-right:1px solid #d9cfbd; }
.passport-facts span:last-child { border:0; }
.passport-facts small,.passport-facts strong { display:block; }
.passport-facts small { margin-bottom:8px; color:#9a825c; text-transform:uppercase; letter-spacing:.08em; }
.passport-actions { display:flex; flex-wrap:wrap; gap:10px; }
.passport-actions button,.passport-actions a { min-height:46px; padding:0 18px; display:inline-flex; align-items:center; border:1px solid #bba98c; border-radius:999px; background:transparent; font-weight:700; }

@media (max-width:600px) {
  .passport-cover { min-height:430px; }
  .passport-facts { grid-template-columns:1fr; }
  .passport-facts span { border-right:0; border-bottom:1px solid #d9cfbd; }
  .passport-actions button,.passport-actions a { width:100%; justify-content:center; }
}

@media (max-width:540px) {
  .passport-cover {
    min-height: 360px;
  }
}
.passport-page {
  --passport-ink: #171511;
  --passport-muted: #70695f;
  --passport-gold: #9d742c;
  --passport-line: #ddd3c2;
  --passport-paper: #fbf8f1;
  padding-bottom: 80px;
  color: var(--passport-ink);
}

.passport-page .passport-card {
  width: min(1280px, calc(100% - 32px));
  margin-top: 40px;
  grid-template-columns: minmax(340px,.72fr) minmax(0,1.28fr);
  overflow: hidden;
  border: 1px solid var(--passport-line);
  border-radius: 28px;
  background: var(--passport-paper);
  box-shadow: 0 22px 58px rgba(63,49,27,.07);
}

.passport-page .passport-cover,
.passport-page .passport-story {
  min-height: 520px;
  padding: clamp(38px,4.6vw,64px);
}

.passport-page .passport-cover {
  position: relative;
  isolation: isolate;
  justify-content: center;
  background:
    radial-gradient(circle at 18% 12%,rgba(186,144,69,.18),transparent 35%),
    linear-gradient(145deg,#211b16,#17130f);
}

.passport-page .passport-cover::after {
  content: "";
  position: absolute;
  inset: 20px;
  z-index: -1;
  border: 1px solid rgba(218,185,121,.18);
  border-radius: 20px;
  pointer-events: none;
}

.passport-page .passport-cover > span {
  margin: 27px 0 10px;
  color: #d2ad68;
  font-size: 9.5px;
  font-weight: 720;
  line-height: 1.25;
  letter-spacing: .18em;
}

.passport-page .passport-cover h2 {
  margin: 0;
  color: #fffaf0;
  font-family: var(--font-geist),Arial,sans-serif;
  font-size: clamp(19px,1.65vw,23px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.025em;
}

.passport-page .passport-qr {
  width: 138px;
  height: 138px;
  margin: 27px 0 24px;
  padding: 14px;
  gap: 6px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 19px;
  background: #fffaf0;
  box-shadow: 0 15px 35px rgba(0,0,0,.2);
}

.passport-page .passport-qr i {
  border-radius: 3px;
  background: #201a15;
}

.passport-page .passport-qr i:nth-child(2),
.passport-page .passport-qr i:nth-child(6),
.passport-page .passport-qr i:nth-child(8) {
  background: #b88a36;
}

.passport-page .passport-cover small {
  color: #bdb2a2;
  font-size: 11px;
  font-weight: 430;
  line-height: 1.45;
}

.passport-page .passport-story {
  justify-content: center;
  background:
    radial-gradient(circle at 100% 0,rgba(210,180,119,.14),transparent 31%),
    #fbf8f1;
}

.passport-page .passport-story > .eyebrow {
  color: var(--passport-gold);
  font-size: 9.5px;
  font-weight: 720;
  line-height: 1.3;
  letter-spacing: .18em;
}

.passport-page .passport-story h2 {
  max-width: 690px;
  margin: 15px 0 18px;
  font-size: clamp(36px,3.6vw,50px);
  font-weight: 480;
  line-height: .99;
  letter-spacing: -.058em;
  text-wrap: balance;
}

.passport-page .passport-story > p {
  max-width: 680px;
  margin: 0;
  color: var(--passport-muted);
  font-size: 14px;
  font-weight: 420;
  line-height: 1.7;
}

.passport-page .passport-facts {
  margin: 30px 0 28px;
  border-color: var(--passport-line);
}

.passport-page .passport-facts span {
  min-width: 0;
  padding: 18px 16px;
  border-color: var(--passport-line);
}

.passport-page .passport-facts small {
  margin-bottom: 7px;
  color: #957643;
  font-size: 9px;
  font-weight: 680;
  line-height: 1.25;
  letter-spacing: .1em;
}

.passport-page .passport-facts strong {
  color: #2b2822;
  font-size: 12.5px;
  font-weight: 560;
  line-height: 1.4;
}

.passport-page .passport-actions {
  gap: 9px;
}

.passport-page .passport-actions button,
.passport-page .passport-actions a {
  min-height: 46px;
  padding: 0 18px;
  justify-content: center;
  border: 1px solid #cbbb9f;
  border-radius: 999px;
  color: #2a251e;
  background: rgba(255,255,255,.56);
  font: 580 11.5px/1.15 var(--font-geist),Arial,sans-serif;
  transition: transform .18s ease,border-color .18s ease,background .18s ease;
}

.passport-page .passport-actions button {
  border-color: #1d1914;
  color: #fffaf0;
  background: #1d1914;
}

.passport-page .passport-actions :is(button,a):hover {
  transform: translateY(-1px);
}

.passport-page .passport-actions a:hover {
  border-color: #a47b32;
  background: #f5ecd9;
}

@media (max-width: 900px) {
  .passport-page .passport-card {
    grid-template-columns: 1fr;
  }

  .passport-page .passport-cover {
    min-height: 410px;
  }

  .passport-page .passport-story {
    min-height: 0;
  }
}

@media (max-width: 600px) {
  .passport-page {
    padding-bottom: 56px;
  }

  .passport-page .passport-card {
    width: calc(100% - 20px);
    margin-top: 22px;
    border-radius: 21px;
  }

  .passport-page .passport-cover,
  .passport-page .passport-story {
    padding: 28px 20px;
  }

  .passport-page .passport-cover {
    min-height: 350px;
  }

  .passport-page .passport-cover::after {
    inset: 12px;
    border-radius: 15px;
  }

  .passport-page .passport-cover > span {
    margin-top: 22px;
    font-size: 9px;
  }

  .passport-page .passport-cover h2 {
    font-size: 19px;
  }

  .passport-page .passport-qr {
    width: 120px;
    height: 120px;
    margin: 23px 0 20px;
    padding: 12px;
  }

  .passport-page .passport-story > .eyebrow {
    font-size: 9px;
  }

  .passport-page .passport-story h2 {
    margin: 13px 0 15px;
    font-size: clamp(29px,8.7vw,36px);
    line-height: 1.01;
  }

  .passport-page .passport-story > p {
    font-size: 13px;
    line-height: 1.65;
  }

  .passport-page .passport-facts {
    margin: 24px 0 22px;
  }

  .passport-page .passport-facts span {
    padding: 14px 3px;
  }

  .passport-page .passport-facts strong {
    font-size: 12px;
  }

  .passport-page .passport-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .passport-page .passport-actions button,
  .passport-page .passport-actions a {
    width: 100%;
    min-height: 45px;
    padding-inline: 14px;
    font-size: 11.5px;
  }
}
.passport-cover .angroos-brand-studio .angroos-brand-image { width: min(230px, 72vw); }