/* ============================================================
   110s Design System - LAYER 4: PAGE IDENTITY
   Scoped per-page overrides (body.page-*). Composition only.
   Uses existing system; introduces no new colors/effects.
   ============================================================ */

/* ============================================================
   BLOG -> editorial / journal
   Wider reading rhythm, quieter chrome, article-first typography.
   ============================================================ */
.page-blog .ds-post{max-width:720px;margin:0 auto;}
.page-blog .ds-post__head{margin-bottom:var(--ds-space-7);}
.page-blog .ds-post__title{font-size:var(--ds-text-3xl);line-height:1.08;letter-spacing:var(--ds-track-tight);font-weight:var(--ds-weight-bold);margin-bottom:var(--ds-space-3);}
.page-blog .ds-post__meta{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--ds-muted);}
.page-blog .ds-post__hero{margin:var(--ds-space-6) 0;border-radius:var(--ds-radius-md);overflow:hidden;border:1px solid var(--ds-line);}
/* Prose: generous journal reading rhythm */
.page-blog .ds-prose{font-size:1.15rem;line-height:var(--ds-leading-relaxed);color:#1E293B;}
.page-blog .ds-prose p{margin:0 0 var(--ds-space-4);}
.page-blog .ds-prose h2{font-family:var(--ds-font-display);font-size:var(--ds-text-xl);font-weight:var(--ds-weight-semibold);letter-spacing:var(--ds-track-snug);margin:var(--ds-space-7) 0 var(--ds-space-3);line-height:1.2;}
.page-blog .ds-prose h3{font-family:var(--ds-font-display);font-size:var(--ds-text-lg);font-weight:var(--ds-weight-semibold);margin:var(--ds-space-5) 0 var(--ds-space-2);}
.page-blog .ds-prose ul,.page-blog .ds-prose ol{margin:0 0 var(--ds-space-4);padding-left:1.3em;}
.page-blog .ds-prose li{margin-bottom:8px;line-height:var(--ds-leading-body);}
.page-blog .ds-prose blockquote{border-left:2px solid var(--ds-accent);padding-left:var(--ds-space-3);margin:var(--ds-space-5) 0;font-style:italic;color:var(--ds-muted);}
.page-blog .ds-prose a{color:var(--ds-accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
/* Index: editorial card list, quieter */
.page-blog .ds-card--insight{padding:var(--ds-space-5) 0;border:0;border-bottom:1px solid var(--ds-line);border-radius:0;background:transparent;}
.page-blog .ds-card--insight:hover{transform:none;box-shadow:none;border-bottom-color:var(--ds-ink);}
.page-blog .ds-card--insight .ds-card__title{font-size:var(--ds-text-xl);}

/* ============================================================
   SERVICES -> capability specification document
   ============================================================ */
.page-services .row.g-4{display:block;margin:0;counter-reset:cap;
  border-top:1px solid var(--ds-ink);}
.page-services .row.g-4 > [class*="col-"]{width:100%;max-width:100%;flex:0 0 100%;padding:0;}
/* Each capability = a discrete spec row */
.page-services .ds-card--service{display:flex;align-items:baseline;gap:var(--ds-space-5);
  flex-direction:row;border:0;border-bottom:1px solid var(--ds-line);border-radius:0;
  background:transparent;box-shadow:none;padding:var(--ds-space-5) 0;margin:0;
  transition:padding var(--ds-dur) var(--ds-ease);}
.page-services .ds-card--service:hover{transform:none;box-shadow:none;background:transparent;padding-left:var(--ds-space-3);}
/* Strong, always-on structural numeral */
.page-services .ds-card--service::before{counter-increment:cap;content:counter(cap,decimal-leading-zero);
  position:static;font-family:var(--ds-font-mono);font-size:var(--ds-text-xl);font-weight:var(--ds-weight-semibold);
  line-height:1;color:var(--ds-ink);flex:0 0 auto;width:3ch;letter-spacing:-0.02em;}
.page-services .ds-card--service:hover::before{color:var(--ds-accent);}
/* Icon removed: number carries structure */
.page-services .ds-card__icon{display:none;}
/* Content column: constrained, deliberate */
.page-services .ds-card__main{flex:1 1 auto;display:flex;flex-direction:column;gap:8px;min-width:0;max-width:620px;}
.page-services .ds-card__title{font-size:var(--ds-text-xl);letter-spacing:var(--ds-track-snug);margin:0;font-weight:var(--ds-weight-semibold);line-height:1.15;}
.page-services .ds-card__text{font-size:var(--ds-text-base);color:var(--ds-muted);margin:0;line-height:var(--ds-leading-body);}
/* View affordance: quiet, right-aligned, mono */
.page-services .ds-card__link{flex:0 0 auto;margin-left:auto;align-self:center;opacity:.4;transition:opacity var(--ds-dur) var(--ds-ease);white-space:nowrap;}
.page-services .ds-card--service:hover .ds-card__link{opacity:1;}
/* Hero: architectural document header */
.page-services .ds-sec-head{border-bottom:1px solid var(--ds-line);padding-bottom:var(--ds-space-6);margin-bottom:var(--ds-space-8);}
/* Quiet conversion */
.page-services .ds-btn-group{padding-top:var(--ds-space-6);}
/* Detail page */
.page-services .ds-body{max-width:68ch;font-size:var(--ds-text-md);line-height:var(--ds-leading-body);}
.page-services .ds-case-media{border:1px solid var(--ds-line);border-radius:var(--ds-radius-md);overflow:hidden;}
@media(max-width:640px){
  .page-services .ds-card--service{flex-wrap:wrap;gap:var(--ds-space-3);}
  .page-services .ds-card__main{flex:1 1 100%;max-width:100%;}
  .page-services .ds-card__link{margin-left:0;opacity:1;flex:1 1 100%;}
}

/* ============================================================
   PORTFOLIO -> documented work (not proven results)
   Large editorial entries. No outcome UI (no data exists).
   ============================================================ */
.page-portfolio .ds-sec-head{border-bottom:1px solid var(--ds-line);padding-bottom:var(--ds-space-6);margin-bottom:var(--ds-space-8);}
.page-portfolio .ds-work-list{display:flex;flex-direction:column;gap:var(--ds-space-12);}
.page-portfolio .ds-work{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--ds-space-7);align-items:center;}
.page-portfolio .ds-work:nth-child(even){grid-template-columns:1fr 1.15fr;}
.page-portfolio .ds-work:nth-child(even) .ds-work__media{order:2;}
.page-portfolio .ds-work__media{display:block;border:1px solid var(--ds-line);border-radius:var(--ds-radius-md);overflow:hidden;aspect-ratio:16/10;background:var(--ds-surface);}
.page-portfolio .ds-work__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--ds-dur-slow) var(--ds-ease);}
.page-portfolio .ds-work__media:hover img{transform:scale(1.02);}
.page-portfolio .ds-work__media-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--ds-line);font-size:2.5rem;}
.page-portfolio .ds-work__body{display:flex;flex-direction:column;gap:var(--ds-space-3);}
.page-portfolio .ds-work__title{font-family:var(--ds-font-display);font-size:var(--ds-text-2xl);font-weight:var(--ds-weight-bold);letter-spacing:var(--ds-track-tight);line-height:1.1;margin:0;color:var(--ds-ink);}
.page-portfolio .ds-work__summary{font-size:var(--ds-text-md);color:var(--ds-muted);line-height:var(--ds-leading-body);margin:0;max-width:48ch;}
.page-portfolio .ds-work__actions{display:flex;gap:var(--ds-space-4);align-items:center;margin-top:var(--ds-space-2);flex-wrap:wrap;}
.page-portfolio .ds-work__link{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--ds-accent);display:inline-flex;gap:7px;align-items:center;text-decoration:none;}
.page-portfolio .ds-work__live{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--ds-muted);display:inline-flex;gap:7px;align-items:center;text-decoration:none;}
.page-portfolio .ds-work__live:hover{color:var(--ds-ink);}
.page-portfolio .ds-btn-group{margin-top:var(--ds-space-12);padding-top:var(--ds-space-6);border-top:1px solid var(--ds-line);}
@media(max-width:768px){
  .page-portfolio .ds-work,.page-portfolio .ds-work:nth-child(even){grid-template-columns:1fr;gap:var(--ds-space-4);}
  .page-portfolio .ds-work:nth-child(even) .ds-work__media{order:0;}
  .page-portfolio .ds-work-list{gap:var(--ds-space-8);}
}

