/* Hybrid (from Concept C) — contact: send a raven */
.sg-ct { min-height: calc(100vh - 64px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(420px, 620px); }
.sg-ct-art { position: relative; overflow: hidden; min-height: 320px; }
.sg-ct-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% center; transition: transform 1.2s var(--ease-out), opacity 1s; }
.sg-ct-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,10,8,.2), rgba(12,10,8,.15) 55%, #12100d), linear-gradient(180deg, transparent 55%, rgba(12,10,8,.9)); }
.sg-ct-cap { position: absolute; z-index: 2; left: clamp(20px, 4vw, 56px); bottom: clamp(24px, 6vh, 60px); right: 20%; }
.sg-ct-cap .sg-h1 { margin: 6px 0 8px; font-size: clamp(34px, 4.2vw, 60px); }
.sg-ct-cap p { margin: 0; font: italic 19px/1.45 var(--font-lore); color: var(--cream); text-shadow: 0 2px 10px rgba(0,0,0,.9); }
.sg-ct-side { padding: 30px clamp(18px, 3vw, 44px); display: grid; gap: 18px; align-content: center; background: linear-gradient(90deg, rgba(18,16,13,.92), #12100d 30%); }
.sg-letter { padding: 22px; display: grid; gap: 12px; }
.sg-field { display: grid; gap: 5px; }
.sg-field label, .sg-lab { font: 700 11px/1 var(--font-heading); letter-spacing: .18em; text-transform: uppercase; color: #6b5232; }
.sg-field label em { font: italic 12px var(--font-lore); letter-spacing: 0; text-transform: none; color: #8a7050; }
.sg-in { height: 42px; padding: 0 12px; border-radius: 8px; border: 1px solid rgba(90,60,20,.35); background: rgba(255,250,240,.55); color: #2b2014; font: 400 17px/1.4 var(--font-lore); outline: none; transition: border-color .2s, box-shadow .2s, background .2s; }
.sg-in:focus { border-color: #8a6420; box-shadow: 0 0 0 3px rgba(168,135,43,.25); background: rgba(255,250,240,.85); }
.sg-ta { height: auto; padding: 10px 12px; resize: vertical; min-height: 110px; }
.sg-field.bad .sg-in, .sg-field.bad .sg-topics { border-color: #8a1c22; box-shadow: 0 0 0 3px rgba(138,28,34,.15); border-radius: 10px; }
.sg-err { font: italic 14px/1.2 var(--font-lore); color: #8a1c22; }
.sg-topics { display: flex; flex-wrap: wrap; gap: 6px; border: 1px solid transparent; }
.sg-topics button { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px 0 6px; border-radius: 999px; border: 1px solid rgba(90,60,20,.3); background: rgba(255,250,240,.45); color: #4a3418; font: 600 13px/1 var(--font-body); transition: border-color .2s, background .2s, transform .2s var(--ease-spring); }
.sg-topics button i { width: 22px; height: 22px; border-radius: 50%; background: radial-gradient(circle at 38% 32%, #e2c9a0, #b39a72); box-shadow: inset 0 0 0 2px rgba(0,0,0,.08); transition: background .25s; }
.sg-topics button:hover { transform: translateY(-1px); border-color: #8a6420; }
.sg-topics button.on { border-color: #8a1c22; background: rgba(255,250,240,.85); color: #2b2014; }
.sg-topics button.on i { background: radial-gradient(circle at 38% 32%, #d24848, #85181d 62%, #4a0a0e); }
.sg-letter .btn.primary { justify-self: start; }
.sg-expect { display: grid; gap: 10px; }
.sg-expect .sg-h3 { margin: 0; }
.sg-sent { text-align: center; display: grid; gap: 10px; justify-items: center; padding: 30px 10px; animation: rise .5s var(--ease-out); }
.sg-sent .sg-seal { width: 76px; height: 76px; font-size: 30px; }
.sg-sent h2 { margin: 0; font: 700 26px/1.2 var(--font-heading); color: #3c2f1e; }
.sg-sent p { margin: 0; font: italic 17px/1.5 var(--font-lore); color: #5a4630; }
.sg-flyraven { position: fixed; z-index: 950; font-size: 64px; color: #1a1612; filter: drop-shadow(0 0 10px rgba(243,212,122,.6)); pointer-events: none; }
@media (max-width: 1000px) { .sg-ct { grid-template-columns: 1fr; } .sg-ct-art { min-height: 340px; } .sg-ct-side { background: #12100d; } }