:root { --signal: #c2a76d; }

.ticker { background: #c2a76d; }
.manifesto-section { background: #d6d0c4; }
.contact-section { background: #c2a76d; }
.manifesto-grid h2 span { color: var(--ink); -webkit-text-stroke: 0; }
.site-header .brand-mark { transition: filter .35s ease; }
.site-header.is-scrolled .brand-mark,
.brand-footer .brand-mark { filter: sepia(1) saturate(2.2) brightness(.86) hue-rotate(350deg); }
.site-header .brand-copy strong,
.site-header .brand-copy small { transition: color .35s ease; }
.site-header.is-scrolled .brand-copy strong,
.brand-footer .brand-copy strong { color: #d5b66f; }
.site-header.is-scrolled .brand-copy small,
.brand-footer .brand-copy small { color: #a9905e; }

/* Homepage typography and editorial rhythm. */
#content h1,
#content h2,
#content h3,
#content strong { font-family: var(--sans); }
.section-label { display: block; }
.section-label p { color: var(--signal); font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: .16em; }
.section-label:not(.section-label-light) p { color: #8f784b; }
.about-body h2,
.manifesto-grid h2,
.services-head h2,
.standards-title h2,
.process-intro h2,
.guide-layout h2,
.contact-copy h2 { font-weight: 600; letter-spacing: -.045em; }
.about-body h2 em { color: #9c824f; -webkit-text-stroke: 0; }
.manifesto-grid { grid-template-columns: 1fr; gap: 42px; }
.manifesto-grid > div:first-child { max-width: 1080px; }
.manifesto-copy { grid-column: 1; max-width: 980px; }
.service-row { grid-template-columns: minmax(260px,.9fr) 1.1fr 36px; }
.standards-list article { grid-template-columns: 1fr; }
.guide-layout li { gap: 0; }

@media (min-width: 981px) {
  .standards-layout { grid-template-columns: .94fr 1.06fr; gap: 84px; }
  .standards-title h2 { font-size: clamp(44px, 4.2vw, 62px); word-break: keep-all; }
  .contact-copy h2 { font-size: clamp(52px, 5.15vw, 74px); line-height: 1.08; letter-spacing: -.072em; word-break: keep-all; }
}

@media (max-width: 980px) {
  .manifesto-grid { grid-template-columns: 1fr; }
  .manifesto-copy { grid-column: 1; }
  .service-row { grid-template-columns: minmax(220px,.9fr) 1.1fr 36px; }
  .service-row p { grid-column: 2; }
  .service-row i { grid-column: 3; grid-row: 1; }
}

@media (max-width: 620px) {
  .section-label p { font-size: 10px; }
  .service-row { grid-template-columns: 1fr 24px; gap: 12px; }
  .service-row h3 { grid-column: 1; }
  .service-row p { grid-column: 1; }
  .service-row i { grid-column: 2; grid-row: 1; }
}

/* Mobile off-canvas navigation */
.menu-backdrop { display: none; }

@media (max-width: 980px) {
  .site-header .menu-toggle {
    position: relative;
    z-index: 104;
  }

  .site-header .site-navigation {
    position: fixed;
    inset: 0 0 0 auto;
    z-index: 103;
    width: min(84vw, 390px);
    height: 100dvh;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 112px 30px 28px;
    color: #fff;
    background: linear-gradient(155deg, #181817 0%, #090a09 72%);
    box-shadow: -32px 0 80px rgba(0, 0, 0, .32);
    transform: translateX(104%);
    opacity: 1;
    visibility: hidden;
    transition: transform .45s var(--ease), visibility 0s linear .45s;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .site-header .site-navigation::before {
    content: "MENU / PHILJINO";
    display: block;
    margin: 0 0 20px;
    color: #c2a76d;
    font-family: var(--display);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .16em;
  }

  .site-header .site-navigation.is-open {
    transform: translateX(0);
    visibility: visible;
    transition: transform .45s var(--ease), visibility 0s linear 0s;
  }

  .site-header .site-navigation > a {
    min-height: 58px;
    display: flex;
    align-items: center;
    padding: 0 2px;
    color: rgba(255, 255, 255, .82);
    border-bottom: 1px solid rgba(255, 255, 255, .12);
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -.025em;
  }

  .site-header .site-navigation > a::after { display: none; }
  .site-header .site-navigation > a:hover,
  .site-header .site-navigation > a:focus-visible { color: #fff; }

  .site-header .site-navigation .nav-contact {
    min-height: 56px;
    justify-content: center;
    margin-top: auto;
    padding: 0 20px;
    color: var(--black);
    background: var(--signal);
    border: 0;
    font-size: 16px;
    font-weight: 650;
  }

  .menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 102;
    display: block;
    padding: 0;
    background: rgba(0, 0, 0, .58);
    border: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    backdrop-filter: blur(3px);
    transition: opacity .35s ease, visibility 0s linear .35s;
  }

  .menu-backdrop.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .35s ease, visibility 0s linear 0s;
  }
}

@media (max-width: 620px) {
  .site-header .site-navigation {
    width: min(88vw, 360px);
    padding: 96px 24px 24px;
  }

  .site-header .site-navigation > a {
    min-height: 56px;
    font-size: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .site-header .site-navigation,
  .menu-backdrop { transition: none; }
}