/* Test catalog only. Deliberately non-interactive material direction cards. */
.container.catalog-experiment-container{width:calc(100% - 64px);max-width:1400px;padding:0}
.catalog-experiment-container>.content-wrapper{margin:0}
.catalog-experiment-container>.content-wrapper>.col-md-12{padding:0;float:none;width:100%;min-width:0}
.catalog-fifteen{padding:30px 0 56px;color:#1f2b33;font-family:Arial,Helvetica,sans-serif}
.catalog-fifteen *{box-sizing:border-box}
.catalog-fifteen__heading{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin:0 0 20px}
.catalog-fifteen__heading h1{font:600 36px/1.15 'Fira Sans Extra Condensed',Arial,sans-serif;margin:0;color:#1f2b33}
.catalog-fifteen__count{font-size:14px;line-height:1.4;color:#677575}
.catalog-fifteen__navigation{border:1px solid #dfe6e3;border-radius:10px;background:#f7f9f8;margin:0 0 24px}
.catalog-fifteen__navigation summary{display:flex;align-items:center;justify-content:space-between;gap:18px;list-style:none;padding:15px 21px;cursor:pointer;font-size:16px;font-weight:600;color:#184d44}
.catalog-fifteen__navigation summary::-webkit-details-marker{display:none}
.catalog-fifteen__navigation summary i{font-size:22px}
.catalog-fifteen__navigation[open] summary i{transform:rotate(180deg)}
.catalog-fifteen__navigation summary:focus-visible,.catalog-fifteen__navigation a:focus-visible{outline:2px solid #b38228;outline-offset:3px}
.catalog-fifteen__navigation nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px;border-top:1px solid #dfe6e3;margin:0 21px;padding:13px 0 18px}
.catalog-fifteen__navigation a{display:flex;align-items:baseline;gap:12px;padding:9px 6px;color:#25483f;font-size:15px;line-height:1.45;text-decoration:none;border-radius:4px}
.catalog-fifteen__navigation a span{color:#856322;font-size:13px;font-variant-numeric:tabular-nums;min-width:20px}
.catalog-fifteen__navigation a:hover{background:#eaf0ed;color:#143b30}
.catalog-fifteen__list{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.finish-direction{--finish-rgb:20,29,32;--finish-accent:#efc27d;position:relative;isolation:isolate;display:flex;align-items:center;min-height:420px;min-width:0;overflow:hidden;border-radius:12px;background:rgb(var(--finish-rgb));color:#fff;box-shadow:0 10px 25px #1c312f10;scroll-margin-top:125px;cursor:default}
.finish-direction--wood{--finish-rgb:36,24,14}
.finish-direction--teal{--finish-rgb:9,35,38}
.finish-direction--slate{--finish-rgb:17,29,41}
.finish-direction--forest{--finish-rgb:6,27,23}
.finish-direction--plum{--finish-rgb:36,25,34}
.finish-direction__image{position:absolute;inset:0;z-index:-2;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:right center}
.finish-direction:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(var(--finish-rgb),.99) 0%,rgba(var(--finish-rgb),.94) 32%,rgba(var(--finish-rgb),.81) 49%,rgba(var(--finish-rgb),.20) 70%,transparent 87%)}
.finish-direction__copy{width:62%;max-width:865px;padding:34px 40px}
.finish-direction h2{font:500 clamp(28px,2.5vw,38px)/1.16 Arial,Helvetica,sans-serif;letter-spacing:-.55px;margin:0 0 15px;color:#fff;overflow-wrap:break-word;text-wrap:balance}
.finish-direction__tagline{font:600 clamp(23px,2vw,29px)/1.22 'Fira Sans Extra Condensed',Arial,sans-serif;color:var(--finish-accent);margin:0 0 18px;max-width:660px;text-wrap:balance}
.finish-direction__description{font-size:16px;line-height:1.65;color:#e8eceb;margin:0 0 24px;max-width:660px}
.finish-direction__benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0}
.finish-direction__benefits li{display:flex;align-items:center;gap:10px;min-width:0}
.finish-direction__benefits li+li{border-left:1px solid #ffffff35;padding-left:12px}
.finish-direction__benefits i{display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border:1px solid var(--finish-accent);border-radius:50%;font-size:18px;color:var(--finish-accent)}
.finish-direction__benefits span{font-size:14px;line-height:1.45;color:#eef1ef;overflow-wrap:break-word}
@media(max-width:1199px){.container.catalog-experiment-container{width:calc(100% - 48px)}.finish-direction__copy{width:69%;padding:30px}.finish-direction__benefits li{align-items:flex-start;flex-direction:column;gap:8px}.finish-direction__description{line-height:1.6}}
@media(max-width:767px){.container.catalog-experiment-container{width:calc(100% - 32px)}.catalog-fifteen{padding:22px 0 36px}.catalog-fifteen__heading{align-items:flex-start;flex-direction:column;gap:7px;margin-bottom:17px}.catalog-fifteen__heading h1{font-size:32px}.catalog-fifteen__navigation{margin-bottom:20px}.catalog-fifteen__navigation nav{grid-template-columns:minmax(0,1fr);margin:0 16px}.catalog-fifteen__navigation summary{padding:14px 16px}.catalog-fifteen__list{gap:20px}.finish-direction{display:block;min-height:0;scroll-margin-top:110px}.finish-direction__copy{width:100%;max-width:none;padding:25px 24px 248px}.finish-direction h2{font-size:28px;line-height:1.18;letter-spacing:-.4px;margin-bottom:13px}.finish-direction__tagline{font-size:25px;margin-bottom:16px}.finish-direction__description{margin-bottom:21px}.finish-direction__image{inset:auto 0 0;height:230px;object-position:right center}.finish-direction:before{background:linear-gradient(to bottom,rgb(var(--finish-rgb)) 0%,rgb(var(--finish-rgb)) calc(100% - 229px),rgba(var(--finish-rgb),.30) calc(100% - 172px),transparent calc(100% - 100px))}.finish-direction__benefits{grid-template-columns:minmax(0,1fr);gap:10px}.finish-direction__benefits li{flex-direction:row;align-items:center;gap:10px}.finish-direction__benefits li+li{border:0;padding-left:0}.finish-direction__benefits i{flex-basis:30px;width:30px;height:30px;font-size:16px}}
@media(max-width:380px){.finish-direction__copy{padding-left:19px;padding-right:19px}.finish-direction h2{font-size:26px}.catalog-fifteen__count{font-size:14px}}
@media(prefers-reduced-motion:no-preference){html:has(.catalog-fifteen){scroll-behavior:smooth}}

/* Only published material directions have a real link. */
.finish-direction--linked{cursor:pointer}
.finish-direction__link{display:inline-flex;align-items:center;gap:16px;margin-top:24px;color:var(--finish-accent)!important;font-size:15px;font-weight:600;text-decoration:none!important}
.finish-direction__link span{font-size:22px;line-height:1}
.finish-direction__link:after{content:'';position:absolute;inset:0;border-radius:12px}
.finish-direction--linked:hover .finish-direction__link{text-decoration:underline!important;text-underline-offset:5px}
.finish-direction--linked:focus-within{outline:3px solid #b38228;outline-offset:4px}
