/* Page-specific additions; the site header, footer, palette and typography
   come from the unchanged shared Iro Tea stylesheet. */
.catering-hero .hero-title { font-size: clamp(44px, 5.8vw, 76px); }
.catering-hero .hero-photo-frame { aspect-ratio: 4 / 3; }
.catering-start { margin-top: 28px; }
section.catering-planner { border-bottom: 0; padding-top: 72px; scroll-margin-top: 72px; }
.catering-planner .section-sub { margin-bottom: 32px; }
.service-formats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--rule); border: 1px solid var(--rule); margin-bottom: 56px; }
.service-formats article { display: flex; flex-direction: column; background: var(--bg-warm); padding: 26px; min-width: 0; }
.service-formats h3, .planner-subtitle { font-family: 'Fraunces', serif; font-size: 26px; font-weight: 300; line-height: 1.2; margin-bottom: 16px; }
.service-formats article > p:not(.section-eyebrow) { font-size: 14px; color: var(--ink-soft); margin-bottom: 24px; }
.service-formats a { font-size: 13px; margin-top: auto; color: var(--matcha-deep); text-underline-offset: 4px; }
.planner-subtitle { font-size: 30px; scroll-margin-top: 96px; }
@media (max-width: 880px) { .service-formats { grid-template-columns: 1fr; } }
#catering-app { max-width: 960px; overflow-wrap: anywhere; }
#catering-app [role="status"] { color: var(--ink-soft); font-size: 14px; }
#catering-app .eyebrow { font-size: 11px; letter-spacing: 0.24em; font-weight: 500; color: var(--matcha); }
#catering-app h2,
#catering-app legend {
  font-family: 'Fraunces', serif;
  font-weight: 300;
  line-height: 1.2;
  font-variation-settings: "opsz" 36, "SOFT" 80;
}
#catering-app h2 { font-size: 30px; margin-bottom: 16px; }
#catering-app legend { font-size: 25px; padding-right: 20px; }
#catering-app .subtle,
#catering-app .hint { color: var(--ink-faint); font-size: 13px; }
#catering-app .fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
#catering-app fieldset { border: 0; border-top: 1px solid var(--rule); padding: 28px 0 16px; margin: 36px 0 0; min-width: 0; }
#catering-app fieldset > .subtle { margin-bottom: 24px; }
#catering-app label { display: block; font-size: 13px; color: var(--ink-soft); }
#catering-app input,
#catering-app select,
#catering-app textarea {
  font: inherit;
  display: block;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid var(--rule);
  background: rgba(255, 255, 255, 0.4);
  border-radius: 2px;
  color: var(--ink);
  margin-top: 8px;
  min-height: 48px;
}
#catering-app textarea { resize: vertical; }
#catering-app fieldset > label { margin-top: 24px; }
#catering-app .hint { display: block; font-size: 12px; margin: 4px 0; }
#catering-app button {
  font: inherit;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  background: var(--matcha);
  color: var(--bg);
  padding: 14px 26px;
  min-height: 48px;
  border: 1px solid var(--matcha);
  border-radius: 2px;
  cursor: pointer;
}
#catering-app form > button { margin-top: 24px; }
#catering-app .secondary { background: transparent; color: var(--matcha); }
#catering-app button:disabled { opacity: 0.6; cursor: default; }
#catering-app .buttons { display: flex; gap: 12px; flex-wrap: wrap; margin: 24px 0; }
#catering-app .error { color: var(--rust); margin: 16px 0; }
#catering-app .error:empty { display: none; }
#catering-app .review { border-top: 1px solid var(--rule); padding-top: 28px; margin-top: 28px; scroll-margin-top: 96px; }
#catering-app .estimate-summary { border: 1px solid var(--rule); background: var(--bg-warm); padding: 32px; margin: 28px 0; }
#catering-app .estimate-summary h2 { font-size: clamp(48px, 6vw, 64px); color: var(--matcha); margin: 12px 0; }
#catering-app .estimate-summary dl { margin: 24px 0; }
#catering-app .estimate-summary dl > div { display: flex; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--rule); padding: 14px 0; }
#catering-app .estimate-summary small { display: block; color: var(--ink-faint); font-size: 12px; }
#catering-app .estimate-summary dd { margin: 0; white-space: nowrap; }
#catering-app .estimate-summary ul { font-size: 13px; padding-left: 18px; }
#catering-app .estimate-summary li { margin: 10px 0; }
#catering-app .version { font-size: 12px; color: var(--ink-faint); margin-top: 20px; }
#catering-app .confirmation { padding: 24px; border-left: 3px solid var(--matcha); background: var(--bg-warm); }
#catering-app .contact-fallback { margin-top: 36px; font-size: 14px; color: var(--ink-soft); }
#catering-app a { text-underline-offset: 0.2em; }
#catering-app [hidden] { display: none !important; }
@media (max-width: 600px) {
  .catering-hero { padding-top: 48px; padding-bottom: 48px; }
  .catering-hero .hero-grid { gap: 36px; }
  section.catering-planner { padding-top: 48px; padding-bottom: 64px; }
  #catering-app .fields { grid-template-columns: 1fr; }
  #catering-app .estimate-summary { padding: 22px; }
  #catering-app .buttons button { width: 100%; }
  #catering-app .estimate-summary dl > div { font-size: 14px; }
}

#catering-app .small-order { border-left: 3px solid var(--matcha); padding: 18px 22px; background: var(--bg-warm); font-size: 14px; }
#catering-app select:focus-visible, #catering-app input:focus-visible, #catering-app textarea:focus-visible, #catering-app button:focus-visible { outline: 2px solid var(--matcha-deep); outline-offset: 3px; }