/* Halo Concepts: inner pages (area pages, industry guides, the cost guide, privacy, terms).
   Loaded after calm.css: same nav, footer, type and colour; set as a calm reading page. */

.inner{padding-top:calc(var(--nav) + clamp(56px,6vw,112px));padding-bottom:clamp(96px,9vw,168px)}
.prose{max-width:calc(880px + var(--gutter) * 2)}

/* labels */
.prose .mono{display:block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);line-height:1.6}
.prose .eyebrow{color:var(--brass-ink);margin-bottom:22px}

/* type */
.prose h1{font-size:clamp(40px,4.4vw,76px);font-weight:600;letter-spacing:-.035em;line-height:1.05;text-wrap:balance;margin-bottom:28px}
.prose h1 em{font-style:normal;color:var(--quiet)} /* the hero's two-tone, not italics */
.prose .lead{font-size:clamp(19px,1.25vw,24px);line-height:1.5;color:var(--soft);max-width:34em;margin-bottom:12px}
.prose .updated{font-size:15px;color:var(--soft)}
.prose section{margin-top:clamp(64px,6vw,104px)}
.prose h2{font-size:clamp(28px,2.2vw,40px);font-weight:600;letter-spacing:-.025em;line-height:1.15;text-wrap:balance;margin-bottom:20px}
.prose h3{font-size:clamp(19px,1.15vw,21px);font-weight:600;letter-spacing:-.015em;line-height:1.3;margin-bottom:6px}
.prose p{font-size:clamp(17px,1.05vw,19px);line-height:1.65;color:var(--soft);max-width:40em;margin-bottom:18px}
.prose p strong,.prose li strong{color:var(--ink);font-weight:600}
.prose main a:not(.btn),.prose p a,.prose li a{color:var(--brass-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose ul:not([class]),.prose ol:not([class]){margin:0 0 18px 1.2em;color:var(--soft);font-size:clamp(17px,1.05vw,19px);line-height:1.65;max-width:40em}
.prose ul:not([class]){list-style:disc}.prose ol:not([class]){list-style:decimal}
.prose ul:not([class]) li,.prose ol:not([class]) li{margin-bottom:8px}

/* the hairline lists (reasons, hidden costs) */
.points,.hidden-costs{margin-top:12px;border-top:1px solid var(--hair);max-width:44em}
.points li,.hidden-costs li{position:relative;padding:24px 0 24px 32px;border-bottom:1px solid var(--hair)}
.points li::before,.hidden-costs li::before{content:"";position:absolute;left:4px;top:34px;width:8px;height:8px;border-radius:50%;background:var(--brass)}
.hidden-costs li::before{background:#C9C9CE}
.points p,.hidden-costs p{margin-bottom:0;font-size:17px}

/* the three facts strip */
.offer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:12px}
.offer>div{background:var(--stone);border-radius:var(--r-m);padding:28px 28px 30px}
.offer .mono{margin-bottom:10px}
.offer strong{display:block;font-size:clamp(21px,1.3vw,24px);font-weight:600;letter-spacing:-.02em;color:var(--ink)}

/* cost guide: the direct answer, the comparison, the price cells */
.answer-box{background:var(--stone);border-radius:var(--r-m);padding:clamp(28px,3vw,44px);margin-top:clamp(40px,4vw,64px)}
.answer-box .label{display:block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--brass-ink);margin-bottom:12px}
.answer-box p{margin-bottom:0;color:var(--ink)}
.compare-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:12px}
.compare{width:100%;border-collapse:collapse;font-size:16px;min-width:620px}
.compare th{text-align:left;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);padding:0 16px 14px 0;border-bottom:1px solid var(--hair)}
.compare td{padding:18px 16px 18px 0;border-bottom:1px solid var(--hair);color:var(--soft);vertical-align:top;line-height:1.45}
.compare td:first-child{color:var(--ink);font-weight:500}
.compare tr.highlight td{background:var(--stone)}
.compare tr.highlight td:first-child{padding-left:16px;border-radius:14px 0 0 14px}
.compare tr.highlight td:last-child{border-radius:0 14px 14px 0}
.prose .pill{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:var(--r-l);font-size:13px;font-weight:600;letter-spacing:.02em;white-space:nowrap;background:#fff;color:var(--soft);box-shadow:inset 0 0 0 1px var(--hair)}
.prose .pill-own{background:var(--black);color:#fff;box-shadow:none}
.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:12px}
.pricing-cell{background:var(--stone);border-radius:var(--r-m);padding:32px 32px 34px}
.pricing-cell .plan{display:block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin-bottom:10px}
.pricing-cell .price{font-size:clamp(40px,3.2vw,56px);font-weight:600;letter-spacing:-.035em;line-height:1;color:var(--ink);margin-bottom:14px}
.pricing-cell .desc{font-size:16px;line-height:1.6;color:var(--soft)}

/* the closing call to action */
.cta{margin-top:clamp(72px,7vw,120px);background:var(--stone);border-radius:var(--r-m);padding:clamp(36px,4vw,64px)}
.cta h2{margin-bottom:12px}
.cta p{margin-bottom:0}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(43,40,37,.28)}
.btn-ghost:hover{background:#fff}

@media (max-width:720px){
  .offer,.pricing-grid{grid-template-columns:1fr}
  .btns .btn{width:100%}
}