/* A small editorial control layer for the existing immersive work gallery. */
[hidden], .work-enhanced .project-card[hidden] { display: none !important; }
.work-toolbar { position:relative;z-index:4;margin-bottom:48px;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:15px 0 12px;background:var(--paper); }
.work-filters { display:flex;flex-wrap:wrap;gap:6px 8px; }
.work-filters button { border:1px solid transparent;background:transparent;color:var(--ink);padding:9px 12px;font:600 12px/1.4 var(--body);border-radius:2px;cursor:pointer;transition:background .2s,color .2s; }
.work-filters button span { font-family:var(--ethiopic);font-weight:400;margin-left:7px;opacity:.65; }
.work-filters button:hover { border-color:var(--line); }
.work-filters button[aria-pressed="true"] { background:var(--ink);color:var(--paper); }
.work-navigation { display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:12px; }
#work-results { font-size:11px;letter-spacing:.03em;color:var(--muted); }
.work-pages { display:flex;gap:8px; }
.work-pages button { border:1px solid var(--line);background:transparent;width:38px;height:32px;font-size:20px;cursor:pointer; }
.work-pages button:hover:enabled { background:var(--yellow); }
.work-pages button:disabled { opacity:.25;cursor:default; }
.work-enhanced .work-toolbar { position:absolute;left:var(--page);right:var(--page);top:20px;margin:0; }
.work-enhanced .work-track { padding-top:140px; }
.work-enhanced .project-media { height:min(46svh,510px); }
.work-enhanced .section-heading h2 { font-size:clamp(64px,7vw,130px); }
.work-enhanced .project-caption { flex-wrap:wrap;gap:8px 20px; }
.work-enhanced .project-caption h3 { font-size:clamp(25px,2.3vw,42px); }
.work-enhanced .project-caption>span { font-size:11px; }
.work-enhanced .project-caption-link { font-size:11px; }
.portfolio-media { background:var(--project-color,var(--paper)); }
.portfolio-media .portfolio-cover { position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center; }
.portfolio-cover .vertex-reel { inset:0;width:100%;height:100%;object-fit:contain; }
.portfolio-cover.reel-on .vertex-reel { opacity:1; }
.portfolio-media .portfolio-cover img { width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 12px 16px #0002); }
.portfolio-media:hover .portfolio-cover img { scale:1.02; }
.project-dialog { max-height:90svh; }
.project-dialog-media { display:block;padding:48px 0 0;background:#e7e3db; }
.project-dialog-media img,.project-dialog-media video { display:block;width:100%;height:min(59svh,650px);max-height:none;object-fit:contain;margin:auto;background:#e7e3db; }
.gallery-caption { font-size:12px;line-height:1.5;padding:14px 24px;border-bottom:1px solid var(--line);color:var(--ink); }
.project-gallery-controls { display:flex;gap:12px;overflow:auto;padding:16px 24px;scrollbar-width:thin;border-bottom:1px solid var(--line); }
.project-gallery-controls button { flex:0 0 150px;padding:6px;border:1px solid var(--line);background:transparent;text-align:left;cursor:pointer; }
.project-gallery-controls button[aria-pressed="true"] { border:2px solid var(--yellow);padding:5px; }
.project-gallery-controls img { display:block;width:100%;height:76px;object-fit:contain;background:#e7e3db; }
.project-gallery-controls span { display:block;font:500 11px/1.4 var(--body);padding:7px 2px 2px; }
.enquiry-section { padding-bottom:100px; }
.contact-place { font-size:11px;letter-spacing:.08em; }
.contact-form-layout { display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;margin-top:65px;align-items:start; }
.contact-form-intro>p { max-width:430px;font-size:18px;line-height:1.7; }
.contact-form-intro>.text-link { display:table;margin-top:22px; }
.contact-paper-mark { background:var(--paper);max-width:340px;padding:26px 30px;margin:48px 0;transform:rotate(-4deg);box-shadow:8px 10px 0 #25292328;border-top:10px solid #d7d0c1;border-bottom:10px solid #d7d0c1; }
.contact-paper-mark span { font:25px var(--ethiopic);color:#a64228; }
.contact-paper-mark b { display:block;font:500 32px/1.1 var(--display);margin:20px 0;letter-spacing:-.04em; }
.contact-paper-mark i { display:block;text-align:right;font:38px var(--ethiopic); }
.contact-form-intro .course-crosslink { font-size:13px;max-width:330px; }
.course-crosslink a { text-decoration:underline;text-underline-offset:4px; }
.learning-page .learn-section { padding-top:20px; }
.learning-page .learn-title { font-family:var(--display); }
.learning-page .learn-art { --learn-open:1; }
.learning-page .site-footer { margin-top:0; }
@media (max-width:1100px) {
  .work-filters { gap:3px; }
  .work-filters button { padding:8px;font-size:11px; }
  .work-enhanced .work-track { padding-top:170px; }
  .work-enhanced .project-caption-link { margin-left:0; }
}
@media (max-height:760px) and (min-width:901px) {
  .work-enhanced .project-media { height:40svh;padding:40px 40px 65px; }
  .work-enhanced .project-caption { margin-top:12px;padding-top:12px; }
  .work-enhanced .section-heading h2 { font-size:65px; }
  .work-enhanced .section-heading>p { padding-top:18px; }
  .work-enhanced .work-hint { margin-top:18px; }
}
@media (max-width:800px) {
  .contact-form-layout { grid-template-columns:1fr;gap:32px;margin-top:35px; }
  .contact-paper-mark { display:none; }
  .contact-form-intro .course-crosslink { margin-top:24px; }
  .contact-form-intro>p { font-size:15px; }
  .enquiry-section { padding-bottom:70px; }
}
@media (max-width:700px) {
  .work-toolbar { margin-bottom:30px; }
  .work-filters { gap:5px 2px; }
  .work-filters button { padding:8px;font-size:11px; }
  .work-filters button span { margin-left:4px; }
  .project-dialog-media img,.project-dialog-media video { height:44svh;min-height:200px; }
  .gallery-caption { padding:12px 16px;font-size:11px; }
  .project-gallery-controls { padding:12px 16px;gap:8px; }
  .project-gallery-controls button { flex-basis:125px; }
  .contact-form-intro>.text-link { font-size:14px; }
  .learning-page .learn-section { padding-top:0; }
  .learning-page .learn-body { margin-top:40px; }
  .learning-page .learn-art { min-height:420px; }
}

/* Visible media plays in place without shifting the original artwork frame. */
.project-preview-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.contact-scroll-art{min-height:540px;margin:40px 0 45px;max-width:440px;width:100%}
.contact-scroll-art .learning-paper{height:470px;width:90%;padding:26px}
.contact-scroll-art .paper-headline{font-size:66px;line-height:1.02}
.contact-scroll-art .paper-headline span{font-size:.61em;letter-spacing:-.06em}
.contact-scroll-art .learn-note{bottom:0;left:0}
.contact-scroll-art .learn-doodle{right:0;top:0}
/* Classroom: quiet ink, a bright application panel and a typographic specimen. */
.learning-page{background:var(--paper)}
.academy-main{padding:40px var(--page) 100px}
.academy-entry{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:start;max-width:1500px;margin:auto}
.academy-intro{padding:16px 0 0}
.academy-intro h1{font:600 clamp(62px,6.3vw,110px)/.94 var(--display);letter-spacing:-.065em;margin:27px 0}
.academy-intro h1 em{font-family:Georgia,serif;font-weight:400}
.academy-intro h1>span{color:var(--yellow)}
.academy-description{max-width:370px;font-size:15px;line-height:1.75;margin:0 0 24px}
.academy-status{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.academy-status .status-dot{background:var(--yellow)}
.registration-panel{background:var(--yellow);padding:36px 40px 30px;position:relative;box-shadow:10px 12px 0 var(--ink)}
.registration-panel::before{content:'';position:absolute;left:0;right:0;top:0;height:5px;background:repeating-linear-gradient(90deg,var(--ink) 0 20px,transparent 20px 30px)}
.registration-panel .course-form{padding:0;margin:0;background:none;box-shadow:none}
.registration-heading{border-bottom:1px solid #25292350;padding-bottom:22px;margin-bottom:22px}
.registration-heading h2{font:600 clamp(35px,3.2vw,55px)/1.02 var(--display);letter-spacing:-.05em;margin:15px 0 12px}
.registration-heading h2 em{font-family:Georgia,serif;font-weight:400}
.registration-heading>p:last-child{font-size:12px;line-height:1.7;max-width:360px}
.registration-panel input,.registration-panel select{background:#fff9;border:1px solid #25292355;border-radius:0;min-height:47px;padding:11px 13px;width:100%}
.registration-panel .field{margin-bottom:16px}
.registration-panel .field label{font-size:11px;font-weight:600}
.registration-panel .button{width:100%;margin-top:3px;min-height:55px}
.registration-panel .form-note{font-size:10px;line-height:1.6;margin-top:12px}
.design-specimen{position:relative;margin-top:35px;max-width:370px;height:155px;border:1px solid var(--line);overflow:hidden;background:linear-gradient(90deg,transparent 49.8%,#25292312 50%,transparent 50.2%),linear-gradient(transparent 49.8%,#25292312 50%,transparent 50.2%)}
.specimen-letter{font:500 110px/1.2 Georgia,serif;letter-spacing:-.12em;position:absolute;left:28px;top:-6px}
.specimen-letter .amharic{font-size:74px;margin-left:35px;color:var(--yellow)}
.specimen-caption{position:absolute;bottom:12px;left:18px;font-size:8px;letter-spacing:.14em}
.specimen-cross{position:absolute;font-size:15px;z-index:1}.cross-a{left:8px;top:2px}.cross-b{right:8px;bottom:2px}
.design-specimen i{position:absolute;top:0;bottom:0;width:1px;background:var(--yellow);animation:specimen-pass 6s ease-in-out infinite;left:10%}
@keyframes specimen-pass{50%{left:90%}}
.motion-paused .design-specimen i{animation:none;left:50%}
.academy-mobile-cta{display:none}
.academy-next{max-width:1500px;margin:90px auto 0;padding-top:45px;border-top:1px solid var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:8vw}
.academy-next h2{font:500 clamp(34px,4vw,60px)/1.04 var(--display);letter-spacing:-.05em;margin-top:22px}
.academy-next h2 em{font-family:Georgia,serif;font-weight:400}
.academy-next ol{list-style:none;padding:0;margin:0}
.academy-next li{display:flex;gap:24px;padding:20px 0;border-bottom:1px solid var(--line)}
.academy-next li:first-child{padding-top:0}.academy-next li b{font-size:30px;font-weight:400}
.academy-next h3{font:600 21px var(--display);margin-bottom:7px}.academy-next li p{font-size:12px;line-height:1.7}
@media(max-width:1000px){.academy-entry{gap:5vw}.registration-panel{padding:28px}.academy-main{padding-top:26px}.academy-intro h1{font-size:70px}.contact-scroll-art .paper-headline{font-size:55px}}
@media(max-width:800px){.academy-entry{grid-template-columns:1fr;gap:32px}.academy-main{padding-top:20px}.academy-intro{padding:0}.academy-intro h1{font-size:clamp(44px,10vw,70px);margin:20px 0}.academy-intro h1 br{display:none}.academy-intro h1 em::after{content:' ';white-space:pre}.academy-description{max-width:480px;margin-bottom:18px;font-size:14px}.design-specimen{display:none}.academy-mobile-cta{display:inline-flex;margin-top:22px}.registration-panel{padding:28px 24px;box-shadow:7px 9px 0 var(--ink)}.registration-heading h2{font-size:40px}.academy-next{grid-template-columns:1fr;gap:30px;margin-top:65px}.contact-scroll-art{margin:30px auto 45px;min-height:440px;max-width:350px}.contact-scroll-art .learning-paper{height:390px}.contact-scroll-art .paper-headline{font-size:58px}.academy-next h2{font:500 40px/1.06 var(--display)}}
@media(prefers-reduced-motion:reduce){.design-specimen i{animation:none;left:50%}}

.contact-scroll-art .classroom-scroll{height:470px;width:90%;max-width:none}
.contact-scroll-art .learning-paper{height:100%;width:100%}
@media(max-width:800px){.contact-scroll-art .classroom-scroll{height:390px;width:90%}}
@media(max-width:600px){.registration-panel .form-row{display:block}}

/* Client feedback: local gallery scroll and a concise two-level filter. */
.scroll-rubric{justify-content:center;text-align:center}
.contact-scroll-art .paper-headline span{font:inherit;color:inherit;letter-spacing:inherit}
.contact-scroll-cta{color:var(--yellow);font:600 15px/1.25 var(--body);max-width:170px}
.hero-actions .button:hover,.learn-section .course-form>.button:hover,.registration-panel .button:hover,.enquiry-dialog .button:hover{background:#111;color:#fff;border-color:#111}
.work-subfilters{display:flex;flex-wrap:wrap;gap:3px 6px;margin-top:7px;border-top:1px solid var(--line);padding-top:7px}
.work-subfilters button{font:500 11px/1.4 var(--body);border:0;border-bottom:1px solid transparent;background:transparent;padding:5px 8px;cursor:pointer;color:var(--ink)}
.work-subfilters button[aria-pressed=true]{border-color:var(--yellow);color:#a74421}
.work-subfilters button span{font-family:var(--ethiopic);opacity:.55;margin-left:5px}
.work-empty{max-width:340px;line-height:1.8;font-size:14px;padding:30px}
.work-enhanced .work-stage{position:relative;top:auto;height:min(100svh,1050px);min-height:620px;overflow:hidden}
.work-enhanced .work-viewport{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--yellow) transparent}
.work-enhanced .work-track{width:max-content;height:100%;padding-top:200px;padding-bottom:65px;transform:none!important}
.work-enhanced .work-toolbar{top:20px}
.work-enhanced .work-progress{bottom:28px;pointer-events:none}
.work-viewport:focus-visible{outline:2px solid var(--yellow);outline-offset:-3px}
.whatsapp-contact{position:fixed;right:24px;bottom:max(24px,env(safe-area-inset-bottom));width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:white;z-index:25;box-shadow:0 4px 16px #0003;transition:transform .2s,background .2s}
.whatsapp-contact img{width:28px;height:28px}
.whatsapp-contact:hover{background:#1fbd5a;transform:translateY(-3px)}
.dialog-open .whatsapp-contact{visibility:hidden}
@media(max-width:700px){.whatsapp-contact{right:18px;width:50px;height:50px;bottom:max(18px,env(safe-area-inset-bottom))}.work-subfilters{gap:3px}.work-subfilters button{padding:5px 6px;font-size:10px}.contact-scroll-cta{font-size:13px}.work-empty{padding:20px 0}}

/* Keep the filters clear of the returning floating navigation. */
.work-enhanced .work-toolbar{top:92px}
.work-enhanced .work-track{padding-top:270px}
@media(max-height:760px) and (min-width:901px){.work-enhanced .work-track{padding-top:250px}.work-enhanced .project-media{height:36svh}}

/* Local cleanup: a quiet CTA and gallery-first work section. */
.cursor-ring.is-link{opacity:0}
.hero-actions .button{transition:none}
.hero-actions .button:hover{background:var(--yellow);border-color:var(--yellow);color:var(--ink);transform:none}
.work-title-accessible{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.work-enhanced .work-track{gap:0;padding-left:var(--page)}

/* Small section label requested above the work filters. */
.work-eyebrow{margin:0 0 17px;font-size:11px;font-weight:500;letter-spacing:.1em}
.work-eyebrow .geez{font-size:16px}

.form-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;opacity:0;pointer-events:none}
.form-submit-status{margin-top:14px;line-height:1.7}

/* Homepage enquiry card returns to orange; the surrounding page stays paper. */
#contact-us.enquiry-section{background:var(--paper)}
#contact-us .course-form{background:var(--yellow);box-shadow:none;border:1px solid var(--line)}
#contact-us .course-form>.button{background:var(--ink);border-color:var(--ink);color:var(--paper)}
#contact-us .course-form>.button:hover{background:var(--paper);border-color:var(--ink);color:var(--ink)}

/* Larger, darker text keeps the orange enquiry card easy to read. */
#contact-form{color:#171b16}
#contact-form .field{gap:10px;margin-bottom:26px}
#contact-form .field label{font-size:14px;font-weight:600;line-height:1.5}
#contact-form .field input,#contact-form .field select,#contact-form .field textarea{color:#171b16;font-size:16px;line-height:1.5;min-height:48px;border-bottom-color:#171b16a6}
#contact-form .field input::placeholder,#contact-form .field textarea::placeholder{color:#292d25;opacity:1}
#contact-form .field input:focus-visible,#contact-form .field select:focus-visible,#contact-form .field textarea:focus-visible{outline:2px solid #171b16;outline-offset:4px;background:#ffffff14}
#contact-form .form-note{color:#171b16;font-size:12px;line-height:1.7}
#contact-us #contact-form>.button{font-size:16px;min-height:58px}
@media(max-width:520px){#contact-form .form-row{grid-template-columns:1fr;gap:0}}
