/* Drop 760: a product's in-depth sections. Brand navy and gold are the variables below. */
.pds-read { --ps-navy: #0F294C; --ps-navy2: #16386A; --ps-gold: #D4A03A; --ps-goldtx: #8C6410; --ps-ink: var(--fg, #0E1B2E); --ps-soft: var(--fg-muted, #5B6780); --ps-line: var(--border, #E1E6EE); --ps-paper: var(--bg, #FFFFFF); --ps-mist: var(--bg-2, #F3F6FA);
  padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 4rem); background: var(--ps-mist); color: var(--ps-ink); scroll-margin-top: calc(var(--header-h, 80px) + 1rem); }
[data-theme="dark"] .pds-read { --ps-goldtx: #E3B45A; --ps-navy2: #4F77B5; }
.pds-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 1.2rem; margin-bottom: 1.8rem; }
.pds-ey { display: inline-flex; align-items: center; gap: .6rem; font-size: .78rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ps-goldtx); }
.pds-read[dir="rtl"] .pds-ey { letter-spacing: 0; } .pds-ey i { width: 26px; height: 1px; background: currentColor; }
.pds-h { margin: .5rem 0 0; font-size: clamp(1.6rem, 2.8vw, 2.3rem); line-height: 1.2; }
.pds-progress { display: grid; gap: .45rem; min-width: 12rem; } .pds-count { font-size: .85rem; color: var(--ps-soft); font-variant-numeric: tabular-nums; text-align: end; } .pds-count b { color: var(--ps-ink); font-size: 1.1rem; }
.pds-bar { display: block; height: 4px; border-radius: 4px; background: var(--ps-line); overflow: hidden; } .pds-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--ps-gold), var(--ps-navy2)); transition: width .45s cubic-bezier(.2,.8,.2,1); }
.pds-read[dir="rtl"] .pds-bar i { margin-inline-start: auto; }
.pds-body { display: grid; grid-template-columns: minmax(14rem, 18rem) minmax(0, 1fr); gap: clamp(1.2rem, 3vw, 2.4rem); align-items: start; }
.pds-body.is-single { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 960px) { .pds-body { grid-template-columns: minmax(0, 1fr); } }
.pds-rail { position: sticky; top: calc(var(--header-h, 80px) + 1rem); }
.pds-rail ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; border-inline-start: 2px solid var(--ps-line); }
.pds-rail a { display: flex; gap: .7rem; align-items: baseline; padding: .6rem .9rem; margin-inline-start: -2px; border-inline-start: 2px solid transparent; color: var(--ps-soft); text-decoration: none; font-size: .92rem; line-height: 1.4; transition: color .2s, border-color .2s, background .2s; border-radius: 0 10px 10px 0; }
.pds-read[dir="rtl"] .pds-rail a { border-radius: 10px 0 0 10px; }
.pds-rail a:hover { color: var(--ps-ink); background: color-mix(in srgb, var(--ps-gold) 6%, transparent); }
.pds-rail a[aria-current="true"] { color: var(--ps-ink); font-weight: 600; border-inline-start-color: var(--ps-gold); background: var(--ps-paper); }
.pds-rn { font-variant-numeric: tabular-nums; font-size: .78rem; color: var(--ps-goldtx); font-weight: 600; }
@media (max-width: 960px) { .pds-rail { position: static; } .pds-rail ol { display: flex; overflow-x: auto; border: 0; gap: .4rem; padding-bottom: .4rem; scrollbar-width: thin; }
  .pds-rail a { white-space: nowrap; border: 1px solid var(--ps-line); border-radius: 999px !important; margin: 0; background: var(--ps-paper); } .pds-rail a[aria-current="true"] { border-color: var(--ps-gold); } }
