/* Ridgeback brand layer: palette and marks taken from the mountain-and-dog logo.
   Bone ground, charcoal wordmark, stone greys, copper peak. */
:root,.identity-refined{
  --paper:#fdfaf4;--white:#fffdf9;--ink:#2e2e2e;--muted:#6e6a64;
  --accent:#8e6a48;--copper:#a88058;--gold:#c09870;--stone:#757371;--slate:#4b494a;
  --mist:#e3dbd0;--line:#e6ded2;--wash:#f3ede3;--dog:#705840
}
body{background:var(--paper);color:var(--ink)}
::selection{background:#e9d9c4}

/* Header and footer lockup */
.identity-refined .header-inner{height:96px}
.identity-refined .wordmark .brand-lockup{width:auto;height:76px;object-fit:contain}
.identity-refined .footer-top .wordmark .brand-lockup{width:auto;height:110px}
.identity-refined .menu-brand{width:auto;height:84px}
.site-header{background:color-mix(in srgb,var(--paper) 92%,transparent)}

/* Eyebrows take the "— SOFTWARE —" treatment from the logo */
.identity-refined .eyebrow{color:var(--copper);letter-spacing:.24em;text-transform:uppercase;font-weight:500}
.identity-refined .status-dot{background:var(--copper)}
.identity-refined h1 em,.identity-refined h2 em{color:var(--accent)}

/* Buttons: charcoal like the wordmark, copper on hover */
.identity-refined .button{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.identity-refined .button:hover{background:var(--accent);border-color:var(--accent)}

/* Hero art replaces the film */
.brand-art{min-width:0;display:grid;gap:22px;align-self:center}
.brand-art img{width:100%;height:auto;animation:rise 1.4s var(--ease) both .15s}
@keyframes rise{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.brand-rule{display:flex;align-items:center;gap:18px;color:var(--copper);font-size:11px;letter-spacing:.42em;text-transform:uppercase}
.brand-rule::before,.brand-rule::after{content:"";flex:1;height:1px;background:var(--gold);opacity:.8}
.brand-proof p{color:var(--muted)}
.brand-proof strong{color:var(--ink)}
.brand-hero .hero-footnote{color:var(--muted);border-color:var(--line)}
.brand-hero .hero-footnote a{color:var(--ink)}

/* Section surfaces */
.principle,.person{border-top-color:var(--mist)}
.principle-top,.principle-top>span{color:var(--copper)}
.monogram{color:var(--accent)}
.person-discipline,.person-role{color:var(--copper)!important;letter-spacing:.14em;text-transform:uppercase}
.name-section{background:var(--wash);border-block-color:var(--line)}
.name-inner{grid-template-columns:minmax(0,300px) 1fr .9fr}
.name-mark img{width:100%;height:auto;max-width:300px;filter:none;opacity:1}
.name-inner>p{color:var(--muted)}
.contact-person a{text-decoration-color:var(--gold)}
.site-footer{background:var(--wash);border-top-color:var(--line)}
.identity-refined .footer-signature{color:var(--mist);font-family:var(--serif);font-weight:400;letter-spacing:.14em;text-transform:uppercase;font-size:clamp(56px,12.5vw,190px)}
.footer-bottom{border-top-color:var(--mist);color:var(--muted)}
.footer-top>p{color:var(--muted)}

@media(max-width:900px){
  .name-inner{grid-template-columns:200px 1fr}
  .brand-stage{grid-template-columns:1fr}
  .brand-art{max-width:640px}
}
@media(max-width:650px){
  .brand-rule{font-size:10px;letter-spacing:.34em}
  .name-inner{grid-template-columns:1fr}
  .name-mark{justify-items:start}
  .name-mark img{max-width:230px}
  .identity-refined .footer-signature{font-size:12vw;letter-spacing:.1em}
}
@media(prefers-reduced-motion:reduce){.brand-art img{animation:none}}

/* Hero: the logo exactly as drawn, centered */
.brand-hero.hero{padding-top:28px}
.brand-center{display:grid;justify-items:center;text-align:center;gap:34px;padding-bottom:36px}
.brand-logo-hero{width:min(100%,640px)}
.brand-logo-hero img{width:100%;height:auto;animation:rise 1.4s var(--ease) both}
.brand-center .brand-copy{padding:0;display:grid;justify-items:center}
.brand-hero h1{font-size:clamp(40px,4.6vw,66px);line-height:1.06;max-width:16ch;text-wrap:balance}
.brand-center .brand-lead{margin-inline:auto;max-width:520px;color:var(--muted)}
.brand-center .brand-actions{justify-content:center}
.brand-proof-line{margin-top:30px;color:var(--copper);font-size:11px;letter-spacing:.28em;text-transform:uppercase;display:flex;align-items:center;gap:16px}
.brand-proof-line::before,.brand-proof-line::after{content:"";width:48px;height:1px;background:var(--gold)}
@media(max-width:900px){.identity-refined .header-inner{height:84px}.identity-refined .wordmark .brand-lockup{height:64px}}
@media(max-width:650px){.identity-refined .header-inner{height:76px}.identity-refined .wordmark .brand-lockup{width:auto;height:58px}.identity-refined .footer-top .wordmark .brand-lockup{width:auto;height:92px}.brand-center{gap:26px}.brand-hero h1{font-size:11vw}.brand-proof-line{font-size:9px;letter-spacing:.16em;gap:10px}.brand-proof-line::before,.brand-proof-line::after{width:22px}}
@media(max-width:360px){.identity-refined .wordmark .brand-lockup{width:auto;height:52px}}
.work-section{background:var(--wash);border-block-color:var(--line)}

/* Header: small dog mark + wordmark; the full logo lives in the hero */
.identity-refined .header-inner{height:78px}
.rb-mini{display:flex;align-items:center;gap:10px}
.rb-mini .rb-dog{width:auto;height:44px}
.rb-mini .rb-word{width:auto;height:26px}
.nav-dialog .rb-mini .rb-dog{height:40px}.nav-dialog .rb-mini .rb-word{height:24px}
@media(max-width:900px){.identity-refined .header-inner{height:72px}}
@media(max-width:650px){.identity-refined .header-inner{height:68px}.rb-mini{gap:8px}.rb-mini .rb-dog{height:38px}.rb-mini .rb-word{height:21px}}
@media(max-width:360px){.rb-mini .rb-dog{height:32px}.rb-mini .rb-word{height:18px}}
/* Header shows the dog only; the name sits in the hero logo right below */
.site-header .rb-mini .rb-word{display:none}
.site-header .rb-mini .rb-dog{height:50px}
@media(max-width:650px){.site-header .rb-mini .rb-dog{height:44px}}
