/* Uriym's type (November 6, 2026), as on uriym.com/new-homepage: one family, Inter. Its optical-size
   axis gives Inter Display at headline sizes, set light and tight (see "Type" at the end); text is
   Inter at reading sizes. The file keeps weights 300 to 600 and the characters the copy uses
   (scripts/subset-fonts.py builds it; this unicode-range declares the same). */
@font-face {
  font-family: "Inter";
  src: url("./fonts/Inter-normal-300-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  unicode-range: U+0020-007E, U+00A0-00FF, U+2010-2027, U+2030-2033, U+2039-203A, U+20AC, U+2122, U+2190-2199, U+2212;
}
:root {
  --cream: #f7f2e9;
  --paper: #fffdf8;
  --ink: #242422;
  --muted: #66615a;
  --gold: #92713f;
  --gold-text: #7a633e;
  --accent: #b39158;
  --accent-pale: #eee2cd;
  --line: #d9ccba;
  --charcoal: #242422;
  --taupe: #e9dfd0;
  --ivory-deep: #f1e9dd;
  --stone: #e8ddcd;
  --surface-shadow: rgba(38, 32, 25, 0.18);
  --motion-soft: cubic-bezier(.2, .7, .2, 1);
  --font-display: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;
}
* {
  box-sizing: border-box;
}
html {
  scroll-padding-top: 24px;
}
/* Links within a page scroll smoothly once it has loaded (preview.js adds the class); a link
   from another page lands on its section at once. */
@media (prefers-reduced-motion: no-preference) {
  html.smooth-scroll { scroll-behavior: smooth; }
}
body {
  margin: 0;
  background-color: var(--cream);
  background-image:
    radial-gradient(circle at 12% 8%, rgba(255,255,255,.72), transparent 28%),
    radial-gradient(circle at 86% 32%, rgba(179,145,88,.10), transparent 24%),
    repeating-linear-gradient(108deg, rgba(36,36,34,.018) 0 1px, transparent 1px 5px);
  color: var(--ink);
  font: 400 15px/1.7 var(--font-body);
}
a {
  color: inherit;
  text-decoration: none;
}
button,
select {
  font: inherit;
  color: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:not(.button) {
  border: 0;
  background: none;
  padding: 0;
}
button:focus-visible,
a:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 5px;
}
h1,
h2,
h3,
p,
figure {
  margin: 0;
}
h1,
h2,
h3 {
  font-family: var(--font-display);
  font-weight: 400;
  font-optical-sizing: auto;
  font-synthesis: none;
}
h1 {
  font-size: clamp(62px, 6.1vw, 88px);
  line-height: 1.08;
  letter-spacing: -3px;
}
h2 {
  font-size: clamp(40px, 4.1vw, 59px);
  line-height: 1.12;
  letter-spacing: -1.8px;
}
h3 {
  font-size: 31px;
  line-height: 1.2;
  letter-spacing: -0.7px;
}
em {
  color: var(--gold);
  font-weight: 400;
}
.wrap {
  max-width: 1280px;
  width: calc(100% - 112px);
  margin-inline: auto;
}
.eyebrow {
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: 1.8px;
  font-weight: 500;
  margin-bottom: 22px;
}
.section {
  padding-block: 100px;
}

.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 100px;
  gap: 25px;
}

.header nav {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 11px;
}
.header nav > a {
  white-space: nowrap;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  background: var(--ink);
  border: 1px solid var(--ink);
  color: var(--cream);
  padding: 16px 23px;
  line-height: 1.5;
  font-size: 12px;
  transition:
    background-color .3s ease,
    transform .4s var(--motion-soft),
    box-shadow .4s var(--motion-soft);
}
.button:hover {
  background: #34332f;
  transform: scale(1.02);
  box-shadow: 0 16px 34px -18px rgba(48,45,42,.52);
}
.button.small {
  padding: 12px 15px;
  font-size: 12px;
  white-space: nowrap;
}
.text-link {
  display: inline-flex;
  gap: 16px;
  align-items: center;
  font-size: 12px;
  border-bottom: 1px solid currentColor !important;
  padding-bottom: 6px !important;
  line-height: 1.6;
}
.menu-toggle {
  display: none;
}
.skip {
  position: fixed;
  left: 20px;
  top: -100px;
  background: white;
  z-index: 10;
  padding: 12px;
}
.skip:focus {
  top: 15px;
}
.hero-script {
  font-family: var(--font-display);
  font-size: 1em;
  letter-spacing: 0;
  font-style: italic;
  display: inline-block;
  line-height: 1.2;
  padding-right: 0.1em;
}
.intro {
  font-size: 15px;
  max-width: 390px;
  color: var(--muted);
  margin: 23px 0 30px;
  line-height: 1.8;
}
.hero-actions {
  display: flex;
  gap: 25px;
  align-items: center;
  flex-wrap: wrap;
}

.section-heading {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 70px;
  margin-bottom: 42px;
}
.section-heading > p {
  max-width: 380px;
  font-size: 14px;
  color: var(--muted);
}
.care-heading-copy {
  max-width: 440px;
  color: var(--muted);
  font-size: 14px;
}
.category-column {
  min-width: 0;
}
/* Under the categories: the way to ask about care that is not listed. */
.care-more {
  margin-top: 22px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}
.care-more a {
  color: var(--ink);
  font-weight: 500;
  white-space: nowrap;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.care-more a:hover {
  color: var(--gold-text);
}
.explorer-grid {
  display: grid;
  grid-template-columns: 270px 1fr;
  gap: 56px;
  align-items: start;
}
.category-menu {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--line);
}
.category-menu button {
  text-align: left;
  display: flex;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid var(--line) !important;
  padding: 17px 0 !important;
  font-size: 14px;
  min-height: 61px;
  color: var(--muted);
}
.category-menu button span:first-child {
  font-size: 11px;
  color: var(--gold-text);
}
.category-menu button span:last-child {
  margin-left: auto;
}
.category-menu button[aria-pressed="true"] {
  color: var(--ink);
  font-weight: 500;
}
.category-menu button[aria-pressed="true"]:after {
  content: "";
  width: 20px;
  height: 1px;
  background: var(--gold);
}
.category-stage {
  position: relative;
  padding: 0 0 65px;
  min-width: 0;
}
.category-image {
  height: 440px;
  width: 73%;
  position: relative;
  overflow: hidden;
}
.category-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: none;
  transition: opacity 0.2s;
}
.category-sheet {
  position: absolute;
  right: 0;
  bottom: 0;
  background: var(--paper);
  width: 60%;
  padding: 31px 34px;
  box-shadow: 0 18px 45px rgba(38,32,25,.12);
  border: 1px solid #e0d5c5;
  min-height: 260px;
}
.category-sheet .eyebrow {
  font-size: 11px;
  margin-bottom: 13px;
}
.category-sheet h3 {
  font-size: 39px;
  line-height: 1.1;
  margin-bottom: 16px;
}
.category-sheet p:not(.eyebrow) {
  font-size: 13px;
  color: var(--muted);
}
.procedure-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 22px;
}
.procedure-links button {
  padding: 7px 10px !important;
  background: #f3ece1 !important;
  border: 1px solid #e1d4c1 !important;
  border-radius: 2px;
  font-size: 12px;
  line-height: 1.5;
  text-align: left;
}
.procedure-links button:hover {
  background: var(--accent-pale) !important;
}
.pricing {
  background: var(--charcoal);
  color: var(--cream);
  padding: 76px 0 90px;
  position: relative;
}
.price-layout {
  display: grid;
  grid-template-columns: 0.8fr 1.5fr;
  gap: 70px;
  align-items: start;
}
.price-intro {
  padding-top: 25px;
}
.price-intro .eyebrow {
  color: #d0b990;
}
.price-intro h2 {
  font-size: 52px;
}
.price-intro em {
  color: #d2b57f;
}
.price-intro > p:not(.eyebrow) {
  font-size: 14px;
  color: #ded2c6;
  margin: 26px 0;
}
/* "View all treatment costs" comes after the price card, in its column. */
.price-layout {
  row-gap: 34px;
}
.price-all {
  grid-column: 2;
  justify-self: start;
  margin-top: 6px;
  color: #e4c998;
}
.pricing-paper {
  background: var(--paper);
  color: var(--ink);
  padding: 30px 35px;
  box-shadow: 14px 16px 0 #a188622e;
  min-width: 0;
}
.pricing-meta {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
  font-size: 11px;
  letter-spacing: 1.5px;
}
.pricing-controls {
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  gap: 20px;
  padding: 23px 0;
}
.pricing-controls label {
  font-size: 12px;
  color: var(--muted);
}
.pricing-controls select {
  display: block;
  width: 100%;
  min-width: 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #b5a797;
  font-size: 12px;
  padding: 12px 22px 12px 0;
  border-radius: 0;
  text-overflow: ellipsis;
}
#price-results h3 {
  font-size: 32px;
  margin: 2px 0 12px;
}
.procedure-description {
  font-size: 12px;
  color: var(--muted);
  margin: 0 0 24px;
}
.range-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  background: #f3ece1;
  padding: 23px 22px;
  margin-top: 24px;
}
.range-pair .eyebrow {
  margin-bottom: 10px;
  font-size: 11px;
  letter-spacing: 1.2px;
}
.range-amount {
  font: 500 21px/1.4 var(--font-body);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.9px;
  white-space: nowrap;
}
.range-amount.is-reference {
  white-space: normal;
  font-size: 17px;
  line-height: 1.45;
}
.price-reference {
  margin-top: 14px;
  font-size: 12px;
  line-height: 1.65;
  color: var(--muted);
}
.price-reference a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.range-unit {
  font-size: 12px;
  margin-top: 15px;
  color: var(--muted);
}
.price-source {
  margin-top: 21px;
  font-size: 12px;
  color: var(--muted);
}
.price-source p + p {
  margin-top: 7px;
}

.pricing-bottom {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: center;
  margin-top: 25px;
}
.pricing-bottom > span {
  font-size: 12px;
  max-width: 110px;
  color: var(--muted);
}
.monthly-details {
  border-top: 1px solid var(--line);
  margin-top: 25px;
  font-size: 12px;
}
.monthly-details summary {
  padding-top: 18px;
  display: flex;
  justify-content: space-between;
  gap: 15px;
}
.monthly-details div {
  font-size: 12px;
  color: var(--muted);
  padding-top: 15px;
}
.monthly-details article {
  padding-block: 16px;
  border-bottom: 1px solid var(--line);
}
.monthly-details h3 {
  font: 500 14px var(--font-body);
}
.journey {
  display: grid;
  grid-template-columns: 1fr 1.18fr;
  gap: 95px;
  position: relative;
  isolation: isolate;
  --journey-progress: 0%;
}
.journey::before {
  content: "";
  position: absolute;
  z-index: -2;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background:
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.72), transparent 27%),
    radial-gradient(circle at 82% 76%, rgba(179,145,88,.13), transparent 31%),
    repeating-linear-gradient(12deg, rgba(36,36,34,.018) 0 1px, transparent 1px 6px),
    var(--ivory-deep);
}
.journey-aside {
  min-width: 0;
}
.journey-lead {
  margin: 25px 0;
  font-size: 12px;
  color: var(--muted);
}

.journey-photo {
  height: 370px;
  position: relative;
  overflow: hidden;
  margin-top: 40px;
  width: 90%;
  border-radius: 72px 6px 6px 6px;
  box-shadow: 0 24px 50px -30px var(--surface-shadow);
}
.journey-photo img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform: scale(1.055);
  will-change: transform;
}
.journey-photo:after {
  content: "";
  position: absolute;
  inset: 20% 0 0;
  background: linear-gradient(transparent, rgba(28,27,25,.86));
}
.journey-photo-note {
  position: absolute;
  z-index: 1;
  left: 22px;
  bottom: 40px;
  color: var(--paper);
  font: 400 25px/1.2 var(--font-display);
}
.journey-photo-note em {
  color: #e2c995;
}
.journey-tools {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--line);
  padding-bottom: 24px;
  gap: 20px;
}
.journey-tools > span {
  font-size: 11px;
  letter-spacing: 1.5px;
}
.journey-tools .text-link {
  font-size: 12px;
}
.journey-timeline {
  position: relative;
  padding-left: 42px;
}
.journey-timeline::before,
.journey-timeline::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 72px;
  width: 1px;
  border-radius: 999px;
}
.journey-timeline::before {
  bottom: 15px;
  background: #cfc4b4;
}
.journey-timeline::after {
  height: var(--journey-progress);
  max-height: calc(100% - 87px);
  background: var(--gold);
  box-shadow: 0 0 12px rgba(139,107,53,.24);
  transition: height .18s linear;
}
#journey-steps {
  counter-reset: uriym-stage;
}
.journey-step {
  border-bottom: 1px solid var(--line);
  position: relative;
  counter-increment: uriym-stage;
  transition: transform .55s var(--motion-soft), background-color .55s ease, box-shadow .55s ease;
}
.journey-step summary {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 24px 0;
}
.journey-step summary::before {
  content: "0" counter(uriym-stage);
  position: absolute;
  left: -42px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--ivory-deep);
  border: 1px solid #c8b89f;
  color: var(--muted);
  font-size: 8px;
  letter-spacing: 0;
  z-index: 2;
  transition: background-color .45s ease, color .45s ease, transform .45s var(--motion-soft);
}
.journey-step.is-current {
  transform: translateX(8px);
  background: rgba(255,253,248,.56);
  box-shadow: -12px 0 28px -28px var(--surface-shadow);
}
.journey-step.is-current summary::before,
.journey-step[open] summary::before {
  background: var(--gold);
  color: var(--paper);
  transform: scale(1.12);
}

.journey-step h3 {
  font-size: 36px;
}
.journey-step .plus {
  margin-left: auto;
  font-size: 20px;
  color: var(--gold);
}
.journey-step[open] .plus {
  transform: rotate(45deg);
}
.journey-step[open] h3 {
  font-style: italic;
  color: var(--gold);
}
.journey-step > p {
  font-size: 14px;
  line-height: 1.85;
  padding: 0 12px 27px 36px;
  color: var(--muted);
}

.glow {
  background: #eee5d8;
  padding: 80px 0;
  overflow: hidden;
}
.glow-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  align-items: center;
}
.glow-copy > p:not(.eyebrow) {
  font-size: 14px;
  max-width: 410px;
  margin-top: 23px;
  color: var(--muted);
}

.glow-copy .fine-print {
  font-size: 12px !important;
  margin: 20px 0 24px !important;
}
.trip-scene {
  position: relative;
  padding: 30px 0 0 30px;
}
.trip-card-back {
  position: absolute;
  top: 0;
  right: 5px;
  bottom: 15px;
  left: 0;
  background: var(--charcoal);
  transform: rotate(-5deg);
  color: var(--cream);
  display: flex;
  justify-content: space-between;
  padding: 16px 20px;
  font-size: 8px;
  letter-spacing: 1px;
  box-shadow: 0 10px 25px rgba(38,32,25,.18);
}
.trip-card-back em {
  color: inherit;
  font-family: var(--font-display);
  font-size: 13px;
  letter-spacing: 0;
}
.trip-paper {
  position: relative;
  background: var(--paper);
  padding: 35px 32px 85px;
  box-shadow: 10px 12px 35px rgba(38,32,25,.16);
  min-height: 400px;
}
.trip-paper h3 {
  font-size: 38px;
  max-width: 340px;
  margin-bottom: 22px;
}
.trip-paper > p:not(.eyebrow) {
  font-size: 12px;
  color: var(--muted);
}
.trip-paper ol {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
}
.trip-paper li {
  border-top: 1px solid var(--line);
  padding: 12px 0;
  font-size: 12px;
  display: flex;
  gap: 15px;
}
.trip-paper li span {
  font-size: 11px;
  color: var(--gold-text);
}
.trip-stamp {
  position: absolute;
  bottom: 18px;
  right: 24px;
  border: 1px solid #b59c7b;
  border-radius: 50%;
  width: 65px;
  height: 65px;
  text-align: center;
  display: grid;
  place-content: center;
  font: 400 19px/1.2 var(--font-display);
  transform: rotate(-13deg);
  color: var(--gold);
}
.provider-invitation {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
  padding: 65px 70px;
  background: var(--accent-pale);
  margin-block: 85px 0;
  overflow: hidden;
}
.provider-invitation > div {
  position: relative;
  z-index: 1;
}
.provider-invitation p:not(.eyebrow) {
  font-size: 14px;
  max-width: 370px;
  margin: 14px 0 24px;
}
.provider-invitation-mark {
  position: absolute;
  right: 15px;
  bottom: -125px;
  font: 400 390px var(--font-display);
  color: #ddc9a8;
  line-height: 1;
  pointer-events: none;
}
.home-faq .faq-list {
  max-width: 760px;
  margin-inline: auto;
}
.faq-list {
  padding-top: 5px;
}
.faq-list details {
  border-bottom: 1px solid var(--line);
}
summary {
  cursor: pointer;
  list-style: none;
}
summary::-webkit-details-marker {
  display: none;
}
.faq-list summary {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 0;
  font-size: 13px;
}
.faq-list details p {
  padding: 0 15px 20px 0;
  font-size: 12px;
  color: var(--muted);
}
.faq-list summary span {
  color: var(--gold);
  font-size: 18px;
}
.faq-list details[open] summary span {
  transform: rotate(45deg);
}
footer {
  border-top: 1px solid var(--line);
  padding: 38px 0 25px;
}
.footer-top {
  display: flex;
  align-items: center;
  gap: 35px;
}
.footer-top > p {
  font-size: 12px;
  color: var(--muted);
}
.footer-top > div {
  margin-left: auto;
  display: flex;
  gap: 20px;
  font-size: 12px;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--muted);
  margin-top: 30px;
  gap: 20px;
}

