/* Fixes on top of the site-3 template: readable form labels, open specs,
   benefit grid, larger desktop hero, on-palette thanks page. */
.form-card label{color:#3d4450;font-weight:600}
.head{margin-left:auto;margin-right:auto;text-align:center}
.section-sub{text-align:center;margin:18px auto 0;color:#5f6670;font-size:16px}

/* Use cases: 2×2 on phones too */
.media-copy>.use-cases{grid-template-columns:repeat(4,1fr)}
.use-cases .pill{text-align:center}
.use-cases .pill b{display:block;font-size:17px;margin-bottom:4px}

/* Benefits */
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:820px;margin:0 auto}
.benefit-grid article{display:flex;flex-direction:column;gap:4px;padding:18px;background:#ffffff;border:1px solid #dfe2e8;border-radius:14px}
.benefit-grid b{font-size:19px;color:#1f2226}
.benefit-grid span{font-size:14px;color:#5f6670}

/* Specs are visible without a click */
.spec-open{max-width:820px;margin:0 auto;background:#ffffff;border:1px solid #dfe2e8;border-radius:14px;padding:4px 22px}
.spec-open>div:last-child,.spec-open>div:nth-last-child(2){border-bottom:0}

/* Package: centered column */
#package .package-list{grid-template-columns:repeat(3,1fr);max-width:820px}

/* Larger hero on desktop */
@media(min-width:821px){
 .hero h1{font-size:clamp(44px,4.6vw,62px)}
 .hero-benefit{font-size:21px}
 .hero-purchase .btn{font-size:17px;padding:15px 30px}
 .hero-copy{justify-content:center}
}

/* Thanks page follows the site palette */
.check{background:var(--red);box-shadow:0 12px 30px #0000001a}
.accepted{background:#eef4fc;border-color:#c6d8f2;color:var(--red)}
.customer{background:#fbf8f3;border-color:#ece1d2}
.light .action{background:var(--red)}

@media(max-width:820px){
 .media-copy>.use-cases{grid-template-columns:1fr 1fr}
 .benefit-grid{grid-template-columns:1fr 1fr}
 .spec-open>div:nth-last-child(2){border-bottom:1px solid #e3e6eb}
}
@media(max-width:480px){
 .benefit-grid article{padding:14px}
 .benefit-grid b{font-size:16px}
 #package .package-list{grid-template-columns:1fr}
 .spec-open{padding:2px 16px}
}

/* Site 4 specifics */
.unit{text-transform:none}
.section-visual{max-width:700px;margin:0 auto 22px}
.section-visual img{display:block;width:100%;border-radius:inherit}
.photo-benefits span:nth-child(1){left:4%;top:40%;right:auto;bottom:auto}
.photo-benefits span:nth-child(2){left:4%;top:55%;right:auto;bottom:auto}
.photo-benefits span:nth-child(3){left:4%;top:70%;right:auto;bottom:auto}
@media(max-width:480px){.photo-benefits span:nth-child(1){top:38%}.photo-benefits span:nth-child(2){top:54%}.photo-benefits span:nth-child(3){top:70%}}

/* Site 6 */
.check-list{list-style:none;padding:0;margin:20px auto 0;max-width:700px;display:grid;gap:10px}
.check-list li{display:flex;align-items:center;gap:12px;padding:14px 16px;background:#fff;border:1px solid #dfe2e8;border-radius:12px;font-size:16px;color:#1f2226}
.check-list b{font-size:20px;line-height:1}
.kit-list{grid-template-columns:1fr 1fr!important;margin:18px 0 0!important;max-width:none!important}
.kit-list li{padding:12px 14px;font-size:14px}
.spec-open dd{text-wrap:pretty}
@media(max-width:480px){.kit-list li{font-size:13px;padding:10px 12px}}

/* Final (night) photo: small scattered labels in free areas */
.final-art .final-labels{position:absolute;inset:0;display:block;pointer-events:none}
.final-art .final-labels span{position:absolute;flex:none;display:inline-flex;align-items:center;gap:6px;width:auto;padding:7px 12px;border-radius:999px;font-size:13px;font-weight:600;color:#1f2226;background:#fffffff0;border:1px solid #c6d8f2;box-shadow:0 4px 14px #0000003d;white-space:nowrap}
.final-art .final-labels b{display:inline;font-size:15px;margin:0}
.final-art .final-labels span:nth-child(1){left:4%;top:6%;rotate:-3deg}
.final-art .final-labels span:nth-child(2){right:4%;top:56%;rotate:3deg}
.final-art .final-labels span:nth-child(3){left:42%;bottom:3%;rotate:-2deg}
@media(max-width:480px){.final-art .final-labels span{font-size:11px;padding:5px 9px;gap:4px}.final-art .final-labels b{font-size:12px}}
#package .kit-list{max-width:700px!important;margin:0 auto!important}

/* Site 8 */
.final-art .final-labels span:nth-child(1){left:4%;top:5%;right:auto;bottom:auto;rotate:-3deg}
.final-art .final-labels span:nth-child(2){left:auto;right:4%;top:6%;bottom:auto;rotate:3deg}
.final-art .final-labels span:nth-child(3){left:4%;top:auto;bottom:24%;right:auto;rotate:2deg}
.final-art .final-labels span:nth-child(4){left:auto;right:5%;top:auto;bottom:5%;rotate:-2deg}
.places{text-align:center;font-weight:700;letter-spacing:1.5px;color:#1d63c7;margin:26px 0 6px;font-size:14px}
.final-sub{margin:14px 0 0;font-weight:700;color:#1f2226;letter-spacing:.3px}

/* Site 8: hero labels in the four free corners, final labels likewise */
.photo-benefits span:nth-child(1){left:3%;top:3%;right:auto;bottom:auto}
.photo-benefits span:nth-child(2){right:3%;top:3%;left:auto;bottom:auto}
.photo-benefits span:nth-child(3){left:3%;bottom:3%;top:auto;right:auto}
.photo-benefits span:nth-child(4){right:3%;bottom:3%;top:auto;left:auto}
.final-art .final-labels span:nth-child(1){left:4%;top:5%;right:auto;bottom:auto;rotate:-3deg}
.final-art .final-labels span:nth-child(2){right:4%;top:5%;left:auto;bottom:auto;rotate:3deg}
.final-art .final-labels span:nth-child(3){left:4%;bottom:4%;top:auto;right:auto;rotate:2deg}
.final-art .final-labels span:nth-child(4){right:4%;bottom:4%;top:auto;left:auto;rotate:-2deg}