Aggiorna marketing: prezzi lancio, Funzionalità narrativa e link store.

Allinea i piani Light/Full ai prezzi di lancio, ripensa /funzionalita per vendere il prodotto e aggiunge i badge App Store/Play nella home.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-08-14 23:00:17 +02:00
co-authored by Cursor
parent bc2257efd2
commit 3ed70b6999
42 changed files with 2115 additions and 266 deletions
+264 -44
View File
@@ -2,63 +2,283 @@
<% content_for :meta_description, t("pages.features.meta_description") %>
<% content_for :canonical_url, seo_absolute_url(public_features_path) %>
<div class="wrap">
<h1 style="margin-top:24px"><%= t("pages.features.title") %></h1>
<p style="color:#aaa;max-width:640px"><%= t("pages.features.lead") %></p>
<article class="features-page">
<header class="features-hero">
<div class="wrap features-hero__grid">
<div class="features-hero__copy">
<p class="features-hero__eyebrow">Match Live TV</p>
<h1><%= t("pages.features.hero_title") %></h1>
<p class="features-hero__lead"><%= t("pages.features.hero_lead") %></p>
<section class="section">
<h2><%= t("pages.features.staff_section_title") %></h2>
<div class="features-grid">
<div class="feature-card">
<h3><%= t("pages.features.staff_invite_title") %></h3>
<p><%= t("pages.features.staff_invite_body") %></p>
<ol class="features-flow" aria-label="<%= t("pages.features.flow_aria") %>">
<li class="features-flow__item">
<span class="features-flow__icon" aria-hidden="true"><i class="fa-solid fa-mobile-screen"></i></span>
<span class="features-flow__label"><%= t("pages.features.flow_phone") %></span>
</li>
<li class="features-flow__arrow" aria-hidden="true"><i class="fa-solid fa-arrow-right"></i></li>
<li class="features-flow__item">
<span class="features-flow__icon features-flow__icon--blue" aria-hidden="true"><i class="fa-solid fa-user"></i></span>
<span class="features-flow__label"><%= t("pages.features.flow_account") %></span>
</li>
<li class="features-flow__arrow" aria-hidden="true"><i class="fa-solid fa-arrow-right"></i></li>
<li class="features-flow__item features-flow__item--live">
<span class="features-flow__icon features-flow__icon--live" aria-hidden="true">
<span class="features-flow__dot"></span>
</span>
<span class="features-flow__label"><%= t("pages.features.flow_live") %></span>
</li>
</ol>
</div>
<div class="feature-card">
<h3><%= t("pages.features.staff_access_title") %></h3>
<p><%= t("pages.features.staff_access_body") %></p>
<div class="features-hero__visual">
<%= image_tag "/hero-devices.png",
alt: t("pages.features.hero_alt"),
class: "features-hero__img",
loading: "eager",
fetchpriority: "high" %>
</div>
<div class="feature-card">
<h3><%= t("pages.features.staff_plans_title") %></h3>
<p><%= t("pages.features.staff_plans_body") %></p>
</div>
</header>
<section class="section wrap features-how" aria-labelledby="features-how-title">
<h2 id="features-how-title"><%= t("pages.features.how_title") %></h2>
<ol class="features-how__steps">
<li class="features-how__step">
<span class="features-how__num" aria-hidden="true">1</span>
<h3><%= t("pages.features.how_1_title") %></h3>
<p><%= t("pages.features.how_1_body") %></p>
</li>
<li class="features-how__step">
<span class="features-how__num" aria-hidden="true">2</span>
<h3><%= t("pages.features.how_2_title") %></h3>
<p><%= t("pages.features.how_2_body") %></p>
</li>
<li class="features-how__step">
<span class="features-how__num" aria-hidden="true">3</span>
<h3><%= t("pages.features.how_3_title") %></h3>
<p><%= t("pages.features.how_3_body") %></p>
</li>
<li class="features-how__step">
<span class="features-how__num" aria-hidden="true">4</span>
<h3><%= t("pages.features.how_4_title") %></h3>
<p><%= t("pages.features.how_4_body") %></p>
</li>
<li class="features-how__step">
<span class="features-how__num" aria-hidden="true">5</span>
<h3><%= t("pages.features.how_5_title") %></h3>
<p><%= t("pages.features.how_5_body") %></p>
</li>
</ol>
</section>
<section class="section wrap features-accounts" aria-labelledby="features-accounts-title">
<div class="features-panel">
<h2 id="features-accounts-title"><%= t("pages.features.accounts_title") %></h2>
<p class="features-panel__lead"><%= t("pages.features.accounts_lead") %></p>
<div class="features-accounts__grid">
<div class="features-accounts__card">
<span class="feature-card__icon" aria-hidden="true"><i class="fa-solid fa-user-plus"></i></span>
<h3><%= t("pages.features.accounts_invite_title") %></h3>
<p><%= t("pages.features.accounts_invite_body") %></p>
</div>
<div class="features-accounts__card">
<span class="feature-card__icon feature-card__icon--blue" aria-hidden="true"><i class="fa-solid fa-mobile-screen"></i></span>
<h3><%= t("pages.features.accounts_transmit_title") %></h3>
<p><%= t("pages.features.accounts_transmit_body") %></p>
</div>
<div class="features-accounts__card">
<span class="feature-card__icon feature-card__icon--gold" aria-hidden="true"><i class="fa-solid fa-user-shield"></i></span>
<h3><%= t("pages.features.accounts_revoke_title") %></h3>
<p><%= t("pages.features.accounts_revoke_body") %></p>
</div>
</div>
<p class="features-highlight"><%= t("pages.features.accounts_highlight") %></p>
</div>
</section>
<section class="section wrap features-score" aria-labelledby="features-score-title">
<div class="features-split">
<div class="features-split__copy">
<h2 id="features-score-title"><%= t("pages.features.score_title") %></h2>
<p class="features-panel__lead features-panel__lead--left"><%= t("pages.features.score_lead") %></p>
<ul class="features-checklist">
<li><%= t("pages.features.score_item_app") %></li>
<li><%= t("pages.features.score_item_signup") %></li>
<li><%= t("pages.features.score_item_password") %></li>
<li><%= t("pages.features.score_item_link") %></li>
</ul>
</div>
<aside class="features-score__card" aria-label="<%= t("pages.features.score_card_aria") %>">
<div class="features-score__visual" aria-hidden="true">
<div class="features-score__phone">
<div class="features-score__phone-top">
<span class="features-score__live"><span class="features-score__live-dot"></span> REGIA</span>
<span class="features-score__set">3° set</span>
</div>
<div class="features-score__board">
<div class="features-score__team">
<span class="features-score__team-name">Casa</span>
<span class="features-score__points">21</span>
</div>
<span class="features-score__sep"></span>
<div class="features-score__team features-score__team--away">
<span class="features-score__team-name">Ospiti</span>
<span class="features-score__points">18</span>
</div>
</div>
<div class="features-score__actions">
<span class="features-score__btn">+1</span>
<span class="features-score__btn features-score__btn--muted">+1</span>
</div>
</div>
<div class="features-score__linkchip">
<i class="fa-solid fa-link" aria-hidden="true"></i>
<span>matchlivetv.it/regia/…</span>
</div>
</div>
<div class="features-score__body">
<span class="feature-card__badge feature-card__badge--link"><%= t("pages.features.access_link") %></span>
<p class="features-score__card-title"><%= t("pages.features.score_card_title") %></p>
<p><%= t("pages.features.score_card_body") %></p>
</div>
</aside>
</div>
</section>
<section class="section wrap features-distribute" aria-labelledby="features-distribute-title">
<h2 id="features-distribute-title"><%= t("pages.features.distribute_title") %></h2>
<p class="features-panel__lead"><%= t("pages.features.distribute_lead") %></p>
<ol class="features-pipeline" aria-label="<%= t("pages.features.distribute_aria") %>">
<li class="features-pipeline__node">
<span class="features-pipeline__icon" aria-hidden="true"><i class="fa-solid fa-mobile-screen"></i></span>
<span class="features-pipeline__label"><%= t("pages.features.distribute_phone") %></span>
</li>
<li class="features-pipeline__join" aria-hidden="true"></li>
<li class="features-pipeline__node features-pipeline__node--hub">
<span class="features-pipeline__icon" aria-hidden="true"><i class="fa-solid fa-tower-broadcast"></i></span>
<span class="features-pipeline__label"><%= t("pages.features.distribute_mltv") %></span>
</li>
<li class="features-pipeline__join" aria-hidden="true"></li>
<li class="features-pipeline__targets">
<div class="features-pipeline__node">
<span class="features-pipeline__icon features-pipeline__icon--blue" aria-hidden="true"><i class="fa-solid fa-users"></i></span>
<span class="features-pipeline__label"><%= t("pages.features.distribute_viewers") %></span>
</div>
<div class="features-pipeline__node">
<span class="features-pipeline__icon" aria-hidden="true"><i class="fa-brands fa-youtube"></i></span>
<span class="features-pipeline__label"><%= t("pages.features.distribute_youtube") %></span>
</div>
</li>
</ol>
</section>
<section class="section wrap features-youtube" aria-labelledby="features-youtube-title">
<div class="features-panel features-panel--accent features-youtube__panel">
<div class="features-youtube__copy">
<span class="feature-card__badge feature-card__badge--invite"><%= t("pages.features.youtube_badge") %></span>
<h2 id="features-youtube-title"><%= t("pages.features.youtube_title") %></h2>
<p class="features-panel__lead features-panel__lead--left"><%= t("pages.features.youtube_body") %></p>
</div>
<div class="features-youtube__visual" aria-hidden="true">
<div class="features-yt-mock">
<div class="features-yt-mock__player">
<span class="features-yt-mock__live"><span class="features-yt-mock__dot"></span> LIVE</span>
<span class="features-yt-mock__play"><i class="fa-brands fa-youtube"></i></span>
</div>
<div class="features-yt-mock__meta">
<span class="features-yt-mock__avatar"><i class="fa-solid fa-shield-halved"></i></span>
<div class="features-yt-mock__text">
<strong><%= t("pages.features.youtube_mock_channel") %></strong>
<span><%= t("pages.features.youtube_mock_subs") %></span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section">
<h2><%= t("pages.features.live_section_title") %></h2>
<div class="features-grid">
<section class="section wrap features-replay" aria-labelledby="features-replay-title">
<div class="features-split features-split--reverse">
<div class="features-split__copy">
<h2 id="features-replay-title"><%= t("pages.features.replay_title") %></h2>
<p class="features-panel__lead features-panel__lead--left"><%= t("pages.features.replay_lead") %></p>
<ul class="features-checklist">
<li><%= t("pages.features.replay_item_server") %></li>
<li><%= t("pages.features.replay_item_plan") %></li>
<li><%= t("pages.features.replay_item_download") %></li>
</ul>
</div>
<aside class="features-replay__card" aria-label="<%= t("pages.features.replay_card_title") %>">
<div class="features-replay__visual" aria-hidden="true">
<div class="features-archive-mock">
<div class="features-archive-mock__head">
<i class="fa-solid fa-cloud" aria-hidden="true"></i>
<span><%= t("pages.features.replay_card_title") %></span>
</div>
<ul class="features-archive-mock__list">
<li>
<span class="features-archive-mock__thumb features-archive-mock__thumb--a"></span>
<span class="features-archive-mock__info">
<strong><%= t("pages.features.replay_mock_1_title") %></strong>
<em><%= t("pages.features.replay_mock_1_meta") %></em>
</span>
<i class="fa-solid fa-download" aria-hidden="true"></i>
</li>
<li>
<span class="features-archive-mock__thumb features-archive-mock__thumb--b"></span>
<span class="features-archive-mock__info">
<strong><%= t("pages.features.replay_mock_2_title") %></strong>
<em><%= t("pages.features.replay_mock_2_meta") %></em>
</span>
<i class="fa-solid fa-download" aria-hidden="true"></i>
</li>
<li>
<span class="features-archive-mock__thumb features-archive-mock__thumb--c"></span>
<span class="features-archive-mock__info">
<strong><%= t("pages.features.replay_mock_3_title") %></strong>
<em><%= t("pages.features.replay_mock_3_meta") %></em>
</span>
<i class="fa-solid fa-download" aria-hidden="true"></i>
</li>
</ul>
</div>
</div>
<div class="features-replay__body">
<p class="features-score__card-title"><%= t("pages.features.replay_card_title") %></p>
<p><%= t("pages.features.replay_card_body") %></p>
</div>
</aside>
</div>
</section>
<section class="section wrap features-more" aria-labelledby="features-more-title">
<h2 id="features-more-title"><%= t("pages.features.more_title") %></h2>
<div class="features-grid features-grid--compact">
<div class="feature-card">
<h3><%= t("pages.features.live_phone_title") %></h3>
<p><%= t("pages.features.live_phone_body") %></p>
<span class="feature-card__icon" aria-hidden="true"><i class="fa-solid fa-tower-broadcast"></i></span>
<h3><%= t("pages.features.more_stable_title") %></h3>
<p><%= t("pages.features.more_stable_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_score_title") %></h3>
<p><%= t("pages.features.live_score_body") %></p>
<span class="feature-card__icon feature-card__icon--blue" aria-hidden="true"><i class="fa-solid fa-share-nodes"></i></span>
<h3><%= t("pages.features.more_link_title") %></h3>
<p><%= t("pages.features.more_link_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_link_title") %></h3>
<p><%= t("pages.features.live_link_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_archive_title") %></h3>
<p><%= t("pages.features.live_archive_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_youtube_mltv_title") %></h3>
<p><%= t("pages.features.live_youtube_mltv_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_youtube_club_title") %></h3>
<p><%= t("pages.features.live_youtube_club_body") %></p>
</div>
<div class="feature-card">
<h3><%= t("pages.features.live_website_title") %></h3>
<p><%= t("pages.features.live_website_body") %></p>
<span class="feature-card__icon" aria-hidden="true"><i class="fa-brands fa-youtube"></i></span>
<h3><%= t("pages.features.more_yt_mltv_title") %></h3>
<p><%= t("pages.features.more_yt_mltv_body") %></p>
</div>
</div>
</section>
<p style="text-align:center;margin:40px 0">
<%= link_to t("pages.features.cta_signup"), public_signup_path, class: "btn btn-primary" %>
</p>
</div>
<section class="section wrap features-cta" aria-labelledby="features-cta-title">
<div class="features-cta__box">
<h2 id="features-cta-title"><%= t("pages.features.cta_title") %></h2>
<p><%= t("pages.features.cta_body") %></p>
<div class="features-cta__actions">
<%= link_to t("pages.features.cta_primary"), public_signup_path, class: "btn btn-primary" %>
<%= link_to t("pages.features.cta_secondary"), public_prezzi_path, class: "btn btn-outline" %>
</div>
</div>
</section>
</article>