/* Votare 11: estilos organizados por responsabilidad. */
/* Base: social */
/* Formularios y páginas no pertenecientes al feed. Admin styles are deliberately untouched.
   Designed for mobile first, fluid galleries, accessible icon actions and contest themes. */
:root {
    --social-action:#18263b;
    --social-muted:#6e7b90
}

body.public-body {
    font-size:16px;
    line-height:1.55
}

body.public-body .site-main {
    width:100%;
    max-width:none;
    padding-inline:clamp(12px,2.4vw,54px);
    padding-bottom:68px
}

body.public-body .site-header-inner {
    max-width:1780px;
    width:100%;
    padding-inline:clamp(16px,2.6vw,54px)
}

body.public-body .site-header {
    height:68px
}

body.public-body .site-nav a {
    font-size:15px
}

body.public-body .site-footer {
    padding:27px 15px;
    font-size:14px
}

/* Wide, full-canvas browsing on large monitors */
body.public-body .social-event,body.public-body .social-home {
    width:100%;
    max-width:1760px;
    margin-inline:auto;
    padding-inline:0
}

body.public-body .social-event {
    padding-top:clamp(12px,1.4vw,25px)
}

body.public-body .event-cover-card {
    min-height:clamp(350px,38vw,570px);
    border-radius:clamp(16px,1.6vw,28px);
    box-shadow:0 24px 70px rgba(10,16,39,.11);
    margin:0
}

body.public-body .event-cover-photo img {
    height:100%;
    width:100%;
    object-fit:cover
}

body.public-body .event-cover-content {
    max-width:940px;
    padding:clamp(28px,5.2vw,90px)
}

body.public-body .event-cover-content h1 {
    font-size:clamp(36px,5.5vw,84px);
    letter-spacing:-.047em;
    line-height:1.06
}

body.public-body .event-cover-content p {
    font-size:clamp(16px,1.25vw,21px);
    max-width:680px
}

body.public-body .event-overview {
    font-size:15px;
    padding:20px 4px;
    gap:25px;
    flex-wrap:wrap
}

body.public-body .social-gallery {
    padding:clamp(22px,3vw,48px) 0 40px
}

body.public-body .social-gallery-head {
    align-items:center;
    gap:20px;
    margin-bottom:24px
}

body.public-body .social-gallery-head h2 {
    font-size:clamp(30px,3vw,46px);
    letter-spacing:-.035em;
    line-height:1.2
}

body.public-body .social-gallery-head p {
    font-size:16px;
    line-height:1.5
}

body.public-body .social-search {
    width:min(100%,620px);
    max-width:none;
    min-height:54px;
    border-radius:16px;
    margin-bottom:28px
}

body.public-body .social-search input {
    font-size:16px
}

body.public-body .social-grid {
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:clamp(12px,1.5vw,23px)
}

body.public-body .social-tile {
    border-radius:20px;
    box-shadow:0 10px 32px rgba(13,21,44,.045);
    transition:transform .25s ease,box-shadow .25s ease
}

body.public-body .social-tile:hover {
    box-shadow:0 24px 44px rgba(13,21,44,.12);
    transform:translateY(-4px)
}

body.public-body .social-tile-photo {
    aspect-ratio:4/5;
    display:block
}

body.public-body .social-tile-photo img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .45s cubic-bezier(.15,.72,.25,1)
}

body.public-body .social-tile:hover .social-tile-photo img {
    transform:scale(1.045)
}

body.public-body .social-tile-info {
    padding:13px 15px 15px
}

body.public-body .social-tile-name {
    font-size:15px;
    line-height:1.35;
    font-weight:750;
    overflow-wrap:anywhere
}

body.public-body .social-tile-actions {
    gap:12px;
    padding-top:12px;
    margin-top:10px
}

body.public-body .social-tile-actions a,body.public-body .social-tile-actions button {
    min-height:36px;
    min-width:36px;
    display:inline-flex;
    gap:6px;
    align-items:center;
    justify-content:center;
    border-radius:10px
}

body.public-body .social-tile-actions i {
    font-size:18px
}

body.public-body .social-home {
    padding-top:clamp(34px,4vw,70px)
}

