
/* PHASE67 — mobile compact tune for Okaoka crowdfunding */
@media (max-width: 720px){

  html.p67-mobile-tune body{
    font-size:14px;
  }

  /* Main project title */
  .p67-main-title{
    font-size:clamp(30px,8vw,38px)!important;
    line-height:1.12!important;
    letter-spacing:-.025em!important;
    margin-top:12px!important;
    margin-bottom:10px!important;
  }

  /* Major section headings */
  .p67-section-heading{
    font-size:clamp(27px,7.3vw,34px)!important;
    line-height:1.15!important;
    letter-spacing:-.02em!important;
    margin-top:8px!important;
    margin-bottom:12px!important;
  }

  /* About / intro card */
  .p67-about-section{
    padding-top:18px!important;
    padding-bottom:18px!important;
  }
  .p67-about-section p{
    font-size:14px!important;
    line-height:1.75!important;
  }

  /* Statistics block */
  .p67-stats-section{
    padding-top:16px!important;
    padding-bottom:16px!important;
  }
  .p67-stats-section > *{
    margin-top:0!important;
    margin-bottom:0!important;
  }

  /* HOW TO SUPPORT */
  .p67-how-section{
    padding:18px 14px!important;
    margin-top:16px!important;
  }
  .p67-how-section .p67-section-heading{
    margin-bottom:10px!important;
  }
  .p67-how-section [class*="step"],
  .p67-how-section [class*="Step"]{
    min-height:0!important;
  }
  .p67-how-section .p67-how-special{
    margin:12px 0 14px;
  }

  .p67-how-special{
    display:block;
    padding:14px 14px 13px;
    border:1px solid #e8c8d5;
    border-radius:17px;
    background:
      radial-gradient(circle at 94% 0%,rgba(236,205,121,.22),transparent 34%),
      linear-gradient(135deg,#fff7fb 0%,#fffdf8 100%);
    text-decoration:none!important;
    color:#4c3741!important;
    box-shadow:0 8px 20px rgba(155,71,104,.07);
  }
  .p67-how-special .p67-special-kicker{
    display:block;
    color:#ab476e;
    font-size:10px;
    line-height:1.3;
    font-weight:900;
    letter-spacing:.12em;
  }
  .p67-how-special .p67-special-row{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px;
    margin-top:6px;
  }
  .p67-how-special .p67-special-title{
    font-size:19px;
    font-weight:900;
    line-height:1.2;
  }
  .p67-how-special .p67-special-price{
    flex:0 0 auto;
    color:#9f285a;
    font-size:20px;
    font-weight:900;
    line-height:1.1;
  }
  .p67-how-special .p67-special-copy{
    display:block;
    margin-top:7px;
    color:#74616a;
    font-size:11px;
    line-height:1.55;
  }
  .p67-how-special .p67-special-arrow{
    display:inline-block;
    margin-top:8px;
    color:#a74169;
    font-size:11px;
    font-weight:900;
  }

  /* Return section: retain readable artwork but reclaim vertical space. */
  .p67-returns-section{
    padding-top:16px!important;
  }
  .p67-returns-section img{
    display:block;
    width:90%!important;
    max-width:90%!important;
    height:auto!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Compact large cards inside returns/how-to without altering content. */
  .p67-returns-section article,
  .p67-returns-section [class*="return-card"],
  .p67-returns-section [class*="returnCard"]{
    padding-top:14px!important;
    padding-bottom:14px!important;
  }

  /* The fixed bottom CTA was obscuring a large fraction of the viewport. */
  .p67-sticky-cta{
    left:10px!important;
    right:10px!important;
    bottom:8px!important;
    width:auto!important;
    min-height:62px!important;
    height:auto!important;
    padding:7px 8px 7px 16px!important;
    border-radius:999px!important;
    gap:8px!important;
  }
  .p67-sticky-cta,
  .p67-sticky-cta *{
    line-height:1.2!important;
  }
  .p67-sticky-cta .p67-sticky-label{
    font-size:13px!important;
    font-weight:900!important;
  }
  .p67-sticky-cta a,
  .p67-sticky-cta button{
    min-height:48px!important;
    padding:0 18px!important;
    border-radius:999px!important;
    font-size:14px!important;
  }

  /* Bottom space so fixed CTA doesn't cover final content. */
  html.p67-mobile-tune body{
    padding-bottom:82px!important;
  }
}

/* Also keep the Special Support shortcut elegant on tablet/desktop. */
@media (min-width:721px){
  .p67-how-special{
    display:grid;
    grid-template-columns:1fr auto;
    gap:8px 18px;
    align-items:center;
    margin:18px 0;
    padding:18px 20px;
    border:1px solid #e8c8d5;
    border-radius:20px;
    background:linear-gradient(135deg,#fff7fb,#fffdf8);
    text-decoration:none!important;
    color:#4c3741!important;
  }
  .p67-special-kicker{grid-column:1/-1;color:#ab476e;font-size:11px;font-weight:900;letter-spacing:.12em}
  .p67-special-title{font-size:22px;font-weight:900}
  .p67-special-price{font-size:24px;font-weight:900;color:#9f285a}
  .p67-special-copy{font-size:13px;color:#74616a;line-height:1.6}
  .p67-special-arrow{font-size:12px;color:#a74169;font-weight:900}
}
