/* Restore the website's mixed shapes and floating visual cards.
 * References: app hearth.css/auth polish and the existing website float/orbit styles.
 */
.hearth-app-shapes { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.hearth-app-shapes span { position:absolute; border-radius:28px; opacity:.22; }
.hearth-app-shapes .hearth-app-shape--circle { border-radius:50%; }
.hearth-app-shapes span:nth-child(1) { width:340px; height:340px; top:-90px; left:-90px; background:#FE5F55; animation:hearth-app-float-a 18s ease-in-out infinite; }
.hearth-app-shapes span:nth-child(2) { width:260px; height:260px; top:55%; right:-70px; background:#23CE6B; animation:hearth-app-float-b 22s ease-in-out infinite; }
.hearth-app-shapes span:nth-child(3) { width:190px; height:190px; bottom:-50px; left:18%; background:#FEE440; animation:hearth-app-float-c 20s ease-in-out infinite; }
.hearth-app-shapes span:nth-child(4) { width:210px; height:210px; top:28%; left:-65px; background:#4A8FE7; animation:hearth-app-float-a 25s ease-in-out infinite reverse; }
.hearth-app-shapes span:nth-child(5) { width:150px; height:150px; top:6%; right:10%; background:#7B4B94; animation:hearth-app-float-b 21s ease-in-out infinite reverse; }
.hearth-app-shapes span:nth-child(6) { width:170px; height:170px; bottom:8%; right:4%; background:#17BEBB; animation:hearth-app-float-c 24s ease-in-out infinite; }
@keyframes hearth-app-float-a { 0%,100%{transform:translate(0,0) rotate(0deg)} 33%{transform:translate(22px,32px) rotate(5deg)} 66%{transform:translate(-12px,18px) rotate(-4deg)} }
@keyframes hearth-app-float-b { 0%,100%{transform:translate(0,0) rotate(0deg)} 33%{transform:translate(-28px,-22px) rotate(-6deg)} 66%{transform:translate(14px,-28px) rotate(4deg)} }
@keyframes hearth-app-float-c { 0%,100%{transform:translate(0,0) rotate(0deg)} 33%{transform:translate(28px,-14px) rotate(8deg)} 66%{transform:translate(-18px,12px) rotate(-5deg)} }
/* Existing circles float too; the earlier base orbit class was static. */
.articles-orbits span, .page-float-shapes span { animation:hearthFloat 20s ease-in-out infinite alternate; }
.articles-orbits span:nth-child(2), .page-float-shapes span:nth-child(2) { animation-duration:24s; animation-delay:-6s; }
.articles-orbits span:nth-child(3), .page-float-shapes span:nth-child(3) { animation-duration:22s; animation-delay:-11s; }
/* Move visual cards independently. Keep reading columns and action rows still. */
.hearth-product-page .hearth-page-hero .hearth-ui-card {
  animation:hearth-card-drift 16s ease-in-out -4s infinite;
  animation-duration:16s !important;
}
.hearth-product-screenshot img { animation:hearth-card-drift 18s ease-in-out -3s infinite; }
.hearth-core-step:nth-child(even) .hearth-product-screenshot img { animation-duration:20s; animation-delay:-7s; }
.hearth-product-page .hearth-page-hero .hearth-ui-card:hover,
.hearth-product-page .hearth-page-hero .hearth-ui-card:focus-within,
.hearth-product-screenshot:hover img { animation-play-state:paused; }
@keyframes hearth-card-drift {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(var(--hearth-card-lift,-6px)); }
}
.wp-site-blocks { position:relative; }
.hearth-product-page { position:relative; background:transparent; }
.hearth-product-page .hearth-page-hero { background:transparent !important; }
.hearth-core-step > .wp-block-columns { gap:clamp(24px,4vw,64px); }
.hearth-core-step h2 { font-size:clamp(1.7rem,3vw,2.6rem); }
/* Bring related copy together without changing type size or reading line height. */
main { --hearth-section-space:clamp(28px,3.2vw,48px); --hearth-section-space-compact:clamp(18px,2vw,28px); }
.hearth-product-page .hearth-page-hero, .hearth-product-page .section--page-hero { padding-top:clamp(32px,4vw,56px) !important; }
.hearth-core-step > .wp-block-columns { align-items:flex-start; margin-bottom:0; }
.hearth-product-page .wp-block-column > :is(h1,h2,h3,p) { margin-bottom:0; }
.hearth-product-page .wp-block-column > p + :is(h1,h2,h3) { margin-top:8px; }
.hearth-product-page .wp-block-column > :is(h1,h2,h3) + p,
.hearth-product-page .wp-block-column > p + p,
.hearth-product-page .hearth-card > :is(h2,h3) + p,
.hearth-product-page .hearth-card > p + p,
.hearth-product-page .section--page-hero h1 + p { margin-top:12px; }
.hearth-product-page .wp-block-column > .wp-block-buttons { margin-top:18px; }
.hearth-product-page .hearth-page-hero .hearth-ui-card h2 { font-size:clamp(1.4rem,2vw,1.85rem); line-height:1.25; margin-top:12px; }
.hearth-product-page .hearth-page-hero .hearth-feature-list { margin-top:12px; }
.hearth-ui-window__chrome { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); }
.hearth-core-step .hearth-product-screenshot { max-width:520px; margin-inline:auto; }
.hearth-product-screenshot img { width:100%; height:auto; border-radius:20px; box-shadow:0 14px 40px #233d4d14; }
.hearth-product-screenshot figcaption { color:#475569; font-size:.875rem; margin-top:12px; }
.hearth-kicker--teal { color:#233D4D; }
/* Darker text tones retain the coloured decoration and improve readability. */
:root { --ink-4:#475569; --ink-5:#475569; }
.kicker, .kicker--teal, .cap-att, .ui-tag--teal { color:#233D4D; }
.kicker--green, .ui-mini__delta, .ui-tag--green, .gutter-mini__delta { color:#233D4D; }
.kicker--blue, .article-card__kicker a { color:#2F5D9F; }
.kicker--purple { color:#623778; }
.kicker--yellow { color:#233D4D; }
.compare__label { color:#475569; }
.ev-large { cursor:default; }
.hearth-header .hearth-logo--master { width:248px !important; }
.hearth-header .hearth-logo--master img { max-height:72px !important; }
.footer__brand-logo.hearth-logo--master img { width:260px; height:auto; max-width:100%; }
/* The original little profile/entry/report fragments, placed around the visuals.
 * Reserve their own space so examples never cover copy, screenshots or buttons. */
.hearth-example-stage { position:relative; padding:112px 12px 156px; max-width:520px; margin-inline:auto; }
.hearth-example-card.gutter-mini {
  position:relative; display:block; width:240px; max-width:100%; padding:16px 18px;
  pointer-events:auto; text-align:left; line-height:1.4;
}
.hearth-example-card {
  animation:hearth-example-drift 19s ease-in-out -5s infinite;
  --example-tilt:-3deg; --example-lift:-6px;
}
.hearth-example-card > p { margin:0; }
.hearth-example-card > p + p { margin-top:8px; }
.hearth-example-card .ui-tag { width:fit-content; font-size:11px; }
.hearth-example-card .gutter-mini__title { font-size:15px; line-height:1.3; }
.hearth-example-card .gutter-mini__meta { font-size:11px; line-height:1.5; }
.hearth-example-label { font-size:10px; font-weight:600; letter-spacing:.03em; color:#475569; margin:0 0 8px; }
.hearth-example-name { display:flex; align-items:center; gap:10px; font-size:18px; font-weight:700; color:var(--ink); }
.hearth-example-name::before { content:""; width:30px; height:30px; flex:none; border-radius:50%; background:#B7E8C7; border:6px solid #ECFAF9; }
.hearth-example-note { font-size:12px; color:#475569; line-height:1.5; }
.hearth-example-card--child { --example-tilt:3deg; animation-duration:23s; animation-delay:-9s; border-top:3px solid #17BEBB; }
.hearth-example-card--outdoors { --example-tilt:2deg; animation-duration:21s; animation-delay:-12s; border-top:3px solid #23CE6B; }
.hearth-example-card--report { --example-tilt:3deg; animation-duration:24s; animation-delay:-10s; border-top:3px solid #4A8FE7; }
.hearth-example-stage > .hearth-example-card { position:absolute; z-index:3; margin:0; }
.hearth-example-stage > .hearth-example-card:first-child { top:0; right:0; width:224px; }
.hearth-example-stage > .hearth-example-card:last-child { bottom:0; left:0; }
.hearth-example-stage > .hearth-ui-card { margin:0; }
.hearth-example-under { padding:16px 8px 8px; }
.hearth-example-under > .hearth-example-card { margin-left:auto; }
.hearth-example-pair { display:flex; flex-wrap:wrap; justify-content:space-between; gap:30px; max-width:620px; padding:28px 8px 8px; margin:16px auto 0; }
.hearth-example-pair > .hearth-example-card:last-child { margin-top:24px; }
/* Keep the existing home fragments visible at the widths that used to hide them. */
.hearth-home-example.gutter-mini { display:block !important; position:relative; inset:auto; margin:24px 12px 8px auto; max-width:calc(100% - 24px); pointer-events:auto; animation:hearth-example-drift 22s ease-in-out -8s infinite !important; --example-tilt:3deg; }
.hearth-home-example.track-side { display:inline-block !important; vertical-align:top; margin:24px 16px 8px; }
.hearth-home-example.track-side--l { --example-tilt:-3deg; animation-delay:-3s !important; }
.hearth-example-card:hover, .hearth-home-example:hover { animation-play-state:paused !important; }
.editor-styles-wrapper .hearth-example-card, .editor-styles-wrapper .hearth-home-example { animation:none !important; transform:none; }
@keyframes hearth-example-drift {
  0%,100% { transform:translateY(0) rotate(var(--example-tilt,-3deg)); }
  50% { transform:translateY(var(--example-lift,-5px)) rotate(var(--example-tilt,-3deg)); }
}
@media(max-width:980px) {
  .compare .compare-mini { display:block !important; position:relative; inset:auto; grid-column:1/-1; order:4; margin:24px auto 0; max-width:100%; }
}
@media(max-width:640px) {
  .hearth-header .hearth-logo--master { width:min(212px,calc(100vw - 156px)) !important; }
  .hearth-app-shapes span { opacity:.14; }
  .hearth-product-page { --hearth-card-lift:-3px; }
  .ev-large { max-width:100%; transform:none !important; }
  .hearth-example-card, .hearth-home-example { --example-lift:-3px; }
  .hearth-example-stage { padding-inline:8px; width:100%; }
  .hearth-example-pair { gap:20px; }
  .hearth-example-pair > .hearth-example-card:last-child { margin:0 0 0 auto; }
  .hearth-home-example.track-side { display:block !important; margin-inline:auto; }
}
@media(prefers-reduced-motion:reduce) {
  .hearth-app-shapes span, .articles-orbits span, .page-float-shapes span,
  .hearth-product-page .hearth-page-hero .hearth-ui-card, .hearth-product-screenshot img,
  .hearth-example-card, .hearth-home-example { animation:none !important; transform:none; }
}
@media print {
  .hearth-app-shapes { display:none; }
  .hearth-product-page .hearth-page-hero .hearth-ui-card, .hearth-product-screenshot img { animation:none !important; transform:none; }
  .hearth-example-card, .hearth-home-example { animation:none !important; transform:none; }
}