@import"https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;500;600;700&family=Playfair+Display:wght@700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{margin:0;padding:0}*{box-sizing:border-box;margin:0;padding:0}body{font-family:"Source Sans 3",sans-serif;background:#f4f6fa;color:#1f1f1f;min-height:100vh}.hero{position:relative;width:100%;height:280px;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column}.hero-bg{position:absolute;inset:0;width:100%;height:100%}.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,#78370a8c,#3c1405a6)}.hero-content{position:relative;text-align:center;z-index:2;padding:0 24px}.badge{display:inline-block;background:#ffffff26;border:1px solid rgba(255,255,255,.35);color:#fff;font-size:10px;letter-spacing:2.5px;text-transform:uppercase;padding:5px 16px;border-radius:20px;margin-bottom:14px;font-weight:600}h1{font-family:Playfair Display,serif;font-size:clamp(28px,5vw,44px);font-weight:700;color:#fff;line-height:1.15;margin-bottom:10px;text-shadow:0 2px 16px rgba(0,0,0,.3)}.subtitle{color:#ffffffb8;font-size:15px;font-weight:300;letter-spacing:.2px}.app{max-width:820px;margin:0 auto;padding:36px 24px 60px}.card{background:#fff;border:1px solid #dde3f0;border-radius:14px;padding:28px;margin-bottom:20px;box-shadow:0 2px 12px #0056d20f}.section-title{font-size:13px;font-weight:700;color:#0056d2;margin-bottom:20px;display:flex;align-items:center;gap:10px;letter-spacing:1.2px;text-transform:uppercase}.section-title:after{content:"";flex:1;height:1px;background:#dde3f0}.field-group{display:grid;grid-template-columns:1fr 1fr;gap:14px}@media(max-width:580px){.field-group{grid-template-columns:1fr}}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1 / -1}label{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#5a6480;font-weight:600}input,textarea{background:#f7f9fc;border:1.5px solid #dde3f0;border-radius:9px;padding:11px 14px;color:#1f1f1f;font-family:"Source Sans 3",sans-serif;font-size:14px;transition:border-color .2s,box-shadow .2s;outline:none;resize:vertical;width:100%}input:focus,textarea:focus{border-color:#0056d2;box-shadow:0 0 0 3px #0056d21a;background:#fff}input::placeholder,textarea::placeholder{color:#b0b8cc}textarea{min-height:95px}select{background:#f7f9fc;border:1.5px solid #dde3f0;border-radius:9px;padding:11px 36px 11px 14px;color:#1f1f1f;font-family:"Source Sans 3",sans-serif;font-size:14px;transition:border-color .2s,box-shadow .2s;outline:none;width:100%;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238896b4' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}select:focus{border-color:#0056d2;box-shadow:0 0 0 3px #0056d21a;background-color:#fff}select option{background:#fff}.upload-zone{border:2px dashed #b8c4e0;border-radius:12px;padding:30px 20px;text-align:center;cursor:pointer;transition:all .2s;background:#f7f9fc}.upload-zone:hover,.upload-zone.drag{border-color:#0056d2;background:#0056d20a}.upload-icon{font-size:34px;margin-bottom:10px}.upload-label{color:#0056d2;font-size:14px;font-weight:600;margin-bottom:4px}.upload-sub{color:#8896b4;font-size:12px}.file-chosen{display:flex;align-items:center;gap:10px;background:#eef3fd;border:1px solid #b8c4e0;border-radius:9px;padding:11px 16px;margin-top:10px}.file-chosen span{font-size:13px;color:#0056d2;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}.remove-file{background:none;border:none;color:#8896b4;cursor:pointer;font-size:16px;padding:0 4px;transition:color .15s}.remove-file:hover{color:#c94040}.tabs{display:flex;gap:6px;margin-bottom:20px;background:#fff;padding:5px;border-radius:12px;border:1px solid #dde3f0;box-shadow:0 1px 6px #0056d20d}.tab{flex:1;padding:10px 8px;border:none;border-radius:8px;cursor:pointer;font-family:"Source Sans 3",sans-serif;font-size:13px;font-weight:600;transition:all .2s;background:transparent;color:#8896b4;letter-spacing:.2px}.tab.active{background:#0056d2;color:#fff;box-shadow:0 2px 8px #0056d24d}.generate-btn{width:100%;padding:15px;background:linear-gradient(135deg,#0056d2,#271066);border:none;border-radius:11px;color:#fff;font-family:"Source Sans 3",sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:opacity .2s,transform .1s;letter-spacing:.3px;box-shadow:0 4px 16px #0056d24d}.generate-btn:hover{opacity:.93;transform:translateY(-1px)}.generate-btn:active{transform:translateY(0)}.generate-btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.output-card{background:#fff;border:1px solid #dde3f0;border-radius:14px;overflow:hidden;margin-top:24px;box-shadow:0 4px 20px #0056d214;animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.output-header{display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid #dde3f0;background:linear-gradient(135deg,#0056d2,#271066);flex-wrap:wrap;gap:10px}.output-title{font-size:14px;color:#fff;font-weight:700;letter-spacing:.5px;text-transform:uppercase}.action-btns{display:flex;gap:8px;flex-wrap:wrap}.copy-btn,.email-btn{border-radius:8px;padding:7px 14px;font-family:"Source Sans 3",sans-serif;font-size:12px;cursor:pointer;transition:all .2s;font-weight:600}.copy-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.35);color:#fff}.copy-btn:hover{background:#ffffff40}.copy-btn.copied{background:#64c86440;border-color:#64c86480}.email-btn{background:#fff;border:none;color:#0056d2}.email-btn:hover{background:#eef3fd}.email-btn:disabled{opacity:.45;cursor:not-allowed}.output-body{padding:28px;white-space:pre-wrap;font-size:14.5px;line-height:1.9;color:#2a2a3a}.loading{display:flex;align-items:center;gap:12px;padding:28px;color:#8896b4;font-size:14px}.spinner{width:18px;height:18px;border:2px solid #dde3f0;border-top-color:#0056d2;border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.error{padding:13px 18px;background:#fff0f0;border:1px solid #f5c0c0;border-radius:9px;color:#c94040;font-size:13px;margin-bottom:16px;font-weight:500}.tip{font-size:12px;color:#8896b4;padding:10px 14px;background:#f0f4fd;border-left:3px solid #0056D2;border-radius:0 8px 8px 0;margin-top:10px;line-height:1.6}.success{padding:13px 18px;background:#f0faf2;border:1px solid #a8d8b0;border-radius:9px;color:#2e7d44;font-size:13px;margin-bottom:16px;font-weight:500}