/* 3→8 Portrait Lab — contemporary pet portrait atelier.
   Warm and personal without novelty-store or generic SaaS styling. */
:root {
  --portrait-paper: #f6f2eb;
  --portrait-panel: #fffdf9;
  --portrait-ink: #302a27;
  --portrait-muted: #746c67;
  --portrait-line: #d5cbc1;
  --portrait-coral: #b95745;
  --portrait-blue: #466875;
  --portrait-gold: #cfaa68;
}

html { background: var(--portrait-paper); }
body {
  background: var(--portrait-paper) !important;
  color: var(--portrait-ink) !important;
  font-family: "Avenir Next", Avenir, "Segoe UI", ui-sans-serif, -apple-system, BlinkMacSystemFont, sans-serif !important;
}
header {
  border-color: rgba(48,42,39,.14) !important;
  background: rgba(255,253,249,.94) !important;
  box-shadow: 0 1px 0 rgba(48,42,39,.03);
}
header nav { min-height: 72px; }
header nav > a:first-child { gap: 11px !important; letter-spacing: -.015em; }
header nav > a:first-child > span:first-child {
  min-width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: var(--portrait-coral) !important;
  color: #fff !important;
  font-size: 11px !important;
}
header nav a { color: #625a55 !important; }
header nav a:hover { color: var(--portrait-ink) !important; }
header nav > div:last-child > a {
  border-radius: 3px !important;
  background: var(--portrait-ink) !important;
  color: #fff !important;
}
[data-i18n-aria="languageLabel"] {
  border-color: #cfc4ba !important;
  border-radius: 4px !important;
  background: transparent !important;
}
[data-locale-button] { border-radius: 2px !important; }
[data-locale-button].bg-white { background: #ebe2d8 !important; box-shadow: none !important; }

main > section:first-child {
  border-color: var(--portrait-line) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.4) 1px, transparent 1px) 0 0 / 86px 86px,
    linear-gradient(rgba(255,255,255,.35) 1px, transparent 1px) 0 0 / 86px 86px,
    var(--portrait-paper) !important;
}
main > section:first-child > div { gap: 72px !important; padding-top: 76px !important; padding-bottom: 82px !important; }
main > section:first-child h1 {
  max-width: 690px !important;
  color: var(--portrait-ink) !important;
  font-size: clamp(48px, 5.35vw, 74px) !important;
  font-weight: 620 !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
}
main > section:first-child p { color: #6b625d !important; }
main > section:first-child [data-i18n="serviceType"],
main > section:first-child [data-i18n="sandboxBadge"] {
  border: 1px solid #cfc3b8;
  border-radius: 3px !important;
  background: rgba(255,253,249,.75) !important;
  color: #6a5b53 !important;
  letter-spacing: .04em;
}
main > section:first-child [data-i18n="sandboxBadge"] {
  border-color: #d7c69f;
  background: #eee4cf !important;
  color: #725f36 !important;
}
main > section:first-child [data-i18n="heroCta"] {
  border-radius: 3px !important;
  background: var(--portrait-coral) !important;
  color: #fff !important;
}
main > section:first-child [data-i18n="heroCta"]:hover { background: #984736 !important; }
main > section:first-child [data-i18n="heroSecondary"] {
  border-color: #a99e95 !important;
  border-radius: 3px !important;
  background: transparent !important;
}
main > section:first-child dl {
  border-color: #c8bdb3 !important;
  border-radius: 3px !important;
  background: #c8bdb3 !important;
}
main > section:first-child dl > div { background: rgba(255,253,249,.9) !important; }
main > section:first-child dl dt { color: #7c746e !important; }
main > section:first-child figure {
  position: relative;
  border: 0 !important;
  border-radius: 4px !important;
  background: #e5ddd4 !important;
  box-shadow: 0 22px 48px rgba(64,48,40,.14) !important;
  transform: rotate(.6deg);
}
main > section:first-child figure:before {
  content: "PORTRAIT STUDY  /  01";
  position: absolute;
  z-index: 2;
  left: 14px;
  top: 14px;
  padding: 7px 9px;
  background: rgba(48,42,39,.86);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .09em;
}
main > section:first-child figure img { background: #ddd2c7; }
main > section:first-child figcaption {
  border-color: var(--portrait-line) !important;
  background: var(--portrait-panel) !important;
}
main > section:first-child figcaption span {
  border-radius: 2px !important;
  background: #e8ded4 !important;
  color: #665b54 !important;
}

#included { padding-top: 88px !important; padding-bottom: 88px !important; }
#included > div:first-child { max-width: 760px !important; }
#included [data-i18n="includedEyebrow"],
#process [data-i18n="processEyebrow"] { color: var(--portrait-coral) !important; letter-spacing: .06em; }
#included h2,
#process h2,
#order h2,
#terms h2 {
  color: var(--portrait-ink) !important;
  font-weight: 620 !important;
  letter-spacing: -.04em !important;
}
#included > div:last-child { gap: 0 !important; border-top: 1px solid var(--portrait-line); }
#included article {
  min-height: 205px;
  border-width: 0 0 1px 0 !important;
  border-color: var(--portrait-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
#included article:nth-child(odd) { border-right-width: 1px !important; }
#included article > span { color: var(--portrait-coral) !important; }
#included article h3 { margin-top: 36px !important; font-size: 21px; }
#included article p { color: var(--portrait-muted) !important; line-height: 1.65; }

#process {
  border-color: var(--portrait-line) !important;
  background: #ebe4dc !important;
}
#process ol { gap: 0 !important; border-top: 1px solid #c8bdb3; }
#process li {
  min-height: 190px;
  border-width: 0 0 1px 0 !important;
  border-color: #c8bdb3 !important;
  border-radius: 0 !important;
  background: transparent;
}
#process li:nth-child(odd) { border-right-width: 1px !important; }
#process li > span { color: var(--portrait-coral) !important; }
#process li p { color: #6e655f !important; line-height: 1.65; }

#order { padding-top: 88px !important; padding-bottom: 92px !important; }
#order aside {
  border-radius: 4px !important;
  background: var(--portrait-ink) !important;
  box-shadow: 8px 8px 0 #d4a85f;
}
#order aside [data-i18n="summaryEyebrow"] { color: #e5bd78 !important; }
#order aside h2 { color: #fff !important; }
#order aside > div { border-color: #615852 !important; }
#order aside li span:first-child { color: #e5bd78 !important; }
#order aside > div:last-child {
  border-color: #80574d !important;
  border-radius: 3px !important;
  background: #4a312c !important;
}
#order > div > div:last-child {
  border-color: #cfc4ba !important;
  border-radius: 4px !important;
  background: var(--portrait-panel) !important;
  box-shadow: 0 14px 34px rgba(64,48,40,.09) !important;
}
#order > div > div:last-child > div:first-child { border-color: var(--portrait-line) !important; background: #fbf8f3; }
#payment-state { border-radius: 3px !important; }
#order fieldset > legend > span:first-child {
  border-radius: 50% !important;
  background: #ead8cf !important;
  color: #8b4638 !important;
}
#order label[for="photos"] {
  border-color: #c6b7ab !important;
  border-radius: 4px !important;
  background: #faf6f0 !important;
}
#order label[for="photos"]:hover { border-color: var(--portrait-coral) !important; background: #f7ebe5 !important; }
#file-slots li,
#order label:has(input[type="radio"]) {
  border-color: #cfc4ba !important;
  border-radius: 3px !important;
}
#order input[type="text"],
#order input[type="email"] { border-color: #bdb1a7 !important; border-radius: 3px !important; background: #fffdf9 !important; }
#order input:focus { border-color: var(--portrait-blue) !important; box-shadow: 0 0 0 3px rgba(70,104,117,.14) !important; }
#pay-button,
#check-status {
  border-radius: 3px !important;
  background: var(--portrait-coral) !important;
}
#pay-button:hover,
#check-status:hover { background: #984736 !important; }
#pay-button:disabled { background: #c9c0b9 !important; }

#terms { border-color: var(--portrait-line) !important; background: #fffdf9 !important; }
#terms article { border-radius: 3px !important; background: transparent !important; box-shadow: none !important; }
footer { border-color: #403835 !important; background: var(--portrait-ink) !important; color: #e9e2db !important; }
footer a { color: #fff !important; }

@media (max-width: 1023px) {
  main > section:first-child > div { gap: 42px !important; }
  main > section:first-child figure { transform: none; }
  #order aside { box-shadow: none; }
}
@media (max-width: 639px) {
  main > section:first-child > div { padding-top: 48px !important; padding-bottom: 58px !important; }
  main > section:first-child h1 { font-size: 43px !important; }
  #included article:nth-child(odd),
  #process li:nth-child(odd) { border-right-width: 0 !important; }
}