.ftcl-color-designers {
    --ink: #211f20;
    --dust: #998484;
    --dust-dark: #735f65;
    --line: #d8cccc;
    --paper: #f3efed;
    --cream: #ddd0c1;
    --rust: #9a5f52;
    --blue: #4b70a6;
    --olive: #536647;
    max-width: 1260px;
    margin: 0 auto;
    color: var(--ink);
    font-family: Abel, Arial, sans-serif;
}

.ftcl-color-designers * { box-sizing: border-box; }
.ftcl-color-designers h1,
.ftcl-color-designers h2,
.ftcl-color-designers h3,
.ftcl-color-designers b,
.ftcl-color-designers-card strong,
.ftcl-color-designers-toolkit strong { font-family: Oswald, Impact, sans-serif; }

.ftcl-color-designers-page,
.ftcl-color-designers-page #page-container,
.ftcl-color-designers-page #et-main-area,
.ftcl-color-designers-page #main-content { background: #fff !important; }
.ftcl-color-designers-page #main-content .container { max-width: none; padding-top: 54px !important; }
.ftcl-color-designers-page #main-content .container::before { display: none !important; }
.ftcl-color-designers-page .entry-title { display: none !important; }
.ftcl-color-designers-page .entry-content { padding-top: 0 !important; }

