/* caloriesburned.app visual polish v1 (2026-10-25) - Design spec v1. Visual only. */
@font-face{font-family:Outfit;font-style:normal;font-weight:400 700;font-display:swap;src:url(/media/fonts/outfit-latin.woff2) format("woff2")}
:root{--primary:#c2410c;--ring:#fb923c;--cb-hover:#9a3412;--cb-tint:#fff1e8;--cb-ink:#1c1917;--cb-muted:#57534e;--muted-foreground:#57534e;--foreground:#1c1917;--card:#fff;--border:#e7e5e4;--cb-shadow:0 4px 20px rgba(0,0,0,.08);--cb-shadow-h:0 10px 30px rgba(0,0,0,.14);--cb-grad:linear-gradient(180deg,#4d4e4e 0%,#716861 30%,#8a7968 55%,#a6865a 85%,#ac854e 100%)}
html{min-height:100%;background:#ac854e}
body{min-height:100%;background:var(--cb-grad)!important;font-family:Outfit,Arial,Helvetica,sans-serif!important;font-size:17px;line-height:1.6;color:var(--cb-ink)}
body main{background:transparent!important}
body .font-mono{font-family:inherit}
/* focus */
body a:focus-visible,body button:focus-visible,body input:focus-visible,body select:focus-visible,body summary:focus-visible,body textarea:focus-visible,body [tabindex]:focus-visible{outline:3px solid #fb923c!important;outline-offset:2px!important}
/* header */
main>header:first-child{position:sticky;top:0;z-index:50;background:#fff!important;border-bottom:0!important;box-shadow:0 2px 14px rgba(0,0,0,.10)}
main>header:first-child nav{min-height:68px;padding-top:8px!important;padding-bottom:8px!important;max-width:1180px}
main>header:first-child nav>div a{font-size:16px;color:var(--cb-ink)!important;text-decoration:none;padding:12px 0;border-bottom:2px solid transparent}
main>header:first-child nav>div a:hover{color:var(--primary)!important;border-bottom-color:var(--primary)}
main>header:first-child nav>a[href$="burn-studio"]{height:44px;border-radius:999px!important;padding-inline:20px;background:#c2410c!important;color:#fff!important;font-size:15px}
main>header:first-child nav>a[href$="burn-studio"]:hover{background:#9a3412!important;opacity:1}
main>header:first-child nav>a:first-child{min-height:44px}
/* buttons generic */
.life-link{border-radius:999px!important}
.life-link-primary{background:#c2410c!important;color:#fff!important}
.life-link-primary:hover{background:#9a3412!important;transform:translateY(-1px)}
a.bg-primary,button.bg-primary{border-radius:999px!important}
a.bg-primary:hover,button.bg-primary:hover{background:#9a3412!important}
/* ---------- HOME ---------- */
main.home-page{display:grid;grid-template-columns:minmax(16px,1fr) minmax(0,470px) minmax(0,686px) minmax(16px,1fr);column-gap:0;grid-template-rows:auto auto auto auto auto auto minmax(280px,1fr) auto auto auto auto auto;overflow:visible!important}
main.home-page>header{grid-column:1/-1;grid-row:1}
main.home-page>.life-hero,main.home-page>.life-hero>.hero-copy{display:contents}
main.home-page .hero-copy>*{grid-column:2;margin-right:36px;color:#fff}
main.home-page .hero-copy>.eyebrow{grid-row:2;justify-self:start;margin-top:40px;background:rgba(255,255,255,.15);color:#fff}
main.home-page .hero-copy>.hero-slogan{grid-row:3;margin-top:20px!important;font-size:clamp(48px,5.4vw,72px)!important;color:#fff}
main.home-page .hero-copy>.hero-slogan>span{color:#fed7aa!important}
main.home-page .hero-copy>h1.hero-h1{grid-row:4;margin-top:18px!important;color:#fff}
main.home-page .hero-copy>.hero-actions{grid-row:5;margin-top:14px}
main.home-page .hero-copy>.hero-reassurance{grid-row:6;margin-top:6px;color:rgba(255,255,255,.9)}
main.home-page .hero-copy>.hero-reassurance svg{color:#fed7aa}
main.home-page .hero-actions .life-link-primary{display:none}
main.home-page .hero-actions .life-link-text{color:#fff;padding-inline:0;min-height:44px;text-decoration:underline;text-underline-offset:4px}
main.home-page .life-hero>.movement-photo{grid-column:2;grid-row:7;margin:20px 36px 0 0;width:auto!important;height:auto!important;min-height:280px;aspect-ratio:auto!important;border-radius:24px!important;justify-self:stretch!important;align-self:stretch}
main.home-page .life-hero>.movement-photo .hero-video{object-fit:cover}
main.home-page>#burn-studio{grid-column:3;grid-row:2/8;width:auto;margin:24px 0 0;padding:0;scroll-margin-top:80px}
main.home-page .hero-copy>.hero-intro{grid-column:2/4;grid-row:8;order:0;margin:32px 0 0!important;padding:28px;background:#fff;border-radius:16px;box-shadow:var(--cb-shadow);color:var(--cb-ink)!important;font-size:17px!important}
main.home-page .hero-copy>.hero-intro a{color:#c2410c}
main.home-page>.burned-invitation{grid-column:2/4;grid-row:9}
main.home-page>.movement-guides{grid-column:2/4;grid-row:10}
main.home-page>.honest-estimates{grid-column:2/4;grid-row:11}
main.home-page>footer{grid-column:1/-1;grid-row:12}
main.home-page>section.home-shell{width:auto;margin-inline:0}
main.home-page>style{display:none}
/* calculator */
#burn-studio .section-heading{margin-bottom:12px;color:#fff;align-items:end}
#burn-studio .section-heading .section-kicker{color:#fed7aa}
#burn-studio .section-heading h2{font-size:28px!important;margin-top:4px;color:#fff}
#burn-studio .section-heading>p{color:rgba(255,255,255,.9);font-size:15px;line-height:1.4}
.activity-picker{gap:8px!important;margin-bottom:12px!important}
.activity-choice{min-height:88px!important;height:88px!important;border-radius:16px!important;background:#fff!important;border:2px solid #fff!important;color:var(--cb-ink)!important;font-size:15px!important;font-weight:600!important;gap:6px!important;box-shadow:var(--cb-shadow)}
.activity-choice svg{width:22px!important;height:22px!important;color:#c2410c}
.activity-choice.is-selected,.activity-choice[aria-pressed=true]{background:#fff1e8!important;border-color:#c2410c!important;box-shadow:none!important;color:#9a3412!important}
.burn-workspace{border-radius:24px!important;border:0!important;box-shadow:0 10px 40px rgba(0,0,0,.18)!important;background:#fff!important}
.burn-form{padding:24px 24px!important;gap:14px!important}
.burn-form .form-heading h3{font-size:20px}
.field-block label{font-size:15px;font-weight:600;color:var(--cb-ink)}
.burn-select select,.cb-body select,article select{height:52px!important;border-radius:12px!important;border:1.5px solid #d6d3d1!important;font-size:17px!important;padding-left:14px!important;background:#fff!important;color:var(--cb-ink)}
.burn-select svg{right:14px!important;width:20px;height:20px}
.unit-switch{border-radius:999px!important;padding:3px!important;background:#f5f5f4!important}
.unit-switch button{height:36px!important;min-width:44px;border-radius:999px!important;font-size:15px!important;font-weight:600}
.unit-switch button[aria-pressed=true]{background:#c2410c!important;color:#fff!important}
.number-field input{height:56px!important;border-radius:12px!important;font-size:20px!important;font-weight:600!important;border:1.5px solid #d6d3d1!important;background:#fff!important}
.number-field>span{font-size:15px;color:var(--cb-muted)}
.time-shortcuts button{height:44px!important;border-radius:999px!important;font-size:15px!important;border:2px solid #e7e5e4!important;background:#fff!important}
.time-shortcuts button[aria-pressed=true]{background:#fff1e8!important;border-color:#c2410c!important;color:#9a3412!important}
.burn-form button[type=submit]{height:56px!important;border-radius:999px!important;background:#c2410c!important;color:#fff!important;font-size:17px!important;font-weight:700!important;width:100%}
.burn-form button[type=submit]:hover{background:#9a3412!important}
.form-note{font-size:14px!important;color:var(--cb-muted)!important}
.burn-result{background:#1f2a24!important;padding:24px!important;min-height:0!important}
.burn-number{font-size:72px!important;font-weight:700!important;margin-top:14px!important}
.burn-number>span{font-size:24px!important;color:#fed7aa!important}
.comparison-grid{gap:8px!important}
.comparison-grid>div{background:rgba(255,255,255,.1);border-radius:16px;padding:10px 12px}
.comparison-grid strong{font-size:20px!important;font-weight:700!important}
.comparison-grid div>span{font-size:14px!important}
.result-actions button{min-height:44px;min-width:44px;border-radius:999px!important}
.estimate-note{color:rgba(255,255,255,.88)!important;font-size:15px!important;margin-top:14px!important}
/* bands */
.burned-invitation{background:#fff!important;border-radius:16px!important;box-shadow:var(--cb-shadow);margin-top:32px;padding:40px!important}
.burned-invitation h2{color:var(--cb-ink)!important}
.burned-invitation h2>span{color:#c2410c!important}
.burned-invitation-copy>p,.pro-step div>p:last-child{color:var(--cb-muted)!important}
.burned-invitation .eyebrow{color:#9a3412!important}
.burned-invitation .life-link-primary{background:#fff!important;color:#c2410c!important;box-shadow:inset 0 0 0 2px #c2410c}
.burned-invitation .life-link-primary:hover{background:#fff1e8!important}
.pro-step>span{width:48px!important;height:48px!important;border-radius:999px!important;background:#fff1e8!important;color:#c2410c!important}
.movement-guides{padding-block:48px 24px!important}
.movement-guides .section-heading,.movement-guides .section-heading h2{color:#fff}
.movement-guides .section-kicker{color:#fed7aa}
.guide-grid{gap:16px!important}
.movement-guide{background:#fff;border:0!important;border-radius:16px;padding:28px!important;box-shadow:var(--cb-shadow);transition:transform .18s,box-shadow .18s;color:var(--cb-ink)}
.movement-guide:hover{transform:translateY(-2px);box-shadow:var(--cb-shadow-h)}
.movement-guide .guide-top>svg:first-child{box-sizing:content-box;padding:13px;background:#fff1e8;border-radius:999px;color:#c2410c;width:22px;height:22px}
.movement-guide h3{font-size:20px!important;font-weight:600!important;margin-top:18px!important}
.movement-guide p{font-size:16px!important}
.movement-guide>span{color:#c2410c!important;font-size:15px!important}
.honest-estimates{background:#fff;border-radius:16px;box-shadow:var(--cb-shadow);padding:40px!important;margin-bottom:48px;gap:40px!important}
.honest-estimates>div>p:not(.section-kicker){max-width:68ch;color:var(--cb-muted)!important}
.honest-estimates details{font-size:17px}
.honest-estimates summary{min-height:64px;display:flex;align-items:center;font-size:18px}
.honest-estimates details p{font-size:17px!important}
/* ---------- ARTICLE PAGES ---------- */
article>header{color:#fff}
article>header h1{color:#fff;font-weight:700!important}
article>header p,article>header .text-muted-foreground{color:rgba(255,255,255,.9)!important}
article>header strong,article>header .text-foreground{color:#fff!important}
article>header nav a{color:#fff;text-decoration:underline;text-underline-offset:3px}
article>header nav{color:rgba(255,255,255,.85)!important}
article>header>div.rounded-full{background:rgba(255,255,255,.15)!important;color:#fff!important}
article>header a{color:#fff}
article>header a.bg-primary{min-height:48px;padding-inline:24px}
article>header a:not(.bg-primary):not(nav a){text-decoration:underline}
article>section:not(.burn-studio),article>div{background:#fff;border-radius:16px;box-shadow:var(--cb-shadow);width:min(100% - 32px,1180px)!important;max-width:1180px!important;margin:0 auto 32px!important;border:0!important}
article>section:not(.burn-studio)>div{max-width:none!important}
article>section.burn-studio{margin-bottom:32px}
article>section.burn-studio>p,article>section.burn-studio .section-heading{color:#fff}
article .text-muted-foreground{color:var(--cb-muted)}
article>div .text-sm,article>section .text-sm{font-size:15px}
article>div p,article>div li{max-width:68ch}
article .rounded-2xl{border-radius:16px!important}
article .bg-card\/60{background:#fff!important}
/* dark side card */
article aside .bg-foreground,article .bg-result{border-radius:16px!important}
/* tables */
[data-slot=table-container]{position:relative}
article table{font-variant-numeric:tabular-nums;font-size:16px!important}
article table thead tr,article table thead th{background:#fff1e8!important}
article table th{font-size:14px!important;font-weight:700!important;text-transform:uppercase;letter-spacing:.04em;color:var(--cb-ink)!important;height:52px}
article table td{font-size:16px;height:52px;padding-top:10px!important;padding-bottom:10px!important}
article table td .text-xs,article table td small,article table td span.text-muted-foreground{font-size:14px!important}
article table tbody tr:nth-child(even) td{background:#fafaf9}
article table tbody tr:nth-child(odd) td{background:#fff}
article table caption{font-size:15px!important}
/* example callout */
article .bg-secondary:not(header .bg-secondary),article .bg-accent{background:#fff1e8!important;border-left:4px solid #c2410c!important;border-radius:12px;color:var(--cb-ink)}
/* FAQ */
details{border-color:#e7e5e4}
details>summary{min-height:64px;display:flex;align-items:center;font-size:18px;font-weight:600;cursor:pointer}
details>p,details>div{font-size:17px;max-width:68ch}
/* footer */
main>footer{background:#fff!important;border-top:0!important;font-size:15px;color:#44403c}
main>footer a{color:#44403c;display:inline-flex;align-items:center;min-height:44px}
main>footer a:hover{color:#c2410c!important;text-decoration:underline}
main>footer p,main>footer address{font-size:15px}
main>footer address p:nth-child(2){font-size:14px;color:var(--cb-muted)}
/* hover lift */
.burn-workspace,.movement-guide,.activity-choice,.life-link{transition:transform .18s,box-shadow .18s,background-color .18s}
.activity-choice:hover{transform:translateY(-2px)}
/* ---------- MOBILE ---------- */
@media (max-width:900px){
 main.home-page{grid-template-columns:16px minmax(0,1fr) 16px;grid-template-rows:none}
 main.home-page>*,main.home-page .hero-copy>*,main.home-page .life-hero>.movement-photo,main.home-page>#burn-studio{grid-column:2!important;grid-row:auto!important;margin-right:0!important}
 main.home-page>header,main.home-page>footer{grid-column:1/-1!important}
 main.home-page>header{order:0}
 main.home-page .hero-copy>.eyebrow{order:1;margin-top:20px}
 main.home-page .hero-copy>.hero-slogan{order:2;font-size:40px!important;margin-top:12px!important}
 main.home-page .hero-copy>h1.hero-h1{order:3;margin-top:8px!important;font-size:22px!important}
 main.home-page>#burn-studio{order:4;margin-top:14px}
 main.home-page .hero-copy>.hero-reassurance{order:5;margin-top:16px}
 main.home-page .hero-copy>.hero-actions{order:6;margin-top:4px}
 main.home-page .life-hero>.movement-photo{order:7;margin:16px 0 0!important;height:340px!important;min-height:0}
 main.home-page .hero-copy>.hero-intro{order:8}
 main.home-page>.burned-invitation{order:9}
 main.home-page>.movement-guides{order:10}
 main.home-page>.honest-estimates{order:11}
 main.home-page>footer{order:12}
 #burn-studio .section-heading{display:block;margin-bottom:10px}
 #burn-studio .section-heading>p{display:none}
 #burn-studio .section-heading h2{font-size:24px!important}
 .activity-picker{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
 .activity-choice{flex:0 0 76px;width:76px;height:76px!important;min-height:76px!important;scroll-snap-align:start}
 .burn-form{padding:20px 16px!important}
 .burn-number{font-size:56px!important}
 .burned-invitation,.honest-estimates{padding:28px 20px!important;grid-template-columns:1fr!important}
 .honest-estimates{gap:16px!important}
 .guide-grid{grid-template-columns:1fr!important}
 main>header:first-child nav{min-height:60px}
 main>header:first-child nav>a:first-child{padding:6px 0}
 article>section:not(.burn-studio),article>div{width:calc(100% - 24px)!important}
 article [data-slot=table-container]::after{content:"";position:sticky;right:0;top:0;display:block;float:right;width:24px;height:1px}
 article table th:first-child,article table td:first-child{position:sticky;left:0;z-index:2;box-shadow:2px 0 4px rgba(0,0,0,.06)}
 article table thead th:first-child{background:#fff1e8!important}
 main>footer a{min-height:44px}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}.movement-guide:hover,.activity-choice:hover,.life-link:hover,.life-link-primary:hover{transform:none!important}}
.personal-fields .field-label-row,.personal-fields .field-block>label{min-height:42px;display:flex;align-items:center;justify-content:space-between}
main.home-page .hero-copy>.hero-intro{max-width:none!important;width:auto}
.unit-switch button{height:44px!important;min-width:48px}
