/* OD Miles: four photographic workday stories, one consistent promise. */
.home-page { background: #f7f4ec; }
.home-page::before { display: none; }
.home-page .announcement-bar { padding: 8px 16px; font-size: 12px; }
.home-page .announcement-dot { animation: none; }
.home-page .site-header { box-shadow: none; background: #f7f4ecf2; margin-bottom: 26px; }
.value-hero { --campaign-lime: #dcf799; position: relative; display: grid; grid-template-areas: "stage" "tabs"; }
.value-hero-copy { grid-area: stage; z-index: 2; align-self: center; width: 52%; max-width: 570px; padding: 32px 0 32px 45px; color: #fffdf4; pointer-events: none; }
.campaign-eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 23px; font: 500 9px/1.5 var(--mono); letter-spacing: .075em; }
.campaign-eyebrow > span { width: 6px; height: 6px; border-radius: 50%; background: var(--campaign-lime); flex-shrink: 0; }
.value-hero h1 { font: 500 clamp(54px, 5.7vw, 72px)/.99 var(--serif); letter-spacing: -.055em; margin: 0; }
.value-hero h1 em { color: var(--campaign-lime); font-style: normal; }
.campaign-lede { font-size: 15px; line-height: 1.7; color: #f5f4e9; margin: 24px 0; }
.campaign-download { display: inline-flex; align-items: center; justify-content: space-between; gap: 35px; padding: 16px 22px; background: var(--campaign-lime); color: #233d2b; border-radius: 6px; font-size: 13px; font-weight: 700; pointer-events: auto; transition: background .2s ease, transform .2s ease; }
.campaign-download:hover { background: #edffc1; transform: translateY(-2px); }
.campaign-download > span { font-size: 22px; line-height: 1; }
.campaign-trial { color: #e1e5d6; font-size: 10px; margin: 13px 0 0; }
.value-stage { grid-area: stage; min-width: 0; }
.value-panel { position: relative; height: 500px; overflow: hidden; background: #344335; border-radius: 14px 14px 0 0; }
.value-panel[hidden] { display: none; }
.value-panel + .value-panel { margin-top: 20px; }
.stories-ready .value-panel { margin: 0; }
.campaign-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.campaign-shade { position: absolute; inset: 0; background: linear-gradient(90deg, #0d211aeb 0%, #13271dd9 25%, #16291a75 48%, #17251b05 72%), linear-gradient(0deg, #12241790, transparent 38%); }
.campaign-counter { position: absolute; top: 28px; right: 30px; color: #fffdf4; text-shadow: 0 1px 7px #000; font: 500 9px var(--mono); letter-spacing: .055em; display: flex; align-items: center; gap: 20px; }
.campaign-counter b { padding: 7px 9px; border: 1px solid #ffffff60; border-radius: 4px; font-weight: 400; }
.campaign-proof { position: absolute; right: 32px; bottom: 40px; width: 275px; padding: 23px; background: #fffdf0f0; color: #233b2b; border-radius: 10px; box-shadow: 0 18px 40px -22px #0e211ba0; backdrop-filter: blur(12px); }
.proof-label { display: flex; gap: 7px; align-items: center; font: 500 8px/1.4 var(--mono); letter-spacing: .045em; color: #526044; }
.proof-label i { width: 5px; height: 5px; background: #588743; border-radius: 50%; }
.campaign-proof h2 { font: 500 57px/1.05 var(--serif); letter-spacing: -.045em; margin: 13px 0 11px; }
.campaign-proof h2 > span { font: 500 16px var(--sans); letter-spacing: -.02em; }
.campaign-proof h2 em { color: #678044; font-style: normal; }
.campaign-proof > p { font-size: 14px; margin: 0; line-height: 1.55; color: #526148; }
.campaign-proof > p strong { color: #233b2b; font-weight: 600; }
.proof-detail { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid #9aa68150; margin-top: 18px; padding-top: 13px; font-size: 9px; color: #617153; }
.proof-detail b { font-weight: 600; color: #3e6334; }
.campaign-example { position: absolute; bottom: 14px; right: 32px; max-width: 45%; color: #fffdf4; text-shadow: 0 1px 5px #000; margin: 0; font-size: 8px; text-align: right; }
.proof-sort { background: #f8e9d9f2; }
.proof-sort h2, .proof-export h2 { font-size: 43px; }
.proof-sort h2 em { color: #996849; }
.proof-trip { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11px; padding: 11px 0; border-top: 1px solid #9e8d7950; }
.proof-trip small { display: block; color: #786d5c; font-size: 9px; margin-top: 3px; }
.proof-trip b { font-size: 8px; background: #e4edcc; color: #416133; border-radius: 5px; padding: 5px 8px; font-weight: 600; }
.proof-trip.personal { padding-bottom: 0; }
.proof-trip.personal b { color: #766c5b; background: #e8ddcf; }
.proof-totals { background: #dcf799f2; }
.proof-bars { display: flex; align-items: end; gap: 7px; height: 49px; margin-top: 17px; }
.proof-bars i { flex: 1; background: #54723c; height: 50%; border-radius: 3px 3px 0 0; }
.proof-bars i:nth-child(2) { height: 65%; }.proof-bars i:nth-child(3) { height: 42%; }.proof-bars i:nth-child(4) { height: 80%; }.proof-bars i:nth-child(5) { height: 68%; }.proof-bars i:nth-child(6) { height: 100%; }.proof-bars i:nth-child(7) { height: 85%; }
.proof-export { background: #e9eff4f2; }
.proof-export h2 em { color: #627f90; }
.proof-document { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid #9aa8ae60; }
.proof-doc-icon { display: grid; place-items: center; border: 1px solid #77918e; border-radius: 3px; width: 27px; height: 33px; }
.proof-document strong { font-size: 10px; display: block; }
.proof-document small { display: block; font-size: 8px; color: #627574; margin-top: 4px; }
.proof-document b { margin-left: auto; font-size: 13px; font-weight: 500; }
.proof-filetypes { display: flex; justify-content: space-between; gap: 8px; font-size: 9px; color: #496674; }
.value-tabs { display: none; grid-area: tabs; }
.stories-ready .value-tabs { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); background: #fffdf5; border: 1px solid #d7dccd; border-top: 0; border-radius: 0 0 12px 12px; overflow: hidden; }
.value-tab { position: relative; display: flex; align-items: center; gap: 11px; min-height: 80px; padding: 18px 14px; text-align: left; border: 0; background: transparent; color: #233b2b; font-family: var(--sans); cursor: pointer; }
.value-tab + .value-tab { border-left: 1px solid #d7dccd; }
.value-tab-number { align-self: flex-start; font: 9px var(--mono); color: #879477; padding-top: 3px; }
.value-tab strong { display: block; font-size: 12px; font-weight: 600; }
.value-tab small { display: block; font-size: 9px; margin-top: 5px; color: #6a755f; }
.value-tab-arrow { margin-left: auto; font-size: 20px; opacity: 0; }
.value-tab[aria-selected="true"] { background: #e9efda; }
.value-tab[aria-selected="true"]::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: #52713a; }
.value-tab[aria-selected="true"] .value-tab-arrow { opacity: 1; }
.value-tab:hover { background: #edf2e4; }
.value-tab:focus-visible { outline: 3px solid #52713a; outline-offset: -5px; }
.value-panel:focus-visible, .home-page a:focus-visible { outline: 3px solid #698745; outline-offset: 4px; }
.campaign-trust { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 31px 0 39px; color: #536049; }
.campaign-trust > p { margin: 0; font-size: 12px; line-height: 1.7; }
.campaign-trust > p strong { font: 500 21px var(--serif); color: #2c402d; }
.campaign-trust > div { display: grid; gap: 5px; font-size: 10px; }
.campaign-trust > div span::before { content: "✓"; margin-right: 9px; color: #4c7138; }
.campaign-trust > a { display: flex; align-items: center; gap: 20px; padding: 12px 0; border-bottom: 1px solid #9fa991; font-size: 10px; font-weight: 600; }
.campaign-trust > a span { font-size: 20px; }
#how-it-works { scroll-margin-top: 100px; }
.home-page .included-card { box-shadow: none; }
.report-example-label { display: block; margin-top: 20px; padding: 15px; border-radius: 8px; background: var(--moss); color: var(--cream); font-size: 13px; text-align: center; }
.home-page footer { min-width: 0; }.home-page footer > * { min-width: 0; max-width: 100%; }.home-page footer div { flex-wrap: wrap; }
.home-page .final-cta-actions { min-width: 0; max-width: 100%; }.home-page .final-cta .button { white-space: normal; text-align: center; padding: 12px 20px; }
@media (max-width: 1100px) and (min-width: 921px) {
  .value-hero-copy { padding-left: 35px; }
  .value-hero h1 { font-size: 66px; }
  .campaign-proof { right: 25px; width: 250px; }
  .value-tab { gap: 8px; padding: 17px 10px; }
  .value-tab strong { font-size: 10px; }.value-tab small { font-size: 8px; }.value-tab-arrow { display: none; }
  .campaign-trust > a { display: none; }
}
@media (max-width: 920px) {
  .home-page .nav-toggle ~ .nav { visibility: hidden; }.home-page .nav-open .nav { visibility: visible; }
}
@media (max-width: 920px) {
  .home-page .site-header { margin-bottom: 18px; }
  .value-hero { --page-width: calc(100% - 24px); }
  .value-panel { height: 720px; border-radius: 12px 12px 0 0; }
  .campaign-photo { object-position: 65% center; }
  .campaign-shade { background: linear-gradient(180deg, #10251bec, #172a21aa 37%, #1a302328 68%, #16251c60), linear-gradient(90deg, #152a2380, transparent); }
  .value-hero-copy { align-self: start; width: 100%; max-width: none; padding: 29px 27px 0; }
  .campaign-eyebrow { font-size: 8px; letter-spacing: .045em; margin-bottom: 19px; }
  .value-hero h1 { font-size: clamp(52px, 10vw, 67px); line-height: .99; }
  .campaign-lede { font-size: 13px; margin: 20px 0; }
  .campaign-download { padding: 14px 18px; font-size: 12px; gap: 28px; }
  .campaign-trial { font-size: 9px; margin-top: 11px; }
  .campaign-counter { display: none; }
  .campaign-proof { right: 21px; bottom: 35px; width: 238px; padding: 18px; }
  .campaign-proof h2 { font-size: 47px; margin: 9px 0; }
  .campaign-proof h2 span { font-size: 14px; }
  .campaign-proof > p { font-size: 12px; }
  .proof-label { font-size: 7px; }
  .proof-detail { padding-top: 10px; margin-top: 13px; font-size: 8px; }
  .proof-sort h2, .proof-export h2 { font-size: 36px; }
  .campaign-example { max-width: calc(100% - 36px); right: 20px; bottom: 12px; font-size: 7px; }
  .stories-ready .value-tabs { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .value-tab { min-height: 79px; padding: 15px 11px; gap: 8px; }
  .value-tab:nth-child(3) { border-left: 0; }.value-tab:nth-child(n+3) { border-top: 1px solid #d7dccd; }
  .value-tab strong { font-size: 10px; line-height: 1.4; }.value-tab small { font-size: 8px; }.value-tab-number { font-size: 8px; }.value-tab-arrow { display: none; }
  .value-tab[aria-selected="true"]::before { width: 3px; height: auto; bottom: 0; }
  .campaign-trust { flex-wrap: wrap; gap: 20px 35px; padding-top: 25px; }.campaign-trust > a { display: none; }
  .campaign-trust > p strong { font-size: 20px; }.campaign-trust > p { font-size: 11px; }
}
@media (max-width: 360px) {
  .home-page .site-header { gap: 6px; }.home-page .site-header .brand { gap: 6px; font-size: 16px; }.home-page .site-header .brand span { display: inline; }.home-page .site-header .brand-icon { width: 26px; height: 26px; flex-shrink: 0; }.home-page .site-header .header-cta { font-size: 10px; padding: 0 9px; }.home-page .nav-toggle { width: 36px; height: 36px; }
  .home-page .announcement-bar { font-size: 10px; }
  .value-hero-copy { padding-left: 23px; padding-right: 23px; }
  .campaign-eyebrow { font-size: 7px; }.value-hero h1 { font-size: 51px; }
  .value-tab strong { font-size: 9px; }.value-tab small { font-size: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }.home-page *, .home-page *::before, .home-page *::after { animation: none !important; transition: none !important; }
}

.value-stage { touch-action: pan-y; }
.value-hero:not(.stories-ready) { grid-template-areas: "copy" "stage"; }
.value-hero:not(.stories-ready) .value-hero-copy { grid-area: copy; color: #233d2b; width: 100%; max-width: none; padding: 25px 0; }
.value-hero:not(.stories-ready) h1 em { color: #52713a; }
.value-hero:not(.stories-ready) .campaign-lede, .value-hero:not(.stories-ready) .campaign-trial { color: #536049; }

@media (min-width: 921px) { .proof-totals { top: 70px; bottom: auto; } }

/* Product facts immediately beneath the hero. */
.proof-businesses { background: #dcf799f2; }
.proof-businesses h2 { font-size: 40px; }
.proof-businesses h2 em { color: #56743d; }
.proof-business { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid #57703d40; font-size: 11px; }
.proof-business:last-child { padding-bottom: 0; }
.business-avatar { display: grid; place-items: center; width: 27px; height: 30px; border-radius: 5px; background: #54713d; color: #f8ffe8; font: 11px var(--mono); }
.business-avatar.consulting { background: #93703e; }
.proof-business > span > small { display: block; margin-top: 3px; font-size: 8px; color: #5b6e45; }
.proof-business > strong { margin-left: auto; font-size: 15px; font-weight: 600; }
.proof-business > strong > small { font-size: 8px; font-weight: 400; }
.campaign-reasons { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0; padding: 34px 0 38px; }
.campaign-reasons > article { min-width: 0; padding: 0 26px; border-left: 1px solid #d7dccd; }
.campaign-reasons > article:first-child { padding-left: 0; border-left: 0; }
.campaign-reasons > article:nth-child(3) { padding-right: 0; }
.reason-eyebrow { color: #6b795d; font: 500 8px/1.5 var(--mono); letter-spacing: .055em; margin: 0 0 12px; }
.campaign-reasons h2 { font: 500 26px/1.15 var(--serif); letter-spacing: -.03em; color: #2c402d; margin: 0 0 10px; }
.reason-price h2 { font: 500 42px/1.12 var(--serif); margin-top: -3px; }
.reason-price h2 span { font: 500 12px var(--sans); letter-spacing: 0; margin-left: 4px; }
.campaign-reasons article > p:not(.reason-eyebrow) { max-width: 310px; font-size: 11px; line-height: 1.65; color: #59664f; margin: 0; }
.campaign-reasons article > a { display: inline-flex; gap: 10px; align-items: center; font-size: 10px; font-weight: 600; color: #385330; border-bottom: 1px solid #a0ae90; padding: 8px 0 4px; }
.campaign-reasons article > a span { font-size: 16px; }
.reason-comparison-note { grid-column: 1 / -1; font-size: 9px; line-height: 1.6; color: #6a725f; margin: 22px 0 0; max-width: 910px; }
.reason-comparison-note a { text-decoration: underline; text-underline-offset: 2px; }
@media (min-width: 921px) { .proof-businesses { top: 70px; bottom: auto; } }
@media (max-width: 920px) {
  .proof-businesses h2 { font-size: 34px; }
  .campaign-reasons { grid-template-columns: 1fr; padding: 25px 0 30px; }
  .campaign-reasons > article, .campaign-reasons > article:first-child { padding: 20px 0; border-left: 0; border-bottom: 1px solid #d7dccd; }
  .campaign-reasons > article:first-child { padding-top: 0; }
  .campaign-reasons article > p:not(.reason-eyebrow) { max-width: 470px; }
  .reason-comparison-note { margin-top: 16px; }
}

/* A real app view paired with a concise, readable walkthrough. */
.app-walkthrough { padding: 64px 0 70px; border-top: 1px solid var(--line); }
.walkthrough-heading { max-width: 640px; margin-bottom: 40px; }
.walkthrough-heading h2,.home-answers h2 { font: 500 clamp(36px,4.2vw,54px)/1.08 var(--serif); letter-spacing: -.045em; margin: 12px 0 20px; color: var(--moss); }
.walkthrough-heading > p:last-child { max-width: 480px; color: #5a6658; font-size: 16px; }
.walkthrough-layout { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1fr); gap: 80px; align-items: start; }
.real-app { margin: 0; padding: 28px 28px 20px; border-radius: 24px; background: #e8eddf; }
.real-app img { display: block; width: 100%; border: 7px solid #223b2d; border-radius: 28px; box-shadow: 0 20px 45px -25px #19322660; }
.real-app figcaption { font-size: 11px; color: #52624c; line-height: 1.7; margin: 20px 0 0; }
.walkthrough-steps { display: grid; gap: 28px; }
.walkthrough-step { border-bottom: 1px solid var(--line); padding-bottom: 28px; min-width: 0; }
.walkthrough-step:last-child { border-bottom: 0; padding-bottom: 0; }
.step-number { font: 500 10px var(--mono); letter-spacing: .08em; color: #62714f; }
.walkthrough-step h3 { font: 500 27px/1.2 var(--serif); letter-spacing: -.025em; margin: 10px 0; color: #2e4a3a; }
.walkthrough-step > p { font-size: 14px; line-height: 1.75; color: #52624e; margin: 0 0 14px; }
.feature-tag { display: inline-block; background: #e3edce; padding: 6px 10px; border-radius: 5px; font-size: 11px; color: #38502d; }
.classify-demo,.business-example { padding: 16px; background: #fffdf8; border: 1px solid var(--line); border-radius: 12px; }
.classify-demo > div:first-child,.business-example > div { display: flex; justify-content: space-between; gap: 10px; align-items: center; font-size: 12px; }
.demo-choices { display: flex; gap: 10px; margin-top: 16px; }
.demo-choices button { flex: 1; border: 1px solid #91a591; color: #2e4a3a; padding: 12px 8px; background: #edf1e9; border-radius: 24px; font: 600 13px var(--sans); cursor: pointer; }
.demo-choices button:last-child { background: #edf5f8; color: #426486; border-color: #9cb4c4; }
.demo-choices button[aria-pressed="true"] { background: #2e4a3a; color: white; border-color: #2e4a3a; }
.demo-result { font-size: 11px; color: #5b6754; margin: 12px 0 0; min-height: 18px; }
.business-example > div { padding: 9px 0; }
.business-example span { display: flex; align-items: center; gap: 9px; }
.business-example i { width: 4px; height: 26px; border-radius: 5px; background: #b54c86; }
.business-example > div:nth-child(2) i { background: #60748c; }
.business-example small { display: block; color: #61705a; font-size: 10px; margin-top: 9px; }
.text-link { color: #385530; text-decoration: underline; text-underline-offset: 4px; font-size: 14px; font-weight: 600; }
.walkthrough-step > .sample-note { font-size: 11px; margin-top: 12px; }
.home-answers { display: grid; grid-template-columns: .8fr 1.2fr; gap: 70px; padding: 60px 0; border-top: 1px solid var(--line); }
.home-answers > div > p { color: #596750; font-size: 14px; }
.home-answers .faq-grid { display: block; }
.home-answers .faq-grid details { margin-bottom: 10px; padding: 20px; background: #fffdf7; border: 1px solid var(--line); border-radius: 10px; }
.home-answers .faq-grid summary { padding-right: 30px; font-size: 15px; }
.home-answers .faq-grid p { font-size: 14px; line-height: 1.75; margin: 16px 0 0; }
.builder-note { display: flex; align-items: center; gap: 18px; border-top: 1px solid var(--line); padding: 25px 0; }
.builder-note img { border-radius: 11px; flex-shrink: 0; }
.builder-note h2 { font: 600 15px var(--sans); margin: 0 0 6px; }
.builder-note p { font-size: 12px; color: #5c6854; margin: 0; }
.builder-note > a { margin-left: auto; white-space: nowrap; }
.desktop-qr { display: flex; align-items: center; gap: 16px; text-align: left; margin-bottom: 20px; }
.desktop-qr img { background: white; padding: 7px; border-radius: 10px; width: 112px; height: 112px; }
.desktop-qr p { font-size: 13px; line-height: 1.8; }
@media(max-width:920px) {
 .walkthrough-layout { gap: 35px; grid-template-columns: minmax(0,.85fr) minmax(0,1fr); }
 .real-app { padding: 15px; }.real-app img { border-width: 4px; border-radius: 20px; }
 .home-answers { gap: 30px; grid-template-columns: 1fr; }
 .desktop-qr { display: none; }
}
@media(max-width:640px) {
 .app-walkthrough { padding: 35px 0; }.walkthrough-heading { margin-bottom: 25px; }
 .walkthrough-layout { grid-template-columns: 1fr; gap: 30px; }
 .real-app { max-width: 350px; margin: 0 auto; padding: 20px; }
 .walkthrough-steps { gap: 24px; }.walkthrough-step h3 { font-size: 27px; }
 .home-answers { padding: 35px 0; }.home-answers h2 { margin-top: 10px; }
 .builder-note { flex-wrap: wrap; }.builder-note > div { flex: 1; min-width: 180px; }.builder-note > a { margin-left: 66px; }
 .home-answers .faq-grid details { padding: 17px; }
}

.app-gallery { min-width: 0; }
.app-screen-tabs { display: none; }
.app-gallery.gallery-ready .app-screen-tabs { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 4px; padding: 5px; border: 1px solid #cdd7c3; border-radius: 12px; margin-bottom: 15px; background: #e8eddf; }
.app-screen-tabs button { min-height: 44px; padding: 9px 4px; border: 0; border-radius: 7px; background: transparent; color: #40543b; font: 600 11px var(--sans); cursor: pointer; }
.app-screen-tabs button[aria-selected="true"] { background: #2e4a3a; color: #fffdf4; }
.app-gallery .real-app[hidden] { display: none; }
.app-gallery:not(.gallery-ready) .real-app + .real-app { margin-top: 24px; }
@media(max-width:640px) { .app-gallery { width: 100%; max-width: 350px; margin: 0 auto; } }

/* Price comparison is visible on the homepage, immediately after the hero. */
.home-price-compare { padding: 48px 0 30px; scroll-margin-top: 100px; }
.home-price-heading { display: flex; justify-content: space-between; align-items: end; gap: 35px; margin-bottom: 28px; }
.home-price-heading h2 { font: 500 clamp(32px,3.6vw,46px)/1.1 var(--serif); letter-spacing: -.04em; color: #2e4a3a; margin: 10px 0 0; }
.home-price-heading > p { max-width: 330px; font-size: 14px; line-height: 1.7; color: #56634e; margin: 0; }
.home-price-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; align-items: stretch; }
.home-price-card { position: relative; border: 1px solid #d6dccd; border-radius: 14px; padding: 48px 25px 25px; background: #fffdf7; min-width: 0; }
.home-price-card h3 { font: 600 21px var(--sans); margin: 0; color: #374531; }
.home-price-card h3 > span { display: block; font-size: 12px; font-weight: 400; margin-top: 5px; }
.home-price-card .price-number { font: 500 clamp(38px,4vw,54px)/1.2 var(--serif); letter-spacing: -.035em; margin: 24px 0 20px; white-space: nowrap; }
.price-number > span { font: 400 12px var(--sans); letter-spacing: 0; margin-left: 4px; }
.price-saving,.price-detail { font-size: 13px; line-height: 1.7; color: #56634e; margin: 0; }
.price-saving strong { color: #2e4a3a; }
.our-price { background: #2e4a3a; border-color: #2e4a3a; color: #fffdf4; }
.our-price h3 { color: #fffdf4; }.our-price .price-number { color: #d8f79c; }.our-price .price-detail { color: #e5ecd9; }
.price-highlight { position: absolute; top: 0; left: 24px; background: #d8f79c; color: #2e4a3a; padding: 7px 10px; font: 700 9px var(--mono); border-radius: 0 0 6px 6px; }
.our-price > a { display: flex; justify-content: space-between; gap: 15px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #6b8264; color: #d8f79c; font-size: 13px; font-weight: 600; }
.home-price-bottom { display: flex; justify-content: space-between; align-items: center; gap: 25px; padding: 20px 0 15px; }
.home-price-bottom p { font-size: 12px; line-height: 1.7; color: #52624b; margin: 0; }
.home-price-sources { font-size: 10px; line-height: 1.7; color: #626e58; margin: 0; max-width: 950px; }
.home-price-sources a { text-decoration: underline; text-underline-offset: 2px; }
.campaign-reasons.reasons-pair { grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
@media(max-width:640px) {
 .home-price-compare { padding-top: 32px; }.home-price-heading { display: block; }.home-price-heading > p { margin-top: 18px; }
 .home-price-grid { grid-template-columns: 1fr; gap: 10px; }
 .home-price-card { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 20px; }
 .home-price-card h3 { font-size: 19px; align-self: center; }.home-price-card .price-number { font-size: 36px; margin: 0; align-self: center; }
 .price-number > span { display: block; text-align: right; font-size: 11px; }
 .price-saving { grid-column: 1/-1; font-size: 12px; }.price-saving br { display: none; }
 .our-price { padding-top: 46px; }.our-price .price-number { font-size: 49px; }.our-price .price-detail,.our-price > a { grid-column: 1/-1; }.our-price > a { margin-top: 2px; }
 .home-price-bottom { align-items: start; flex-direction: column; gap: 12px; }
 .campaign-reasons.reasons-pair { grid-template-columns: 1fr; }
}
@media(min-width:641px) and (max-width:920px) { .home-price-card { padding-left: 18px; padding-right: 18px; }.price-number > span { display: block; margin-left: 0; margin-top: 5px; } }
