.concept-page .hero{min-height:745px}.concept-page .hero-copy{width:53%;max-width:660px}.concept-page .hero h1{font-size:clamp(52px,4.4vw,72px);line-height:.99;max-width:610px}.concept-page .hero-intro{max-width:370px}.concept-hero:after{background:linear-gradient(90deg,#e7d4bcd9,#e7d4bc99 32%,#e7d4bc22 55%,transparent 72%)}.concept-page .hero-image{object-position:70% center}.concept-questions{background:var(--navy);color:var(--ivory);overflow:hidden}.concept-questions h2{font-size:clamp(42px,3.7vw,59px);max-width:1100px}.questions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:36px}.question-panel{border:1px solid var(--sand);border-bottom:0;border-radius:50% 50% 0 0;padding:38px 22px 24px;min-width:0;text-align:center}.concept-art{position:relative;display:block;width:100%;height:190px;overflow:hidden;isolation:isolate}.concept-art>span,.concept-page .task-art>span{position:absolute;top:50%;left:0;width:100%;aspect-ratio:1;transform:translateY(-50%);background-image:url('concept-studies.webp');background-size:300% 200%;background-position:var(--x) var(--y);transition:transform .7s}.question-panel:hover .concept-art>span{transform:translateY(-53%) scale(1.025)}.question-diagram{height:125px;width:100%;max-width:240px;display:block;margin:-5px auto 12px;color:#cbd0cf;opacity:.8}.diagram-accent{stroke:#d1ad72}.question-panel h3{font:500 italic 27px/1.12 var(--serif);max-width:17ch;margin:auto}.concept-questions .scope-caption{padding-top:20px;margin-top:20px}.concept-context{font-size:13px;line-height:1.8;color:#cbd3da;max-width:100ch;margin:25px auto 0;text-align:center}.concept-page .documentation-tasks h2{font-size:clamp(40px,3.65vw,57px)}.concept-page .documentation-task{grid-template-columns:.85fr 60px 1.2fr 1fr}.concept-page .task-art{mix-blend-mode:normal;height:152px}.concept-page .task-art:after{display:none}.concept-page .documentation-task h3{font-size:clamp(29px,2.45vw,37px)}.concept-stages{overflow:hidden;background:linear-gradient(120deg,#f0dfc8,#dfc9a9)}.concept-stages h2{font-size:clamp(42px,3.8vw,60px)}.stages-intro{font:500 24px/1.3 var(--serif);margin-top:15px;max-width:none}.stages-list{list-style:none;padding:0;margin:20px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;position:relative}.stages-list li{position:relative;text-align:center}.stages-list li+li:before{content:'';width:25px;height:1px;background:#a88350;position:absolute;left:-26px;top:50%}.stages-list .concept-art{height:200px;max-width:310px;margin:auto}.stages-list h3{font-size:28px;line-height:1.1}.stage-pair{display:flex;height:200px;align-items:center}.stage-pair .concept-art{width:58%;height:180px;flex-shrink:0}.stage-pair .concept-art+.concept-art{margin-left:-16%;transform:translateY(12px)}.stages-note{font:500 italic 21px/1.35 var(--serif);text-align:center;max-width:none;margin-top:29px}.stages-context{font-size:13px;text-align:center;max-width:none;color:#4b504e;margin-top:13px}.concept-page .related-links :is(button,a){font-size:23px}
@media(min-width:1700px){.concept-page .hero{min-height:850px}.concept-page .hero h1{font-size:82px;max-width:720px}.concept-page .hero-copy{max-width:760px}.question-panel .concept-art{height:240px}.question-diagram{height:150px}.concept-page .task-art{height:190px}.stages-list .concept-art,.stage-pair{height:240px}}
@media(max-width:1200px){.concept-page .hero{min-height:730px}.concept-page .hero h1{font-size:57px}.concept-page .hero-copy{width:56%}.question-panel{padding:30px 15px 22px}.question-panel .concept-art{height:155px}.question-diagram{height:100px}.question-panel h3{font-size:25px}.concept-page .documentation-task{grid-template-columns:.8fr 45px 1.1fr 1fr}.concept-page .task-art{height:140px}.stages-list .concept-art,.stage-pair{height:180px}.stage-pair .concept-art{height:150px}.stages-list h3{font-size:25px}}
@media(max-width:1000px){.concept-page .hero{min-height:700px}.concept-page .hero-copy{width:56%}.concept-page .hero h1{font-size:clamp(53px,6.2vw,64px)}.concept-page .hero-intro{font-size:24px}.questions-grid{gap:12px}.question-panel{padding-inline:12px}.question-panel h3{font-size:25px}.stages-list{gap:24px}.stages-list li+li:before{width:20px;left:-22px}}
@media(max-width:700px){.concept-page .hero{min-height:0;padding-bottom:340px}.concept-page .hero-copy{width:100%;max-width:570px}.concept-page .hero h1{font-size:clamp(47px,8.5vw,60px);max-width:540px}.concept-page .hero-intro{max-width:440px}.concept-page .hero-image{height:350px;object-position:right center}.concept-hero:after{background:linear-gradient(180deg,transparent calc(100% - 350px),#e3c9a5 calc(100% - 350px),transparent calc(100% - 245px))}.concept-questions h2{font-size:44px}.questions-grid{grid-template-columns:1fr;gap:26px;max-width:370px;margin:30px auto 0}.question-panel{padding:35px 30px 23px;border-bottom:1px solid var(--sand)}.question-panel .concept-art{height:200px}.question-diagram{height:115px;margin-top:-20px}.question-panel h3{font-size:29px}.concept-page .documentation-task{grid-template-columns:100px 38px 1fr}.concept-page .task-art{height:110px}.concept-page .documentation-task h3{font-size:29px}.concept-page .documentation-tasks h2{font-size:43px}.concept-context{font-size:13px;text-align:left}.concept-page .concept-stages{padding-bottom:43px}.concept-stages h2{font-size:43px}.stages-list{grid-template-columns:1fr;gap:26px;max-width:420px;margin:24px auto 0}.stages-list .concept-art,.stage-pair{height:210px;max-width:300px;margin:auto}.stage-pair .concept-art{height:190px}.stages-list h3{font-size:30px}.stages-list li+li:before{width:1px;height:22px;left:50%;top:-16px}.stages-note{font-size:21px}.stages-context{font-size:13px}.concept-page .related-links :is(button,a){font-size:23px}}
@media(max-width:450px){.concept-page .hero h1{font-size:47px}.concept-page .documentation-task{grid-template-columns:42px 1fr}.concept-page .task-art{display:none}.concept-page .documentation-task h3{font-size:31px}.question-panel{padding-inline:22px}.concept-questions h2{font-size:43px}}
@media(prefers-reduced-motion:reduce){.concept-art>span,.concept-page .task-art>span{transition:none}.question-panel:hover .concept-art>span{transform:translateY(-50%)}}