/* Calculator product and pricing pages. Shared header/footer remain untouched. */
.scp-page { background: #fcfbf7; color: #143f37; }
.scp-main { padding-block-start: 82px; --scp-line: #dcded4; --scp-gold: #e9d598; --scp-muted: #526963; }
.scp-main section { scroll-margin-block-start: 105px; }
.scp-main h1,.scp-main h2,.scp-main h3 { color: inherit; font-weight: 600; }
.scp-main h1 { font-size: clamp(2.2rem,4.4vw,3.8rem); line-height: 1.12; letter-spacing: -.045em; margin: 0; }
.scp-main h1 span { display: block; color: #e9d598; }
.scp-main h2 { font-size: clamp(1.8rem,2.7vw,2.6rem); line-height: 1.2; letter-spacing: -.035em; margin: 0 0 22px; }
.scp-main h3 { font-size: 1.25rem; line-height: 1.35; margin: 0 0 14px; }
.scp-main p { line-height: 1.75; color: var(--scp-muted); }
.scp-kicker { font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin-block-end: 24px; color: #866822!important; }
.scp-hero { padding: 45px 0 72px; background: #103e35; color: #fff; }
.scp-hero .scp-kicker { color: #e9d598!important; }
.scp-hero p { color: #d1e0d9; }
.scp-breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; font-size: .78rem; margin-block-end: 48px; }
.scp-breadcrumb a { color: inherit; text-underline-offset: 4px; }
.scp-hero-grid { display: grid; grid-template-columns: 1.08fr 1fr; align-items: center; gap: clamp(32px,5vw,80px); }
.scp-lead { font-size: 1.06rem; max-width: 630px; margin-block: 24px; }
.scp-visual { margin: 0; }
.scp-visual img { display: block; width: 100%; height: auto; }
/* One product story: established product-page hero, then the working demo. */
.scp-product-hero { padding-block: clamp(46px,5vw,78px) 32px; background: linear-gradient(118deg,#062f2c,#0a4940); }
.scp-product-hero .scp-product-identity { display: flex; align-items: center; gap: 12px; font-size: .66rem; letter-spacing: .11em; margin-block-end: 26px; }
.scp-product-identity > .material-symbols-outlined { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border: 1px solid #b8a66c80; border-radius: 10px; font-size: 23px; }
.scp-product-hero .scp-hero-grid { grid-template-columns: .88fr 1.12fr; gap: clamp(30px,3.5vw,56px); }
.scp-product-hero h1 { font-size: clamp(2.6rem,4.6vw,4.25rem); font-weight: 700; line-height: 1.1; }
.scp-product-hero .scp-visual { width: 100%; max-width: 590px; justify-self: end; }
.scp-product-hero .scp-actions .scp-button:not(.scp-button--gold) { background: #fff; color: #06483e; }
.scp-product-hero .scp-actions .scp-button:not(.scp-button--gold):hover { background: #eaf1ed; }
/* Actual product screens: one browser frame and one mobile frame, no stacked mats. */
.scp-product-preview { min-width: 0; margin: 0; }
.scp-device-composition { position: relative; padding: 12px 7% 10% 0; direction: ltr; }
.scp-browser-preview { overflow: hidden; border: 1px solid #c9ddd3; border-radius: 12px; background: #f5f8f6; box-shadow: 0 24px 55px #001f2260; }
.scp-browser-preview img { display: block; width: 100%; height: auto; }
.scp-browser-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; padding: 10px 13px; color: #46675e; font-size: .57rem; border-bottom: 1px solid #dae4df; background: #f1f5f2; }
.scp-browser-bar > .material-symbols-outlined { justify-self: end; font-size: 13px; }
.scp-window-dots { display: flex; gap: 4px; }
.scp-window-dots i { width: 5px; height: 5px; background: #92b4a4; border-radius: 50%; }
.scp-window-dots i:first-child { background: #d7b761; }
.scp-window-dots i:last-child { background: #c9d8cf; }
.scp-phone-preview { position: absolute; width: 23%; right: 0; bottom: 0; overflow: hidden; border: 5px solid #173d38; border-radius: 24px; background: #fff; box-shadow: 0 18px 35px #00292560,0 0 0 1px #83a89a; }
.scp-phone-preview img { display: block; width: 100%; height: auto; }
.scp-product-preview figcaption { padding-block-start: 20px; max-width: 85%; }
.scp-product-preview figcaption strong { display: block; font-size: .82rem; font-weight: 500; color: #edf3ed; }
.scp-product-preview figcaption > span { display: block; margin-top: 5px; color: #b1cbbf; font-size: .68rem; }
.scp-product-hero .scp-actions { gap: 12px 20px; }
.scp-product-hero .scp-lead { font-size: 1rem; line-height: 1.8; }
.scp-main .sc-demo { background: #f5f8f6; border-bottom: 1px solid var(--scp-line); padding-block: clamp(48px,6vw,88px); }
.scp-main .sc-demo > .container { width: min(100% - 48px,1420px); max-width: 1420px; padding-inline: 0; }
.scp-main .sc-demo .sc-section-heading { gap: 12px; margin-bottom: 36px; }
.scp-main .sc-demo .sc-section-heading h2 { margin-bottom: 0; }
.scp-main .sc-demo .sc-section-heading > p { max-width: 950px; font-size: 1rem; }
.scp-main .sc-panel-heading h3 { font-size: 1rem; margin: 0; }
.scp-main .sc-item__content h4 { margin: 0 0 3px; }
.scp-main .sc-result__size { direction: ltr; justify-content: flex-start; }
html[dir=rtl] .sc-stepper,html[dir=rtl] .sc-view-toolbar,html[dir=rtl] .sc-playback__buttons { direction: ltr; }
html[dir=rtl] .sc-stepper output { direction: rtl; }
html[dir=rtl] .sc-inventory { border-right: 0; border-left: 1px solid var(--sc-line); }
html[dir=rtl] .sc-result { border-left: 0; border-right: 1px solid var(--sc-line); }
html[dir=rtl] .sc-calculate > .material-symbols-outlined,html[dir=rtl] .sc-result__secondary > .material-symbols-outlined { transform: scaleX(-1); }
.scp-actions { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; margin-block-start: 28px; }
.scp-button { display: inline-flex; justify-content: center; align-items: center; gap: 12px; padding: 15px 23px; min-height: 50px; border: 1px solid #b9c9bf; border-radius: 8px; color: #143f37; font-size: .9rem; font-weight: 600; text-decoration: none; transition: background .18s,color .18s,border-color .18s; }
.scp-button:hover { background: #eaf1ed; color: #103e35; border-color: #4b7868; text-decoration: none; }
.scp-button--gold { background: #e9d598; border-color: #e9d598; color: #183c31; }
.scp-button--gold:hover { background: #f2e2b4; border-color: #f2e2b4; }
.scp-link { display: inline-flex; gap: 10px; align-items: center; min-height: 44px; max-width: 100%; color: #147262; font-size: .9rem; font-weight: 600; text-decoration: none; }
.scp-link > span:first-child { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: .3em; transition: text-decoration-color .18s; }
.scp-link .material-symbols-outlined,.scp-button .material-symbols-outlined { font-size: 20px; flex: 0 0 20px; transition: transform .18s; }
.scp-link:is(:hover,:focus-visible) { color: #103e35; text-decoration: none; }
.scp-link:is(:hover,:focus-visible) > span:first-child { text-decoration-color: currentColor; }
.scp-link:is(:hover,:focus-visible) .material-symbols-outlined { transform: translateX(3px); }
.scp-hero .scp-link,.scp-dark .scp-link { color: #f1dda7; }
.scp-main a:focus-visible,.scp-main summary:focus-visible,.scp-table-wrap:focus-visible { outline: 3px solid #a78231; outline-offset: 5px; border-radius: 4px; }
.scp-hero .scp-note { margin-top: 20px; font-size: .78rem; color: #bacfc6; }
.scp-signals { display: flex; flex-wrap: wrap; gap: 20px 32px; list-style: none; padding: 25px 0 0; margin: 34px 0 0; border-top: 1px solid #4c6b5e; color: #e0eae4; font-size: .83rem; }
.scp-signals li { display: flex; align-items: center; gap: 9px; }
.scp-signals .material-symbols-outlined { font-size: 18px; color: #e9d598; }
.scp-section { padding-block: clamp(64px,7vw,100px); }
.scp-section-head { max-width: 720px; margin-block-end: 44px; }
.scp-section-head p { font-size: 1.02rem; }
/* The customer journey is shown through genuine product details, not icon cards. */
.scp-product-story { background: #fffefa; border-bottom: 1px solid var(--scp-line); }
.scp-story-heading { display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: end; margin-bottom: 36px; }
.scp-story-heading h2 { max-width: 640px; margin: 0; }
.scp-story-heading > p { margin: 0; max-width: 420px; font-size: .97rem; }
.scp-story-heading .scp-kicker { margin-bottom: 16px; }
.scp-story-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; list-style: none; padding: 0; margin: 0; }
.scp-story-card { min-width: 0; border: 1px solid #d8e1d9; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: 0 7px 20px #163d3005; }
.scp-story-media { display: flex; align-items: center; justify-content: center; height: clamp(250px,26vw,335px); padding: 22px; background: #edf3ef; border-bottom: 1px solid #dce5de; }
.scp-story-media--arrangement { background: #e4eee7; }
.scp-capture { position: relative; overflow: hidden; aspect-ratio: var(--capture-ratio); height: 100%; max-width: 100%; border-radius: 8px; background: #f4f7f5; box-shadow: 0 8px 25px #1c4a3410; direction: ltr; }
.scp-story-media--arrangement .scp-capture { height: auto; width: 100%; box-shadow: none; }
.scp-capture img { position: absolute; display: block; width: var(--capture-width); max-width: none; height: auto; left: var(--capture-x); top: var(--capture-y); }
.scp-story-copy { padding: 25px 25px 29px; }
.scp-story-number { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 14px; color: #8b7233; font-size: .72rem; font-weight: 600; }
.scp-story-number::after { content: ''; width: 28px; height: 1px; background: #cdb77d; }
.scp-story-copy h3 { font-size: 1.15rem; letter-spacing: -.025em; }
.scp-story-copy p { font-size: .9rem; line-height: 1.75; margin: 0; }
.scp-main .scp-screen-note { margin: 18px 0 0; max-width: 940px; font-size: .74rem; color: #66776e; line-height: 1.6; }
.scp-guided { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(28px,4vw,56px); align-items: center; margin-block-start: 52px; padding-block-start: 52px; border-top: 1px solid #dce2d9; }
.scp-guided > div { min-width: 0; }
.scp-guided .scp-kicker { margin-bottom: 16px; }
.scp-guided h3 { font-size: clamp(1.55rem,2.5vw,2.15rem); line-height: 1.2; letter-spacing: -.035em; margin-bottom: 20px; }
.scp-guided p { font-size: .94rem; }
.scp-guided-points { list-style: none; padding: 0; margin: 24px 0 0; }
.scp-guided-points li { display: flex; align-items: start; gap: 10px; margin-top: 14px; font-size: .88rem; line-height: 1.6; }
.scp-guided-points .material-symbols-outlined { flex: 0 0 19px; font-size: 19px; line-height: 1.5; color: #69826f; }
.scp-guided figure { min-width: 0; margin: 0; }
.scp-guided img { display: block; width: 100%; height: auto; border: 1px solid #dce5de; border-radius: 14px; background: #f3f7f5; }
.scp-guided figcaption { margin-top: 12px; color: #64756b; font-size: .72rem; line-height: 1.5; }
.scp-product-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px; list-style: none; padding: 30px 0; margin: 40px 0 0; border-block: 1px solid #dce2d9; }
.scp-product-facts li { min-width: 0; }
.scp-product-facts li + li { border-inline-start: 1px solid #dce2d9; padding-inline-start: 26px; }
.scp-product-facts strong { display: block; margin-bottom: 9px; font-size: clamp(1.3rem,2.4vw,1.85rem); letter-spacing: -.035em; line-height: 1.2; font-weight: 600; }
.scp-product-facts span { display: block; font-weight: 600; font-size: .82rem; }
.scp-product-facts small { display: block; margin-top: 5px; color: #64756b; font-size: .75rem; }
.scp-features { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px 44px; }
.scp-feature { padding-block-start: 24px; border-top: 1px solid var(--scp-line); }
.scp-feature > .material-symbols-outlined { color: #8a7138; font-size: 28px; margin-bottom: 22px; }
.scp-feature p { margin-bottom: 0; font-size: .94rem; }
.scp-use-section { background: #f1f3ec; border-block: 1px solid var(--scp-line); }
.scp-use-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; background: #fcfbf7; border: 1px solid #d5d9cb; border-radius: 18px; overflow: hidden; }
.scp-use { padding: clamp(25px,3.4vw,44px); }
.scp-use:nth-child(odd) { border-inline-end: 1px solid #d5d9cb; }
.scp-use:nth-child(-n+2) { border-bottom: 1px solid #d5d9cb; }
.scp-use p:last-child { margin-bottom: 0; }
.scp-workflow { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 40px; padding: 0; list-style: none; margin: 36px 0 0; }
.scp-workflow li { border-top: 1px solid var(--scp-line); padding-top: 24px; }
.scp-step { color: #977838; display: block; font-size: .8rem; margin-bottom: 20px; }
.scp-demo-intro { max-width: 860px; }
.scp-dark { background: #103e35; color: #fff; }
.scp-dark p { color: #cfdfd6; }
.scp-deploy { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.scp-deploy article { border-top: 1px solid #648272; padding-block-start: 28px; }
.scp-boundary { padding: 22px 26px; border-inline-start: 3px solid #b2944f; background: #f0eee4; font-size: .85rem; margin: 0; }
.scp-faq-grid { display: grid; grid-template-columns: .8fr 1.3fr; gap: 80px; align-items: start; }
.scp-faq details { border-bottom: 1px solid var(--scp-line); padding-block: 22px; }
.scp-faq details:first-child { border-top: 1px solid var(--scp-line); }
.scp-faq summary { display: flex; gap: 20px; justify-content: space-between; align-items: center; list-style: none; font-weight: 600; line-height: 1.5; cursor: pointer; }
.scp-faq summary::-webkit-details-marker { display: none; }
.scp-faq-icon { position: relative; flex: 0 0 28px; width: 28px; height: 28px; border: 1px solid #abc0b3; border-radius: 50%; }
.scp-faq-icon::before,.scp-faq-icon::after { content: ''; position: absolute; inset: 50% auto auto 50%; width: 10px; height: 1px; background: #147262; transform: translate(-50%,-50%); }
.scp-faq-icon::after { transform: translate(-50%,-50%) rotate(90deg); }
.scp-faq details[open] .scp-faq-icon::after { display: none; }
.scp-faq details p { margin: 16px 38px 0 0; font-size: .94rem; }
.scp-final-grid { display: flex; justify-content: space-between; align-items: center; gap: 48px; }
.scp-final-grid > div { max-width: 700px; }
.scp-final-grid .scp-button { flex-shrink: 0; }
.scp-pricing-hero { background: #f2f1e8; padding-block-end: 118px; color: #143f37; }
.scp-pricing-hero h1 span { color: #667760; }
.scp-pricing-hero p { color: #526963; }
.scp-pricing-hero .scp-kicker { color: #866822!important; }
.scp-pricing-hero .scp-link { color: #147262; }
.scp-pricing-hero .scp-visual { max-width: 350px; justify-self: end; }
.scp-pricing-hero .scp-hero-grid { grid-template-columns: 1.5fr .6fr; }
.scp-plans-section { margin-top: -66px; position: relative; padding-bottom: 80px; }
.scp-plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; align-items: stretch; }
.scp-plan { display: grid; grid-template-rows: auto auto 1fr auto; padding: 34px; border: 1px solid #cbd6cb; border-radius: 18px; background: #fff; box-shadow: 0 16px 40px #173e3010; }
.scp-plan--premium { color: #fff; background: #143f32; border-color: #b49957; }
.scp-plan--enterprise { background: #eef1e9; }
.scp-plan-header { min-height: 190px; }
.scp-plan-header .scp-kicker { margin-bottom: 16px; font-size: .67rem; }
.scp-plan h2 { font-size: 1.85rem; margin: 0; letter-spacing: -.035em; }
.scp-plan-title { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-height: 42px; }
.scp-badge { border: 1px solid #a79158; border-radius: 5px; padding: 5px 8px; color: #e9d598; font-size: .65rem; }
.scp-plan-header > p:last-child { font-size: .93rem; margin: 18px 0 0; }
.scp-plan--premium p { color: #ceddd2; }
.scp-plan--premium .scp-kicker { color: #e9d598!important; }
.scp-price { padding: 24px 0; border-block: 1px solid #d9e0d5; min-height: 162px; }
.scp-plan--premium .scp-price { border-color: #486554; }
.scp-price-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; }
.scp-price-amount { display: inline-flex; align-items: baseline; gap: 4px; direction: ltr; }
.scp-price-line b { font-size: clamp(2.6rem,4vw,3.5rem); font-weight: 600; letter-spacing: -.055em; line-height: 1.1; }
.scp-price-line .scp-pound { font-size: 1.6rem; }
.scp-price-line span { font-size: .85rem; }
.scp-quote { font-size: clamp(1.65rem,2.4vw,2.15rem)!important; letter-spacing: -.04em!important; }
.scp-price p { font-size: .74rem; line-height: 1.45; margin: 14px 0 0; }
.scp-plan-body { padding-top: 26px; }
.scp-plan-body h3 { font-size: .83rem; }
.scp-plan-body ul { margin: 20px 0 30px; padding: 0; list-style: none; }
.scp-plan-body li { display: flex; align-items: start; gap: 10px; margin-bottom: 14px; font-size: .9rem; line-height: 1.55; }
.scp-plan-body li .material-symbols-outlined { flex: 0 0 19px; font-size: 19px; line-height: 1.3; color: #36765c; }
.scp-plan--premium li .material-symbols-outlined { color: #e9d598; }
.scp-plan .scp-button { width: 100%; }
.scp-plan-note { font-size: .81rem; margin: 25px 0 0; max-width: 1080px; }
.scp-table-wrap { overflow-x: auto; border: 1px solid var(--scp-line); border-radius: 14px; }
.scp-table { width: 100%; border-collapse: collapse; min-width: 640px; background: #fff; font-size: .9rem; }
.scp-table caption { caption-side: top; padding: 22px; font-weight: 600; color: #143f37; }
.scp-table th,.scp-table td { padding: 20px 24px; border-top: 1px solid var(--scp-line); text-align: start; }
.scp-table thead th { background: #edf2ea; }
.scp-table tbody th { font-weight: 500; width: 34%; }
.scp-table tr > :nth-child(3) { background: #f2f5ed; }
html[dir=rtl] .scp-main h1,html[dir=rtl] .scp-main h2,html[dir=rtl] .scp-main h3,html[dir=rtl] .scp-kicker { letter-spacing: normal; }
html[dir=rtl] .scp-faq details p { margin: 16px 0 0 38px; }
html[dir=rtl] .scp-link .material-symbols-outlined,html[dir=rtl] .scp-button .material-symbols-outlined { scale: -1 1; }
@media(max-width:1199px) { .scp-main { padding-top: 76px; } .scp-plan { padding: 25px; } .scp-plan-header { min-height: 210px; } .scp-plan-title { min-height: 74px; align-content: start; } }
@media(max-width:991px) { .scp-hero-grid,.scp-pricing-hero .scp-hero-grid { grid-template-columns: 1fr; } .scp-hero .scp-visual { max-width: 520px; justify-self: center; } .scp-pricing-hero .scp-visual { display: none; } .scp-features { grid-template-columns: 1fr 1fr; } .scp-plans { grid-template-columns: 1fr; max-width: 680px; margin-inline: auto; } .scp-plan-header,.scp-plan-title { min-height: 0; } .scp-price { min-height: 0; margin-top: 24px; } .scp-faq-grid { grid-template-columns: 1fr; gap: 22px; } .scp-final-grid { flex-direction: column; align-items: start; gap: 24px; } }
@media(max-width:575px) { .scp-main .container { padding-inline: 24px; } .scp-hero { padding-top: 26px; padding-bottom: 50px; } .scp-breadcrumb { margin-bottom: 30px; } .scp-pricing-hero { padding-bottom: 95px; } .scp-hero-grid { gap: 28px; } .scp-features,.scp-use-grid,.scp-workflow,.scp-deploy { grid-template-columns: 1fr; } .scp-use { border-inline: 0!important; border-bottom: 1px solid #d5d9cb; } .scp-use:last-child { border: 0; } .scp-deploy { gap: 30px; } .scp-signals { gap: 15px; } .scp-plan { padding: 26px; } .scp-faq details p { margin-inline: 0!important; } .scp-table th,.scp-table td { padding: 16px; } }
@media(prefers-reduced-motion:reduce) { .scp-main * { transition: none!important; scroll-behavior: auto!important; } }
@media(max-width:991px) {
  .scp-product-hero .scp-hero-grid { grid-template-columns: 1fr; }
  .scp-product-hero .scp-visual { justify-self: center; max-width: 460px; }
  .scp-product-preview { width: 100%; max-width: 680px; justify-self: center; }
  .scp-product-preview figcaption { max-width: 100%; }
  .scp-story-heading { grid-template-columns: 1fr; gap: 16px; }
  .scp-story-heading > p { max-width: 620px; }
  .scp-story-grid { gap: 15px; }
  .scp-story-copy { padding: 20px 18px; }
  .scp-story-media { height: 245px; padding: 16px; }
  .scp-guided { grid-template-columns: 1fr; gap: 24px; }
  html[dir=rtl] .sc-inventory,html[dir=rtl] .sc-result { border-inline: 0; }
}
@media(max-width:767px) {
  .scp-story-grid { grid-template-columns: 1fr; gap: 24px; }
  .scp-story-media { height: 310px; padding: 24px; }
  .scp-story-media--arrangement .scp-capture { width: auto; height: 100%; }
  .scp-story-copy { padding: 25px; }
  .scp-product-facts { grid-template-columns: 1fr; gap: 22px; padding-block: 26px; }
  .scp-product-facts li { display: grid; grid-template-columns: 130px 1fr; align-items: start; gap: 16px; }
  .scp-product-facts li + li { border-inline-start: 0; padding-inline-start: 0; }
  .scp-product-facts strong { font-size: 1.35rem; }
}
@media(max-width:575px) {
  .scp-main .sc-demo > .container { width: calc(100% - 28px); }
  .scp-product-hero h1 { font-size: clamp(2.15rem,9vw,3rem); }
  .scp-product-hero .scp-visual { max-width: 330px; }
  .scp-product-hero .scp-actions { gap: 12px; }
  .scp-product-hero .scp-button { width: 100%; }
  .scp-product-hero .scp-actions .scp-link { justify-content: center; width: 100%; }
  .scp-phone-preview { border-width: 3px; border-radius: 13px; }
  .scp-browser-preview { border-radius: 8px; }
  .scp-browser-bar { padding: 6px 8px; font-size: .48rem; }
  .scp-browser-bar > .material-symbols-outlined { font-size: 11px; }
  .scp-product-preview figcaption strong { font-size: .75rem; }
  .scp-product-preview figcaption > span { font-size: .65rem; }
  .scp-product-facts li { grid-template-columns: 105px 1fr; }
  .scp-main .sc-demo .sc-section-heading { padding-inline: 10px; }
}