.feature-grid-detailed { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; }
.feature-grid-detailed .feature-card { grid-column: span 2; min-height: 304px; display: flex; flex-direction: column; padding: 30px; }
.feature-grid-detailed .feature-icon { flex-shrink: 0; }
.feature-grid-detailed h3 { font-size: 21px; line-height: 1.45; }
.feature-grid-detailed p { font-size: 14px; }
.feature-demo-link { margin-top: auto; padding-top: 24px; display: flex; justify-content: space-between; gap: 12px; font-size: 12px; font-weight: 700; color: var(--blue); }
.feature-demo-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.feature-grid-detailed .privacy-card { grid-column: 1 / -1; flex-direction: row; min-height: 248px; gap: 25px; }
.feature-grid-detailed .privacy-card p { max-width: 720px; }
.feature-grid-detailed .feature-context { grid-column: span 3; background: #eaf3ff; border-color: #d4e5fd; }
.feature-grid-detailed .feature-context .feature-icon { background: white; }
.feature-grid-detailed .feature-minimal { grid-column: 1 / -1; min-height: 0; flex-direction: row; align-items: center; justify-content: space-between; gap: 25px; background: #fffcf5; border-color: #eee3c8; }
.feature-minimal h3 { margin: 10px 0 11px; }
.feature-minimal .feature-demo-link { margin: 0; padding: 13px 18px; flex-shrink: 0; border: 1px solid #e5d7b8; border-radius: 9px; color: #80642b; }
.minimal-label { color: #ad883b; font-size: 10px; letter-spacing: .16em; font-weight: 700; }
.hero-learning-message { font-size: clamp(36px, 3.8vw, 60px); line-height: 1.5; white-space: nowrap; }
.ticker-english .wrap { justify-content: center; gap: clamp(15px, 5vw, 75px); }
.feature-grid-detailed .feature-core { border-color: #bfd7f7; box-shadow: inset 0 3px #1666e8; }
.core-demo-shortcuts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 30px; }
.core-demo-shortcuts a { display: flex; align-items: center; gap: 12px; min-height: 62px; border: 1px solid #c7daf6; border-radius: 10px; padding: 14px 18px; background: #f2f7ff; color: #174f9a; font-size: 15px; font-weight: 700; }
.core-demo-shortcuts a>span { font-size: 11px; color: #7296c7; }
.core-demo-shortcuts a>b { margin-left: auto; font-weight: 400; }
.core-demo-shortcuts a:hover { background: #e7f1ff; border-color: #8db7ef; }
.core-demo-shortcuts a:focus-visible { outline: 3px solid #df9b1d; outline-offset: 3px; }
@media(max-width:600px) { .core-demo-shortcuts { gap: 6px; } .core-demo-shortcuts a { padding: 12px 8px; gap: 4px; min-height: 54px; font-size: 12px; justify-content: center; } .core-demo-shortcuts a>span, .core-demo-shortcuts a>b { display: none; } .ticker-english .wrap { gap: 9px 15px; } }
.how-tip { color: var(--muted); font-size: 12px; line-height: 1.9; margin: 30px 0 0; padding: 16px 20px; border: 1px solid var(--line); border-radius: 9px; }
.how-tip a { color: var(--blue); white-space: nowrap; margin-left: 10px; }
.steps kbd { display: inline-block; border: 1px solid #d7e1ee; border-bottom-width: 2px; border-radius: 4px; background: #f8faff; padding: 0 5px; font-size: 11px; color: #4f6990; }
.steps code { padding: 2px 5px; border-radius: 4px; background: #edf5ff; color: var(--blue); font-size: 13px; }
.faq { background: #f8fbff; }
.faq-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 75px; align-items: start; }
.faq-grid>div>p:not(.kicker) { color: var(--muted); font-size: 15px; line-height: 1.9; }
.faq-items { border-top: 1px solid #cfddf0; }
.faq-items details { border-bottom: 1px solid #cfddf0; }
.faq-items summary { list-style: none; position: relative; cursor: pointer; padding: 23px 33px 23px 0; color: var(--navy); font-size: 15px; font-weight: 700; line-height: 1.7; }
.faq-items summary::-webkit-details-marker { display: none; }
.faq-items summary::after { content: '+'; position: absolute; top: 23px; right: 2px; color: var(--blue); font-size: 20px; font-weight: 400; line-height: 1.2; }
.faq-items details[open] summary::after { content: '−'; }
.faq-items details p { font-size: 14px; line-height: 1.95; color: var(--muted); padding: 0 27px 23px 0; margin: 0; }
.faq-items summary:focus-visible, .feature-demo-link:focus-visible, .how-tip a:focus-visible { outline: 3px solid #df9b1d; outline-offset: 3px; }
#how, #features, #status, #download, #faq, #contact { scroll-margin-top: 100px; }
#top { scroll-margin-top: 78px; }
#hero-demo { scroll-margin-top: 95px; }
@media (max-width: 1050px) { .feature-grid-detailed { grid-template-columns: repeat(2, minmax(0,1fr)); } .feature-grid-detailed .feature-card { grid-column: span 1; } .feature-grid-detailed .privacy-card, .feature-grid-detailed .feature-minimal { grid-column: 1 / -1; } .faq-grid { gap: 40px; } }
@media (max-width: 760px) { .faq-grid { grid-template-columns: 1fr; gap: 25px; } .feature-grid-detailed .feature-card { padding: 26px; } }
@media (max-width: 600px) { .feature-grid-detailed { grid-template-columns: 1fr; } .feature-grid-detailed .feature-card { min-height: 277px; } .feature-grid-detailed .privacy-card, .feature-grid-detailed .feature-minimal { min-height: auto; } .feature-grid-detailed .feature-minimal { flex-direction: column; align-items: flex-start; } .feature-demo-link { padding-top: 22px; min-height: 44px; } .how-tip { padding: 14px 16px; } .faq-items summary { font-size: 14px; padding-top: 20px; padding-bottom: 20px; } .faq-items details p { font-size: 13px; } h1 { font-size: clamp(42px, 12.9vw, 52px); } }
@media (max-width: 600px) { .hero-learning-message { font-size: clamp(30px, 9.4vw, 43px); line-height: 1.7; } #top { scroll-margin-top: 66px; } }