:root {
      --pet-ink: #27332f;
      --pet-text: #56645f;
      --pet-sage: #819b8f;
      --pet-sage-deep: #526f63;
      --pet-sage-pale: #eaf1ed;
      --pet-cream: #fbf8f2;
      --pet-warm: #d9c4a6;
      --pet-white: #ffffff;
      --pet-border: rgba(82, 111, 99, 0.16);
      --pet-shadow: 0 18px 45px rgba(39, 51, 47, 0.10);
    }

    body {
      color: var(--pet-text);
      background: var(--pet-white);
    }

    .petloss-page *,
    .petloss-page *::before,
    .petloss-page *::after {
      box-sizing: border-box;
    }

    .petloss-page {
      overflow: hidden;
      font-family: Georgia, "Times New Roman", serif;
      line-height: 1.75;
      color: var(--pet-text);
      background: var(--pet-white);
    }

    .petloss-page img {
      display: block;
      max-width: 100%;
    }

    .petloss-page a {
      transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s ease;
    }

    .petloss-shell {
      width: min(1160px, calc(100% - 40px));
      margin: 0 auto;
    }

    .petloss-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin: 0 0 18px;
      color: var(--pet-sage-deep);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 2.2px;
      line-height: 1.3;
      text-transform: uppercase;
    }

    .petloss-eyebrow::before {
      width: 34px;
      height: 1px;
      content: "";
      background: var(--pet-warm);
    }

    .petloss-hero {
      position: relative;
      min-height: 650px;
      display: flex;
      align-items: center;
      isolation: isolate;
      background:
        radial-gradient(circle at 84% 17%, rgba(217, 196, 166, .22), transparent 26%),
        linear-gradient(120deg, #f6f2ea 0%, #edf3ef 55%, #dce8e2 100%);
    }

    .petloss-hero::before,
    .petloss-hero::after {
      position: absolute;
      z-index: -1;
      border: 1px solid rgba(82, 111, 99, .12);
      border-radius: 50%;
      content: "";
    }

    .petloss-hero::before {
      width: 460px;
      height: 460px;
      top: -230px;
      right: -90px;
    }

    .petloss-hero::after {
      width: 290px;
      height: 290px;
      left: -150px;
      bottom: -120px;
    }

    .petloss-hero-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
      align-items: center;
      gap: 72px;
      padding: 82px 0;
    }

    .petloss-hero h1 {
      max-width: 720px;
      margin: 0 0 24px;
      color: var(--pet-ink);
      font-size: clamp(42px, 5vw, 70px);
      font-weight: 400;
      letter-spacing: -1.5px;
      line-height: 1.08;
    }

    .petloss-lead {
      max-width: 670px;
      margin: 0 0 32px;
      color: #4f5e58;
      font-size: clamp(18px, 2vw, 22px);
      line-height: 1.75;
    }

    .petloss-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .petloss-button {
      display: inline-flex;
      min-height: 50px;
      align-items: center;
      justify-content: center;
      padding: 13px 24px;
      border: 1px solid var(--pet-sage-deep);
      border-radius: 30px;
      color: var(--pet-white) !important;
      background: var(--pet-sage-deep);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: .25px;
      text-decoration: none;
    }

    .petloss-button:hover {
      transform: translateY(-2px);
      background: #3f5c50;
    }

    .petloss-button--light {
      color: var(--pet-sage-deep) !important;
      background: transparent;
    }

    .petloss-button--light:hover {
      background: rgba(255, 255, 255, .58);
    }

    .petloss-hero-visual {
      position: relative;
      width: min(440px, 100%);
      justify-self: end;
    }

    .petloss-photo-frame {
      position: relative;
      overflow: hidden;
      aspect-ratio: 4 / 5;
      padding: 14px;
      border: 1px solid rgba(255,255,255,.78);
      border-radius: 220px 220px 26px 26px;
      background: rgba(255,255,255,.42);
      box-shadow: var(--pet-shadow);
    }

    .petloss-photo-frame img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 205px 205px 18px 18px;
    }

    .petloss-memory-note {
      position: absolute;
      right: -34px;
      bottom: 34px;
      max-width: 245px;
      padding: 20px 22px;
      border: 1px solid rgba(217,196,166,.52);
      border-radius: 12px;
      color: var(--pet-ink);
      background: rgba(255,255,255,.94);
      box-shadow: 0 14px 35px rgba(39,51,47,.13);
      font-size: 17px;
      font-style: italic;
      line-height: 1.55;
    }

    .petloss-paw {
      width: 55px;
      height: 55px;
      margin: 0 0 14px;
      color: var(--pet-sage-deep);
      opacity: .82;
    }

    .petloss-section {
      padding: 100px 0;
    }

    .petloss-section--cream {
      background: var(--pet-cream);
    }

    .petloss-section--sage {
      color: rgba(255,255,255,.82);
      background: var(--pet-sage-deep);
    }

    .petloss-section--sage h2,
    .petloss-section--sage h3 {
      color: var(--pet-white);
    }

    .petloss-section--sage .petloss-eyebrow {
      color: #f0e4d3;
    }

    .petloss-heading {
      max-width: 760px;
      margin: 0 auto 54px;
      text-align: center;
    }

    .petloss-heading h2,
    .petloss-split-copy h2,
    .petloss-artisan-copy h2,
    .petloss-resources h2 {
      margin: 0 0 22px;
      color: var(--pet-ink);
      font-size: clamp(34px, 4vw, 50px);
      font-weight: 400;
      letter-spacing: -.6px;
      line-height: 1.18;
    }

    .petloss-heading p,
    .petloss-split-copy p,
    .petloss-artisan-copy p,
    .petloss-resources p {
      margin: 0 0 18px;
      font-size: 18px;
      line-height: 1.85;
    }

    .petloss-split {
      display: grid;
      grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
      align-items: center;
      gap: 84px;
    }

    .petloss-quote-card {
      position: relative;
      padding: 56px 48px;
      border: 1px solid var(--pet-border);
      border-radius: 18px;
      color: var(--pet-ink);
      background: var(--pet-white);
      box-shadow: var(--pet-shadow);
      font-size: 25px;
      font-style: italic;
      line-height: 1.65;
    }

    .petloss-quote-card::before {
      position: absolute;
      top: 12px;
      left: 28px;
      color: var(--pet-warm);
      content: "“";
      font-size: 88px;
      font-style: normal;
      line-height: 1;
    }

    .petloss-cards {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 24px;
    }

    .petloss-card {
      padding: 38px 32px;
      border: 1px solid var(--pet-border);
      border-radius: 16px;
      background: var(--pet-white);
      box-shadow: 0 10px 26px rgba(39,51,47,.055);
    }

    .petloss-card-number {
      display: flex;
      width: 48px;
      height: 48px;
      align-items: center;
      justify-content: center;
      margin-bottom: 22px;
      border-radius: 50%;
      color: var(--pet-sage-deep);
      background: var(--pet-sage-pale);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14px;
      font-weight: 700;
    }

    .petloss-card h3 {
      margin: 0 0 14px;
      color: var(--pet-ink);
      font-size: 25px;
      font-weight: 400;
      line-height: 1.3;
    }

    .petloss-card p {
      margin: 0;
      font-size: 16px;
      line-height: 1.8;
    }

    .petloss-memorial-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 26px;
    }

    .petloss-memorial {
      position: relative;
      overflow: hidden;
      min-height: 520px;
      display: flex;
      align-items: flex-end;
      border-radius: 18px;
      color: var(--pet-white) !important;
      background: #32453e;
      box-shadow: var(--pet-shadow);
      text-decoration: none;
    }

    .petloss-memorial img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform .55s ease;
    }

    .petloss-memorial::after {
      position: absolute;
      inset: 0;
      content: "";
      background: linear-gradient(to top, rgba(28,40,35,.96) 0%, rgba(28,40,35,.68) 35%, rgba(28,40,35,.08) 75%);
    }

    .petloss-memorial-content {
      position: relative;
      z-index: 1;
      padding: 34px;
    }

    .petloss-memorial h3 {
      margin: 0 0 10px;
      color: #d9d9d9;
      font-size: 27px;
      font-weight: 400;
      line-height: 1.25;
    }

    .petloss-memorial p {
      margin: 0 0 18px;
      color: rgba(255,255,255,.84);
      font-size: 16px;
      line-height: 1.65;
    }

    .petloss-link-label {
      color: #8f8f8f;
	  font-family: Arial, Helvetica, sans-serif;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .5px;
    }

    .petloss-memorial:hover {
      transform: translateY(-4px);
    }

    .petloss-memorial:hover img {
      transform: scale(1.045);
    }

    .petloss-artisan {
      display: grid;
      grid-template-columns: minmax(340px, .92fr) minmax(0, 1.08fr);
      align-items: center;
      gap: 76px;
    }

    .petloss-artisan-image {
      position: relative;
      padding: 18px;
      border: 1px solid rgba(255,255,255,.22);
      border-radius: 18px;
      background: rgba(255,255,255,.07);
    }

    .petloss-artisan-image img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      border-radius: 10px;
    }

    .petloss-artisan-copy h2 {
      color: var(--pet-white);
    }

    .petloss-signature {
      margin-top: 30px !important;
      color: #f0e4d3;
      font-size: 21px !important;
      font-style: italic;
    }

    .petloss-values {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin-top: 34px;
    }

    .petloss-value {
      padding: 17px 14px;
      border: 1px solid rgba(255,255,255,.2);
      border-radius: 10px;
      color: var(--pet-white);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 13px;
      font-weight: 700;
      text-align: center;
    }

    .petloss-resources {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 48px;
      padding: 52px 58px;
      border: 1px solid var(--pet-border);
      border-radius: 20px;
      background: linear-gradient(120deg, #fff 0%, #f0f5f2 100%);
      box-shadow: var(--pet-shadow);
    }

    .petloss-resources h2 {
      margin-bottom: 12px;
      font-size: clamp(30px, 3.5vw, 43px);
    }

    .petloss-resources p {
      margin-bottom: 0;
      font-size: 17px;
    }

    .petloss-faq {
      max-width: 880px;
      margin: 0 auto;
    }

    .petloss-faq details {
      margin-bottom: 14px;
      border: 1px solid var(--pet-border);
      border-radius: 12px;
      background: var(--pet-white);
    }

    .petloss-faq summary {
      position: relative;
      padding: 23px 56px 23px 24px;
      color: var(--pet-ink);
      cursor: pointer;
      font-size: 19px;
      font-weight: 700;
      list-style: none;
    }

    .petloss-faq summary::-webkit-details-marker {
      display: none;
    }

    .petloss-faq summary::after {
      position: absolute;
      top: 50%;
      right: 24px;
      content: "+";
      color: var(--pet-sage-deep);
      font-family: Arial, Helvetica, sans-serif;
      font-size: 26px;
      font-weight: 400;
      transform: translateY(-50%);
    }

    .petloss-faq details[open] summary::after {
      content: "–";
    }

    .petloss-faq-answer {
      padding: 0 24px 24px;
      font-size: 16px;
      line-height: 1.8;
    }

    .petloss-faq-answer p {
      margin: 0;
    }

    .petloss-final {
      position: relative;
      padding: 105px 0;
      text-align: center;
      background:
        linear-gradient(rgba(246,242,234,.92), rgba(246,242,234,.92)),
        url("images/ash-rings.webp") center / cover no-repeat;
    }

    .petloss-final-inner {
      max-width: 820px;
      margin: 0 auto;
    }

    .petloss-final h2 {
      margin: 0 0 22px;
      color: var(--pet-ink);
      font-size: clamp(36px, 4.5vw, 55px);
      font-weight: 400;
      line-height: 1.2;
    }

    .petloss-final p {
      margin: 0 auto 32px;
      font-size: 19px;
      line-height: 1.8;
    }

    @media (max-width: 980px) {
      .petloss-hero-grid,
      .petloss-split,
      .petloss-artisan {
        grid-template-columns: 1fr;
        gap: 48px;
      }

      .petloss-hero-visual {
        width: min(500px, 86%);
        justify-self: center;
      }

      .petloss-cards,
      .petloss-memorial-grid {
        grid-template-columns: 1fr 1fr;
      }

      .petloss-memorial:last-child {
        grid-column: 1 / -1;
        min-height: 430px;
      }

      .petloss-resources {
        grid-template-columns: 1fr;
      }
    }

    @media (max-width: 680px) {
      .petloss-shell {
        width: min(100% - 26px, 1160px);
      }

      .petloss-hero {
        min-height: auto;
      }

      .petloss-hero-grid {
        padding: 64px 0 76px;
      }

      .petloss-hero h1 {
        font-size: 42px;
        letter-spacing: -.7px;
      }

      .petloss-actions {
        align-items: stretch;
        flex-direction: column;
      }

      .petloss-button {
        width: 100%;
      }

      .petloss-hero-visual {
        width: 92%;
      }

      .petloss-memory-note {
        right: -4%;
        bottom: 18px;
        max-width: 210px;
        padding: 16px 18px;
        font-size: 15px;
      }

      .petloss-section {
        padding: 74px 0;
      }

      .petloss-cards,
      .petloss-memorial-grid,
      .petloss-values {
        grid-template-columns: 1fr;
      }

      .petloss-memorial,
      .petloss-memorial:last-child {
        grid-column: auto;
        min-height: 450px;
      }

      .petloss-quote-card {
        padding: 50px 27px 32px;
        font-size: 21px;
      }

      .petloss-card {
        padding: 30px 25px;
      }

      .petloss-resources {
        padding: 36px 25px;
      }

      .petloss-artisan-image {
        padding: 10px;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .petloss-page *,
      .petloss-page *::before,
      .petloss-page *::after {
        scroll-behavior: auto !important;
        transition: none !important;
      }
    }