/* Page layout only. Shared Slidy CSS owns typography, colors, buttons and shell. */
.greetings-main { color: var(--text-color); }
.greetings-main [hidden] { display: none !important; }
.greetings-main [id] { scroll-margin-top: 100px; }
.greetings-main .greetings-hero { min-height: 0; padding-bottom: 80px; }
.greetings-main .documents-hero__heading { max-width: 750px; }
.greetings-main .documents-hero__heading .section-sub-title { margin-inline: auto; }
.greetings-main .documents-toggle { border: 0; padding: 0; cursor: pointer; }
.greetings-main .greetings-section { padding-block: 64px; }
.greetings-main .section-sub-title { max-width: 650px; color: var(--text-color3); }
.greetings-main .greetings-composer-section,
.greetings-main .greetings-examples-section,
.greetings-main .greetings-final { background: var(--main-container2); }
.greetings-main .greetings-composer { padding: 28px; background: var(--bg-color); border: 1px solid var(--border); border-radius: 16px; }
.greetings-main .greetings-format-picker { padding: 0; margin: 0; border: 0; min-width: 0; }
.greetings-main .greetings-format-picker legend { font-weight: 600; margin-bottom: 12px; }
.greetings-main .greetings-format-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.greetings-main .greetings-format-options label { position: relative; cursor: pointer; min-width: 0; }
.greetings-main .greetings-format-options input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.greetings-main .greetings-format-options span { display: flex; justify-content: center; padding: 14px 12px; border: 1px solid var(--border); border-radius: 6px; color: var(--text-color); background: var(--main-container2); }
.greetings-main .greetings-format-options input:checked + span { background: var(--primary-cont); border-color: var(--accent-color); color: var(--accent-color); }
.greetings-main .greetings-format-options input:focus-visible + span { outline: 3px solid var(--accent-color); outline-offset: 3px; }
.greetings-main .greetings-compose-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 30px; margin-top: 28px; }
.greetings-main .greetings-fields,
.greetings-main .greetings-prompt-panel { min-width: 0; }
.greetings-main .greetings-field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
.greetings-main .greetings-field { display: grid; gap: 10px; min-width: 0; font-weight: 500; }
.greetings-main .greetings-field input,
.greetings-main .greetings-field select,
.greetings-main .greetings-field textarea { width: 100%; min-width: 0; border: 1px solid var(--border2); border-radius: 6px; color: var(--text-color); background: var(--bg-color); font: inherit; font-weight: 400; padding: 12px; }
.greetings-main .greetings-field textarea { resize: vertical; min-height: 130px; line-height: 1.5; }
.greetings-main .greetings-field input::placeholder,
.greetings-main .greetings-field textarea::placeholder { color: var(--text-color3); opacity: .75; }
.greetings-main .greetings-field input:focus-visible,
.greetings-main .greetings-field select:focus-visible,
.greetings-main .greetings-field textarea:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 2px; }
.greetings-main .greetings-prompt-panel { border-left: 1px solid var(--border); padding-left: 30px; }
.greetings-main .greetings-prompt-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.greetings-main .greetings-note { margin-top: 10px; color: var(--text-color3); font-size: 13px; line-height: 20px; }
.greetings-main .greetings-copy-status { min-height: 20px; margin-top: 8px; color: var(--accent-color); font-size: 13px; line-height: 20px; }
.greetings-main .greetings-formats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px; }
.greetings-main .greetings-format-card { display: flex; flex-direction: column; gap: 18px; grid-column: span 2; min-height: 0; }
.greetings-main .greetings-format-card:nth-last-child(-n+2) { grid-column: span 3; }
.greetings-main .greetings-format-card > p { flex: 1; color: var(--text-color3); line-height: 1.5; }
.greetings-main .greetings-format-card > button { align-self: flex-start; }
.greetings-main .greetings-examples,
.greetings-main .greetings-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.greetings-main .greetings-example { display: flex; flex-direction: column; gap: 18px; min-height: 0; }
.greetings-main .greetings-example > img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.greetings-main .greetings-example > p:not(.greetings-note) { color: var(--text-color3); line-height: 1.5; flex: 1; }
.greetings-main .greetings-example > button { margin-top: auto; }
.greetings-main .greetings-message blockquote { margin: 0; color: var(--text-color); font-size: 20px; line-height: 1.6; }
.greetings-main .greetings-examples-note { text-align: center; margin-top: 20px; }
.greetings-main .greetings-steps .documents-step { min-height: 0; }
.greetings-main .greetings-final .section-titles { margin-bottom: 0; }
@media (max-width: 1199px) {
 .greetings-main .greetings-prompt-actions { grid-template-columns: 1fr; }
 .greetings-main .greetings-composer { padding: 20px; }
 .greetings-main .greetings-compose-grid { gap: 20px; }
 .greetings-main .greetings-prompt-panel { padding-left: 20px; }
}
@media (max-width: 767px) {
 .greetings-main .greetings-hero { padding-bottom: 48px; }
 .greetings-main .greetings-section { padding-block: 40px; }
 .greetings-main .greetings-format-options { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
 .greetings-main .greetings-compose-grid { grid-template-columns: 1fr; }
 .greetings-main .greetings-prompt-panel { padding: 20px 0 0; border-left: 0; border-top: 1px solid var(--border); }
 .greetings-main .greetings-prompt-actions { grid-template-columns: 1fr 1fr; }
 .greetings-main .greetings-field input,
 .greetings-main .greetings-field select,
 .greetings-main .greetings-field textarea { font-size: 16px; }
 .greetings-main .greetings-formats,
 .greetings-main .greetings-examples,
 .greetings-main .greetings-steps { grid-template-columns: 1fr; }
 .greetings-main .greetings-format-card,
 .greetings-main .greetings-format-card:nth-last-child(-n+2) { grid-column: auto; }
 .greetings-main .greetings-example > img { max-height: 320px; }
}
@media (max-width: 479px) {
 .greetings-main .greetings-field-pair,
 .greetings-main .greetings-prompt-actions { grid-template-columns: 1fr; }
 .greetings-main .greetings-composer { padding: 16px; }
}
@media (prefers-reduced-motion: reduce) {
 .greetings-main *, .greetings-main *::before, .greetings-main *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}