/* Cakes: a local preference builder, with the same spacing and palette as the site. */
.cake-hero,
.cake-workshop,
.cake-conversation { padding-inline:var(--page-inset); }
.cake-hero { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:var(--section-gap);padding-block:24px var(--section-space); }
.cake-hero-copy { max-width:580px;min-width:0; }
.cake-hero h1 { margin:0 0 28px;font-family:var(--sans);font-size:var(--type-page-title);font-weight:650;line-height:1.04;letter-spacing:-.045em;text-transform:uppercase; }
.cake-hero-copy>p:not(.eyebrow) { max-width:45ch;color:var(--muted);font-size:16px;line-height:1.7; }
.cake-hero-copy .cake-hero-note { margin:24px 0 0;padding-left:16px;border-left:1px solid var(--clay);font-size:13px; }
.cake-start { margin-top:22px; }
.cake-hero-photo { position:relative;margin:0;aspect-ratio:1.2;overflow:hidden;background:var(--sand); }
.cake-hero-photo img { display:block;width:100%;height:100%;object-fit:cover;object-position:center 53%;filter:var(--photo-grade); }
.cake-hero-photo figcaption { position:absolute;bottom:16px;left:16px;padding:8px 11px;background:var(--paper);color:var(--muted);font-size:11px;letter-spacing:.08em;line-height:1.4; }
.cake-workshop { display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);align-items:start;gap:var(--section-gap);padding-block:var(--section-space);background:var(--cream); }
.cake-workshop { scroll-margin-top:24px; }
.cake-workshop-intro { max-width:360px; }
.cake-workshop h2,.cake-conversation h2 { margin:0 0 24px;font-size:var(--type-section);line-height:1.12;letter-spacing:-.035em; }
.cake-workshop-intro>p:not(.eyebrow),.cake-conversation>p:not(.eyebrow),.cake-noscript p { color:var(--muted);font-size:16px;line-height:1.7; }
.cake-workshop-intro .cake-local-note { margin-top:24px;font-size:13px; }
.cake-workshop-intro .text-link { margin-top:8px; }
.cake-configurator { min-width:0;padding:clamp(22px,3vw,40px);background:var(--paper);border:1px solid var(--line); }
.cake-progress { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 36px;padding:0;list-style:none; }
.cake-progress li { min-width:0;padding-top:12px;border-top:2px solid var(--line);color:var(--muted);font-size:12px;line-height:1.5; }
.cake-progress li[aria-current="step"] { border-color:var(--clay);color:var(--ink);font-weight:650; }
.cake-progress li.is-complete { border-color:var(--sage-text); }
.cake-step-number { display:block;margin-bottom:6px;color:var(--clay);font-size:11px;letter-spacing:.1em; }
.cake-step-label { margin-bottom:10px;color:var(--muted);font-size:11px;font-weight:600;letter-spacing:.1em; }
.cake-step h3,.cake-noscript h3 { margin:0 0 14px;font:500 clamp(27px,3vw,35px)/1.16 var(--serif);letter-spacing:-.025em;scroll-margin-top:24px; }
.cake-step-help { margin:0 0 28px;color:var(--muted);font-size:13px;line-height:1.65; }
.cake-field { min-width:0;margin:24px 0; }
.cake-field label,.cake-copy-fallback label { display:block;margin-bottom:9px;color:var(--ink);font-size:14px;font-weight:600;line-height:1.5; }
.cake-field label>span:not([aria-hidden]) { font-size:12px;font-weight:400;color:var(--muted); }
.cake-field input,.cake-field textarea,.cake-field select,.cake-copy-fallback textarea { display:block;min-width:0;width:100%;max-width:100%;min-height:50px;padding:12px;border:1px solid var(--line);border-radius:2px;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--sans); }
.cake-field select { appearance:auto; }
/* Keep the border and horizontal padding outside Safari's native date input.
   Its intrinsic size must not widen the grid track or the form on iPhone. */
