.ftcl-colorimetry {
    --ink: #211f20;
    --dust: #998484;
    --dust-dark: #735f65;
    --line: #d8cccc;
    --paper: #f3efed;
    --outer: #fff;
    max-width: 1260px;
    margin: 0 auto;
    color: var(--ink);
    font-family: Abel, Arial, sans-serif;
}

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

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

.ftcl-colorimetry-hero {
    display: grid;
    grid-template-columns: 40% 60%;
    min-height: 430px;
    overflow: hidden;
    background: var(--ink);
}
.ftcl-colorimetry-hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 48px 52px 64px;
    color: #fff;
}
.ftcl-colorimetry-eyebrow,
.ftcl-colorimetry-kicker {
    margin: 0;
    color: var(--dust);
    font: 600 13px/1.2 Oswald, Impact, sans-serif;
    letter-spacing: .16em;
}
.ftcl-colorimetry-hero h1 {
    margin: 13px 0 17px;
    color: #fff;
    font-size: clamp(50px, 5vw, 72px);
    line-height: .96;
    letter-spacing: -.025em;
}
.ftcl-colorimetry-hero-copy > p:last-child {
    max-width: 470px;
    margin: 0;
    color: #eee7e8;
    font-size: 18px;
    line-height: 1.38;
}
.ftcl-colorimetry-hero-image { min-width: 0; margin: 0; overflow: hidden; background: #2b2427; }
.ftcl-colorimetry-hero-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ftcl-colorimetry-hero-image > .ftcl-media-frame { width: 100%; height: 100%; }
.ftcl-colorimetry-hero-image > .ftcl-media-frame > img { height: 100%; object-fit: cover; }

.ftcl-colorimetry-principle {
    display: grid;
    grid-template-columns: 245px minmax(0, 1fr);
    gap: 26px;
    align-items: center;
    padding: 20px 54px;
    border-top: 1px solid rgba(255, 255, 255, .18);
    background: #67545a;
    color: #fff;
}
.ftcl-colorimetry-principle strong { font: 600 14px Oswald, Impact, sans-serif; letter-spacing: .08em; }
.ftcl-colorimetry-principle p { margin: 0; font-size: 15px; line-height: 1.4; }

.ftcl-colorimetry-index {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    padding: 26px 10px 10px;
    background: #eee9e6;
}
.ftcl-colorimetry-card {
    display: flex;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--ink) !important;
    text-decoration: none !important;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.ftcl-colorimetry-card:hover,
.ftcl-colorimetry-card:focus-visible { border-color: var(--dust); box-shadow: 0 7px 18px rgba(33,31,32,.13); transform: translateY(-2px); }
.ftcl-colorimetry-card-visual { display: grid; grid-template-columns: repeat(4, 1fr); height: 76px; overflow: hidden; background: #252223; }
.ftcl-colorimetry-card-visual i { display: block; background: var(--c, #998484); }
.ftcl-colorimetry-card-copy { display: grid; grid-template-columns: 28px minmax(0, 1fr); padding: 10px 11px 12px; line-height: 1.08; }
.ftcl-colorimetry-card-copy b { grid-row: 1 / 3; color: var(--dust); font-size: 13px; }
.ftcl-colorimetry-card-copy strong { font-size: 14px; font-weight: 600; text-transform: uppercase; }
.ftcl-colorimetry-card-copy small { margin-top: 5px; color: #75686b; font-size: 12px; }

.ftcl-colorimetry-card-scope i:nth-child(1) { background:#e0b29a; }.ftcl-colorimetry-card-scope i:nth-child(2) { background:#936b57; }.ftcl-colorimetry-card-scope i:nth-child(3) { background:#6c4a40; }.ftcl-colorimetry-card-scope i:nth-child(4) { background:#33282b; }
.ftcl-colorimetry-card-skin i:nth-child(1) { background:#f0c5a7; }.ftcl-colorimetry-card-skin i:nth-child(2) { background:#c68e68; }.ftcl-colorimetry-card-skin i:nth-child(3) { background:#8e5743; }.ftcl-colorimetry-card-skin i:nth-child(4) { background:#4f2d28; }
.ftcl-colorimetry-card-axes i:nth-child(1) { background:#c06d42; }.ftcl-colorimetry-card-axes i:nth-child(2) { background:#526f9d; }.ftcl-colorimetry-card-axes i:nth-child(3) { background:#e8d7c5; }.ftcl-colorimetry-card-axes i:nth-child(4) { background:#362a31; }
.ftcl-colorimetry-card-light i:nth-child(1) { background:#e4b984; }.ftcl-colorimetry-card-light i:nth-child(2) { background:#d8d0c4; }.ftcl-colorimetry-card-light i:nth-child(3) { background:#7d8ca1; }.ftcl-colorimetry-card-light i:nth-child(4) { background:#353236; }
.ftcl-colorimetry-card-drapes i:nth-child(1) { background:#b85d3d; }.ftcl-colorimetry-card-drapes i:nth-child(2) { background:#536fa3; }.ftcl-colorimetry-card-drapes i:nth-child(3) { background:#c51f58; }.ftcl-colorimetry-card-drapes i:nth-child(4) { background:#8d6f78; }
.ftcl-colorimetry-card-temperature i:nth-child(1) { background:#bf6a38; }.ftcl-colorimetry-card-temperature i:nth-child(2) { background:#b84156; }.ftcl-colorimetry-card-temperature i:nth-child(3) { background:#765389; }.ftcl-colorimetry-card-temperature i:nth-child(4) { background:#416b8e; }
.ftcl-colorimetry-card-lightness i:nth-child(1) { background:#f2e9df; }.ftcl-colorimetry-card-lightness i:nth-child(2) { background:#b8a7a3; }.ftcl-colorimetry-card-lightness i:nth-child(3) { background:#716067; }.ftcl-colorimetry-card-lightness i:nth-child(4) { background:#292329; }
.ftcl-colorimetry-card-chroma i:nth-child(1) { background:#d91566; }.ftcl-colorimetry-card-chroma i:nth-child(2) { background:#b5486f; }.ftcl-colorimetry-card-chroma i:nth-child(3) { background:#8e6473; }.ftcl-colorimetry-card-chroma i:nth-child(4) { background:#73696d; }
.ftcl-colorimetry-card-contrast i:nth-child(1) { background:#ece1d7; }.ftcl-colorimetry-card-contrast i:nth-child(2) { background:#a38074; }.ftcl-colorimetry-card-contrast i:nth-child(3) { background:#675054; }.ftcl-colorimetry-card-contrast i:nth-child(4) { background:#201d20; }
.ftcl-colorimetry-card-seasons i:nth-child(1) { background:#e8a440; }.ftcl-colorimetry-card-seasons i:nth-child(2) { background:#91a6c2; }.ftcl-colorimetry-card-seasons i:nth-child(3) { background:#916438; }.ftcl-colorimetry-card-seasons i:nth-child(4) { background:#5c326f; }
.ftcl-colorimetry-card-wardrobe i:nth-child(1) { background:#b18456; }.ftcl-colorimetry-card-wardrobe i:nth-child(2) { background:#174f60; }.ftcl-colorimetry-card-wardrobe i:nth-child(3) { background:#b65f5a; }.ftcl-colorimetry-card-wardrobe i:nth-child(4) { background:#69704b; }
.ftcl-colorimetry-card-palette i:nth-child(1) { background:#998484; }.ftcl-colorimetry-card-palette i:nth-child(2) { background:#e5d9c6; }.ftcl-colorimetry-card-palette i:nth-child(3) { background:#174f60; }.ftcl-colorimetry-card-palette i:nth-child(4) { background:#3a2725; }

.ftcl-colorimetry-section {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    border: 1px solid var(--line);
    border-top: 0;
    background: #fff;
    scroll-margin-top: 120px;
}
.ftcl-colorimetry-number { padding-top: 31px; border-right: 1px solid var(--line); color: var(--dust); font: 600 18px Oswald, Impact, sans-serif; text-align: center; }
.ftcl-colorimetry-copy { min-width: 0; padding: 30px 64px 34px; }
.ftcl-colorimetry h2 { margin: 5px 0 16px; font-size: 34px; line-height: 1.08; }
.ftcl-colorimetry h3 { margin: 0; font-size: 17px; line-height: 1.18; }
.ftcl-colorimetry-copy > p { max-width: 1010px; margin: 0 0 15px; font-size: 17px; line-height: 1.44; }
.ftcl-colorimetry-note { padding: 12px 14px; border-left: 4px solid var(--dust); background: #f5f1ef; }
.ftcl-colorimetry-note strong { letter-spacing: .02em; }

.ftcl-colorimetry-boundaries { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0; }
.ftcl-colorimetry-boundaries article { position: relative; min-height: 172px; padding: 17px 17px 17px 48px; overflow: hidden; background: var(--paper); border-top: 6px solid var(--dust); }
.ftcl-colorimetry-boundaries article > span { position: absolute; left: 14px; top: 17px; color: var(--dust); font: 600 13px Oswald, Impact, sans-serif; }
.ftcl-colorimetry-boundaries p { margin: 8px 0 0; font-size: 15px; line-height: 1.38; }

.ftcl-colorimetry-skin-layout { display: grid; grid-template-columns: minmax(230px, .72fr) minmax(0, 1.55fr); gap: 18px; align-items: start; margin: 17px 0; }
.ftcl-colorimetry-reference-portrait { margin: 0; overflow: hidden; background: #2f2e30; }
.ftcl-colorimetry-reference-portrait img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 25%; }
.ftcl-colorimetry-reference-portrait figcaption { padding: 8px 10px; background: #292627; color: #fff; font: 600 11px Oswald, Impact, sans-serif; letter-spacing: .08em; }
.ftcl-colorimetry-definitions { display: grid; gap: 8px; margin-bottom: 13px; }
.ftcl-colorimetry-definitions p { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 12px; margin: 0; padding: 13px 14px; background: var(--paper); font-size: 15px; line-height: 1.35; }
.ftcl-colorimetry-definitions strong { font-size: 14px; }
.ftcl-colorimetry-skin-layout > div > p { margin: 0 0 13px; font-size: 16px; line-height: 1.43; }

.ftcl-colorimetry-axes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 17px 0; }
.ftcl-colorimetry-axes article { padding: 16px; background: var(--paper); }
.ftcl-colorimetry-axis { display: block; height: 36px; margin-bottom: 13px; }
.ftcl-colorimetry-axes .is-temperature .ftcl-colorimetry-axis { background: linear-gradient(90deg, #cf7138, #b84055 48%, #6f568a 52%, #3f7294); }
.ftcl-colorimetry-axes .is-lightness .ftcl-colorimetry-axis { background: linear-gradient(90deg, #f0e9e1, #998484, #262126); }
.ftcl-colorimetry-axes .is-chroma .ftcl-colorimetry-axis { background: linear-gradient(90deg, #db135f, #b8456f, #7d6e74); }
.ftcl-colorimetry-axes .is-contrast .ftcl-colorimetry-axis { background: repeating-linear-gradient(90deg, #e9dcd4 0 14%, #a27f74 14% 28%, #1f1c1f 28% 42%); }
.ftcl-colorimetry-axes p { margin: 7px 0 10px; font-size: 15px; line-height: 1.35; }
.ftcl-colorimetry-axes small { color: #755f66; font: 600 11px Oswald, Impact, sans-serif; letter-spacing: .08em; }

.ftcl-colorimetry-preparation { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(290px, .88fr); gap: 13px; margin: 17px 0; }
.ftcl-colorimetry-preparation ol { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.ftcl-colorimetry-preparation li { display: grid; grid-template-columns: 138px minmax(0, 1fr); gap: 12px; padding: 12px 14px; background: var(--paper); font-size: 14px; line-height: 1.34; }
.ftcl-colorimetry-preparation li b { font-size: 13px; }
.ftcl-colorimetry-light-demo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; align-content: start; padding: 8px; background: #282526; }
.ftcl-colorimetry-light-demo figure { position: relative; margin: 0; overflow: hidden; background: #333; }
.ftcl-colorimetry-light-demo img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 18%; }
.ftcl-colorimetry-light-demo figure::after { content:""; position:absolute; inset:0; pointer-events:none; mix-blend-mode: color; opacity:.34; }
.ftcl-colorimetry-light-demo .is-warm::after { background:#d7904f; }
.ftcl-colorimetry-light-demo .is-cool::after { background:#5783aa; }
.ftcl-colorimetry-light-demo figcaption { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 7px; background: rgba(25,23,24,.78); color: #fff; font: 600 10px Oswald, Impact, sans-serif; text-align: center; }
.ftcl-colorimetry-light-demo > p { grid-column: 1 / -1; margin: 4px 2px 1px; color: #e8dfe1; font-size: 12px; line-height: 1.32; }

.ftcl-colorimetry-drapes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 18px 0; }
.ftcl-colorimetry-drape { margin: 0; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.ftcl-colorimetry-drape > div { position: relative; overflow: hidden; background: #353236; }
.ftcl-colorimetry-drape img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: center 18%; }
.ftcl-colorimetry-drape > div > span { position: absolute; left: -8%; right: -8%; bottom: -8%; height: 39%; border-radius: 52% 52% 0 0 / 20% 20% 0 0; background: var(--drape); box-shadow: inset 0 18px 24px rgba(255,255,255,.08); }
.ftcl-colorimetry-drape figcaption { padding: 9px 10px 10px; font-size: 12px; line-height: 1.25; }
.ftcl-colorimetry-drape figcaption strong { display: block; margin-bottom: 3px; color: var(--drape); font-size: 14px; }
.ftcl-colorimetry-observe { display: grid; grid-template-columns: 205px minmax(0, 1fr); gap: 17px; align-items: start; margin: 15px 0; padding: 16px; background: #292627; color: #fff; }
.ftcl-colorimetry-observe strong { font: 600 15px Oswald, Impact, sans-serif; letter-spacing: .04em; }
.ftcl-colorimetry-observe p { margin: 0; color: #e9e0e2; font-size: 14px; line-height: 1.4; }

.ftcl-colorimetry-pairs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 18px 0; }
.ftcl-colorimetry-pairs article { overflow: hidden; border: 1px solid var(--line); background: #fff; }
.ftcl-colorimetry-pairs article > div { display: grid; grid-template-columns: 1fr 1fr; height: 75px; }
.ftcl-colorimetry-pairs i { background: var(--c); }
.ftcl-colorimetry-pairs b, .ftcl-colorimetry-pairs span { display: block; padding: 0 11px; }
.ftcl-colorimetry-pairs b { padding-top: 10px; font-size: 13px; }
.ftcl-colorimetry-pairs span { padding-bottom: 11px; color: #73656a; font-size: 12px; }

.ftcl-colorimetry-value-scale { display: grid; grid-template-columns: auto repeat(5, minmax(55px, 1fr)) auto; align-items: center; gap: 0; margin: 18px 0; }
.ftcl-colorimetry-value-scale span { padding: 0 10px; color: #69585e; font: 600 11px Oswald, Impact, sans-serif; letter-spacing: .08em; }
.ftcl-colorimetry-value-scale i { height: 48px; background: #ede4df; }
.ftcl-colorimetry-value-scale i:nth-of-type(2) { background:#cbbdbb; }.ftcl-colorimetry-value-scale i:nth-of-type(3) { background:#998484; }.ftcl-colorimetry-value-scale i:nth-of-type(4) { background:#5e4f54; }.ftcl-colorimetry-value-scale i:nth-of-type(5) { background:#251f23; }
.ftcl-colorimetry-value-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin: 16px 0; }
.ftcl-colorimetry-value-cases article { padding: 9px 9px 14px; background: var(--paper); }
.ftcl-colorimetry-value-cases article > div { display: grid; grid-template-columns: repeat(4,1fr); height: 50px; margin-bottom: 12px; }
.ftcl-colorimetry-value-cases h3, .ftcl-colorimetry-value-cases p { margin-left: 4px; margin-right: 4px; }
.ftcl-colorimetry-value-cases p { margin-top: 6px; margin-bottom: 0; font-size: 14px; line-height: 1.34; }
.ftcl-colorimetry-value-cases .is-light i:nth-child(1){background:#f1e6d8}.ftcl-colorimetry-value-cases .is-light i:nth-child(2){background:#d6b9b2}.ftcl-colorimetry-value-cases .is-light i:nth-child(3){background:#b8c4bf}.ftcl-colorimetry-value-cases .is-light i:nth-child(4){background:#b5b3d1}
.ftcl-colorimetry-value-cases .is-medium i:nth-child(1){background:#b18456}.ftcl-colorimetry-value-cases .is-medium i:nth-child(2){background:#aa5e69}.ftcl-colorimetry-value-cases .is-medium i:nth-child(3){background:#50786c}.ftcl-colorimetry-value-cases .is-medium i:nth-child(4){background:#596f99}
.ftcl-colorimetry-value-cases .is-deep i:nth-child(1){background:#47302d}.ftcl-colorimetry-value-cases .is-deep i:nth-child(2){background:#6d2439}.ftcl-colorimetry-value-cases .is-deep i:nth-child(3){background:#174f4b}.ftcl-colorimetry-value-cases .is-deep i:nth-child(4){background:#202e50}

.ftcl-colorimetry-chroma-rows { display: grid; gap: 7px; margin: 18px 0; }
.ftcl-colorimetry-chroma-rows article { display: grid; grid-template-columns: 80px minmax(0, 1fr) 100px; align-items: center; gap: 12px; padding: 9px 12px; background: var(--paper); }
.ftcl-colorimetry-chroma-rows article > div { display: grid; grid-template-columns: repeat(3,1fr); height: 42px; }
.ftcl-colorimetry-chroma-rows i { background: var(--c); }
.ftcl-colorimetry-chroma-rows span { color: #725e64; font: 600 11px Oswald, Impact, sans-serif; text-align: right; }
.ftcl-colorimetry-two-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 15px 0; }
.ftcl-colorimetry-two-columns article { padding: 15px; border-left: 5px solid var(--dust); background: #f6f2f0; }
.ftcl-colorimetry-two-columns p { margin: 7px 0 0; font-size: 14px; line-height: 1.35; }

.ftcl-colorimetry-contrast-cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin: 18px 0; }
.ftcl-colorimetry-contrast-cases article { padding: 12px; background: var(--paper); }
.ftcl-colorimetry-contrast-cases article > div { display: grid; grid-template-columns: repeat(3,1fr); height: 72px; margin-bottom: 11px; }
.ftcl-colorimetry-contrast-cases .is-low i:nth-child(1){background:#ad8a7b}.ftcl-colorimetry-contrast-cases .is-low i:nth-child(2){background:#93766f}.ftcl-colorimetry-contrast-cases .is-low i:nth-child(3){background:#81676a}
.ftcl-colorimetry-contrast-cases .is-medium i:nth-child(1){background:#d9b39b}.ftcl-colorimetry-contrast-cases .is-medium i:nth-child(2){background:#8c665e}.ftcl-colorimetry-contrast-cases .is-medium i:nth-child(3){background:#4c3a40}
.ftcl-colorimetry-contrast-cases .is-high i:nth-child(1){background:#f0d2b7}.ftcl-colorimetry-contrast-cases .is-high i:nth-child(2){background:#875446}.ftcl-colorimetry-contrast-cases .is-high i:nth-child(3){background:#171417}
.ftcl-colorimetry-contrast-cases p { margin: 6px 0 0; font-size: 14px; line-height: 1.33; }
.ftcl-colorimetry-formulas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 14px 0; }
.ftcl-colorimetry-formulas p { margin: 0; padding: 13px; border-top: 5px solid var(--dust); background: #fff; box-shadow: inset 0 0 0 1px var(--line); }
.ftcl-colorimetry-formulas b, .ftcl-colorimetry-formulas span { display: block; }
.ftcl-colorimetry-formulas b { margin-bottom: 5px; font-size: 13px; }.ftcl-colorimetry-formulas span { font-size: 13px; line-height: 1.32; }

.ftcl-colorimetry-seasons { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 18px 0; }
.ftcl-colorimetry-seasons article { overflow: hidden; border: 1px solid var(--line); background: #fff; }
.ftcl-colorimetry-seasons article > div { display: grid; grid-template-columns: repeat(4,1fr); height: 82px; }
.ftcl-colorimetry-seasons h3, .ftcl-colorimetry-seasons b, .ftcl-colorimetry-seasons p { display: block; margin-left: 12px; margin-right: 12px; }
.ftcl-colorimetry-seasons h3 { margin-top: 11px; }.ftcl-colorimetry-seasons b { margin-top: 3px; color: #765e66; font-size: 10px; letter-spacing: .04em; }.ftcl-colorimetry-seasons p { margin-top: 7px; margin-bottom: 13px; font-size: 13px; line-height: 1.32; }
.ftcl-colorimetry-seasons .is-spring i:nth-child(1){background:#f2c14f}.ftcl-colorimetry-seasons .is-spring i:nth-child(2){background:#e87e4a}.ftcl-colorimetry-seasons .is-spring i:nth-child(3){background:#6dac65}.ftcl-colorimetry-seasons .is-spring i:nth-child(4){background:#4f9bb3}
.ftcl-colorimetry-seasons .is-summer i:nth-child(1){background:#c9b5cb}.ftcl-colorimetry-seasons .is-summer i:nth-child(2){background:#88a6bb}.ftcl-colorimetry-seasons .is-summer i:nth-child(3){background:#b97f91}.ftcl-colorimetry-seasons .is-summer i:nth-child(4){background:#74768f}
.ftcl-colorimetry-seasons .is-autumn i:nth-child(1){background:#b96835}.ftcl-colorimetry-seasons .is-autumn i:nth-child(2){background:#9a743a}.ftcl-colorimetry-seasons .is-autumn i:nth-child(3){background:#69704b}.ftcl-colorimetry-seasons .is-autumn i:nth-child(4){background:#66392e}
.ftcl-colorimetry-seasons .is-winter i:nth-child(1){background:#cf155a}.ftcl-colorimetry-seasons .is-winter i:nth-child(2){background:#315ca6}.ftcl-colorimetry-seasons .is-winter i:nth-child(3){background:#f0eae5}.ftcl-colorimetry-seasons .is-winter i:nth-child(4){background:#18171b}
.ftcl-colorimetry-season-logic { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 10px; align-items: center; margin: 15px 0; }
.ftcl-colorimetry-season-logic p { margin: 0; padding: 13px; background: var(--paper); }
.ftcl-colorimetry-season-logic strong, .ftcl-colorimetry-season-logic span { display:block; }.ftcl-colorimetry-season-logic strong { font: 600 13px Oswald,Impact,sans-serif; }.ftcl-colorimetry-season-logic span { margin-top:4px; font-size:13px; line-height:1.3; }.ftcl-colorimetry-season-logic > i { color: var(--dust); font-style: normal; font-size: 22px; }

.ftcl-colorimetry-wardrobe { margin: 18px 0; overflow: hidden; background: #2a2527; }
.ftcl-colorimetry-wardrobe img { display: block; width: 100%; height: auto; }
.ftcl-colorimetry-wardrobe > .ftcl-media-frame { display: block; width: 100%; }
.ftcl-colorimetry-wardrobe figcaption { padding: 9px 12px; color: #fff; font: 600 11px Oswald,Impact,sans-serif; letter-spacing: .07em; }
.ftcl-colorimetry-wardrobe-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 15px 0; }
.ftcl-colorimetry-wardrobe-grid article { padding: 14px; background: var(--paper); }
.ftcl-colorimetry-wardrobe-grid b { font-size: 13px; }.ftcl-colorimetry-wardrobe-grid p { margin:6px 0 0; font-size:14px; line-height:1.34; }
.ftcl-colorimetry-capsule { display: flex; min-height: 105px; overflow: hidden; margin: 15px 0; }
.ftcl-colorimetry-capsule span { display:flex; min-width:0; width:var(--w); flex-direction:column; justify-content:flex-end; padding:10px 8px; overflow:hidden; background:var(--c); color:#fff; font:600 10px Oswald,Impact,sans-serif; text-shadow:0 1px 2px rgba(0,0,0,.45); }
.ftcl-colorimetry-capsule b { font-size:14px; }.ftcl-colorimetry-capsule span:nth-child(3) { color:#302b2c; text-shadow:none; }

.ftcl-colorimetry-process { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:18px 0; }
.ftcl-colorimetry-process article { position:relative; min-height:150px; padding:17px 15px 15px 52px; background:var(--paper); }
.ftcl-colorimetry-process article > b { position:absolute; left:15px; top:17px; color:var(--dust); font-size:14px; }.ftcl-colorimetry-process p { margin:7px 0 0; font-size:14px; line-height:1.34; }
.ftcl-colorimetry-myths { margin:16px 0; padding:18px; background:#292627; color:#fff; }
.ftcl-colorimetry-myths h3 { color:#fff; }.ftcl-colorimetry-myths ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:13px 0 0; padding:0; list-style:none; }
.ftcl-colorimetry-myths li { padding:12px; background:rgba(255,255,255,.07); color:#ece5e6; font-size:13px; line-height:1.38; }.ftcl-colorimetry-myths strong { display:block; margin-bottom:5px; color:#fff; font:600 11px Oswald,Impact,sans-serif; }
.ftcl-colorimetry-faq { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:16px 0; }
.ftcl-colorimetry-faq > h3 { grid-column:1 / -1; margin-bottom:3px; }
.ftcl-colorimetry-faq article { padding:14px; border:1px solid var(--line); border-top:5px solid var(--dust); background:#fff; }
.ftcl-colorimetry-faq strong { display:block; font:600 12px/1.25 Oswald,Impact,sans-serif; }
.ftcl-colorimetry-faq p { margin:7px 0 0; font-size:14px; line-height:1.36; }
.ftcl-colorimetry-cta { position:relative; display:grid; grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr); margin:18px 0; overflow:hidden; background:#998484; color:#fff!important; text-decoration:none!important; transition:transform .2s ease, box-shadow .2s ease; }
.ftcl-colorimetry-cta:hover,.ftcl-colorimetry-cta:focus-visible { transform:translateY(-2px); box-shadow:0 8px 22px rgba(33,31,32,.2); }
.ftcl-colorimetry-cta > img,.ftcl-colorimetry-cta > .ftcl-media-frame { display:block; width:100%; height:100%; min-height:190px; object-fit:cover; }.ftcl-colorimetry-cta > .ftcl-media-frame > img { height:100%; object-fit:cover; }
.ftcl-colorimetry-cta > .ftcl-colorimetry-cta-copy { display:flex; flex-direction:column; justify-content:center; padding:25px 190px 25px 30px; }.ftcl-colorimetry-cta-copy > small,.ftcl-colorimetry-cta-copy > strong,.ftcl-colorimetry-cta-copy > em { display:block; }.ftcl-colorimetry-cta-copy > small { font-size:11px; letter-spacing:.12em; }.ftcl-colorimetry-cta-copy > strong { margin:8px 0 15px; font-size:24px; line-height:1.1; }.ftcl-colorimetry-cta-copy > em { align-self:flex-start; padding:10px 13px; background:#211f20; color:#fff; font:600 12px/1 Oswald,Impact,sans-serif; font-style:normal; letter-spacing:.045em; transition:background .18s ease,color .18s ease; }
.ftcl-colorimetry-cta-sticker { position:absolute; top:50%; right:28px; z-index:2; display:flex; width:138px; height:138px; padding:20px 10px 16px; flex-direction:column; justify-content:center; border:4px solid #211f20; border-radius:50%; background:#fff; box-shadow:8px 8px 0 rgba(33,31,32,.28); color:#211f20; text-align:center; transform:translateY(-50%) rotate(7deg); transition:transform .22s ease,box-shadow .22s ease; }
.ftcl-colorimetry-cta-sticker::before { content:""; position:absolute; inset:5px; border:1px dashed #998484; border-radius:50%; }
.ftcl-colorimetry-cta-sticker b,.ftcl-colorimetry-cta-sticker small { position:relative; z-index:1; display:block; }.ftcl-colorimetry-cta-sticker b { font:700 22px/.95 Oswald,Impact,sans-serif; }.ftcl-colorimetry-cta-sticker small { margin-top:9px; color:#806a70; font:600 11px/1 Oswald,Impact,sans-serif; letter-spacing:.08em; }
.ftcl-colorimetry-cta:hover .ftcl-colorimetry-cta-sticker,.ftcl-colorimetry-cta:focus-visible .ftcl-colorimetry-cta-sticker { box-shadow:10px 10px 0 rgba(33,31,32,.22); transform:translateY(-50%) rotate(-3deg) scale(1.04); }
.ftcl-colorimetry-cta:hover .ftcl-colorimetry-cta-copy > em,.ftcl-colorimetry-cta:focus-visible .ftcl-colorimetry-cta-copy > em { background:#fff; color:#211f20; }

.ftcl-colorimetry-sources { padding:28px 64px 30px; border:1px solid var(--line); border-top:0; background:#ede7e4; }
.ftcl-colorimetry-sources h2 { margin-bottom:14px; }.ftcl-colorimetry-sources > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.ftcl-colorimetry-sources a { display:block; padding:14px; border-left:5px solid var(--dust); background:#fff; color:var(--ink)!important; text-decoration:none!important; }.ftcl-colorimetry-sources a:hover { background:#292627; color:#fff!important; }.ftcl-colorimetry-sources strong,.ftcl-colorimetry-sources span { display:block; }.ftcl-colorimetry-sources strong { font:600 13px Oswald,Impact,sans-serif; }.ftcl-colorimetry-sources span { margin-top:6px; font-size:13px; line-height:1.32; }.ftcl-colorimetry-sources > p:last-child { margin:14px 0 0; font-size:13px; line-height:1.35; }
.ftcl-colorimetry-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-colorimetry-foot p { margin:0; }.ftcl-colorimetry-foot a { color:#d3bfc4!important; }

@media (max-width: 980px) {
    .ftcl-colorimetry-page #main-content .container { padding-top: 30px !important; }
    .ftcl-colorimetry-hero { grid-template-columns: 1fr; }
    .ftcl-colorimetry-hero-copy { min-height: 300px; padding: 38px 42px; }
    .ftcl-colorimetry-hero-image { aspect-ratio: 16 / 9; }
    .ftcl-colorimetry-index { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ftcl-colorimetry-copy { padding: 27px 38px 31px; }
    .ftcl-colorimetry-drapes,.ftcl-colorimetry-seasons { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ftcl-colorimetry-pairs { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-colorimetry-sources { padding:27px 38px 30px; }
}

@media (max-width: 760px) {
    .ftcl-colorimetry-principle { grid-template-columns:1fr; gap:5px; padding:17px 24px; }
    .ftcl-colorimetry-index { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:18px 8px 8px; }
    .ftcl-colorimetry-card-visual { height:62px; }
    .ftcl-colorimetry-section { grid-template-columns:42px minmax(0,1fr); }
    .ftcl-colorimetry-number { padding-top:23px; font-size:15px; }
    .ftcl-colorimetry-copy { padding:22px 19px 25px; }
    .ftcl-colorimetry h2 { font-size:28px; }
    .ftcl-colorimetry-copy > p { font-size:16px; }
    .ftcl-colorimetry-boundaries,.ftcl-colorimetry-value-cases,.ftcl-colorimetry-contrast-cases,.ftcl-colorimetry-wardrobe-grid,.ftcl-colorimetry-process { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ftcl-colorimetry-skin-layout,.ftcl-colorimetry-preparation { grid-template-columns:1fr; }
    .ftcl-colorimetry-reference-portrait { max-width:430px; }
    .ftcl-colorimetry-axes,.ftcl-colorimetry-two-columns { grid-template-columns:1fr; }
    .ftcl-colorimetry-observe { grid-template-columns:1fr; gap:6px; }
    .ftcl-colorimetry-season-logic { grid-template-columns:1fr; gap:5px; }.ftcl-colorimetry-season-logic > i { display:none; }
    .ftcl-colorimetry-cta { grid-template-columns:1fr; }
    .ftcl-colorimetry-cta > img,.ftcl-colorimetry-cta > .ftcl-media-frame { width:100%; height:auto; min-height:0; aspect-ratio:8 / 5; object-fit:cover; }
    .ftcl-colorimetry-cta > .ftcl-colorimetry-cta-copy { min-height:190px; padding:24px 122px 24px 22px; }
    .ftcl-colorimetry-cta-copy > strong { font-size:22px; }
    .ftcl-colorimetry-cta-sticker { top:auto; right:18px; bottom:31px; width:88px; height:88px; padding:13px 7px 10px; transform:rotate(7deg); }
    .ftcl-colorimetry-cta-sticker b { font-size:15px; }.ftcl-colorimetry-cta-sticker small { margin-top:6px; font-size:8px; }
    .ftcl-colorimetry-cta:hover .ftcl-colorimetry-cta-sticker,.ftcl-colorimetry-cta:focus-visible .ftcl-colorimetry-cta-sticker { transform:rotate(-3deg) scale(1.04); }
    .ftcl-colorimetry-sources { padding:22px 19px 25px; }.ftcl-colorimetry-sources > div { grid-template-columns:1fr; }
    .ftcl-colorimetry-foot { display:block; padding:13px 16px; }.ftcl-colorimetry-foot p+p { margin-top:6px; }
}

@media (max-width: 480px) {
    .ftcl-colorimetry-hero-copy { min-height:270px; padding:28px 22px 30px; }
    .ftcl-colorimetry-hero h1 { font-size:43px; }
    .ftcl-colorimetry-hero-copy > p:last-child { font-size:16px; }
    .ftcl-colorimetry-card-copy { grid-template-columns:22px minmax(0,1fr); padding:8px; }.ftcl-colorimetry-card-copy strong { font-size:12px; }.ftcl-colorimetry-card-copy small { font-size:11px; }
    .ftcl-colorimetry-section { grid-template-columns:32px minmax(0,1fr); }
    .ftcl-colorimetry-copy { padding:19px 12px 22px; }
    .ftcl-colorimetry h2 { font-size:25px; }
    .ftcl-colorimetry-boundaries,.ftcl-colorimetry-drapes,.ftcl-colorimetry-value-cases,.ftcl-colorimetry-contrast-cases,.ftcl-colorimetry-seasons,.ftcl-colorimetry-wardrobe-grid,.ftcl-colorimetry-process,.ftcl-colorimetry-myths ul,.ftcl-colorimetry-faq { grid-template-columns:1fr; }
    .ftcl-colorimetry-definitions p,.ftcl-colorimetry-preparation li { grid-template-columns:1fr; gap:4px; }
    .ftcl-colorimetry-chroma-rows article { grid-template-columns:58px minmax(0,1fr); }.ftcl-colorimetry-chroma-rows span { display:none; }
    .ftcl-colorimetry-formulas { grid-template-columns:1fr; }
    .ftcl-colorimetry-value-scale { grid-template-columns:repeat(5,1fr); }.ftcl-colorimetry-value-scale span { grid-column:span 5; padding:5px 0; }.ftcl-colorimetry-value-scale span:last-child { text-align:right; }
    .ftcl-colorimetry-cta > .ftcl-colorimetry-cta-copy { min-height:180px; padding:20px 96px 20px 16px; }.ftcl-colorimetry-cta-copy > strong { font-size:19px; }.ftcl-colorimetry-cta-copy > em { padding:9px 10px; font-size:11px; }.ftcl-colorimetry-cta-sticker { right:12px; bottom:30px; width:74px; height:74px; padding:10px 5px 8px; }.ftcl-colorimetry-cta-sticker b { font-size:12px; }.ftcl-colorimetry-cta-sticker small { margin-top:4px; font-size:7px; }
    .ftcl-colorimetry-capsule { min-height:135px; }.ftcl-colorimetry-capsule span { padding:7px 4px; font-size:8px; }.ftcl-colorimetry-capsule b { font-size:11px; }
}
