/* PrintScape Business: shared styles. Rules in CLAUDE.md.
   Colors, fonts, spacing and radius come from tokens.css only. */
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--font-sans); font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--font-display); font-weight:800; letter-spacing:-0.01em; line-height:1.1;}
a{color:inherit; text-decoration:none;}
img, video{display:block; max-width:100%;}
.wrap{max-width:var(--content-max); margin:0 auto; padding:0 var(--space-8);}
@media (max-width:560px){ .wrap{padding:0 var(--space-4);} }
.eyebrow{
  font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--green); font-weight:600;
}
.muted{color:var(--muted);}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}
.skip{position:absolute; left:-9999px; top:0; background:var(--ink); color:var(--bg); padding:10px 16px; z-index:100;}
.skip:focus{left:0;}
:focus-visible{outline:2px solid var(--green); outline-offset:3px;}

/* HEADER */
header{position:sticky; top:0; z-index:50; background:var(--bg); border-bottom:1px solid var(--line);}
nav.main{display:flex; align-items:center; justify-content:space-between; gap:24px; height:68px;}
.logo{font-family:var(--font-display); font-weight:800; font-size:20px; letter-spacing:-0.02em; display:inline-flex; align-items:baseline; gap:8px; white-space:nowrap;}
.logo-sub{font-family:var(--font-sans); font-size:10.5px; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted);}
.nav-right{display:flex; align-items:center; gap:36px;}
.navlinks{display:flex; gap:32px; font-size:14px; font-weight:500;}
.navlinks a{padding:6px 0; border-bottom:1px solid transparent; transition:border-color .2s;}
.navlinks a:hover{border-color:var(--line);}
.navlinks a[aria-current="page"]{border-color:var(--ink);}
.lang-toggle{display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; letter-spacing:0.06em; padding:6px 0; border-bottom:1px solid transparent; transition:border-color .2s;}
.lang-toggle:hover{border-color:var(--ink);}
.flag{width:18px; height:12px; display:block; border-radius:1px; outline:1px solid var(--line);}
.iconbtn{background:none; border:none; padding:0; width:44px; height:44px; display:none; align-items:center; justify-content:center; cursor:pointer; color:inherit; margin-right:-10px;}
.iconbtn svg{width:22px; height:22px;}
.mobile-menu{padding:8px 0 28px;}
.mobile-menu a{display:block; padding:12px 0; font-size:16px; font-weight:500; border-bottom:1px solid var(--line);}
.mobile-menu a[aria-current="page"]{color:var(--green);}
@media (max-width:880px){
  .navlinks{display:none;}
  .iconbtn{display:flex;}
  .nav-right{gap:8px;}
}
@media (min-width:881px){ .mobile-menu{display:none;} }

/* MEDIA + PLACEHOLDERS */
.media{position:relative; overflow:hidden; background:var(--bg-soft);}
.media img, .media video{width:100%; height:100%; object-fit:cover;}
.ph{
  background:var(--bg-soft); border:1px solid var(--line);
  display:flex; align-items:flex-end; padding:16px;
  color:var(--placeholder-ink);
}
.ph span{font-size:11px; letter-spacing:0.1em; text-transform:uppercase; font-weight:500; display:flex; align-items:center; gap:8px;}
.ph span::before{content:""; width:14px; height:1px; background:currentColor;}
.r-wide{aspect-ratio:16/9;}
.r-cinema{aspect-ratio:21/9;}
.r-photo{aspect-ratio:4/3;}
.r-square{aspect-ratio:1/1;}
.r-tall{aspect-ratio:4/5;}
@media (max-width:640px){ .r-cinema{aspect-ratio:4/3;} }
figure figcaption{font-size:12.5px; color:var(--muted); margin-top:12px; display:flex; justify-content:space-between; gap:16px;}

/* SECTIONS */
section{padding:var(--space-16) 0;}
@media (max-width:880px){ section{padding:48px 0;} }
.rule{border:none; border-top:1px solid var(--line); margin:0;}
.head{display:grid; grid-template-columns:1fr 2fr; gap:48px; margin-bottom:36px; align-items:start;}
@media (max-width:880px){ .head{grid-template-columns:1fr; gap:12px; margin-bottom:32px;} }
.head h2{font-size:clamp(24px, 3vw, 32px);}
.text-link{font-size:14px; font-weight:600; display:inline-flex; align-items:center; gap:10px; border-bottom:1px solid var(--ink); padding-bottom:3px; transition:gap .2s;}
.text-link:hover{gap:14px;}