.cake-date-control { display:grid;grid-template-columns:minmax(0,1fr);width:100%;min-width:0;max-width:100%;padding:0 12px;border:1px solid var(--line);border-radius:2px;background:var(--paper); }
.cake-field .cake-date-control input[type="date"] { -webkit-appearance:none;appearance:none;box-sizing:border-box;display:block;inline-size:100%;min-inline-size:0;max-inline-size:100%;width:100%;min-width:0;max-width:100%;min-height:50px;margin:0;padding:0;border:0;border-radius:0;background:transparent;text-align:left; }
.cake-date-control:focus-within { border-color:var(--clay);outline:2px solid var(--clay);outline-offset:3px; }
.cake-date-control input[type="date"]:focus { outline:0; }
.cake-field input[type="date"]::-webkit-date-and-time-value { min-height:1.5em;text-align:left; }
.cake-field input[type="date"]::-webkit-datetime-edit { padding:0; }
.cake-field input[type="date"]::-webkit-calendar-picker-indicator { margin:0;padding:8px 0 8px 8px;cursor:pointer; }
.cake-date-availability { display:block;margin-block:8px 4px;color:var(--ink); }
.cake-field-date .cake-field-help { max-width:48ch; }
.cake-field textarea,.cake-copy-fallback textarea { resize:vertical; }
.cake-field input::placeholder,.cake-field textarea::placeholder { color:var(--muted);opacity:.85; }
.cake-field input:focus,.cake-field textarea:focus,.cake-field select:focus,.cake-copy-fallback textarea:focus { border-color:var(--clay); }
.cake-field-help { margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.6; }
.cake-field-help strong { color:var(--ink);font-weight:600; }
.cake-field-error { margin:10px 0 0;padding-left:12px;border-left:2px solid var(--clay);color:var(--ink);font-size:13px;line-height:1.6; }
.cake-field input[aria-invalid="true"],.cake-field select[aria-invalid="true"] { border-color:var(--clay); }
.cake-date-control:has(input[aria-invalid="true"]) { border-color:var(--clay); }
.cake-field-pair { display:grid;grid-template-columns:minmax(0,1fr);gap:0; }
.cake-field-pair .cake-field { margin-top:0; }
.cake-field-pair .cake-field:last-child { margin-bottom:0; }
.cake-character-count { margin:6px 0 0;color:var(--muted);font:400 12px/1.6 var(--sans);text-align:right;font-variant-numeric:tabular-nums; }
.cake-step-actions { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px 18px;margin-top:28px;padding-top:24px;border-top:1px solid var(--line); }
.cake-step-actions-first { justify-content:flex-end; }
.cake-step button { cursor:pointer; }
.cake-back,.cake-edit-occasion { display:inline-flex;align-items:center;justify-content:flex-start;gap:10px;min-height:44px;padding:8px 0;border:0;background:transparent;color:var(--ink);font-size:13px;line-height:1.5;text-align:left; }
.cake-back:hover,.cake-edit-occasion:hover { color:var(--clay);text-decoration:underline;text-underline-offset:4px; }
.cake-edit-occasion { color:var(--muted); }
.cake-summary { margin:0 0 24px; }
.cake-summary>div { display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:14px 0 18px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.6; }
.cake-summary dt { display:flex;align-items:center;justify-content:space-between;gap:8px 16px;min-width:0;color:var(--muted); }
.cake-summary-label { min-width:0; }
.cake-summary-edit { flex:none;display:inline-flex;align-items:center;min-height:44px;margin:-4px 0;padding:8px 0;border:0;border-radius:0;background:transparent;color:var(--clay);font:600 13px/1.5 var(--sans);text-decoration:underline;text-underline-offset:4px; }
.cake-summary-edit:hover { color:var(--ink); }
.cake-summary dd { margin:0;white-space:pre-wrap;overflow-wrap:anywhere; }
.cake-summary-note { padding:18px;border-left:2px solid var(--sage);background:var(--cream);color:var(--muted);font-size:13px;line-height:1.65; }
.cake-summary-note p { margin:0 0 8px; }
.cake-summary-note p:last-child { margin:0; }
.cake-final-actions { display:flex;flex-wrap:wrap;gap:12px;margin-top:24px; }
.cake-final-actions .cake-whatsapp { flex-basis:100%; }
.cake-secondary { border-color:var(--ink);background:transparent;color:var(--ink); }
.cake-secondary:hover { background:var(--cream); }
.cake-whatsapp-help { margin:16px 0 0;color:var(--muted);font-size:13px;line-height:1.65; }
.cake-whatsapp-help a { color:var(--ink);text-decoration:underline;text-underline-offset:3px; }
.cake-copy { border-color:var(--ink);background:transparent;color:var(--ink); }
.cake-copy:hover { background:var(--cream); }
.cake-copy:disabled { opacity:.65;cursor:wait; }
.cake-copy-status { margin:14px 0 0;color:var(--muted);font-size:13px;line-height:1.6; }
.cake-copy-status:empty { display:none; }
.cake-copy-fallback { margin-top:16px; }
.cake-copy-fallback textarea { background:var(--cream); }
.cake-draft { margin-top:32px;padding-top:24px;border-top:1px solid var(--line); }
.cake-draft h3 { margin:0 0 10px;font:500 24px/1.2 var(--serif);letter-spacing:-.02em; }
.cake-draft>p,.cake-draft-confirm>p { margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.65; }
.cake-draft>p a { color:var(--ink);text-decoration:underline;text-underline-offset:3px; }
.cake-draft-actions { display:flex;flex-wrap:wrap;gap:8px 12px; }
.cake-draft-actions button { display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:10px 14px;border:1px solid var(--line);border-radius:2px;background:transparent;color:var(--ink);font:500 13px/1.5 var(--sans);cursor:pointer; }
.cake-draft-actions button:hover { border-color:var(--clay);background:var(--cream); }
.cake-draft-actions #cake-draft-save { border-color:var(--ink); }
.cake-draft>.cake-draft-saved { margin:12px 0 0; }
.cake-draft-confirm { margin-top:16px;padding:16px;border-left:2px solid var(--clay);background:var(--cream); }
.cake-draft>.cake-draft-status { margin:12px 0 0;color:var(--ink); }
.cake-draft-status:empty { display:none; }
.cake-noscript { padding:24px;border:1px solid var(--line); }
.cake-noscript .text-link { display:flex;margin-top:14px; }
.cake-conversation { padding-block:var(--section-space);text-align:center; }
.cake-conversation>p:not(.eyebrow) { max-width:53ch;margin:0 auto 24px; }
@media (max-width:900px) {
  .cake-workshop { grid-template-columns:1fr; }
  .cake-workshop-intro { max-width:600px; }
  .cake-workshop-intro h2 br { display:none; }
  .cake-configurator { width:100%; }
}
@media (max-width:620px) {
  .cake-hero { grid-template-columns:1fr;gap:28px;padding-top:12px; }
  .cake-hero h1 { margin-bottom:22px;letter-spacing:-.04em; }
  .cake-hero-photo { aspect-ratio:1.45; }
  .cake-workshop { padding-top:44px; }
  .cake-configurator { padding:22px 18px; }
  .cake-progress { margin-bottom:28px;gap:10px; }
  .cake-field-pair { grid-template-columns:1fr;gap:0; }
  .cake-step-actions>.button { width:100%;order:-1; }
  .cake-final-actions { flex-direction:column; }
  .cake-final-actions>.button { width:100%; }
  .cake-summary>div { grid-template-columns:1fr;gap:3px; }
  .cake-summary dt { font-size:12px; }
  .cake-conversation { text-align:left; }
  .cake-conversation>p:not(.eyebrow) { margin-left:0; }
}