/* NINEWORKS COMPANY PAGES — unified with print.html / 2026-09-22 rev.2 */
.about-page,
.design-team-page,
.designer-page{
  --company-ink:#171717;
  --company-muted:#666661;
  --company-soft:#f5f5f2;
  --company-line:#e4e4df;
  --company-radius:24px;
  --company-radius-mobile:20px;
}
.about-page main,
.design-team-page main,
.designer-page main{background:#fff;color:var(--company-ink)}

/* ---------------------------------------------------------
   ABOUT
--------------------------------------------------------- */
.company-hero{padding:104px 0 90px;border-bottom:1px solid var(--company-line)}
.company-hero__inner{max-width:1040px;margin:0 auto;text-align:center}
.company-hero .eyebrow{margin-bottom:22px}
.company-hero h1{max-width:920px;margin:0 auto;font-size:clamp(42px,5vw,72px);font-weight:620;line-height:1.08;letter-spacing:-.055em;word-break:keep-all}
.company-hero__lead{max-width:840px;margin:28px auto 0;color:var(--company-muted);font-size:17px;line-height:1.78;word-break:keep-all}

.company-section{padding:100px 0;border-bottom:1px solid var(--company-line)}
.company-section--soft{background:var(--company-soft)}
.company-section--dark{background:#171717;color:#fff}
.company-section-head{max-width:900px;margin:0 auto 42px;text-align:center}
.company-section-head .eyebrow{margin-bottom:18px}
.company-section-head h2{max-width:820px;margin:0 auto;font-size:clamp(32px,3.4vw,50px);font-weight:620;line-height:1.14;letter-spacing:-.045em;word-break:keep-all}
.company-section-head>p:last-child{max-width:780px;margin:22px auto 0;color:var(--company-muted);font-size:15px;line-height:1.82;word-break:keep-all}
.company-section--dark .company-section-head>p:last-child{color:#b9b9b4}

.company-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.company-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.company-card{position:relative;min-height:265px;padding:26px;border:1px solid var(--company-line);border-radius:var(--company-radius);background:#fff;overflow:hidden;transition:border-color .18s ease,background .18s ease}
.company-card:hover{border-color:#c9c9c4;background:#fafaf8}
.company-card>span{display:block;color:#8d8d87;font-size:10px;font-weight:700;letter-spacing:.08em}
.company-card h3{margin:62px 0 12px;font-size:20px;font-weight:650;line-height:1.28;letter-spacing:-.03em}
.company-card p{margin:0;color:var(--company-muted);font-size:13.5px;line-height:1.74;word-break:keep-all}
.company-section--soft .company-card{background:#fff}
.company-section--dark .company-card{border-color:#383835;background:#20201f}
.company-section--dark .company-card:hover{border-color:#4a4a46;background:#242422}
.company-section--dark .company-card>span{color:#d2d2cd}
.company-section--dark .company-card p{color:#b9b9b4}

.company-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.company-flow article{min-height:230px;padding:26px;border:1px solid var(--company-line);border-radius:var(--company-radius);background:#fff}
.company-flow span{display:block;color:#8d8d87;font-size:10px;font-weight:700;letter-spacing:.08em}
.company-flow h3{margin:58px 0 10px;font-size:20px;font-weight:650;letter-spacing:-.03em}
.company-flow p{margin:0;color:var(--company-muted);font-size:13.5px;line-height:1.72;word-break:keep-all}

.company-quote{max-width:940px;margin:0 auto;text-align:center}
.company-quote .eyebrow{margin-bottom:22px;color:#cfcfca}
.company-quote h2{margin:0;font-size:clamp(34px,4vw,58px);font-weight:620;line-height:1.15;letter-spacing:-.048em;word-break:keep-all}
.company-quote p{max-width:780px;margin:28px auto 0;color:#b9b9b4;font-size:15px;line-height:1.85;word-break:keep-all}
.company-values{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:38px}
.company-values span{padding:12px 18px;border:1px solid #3b3b38;border-radius:999px;color:#e2e2dd;font-size:11px;font-weight:650;letter-spacing:.04em}

.company-cta{padding:88px 0}
.company-cta__inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:60px;align-items:end;padding:52px 56px;border-radius:var(--company-radius);background:#171717;color:#fff}
.company-cta .eyebrow{margin-bottom:18px;color:#bdbdb7}
.company-cta h2{max-width:720px;margin:0;font-size:clamp(32px,3.5vw,50px);font-weight:620;line-height:1.14;letter-spacing:-.045em;word-break:keep-all}
.company-cta p{max-width:650px;margin:20px 0 0;color:#aaa9a4;font-size:14px;line-height:1.8;word-break:keep-all}
.company-actions{display:flex;flex-wrap:wrap;gap:8px}
.company-button{display:inline-flex;min-height:48px;align-items:center;justify-content:center;gap:20px;padding:0 20px;border:1px solid #fff;border-radius:999px;background:#fff;color:#171717;font-size:12px;font-weight:700}
.company-button--ghost{background:transparent;color:#fff}

/* ---------------------------------------------------------
   TEAM — print.html tone
--------------------------------------------------------- */
.design-team-page{--team-accent:#171717!important;--team-line:var(--company-line)!important;--team-soft:var(--company-soft)!important;--team-ink:#171717!important;--team-muted:var(--company-muted)!important}
.design-team-page .team-hero{display:block;min-height:0;padding:108px 0 88px;border-bottom:1px solid var(--company-line);background:#fff}
.design-team-page .team-hero__inner{display:block;max-width:900px;text-align:center}
.design-team-page .team-hero .eyebrow{margin-bottom:20px}
.design-team-page .team-hero h1{max-width:840px;margin:0 auto;font-size:clamp(40px,4.6vw,66px);font-weight:620;line-height:1.1;letter-spacing:-.052em;word-break:keep-all}
.design-team-page .team-hero__lead{max-width:760px;margin:26px auto 0;color:var(--company-muted);font-size:15px;line-height:1.82;word-break:keep-all}

.design-team-page .team-overview{padding:92px 0 102px}
.design-team-page .team-overview__head{display:block;max-width:820px;margin:0 auto 40px;padding:0;border:0;text-align:center}
.design-team-page .team-overview__head .eyebrow{margin-bottom:14px;color:#171717}
.design-team-page .team-overview__head>p:last-child{max-width:760px;margin:0 auto;color:var(--company-muted);font-size:14px;line-height:1.78;text-align:center}

.design-team-page .team-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.design-team-page .team-card{min-height:440px;padding:26px;border:1px solid var(--company-line);border-radius:var(--company-radius);background:#fff;transition:border-color .18s ease,background .18s ease}
.design-team-page .team-card:hover{transform:none;border-color:#c9c9c4;background:#fafaf8}
.design-team-page .team-card--lead{background:var(--company-soft)}
.design-team-page .team-card__index{color:#171717}
.design-team-page .team-card__status{color:#94948e}
.design-team-page .team-card__main{gap:22px;margin-top:52px}
.design-team-page .team-card__role{color:var(--company-muted)}
.design-team-page .team-card h2{font-size:clamp(32px,3vw,46px);font-weight:620}
.design-team-page .team-card__summary{font-size:13.5px;line-height:1.75}
.design-team-page .team-card__facts{padding-top:20px}
.design-team-page .team-card__facts>div{padding:10px 0}
.design-team-page .team-card__link{margin-top:20px;color:#171717}

.design-team-page .team-principles{padding:96px 0;background:#171717}
.design-team-page .team-principles__head{display:block;max-width:860px;margin:0 auto 42px;text-align:center}
.design-team-page .team-principles__head .eyebrow{margin-bottom:18px;color:#cfcfca}
.design-team-page .team-principles__head h2{margin:0 auto;font-size:clamp(32px,3.4vw,50px);font-weight:620;text-align:center}
.design-team-page .team-principles__grid{gap:12px}
.design-team-page .team-principles__grid article{min-height:230px;padding:26px;border:1px solid #383835;border-radius:var(--company-radius);background:#20201f}
.design-team-page .team-principles__grid span{color:#d2d2cd}
.design-team-page .team-principles__grid h3{margin:58px 0 12px;font-size:20px}
.design-team-page .team-principles__grid p{color:#b9b9b4}

.design-team-page .team-cta{padding:88px 0;background:#fff}
.design-team-page .team-cta__inner{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:60px;align-items:end;min-height:0;padding:52px 56px;border-radius:var(--company-radius);background:#171717;color:#fff}
.design-team-page .team-cta__inner::before,
.design-team-page .team-cta__inner::after{display:none}
.design-team-page .team-cta .eyebrow{margin-bottom:18px;color:#bdbdb7}
.design-team-page .team-cta h2{max-width:700px;font-size:clamp(32px,3.5vw,50px);font-weight:620;line-height:1.14}
.design-team-page .team-cta p{margin-top:20px;color:#aaa9a4}
.design-team-page .team-cta__meta{margin-top:30px;color:#777771}
.design-team-page .team-cta__button{min-width:176px;min-height:48px;padding:0 20px;border-radius:999px}

/* ---------------------------------------------------------
   FOUNDER / DESIGNER — dense profile, simplified surfaces
--------------------------------------------------------- */
.designer-page .designer-hero{
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  min-height:0!important;
  padding-top:108px!important;
  padding-bottom:88px!important;
}
.designer-page .designer-hero__title{grid-column:1/span 5!important;padding:42px 40px;border:1px solid var(--company-line);border-radius:var(--company-radius);background:var(--company-soft)}
.designer-page .designer-hero__intro{grid-column:7/-1!important;padding:42px 0;align-self:center}
.designer-page .designer-hero h1{font-size:clamp(50px,5vw,76px);font-weight:620;line-height:.96}
.designer-page .designer-hero__role{color:var(--company-muted)}
.designer-page .designer-hero__intro .lead{font-size:clamp(20px,2vw,27px);font-weight:560;line-height:1.48;letter-spacing:-.035em}
.designer-page .designer-hero__intro .copy{color:var(--company-muted);font-size:15px;line-height:1.82}

.designer-page .designer-summary{
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:var(--nw-pad,var(--gutter))!important;
  margin-top:28px!important;
  margin-bottom:28px!important;
  padding:50px!important;
  border:1px solid var(--company-line)!important;
  border-radius:var(--company-radius)!important;
  background:var(--company-soft)!important;
}
.designer-page .designer-summary__statement{font-size:clamp(30px,3vw,44px);font-weight:620;line-height:1.12}
.designer-page .designer-summary__body .lead{font-size:17px;line-height:1.72}
.designer-page .designer-summary__body .copy{color:var(--company-muted);font-size:14.5px;line-height:1.8}
.designer-page .designer-summary__links{gap:8px!important;margin-top:28px!important}
.designer-page .designer-summary__links a{display:inline-flex;align-items:center;min-height:42px;padding:0 16px!important;border:1px solid #d5d5cf!important;border-radius:999px!important;background:#fff;font-size:12px;font-weight:650}

.designer-page .designer-section{padding-top:78px!important;padding-bottom:78px!important}
.designer-page .designer-section__head{margin-bottom:30px!important}
.designer-page .designer-section__head h2{font-size:clamp(30px,3vw,44px);font-weight:620;line-height:1.12}
.designer-page .designer-section__head>p,
.designer-page .designer-section__head>div+div{color:var(--company-muted);font-size:14.5px;line-height:1.78}

.designer-page .designer-records{
  border:1px solid var(--company-line)!important;
  border-radius:var(--company-radius)!important;
  overflow:hidden!important;
  background:#fff;
}
.designer-page .designer-record{
  grid-template-columns:minmax(100px,135px) minmax(240px,390px) minmax(0,1fr)!important;
  gap:clamp(20px,2.7vw,46px)!important;
  padding:21px 24px!important;
  border-bottom:1px solid var(--company-line)!important;
}
.designer-page .designer-record:last-child{border-bottom:0!important}
.designer-page .designer-record:hover{padding:21px 24px!important;background:#fafaf8}
.designer-page .designer-record__title{font-size:16px}
.designer-page .designer-record__copy{color:#555550;font-size:14.5px;line-height:1.72}
.designer-page .designer-record__copy b{font-size:14.5px}
.designer-page .designer-record__copy small{font-size:12.5px}

.designer-page .designer-contact{
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  gap:var(--nw-pad,var(--gutter))!important;
  margin-top:28px!important;
  margin-bottom:88px!important;
  padding:52px!important;
  border-radius:var(--company-radius)!important;
  background:#171717!important;
  color:#fff!important;
}
.designer-page .designer-contact .eyebrow{color:#bdbdb7}
.designer-page .designer-contact h2{font-size:clamp(32px,3.5vw,50px);font-weight:620}
.designer-page .designer-contact .copy{color:#aaa9a4!important}
.designer-page .designer-contact a{color:#fff!important}
.designer-page .designer-closing{margin-top:10px!important;margin-bottom:28px!important;padding:52px!important;border:1px solid var(--company-line)!important;border-radius:var(--company-radius)!important;background:var(--company-soft)!important}
.designer-page .designer-closing .designer-section__head{margin-bottom:0!important}
.designer-page .designer-closing .copy{color:var(--company-muted)!important}

@media(max-width:980px){
  .company-grid--four,.company-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .design-team-page .team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .company-cta__inner,.design-team-page .team-cta__inner{grid-template-columns:1fr;align-items:start}
  .designer-page .designer-record{grid-template-columns:90px minmax(210px,300px) minmax(0,1fr)!important}
}

@media(max-width:760px){
  .company-hero{padding:76px 0 68px}
  .company-hero h1{font-size:clamp(38px,11vw,52px)}
  .company-hero__lead{font-size:14.5px}
  .company-section{padding:70px 0}
  .company-section-head{margin-bottom:30px;text-align:left}
  .company-section-head h2,.company-section-head>p:last-child{margin-left:0;text-align:left}
  .company-grid,.company-grid--four,.company-flow{grid-template-columns:1fr}
  .company-card,.company-flow article{min-height:0;border-radius:var(--company-radius-mobile)}
  .company-card h3,.company-flow h3{margin-top:44px}
  .company-quote{text-align:left}
  .company-values{justify-content:flex-start}
  .company-cta{padding:64px 0}
  .company-cta__inner,.design-team-page .team-cta__inner{gap:34px;padding:32px 26px;border-radius:var(--company-radius-mobile)}
  .company-actions{width:100%}
  .company-button{flex:1}

  .design-team-page .team-hero{padding:74px 0 66px}
  .design-team-page .team-hero__inner{text-align:left}
  .design-team-page .team-hero h1,.design-team-page .team-hero__lead{margin-left:0;text-align:left}
  .design-team-page .team-overview{padding:68px 0 76px}
  .design-team-page .team-overview__head{text-align:left}
  .design-team-page .team-overview__head>p:last-child{margin-left:0;text-align:left}
  .design-team-page .team-grid{grid-template-columns:1fr}
  .design-team-page .team-card{min-height:0;border-radius:var(--company-radius-mobile)}
  .design-team-page .team-principles{padding:72px 0}
  .design-team-page .team-principles__head{text-align:left}
  .design-team-page .team-principles__head h2{text-align:left}
  .design-team-page .team-principles__grid article{min-height:0;border-radius:var(--company-radius-mobile)}
  .design-team-page .team-cta{padding:64px 0}
  .design-team-page .team-cta__button{width:100%}

  .designer-page .designer-hero{
    grid-template-columns:1fr!important;
    gap:30px!important;
    padding-top:72px!important;
    padding-bottom:64px!important;
  }
  .designer-page .designer-hero__title,
  .designer-page .designer-hero__intro{grid-column:1!important}
  .designer-page .designer-summary{
    grid-template-columns:1fr!important;
    gap:30px!important;
    margin-top:18px!important;
    margin-bottom:18px!important;
    padding:30px 24px!important;
    border-radius:var(--company-radius-mobile)!important;
  }
  .designer-page .designer-summary__label,
  .designer-page .designer-summary__body{grid-column:1!important}
  .designer-page .designer-section{padding-top:62px!important;padding-bottom:62px!important}
  .designer-page .designer-record,
  .designer-page .designer-records--dense .designer-record{
    grid-template-columns:1fr!important;
    gap:4px!important;
    padding:20px!important;
  }
  .designer-page .designer-record:hover{padding:20px!important}
  .designer-page .designer-records{border-radius:var(--company-radius-mobile)!important}
  .designer-page .designer-contact{
    grid-template-columns:1fr!important;
    gap:28px!important;
    margin-bottom:64px!important;
    padding:32px 26px!important;
    border-radius:var(--company-radius-mobile)!important;
  }
  .designer-page .designer-contact>div:first-child,
  .designer-page .designer-contact>div:last-child{grid-column:1!important}
}