.color-guide{padding:40px 0 65px}.color-guide .wrap{max-width:1120px}.guide-hero{display:grid;grid-template-columns:1.15fr 1fr;gap:70px;align-items:center;padding:22px 0 64px}.guide-hero h1{font-size:clamp(36px,4vw,57px);line-height:1.35;letter-spacing:-.055em;margin:26px 0}.guide-intro{font-size:16px;line-height:1.9;color:var(--text-soft);margin-bottom:26px}.guide-meta{font-size:11px;color:var(--text-soft);margin-top:22px}.guide-hero figure{margin:0;background:var(--guide-tone);padding:20px 28px;color:#28352b;transform:rotate(1.5deg)}.guide-hero svg{display:block;width:100%;height:360px}.guide-hero figcaption{font-size:13px;border-top:1px solid #bec4b7;padding:18px 0 0;margin:5px 0 0}.guide-checks{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;border-top:1px solid var(--line);padding:35px 0 40px}.guide-checks article>span{font:italic 28px Georgia,serif;color:var(--text-soft)}.guide-checks h2{font-size:19px;margin:15px 0 12px}.guide-checks p{font-size:14px;line-height:1.85;color:var(--text-soft);margin:0}.guide-looks{padding:30px 0;scroll-margin-top:120px}.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 26px}.guide-look{min-width:0;border:1px solid var(--line);display:flex;flex-direction:column}.guide-look-art{position:relative;background:var(--guide-tone);padding:20px 28px}.guide-look-art svg{width:100%;height:240px;display:block}.guide-number{font:italic 22px Georgia,serif;position:absolute;top:16px;left:17px;color:#28352b}.guide-look-copy{padding:23px;display:flex;flex:1;flex-direction:column}.guide-mood{font-size:11px;letter-spacing:.04em;color:var(--text-soft);margin:0 0 10px}.guide-look h3{font-size:21px;line-height:1.4;letter-spacing:-.03em;margin:0 0 15px}.guide-look-copy>p:not(.guide-mood){font-size:13px;line-height:1.85;color:var(--text-soft);margin:0 0 15px}.guide-check b{display:block;font-size:11px;font-weight:650;margin-bottom:3px;color:var(--text)}.guide-look-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:17px;border-top:1px solid var(--line);margin-top:auto;font-size:12px}.guide-look-actions label{display:flex;align-items:center;gap:7px;cursor:pointer;min-height:36px}.guide-look-actions input{accent-color:var(--accent);width:18px;height:18px;margin:0}.guide-look-actions a{text-underline-offset:4px}.guide-share-bar{position:sticky;bottom:16px;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 25px;background:var(--surface);border:1px solid var(--line-strong);box-shadow:0 5px 20px #0000000a}.guide-share-bar b{font-size:16px}.guide-share-bar span{font-size:12px;margin-left:10px;color:var(--text-soft)}.guide-share-bar p{font-size:12px;margin:8px 0 0;line-height:1.6;color:var(--text-soft)}.guide-share-bar button{white-space:nowrap;font:inherit;font-size:13px;cursor:pointer}.guide-share-bar button:disabled{opacity:.45;cursor:not-allowed}.guide-status{font-size:13px;line-height:1.7;color:var(--accent);min-height:1.7em;margin:12px 0}.guide-faq,.guide-related{padding:30px 0;border-bottom:1px solid var(--line)}.guide-faq h2,.guide-related h2{font-size:23px;letter-spacing:-.03em;margin:0 0 25px}.guide-faq details{border-top:1px solid var(--line);padding:20px 0}.guide-faq summary{cursor:pointer;font-size:15px;font-weight:600}.guide-faq p{font-size:14px;line-height:1.9;color:var(--text-soft)}.guide-related>div{display:flex;flex-wrap:wrap;gap:15px 28px}.guide-related a{font-size:13px;text-underline-offset:5px}.guide-disclosure{font-size:12px;line-height:1.9;color:var(--text-soft);margin-top:24px}.guide-disclosure a{text-decoration:underline}.color-guide :focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:850px){.guide-hero{gap:35px}.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-checks{gap:20px}.guide-checks h2{font-size:17px}}
@media(max-width:600px){.color-guide{padding-top:15px}.guide-hero{grid-template-columns:1fr;gap:30px;padding-bottom:42px}.guide-hero h1{font-size:38px}.guide-intro{font-size:14px}.guide-hero figure{margin:0 4px;padding:16px 24px}.guide-hero svg{height:300px}.guide-checks{grid-template-columns:1fr;gap:25px;padding-bottom:15px}.guide-checks article{padding-left:42px;position:relative}.guide-checks article>span{position:absolute;left:0;top:8px}.guide-checks h2{margin-top:10px}.guide-grid{grid-template-columns:1fr;gap:25px}.guide-look-art svg{height:270px}.guide-share-bar{bottom:8px;padding:15px;gap:14px;display:block}.guide-share-bar p{font-size:11px}.guide-share-bar button{width:100%;justify-content:center;margin-top:13px;padding:12px}.guide-faq summary{line-height:1.8}.guide-related>div{display:grid;gap:18px}}