/* ============================================================
   ABOUT -> narrative credibility (no team data exists)
   "This is how we think." Mission/vision as connected story.
   Metrics restrained (truth decision pending, owner-owned).
   ============================================================ */
/* Hero: warm, generous narrative intro */
.page-about .ds-sec-head{margin-bottom:var(--ds-space-6);}
.page-about .ds-sec-head__lead{max-width:60ch;}
.page-about .ds-body{max-width:68ch;font-size:var(--ds-text-md);line-height:var(--ds-leading-relaxed);color:var(--ds-ink);}
/* Mission + Vision: connected narrative, not isolated cards */
.page-about .row.g-4{display:grid;grid-template-columns:1fr 1fr;gap:var(--ds-space-8);}
.page-about .row.g-4 > [class*="col-"]{width:100%;max-width:100%;flex:0 0 100%;padding:0;}
.page-about .ds-card{background:transparent;border:0;border-top:2px solid var(--ds-ink);border-radius:0;padding:var(--ds-space-4) 0 0;box-shadow:none;}
.page-about .ds-card:hover{transform:none;box-shadow:none;border-top-color:var(--ds-accent);}
.page-about .ds-card__icon{display:none;}
.page-about .ds-card__title{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);font-weight:var(--ds-weight-semibold);letter-spacing:var(--ds-track-label);text-transform:uppercase;color:var(--ds-muted);margin-bottom:var(--ds-space-3);}
.page-about .ds-card__text{font-size:var(--ds-text-lg);color:var(--ds-ink);line-height:var(--ds-leading-snug);font-family:var(--ds-font-display);font-weight:var(--ds-weight-regular);letter-spacing:var(--ds-track-snug);}
/* Metrics: restrained supporting evidence, not headline */
.page-about .ds-metrics{display:flex;flex-wrap:wrap;gap:var(--ds-space-8);border-top:1px solid var(--ds-line);padding-top:var(--ds-space-6);}
.page-about .ds-metric{text-align:left;}
.page-about .ds-metric__value{font-family:var(--ds-font-display);font-size:var(--ds-text-xl);font-weight:var(--ds-weight-semibold);color:var(--ds-ink);letter-spacing:var(--ds-track-snug);}
.page-about .ds-metric__label{font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--ds-muted);margin-top:4px;}
.page-about .ds-sec-head__title{font-size:var(--ds-text-xl);}
@media(max-width:768px){
  .page-about .row.g-4{grid-template-columns:1fr;gap:var(--ds-space-5);}
  .page-about .ds-metrics{gap:var(--ds-space-5);}
}

