/* ===========================================================
   Choco Pop v2 — Content pages (about, contact, FAQ, rules, returns)
   Templates: main/templates/main/{about,contact,FAQ,rules,returns-policy}.html
              + main/templates/main/defaults/*
   =========================================================== */
main.cp-static{
  position:relative;padding-top:0;
  background:
    radial-gradient(circle at 18% 22%, rgba(237,155,51,.09) 0 2.5px, transparent 3px) 0 0/120px 90px,
    radial-gradient(ellipse at 50% 0%, #FFF1DE, transparent 55%),
    linear-gradient(180deg,#FFFBF6,var(--cp-milk));
}
.cp-static h1{font-weight:900 !important;color:var(--clay-cocoa-dark) !important;animation:cpDropIn .8s var(--cp-ease-jelly) both .1s;}
.cp-static header p,.cp-static h1 + p{animation:cpRiseIn .6s var(--cp-ease-out) both .3s;}
.cp-static h2{position:relative;font-weight:900 !important;color:var(--clay-cocoa-dark) !important;}
.cp-static h2::after{content:"";display:block;width:46px;height:5px;margin-top:8px;border-radius:5px;background:repeating-linear-gradient(-45deg,var(--clay-wine) 0 6px,var(--clay-gold) 6px 12px);}
.cp-static .text-center h2::after,.cp-static h2.text-center::after{margin-inline:auto;}

/* every card-ish block becomes clay and rises in */
.cp-static :is(.dk-section,[class*="rounded-2xl"][class*="border"],[class*="rounded-3xl"],[class*="rounded-[2"]){
  border-radius:28px !important;
  transition:transform .5s var(--cp-ease-jelly), box-shadow .3s ease;
}
.cp-static .container > * > :is(div,section){animation:cpRiseIn .55s var(--cp-ease-out) both;}
.cp-static .container > * > :is(div,section):nth-child(2){animation-delay:.06s;}
.cp-static .container > * > :is(div,section):nth-child(3){animation-delay:.12s;}
.cp-static .container > * > :is(div,section):nth-child(n+4){animation-delay:.18s;}
.cp-static .grid > :is(div,a){transition:transform .5s var(--cp-ease-jelly);}
.cp-static .grid > :is(div,a):hover{transform:translateY(-5px) rotate(-.6deg);}
.cp-static .grid > :is(div,a):hover img{animation:cpHop .6s var(--cp-ease-jelly);}

/* FAQ */
.cp-static #faq-search{border-radius:999px !important;}
.cp-static .faq-item{border-radius:22px !important;background:#fff !important;box-shadow:0 4px 0 rgba(237,155,51,.16);transition:transform .45s var(--cp-ease-jelly), box-shadow .25s ease;}
.cp-static .faq-item:hover{transform:translateX(-4px);}
.cp-static .faq-item:has(.faq-accordion-content.open){box-shadow:0 5px 0 rgba(166,25,46,.2), 0 10px 18px rgba(79,44,29,.1);}
.cp-static .faq-item:has(.faq-accordion-content.open) h3{color:var(--clay-wine) !important;font-weight:800 !important;}
.cp-static .faq-chevron{transition:transform .45s var(--cp-ease-jelly) !important;}
.cp-static .faq-accordion-content.open > div{animation:cpRiseIn .4s var(--cp-ease-out) both;}
.cp-static [data-faq-list] > .faq-item{animation:cpSlideInRow .45s var(--cp-ease-out) both;}
.cp-static [data-faq-list] > .faq-item:nth-child(2){animation-delay:.04s;}
.cp-static [data-faq-list] > .faq-item:nth-child(3){animation-delay:.08s;}
.cp-static [data-faq-list] > .faq-item:nth-child(4){animation-delay:.12s;}
.cp-static [data-faq-list] > .faq-item:nth-child(n+5){animation-delay:.16s;}

/* forms (contact) */
.cp-static :is(input[type=text],input[type=email],input[type=tel],textarea,select){border-radius:18px !important;transition:border-color .2s ease, box-shadow .25s ease !important;}
.cp-static :is(input,textarea,select):focus{outline:none !important;border-color:var(--clay-gold) !important;box-shadow:0 0 0 4px rgba(237,155,51,.18) !important;}
.cp-static button[type=submit]{position:relative;overflow:hidden;}
.cp-static button[type=submit]::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;pointer-events:none;background:linear-gradient(115deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:cpShineSweep 3.6s ease-in-out infinite;}

/* order review (SMS link) + discount pricing choice reuse the content-page look */
section.cp-review{background:radial-gradient(circle at 18% 22%, rgba(237,155,51,.09) 0 2.5px, transparent 3px) 0 0/120px 90px, radial-gradient(ellipse at 50% 0%, #FFF1DE, transparent 55%), linear-gradient(180deg,#FFFBF6,var(--cp-milk));}
.cp-review .review-star-btn{transition:transform .45s var(--cp-ease-jelly), color .2s ease !important;}
.cp-review .review-star-btn:hover{transform:scale(1.3) rotate(-12deg) !important;}
.cp-review .review-star-btn.is-active{color:var(--clay-gold) !important;text-shadow:0 3px 0 var(--clay-gold-deep), 0 0 14px rgba(237,155,51,.45) !important;animation:cpStarPop .5s var(--cp-ease-jelly);}
@keyframes cpStarPop{40%{transform:scale(1.45) rotate(-14deg);}100%{transform:scale(1.15);}}
.cp-pricing input:checked + label,.cp-pricing label:has(input:checked){border-color:var(--clay-wine) !important;box-shadow:0 5px 0 rgba(130,17,35,.2) !important;animation:cpJelly .6s ease;}

@media (prefers-reduced-motion: reduce){
  .cp-static h1,.cp-static header p,.cp-static h1 + p,.cp-static .container > * > *,.cp-static .faq-accordion-content.open > div,
  .cp-static [data-faq-list] > .faq-item,.cp-static button[type=submit]::after{animation:none !important;}
}