/* /{locale}/create-ai-card/ (create-ai-card.php): the three kinds use the home bands (persuasion-bands.css: blue / dark / blue, phone on
   one side), the earnings band is purple, steps and cards use the /apps/ feature tiles (app-download.css, pixel icons). */
.cac-page{width:min(860px,calc(100% - 56px));margin:0 auto;padding:28px 0 64px;display:grid;gap:30px}
.cac-head h1{margin:0;font-size:clamp(34px,5.5vw,58px);line-height:1.04;letter-spacing:-.04em;font-weight:900;color:var(--text-primary);text-wrap:balance}
.cac-head p{margin:12px 0 0;font-size:clamp(18px,2vw,22px);line-height:1.4;font-weight:600;color:var(--text-secondary)}
.cac-bands{margin:0}
.cac-phone-ico{display:grid;place-items:center;flex:none;width:34px;height:34px}
.cac-phone-ico .app-pixel-icon{width:34px;height:34px}
.cac-smart .pb-phone{transform:rotate(-2deg)}.cac-smart:hover .pb-phone{transform:rotate(0)}
.cac-see{margin:-6px 0 0;text-align:center}
.cac-see a{color:var(--text-primary);font-weight:800;font-size:17px;text-decoration:underline}
.cac-see a:focus-visible,.cac-final-btn:focus-visible{outline:3px solid #8664ff;outline-offset:3px}
.cac-band{border:3px solid #102331;border-radius:28px;box-shadow:10px 10px 0 #102331;padding:clamp(22px,4vw,44px);color:#102331;margin:0}
.cac-earn{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:28px;align-items:center;background:radial-gradient(circle at 18% 22%,rgba(255,255,255,.5),transparent 42%),#d9ccff}
.cac-earn-copy{display:grid;gap:10px;justify-items:start}
.cac-earn-ico .app-pixel-icon{width:64px;height:64px}
.cac-earn small{font-size:15px;font-weight:800;opacity:.72}
.cac-earn h2{margin:0;font-size:clamp(28px,3.6vw,42px);line-height:1.05;letter-spacing:-.03em;font-weight:900}
.cac-earn p{margin:0;font-size:clamp(18px,1.8vw,21px);line-height:1.4;font-weight:600;color:rgba(16,35,49,.88)}
.cac-flow{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.cac-flow li{position:relative;padding:14px 16px;border:3px solid #102331;border-radius:16px;background:#fff;font-size:18px;font-weight:800}
.cac-flow li+li::before{content:"↓";position:absolute;left:50%;top:-24px;font-size:18px;transform:translateX(-50%)}
.cac-flow li.win{background:#0b1220;color:#52e5a5;font-size:24px}
.cac-app{display:grid;gap:8px}
.cac-app .app-features{margin-top:clamp(20px,3vw,32px)}
.cac-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.cac-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.app-feature-icon-chat{background:#b9e6ff}.app-feature-icon-cap{background:#ffd966}.app-feature-icon-smile{background:#e9b7d0}
.app-feature-icon-mail{background:#bce7c9}.app-feature-icon-check{background:#bce7c9}.app-feature-icon-qr{background:#b9e6ff}.app-feature-icon-coin{background:#d9ccff}
.cac-final{margin:6px 0 0;text-align:center}
.cac-final-btn{margin-top:0;color:#fff;background:#000}
@media(max-width:900px){.cac-page{width:calc(100% - 28px)}}
@media(max-width:820px){.cac-earn{grid-template-columns:1fr}.cac-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.cac-grid-3{grid-template-columns:1fr}.cac-band{border-radius:20px;box-shadow:6px 6px 0 #102331}}
/* Like the home page (persuasion-bands.css): the first box stays, then the boxes step right and left. Wide screens only. */
@media(min-width:1200px){
  .cac-bands>.cac-smart{translate:40px 0}
  .cac-bands>section:nth-child(3){translate:-40px 0}
  .cac-earn{translate:40px 0}
}
