/* Shared reading layout. Kept separate from checkout and result styles. */
.learn-body { background: radial-gradient(ellipse at 80% 0%, #24433244, transparent 42%), #091e18; color: #e9eadb; }
.learn-body a { color: #d8bd96; text-underline-offset: 4px; }
.learn-nav { border-bottom: 1px solid #bfd0b51c; }
.learn-brand { width: 170px; }
.learn-nav-links a { color: #b8c6b7; font-size: 11px; font-weight: 500; }
.learn-nav-links .learn-buy { color: #ead3ae; border-color: #b7bf9f45; background: #d5be8c0b; border-radius: 6px; }
.learn-breadcrumb, .learn-breadcrumb a { color: #9fb49f; }
.learn-body .eyebrow { color: #d4b487; font-size: 10px; letter-spacing: 2px; }
.learn-body .learn-article h1 { color: #eeeddb; font-size: clamp(37px, 5.6vw, 61px); line-height: 1.09; letter-spacing: -.035em; }
.learn-body .learn-article h2 { color: #e6e6d3; font-size: 29px; margin-top: 43px; }
.learn-body .learn-article h3 { color: #e0d5b9; font-size: 19px; }
.learn-body .learn-article p, .learn-body .learn-article li { color: #bdcbbd; font-size: 16px; line-height: 1.95; }
.learn-body .learn-article .learn-deck { color: #bacbbb; font-size: 18px; line-height: 1.8; }
.learn-body .learn-meta { font-size: 11px !important; color: #91a58f !important; border-color: #b8c5aa28; }
.learn-body .learn-summary { color: #d6dfcb; background: #163629; border-color: #9eae912b; border-radius: 10px; font-weight: 500; }
.learn-body .learn-note { background: #343a251f; border-left: 2px solid #ac9568; border-radius: 0; color: #d8d3b5; }
.learn-body .learn-note strong { color: #e1c99d; }
.learn-table { background: #102a20; }
.learn-table caption { color: #a3b69f; padding: 0 0 12px; text-align: left; font-size: 12px; line-height: 1.6; }
.learn-table th, .learn-table td { color: #c0cdbb; border-color: #b8c5aa26; }
.learn-table th { background: #19392b; color: #e4ddc1; font-weight: 550; }
.learn-body .learn-sources { border-color: #b8c5aa28; }
.learn-body .learn-sources h2 { font-size: 22px; }
.learn-body .learn-sources p, .learn-body .learn-sources li { font-size: 12px; line-height: 1.85; color: #9fb39e; }
.learn-body .learn-related a { background: #143126; border-color: #a3b69f2b; color: #d2cfb1; font-size: 12px; font-weight: 500; border-radius: 8px; }
.learn-body .learn-article .button { background: #ddc19b; border: 0; color: #143126; border-radius: 6px; font-size: 13px; padding: 12px 19px; }
.learn-footer { color: #8da48e; border-color: #b8c5aa28; }
.learn-footer a { color: #b1bfa5; }
.guide-jumps { display: flex; flex-wrap: wrap; gap: 10px 21px; margin: 0 0 35px; padding-bottom: 18px; border-bottom: 1px solid #b8c5aa28; font-size: 11px; }
.guide-jumps a { text-decoration: none; }
.guide-counts { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 8px; margin: 25px 0; }
.guide-counts > div { padding: 16px 8px; text-align: center; background: #133025; border: 1px solid #a3b69f2b; border-radius: 8px; }
.guide-counts span { display: block; color: #afc1ab; font-size: 11px; }
.guide-counts strong { display: block; color: #e3d6b6; margin-top: 5px; font: 400 33px Georgia,serif; }
.guide-counts .count-emphasis { border-color: #b99e6c88; background: #5148272e; }
.guide-elements { margin: 30px 0; }
.guide-elements > section { display: grid; grid-template-columns: 92px minmax(0,1fr); gap: 23px; padding: 25px 0; border-top: 1px solid #b8c5aa28; align-items: center; }
.guide-elements img { width: 85px; height: 125px; object-fit: contain; }
.guide-elements h3 { margin: 0 0 11px; font: 400 25px Georgia,serif; }
.guide-elements h3 small { font: 400 12px Arial,sans-serif; color: #a5b89f; margin-left: 12px; }
.guide-elements p { margin: 0; font-size: 14px !important; }
.guide-next { margin-top: 38px; padding: 25px 27px; border: 1px solid #b8c5aa33; background: #163629; border-radius: 10px; }
.guide-next > span { color: #d9c49e; font-size: 10px; text-transform: uppercase; letter-spacing: 1.3px; }
.guide-next > p { margin: 12px 0; font-size: 15px !important; }
.guide-next > a { font-size: 12px; }
.guide-pair { display: grid; grid-template-columns: 1fr 40px 1fr; align-items: center; gap: 15px; margin: 32px 0; padding: 23px; background: #102b20; border: 1px solid #b8c5aa26; border-radius: 12px; }
.guide-pair > div { text-align: center; }
.guide-pair img { display: block; width: 100%; height: 180px; object-fit: contain; margin-bottom: 13px; }
.guide-pair > div > span { font-size: 12px; color: #d1c7a5; }
.guide-pair-arrow { color: #ddbd8a; font-size: 26px; text-align: center; }
.guide-pair figcaption { grid-column: 1/-1; color: #94ac93; text-align: center; font-size: 11px; line-height: 1.7; margin-top: 12px; }
.guide-definitions { margin: 25px 0; }
.guide-definitions > div { padding: 23px 0; border-top: 1px solid #b8c5aa28; scroll-margin-top: 22px; }
.guide-definitions dt { color: #e7dfc1; font: 400 24px/1.35 Georgia,serif; margin-bottom: 10px; }
.guide-definitions dt span { color: #98b197; font: 400 12px Arial,sans-serif; margin-left: 12px; white-space: nowrap; }
.guide-definitions dd { color: #bdcbbd; margin: 0; font-size: 15px; line-height: 1.9; }
.learn-hub .learn-hero { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 25px; padding: 38px 0 42px; background: none; border: 0; border-bottom: 1px solid #b8c5aa28; border-radius: 0; box-shadow: none; }
.learn-hub .learn-hero::after { content: none; }
.learn-hub .learn-hero h1 { font-size: clamp(46px,6vw,73px); line-height: 1.06; margin: 18px 0 22px; }
.learn-hub .learn-hero h1 em { color: #dec29b; font-weight: 400; }
.learn-hub .learn-hero p[itemprop=description] { color: #b3c6ad; max-width: 420px; font-size: 16px; line-height: 1.8; }
.guide-hero-link { display: inline-block; margin-top: 25px; font-size: 12px; }
.guide-hero-art { display: flex; justify-content: center; align-items: center; height: 270px; gap: 4px; }
.guide-hero-art img { width: 29%; height: 205px; object-fit: contain; filter: drop-shadow(0 12px 18px #0004); }
.guide-hero-art img:nth-child(2) { height: 250px; }
.guide-picks { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin: 35px 0 60px; }
.guide-picks > a { position: relative; overflow: hidden; padding: 28px 24px; border: 1px solid #b8c5aa26; border-radius: 12px; background: linear-gradient(145deg,#17382a,#10281f); text-decoration: none; }
.guide-picks img { width: 55px; height: 90px; object-fit: contain; display: block; margin-bottom: 20px; }
.guide-picks span { font-size: 9px; letter-spacing: 1.2px; color: #c9b48c; }
.guide-picks h2 { margin: 14px 0; font: 400 28px/1.2 Georgia,serif; color: #e8e3ca; }
.guide-picks p { margin: 0; font-size: 13px; line-height: 1.8; color: #afc2aa; }
.guide-picks a:hover { border-color: #cbb08888; }
.guide-library-heading h2 { margin: 12px 0 25px; font: 400 32px/1.25 Georgia,serif; color: #e6e5cd; }
.guide-library-list > a { display: grid; grid-template-columns: 185px 1fr 24px; gap: 23px; padding: 24px 0; border-top: 1px solid #b8c5aa28; text-decoration: none; align-items: start; }
.guide-library-list > a > span { font-size: 10px; color: #a8b79a; padding-top: 7px; }
.guide-library-list h3 { color: #e6dfc3; margin: 0 0 8px; font: 400 25px/1.3 Georgia,serif; }
.guide-library-list p { margin: 0; color: #acbfa7; font-size: 13px; line-height: 1.8; }
.guide-library-list b { color: #c5ab82; font-weight: 400; }
.learn-hub .learn-principles { margin-top: 45px; background: transparent; border: 0; border-top: 1px solid #b8c5aa28; border-radius: 0; padding: 27px 0 0; }
.learn-hub .learn-principles h2 { color: #e3dec3; font-size: 24px; }
.learn-hub .learn-principles p { color: #9eb197; font-size: 12px; }
.learn-body a:focus-visible { outline: 2px solid #ddbd8a; outline-offset: 4px; }
@media(max-width:700px) {
  .learn-brand { width: 142px; }
  .learn-nav, .learn-main, .learn-footer { width: calc(100% - 36px); }
  .learn-nav { padding: 20px 0; }
  .learn-nav-links .learn-buy { display: inline-block; font-size: 10px; padding: 8px 10px; }
  .learn-hub .learn-hero { grid-template-columns: 1fr; padding: 12px 0 26px; gap: 14px; }
  .learn-hub .learn-hero h1 { font-size: 52px; }
  .guide-hero-art { height: 165px; justify-content: flex-start; }
  .guide-hero-art img { width: 25%; height: 135px; }
  .guide-hero-art img:nth-child(2) { height: 160px; }
  .guide-picks { grid-template-columns: 1fr; gap: 13px; margin: 26px 0 43px; }
  .guide-picks > a { padding: 22px 105px 22px 22px; }
  .guide-picks img { position: absolute; right: 19px; top: 25px; width: 67px; height: 111px; }
  .guide-picks h2 { font-size: 26px; }
  .guide-library-list > a { grid-template-columns: 1fr 20px; gap: 10px; }
  .guide-library-list > a > span { grid-column: 1/-1; font-size: 9px; }
  .guide-library-list h3 { font-size: 24px; }
  .guide-library-heading h2 { font-size: 28px; }
  .learn-body .learn-article h1 { font-size: 38px; }
  .learn-body .learn-article .learn-deck { font-size: 17px; }
  .learn-body .learn-article p, .learn-body .learn-article li { font-size: 15px; }
  .learn-table th, .learn-table td { padding: 11px; font-size: 12px; }
  .guide-counts { gap: 5px; }
  .guide-counts > div { padding: 12px 3px; }
  .guide-counts span { font-size: 9px; }
  .guide-elements > section { grid-template-columns: 65px minmax(0,1fr); gap: 15px; }
  .guide-elements img { width: 65px; height: 105px; }
  .guide-elements h3 small { display: block; margin: 7px 0 0; }
  .guide-pair { padding: 18px; gap: 8px; }
  .guide-pair img { height: 135px; }
  .guide-pair > div > span { font-size: 10px; }
  .guide-definitions dt { font-size: 23px; }
  .guide-definitions dt span { display: block; margin: 7px 0 0; }
  .guide-definitions dd { font-size: 14px; }
}

.guide-tool { padding: 24px; margin: 28px 0; border: 1px solid #ceb38955; border-radius: 14px; background: #153328; }
.guide-tool h2 { margin-top: 0; }
.guide-tool-form { display: grid; gap: 16px; margin-top: 20px; }
.guide-tool-form label { display: grid; gap: 7px; font-size: 13px; color: #d1dbcb; }
.guide-tool-form input, .guide-tool-form select { width: 100%; min-width: 0; padding: 12px; background: #081e17; color: #eee9d9; border: 1px solid #a6b9a84a; border-radius: 6px; font: inherit; color-scheme: dark; }
.guide-tool-form button { padding: 13px 18px; border-radius: 7px; border: 0; background: #e4c49c; color: #10271e; font: 600 14px/1.5 Arial,sans-serif; cursor: pointer; }
.guide-tool-form button:disabled { opacity: .55; }
.guide-tool-status { color: #edce9e; font-size: 13px; }
.guide-tool-result { border-top: 1px solid #ceb38944; padding-top: 16px; overflow-wrap: anywhere; }
.tool-pillars { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.tool-pillars div { padding: 12px; border: 1px solid #a6b9a833; border-radius: 6px; }
.tool-pillars dt { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: #b9c4b2; }
.tool-pillars dd { margin: 8px 0 0; font-size: 21px; color: #eddfc4; }
.guide-tool [hidden] { display: none !important; }