
/* EDITORIAL SECTION */
.learn7 {padding:clamp(54px,7vw,100px) 0;position:relative; background:linear-gradient(150deg,rgba(110,80,255,.055),rgba(24,200,212,.045));border-block:1px solid rgba(137,164,214,.12)}
.learn7-head {display:flex;gap:20px;align-items:end;justify-content:space-between;margin-bottom:28px;flex-wrap:wrap}
.learn7-head h2 {font-size:clamp(2rem,4vw,3.3rem);line-height:1.07;margin:10px 0;color:var(--text,#eff6ff);letter-spacing:-.04em}
.learn7-head p {max-width:55ch;opacity:.80;margin:0}
.learn7-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.learn7-card {position:relative;text-decoration:none;min-height:230px;padding:23px;border:1px solid rgba(125,166,220,.28);border-radius:22px;background:linear-gradient(150deg,rgba(98,82,206,.21),rgba(9,30,52,.28));transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;flex-direction:column;align-items:flex-start;color:var(--text,#f0f7ff)}
.learn7-card:hover,.learn7-card:focus-visible {transform:translateY(-5px);border-color:#70e3df;box-shadow:0 16px 48px rgba(13,188,193,.12)}
.learn7-index {font-weight:800;color:#74e8db;font-size:.79rem;letter-spacing:.12em}
.learn7-card h3 {font-size:1.27rem;line-height:1.25;margin:24px 0 8px;letter-spacing:-.02em}
.learn7-card p{margin:0 0 25px;font-size:.89rem;line-height:1.6;opacity:.83}
.learn7-card .learn7-go{margin-top:auto;color:#6de6dd;font-weight:700;font-size:.9rem}
.learn7-wrap {padding:50px 0 90px;max-width:880px;margin-inline:auto}
.learn7-wrap .learn7-kicker {font-size:.79rem;letter-spacing:.11em;text-transform:uppercase;color:#68dccf;font-weight:800}
.learn7-wrap h1 {font-size:clamp(2.1rem,5vw,4.2rem);line-height:1.08;letter-spacing:-.045em;margin:20px 0}
.learn7-wrap .learn7-lead {font-size:1.12rem;line-height:1.75;opacity:.86;margin-bottom:28px}
.learn7-breadcrumb {font-size:.88rem;display:flex;flex-wrap:wrap;gap:9px;opacity:.78;padding-top:36px}
.learn7-breadcrumb a {text-decoration:underline;text-underline-offset:3px;color:inherit}
.learn7-article {border:1px solid rgba(126,166,220,.2);border-radius:26px;padding:clamp(24px,5vw,48px);background:rgba(31,44,75,.18);box-shadow:0 20px 60px rgba(0,0,0,.07)}
.learn7-article h2 {font-size:1.65rem;margin:32px 0 12px;letter-spacing:-.025em}
.learn7-article h2:first-child{margin-top:0}
.learn7-article p,.learn7-article li {font-size:1.02rem;line-height:1.85;margin:10px 0}
.learn7-article ul {padding-left:23px;margin:14px 0}
.learn7-formula {margin:24px 0;padding:24px;border:1px solid rgba(77,215,210,.32);border-radius:15px;background:rgba(64,179,200,.10);font-weight:800;font-size:1.4rem;letter-spacing:.01em;overflow-wrap:anywhere}
.learn7-example {margin:22px 0;padding:20px 24px;border-left:3px solid #59dbd1;background:rgba(76,195,195,.075);border-radius:0 12px 12px 0}
.learn7-example strong{color:#6be8da}
.learn7-action{margin-top:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:14px;background:linear-gradient(100deg,#5be7d9,#a8f9cb);color:#081d30!important;font-weight:900;padding:15px 24px;text-decoration:none!important}
.learn7-rel {margin-top:26px;font-size:.9rem;opacity:.75}
@media(max-width:920px){.learn7-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:530px){.learn7-grid{grid-template-columns:1fr}.learn7-card{min-height:185px}.learn7-wrap{padding-inline:20px}.learn7-breadcrumb{padding-top:15px}.learn7-article{padding:21px}}
/* theme aware, keeping readability in clear mode */
html:not([data-theme="dark"]) .learn7-card {background:linear-gradient(135deg,rgba(237,241,255,.97),rgba(224,253,250,.94));color:#162641;border-color:#b9cde0}
html:not([data-theme="dark"]) .learn7-card h3,html:not([data-theme="dark"]) .learn7-head h2{color:#112742}
html:not([data-theme="dark"]) .learn7-article{background:rgba(255,255,255,.76);border-color:#bdd3e1;color:#1e3451}
html:not([data-theme="dark"]) .learn7-index,html:not([data-theme="dark"]) .learn7-card .learn7-go,html:not([data-theme="dark"]) .learn7-wrap .learn7-kicker,html:not([data-theme="dark"]) .learn7-example strong{color:#117b7c}
@media(prefers-reduced-motion:reduce){.learn7-card{transition:none}.learn7-card:hover{transform:none}}
