.community-hero{min-height:500px;display:grid;align-items:end;padding:clamp(8rem,15vw,13rem) max(5vw,calc((100vw - 1440px)/2)) 5rem;color:#fff;background:linear-gradient(90deg,rgba(3,36,49,.92),rgba(3,36,49,.18)),url('/assets/site/databali-coastal-experience.webp') center/cover}
.community-hero>div{max-width:760px}
.community-hero h1{font-size:clamp(3rem,7vw,6.8rem);line-height:.92;margin:.7rem 0 1.2rem}
.community-hero p{max-width:600px;font-size:1.15rem;margin-bottom:2rem}
.community-shell,.story-page{width:min(1440px,90vw);margin:auto;padding:clamp(3rem,8vw,7rem) 0}
.community-toolbar{display:flex;justify-content:space-between;align-items:end;margin-bottom:2.5rem}
.community-toolbar h2{font-size:clamp(2rem,4vw,4rem);margin:.3rem 0}
.community-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}
.community-card{border:1px solid #f3a16d;border-radius:28px;overflow:hidden;background:#fff;box-shadow:0 18px 60px rgba(5,50,67,.08)}
.community-card__image{display:block;aspect-ratio:16/10;overflow:hidden}
.community-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.community-card:hover img{transform:scale(1.04)}
.community-card>div{padding:1.7rem}
.community-card h3{font-size:clamp(1.6rem,3vw,2.7rem);margin:.5rem 0}
.community-composer{padding:2rem;border-radius:28px;background:#edf7f6;margin-bottom:4rem}
.community-composer form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.community-composer label{display:grid;gap:.5rem}
.community-composer .is-wide,.community-form__actions{grid-column:1/-1}
.community-composer input,.community-composer textarea,.story-conversation textarea,.story-conversation select{width:100%;border:1px solid #cadadd;border-radius:14px;padding:1rem;background:#fff}
.story-header{max-width:960px;margin-bottom:3rem}
.story-header h1{font-size:clamp(3rem,7vw,7rem);line-height:.95}
.story-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:1rem}
.story-gallery figure{flex:0 0 min(82vw,1000px);scroll-snap-align:start}
.story-gallery img{width:100%;max-height:720px;object-fit:cover;border-radius:28px}
.story-body{max-width:850px;font-size:1.2rem;line-height:1.9;margin:4rem auto}
.story-conversation{max-width:960px;margin:0 auto;padding:3rem;border-radius:28px;background:#f6f1eb}
.story-conversation form{display:grid;gap:1rem;margin:2rem 0}
.story-comments article{margin-left:calc(var(--depth)*2rem);border-top:1px solid #dfd4c8;padding:1.3rem 0}
.story-comments article button{border:0;background:none;color:#ef7146;font-weight:700}
@media(max-width:760px){.community-grid{grid-template-columns:1fr}
.community-composer form{grid-template-columns:1fr}
.community-composer label{grid-column:1}
.community-toolbar{align-items:start;gap:1rem}
.story-conversation{padding:1.4rem}
.story-comments article{margin-left:calc(var(--depth)*.7rem)}
}
.community-composer__head,.community-mine__head,.community-media-manager__head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.community-composer__head>button,.community-mine__head>button,.community-toolbar>button{border:0;background:transparent;color:#ef7146;font-weight:800;cursor:pointer}
.community-mine{margin-bottom:3rem;padding:clamp(1.25rem,3vw,2rem);border:1px solid #f3a16d;border-radius:28px;background:#fff}
.community-mine [data-community-mine-list]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.community-mine article{padding:1.2rem;border:1px solid #dce6e7;border-radius:18px}
.community-mine article>div{display:flex;justify-content:space-between;gap:1rem}
.community-mine article button,.community-mine article a{display:inline-flex;margin-top:.8rem;border:0;border-radius:999px;padding:.65rem 1rem;background:#082f3e;color:#fff;font-weight:750;text-decoration:none;cursor:pointer}
.community-status{display:inline-flex;width:max-content;border-radius:999px;padding:.3rem .65rem;background:#e9f1f2;color:#46616a;font-size:.76rem;font-weight:800}
.community-status--approved,.community-status--promoted{background:#daf4ec;color:#08735f}
.community-status--changes_requested,.community-status--rejected{background:#fff0e8;color:#ad4d2d}
.community-status--submitted,.community-status--private{background:#e5efff;color:#2456a3}
.community-upload-field small{color:#607982}
.community-media-manager{padding:1.2rem;border:1px solid #cbdcde;border-radius:20px;background:#f9fcfc}
.community-media-list{display:grid;gap:1rem;margin-top:1rem}
.community-media-list article{display:grid;grid-template-columns:180px 1fr;gap:1rem;padding:1rem;border-radius:16px;background:#fff}
.community-media-list img{width:180px;height:150px;object-fit:cover;border-radius:12px}
.community-media-list article>div{display:grid;grid-template-columns:1fr 1fr 110px;gap:.75rem}
.community-media-list article>div>p,.community-media-list article>div>span,.community-media-list article>div>div{grid-column:1/-1}
.community-media-list button{border:0;border-radius:999px;padding:.6rem 1rem;margin-right:.5rem;background:#082f3e;color:#fff;font-weight:700;cursor:pointer}
.community-media-list [data-media-delete]{background:#fff0e8;color:#9a3f26}
.story-report{margin-top:1rem;border:0;background:transparent;color:#a6573c;text-decoration:underline;cursor:pointer}
.story-comments article>div{display:flex;gap:.8rem;flex-wrap:wrap}
.story-comments article button.is-active{border-radius:999px;padding:.35rem .65rem;background:#fee8dc}
.story-conversation [data-community-replying]{padding:.65rem 1rem;border-radius:12px;background:#fff0e8;color:#8c432d;cursor:pointer}
@media(max-width:760px){.community-mine [data-community-mine-list]{grid-template-columns:1fr}.community-media-list article{grid-template-columns:1fr}.community-media-list img{width:100%;height:auto;aspect-ratio:16/10}.community-media-list article>div{grid-template-columns:1fr}.community-media-list article>div>*{grid-column:1}}