/* Vertical product discovery and editorial motion. */
.directory-navigation{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:sticky;top:89px;z-index:12;gap:0;border:1px solid #4b575c;border-radius:8px;background:#1b2327f5;backdrop-filter:blur(16px);scroll-margin-top:115px;margin-bottom:30px}
.directory-navigation a{display:flex;align-items:center;gap:15px;padding:21px 20px;color:#abb9be;font-size:14px;border-bottom:2px solid transparent;transition:color .25s,border-color .25s;min-width:0}
.directory-navigation a span{font-size:10px;color:var(--lime)}.directory-navigation a.is-current{color:var(--lime);border-bottom-color:var(--lime)}
.directory-product{scroll-margin-top:190px;padding:40px 0 55px;--product-progress:0}
.directory-product-top{display:flex;align-items:center;gap:22px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#b7c4c7;margin-bottom:20px}
.directory-product-top>span:first-child{color:var(--lime)}.directory-rule{height:1px;flex:1;background:#455158;position:relative;overflow:hidden}.directory-rule:after{content:'';height:1px;background:var(--lime);position:absolute;inset:0;transform:scaleX(var(--product-progress));transform-origin:left}
.directory-product-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);border:1px solid #4b575c;border-radius:18px;overflow:hidden;background:#20272c;transition:border-color .4s}
.directory-product.is-current .directory-product-grid{border-color:#81915c}
.directory-product-visual{display:flex;align-items:center;min-width:0;background:#171e22;position:relative;overflow:hidden;min-height:430px}
.directory-product-visual .product-showcase-photo{width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;transform:scale(calc(.98 + var(--product-progress)*.02));transition:transform .15s linear}
.directory-product-visual .product-photo-empty{min-height:430px}
.directory-photo-corner{position:absolute;right:20px;bottom:20px;background:#151b1fcc;border:1px solid #ffffff50;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:var(--lime);font-size:22px}
.directory-product-copy{padding:clamp(26px,3vw,46px);display:flex;flex-direction:column;border-left:1px solid #4b575c;min-width:0}
.directory-product-copy>.eyebrow{color:var(--lime);margin-bottom:20px}.directory-product-copy h2{font-size:clamp(40px,4.2vw,66px);line-height:1;margin-bottom:13px}.directory-product-copy .showcase-cta{margin-top:auto}
.js .directory-product-grid{opacity:.35;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease),border-color .4s}.js .directory-product.is-revealed .directory-product-grid{opacity:1;transform:none}
.principle{position:relative}.principle:before{content:'';position:absolute;left:0;top:-1px;width:100%;height:2px;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease)}.principle.is-reading:before{transform:scaleX(1)}
.principle h2{font-size:clamp(40px,4.5vw,69px);line-height:1.05;text-wrap:balance}.principle-number{position:sticky;top:120px}
.write-description .writing-word{display:inline-block}.js .write-description .writing-word{opacity:.2;transition:opacity .28s linear}.js .write-description.is-written .writing-word{opacity:1;transition-delay:calc(var(--word)*26ms)}
.contact-process{display:grid;gap:10px;margin:0 0 32px;padding:20px 0;border-block:1px solid #20262b40;font-size:12px;max-width:380px}
.contact-section .quote-fields[hidden]{display:none}.quote-fields{padding:18px;border:1px solid #20262b45;border-radius:8px;background:#fff2}
.quote-help{font-size:11px;line-height:1.65;margin-top:14px}.contact-section .form-note a{text-decoration:underline;text-underline-offset:3px}
.contact-section .attachments{position:relative;border:1px dashed #20262b80;border-radius:8px;padding:18px;background:#fff2;transition:background .2s}.contact-section .attachments.is-dragging{background:#ffffff99;border-style:solid}
.attachment-label{display:flex!important;flex-direction:row;align-items:center;gap:16px!important;cursor:pointer}.attachment-label>span:first-child{font-size:30px}.attachment-label strong{display:block;font-size:14px;font-weight:600}.attachment-label small{display:block;font-size:11px;margin-top:4px}
.contact-section input[type=file]{border:0;background:none;padding:14px 0 0;font-size:12px}.contact-section input[type=file]::file-selector-button{border:1px solid #20262b70;background:transparent;color:#20262b;padding:7px 12px;margin-right:12px;border-radius:4px;cursor:pointer}
.attachments #file-help{font-size:10px;line-height:1.6;margin-top:12px;max-width:420px}.attachment-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.attachment-list:not(:empty){margin-top:15px}.attachment-list li{display:flex;justify-content:space-between;gap:12px;align-items:center;border-top:1px solid #20262b30;padding-top:9px;font-size:11px}.attachment-list li span{overflow-wrap:anywhere}.attachment-list button{background:#20262b;color:#f1f4ef;border-radius:50%;flex:0 0 30px;height:30px;font-size:18px}
.form-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.contact-section button:disabled{opacity:.65;cursor:wait}.contact-section .form-status:not(:empty){padding:15px;border:1px solid #20262b66;border-radius:5px;font-size:13px}.contact-section .form-status.is-error{background:#fff7}
@media(max-width:1000px){.directory-product-grid{grid-template-columns:1.1fr 1fr}.directory-product-copy{padding:25px}.directory-product-copy h2{font-size:43px}.directory-navigation a{font-size:12px;padding:18px 13px;gap:10px}.contact-section{column-gap:6%}.principle h2{font-size:57px}}
@media(max-width:760px){.directory-navigation{top:89px;margin:0 -4px 14px;border-radius:6px}.directory-navigation a{flex-direction:column;align-items:flex-start;gap:8px;font-size:11px;padding:13px 10px}.directory-product{padding:25px 0;scroll-margin-top:180px}.directory-product-grid{grid-template-columns:1fr}.directory-product-visual{min-height:0;aspect-ratio:3/2}.directory-product-visual .product-photo-empty{min-height:0;height:100%}.directory-product-copy{border-left:0;border-top:1px solid #4b575c;padding:27px}.directory-product-copy h2{font-size:46px}.directory-product-top{font-size:8px;gap:16px}.principle-number{position:static}.principle h2{font-size:clamp(35px,9.5vw,58px)}.quote-fields .form-two{grid-template-columns:1fr;gap:16px}.contact-process{font-size:11px}}
@media(max-width:600px){.directory-navigation{top:73px}.contact-copy h2{font-size:clamp(50px,13vw,70px)}.contact-section .contact-form-wrap{padding-top:0}.contact-section .form-two{grid-template-columns:1fr;gap:18px}.directory-product-copy{padding:23px}.directory-product-copy h2{font-size:40px}}
@media(max-width:360px){.directory-navigation a{font-size:9px;padding:12px 8px}.directory-product-copy h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){.js .directory-product-grid{opacity:1;transform:none;transition:none}.directory-product-visual .product-showcase-photo{transform:none;transition:none}.js .write-description .writing-word{opacity:1;transition:none}.principle:before{transition:none}}
@media print{.js .write-description .writing-word,.js .directory-product-grid{opacity:1;transform:none}.directory-navigation{position:static}}

/* Useful next steps alongside answers, with native accessible disclosure. */
.faq-related{display:inline-flex;align-items:center;min-height:44px;margin:0 0 18px;color:inherit;font-size:13px;text-underline-offset:5px;font-weight:500}.faq-related:after{content:"↗";margin-left:10px}.faq-related:focus-visible{outline:2px solid currentColor;outline-offset:4px}.faq-list details,.catalog-faq-list details{scroll-margin-top:110px}

/* Keep vertical spacing intrinsic: percentage row gaps overflow auto-height grids. */
.contact-section{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:44px}
.contact-section>*{min-width:0}
.contact-section .form-status:empty{display:none}
.contact-section .button[type=submit]{width:100%;min-height:60px;border-radius:4px}
.contact-section .privacy-checkbox{line-height:1.65}
.contact-section .contact-direct{overflow-wrap:anywhere}
.footer-linkedin{display:flex;align-items:center;gap:11px;width:fit-content;min-height:44px;margin-top:22px;font-size:13px;color:var(--paper)}
.footer-linkedin svg{width:23px;height:23px;flex:none;color:var(--lime)}
.footer-linkedin>span:last-child{margin-left:12px;color:var(--lime)}
.footer-linkedin:hover{text-decoration:underline;text-underline-offset:5px}
@media(max-width:850px){.contact-section{grid-template-columns:minmax(0,1fr);row-gap:40px;padding-bottom:64px}.contact-form-wrap{width:100%}}
@media(max-width:600px){.contact-section{row-gap:32px}.contact-section input[type=file]{max-width:100%}.contact-section .form-note,.attachments #file-help{font-size:12px}.contact-section .privacy-checkbox{font-size:13px}}

.motion-offscreen .kinetic-line,.motion-offscreen .clients-track,.page-inactive .kinetic-line,.page-inactive .clients-track{animation-play-state:paused!important}

.legal-translation-note{max-width:950px;border-left:3px solid var(--lime);padding:15px 22px;margin-top:32px;background:#ffffff08;color:#c9d3d5;font-size:13px;line-height:1.8}.legal-translation-note strong{color:var(--paper)}.legal-translation-note a{display:inline-block;color:var(--lime);text-decoration:underline;text-underline-offset:4px;margin-left:5px}

/* Mobile headings remain fully readable, including when Safari skips an offscreen step animation. */
@media(max-width:850px){.js .write-on .write-word,.js .write-on.is-written .write-word{opacity:1!important;animation:none!important;transition:none!important}}