/* Dedicated features, in the established Wesal homepage rhythm. */
.ft-page .container { width:min(1240px,calc(100% - 48px)); }
#wesal-features .ft-page :is(h1,h2,h3) { font-weight:700; letter-spacing:0; line-height:1.5; margin-top:0; }
#wesal-features .ft-page h1 { font-size:clamp(2rem,3.6vw,3.5rem); margin:0; }
#wesal-features .ft-page h2 { font-size:clamp(1.875rem,3vw,2.625rem); margin-bottom:0; }
.ft-hero { padding:148px 0 52px; background:#e9eed4; }
.ft-hero-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:64px; align-items:center; }
.ft-hero h1 em { font-style:normal; color:#009e68; }
.ft-kicker { display:flex; align-items:center; gap:10px; font-size:.875rem; font-weight:500; margin:0 0 16px; }
.ft-kicker::before { content:""; width:24px; height:2px; background:currentColor; }
.ft-lead,.ft-description { font-size:1.0625rem; line-height:1.95; color:#365b4e; margin:0 0 18px; }
.ft-description { margin:22px 0; }
.ft-section { padding:60px 0; background:#fff; scroll-margin-top:110px; }
.ft-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:70px; align-items:center; }
.ft-points { display:flex; flex-wrap:wrap; gap:10px 18px; list-style:none; padding:18px 0 0; margin:0; border-top:1px solid rgba(0,63,53,.16); font-size:.9375rem; color:#365b4e; }
.ft-example { padding:28px 32px; border:1px solid rgba(0,63,53,.16); border-radius:28px 28px 6px 28px; background:#f5f7ec; }
.ft-example-label { display:block; font-size:.875rem; color:#516c61; margin-bottom:18px; }
.ft-example h3 { font-size:1.25rem; margin-bottom:14px; }
.ft-example p { font-size:1rem; line-height:1.9; margin:0; color:#516c61; }
.ft-dark { background:#003f35; color:#fff; }
.ft-dark h2 { color:#c4e970; }
.ft-dark .ft-description,.ft-dark .ft-kicker { color:#e9eed4; }
.ft-dark .ft-points { color:#c3d8ce; border-color:rgba(137,227,180,.3); }
.ft-dark .ft-example { background:rgba(137,227,180,.08); border-color:rgba(137,227,180,.3); }
.ft-dark .ft-example h3 { color:#fff; }
.ft-dark .ft-example p,.ft-dark .ft-example-label { color:#c3d8ce; }
.ft-soft { background:#f5f7ec; }
.ft-soft .ft-example { background:#fff; }
.ft-links { padding:0 0 60px; background:#fff; }
.ft-links>.container { display:flex; flex-wrap:wrap; gap:18px 32px; border-top:1px solid rgba(0,63,53,.16); padding-top:26px; }
.ft-links a { display:inline-flex; align-items:center; min-height:44px; border-bottom:1px solid rgba(0,63,53,.35); font-size:.9375rem; font-weight:500; }
.ft-links a:hover { color:#009e68; }
.ft-page a:focus-visible { outline:3px solid #009e68; outline-offset:5px; }
@media(max-width:980px) { .ft-hero-grid,.ft-grid { gap:36px; } }
@media(max-width:700px) {
 .ft-page .container { width:calc(100% - 32px); }
 .ft-hero { padding:126px 0 40px; }
 .ft-hero-grid,.ft-grid { grid-template-columns:minmax(0,1fr); gap:26px; }
 .ft-lead,.ft-description { font-size:1rem; }
 .ft-section { padding-block:44px; }
 .ft-example { padding:24px; }
 .ft-links { padding-bottom:44px; }
}

/* The features become a sequence of product scenes, within the approved identity. */
.ft-page { --ft-ink:#003f35; --ft-mint:#89e3b4; --ft-lime:#c4e970; --ft-line:rgba(0,63,53,.16); }
.ft-page button { font:inherit; cursor:pointer; }
.ft-page :is(button,a):focus-visible { outline:3px solid #009e68; outline-offset:4px; }
.ft-hero { padding-bottom:76px; }
.ft-hero-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:72px; }
#wesal-features .ft-page h1 { font-size:clamp(2.25rem,3.8vw,3.75rem); line-height:1.48; }
.ft-hero h1 em { background:#c4e970; color:#003f35; padding-inline:.1em; box-decoration-break:clone; -webkit-box-decoration-break:clone; border-radius:.3em .3em .06em .3em; }
.ft-hero .ft-lead:first-child { margin-top:24px; }
.ft-hero .ft-lead:last-child { margin-bottom:0; font-size:1rem; }
.ft-overview { background:#fff; border:1px solid var(--ft-line); border-radius:32px 32px 7px 32px; padding:25px 28px; box-shadow:12px 14px 0 rgba(0,63,53,.07); }
.ft-overview-top { display:flex; justify-content:space-between; gap:16px; align-items:center; padding-bottom:20px; margin-bottom:3px; border-bottom:1px solid var(--ft-line); }
.ft-overview-top img { width:112px; height:auto; }
.ft-overview-top>span { font-size:.875rem; color:#516c61; }
.ft-overview-row { position:relative; display:grid; grid-template-columns:38px 1fr auto; gap:15px; align-items:center; min-height:85px; padding-block:13px; }
.ft-overview-row:not(:last-child)::after { content:""; position:absolute; height:28px; width:1px; background:#89e3b4; inset-inline-start:19px; bottom:-14px; }
.ft-node { display:grid; place-items:center; width:38px; height:38px; background:#e9eed4; border-radius:12px 12px 3px 12px; font-size:.875rem; transition:background .25s,transform .25s; }
.ft-overview-row:nth-child(3) .ft-node { background:#89e3b4; }
.ft-overview-row:last-child .ft-node { background:#c4e970; }
.ft-overview-row>div { display:grid; gap:6px; }
.ft-overview-row strong { font-size:1.125rem; font-weight:700; }
.ft-overview-row>div>span { font-size:.875rem; line-height:1.65; color:#516c61; }
.ft-route-label { font-size:.875rem; color:#009e68; }
.ft-overview-row:hover .ft-node { background:#c4e970; transform:translateY(-2px); }
.ft-section { padding-block:88px; }
.ft-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:84px; }
.ft-section:nth-of-type(odd) .ft-grid>div { order:2; }
.ft-section:nth-of-type(odd) .ft-grid>aside { order:1; }
.ft-points { padding-top:20px; gap:8px 10px; border:0; }
.ft-points li { padding:8px 14px; background:#e9eed4; border-radius:12px 12px 3px 12px; }
.ft-dark .ft-points li { background:rgba(137,227,180,.12); }
.ft-visual { border:0; padding:0; background:transparent!important; border-radius:0; min-width:0; }
#wesal-features .ft-visual-title { font-size:1rem; margin:0 0 16px; font-weight:500; color:#516c61; }
.ft-dark .ft-visual-title { color:#c3d8ce!important; }
.ft-visual .ft-visual-caption { font-size:.875rem; line-height:1.85; margin-top:16px; }
.ft-demo { color:#003f35; background:#fff; border:1px solid var(--ft-line); border-radius:26px 26px 6px 26px; overflow:hidden; box-shadow:0 18px 45px rgba(0,63,53,.07); }
.ft-dark .ft-demo { border-color:rgba(137,227,180,.3); box-shadow:0 20px 50px rgba(0,0,0,.12); }
.ft-demo-top { min-height:58px; padding:17px 22px; display:flex; justify-content:space-between; align-items:center; gap:12px; background:#e9eed4; border-bottom:1px solid var(--ft-line); font-size:.9375rem; font-weight:500; }
.ft-demo-note { font-size:.875rem; color:#516c61; font-weight:400; }
.ft-demo .ft-message { padding:16px 18px; background:#e9eed4; border-radius:18px 4px 18px 18px; font-size:1rem; line-height:1.9; max-width:92%; }
.ft-demo .ft-message-donor { background:#c4e970; border-radius:4px 18px 18px 18px; margin-inline-start:auto; }
.ft-message+.ft-message { margin-top:14px; }
.ft-demo .ft-scene-label { display:block; font-size:.875rem; font-weight:500; color:#516c61; margin-bottom:16px; }
.ft-step-options { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); padding:22px 18px 4px; gap:6px; }
.ft-step-options button { padding:9px 3px; display:grid; justify-items:center; gap:10px; background:transparent; border:0; color:#516c61; font-size:.875rem; border-radius:12px; }
.ft-step-options b { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--ft-line); border-radius:50%; font-weight:500; transition:background .25s,color .25s; }
.ft-step-options button[aria-pressed="true"] { color:#003f35; }
.ft-step-options button[aria-pressed="true"] b { background:#003f35; color:#c4e970; border-color:#003f35; }
.ft-step-options button.is-complete b { background:#89e3b4; color:#003f35; border-color:#89e3b4; }
.ft-scene { min-height:295px; padding:22px; }
.ft-result { display:flex; align-items:center; gap:14px; padding-top:22px; margin-top:22px; border-top:1px solid var(--ft-line); }
.ft-result-icon { display:grid; place-items:center; flex:0 0 34px; height:34px; background:#89e3b4; color:#003f35; border-radius:10px; }
.ft-result>div { display:grid; gap:7px; }
.ft-result strong { font-weight:500; font-size:1rem; }
.ft-result>div>span { color:#516c61; font-size:.875rem; line-height:1.7; }
.ft-demo-bottom { display:flex; justify-content:space-between; align-items:center; padding:16px 22px; background:#f5f7ec; border-top:1px solid var(--ft-line); font-size:.875rem; }
.ft-play { min-height:44px; padding:10px 17px; border:1px solid #003f35; background:#003f35; color:#fff; border-radius:12px 12px 3px 12px; }
.ft-play:hover { background:#009e68; border-color:#009e68; }
.ft-channel-options,.ft-slots { display:flex; gap:8px; padding:22px 22px 0; }
.ft-channel-options button,.ft-slots button,.ft-ticket-options button { flex:1; min-height:46px; background:#fff; border:1px solid var(--ft-line); color:#516c61; border-radius:12px 12px 3px 12px; padding:10px 8px; font-size:.875rem; transition:background .25s; }
.ft-demo button[aria-pressed="true"]:not(.ft-play):not([data-step]) { color:#003f35; background:#c4e970; border-color:#c4e970; }
.ft-inbox-body { padding:22px; }
.ft-contact-line { display:flex; gap:12px; align-items:center; margin-bottom:25px; }
.ft-avatar { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:50%; background:#89e3b4; font-size:1rem; }
.ft-contact-line>div,.ft-profile>div { display:grid; gap:7px; }
.ft-contact-line strong,.ft-profile strong { font-size:1rem; font-weight:500; }
.ft-contact-line>div>span,.ft-profile>div>span { font-size:.875rem; color:#516c61; line-height:1.6; }
.ft-tag { display:inline-flex; align-items:center; padding:6px 10px; border-radius:8px; background:#e9eed4; color:#003f35; font-size:.875rem; line-height:1.6; }
.ft-contact-line>.ft-tag { margin-inline-start:auto; }
.ft-context { display:flex; gap:12px; justify-content:space-between; align-items:center; padding-top:20px; margin-top:22px; border-top:1px solid var(--ft-line); font-size:.875rem; line-height:1.7; }
.ft-context>span { color:#516c61; }
.ft-context strong { font-weight:500; }
.ft-knowledge-sources { display:flex; flex-wrap:wrap; gap:10px; padding:24px 22px; border-bottom:1px solid var(--ft-line); }
.ft-knowledge-sources span { flex:1; padding:18px 8px; text-align:center; background:#e9eed4; border-radius:12px 12px 3px 12px; font-size:.9375rem; }
.ft-knowledge-sources span:nth-child(2) { background:#89e3b4; }
.ft-knowledge-sources span:nth-child(3) { background:#c4e970; }
.ft-query-options { display:grid; gap:8px; padding:22px; }
.ft-query-options button { text-align:start; background:transparent; border:1px solid var(--ft-line); padding:14px 16px; border-radius:12px; color:#003f35; font-size:1rem; }
.ft-knowledge-answer { padding:0 22px 24px; min-height:175px; }
.ft-demo p { color:#365b4e!important; font-size:1rem; line-height:1.85; }
.ft-source-label { display:inline-block; color:#516c61; font-size:.875rem; padding-top:16px; }
.ft-crm { padding-bottom:22px; }
.ft-profile { display:flex; align-items:center; gap:16px; padding:26px 22px 18px; }
.ft-avatar-large { flex-basis:52px; width:52px; height:52px; background:#c4e970; }
.ft-profile-tags { display:flex; flex-wrap:wrap; gap:8px; padding-inline:22px; }
.ft-profile-tags span { font-size:.875rem; background:#e9eed4; border-radius:8px; padding:8px 12px; }
.ft-timeline { list-style:none; margin:24px 22px 0; padding:0; }
.ft-timeline li { position:relative; display:grid; gap:9px; padding:0 28px 24px 0; font-size:.9375rem; }
.ft-timeline li::before { content:""; position:absolute; inset-inline-start:4px; top:6px; width:9px; height:9px; border:2px solid #009e68; border-radius:50%; background:#fff; }
.ft-timeline li:not(:last-child)::after { content:""; position:absolute; inset-inline-start:9px; top:20px; bottom:0; width:1px; background:#89e3b4; }
.ft-timeline li>span { color:#516c61; font-size:.875rem; }
.ft-timeline strong { font-weight:500; }
.ft-crm>.ft-context { margin:0 22px; }
.ft-calendar-heading { display:flex; align-items:center; gap:15px; padding:25px 22px 0; }
.ft-calendar-icon { display:grid; place-items:center; flex:0 0 46px; height:46px; background:#89e3b4; border-radius:12px; }
.ft-calendar-icon svg,.ft-link-mark svg { width:25px; height:25px; }
.ft-calendar-heading>div { display:grid; gap:8px; }
.ft-calendar-heading strong { font-size:1rem; font-weight:500; }
.ft-calendar-heading>div>span { font-size:.875rem; color:#516c61; }
.ft-slots { direction:ltr; }
.ft-booking-confirmation { background:#e9eed4; border-radius:16px 16px 4px 16px; margin:22px; padding:20px; }
.ft-booking-confirmation>strong { display:block; font-size:1.125rem; font-weight:500; margin-bottom:12px; }
.ft-booking-confirmation b { font-weight:500; display:inline-block; padding-inline:6px; }
.ft-calendar>.ft-context { margin:0 22px; padding-bottom:22px; }
.ft-ledger-head { display:flex; align-items:center; justify-content:center; gap:20px; padding:28px 22px; font-size:1rem; }
.ft-ledger-head>span:not(.ft-link-mark) { flex:1; text-align:center; }
.ft-link-mark { display:grid; place-items:center; width:44px; height:44px; background:#89e3b4; border-radius:50%; }
.ft-record { padding:0 22px; margin:0; }
.ft-record>div { display:flex; justify-content:space-between; gap:16px; padding:19px 0; border-top:1px solid var(--ft-line); font-size:.9375rem; }
.ft-record dt { color:#516c61; }
.ft-record dd { margin:0; text-align:end; }
.ft-ledger>.ft-context { margin:0 22px; padding-bottom:22px; }
.ft-ticket>.ft-message { margin:22px 22px 18px; max-width:none; }
.ft-ticket-card { margin:0 22px 22px; padding:22px; border:1px solid var(--ft-line); border-radius:16px; }
.ft-ticket-card>strong { display:block; font-weight:500; font-size:1.125rem; }
.ft-ticket-facts { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding-block:22px; }
.ft-ticket-facts>span { display:grid; gap:8px; font-size:.875rem; color:#516c61; }
.ft-ticket-facts strong { color:#003f35; font-weight:500; }
.ft-ticket-options { display:flex; gap:6px; }
.ft-ticket-status { padding-top:20px; min-height:80px; font-size:.9375rem!important; }
.ft-campaign-audience { display:grid; gap:10px; padding:24px 22px; }
.ft-campaign-audience .ft-scene-label { margin:0; }
.ft-campaign-audience>strong { font-size:1.125rem; font-weight:500; }
.ft-campaign-audience>span:last-child { font-size:.875rem; color:#516c61; }
.ft-campaign>.ft-message { margin:0 22px; max-width:none; background:#89e3b4; }
.ft-campaign .ft-message>strong { display:block; font-weight:500; font-size:1rem; margin-bottom:10px; }
.ft-message-link { display:block; text-align:center; border-top:1px solid var(--ft-line); padding-top:12px; margin-top:15px; font-size:.875rem; font-weight:500; }
.ft-campaign-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:22px; margin:0; list-style:none; gap:8px; }
.ft-campaign-flow li { display:grid; gap:12px; justify-items:center; text-align:center; background:#e9eed4; border-radius:12px; padding:16px 6px; font-size:.875rem; }
.ft-campaign-flow b { font-weight:500; color:#009e68; }
.ft-campaign>.ft-context { margin:0 22px; padding-bottom:22px; }
.ft-demo.is-changing .ft-scene,.ft-demo.is-changing .ft-inbox-body,.ft-demo.is-changing .ft-knowledge-answer,.ft-demo.is-changing .ft-booking-confirmation { animation:ft-scene-in .35s ease both; }
@keyframes ft-scene-in { from { opacity:.35; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:no-preference) {
 .ft-page.ft-motion [data-ft-reveal] { transition:opacity .65s ease,transform .65s cubic-bezier(.2,.65,.3,1); }
 .ft-page.ft-motion [data-ft-reveal].ft-pending { opacity:0; transform:translateY(22px); }
 html:has(.ft-page) { scroll-behavior:smooth; }
}
@media(max-width:1050px) {
 .ft-hero-grid,.ft-grid { gap:40px; }
 .ft-overview { padding:22px; }
 .ft-contact-line { flex-wrap:wrap; }
 .ft-contact-line>.ft-tag { margin-inline-start:54px; }
}
@media(max-width:760px) {
 .ft-hero-grid,.ft-grid { grid-template-columns:minmax(0,1fr); gap:32px; }
 .ft-section:nth-of-type(odd) .ft-grid>div,.ft-section:nth-of-type(odd) .ft-grid>aside { order:initial; }
 .ft-hero { padding-bottom:48px; }
 .ft-section { padding-block:52px; }
 .ft-overview { box-shadow:6px 8px 0 rgba(0,63,53,.07); }
 .ft-overview-row { min-height:78px; }
 .ft-route-label { display:none; }
 .ft-overview-row { grid-template-columns:38px minmax(0,1fr); }
 .ft-demo { border-radius:22px 22px 5px 22px; }
 .ft-contact-line>.ft-tag { margin-inline-start:auto; }
 .ft-scene { min-height:310px; }
}
@media(max-width:380px) {
 .ft-demo-top,.ft-inbox-body,.ft-scene,.ft-query-options { padding-inline:16px; }
 .ft-ticket-card { padding:16px; margin-inline:16px; }
 .ft-ticket-options { flex-wrap:wrap; }
 .ft-ticket-options button { flex-basis:45%; }
 .ft-contact-line>.ft-tag { margin-inline-start:54px; }
 .ft-demo-top { flex-wrap:wrap; }
}
@media(prefers-reduced-motion:reduce) {
 .ft-page *, .ft-page *::before,.ft-page *::after { animation:none!important; transition:none!important; }
 .ft-page [data-ft-reveal] { opacity:1!important; transform:none!important; }
}
