/* Formi additions. Tokens mirror the Framer site: Inter Display 500 headings (46/36/24px, 32/28/24 on phone),
   Inter 16px body, #282828 ink, rgb(77,77,77) muted, cream #f3efe9 ground, white cards with hairline border,
   orange #ff462e pills. Sections copy Framer's rhythm: 100px 40px padding, 42px gap, 1040px container. */
.fw-sec{display:flex;flex-direction:column;align-items:center;gap:56px;width:100%;padding:128px 40px;box-sizing:border-box;position:relative}
.fw,.fw-head,.fw-note,.fw-foot-meta{font-family:"Inter","Inter Placeholder",sans-serif;color:#282828;-webkit-font-smoothing:antialiased;box-sizing:border-box}
.fw *,.fw *::before,.fw *::after,.fw-head *{box-sizing:border-box}
.fw{width:100%;max-width:1040px;margin:0 auto;font-size:16px;line-height:1.5}
.fw p{margin:0}.fw a{color:inherit}
.fw-head{width:100%;max-width:720px;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
.fw-h2{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:46px;font-weight:500;letter-spacing:0;line-height:1.1;margin:0;text-wrap:balance;color:#282828}
.fw-sub{font-size:19px;font-weight:500;line-height:1.45;color:rgb(77,77,77);margin:0;max-width:620px}
.fw-h3{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:36px;font-weight:500;letter-spacing:0;line-height:1.15;margin:0 0 22px;text-wrap:balance}
.fw-h4{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:24px;font-weight:500;letter-spacing:0;line-height:1.2;margin:0}
.fw-p{font-size:17px;line-height:1.5;color:rgb(77,77,77);margin:0 0 6px}
.fw-small{font-size:14px;color:rgba(56,56,56,.6);line-height:1.5;margin-top:22px}
.fw-label{display:block;font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#ff462e;margin-bottom:7px}
.fw-link{display:inline-flex;align-items:center;gap:7px;font-size:15px;font-weight:500;color:#ff462e;text-decoration:none;white-space:nowrap}
.fw-link:hover{text-decoration:underline;text-underline-offset:3px}
.fw-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#ff462e;color:#fff;border:0;border-radius:999px;padding:15px 27px;font:inherit;font-size:15.5px;font-weight:500;letter-spacing:-.008em;text-decoration:none;cursor:pointer;white-space:nowrap;box-shadow:0 1px 32px rgba(0,0,0,.10);transition:transform .22s cubic-bezier(.2,.7,.3,1),box-shadow .22s,filter .22s}
.fw-btn:hover:not(:disabled){transform:translateY(-1.5px);filter:brightness(1.04);box-shadow:0 8px 24px rgba(255,70,46,.26)}
.fw-btn:disabled{opacity:.6;cursor:default}
.fw-card{background:#fff;border:1px solid rgba(40,40,40,.055);border-radius:32px;padding:clamp(36px,4.6vw,64px);box-shadow:0 1px 2px rgba(40,40,40,.03),0 30px 70px -40px rgba(40,40,40,.22)}
.fw-panel{background:#f3efe9;border-radius:18px;padding:22px 24px}
.fw-rows{list-style:none;margin:0;padding:0}
.fw-rows li{display:flex;gap:15px;align-items:flex-start;padding:19px 0;border-top:1px solid rgba(40,40,40,.09);font-size:16.5px;line-height:1.5;letter-spacing:-.005em;color:#3d3d3d}
.fw-rows li:first-child{border-top:0;padding-top:0}.fw-rows li:last-child{padding-bottom:0}
.fw-rows li svg{flex:none;margin-top:1px}

/* CTA note (capacity + guarantee) */
.fw-note{font-size:14px;line-height:1.5;color:rgb(77,77,77);margin:16px 0 0;max-width:520px}
.fw-note b{color:#282828;font-weight:600}
.fw-note--center{margin:0 auto;text-align:center;max-width:560px}
@keyframes fwPulse{0%{box-shadow:0 0 0 0 rgba(22,163,74,.5)}70%{box-shadow:0 0 0 7px rgba(22,163,74,0)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}}

/* Case card links on the sticky stack */
#projects-container>div{cursor:pointer}
.fw-card-link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-family:"Inter","Inter Placeholder",sans-serif;font-size:14px;font-weight:500;color:#ff462e;text-decoration:none}
.fw-card-link:hover{text-decoration:underline;text-underline-offset:3px}

/* Booking card: one centered calendar, nothing decorative */
.fw-book-card{max-width:560px;padding:28px 28px 22px}
.vc{--line:rgba(40,40,40,.08)}
.cal-head{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.cal-month{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:18px;font-weight:500;margin:0 auto;text-transform:capitalize}
.cal-nav{width:34px;height:34px;border-radius:10px;border:1px solid rgba(40,40,40,.1);background:#fff;color:#282828;display:grid;place-items:center;cursor:pointer;transition:background .16s}
.cal-nav:hover:not(:disabled){background:rgba(40,40,40,.045)}
.cal-nav:disabled{opacity:.3;cursor:default}
.cal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px}
.cal-dow span{text-align:center;font-size:12px;font-weight:500;color:rgb(77,77,77)}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-d{aspect-ratio:1/1;border:0;background:transparent;border-radius:12px;cursor:pointer;font:inherit;font-size:15px;font-variant-numeric:tabular-nums;color:#282828;display:grid;place-items:center;position:relative;padding:0;transition:background .15s,color .15s}
.cal-d.free{background:#f3efe9;font-weight:500}
.cal-d.free:hover{background:rgba(255,70,46,.14)}
.cal-d.off{color:rgba(40,40,40,.28);cursor:default}
.cal-d.blank{cursor:default}
.cal-d.sel{background:#ff462e;color:#fff;font-weight:500}
.slot-wrap{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.slot-day{font-size:14px;font-weight:500;color:#282828;margin:0 0 10px;text-transform:capitalize}
.slot-row{display:flex;gap:8px;flex-wrap:wrap}
.slot{flex:1 1 auto;min-width:90px;border:1px solid rgba(40,40,40,.12);background:#fff;border-radius:12px;padding:12px 8px;font:inherit;font-size:15.5px;font-weight:500;font-variant-numeric:tabular-nums;cursor:pointer;color:#282828;transition:border-color .15s,background .15s}
.slot:hover{border-color:#ff462e}
.slot.on{background:#ff462e;border-color:#ff462e;color:#fff}
.slot-empty{font-size:14.5px;color:rgb(77,77,77)}
.bk-form{margin-top:16px;border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:11px}
.bk-form[hidden],.bk-done[hidden],.slot-wrap[hidden],.fw-lead-done[hidden],.fw-vsl[hidden],.fw-lead-form[hidden]{display:none}
.bk-chosen{margin:0 0 2px;font-size:14.5px;font-weight:500}
.bk-chosen b{color:#ff462e}
.bk-form label,.fw-lead-form label{display:flex;flex-direction:column;gap:5px;font-size:13.5px;font-weight:500;color:rgb(77,77,77)}
.bk-form input,.fw-lead-form input{font:inherit;font-size:16px;color:#282828;padding:12px 14px;border:1px solid rgba(40,40,40,.12);border-radius:12px;background:#fff;transition:border-color .15s,box-shadow .15s;width:100%}
.bk-form input:focus,.fw-lead-form input:focus{outline:0;border-color:#ff462e;box-shadow:0 0 0 3px rgba(255,70,46,.13)}
.bk-form .fw-btn{margin-top:4px;width:100%}
.bk-back{background:none;border:0;color:rgb(77,77,77);font:inherit;font-size:13.5px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:2px}
.bk-err{font-size:13.8px;color:#b91c1c}
.bk-done{margin-top:14px;border-top:1px solid var(--line);padding-top:22px;text-align:center;padding-bottom:8px}
.bk-done b{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:20px;font-weight:500;margin-bottom:7px}
.bk-done p{margin:0 auto;font-size:14.8px;color:rgb(77,77,77);max-width:38ch;line-height:1.5}
.vc-foot{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;color:rgb(77,77,77);text-align:center}
.vc-foot a{color:#282828;font-weight:500;text-underline-offset:3px}

/* VSL slot (under the "Näin Formi toimii" headline) */
.fw-vsl{width:100%;max-width:1040px;margin:0 auto}
.fw-vsl-frame{position:relative;border-radius:28px;overflow:hidden;background:#17151f;aspect-ratio:16/9;box-shadow:0 14px 38px -14px rgba(40,40,40,.3)}
.fw-vsl-frame video,.fw-vsl-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;object-fit:cover}
.fw-vsl-play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.45));border:0;cursor:pointer;padding:0}
.fw-vsl-play span{width:84px;height:84px;border-radius:50%;background:#ff462e;display:grid;place-items:center;box-shadow:0 12px 30px -8px rgba(255,70,46,.7);transition:transform .18s}
.fw-vsl-play:hover span{transform:scale(1.06)}
.fw-vsl-play em{position:absolute;left:24px;bottom:22px;color:#fff;font-style:normal;font-size:15px;font-weight:500;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.fw-vsl-cap{margin-top:14px;color:rgb(77,77,77);font-size:14.5px;text-align:center}

/* Vaiku card */
.fw-vaiku-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-bottom:22px}
.fw-vaiku-logo{height:26px;width:auto;display:block}
.fw-vaiku-row .fw-p{margin:0;font-size:16px}
.fw-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fw-tile{background:#f3efe9;border-radius:18px;padding:22px 24px}
.fw-tile .n{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:38px;letter-spacing:-.015em;font-weight:500;line-height:1;margin-bottom:8px;font-variant-numeric:tabular-nums}
.fw-tile .l{display:block;font-size:15px;font-weight:500}
.fw-tile .s{display:block;font-size:13.5px;color:rgba(56,56,56,.62);margin-top:3px}

/* Lead card */
.fw-lead-card{max-width:720px}
.fw-lead-form{display:flex;flex-direction:column;gap:12px}
.fw-lead-form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fw-lead-form .fw-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fw-lead-form .fw-btn{width:100%}
.fw-lead-form small{font-size:13px;color:rgb(77,77,77);line-height:1.45;text-align:center}
.fw-lead-done{padding:10px 0;text-align:center}
.fw-lead-done b{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:22px;font-weight:500;margin-bottom:8px}
.fw-lead-done p{color:rgb(77,77,77);font-size:14.8px;max-width:38ch;margin:0 auto}

/* Header menu button: 34px in Framer, give it a 46px hit area without moving it */
.framer-1eugnr{position:relative}.framer-1eugnr::after{content:"";position:absolute;inset:-6px}
/* Cookie bar: slim on phones so it never covers a form */
@media (max-width:809.98px){
  .k-consent{left:8px!important;right:8px!important;bottom:8px!important}
  .k-consent-card{padding:10px 12px!important;font-size:12.5px!important;line-height:1.35!important;border-radius:12px!important}
  .k-consent-card p{margin:0 0 8px!important}
  .k-consent-actions{gap:8px!important}
  .k-consent-actions button{padding:8px 12px!important;font-size:13px!important;min-height:0!important}
}
/* Phones: four cards in the stack, newest first; the rest open with a button */
.fw-showmore{display:none}
@media (max-width:809.98px){
  #projects-container>.framer-14zbqne{order:1}#projects-container>.framer-fwdripnord{order:2}#projects-container>.framer-fwrealme{order:3}#projects-container>.framer-fwhans{order:4}
  #projects-container>.framer-zkscqg{order:5}#projects-container>.framer-zcpo0r{order:6}#projects-container>.framer-1brygg0{order:7}
  #projects-container:not(.fw-open)>.framer-zkscqg,#projects-container:not(.fw-open)>.framer-zcpo0r,#projects-container:not(.fw-open)>.framer-1brygg0{display:none}
  .fw-showmore{display:inline-flex;align-items:center;justify-content:center;margin:0 auto;background:#fff;border:1px solid rgba(40,40,40,.14);border-radius:999px;padding:13px 22px;font-family:"Inter","Inter Placeholder",sans-serif;font-size:15px;font-weight:500;color:#282828;cursor:pointer}
}

/* Footer links: Framer exported the "Links" container with pointer-events:none, so nothing in it was clickable */
.framer-mCTgM .framer-wc7s4c,.framer-mCTgM .framer-wc7s4c *{pointer-events:auto}

/* Page order (all breakpoints). Framer sections keep their classes; injected sections get a class each.
   Hero 1, Tulokset 2, Kokemuksia 3, Mitä saat + Varaa 4/5, Suomalaiset 6, Kumppani 7, Tiimi 8, Näin Formi 9,
   Mitä kuukausi 10, Aloitus 11, Raportti 12, Vaiku 13, Ideoita 14, Miksi valita 15, Analyysi 16, Brändinne+FAQ 17 */
/* Safety net: a stale cached index.html can carry a section this stylesheet no longer
   orders. Without a default it gets order:0 and lands above the hero on mobile. */
.framer-re0wR .fw-sec{order:12}
.fw-sec-bts,#kulissit,.fw-bts{display:none!important}
.framer-re0wR .framer-bum7he{order:1}
.framer-re0wR .framer-1oopm2z{order:2}
.framer-re0wR .framer-1e4tvrb{order:3}
.framer-re0wR .fw-sec-book{order:4}
.framer-re0wR #formi-meeting{order:5}
.framer-re0wR .framer-q44s54{order:6}
.framer-re0wR .framer-3td9b5{display:none!important}
.framer-re0wR .framer-igj10g{order:7}
.framer-re0wR .fw-sec-team{order:8}
/* Team section is OUT of the public site until Mr P supplies the five portraits: a heading and
   five silhouettes read as unfinished. Its CONTENT is hidden rather than the whole section,
   because the section also carries the scattered photo that sits beside "Kumppani, joka hoitaa
   koko somet" one block above (FLOATS team, top:-400px) and display:none on the section took
   that photo with it. Collapsed to zero height so it costs no vertical space. The markup still
   ships because removing it would break the timeline block's insert anchor, and the order rule
   above stays. To restore the team: delete the two rules below. */
.fw-sec-team{padding:0!important;min-height:0!important;gap:0!important}
.fw-sec-team > *:not(.fw-floats){display:none!important}
.framer-re0wR .framer-1i2tvwq{display:none!important}
.framer-re0wR .fw-sec-timeline{order:10}
.framer-re0wR .fw-sec-vaiku{order:11}
.framer-re0wR .framer-rcwf35{order:15}
.framer-re0wR .framer-1kjaetp{order:15}
.framer-re0wR .fw-sec-lead{order:16}
.framer-re0wR .framer-d20mik{order:17}
.framer-re0wR .fw-sec-vsl{order:9}
#formi-meeting{opacity:1!important;filter:none!important;transform:none!important}
/* Dead "Hinnasto" header item: the page has had no pricing section since pricing came off the
   site, and patch-js removed the link only ~428ms after load, so it flashed on every visit.
   CSS is in <head>, so this hides it from first paint. Deliberately NOT scoped to the nav:
   in the SSR markup this container sits BEFORE .framer-n4jg7p, so a descendant selector
   missed it for the first ~222ms. The class is unique to this one node. */
.framer-n8y73j-container{display:none!important}
/* Asiakascaset are off the live site for now, so the header item that points at them goes too.
   Scoped to the marker build.py sets on <html>, so restoring the cases restores the link. */
html[data-fw-cases="off"] .framer-1tnpgkc-container{display:none!important}
.framer-adzY1 .framer-1wyk278-container{display:none!important}
.framer-re0wR .framer-hqz76t{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Oversized wordmark behind the closing block */
.fw-sec-lead{position:relative;overflow:hidden}
.fw-sec-lead{padding-bottom:180px}
.fw-sec-lead::after{content:"FORMI";position:absolute;left:max(40px,calc(50% - 520px));bottom:-.2em;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:clamp(96px,13vw,200px);font-weight:500;letter-spacing:-.05em;line-height:1;color:rgba(40,40,40,.055);pointer-events:none;white-space:nowrap;z-index:0}
.fw-sec-lead>*{position:relative;z-index:1}

/* Footer meta */
.fw-foot-meta{font-size:13.5px;line-height:1.7;color:rgba(238,236,234,.72);margin:0}
.fw-foot-meta a{color:rgba(238,236,234,.95);text-decoration:underline;text-underline-offset:3px}
.fw-foot-meta span{white-space:nowrap}

/* Tablet */
@media (max-width:1199.98px) and (min-width:810px){
  .fw-h2{font-size:40px}
}
/* Phone: Framer orders top-level sections with `order` here (hero 1, results 3, ticker 4, services 5, closing 10).
   Injected sections must carry the order of the section they follow, or they jump above the hero. */
@media (max-width:809.98px){
  .fw-sec{padding:64px 20px;gap:34px}
  .fw-sec-lead{padding-bottom:120px}
  .fw-sec-lead::after{left:20px;font-size:clamp(72px,22vw,110px)}
  .fw-h2{font-size:32px}.fw-h3{font-size:28px}.fw-sub{font-size:16px}.fw-p{font-size:16px}
  .fw-card{padding:22px 18px;border-radius:24px}
  .fw-book-card{padding:20px 16px 16px}
  .fw-tiles{grid-template-columns:1fr;gap:10px}
  .fw-tile{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:baseline;padding:14px 18px}
  .fw-tile .n{font-size:26px;margin:0}.fw-tile .l{font-size:15px}.fw-tile .s{grid-column:2}
  .fw-vaiku-row{gap:14px;margin-bottom:16px}
  .fw-lead-form .row{grid-template-columns:1fr}
  .cal-grid,.cal-dow{gap:3px}.cal-d{border-radius:9px;font-size:15px}.cal-nav{width:40px;height:40px}.slot{min-width:0;flex:1 1 30%;padding:13px 8px}
  .fw-vsl-frame{border-radius:20px;aspect-ratio:4/5}.fw-vsl-play span{width:64px;height:64px}
  .fw-note{font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){.fw-btn{transition:none}}

/* ---------- 22.9 afternoon: scope, timeline, report, team, motion ---------- */
/* Scroll reveal (used by the new blocks; Framer's own sections keep their appear effects) */
[data-fw-reveal]{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.16,.7,.2,1),transform .9s cubic-bezier(.16,.7,.2,1)}
[data-fw-reveal].fw-in{opacity:1;transform:none}
[data-fw-reveal].fw-in.fw-settled{transition:none;transition-delay:0s}
.fw-head[data-fw-reveal]{transition-delay:.05s}
@media (prefers-reduced-motion:reduce){[data-fw-reveal]{opacity:1;transform:none;transition:none}}
html.lenis,html.lenis body{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}.lenis.lenis-stopped{overflow:hidden}

/* Services: one card, six groups */
.fw-kok{padding:clamp(30px,3.6vw,48px)}
.fw-kok-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(30px,3.6vw,48px) clamp(32px,4vw,56px)}
.fw-kok-g h3{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:19px;font-weight:500;letter-spacing:0;margin:0 0 6px;padding-bottom:16px;border-bottom:1px solid rgba(40,40,40,.1)}
.fw-kok-g ul{list-style:none;margin:0;padding:0}
.fw-kok-g li{padding:13px 0;font-size:16px;line-height:1.5;color:#3d3d3d;border-bottom:1px solid rgba(40,40,40,.055)}
.fw-kok-g li:last-child{border-bottom:0}
.fw-kok-g li svg{display:none}
.fw-scope-foot{margin:22px auto 0;max-width:760px;text-align:center;font-size:15px;line-height:1.55;color:rgb(77,77,77)}

/* Shoot photos scattered in the page margins (desktop only, never over the text column) */
.fw-floats{position:absolute;inset:0;pointer-events:none;z-index:0}
.fw-float{display:none;position:absolute;margin:0;width:min(212px,calc(50vw - 548px));border-radius:16px;overflow:hidden;background:#ece5da;box-shadow:0 1px 2px rgba(40,40,40,.05),0 26px 60px -34px rgba(40,40,40,.4);transform:rotate(var(--rot,0deg));will-change:transform}
.fw-float img{width:100%;height:100%;object-fit:cover;display:block}
.fw-float--l{right:calc(50% + 536px)}
.fw-float--r{left:calc(50% + 536px)}
@media (min-width:1340px){.fw-float{display:block}}
.fw-sec>.fw,.fw-sec>.fw-head,.fw-sec>section{position:relative;z-index:1}

/* Real shoot photo inside the positioning block's tile (Framer shipped only the logo mark there) */
.framer-igj10g .framer-1wg9x6a{background-image:url(/a/bts-baari.webp)!important;background-size:cover!important;background-position:50% 50%!important;background-repeat:no-repeat!important}
.framer-igj10g .framer-ezpbsg{display:none!important}

/* Process cards (/palvelut) */
.fw-proc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.fw-proc-card{background:#fff;border:1px solid rgba(40,40,40,.055);border-radius:28px;padding:clamp(28px,3.2vw,42px);box-shadow:0 1px 2px rgba(40,40,40,.03),0 24px 60px -40px rgba(40,40,40,.2)}
.fw-proc-n{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:14px;font-weight:500;color:#ff462e;letter-spacing:.04em;margin-bottom:16px;font-variant-numeric:tabular-nums}
.fw-proc-card h3{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:22px;font-weight:500;letter-spacing:0;line-height:1.2;margin:0 0 10px}
.fw-proc-card p{font-size:16px;line-height:1.55;color:rgb(77,77,77);margin:0}
@media (max-width:809.98px){.fw-proc-grid{grid-template-columns:1fr;gap:12px}.fw-proc-card{padding:22px 20px;border-radius:24px}}

/* Timeline with a scroll-filled track */
.fw-timeline{position:relative;max-width:820px;padding-left:44px}
.fw-tl-track{position:absolute;left:14px;top:12px;bottom:12px;width:2px;background:rgba(40,40,40,.1);border-radius:2px;overflow:hidden}
.fw-tl-fill{width:100%;height:0;background:#ff462e;transition:height .12s linear}
.fw-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:34px}
.fw-step{position:relative}
.fw-step-dot{position:absolute;left:-44px;top:6px;width:30px;height:30px;border-radius:50%;background:#f3efe9;border:2px solid rgba(40,40,40,.12);box-sizing:border-box;transition:background .3s,border-color .3s}
.fw-step-dot::after{content:"";position:absolute;inset:8px;border-radius:50%;background:rgba(40,40,40,.18);transition:background .3s}
.fw-step.fw-done .fw-step-dot{border-color:#ff462e}.fw-step.fw-done .fw-step-dot::after{background:#ff462e}
.fw-step-when{display:block;font-size:13px;font-weight:600;letter-spacing:.02em;color:#ff462e;margin-bottom:6px}
.fw-step .fw-h4{margin-bottom:8px}
.fw-step p{font-size:16px;line-height:1.55;color:rgb(77,77,77);max-width:60ch}

/* Report mock */
.fw-report-wrap{max-width:900px}
.fw-report{background:#fff;border:1px solid rgba(40,40,40,.07);border-radius:24px;padding:26px 28px 28px;box-shadow:0 1px 1px rgba(40,40,40,.03),0 24px 60px -26px rgba(40,40,40,.3)}
.fw-rep-head{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;padding-bottom:16px;border-bottom:1px solid rgba(40,40,40,.08);margin-bottom:18px}
.fw-rep-brand{width:26px;height:26px;border-radius:8px;background:#17151f;display:grid;place-items:center}
.fw-rep-tag{margin-left:auto;font-size:12px;font-weight:500;color:rgb(77,77,77);background:#f3efe9;border-radius:99px;padding:4px 10px}
.fw-rep-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:22px}
.fw-rep-stat{background:#f3efe9;border-radius:16px;padding:16px 16px 14px}
.fw-rep-stat .n{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:30px;letter-spacing:-.015em;font-weight:500;line-height:1;margin-bottom:6px;font-variant-numeric:tabular-nums;white-space:nowrap}
.fw-rep-stat .l{display:block;font-size:13.5px;font-weight:500}
.fw-rep-stat .s{display:block;font-size:12.5px;color:#1f7a3a;margin-top:3px}
.fw-rep-cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:26px}
.fw-rep-paid{list-style:none;margin:0;padding:0}
.fw-rep-paid li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:9px 0;border-top:1px solid rgba(40,40,40,.08);font-size:14.5px}
.fw-rep-paid li:first-child{border-top:0;padding-top:0}
.fw-rep-paid b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.fw-rep-paid em{grid-column:1/-1;font-style:normal;font-size:12.5px;color:rgb(77,77,77)}
.fw-rep-cols h4{font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:16px;font-weight:500;margin:0 0 10px}
.fw-rep-top{list-style:none;margin:0;padding:0;counter-reset:t}
.fw-rep-top li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid rgba(40,40,40,.08);font-size:14.5px}
.fw-rep-top li:first-child{border-top:0;padding-top:0}
.fw-rep-top li span::before{counter-increment:t;content:counter(t) ". ";color:rgb(77,77,77)}
.fw-rep-top b{font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}
.fw-rows--tight li{font-size:14.5px;padding:9px 0}

/* Team: cutouts in containers, alternate tilt, gentle parallax */
.fw-team{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:start}
.fw-member-inner{will-change:transform}
.fw-member-box{aspect-ratio:4/5;border-radius:22px;background:linear-gradient(180deg,#f7f3ec,#ece5da);border:1px solid rgba(40,40,40,.07);overflow:hidden;position:relative;display:flex;align-items:flex-end;justify-content:center;box-shadow:0 1px 1px rgba(40,40,40,.03),0 14px 38px -14px rgba(40,40,40,.14);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.fw-member--tilt .fw-member-box{transform:rotate(2deg)}
.fw-member:nth-child(even):not(.fw-member--tilt) .fw-member-box{transform:rotate(-1.5deg)}
.fw-member:hover .fw-member-box{transform:rotate(0) translateY(-4px)}
.fw-member-box img{width:92%;height:auto;display:block;object-fit:contain;object-position:bottom}
.fw-sil{width:60%;height:auto;fill:rgba(40,40,40,.12);margin-bottom:-4px}
.fw-member-text{padding:14px 4px 0}
.fw-member-text b{display:block;font-family:"Inter Display","Inter Display Placeholder",sans-serif;font-size:18px;font-weight:500}
.fw-member-text span{display:block;font-size:13.5px;color:rgb(77,77,77);margin-top:2px}

/* Accordion items added after Framer's FAQ list */
.fw-faq{display:block;background:#fff;border:1px solid rgba(40,40,40,.07);border-radius:16px;overflow:hidden;width:100%}
.fw-faq summary{list-style:none;cursor:pointer;padding:20px 22px;font-family:"Inter","Inter Placeholder",sans-serif;font-size:16px;font-weight:500;color:#282828;display:flex;align-items:center;gap:16px}
.fw-faq summary::-webkit-details-marker{display:none}
.fw-faq summary::after{content:"+";margin-left:auto;font-size:22px;line-height:1;color:#282828;transition:transform .2s}
.fw-faq[open] summary::after{content:"−"}
.fw-faq p{margin:0;padding:0 22px 20px;font-size:15px;line-height:1.55;color:rgb(77,77,77);max-width:66ch}

@media (max-width:1199.98px) and (min-width:810px){.fw-team{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:809.98px){
  .fw-kok-grid{grid-template-columns:1fr;gap:22px}
  .fw-kok{padding:22px 18px}
  .fw-kok-g li{font-size:15px;padding:9px 0}
  .fw-timeline{padding-left:38px}.fw-tl-track{left:12px}.fw-step-dot{left:-38px;width:26px;height:26px}.fw-step-dot::after{inset:7px}
  .fw-steps{gap:26px}
  .fw-rep-stats{grid-template-columns:1fr 1fr}.fw-rep-cols{grid-template-columns:1fr;gap:18px}.fw-report{padding:20px 18px}
  .fw-team{grid-template-columns:1fr 1fr;gap:12px}
  .fw-team .fw-member:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 6px);justify-self:center}
  .fw-member--tilt .fw-member-box,.fw-member:nth-child(even):not(.fw-member--tilt) .fw-member-box{transform:none}
  .fw-member-text b{font-size:16px}.fw-member-text p{font-size:13.5px}
}

/* FAQ block (framer-d20mik): Framer laid this out as heading-left / one long question stack
   right, so the left column inherited the stack's full height and left ~870px of dead space
   under the CTA. Heading now sits on top and the questions run as two stacks.
   Grid, not CSS multi-column: multi-column rebalances on every accordion toggle and was measured
   teleporting a card across the gutter (+541px) on 8 of 22 toggles. A grid row just grows.
   The first card is expanded by default, so it spans both columns; that removes the ~86px hole
   beside it and leaves exactly 10 cards, which pair into five clean rows with no orphan. */
@media (min-width:810px){
  .framer-d20mik .framer-1azli1u{flex-direction:column;gap:52px;align-items:flex-start}
  .framer-d20mik .framer-fdvvrs{flex:none;width:100%;gap:0}
  .framer-d20mik .framer-loxq5c{width:100%;max-width:760px}
  .framer-d20mik .framer-1y5yrha{width:100%;max-width:560px}
  .framer-d20mik .framer-12f1snb{flex:none;width:100%}
}
/* Two stacks only once a column is wide enough to hold a question on one line. At 810px the
   columns are 351px and 7 of 10 questions wrap to 2-3 lines, making the block taller and more
   ragged than a single stack. */
@media (min-width:1000px){
  .framer-d20mik .framer-12f1snb{display:grid;grid-template-columns:1fr 1fr;column-gap:42px;row-gap:16px;align-items:start}
  .framer-d20mik .framer-12f1snb > div:first-child{grid-column:1/-1}
}
