.sac-wrap { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
.sac-title { text-align:center; font-size: clamp(28px, 4vw, 44px); font-weight: 800; margin: 30px 0 10px; line-height: 1.1; }
.sac-topbar { display:flex; justify-content:center; padding: 18px 0 30px; }
.sac-btn {
    border: 0;
    padding: 14px 26px;
    border-radius: 999px;
    color: #fff;
    font-weight: 800;
    cursor:pointer;
    background: linear-gradient(90deg, #ff2aa0, #ff007a);
    box-shadow: 0 14px 40px rgba(0,0,0,.18);
}
.sac-band { background: #f6ece7; padding: 42px 24px; }
.sac-band-left { max-width: 260px; padding: 20px 12px; }
.sac-quote { font-size: 120px; line-height: 0.8; color: #ff007a; font-weight: 900; }
.sac-band-text { font-size: 44px; font-weight: 300; line-height: 1.05; color: #111; }

.sac-band { display:grid; grid-template-columns: 280px 1fr; gap: 24px; align-items: start; }
@media (max-width: 980px){
    .sac-band { grid-template-columns: 1fr; }
    .sac-band-left { max-width: none; }
    .sac-band-text { font-size: 34px; }
}

.sac-grid { display:grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sac-wrap[data-cols="2"] .sac-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sac-wrap[data-cols="4"] .sac-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 980px){ .sac-grid { grid-template-columns: 1fr; } }

.sac-card { }
.sac-bubble {
    background:#fff;
    border-radius: 16px;
    padding: 18px 18px 14px;
    box-shadow: 0 12px 30px rgba(0,0,0,.07);
    position: relative;
    min-height: 170px;
}
.sac-bubble:after{
    content:"";
    position:absolute;
    left: 26px;
    bottom: -10px;
    width: 20px; height: 20px;
    background:#fff;
    transform: rotate(45deg);
    box-shadow: 8px 8px 18px rgba(0,0,0,.05);
}
.sac-bubble-text { font-size: 14.5px; line-height: 1.55; color:#222; }

.sac-stars { margin-top: 10px; }
.sac-star { font-size: 18px; opacity: .25; color: #ff007a; }
.sac-star.is-on { opacity: 1; }

.sac-person { display:flex; align-items:center; gap: 12px; margin-top: 14px; padding-left: 8px; }
.sac-avatar {
    width: 54px; height: 54px; border-radius: 999px; object-fit: cover;
    border: 3px solid #ff007a;
    box-shadow: 0 8px 18px rgba(0,0,0,.10);
}
.sac-name { font-weight: 900; color:#111; }
.sac-role { font-size: 13px; opacity: .75; }

.sac-empty { padding: 18px; }

.sac-modal { position: fixed; inset:0; display:none; z-index: 9999; }
.sac-modal.is-open { display:block; }
.sac-modal-backdrop { position:absolute; inset:0; background: rgba(0,0,0,.45); }
.sac-modal-panel {
    position: relative;
    width: min(620px, calc(100% - 28px));
    margin: 70px auto;
    background:#fff;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 30px 80px rgba(0,0,0,.22);
}
.sac-modal-close {
    position:absolute; right: 12px; top: 12px;
    border:0; background:transparent; font-size: 20px; cursor:pointer;
}
.sac-modal-title { margin: 6px 0 14px; font-weight: 900; font-size: 22px; }

.sac-row { margin-bottom: 12px; }
.sac-row-2 { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 640px){ .sac-row-2 { grid-template-columns: 1fr; } }

.sac-row label { display:block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.sac-row input, .sac-row textarea, .sac-row select {
    width:100%;
    border:1px solid #e6e6e6;
    border-radius: 12px;
    padding: 12px 12px;
    outline:none;
}
.sac-row input:focus, .sac-row textarea:focus { border-color:#ff007a; }

.sac-rating { display:flex; gap: 8px; align-items:center; }
.sac-rate-star {
    border:0; background:transparent; cursor:pointer;
    font-size: 26px; line-height: 1;
    opacity: .25; color:#ff007a;
}
.sac-rate-star.is-on { opacity: 1; }

.sac-actions { display:flex; align-items:center; gap: 14px; margin-top: 12px; }
.sac-msg { font-size: 13px; }
.sac-msg.is-ok { color: #1a7f37; }
.sac-msg.is-err { color: #b42318; }

.sac-hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
body.sac-noscroll { overflow:hidden; }

.sac-wrap--only { margin: 0; }
.sac-wrap--only .sac-grid { margin-top: 0; }
