/* Secondary cards: text and art get separate space. No homepage selectors here.
   The masked art layer fades in its own box, so any aspect ratio has no hard seam. */
html body.qt-experience .qt-feature-card[data-qt-card-layout]{position:relative;isolation:isolate;overflow:hidden;background-image:linear-gradient(115deg,var(--fc-tint),var(--fc-end))!important;background-size:cover!important}
html body.qt-experience .qt-feature-card[data-qt-card-layout]>.qt-card-art{position:absolute;inset:0 0 0 auto;width:36%;z-index:0;pointer-events:none;background:var(--fc-art) no-repeat right center/cover;mask-image:linear-gradient(90deg,transparent,#000 35%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%)}
html body.qt-experience .qt-feature-card[data-qt-card-layout]>:not(.qt-card-art){position:relative;z-index:1}
html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]{padding:20px!important;min-height:138px;box-sizing:border-box;display:flex!important;flex-direction:column;justify-content:flex-start;gap:8px;text-align:left}
html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>:is(h3,h4,p,.fg,.od,.on,.kc-sub,.qb-title,.qb-meta){width:calc(100% - 84px);max-width:none!important;padding:0!important;margin:0!important}
html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>:is(h3,h4){font-size:17px!important;line-height:1.4!important;font-weight:700}
html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>p{font-size:14px!important;line-height:1.6!important;min-height:0}
html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>.fg{margin-top:auto!important;font-size:13px!important;line-height:1.5}
html body.qt-experience .qt-feature-card[data-qt-card-layout]>.qt-feature-symbol,html body.qt-experience .qt-feature-card[data-qt-card-layout]>.flag-tag,html body.qt-experience .qt-feature-card[data-qt-card-layout]>.hot{display:none!important}
html body.qt-experience .qt-feature-card[data-qt-card-layout]>:is(.tnew,.soon){position:absolute;top:8px;right:10px;left:auto}
html body.qt-experience .ky-funcs{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
html body.qt-experience .tp-funcs{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:24px;row-gap:5px;min-height:106px;padding:20px 18% 20px 24px;box-sizing:border-box}
html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>h3{grid-column:1;grid-row:1;font-size:18px;line-height:1.5;margin:0}
html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>p{grid-column:1;grid-row:2;padding:0;line-height:1.6;margin:0;font-size:14px}
html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>.fg{grid-column:2;grid-row:1/3;margin:0;font-size:14px;white-space:nowrap}
html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>.qt-card-art{width:20%}
/* Category buttons become shallow horizontal cards, with counts beside the label. */
html body.qt-experience .writing-tracks{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]{padding:18px 20px;min-height:126px;display:grid;grid-template-rows:auto auto auto;align-content:center;gap:7px;text-align:left}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>.writing-track-top{margin:0;width:calc(100% - 94px);justify-content:flex-start}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"] .writing-track-icon{display:none}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"] .writing-track-count{font-size:12px;padding:0;background:transparent;color:var(--fc-ink)}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>:is(h3,p){width:calc(100% - 94px);margin:0;min-height:0;line-height:1.5}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>h3{font-size:17px;font-weight:700}
html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>p{font-size:13px}
/* Wide actions have continuous full-width gradients and a dedicated right artwork area. */
html body.qt-experience .qt-feature-card[data-qt-card-layout="banner"]>.qt-card-art{width:34%;background-size:cover;mask-image:linear-gradient(90deg,transparent,#000 45%);-webkit-mask-image:linear-gradient(90deg,transparent,#000 45%)}
html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout]{display:flex;align-items:center;gap:22px;padding:24px 18% 24px 26px;min-height:126px;box-sizing:border-box}
html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout]>.qt-card-art{width:20%}
html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout] :is(.zs-cta-d,.tf-cta-d,.lx-cta-d){font-size:14px;line-height:1.7;max-width:620px}
html body.qt-experience :is(.tp-qbank,.qb-push)[data-qt-card-layout] :is(.tq-body,.qb-push-body){max-width:65%;box-sizing:border-box}
html body.qt-experience .qt-industry-symbol svg{width:20px;height:20px;margin:0;color:inherit;display:block}
/* The original industry images are content, not interchangeable feature decoration. */
html body.qt-experience :is(.sy-topic,.st-card) .ph{visibility:visible}
@media(min-width:761px) and (max-width:1100px){
 html body.qt-experience :is(.ky-funcs,.tp-funcs,.writing-tracks){grid-template-columns:repeat(2,minmax(0,1fr))}
 html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout]{padding-right:22%;flex-wrap:wrap;gap:12px}
}
@media(max-width:760px){
 html body.qt-experience :is(.ky-funcs,.tp-funcs,.writing-tracks){grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]{padding:12px!important;min-height:100px!important;gap:8px}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>:is(h3,h4,.on){width:100%;font-size:14px!important;line-height:1.45!important;padding:0!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>p{display:none!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>.fg{display:block!important;width:calc(100% - 42px);font-size:12px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="tile"]>.qt-card-art{inset:auto 0 0 auto;width:64px;height:56px;background-size:cover;mask-image:radial-gradient(ellipse at bottom right,#000 35%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse at bottom right,#000 35%,transparent 78%)}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]{padding:12px!important;min-height:106px!important;gap:5px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>.writing-track-top{width:100%}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"] .writing-track-count{display:block!important;font-size:11px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>h3{font-size:14px!important;line-height:1.5;width:100%}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>p{display:none!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="writing"]>.qt-card-art{width:56px;height:48px;top:auto;bottom:0;background-size:cover;mask-image:radial-gradient(ellipse at bottom right,#000 35%,transparent 78%);-webkit-mask-image:radial-gradient(ellipse at bottom right,#000 35%,transparent 78%)}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]{padding:16px 18px!important;min-height:112px!important;display:flex!important;align-items:flex-start;gap:5px}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>:is(h3,p,.fg){max-width:85%;padding:0!important;margin:0!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>h3{font-size:15px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>p{font-size:12px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>.fg{display:block!important;font-size:12px!important}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="ribbon"]>.qt-card-art{width:70px;top:0;opacity:.7}
 html body.qt-experience .qt-feature-card[data-qt-card-layout="banner"]>.qt-card-art{width:28%;opacity:.65;background-size:cover}
 html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout]{padding:18px 20px!important;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
 html body.qt-experience :is(.zs-cta,.tf-cta,.lx-cta)[data-qt-card-layout]>:not(.qt-card-art){max-width:85%}
 html body.qt-experience :is(.tp-qbank,.qb-push)[data-qt-card-layout] :is(.tq-body,.qb-push-body){max-width:100%;padding-right:24%}
 html body.qt-experience .sy-topics{grid-template-columns:1fr!important}
 html body.qt-experience .sy-topic .ph{display:block!important;width:30%}
 html body.qt-experience .sy-topic .td{display:none}
 html body.qt-experience .sy-topic{min-height:102px}
}
@media(forced-colors:active){html body.qt-experience .qt-card-art{display:none!important}}

/* Knowledge and paper cards have nested metadata instead of a paragraph. */
html body.qt-experience .kb-card[data-qt-card-layout] .kc-foot{margin-top:auto}
html body.qt-experience .qb-card[data-qt-card-layout] .qb-btn{align-self:flex-start}
@media(max-width:760px){html body.qt-experience .qt-feature-card[data-qt-card-layout] .qb-title{width:100%}html body.qt-experience .kb-card[data-qt-card-layout] .kc-sub{display:none}html body.qt-experience .kb-card[data-qt-card-layout] .qt-card-art{opacity:.35}}
