@font-face{font-family:Geologica;src:url('../assets/scotland/geologica-300.ttf') format('truetype');font-weight:300;font-display:swap}@font-face{font-family:Geologica;src:url('../assets/scotland/geologica-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Geologica;src:url('../assets/scotland/geologica-500.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:Geologica;src:url('../assets/scotland/geologica-700.ttf') format('truetype');font-weight:700;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:#fff;color:#000;font:300 15px/1.35 Geologica,Arial,sans-serif}a{color:inherit}button,summary{font:inherit}button{color:inherit;cursor:pointer}img{display:block;max-width:100%;height:auto}figure,p{margin:0}p+p{margin-top:22px}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #9c9366;outline-offset:5px}.skip-link{position:fixed;top:12px;left:12px;padding:10px;background:#fff;z-index:20;transform:translateY(-200%)}.skip-link:focus{transform:none}
.hero{--screen:100vh;position:relative;height:calc(var(--screen)*2);background:#263233;color:#fff}.hero-sticky{height:var(--screen);position:sticky;top:0;overflow:hidden}.hero-picture,.hero-picture img{width:100%;height:100%;display:block}.hero-picture img{object-fit:cover;object-position:center}.hero-gradient{position:absolute;inset:0;background:url('../assets/wolfhound/title-gradient-01.webp') center/cover;opacity:var(--veil,.8);pointer-events:none}.hero-copy{position:absolute;left:15%;width:70%;top:0;height:var(--screen);padding-top:clamp(60px,15vh,200px);padding-top:clamp(60px,15dvh,200px);text-align:center;color:#ffffff80}.hero h1{font-size:clamp(48px,7vw,112px);font-weight:700;line-height:1.2;letter-spacing:-1.6px;margin:0}.subtitle{font-size:clamp(20px,2vw,32px);font-weight:400;margin-top:40px}.credit{font-size:clamp(15px,1.5vw,23px);font-weight:300;line-height:1.35;max-width:580px;margin:20px auto 0}.project-date{position:absolute;top:20vh;left:3.5%;font-size:15px;writing-mode:vertical-rl;transform:rotate(180deg);color:#c2c7b399}
.introduction{padding:150px 0 140px}.introduction>.prose{width:43.75%;margin-left:48.333%}.prose{font-size:clamp(15px,1.25vw,22px)}h2{font-size:clamp(36px,4vw,64px);font-weight:500;line-height:1.05;letter-spacing:-.8px;margin:0 0 45px}
.process{display:grid;grid-template-columns:42% 48%;gap:5%;padding:0 2% 0 10%;align-items:start}.process-copy{position:sticky;top:10vh;padding-top:20px}.process-copy .prose{max-width:36em}.process-copy p+p{margin-top:40px}.skip-sequence{display:inline-block;font-size:12px;color:#777;margin-top:28px}.process-visual{min-width:0}.drawing-frame{position:relative}.drawing-step{width:100%;height:auto;margin-bottom:30px}.drawing-step[data-src]{display:none}.step-count{display:none}
.has-wolf-js .process-visual{height:720vh}.has-wolf-js .drawing-frame{position:sticky;top:5vh;width:100%;height:min(80vh,42vw)}.has-wolf-js .drawing-step{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;margin:0;opacity:0;visibility:hidden;transition:opacity .16s}.has-wolf-js .drawing-step.active{opacity:1;visibility:visible}.has-wolf-js .step-count{display:block;position:absolute;right:8px;bottom:8px;font-size:12px;color:#777;background:#ffffffbd;padding:4px 8px}
.dark{background:#1a1c1b;color:#ddd}.reference-collage{position:relative;width:100%;aspect-ratio:1200/1030}.reference{position:absolute;left:var(--left);top:var(--top);width:20.833%}.zoom-image{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in;text-align:inherit}.zoom-image img{width:100%;height:auto}.reference-note,.attribution-note{position:absolute;left:51.667%;width:20.833%;padding:22px 25px;background:#897e51;color:#111;font-size:clamp(12px,1.25vw,20px)}.reference-note{top:54%}.attribution-note{top:76%;background:#aaa17a;font-size:clamp(11px,1.05vw,17px)}.draft-collage{position:relative;aspect-ratio:1200/740}.draft{position:absolute;width:20.833%}.draft-1{left:3.333%;top:5.4%}.draft-2{left:27.5%;top:43.4%}.draft-3{left:3.333%;top:38.1%}.draft-4{left:51.667%;top:12.8%;width:45%}.draft-note{position:absolute;left:27.5%;top:23.4%;width:20.833%;padding:25px;background:#c0c0c0;color:#111;font-size:clamp(13px,1.25vw,20px)}
.closer{display:grid;grid-template-columns:46% 46%;gap:6%;padding:80px 2% 0;align-items:start}.closer-overview{position:sticky;top:25px;min-width:0}.closer h2{margin:0 0 12px;color:#6f847d}.laptop-note{font-size:12px;color:#a8b3ad;margin-bottom:30px}.closer-overview .zoom-image{max-width:600px;margin-inline:auto}.details-gallery figure{margin-bottom:24px}.details-gallery figure:first-child .zoom-image img{max-height:none}.ornament-band{position:relative;min-height:190px;overflow:hidden;padding:80px 0 50px}.ribbon{width:100%;max-width:none;transform:rotate(-2deg)}.vertical-ornament{position:absolute;width:28px;left:13%;bottom:0;height:200px;object-fit:cover;object-position:top;opacity:.7}.whole-map{margin:0}.whole-map>summary{cursor:pointer;list-style:none;text-align:center;padding:35px 20px 65px;font-size:18px;color:#6f847d;font-weight:500}.whole-map>summary::-webkit-details-marker{display:none}.whole-map[open]>summary span{display:inline-block;transform:rotate(180deg)}.whole-map-content img{width:100%;height:auto}.whole-map-content a{display:block}.lightbox{width:100%;height:100%;max-width:100vw;max-height:100dvh;margin:auto;padding:65px 20px 25px;border:0;background:transparent;overflow:auto;color:#fff}.lightbox::backdrop{background:#111e}.lightbox>img{max-width:100%;max-height:82dvh;object-fit:contain;margin:auto;width:auto}.close-lightbox{position:fixed;right:22px;top:12px;width:42px;height:42px;line-height:1;border:0;border-radius:50%;background:#fff;color:#111;font-size:32px;z-index:2}.open-image{display:block;text-align:center;margin:20px auto;font-size:14px}body:has(.lightbox[open]){overflow:hidden}
@supports(height:100dvh){.hero{--screen:100dvh}}
@media(max-width:1000px){.introduction{padding:100px 25px}.introduction>.prose{width:75%;margin-left:25%}.process{padding-left:4%;grid-template-columns:44% 49%;gap:4%}.process-copy{top:40px}.process-copy p+p{margin-top:25px}h2{margin-bottom:30px}.reference-note,.attribution-note{padding:12px}.draft-note{padding:16px}}
@media(max-width:700px){body{font-size:15px}.hero-copy{left:8%;width:84%;padding-top:15dvh}.hero h1{font-size:clamp(40px,10vw,65px);line-height:1.1;letter-spacing:-1px}.subtitle{font-size:20px;margin-top:28px}.credit{font-size:14px;margin-top:20px;max-width:330px}.hero-gradient{background-image:url('../assets/wolfhound/title-gradient_mobil.webp')}.project-date{top:auto;bottom:calc(100dvh + 25px);left:25px;writing-mode:horizontal-tb;transform:none;font-size:13px}.introduction{padding:65px 25px 75px}.introduction>.prose{width:100%;margin:0}.prose{font-size:15px}.process{display:block;padding:0 25px}.process-copy{position:static;padding:0 0 35px}.process h2{font-size:36px}.has-wolf-js .process-visual{height:600vh}.has-wolf-js .drawing-frame{top:12vh;height:min(75vh,calc(100vw - 50px))}.reference-collage{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:45px 20px}.reference{position:static;width:auto;align-self:start}.reference-note,.attribution-note{position:static;width:auto;grid-column:1/-1;font-size:14px;line-height:1.4;padding:22px}.reference-note{grid-row:1}.attribution-note{margin:0}.draft-collage{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:35px 20px 55px}.draft{position:static;width:auto}.draft-4{grid-column:1/-1}.draft-note{position:static;width:auto;grid-column:1/-1;font-size:15px;padding:22px;grid-row:1}.closer{display:block;padding:35px 20px 0}.closer-overview{position:static;margin-bottom:35px}.closer h2{font-size:36px}.closer-overview .zoom-image{max-width:440px}.details-gallery{display:grid;grid-template-columns:1fr;gap:20px}.details-gallery figure{margin:0}.ornament-band{min-height:130px;padding-top:55px}.vertical-ornament{height:120px;width:18px}.whole-map>summary{font-size:16px;padding:30px 20px 50px}.lightbox{padding-inline:10px}}
@media(max-height:480px) and (orientation:landscape){.hero-copy{padding-top:12dvh}.hero h1{font-size:36px;line-height:1.05}.subtitle{font-size:18px;margin-top:15px}.credit{font-size:12px;margin-top:10px;max-width:500px}.project-date{top:15vh}.process-copy{position:static}.has-wolf-js .drawing-frame{top:5vh;height:85vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.drawing-step{transition:none}}