/* Alex Binyon portfolio refresh — layered after the original theme */
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root { --ink:#121411; --paper:#f2f0e9; --acid:#d7ff3f; --warm:#e55c36; --line:rgba(18,20,17,.2); --font-1:"Space Grotesk",sans-serif; --font-2:"Space Grotesk",sans-serif; }
html { scroll-behavior:smooth; }
body { background:var(--paper); color:var(--ink); }
.s-header { height:9.2rem; background:transparent; border-bottom:1px solid rgba(255,255,255,.22); }
.s-header .row { max-width:none; padding:0 5vw; position:relative; }
.s-header__logo { position:absolute!important; left:50%!important; top:0!important; transform:translateX(-50%)!important; width:14rem!important; --logo-width:auto; margin:0!important; z-index:3; }
.s-header__logo a { width:max-content!important; height:auto; color:#fff!important; font:600 2rem/1 "Space Grotesk",sans-serif; letter-spacing:-.04em; white-space:nowrap!important; }
.s-header__logo a:hover { color:#fff; }
.logo-mark { color:var(--acid); }
.s-header__nav { position:absolute!important; right:5vw!important; top:0!important; }
.s-header__nav a { font:500 1.2rem/1 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.s-header__nav li.current a, .s-header__nav .current a { background:transparent!important; background-color:transparent!important; color:var(--acid)!important; box-shadow:inset 0 -2px 0 var(--acid); }
.s-header__nav li a:hover { color:var(--acid); }
.s-header.sticky { background:rgba(18,20,17,.94); backdrop-filter:blur(12px); }
.s-home { min-height:94vh; background:#171914; position:relative; isolation:isolate; }
.s-home::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(10,12,9,.9) 0%,rgba(10,12,9,.57) 48%,rgba(10,12,9,.15) 100%),url('../images/portfolio/Pitlochry/overview.jpg') center 42%/cover no-repeat; }
.s-home::after { content:""; position:absolute; inset:0; z-index:-1; opacity:.25; background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px); background-size:8vw 8vw; }
.s-home__content { padding-top:10rem; }
.s-home__slide-text { max-width:100rem; }
.s-home__slide-text h1 { font:500 clamp(5rem,7.2vw,10.5rem)/.95 "Space Grotesk",sans-serif; letter-spacing:-.065em; color:#fff; max-width:110rem; margin:2rem 0 3rem; }
.s-home__slide-text h1 span { color:var(--acid); }
.hero-kicker,.section-label { font:500 1.2rem/1.4 "DM Mono",monospace; text-transform:uppercase; letter-spacing:.13em; }
.hero-kicker { color:var(--acid); }
.hero-name { color:#fff; font:600 clamp(2.7rem,4vw,5.2rem)/1 "Space Grotesk",sans-serif; letter-spacing:-.055em; margin:1.7rem 0 0; }
.hero-intro { color:rgba(255,255,255,.78); font-size:clamp(1.7rem,2vw,2.2rem); line-height:1.5; max-width:64rem; }
.hero-actions { display:flex; align-items:center; gap:3rem; flex-wrap:wrap; margin-top:4rem; }
.hero-actions .btn { margin:0; background:var(--acid); color:var(--ink); border-color:var(--acid); }
.hero-link { color:#fff; font-weight:600; border-bottom:1px solid rgba(255,255,255,.45); padding:.8rem 0; }
.hero-link:hover { color:var(--acid); }
.hero-index { position:absolute; left:5vw; bottom:3rem; display:flex; align-items:center; gap:1.4rem; color:rgba(255,255,255,.62); font:1.05rem "DM Mono",monospace; text-transform:uppercase; letter-spacing:.12em; }
.hero-index__line { width:8rem; height:1px; background:rgba(255,255,255,.45); }
.s-about { background:var(--acid); padding:14rem 0; }
.about-content { align-items:center; }
.about-image { position:relative; }
.about-image img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:50% 58%; filter:saturate(.76) contrast(1.04); border-radius:0; box-shadow:2rem 2rem 0 var(--ink); }
.about-role { font-family:"DM Mono",monospace; text-transform:uppercase; font-size:1.1rem; letter-spacing:.1em; margin-top:4rem; }
.about-social a { color:var(--ink)!important; }
.about-text { padding-left:8vw; }
.section-label { color:var(--warm); margin-bottom:2rem; }
.s-about .section-label { color:rgba(18,20,17,.65); }
.about-text h2,.section-head h2 { font:600 clamp(4rem,6vw,8rem)/.98 "Space Grotesk",sans-serif; letter-spacing:-.055em; color:var(--ink); }
.about-text .lead { color:var(--ink); font-size:2rem; }
.about-services { display:flex; flex-wrap:wrap; gap:1rem; list-style:none; margin:4rem 0 0; padding:0; }
.about-services li { border:1px solid var(--ink); border-radius:99px; padding:.8rem 1.5rem; font:500 1.1rem "DM Mono",monospace; text-transform:uppercase; }
.s-portfolio { background:var(--paper); padding:14rem 0; }
.s-portfolio .section-head { border-top:1px solid var(--line); padding-top:3rem; margin-bottom:8rem; }
.s-portfolio .section-head .lead { color:#4b4e47; max-width:70rem; font-size:2rem; }
.folio-list { column-gap:0; row-gap:0; }
.folio-item { padding:1.2rem!important; }
.folio-item__thumb { position:relative; overflow:hidden; background:var(--ink); transition:transform .22s ease,box-shadow .22s ease; transform-style:preserve-3d; will-change:transform; }
.folio-item__thumb::after { content:"View project ↗"; position:absolute; right:2rem; top:2rem; z-index:3; background:var(--acid); color:var(--ink); padding:.7rem 1rem; font:500 1rem "DM Mono",monospace; text-transform:uppercase; transform:translateY(-7rem); transition:.35s ease; }
.folio-item__thumb:hover::after { transform:translateY(0); }
.folio-item__thumb img { aspect-ratio:4/3; object-fit:cover; filter:saturate(.78); transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s; }
.folio-item__thumb:hover img { transform:scale(1.045); filter:saturate(1); opacity:.72; }
.folio-item__text { position:absolute!important; left:1.4rem!important; right:auto!important; bottom:1.4rem!important; max-width:calc(100% - 2.8rem); padding:1.1rem 1.4rem!important; background:rgba(18,20,17,.92); color:#fff!important; font:600 1.6rem/1.15 "Space Grotesk",sans-serif!important; text-align:left!important; transform:none!important; opacity:1!important; backdrop-filter:blur(6px); }
.folio-item__thumb:hover .folio-item__text { background:var(--acid); color:var(--ink)!important; }
.modal-popup__details { font-family:"DM Mono",monospace; }
.s-contact { background:var(--ink); position:relative; overflow:hidden; }
.s-contact::after { content:"LET'S MAKE"; position:absolute; right:-2vw; bottom:-4vw; color:rgba(255,255,255,.035); font:700 16vw/1 "Space Grotesk",sans-serif; white-space:nowrap; pointer-events:none; }
.s-contact .section-head { margin-bottom:7rem; }
.s-contact .section-head h2 { color:#fff; font-size:clamp(5rem,9vw,12rem); line-height:.87; max-width:110rem; overflow-wrap:normal; word-break:normal; }
.s-contact .section-label { color:var(--acid); }
.s-contact .display-1 { font-size:clamp(3.5rem,5vw,6.8rem); line-height:1.04; letter-spacing:-.045em; }
.s-contact .btn--primary { background:var(--acid); border-color:var(--acid); color:var(--ink); }
.s-footer { background:#3d413c!important; background-color:#3d413c!important; border-top:1px solid rgba(255,255,255,.22); }
.s-footer, .s-footer a { color:rgba(255,255,255,.9)!important; }
.s-footer .ss-copyright, .s-footer .ss-copyright span { color:rgba(255,255,255,.88)!important; opacity:1!important; }
.s-footer .ss-copyright span::after { color:rgba(255,255,255,.45)!important; }
.s-footer a:hover { color:var(--acid); }

/* A playful custom pointer that becomes a project label over the work. */
@media (pointer:fine) {
  .cursor-ready, .cursor-ready a, .cursor-ready button { cursor:none; }
  .play-cursor { position:fixed; left:0; top:0; z-index:99999; width:1.8rem; height:1.8rem; margin:-.9rem 0 0 -.9rem; border-radius:50%; background:var(--acid); pointer-events:none; transition:width .2s,height .2s,margin .2s,background .2s; mix-blend-mode:difference; }
  .play-cursor span { display:none; }
  .play-cursor.is-link { width:4rem; height:4rem; margin:-2rem 0 0 -2rem; }
  .play-cursor.is-project { width:7.2rem; height:7.2rem; margin:-3.6rem 0 0 -3.6rem; background:var(--acid); mix-blend-mode:normal; display:grid; place-items:center; }
  .play-cursor.is-project span { display:block; color:var(--ink); font:500 1rem "DM Mono",monospace; letter-spacing:.08em; }
  .hero-actions a { transition:transform .2s ease,background-color .2s,color .2s; }
}
@media screen and (max-width:900px) {
  .s-header__logo { left:5vw!important; transform:none!important; margin:0!important; }
  .s-header__nav { top:8rem; right:0; }
}
@media screen and (min-width:901px) and (max-width:1100px) {
  .s-header__nav { right:1.5vw!important; }
  .s-header__nav a { padding-left:1rem; padding-right:1rem; }
}
@media screen and (max-width:800px) { .s-header{height:8rem}.s-header__logo{left:5vw;transform:none;margin:0}.s-header__logo a{font-size:1.8rem}.s-header__menu-toggle{right:5vw}.s-header__nav{right:0}.s-header__nav li.current a{box-shadow:none}.s-home{min-height:86rem}.s-home__slide-text h1{font-size:clamp(4.5rem,13vw,7rem)}.hero-index{display:none}.s-about,.s-portfolio{padding:9rem 0}.about-text{padding:7rem 0 0}.about-image img{box-shadow:1.2rem 1.2rem 0 var(--ink)}.folio-item{padding:.8rem 0!important}.s-contact .section-head h2{font-size:clamp(4.7rem,15vw,8rem)} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important} }