/* HERO */
.hero{padding:64px 0 48px;}
@media (max-width:880px){ .hero{padding:40px 0 32px;} }
.hero h1{font-size:clamp(32px, 4.4vw, 50px); line-height:1.06; max-width:16ch;}
.hero-foot{display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-top:24px; align-items:end;}
@media (max-width:880px){ .hero-foot{grid-template-columns:1fr; gap:20px; margin-top:18px;} }
.lead{font-size:16px; line-height:1.6; color:var(--muted); max-width:44ch;}


/* PAGE TITLE (sub pages) */
.page-title{padding:56px 0 48px;}
@media (max-width:880px){ .page-title{padding:40px 0 32px;} }
.page-title h1{font-size:clamp(30px, 4vw, 44px); line-height:1.08; max-width:20ch; margin-top:10px;}
.page-title .lead{margin-top:16px;}

/* STATEMENT */
.statement{font-family:var(--font-display); font-weight:700; font-size:clamp(20px, 2.2vw, 26px); line-height:1.35; letter-spacing:-0.01em; max-width:40ch;}
.statement .muted{color:var(--muted);}

/* NUMBERED STEPS */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
.steps.four{grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:880px){ .steps, .steps.four{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .steps, .steps.four{grid-template-columns:1fr; gap:40px;} }
.step .num{font-family:var(--font-display); font-size:13px; font-weight:700; color:var(--green); letter-spacing:0.04em; margin:20px 0 10px; display:block; padding-top:14px; border-top:1px solid var(--ink);}
.step h3{font-size:18px;}
.step p{font-size:14.5px; color:var(--muted); margin-top:8px; max-width:34ch;}

/* SPLIT */
.split{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start;}
.split.flip > :first-child{order:2;}
@media (max-width:880px){ .split{grid-template-columns:1fr; gap:32px;} .split.flip > :first-child{order:0;} }
.split h2{font-size:clamp(24px, 3vw, 32px); margin-top:8px;}
.prose p{font-size:16px; color:var(--muted); max-width:52ch;}
.prose p + p{margin-top:14px;}
.prose .text-link{margin-top:28px;}

/* GALLERY */
.gallery{display:grid; grid-template-columns:repeat(2,1fr); gap:24px;}
.gallery .span{grid-column:1 / -1;}
@media (max-width:640px){ .gallery{grid-template-columns:1fr; gap:16px;} }

/* FACTS (definition list) */
.facts{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; border-top:1px solid var(--ink); padding-top:20px;}
@media (max-width:880px){ .facts{grid-template-columns:1fr 1fr;} }
.facts dt{font-size:11.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); font-weight:600;}
.facts dd{font-size:15px; margin-top:6px;}

/* TEAM */
.team{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:880px){ .team{grid-template-columns:1fr 1fr;} }
@media (max-width:480px){ .team{grid-template-columns:1fr;} }
.person h3{font-size:18px; margin-top:16px;}
.person p{font-size:14px; color:var(--muted); margin-top:4px;}

/* FOOTER (same as the Studio site; the only place with the email address) */
footer{background:var(--bg-soft); border-top:1px solid var(--line); padding:52px 0 24px; margin-top:var(--space-16);}
.foot-grid{display:grid; grid-template-columns:2fr 1fr 1fr; gap:32px;}
@media (max-width:880px){ .foot-grid{grid-template-columns:1fr 1fr;} .foot-grid > :first-child{grid-column:1 / -1;} }
@media (max-width:480px){ .foot-grid{grid-template-columns:1fr;} }
.foot-grid p{font-size:13px; color:var(--muted); margin-top:12px; max-width:34ch;}
.foot-grid h5{font-size:12.5px; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:14px; color:var(--muted); font-family:var(--font-sans);}
.foot-grid ul{list-style:none;}
.foot-grid li{font-size:13.5px; margin-bottom:9px;}
.foot-grid a:hover{border-bottom:1px solid var(--ink);}
.foot-bottom{display:flex; justify-content:space-between; margin-top:40px; padding-top:20px; border-top:1px solid var(--line); font-size:12px; color:var(--muted); flex-wrap:wrap; gap:10px;}