/* Shared editorial layout: fixed studio navigation and an open image canvas. */
:root{--bg:#fff;--text:#222;--gray:#999;--caption:#777;--rail:19.3vw;--pad:30px;--font-sans:Arial,Helvetica,sans-serif}
html,body{background:#fff;color:#222}body{font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:400;line-height:1.35}button,input{font:inherit}button{color:inherit}a:hover{text-decoration:none;color:#999}a:focus-visible,button:focus-visible,input:focus-visible{outline:1px solid #555;outline-offset:5px}[hidden]{display:none!important}
.site-header{position:fixed;top:30px;left:30px;width:calc(var(--rail) - 60px);background:transparent;z-index:100}.header-inner.container{display:block;width:100%;min-height:0;padding:0;margin:0}.wordmark{font-family:Arial,Helvetica,sans-serif;font-size:18px;font-weight:500;letter-spacing:-.7px;line-height:1.1}.wordmark sup{font-size:8px;margin-left:2px}.studio-location{margin:6px 0 27px;font-size:11px;line-height:1.3;color:#777}.primary-nav{display:flex;flex-direction:column;align-items:flex-start;gap:0;color:#222;font-size:16px;line-height:20px;overflow:visible;height:auto;opacity:1}.primary-nav>a{min-height:0}.primary-nav a[aria-current=page]{color:#999}.secondary-nav{display:flex;flex-direction:column;margin-top:36px;font-size:14px;line-height:21px}.search-toggle{padding:0;border:0;background:none;cursor:pointer}.search-toggle:hover{color:#999}.site-search{width:100%;margin-top:15px}.site-search label{font-size:11px;color:#777}.site-search input{width:100%;padding:8px 0;border:0;border-bottom:1px solid #aaa;border-radius:0;background:white;font-size:12px}.search-status{font-size:11px;color:#777}.search-results{display:grid;gap:10px;font-size:12px;max-height:45vh;overflow:auto}.menu-toggle{display:none}
.container.main-content,.container.page-main,.project-page,.info-main{width:auto;max-width:none;margin:0 30px 0 var(--rail);padding:30px 0 90px}.home-page .main-content{padding-top:30px}.studio-film{width:72%;margin:0 0 0 auto;aspect-ratio:16/9;background:#f5f5f5;overflow:hidden}.studio-film video{object-fit:cover}.film-control{position:absolute;right:12px;bottom:12px;padding:4px 8px;border:0;background:rgba(255,255,255,.85);font-size:11px;cursor:pointer;opacity:0;transition:opacity .2s}.studio-film:hover .film-control,.film-control:focus-visible{opacity:1}.home-page .intro{margin:160px 0 120px;grid-template-columns:1fr 1.5fr;gap:10%;align-items:start}.intro-philosophy{font-family:Arial,sans-serif;font-size:16px;line-height:1.4}.intro h1{grid-column:auto;font-size:21px;line-height:1.4;font-weight:400;letter-spacing:0}.intro-author{font-size:10px}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:110px 12%;align-items:start}.project-card:nth-child(odd){width:80%;margin-top:150px}.project-card:nth-child(even){width:100%}.project-card figure{aspect-ratio:4/3;background:#fafafa}.project-card:nth-child(4n+1) figure{aspect-ratio:3/4}.project-card img{object-fit:cover}.project-card p{margin-top:9px;font-size:12px;line-height:1.4;color:#999}.project-card strong{display:block;font-weight:400;color:#333}.project-card strong:after{content:none}.project-card span{display:block;font-size:11px}.project-card:hover img{transform:scale(1.015)}.more-work{justify-content:flex-end;padding:100px 0 0;font-size:14px}.more-work a{border-bottom:1px solid #bbb;padding-bottom:4px}.work-toolbar{display:flex;justify-content:space-between;gap:30px;align-items:baseline;margin-bottom:35px;font-size:13px}.work-toolbar p{margin:0}.work-filters{display:flex;gap:20px;flex-wrap:wrap}.work-filters button{background:none;border:0;padding:0;color:#aaa;cursor:pointer;font-size:13px}.work-filters button.is-active{color:#222}.work-page .project-grid{margin:0}.work-page .project-card:nth-child(even){margin-top:0}
.page-heading,.contact-intro{font-family:Arial,Helvetica,sans-serif;font-size:28px;line-height:1.3;letter-spacing:-.5px;font-weight:400;max-width:680px;margin:0 0 75px}.page-kicker{font-size:12px;margin:0 0 30px;color:#999}.page-copy,.about-introduction .page-copy{font-size:17px;line-height:1.6;letter-spacing:0}.about-layout{grid-template-columns:1fr 1fr;gap:12%}.about-caption{font-size:12px}.about-sections,.client-section,.key-people{margin-top:90px;border:0}.client-heading h2{font-size:22px;line-height:1.4;letter-spacing:0;font-weight:400}.client-group-title h3{font-size:24px;font-weight:400;line-height:1.2;letter-spacing:0}.client-group{grid-template-columns:1fr 3fr;border-color:#eee}.client-list-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.client-entry,.client-entry:nth-child(-n+3){border-top:1px solid #eee}.client-entry strong{font-size:13px;font-weight:400}.client-entry span{font-size:12px}.key-person figcaption{font-size:12px}.news-grid{gap:90px 9%}.news-card h2{font-size:21px;line-height:1.35;font-weight:400;letter-spacing:0}.news-card p{font-size:14px;line-height:1.5}.news-meta{font-size:11px}.contact-intro{max-width:650px;margin-bottom:100px}.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:45px;border:0}.contact-grid p{font-size:14px;line-height:1.6}.contact-grid h2{font-size:13px;font-weight:400}.contact-cta,.services-end a{border:0;border-bottom:1px solid #999;border-radius:0;padding:0 0 5px;min-width:0}.services-hero{grid-template-columns:1fr;gap:20px;margin-bottom:65px}.services-lead{font-size:16px;line-height:1.5;max-width:530px}.services-collage{margin-bottom:80px}.service-feature{grid-template-columns:30px 1fr 1.3fr;gap:25px;border-color:#eee;padding:30px 0 60px}.service-list{border-color:#eee}.service-summary h2{font-size:26px;letter-spacing:0;font-weight:400;line-height:1.2;margin-top:0}.service-summary p{font-size:14px}.service-deliverables{font-size:10px}.services-end{padding-top:70px}.services-end h2{font-size:32px;letter-spacing:-.5px;line-height:1.3;font-weight:400}
.project-hero{margin:0 0 65px;width:100%;height:auto;aspect-ratio:auto}.project-hero img{width:100%;height:auto;max-height:80vh;object-fit:contain}.project-info{grid-template-columns:1fr 1.5fr;gap:8%;padding:0;margin:0 0 90px}.project-title{font-family:Arial,sans-serif;font-size:27px;line-height:1.25;font-weight:400;letter-spacing:0;margin:0}.project-description{font-size:17px;line-height:1.55;letter-spacing:0}.project-meta{gap:25px;font-size:12px}.meta-label{font-size:11px}.meta-value{font-size:12px}.project-gallery{columns:2;column-gap:40px}.project-gallery-item{margin:0 0 40px}.project-gallery.is-dynamic .project-gallery-item img{aspect-ratio:auto;height:auto;object-fit:contain}.site-footer{margin-left:var(--rail);margin-right:30px;background:white}.footer-inner{width:100%;padding:45px 0 40px;border-top:1px solid #eee;gap:30px;grid-template-columns:repeat(3,minmax(0,1fr));font-size:11px;line-height:1.6}.footer-inner nav{display:none}.footer-inner address,.footer-inner div{padding:0}.footer-inner strong{font-weight:400}.footer-services{gap:0}.info-background{display:none}.info-page .info-main{position:static;color:#222}.info-page .accordion{max-width:700px}.info-page .accordion__button{font-size:28px;color:#222}.info-page .accordion__panel{font-size:16px;color:#555}
@media(min-width:1600px){:root{--rail:22vw}.container.main-content,.container.page-main,.project-page{margin-right:40px}.site-header{left:40px;top:40px}.home-page .main-content{padding-top:40px}.studio-film{width:72%}}
@media(max-width:1000px) and (min-width:701px){:root{--rail:22vw}.site-header{left:24px;width:calc(var(--rail) - 45px)}.container.main-content,.container.page-main,.project-page{margin-right:24px}.project-grid{gap:70px 8%}.project-card:nth-child(odd){width:90%;margin-top:100px}.about-layout{gap:35px}.service-feature{grid-template-columns:25px 1fr}.service-visual{grid-column:2}.footer-inner{grid-template-columns:1fr 1fr}.footer-services{display:none}}
@media(max-width:700px){:root{--rail:0px}.site-header{position:relative;top:auto;left:auto;width:auto;margin:23px 20px 0}.header-inner.container{position:relative;min-height:65px;padding:0}.wordmark{font-size:18px;max-width:none}.studio-location{font-size:10px;margin:5px 0 0}.menu-toggle{display:block;top:2px;right:0;width:23px;height:17px}.menu-toggle span{height:1px}.primary-nav{display:none;font-size:18px;line-height:30px;padding:0}.primary-nav.is-open{display:flex;height:auto;opacity:1;padding:30px 0}.primary-nav>a{min-height:0}.secondary-nav{margin-top:20px;font-size:15px;line-height:25px}.site-search{max-width:320px}.container.main-content,.container.page-main,.project-page,.info-main{margin:0 20px;padding:25px 0 60px}.home-page .main-content{padding-top:25px}.studio-film{width:100%;aspect-ratio:16/10;margin:0}.film-control{opacity:1}.home-page .intro{margin:75px 0;grid-template-columns:1fr;gap:35px}.intro-philosophy{font-size:14px}.intro h1{font-size:19px}.project-grid{gap:45px 20px;grid-template-columns:repeat(2,minmax(0,1fr))}.project-card:nth-child(odd){width:100%;margin-top:65px}.project-card p{font-size:11px}.project-card span{font-size:10px}.project-card strong{margin:0}.work-toolbar{display:block;margin-bottom:25px}.work-filters{margin-top:20px;gap:18px}.work-filters button{font-size:12px}.more-work{font-size:13px;padding-top:65px}.page-heading,.contact-intro{font-size:24px;margin-bottom:45px}.page-copy{font-size:16px}.about-layout,.about-introduction{grid-template-columns:1fr;gap:35px}.about-portrait{max-width:100%}.client-heading{gap:15px}.client-heading h2{font-size:20px}.client-group{grid-template-columns:1fr}.client-list-grid{grid-template-columns:1fr 1fr;gap:20px}.client-group-title h3{font-size:22px}.news-grid{grid-template-columns:1fr;gap:50px}.news-card h2{font-size:21px}.contact-grid{grid-template-columns:1fr;gap:35px}.service-feature{grid-template-columns:1fr;gap:20px}.service-visual{grid-row:auto}.service-summary{grid-row:auto}.services-end{gap:25px}.services-end h2{font-size:27px}.project-info{grid-template-columns:1fr;gap:25px;margin-bottom:50px}.project-title{font-size:25px}.project-description{font-size:16px}.project-meta{grid-template-columns:1fr 1fr}.project-hero{margin-bottom:40px}.project-gallery{columns:1}.project-gallery-item{margin-bottom:20px}.site-footer{margin:0 20px}.footer-inner{padding:30px 0;grid-template-columns:1fr 1fr;gap:25px;font-size:10px}.footer-services{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(min-width:701px){.home-page .intro{margin-top:clamp(250px,38vh,400px)}}
/* Keep the logo collection's own grid while sharing the studio rhythm. */
.logo-design-page .project-info{padding:0}.logo-design-page .logo-gallery{gap:30px}

/* Minimal navigation and quieter project captions. */
.site-header .primary-nav{margin-top:38px;font-size:14px;line-height:22px}
.site-header .secondary-nav{margin-top:22px;font-size:14px;line-height:22px}
.project-card p{margin-top:8px}.project-card span{display:none}
@media(max-width:700px){.header-inner.container{min-height:38px}.site-header .primary-nav{margin-top:0;font-size:16px;line-height:28px}.site-header .secondary-nav{font-size:16px;line-height:28px;margin-top:18px}.primary-nav.is-open{padding:24px 0 12px}}

/* HelveticaNeue webfont used by the reference site's main stylesheet. */
@font-face{font-family:"CCV Helvetica Neue";src:url("../fonts/HelveticaNeue-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{--studio-font:"CCV Helvetica Neue","Helvetica Neue",Helvetica,Arial,sans-serif;--font-sans:var(--studio-font)}
html body,body button,body input,body textarea,body select,body .wordmark,body .page-heading,body .contact-intro,body .intro-philosophy,body .project-title,body .about-introduction .page-copy{font-family:var(--studio-font)}
body{font-size:15px;line-height:19px}

/* White canvas around every image, including contain-fit project heroes. */
html,body,.site-footer,.project-hero,.project-gallery-item,.logo-gallery .project-gallery-item,.project-card figure,.news-card figure,.studio-film,.services-collage figure,.service-visual,.client-logo{background:#fff}

/* Project images flow vertically at the full content width. */
.project-page .project-gallery,.project-page .logo-gallery{display:block;columns:auto}
.project-page .project-gallery-item{width:100%;margin:0 0 40px;break-inside:avoid}
.project-page .project-gallery-item img,.project-page .project-gallery-item video{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.project-page .project-hero img{max-height:none}
@media(max-width:700px){.project-page .project-gallery-item{margin-bottom:20px}}

/* Journal articles share the full-width image canvas. */
.journal-page article {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: clamp(36px, 5vw, 65px);
}
.journal-header,
.journal-copy {
  width: min(100%, 650px);
  margin: 0 auto;
}
.journal-header .page-heading { margin: 0 0 28px; }
.journal-header .page-kicker span { margin-inline: 8px; }
.journal-lead { font-size: 20px; line-height: 1.5; margin: 0; }
.journal-image { margin: 0; }
.journal-image img { display: block; width: 100%; height: auto; }
.journal-copy { font-size: 17px; line-height: 1.65; }
.journal-copy h2 { font-size: 23px; font-weight: 400; line-height: 1.3; margin: 45px 0 20px; }
.journal-copy p { margin: 0 0 24px; }
.journal-copy > :last-child { margin-bottom: 0; }
.journal-project-link a { border-bottom: 1px solid #aaa; padding-bottom: 4px; }
@media (max-width: 700px) {
  .journal-lead { font-size: 18px; }
  .journal-copy { font-size: 16px; }
  .journal-copy h2 { font-size: 21px; }
}


/* Typography-led services directory. */
.services-page .services-hero {
  gap: 24px;
  margin-bottom: clamp(60px, 9vw, 120px);
}
.services-page .service-feature {
  grid-template-columns: 36px minmax(0, 1fr) minmax(0, 1.4fr);
  gap: clamp(18px, 3vw, 48px);
  padding: clamp(30px, 4vw, 56px) 0;
}
.services-page .service-feature h2 {
  margin: 0;
  font-size: clamp(24px, 2.6vw, 39px);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -.025em;
}
.services-page .service-number { padding-top: 5px; }
.services-page .service-summary p {
  max-width: 46ch;
  font-size: 15px;
  line-height: 1.55;
}
.services-page .service-deliverables {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
  margin-top: 22px;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}
.services-page .services-end a:hover {
  color: #555;
  background: transparent;
}
@media (max-width: 700px) {
  .services-page .service-feature {
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 14px;
  }
  .services-page .service-summary {
    grid-column: 2;
    grid-row: auto;
  }
}

/* Keep the News index headlines on one line. */
.news-card { min-width: 0; }
.news-card h2 {
  max-width: none;
  font-size: clamp(15px, 1.45vw, 21px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Give every menu link the same row height on desktop and mobile. */
.site-header .primary-nav .secondary-nav {
  display: contents;
}
.site-header .primary-nav a {
  display: block;
  min-height: 0;
  font: inherit;
  line-height: inherit;
}
@media (max-width: 700px) {
  .site-header .primary-nav a {
    line-height: 32px;
  }
}

@media (any-pointer: fine) {
  body {
    cursor: url("../images/cursor-dot.svg") 8 8, default;
  }
  body :is(a, button, summary, [role="button"]):not(:disabled) {
    cursor: url("../images/cursor-dot.svg") 8 8, pointer;
  }
}