body.public-body .social-home-head {
    max-width:920px
}

body.public-body .social-home-head h1 {
    font-size:clamp(36px,4.5vw,68px)
}

body.public-body .home-event-grid {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:clamp(13px,1.6vw,24px)
}

body.public-body .home-event-bottom strong {
    font-size:18px
}

/* Social-style portrait post, never a two-column business listing */
body.public-body .social-profile-wrap {
    width:min(100%,620px);
    max-width:620px;
    margin-inline:auto;
    padding:0
}

body.public-body .social-profile-wrap .social-breadcrumb {
    margin:18px 0 14px;
    padding:0;
    font-size:14px
}

body.public-body .social-post {
    border-radius:22px;
    border:1px solid #e8ecf1;
    box-shadow:0 14px 46px rgba(18,32,57,.07);
    overflow:hidden;
    background:#fff
}

body.public-body .post-top {
    height:auto;
    min-height:70px;
    padding:12px 18px;
    gap:12px
}

body.public-body .post-author strong {
    font-size:16px;
    line-height:1.25
}

body.public-body .post-author a {
    font-size:14px;
    line-height:1.4
}

body.public-body .post-media {
    aspect-ratio:4/5;
    max-height:none;
    background:#e9edf4;
    overflow:hidden;
    touch-action:pan-y;
    user-select:none;
    -webkit-user-select:none
}

body.public-body .post-media img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    pointer-events:none;
    -webkit-user-drag:none
}

body.public-body .post-bottom {
    padding:12px 17px 22px;
    background:#fff;
    animation:none
}

body.public-body .post-actions {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:56px
}

body.public-body .post-action-group {
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    gap:clamp(4px,1vw,12px);
    min-width:0
}

body.public-body .post-action,body.public-body .post-save {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    min-width:48px;
    padding:0;
    border:0;
    border-radius:14px;
    background:transparent;
    color:#1d2940;
    cursor:pointer;
    font-size:22px;
    transition:transform .19s cubic-bezier(.15,.8,.2,1.2),background .2s,color .2s
}

body.public-body .post-action:hover,body.public-body .post-action:focus-visible {
    background:#f1f4f9;
    transform:translateY(-2px)
}

body.public-body .post-action:focus-visible {
    outline:3px solid #7c9dff;
    outline-offset:2px
}

body.public-body .post-action i {
    font-size:23px;
    line-height:1
}

body.public-body .post-action span {
    display:none
}

body.public-body .post-action.is-liked {
    color:#f34470
}

body.public-body .done-action {
    color:#099f74;
    cursor:default
}

body.public-body .inactive-action {
    color:#99a3b3;
    cursor:default
}

body.public-body .post-like-total {
    margin-left:auto;
    white-space:nowrap;
    font-size:14px;
    font-weight:700;
    color:#5c6880;
    line-height:1.3;
    text-align:right
}

body.public-body .post-caption {
    font-size:16px;
    line-height:1.55;
    color:#384557;
    margin:10px 1px 0;
    overflow-wrap:anywhere
}

body.public-body .post-vote-total {
    font-size:14px;
    color:#8490a3;
    margin-top:11px
}

body.public-body .post-more {
    margin-top:18px;
    font-size:14px
}

body.public-body .social-under-post {
    font-size:14px
}

body.public-body .post-heart-burst i {
    font-size:100px;
    filter:drop-shadow(0 6px 16px rgba(0,0,0,.15))
}

/* Vote as a polished mobile bottom sheet, with a large readable numeric input */
body.public-body .vote-sheet-content {
    padding:32px 29px 28px;
    max-height:min(90dvh,730px);
    overflow-y:auto
}

body.public-body .vote-sheet-content h2 {
    font-size:clamp(23px,5vw,29px);
    line-height:1.2
}

body.public-body .vote-sheet-content p {
    font-size:16px
}

body.public-body .vote-phone-field {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    text-align:left;
    gap:7px;
    margin:19px 0 12px;
    color:#27354b;
    font-weight:750;
    font-size:15px
}

