/* ==========================================================================
   Secure — trust / proof-led design. Muted indigo on pale lavender-gray
   with charcoal text. Shield-emblem hero with a trust indicator bar,
   large-type statement, spectrum diagram, permission-matrix interface,
   numbered FAQ index. Scoped under .lp-secure.
   ========================================================================== */

.lp-secure {
  --sc-indigo: #4b52a0;
  --sc-indigo-d: #393f85;
  --sc-tint: #eceefa;
  --sc-pale: #f3f4fa;
  --sc-ink: #23252f;
  --sc-soft: #565a6b;
  --sc-line: #dfe1ee;
  --sc-warn: #a7602f;
  background: #fff;
  color: var(--sc-ink);
}

.lp-secure section { padding: clamp(48px, 7vw, 88px) 0; }
.lp-secure h1, .lp-secure h2, .lp-secure h3 { color: var(--sc-ink); letter-spacing: -0.02em; }
.lp-secure h2 { font-size: clamp(27px, 3.3vw, 40px); line-height: 1.14; font-weight: 800; }
.lp-secure h3 { font-size: 18px; font-weight: 700; line-height: 1.3; }
.lp-secure p { color: var(--sc-soft); }
.lp-secure .lp-ic { width: 20px; height: 20px; flex-shrink: 0; }

