:root {
  --paper:#f7f1e8;
  --paper-light:#fcf9f4;
  --ink:#3e271e;
  --muted:#796a60;
  --wine:#851c35;
  --line:#ded2c4;
  --serif:Georgia,'Times New Roman',serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif
}
.full-story-link {
  margin-top:28px;
  max-width:100%;
  text-align:center;
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:35px
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.75
}
body.modal-open {
  overflow:hidden
}
a {
  color:inherit;
  text-decoration:none
}
button {
  font:inherit;
  cursor:pointer
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button:focus-visible,a:focus-visible,summary:focus-visible {
  outline:3px solid var(--wine);
  outline-offset:6px
}
img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
h1,h2,h3,p,figure {
  margin:0
}
h1,h2,h3 {
  font-family:var(--serif);
  font-weight:400;
  line-height:1.1
}
h2 {
  font-size:clamp(35px,4.2vw,58px);
  letter-spacing:-1.7px
}
h2 em {
  font-weight:400;
  color:var(--wine)
}
p+p {
  margin-top:20px
}
em {
  font-family:var(--serif)
}
.header {
  height:108px;
  display:flex;
  align-items:center;
  gap:40px;
  padding:0 6.3%;
  position:absolute;
  inset:0 0 auto;
  z-index:2
}
.brand {
  font-family:var(--serif);
  font-size:28px;
  letter-spacing:6px;
  white-space:nowrap
}
.brand span {
  font-size:26px;
  color:var(--wine);
  margin-right:13px;
  letter-spacing:0
}
.header-line {
  height:1px;
  background:var(--line);
  flex:1;
  max-width:290px
}
.header nav {
  display:flex;
  gap:37px;
  margin-left:auto;
  font-family:var(--serif);
  font-size:19px
}
.header nav a {
  padding:10px 0;
  border-bottom:1px solid transparent
}
.header nav a:hover {
  border-color:var(--wine);
  color:var(--wine)
}
.hero {
  min-height:820px;
  position:relative;
  overflow:hidden;
  isolation:isolate
}
.hero-copy {
  position:relative;
  width:61%;
  padding:145px 0 65px 6.3%;
  z-index:1
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:2.3px;
  font-size:10px;
  font-weight:600;
  line-height:1.6;
  color:var(--muted)
}
.hero-copy .eyebrow {
  margin-bottom:19px
}
.hero h1 {
  font-size:clamp(110px,14.6vw,210px);
  letter-spacing:4px;
  line-height:.85;
  margin-left:-7px
}
.hero-subtitle {
  font-family:var(--serif);
  font-size:clamp(25px,3vw,42px);
  line-height:1.3;
  margin-top:16px
}
.heart {
  color:var(--wine)
}
.small-rule {
  display:block;
  width:66px;
  height:1px;
  background:#b69680;
  margin:28px 0
}
.hero h2 {
  font-size:clamp(42px,4.8vw,67px);
  line-height:1.05
}
.hero-welcome {
  font-family:var(--serif);
  font-size:25px;
  margin-top:17px
}
.hero-visual {
  position:absolute;
  inset:0 0 0 45%;
  z-index:-1;
  background:#d8c9b6
}
.hero-visual img {
  object-fit:cover;
  object-position:50% 47%
}
.hero-fade {
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,var(--paper) 0%,rgba(247,241,232,.85) 9%,rgba(247,241,232,.25) 27%,transparent 45%),linear-gradient(0deg,var(--paper),transparent 13%)
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:28px;
  margin-top:30px
}
.button {
  border:1px solid var(--wine);
  background:var(--wine);
  color:#fff9f0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:37px;
  border-radius:60px;
  padding:13px 29px;
  font-size:14px;
  font-weight:500;
  transition:background .2s,transform .2s
}
.button:hover {
  background:#641227;
  transform:translateY(-2px)
}
.button span {
  font-size:23px;
  font-weight:300;
  line-height:1
}
.text-link {
  font-size:13px;
  border-bottom:1px solid #b9a99b;
  padding:4px 0
}
.text-link span {
  margin-left:10px
}
.hero-note {
  display:flex;
  align-items:center;
  gap:18px;
  font-family:var(--serif);
  letter-spacing:1.8px;
  font-size:14px;
  color:var(--muted);
  margin-top:55px
}
.hero-note span {
  width:38px;
  height:1px;
  background:#c9b6a4
}
.section {
  padding:95px 7%;
  max-width:1600px;
  margin:auto
}
.intro {
  padding-top:85px
}
.intro-top {
  display:flex;
  justify-content:space-between;
  align-items:start;
  margin-bottom:37px
}
.intro-kicker {
  font-family:var(--serif);
  font-size:18px;
  line-height:1.45;
  text-align:right
}
.intro-kicker span {
  color:var(--muted)
}
.intro-main {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:12%
}
.intro-main h2 {
  font-size:clamp(34px,3.8vw,52px);
  line-height:1.16
}
.intro-text {
  color:var(--muted);
  font-size:15px;
  max-width:480px;
  padding-top:5px
}
.intro-text p:nth-child(2) {
  color:var(--ink);
  font-family:var(--serif);
  font-size:23px
}
.facts {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);
  margin-top:55px;
  padding-top:29px;
  gap:25px
}
.facts div+div {
  border-left:1px solid var(--line);
  padding-left:36px
}
.facts span {
  font-family:var(--serif);
  font-size:29px
}
.facts p {
  font-size:12px;
  color:var(--muted);
  margin-top:5px
}
.story {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9%;
  background:var(--paper-light);
  align-items:center
}
.photo-window {
  display:block;
  overflow:hidden;
  background:#e5dbce;
  position:relative
}
.story-photo .photo-window {
  aspect-ratio:4/5;
  border-radius:140px 140px 4px 4px
}
.kitten img {
  transform:scale(1.28);
  object-position:50% 37%
}
.photo-caption {
  display:block;
  font-size:11px;
  letter-spacing:.3px;
  color:var(--muted);
  margin-top:15px
}
.story-copy h2 {
  font-size:clamp(33px,3.4vw,48px);
  margin:19px 0 28px;
  line-height:1.15
}
.story-copy>p:not(.eyebrow),.story-more p {
  font-size:14px;
  color:var(--muted)
}
.story-more {
  margin-top:25px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}