/* ============================================================
   CONTACT -> confidence through clarity
   Form is the primary object. Calm, direct, no competition.
   Presentation only - all form IDs/CSRF/endpoints untouched.
   ============================================================ */
/* Calm, centered single column - form leads */
.page-contact .ds-sec-head{text-align:center;margin-bottom:var(--ds-space-8);}
.page-contact .ds-sec-head__lead{max-width:48ch;margin-left:auto;margin-right:auto;}
.page-contact .row.g-5{display:block;max-width:680px;margin:0 auto;}
.page-contact .row.g-5 > [class*="col-"]{width:100%;max-width:100%;flex:0 0 100%;padding:0;}
/* Form card: the primary object - clean, bordered, generous */
.page-contact .ds-form-card{background:var(--ds-surface);border:1px solid var(--ds-line);border-radius:var(--ds-radius-md);padding:var(--ds-space-7);box-shadow:var(--ds-shadow-card);}
/* Fields: calm rhythm, strong readability */
.page-contact .ds-field{margin-bottom:var(--ds-space-4);}
.page-contact .ds-label{display:block;font-family:var(--ds-font-mono);font-size:var(--ds-text-xs);letter-spacing:.08em;text-transform:uppercase;color:var(--ds-muted);margin-bottom:8px;}
.page-contact .ds-input,.page-contact .ds-select,.page-contact .ds-textarea{width:100%;font-size:var(--ds-text-base);padding:13px 15px;border:1px solid var(--ds-line);border-radius:var(--ds-radius-sm);background:var(--ds-bg);color:var(--ds-ink);transition:border-color var(--ds-dur) var(--ds-ease);}
.page-contact .ds-input:focus,.page-contact .ds-select:focus,.page-contact .ds-textarea:focus{outline:none;border-color:var(--ds-accent);}
.page-contact #contactSubmitBtn{width:100%;justify-content:center;margin-top:var(--ds-space-2);}
/* Contact details: quiet supporting strip ABOVE the form, not a competing column */
.page-contact .ds-contact-info{display:flex;justify-content:center;gap:var(--ds-space-7);flex-wrap:wrap;margin-bottom:var(--ds-space-6);padding-bottom:var(--ds-space-6);border-bottom:1px solid var(--ds-line);}
.page-contact .ds-contact-block{text-align:center;}
.page-contact .ds-contact-block .ds-label{margin-bottom:4px;}
.page-contact .ds-contact-link{color:var(--ds-accent);text-decoration:none;font-size:var(--ds-text-sm);}
.page-contact .ds-contact-block .ds-muted{font-size:var(--ds-text-sm);margin:0;}
/* Success state stays clean/centered */
.page-contact .ds-form-success{text-align:center;padding:var(--ds-space-5) 0;}
@media(max-width:768px){
  .page-contact .ds-form-card{padding:var(--ds-space-5);}
  .page-contact .ds-contact-info{gap:var(--ds-space-4);}
}
