/* Single post (blog.html). Breakpoint: useMobile(900). The body styles the real post content
   (Gutenberg/classic) like the demo's heading / paragraph / image blocks. */
.cc-post{background:var(--cream);padding:clamp(32px,4vw,64px) 24px clamp(72px,8vw,120px)}
.cc-post__wrap{width:100%;max-width:926px;margin:0 auto;padding-left:clamp(24px,5vw,72px);padding-right:clamp(24px,5vw,72px)}
.cc-post__head{display:flex;flex-direction:column;align-items:center;gap:40px;text-align:center}
.cc-js .cc-post__head{transform:translate3d(0,26px,0);transition:transform .6s var(--ease-expo)}
.cc-js .cc-post__head.is-in{transform:none}
.cc-post__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;font-family:var(--font-mono);font-weight:400;font-size:16px;letter-spacing:.04em;text-transform:uppercase;color:#000}
.cc-post__dot{width:3px;height:3px;border-radius:50%;background:#000;flex:0 0 auto}
.cc-post__title{margin:0;font-family:var(--font-display);font-weight:700;font-size:clamp(52px,7vw,80px);line-height:1;letter-spacing:-4px;text-transform:none;color:#000;text-wrap:balance}
.cc-post__intro{margin:0;max-width:620px;font-family:var(--font-display);font-weight:400;font-size:16px;line-height:1.4;color:#000;text-wrap:pretty}

.cc-post__body{margin-top:40px;font-family:var(--font-display);font-weight:400;font-size:16px;line-height:1.3;color:#000;text-align:left}
.cc-post__body>*{margin:0}
.cc-post__body>*+*{margin-top:40px}
.cc-post__body>p+p,.cc-post__body>p+ul,.cc-post__body>p+ol,.cc-post__body>ul+p,.cc-post__body>ol+p{margin-top:20px}
.cc-post__body p{text-wrap:pretty}
.cc-post__body :is(h1,h2,h3,h4,h5,h6){font-family:var(--font-display);font-weight:700;font-size:52px;line-height:1;letter-spacing:-2.6px;text-transform:none;color:#000;text-align:left;text-wrap:balance}
.cc-post__body :is(h1,h2,h3,h4,h5,h6) strong{font-weight:inherit}
.cc-post__body a{text-decoration:underline;text-underline-offset:3px}
.cc-post__body strong,.cc-post__body b{font-weight:700}
.cc-post__body :is(ul,ol){padding-left:1.4em;display:flex;flex-direction:column;gap:10px}
.cc-post__body :is(figure,.wp-block-image){width:100%;height:480px;overflow:hidden;padding:0;line-height:0;background:transparent}
.cc-post__body :is(figure,.wp-block-image) img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.cc-post__body figcaption{display:none}
.cc-js .cc-post__body figure{transform:translate3d(0,40px,0);transition:transform .6s var(--ease-expo)}
.cc-js .cc-post__body figure.is-in{transform:none}
.cc-post__body blockquote{padding-left:20px;border-left:2px solid #000}
.cc-post__body .wp-block-embed,.cc-post__body iframe{max-width:100%}

/* MAYBE YOU LIKE */
.cc-post-more{background:var(--red);padding:clamp(72px,8vw,120px) 0}
.cc-post-more__wrap{width:min(1240px,100% - 96px);margin:0 auto}
.cc-post-more__title{margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.28em;font-family:var(--font-display);font-weight:800;font-size:100px;line-height:.9;letter-spacing:-0.05em;text-transform:uppercase;color:var(--cream);text-align:center}
.cc-post-more__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:clamp(40px,5vw,68px)}

@media (max-width:900px){
  .cc-post{padding:24px 16px 64px}
  .cc-post__wrap{padding-left:16px;padding-right:16px}
  .cc-post__title{font-size:clamp(32px,9.5vw,52px);letter-spacing:-2px}
  .cc-post__intro{font-size:15px}
  .cc-post__body{font-size:14px}
  .cc-post__body :is(h1,h2,h3,h4,h5,h6){font-size:clamp(30px,8vw,40px)}
  .cc-post__body :is(figure,.wp-block-image){height:clamp(220px,62vw,420px)}
  .cc-post-more{padding:56px 16px 64px}
  .cc-post-more__wrap{width:100%}
  .cc-post-more__title{font-size:clamp(40px,12vw,72px)}
  .cc-post-more__grid{grid-template-columns:1fr;margin-top:36px}
}
@media (prefers-reduced-motion:reduce){.cc-js .cc-post__head,.cc-js .cc-post__body figure{transform:none !important;transition:none !important}}