/* Dedicated provider page and readable catalog fallback. */
.provider-hero {
  display: grid;
  grid-template-columns: 1.12fr 1fr;
  gap: 80px;
  padding: 65px 0 85px;
  align-items: center;
}
.provider-hero h1 {
  font-size: clamp(56px, 5.5vw, 80px);
  line-height: 1.1;
}
.provider-hero .intro {
  max-width: 430px;
}
.provider-art {
  height: 490px;
  background: #d9c8b0;
  position: relative;
  padding: 34px;
  overflow: hidden;
}
.provider-art:before {
  content: "";
  position: absolute;
  inset: 70px -120px -70px 60px;
  border: 1px solid #aa8b61;
  border-radius: 50%;
  transform: rotate(-25deg);
}
.provider-art .eyebrow {
  position: relative;
  z-index: 1;
}
.practice-sheet h2 {
  font-size: 31px;
  line-height: 1.2;
  letter-spacing: -0.7px;
}
.practice-sheet {
  position: absolute;
  left: 45px;
  right: 25px;
  top: 115px;
  padding: 30px;
  background: var(--paper);
  transform: rotate(-3deg);
  box-shadow: 10px 20px 40px #5f422c21;
}
.practice-sheet h2 {
  font-size: 34px;
  margin: 13px 0 25px;
}
.practice-sheet p {
  padding: 10px 0;
  border-top: 1px solid var(--line);
  font-size: 12px;
}
.provider-intro {
  background: var(--charcoal);
  padding: 70px 0;
  color: var(--cream);
}
.provider-intro .wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 100px;
}
.provider-intro em {
  color: #d2b57f;
}
.provider-intro p {
  font-size: 15px;
  color: #e4d7ca;
}
.provider-values {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 55px;
}
.provider-values article {
  border-top: 1px solid var(--line);
  padding-top: 25px;
}
.provider-values h3 {
  margin-bottom: 18px;
}
.provider-values p {
  font-size: 13px;
  color: var(--muted);
}
.partner-steps {
  background: var(--taupe);
  padding: 60px;
  margin-bottom: 80px;
}
.partner-steps .section-heading {
  align-items: center;
}
.partner-steps ol {
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  margin-top: 40px;
}
.partner-steps li span {
  color: var(--gold-text);
  font-size: 11px;
  display: block;
  margin-bottom: 20px;
}
.partner-steps li h3 {
  font-size: 30px;
  margin-bottom: 15px;
}
.partner-steps li p {
  font-size: 13px;
  color: var(--muted);
}
.partner-note {
  font-size: 12px;
  color: var(--muted);
  margin-top: 35px;
}
.provider-close {
  max-width: 680px;
  text-align: center;
  margin: 0 auto 80px;
}
.provider-close p {
  margin: 25px 0;
  color: var(--muted);
  font-size: 14px;
}
.catalog-page h1 {
  margin: 40px 0 25px;
  font-size: 65px;
}
.catalog-intro {
  max-width: 740px;
  font-size: 14px;
  margin-bottom: 35px;
}
.catalog-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin: 30px 0;
}
.catalog-table th {
  text-align: left;
  background: var(--charcoal);
  color: var(--cream);
  font-weight: 500;
  padding: 15px;
}
.catalog-table td {
  padding: 17px 15px;
  border-bottom: 1px solid var(--line);
}
.catalog-table td:nth-child(n + 2) {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.catalog-table caption {
  text-align: left;
  font-size: 22px;
  font-family: var(--font-display);
  margin-bottom: 15px;
}
.catalog-note {
  font-size: 13px;
  color: var(--muted);
  margin: 25px 0 60px;
}
@media (max-width: 1150px) {
  .wrap {
    width: calc(100% - 64px);
  }
  .header nav {
    gap: 15px;
    font-size: 10px;
  }
  .header .button.small {
    font-size: 10px;
    padding: 10px;
  }
  h1 {
    font-size: 7vw;
  }
  .explorer-grid {
    grid-template-columns: 220px 1fr;
    gap: 32px;
  }
  .category-sheet {
    width: 68%;
    padding: 25px;
  }
  .category-sheet h3 {
    font-size: 33px;
  }
  .price-layout {
    gap: 35px;
    grid-template-columns: 0.75fr 1.4fr;
  }
  .price-intro h2 {
    font-size: 43px;
  }
  .pricing-paper {
    padding: 26px;
  }
  .range-amount {
    font-size: 18px;
  }
  .journey {
    gap: 55px;
  }
  .glow-grid {
    gap: 60px;
  }
  .provider-invitation {
    gap: 50px;
    padding: 50px;
  }
  .provider-hero {
    gap: 40px;
  }
  .provider-art {
    height: 450px;
  }
  .provider-intro .wrap {
    gap: 50px;
  }
}
@media (max-width: 900px) {
  .header {
    min-height: 84px;
    flex-wrap: wrap;
  }
  .menu-toggle {
    display: flex;
    gap: 12px;
    align-items: center;
    min-height: 44px;
    font-size: 12px !important;
  }
  .header nav {
    display: none;
    width: 100%;
    padding: 0 0 23px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .header nav.is-open {
    display: flex;
  }
  .header nav > a {
    font-size: 13px;
    padding: 10px 0;
  }
  .header nav > .button {
    align-self: flex-start;
    margin-top: 12px;
  }
  .price-layout {
    grid-template-columns: 1fr;
  }
  .price-intro {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 40px;
    padding: 0;
  }
  .price-intro .eyebrow {
    grid-column: 1/-1;
  }
  .price-intro > p:not(.eyebrow) {
    margin: 0;
  }
  .price-all {
    grid-column: 1;
  }
  .pricing-paper {
    margin-top: 15px;
  }
  .range-amount {
    font-size: 24px;
  }
  .journey {
    gap: 35px;
    grid-template-columns: 0.9fr 1.1fr;
  }
  .journey h2 {
    font-size: 42px;
  }
  .journey-step h3 {
    font-size: 31px;
  }
  .journey-step > p {
    padding-left: 0;
  }
  .glow-grid {
    gap: 40px;
  }
  .trip-paper {
    padding: 28px 25px 85px;
  }
  .trip-paper h3 {
    font-size: 31px;
  }
  .provider-values {
    gap: 30px;
  }
  .provider-hero h1 {
    font-size: 55px;
  }
}
@media (max-width: 640px) {
  .wrap {
    width: calc(100% - 40px);
  }
  body {
    font-size: 14px;
  }

  .section {
    padding-block: 65px;
  }
  .hero-actions {
    gap: 22px;
  }

  .section-heading {
    display: block;
    margin-bottom: 28px;
  }
  h2 {
    font-size: 42px;
    letter-spacing: -1.4px;
  }
  .section-heading > p {
    font-size: 13px;
    margin-top: 20px;
    max-width: none;
  }
  .explorer-grid {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .category-menu {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 7px;
    border: 0;
  }
  .category-menu button {
    display: block;
    font-size: 12px;
    min-height: 0;
    padding: 8px 10px !important;
    border: 1px solid var(--line) !important;
    line-height: 1.4;
  }
  .category-menu button[aria-pressed="true"] {
    background: var(--ink);
    color: var(--cream);
  }
  .category-menu button span:first-child,
  .category-menu button span:last-child,
  .category-menu button[aria-pressed="true"]:after {
    display: none;
  }
  .category-image {
    height: 300px;
    width: 92%;
  }
  .category-stage {
    padding-bottom: 0;
  }
  .category-sheet {
    position: relative;
    width: calc(100% - 20px);
    margin: -50px 0 0 auto;
    right: auto;
    bottom: auto;
    padding: 24px;
    min-height: 0;
  }
  .category-sheet h3 {
    font-size: 32px;
  }
  .category-sheet p:not(.eyebrow) {
    font-size: 12px;
  }
  .pricing {
    padding: 55px 0;
  }
  .price-intro {
    display: block;
  }
  .price-intro h2 {
    font-size: 42px;
  }
  .price-intro > p:not(.eyebrow) {
    font-size: 13px;
    margin: 23px 0;
  }
  .price-layout {
    gap: 24px;
  }
  .pricing-paper {
    padding: 22px 18px;
    box-shadow: 7px 8px 0 #a188622e;
  }
  .pricing-meta {
    font-size: 11px;
    letter-spacing: 1px;
    gap: 10px;
  }
  .pricing-controls {
    grid-template-columns: 1fr;
    gap: 15px;
    padding: 23px 0;
  }
  .pricing-controls select {
    font-size: 12px;
  }
  .range-pair {
    padding: 20px 12px;
    gap: 17px;
    grid-template-columns: 1fr;
  }
  .range-pair > div + div {
    padding-top: 17px;
    border-top: 1px solid #d9cbb8;
  }
  .range-amount {
    font-size: 24px;
    letter-spacing: -0.5px;
  }
  #price-results h3 {
    font-size: 29px;
  }
  .price-source {
    font-size: 12px;
  }
  .pricing-bottom {
    display: block;
  }
  .pricing-bottom > span {
    display: block;
    margin-top: 12px;
    max-width: none;
  }
  .journey {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .journey-aside {
    display: flex;
    flex-direction: column;
  }
  .journey-aside .eyebrow {
    margin-bottom: 18px;
  }
  .journey-lead {
    font-size: 12px;
    margin: 18px 0;
  }

  .journey-photo {
    display: none;
  }
  .journey-tools {
    padding-bottom: 15px;
  }
  .journey-step summary {
    padding: 20px 0;
    gap: 15px;
  }
  .journey-step h3 {
    font-size: 33px;
  }
  .journey-step > p {
    font-size: 13px;
    padding: 0 0 23px 30px;
  }

  .glow {
    padding: 55px 0;
  }
  .glow-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .glow-copy > p:not(.eyebrow) {
    font-size: 13px;
  }

  .trip-scene {
    padding: 24px 0 0 18px;
  }
  .trip-paper {
    min-height: 380px;
  }
  .trip-paper h3 {
    font-size: 34px;
  }
  .provider-invitation {
    grid-template-columns: 1fr;
    gap: 15px;
    padding: 34px 27px;
    margin-top: 60px;
  }
  .provider-invitation h2 {
    font-size: 40px;
  }
  .provider-invitation p:not(.eyebrow) {
    font-size: 13px;
  }
  .provider-invitation-mark {
    font-size: 330px;
    bottom: -80px;
    right: -40px;
  }
  .faq-list summary {
    font-size: 12px;
  }
  .footer-top {
    flex-wrap: wrap;
    gap: 20px;
  }
  .footer-top > div {
    margin: 0;
    width: 100%;
    gap: 22px;
  }
  .footer-bottom {
    display: block;
  }
  .footer-bottom p {
    margin-top: 12px;
  }
  footer {
    padding-top: 30px;
  }

  .provider-hero {
    grid-template-columns: 1fr;
    gap: 35px;
    padding: 35px 0 55px;
  }
  .provider-hero h1 {
    font-size: clamp(46px, 13vw, 62px);
    letter-spacing: -1.7px;
  }
  .provider-art {
    height: 390px;
    padding: 26px;
  }
  .practice-sheet {
    left: 30px;
    right: 20px;
    top: 105px;
    padding: 25px;
  }
  .provider-intro .wrap {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .provider-intro {
    padding: 50px 0;
  }
  .provider-intro p {
    font-size: 14px;
  }
  .provider-values {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .partner-steps {
    padding: 30px 25px;
    margin-bottom: 60px;
  }
  .partner-steps ol {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .partner-steps li span {
    margin-bottom: 12px;
  }
  .provider-close {
    padding-inline: 25px;
    margin-bottom: 55px;
  }
  .catalog-page h1 {
    font-size: 47px;
  }
  .catalog-table,
  .catalog-table tbody,
  .catalog-table tr,
  .catalog-table td {
    display: block;
  }
  .catalog-table thead {
    display: none;
  }
  .catalog-table tr {
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
  }
  .catalog-table td {
    padding: 5px 0;
    border: 0;
    white-space: normal !important;
  }
  .catalog-table td[data-label]:before {
    content: attr(data-label) ": ";
    font-weight: 500;
  }
  .catalog-table td:first-child {
    font-weight: 500;
  }
  .catalog-note {
    font-size: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    transition: none !important;
  }
}
@media print {
  .header nav,
  .menu-toggle,
  .hero-actions,
  .journey-tools button {
    display: none;
  }
  .journey-step > p {
    display: block !important;
  }
  body {
    color: black;
    background: white;
  }
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 0;
  flex-shrink: 0;
  line-height: 0;
}

.trip-stamp {
  border: 0;
  transform: rotate(-13deg);
}
.trip-stamp img {
  width: 78px;
  height: auto;
  display: block;
}

@media (max-width: 1150px) {
  .header nav {
    gap: 17px;
    font-size: 10px;
  }

}

/* Original full-color photography; no desaturation or sepia treatment. */
.hero-photo img,
.category-image img,
.journey-photo img {
  filter: none;
}
.provider-lockup {
  width: 100%;
  max-width: 240px;
  height: auto;
  display: block;
  object-fit: contain;
  margin-bottom: 20px;
}
.practice-sheet {
  top: 85px;
}
.practice-sheet h2 {
  font-size: 29px;
  margin: 5px 0 20px;
}
.provider-art {
  height: 520px;
}
@media (max-width: 640px) {
  .provider-art {
    height: 465px;
  }
  .provider-lockup {
    max-width: 210px;
  }
}

/* Approved original stacked lockup, unaltered and integrated into the ivory page. */
.header { padding-top: 22px; padding-bottom: 22px; }
.brand-stacked { display: block; width: 245px; height: auto; object-fit: contain; filter: none; }
.footer-top .brand-stacked { width: 245px; }
.provider-lockup { width: 280px; max-width: 100%; height: auto; filter: none; }
.category-menu button span:first-child { font-size: inherit; color: inherit; }
.journey-step > p { padding-left: 0; }
.inquiry-page { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; padding-top: 60px; padding-bottom: 90px; }
.inquiry-page h1 { font-size: clamp(48px, 5vw, 76px); line-height: 1.05; margin-bottom: 25px; }
.inquiry-page .intro { margin-bottom: 24px; }
.inquiry-page p { line-height: 1.8; margin-bottom: 20px; }
.inquiry-card { background: var(--paper, #fffaf2); padding: 36px; border: 1px solid var(--line); }
.inquiry-card h2 { font-size: 34px; margin-bottom: 20px; }
.inquiry-card label { display: block; font-size: 13px; margin: 22px 0 9px; }
.inquiry-card input, .inquiry-card select, .inquiry-card textarea { width: 100%; min-height: 48px; border: 1px solid var(--muted); background: transparent; padding: 12px; color: var(--ink); font: inherit; }
.inquiry-card textarea { min-height: 120px; resize: vertical; line-height: 1.55; }
.inquiry-fields.two-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; }
.inquiry-card .field select { margin-bottom: 0; }
.inquiry-card p { font-size: 13px; }
.inquiry-card select { margin-bottom: 24px; }
.inquiry-card button:disabled { opacity: .55; cursor: not-allowed; }
#delivery-status { border-left: 2px solid var(--gold); padding-left: 14px; }
.inquiry-card [aria-invalid="true"] { border-color: #a4452c; box-shadow: 0 0 0 1px #a4452c; }
.inquiry-card input[type="checkbox"][aria-invalid="true"] { outline: 2px solid #a4452c; outline-offset: 2px; }
@media(max-width:1150px) { .header nav { flex-wrap: wrap; justify-content: flex-end; } }
@media(max-width:900px) { .header nav { align-items: stretch; } .brand-stacked { width: 245px; } }
@media(max-width:640px) {
 .header { gap: 12px; }
 .brand-stacked, .footer-top .brand-stacked { width: 232px; }
 .category-menu button span:first-child { display: inline; }
 .inquiry-page { grid-template-columns: 1fr; gap: 32px; padding-top: 28px; }
 .inquiry-card { padding: 24px; }
 .inquiry-fields.two-column { grid-template-columns: 1fr; }
}

/* Preserve the full treatment scene in portrait category photos. */
.category-stage.portrait-care { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; padding-bottom: 0; }
.portrait-care .category-image { width: 100%; height: auto; overflow: visible; }
.portrait-care .category-image img { display: block; height: auto; object-fit: contain; }
.portrait-care .category-sheet { position: static; width: 100%; margin: 0; min-height: 0; }
@media (max-width: 640px) {
 .category-stage.portrait-care { grid-template-columns: minmax(0, 1fr); gap: 0; }
 .portrait-care .category-sheet { width: 100%; margin: 0; }
}

/* Always-visible site language control, independent of the mobile menu. */
.header { flex-wrap: wrap; }
.site-language { display: flex; align-items: center; gap: 3px; margin-left: auto; border: 1px solid var(--line); padding: 3px; }
.site-language button { border: 0; background: transparent; color: var(--muted); padding: 8px 10px; font: inherit; font-size: 12px; cursor: pointer; }
.site-language button[aria-pressed="true"] { background: var(--charcoal); color: #fff; }
.site-language button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 640px) {
  .site-language { margin-left: 0; order: 3; }
  .header .site-language + .menu-toggle { margin-left: auto; }
  html[lang="es"] .category-sheet { padding: 25px 23px; }
}

.journey-options { border-top: 1px solid var(--line); }
.journey-options-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.journey-option { display: flex; flex-direction: column; align-items: flex-start; padding: 34px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(255,255,255,.84), rgba(240,231,216,.72)); border-radius: 6px; box-shadow: 0 20px 42px -34px var(--surface-shadow); }
.journey-option h3 { font-size: clamp(28px, 3vw, 38px); margin: 8px 0 18px; }
.journey-option p, .journey-option li { line-height: 1.7; }
.journey-option ul { padding-left: 20px; margin: 12px 0; }
.journey-option .button { margin-top: 18px; white-space: normal; }
.journey-option .text-link { margin-top: 18px; }
@media(max-width:700px) { .journey-options-grid { grid-template-columns: 1fr; } .journey-option { padding: 25px; } }

.destinations { border-top: 1px solid var(--line); }
.destinations-intro { max-width: 650px; line-height: 1.7; margin: 24px 0 30px; }
.destination-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.destination-card { padding: 28px; border: 1px solid var(--line); background: linear-gradient(150deg, rgba(255,253,248,.94), rgba(238,226,205,.72)); border-radius: 6px; box-shadow: 0 18px 38px -33px var(--surface-shadow); }
.destination-card h3 { font-size: 30px; line-height: 1.2; margin: 18px 0; }
.destination-card p { line-height: 1.65; }
.destination-status { font-size:11px; letter-spacing: 1.5px; color: var(--gold-text); }
.destinations-coming { margin: 30px 0 22px; padding: 25px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.destination-names { font-family: var(--font-display); font-size: 30px; font-weight: 400; line-height: 1.2; margin: 12px 0; }
.destinations-coming > p:last-child { line-height: 1.7; }
@media(max-width:800px) { .destination-grid { grid-template-columns: 1fr; } }

/* Audience choice stays visible, including when mobile navigation is closed. */

.header .site-language { margin-left: 0; }
.header #navigation { flex-basis: 100%; justify-content: flex-end; }
@media(max-width:900px) {

  .header .site-language { order: 3; }
  .header .menu-toggle { order: 4; margin-left: auto; }
  .header #navigation { order: 5; }
}

/* Layered homepage: neutral light, tactile surfaces and unhurried motion. */
.care-explorer .category-stage { isolation: isolate; }
.care-explorer .category-stage::before {
  content: none;
}
.care-explorer .category-image {
  border-radius: 70px 6px 6px 6px;
  box-shadow: 0 22px 45px -28px rgba(38,32,25,.40);
}
.category-image .category-outgoing { position: absolute; inset: 0; z-index: 1; }
.care-explorer .category-sheet {
  border-radius: 8px;
  border-color: #fff9;
  box-shadow: 0 26px 55px -22px rgba(38,32,25,.27), 0 2px 8px rgba(38,32,25,.05);
}
@media (min-width: 901px) {
  .care-explorer .category-stage {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.9fr);
    gap: 0;
    align-items: center;
    padding: 22px 0;
  }
  .care-explorer .category-image {
    width: 100%;
    height: 440px;
  }
  .care-explorer .category-sheet {
    position: relative;
    right: auto;
    bottom: auto;
    width: calc(100% + 44px);
    margin-left: -44px;
    min-height: 0;
    z-index: 2;
  }
}
.care-explorer button { transition: transform .35s ease, box-shadow .35s ease, background-color .35s ease; }
.care-explorer .category-menu button { padding-inline: 12px !important; border-radius: 5px; }
.care-explorer .category-menu button[aria-pressed="true"] { background: var(--accent-pale); box-shadow: 0 5px 14px -10px rgba(38,32,25,.31); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .care-explorer .procedure-links button:hover { transform: translateY(-3px); box-shadow: 0 8px 18px -9px rgba(38,32,25,.40); }
  .care-explorer .category-menu button:hover { transform: translateX(4px); background: #f1e8da; }
}
@media (max-width: 899px) {
  .care-explorer .category-image { border-top-left-radius: 45px; }
  .care-explorer .category-sheet {
    width: calc(100% - 32px);
    margin-top: -28px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .care-explorer button { transition: none; }
}

/* Alternating paper surfaces create rhythm without changing the calm palette. */
.journey-options,
.destinations,
.care-explorer {
  position: relative;
  isolation: isolate;
}
.journey-options::before,
.destinations::before,
.care-explorer::before {
  content: "";
  position: absolute;
  inset-block: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  z-index: -2;
}
.journey-options::before {
  background:
    radial-gradient(circle at 78% 10%, rgba(255,255,255,.55), transparent 30%),
    repeating-linear-gradient(112deg, rgba(36,36,34,.018) 0 1px, transparent 1px 5px),
    #f2eadf;
}
.destinations::before {
  background:
    radial-gradient(circle at 8% 70%, rgba(255,255,255,.50), transparent 28%),
    radial-gradient(circle at 90% 20%, rgba(179,145,88,.14), transparent 25%),
    var(--stone);
}
.care-explorer::before {
  background:
    linear-gradient(115deg, rgba(255,255,255,.55), transparent 38%),
    repeating-linear-gradient(8deg, rgba(36,36,34,.016) 0 1px, transparent 1px 6px),
    #fbf7f0;
}


/* Only the journey imagery is prepared for its subtle scroll-bound movement. */
.journey.is-scroll-story .journey-photo,
.journey.is-scroll-story .journey-timeline {
  will-change: transform;
}

/* Ease the light editorial surface into the dark pricing chapter. */
.pricing::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: -56px;
  height: 56px;
  background: linear-gradient(180deg, rgba(36,36,34,0), var(--charcoal));
  pointer-events: none;
}
.pricing > .wrap {
  position: relative;
  z-index: 1;
}
@media (max-width: 900px) {
  .journey-timeline { padding-left: 31px; }
  .journey-timeline::before,
  .journey-timeline::after { left: 5px; }
  .journey-step summary::before { left: -35px; }
}
@media (max-width: 640px) {
  .journey-timeline { padding-left: 28px; }
  .journey-photo { border-radius: 45px 5px 5px 5px; }
  .journey-step.is-current { transform: translateX(4px); }
  .care-heading-copy { max-width: none; margin-top: 20px; font-size: 13px; }
}

/* Treat the brand and navigation as one composed opening frame. */
.header {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr) auto;
  grid-template-areas:
    "brand audience language"
    "brand navigation navigation";
  column-gap: 28px;
  row-gap: 9px;
  min-height: 0;
  margin-top: 18px;
  margin-bottom: 16px;
  padding: 17px 21px;
  background: rgba(255, 253, 248, .78);
  border: 1px solid rgba(146, 113, 63, .22);
  border-radius: 8px;
  box-shadow: 0 18px 48px -38px rgba(38, 32, 25, .48);
  backdrop-filter: blur(12px);
}
.header .brand {
  grid-area: brand;
  align-self: center;
}
.header .brand-stacked {
  width: 184px;
  max-width: 100%;
}

.header .site-language {
  grid-area: language;
  align-self: center;
  justify-self: end;
  margin-left: 0;
}
.header #navigation {
  grid-area: navigation;
  flex-basis: auto;
  justify-content: flex-end;
  width: 100%;
  padding-top: 10px;
  border-top: 1px solid rgba(146, 113, 63, .18);
}
.header .menu-toggle {
  grid-area: menu;
}

@media (max-width: 900px) {
  .header {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand menu"
      "audience language"
      "navigation navigation";
    gap: 12px 18px;
    margin-top: 12px;
    padding: 14px 16px;
  }
  .header .brand-stacked {
    width: 164px;
  }
  .header .menu-toggle,
  .header .site-language + .menu-toggle {
    justify-self: end;
    margin-left: 0;
  }

  .header .site-language {
    order: initial;
  }
  .header #navigation {
    order: initial;
    padding: 12px 0 4px;
  }
}

@media (max-width: 640px) {
  .header {
    width: calc(100% - 24px);
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 12px;
    padding: 12px;
  }
  .header .brand-stacked {
    width: 146px;
  }

  .site-language button {
    padding: 7px 8px;
    font-size: 12px;
  }
}

/* Three-scene hero sequence, within Uriym's existing composition. */
.hero-video-sequence { position:absolute; inset:0; pointer-events:none; }
.hero-video-sequence video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:58% center; opacity:0; transition:opacity 1s ease; }
.hero-video-sequence video.is-active { opacity:1; }
/* The pause control exists for keyboard and screen-reader users only; it is
   drawn on screen when it receives focus and never over the photo otherwise. */
.hero-video-toggle { position:absolute; top:20px; right:20px; z-index:3; width:1px; height:1px; margin:-1px; padding:0; border:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; background:#1c1a17e6; color:#fff; font:500 13px/1.3 var(--font-body); cursor:pointer; }
.hero-video-toggle[hidden] { display:none; }
.hero-video-toggle:focus-visible { width:auto; height:auto; margin:0; padding:10px 16px; clip-path:none; border:1px solid #ffffff80; border-radius:24px; outline:3px solid white; outline-offset:4px; }
@media(max-width:640px) { .hero-video-sequence video { object-position:50% center; } .hero-video-toggle { top:14px; right:14px; } }
@media(prefers-reduced-motion:reduce) { .hero-video-sequence video { transition:none; } }
/* The footage keeps its own colour: no filter or blend; the hero's shade only darkens it for the words. */
.hero-video-sequence, .hero-video-sequence video { filter:none; mix-blend-mode:normal; }
.monthly-details[hidden] { display:none; }
/* A quiet, single-row patient header gives the journey room to lead. */
.header.header-simple { grid-template-columns:170px minmax(0,1fr) auto; grid-template-areas:"brand navigation language"; gap:24px; padding:18px 0; margin-top:0; margin-bottom:24px; background:transparent; border:0; border-radius:0; box-shadow:none; backdrop-filter:none; }
.header-simple .brand-stacked { width:170px; }
.header-simple #navigation { border:0; padding:0; gap:24px; flex-wrap:nowrap; align-items:center; }
.header-simple #navigation a { white-space:nowrap; font-size:13px; }
.header-simple #navigation .provider-link { color:var(--muted); font-size:12px; margin-left:12px; }
.header-simple #navigation .button { padding:12px 0; background:transparent; border:0; color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:7px; }
.header-simple #navigation .button:hover { background:transparent; color:var(--gold-text); transform:none; box-shadow:none; }
.header-simple #navigation .button[aria-current="page"] { color:var(--gold-text); }
.header-simple .site-language { border:0; padding:0; gap:0; }
.header-simple .site-language button { min-height:44px; padding:8px 7px; font-size:12px; }
.header-simple .site-language button[aria-pressed="true"] { background:transparent; color:var(--ink); text-decoration:underline; text-underline-offset:5px; }
@media(max-width:1150px) {
 .header.header-simple { grid-template-columns:minmax(0,1fr) auto auto; grid-template-areas:"brand language menu" "navigation navigation navigation"; gap:0 16px; padding:14px 0; margin-bottom:12px; }
 .header-simple .menu-toggle { display:block; min-height:44px; }
 .header-simple #navigation { display:none; }
 .header-simple #navigation.is-open { display:flex; flex-direction:column; align-items:stretch; gap:0; padding:16px 0; border-top:1px solid var(--line); }
 .header-simple #navigation a { padding:14px 8px; }
 .header-simple #navigation .provider-link { margin:0; }
 .header-simple #navigation .button { text-align:left; margin-top:0; padding:14px 8px; }
}
@media(max-width:640px) {
 .header.header-simple { width:calc(100% - 40px); gap:0 8px; }
 .header-simple .brand-stacked { width:125px; }
 .header-simple .site-language button { font-size:11px; padding:8px 5px; }
}
/* Editorial inquiry pages: clear sections, comfortable controls, quiet surfaces. */
main.inquiry-page { display:grid; grid-template-columns:minmax(240px, .8fr) minmax(0,1.65fr); gap:clamp(32px,5vw,80px); align-items:start; padding-top:44px; padding-bottom:90px; }
.inquiry-intro { padding-top:12px; }
.inquiry-intro h1 { font-size:clamp(40px,4.3vw,62px); line-height:1.12; letter-spacing:-1.5px; margin:18px 0 26px; }
.inquiry-intro p { max-width:34ch; font-size:14px; line-height:1.85; color:var(--muted); }
.inquiry-intro .intro { font-size:17px; }
.inquiry-intro .text-link { font-size:13px; overflow-wrap:anywhere; }
form.inquiry-card { min-width:0; background:#fffdf9; padding:clamp(24px,4vw,52px); border:1px solid #e3ddd2; border-radius:8px; box-shadow:0 16px 50px -35px #61554540; }
.inquiry-card h2 { font-size:clamp(28px,2.8vw,38px); line-height:1.2; margin:0 0 16px; }
.inquiry-card #inquiry-note { font-size:13px; line-height:1.8; color:var(--muted); margin-bottom:30px; }
.inquiry-section { min-width:0; margin:0 0 30px; padding:24px 0 0; border:0; border-top:1px solid #e3ddd2; }
.inquiry-section legend { padding:0 16px 0 0; font:600 14px/1.5 var(--font-body); color:var(--ink); }
.inquiry-section legend span { font-size:11px; color:var(--gold-text); margin-right:10px; }
.inquiry-card .inquiry-fields.two-column { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 24px; }
.inquiry-card .field { min-width:0; display:flex; flex-direction:column; justify-content:flex-end; }
.inquiry-card .field-wide { grid-column:1/-1; }
.inquiry-card label { display:block; font:500 13px/1.55 var(--font-body); margin:0 0 9px; color:#47423b; }
.inquiry-card input:not([type=hidden]), .inquiry-card select, .inquiry-card textarea { box-sizing:border-box; display:block; width:100%; max-width:100%; min-width:0; margin:0; min-height:52px; border:1px solid #cec6b9; border-radius:4px; background:#fff; padding:13px 14px; color:#26231f; font:400 16px/1.5 var(--font-body); box-shadow:none; }
.inquiry-card select { padding-right:32px; text-overflow:ellipsis; }
.inquiry-card textarea { min-height:140px; resize:vertical; }
.inquiry-card input::placeholder, .inquiry-card textarea::placeholder { color:#827c73; font-size:14px; }
.inquiry-card input:focus, .inquiry-card select:focus, .inquiry-card textarea:focus { outline:2px solid #9c8258; outline-offset:2px; border-color:#9c8258; }
.inquiry-card .full-field { margin-bottom:22px; }
.inquiry-section > select { margin-bottom:24px; }
.inquiry-card .submission-note, .inquiry-card #delivery-status { font-size:12px; line-height:1.75; color:var(--muted); }
.inquiry-card #delivery-status { padding:12px 16px; border-left:2px solid #b49b73; background:#f7f3eb; margin:20px 0; }
.inquiry-card #inquiry-submit { min-height:52px; padding:14px 28px; font-size:14px; border-radius:3px; }
.inquiry-card #inquiry-result:empty { display:none; }
/* What happened after Send, in a box that is hard to miss. */
.inquiry-card #inquiry-result { margin:18px 0 0; padding:14px 18px; border-left:3px solid #b49b73; background:#f7f3eb; font-size:14px; line-height:1.65; color:var(--ink); outline:none; }
#inquiry-form[hidden] { display:none; }
.inquiry-card #inquiry-result[data-state="error"], .inquiry-card #inquiry-result[data-state="invalid"] { border-left-color:#a4452c; background:#fbefea; color:#6e2a19; }
/* After a successful send the form gives way to this confirmation. */
.inquiry-sent { min-width:0; scroll-margin-top:120px; background:#fffdf9; padding:clamp(28px,5vw,60px); border:1px solid #e3ddd2; border-top:3px solid #b49b73; border-radius:8px; box-shadow:0 16px 50px -35px #61554540; outline:none; }
.inquiry-sent[hidden] { display:none; }
.inquiry-sent-mark { display:flex; align-items:center; justify-content:center; width:56px; height:56px; margin:0 0 26px; border-radius:50%; background:#f3ecdf; color:#8a6d3b; font-size:26px; line-height:1; }
.inquiry-sent h2 { font-size:clamp(30px,3.2vw,42px); line-height:1.18; margin:0 0 18px; }
.inquiry-sent-lead { font-size:16px; line-height:1.75; color:#47423b; max-width:52ch; margin:0 0 26px; }
.inquiry-sent-email { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; margin:0 0 14px; padding:16px 18px; background:#f7f3eb; border-radius:6px; font-size:14px; color:var(--muted); }
.inquiry-sent-email strong { color:var(--ink); font-weight:600; overflow-wrap:anywhere; }
.inquiry-sent-note { font-size:13px; line-height:1.75; color:var(--muted); max-width:60ch; margin:0 0 30px; }
.inquiry-sent-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 26px; }
.inquiry-sent-again { padding:0; border:0; background:none; font:500 14px/1.5 var(--font-body); color:var(--ink); text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
@media(max-width:600px) { .inquiry-sent { padding:30px 22px; } .inquiry-sent-actions .button { width:100%; text-align:center; } }
@media(max-width:900px) { main.inquiry-page { grid-template-columns:1fr; gap:28px; padding-top:20px; } .inquiry-intro p { max-width:60ch; } .inquiry-intro h1 br { display:none; } }
@media(max-width:600px) { main.inquiry-page { width:calc(100% - 40px); } .inquiry-card .inquiry-fields.two-column { grid-template-columns:1fr; gap:22px; } form.inquiry-card { padding:24px 20px; } .inquiry-card #inquiry-submit { width:100%; } }


/* Not-found page: the same opening rhythm as the inquiry pages, no imagery. */
main.not-found { padding-top: clamp(48px, 9vw, 120px); padding-bottom: clamp(72px, 12vw, 160px); }
.not-found h1 { font-size: clamp(44px, 6vw, 86px); line-height: 1.06; letter-spacing: -2px; margin: 18px 0 8px; }
.not-found .intro { max-width: 46ch; }
.not-found .hero-actions { row-gap: 22px; }


/* ==========================================================================
   Maturity pass, September 2026: fixes and site-wide elements.
   Kept together at the end so each rule's purpose stays readable.
   ========================================================================== */

/* Header: stays in reach on long pages, tightens once you scroll, and anchors
   land below it instead of under it. */
html { scroll-padding-top: 104px; }
.header.header-simple {
  position: sticky;
  top: 0;
  z-index: 30;
  width: auto;
  max-width: none;
  margin: 0 0 24px;
  padding-inline: max(56px, calc((100% - 1280px) / 2));
  background: #f9f6f0; /* solid: content must not show through while it scrolls underneath */
  border-bottom: 1px solid transparent;
  transition: padding .3s var(--motion-soft), border-color .3s ease, box-shadow .3s ease;
}
.header-simple .brand-stacked { transition: width .3s var(--motion-soft); }
.header-simple.is-scrolled {
  padding-block: 10px;
  border-bottom-color: var(--line);
  box-shadow: 0 14px 30px -28px rgba(38, 32, 25, .55);
}
.header-simple.is-scrolled .brand-stacked { width: 138px; }
.header-simple #navigation a[aria-current="page"]:not(.button) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 7px;
}
@media (max-width: 1150px) { .header.header-simple { width: auto; padding-inline: 32px; } }
@media (max-width: 640px) {
  html { scroll-padding-top: 84px; }
  .header.header-simple { width: auto; padding-inline: 20px; margin-bottom: 12px; }
  .header-simple.is-scrolled .brand-stacked { width: 112px; }
}

/* The selected care category on phones: a later rule set a pale background but
   left the text cream, so the label disappeared. */
.care-explorer .category-menu button[aria-pressed="true"] { color: var(--ink); }

/* A crisp edge into the dark pricing chapter instead of a smudged fade. */
.pricing::before { display: none; }

/* Give the journey heading's italic line room before the paragraph. */
.journey-aside h2 + p { margin-top: 26px; }

/* Phones: the oversized arrow ran through the provider copy, and the tilted
   group-trip card reached the screen edge. */
@media (max-width: 719px) {
  .provider-invitation-mark { display: none; }
  .trip-card-back { transform: rotate(-3deg); left: 8px; right: 12px; }
}

/* Providers hero: the sheet was cut off mid-list; a smaller lockup lets the
   whole introduction sit inside the frame. */
.practice-sheet .provider-lockup { width: 168px; margin-bottom: 14px; }
.provider-art { height: 540px; }
@media (max-width: 640px) {
  .practice-sheet .provider-lockup { width: 140px; }
  .provider-art { height: 500px; }
}

/* Catalog: jump to a category, keep columns aligned across every table, and
   end with a next step. */
.catalog-jump { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 44px; }
.catalog-jump a {
  padding: 9px 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 13px;
  background: var(--paper);
  transition: background-color .25s ease, border-color .25s ease;
}
.catalog-jump a:hover { background: var(--accent-pale); border-color: var(--accent); }
@media (min-width: 641px) {
  .catalog-table { table-layout: fixed; width: 100%; }
  .catalog-table th:first-child, .catalog-table td:first-child { width: 46%; }
}
.catalog-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin: 70px 0 90px;
  padding: 44px 48px;
  background: var(--charcoal);
  color: var(--cream);
}
.catalog-cta h2 { font-size: clamp(30px, 3.2vw, 42px); color: var(--cream); margin: 10px 0 12px; }
.catalog-cta p:not(.eyebrow) { color: #e9e1d4; max-width: 560px; margin: 0; }
.catalog-cta .eyebrow { color: #d8c29c; }
.catalog-cta .button { background: var(--cream); color: var(--ink); flex-shrink: 0; }
@media (max-width: 640px) {
  .catalog-cta { flex-direction: column; align-items: flex-start; padding: 32px 24px; margin-bottom: 60px; }
}

/* Inquiry pages: what happens after you send, and where privacy is explained. */
.next-steps { margin: 34px 0 30px; padding-top: 26px; border-top: 1px solid var(--line); }
.next-steps h2 { font-size: 24px; margin-bottom: 16px; }
.next-steps ol { list-style: none; padding: 0; margin: 0; counter-reset: step; }
.next-steps li { counter-increment: step; position: relative; padding: 0 0 16px 40px; font-size: 14px; line-height: 1.6; color: var(--muted); }
.next-steps li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: 1px;
  width: 24px;
  height: 24px;
  border: 1px solid var(--gold);
  border-radius: 50%;
  font-size: 11px;
  line-height: 22px;
  text-align: center;
  color: var(--gold-text);
}
.next-steps strong { display: block; color: var(--ink); font-weight: 500; }
.inquiry-card .privacy-line { font-size: 13px; color: var(--muted); margin: -4px 0 18px; }
.privacy-line a, .legal-page a:not(.button), .provider-close p a { text-decoration: underline; text-underline-offset: 3px; }

/* Footer (founders' framework, October 2026): three columns of links, the contact emails with
   icons for the social accounts and WhatsApp, the legal links and clinical note, and last of all the
   logo with "Global health & wellness navigation", the last thing a visitor sees. Everything sits on the
   left, clear of the corner buttons (WhatsApp, Ask Uriym). */
footer.site-footer { border-top: 1px solid var(--line); padding: 48px 0 30px; margin-top: 0; }
.site-footer .footer-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; max-width: 900px; }
.site-footer .footer-nav h2 {
  font: 500 11px/1.4 var(--font-body);
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: var(--gold-text);
  margin: 0 0 14px;
}
.site-footer .footer-nav ul { list-style: none; margin: 0; padding: 0; }
.site-footer .footer-nav li + li { margin-top: 8px; }
.site-footer .footer-nav a { font-size: 14px; line-height: 1.5; color: var(--ink); }
.site-footer .footer-nav a:hover, .site-footer .footer-legal a:hover { color: var(--gold-text); text-decoration: underline; text-underline-offset: 3px; }
.site-footer .footer-social { display: flex; gap: 4px; margin: 12px 0 0 -10px; }
.site-footer .footer-social li + li { margin-top: 0; }
.site-footer .footer-social a { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; color: var(--ink); }
.site-footer .footer-social a:hover { color: var(--gold-text); }
.site-footer .footer-social svg { width: 19px; height: 19px; fill: currentColor; }
.site-footer .footer-bottom {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-top: 36px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  font-size: 13px;
  color: var(--muted);
}
.site-footer .footer-disclaimer { max-width: 720px; margin: 0; font-size: 13px; line-height: 1.6; }
.site-footer .footer-legal { display: flex; flex-wrap: wrap; gap: 6px 22px; justify-content: flex-start; }
.site-footer .footer-legal a { color: var(--ink); }
.site-footer .footer-sign-off { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin-top: 30px; }
.site-footer .footer-sign-off .brand-stacked { width: 116px; }
.site-footer .footer-sign-off p { margin: 0; font: 500 11px/1.6 var(--font-body); letter-spacing: 1.8px; text-transform: uppercase; color: var(--gold-text); }
@media (max-width: 900px) {
  /* On phones and tablets the corner buttons sit over the end of the page: leave room below the last line. */
  footer.site-footer { padding-bottom: 104px; }
  html[data-assistant="on"] footer.site-footer { padding-bottom: 160px; }
}
@media (max-width: 640px) {
  footer.site-footer { padding-top: 40px; }
  .site-footer .footer-nav { grid-template-columns: 1fr 1fr; gap: 28px 20px; }
  .site-footer .footer-nav > div:last-child { grid-column: 1 / -1; }
}

/* Legal pages: a readable measure, a contents list that stays in view on wide
   screens, and unmistakable markers for text awaiting approval. */
.legal-page { padding-top: 40px; padding-bottom: 60px; }
.legal-head { max-width: 760px; }
.legal-head h1 { font-size: clamp(44px, 5vw, 68px); line-height: 1.08; margin: 14px 0 12px; }
.legal-updated { font-size: 13px; color: var(--muted); margin: 0 0 20px; }
.legal-draft {
  display: inline-block;
  margin: 0 0 26px;
  padding: 10px 14px;
  border-left: 3px solid var(--gold);
  background: var(--accent-pale);
  font-size: 13px;
  color: var(--ink);
}
.legal-head .intro { font-size: 17px; line-height: 1.7; color: var(--ink); }
.legal-summary { margin: 30px 0 10px; padding: 28px 32px; background: var(--paper); border: 1px solid var(--line); }
.legal-summary h2 { font-size: 26px; margin-bottom: 14px; }
.legal-summary li { margin-top: 8px; }
.legal-layout { display: grid; grid-template-columns: 240px minmax(0, 760px); gap: 64px; margin-top: 50px; }
.legal-toc { position: sticky; top: 110px; align-self: start; font-size: 13px; }
.legal-toc-title { font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); margin-bottom: 14px; }
.legal-toc ol { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 1px solid var(--line); }
.legal-toc li + li { margin-top: 9px; }
.legal-toc a { color: var(--muted); text-decoration: none !important; }
.legal-toc a:hover { color: var(--ink); }
.legal-body section + section { margin-top: 44px; padding-top: 36px; border-top: 1px solid var(--line); }
.legal-body h2 { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.2; margin-bottom: 16px; }
.legal-body h3 { font: 500 16px/1.5 var(--font-body); margin: 26px 0 8px; }
.legal-body p, .legal-body li { font-size: 15px; line-height: 1.75; color: #3d3a35; }
.legal-body p + p { margin-top: 14px; }
.legal-body ul, .legal-summary ul { padding-left: 20px; margin: 12px 0; }
.legal-body li + li { margin-top: 8px; }
.legal-body strong { color: var(--ink); font-weight: 600; }
mark.legal-todo { background: #f6e3b4; color: var(--ink); padding: 1px 4px; border-radius: 2px; }
@media (max-width: 900px) {
  .legal-layout { grid-template-columns: 1fr; gap: 30px; margin-top: 30px; }
  .legal-toc { position: static; padding: 20px 22px; background: var(--paper); border: 1px solid var(--line); }
}

/* With aligned columns, a long reference price (the Spanish BBL surgeon's fee)
   must wrap inside its cell rather than run past the page edge. */
@media (min-width: 641px) { .catalog-table td:nth-child(n + 2) { white-space: normal; } }

/* The skip link must sit above the sticky header when it receives focus. */
.skip { z-index: 60; }
.legal-head .intro { max-width: 760px; }

/* Language switch: a compact EN / ES control at the far edge of the header,
   set apart from the navigation. Screen readers still hear "English" and
   "Español" from each button's label. */
.header-simple .site-language { gap: 2px; }
.header-simple .site-language button {
  min-width: 34px;
  min-height: 44px;
  padding: 8px 6px;
  font: 500 12px/1 var(--font-body);
  letter-spacing: 1.4px;
  color: var(--muted);
  text-decoration: none;
  transition: color .2s ease;
}
.header-simple .site-language button:hover { color: var(--ink); }
.header-simple .site-language button[aria-pressed="true"] {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 7px;
}
@media (min-width: 1151px) {
  .header-simple .site-language { position: relative; margin-left: 10px; padding-left: 22px; }
  .header-simple .site-language::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 24px;
    background: var(--line);
    transform: translateY(-50%);
  }
}
@media (max-width: 1150px) { .header-simple .site-language { margin-right: 6px; } }

/* Analytics question (analytics.js): off until the visitor allows it. */
.analytics-choice { position: fixed; z-index: 60; right: 20px; bottom: 20px; width: min(420px, calc(100vw - 40px)); padding: 22px 22px 20px; background: var(--paper); border: 1px solid var(--line); box-shadow: 0 24px 48px -24px rgba(48,45,42,.45); color: var(--ink); font-family: var(--font-body); }
.analytics-choice h2 { margin: 0 28px 8px 0; font-family: var(--font-body); font-size: 15px; font-weight: 600; line-height: 1.4; letter-spacing: 0; text-transform: none; }
.analytics-choice p { margin: 0 0 8px; font-size: 13px; line-height: 1.6; color: var(--muted); }
.analytics-choice .analytics-choice-state { color: var(--ink); }
.analytics-choice-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-top: 14px; }
.analytics-choice-actions a { margin-left: auto; font-size: 12px; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; }
.analytics-choice .analytics-choice-no { background: transparent; color: var(--ink); }
.analytics-choice .analytics-choice-no:hover { background: var(--accent-pale); }
.analytics-choice-close { position: absolute; top: 10px; right: 12px; padding: 4px; background: none; border: 0; font-size: 22px; line-height: 1; color: var(--muted); cursor: pointer; }
.site-footer .footer-legal .footer-choices { padding: 0; background: none; border: 0; font: inherit; color: var(--ink); cursor: pointer; }
.site-footer .footer-legal .footer-choices:hover { color: var(--gold-text); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px) { .analytics-choice { right: 16px; left: 16px; bottom: 16px; width: auto; } }

/* The acceptance box the Website Terms of Use describe, on both inquiry forms. */
.inquiry-card .terms-accept { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 18px; font: 500 13px/1.55 var(--font-body); color: var(--ink); cursor: pointer; }
.inquiry-card .terms-accept input { width: 18px; height: 18px; min-height: 0; margin: 2px 0 0; padding: 0; border: 0; background: none; flex: none; accent-color: var(--ink); }
.inquiry-card .terms-accept a { text-decoration: underline; text-underline-offset: 3px; }

/* The legal pages: the note that the approved text is in English shows on the Spanish site only. */
.legal-language-note { margin: 12px 0 0; font-size: 13px; color: var(--muted); }
html:not([lang="es"]) .legal-language-note { display: none; }
.legal-intro p { margin: 0 0 16px; line-height: 1.7; }
/* Section 1 starts after a policy's opening paragraphs with the same rule and space as every later section. */
.legal-intro + section { margin-top: 44px; padding-top: 36px; border-top: 1px solid var(--line); }

/* Homepage: the consumer health data policy link Washington and Nevada require on the homepage. */
.health-data-link { margin: 0 auto; padding: 28px 0 8px; font-size: 13px; color: var(--muted); text-align: center; }
.health-data-link a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }


/* The way into the patient app (uriym.com/app): a care request from How it works, and
   sign-in for patients who already have an account. */
.journey-actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin:0 0 6px; }
.header nav > .signin-link { font-weight:400; }
.inquiry-intro .inquiry-app-link { margin-top:10px; }

/* Blog (/blog, scripts/blog.mjs): a reading layout for long guides. The blog home and topic
   pages list guides as cards; a guide has a contents list that stays in view on wide screens,
   key takeaways, tables that scroll sideways on phones, a "Where Uriym helps" panel, the
   questions people ask and the sources behind every fact. */
.header-simple #navigation a[aria-current="true"]:not(.button) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 7px;
}
.blog-home, .blog-post { padding-top: 34px; padding-bottom: 20px; }
.blog-language-note { margin: 0 0 18px; }
.blog-crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0 0 26px; padding: 0; font-size: 13px; color: var(--muted); }
.blog-crumbs li + li::before { content: "/"; margin-right: 6px; color: var(--line); }
.blog-crumbs a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.blog-crumbs a:hover { color: var(--gold-text); }

.blog-home-head { max-width: 780px; margin-bottom: 30px; }
.blog-home-head h1 { font-size: clamp(44px, 5vw, 68px); line-height: 1.08; margin: 0 0 18px; }
.blog-home-head .intro { max-width: 620px; margin: 0; font-size: 17px; color: var(--muted); }
.blog-topics { margin: 0 0 38px; }
.blog-topics a[aria-current="page"] { background: var(--accent-pale); border-color: var(--accent); }
.blog-empty { margin: 40px 0 80px; color: var(--muted); }

.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 30px; }
.blog-card { position: relative; display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); transition: border-color .25s ease, box-shadow .35s var(--motion-soft), transform .35s var(--motion-soft); }
.blog-card:hover { border-color: var(--accent); box-shadow: 0 22px 44px -34px rgba(38, 32, 25, .55); transform: translateY(-2px); }
.blog-card:focus-within { outline: 3px solid var(--accent); outline-offset: 4px; }
.blog-card img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: var(--stone); }
.blog-card-text { display: flex; flex: 1; flex-direction: column; padding: 22px 24px 24px; }
.blog-card .eyebrow { margin-bottom: 10px; color: var(--gold-text); }
.blog-card h2, .blog-card h3 { font-size: 25px; line-height: 1.22; letter-spacing: -.4px; margin: 0 0 12px; }
.blog-card h2 a::after, .blog-card h3 a::after { content: ""; position: absolute; inset: 0; }
.blog-card h2 a:focus-visible, .blog-card h3 a:focus-visible { outline: none; }
.blog-card-text > p:not(.eyebrow):not(.blog-meta) { font-size: 14px; line-height: 1.65; color: var(--muted); margin: 0 0 16px; }
.blog-meta { margin: auto 0 0; font-size: 12px; letter-spacing: .3px; color: var(--muted); }
.blog-featured { margin-bottom: 60px; }
@media (min-width: 900px) {
  .blog-featured .blog-card { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
  .blog-featured .blog-card img { height: 100%; aspect-ratio: auto; min-height: 380px; }
  .blog-featured .blog-card-text { justify-content: center; padding: 44px 48px; }
  .blog-featured .blog-card h2 { font-size: clamp(32px, 3vw, 44px); line-height: 1.12; letter-spacing: -1px; }
  .blog-featured .blog-card-text > p:not(.eyebrow):not(.blog-meta) { font-size: 16px; }
  .blog-featured .blog-meta { margin-top: 8px; }
}
.blog-latest > h2, .blog-related > h2, .blog-other-topics > h2 { font-size: clamp(30px, 3vw, 40px); margin: 0 0 26px; }
.blog-other-topics { margin-top: 60px; }
.blog-other-topics .blog-topics { margin-bottom: 0; }
.blog-how { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); grid-template-rows: auto 1fr; align-items: start; gap: 20px 60px; margin: 80px 0 0; padding: 44px 48px; background: var(--paper); border: 1px solid var(--line); }
.blog-how .eyebrow { grid-column: 1; margin-bottom: 0; color: var(--gold-text); }
.blog-how h2 { grid-column: 1; font-size: clamp(30px, 3vw, 40px); }
.blog-how-body { grid-column: 2; grid-row: 1 / span 2; }
.blog-how-body p { font-size: 15px; line-height: 1.75; color: #3d3a35; }
.blog-how-body p + p { margin-top: 14px; }
.blog-how-body a, .blog-disclaimer a, .blog-byline a { text-decoration: underline; text-underline-offset: 3px; }

.blog-post-head { max-width: 880px; }
.blog-post-head .eyebrow { margin-bottom: 16px; color: var(--gold-text); }
.blog-post-head h1 { font-size: clamp(40px, 4.6vw, 64px); line-height: 1.08; letter-spacing: -1.6px; margin: 0 0 20px; }
.blog-dek { max-width: 760px; font-size: 19px; line-height: 1.6; color: var(--muted); margin: 0 0 24px; }
.blog-byline { display: flex; flex-wrap: wrap; gap: 4px 10px; padding: 14px 0; border-block: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.blog-byline a { color: var(--ink); }
.blog-hero { margin: 34px 0 0; }
.blog-hero img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 8; object-fit: cover; background: var(--stone); }
.blog-layout { display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 64px; margin-top: 54px; }
.blog-article { min-width: 0; }
.blog-toc { position: sticky; top: 110px; font-size: 13px; }
.blog-toc-title { font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); margin: 0 0 14px; }
.blog-toc ol, .blog-toc-mobile ol { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 1px solid var(--line); }
.blog-toc li + li, .blog-toc-mobile li + li { margin-top: 9px; }
.blog-toc a, .blog-toc-mobile a { color: var(--muted); line-height: 1.45; }
.blog-toc a:hover, .blog-toc-mobile a:hover { color: var(--ink); }
.blog-toc-mobile { display: none; }

.blog-article > p, .blog-article > ul, .blog-article > ol { font-size: 17px; line-height: 1.78; color: #3d3a35; }
.blog-article > p + p, .blog-article > p + ul, .blog-article > p + ol, .blog-article > ul + p, .blog-article > ol + p { margin-top: 18px; }
.blog-article > ul, .blog-article > ol { margin-bottom: 0; padding-left: 22px; }
.blog-article li + li { margin-top: 8px; }
.blog-article li::marker { color: var(--gold); }
.blog-article strong { color: var(--ink); font-weight: 600; }
.blog-article > h2 { font-size: clamp(29px, 2.8vw, 38px); line-height: 1.16; letter-spacing: -.8px; margin: 60px 0 18px; }
.blog-article > h3 { font-size: 23px; line-height: 1.3; letter-spacing: -.3px; margin: 36px 0 12px; }
.blog-article > p a, .blog-article li a, .blog-table a, .blog-faq a { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.blog-article > p a:hover, .blog-article li a:hover, .blog-table a:hover, .blog-faq a:hover { color: var(--gold-text); }
.blog-takeaways { margin: 0 0 40px; padding: 26px 30px; background: var(--paper); border: 1px solid var(--line); border-left: 3px solid var(--gold); }
.blog-takeaways h2 { font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); margin: 0 0 14px; }
.blog-takeaways ul { margin: 0; padding-left: 20px; }
.blog-takeaways li { font-size: 16px; line-height: 1.65; }
.blog-takeaways li + li { margin-top: 10px; }
.blog-table { margin: 26px 0; overflow-x: auto; border: 1px solid var(--line); background: var(--paper); }
.blog-table table { width: 100%; min-width: 540px; border-collapse: collapse; font-size: 14.5px; line-height: 1.55; }
.blog-table th { padding: 12px 16px; background: var(--ivory-deep); text-align: left; vertical-align: bottom; font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--line); }
.blog-table td { padding: 12px 16px; vertical-align: top; color: #3d3a35; border-top: 1px solid var(--taupe); }
/* A photo inside a guide (![alt](photo:key "caption") in its markdown): the column's full width. */
.blog-figure { margin: 40px 0; }
.blog-figure img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; background: var(--stone); }
.blog-figure figcaption { margin-top: 10px; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
@media print { .blog-figure { break-inside: avoid; } }
.blog-tip { margin: 26px 0; padding: 18px 22px; background: var(--accent-pale); border-left: 3px solid var(--gold); }
.blog-tip p { font-size: 15.5px; line-height: 1.7; color: var(--ink); }
.blog-unit { margin: 56px 0; padding: 38px 40px; background: var(--charcoal); color: var(--cream); }
.blog-unit .eyebrow { color: #d8c29c; margin-bottom: 12px; }
.blog-unit h2 { font-size: clamp(27px, 2.6vw, 34px); line-height: 1.18; color: var(--cream); margin: 0 0 16px; }
.blog-unit p, .blog-unit li { font-size: 15.5px; line-height: 1.7; color: #e9e1d4; }
.blog-unit p + p, .blog-unit p + ul, .blog-unit ul + p { margin-top: 12px; }
.blog-unit ul, .blog-unit ol { margin: 12px 0 0; padding-left: 20px; }
.blog-unit li + li { margin-top: 6px; }
.blog-unit strong { color: var(--cream); font-weight: 600; }
.blog-unit a:not(.button) { text-decoration: underline; text-underline-offset: 3px; }
.blog-unit .button { margin-top: 24px; background: var(--cream); color: var(--ink); border-color: var(--cream); }
.blog-unit .blog-unit-note { margin-top: 18px; font-size: 12.5px; color: #bfb5a6; }
.blog-faq, .blog-sources { margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--line); }
.blog-faq h2, .blog-sources h2 { font-size: clamp(29px, 2.8vw, 38px); letter-spacing: -.8px; margin: 0 0 8px; }
.blog-faq h3 { font-size: 21px; line-height: 1.35; margin: 28px 0 8px; }
.blog-faq p { font-size: 16px; line-height: 1.75; color: #3d3a35; }
.blog-sources ol { margin: 18px 0 0; padding-left: 22px; font-size: 14px; line-height: 1.6; }
.blog-sources li + li { margin-top: 10px; }
.blog-sources a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; overflow-wrap: anywhere; }
.blog-sources span { display: block; color: var(--muted); font-size: 13px; }
.blog-disclaimer { margin: 44px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); font-size: 13px; line-height: 1.7; color: var(--muted); }
.blog-related { margin-top: 90px; }
.blog-cta { margin-top: 90px; }

@media (max-width: 900px) {
  .blog-layout { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 36px; }
  .blog-aside { display: none; }
  .blog-toc-mobile { display: block; margin: -16px 0 36px; padding: 16px 20px; background: var(--paper); border: 1px solid var(--line); font-size: 14px; }
  .blog-toc-mobile summary { cursor: pointer; font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); }
  .blog-toc-mobile[open] summary { margin-bottom: 14px; }
  .blog-how { grid-template-columns: 1fr; padding: 32px 26px; }
  .blog-how .eyebrow, .blog-how h2, .blog-how-body { grid-column: 1; grid-row: auto; }
}
@media (max-width: 640px) {
  .blog-home, .blog-post { padding-top: 18px; }
  .blog-post-head h1 { letter-spacing: -1px; }
  .blog-dek { font-size: 17px; }
  .blog-hero img { aspect-ratio: 16 / 10; }
  .blog-article > p, .blog-article > ul, .blog-article > ol { font-size: 16px; }
  .blog-takeaways { padding: 22px 20px; }
  .blog-unit { margin-inline: -20px; padding: 32px 22px; }
  .blog-grid { grid-template-columns: 1fr; gap: 22px; }
}

/* With Blog and Sign in, the header's eight links need about 1,230px at full spacing. Just
   above the compact-menu breakpoint, tighten the spacing so they never run into the logo. */
@media (min-width: 1151px) and (max-width: 1300px) {
  .header.header-simple { padding-inline: 32px; }
  .header-simple #navigation { gap: 16px; }
  .header-simple #navigation .provider-link { margin-left: 0; }
}

/* The approved logo (October 2026): the wordmark with its compass star in the header, sized
   by its capitals rather than the old lockup's width, and the full logo with "Global
   Health & Wellness Navigation" wherever it is large enough for the tagline to be read. */
@media (min-width: 1151px) {
  .header.header-simple { grid-template-columns: 124px minmax(0, 1fr) auto; }
}
.header-simple .brand-stacked { width: 124px; }
.header-simple.is-scrolled .brand-stacked { width: 104px; }
@media (max-width: 1150px) { .header-simple .brand-stacked { width: 116px; } }
@media (max-width: 640px) {
  .header-simple .brand-stacked { width: 104px; }
  .header-simple.is-scrolled .brand-stacked { width: 92px; }
}
.practice-sheet .provider-lockup { width: 216px; }
@media (max-width: 640px) { .practice-sheet .provider-lockup { width: 184px; } }
.trip-stamp img { width: auto; height: 60px; }

/* Blog trust and richness: a fact-check badge under the byline, an "At a glance" box of quick
   facts, numbered steps, an "About this guide" box, and print styles for taking a guide's
   checklists to a consultation. */
.blog-trust { display: grid; gap: 8px; margin-top: 14px; font-size: 13px; color: var(--muted); }
.blog-trust p { margin: 0; }
.blog-trust-check { display: flex; align-items: flex-start; gap: 9px; line-height: 1.5; }
.blog-trust-check svg { flex: none; margin-top: 1px; color: #3f6b4f; }
.blog-trust-check strong { color: var(--ink); font-weight: 600; }
.blog-trust a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.blog-trust-orgs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; padding-left: 27px; }
.blog-trust-label { margin-right: 2px; }
.blog-trust-orgs a { padding: 3px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); font-size: 12px; text-decoration: none !important; }
.blog-trust-orgs a:hover { border-color: var(--accent); background: var(--accent-pale); }
.blog-glance { margin: -16px 0 40px; padding: 24px 28px 8px; background: var(--paper); border: 1px solid var(--line); }
.blog-glance h2 { font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); margin: 0 0 6px; }
.blog-glance dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
.blog-glance dl > div { padding: 12px 0 14px; border-top: 1px solid var(--taupe); }
.blog-glance dt { font-size: 12px; letter-spacing: .3px; color: var(--muted); margin-bottom: 3px; }
.blog-glance dd { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink); font-weight: 500; }
.blog-glance dd a { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.blog-article > ol { list-style: none; padding-left: 0; counter-reset: blog-step; }
.blog-article > ol > li { position: relative; counter-increment: blog-step; padding-left: 44px; min-height: 30px; }
.blog-article > ol > li + li { margin-top: 14px; }
.blog-article > ol > li::before {
  content: counter(blog-step);
  position: absolute; left: 0; top: 2px;
  width: 28px; height: 28px; border: 1px solid var(--gold); border-radius: 50%;
  font: 500 12px/26px var(--font-body); text-align: center; color: var(--gold-text); background: var(--paper);
}
.blog-table tbody tr:nth-child(even) td { background: rgba(241, 233, 221, .35); }
.blog-about { margin-top: 56px; padding: 30px 32px; background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--gold); }
.blog-about h2 { font-size: clamp(24px, 2.2vw, 30px); letter-spacing: -.5px; margin: 0 0 14px; }
.blog-about p { font-size: 14.5px; line-height: 1.75; color: #3d3a35; }
.blog-about p + p { margin-top: 12px; }
.blog-about a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.blog-about .blog-disclaimer { margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--taupe); font-size: 13px; }
@media (max-width: 640px) {
  .blog-glance { padding: 20px 20px 4px; }
  .blog-glance dl { grid-template-columns: 1fr; }
  .blog-trust-orgs { padding-left: 0; }
  .blog-about { padding: 24px 20px; }
}
@media print {
  .header, .site-footer, .skip, .blog-crumbs, .blog-hero, .blog-aside, .blog-toc-mobile, .blog-related, .blog-cta, .blog-unit .button, .analytics-choice, [class^="ua-"] { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .wrap { width: 100%; max-width: none; }
  .blog-layout { display: block; margin-top: 16px; }
  .blog-unit { background: #fff; color: #000; border: 1px solid #999; }
  .blog-unit h2, .blog-unit p, .blog-unit li, .blog-unit .eyebrow { color: #000; }
  .blog-article a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; overflow-wrap: anywhere; }
  .blog-table { overflow: visible; }
  .blog-table table { min-width: 0; }
  h2, h3 { break-after: avoid; }
  .blog-table, .blog-tip, .blog-glance, .blog-takeaways { break-inside: avoid; }
}

/* The guide template (October 2026): the opening answer comes first, then At a glance and Key
   takeaways. Sections about something the reader can check open with "Why it matters" and end
   with "How to check"; checklists print with empty boxes; notes sit under their tables. */
.blog-article > p.blog-lede { font-size: 19px; line-height: 1.7; color: var(--ink); }
.blog-glance { margin: 36px 0 0; }
.blog-takeaways { margin: 16px 0 40px; }
.blog-article > p.blog-why { padding-left: 18px; border-left: 2px solid var(--gold); color: var(--ink); }
.blog-why > strong:first-child, .blog-check > strong:first-child { margin-right: 3px; font-size: 12px; font-weight: 600; letter-spacing: 1.3px; text-transform: uppercase; color: var(--gold-text); }
.blog-article > p.blog-check { margin-top: 24px; }
.blog-article > ul.blog-checklist { list-style: none; padding: 20px 24px; background: var(--paper); border: 1px solid var(--line); }
.blog-checklist li { position: relative; padding-left: 32px; }
.blog-checklist li::before { content: ""; position: absolute; left: 0; top: .42em; width: 17px; height: 17px; border: 1.5px solid var(--gold); border-radius: 3px; background: #fff; }
.blog-article > p.blog-table-note { margin-top: -14px; font-size: 13.5px; line-height: 1.6; color: var(--muted); }
@media (max-width: 640px) {
  .blog-article > p.blog-lede { font-size: 17.5px; }
  .blog-article > ul.blog-checklist { padding: 16px 18px; }
}
@media print {
  .blog-checklist { break-inside: avoid; }
  .blog-checklist li::before { border-color: #000; }
}

/* Layout fixes from the October 2026 review: the hero keeps people's faces in frame, titles
   break into even lines, a "How to check:" label with nothing after it sits close to its list,
   and on phones a table either fits the screen (short cells) or becomes one card per row, each
   cell labeled with its column, instead of hiding columns behind a sideways scroll. */
.blog-hero img { aspect-ratio: 16 / 7; object-position: center 20%; }
/* A guide's own photo (PHOTOS in content/blog/categories.mjs) with its subject high, low or to the right. */
.blog-hero img.blog-photo-top { object-position: center 4%; }
.blog-hero img.blog-photo-bottom, .blog-card img.blog-photo-bottom { object-position: center 85%; }
.blog-hero img.blog-photo-right, .blog-card img.blog-photo-right { object-position: 75% 20%; }
/* A portrait photo: the wide header shows the middle of the scene; cards and phones keep the faces. */
.blog-hero img.blog-photo-portrait { object-position: center 60%; }
.blog-card img.blog-photo-portrait { object-position: center 26%; }
@media (max-width: 640px) { .blog-hero img.blog-photo-portrait { object-position: center 26%; } }
/* On the blog home's featured card, a portrait photo (any focus) would otherwise set the card's height. */
.blog-featured .blog-card img.blog-photo-tall { height: auto; aspect-ratio: 3 / 2; }
.blog-post-head h1, .blog-card h2, .blog-card h3 { text-wrap: balance; }
.nowrap { white-space: nowrap; }
.blog-article > p.blog-check-solo { margin-bottom: -8px; }
@media (max-width: 640px) {
  .blog-hero img { aspect-ratio: 16 / 10; }
  .blog-post-head h1 { font-size: 32px; line-height: 1.12; letter-spacing: -.6px; }
  .blog-table-compact table { min-width: 0; }
  .blog-table-compact th, .blog-table-compact td { padding: 10px 12px; }
  .blog-table:not(.blog-table-compact) { overflow: visible; border: 0; background: none; }
  .blog-table:not(.blog-table-compact) table { min-width: 0; }
  .blog-table:not(.blog-table-compact) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .blog-table:not(.blog-table-compact) tbody,
  .blog-table:not(.blog-table-compact) tr,
  .blog-table:not(.blog-table-compact) td { display: block; }
  .blog-table:not(.blog-table-compact) tr { padding: 14px 16px; border: 1px solid var(--line); background: var(--paper); }
  .blog-table:not(.blog-table-compact) tr + tr { margin-top: 10px; }
  .blog-table:not(.blog-table-compact) td { padding: 0; border: 0; background: none !important; }
  .blog-table:not(.blog-table-compact) td + td { margin-top: 10px; }
  .blog-table:not(.blog-table-compact) td:first-child { font-weight: 600; color: var(--ink); }
  .blog-table:not(.blog-table-compact) td + td[data-label]::before { content: attr(data-label); display: block; margin-bottom: 3px; font-size: 11px; font-weight: 600; letter-spacing: 1.1px; text-transform: uppercase; color: var(--gold-text); }
}

/* Guides linked from the homepage and the price catalog. */
.home-guides .section-heading p { max-width: 420px; }
.home-guides-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.home-guides-list li { border-top: 1px solid var(--line); }
.home-guides-list a { display: block; padding: 20px 28px 22px 0; position: relative; font: 400 21px/1.35 var(--font-display); color: var(--ink); transition: color .2s ease; }
.home-guides-list a::after { content: "↗"; position: absolute; right: 0; top: 22px; font: 400 14px/1 var(--font-body); color: var(--gold-text); }
.home-guides-list a:hover { color: var(--gold-text); }
.home-guides-list span { display: block; margin-bottom: 8px; font: 500 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); }
.home-guides-note { margin: 18px 0 12px; font-size: 12px; color: var(--muted); }
html:not([lang="es"]) .home-guides-note { display: none; }
.catalog-guide { margin: -28px 0 44px; font-size: 13px; color: var(--muted); }
.catalog-guide span:first-child { margin-right: 6px; color: var(--ink); font-weight: 500; }
.catalog-guide a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 3px; }
.catalog-guide a:hover { color: var(--gold-text); }
@media (max-width: 760px) {
  .home-guides-list { grid-template-columns: 1fr; }
  .home-guides-list a { font-size: 19px; }
}

/* The hero's photo sits in a <picture> (AVIF or WebP, sized for phones); the box adds nothing. */
.hero-photo picture { display: contents; }
/* The hero's words fade in softly as the page opens, in CSS so they need no script. */
@keyframes uriym-hero-intro {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero-copy { animation: uriym-hero-intro 1.4s cubic-bezier(.25, .6, .3, 1) backwards; }
}

/* A field people never see or reach (off screen, out of the tab order, hidden from screen
   readers) that automated senders fill in; the API holds an inquiry that has it. */
.form-trap { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* The inquiry form says when it filled in the treatment the visitor was looking at. */
.inquiry-card .field-prefilled { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: var(--muted); }

/* The walkthrough videos (uriym.com/demo, October 2026): tabs between the two films, a large
   player with a play button, and chapters beside it that jump to a moment and follow along
   (demo.js). Without the script both films show one after the other. Videos load only when
   played, and the clinic's plays in the reader's language. */
.demo-intro { padding: 28px 0 34px; }
.demo-intro h1 { font-size: clamp(40px, 5.2vw, 76px); line-height: 1.04; letter-spacing: -1.6px; margin: 0 0 12px; }
.demo-intro .intro { max-width: 58ch; margin: 0; }
.demo-theatre { padding-bottom: 40px; }
.demo-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 24px; }
.demo-tabs[hidden] { display: none; }
.demo-tabs [role="tab"] { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 16px 22px 15px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); color: var(--ink); text-align: left; cursor: pointer; transition: background-color .25s ease, border-color .25s ease, color .25s ease, box-shadow .3s var(--motion-soft); }
.demo-tabs [role="tab"]:hover { border-color: var(--accent); box-shadow: 0 14px 30px -24px var(--surface-shadow); }
.demo-tabs [role="tab"][aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: var(--cream); }
.demo-tabs__title { font: 400 24px/1.15 var(--font-display); }
.demo-tabs__detail { font-size: 12px; line-height: 1.4; letter-spacing: .02em; color: var(--muted); }
.demo-tabs [role="tab"][aria-selected="true"] .demo-tabs__detail { color: #d9cfc1; }
.demo-film { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); grid-template-areas: "screen side" "more more"; gap: 30px 44px; padding: 0 0 64px; }
.demo-film[hidden] { display: none; }
.demo-film + .demo-film { padding-top: 56px; border-top: 1px solid var(--line); }
.demo-theatre--tabs .demo-film + .demo-film { padding-top: 0; border-top: 0; }
.demo-film__screen { grid-area: screen; min-width: 0; }
.demo-film__side { grid-area: side; min-width: 0; }
.demo-film__more { grid-area: more; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 26px 48px; }
.demo-player { position: relative; overflow: hidden; border-radius: 16px; background: var(--charcoal); box-shadow: 0 38px 70px -42px rgba(38, 32, 25, .6); }
.demo-video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; background: var(--charcoal); }
html[lang="es"] .demo-video--en,
html:not([lang="es"]) .demo-video--es,
html:not([lang="es"]) .demo-note--es { display: none; }
html[lang="es"] .demo-t--en,
html:not([lang="es"]) .demo-t--es { display: none; }
.demo-play { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 24px; border: 0; color: #fffdf8; background: linear-gradient(180deg, rgba(24, 23, 21, .12) 0%, rgba(24, 23, 21, .5) 100%); cursor: pointer; }
.demo-play[hidden], .demo-film.is-started .demo-play { display: none; }
.demo-play__icon { position: relative; width: 86px; height: 86px; margin-bottom: 6px; border-radius: 50%; background: rgba(255, 253, 248, .95); box-shadow: 0 20px 44px -18px rgba(0, 0, 0, .7); transition: transform .35s var(--motion-soft); }
.demo-play__icon::after { content: ""; position: absolute; top: 50%; left: 53%; transform: translate(-50%, -50%); border-style: solid; border-width: 15px 0 15px 25px; border-color: transparent transparent transparent var(--ink); }
.demo-play:hover .demo-play__icon, .demo-play:focus-visible .demo-play__icon { transform: scale(1.07); }
.demo-play__pill { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px; border-radius: 999px; background: rgba(24, 23, 21, .78); box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .7); }
.demo-play__label { font: 500 15px/1.3 var(--font-body); }
.demo-play__time { padding-left: 10px; border-left: 1px solid rgba(255, 253, 248, .3); font-size: 13px; letter-spacing: .04em; font-variant-numeric: tabular-nums; color: #e6dccb; }
.demo-film__note { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 18px; margin-top: 12px; font-size: 12px; color: var(--muted); }
.demo-film__note p { margin: 0; }
.demo-lang { padding: 0 0 2px; border: 0; border-bottom: 1px solid currentColor; background: none; color: var(--gold-text); font: 500 12px/1.5 var(--font-body); cursor: pointer; }
.demo-lang[hidden] { display: none; }
.demo-film__side h2 { font-size: clamp(30px, 2.8vw, 40px); line-height: 1.08; margin: 0 0 10px; }
.demo-film__side > p:not(.eyebrow) { margin: 0 0 20px; font-size: 14px; line-height: 1.7; color: var(--muted); }
.demo-film__side .eyebrow { margin-bottom: 14px; color: var(--gold-text); }
.demo-chapters { border-top: 1px solid var(--line); }
.demo-chapters summary { display: flex; justify-content: space-between; align-items: center; padding: 14px 0 10px; font: 600 11px/1.4 var(--font-body); letter-spacing: 1.6px; text-transform: uppercase; color: var(--gold-text); }
.demo-chapters summary::after { content: "↓"; font-size: 13px; letter-spacing: 0; }
.demo-chapters[open] summary::after { content: "↑"; }
.demo-chapters ol { position: relative; max-height: 330px; margin: 0; padding: 0 6px 0 0; overflow-y: auto; list-style: none; overscroll-behavior: contain; scrollbar-width: thin; }
.demo-chapters li + li { border-top: 1px solid rgba(217, 204, 186, .55); }
.demo-chapters button { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; width: 100%; padding: 9px 10px 9px 8px; border: 0; border-radius: 8px; background: none; color: var(--ink); font: 400 13px/1.5 var(--font-body); text-align: left; cursor: pointer; transition: background-color .2s ease; }
.demo-chapters button:hover { background: rgba(255, 253, 248, .85); }
.demo-chapters button.is-current { background: var(--paper); box-shadow: inset 3px 0 0 var(--gold); }
.demo-chapters__time { color: var(--gold-text); font-weight: 500; font-variant-numeric: tabular-nums; }
.demo-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 34px; margin: 0; padding: 0; list-style: none; }
.demo-points li { position: relative; padding: 12px 0 12px 26px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.6; }
.demo-points li::before { content: "✦"; position: absolute; left: 0; top: 13px; font-size: 11px; color: var(--gold); }
.demo-film__more .hero-actions { flex-direction: column; align-items: flex-start; gap: 18px; padding-bottom: 6px; }
@media (max-width: 1100px) {
  .demo-film__more { grid-template-columns: minmax(0, 1fr); }
  .demo-film__more .hero-actions { flex-direction: row; align-items: center; }
}
@media (max-width: 900px) {
  .demo-intro { padding: 12px 0 22px; }
  .demo-intro .intro { font-size: 14px; }
  .demo-tabs { gap: 8px; margin-bottom: 16px; }
  .demo-tabs [role="tab"] { padding: 12px 14px 11px; border-radius: 12px; }
  .demo-tabs__title { font-size: 19px; }
  .demo-tabs__detail { font-size: 11px; }
  .demo-film { grid-template-columns: minmax(0, 1fr); grid-template-areas: "screen" "side" "more"; gap: 24px; padding-bottom: 44px; }
  .demo-player { border-radius: 12px; }
  .demo-play__icon { width: 66px; height: 66px; }
  .demo-play__icon::after { border-width: 12px 0 12px 20px; }
  .demo-play__pill { padding: 7px 13px; }
  .demo-play__label { font-size: 13px; }
  .demo-chapters ol { max-height: none; overflow: visible; }
  .demo-points { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  /* On a phone the tab above already names the film: the button keeps its name for screen readers. */
  .demo-play__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .demo-play__time { padding-left: 0; border-left: 0; }
}

/* WhatsApp (whatsapp.js): the button the request asked for, "💬 Chat on WhatsApp" in white on
   WhatsApp's green, in the bottom-right corner of every page, in Vetir's text type. It sits above
   the assistant's "Ask Uriym" when that is on, and above the analytics question while it is open
   (--wa-lift), but under the assistant's open panel. */
.whatsapp-chat { position: fixed; z-index: 69; right: 20px; bottom: calc(20px + var(--wa-lift, 0px)); display: inline-flex; align-items: center; gap: 8px; padding: 14px 22px; border-radius: 50px; background: #25d366; color: #fff; font: 700 15px/1.2 var(--font-body); text-decoration: none; box-shadow: 0 4px 10px rgba(0, 0, 0, .2); transition: transform .2s ease, bottom .2s ease, background-color .2s ease; }
.whatsapp-chat:hover { transform: translateY(-1px); background: #1fbe5a; }
.whatsapp-chat:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
html[data-assistant="on"] .whatsapp-chat { bottom: calc(76px + var(--wa-lift, 0px)); }
@media (max-width: 600px) {
  .whatsapp-chat { right: 14px; bottom: calc(14px + var(--wa-lift, 0px)); padding: 13px 20px; font-size: 14px; }
  html[data-assistant="on"] .whatsapp-chat { bottom: calc(70px + var(--wa-lift, 0px)); }
}
@media (prefers-reduced-motion: reduce) { .whatsapp-chat { transition: none; } }
@media print { .whatsapp-chat { display: none; } }

/* Homepage hero (website feedback, October 2026): the photo and film run the full width of the
   window, with the headline, one line and one clear choice laid over a soft shade, no card. */
.header-simple + main > .hero { margin-top: -24px; }
.hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(560px, calc(100svh - 80px), 860px); overflow: hidden; background: #3a332b; color: var(--paper); }
.hero-photo { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: #c8b99f; }
.hero-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 58% center; }
.hero-photo::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(22, 20, 17, .66) 0%, rgba(22, 20, 17, .42) 38%, rgba(22, 20, 17, .08) 68%, rgba(22, 20, 17, 0) 100%), linear-gradient(0deg, rgba(22, 20, 17, .5) 0%, rgba(22, 20, 17, 0) 46%); }
.hero-copy { position: relative; z-index: 1; padding: 0 0 clamp(56px, 10vh, 104px); }
.hero h1 { max-width: 11.5em; font-size: clamp(48px, 6.3vw, 98px); line-height: 1.03; letter-spacing: -.02em; color: var(--paper); text-wrap: balance; }
.hero-line { display: block; }
.hero .hero-script { display: block; padding-right: 0; line-height: 1.08; color: #e8d2a3; }
.hero .intro { max-width: 34em; margin: 26px 0 36px; font-size: 17px; line-height: 1.65; color: rgba(255, 253, 248, .9); }
.hero .hero-actions { gap: 18px 32px; }
.hero .button { gap: 12px; padding: 16px 26px; font-size: 13px; background: var(--paper); border-color: var(--paper); color: var(--ink); }
.hero .button:hover { background: #fff; transform: none; box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .6); }
.hero .text-link { gap: 10px; font-size: 13px; color: var(--paper); }
html[lang="es"] .hero h1 { font-size: clamp(42px, 5.2vw, 82px); max-width: 13em; }
@media (max-width: 640px) {
  .header-simple + main > .hero { margin-top: -12px; }
  .hero { min-height: clamp(520px, calc(100svh - 72px), 720px); }
  .hero-photo::after { background: linear-gradient(0deg, rgba(22, 20, 17, .78) 0%, rgba(22, 20, 17, .5) 42%, rgba(22, 20, 17, .05) 72%); }
  /* The hero's buttons end above the corner buttons (WhatsApp over Ask Uriym, about 120px tall). */
  .hero-copy { padding-bottom: 136px; }
  .hero h1, html[lang="es"] .hero h1 { font-size: clamp(36px, 10.4vw, 48px); letter-spacing: -.015em; }
  .hero .intro { margin: 18px 0 26px; font-size: 15px; }
  .hero .button { padding: 15px 22px; }
}

/* ==========================================================================
   Homepage from the founders' website feedback and framework (October 15, 2026):
   straight edges on every card, photo and panel (item 9), no decorative graphics (item 10),
   lighter text (items 5 and 8), one step or answer open at a time (item 7), and a calmer
   highlight on the current step as the page scrolls.
   ========================================================================== */
.journey-option, .destination-card, .care-explorer .category-image, .care-explorer .category-sheet,
.care-explorer .category-menu button, .procedure-links button, .procedure-ask, .journey-photo, .pricing-paper,
.range-pair, .provider-invitation { border-radius: 0; }
@media (max-width: 899px) { .care-explorer .category-image { border-top-left-radius: 0; } }
@media (max-width: 640px) { .journey-photo { border-radius: 0; } }

/* Plan your own trip or join a group: a light card and a dark card tell the two apart. */
.journey-options h2 { max-width: 14em; }
.journey-options-grid { gap: 22px; margin-top: 36px; }
.journey-option { padding: 34px 34px 36px; background: var(--paper); box-shadow: none; }
.journey-option .eyebrow { margin: 0 0 14px; color: var(--gold-text); }
.journey-option h3 { margin: 0 0 16px; }
.journey-option > p:not(.eyebrow):not(.fine-print) { max-width: 46ch; color: var(--ink); }
.journey-option .fine-print { width: 100%; margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--line); font-size: 13px; color: var(--muted); }
.journey-option .button { margin-top: 26px; gap: 12px; }
.journey-option-group { background: var(--charcoal); border-color: var(--charcoal); color: var(--cream); }
.journey-option-group .eyebrow { color: #d8c29c; }
.journey-option-group > p:not(.eyebrow):not(.fine-print) { color: #f0e9de; }
.journey-option-group .fine-print { border-top-color: rgba(255, 253, 248, .18); color: #cfc5b6; }
.journey-option-group .button { background: var(--paper); border-color: var(--paper); color: var(--ink); }
.journey-option-group .button:hover { background: #fff; }

/* Where we can help: three destinations, nothing that cannot be booked. */
.destinations h2 { margin-bottom: 30px; }
.destination-card { box-shadow: none; background: var(--paper); }
.destination-card h3 { margin: 0 0 12px; }
.destination-card p { color: var(--muted); }
.destinations > .text-link { margin-top: 26px; }

/* What care are you considering? The heading and one line, then the categories. */
.care-explorer .section-heading { display: block; margin-bottom: 36px; }
.care-explorer .section-heading > p { max-width: 46ch; margin-top: 16px; font-size: 15px; }
.care-more { max-width: 270px; }
.care-more a { white-space: normal; }
.care-explorer .category-menu button { padding-inline: 12px !important; }
.care-explorer .category-menu button[aria-pressed="true"] { box-shadow: none; }
.category-menu button[aria-pressed="true"]:after { display: none; }
.procedure-links button, .procedure-ask { display: inline-block; padding: 7px 10px; background: #f3ece1; border: 1px solid #e1d4c1; font-size: 12px; line-height: 1.5; text-align: left; color: var(--ink); }
.procedure-ask:hover { background: var(--accent-pale); }

/* How your navigator helps: no labels or slogan, the photo without a caption, and a quiet
   marker for the step in view instead of a shaded box. */
.journey-aside h2 + .journey-photo { margin-top: 34px; }
.journey-photo::after { content: none; }
.journey-tools { justify-content: flex-end; }
.journey-step.is-current { transform: none; background: transparent; box-shadow: none; }
.journey-step, .journey-step summary::before { transition: color .6s ease, background-color .6s ease, transform .6s var(--motion-soft); }
.journey-step.is-current h3 { color: var(--gold); }

/* Compare treatment costs. */
.price-intro > p:not(.eyebrow) { max-width: 34ch; }
.pricing-controls { padding-top: 4px; }
.price-empty { font-size: 14px; color: var(--muted); }
.range-market { text-transform: uppercase; }
.range-unit span:first-child { color: var(--ink); }
.price-qualification { margin-top: 20px; font-size: 12px; line-height: 1.65; color: var(--muted); }
.pricing-bottom { margin-top: 20px; }
.price-all { margin-top: 0; }

/* Scheduled group trips to Tijuana: the heading beside the details, no tilted card or monogram. */
.glow-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; gap: 60px; }
.glow-copy > p:not(.eyebrow) { margin-top: 0; max-width: 52ch; color: var(--ink); }
.glow-copy .fine-print { color: var(--muted) !important; }
@media (max-width: 760px) { .glow-grid { grid-template-columns: 1fr; gap: 22px; } }

/* Work with Uriym, without the large arrow. */
.provider-invitation { align-items: center; }
.provider-invitation h2 { margin: 0; }
.provider-invitation p:not(.eyebrow) { margin-top: 0; }

/* Why I started Uriym. */
.founder-story { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 60px; align-items: start; border-bottom: 1px solid var(--line); }
.founder-copy p { max-width: 58ch; font-size: 16px; line-height: 1.8; color: var(--ink); }
.founder-copy p + p { margin-top: 16px; }
.founder-copy .founder-attribution { margin-top: 22px; font: 500 12px/1.6 var(--font-body); letter-spacing: 1.4px; text-transform: uppercase; color: var(--gold-text); }
@media (max-width: 760px) { .founder-story { grid-template-columns: 1fr; gap: 22px; } }

/* Questions: four answers, no label above them. */
.home-faq { padding-top: 70px; }
.faq-list summary { font-size: 15px; }
.faq-list details p { font-size: 14px; line-height: 1.75; }
.faq-list details p a { text-decoration: underline; text-underline-offset: 3px; }
/* The category list kept a rule for the arrow it no longer has; the names sit on the left. */
.category-menu button span:last-child { margin-left: 0; }
/* No offset block behind the price card. */
.pricing-paper { box-shadow: none; }

/* Price list (/catalog) from the founders' framework: the heading, one line, the qualification,
   straight category tabs, the tables, the facelift and BBL notes, and one button. */
.catalog-page h1 { margin: 34px 0 18px; }
.catalog-intro { margin-bottom: 14px; font-size: 15px; }
.catalog-intro a { text-decoration: underline; text-underline-offset: 3px; }
.catalog-qualification { max-width: 760px; margin: 0 0 30px; font-size: 13px; line-height: 1.65; color: var(--muted); }
.catalog-jump a { border-radius: 0; }
.catalog-note { max-width: 860px; margin: -6px 0 44px; }
.catalog-note p { font-size: 13px; line-height: 1.65; color: var(--muted); }
.catalog-note p + p { margin-top: 8px; }
.catalog-note strong { color: var(--ink); font-weight: 500; }
.catalog-note a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.catalog-ask { margin: 26px 0 90px; }
@media (max-width: 640px) { .catalog-ask { margin-bottom: 60px; } }

/* For providers, from the founders' framework: the heading, one line and one button, then
   Working together and Partnership process under their own names, with straight edges and no
   tilted sheet or slogan. */
.provider-hero { display: block; padding: 70px 0 64px; }
.provider-hero h1 { max-width: 13em; }
.provider-hero .intro { max-width: 46ch; margin: 24px 0 30px; }
.provider-values { display: block; border-top: 1px solid var(--line); }
.provider-values h2, .partner-steps h2 { font-size: clamp(32px, 3.2vw, 44px); margin: 0 0 30px; }
.provider-values-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px; }
.provider-values-grid article { border-top: 1px solid var(--line); padding-top: 24px; }
.provider-values-grid h3 { margin-bottom: 14px; }
.provider-values-grid p { font-size: 14px; color: var(--muted); }
.partner-steps ol { margin-top: 0; }
.partner-steps li h3 { font-size: 27px; }
.partner-steps > .text-link { margin-top: 10px; }
@media (max-width: 760px) { .provider-values-grid { grid-template-columns: 1fr; gap: 30px; } }

/* Inquiry pages from the founders' framework: the heading and one line, one sensitive-information
   note, the message field inside "Your plans", and short notes around the button. The email-draft
   wording shows only when the form cannot send directly (inquiry.js). */
.inquiry-intro h1 { margin: 6px 0 22px; }
.inquiry-card #inquiry-note { margin-bottom: 26px; }
.inquiry-card .inquiry-message, .inquiry-card .inquiry-topic { margin-top: 22px; margin-bottom: 0; }
.inquiry-card .inquiry-handoff { margin: 0 0 16px; padding: 12px 16px; border-left: 2px solid #b49b73; background: #f7f3eb; font-size: 13px; line-height: 1.7; color: var(--ink); }
.inquiry-card .inquiry-handoff[hidden], .inquiry-card .inquiry-fallback[hidden] { display: none; }
.inquiry-card .inquiry-booking-note, .inquiry-card .inquiry-fallback { margin: 12px 0 0; font-size: 12px; line-height: 1.7; color: var(--muted); }
.inquiry-card .inquiry-fallback a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.inquiry-card, form.inquiry-card, .inquiry-sent, .inquiry-card input:not([type=hidden]), .inquiry-card select, .inquiry-card textarea { border-radius: 0; }

/* The founders' portal review (October 22, 2026): the logo sits at the far left and the links at
   the far right, without "For providers". On the homepage the header is transparent over the hero,
   with a light wordmark and a soft shade at the top of the photo so the links stay legible; it turns
   solid once the page scrolls, and an open phone menu gets the paper background back. */
.header.header-simple { padding-inline: clamp(20px, 3.4vw, 48px); }
.header-simple #navigation { justify-content: flex-end; }
.brand-on-photo { display: none; }
.header.header-simple.header-over { position: fixed; left: 0; right: 0; margin: 0; }
.header-over + main > .hero { margin-top: 0; min-height: clamp(600px, 100svh, 940px); }
@media (max-width: 640px) { .header-over + main > .hero { min-height: clamp(560px, 100svh, 800px); } }
.header.header-simple.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) { background: transparent; }
.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) .brand-on-paper { display: none; }
.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) .brand-on-photo { display: block; }
.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) :is(#navigation a, #navigation .button, .site-language button, .site-language button[aria-pressed="true"], .menu-toggle) { color: #fffdf8; }
.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) :is(#navigation a, #navigation .button):hover { color: #e8d2a3; }
.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) .menu-toggle { border-color: rgba(255, 253, 248, .6); background: transparent; }
.hero-photo::before { content: ""; position: absolute; inset: 0 0 auto; height: 180px; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(22, 20, 17, .5) 0%, rgba(22, 20, 17, 0) 100%); }

/* The founders' portal review (October 22, 2026): the footer keeps patient sign-in, provider
   sign-in with one "Work with Uriym" link, and contact, and everything in it is centred. */
.site-footer .footer-nav { margin-inline: auto; justify-items: center; text-align: center; }
.site-footer .footer-social { justify-content: center; margin: 12px 0 0; }
.site-footer .footer-bottom { align-items: center; text-align: center; }
.site-footer .footer-legal { justify-content: center; }
.site-footer .footer-sign-off { justify-content: center; }
@media (max-width: 640px) { .site-footer .footer-nav { grid-template-columns: 1fr 1fr; } }

/* The founders' portal review (October 22, 2026): "Buttons across the site should be rounded.
   Remove as many box frames as possible." Buttons, treatment chips and price-category links are
   pills; cards, panels, the inquiry forms and the analytics notice lose their outline and keep
   their fill and straight edges (item 9 of October 15). Form fields keep an outline so they stay
   easy to find, with soft corners to match the buttons. */
.button, a.button, button.button, .analytics-choice .button, .procedure-links button, .procedure-ask, .catalog-jump a { border-radius: 999px; }
.journey-option, .destination-card, .care-explorer .category-sheet, form.inquiry-card, .inquiry-card, .analytics-choice { border-color: transparent; }
.procedure-links button, .procedure-ask, .catalog-jump a { border-color: transparent; }
.inquiry-card input:not([type=hidden]):not([type=checkbox]):not([type=radio]), .inquiry-card select, .inquiry-card textarea { border-radius: 10px; }
.inquiry-card #inquiry-submit { border-radius: 999px; }

/* /inquiry became the care request (the founders' portal review, October 22, 2026): the page only
   shows while it forwards, or when scripts are off. */
.inquiry-moved { padding: 80px 0 110px; }
.inquiry-moved .intro { max-width: 40em; margin: 20px 0 32px; }

/* ==========================================================================
   Homepage cleanup (October 25, 2026): the same sections, copy and footage, set at a readable
   size, with a few ideas taken from the Golden hour option (/new-homepage-3): clear pill buttons,
   photographs for the destinations and the group trips, and the Tijuana price as the largest
   figure in its chapter. Flat surfaces replace the textures. The founders' rules above still hold:
   straight edges on cards, photos and panels, no box frames or decorative graphics, rounded
   buttons, and the logo at the far left with the links at the far right. Everything below is
   scoped to the homepage (main.home) except the header, which every page shares.
   ========================================================================== */

/* Header, on every page: the same items at 15px instead of 13px, "Talk to a navigator" as a filled
   pill like every other button, and a smaller logo, so the row reads at a glance. Over the
   homepage photograph the pill turns paper-coloured. */
.header.header-simple { min-height: 76px; padding-block: 12px; column-gap: 32px; }
.header.header-simple .brand-stacked { width: 132px; }
.header.header-simple.is-scrolled { padding-block: 8px; }
.header.header-simple.is-scrolled .brand-stacked { width: 112px; }
.header.header-simple #navigation { gap: 30px; }
.header.header-simple #navigation a { padding-block: 12px; font: 500 15px/1.2 var(--font-body); letter-spacing: 0; }
.header.header-simple #navigation a:not(.button):hover { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1px; text-decoration-color: var(--accent); text-underline-offset: 8px; }
.header.header-simple #navigation .button { min-height: 46px; padding: 0 24px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper); font-weight: 600; text-decoration: none; }
.header.header-simple #navigation .button:hover { border-color: #3d3b36; background: #3d3b36; color: var(--paper); }
.header.header-simple .site-language button { font-size: 13px; }
.header.header-simple.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) #navigation .button { border-color: var(--paper); background: var(--paper); color: var(--ink); }
.header.header-simple.header-over:not(.is-scrolled):not(:has(#navigation.is-open)) #navigation .button:hover { border-color: #fff; background: #fff; color: var(--ink); }
/* The logo's column fits the logo, and between 1151 and 1320px the row tightens so the Spanish
   labels, the longest, still clear the logo. */
@media (min-width: 1151px) { .header.header-simple { grid-template-columns: auto minmax(0, 1fr) auto; } }
@media (min-width: 1151px) and (max-width: 1320px) {
  .header.header-simple { column-gap: 24px; }
  .header.header-simple #navigation { gap: 22px; }
  .header.header-simple #navigation a { font-size: 14px; }
  .header.header-simple #navigation .button { padding: 0 18px; }
}
@media (max-width: 1150px) {
  .header.header-simple .menu-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 16px; border: 1px solid currentColor; border-radius: 999px; font: 500 14px/1 var(--font-body); }
  .header.header-simple #navigation.is-open { gap: 0; padding: 6px 0 22px; }
  .header.header-simple #navigation.is-open a:not(.button) { padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 17px; }
  .header.header-simple #navigation.is-open .button { margin-top: 20px; min-height: 52px; font-size: 16px; }
}
@media (max-width: 640px) {
  .header.header-simple .brand-stacked { width: 116px; }
  .header.header-simple.is-scrolled .brand-stacked { width: 104px; }
}

/* The homepage's type and buttons: 17px reading text and 15px buttons and links instead of 12 to
   14px, and the section headings a step larger and tighter. */
body:has(main.home) { background-image: none; }
#main.home h2 { font-size: clamp(40px, 4.4vw, 64px); line-height: 1.04; letter-spacing: -.022em; text-wrap: balance; }
#main.home .button { min-height: 52px; padding: 0 26px; gap: 10px; font-size: 15px; font-weight: 600; line-height: 1.2; }
#main.home .button:hover { transform: none; box-shadow: none; }
#main.home .text-link { gap: 10px; font-size: 15px; font-weight: 500; line-height: 1.4; padding-bottom: 4px !important; border-bottom-color: var(--accent) !important; transition: border-color .2s ease; }
#main.home .text-link:hover { border-bottom-color: currentColor !important; }
#main.home .section { padding-block: clamp(80px, 8.5vw, 128px); border-top: 0; }

/* Hero: the footage, headline and choice as they were, with buttons and text at a readable size. */
#main.home .hero .intro { max-width: 36em; font-size: 18px; line-height: 1.6; }
#main.home .hero .button { min-height: 54px; padding: 0 28px; }

/* Flat surfaces in place of the textures: cream, then sand behind the destinations, paper behind
   the care explorer, sand again behind the navigator's steps, and the dark price chapter. */
#main.home .journey-options::before { background: var(--cream); }
#main.home .destinations::before { background: #efe7da; }
#main.home .care-explorer::before { background: #fbf8f2; }
#main.home .journey::before { background: #f3ece1; }

/* Plan your own trip or join a group: the light and the dark card, roomier, with the confirmation
   line and the button lined up at the foot of both. */
#main.home .journey-options h2 { max-width: 13em; }
#main.home .journey-options-grid { gap: 24px; margin-top: clamp(36px, 4vw, 56px); }
#main.home .journey-option { padding: clamp(32px, 3.6vw, 52px); }
#main.home .journey-option .eyebrow { margin: 0 0 18px; font-size: 12px; font-weight: 600; letter-spacing: .16em; }
#main.home .journey-option h3 { margin: 0 0 18px; font-size: clamp(30px, 2.6vw, 38px); line-height: 1.1; letter-spacing: -.012em; }
#main.home .journey-option > p:not(.eyebrow):not(.fine-print) { margin-bottom: 28px; font-size: 17px; line-height: 1.65; }
#main.home .journey-option .fine-print { margin-top: auto; padding-top: 18px; font-size: 14px; line-height: 1.6; }
#main.home .journey-option .button { margin-top: 28px; }

/* Where we can help: each destination as a photograph with its name and line laid over a soft
   shade at the foot, straight-edged like every photo on the site. */
#main.home .destinations { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; column-gap: 32px; }
#main.home .destinations h2 { grid-column: 1; grid-row: 1; margin: 0; }
#main.home .destinations > .text-link { grid-column: 2; grid-row: 1; justify-self: end; margin: 0 0 10px; }
#main.home .destination-grid { grid-column: 1 / -1; grid-row: 2; gap: 20px; margin-top: clamp(32px, 4vw, 52px); }
#main.home .destination-card { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; aspect-ratio: 4 / 5; padding: clamp(24px, 2.4vw, 34px); overflow: hidden; border: 0; background: #3b2f26; box-shadow: none; color: var(--paper); }
#main.home .destination-card img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
#main.home .destination-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(22, 20, 17, .84) 0%, rgba(22, 20, 17, .5) 30%, rgba(22, 20, 17, 0) 58%); }
#main.home .destination-card h3 { margin: 0 0 8px; font-size: clamp(28px, 2.4vw, 36px); line-height: 1.05; color: var(--paper); }
#main.home .destination-card p { max-width: 30ch; font-size: 15px; line-height: 1.55; color: rgba(255, 253, 248, .92); }

/* What care are you considering? The categories as a plain list with the chosen one marked by a
   gold rule, and the photograph beside the description instead of a card laid over it. */
#main.home .care-explorer .section-heading { margin-bottom: clamp(32px, 3.6vw, 48px); }
#main.home .care-explorer .section-heading > p { max-width: 52ch; margin-top: 18px; font-size: 17px; color: var(--muted); }
#main.home .explorer-grid { grid-template-columns: 250px minmax(0, 1fr); gap: clamp(36px, 4.4vw, 64px); }
#main.home .category-menu { border-top: 1px solid var(--line); }
#main.home .category-menu button { min-height: 56px; padding: 14px 0 14px 16px !important; border-bottom: 1px solid var(--line) !important; border-radius: 0; background: transparent; box-shadow: none; transform: none; font-size: 16px; font-weight: 400; color: var(--muted); }
#main.home .category-menu button:hover { background: transparent; color: var(--ink); transform: none; }
#main.home .category-menu button[aria-pressed="true"] { background: transparent; box-shadow: inset 2px 0 0 var(--gold); color: var(--ink); font-weight: 500; }
#main.home .care-more { max-width: 250px; margin-top: 24px; font-size: 15px; }
#main.home .care-explorer .category-stage { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(28px, 3.4vw, 52px); align-items: center; padding: 0; }
#main.home .care-explorer .category-image { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; box-shadow: none; }
#main.home .care-explorer .category-sheet { position: static; width: auto; min-height: 0; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
#main.home .category-sheet h3 { margin: 0 0 16px; font-size: clamp(32px, 2.8vw, 42px); line-height: 1.08; }
#main.home .category-sheet p:not(.eyebrow) { font-size: 16px; line-height: 1.65; color: var(--muted); }
#main.home .procedure-links { gap: 10px; margin-top: 26px; }
#main.home .procedure-links button, #main.home .procedure-ask { padding: 10px 18px !important; border: 0 !important; background: #efe6d8 !important; box-shadow: none; transform: none; font-size: 14px; font-weight: 500; line-height: 1.3; color: var(--ink); }
#main.home .procedure-links button:hover, #main.home .procedure-ask:hover { background: var(--accent-pale) !important; box-shadow: none; transform: none; }

/* How your navigator helps: the photograph full width under the heading, and the steps at a
   reading size. */
#main.home .journey { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: clamp(48px, 6vw, 96px); }
#main.home .journey-photo { width: 100%; height: auto; aspect-ratio: 4 / 3; margin-top: 40px; border-radius: 0; box-shadow: none; }
#main.home .journey-tools { padding-bottom: 20px; }
#main.home .journey-tools .text-link { font-size: 14px; }
#main.home .journey-step summary { padding: 26px 0; }
#main.home .journey-step h3 { font-size: clamp(28px, 2.4vw, 34px); line-height: 1.12; }
#main.home .journey-step > p { max-width: 52ch; padding: 0 12px 28px 0; font-size: 16px; line-height: 1.7; color: var(--muted); }

/* Compare treatment costs: the dark chapter without the white card inside it. The selectors and the
   figures sit on the dark ground, Tijuana's range largest and the United States' below it. */
#main.home .pricing { padding: clamp(88px, 9vw, 136px) 0; }
#main.home .price-layout { grid-template-columns: minmax(0, .8fr) minmax(0, 1.45fr); column-gap: clamp(40px, 6vw, 96px); row-gap: 32px; }
#main.home .price-intro { padding-top: 0; }
#main.home .price-intro > p:not(.eyebrow) { max-width: 34ch; margin: 22px 0 0; font-size: 17px; line-height: 1.65; color: #ddd3c6; }
#main.home .pricing-paper { padding: 0; background: transparent; box-shadow: none; color: var(--paper); }
#main.home .pricing-controls { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 24px; padding: 0; }
#main.home .pricing-controls label { font-size: 13px; color: #cfc5b6; }
#main.home .pricing-controls select { margin-top: 6px; padding: 12px 30px 12px 0; border-bottom: 1px solid rgba(255, 253, 248, .38); -webkit-appearance: none; appearance: none; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fffdf8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 2px center / 16px; font-size: 17px; font-weight: 500; color: var(--paper); cursor: pointer; }
#main.home .pricing-controls select:hover { border-bottom-color: var(--paper); }
#main.home .pricing-controls option { background: #fff; color: var(--ink); }
#main.home #price-results h3 { margin: 40px 0 10px; font-size: clamp(28px, 2.4vw, 36px); line-height: 1.1; color: var(--paper); }
#main.home .procedure-description { max-width: 60ch; margin: 0 0 8px; font-size: 15px; line-height: 1.6; color: #cfc5b6; }
#main.home .range-pair { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 28px; padding: 0; background: transparent; }
#main.home .range-pair .eyebrow { margin-bottom: 10px; font-size: 12px; font-weight: 600; letter-spacing: .16em; color: #d8c29c; }
#main.home .range-amount { font: 400 clamp(40px, 5.6vw, 84px)/1 var(--font-display); letter-spacing: -.02em; font-variant-numeric: lining-nums proportional-nums; color: var(--paper); }
#main.home .range-pair > div + div .range-amount { font-size: clamp(28px, 2.6vw, 40px); color: #cfc5b6; }
#main.home .range-amount.is-reference { white-space: normal; }
#main.home .range-unit { margin-top: 22px; font-size: 14px; color: #cfc5b6; }
#main.home .range-unit span:first-child { color: var(--paper); }
#main.home .price-reference { font-size: 13px; color: #bfb5a6; }
#main.home .price-reference a { color: var(--paper); }
#main.home .price-empty { margin-top: 40px; font-size: 15px; color: #cfc5b6; }
#main.home .price-qualification { max-width: 70ch; margin-top: 18px; font-size: 13px; line-height: 1.65; color: #b3a99b; }
#main.home .pricing-bottom { justify-content: flex-start; margin-top: 30px; }
#main.home #price-inquiry { min-height: 52px; padding: 0 26px !important; border: 0 !important; border-radius: 999px; background: var(--paper); color: var(--ink); font-weight: 600; }
#main.home #price-inquiry:hover { background: #fff; }
#main.home .price-all { color: #e4c998; }
#main.home .monthly-details { border-top-color: rgba(255, 253, 248, .18); color: #cfc5b6; }
#main.home .monthly-details article { border-bottom-color: rgba(255, 253, 248, .18); }
#main.home .monthly-details div { color: #cfc5b6; }

/* Scheduled group trips to Tijuana: the details beside a photograph of a group on the way. */
#main.home .glow { padding: clamp(88px, 9vw, 136px) 0; background: var(--cream); }
#main.home .glow-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-rows: 1fr auto auto 1fr; grid-template-areas: ". photo" "title photo" "copy photo" ". photo"; column-gap: clamp(40px, 6vw, 96px); row-gap: 0; align-items: start; }
#main.home .glow-grid > h2 { grid-area: title; max-width: 11em; margin-bottom: 24px; }
#main.home .glow-copy { grid-area: copy; }
#main.home .glow-photo { grid-area: photo; aspect-ratio: 4 / 3; margin: 0; overflow: hidden; background: #d9cbb6; }
#main.home .glow-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
#main.home .glow-copy > p:not(.eyebrow) { max-width: 46ch; font-size: 17px; line-height: 1.65; }
#main.home .glow-copy .fine-print { margin: 18px 0 30px !important; font-size: 14px !important; line-height: 1.6; }
#main.home .glow-copy .text-link { min-height: 52px; padding: 0 26px !important; border: 0 !important; border-radius: 999px; background: var(--ink); color: var(--paper); font-weight: 600; }
#main.home .glow-copy .text-link:hover { background: #34332f; }

/* Work with Uriym: one quiet panel for clinics. */
#main.home .provider-invitation { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; margin-block: 0; padding: clamp(36px, 4vw, 56px) clamp(32px, 5vw, 72px); background: #ece3d5; }
#main.home .provider-invitation h2 { font-size: clamp(36px, 3.6vw, 52px); }
#main.home .provider-invitation p:not(.eyebrow) { max-width: 44ch; margin: 0 0 26px; font-size: 16px; line-height: 1.65; }

/* Questions: four answers at a reading size. */
#main.home .home-faq { padding-block: clamp(80px, 8vw, 120px); }
#main.home .home-faq .faq-list { max-width: 880px; padding-top: 0; border-top: 1px solid var(--line); }
#main.home .faq-list summary { align-items: center; padding: 24px 0; font-size: 18px; font-weight: 500; line-height: 1.4; }
#main.home .faq-list summary span { flex: none; font-size: 24px; line-height: 1; }
#main.home .faq-list details p { max-width: 64ch; padding: 0 40px 26px 0; font-size: 16px; line-height: 1.7; color: var(--muted); }

@media (max-width: 1100px) {
  #main.home .explorer-grid { grid-template-columns: 210px minmax(0, 1fr); }
  #main.home .care-explorer .category-stage { grid-template-columns: minmax(0, 1fr); }
  #main.home .destination-card p { font-size: 14px; }
}
@media (max-width: 899px) {
  #main.home .explorer-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  #main.home .category-menu { flex-direction: row; flex-wrap: wrap; gap: 8px; border: 0; }
  #main.home .category-menu button { min-height: 44px; padding: 10px 16px !important; border: 1px solid var(--line) !important; border-radius: 999px; font-size: 14px; }
  #main.home .category-menu button[aria-pressed="true"] { border-color: var(--ink) !important; background: var(--ink); box-shadow: none; color: var(--paper); }
  #main.home .care-more { max-width: none; }
  #main.home .journey { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  #main.home .price-layout { grid-template-columns: minmax(0, 1fr); }
  #main.home .price-all { grid-column: 1; }
  #main.home .glow-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "photo" "title" "copy"; }
  #main.home .glow-photo { margin-bottom: 32px; }
  #main.home .provider-invitation { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 800px) {
  #main.home .destinations { display: block; }
  #main.home .destination-grid { grid-template-columns: minmax(0, 1fr); }
  #main.home .destination-card { aspect-ratio: 4 / 3; }
  #main.home .destination-card img { object-position: 50% 42%; }
  #main.home .destinations > .text-link { margin-top: 26px; }
}
@media (max-width: 640px) {
  #main.home .section, #main.home .pricing, #main.home .glow { padding-block: 72px; }
  #main.home .hero .intro { font-size: 16px; }
  /* The Spanish headline is longer: a step smaller on phones keeps "con acompañamiento" on one line. */
  html[lang="es"] #main.home .hero h1 { font-size: clamp(26px, 8.4vw, 40px); }
  #main.home .journey-options-grid { grid-template-columns: minmax(0, 1fr); }
  #main.home .pricing-controls { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  #main.home .range-amount { white-space: normal; }
  #main.home .provider-invitation { padding: 44px 24px; }
}

/* ==========================================================================
   Premium layer (October 26, 2026): "a very premium, luxurious feel" across the website. One
   system for every page: a warmer, deeper palette with espresso chapters and champagne accents,
   quiet typography with more air around it, hairlines instead of frames, slower and softer motion,
   and a dark footer that closes each page. The founders' rules above all still hold: straight
   edges on cards, photos and panels; no box frames or decorative graphics; rounded buttons; the
   logo at the far left and the links at the far right; the footer centred. WhatsApp keeps the
   green the request asked for.
   ========================================================================== */
:root {
  --cream: #f6f1e8;
  --paper: #fbf8f2;
  --ink: #1d1b18;
  --muted: #6b645a;
  --gold: #9a7a4b;
  --gold-text: #7b6140;
  --accent: #b8955c;
  --accent-pale: #efe5d3;
  --line: #e2d8c8;
  --charcoal: #1f1b17;
  --taupe: #ebe2d4;
  --ivory-deep: #f1eadf;
  --stone: #e8ddcd;
  --sand: #efe7da;
  --espresso: #1f1b17;
  --on-dark: #f6f1e8;
  --on-dark-muted: #c8beaf;
  --champagne: #dcc39a;
  --ease-lux: cubic-bezier(.22, .61, .36, 1);
}
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
body { background-color: var(--cream); background-image: none; font-size: 16px; }
::selection { background: #ead9bb; color: var(--ink); }
p, li, dd { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }
h1 { letter-spacing: -.025em; }
h2 { letter-spacing: -.02em; }
h3 { letter-spacing: -.012em; }
em { color: var(--gold); }

/* Labels: small capitals with wide tracking, in the gold reserved for them. */
.eyebrow { font-size: 11.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-text); }

/* More air between chapters. */
.section { padding-block: clamp(72px, 7vw, 112px); }
#main.home .section, #main.home .pricing, #main.home .glow, #main.home .home-faq { padding-block: clamp(72px, 7vw, 112px); }

/* Buttons: the same pills, unhurried, with a soft lift instead of a jump. */
.button, a.button, button.button { letter-spacing: .02em; transition: background-color .45s var(--ease-lux), color .45s var(--ease-lux), border-color .45s var(--ease-lux), box-shadow .45s var(--ease-lux), transform .45s var(--ease-lux); }
.button:hover { transform: none; background: #2d2924; border-color: #2d2924; box-shadow: 0 18px 36px -24px rgba(29, 27, 24, .6); }
#main.home .button { font-weight: 500; letter-spacing: .02em; }
main .button { min-height: 50px; padding: 0 26px; gap: 12px; font-size: 14.5px; font-weight: 500; line-height: 1.2; }
main .button.small { min-height: 44px; padding: 0 20px; font-size: 14px; }
main .text-link { font-size: 14.5px; }
main .intro { max-width: 44ch; font-size: 17px; line-height: 1.7; }
.text-link { transition: color .35s var(--ease-lux), border-color .35s var(--ease-lux); }

/* Header: on scroll it frosts over the page instead of turning flat paper. */
.header.header-simple.is-scrolled { background: rgba(251, 248, 242, .82); -webkit-backdrop-filter: saturate(1.3) blur(16px); backdrop-filter: saturate(1.3) blur(16px); box-shadow: 0 1px 0 rgba(29, 27, 24, .07); }
.header.header-simple #navigation a:not(.button) { transition: color .3s var(--ease-lux); }
.header.header-simple #navigation .button { font-weight: 500; letter-spacing: .02em; }
.header.header-simple #navigation .button:hover { border-color: #2d2924; background: #2d2924; }

/* Hero: a slow settle of the photograph as the page opens, and a headline with more presence. */
@keyframes lux-settle { from { transform: scale(1.06); } to { transform: scale(1); } }
@media (prefers-reduced-motion: no-preference) {
  .hero-photo > picture img, .hero-photo > img { animation: lux-settle 9s var(--ease-lux) both; }
}
@media (min-width: 641px) { .hero h1 { font-size: clamp(50px, 6.8vw, 108px); line-height: 1.0; letter-spacing: -.025em; } }
.hero .hero-script { color: var(--champagne); }
.hero-photo::after { background: linear-gradient(90deg, rgba(20, 17, 14, .7) 0%, rgba(20, 17, 14, .44) 38%, rgba(20, 17, 14, .08) 68%, rgba(20, 17, 14, 0) 100%), linear-gradient(0deg, rgba(20, 17, 14, .55) 0%, rgba(20, 17, 14, 0) 48%); }
#main.home .hero .intro { font-size: 18.5px; line-height: 1.65; color: rgba(255, 253, 248, .88); }
#main.home .hero .button { font-weight: 500; }

/* Homepage chapters: deeper contrast between the paper and the espresso surfaces. */
#main.home .journey-options-grid { gap: clamp(20px, 2vw, 32px); }
#main.home .journey-option { padding: clamp(40px, 4.4vw, 64px); }
#main.home .journey-option h3 { font-size: clamp(30px, 2.8vw, 42px); }
#main.home .journey-option .fine-print { border-top-color: var(--line); }
#main.home .destinations::before { background: var(--sand); }
#main.home .journey::before { background: #f2ebdf; }
#main.home .provider-invitation { background: var(--sand); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  #main.home .destination-card img, #main.home .glow-photo img, #main.home .journey-photo img { transition: transform 1.6s var(--ease-lux); }
  #main.home .destination-card:hover img { transform: scale(1.045); }
  #main.home .glow-photo:hover img { transform: scale(1.03); }
}
#main.home .procedure-links button, #main.home .procedure-ask { background: var(--sand) !important; transition: background-color .35s var(--ease-lux), color .35s var(--ease-lux); }
#main.home .procedure-links button:hover, #main.home .procedure-ask:hover { background: var(--ink) !important; color: var(--paper); }
#main.home .range-amount { font-variant-numeric: lining-nums tabular-nums; }
#main.home .faq-list summary { font: 400 clamp(20px, 1.7vw, 24px)/1.3 var(--font-display); letter-spacing: -.01em; }
#main.home .faq-list summary span { color: var(--gold); font-family: var(--font-body); font-weight: 300; }

/* Treatment costs: tables set like a printed price list, with hairlines in place of the black bar. */
.catalog-page h1 { font-size: clamp(48px, 5.4vw, 80px); letter-spacing: -.025em; }
.catalog-intro { font-size: 17px; line-height: 1.7; color: var(--ink); }
.catalog-qualification { font-size: 14px; }
.catalog-jump { gap: 10px; margin-bottom: 56px; }
.catalog-jump a { padding: 10px 18px; border: 0; background: var(--sand); font-size: 14px; transition: background-color .35s var(--ease-lux), color .35s var(--ease-lux); }
.catalog-jump a:hover { background: var(--ink); color: var(--paper); }
.catalog-table { margin: 22px 0 64px; font-size: 15px; }
.catalog-table td:first-child { color: var(--ink); font-weight: 500; }
.catalog-table td:nth-child(n + 2) { font-variant-numeric: lining-nums tabular-nums; color: #3a362f; }
@media (min-width: 641px) {
  .catalog-table th { padding: 0 18px 14px; border-bottom: 1px solid var(--ink); background: transparent; color: var(--gold-text); font: 600 11.5px/1.4 var(--font-body); letter-spacing: .16em; text-transform: uppercase; vertical-align: bottom; }
  .catalog-table td { padding: 20px 18px; border-bottom: 1px solid var(--line); }
  .catalog-table tbody tr { transition: background-color .3s var(--ease-lux); }
  .catalog-table tbody tr:hover { background: rgba(239, 231, 218, .55); }
}
@media (max-width: 640px) {
  .catalog-table tbody { border-top: 1px solid var(--ink); }
  .catalog-table caption { display: block; width: 100%; }
  .catalog-table tr { padding: 18px 0; }
  .catalog-table td[data-label]:before { color: var(--gold-text); }
}
.catalog-page h2 { font-size: clamp(30px, 2.8vw, 40px); }
.catalog-table caption { margin-bottom: 18px; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.1; letter-spacing: -.015em; color: var(--ink); }

/* Providers, legal and inquiry pages share the quieter rhythm. */
.provider-hero { padding: clamp(72px, 8vw, 120px) 0 clamp(64px, 7vw, 104px); }
.provider-values-grid { gap: clamp(32px, 4vw, 64px); }
.provider-values-grid p { font-size: 15.5px; line-height: 1.7; }

/* Forms: hairline fields on paper, a gold ring when in use. */
.inquiry-card input:not([type=hidden]):not([type=checkbox]):not([type=radio]), .inquiry-card select, .inquiry-card textarea { border-color: #d6cab8; background: var(--paper); transition: border-color .3s var(--ease-lux), box-shadow .3s var(--ease-lux); }
.inquiry-card input:not([type=hidden]):not([type=checkbox]):not([type=radio]):focus, .inquiry-card select:focus, .inquiry-card textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(184, 149, 92, .18); outline: none; }

/* The blog: guides listed like an editorial index, three to a row, without frames. */
.blog-home-head h1 { font-size: clamp(48px, 5.6vw, 84px); letter-spacing: -.025em; }
.blog-home-head .intro { font-size: 18px; line-height: 1.65; }
.blog-topics a { border-color: transparent !important; background: var(--sand); transition: background-color .35s var(--ease-lux), color .35s var(--ease-lux); }
.blog-topics a:hover { background: var(--ink); color: var(--paper); }
.blog-topics a[aria-current="page"] { background: var(--ink); color: var(--paper); }
.blog-grid { gap: clamp(48px, 4.6vw, 72px) clamp(28px, 2.6vw, 44px); }
@media (min-width: 1100px) { .blog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.blog-card { border: 0; background: transparent; box-shadow: none; }
.blog-card:hover { border-color: transparent; box-shadow: none; transform: none; }
.blog-card img { transition: opacity .6s var(--ease-lux); }
.blog-card:hover img { opacity: .9; }
.blog-card-text { padding: 22px 0 0; }
.blog-card h2, .blog-card h3 { font-size: clamp(23px, 1.9vw, 27px); line-height: 1.18; letter-spacing: -.012em; transition: color .35s var(--ease-lux); }
.blog-card:hover h2, .blog-card:hover h3 { color: var(--gold-text); }
.blog-card-text > p:not(.eyebrow):not(.blog-meta) { font-size: 15px; line-height: 1.7; }
.blog-featured { margin-bottom: clamp(72px, 7vw, 112px); }
@media (min-width: 900px) {
  .blog-featured .blog-card { background: transparent; column-gap: clamp(40px, 5vw, 80px); }
  .blog-featured .blog-card img { min-height: 460px; }
  .blog-featured .blog-card-text { padding: 0; }
  .blog-featured .blog-card h2 { font-size: clamp(36px, 3.6vw, 56px); line-height: 1.06; letter-spacing: -.02em; }
}
.blog-how { border: 0; background: var(--paper); padding: clamp(40px, 5vw, 72px); }

/* A guide: hairlines and soft paper panels in place of framed boxes. */
.blog-post-head h1 { letter-spacing: -.022em; }
.blog-byline { border-block-color: var(--line); }
.blog-trust-orgs a { border-color: transparent; background: var(--sand); }
.blog-trust-orgs a:hover { border-color: transparent; background: var(--accent-pale); }
.blog-glance, .blog-takeaways, .blog-about, .blog-toc-mobile { border: 0; background: var(--paper); }
.blog-takeaways { padding: 30px 34px; border-left: 0; box-shadow: inset 2px 0 0 var(--gold); }
.blog-about { border-top: 0; box-shadow: inset 0 2px 0 var(--gold); }
.blog-table { border: 0; border-top: 1px solid var(--ink); background: transparent; }
.blog-table th { background: transparent; color: var(--gold-text); font: 600 11.5px/1.45 var(--font-body); letter-spacing: .14em; text-transform: uppercase; border-bottom: 1px solid var(--line); }
.blog-table td { border-top: 0; border-bottom: 1px solid var(--line); }
.blog-table tbody tr:nth-child(even) td { background: transparent; }
.blog-article > h2 { letter-spacing: -.018em; }
.blog-unit { background: var(--espresso); }
.blog-unit .eyebrow, .catalog-cta .eyebrow { color: var(--champagne); }
@media (max-width: 640px) {
  .blog-takeaways { padding: 24px 22px; }
  /* On phones each table row is a card: paper without a frame, and no rule above the first. */
  .blog-table:not(.blog-table-compact) { border-top: 0; }
  .blog-table:not(.blog-table-compact) tr { border: 0; background: var(--paper); padding: 18px 20px; }
}

/* The analytics question: the same choice, set as a quiet paper note. */
.analytics-choice { box-shadow: 0 30px 60px -36px rgba(29, 27, 24, .45); }

/* Footer: a dark close to every page, full width, everything centred as the founders asked. */
footer.site-footer { margin-top: 0; padding: clamp(72px, 8vw, 112px) 0 48px; border-top: 0; background: var(--espresso); box-shadow: 0 0 0 100vmax var(--espresso); clip-path: inset(0 -100vmax); color: var(--on-dark-muted); }
.site-footer .footer-nav h2 { color: var(--champagne); letter-spacing: .2em; }
.site-footer .footer-nav a, .site-footer .footer-legal a, .site-footer .footer-legal .footer-choices { color: var(--on-dark); transition: color .3s var(--ease-lux); }
.site-footer .footer-nav a:hover, .site-footer .footer-legal a:hover, .site-footer .footer-legal .footer-choices:hover { color: var(--champagne); }
.site-footer .footer-social a { color: var(--on-dark-muted); transition: color .3s var(--ease-lux); }
.site-footer .footer-social a:hover { color: var(--champagne); }
.site-footer .footer-bottom { margin-top: clamp(40px, 4vw, 56px); padding-top: 28px; border-top-color: rgba(246, 241, 232, .14); color: var(--on-dark-muted); }
.site-footer .footer-legal { color: var(--on-dark-muted); }
.site-footer .footer-legal a, .site-footer .footer-legal .footer-choices { color: var(--on-dark-muted); }
.site-footer .footer-disclaimer { color: #a99f90; }
.site-footer .footer-sign-off { margin-top: clamp(36px, 4vw, 52px); }
.site-footer .footer-sign-off .brand-stacked { width: 132px; }
.site-footer .footer-sign-off p { color: var(--champagne); letter-spacing: .22em; }
@media (max-width: 900px) {
  footer.site-footer { padding-bottom: 104px; }
  html[data-assistant="on"] footer.site-footer { padding-bottom: 160px; }
}
@media (max-width: 640px) { footer.site-footer { padding-top: 64px; } }

/* "What care are you considering?" (October 27, 2026, from the Golden hour option). The Ask Uriym
   panel sat beside it until October 28, when the founders took it out of this section; Ask Uriym
   stays in the corner of every page. */
#main.home .care-explorer .care-head > div:first-child > p { max-width: 40ch; margin-top: 18px; font-size: 17px; color: var(--muted); }

/* The corner (October 27, 2026): instead of a green WhatsApp pill stacked over the assistant's dark
   pill, one quiet dock: a round WhatsApp button (WhatsApp's green glyph on espresso glass) beside
   "Ask Uriym". On the homepage both wait until the hero has scrolled away, since the hero has its own
   two buttons and the care section below has the question field (whatsapp.js sets html.dock-away). */
.whatsapp-chat.whatsapp-chat { display: inline-grid; place-items: center; width: 54px; height: 54px; padding: 0; gap: 0; border-radius: 50%; background: rgba(29, 27, 24, .9); color: #25d366; -webkit-backdrop-filter: saturate(1.2) blur(14px); backdrop-filter: saturate(1.2) blur(14px); box-shadow: 0 16px 34px -18px rgba(29, 27, 24, .75), inset 0 0 0 1px rgba(246, 241, 232, .12); transition: transform .45s var(--ease-lux), opacity .45s var(--ease-lux), visibility .45s, bottom .2s ease, right .2s ease, background-color .3s var(--ease-lux); }
.whatsapp-chat.whatsapp-chat:hover { transform: translateY(-2px); background: var(--espresso); }
.whatsapp-chat svg { width: 26px; height: 26px; fill: currentColor; }
.whatsapp-chat .wa-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html[data-assistant="on"] .whatsapp-chat.whatsapp-chat { bottom: calc(20px + var(--wa-lift, 0px)); right: calc(30px + var(--ask-width, 150px)); }
body .uriym-assistant .ua-launcher { height: 54px; padding: 0 22px 0 18px; gap: 10px; background: rgba(29, 27, 24, .9); -webkit-backdrop-filter: saturate(1.2) blur(14px); backdrop-filter: saturate(1.2) blur(14px); font: 500 14.5px/1 var(--font-body); letter-spacing: .02em; color: var(--paper); box-shadow: 0 16px 34px -18px rgba(29, 27, 24, .75), inset 0 0 0 1px rgba(246, 241, 232, .12); transition: transform .45s var(--ease-lux), opacity .45s var(--ease-lux), visibility .45s, bottom .2s ease; }
body .uriym-assistant .ua-launcher:hover { transform: translateY(-2px); }
body .uriym-assistant .ua-launcher svg { stroke: var(--champagne); fill: rgba(220, 195, 154, .14); }
html.dock-away .whatsapp-chat.whatsapp-chat, html.dock-away body .uriym-assistant .ua-launcher { opacity: 0; visibility: hidden; transform: translateY(14px); pointer-events: none; }
@media (max-width: 600px) {
  .whatsapp-chat.whatsapp-chat { width: 50px; height: 50px; right: 14px; bottom: calc(14px + var(--wa-lift, 0px)); }
  html[data-assistant="on"] .whatsapp-chat.whatsapp-chat { bottom: calc(14px + var(--wa-lift, 0px)); right: calc(22px + var(--ask-width, 140px)); }
  body .uriym-assistant .ua-launcher { height: 50px; }
  /* The hero no longer has to clear the corner buttons: they wait until it has scrolled away. */
  #main.home .hero-copy { padding-bottom: 64px; }
}
@media (prefers-reduced-motion: reduce) { .whatsapp-chat.whatsapp-chat, body .uriym-assistant .ua-launcher { transition: none; } }

/* Questions, answered (October 28, 2026): the four questions had no heading and floated in a
   narrow centred column between the clinics' panel and the footer. A heading, a line and the way
   to a navigator sit on the left; the questions take the rest of the page's width on the right. */
#main.home .home-faq { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 112px); align-items: start; }
#main.home .home-faq .faq-list { max-width: none; margin: 0; }
#main.home .faq-head h2 { max-width: 8em; }
#main.home .faq-head p { max-width: 34ch; margin-top: 20px; font-size: 17px; line-height: 1.6; color: var(--muted); }
#main.home .faq-head .text-link { margin-top: 28px; }
@media (max-width: 899px) {
  #main.home .home-faq { grid-template-columns: minmax(0, 1fr); gap: 36px; }
}

/* Type (November 6, 2026): the type of /new-homepage across the site. Headlines are Inter Display (the
   cut Inter's optical-size axis gives by itself at large sizes), light and tight; titles under about
   30px stay at the regular weight, a little tight. The family has no italics here: the words a heading
   picks out keep their gold and stand upright. Labels set in their own weight and tracking keep them. */
h1, h2 { font-weight: 300; }
h3 { font-weight: 400; }
h1 { letter-spacing: -.045em; }
h2 { letter-spacing: -.04em; }
h3 { letter-spacing: -.025em; }
em, .hero-script, .journey-step[open] h3 { font-style: normal; }
:is(h1, h2, h3) em, .hero-script { font-weight: inherit; letter-spacing: inherit; }
.hero h1, html[lang="es"] .hero h1, .not-found h1, .inquiry-intro h1, .demo-intro h1, .catalog-page h1, .blog-home-head h1, .blog-post-head h1 { letter-spacing: -.045em; }
@media (min-width: 641px) { .hero h1 { line-height: .98; } }
#main.home h2, .blog-featured .blog-card h2, .blog-article > h2, .blog-faq h2, .blog-sources h2, .blog-about h2 { letter-spacing: -.04em; }
.blog-card h2, .blog-card h3 { font-weight: 400; letter-spacing: -.025em; }
.blog-featured .blog-card h2 { font-weight: 300; letter-spacing: -.04em; }
#main.home .journey-option h3, .blog-article > h3 { letter-spacing: -.025em; }
.catalog-table caption, .destination-names, .provider-invitation-mark { font-weight: 300; letter-spacing: -.035em; }
#main.home .range-amount { font-weight: 300; letter-spacing: -.045em; }
.journey-photo-note, .home-guides-list a, .demo-tabs__title, #main.home .faq-list summary { letter-spacing: -.02em; }