/* ColoriTous Atelier — presentation layer; catalog and editor behavior remain independent. */
:root{--ct-ink:#172c50;--ct-muted:#53627a;--ct-surface:#fcfdff;--ct-soft:#eef4ff;--ct-border:#dae4f3;--ct-font-body:"Avenir Next",Avenir,"Segoe UI",sans-serif;--ct-font-heading:"Trebuchet MS","Avenir Next",sans-serif;--ct-content-width:1280px;--ct-radius:24px;--ct-shadow:0 12px 32px #172c5009;--ct-space:clamp(20px,4vw,64px);--ct-space-sm:12px;--ct-space-md:24px;--ct-space-lg:48px}
body{background:#f8fbff;font-size:16px;line-height:1.7}h1,h2,h3{text-wrap:balance}h1,h2{letter-spacing:-.045em}h2{font-size:clamp(28px,3vw,40px)}button,a,input,select{ -webkit-tap-highlight-color:transparent}a,button{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid var(--ct-secondary);outline-offset:4px}
.ct-color-strip{height:5px;background:linear-gradient(90deg,#2457c5 0 46%,#f3bd4f 46% 70%,#4285e4 70% 88%,#8e9fde 88%)}
.ct-header{background:var(--ct-surface);border-bottom:1px solid var(--ct-border)}.ct-header-inner{min-height:94px;gap:32px}.ct-brand{font-size:28px;letter-spacing:-1.3px}.ct-brand img{width:48px;height:48px}.ct-nav-list{font-size:14px;gap:26px}.ct-icon-button{border-color:var(--ct-border);background:transparent;width:44px;height:44px}.ct-account-link{border-radius:12px;min-height:44px}.ct-button{border-radius:12px;font-size:14px;gap:12px;min-height:48px;padding:14px 22px}.ct-button:hover{filter:brightness(.94)}
.ct-hero{padding-block:64px 72px;gap:60px;grid-template-columns:1.1fr 1fr}.ct-hero h1{font-size:clamp(40px,4.1vw,60px);line-height:1.09;margin:20px 0 24px;font-weight:800}.ct-hero h1 mark{display:inline;background:none;color:var(--ct-primary)}.ct-hero-copy>p:not(.ct-eyebrow){font-size:17px;max-width:520px}.ct-eyebrow{font-size:11px;letter-spacing:.15em;color:var(--ct-secondary)}.ct-hero-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:28px}.ct-hero-actions .ct-text-link{font-size:13px}.ct-hero .ct-search-form{margin:26px 0 14px;gap:8px}.ct-search-input{border:1px solid var(--ct-border);border-radius:12px;box-shadow:none;padding:12px 16px}.ct-search-form .ct-button{padding-inline:16px}.ct-hero .ct-pills{margin:12px 0 20px}.ct-pills a,.ct-pills a:nth-of-type(n){background:var(--ct-surface);border:1px solid var(--ct-border);font-weight:500;padding:6px 12px}.ct-pills a:hover{border-color:var(--ct-primary)}.ct-hero-copy .ct-hero-note{display:flex;align-items:center;gap:8px;font-size:12px!important;color:var(--ct-muted)}.ct-hero-note .ct-icon{width:16px;height:16px}
.ct-hero-art{height:480px;background:#e3efff url('../images/paper-pattern.svg');border-radius:48% 48% 40% 42%;isolation:isolate}.ct-hero-sheet{border:1px solid #e8dfe0;border-radius:12px;padding:18px;box-shadow:0 12px 30px #172c5020;width:53%}.ct-hero-sheet--0{top:62px;left:2%;transform:rotate(-12deg);z-index:2}.ct-hero-sheet--1{top:20px;right:1%;transform:rotate(10deg);box-shadow:0 12px 30px #172c5020}.ct-hero-sheet--2{bottom:15px;right:10%;width:48%;transform:rotate(5deg);z-index:3;box-shadow:0 12px 30px #172c5020}.ct-hero-sheet img{height:218px}.ct-hero-sheet--2 img{height:170px}.ct-hero-sheet span{font-size:11px}.ct-hero-spark{width:56px;height:56px;bottom:26px;left:6%}.ct-art-note{position:absolute;right:0;top:-22px;padding:8px 18px;border-radius:8px;background:#f3bd4f;color:#172c50;transform:rotate(6deg);font:700 14px var(--ct-font-heading);z-index:4}
mark{background:none;color:var(--ct-primary)}.ct-section-block{padding-block:64px}.ct-section-heading{margin-bottom:32px}.ct-section-heading h2{font-size:clamp(28px,3vw,38px)}.ct-section-heading .ct-text-link{border-bottom:1px solid var(--ct-border);padding-bottom:5px}.ct-band--peach{background:#edf4ff;border-block:1px solid var(--ct-border)}.ct-band--lavender{background:#f1f6ff}.ct-band--mint{background:#edf3ff;border-block:1px solid var(--ct-border)}
.ct-drawing-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.ct-drawing-card{border-radius:16px;box-shadow:none;max-width:100%}.ct-drawing-art{padding:35px 24px 18px}.ct-drawing-art img{height:220px}.ct-drawing-card h3{padding:18px 20px;font-size:15px;background:var(--ct-surface)}.ct-level{font-size:11px;top:12px;left:14px;padding:4px 8px;color:#5e5266}.ct-category-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}.ct-category-card{border-radius:18px}.ct-category-art,.ct-category-card:nth-child(n) .ct-category-art{background:#fff0d4}.ct-category-card:nth-child(3n+2) .ct-category-art{background:#edeafd}.ct-category-card:nth-child(3n) .ct-category-art{background:#ffe7df}.ct-category-art img{height:190px}.ct-category-card h3{font-size:20px}.ct-count{color:#53627a;font-size:12px}
.ct-online-promo{gap:72px;padding-block:64px}.ct-online-promo h2{font-size:clamp(32px,4vw,48px)}.ct-promo-art{border:0;background:none;box-shadow:none;transform:none;width:100%;padding:0;max-width:520px}.ct-promo-art img{width:100%;height:auto;border-radius:24px}.ct-palette{border:0}.ct-steps{border-top:1px solid var(--ct-border);padding-top:36px}.ct-steps>div>span{background:#e4efff;border-radius:12px}.ct-benefits{gap:36px}.ct-benefits .ct-icon{width:32px;height:32px}.ct-about h2{font-size:clamp(32px,4vw,46px)}
.ct-footer{background:#172c50;color:#e1ebfa;border:0}.ct-footer .ct-brand{color:#fcfdff}.ct-footer .ct-brand img{background:#fcfdff;border-radius:12px}.ct-footer-top{padding-block:48px 32px}.ct-footer-inner{border-color:#4c6389;padding-block:24px}.ct-footer-links a{color:#e1ebfa}.ct-footer-links a:hover{text-decoration:underline}.ct-footer-links a{display:inline-block;padding-block:5px}.ct-back-top{bottom:16px;right:16px}
.ct-page-heading{padding-block:48px 22px}.ct-page-heading h1{font-size:clamp(32px,4vw,50px)}.ct-heading-rule{width:64px;height:5px}.ct-filter-bar{border:1px solid var(--ct-border);background:var(--ct-surface);padding:20px}.ct-filter-link{min-height:44px}.ct-panel{background:var(--ct-surface);box-shadow:none}.ct-preview-panel{background:#eaf1ff}.ct-download-panel{border:1px solid var(--ct-border);border-radius:24px;background:var(--ct-surface)}.ct-editorial{max-width:800px;font-size:17px}.ct-editorial h2{font-size:28px}.ct-empty,.ct-gallery-empty{background:var(--ct-soft);border:1px dashed var(--ct-border)}.ct-paint-paper{background:#e6efff}.ct-paint-tools button,.ct-paint-actions button{min-height:44px}.ct-paint-cloud{border-color:var(--ct-border)}.ct-member-status{background:#e4efff;color:#244782}.ct-creation-card{padding:20px;border-radius:20px;box-shadow:var(--ct-shadow)}.ct-favorites-list>div{border-color:var(--ct-border)}.ct-member-space input[type=submit]{min-height:48px}.ct-dialog{border-radius:20px}.ct-dialog::backdrop{background:#172c5080}.ct-search-theme{border-radius:14px}
html[data-theme=dark]{--ct-ink:#edf4ff;--ct-muted:#c0cde0;--ct-surface:#1c2b45;--ct-soft:#263a58;--ct-border:#486080;--ct-primary:#a8c8ff;--ct-secondary:#b4d7ff}html[data-theme=dark] body{background:#142138}html[data-theme=dark] .ct-band--peach,html[data-theme=dark] .ct-band--mint,html[data-theme=dark] .ct-band--lavender{background:#192b46}html[data-theme=dark] mark{background:none}html[data-theme=dark] .ct-hero-art{background-color:#2a3f60}html[data-theme=dark] .ct-preview-panel,html[data-theme=dark] .ct-paint-paper{background:#2a3e5c}html[data-theme=dark] .ct-pills a,html[data-theme=dark] .ct-steps>div>span{background:var(--ct-soft)}html[data-theme=dark] .ct-member-status{background:#2a3f60;color:#edf4ff}html[data-theme=dark] .ct-member-space input[type=submit],html[data-theme=dark] .ct-paint .ct-button{color:#172c50}html[data-theme=dark] .ct-brand img{background:#fcfdff;border-radius:12px}
@media(prefers-reduced-motion:no-preference){.ct-drawing-card,.ct-category-card,.ct-creation-card{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.ct-drawing-card:hover,.ct-category-card:hover{transform:translateY(-4px);box-shadow:var(--ct-shadow);border-color:var(--ct-secondary)}.ct-button,.ct-icon-button{transition:background-color .15s ease,box-shadow .15s ease}}
@media(min-width:1450px){.ct-hero{padding-block:80px}.ct-hero-art{height:510px}}
@media(max-width:1100px){.ct-header-inner{gap:20px}.ct-nav-list{gap:18px}.ct-brand{font-size:24px}.ct-hero{gap:28px}.ct-hero-art{height:430px}.ct-hero-sheet img{height:175px}.ct-hero-sheet--2 img{height:145px}.ct-hero h1{font-size:44px}}
@media(max-width:900px){.ct-header-inner{gap:12px;min-height:82px}.ct-hero{grid-template-columns:1fr 1fr}.ct-hero h1{font-size:37px}.ct-hero-art{height:390px}.ct-hero-sheet{width:60%;padding:12px}.ct-hero-sheet--2{width:54%}.ct-hero-sheet img{height:150px}.ct-hero-sheet--2 img{height:135px}.ct-hero-actions{gap:16px}.ct-hero-actions .ct-button{width:100%}.ct-hero .ct-search-form{flex-wrap:wrap}.ct-hero .ct-search-form .ct-button{width:100%}.ct-online-promo{gap:35px}.ct-drawing-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ct-drawing-art{padding-inline:12px}.ct-drawing-art img{height:180px}}
@media(max-width:650px){.ct-header-inner{min-height:76px;gap:7px}.ct-brand{font-size:22px;gap:5px}.ct-brand img{width:36px;height:36px}.ct-icon-button{width:38px;height:38px}.ct-hero{grid-template-columns:1fr;padding-block:36px 48px;gap:36px}.ct-hero h1{font-size:clamp(36px,9.6vw,48px)}.ct-hero-copy>p:not(.ct-eyebrow){font-size:16px}.ct-hero-actions{gap:15px}.ct-hero-actions .ct-button{width:auto}.ct-hero .ct-search-form{flex-wrap:nowrap}.ct-hero .ct-search-form .ct-button{width:auto}.ct-hero-art{height:350px;width:min(100%,380px)}.ct-hero-sheet{width:54%}.ct-hero-sheet--0{top:46px}.ct-hero-sheet--1{top:20px}.ct-hero-sheet--2{width:50%;bottom:6px}.ct-hero-sheet img{height:155px}.ct-hero-sheet--2 img{height:135px}.ct-art-note{top:-12px;right:10px;font-size:12px}.ct-hero-spark{width:42px;height:42px}.ct-section-block{padding-block:42px}.ct-drawing-grid,.ct-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ct-drawing-art{padding:36px 10px 12px}.ct-drawing-art img{height:160px}.ct-drawing-card h3{font-size:13px;padding:14px 12px}.ct-category-art{padding:18px 10px}.ct-category-art img{height:150px}.ct-category-card h3{font-size:17px;padding:16px}.ct-online-promo{padding-block:42px;gap:25px}.ct-promo-art{max-width:480px}.ct-count{font-size:10px}.ct-filter-bar{padding:14px}.ct-footer-top{padding-block:36px 20px}.ct-footer-inner{font-size:12px}.ct-creation-card img{height:260px}.ct-eyebrow{font-size:10px}.ct-page-heading{padding-top:34px}}
@media(max-width:380px){.ct-brand{font-size:20px}.ct-hero .ct-search-form{flex-wrap:wrap}.ct-hero .ct-search-form .ct-button{width:100%}.ct-drawing-art img{height:135px}.ct-drawing-card h3{font-size:12px}}
@media print{body{background:#fff}.ct-download-panel{display:none}.ct-hero-actions{display:none}.ct-drawing-card,.ct-category-card{box-shadow:none}}
/* Soleil & encre: original illustrations and explicit difficulty symbols. */
.ct-hero-illustration{position:relative;min-width:0;align-self:center}.ct-hero-illustration>img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;border-radius:36px}.ct-hero-illustration .ct-art-note{top:14px;right:18px}.ct-hero h1 mark{color:var(--ct-primary)}
.ct-level{display:inline-flex;align-items:center;gap:5px;border-color:#e5dce5;background:#fcfdff;color:#172c50;line-height:1.3}.ct-level-icon{width:29px;height:23px;flex-shrink:0;vertical-align:middle;color:#172c50}.ct-filter-link .ct-level-icon{width:27px;height:22px}.ct-filter-link.is-active .ct-level-icon{color:currentColor}.ct-category-card h3{display:flex;align-items:center;gap:9px}.ct-category-card h3 .ct-icon{width:27px;height:27px;color:#172c50}.ct-paint-tools button{display:inline-flex;align-items:center;gap:8px}.ct-paint-tools .ct-icon{width:27px;height:27px}.ct-paint-tools button[aria-pressed=true]{background:#edf4ff;border-color:#2457c5}.ct-paint-actions .ct-icon{width:19px;height:19px}.ct-back-top>.ct-icon{transform:rotate(-90deg)}
html[data-theme=dark] .ct-paint-tools button[aria-pressed=true]{background:#284670;border-color:#a8c8ff}html[data-theme=dark] .ct-category-card h3 .ct-icon{color:var(--ct-ink)}html[data-theme=dark] .ct-filter-link:not(.is-active) .ct-level-icon{color:var(--ct-ink)}
@media(max-width:900px){.ct-hero-illustration .ct-art-note{top:0;font-size:12px;right:8px}}@media(max-width:650px){.ct-hero-illustration{width:min(100%,440px);margin:auto}.ct-hero-illustration>img{border-radius:24px}.ct-category-card h3{gap:7px}.ct-category-card h3 .ct-icon{width:23px;height:23px}.ct-level{font-size:10px;left:8px;top:8px;padding:3px 5px}.ct-level-icon{width:24px;height:20px}.ct-drawing-art{padding-top:42px}}
/* Reference structure: catalog-led hero, three layered cards, direct workshop example. */
.ct-hero-copy>h1{margin-top:0;font-size:clamp(36px,4.1vw,60px);line-height:1.15}.ct-hero-copy>h1 mark{background:linear-gradient(transparent 72%,#f8d78e 72% 95%,transparent 95%)}.ct-hero-copy>.ct-search-form{margin-top:24px}.ct-hero-copy>.ct-pills{margin-bottom:0}.ct-reference-hero{height:470px;background:none;border-radius:0}.ct-reference-hero .ct-hero-sheet{border:1.7px solid #172c50;box-shadow:6px 7px 0 #f3bd4f;width:56%;padding:14px}.ct-reference-hero .ct-hero-sheet--0{left:0;top:68px;transform:rotate(-7deg)}.ct-reference-hero .ct-hero-sheet--1{right:0;top:5px;transform:rotate(5deg);box-shadow:6px 7px 0 #e77861}.ct-reference-hero .ct-hero-sheet--2{right:13%;bottom:0;width:50%;transform:rotate(-3deg);box-shadow:6px 7px 0 #8e9fde}.ct-reference-hero .ct-hero-sheet img{height:220px}.ct-reference-hero .ct-hero-sheet--2 img{height:190px}.ct-reference-hero .ct-hero-sheet span{color:#172c50;font-size:11px}.ct-promo-instructions{padding-left:22px;color:var(--ct-muted);font-size:16px}.ct-promo-instructions li{padding-left:6px;margin-bottom:14px}.ct-promo-example{display:block;text-decoration:none;background:var(--ct-surface);border:1px solid var(--ct-border);border-radius:20px;overflow:hidden}.ct-promo-example>img{border-radius:0}.ct-promo-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;padding:16px;color:var(--ct-ink);font-size:13px}.ct-promo-tools>span{display:flex;align-items:center;gap:6px}.ct-promo-tools .ct-icon{width:22px;height:22px}.ct-participation-heading{font-size:23px;margin:36px 0 20px}.ct-participation-heading+.ct-steps{margin-top:0;padding-top:24px}.ct-gallery-account-note{padding:18px 22px;background:var(--ct-soft);border:1px solid var(--ct-border);border-radius:14px;font-size:14px;margin:28px 0 0}.ct-benefits .ct-level-icon{height:32px;width:40px}
html[data-theme=dark] .ct-hero-copy>h1 mark{background:linear-gradient(transparent 72%,#304e76 72% 95%,transparent 95%)}html[data-theme=dark] .ct-reference-hero{background:none}html[data-theme=dark] .ct-benefits .ct-level-icon{color:var(--ct-ink)}
@media(max-width:1100px){.ct-reference-hero{height:430px}.ct-reference-hero .ct-hero-sheet img{height:180px}.ct-reference-hero .ct-hero-sheet--2 img{height:165px}.ct-hero-copy>h1{font-size:44px}}
@media(max-width:900px){.ct-hero-copy>h1{font-size:37px}.ct-reference-hero{height:380px}.ct-reference-hero .ct-hero-sheet{width:60%;padding:10px}.ct-reference-hero .ct-hero-sheet img{height:150px}.ct-reference-hero .ct-hero-sheet--2{width:54%}.ct-reference-hero .ct-hero-sheet--2 img{height:140px}}
@media(max-width:650px){.ct-hero-copy>h1{font-size:clamp(36px,9.6vw,48px)}.ct-reference-hero{height:355px;width:min(100%,400px)}.ct-reference-hero .ct-hero-sheet{width:56%}.ct-reference-hero .ct-hero-sheet--0{top:48px}.ct-reference-hero .ct-hero-sheet--1{top:4px}.ct-reference-hero .ct-hero-sheet--2{width:50%;bottom:0}.ct-reference-hero .ct-hero-sheet img{height:155px}.ct-reference-hero .ct-hero-sheet--2 img{height:135px}.ct-promo-tools{gap:12px;font-size:12px}.ct-participation-heading{font-size:21px}}