/* Identity based on the original logo supplied by the client. */
:root {
  --cream: #f8f7f1;
  --wine: #766134;
  --ink: #343a32;
  --muted: #64685f;
  --pink: #eeeadf;
  --line: #d9d3c2;
  --gold: #b5a275;
  --serif: 'Cormorant Garamond', Georgia, serif;
}
::selection { background: #ddd3b8; color: var(--ink); }
.topline { background: var(--ink); color: var(--cream); letter-spacing: 1px; }
.topline span { color: #d5c490; }
.header { height: 206px; gap: 32px; }
.wordmark .brand-logo { width: 184px; height: auto; mix-blend-mode: multiply; }
.header nav { gap: 34px; font-size: 12px; }
.header nav a:after { background: var(--gold); }
.nav-cta { background: transparent; border-color: var(--gold); color: var(--ink); }
.nav-cta:hover { background: var(--pink); }
.hero { padding-top: 55px; }
h1 { font-weight: 500; letter-spacing: -2.7px; font-size: clamp(64px, 6.5vw, 96px); }
h1 em { font-weight: 400; }
h2 { font-weight: 500; font-size: clamp(39px, 4.2vw, 60px); }
.hero-description { max-width: 385px; color: var(--muted); }
.hero-highlight { color: var(--ink); }
.eyebrow { color: var(--wine); }
.button { background: var(--ink); border-color: var(--ink); color: var(--cream); border-radius: 3px; }
.button:hover { background: #464d41; }
.little-line, .label-dot { background: var(--gold); }
.hero-note span { color: var(--wine); }
.handwritten { color: var(--wine); font-size: 22px; }
.idea-badge { border-color: var(--gold); background: var(--cream); color: var(--ink); box-shadow: 0 6px 22px #343a3212; }
.idea-badge svg { color: var(--wine); }
.idea-badge strong { font-size: 21px; }
.photo-label { color: var(--ink); border-color: var(--line); font-size: 27px; }
.photo-label small { color: var(--wine); }
.ribbon { background: #eeeadf; border-color: var(--line); }
.ribbon>.ribbon-inner { color: var(--wine); }
.filter.active { background: var(--ink); border-color: var(--ink); }
.image-tag { color: var(--ink); }
.zoom-icon { color: var(--wine); }
.choose-style:hover { background: var(--ink); }
.card-caption h3 { font-size: 29px; font-weight: 500; }
.offer { background: #eeeadf; }
.offer-list { border-color: #d3cbb5; }
.offer-list article { border-color: #d3cbb5; }
.offer-list h3 { color: var(--ink); font-weight: 500; font-size: 34px; }
.offer-symbol { color: var(--wine); }
.occasion-list li { border-color: #c5b88f; color: #67552c; }
.about-art { min-height: 0; background: transparent; border-radius: 0; border: 1px solid var(--line); padding: 24px; }
.brand-portrait { display: block; width: 100%; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.about-copy h2 { font-size: clamp(40px, 4.2vw, 59px); }
.signature i { color: var(--wine); font-size: 32px; }
.custom { background: var(--ink); color: var(--cream); }
.custom .eyebrow, .custom h2 em { color: #d5c490; }
.custom h2 { font-weight: 400; font-size: 62px; }
.custom-intro>p:not(.eyebrow), .steps p { color: #eeeadf; }
.custom-intro>p.custom-footnote { color: #d5d6ca; }
.steps b { border-color: #a9986e; color: #e1d4ad; }
.idea-form { box-shadow: 9px 9px 0 #c3b17e30; border: 1px solid #c5b88f; }
.form-heading { font-size: 28px; }
.choice-group input:checked+span { background: var(--ink); border-color: var(--ink); }
.contact h2 { font-size: 59px; }
.contact h2>span { color: var(--wine); }
.phone { color: var(--ink); border-color: var(--gold); }
.footer-logo .brand-logo { width: 135px; }
.footer { padding-block: 24px; }
.footer>p { color: var(--muted); }
dialog::backdrop { background: #20261fdb; }
@media(max-width:1150px) {
  .header { height: 184px; gap: 24px; }
  .header .brand-logo { width: 164px; }
  .header nav { gap: 24px; }
  h1 { font-size: 76px; }
  .custom h2 { font-size: 54px; }
}
@media(max-width:800px) {
  .header { height: 165px; gap: 18px; }
  .header .brand-logo { width: 143px; }
  .header nav { gap: 14px; font-size: 11px; }
  .header .nav-cta { padding: 9px 14px; gap: 16px; }
  h1 { font-size: 60px; letter-spacing: -1.9px; }
  h2 { font-size: 42px; }
  .about { gap: 40px; }
  .about-art { padding: 12px; }
  .about-copy h2 { font-size: 41px; }
  .offer-list h3 { font-size: 30px; }
  .custom h2 { font-size: 43px; }
  .form-heading { font-size: 25px; }
  .contact h2 { font-size: 48px; }
}
@media(max-width:600px) {
  .header { height: auto; min-height: 185px; padding-block: 8px 14px; gap: 5px 16px; }
  .header .brand-logo { width: 137px; }
  .header nav { padding-top: 3px; }
  .header .nav-cta { font-size: 11px; }
  .hero { padding-top: 36px; }
  h1 { font-size: clamp(59px, 13.8vw, 80px); letter-spacing: -1.9px; }
  .hero-description { max-width: 100%; }
  .handwritten { font-size: 19px; }
  .idea-badge strong { font-size: 20px; }
  .photo-label { font-size: 26px; }
  h2 { font-size: 41px; }
  .card-caption h3 { font-size: 30px; }
  .offer-list h3 { font-size: 29px; }
  .about-art { width: min(100%, 380px); padding: 14px; }
  .about-copy h2 { font-size: 43px; }
  .custom h2 { font-size: 46px; }
  .form-heading { font-size: 26px; }
  .contact h2 { font-size: 39px; }
  .footer-logo .brand-logo { width: 110px; }
}
@media(max-width:380px) {
  .header .brand-logo { width: 125px; }
  .header .nav-cta { padding: 9px 12px; gap: 12px; }
  .hero-actions { gap: 16px; }
  .contact h2 { font-size: 35px; }
}