.drawing-page { color:#2d504d; margin-bottom:52px; }
.breadcrumbs + .drawing-page { margin-top:24px; }
.drawing-page h1 { font-size:clamp(30px,4vw,48px); line-height:1.1; margin:12px 0 20px; letter-spacing:-1px; }
.drawing-page h2,.drawing-promo h2 { font-size:clamp(24px,3vw,32px); line-height:1.2; margin:10px 0 18px; color:#2d504d; }
.drawing-page h3 { font-size:25px; line-height:1.25; margin:12px 0 18px; }
.drawing-page p,.drawing-promo p { font-size:17px; line-height:1.7; }
.drawing-page figure { margin:0; }
.drawing-page img { object-fit:contain; height:auto; }
.drawing-page figcaption { font-size:13px; line-height:1.5; color:#62716c; padding:12px 6px 0; text-align:center; }
.drawing-hub-hero,.drawing-lesson-hero { border:2px solid #dfd6bf; border-radius:28px; background:#fffdf7; padding:36px; box-shadow:0 12px 24px #57462012; }
.drawing-hub-hero { background:linear-gradient(115deg,#fffdf7,#edf4e9); }
.drawing-hub-hero p { max-width:850px; }
.drawing-hub-lessons,.drawing-age-guide,.drawing-guide { margin-top:44px; }
.drawing-lesson-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.drawing-lesson-card { display:flex; flex-direction:column; min-width:0; gap:14px; border:2px solid #dfd6bf; border-radius:22px; background:#fffdf7; padding:18px; box-shadow:0 10px 22px #57462010; }
.drawing-lesson-card>div { display:flex; flex-direction:column; flex:1; }
.drawing-lesson-card .drawing-meta { margin:0 0 10px; gap:6px; }
.drawing-lesson-card .drawing-meta span { padding:6px 9px; font-size:12px; }
.drawing-lesson-card h3 { font-size:21px; margin:0 0 10px; }
.drawing-lesson-card p { font-size:15px; line-height:1.5; margin:0 0 16px; }
.drawing-lesson-card .primary-button { font-size:15px; padding:11px 12px; margin-top:auto; text-align:center; }
.drawing-card-image { background:#f8f1df; border-radius:18px; overflow:hidden; }
.drawing-card-image img { display:block; width:100%; height:190px; object-fit:contain; }
.drawing-lesson-card h3 a { text-decoration:none; }
.drawing-meta { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.drawing-meta span { border-radius:100px; background:#edf2e8; padding:8px 12px; font-size:13px; font-weight:bold; }
.drawing-age-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.drawing-age-grid section { padding:24px; background:#fffdf7; border:1px solid #ded8c7; border-radius:20px; }
.drawing-age-grid h3 { margin-top:0; }
.drawing-age-grid p { font-size:16px; }
.drawing-age-grid a { font-weight:bold; line-height:1.5; }
.drawing-guide { border-left:4px solid #76a187; padding:4px 0 4px 24px; }
.drawing-lesson-hero { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:36px; align-items:center; }
.drawing-lesson-hero figure { border-radius:18px; background:#f7f0df; padding:10px 10px 14px; }
.drawing-lesson-hero img { width:100%; border-radius:12px; }
.drawing-actions { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin:24px 0; }
.drawing-note { color:#68746b; font-size:14px!important; margin-top:28px; }
.drawing-preparation { display:grid; grid-template-columns:1fr 1fr; gap:36px; margin:38px 0; }
.drawing-preparation li { font-size:17px; line-height:1.6; margin:8px 0; }
.drawing-legend { background:#fffdf7; border-radius:20px; padding:24px; border:1px solid #dfd6bf; }
.drawing-legend h2 { font-size:24px; margin-top:0; }
.drawing-legend p { font-size:16px; }
.drawing-line { display:inline-block; width:32px; height:4px; vertical-align:middle; border-radius:4px; margin-right:10px; }
.drawing-line-old { background:#2d504d; }.drawing-line-new { background:#ee745e; }
.drawing-step-nav { display:flex; flex-wrap:wrap; gap:10px; padding:18px; margin:28px 0 38px; background:#efe9d7; border-radius:20px; }
.drawing-step-nav a { display:flex; align-items:center; gap:9px; min-height:44px; background:#fffdf7; border:1px solid #dbd1bb; border-radius:14px; padding:8px 15px; text-decoration:none; font-weight:bold; }
.drawing-step-nav b { color:#ae4738; }.drawing-step-nav a:hover { background:#fff0df; }
.drawing-step { display:grid; grid-template-columns:360px minmax(0,1fr); gap:36px; align-items:center; padding:30px; margin:22px 0; border:2px solid #dfd6bf; background:#fffdf7; border-radius:26px; box-shadow:0 8px 20px #5746200b; scroll-margin-top:18px; }
.drawing-step img { width:100%; border-radius:16px; }
.drawing-step-number { font-size:13px; font-weight:bold; letter-spacing:1.2px; color:#b44f3c; }
.drawing-tip { background:#f0f4e9; padding:20px; border-radius:16px; margin-top:24px; }
.drawing-tip b { font-size:15px; }.drawing-tip p { font-size:16px; margin:8px 0 0; }
.drawing-finish,.drawing-print-section { margin:42px 0; padding:30px; border:2px solid #dfd6bf; border-radius:24px; background:#fffdf7; }
.drawing-finish { display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:center; }
.drawing-result-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.drawing-result-grid img { width:100%; border-radius:14px; }
.drawing-print-section { display:grid; grid-template-columns:1fr 240px; gap:40px; align-items:center; }.drawing-print-section img { box-shadow:0 5px 16px #51452720; }
.drawing-print-section button { border:2px solid #dfd6bf; cursor:pointer; }.drawing-print-status { font-size:14px!important; }
.drawing-faq { margin:42px 0; }.drawing-faq details { border:1px solid #dfd6bf; border-radius:16px; background:#fffdf7; padding:18px 22px; margin:12px 0; }.drawing-faq summary { cursor:pointer; font-size:18px; font-weight:bold; line-height:1.5; }.drawing-faq p { margin-bottom:0; }
.drawing-updated { font-size:13px!important; color:#6b766e; }
.drawing-related { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin:46px 0; }.drawing-related section { border:2px solid #dfd6bf; background:#fffdf7; padding:24px; border-radius:22px; }.drawing-related h2 { font-size:24px; }.drawing-related a { display:block; padding:14px 0; text-decoration:none; border-top:1px dashed #d2c8b2; }.drawing-related b,.drawing-related span { display:block; }.drawing-related a span { font-size:15px; line-height:1.5; margin-top:8px; }.drawing-related img { float:right; width:105px; margin:0 0 12px 16px; border-radius:12px; }.drawing-related a::after { content:''; display:block; clear:both; }.drawing-related a:hover b { text-decoration:underline; }
.drawing-promo { display:grid; grid-template-columns:1fr 230px; gap:35px; align-items:center; padding:32px; margin-block:36px; color:#2d504d; border:2px solid #dfd6bf; border-radius:28px; background:#fffdf7; }.drawing-promo img { width:100%; height:auto; border-radius:18px; }
.drawing-print-only { display:none; }
@media(min-width:1660px) { .drawing-article .drawing-related { display:contents; }.drawing-article .drawing-related section { position:fixed; top:130px; width:215px; max-height:calc(100dvh - 150px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding:20px; z-index:10; }.drawing-article .drawing-related section:first-child { left:calc(50% - 797px); }.drawing-article .drawing-related section:last-child { right:calc(50% - 797px); }.drawing-article .drawing-related h2 { font-size:21px; }.drawing-article .drawing-related img { float:none; width:100%; margin:0 0 12px; } }
@media(max-width:800px) { .drawing-lesson-hero { grid-template-columns:1fr 190px; gap:22px; padding:24px; }.drawing-step { grid-template-columns:280px minmax(0,1fr); gap:22px; padding:22px; }.drawing-age-grid { grid-template-columns:1fr; }.drawing-finish { grid-template-columns:1fr; }.drawing-promo { grid-template-columns:1fr 180px; }.drawing-page .section-heading { display:block; } }
@media(max-width:620px) { .drawing-page h1 { font-size:32px; }.drawing-page p { font-size:16px; }.drawing-hub-hero,.drawing-lesson-hero { padding:24px 20px; }.drawing-lesson-hero,.drawing-preparation,.drawing-step,.drawing-lesson-card,.drawing-print-section,.drawing-related,.drawing-promo { grid-template-columns:1fr; }.drawing-lesson-hero figure { width:200px; margin:auto; }.drawing-lesson-card { padding:20px; }.drawing-card-image { width:100%; }.drawing-step { padding:20px; gap:24px; }.drawing-step figure { width:min(100%,300px); margin:auto; }.drawing-step-nav { gap:8px; padding:12px; }.drawing-step-nav a { flex:1 0 28%; padding:8px; font-size:14px; }.drawing-preparation { gap:18px; }.drawing-actions { align-items:stretch; }.drawing-actions>* { width:100%; text-align:center; }.drawing-print-section,.drawing-finish { padding:22px; }.drawing-print-section>a { width:210px; margin:auto; }.drawing-promo img { width:180px; margin:auto; }.drawing-related { gap:16px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media print { @page { size:A4 portrait; margin:10mm; } body { background:white!important; } body>* { display:none!important; } body>.drawing-print-only { display:block!important; }.drawing-print-only img { display:block; width:190mm; height:275mm; object-fit:contain; margin:0 auto; } }

@media(max-width:999px) { .drawing-lesson-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:620px) { .drawing-lesson-grid { grid-template-columns:1fr; } }