summary {
  cursor:pointer;
  list-style:none;
  padding:17px 0;
  font-size:13px;
  color:var(--wine);
  display:flex;
  justify-content:space-between
}
summary::-webkit-details-marker {
  display:none
}
summary span {
  font-size:20px;
  line-height:1
}
.story-more[open] summary span {
  transform:rotate(45deg)
}
.story-more>div {
  padding:3px 0 24px
}
.heart-story {
  text-align:center;
  max-width:800px;
  padding-top:84px;
  padding-bottom:84px
}
.motif {
  font-size:57px;
  font-family:var(--serif);
  line-height:1;
  display:block;
  margin-bottom:19px
}
.heart-story h2 {
  margin:20px 0 25px
}
.heart-story>p:not(.eyebrow) {
  font-size:14px;
  color:var(--muted);
  max-width:520px;
  margin-left:auto;
  margin-right:auto
}
.heart-story .heart-signature {
  font-family:var(--serif);
  font-style:italic;
  font-size:21px!important;
  color:var(--ink)!important
}
.gallery {
  border-top:1px solid var(--line)
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:43px
}
.section-heading h2 {
  font-size:clamp(34px,3.8vw,51px);
  margin-top:17px
}
.section-heading>p {
  font-size:13px;
  line-height:1.8;
  color:var(--muted);
  max-width:360px
}
.gallery-grid {
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:30px 24px;
  align-items:start
}
.gallery-item {
  border:0;
  background:transparent;
  padding:0;
  text-align:left;
  color:var(--ink);
  min-width:0
}
.gallery-item .photo-window {
  aspect-ratio:4/4.6;
  border-radius:3px
}
.gallery-item img {
  transition:transform .5s ease;
  object-position:center
}
.gallery-item:hover img {
  transform:scale(1.04)
}
.gallery-item:first-child .photo-window {
  border-radius:100px 100px 3px 3px
}
.gallery-item .heart-photo img {
  object-fit:contain;
  background:#cdc2b3
}
.gallery-item .baby-photo img {
  transform:scale(1.06);
  object-position:50% 49%
}
.gallery-item .window-photo img {
  transform:scale(1.22);
  object-position:54% 45%
}
.gallery-item:hover .window-photo img {
  transform:scale(1.26)
}
.gallery-caption {
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-family:var(--serif);
  font-size:17px;
  margin-top:12px;
  line-height:1.4
}
.gallery-caption>span {
  color:var(--wine)
}
.gallery-hint {
  text-align:center;
  color:var(--muted);
  font-size:11px;
  margin-top:35px
}






