.owos-tropical-night{background:#071d1c;color:#fff1cc;position:relative;isolation:isolate}.owos-tropical-night::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 78% 12%,rgba(255,226,145,.25),transparent 30%);animation:moonGlow 9s ease-in-out infinite alternate}@keyframes moonGlow{from{opacity:.4}to{opacity:1}}@media(prefers-reduced-motion:reduce){.owos-tropical-night::before{animation:none}}
.owos-tropical-night .owos-custom-panel{background:#092923;color:#fff1cc;border:1px solid #c9a663;border-radius:16px}
.owos-tropical-night .owos-custom-panel{background:#092923;color:#fff1cc;border:1px solid #c9a663;border-radius:16px}
.owos-tropical-night .owos-custom-panel{background:#092923;color:#fff1cc;border:1px solid #c9a663;border-radius:16px}
.owos-tropical-night h1,.owos-tropical-night h2,.owos-tropical-night h3{color:#efd398;font-family:Georgia,serif}
.owos-tropical-night .owos-effect-fireflies span{color:#ffe7a0;text-shadow:0 0 9px #ffd76b,0 0 19px #ffd76b;animation:owos-firefly-drift 11s ease-in-out infinite alternate}@keyframes owos-firefly-drift{from{transform:translate3d(-10px,5vh,0);opacity:.1}to{transform:translate3d(45px,65vh,0);opacity:.9}}@media(prefers-reduced-motion:reduce){.owos-tropical-night .owos-effect-fireflies span{animation:none}}
.owos-tropical-night::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(175deg,transparent 0 25px,#c9a66322 26px 27px);animation:moonwater 12s ease-in-out infinite alternate}@keyframes moonwater{to{opacity:.2;transform:translateY(12px)}}

.owos-tropical-night .owos-group-header{background:linear-gradient(to bottom,transparent 55%,#071d1c 100%),url("/assets/group-themes/moonlit-tropical-garden.webp") center top/cover no-repeat;min-height:340px;border:1px solid #c9a663;border-radius:18px;padding:24px;box-sizing:border-box}
/* Cocoa compact moonlit header V2 */
.owos-tropical-night .owos-group-header{position:relative;min-height:0!important;padding:0 0 18px!important;overflow:hidden}
.owos-tropical-night .owos-group-header .owos-group-banner{width:100%;height:290px!important;max-height:290px!important;object-fit:cover;object-position:center 45%;border-radius:16px}
.owos-tropical-night .owos-group-header h1{position:relative;margin:-76px 20px 14px!important;padding:12px 18px;background:linear-gradient(90deg,rgba(4,26,23,.94),rgba(4,26,23,.4));border-left:3px solid #d6b16b;color:#fff1cc!important;font-size:clamp(26px,3vw,42px)!important;text-shadow:0 2px 10px #000}
.owos-tropical-night .owos-group-header .lead,.owos-tropical-night .owos-group-header .muted{padding:0 20px}

/* COCOA HEADER V3 */
.owos-tropical-night .owos-group-header .owos-group-banner{height:240px!important;max-height:240px!important}
.owos-tropical-night .owos-group-header .lead{color:#fff1cc!important;background:rgba(3,24,22,.88);padding:10px 14px!important;border-radius:8px;margin:10px 20px!important}
.owos-tropical-night .owos-group-header .muted{color:#e2d3ac!important;background:rgba(3,24,22,.85);padding:8px 14px!important;border-radius:8px;margin:8px 20px!important}


/* COCOA HEADER STRUCTURE V4 */
.owos-tropical-night .owos-group-header {
  background:#092923!important;
  min-height:0!important;
  padding:12px!important;
  border:1px solid #c9a663;
  border-radius:18px;
  overflow:hidden;
}
.owos-tropical-night .owos-group-header .owos-group-banner {
  height:230px!important;
  max-height:230px!important;
  margin:0 0 12px!important;
  object-fit:cover;
}
.owos-tropical-night .owos-group-header h1 {
  margin:0 0 12px!important;
  padding:0!important;
  background:none!important;
  border:0!important;
  font-size:clamp(25px,3vw,38px)!important;
}
.owos-tropical-night .owos-group-header .lead,
.owos-tropical-night .owos-group-header .muted {
  margin:8px 0!important;
}


/* COCOA COMPACT INFO V5 */
.owos-tropical-night .owos-group-header {
    margin-bottom:14px!important;
    padding:12px!important;
}
.owos-tropical-night .owos-group-header .owos-group-banner {
    height:200px!important;
    max-height:200px!important;
    margin-bottom:10px!important;
}
.owos-tropical-night .owos-group-header h1 {
    margin:0 0 8px!important;
    line-height:1.15!important;
}
.owos-tropical-night .owos-group-header .lead {
    margin:6px 0!important;
    padding:8px 12px!important;
}
.owos-tropical-night .owos-group-header .muted {
    margin:6px 0!important;
    padding:6px 12px!important;
}
.owos-tropical-night .owos-group-header a,
.owos-tropical-night .owos-group-header button {
    margin-top:4px;
}
@media(max-width:680px) {
    .owos-tropical-night .owos-group-header .owos-group-banner {
        height:160px!important;
        max-height:160px!important;
    }
}

/* COCOA MOONLIT GARDEN ANIMATIONS V1 */
.owos-tropical-night .owos-group-header::before,
.owos-tropical-night .owos-group-header::after {
  content:"";
  position:absolute;
  top:12px;
  left:12px;
  right:12px;
  height:200px;
  pointer-events:none;
  z-index:2;
  border-radius:16px;
}
.owos-tropical-night .owos-group-header::before {
  background:
    radial-gradient(circle at 27% 76%,rgba(255,190,75,.35),transparent 5%),
    radial-gradient(circle at 72% 69%,rgba(255,205,105,.28),transparent 6%);
  animation:cocoaGardenLights 5s ease-in-out infinite alternate;
}
.owos-tropical-night .owos-group-header::after {
  background:repeating-linear-gradient(177deg,transparent 0 12px,rgba(195,225,225,.09) 13px,transparent 15px);
  clip-path:polygon(0 76%,100% 76%,100% 100%,0 100%);
  animation:cocoaLagoonShimmer 9s ease-in-out infinite alternate;
}
@keyframes cocoaGardenLights {
  from {opacity:.3}
  to {opacity:1}
}
@keyframes cocoaLagoonShimmer {
  from {opacity:.25;transform:translateY(-2px)}
  to {opacity:.7;transform:translateY(3px)}
}
@media(max-width:680px) {
  .owos-tropical-night .owos-group-header::before,
  .owos-tropical-night .owos-group-header::after {
    height:160px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .owos-tropical-night .owos-group-header::before,
  .owos-tropical-night .owos-group-header::after {
    animation:none;
  }
}


/* COCOA MOVING CLOUDS V1 */

.owos-tropical-night .cocoa-cloud-layer {
    position:absolute;
    top:12px;
    left:12px;
    right:12px;
    height:200px;
    overflow:hidden;
    pointer-events:none;
    border-radius:16px;
    z-index:3;
}

.owos-tropical-night .cocoa-cloud {
    position:absolute;
    left:-55%;
    width:50%;
    height:90px;
    opacity:.52;
    pointer-events:none;

    background:
      radial-gradient(
        ellipse at 22% 62%,
        rgba(185,205,215,.57) 0 25%,
        transparent 57%
      ),
      radial-gradient(
        ellipse at 48% 42%,
        rgba(218,229,234,.57) 0 29%,
        transparent 57%
      ),
      radial-gradient(
        ellipse at 70% 63%,
        rgba(175,200,212,.50) 0 24%,
        transparent 60%
      );

    filter:blur(7px);

    animation:
      cocoaCloudDrift 85s linear infinite;
}

.owos-tropical-night .cocoa-cloud--1 {
    top:8px;
    animation-duration:85s;
    animation-delay:-38s;
}

.owos-tropical-night .cocoa-cloud--2 {
    top:45px;
    height:65px;
    opacity:.34;
    animation-duration:125s;
    animation-delay:-65s;
}

.owos-tropical-night .cocoa-cloud--3 {
    top:20px;
    height:110px;
    opacity:.25;
    animation-duration:165s;
    animation-delay:-110s;
}

@keyframes cocoaCloudDrift {
    from {
        transform:translate3d(0,0,0);
    }
    to {
        transform:translate3d(340%,0,0);
    }
}

@media(max-width:680px) {
    .owos-tropical-night .cocoa-cloud-layer {
        height:160px;
    }
}

@media(prefers-reduced-motion:reduce) {
    .owos-tropical-night .cocoa-cloud {
        animation:none!important;
        transform:translate3d(130%,0,0);
        opacity:.18;
    }
}


/* COCOA SHAPED CLOUDS V2 */

.owos-tropical-night .cocoa-cloud {
    position:absolute;
    left:-190px;
    width:165px;
    height:38px;

    border-radius:65% 65% 40% 40%;

    background:linear-gradient(
        180deg,
        rgba(225,235,245,.88) 0%,
        rgba(169,190,207,.82) 48%,
        rgba(80,110,133,.83) 100%
    );

    box-shadow:
        0 5px 12px rgba(0,0,0,.24),
        inset 0 -6px 9px rgba(34,59,80,.22);

    filter:none;
    opacity:.78;

    animation:cocoaShapedCloudDrift 110s linear infinite;
}

.owos-tropical-night .cocoa-cloud::before {
    content:"";
    position:absolute;

    width:75px;
    height:66px;

    left:23px;
    bottom:11px;

    border-radius:50%;

    background:linear-gradient(
        155deg,
        rgba(234,242,250,.94),
        rgba(166,188,207,.88) 75%,
        rgba(99,128,149,.85)
    );
}

.owos-tropical-night .cocoa-cloud::after {
    content:"";
    position:absolute;

    width:87px;
    height:76px;

    left:65px;
    bottom:7px;

    border-radius:50%;

    background:linear-gradient(
        155deg,
        rgba(224,236,247,.91),
        rgba(151,177,198,.86) 75%,
        rgba(86,117,141,.82)
    );
}

.owos-tropical-night .cocoa-cloud--1 {
    top:53px;
    opacity:.76;
    animation-duration:110s;
    animation-delay:-42s;
}

.owos-tropical-night .cocoa-cloud--2 {
    top:92px;
    opacity:.48;
    animation-duration:155s;
    animation-delay:-84s;
}

.owos-tropical-night .cocoa-cloud--3 {
    top:47px;
    opacity:.36;
    animation-duration:195s;
    animation-delay:-125s;
}

@keyframes cocoaShapedCloudDrift {
    from {
        left:-190px;
    }

    to {
        left:calc(100% + 190px);
    }
}

@media(max-width:680px) {
    .owos-tropical-night .cocoa-cloud {
        width:125px;
        height:28px;
    }

    .owos-tropical-night .cocoa-cloud::before {
        width:58px;
        height:50px;
        left:15px;
    }

    .owos-tropical-night .cocoa-cloud::after {
        width:65px;
        height:57px;
        left:45px;
    }
}

@media(prefers-reduced-motion:reduce) {
    .owos-tropical-night .cocoa-cloud {
        animation:none!important;
        left:15%;
    }

    .owos-tropical-night .cocoa-cloud--2 {
        left:55%;
    }

    .owos-tropical-night .cocoa-cloud--3 {
        left:75%;
    }
}

/* COCOA ORIGINAL CLOUD RESET V3 */
.owos-tropical-night .cocoa-cloud-layer {
    display:none!important;
}

/* COCOA FULL ARTWORK V1 */
.owos-tropical-night .owos-group-header .owos-group-banner {
    display:block;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
}


/* COCOA RESPONSIVE PAGE LAYOUT V1 */
html:has(.owos-tropical-night),
body:has(.owos-tropical-night){background:#071d1c}
body:has(.owos-tropical-night)>main{
 width:100%;max-width:1480px;margin:0 auto;
 padding:20px clamp(10px,2vw,28px) 60px;
}
.owos-tropical-night{width:100%;min-width:0;border-radius:18px}
.owos-tropical-night .owos-group-shell{width:100%!important;min-width:0}
.owos-tropical-night .owos-group-columns{
 display:grid;
 grid-template-columns:minmax(190px,1fr) minmax(0,2.4fr) minmax(190px,1fr);
 gap:16px;align-items:start;
}
.owos-tropical-night main.owos-group-center{
 width:100%;max-width:none;min-width:0;margin:0;padding:0;
}
.owos-tropical-night .owos-group-left,
.owos-tropical-night .owos-group-right{
 display:block;grid-column:auto;min-width:0;
}
.owos-tropical-night .owos-group-columns>*{overflow-wrap:anywhere}
.owos-tropical-night .owos-group-columns>*>:first-child{margin-top:0!important}
@media(max-width:900px){
 .owos-tropical-night .owos-group-columns{
  grid-template-columns:minmax(175px,1fr) minmax(0,2.4fr);
 }
 .owos-tropical-night .owos-group-right{
  grid-column:1/-1;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;
 }
}
@media(max-width:620px){
 .owos-tropical-night .owos-group-columns{
  grid-template-columns:minmax(0,1fr);gap:12px;
 }
 .owos-tropical-night .owos-group-left,
 .owos-tropical-night .owos-group-right{
  grid-column:auto;display:block;
 }
}


/* COCOA COMPACT COMMUNITY CARDS V1 */
.owos-tropical-night .owos-group-columns{
 gap:14px;
}
.owos-tropical-night .owos-group-columns .card,
.owos-tropical-night .owos-group-columns .panel,
.owos-tropical-night .owos-group-columns .owos-custom-panel{
 background:linear-gradient(145deg,rgba(19,53,44,.97),rgba(6,31,27,.98));
 border:1px solid rgba(196,168,99,.65);
 border-radius:10px;
 padding:16px;
 margin-bottom:14px;
 box-shadow:0 5px 18px rgba(0,0,0,.18);
 color:#eee9ce;
}
.owos-tropical-night .owos-group-columns h2{
 font-size:clamp(19px,1.45vw,24px);
 line-height:1.2;
 margin:0 0 12px;
 color:#ead69b;
}
.owos-tropical-night .owos-group-columns h3{
 font-size:18px;line-height:1.25;margin:0 0 10px;color:#ead69b;
}
.owos-tropical-night .owos-group-columns p{
 font-size:15px;line-height:1.55;margin:0 0 10px;
}
.owos-tropical-night .owos-group-columns p:last-child{margin-bottom:0}
.owos-tropical-night .owos-group-columns label{
 font-size:14px;gap:5px;margin-bottom:10px;
}
.owos-tropical-night .owos-group-columns input,
.owos-tropical-night .owos-group-columns textarea,
.owos-tropical-night .owos-group-columns select{
 min-width:0;max-width:100%;
 background:#092d26;color:#f3edd5;
 border:1px solid #66734b;border-radius:7px;
 padding:10px 12px;font-size:15px;
}
.owos-tropical-night .owos-group-columns input::placeholder,
.owos-tropical-night .owos-group-columns textarea::placeholder{
 color:#aebaa4;opacity:1;
}
.owos-tropical-night .owos-group-columns textarea{min-height:100px}
.owos-tropical-night .owos-group-columns button{
 background:linear-gradient(#285c3d,#123c2d);
 border:1px solid #bdab6b;border-radius:8px;
 color:#fff0bf;padding:9px 14px;font-size:14px;
}
.owos-tropical-night .owos-group-columns a{color:#d7dda7}
.owos-tropical-night .owos-group-columns :focus-visible{
 outline:2px solid #f0d583;outline-offset:3px;
}


/* COCOA APPROVED FOLIAGE BACKGROUND V1 */
html:has(.owos-tropical-night){
 background:#071d1c;
}
body:has(.owos-tropical-night){
 min-height:100vh;
 background-color:#071d1c;
 background-image:url("/assets/group-themes/cocoa-foliage.png");
 background-position:center top;
 background-size:cover;
 background-repeat:no-repeat;
 background-attachment:fixed;
}
body:has(.owos-tropical-night)>main{
 background:transparent;
}
.owos-custom-group.owos-tropical-night{
 background:rgba(4,24,22,.38);
 border:1px solid rgba(194,166,92,.25);
 box-shadow:0 12px 45px rgba(0,0,0,.35);
 padding:clamp(8px,1.2vw,18px);
}
.owos-tropical-night .owos-group-columns{
 background:transparent;
}
@media(max-width:620px){
 body:has(.owos-tropical-night){
  background-attachment:scroll;
  background-size:auto 100vh;
  background-repeat:repeat-y;
 }
}


/* COCOA MORE VISIBLE FOLIAGE V1 */
body:has(.owos-tropical-night)>main{
 max-width:1200px;
}
@media(min-width:901px){
 .owos-tropical-night .owos-group-columns{
  grid-template-columns:minmax(190px,1fr) minmax(0,2fr) minmax(190px,1fr);
 }
}