.ftcl-color-designers-hero {
    display: grid;
    grid-template-columns: 43% 57%;
    min-height: 430px;
    overflow: hidden;
    background: var(--ink);
}
.ftcl-color-designers-hero-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    padding: 50px 44px 54px 64px;
    color: #fff;
}
.ftcl-color-designers-eyebrow,
.ftcl-color-designers-kicker {
    margin: 0;
    color: var(--dust);
    font: 600 13px/1.2 Oswald, Impact, sans-serif;
    letter-spacing: .16em;
}
.ftcl-color-designers-hero h1 {
    max-width: 100%;
    margin: 13px 0 18px;
    color: #fff;
    font-size: clamp(46px, 4.25vw, 68px);
    line-height: 1.08;
    letter-spacing: -.027em;
}
.ftcl-color-designers-hero-copy > p:last-child {
    max-width: 455px;
    margin: 0;
    color: #eee7e8;
    font-size: 18px;
    line-height: 1.4;
}
.ftcl-color-designers-hero-image {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    background: #2a2527;
}
.ftcl-color-designers-hero-image > img,
.ftcl-color-designers-hero-image > .ftcl-media-frame,
.ftcl-color-designers-hero-image > .ftcl-media-frame > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.ftcl-color-designers-principle {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    align-items: center;
    gap: 26px;
    padding: 20px 52px;
    background: #78676c;
    color: #fff;
}
.ftcl-color-designers-principle strong { font: 600 13px Oswald, Impact, sans-serif; letter-spacing: .06em; }
.ftcl-color-designers-principle p { margin: 0; color: #f5eff0; font-size: 15px; line-height: 1.4; }

.ftcl-color-designers-index {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 24px 10px 10px;
    border-right: 1px solid var(--line);
    border-left: 1px solid var(--line);
    background: #fff;
}
.ftcl-color-designers-card {
    display: block;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink) !important;
    text-decoration: none !important;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.ftcl-color-designers-card:hover,
.ftcl-color-designers-card:focus-visible { transform: translateY(-2px); border-color: var(--dust); box-shadow: 0 6px 16px rgba(33,31,32,.12); }
.ftcl-color-designers-card-visual { display: grid; grid-template-columns: repeat(4,1fr); height: 76px; }
.ftcl-color-designers-card-visual i { background: var(--c1); }
.ftcl-color-designers-card-visual i:nth-child(2) { background: var(--c2); }
.ftcl-color-designers-card-visual i:nth-child(3) { background: var(--c3); }
.ftcl-color-designers-card-visual i:nth-child(4) { background: var(--c4); }
.ftcl-color-designers-card-copy { display: grid; grid-template-columns: 27px minmax(0, 1fr); padding: 10px 11px 11px; }
.ftcl-color-designers-card-copy b { grid-row: 1 / span 2; color: var(--dust); font-size: 13px; }
.ftcl-color-designers-card-copy strong { min-width: 0; font-size: 14px; line-height: 1.16; text-transform: uppercase; }
.ftcl-color-designers-card-copy small { margin-top: 3px; overflow: hidden; color: #806f73; font-size: 12px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.ftcl-color-designers-card-brief { --c1:#2e282b;--c2:#9a5f52;--c3:#ddd0c1;--c4:#4b70a6; }
.ftcl-color-designers-card-roles { --c1:#2e282b;--c2:#2e282b;--c3:#9a5f52;--c4:#ddd0c1; }
.ftcl-color-designers-card-ratio { --c1:#ddd0c1;--c2:#ddd0c1;--c3:#2e282b;--c4:#4b70a6; }
.ftcl-color-designers-card-axes { --c1:#c46a42;--c2:#5e76a3;--c3:#d9d1cd;--c4:#29262a; }
.ftcl-color-designers-card-architecture { --c1:#2e282b;--c2:#536647;--c3:#9a5f52;--c4:#c7a75a; }
.ftcl-color-designers-card-material { --c1:#ba777c;--c2:#d29aa0;--c3:#9d6268;--c4:#c2858c; }
.ftcl-color-designers-card-placement { --c1:#302a2e;--c2:#9a5f52;--c3:#ddd0c1;--c4:#302a2e; }
.ftcl-color-designers-card-print { --c1:#ddd0c1;--c2:#9a5f52;--c3:#302a2e;--c4:#9a5f52; }
.ftcl-color-designers-card-colorways { --c1:#9a5f52;--c2:#4b70a6;--c3:#536647;--c4:#302a2e; }
.ftcl-color-designers-card-range { --c1:#302a2e;--c2:#ddd0c1;--c3:#9a5f52;--c4:#536647; }
.ftcl-color-designers-card-production { --c1:#d7d7d5;--c2:#a8a8a4;--c3:#ba777c;--c4:#5a5557; }
.ftcl-color-designers-card-handoff { --c1:#998484;--c2:#f3efed;--c3:#211f20;--c4:#998484; }

.ftcl-color-designers-section {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    border: 1px solid var(--line);
    border-top: 0;
    background: #fff;
    scroll-margin-top: 120px;
}
.ftcl-color-designers-number {
    padding-top: 35px;
    border-right: 1px solid var(--line);
    color: var(--dust);
    font: 600 17px/1 Oswald, Impact, sans-serif;
    text-align: center;
}
.ftcl-color-designers-copy { min-width: 0; padding: 34px 64px 39px; }
.ftcl-color-designers h2 { margin: 10px 0 17px; font-size: 36px; line-height: 1.08; letter-spacing: -.025em; }
.ftcl-color-designers h3 { margin: 0; font-size: 15px; line-height: 1.2; }
.ftcl-color-designers-copy > p { margin: 0 0 14px; font-size: 17px; line-height: 1.52; }
.ftcl-color-designers-copy a,
.ftcl-color-designers-sources a,
.ftcl-color-designers-foot a { color: var(--dust-dark); text-decoration: underline; text-underline-offset: 2px; }
.ftcl-color-designers-note { padding: 14px 16px; border-left: 5px solid var(--dust); background: var(--paper); font-size: 15px !important; line-height: 1.42 !important; }
.ftcl-color-designers-note strong { font: 600 13px Oswald, Impact, sans-serif; letter-spacing: .035em; }

.ftcl-color-designers-brief-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; margin: 18px 0; }
.ftcl-color-designers-brief-grid article { min-height: 142px; padding: 15px 13px; border-top: 6px solid var(--dust); background: var(--paper); }
.ftcl-color-designers-brief-grid article:nth-child(2) { border-color: var(--rust); }
.ftcl-color-designers-brief-grid article:nth-child(3) { border-color: var(--blue); }
.ftcl-color-designers-brief-grid article:nth-child(4) { border-color: var(--olive); }
.ftcl-color-designers-brief-grid article:nth-child(5) { border-color: #c7a75a; }
.ftcl-color-designers-brief-grid b { font-size: 12px; line-height: 1.15; }
.ftcl-color-designers-brief-grid p { margin: 9px 0 0; font-size: 13px; line-height: 1.35; }
.ftcl-color-designers-tool-note { display: grid; grid-template-columns: 180px minmax(0,1fr); align-items: center; gap: 17px; margin: 17px 0 2px; padding: 15px 18px; background: #292627; color: #fff; }
.ftcl-color-designers-tool-note > span { font: 600 13px Oswald, Impact, sans-serif; letter-spacing: .07em; }
.ftcl-color-designers-tool-note p { margin: 0; color: #eee7e8; font-size: 14px; line-height: 1.4; }
.ftcl-color-designers-tool-note a { color: #fff !important; font-weight: 700; }

.ftcl-color-designers-role-bar { display: flex; min-height: 128px; margin: 19px 0; overflow: hidden; }
.ftcl-color-designers-role-bar span { display: flex; width: var(--w); min-width: 0; flex-direction: column; justify-content: flex-end; padding: 12px 10px; background: var(--c); color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.45); }
.ftcl-color-designers-role-bar span:nth-child(3) { color: #302b2c; text-shadow: none; }
.ftcl-color-designers-role-bar b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.ftcl-color-designers-role-bar small { font-size: 11px; }
.ftcl-color-designers-role-definitions { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 15px 0; }
.ftcl-color-designers-role-definitions article { padding: 14px; border-left: 5px solid var(--dust); background: var(--paper); }
.ftcl-color-designers-role-definitions article:nth-child(2) { border-color: var(--rust); }
.ftcl-color-designers-role-definitions article:nth-child(3) { border-color: var(--cream); }
.ftcl-color-designers-role-definitions article:nth-child(4) { border-color: var(--blue); }
.ftcl-color-designers-role-definitions p { margin: 7px 0 0; font-size: 14px; line-height: 1.35; }

.ftcl-color-designers-ratio-cases { display: grid; gap: 8px; margin: 18px 0; }
.ftcl-color-designers-ratio-cases article { display: grid; grid-template-columns: 160px minmax(260px,1fr) 260px; align-items: center; gap: 14px; padding: 12px 14px; background: var(--paper); }
.ftcl-color-designers-ratio-cases article > div { display: flex; height: 54px; overflow: hidden; }
.ftcl-color-designers-ratio-cases i { width: var(--w); background: var(--c); }
.ftcl-color-designers-ratio-cases p { margin: 0; font-size: 13px; line-height: 1.32; }

.ftcl-color-designers-axes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 18px 0; }
.ftcl-color-designers-axes article { padding: 10px 12px 14px; background: var(--paper); }
.ftcl-color-designers-axes article > span { display: block; height: 55px; margin: -10px -12px 13px; }
.ftcl-color-designers-axes .is-temperature > span { background: linear-gradient(90deg,#c96d42,#b07d71,#627aa6); }
.ftcl-color-designers-axes .is-lightness > span { background: linear-gradient(90deg,#eee4dc,#a89491,#211f20); }
.ftcl-color-designers-axes .is-chroma > span { background: linear-gradient(90deg,#d61658,#b15370,#807277); }
.ftcl-color-designers-axes .is-contrast > span { background: repeating-linear-gradient(90deg,#e6d7ce 0 15%,#9a5f52 15% 30%,#2a2528 30% 45%); }
.ftcl-color-designers-axes p { margin: 7px 0 10px; font-size: 14px; line-height: 1.34; }
.ftcl-color-designers-axes small { color: #745f65; font: 600 10px Oswald, Impact, sans-serif; letter-spacing: .07em; }
.ftcl-color-designers-inline-links { padding-top: 4px; color: #66595d; font-size: 14px !important; }

.ftcl-color-designers-architecture { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 18px 0 9px; }
.ftcl-color-designers-architecture article { min-height: 145px; padding: 16px; background: #2d292b; color: #fff; }
.ftcl-color-designers-architecture .is-family { background: #78676c; }
.ftcl-color-designers-architecture .is-bridge { background: #9a5f52; }
.ftcl-color-designers-architecture .is-new { background: #4b70a6; }
.ftcl-color-designers-architecture b { font-size: 13px; }
.ftcl-color-designers-architecture p { margin: 8px 0 0; color: #f4edef; font-size: 14px; line-height: 1.36; }
.ftcl-color-designers-capsules { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 8px 0 17px; }
.ftcl-color-designers-capsules article { padding: 10px; background: var(--paper); }
.ftcl-color-designers-capsules h3 { margin-bottom: 8px; font-size: 12px; }
.ftcl-color-designers-capsules div { display: grid; grid-template-columns: 1.2fr 1fr .65fr; height: 62px; }
.ftcl-color-designers-capsules i { background: var(--c); }

.ftcl-color-designers-material-photo { position: relative; margin: 19px 0 15px; overflow: hidden; background: #2c292a; }
.ftcl-color-designers-material-photo > img,
.ftcl-color-designers-material-photo > .ftcl-media-frame,
.ftcl-color-designers-material-photo > .ftcl-media-frame > img { display: block; width: 100%; height: auto; }
.ftcl-color-designers-material-photo figcaption,
.ftcl-color-designers-production-layout figure figcaption { padding: 10px 13px; background: #292627; color: #fff; font: 600 11px Oswald, Impact, sans-serif; letter-spacing: .06em; }
.ftcl-color-designers-material-checks { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 15px 0; }
.ftcl-color-designers-material-checks article { padding: 14px; border-top: 5px solid var(--dust); background: var(--paper); }
.ftcl-color-designers-material-checks p { margin: 6px 0 0; font-size: 14px; line-height: 1.35; }

.ftcl-color-designers-placement { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 18px 0; }
.ftcl-color-designers-placement article { overflow: hidden; padding: 0 12px 12px; background: var(--paper); }
.ftcl-color-designers-placement h3 { margin-top: 13px; }
.ftcl-color-designers-placement p { margin: 6px 0 0; font-size: 13px; line-height: 1.34; }
.ftcl-color-designers-placement-photo { position: relative; aspect-ratio: 1; margin: 0 -12px; overflow: hidden; background: #292627; }
.ftcl-color-designers-placement-photo > img,
.ftcl-color-designers-placement-photo > .ftcl-media-frame,
.ftcl-color-designers-placement-photo > .ftcl-media-frame > img {
    display: block;
    width: 100%;
    height: 100%;
}
.ftcl-color-designers-placement-photo > img,
.ftcl-color-designers-placement-photo > .ftcl-media-frame > img {
    object-fit: cover;
    object-position: center;
    transition: transform .35s ease;
}
.ftcl-color-designers-placement article:hover .ftcl-color-designers-placement-photo > img,
.ftcl-color-designers-placement article:hover .ftcl-color-designers-placement-photo > .ftcl-media-frame > img { transform: scale(1.025); }

.ftcl-color-designers-print-anatomy { display: grid; grid-template-columns: repeat(2,minmax(0,.85fr)) minmax(240px,1.3fr); gap: 8px; margin: 18px 0; }
.ftcl-color-designers-print-anatomy figure { margin: 0; border: 1px solid var(--line); background: #fff; }
.ftcl-color-designers-print-anatomy figure > img,
.ftcl-color-designers-print-anatomy figure > .ftcl-media-frame,
.ftcl-color-designers-colorways figure > img,
.ftcl-color-designers-colorways figure > .ftcl-media-frame { display:block; width:100%; aspect-ratio:3 / 2; overflow:hidden; }
.ftcl-color-designers-print-anatomy figure > img,
.ftcl-color-designers-print-anatomy figure > .ftcl-media-frame > img,
.ftcl-color-designers-colorways figure > img,
.ftcl-color-designers-colorways figure > .ftcl-media-frame > img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; }
.ftcl-color-designers-print-anatomy figcaption { padding: 10px; }
.ftcl-color-designers-print-anatomy figcaption b,.ftcl-color-designers-print-anatomy figcaption span { display: block; }
.ftcl-color-designers-print-anatomy figcaption span { margin-top: 3px; color: #74666a; font-size: 11px; }
.ftcl-color-designers-print-anatomy article { padding: 16px; background: #292627; color: #fff; }
.ftcl-color-designers-print-anatomy ul { margin: 10px 0 0; padding-left: 17px; }
.ftcl-color-designers-print-anatomy li { margin: 6px 0; color: #ede6e7; font-size: 13px; line-height: 1.32; }

.ftcl-color-designers-colorways { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 18px 0; }
.ftcl-color-designers-colorways figure { margin: 0; border: 1px solid var(--line); background: #fff; }
.ftcl-color-designers-colorways figcaption { padding: 11px; }
.ftcl-color-designers-colorways figcaption b,.ftcl-color-designers-colorways figcaption span { display:block; }
.ftcl-color-designers-colorways figcaption span { margin-top:4px; color:#74666a; font-size:12px; }

.ftcl-color-designers-range-table { max-width: 100%; margin: 18px 0 12px; overflow-x: auto; border: 1px solid var(--line); background: #fff; }
.ftcl-color-designers-range-table table { width: 100%; min-width: 690px; border-collapse: collapse; }
.ftcl-color-designers-range-table th,.ftcl-color-designers-range-table td { padding: 11px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: center; }
.ftcl-color-designers-range-table thead th { background: #292627; color: #fff; font: 600 12px Oswald,Impact,sans-serif; }
.ftcl-color-designers-range-table tbody th { background: var(--paper); font: 600 12px Oswald,Impact,sans-serif; text-align:left; }
.ftcl-color-designers-range-table td { color: var(--dust); font-size: 17px; }
.ftcl-color-designers-range-table td.is-heavy { color: var(--ink); font-size: 24px; }
.ftcl-color-designers-range-questions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:12px 0; }
.ftcl-color-designers-range-questions p { margin:0; padding:14px; border-left:5px solid var(--dust); background:var(--paper); }
.ftcl-color-designers-range-questions b,.ftcl-color-designers-range-questions span { display:block; }
.ftcl-color-designers-range-questions span { margin-top:6px; font-size:13px; line-height:1.34; }

.ftcl-color-designers-production-layout { display:grid; grid-template-columns:minmax(0,1.17fr) minmax(300px,.83fr); gap:9px; margin:18px 0; }
.ftcl-color-designers-production-layout figure { margin:0; overflow:hidden; background:#292627; }
.ftcl-color-designers-production-layout figure > img,
.ftcl-color-designers-production-layout figure > .ftcl-media-frame,
.ftcl-color-designers-production-layout figure > .ftcl-media-frame > img { display:block; width:100%; height:auto; }
.ftcl-color-designers-production-layout ol { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.ftcl-color-designers-production-layout li { display:grid; grid-template-columns:126px minmax(0,1fr); gap:9px; align-items:start; padding:11px 12px; background:var(--paper); font-size:13px; line-height:1.3; }
.ftcl-color-designers-production-layout li b { font-size:11px; }

.ftcl-color-designers-handoff { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr); gap:9px; margin:18px 0; }
.ftcl-color-designers-handoff-card { border:1px solid var(--line); background:#fff; }
.ftcl-color-designers-handoff-card header { display:flex; justify-content:space-between; gap:15px; padding:13px 15px; background:#292627; color:#fff; }
.ftcl-color-designers-handoff-card header b { font-size:13px; }.ftcl-color-designers-handoff-card header span { color:#d8c8cc; font-size:11px; }
.ftcl-color-designers-handoff-swatches { display:grid; grid-template-columns:1.3fr 1fr 1fr .7fr .7fr; height:112px; }
.ftcl-color-designers-handoff-swatches i { background:var(--c); }
.ftcl-color-designers-handoff dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; }
.ftcl-color-designers-handoff dl div { padding:11px 13px; border-top:1px solid var(--line); border-right:1px solid var(--line); }
.ftcl-color-designers-handoff dt { font:600 11px Oswald,Impact,sans-serif; }.ftcl-color-designers-handoff dd { margin:4px 0 0; color:#74666a; font-size:12px; line-height:1.3; }
.ftcl-color-designers-handoff-rules { display:grid; gap:7px; }
.ftcl-color-designers-handoff-rules article { padding:13px; border-left:5px solid var(--dust); background:var(--paper); }
.ftcl-color-designers-handoff-rules p { margin:6px 0 0; font-size:13px; line-height:1.33; }
.ftcl-color-designers-faq { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:24px 0 0; }
.ftcl-color-designers-faq > h3 { grid-column:1 / -1; margin-bottom:3px; font-size:20px; }
.ftcl-color-designers-faq article { padding:14px; border:1px solid var(--line); border-top:5px solid var(--dust); background:#fff; }
.ftcl-color-designers-faq strong { display:block; font:600 12px/1.25 Oswald,Impact,sans-serif; }
.ftcl-color-designers-faq p { margin:7px 0 0; font-size:14px; line-height:1.36; }

.ftcl-color-designers-toolkit { padding:34px 64px 38px; border:1px solid var(--line); border-top:0; background:#292627; color:#fff; }
.ftcl-color-designers-toolkit-head { display:grid; grid-template-columns:minmax(0,1fr) 142px; align-items:center; gap:28px; margin-bottom:18px; }
.ftcl-color-designers-toolkit h2 { margin:10px 0 0; color:#fff; }
.ftcl-color-designers-tool-sticker { position:relative; display:flex; width:138px; height:138px; padding:20px 10px 16px; flex-direction:column; justify-content:center; justify-self:end; border:4px solid #211f20; border-radius:50%; background:#fff; box-shadow:8px 8px 0 rgba(153,132,132,.42); color:#211f20; text-align:center; transform:rotate(7deg); transition:transform .22s ease,box-shadow .22s ease; }
.ftcl-color-designers-tool-sticker::before { content:""; position:absolute; inset:5px; border:1px dashed #998484; border-radius:50%; }
.ftcl-color-designers-tool-sticker b,.ftcl-color-designers-tool-sticker small { position:relative; z-index:1; display:block; }
.ftcl-color-designers-tool-sticker b { font:700 22px/.95 Oswald,Impact,sans-serif; }
.ftcl-color-designers-tool-sticker small { margin-top:9px; color:#806a70; font:600 11px/1 Oswald,Impact,sans-serif; letter-spacing:.08em; }
.ftcl-color-designers-toolkit:hover .ftcl-color-designers-tool-sticker { box-shadow:10px 10px 0 rgba(153,132,132,.32); transform:rotate(-3deg) scale(1.04); }
.ftcl-color-designers-toolkit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.ftcl-color-designers-toolkit a { position:relative; display:flex; min-height:240px; padding:18px; flex-direction:column; border-top:9px solid var(--rust); background:#f4efed; color:var(--ink)!important; text-decoration:none!important; transition:transform .18s ease,background .18s ease,color .18s ease; }
.ftcl-color-designers-toolkit a.is-combine { border-color:var(--blue); }.ftcl-color-designers-toolkit a.is-image { border-color:var(--olive); }
.ftcl-color-designers-toolkit a:hover,.ftcl-color-designers-toolkit a:focus-visible { transform:translateY(-3px); background:#fff; }
.ftcl-color-designers-toolkit a > span { color:var(--dust); font:600 13px Oswald,Impact,sans-serif; }
.ftcl-color-designers-toolkit a > strong { margin:10px 0; font-size:22px; line-height:1.08; }
.ftcl-color-designers-toolkit a > p { margin:0 0 18px; font-size:14px; line-height:1.38; }
.ftcl-color-designers-toolkit a > b { margin-top:auto; font-size:12px; }
.ftcl-color-designers-tool-limit { margin:15px 0 0; color:#e9e0e2; font-size:13px; line-height:1.4; }

.ftcl-color-designers-sources { padding:29px 64px 31px; border:1px solid var(--line); border-top:0; background:#ede7e4; }
.ftcl-color-designers-sources h2 { margin-bottom:15px; }
.ftcl-color-designers-sources > div { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.ftcl-color-designers-sources a { display:block; padding:14px; border-left:5px solid var(--dust); background:#fff; color:var(--ink)!important; text-decoration:none!important; }
.ftcl-color-designers-sources a:hover { background:#292627; color:#fff!important; }
.ftcl-color-designers-sources strong,.ftcl-color-designers-sources span { display:block; }
.ftcl-color-designers-sources strong { font:600 12px Oswald,Impact,sans-serif; }
.ftcl-color-designers-sources span { margin-top:7px; font-size:13px; line-height:1.32; }
.ftcl-color-designers-sources > p:last-child { margin:15px 0 0; font-size:13px; line-height:1.36; }
.ftcl-color-designers-foot { display:flex; justify-content:space-between; gap:20px; padding:15px 26px; border:1px solid var(--line); border-top:0; background:#242122; color:#ded5d7; font-size:12px; }
.ftcl-color-designers-foot p { margin:0; }.ftcl-color-designers-foot a { color:#d3bfc4!important; }

@media (max-width: 1080px) {
    .ftcl-color-designers-brief-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .ftcl-color-designers-brief-grid article { min-height:120px; }
    .ftcl-color-designers-sources > div { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 980px) {
    .ftcl-color-designers-page #main-content .container { padding-top: 30px !important; }
    .ftcl-color-designers-hero { grid-template-columns:1fr; }
    .ftcl-color-designers-hero-copy { min-height:310px; padding:40px 43px; }
    .ftcl-color-designers-hero-image { aspect-ratio:16 / 9; }
    .ftcl-color-designers-index { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .ftcl-color-designers-copy { padding:28px 38px 32px; }
    .ftcl-color-designers-role-definitions,.ftcl-color-designers-axes,.ftcl-color-designers-placement { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-color-designers-ratio-cases article { grid-template-columns:135px minmax(220px,1fr); }.ftcl-color-designers-ratio-cases p { grid-column:1 / -1; }
    .ftcl-color-designers-print-anatomy { grid-template-columns:repeat(2,minmax(0,1fr)); }.ftcl-color-designers-print-anatomy article { grid-column:1 / -1; }
    .ftcl-color-designers-production-layout { grid-template-columns:1fr; }
    .ftcl-color-designers-toolkit,.ftcl-color-designers-sources { padding:28px 38px 31px; }
}

@media (max-width: 760px) {
    .ftcl-color-designers-principle { grid-template-columns:1fr; gap:5px; padding:18px 24px; }
    .ftcl-color-designers-index { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:21px 8px 8px; }
    .ftcl-color-designers-card-visual { height:64px; }
    .ftcl-color-designers-section { grid-template-columns:42px minmax(0,1fr); }
    .ftcl-color-designers-number { padding-top:24px; font-size:15px; }
    .ftcl-color-designers-copy { padding:23px 19px 27px; }
    .ftcl-color-designers h2 { font-size:29px; }
    .ftcl-color-designers-copy > p { font-size:16px; }
    .ftcl-color-designers-brief-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-color-designers-tool-note { grid-template-columns:1fr; gap:5px; }
    .ftcl-color-designers-role-bar { min-height:145px; }.ftcl-color-designers-role-bar b { font-size:10px; writing-mode:vertical-rl; transform:rotate(180deg); }.ftcl-color-designers-role-bar small { margin-top:5px; }
    .ftcl-color-designers-architecture { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-color-designers-material-checks,.ftcl-color-designers-range-questions { grid-template-columns:1fr; }
    .ftcl-color-designers-handoff { grid-template-columns:1fr; }
    .ftcl-color-designers-toolkit-grid { grid-template-columns:1fr; }
    .ftcl-color-designers-toolkit > .ftcl-color-designers-toolkit-head { grid-template-columns:minmax(0,1fr) 108px; gap:14px; }
    .ftcl-color-designers-tool-sticker { width:100px; height:100px; padding:14px 7px 11px; border-width:3px; box-shadow:6px 6px 0 rgba(153,132,132,.42); }
    .ftcl-color-designers-tool-sticker b { font-size:16px; }.ftcl-color-designers-tool-sticker small { margin-top:6px; font-size:8px; }
    .ftcl-color-designers-toolkit a { min-height:190px; }
    .ftcl-color-designers-toolkit,.ftcl-color-designers-sources { padding:23px 19px 27px; }
    .ftcl-color-designers-foot { display:block; padding:13px 16px; }.ftcl-color-designers-foot p+p { margin-top:6px; }
}

@media (max-width: 540px) {
    .ftcl-color-designers-hero-copy { min-height:285px; padding:30px 22px 33px; }
    .ftcl-color-designers-hero h1 { font-size:40px; line-height:1.08; }
    .ftcl-color-designers-hero-copy > p:last-child { font-size:16px; }
    .ftcl-color-designers-card-copy { grid-template-columns:23px minmax(0,1fr); padding:8px; }
    .ftcl-color-designers-card-copy strong { font-size:12px; }
    .ftcl-color-designers-card-copy small { font-size:10px; }
    .ftcl-color-designers-section { grid-template-columns:32px minmax(0,1fr); }
    .ftcl-color-designers-copy { padding:20px 12px 23px; }
    .ftcl-color-designers h2 { font-size:25px; }
    .ftcl-color-designers-brief-grid,.ftcl-color-designers-role-definitions,.ftcl-color-designers-axes,.ftcl-color-designers-capsules,.ftcl-color-designers-colorways,.ftcl-color-designers-faq,.ftcl-color-designers-sources > div { grid-template-columns:1fr; }
    .ftcl-color-designers-placement { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-color-designers-brief-grid article { min-height:0; }
    .ftcl-color-designers-ratio-cases article { grid-template-columns:1fr; gap:8px; }.ftcl-color-designers-ratio-cases article > div { min-width:0; }
    .ftcl-color-designers-print-anatomy { grid-template-columns:1fr; }.ftcl-color-designers-print-anatomy article { grid-column:auto; }
    .ftcl-color-designers-production-layout li { grid-template-columns:1fr; gap:4px; }
    .ftcl-color-designers-handoff-card header { display:block; }.ftcl-color-designers-handoff-card header span { display:block; margin-top:5px; }
    .ftcl-color-designers-handoff dl { grid-template-columns:1fr; }
    .ftcl-color-designers-toolkit a > strong { font-size:20px; }
    .ftcl-color-designers-toolkit > .ftcl-color-designers-toolkit-head { grid-template-columns:minmax(0,1fr) 86px; gap:10px; }
    .ftcl-color-designers-tool-sticker { width:80px; height:80px; padding:11px 5px 8px; border-width:3px; box-shadow:5px 5px 0 rgba(153,132,132,.42); }
    .ftcl-color-designers-tool-sticker b { font-size:13px; }.ftcl-color-designers-tool-sticker small { margin-top:5px; font-size:7px; }
}

@media (prefers-reduced-motion: reduce) {
    .ftcl-color-designers-placement-photo > img,
    .ftcl-color-designers-placement-photo > .ftcl-media-frame > img { transition: none; }
}