.farewell {
  background:#eee5d8;
  border-top:1px solid var(--line);
  text-align:center;
  padding-top:85px;
  padding-bottom:85px
}
.farewell>.heart {
  font-size:24px
}
.farewell h2 {
  margin:22px 0
}
.farewell>p {
  font-size:14px;
  color:var(--muted)
}
.farewell .signature {
  font-size:31px;
  font-family:var(--serif);
  font-style:italic;
  color:var(--wine);
  margin-top:26px
}
.footer {
  border-top:1px solid var(--line);
  margin:0 6.3%;
  padding:31px 0;
  display:flex;
  align-items:center;
  gap:27px
}
.footer .brand {
  font-size:26px;
  letter-spacing:4px
}
.footer .brand span {
  font-size:23px;
  margin-right:7px
}
.footer p,.footer button,.back-top {
  font-size:clamp(16px,1.1vw,18px);
  color:var(--ink)
}
.footer button,.footer .back-top {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:500
}
.footer .plain-button {
  margin-left:auto
}
.plain-button,.inline-button {
  background:none;
  border:0;
  padding:0;
  color:inherit;
  text-decoration:underline;
  text-underline-offset:4px
}
.back-top {
  white-space:nowrap;
  padding:8px 17px;
  border:1px solid #bda48f;
  border-radius:30px;
  color:var(--wine)
}
.back-top:hover {
  background:#eee5d8;
  border-color:var(--wine)
}
.cookie-banner {
  position:fixed;
  left:24px;
  bottom:22px;
  width:min(660px,calc(100% - 48px));
  z-index:5;
  background:#fffcf7;
  border:1px solid var(--line);
  box-shadow:0 10px 55px #38221724;
  padding:23px 45px 23px 26px;
  border-radius:8px;
  display:flex;
  align-items:center;
  gap:24px
}
.cookie-banner[hidden] {
  display:none
}
.cookie-title {
  font-family:var(--serif);
  font-size:19px
}
.cookie-title span {
  color:var(--wine)
}
.cookie-banner p+p {
  font-size:11px;
  line-height:1.65;
  color:var(--muted);
  margin-top:7px
}
.small {
  padding:10px 21px;
  white-space:nowrap;
  font-size:12px
}
.cookie-close {
  position:absolute;
  right:12px;
  top:7px;
  border:0;
  background:none;
  color:var(--muted);
  font-size:24px
}
.inline-button {
  font-size:inherit
}
.skip {
  position:fixed;
  top:-100px;
  left:20px;
  background:var(--paper-light);
  padding:12px;
  z-index:20
}
.skip:focus {
  top:10px
}
dialog {
  border:0;
  color:var(--ink);
  padding:0
}
dialog::backdrop {
  background:#241a15c9;
  backdrop-filter:blur(6px)
}
.lightbox {
  width:min(650px,94vw);
  background:var(--paper);
  border-radius:8px;
  padding:32px 35px 20px;
  max-height:94dvh;
  overflow:auto
}
.modal-close {
  position:absolute;
  top:9px;
  right:13px;
  background:var(--paper-light);
  border:0;
  width:34px;
  height:34px;
  border-radius:50%;
  font-size:25px;
  line-height:1;
  z-index:2;
  color:var(--ink)
}
.lightbox-frame {
  height:min(65dvh,650px);
  overflow:hidden;
  border-radius:3px
}
.lightbox-frame img {
  object-fit:contain
}
.lightbox-frame.baby-photo {
  max-width:430px;
  aspect-ratio:4/5;
  height:auto;
  max-height:65dvh;
  margin:auto
}
.lightbox-frame.baby-photo img {
  width:100%;
  height:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  transform:scale(1.06)
}
.lightbox-frame.window-photo img {
  object-fit:contain
}
.lightbox figcaption {
  font-family:var(--serif);
  font-size:21px;
  text-align:center;
  margin-top:17px
}
.lightbox-controls {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  margin-top:13px
}
.lightbox-controls button {
  border:1px solid var(--line);
  border-radius:50%;
  width:42px;
  height:42px;
  background:none;
  color:var(--ink)
}
.lightbox-controls span {
  font-size:12px;
  color:var(--muted)
}
.privacy {
  width:min(580px,92vw);
  padding:44px 35px;
  border-radius:8px;
  max-height:90dvh
}
.privacy h2 {
  font-size:33px;
  margin:15px 0 22px;
  letter-spacing:-1px
}
.privacy>p:not(.eyebrow) {
  font-size:14px;
  color:var(--muted)
}
.privacy code {
  font-size:12px;
  overflow-wrap:anywhere
}
.privacy .button {
  margin-top:25px
}
@media(min-width:1600px) {
  .hero {
    max-width:1600px;
    margin:auto
  }
  .header {
    max-width:1600px;
    margin:auto
  }
}
@media(max-width:1000px) {
  .header {
    gap:20px;
    padding:0 5%
  }
  .header-line {
    display:none
  }
  .header nav {
    gap:24px
  }
  .hero {
    min-height:760px
  }
  .hero-copy {
    padding-left:5%;
    width:66%;
    padding-top:150px
  }
  .hero-visual {
    left:43%
  }
  .hero-fade {
    background:linear-gradient(90deg,var(--paper),#f7f1e8b3 13%,transparent 50%),linear-gradient(0deg,var(--paper),transparent 15%)
  }
  .hero-actions {
    gap:17px
  }
  .hero .button {
    padding:12px 22px;
    gap:23px
  }
  .hero-note {
    font-size:12px;
    margin-top:45px
  }
  .section {
    padding:70px 6%
  }
  .intro-main {
    gap:7%
  }
  .story {
    gap:6%
  }
  .gallery-grid {
    gap:26px 18px
  }
  .gallery-caption {
    font-size:15px
  }
  .section-heading {
    align-items:start;
    gap:25px
  }
  .section-heading>p {
    max-width:240px
  }
  .footer {
    flex-wrap:wrap
  }
  .footer p {
    display:none
  }
}
@media(max-width:700px) {
  html {
    scroll-padding-top:20px
  }
  .header {
    height:85px;
    padding:0 6%;
    gap:16px
  }
  .brand {
    font-size:23px;
    letter-spacing:4px
  }
  .brand span {
    font-size:20px;
    margin-right:5px
  }
  .header nav {
    gap:15px;
    font-family:var(--sans);
    font-size:11px
  }
  .header nav a {
    white-space:nowrap
  }
  .hero {
    min-height:auto;
    display:flex;
    flex-direction:column;
    overflow:hidden
  }
  .hero-copy {
    padding:115px 7% 0;
    width:100%;
    order:0
  }
  .hero-copy .eyebrow {
    font-size:9px;
    margin-bottom:23px
  }
  .hero h1 {
    font-size:clamp(100px,26vw,160px);
    margin-left:-4px;
    letter-spacing:1px
  }
  .hero-subtitle {
    font-size:28px;
    margin-top:13px
  }
  .small-rule {
    margin:24px 0;
    width:48px
  }
  .hero h2 {
    font-size:48px
  }
  .hero-welcome {
    font-size:22px;
    margin-top:14px
  }
  .hero-actions {
    margin-top:24px;
    gap:24px;
    flex-wrap:wrap
  }
  .hero-note {
    display:none
  }
  .hero-visual {
    position:relative;
    inset:auto;
    width:100%;
    height:560px;
    order:1;
    z-index:0;
    margin-top:26px;
    background:var(--paper)
  }
  .hero-visual img {
    object-fit:contain;
    object-position:center;
    height:100%;
    width:100%
  }
  .hero-fade {
    background:linear-gradient(90deg,var(--paper),transparent 26%,transparent 74%,var(--paper)),linear-gradient(0deg,var(--paper),transparent 14%,transparent 90%,var(--paper));
    pointer-events:none
  }
  .section {
    padding:58px 7%
  }
  .intro-top {
    margin-bottom:29px
  }
  .intro-kicker {
    font-size:15px
  }
  .intro-main {
    display:block
  }
  .intro-main h2 {
    font-size:37px;
    letter-spacing:-1.2px
  }
  .intro-text {
    margin-top:27px;
    font-size:14px;
    max-width:none
  }
  .facts {
    gap:12px;
    margin-top:34px;
    padding-top:23px
  }
  .facts div+div {
    padding-left:12px
  }
  .facts span {
    font-size:20px;
    line-height:1.2;
    display:block
  }
  .facts p {
    font-size:10px;
    line-height:1.6;
    margin-top:9px
  }
  .story {
    display:flex;
    flex-direction:column;
    gap:32px;
    align-items:stretch
  }
  .story-photo {
    max-width:450px;
    margin:auto;
    width:100%
  }
  .story-photo .photo-window {
    aspect-ratio:1/1.08;
    border-radius:110px 110px 3px 3px
  }
  .story-copy h2 {
    font-size:36px
  }
  .story-copy>p:not(.eyebrow) {
    font-size:14px
  }
  .heart-story h2 {
    font-size:39px
  }
  .heart-story>p:not(.eyebrow) {
    font-size:14px
  }
  .section-heading {
    display:block;
    margin-bottom:29px
  }
  .section-heading h2 {
    font-size:37px
  }
  .section-heading>p {
    max-width:none;
    margin-top:20px;
    font-size:12px
  }
  .gallery-grid {
    grid-template-columns:1fr 1fr;
    gap:25px 15px
  }
  .gallery-item .photo-window {
    aspect-ratio:3/4
  }
  .gallery-caption {
    font-size:15px
  }
  .gallery-item:first-child .photo-window {
    border-radius:65px 65px 3px 3px
  }
  .gallery-item .baby-photo img {
    transform:scale(1.22)
  }
  .gallery-item .heart-photo img {
    object-fit:cover;
    object-position:center
  }





  .farewell h2 {
    font-size:38px
  }
  .farewell p br {
    display:none
  }
  .footer {
    margin:0 7%;
    padding:25px 0;
    display:grid;
    grid-template-columns:1fr auto;
    gap:18px 12px
  }
  .footer .brand {
    grid-column:1 / -1
  }
  .footer .plain-button {
    margin-left:0;
    justify-self:start;
    font-size:14px
  }
  .footer .back-top {
    margin-left:0;
    font-size:14px;
    padding:8px 12px
  }
  .cookie-banner {
    left:12px;
    bottom:12px;
    width:calc(100% - 24px);
    padding:20px 30px 20px 19px;
    gap:15px;
    flex-wrap:wrap
  }
  .cookie-title {
    font-size:18px
  }
  .cookie-banner .button {
    padding:8px 22px
  }
  .cookie-banner p+p {
    font-size:11px
  }
  .lightbox {
    padding:44px 15px 18px
  }
  .privacy {
    padding:43px 25px
  }
  .lightbox figcaption {
    font-size:18px
  }
  .lightbox-frame {
    height:60dvh
  }
}
@media(max-width:370px) {
  .header nav {
    gap:10px;
    font-size:10px
  }
  .brand {
    font-size:21px
  }
  .hero h2 {
    font-size:42px
  }
  .hero-actions {
    gap:15px
  }
  .hero-visual {
    height:480px
  }
  .facts span {
    font-size:18px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    transition:none!important;
    animation:none!important
  }
}
/* Keep the complete portrait and the heart on the paws visible. */
@media(min-width:701px) {
  .hero-visual {
    inset:100px 0 0 45%;
    background:var(--paper)
  }
  .hero-visual img {
    object-fit:contain;
    object-position:70% center
  }
  .hero-fade {
    background:linear-gradient(90deg,var(--paper),rgba(247,241,232,.7) 12%,transparent 37%),linear-gradient(0deg,var(--paper),transparent 12%)
  }
  .header {
    background:linear-gradient(180deg,var(--paper) 65%,rgba(247,241,232,.85) 85%,transparent)
  }
}
@media(min-width:701px) {
  .hero-visual img {
    mask-image:linear-gradient(90deg,transparent 3%,#000 23%,#000 86%,transparent 100%)
  }
  .hero-fade {
    background:linear-gradient(90deg,var(--paper),rgba(247,241,232,.5) 12%,transparent 35%),linear-gradient(0deg,var(--paper),transparent 12%,transparent 95%,var(--paper))
  }
}
.gallery-item .heart-photo img {
  object-fit:cover;
  object-position:50% 12%
}
.gallery-item .window-photo img {
  transform:scale(1.05)
}
.gallery-item:hover .window-photo img {
  transform:scale(1.09)
}
@media(max-width:700px) {
  .hero-copy {
    padding-top:102px
  }
  .hero-copy .eyebrow {
    margin-bottom:17px
  }
  .hero h1 {
    font-size:clamp(88px,25vw,125px)
  }
  .hero h2 {
    font-size:39px
  }
  .hero-subtitle {
    font-size:25px
  }
  .small-rule {
    margin:20px 0
  }
  .hero-welcome {
    font-size:20px
  }
  .hero-actions {
    margin-top:21px
  }
  .hero-visual {
    height:490px;
    margin-top:18px
  }
}
@media(min-width:701px) {
  .hero-visual img {
    position:absolute;
    right:7%;
    width:auto;
    max-width:100%;
    height:100%
  }
}

/* The restored kitten photograph no longer contains screenshot letterboxing. */
.gallery-item .baby-photo img {
  transform:none;
  object-position:50% 30%;
}
.gallery-item:hover .baby-photo img {
  transform:scale(1.04);
}