/* Editorial pages follow the landing's charcoal / mint visual language. */
.inner-page .about-story {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 90px;
  padding-block: 96px;
}
.inner-page .story-copy h2 {
  font-size: clamp(25px, 2.6vw, 36px);
  font-weight: 600;
  line-height: 1.85;
  letter-spacing: -1px;
  margin-block: 16px 24px;
}
.inner-page .story-copy p {
  color: #929da5;
  font-size: 13px;
  line-height: 2.5;
  margin-top: 16px;
}
.inner-page .developer-card {
  position: relative;
  min-width: 0;
  background: #0d1418;
  border: 1px solid #61745366;
  border-radius: 8px;
  box-shadow: 16px 24px 0 -10px #151d19, 16px 24px 0 -9px #a1c9821a, 0 28px 70px #0004;
  transform: perspective(1100px) rotateX(3deg) rotateY(-8deg) rotateZ(1deg);
  transition: transform .65s cubic-bezier(.2,.7,.2,1), border-color .4s;
}
.inner-page .developer-card:hover {
  transform: perspective(1100px) rotateX(0) rotateY(0) rotateZ(0);
  border-color: #c5f67588;
}
.inner-page .terminal-top {
  min-height: 46px;
  padding-inline: 20px;
  border-color: #ffffff0e;
  color: #7d9185;
  background: #ffffff02;
}
.inner-page .terminal-top > span { color: #6e865f; font-size: 8px; letter-spacing: 5px; }
.inner-page .developer-card pre { padding: 30px 25px; color: #b7c5bc; font-size: 11px; line-height: 2.3; }
.inner-page .code-purple { color: #b2c99e; }
.inner-page .code-blue { color: #7bc8ce; }
.inner-page .code-green { color: #c5f675; }
.inner-page .terminal-status { padding: 15px 20px; color: #6f8375; background: #c5f67504; border-top: 1px solid #ffffff0a; }
.inner-page .terminal-status > span { background: #c5f675; box-shadow: 0 0 12px #c5f67555; }
.inner-page .skills-section { padding-block: 18px 88px; }
.inner-page .skill-groups {
  gap: 0;
  border-block: 1px solid #ffffff12;
  counter-reset: toolbox;
}
.inner-page .skill-groups article {
  position: relative;
  min-width: 0;
  padding: 34px 25px 32px;
  border: 0;
  border-inline-end: 1px solid #ffffff12;
  border-radius: 0;
  background: transparent;
  counter-increment: toolbox;
  transition: background .3s;
}
.inner-page .skill-groups article:last-child { border-inline-end: 0; }
.inner-page .skill-groups article::after {
  content: '0' counter(toolbox);
  position: absolute;
  left: 22px;
  top: 35px;
  color: #4f6054;
  font: 500 9px var(--font-en);
}
.inner-page .skill-groups article:hover { background: #c5f67504; }
.inner-page .skill-groups i { font-size: 23px; color: #b6db89; margin-bottom: 26px; }
.inner-page .skill-groups h3 { font-size: 15px; color: #e5eae0; font-weight: 500; }
.inner-page .skill-groups p { font-size: 10px; line-height: 2.2; color: #7e9187; margin-top: 14px; overflow-wrap: anywhere; }
.inner-page .resume-section { padding-block: 40px 60px; }
.inner-page .resume-timeline { position: relative; }
.inner-page .resume-timeline::before { content: ''; position: absolute; top: 0; bottom: 0; right: 166px; width: 1px; background: #ffffff12; }
.inner-page .resume-timeline article {
  position: relative;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 66px;
  border-top: 1px solid #ffffff0c;
  padding: 38px 0;
}
.inner-page .resume-timeline article::before {
  content: '';
  position: absolute;
  right: 162px;
  top: 47px;
  width: 9px;
  height: 9px;
  border: 2px solid #c5f675;
  border-radius: 50%;
  background: #0a0d12;
  box-shadow: 0 0 0 7px #0a0d12;
}
.inner-page .resume-timeline article:first-child::before { background: #c5f675; box-shadow: 0 0 0 7px #0a0d12, 0 0 18px #c5f67525; }
.inner-page .resume-date { color: #a0be8a; font-size: 12px; padding-top: 5px; }
.inner-page .resume-timeline h3 { color: #e8ede3; font-size: 22px; font-weight: 500; margin-bottom: 10px; }
.inner-page .resume-timeline strong { color: #7bc8ce; font-weight: 400; font-size: 12px; }
.inner-page .resume-timeline p { max-width: 770px; color: #84929a; font-size: 13px; line-height: 2.3; margin-top: 15px; }
.inner-page .resume-facts { gap: 20px; }
.inner-page .resume-facts article {
  position: relative;
  padding: 30px;
  background: #10161b;
  border: 1px solid #ffffff0e;
  border-radius: 5px;
  overflow: hidden;
}
.inner-page .resume-facts article::before { content: ''; position: absolute; top: 0; right: 30px; height: 2px; width: 30px; background: #c5f67588; }
.inner-page .resume-facts article:nth-child(2)::before { background: #7bc8ce88; }
.inner-page .resume-facts h2 { font-size: 20px; font-weight: 500; margin-block: 18px 15px; }
.inner-page .resume-facts p { color: #87969b; font-size: 12px; line-height: 2.3; }
.inner-page .resume-facts p + p { margin-top: 16px; }
.inner-page .principles {
  position: relative;
  padding-block: 70px;
  margin-block: 28px 60px;
  background: linear-gradient(115deg, #141c18, #0f151a);
  border-block: 1px solid #a0c57915;
  overflow: hidden;
}
.inner-page .principles::before, .inner-page .principles::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -150px;
  width: 420px;
  height: 200px;
  border: 1px solid #c5f67513;
  border-radius: 50%;
  transform: translateY(-50%) rotate(-40deg);
  pointer-events: none;
}
.inner-page .principles::after { left: auto; right: -150px; transform: translateY(-50%) rotate(40deg); border-color: #7bc8ce13; }
.inner-page .principles h2 { position: relative; font-size: clamp(26px, 3vw, 42px); font-weight: 600; line-height: 1.8; margin-top: 22px; letter-spacing: -1px; }
.inner-page .principles h2 span { color: #c5f675; }
.inner-page .principles p { position: relative; color: #85958d; font-size: 12px; margin-top: 22px; }

/* Service index: a spacious technical ledger, with depth on interaction. */
.inner-page .service-grid { padding-block: 60px 84px; gap: 26px; align-items: stretch; }
.inner-page .service-card {
  display: flex;
  flex-direction: column;
  padding: 34px 36px 25px;
  border: 1px solid #ffffff12;
  border-radius: 7px;
  background: linear-gradient(150deg, #12191d, #0d1218 80%);
  box-shadow: none;
  transition: transform .4s, border-color .4s, box-shadow .4s;
  scroll-margin-top: 32px;
}
.inner-page .service-card:hover { transform: perspective(1200px) rotateX(2deg) translateY(-5px); border-color: #c5f67544; box-shadow: 0 22px 40px #0003; }
.inner-page .service-card-top { margin-bottom: 28px; }
.inner-page .service-icon { width: 48px; height: 48px; border: 1px solid #c5f67526; color: #c5f675; background: #c5f67506; border-radius: 6px; font-size: 21px; }
.inner-page .service-number { font: 400 56px/1 var(--font-en); letter-spacing: -3px; color: #314138; }
.inner-page .service-card:nth-child(even) .service-icon { color: #7bc8ce; border-color: #7bc8ce26; background: #7bc8ce06; }
.inner-page .service-card:nth-child(even) .service-number { color: #2a3b40; }
.inner-page .service-card h2 { font-size: 26px; font-weight: 500; color: #e7ece2; letter-spacing: -.7px; }
.inner-page .service-card > p { font-size: 13px; color: #89969e; line-height: 2.2; margin-block: 15px 27px; }
.inner-page .service-card ul { gap: 12px; padding-bottom: 28px; }
.inner-page .service-card li { font-size: 12px; color: #b3bdb4; align-items: baseline; gap: 12px; }
.inner-page .service-card li i { font-size: 8px; color: #83a95f; }
.inner-page .service-card-bottom { margin-top: auto; padding-top: 20px; border-color: #ffffff0e; }
.inner-page .service-card-bottom > span { font-size: 9px; color: #778b81; line-height: 1.9; }
.inner-page .service-card-bottom a { width: 36px; height: 36px; background: transparent; border: 1px solid #c5f67533; color: #c5f675; font: 24px var(--font-en); transition: background .25s, color .25s, transform .25s; }
.inner-page .service-card-bottom a:hover { background: #c5f675; color: #14200b; transform: rotate(-15deg); }
.inner-page .process-section { padding-block: 20px 100px; }
.inner-page .process-grid { gap: 34px; padding-top: 16px; }
.inner-page .process-grid article { border-color: #ffffff20; padding-top: 25px; }
.inner-page .process-grid article > span { display: block; width: auto; padding: 0; border-radius: 0; background: transparent; color: #a0ba88; font: 400 40px/1 var(--font-en); letter-spacing: -2px; }
.inner-page .process-grid h3 { font-size: 17px; font-weight: 500; margin-block: 25px 12px; }
.inner-page .process-grid p { color: #84939a; font-size: 12px; line-height: 2.2; max-width: 240px; }

/* Contact is deliberately direct: large link rows and a quiet briefing panel. */
.inner-page .contact-layout { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); padding-block: 70px 85px; gap: 100px; align-items: start; }
.inner-page .contact-methods h2 { font-size: 28px; font-weight: 500; letter-spacing: -.8px; }
.inner-page .contact-methods > p { color: #839288; margin-top: 12px; margin-bottom: 30px; }
.inner-page .contact-method { min-height: 105px; gap: 20px; padding-block: 25px; border-color: #ffffff12; transition: padding .3s, border-color .3s; }
.inner-page .contact-method:hover { transform: none; padding-inline: 9px; border-color: #c5f67555; }
.inner-page .method-icon { width: 46px; height: 46px; border-radius: 50%; background: transparent; border: 1px solid #ffffff1a; color: #b3ca9e; font-size: 19px; }
.inner-page .contact-method strong { color: #e2e8dd; font-size: 16px; font-weight: 500; }
.inner-page .contact-method small { color: #7f9392; font-size: 12px; margin-top: 6px; overflow-wrap: anywhere; }
.inner-page .contact-method small[dir="ltr"] { font-family: var(--font-en); font-size: 12px; }
.inner-page .method-arrow { color: #c5f675; font: 26px var(--font-en); }
.inner-page .conversation-card { position: relative; background: #11191d; border: 1px solid #ffffff12; border-radius: 7px; padding: 36px; overflow: hidden; }
.inner-page .conversation-card::before { content: ''; position: absolute; width: 130px; height: 130px; border: 1px solid #c5f67518; border-radius: 50%; left: -60px; top: -70px; box-shadow: 0 0 0 22px #c5f67503, 0 0 0 45px #c5f67502; pointer-events: none; }
.inner-page .conversation-card h2 { color: #e3eadd; font-size: 26px; font-weight: 500; margin-block: 15px 16px; }
.inner-page .conversation-card > p { color: #84969d; font-size: 12px; line-height: 2.2; }
.inner-page .conversation-card ol { margin-top: 30px; gap: 27px; }
.inner-page .conversation-card li { gap: 19px; }
.inner-page .conversation-card li > span { color: #93b578; font: 500 10px var(--font-en); padding-top: 8px; }
.inner-page .conversation-card li strong { font-size: 13px; color: #c7d2c4; font-weight: 500; }
.inner-page .conversation-card li p { font-size: 11px; color: #7e9096; line-height: 2.1; margin-top: 6px; }
.inner-page .contact-location { border-color: #ffffff12; padding-top: 25px; margin-top: 32px; color: #9aae9e; font-size: 12px; }
.inner-page .contact-location > i { color: #7bc8ce; font-size: 23px; }
.inner-page .contact-location small { color: #657f7c; font-size: 10px; margin-top: 3px; }
.inner-page .faq-section { padding-block: 15px 90px; }
.inner-page .faq-section .section-heading { margin-bottom: 15px; }
.inner-page .faq-section details { padding: 25px 0; border-color: #ffffff12; }
.inner-page .faq-section summary { position: relative; padding-left: 45px; list-style: none; font-size: 16px; color: #ccd7c7; }
.inner-page .faq-section summary::-webkit-details-marker { display: none; }
.inner-page .faq-section summary::after { content: '+'; position: absolute; left: 0; top: -3px; color: #a9ce8b; font: 300 25px var(--font-en); }
.inner-page .faq-section details[open] summary::after { content: '−'; }
.inner-page .faq-section details p { color: #8b999f; font-size: 13px; line-height: 2.3; max-width: 850px; margin-top: 22px; }
.inner-page .faq-section a { color: #c5f675; text-decoration: underline; text-underline-offset: 4px; }

@media (max-width: 1100px) {
  .inner-page .about-story { gap: 50px; }
  .inner-page .developer-card pre { font-size: 10px; padding-inline: 18px; }
  .inner-page .skill-groups article { padding-inline: 20px; }
  .inner-page .contact-layout { gap: 50px; }
  .inner-page .conversation-card { padding: 28px; }
}
@media (max-width: 820px) {
  .inner-page .about-story { grid-template-columns: 1fr; gap: 45px; padding-block: 60px; }
  .inner-page .story-copy { max-width: 640px; }
  .inner-page .developer-card { max-width: 580px; width: 100%; margin: 0 auto; transform: perspective(1100px) rotateY(-4deg) rotateZ(1deg); }
  .inner-page .developer-card pre { font-size: 12px; padding: 26px; }
  .inner-page .skill-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inner-page .skill-groups article { padding: 28px 22px; }
  .inner-page .skill-groups article:nth-child(2) { border-inline-end: 0; }
  .inner-page .skill-groups article:nth-child(-n+2) { border-bottom: 1px solid #ffffff12; }
  .inner-page .skills-section { padding-bottom: 55px; }
  .inner-page .resume-facts { grid-template-columns: 1fr; }
  .inner-page .resume-facts article { padding: 27px; }
  .inner-page .service-card { padding: 27px; }
  .inner-page .service-card h2 { font-size: 23px; }
  .inner-page .service-card li { font-size: 11px; }
  .inner-page .service-card > p { font-size: 12px; }
  .inner-page .process-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 35px; }
  .inner-page .contact-layout { grid-template-columns: 1fr; gap: 45px; padding-block: 50px 65px; }
  .inner-page .conversation-card { padding: 35px; }
  .inner-page .conversation-card ol { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
  .inner-page .conversation-card li { display: block; }
  .inner-page .conversation-card li > span { display: block; padding: 0 0 12px; }
}
@media (max-width: 560px) {
  .inner-page .about-story { padding-block: 40px 55px; gap: 32px; }
  .inner-page .story-copy h2 { font-size: 25px; letter-spacing: -.6px; margin-block: 13px 20px; }
  .inner-page .story-copy p { font-size: 12px; line-height: 2.35; }
  .inner-page .developer-card { transform: none; box-shadow: 6px 10px 0 -3px #151d19, 6px 10px 0 -2px #a1c9821a; }
  .inner-page .developer-card pre { padding: 22px 15px; font-size: 9px; line-height: 2.3; }
  .inner-page .terminal-top { padding-inline: 15px; font-size: 9px; min-height: 40px; }
  .inner-page .terminal-status { font-size: 9px; padding: 12px 15px; }
  .inner-page .skill-groups article { padding: 24px 16px; }
  .inner-page .skill-groups article::after { left: 16px; top: 28px; font-size: 8px; }
  .inner-page .skill-groups h3 { font-size: 13px; }
  .inner-page .skill-groups p { font-size: 9px; line-height: 2.1; }
  .inner-page .skill-groups i { font-size: 20px; margin-bottom: 22px; }
  .inner-page .resume-section { padding-block: 20px 35px; }
  .inner-page .resume-timeline::before { right: 4px; }
  .inner-page .resume-timeline article { grid-template-columns: 1fr; padding: 28px 25px 28px 0; gap: 14px; }
  .inner-page .resume-timeline article::before { right: 0; top: 37px; }
  .inner-page .resume-date { font-size: 11px; padding-top: 0; }
  .inner-page .resume-timeline h3 { font-size: 19px; line-height: 1.9; }
  .inner-page .resume-timeline strong { font-size: 11px; line-height: 2; }
  .inner-page .resume-timeline p { font-size: 12px; line-height: 2.2; margin-top: 12px; }
  .inner-page .resume-facts { gap: 15px; }
  .inner-page .resume-facts article { padding: 24px; }
  .inner-page .resume-facts article::before { right: 24px; }
  .inner-page .resume-facts h2 { font-size: 19px; }
  .inner-page .resume-facts p { font-size: 12px; }
  .inner-page .principles { padding-block: 45px; margin-block: 15px 35px; }
  .inner-page .principles h2 { font-size: 25px; line-height: 1.9; }
  .inner-page .principles p { font-size: 11px; line-height: 2.3; max-width: 290px; margin-inline: auto; }
  .inner-page .service-grid { grid-template-columns: 1fr; padding-block: 35px 50px; gap: 18px; }
  .inner-page .service-card { padding: 27px 24px 20px; }
  .inner-page .service-number { font-size: 48px; }
  .inner-page .service-icon { width: 43px; height: 43px; font-size: 18px; }
  .inner-page .service-card-top { margin-bottom: 22px; }
  .inner-page .service-card h2 { font-size: 24px; }
  .inner-page .service-card > p { font-size: 12px; margin-bottom: 23px; }
  .inner-page .service-card li { font-size: 11px; gap: 10px; }
  .inner-page .service-card ul { padding-bottom: 25px; }
  .inner-page .service-card-bottom > span { font-size: 8px; }
  .inner-page .process-section { padding-block: 15px 60px; }
  .inner-page .process-grid { gap: 28px 22px; }
  .inner-page .process-grid article > span { font-size: 32px; }
  .inner-page .process-grid h3 { font-size: 15px; margin-block: 20px 10px; }
  .inner-page .process-grid p { font-size: 11px; line-height: 2.2; }
  .inner-page .contact-layout { padding-block: 35px 50px; gap: 35px; }
  .inner-page .contact-methods h2 { font-size: 24px; }
  .inner-page .contact-method { min-height: 96px; gap: 15px; padding-block: 23px; }
  .inner-page .method-icon { width: 39px; height: 39px; font-size: 17px; }
  .inner-page .contact-method strong { font-size: 14px; }
  .inner-page .contact-method small { font-size: 11px; }
  .inner-page .contact-method small[dir="ltr"] { font-size: 11px; }
  .inner-page .conversation-card { padding: 27px 24px; }
  .inner-page .conversation-card h2 { font-size: 24px; }
  .inner-page .conversation-card ol { grid-template-columns: 1fr; gap: 25px; }
  .inner-page .conversation-card li { display: flex; gap: 19px; }
  .inner-page .conversation-card li > span { padding-top: 8px; }
  .inner-page .contact-location { margin-top: 25px; }
  .inner-page .faq-section { padding-bottom: 55px; }
  .inner-page .faq-section details { padding-block: 23px; }
  .inner-page .faq-section summary { font-size: 13px; line-height: 2; padding-left: 30px; }
  .inner-page .faq-section summary::after { top: 0; font-size: 23px; }
  .inner-page .faq-section details p { font-size: 12px; margin-top: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  .inner-page .developer-card, .inner-page .developer-card:hover,
  .inner-page .service-card:hover, .inner-page .service-card-bottom a:hover { transform: none; }
  .inner-page .developer-card, .inner-page .service-card,
  .inner-page .service-card-bottom a, .inner-page .contact-method { transition: none; }
}
