.info-page { background: #f6f8fb; }

.info-page .header { position: sticky; }

.info-hero { padding: 82px 0 68px; background: var(--navy); color: var(--white); }

.info-hero .eyebrow { color: #78d79e; }

.info-hero h1 { max-width: 840px; margin: 14px 0 18px; font-size: clamp(40px, 5.4vw, 66px); line-height: 1.03; letter-spacing: -2.4px; }

.info-hero p { max-width: 760px; margin: 0; color: #c7d1df; font-size: 17px; line-height: 1.7; }

.info-content { padding: 64px 0 88px; }

.info-layout { display: grid; grid-template-columns: minmax(190px, 250px) minmax(0, 820px); justify-content: space-between; gap: 72px; }

.info-index { align-self: start; position: sticky; top: 118px; padding: 22px; border: 1px solid var(--line); border-radius: 14px; background: var(--white); box-shadow: 0 10px 28px rgba(7, 23, 53, .05); }

.info-index b { display: block; margin-bottom: 12px; color: var(--navy); font-size: 12px; }

.info-index a { display: block; padding: 8px 0; color: var(--muted); font-size: 12px; font-weight: 700; text-decoration: none; }

.info-index a:hover { color: var(--green-action); }

.info-article { min-width: 0; }

.info-article section { margin-top: 52px; scroll-margin-top: 118px; }

.info-article section:first-child { margin-top: 0; }

.info-article h2 { margin: 0 0 16px; color: var(--navy); font-size: 29px; line-height: 1.2; letter-spacing: -.8px; }

.info-article h3 { margin: 25px 0 10px; color: var(--navy); font-size: 18px; }

.info-article p, .info-article li { color: #4e5f75; font-size: 15px; line-height: 1.75; }

.info-article ul { padding-left: 21px; }

.info-note { margin-top: 28px; padding: 20px 22px; border-left: 4px solid var(--green-action); border-radius: 0 12px 12px 0; background: #eef8f2; }

.info-note b { display: block; margin-bottom: 5px; color: var(--green-dark); }

.info-note p { margin: 0; }

.principle-grid { margin-top: 24px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }

.principle-grid article { padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--white); box-shadow: 0 10px 28px rgba(7, 23, 53, .045); }

.principle-grid span { color: var(--green-action); font-size: 10px; font-weight: 800; letter-spacing: 1px; }

.principle-grid h3 { margin: 9px 0 8px; font-size: 18px; }

.principle-grid p { margin: 0; font-size: 13px; }

.info-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }

.info-updated { margin-top: 8px !important; color: #8a96a8 !important; font-size: 12px !important; }

@media (max-width: 900px) {
  .info-hero { padding: 62px 0 54px; }
  .info-layout { grid-template-columns: 1fr; gap: 38px; }
  .info-index { position: static; }
}

@media (max-width: 620px) {
  .info-hero { padding: 46px 0 42px; }
  .info-hero h1 { font-size: 39px; letter-spacing: -1.6px; }
  .info-hero p { font-size: 15px; }
  .info-content { padding: 44px 0 60px; }
  .info-index { display: none; }
  .principle-grid { grid-template-columns: 1fr; }
  .info-article h2 { font-size: 25px; }
}

/* Pagina abbonamenti */
.subscription-hero { background: linear-gradient(125deg, #071735 0%, #0a2653 100%); }

.subscription-hero h1 { max-width: 980px; }

.info-hero-actions { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; }

.subscription-hero .btn-outline { border-color: rgba(255, 255, 255, .65); background: transparent; color: #fff; }

.subscription-hero .btn-outline:hover { border-color: #fff; background: #fff; color: var(--navy); }

.subscription-page .info-layout { grid-template-columns: minmax(190px, 230px) minmax(0, 900px); gap: 60px; }

.section-kicker, .subscription-final > span { display: block; margin-bottom: 10px; color: var(--green-action); font-size: 10px; font-weight: 800; letter-spacing: 1.05px; }

.section-lead { max-width: 770px; margin: -3px 0 0; }

.subscription-intro { padding: 30px; display: grid; grid-template-columns: minmax(0, .85fr) minmax(360px, 1.15fr); align-items: center; gap: 34px; border: 1px solid #bfe8ce; border-radius: 16px; background: linear-gradient(135deg, #effaf3 0%, #fff 100%); box-shadow: 0 12px 34px rgba(7, 23, 53, .05); }

.subscription-intro > div > span { color: var(--green-action); font-size: 10px; font-weight: 800; letter-spacing: 1px; }

.subscription-intro h2 { margin-top: 9px; }

.subscription-intro p { margin-bottom: 0; }

.subscription-intro ul { margin: 0; padding: 0; display: grid; gap: 10px; list-style: none; }

.subscription-intro li { position: relative; padding: 13px 14px 13px 43px; border: 1px solid #d9ebe0; border-radius: 11px; background: rgba(255, 255, 255, .86); }

.subscription-intro li::before { content: "✓"; position: absolute; left: 14px; top: 14px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #ddf6e7; color: var(--green-action); font-size: 12px; font-weight: 800; }

.subscription-intro li b, .subscription-intro li small { display: block; }

.subscription-intro li b { color: var(--navy); font-size: 13px; }

.subscription-intro li small { margin-top: 2px; color: #607086; font-size: 11px; line-height: 1.5; }

.subscription-plan-grid { margin-top: 28px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }

.subscription-plan-card { min-width: 0; padding: 25px; display: flex; flex-direction: column; border: 1px solid var(--line); border-top: 4px solid #173c75; border-radius: 15px; background: #fff; box-shadow: 0 12px 34px rgba(7, 23, 53, .055); }

.subscription-plan-card.featured { border-color: #8bd8a9; border-top-color: var(--green-action); background: linear-gradient(180deg, #f3fbf6 0%, #fff 32%); }

.subscription-plan-card > span { color: var(--green-action); font-size: 10px; font-weight: 800; letter-spacing: 1px; }

.subscription-plan-card h3 { margin: 10px 0 10px; font-size: 20px; line-height: 1.25; }

.subscription-plan-card > p { min-height: 78px; margin: 0; font-size: 13px; line-height: 1.65; }

.subscription-plan-card ul { margin: 20px 0 24px; padding: 0; display: grid; gap: 10px; list-style: none; }

.subscription-plan-card li { position: relative; padding-left: 20px; color: #41546c; font-size: 12px; line-height: 1.45; }

.subscription-plan-card li::before { content: "✓"; position: absolute; left: 0; color: var(--green-action); font-weight: 800; }

.subscription-plan-card > div { margin-top: auto; padding-top: 17px; border-top: 1px solid var(--line); }

.subscription-plan-card > div b, .subscription-plan-card > div small { display: block; }

.subscription-plan-card > div b { color: var(--navy); font-size: 12px; }

.subscription-plan-card > div small { margin-top: 5px; color: #708097; font-size: 10px; line-height: 1.5; }

.custom-plan-note { margin-top: 16px; padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 26px; border: 1px solid #ced9e8; border-radius: 14px; background: #f3f6fa; }

.custom-plan-note span, .custom-plan-note b { display: block; }

.custom-plan-note span { margin-bottom: 5px; color: var(--green-action); font-size: 9px; font-weight: 800; letter-spacing: .9px; }

.custom-plan-note b { color: var(--navy); font-size: 15px; }

.custom-plan-note p { margin: 4px 0 0; font-size: 12px; line-height: 1.55; }

.custom-plan-note .btn { flex: 0 0 auto; }

.activation-steps { margin-top: 25px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }

.activation-steps article { position: relative; padding: 22px 18px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }

.activation-steps article:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; right: -11px; top: 27px; color: var(--green-action); font-size: 16px; font-weight: 800; }

.activation-steps i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: var(--navy); color: #fff; font-size: 12px; font-style: normal; font-weight: 800; }

.activation-steps h3 { margin: 15px 0 7px; font-size: 15px; }

.activation-steps p { margin: 0; font-size: 11px; line-height: 1.55; }

.subscription-final { margin-top: 58px !important; padding: 34px; border-radius: 16px; background: var(--navy); }

.subscription-final h2 { color: #fff; }

.subscription-final p { max-width: 720px; color: #c8d3e2; }

.subscription-final .btn-outline { border-color: rgba(255, 255, 255, .6); background: transparent; color: #fff; }

.subscription-final .btn-outline:hover { border-color: #fff; background: #fff; color: var(--navy); }

@media (max-width: 1000px) {
  .subscription-plan-grid { grid-template-columns: 1fr; }
  .subscription-plan-card > p { min-height: 0; }
  .activation-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .activation-steps article::after { display: none; }
}

@media (max-width: 900px) {
  .subscription-page .info-layout { grid-template-columns: 1fr; gap: 38px; }
  .subscription-intro { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .info-hero-actions { align-items: stretch; flex-direction: column; }
  .info-hero-actions .btn { width: 100%; }
  .subscription-intro { padding: 24px; }
  .activation-steps { grid-template-columns: 1fr; }
  .custom-plan-note { align-items: stretch; flex-direction: column; }
  .custom-plan-note .btn { width: 100%; }
  .subscription-final { padding: 26px 22px; }
}