/* Product-page additions; the studio and existing Spell Trail pages keep their shared styles. */
.capysweeper-page, .capysweeper-policy-page { --accent: #52745c; }
.product-breadcrumb { margin-top: 34px; font-size: 13px; color: var(--muted); }
.product-breadcrumb a { text-decoration: none; }
.product-hero { display: grid; grid-template-columns: 1.05fr .95fr; gap: 72px; align-items: center; padding-block: 54px 90px; }
.product-hero .eyebrow { margin-bottom: 18px; color: var(--accent); }
.product-hero h1 { font-size: clamp(48px, 5.4vw, 75px); letter-spacing: -.065em; }
.product-alias { margin-top: 10px; color: #819075; font-size: 21px; font-weight: 550; letter-spacing: .1em; }
.product-tagline { max-width: 470px; margin-top: 30px; font-size: clamp(27px, 3vw, 39px); line-height: 1.2; letter-spacing: -.035em; }
.product-description { max-width: 490px; margin-top: 22px; color: var(--muted); font-size: 17px; line-height: 1.8; }
.product-facts { display: flex; flex-wrap: wrap; gap: 9px; list-style: none; margin: 25px 0 0; padding: 0; }
.product-facts li { padding: 6px 11px; border: 1px solid #dedfcd; border-radius: 99px; color: #67775e; background: #f4f5e9; font-size: 12px; font-weight: 600; }
.product-hero .button { background: #52745c; }
.product-hero .button:hover { background: #405e48; }
.product-secondary { display: inline-block; margin-left: 18px; font-size: 13px; color: #66765e; }
.product-language { margin-top: 18px; font-size: 13px; color: var(--muted); }
.product-illustration { position: relative; margin: 0; padding: 145px 36px 28px; border-radius: 26px; border: 1px solid #e2e5d3; background: #eef2e3; }
.product-illustration > img { position: absolute; width: 136px; height: 136px; top: 20px; left: 50%; transform: translateX(-50%) rotate(-5deg); border-radius: 26px; box-shadow: 0 8px 24px #54613812; }
.preview-board { display: grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap: 4px; max-width: 340px; margin-inline: auto; padding: 12px; background: #fffaf0; border: 1px solid #e4ddc9; border-radius: 14px; box-shadow: 0 4px 0 #d9dfc733; }
.preview-cell { aspect-ratio: 1; display: grid; place-items: center; min-width: 0; color: #8d8068; font-size: clamp(13px,1.4vw,19px); font-weight: 600; border-radius: 5px; }
.preview-cell.blank { background: #ece2cc; box-shadow: 0 1px 0 #dbceb5; }
.preview-cell.satisfied { color: #648261; background: #e2edd9; }
.preview-cell.flag { background: #f2dfb6; color: #9a783d; }
.preview-cell svg { width: 19px; height: 19px; fill: #d1a867; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.product-illustration figcaption { margin-top: 15px; font-size: 11px; text-align: center; color: #899175; }
.product-section { padding-block: 65px 74px; }
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 38px; margin-top: 36px; }
.feature-grid h3 { font-size: 21px; letter-spacing: -.4px; line-height: 1.25; }
.feature-grid p { margin-top: 14px; color: var(--muted); line-height: 1.8; }
.feature-number { display: block; color: #a5ad8b; font-size: 12px; margin-bottom: 18px; letter-spacing: 1.5px; }
.play-steps { list-style: none; padding: 0; margin: 34px 0 0; display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; counter-reset: steps; }
.play-steps li { counter-increment: steps; padding-left: 28px; position: relative; color: var(--muted); }
.play-steps li::before { content: counter(steps,decimal-leading-zero); position: absolute; left: 0; top: 2px; color: #96a17f; font-size: 11px; }
.play-steps strong { display: block; margin-bottom: 10px; color: var(--ink); font-size: 17px; }
.closed-test { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.closed-test .status { margin-bottom: 20px; color: #789064; }
.closed-test h2 { max-width: 450px; line-height: 1.15; }
.closed-test p + p { margin-top: 18px; }
.closed-test > div:last-child { color: var(--muted); line-height: 1.8; }
.closed-test .button { margin-top: 25px; background: #52745c; }
.chinese-intro { scroll-margin-top: 34px; }
.chinese-intro .intro-copy { max-width: 770px; margin-top: 26px; font-size: 18px; line-height: 2; color: var(--muted); }
.chinese-details { display: grid; grid-template-columns: repeat(2,1fr); gap: 35px; margin-top: 30px; }
.chinese-details h3 { font-size: 19px; line-height: 1.5; margin-bottom: 10px; }
.chinese-details p { color: var(--muted); line-height: 1.9; }
.privacy-callout { padding-block: 28px 65px; color: var(--muted); font-size: 14px; }
.privacy-callout a { color: var(--accent); }
.policy-languages { display: flex; gap: 20px; margin-top: 23px; font-size: 14px; }
.capysweeper-policy-page .document > .intro { font-size: 17px; color: var(--muted); }
.capysweeper-policy-page .policy-language { margin-top: 46px; padding-top: 37px; border-top: 1px solid var(--line); scroll-margin-top: 30px; }
.capysweeper-policy-page .policy-language > h2 { font-size: 29px; line-height: 1.25; letter-spacing: -.025em; margin-bottom: 22px; }
.capysweeper-policy-page .policy-language h3 { font-size: 20px; margin-top: 29px; line-height: 1.35; }
.capysweeper-policy-page .policy-language p { margin-top: 14px; color: var(--muted); }
@media(max-width:950px) { .product-hero { gap:35px;grid-template-columns:1.1fr .9fr; }.product-illustration{padding:130px 18px 22px;}.product-illustration>img{width:120px;height:120px}.product-secondary{display:block;margin:16px 0 0}.feature-grid{gap:25px}.closed-test{gap:40px} }
@media(max-width:700px) { .product-hero{grid-template-columns:1fr;padding-block:35px 55px;gap:40px}.product-hero h1{font-size:clamp(43px,10vw,65px)}.product-tagline{font-size:30px}.product-alias{font-size:18px}.product-description{font-size:16px}.product-illustration{max-width:460px;width:100%;margin-inline:auto;padding:140px 24px 22px}.product-illustration>img{width:128px;height:128px}.preview-cell{font-size:18px}.feature-grid,.play-steps,.chinese-details,.closed-test{grid-template-columns:1fr;gap:29px}.product-section{padding-block:43px 50px}.feature-number{margin-bottom:12px}.feature-grid{margin-top:28px}.closed-test h2{font-size:31px}.chinese-intro .intro-copy{font-size:17px}.product-breadcrumb{margin-top:26px}.privacy-callout{padding-bottom:45px}.capysweeper-policy-page .policy-language>h2{font-size:26px} }