.sc-kicker { display: inline-block; font-size: 12.5px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sc-indigo); margin-bottom: 14px; }
.sc-tag { display: inline-block; font-size: 11.5px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sc-soft); background: var(--sc-pale); border: 1px solid var(--sc-line); padding: 5px 12px; border-radius: 6px; margin-bottom: 14px; }
.sc-tag.is-on { color: #fff; background: var(--sc-indigo); border-color: var(--sc-indigo); }
.sc-head { max-width: 760px; margin-bottom: 44px; }
.sc-head p { margin-top: 16px; font-size: 17px; line-height: 1.7; }
.sc-cta-row { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; }
.sc-cta-row.is-center, .sc-hero .sc-cta-row { justify-content: center; }
.sc-emblem { width: 76px; height: 76px; border-radius: 22px; background: linear-gradient(150deg, var(--sc-indigo), #6a70bd); color: #fff; display: grid; place-items: center; margin: 0 auto 22px; box-shadow: 0 18px 38px rgba(75, 82, 160, 0.32); }
.sc-emblem .lp-ic { width: 38px; height: 38px; }
.sc-emblem.is-small { width: 60px; height: 60px; border-radius: 18px; }
.sc-emblem.is-small .lp-ic { width: 30px; height: 30px; }

/* Hero */
.lp-secure .sc-hero { padding-top: clamp(36px, 5vw, 60px); background: radial-gradient(800px 380px at 50% -10%, var(--sc-tint), transparent 70%), var(--sc-pale); border-bottom: 1px solid var(--sc-line); }
.lp-secure .breadcrumbs { color: #8f92a6; }
.lp-secure .breadcrumbs a { color: #8f92a6; }
.sc-hero-copy { text-align: center; max-width: 860px; margin: 0 auto; }
.sc-hero .sc-kicker { display: block; }
.sc-hero h1 { font-size: clamp(34px, 5vw, 60px); line-height: 1.06; font-weight: 800; }
.sc-lead { margin: 22px auto 0; max-width: 680px; font-size: 18.5px; line-height: 1.7; }
.sc-trust { margin-top: 52px; display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border: 1px solid var(--sc-line); border-radius: 22px; box-shadow: 0 24px 54px rgba(57, 63, 133, 0.1); overflow: hidden; }
.sc-trust li { padding: 26px 24px; display: flex; flex-direction: column; gap: 8px; }
.sc-trust li + li { border-left: 1px solid var(--sc-line); }
.sc-trust .lp-ic { width: 38px; height: 38px; padding: 9px; border-radius: 11px; background: var(--sc-tint); color: var(--sc-indigo); margin-bottom: 4px; }
.sc-trust strong { font-size: 16px; }
.sc-trust span { font-size: 14.5px; line-height: 1.6; color: var(--sc-soft); }

/* Statement */
.lp-secure .sc-statement { padding-block: clamp(56px, 8vw, 104px); text-align: center; }
.sc-big { font-size: clamp(30px, 5vw, 62px); line-height: 1.08; font-weight: 800; letter-spacing: -0.03em; color: var(--sc-ink) !important; max-width: 900px; margin: 0 auto; }
.sc-big-sub { margin: 24px auto 0; max-width: 640px; font-size: clamp(17px, 1.8vw, 21px); line-height: 1.65; }

/* Spectrum */
.lp-secure .sc-involves { background: var(--sc-pale); border-block: 1px solid var(--sc-line); }
.sc-spectrum { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 0; align-items: stretch; position: relative; }
.sc-spectrum::before { content: ""; position: absolute; left: 6%; right: 6%; top: 34px; height: 3px; background: linear-gradient(90deg, #cfd2e6, var(--sc-indigo), #cfd2e6); border-radius: 2px; }
.sc-spectrum article { position: relative; padding: 58px 26px 26px; }
.sc-spectrum article::before { content: ""; position: absolute; top: 27px; left: 50%; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: #fff; border: 3px solid #b8bcdb; }
.sc-spectrum article.is-mid { background: #fff; border: 2px solid var(--sc-indigo); border-radius: 22px; box-shadow: 0 24px 50px rgba(75, 82, 160, 0.16); margin: 0 -1px; z-index: 1; }
.sc-spectrum article.is-mid::before { background: var(--sc-indigo); border-color: #fff; box-shadow: 0 0 0 3px var(--sc-indigo); }
.sc-spectrum article.is-end { text-align: center; }
.sc-spectrum article.is-mid { text-align: center; }
.sc-spectrum p { margin-top: 10px; font-size: 15px; line-height: 1.7; }
.sc-involves-text { max-width: 760px; margin: 48px auto 0; display: grid; gap: 18px; }
.sc-involves-text p { font-size: 16.5px; line-height: 1.75; }
.sc-doctypes { display: flex; flex-wrap: wrap; gap: 10px; }
.sc-doctypes li { font-size: 13.5px; font-weight: 700; color: var(--sc-indigo-d); background: #fff; border: 1px solid var(--sc-line); border-radius: 999px; padding: 8px 16px; }

/* Split sections */
.sc-split { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.sc-split.is-flip { grid-template-columns: 1.1fr 0.9fr; }
.sc-split p { margin-top: 16px; font-size: 16.5px; line-height: 1.75; }
.sc-split h2 + p { margin-top: 22px; }
.sc-risk { background: #fff; border: 1px solid var(--sc-line); border-left: 5px solid var(--sc-warn); border-radius: 18px; padding: 28px; box-shadow: 0 18px 40px rgba(57, 63, 133, 0.08); }
.sc-risk h3 { font-size: 20px; margin-bottom: 16px; }
.sc-risk ul { display: flex; flex-direction: column; gap: 12px; }
.sc-risk li { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; font-weight: 600; line-height: 1.5; color: var(--sc-ink); padding: 12px 14px; background: #fbf5ef; border-radius: 10px; }
.sc-risk .lp-ic { color: var(--sc-warn); width: 20px; height: 20px; margin-top: 1px; }

/* Access */
.lp-secure .sc-access { background: var(--sc-pale); border-block: 1px solid var(--sc-line); }
.sc-matrix { background: #fff; border: 1px solid var(--sc-line); border-radius: 20px; box-shadow: 0 24px 54px rgba(57, 63, 133, 0.12); overflow: hidden; }
.sc-matrix-head, .sc-row { display: grid; grid-template-columns: 1.6fr repeat(3, 0.7fr); align-items: center; padding: 16px 22px; }
.sc-matrix-head { background: var(--sc-tint); font-size: 12px; text-transform: uppercase; letter-spacing: 0.08em; }
.sc-matrix-head b { text-align: center; color: var(--sc-indigo-d); }
.sc-row { border-top: 1px solid var(--sc-line); font-weight: 600; font-size: 14.5px; }
.sc-row span { display: flex; align-items: center; gap: 10px; }
.sc-row span .lp-ic { color: var(--sc-indigo); width: 18px; height: 18px; }
.sc-row i { justify-self: center; width: 34px; height: 20px; border-radius: 999px; background: #dcdeeb; position: relative; }
.sc-row i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); }
.sc-row i.on { background: var(--sc-indigo); }
.sc-row i.on::after { left: 16px; }
.sc-share { margin-top: 44px; display: grid; grid-template-columns: 0.7fr 1.3fr; gap: 28px; align-items: center; background: #fff; border: 1px solid var(--sc-line); border-radius: 22px; padding: 28px 32px; }
.sc-share h3 { font-size: 22px; }
.sc-share ul { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; }
.sc-share li { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; font-size: 15px; line-height: 1.45; }
.sc-share .lp-ic { width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: var(--sc-indigo); color: #fff; stroke-width: 3; margin-top: 0; }

/* Protected */
.sc-principles { background: var(--sc-tint); border: 1px solid #d3d7f0; border-radius: 22px; padding: 30px; position: sticky; top: 104px; }
.sc-principles h3 { font-size: 19px; margin-bottom: 20px; line-height: 1.35; }
.sc-principles ul { display: flex; flex-direction: column; gap: 12px; }
.sc-principles li { display: flex; gap: 14px; align-items: flex-start; background: #fff; border-radius: 14px; padding: 14px 16px; font-size: 14.5px; font-weight: 600; line-height: 1.5; color: var(--sc-ink); }
.sc-principles .lp-ic { color: var(--sc-indigo); width: 22px; height: 22px; margin-top: 1px; }

/* Related */
.lp-secure .sc-related { text-align: center; background: var(--sc-pale); border-block: 1px solid var(--sc-line); padding-block: clamp(40px, 5vw, 64px); }
.sc-related p { max-width: 520px; margin: 12px auto 0; font-size: 16.5px; }
.sc-links { margin-top: 26px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.sc-links a { display: inline-flex; align-items: center; gap: 10px; padding: 13px 20px; background: #fff; border: 1px solid var(--sc-line); border-radius: 12px; font-weight: 700; font-size: 14.5px; color: var(--sc-indigo-d); transition: border-color .2s, transform .2s; }
.sc-links a:hover { border-color: var(--sc-indigo); transform: translateY(-2px); }
.sc-links .lp-ic { width: 16px; height: 16px; }

/* FAQ */
.sc-faq-list { max-width: 860px; counter-reset: sc; border-top: 3px solid var(--sc-indigo); }
.sc-faq-list li { counter-increment: sc; border-bottom: 1px solid var(--sc-line); }
.sc-faq-list summary { cursor: pointer; list-style: none; display: grid; grid-template-columns: 56px 1fr 24px; align-items: center; gap: 8px; padding: 24px 0; font-size: clamp(17px, 1.8vw, 21px); font-weight: 700; line-height: 1.35; color: var(--sc-ink); }
.sc-faq-list summary::-webkit-details-marker { display: none; }
.sc-faq-list summary::before { content: counter(sc, decimal-leading-zero); font-size: 14px; font-weight: 800; color: var(--sc-indigo); letter-spacing: 0.06em; }
.sc-faq-list summary::after { content: ""; width: 10px; height: 10px; border-right: 2.5px solid var(--sc-indigo); border-bottom: 2.5px solid var(--sc-indigo); transform: rotate(45deg); transition: transform .2s; justify-self: end; margin-top: -4px; }
.sc-faq-list details[open] summary::after { transform: rotate(-135deg); margin-top: 4px; }
.sc-faq-list details p { padding: 0 32px 26px 64px; font-size: 16.5px; line-height: 1.75; }
.sc-faq-list summary:focus-visible { outline: 2px solid var(--sc-indigo); outline-offset: 2px; }
.sc-more { margin-top: 26px; }
.sc-more a { display: inline-flex; gap: 8px; align-items: center; font-weight: 700; color: var(--sc-indigo-d); }

/* CTA */
.lp-secure .sc-cta { padding-top: 0; }
.sc-cta-panel { text-align: center; background: radial-gradient(500px 240px at 50% 0%, #fff, transparent 70%), var(--sc-tint); border: 1px solid #d3d7f0; border-radius: 30px; padding: clamp(36px, 6vw, 72px) clamp(20px, 5vw, 60px); }
.sc-cta-panel h2 { max-width: 700px; margin: 0 auto; font-size: clamp(28px, 4vw, 44px); }
.sc-cta-panel p { max-width: 620px; margin: 16px auto 0; font-size: 17.5px; line-height: 1.7; }
.sc-cta-panel p a { color: var(--sc-indigo-d); font-weight: 700; border-bottom: 1px solid currentColor; }

@media (max-width: 1000px) {
  .sc-trust { grid-template-columns: 1fr 1fr; }
  .sc-trust li:nth-child(3) { border-left: 0; }
  .sc-trust li:nth-child(n+3) { border-top: 1px solid var(--sc-line); }
  .sc-split, .sc-split.is-flip { grid-template-columns: 1fr; }
  .sc-principles { position: static; }
  .sc-spectrum { grid-template-columns: 1fr; gap: 16px; }
  .sc-spectrum::before { display: none; }
  .sc-spectrum article { padding: 26px; border: 1px solid var(--sc-line); border-radius: 18px; background: #fff; }
  .sc-spectrum article::before { display: none; }
  .sc-spectrum article.is-mid { margin: 0; order: -1; }
  .sc-share { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .sc-trust { grid-template-columns: 1fr; }
  .sc-trust li + li { border-left: 0; border-top: 1px solid var(--sc-line); }
  .sc-share ul { grid-template-columns: 1fr; }
  .sc-matrix-head, .sc-row { padding: 14px 14px; grid-template-columns: 1.5fr repeat(3, 0.6fr); }
  .sc-faq-list summary { grid-template-columns: 40px 1fr 20px; }
  .sc-faq-list details p { padding: 0 8px 24px 48px; }
}

/* list + footer resets */
.lp-secure ol { list-style: none; margin: 0; padding: 0; }
.site-footer { margin-top: 0; }