.pds-sec { background: var(--ps-paper); border: 1px solid var(--ps-line); border-radius: 20px; padding: clamp(1.4rem, 3vw, 2.4rem); scroll-margin-top: calc(var(--header-h, 80px) + 1rem); }
.pds-sec + .pds-sec { margin-top: 1.2rem; } .pds-sec:focus { outline: none; }
.pds-read.is-js[data-mode="paged"] .pds-sec:not(.is-on) { display: none; }
.pds-read.is-js[data-mode="paged"] .pds-sec.is-on { animation: pds-in .45s cubic-bezier(.2,.8,.2,1); }
.pds-read.is-js[data-mode="paged"] .pds-sec + .pds-sec { margin-top: 0; }
@keyframes pds-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.pds-sec-in { display: grid; gap: clamp(1.2rem, 3vw, 2.4rem); align-items: center; }
.pds-l-image_end .pds-sec-in { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); } .pds-l-image_start .pds-sec-in { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } .pds-l-image_start .pds-fig { order: -1; }
@media (max-width: 800px) { .pds-l-image_end .pds-sec-in, .pds-l-image_start .pds-sec-in { grid-template-columns: minmax(0, 1fr); } .pds-l-image_start .pds-fig { order: 0; } }
.pds-fig { margin: 0; } .pds-fig img { width: 100%; height: auto; border-radius: 14px; display: block; box-shadow: 0 18px 40px rgba(15,41,76,.12); }
.pds-num { display: block; font-size: 2.6rem; font-weight: 800; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px color-mix(in srgb, var(--ps-gold) 70%, transparent); margin-bottom: .6rem; font-variant-numeric: tabular-nums; }
.pds-sey { display: block; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ps-goldtx); margin-bottom: .3rem; } .pds-read[dir="rtl"] .pds-sey { letter-spacing: 0; }
.pds-st { margin: 0 0 .9rem; font-size: clamp(1.3rem, 2.2vw, 1.75rem); line-height: 1.3; }
.pds-text { line-height: 1.8; color: var(--ps-ink); } .pds-text > :first-child { margin-top: 0; } .pds-text > :last-child { margin-bottom: 0; }
.pds-text h2, .pds-text h3 { font-size: 1.1rem; margin: 1.3em 0 .4em; } .pds-text ul, .pds-text ol { padding-inline-start: 1.3em; } .pds-text li { margin: .3em 0; }
.pds-text img { max-width: 100%; height: auto; border-radius: 10px; }
.pds-l-highlight .pds-sec, .pds-sec.pds-l-highlight { background: var(--ps-navy); border-color: var(--ps-navy); color: #FFFFFF; box-shadow: inset 4px 0 0 var(--ps-gold); }
.pds-read[dir="rtl"] .pds-sec.pds-l-highlight { box-shadow: inset -4px 0 0 var(--ps-gold); }
.pds-sec.pds-l-highlight .pds-text, .pds-sec.pds-l-highlight .pds-st { color: #FFFFFF; } .pds-sec.pds-l-highlight .pds-sey { color: var(--ps-gold); }
.pds-steps { list-style: none; margin: 1.2rem 0 0; padding: 0; display: grid; gap: 1rem; position: relative; }
.pds-steps li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1rem; position: relative; }
.pds-steps li:not(:last-child)::after { content: ""; position: absolute; top: 40px; bottom: -1rem; inset-inline-start: 17px; width: 2px; background: linear-gradient(var(--ps-gold), var(--ps-line)); }
.pds-sn { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; color: var(--ps-navy); background: color-mix(in srgb, var(--ps-gold) 22%, var(--ps-paper)); border: 2px solid var(--ps-gold); position: relative; z-index: 1; }
.pds-steps b { display: block; margin: .35rem 0 .2rem; } .pds-steps li > div { line-height: 1.7; color: var(--ps-soft); } .pds-steps li > div b { color: var(--ps-ink); }
.pds-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: .9rem; margin-top: 1.2rem; }
.pds-card { padding: 1.1rem 1.15rem; border-radius: 14px; border: 1px solid var(--ps-line); background: var(--ps-mist); line-height: 1.65; color: var(--ps-soft); transition: transform .25s, border-color .25s; }
.pds-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--ps-gold) 55%, var(--ps-line)); }
.pds-card b { display: block; color: var(--ps-ink); margin: .55rem 0 .25rem; font-size: 1rem; }
.pds-ci { display: block; width: 28px; height: 28px; border-radius: 8px; background: linear-gradient(135deg, var(--ps-gold), var(--ps-navy2)); }
.pds-pager { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 1rem; align-items: center; margin-top: 1.2rem; }
.pds-btn { display: grid; gap: .15rem; padding: .8rem 1.1rem; border-radius: 14px; border: 1px solid var(--ps-line); background: var(--ps-paper); color: var(--ps-ink); font: inherit; cursor: pointer; text-align: start; transition: border-color .2s, transform .2s; min-width: 0; }
.pds-btn.next { text-align: end; justify-self: end; } .pds-btn.prev { justify-self: start; }
.pds-btn:hover:not(:disabled) { border-color: var(--ps-gold); transform: translateY(-2px); } .pds-btn:disabled { opacity: .35; cursor: default; }
.pds-bl { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ps-goldtx); } .pds-read[dir="rtl"] .pds-bl { letter-spacing: 0; }
.pds-btn.prev .pds-bl::before { content: "← "; } .pds-btn.next .pds-bl::after { content: " →"; }
.pds-read[dir="rtl"] .pds-btn.prev .pds-bl::before { content: "→ "; } .pds-read[dir="rtl"] .pds-btn.next .pds-bl::after { content: " ←"; }
.pds-bn { font-weight: 600; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 18rem; }
.pds-dots { display: flex; gap: .35rem; } .pds-dots i { width: 8px; height: 8px; border-radius: 50%; background: var(--ps-line); transition: width .3s, background .3s; } .pds-dots i.on { width: 22px; border-radius: 6px; background: var(--ps-gold); }
@media (max-width: 640px) { .pds-pager { grid-template-columns: 1fr 1fr; } .pds-dots { display: none; } .pds-bn { max-width: 9rem; } }
@media (prefers-reduced-motion: reduce) { .pds-read * { animation: none !important; transition: none !important; } }
@media print { .pds-read .pds-sec { display: block !important; } .pds-rail, .pds-pager, .pds-progress { display: none !important; } }
/* Drop 768: more layouts, looks, image styles and a button */
.pds-icon { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; margin-bottom: .7rem; color: var(--ps-navy2); background: color-mix(in srgb, var(--ps-gold) 16%, var(--ps-paper)); border: 1px solid color-mix(in srgb, var(--ps-gold) 40%, transparent); }
.pds-t-tint { background: color-mix(in srgb, var(--ps-gold) 7%, var(--ps-paper)); }
.pds-t-outline { background: transparent; border-width: 1.5px; }
.pds-t-gold { box-shadow: inset 4px 0 0 var(--ps-gold); } .pds-read[dir="rtl"] .pds-t-gold { box-shadow: inset -4px 0 0 var(--ps-gold); }
.pds-sec.pds-t-navy { background: var(--ps-navy); border-color: var(--ps-navy); color: #FFFFFF; box-shadow: inset 4px 0 0 var(--ps-gold); }
.pds-read[dir="rtl"] .pds-sec.pds-t-navy { box-shadow: inset -4px 0 0 var(--ps-gold); }
.pds-sec.pds-t-navy .pds-text, .pds-sec.pds-t-navy .pds-st, .pds-sec.pds-t-navy .pds-stat dt { color: #FFFFFF; } .pds-sec.pds-t-navy .pds-sey { color: var(--ps-gold); }
.pds-sec.pds-t-navy .pds-card, .pds-sec.pds-t-navy .pds-acc details { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.14); color: rgba(255,255,255,.8); }
.pds-sec.pds-t-navy .pds-card b, .pds-sec.pds-t-navy .pds-acc summary, .pds-sec.pds-t-navy .pds-steps b, .pds-sec.pds-t-navy .pds-stat dd { color: #FFFFFF; }
.pds-sec.pds-t-navy .pds-icon { color: var(--ps-gold); background: rgba(255,255,255,.08); }
.pds-is-shadow .pds-fig img { box-shadow: 0 24px 50px rgba(15,41,76,.22); }
.pds-is-plain .pds-fig img { border-radius: 0; box-shadow: none; }
.pds-is-framed .pds-fig { padding: 10px; border-radius: 18px; background: linear-gradient(145deg, var(--ps-navy), var(--ps-navy2)); box-shadow: 0 20px 44px rgba(15,41,76,.25); }
.pds-is-framed .pds-fig img { border-radius: 10px; box-shadow: none; }
.pds-is-rounded .pds-fig img { box-shadow: none; }
.pds-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: 1rem; margin: 1.3rem 0 0; }
.pds-stat { padding: 1.1rem 1.2rem; border-radius: 14px; border: 1px solid var(--ps-line); background: var(--ps-mist); }
.pds-stat dt { font-size: clamp(1.7rem, 3vw, 2.3rem); font-weight: 800; line-height: 1.1; color: var(--ps-navy2); font-variant-numeric: tabular-nums; }
.pds-stat dd { margin: .35rem 0 0; color: var(--ps-soft); line-height: 1.5; }
.pds-acc { display: grid; gap: .6rem; margin-top: 1.2rem; }
.pds-acc details { border: 1px solid var(--ps-line); border-radius: 12px; background: var(--ps-mist); padding: 0 1.1rem; }
.pds-acc summary { cursor: pointer; font-weight: 600; padding: .9rem 0; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.pds-acc summary::-webkit-details-marker { display: none; }
.pds-acc summary::after { content: "+"; font-size: 1.2rem; line-height: 1; color: var(--ps-goldtx); transition: transform .2s; } .pds-acc details[open] summary::after { transform: rotate(45deg); }
.pds-acc-a { padding: 0 0 1rem; color: var(--ps-soft); line-height: 1.7; }
.pds-quote { margin: .4rem 0 0; padding-inline-start: 1.4rem; border-inline-start: 3px solid var(--ps-gold); }
.pds-quote .pds-text { font-size: clamp(1.1rem, 1.8vw, 1.35rem); line-height: 1.7; font-style: italic; } .pds-read[dir="rtl"] .pds-quote .pds-text { font-style: normal; }
.pds-quote footer { margin-top: .8rem; font-weight: 600; color: var(--ps-goldtx); } .pds-quote footer::before { content: "— "; }
.pds-l-video .pds-sec-in { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } @media (max-width: 800px) { .pds-l-video .pds-sec-in { grid-template-columns: minmax(0, 1fr); } }
.pds-video { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 18px 40px rgba(15,41,76,.18); }
.pds-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.pds-gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); gap: .7rem; margin-top: 1.2rem; }
.pds-gi { display: block; aspect-ratio: 4 / 3; border-radius: 12px; overflow: hidden; border: 1px solid var(--ps-line); }
.pds-gi img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; } .pds-gi:hover img { transform: scale(1.04); }
.pds-cta { margin: 1.3rem 0 0; } .pds-link { font-weight: 700; color: var(--ps-goldtx); text-decoration: none; } .pds-link::after { content: " →"; } .pds-read[dir="rtl"] .pds-link::after { content: " ←"; }
.pds-zoom { position: fixed; inset: 0; z-index: 2000; background: rgba(6,19,38,.92); display: grid; place-items: center; padding: 2rem; cursor: zoom-out; }
.pds-zoom img { max-width: min(1200px, 100%); max-height: 88vh; border-radius: 10px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
