@import url("styles.css");

.standalone-header { position: sticky; top: 0; z-index: 50; min-height: 72px; padding: 10px 5vw; display: flex; align-items: center; justify-content: space-between; gap: 24px; background: oklch(98% .009 75 / .96); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.standalone-header .brand img { width: 240px; height: auto; }
.standalone-back { padding-bottom: 3px; border-bottom: 1px solid var(--ink); font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.standalone-hero { padding: clamp(72px, 8vw, 124px) 5vw clamp(58px, 6vw, 92px); background: linear-gradient(115deg, var(--cream), var(--mist)); }
.standalone-hero-inner { max-width: 1180px; margin: auto; display: grid; grid-template-columns: 1.15fr .85fr; gap: 8vw; align-items: end; }
.standalone-hero h1 { max-width: 850px; margin: 0; font-family: var(--serif); font-size: clamp(52px, 6vw, 88px); font-weight: 800; line-height: .98; letter-spacing: -.04em; }
.standalone-hero p { max-width: 540px; margin: 0 0 8px; font-size: 17px; }
.standalone-content { max-width: 1180px; margin: auto; padding: clamp(68px, 7vw, 108px) 5vw; }
.source-intro { max-width: 820px; margin: 0 0 48px; padding-left: 22px; border-left: 2px solid var(--sage); }
.source-intro p { margin: 0; font-size: 16px; }
.source-intro p + p { margin-top: 12px; color: rgb(51 51 51 / 72%); }
.source-group + .source-group { margin-top: 68px; }
.source-heading { margin-bottom: 24px; padding-bottom: 18px; display: flex; align-items: end; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.source-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(34px, 4vw, 52px); line-height: 1; }
.source-heading p { margin: 0; font-size: 11px; color: rgb(51 51 51 / 68%); }
.source-heading a, .source-link { white-space: nowrap; font-size: 10px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; text-decoration: underline; text-underline-offset: 4px; }
.review-source-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.review-source-card { min-height: 238px; padding: clamp(24px, 3vw, 38px); display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 26px; background: var(--paper); }
.source-tag { align-self: flex-start; margin-bottom: 24px; padding: 7px 10px 6px; border-radius: 999px; font-size: 9px; font-weight: 850; line-height: 1; letter-spacing: .08em; text-transform: uppercase; }
.source-tag-google { color: var(--teal); background: var(--mist); }
.source-tag-doctoralia { color: var(--teal); background: var(--pink); }
.review-source-card blockquote { margin: 0 0 28px; font-family: var(--serif); font-size: clamp(22px, 2.1vw, 29px); font-weight: 650; line-height: 1.35; }
.review-source-card footer { margin-top: auto; display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.review-source-card small { font-size: 9px; line-height: 1.5; letter-spacing: .07em; text-transform: uppercase; color: rgb(51 51 51 / 68%); }
.reviews-context { margin-top: 48px; padding: 22px 0 0; border-top: 1px solid var(--line); font-size: 12px; color: rgb(51 51 51 / 70%); }
.library-main { background: var(--paper); }
.library-main .content-complement { max-width: 1320px; margin: auto; }
.library-note { max-width: 760px; margin: 42px auto 0; padding-top: 22px; border-top: 1px solid var(--line); font-size: 12px; color: rgb(51 51 51 / 70%); }

@media (max-width: 820px) {
  .standalone-header { min-height: 66px; padding-inline: 20px; }
  .standalone-header .brand img { width: 165px; }
  .standalone-back { font-size: 9px; }
  .standalone-hero { padding: 58px 20px 48px; }
  .standalone-hero-inner { grid-template-columns: 1fr; gap: 25px; }
  .standalone-hero p { font-size: 15px; }
  .standalone-content { padding: 62px 20px; }
  .source-heading { align-items: flex-start; flex-direction: column; }
  .review-source-grid { grid-template-columns: 1fr; }
  .review-source-card { min-height: 190px; }
  .library-main .content-complement { padding-inline: 20px; }
}