body.public-body .vote-phone-field input {
    width:100%;
    height:58px;
    padding:0 18px;
    font-family:inherit;
    font-size:22px;
    font-weight:700;
    letter-spacing:.06em;
    border:1px solid #d9e0ed;
    border-radius:14px;
    background:#f9fafe;
    color:#1e293b;
    outline:0;
    box-sizing:border-box
}

body.public-body .vote-phone-field input:focus {
    border-color:#5578fa;
    box-shadow:0 0 0 4px rgba(85,120,250,.12)
}

body.public-body .vote-phone-field small {
    font-size:13px;
    color:#738098;
    font-weight:500;
    letter-spacing:normal
}

body.public-body .vote-sheet-submit {
    min-height:54px;
    border-radius:14px;
    font-size:16px
}

/* Deliberate mobile compositions and legibility */
@media(max-width:1350px) {
    body.public-body .social-grid {
        grid-template-columns:repeat(4,minmax(0,1fr))
    }
    body.public-body .home-event-grid {
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
}

@media(max-width:950px) {
    body.public-body .social-grid {
        grid-template-columns:repeat(3,minmax(0,1fr))
    }
    body.public-body .home-event-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    body.public-body .event-cover-card {
        min-height:360px
    }
}

@media(max-width:640px) {
    body.public-body .site-main {
        padding-inline:0;
        padding-bottom:44px
    }
    body.public-body .site-header-inner {
        padding:0 16px
    }
    body.public-body .social-event {
        padding-top:0
    }
    body.public-body .event-cover-card {
        border-radius:0;
        min-height:335px
    }
    body.public-body .event-cover-content {
        padding:25px 22px 30px
    }
    body.public-body .event-cover-content h1 {
        font-size:clamp(34px,9vw,47px)
    }
    body.public-body .event-overview {
        padding:14px 16px;
        gap:12px
    }
    body.public-body .social-gallery {
        padding:26px 13px 32px
    }
    body.public-body .social-gallery-head {
        gap:10px
    }
    body.public-body .social-gallery-head h2 {
        font-size:29px
    }
    body.public-body .social-gallery-head p {
        font-size:15px
    }
    body.public-body .social-search {
        min-height:53px
    }
    body.public-body .social-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px
    }
    body.public-body .social-tile {
        border-radius:14px
    }
    body.public-body .social-tile-info {
        padding:10px 10px 11px
    }
    body.public-body .social-tile-name {
        font-size:14px
    }
    body.public-body .social-tile-actions {
        gap:6px;
        margin-top:7px;
        padding-top:7px
    }
    body.public-body .social-tile-actions a,body.public-body .social-tile-actions button {
        min-width:32px;
        min-height:35px
    }
    body.public-body .social-profile-wrap {
        width:100%;
        max-width:none
    }
    body.public-body .social-profile-wrap .social-breadcrumb {
        margin:12px 14px
    }
    body.public-body .social-post {
        border-inline:0;
        border-radius:0;
        box-shadow:none
    }
    body.public-body .post-top {
        padding:11px 14px;
        min-height:62px
    }
    body.public-body .post-bottom {
        padding:10px 12px 20px
    }
    body.public-body .post-actions {
        min-height:52px
    }
    body.public-body .post-action {
        height:46px;
        width:46px;
        min-width:46px
    }
    body.public-body .post-like-total {
        font-size:13px
    }
    body.public-body .social-under-post {
        padding:8px 14px
    }
    body.public-body .social-home {
        padding:27px 14px
    }
    body.public-body .home-event-grid {
        gap:11px
    }
    body.public-body .vote-sheet-content {
        width:100%;
        max-width:none;
        border-radius:24px 24px 0 0;
        margin:0;
        padding:26px 22px 34px
    }
}

@media(max-width:365px) {
    body.public-body .post-action {
        width:42px;
        min-width:42px
    }
    body.public-body .post-action-group {
        gap:1px
    }
    body.public-body .post-like-total {
        font-size:12px
    }
    body.public-body .social-grid {
        gap:8px
    }
}

@media(prefers-reduced-motion:reduce) {
    body.public-body .social-tile,body.public-body .social-tile-photo img,body.public-body .post-action {
        transition:none!important;
        animation:none!important
    }
}