/* Prime Toy Poodle Puppies · soft twilight sunset */
:root {
  --ink: #fff4eb;
  --ink-deep: #271b2b;
  --cream: #544058;
  --paper: #523b52;
  --sage: #694d63;
  --sage-deep: #a67b91;
  --apricot: #f1b18f;
  --apricot-light: #ffdbc4;
  --text: #f7e7e1;
  --muted: #e7cfd1;
  --line: rgba(255, 228, 216, .32);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Jost', Arial, sans-serif;
}

body {
  color: var(--ink);
  background-color: #544058;
  background-image:
    linear-gradient(180deg, rgba(42, 27, 55, .38) 0%, rgba(51, 30, 54, .24) 48%, rgba(38, 25, 53, .45) 100%),
    radial-gradient(ellipse 85% 29% at 67% 78%, rgba(247, 172, 125, .64) 0%, rgba(178, 100, 117, .35) 48%, transparent 80%),
    linear-gradient(180deg, rgba(92, 63, 105, .42) 0%, rgba(154, 94, 119, .26) 69%, rgba(83, 49, 84, .43) 100%),
    url('/manus-storage/async-images/EeLJLB0zCD6owKQCGzYwYq/image-1.webp');
  background-position: center center;
  background-size: cover;
  background-attachment: fixed;
  font-family: var(--sans);
  font-weight: 400;
  line-height: 1.68;
  letter-spacing: .005em;
}
::selection { background: #f1b18f; color: #271b2b; }
:focus-visible { outline-color: #ffdbc4; }
h1, h2 { font-weight: 600; letter-spacing: -.025em; }
h1 em, h2 em { color: #ffcfb0; font-weight: 500; }
h2 { font-size: clamp(52px, 5.2vw, 78px); line-height: 1.02; }
.eyebrow, .section-kicker { color: #ffdbc4; letter-spacing: .19em; }
.eyebrow-line { background: var(--apricot); }

/* The lighter sunset remains visible behind translucent panels across the whole page. */
.topline { background: rgba(65, 43, 67, .90); color: #fff0e4; }
.site-header { background: rgba(62, 41, 65, .82); border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); }
.brand-text strong { font-size: clamp(25px, 2.5vw, 31px); font-weight: 700; letter-spacing: .02em; }
.brand-text small { color: var(--muted); }
.primary-nav a, .header-cta { color: var(--ink); }
.primary-nav a { letter-spacing: .018em; }
.primary-nav a::after { background: var(--apricot); }
.header-cta { border-color: var(--apricot); }
.header-cta:hover { background: var(--apricot); color: #271b2b; }
.menu-toggle { border-color: var(--apricot); }
.menu-toggle span { background: var(--ink); }
.hero { background: linear-gradient(90deg, rgba(48, 31, 59, .50), rgba(48, 31, 59, .07) 78%, transparent); }
.hero h1 { font-size: clamp(64px, 6.1vw, 96px); line-height: .98; text-shadow: 0 3px 22px rgba(45, 24, 49, .38); }
.hero-lede, .hero-footnote { color: var(--text); }
.footnote-icon { border-color: var(--apricot); color: var(--apricot-light); }
.hero-halo { background: radial-gradient(circle, rgba(249, 180, 143, .39), rgba(191, 106, 139, .16) 70%, transparent); }
.hero-frame { border: 1px solid rgba(255, 222, 197, .61); box-shadow: 0 24px 55px rgba(53, 29, 52, .19); }
.hero-seal { background: #f1b18f; color: #271b2b; }
.hero-image-note { background: rgba(77, 53, 72, .90); color: var(--ink); }
.glance { background: rgba(92, 60, 89, .70); border-color: var(--line); }
.glance-item, .glance-item:first-of-type { border-color: var(--line); }
.glance-icon { border-color: rgba(255, 221, 189, .7); color: var(--apricot-light); }
.about-prime { background: rgba(73, 49, 79, .68); border-color: var(--line); }
.about-prime-values span, .feature-number { color: var(--apricot-light); }
.reviews { background: rgba(92, 54, 79, .68); border-color: var(--line); }
.puppies { background: rgba(72, 47, 74, .68); border-color: var(--line); }
.faq { background: rgba(86, 54, 76, .68); border-color: var(--line); }
.about { background: rgba(74, 48, 75, .68); }
.consider { background: rgba(74, 43, 69, .68); color: var(--ink); }
.contact { background: rgba(96, 57, 76, .68); }
.site-footer { background: rgba(53, 35, 58, .87); color: var(--ink); }

/* A more expressive serif hierarchy with modern, airy Jost for UI copy. */
.button { font-weight: 600; letter-spacing: .06em; }
.button-dark { background: #f1b18f; border-color: #f1b18f; color: #271b2b; }
.button-dark:hover { background: #ffdbc4; border-color: #ffdbc4; color: #271b2b; }
.text-link, .source-link, .email-block a, .footer-email { border-color: var(--apricot); }
.text-link:hover, .source-link:hover, .email-block a:hover, .footer-email:hover { color: var(--apricot-light); border-color: var(--apricot-light); }
.about-caption { background: rgba(82, 57, 80, .94); border-color: var(--line); color: var(--ink); }
.image-disclosure { color: var(--muted); }
.question-card { background: rgba(109, 68, 89, .76); border-color: var(--line); }
.question-card:hover { background: rgba(126, 75, 93, .87); }
.question-card p, .consider-heading > p { color: var(--text); }
.question-num, .consider-note, .eyebrow-light { color: var(--muted); }
.question-num span { color: var(--apricot); }
.review-card, .puppy-listing, .sold-puppy, .form-wrap {
  background: rgba(78, 51, 72, .88);
  border-color: rgba(255, 224, 211, .37);
  box-shadow: 0 18px 42px rgba(63, 30, 56, .14);
}
.review-photo { background: #5b4459; }
.review-card blockquote { color: var(--text); font-size: 23px; line-height: 1.44; font-weight: 500; }
.review-attribution::before { color: var(--apricot); }
.puppy-photo-frame { background: #5b4258; }
.puppy-details h3 { font-size: clamp(58px, 5.3vw, 78px); line-height: .98; }
.puppy-slide figcaption span { color: var(--apricot-light); }
.puppy-gallery-arrow { background: #60465e; border-color: var(--line); color: var(--ink); }
.puppy-gallery-arrow:hover:not(:disabled) { background: var(--apricot); color: #271b2b; }
.puppy-included li::before { color: var(--apricot-light); }
.puppy-pricing { background: rgba(154, 94, 112, .32); border-color: var(--line); }
.puppy-pricing > div + div { border-color: var(--line); }
.sold-visual { background: #604860; }
.sold-visual::after { background: rgba(72, 37, 66, .13); }
.sold-stamp { background: rgba(255, 239, 224, .96); border-color: var(--apricot); color: #271b2b; }
.faq-item summary { font-size: clamp(25px, 2.6vw, 32px); font-weight: 600; line-height: 1.15; }
.faq-item[open] .faq-toggle { background: rgba(241, 177, 143, .23); }
.faq-answer p { font-size: 15px; }
.faq-answer a { border-color: var(--apricot); }
.reservation-heading h4 { font-weight: 600; }
.form-heading h3 { font-size: 33px; font-weight: 600; }

/* Light-dark form fields stay legible and never resemble checkout fields. */
.field label { color: var(--ink); font-size: 12px; }
.field label span { color: var(--apricot-light); }
.field input, .field textarea, .reservation-fields .field select {
  border-color: rgba(255, 228, 216, .46);
  background: #593f5b;
  color: var(--ink);
  font-size: 14px;
}
.field input::placeholder, .field textarea::placeholder { color: #e7cfd1; opacity: 1; }
.field input:hover, .field textarea:hover, .reservation-fields .field select:hover { border-color: #ffcfb0; }
.field input:focus, .field textarea:focus, .reservation-fields .field select:focus {
  border-color: var(--apricot);
  box-shadow: 0 0 0 3px rgba(241, 177, 143, .28);
}
.reservation-fields .field select option { background: #593f5b; color: var(--ink); }
.reservation-fields .field input[readonly] { background: #694d65; border-color: var(--line); color: var(--ink); }
.reservation-status, .form-status { color: var(--apricot-light); }
.form-icon { background: rgba(241, 177, 143, .25); color: var(--apricot-light); }
.footer-main { border-color: var(--line); }
.footer-main p, .footer-bottom { color: var(--muted); }

@media (max-width: 720px) {
  .primary-nav { background: rgba(77, 52, 77, .96); border-color: var(--line); box-shadow: 0 18px 30px rgba(59, 30, 57, .27); }
  .primary-nav a { border-color: var(--line); }
  .hero { background: linear-gradient(180deg, rgba(50, 32, 61, .45), rgba(50, 32, 61, .05)); }
  .hero h1 { font-size: clamp(54px, 11vw, 75px); }
  h2 { font-size: clamp(49px, 9vw, 67px); }
  .puppy-details h3 { font-size: clamp(52px, 12vw, 65px); }
  .review-card blockquote { font-size: 21px; }
  .faq-item summary { font-size: clamp(23px, 6.4vw, 28px); }
}