:root {
  --paper: #f7f8fa;
  --text: #191f28;
  --muted: #6b7684;
  --line: #e5e8eb;
  --blue: #3182f6;
  --black: #101317;
  --max: 1440px;
}

body { background: var(--paper); color: var(--text); letter-spacing: -.012em; }
.shell { width: min(calc(100% - 32px), var(--max)); }
.site-header { height: 64px; background: rgba(255,255,255,.82); border-color: rgba(2,32,71,.08); }
.header-inner { max-width: var(--max); }
.brand { font-size: 16px; letter-spacing: -.04em; }
.desktop-nav { gap: 8px; font-size: 13px; }
.desktop-nav a { padding: 9px 12px; border-radius: 10px; }
.desktop-nav a:hover { background: #f2f4f6; }
.desktop-nav .contact-link { color: #fff; background: var(--blue); padding-inline: 16px; }
.desktop-nav .contact-link:hover { color: #fff; background: #1b64da; }

.hero { min-height: 820px; padding: 118px 0 64px; text-align: center; background: linear-gradient(135deg,#f5fbff 0%,#fff 48%,#f8faff 100%); }
.hero:after { display: none; }
.hero-layout { max-width: var(--max); margin: auto; }
.hero-content { max-width: 1120px; margin: auto; }
.hero-eyebrow { margin: 0 0 28px; color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: .14em; }
.hero h1 { max-width: none; margin-bottom: 24px; font-size: clamp(52px,5.8vw,82px); line-height: 1.05; letter-spacing: -.065em; }
.hero h1 strong { color: var(--blue); font-weight: 700; }
.hero-role { max-width: 860px; margin: 0 auto 16px; font-size: clamp(21px,2vw,29px); line-height: 1.45; letter-spacing: -.04em; }
.hero-description { max-width: 620px; margin: auto; color: var(--muted); font-size: 16px; line-height: 1.75; }
.hero-actions { justify-content: center; margin-top: 36px; }
.button { min-height: 52px; padding: 0 22px; border-radius: 14px; font-size: 15px; box-shadow: none; }
.button.ghost { border-color: var(--line); background: #f2f4f6; color: #333d4b; }
.hero-socials { display: flex; justify-content: center; gap: 22px; margin-top: 28px; color: #8b95a1; font-size: 13px; font-weight: 600; }
.hero-socials a:hover { color: var(--blue); }
.hero-facts { max-width: 820px; margin: clamp(54px,8vh,88px) auto 0; border-color: var(--line); text-align: left; }
.hero-fact { padding-top: 20px; }
.hero-fact span { color: #8b95a1; font-weight: 700; }
.hero-fact strong { color: #333d4b; font-size: 14px; }

section { scroll-margin-top: 64px; }
.section-title { color: var(--text); font-size: clamp(38px,4.3vw,58px); line-height: 1.16; letter-spacing: -.06em; }
.about { padding: 124px 0 88px; background: #fff; }
.about .shell { width: 100%; max-width: none; }
.about-grid { padding: 0 clamp(24px,5vw,96px); border: 0; border-radius: 0; box-shadow: none; grid-template-columns:minmax(320px,.72fr) minmax(600px,1.28fr); align-items:start; }
.about-lead { position:sticky; top:110px; max-width:560px; color:#191f28; font-size:clamp(38px,4vw,60px); line-height:1.18; letter-spacing:-.06em; }
.about-lead strong { color: var(--blue); }
.profile-facts,.profile-fact { border-color: var(--line); }
.profile-story { display:grid; grid-template-columns:minmax(360px,.8fr) minmax(620px,1.2fr); gap:clamp(70px,10vw,180px); padding:0 clamp(24px,7vw,140px); }
.profile-heading>span,.activity-heading>span { display:block; margin-bottom:24px; color:#3182f6; font-size:11px; font-weight:800; letter-spacing:.12em; }
.profile-heading h2,.activity-heading h2 { margin:0; color:#191f28; font-size:clamp(42px,4.8vw,70px); line-height:1.12; letter-spacing:-.065em; }
.profile-heading p,.activity-heading p { max-width:520px; margin:28px 0 0; color:#6b7684; font-size:16px; line-height:1.85; }
.profile-principles { border-top:1px solid #d9dee3; }
.profile-principles article { display:grid; grid-template-columns:70px 1fr; gap:22px; padding:30px 0; border-bottom:1px solid #d9dee3; }
.profile-principles article>span { color:#3182f6; font-size:12px; font-weight:800; }
.profile-principles h3 { margin:0 0 10px; font-size:21px; letter-spacing:-.035em; }
.profile-principles p { max-width:650px; margin:0; color:#6b7684; font-size:14px; line-height:1.75; }
.profile-principles small { display:block; margin-top:18px; color:#9aa4af; font-size:9px; font-weight:750; letter-spacing:.1em; }

.now-section { padding: 0 0 128px; background:#fff; }
.now-section .shell { width:100%; max-width:none; padding-inline:clamp(24px,5vw,96px); }
.now-grid { grid-template-columns:1.1fr repeat(3,1fr); gap:0; overflow:hidden; border:1px solid #242b34; border-radius:28px; background:#171b20; }
.now-grid>div,.now-grid>article { min-height:260px; padding:34px; border:0; border-left:1px solid #303741; border-radius:0; background:transparent; color:#fff; }
.now-grid>div { border-left:0; }
.now-grid>div .now-label,.now-grid article span { color:#70a7ff; }
.now-grid article h3 { color:#fff; }
.now-grid article p { color:#aab3bd; }
.activity-layout { display:grid; grid-template-columns:minmax(300px,.65fr) minmax(700px,1.35fr); gap:clamp(60px,9vw,160px); padding:70px clamp(24px,7vw,140px); border-radius:36px; background:#f2f6fb; }
.activity-heading h2 { font-size:clamp(38px,4vw,58px); }
.activity-feed { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.activity-feed article { min-height:300px; padding:28px; display:flex; flex-direction:column; border:1px solid #e0e7ef; border-radius:22px; background:#fff; box-shadow:0 8px 28px rgba(24,57,90,.045); }
.activity-feed time { color:#3182f6; font-size:10px; font-weight:800; letter-spacing:.1em; }
.activity-feed h3 { margin:58px 0 14px; font-size:19px; line-height:1.4; letter-spacing:-.035em; }
.activity-feed p { margin:0; color:#6b7684; font-size:13px; line-height:1.75; }
.activity-feed article>span { margin-top:auto; padding-top:24px; color:#8b95a1; font-size:10px; font-weight:700; }

.journey { padding-block: 144px; }
.timeline { border-color: var(--line); }
.timeline-row { padding: 28px 0; border-color: var(--line); transition: padding .2s,background .2s; }
.timeline-row:hover { padding-inline: 18px; background: #f7f8fa; }
.timeline-row h3 { font-size: 18px; }
.timeline-row p { color: var(--muted); }

.projects { padding-block:136px; background:#f7f8fa; }
.projects .shell { width:100%; max-width:none; padding-inline:clamp(24px,5vw,96px); }
.project-list { display:block; }
.project { display:block; min-height:0; border:0; border-top:1px solid #d9dee3; border-radius:0; background:transparent; box-shadow:none; }
.project:last-child { border-bottom:1px solid #d9dee3; }
.project:hover { transform:none; box-shadow:none; }
.project-visual { display:none; }
.project-content { min-height:0; padding:46px 0; display:grid; grid-template-columns:minmax(240px,.55fr) minmax(500px,1.45fr); column-gap:clamp(50px,7vw,130px); align-items:start; }
.project-meta { grid-column:1; margin:5px 0 18px; }
.project h3 { grid-column:1; color:#191f28; font-size:clamp(34px,3.2vw,52px); }
.project-summary { grid-column:2; grid-row:1 / span 2; min-height:0; margin:0; max-width:800px; font-size:clamp(19px,1.7vw,26px); line-height:1.55; }
.project-details { grid-column:2; margin-top:30px; }
.tags { grid-column:2; }
.project h3 { color: #191f28; font-size: 34px; }
.project-summary { color: #333d4b; }
.project-details>summary { color: #4e5968; }
.project-case dt { color: var(--blue); }
.tag { padding: 7px 10px; border-radius: 9px; background: #f2f4f6; color: #4e5968; }

/* Product previews: dashboard-like surfaces instead of decorative icon cards. */
.project-visual { min-height: 410px; padding: 38px; align-items: center; }
.project-visual:before,.project-visual:after { display: none; }
.visual-aegis { background: linear-gradient(145deg,#0d2527,#153d38); }
.visual-orbit { background: linear-gradient(145deg,#171a33,#29265c); }
.visual-air { background: linear-gradient(145deg,#e7f8f4,#ccefe5); }
.visual-vault { background: linear-gradient(145deg,#251a1c,#4a2521); }
.product-preview { width: 100%; min-height: 330px; overflow: hidden; border: 1px solid rgba(255,255,255,.52); border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 28px 70px rgba(0,0,0,.22); color: #191f28; transform: translateY(0); transition: transform .35s ease,box-shadow .35s ease; }
.project:hover .product-preview { transform: translateY(-5px); box-shadow: 0 34px 80px rgba(0,0,0,.27); }
.project:hover .product-preview { transform: translateY(0); }
.preview-bar { height: 64px; padding: 0 20px; display: flex; align-items: center; border-bottom: 1px solid #edf0f2; background: rgba(255,255,255,.94); }
.preview-brand { display: flex; align-items: center; gap: 11px; font-size: 13px; font-weight: 750; }
.preview-brand img,.project-visual .preview-brand img { width: 34px; height: 34px; border-radius: 10px; filter: none; }
.live-status { margin-left: auto; padding: 6px 9px; border-radius: 999px; background: #eafaf3; color: #169b62; font-size: 9px; font-weight: 700; }
.preview-body { position: relative; padding: 25px; text-align: left; }
.preview-body:before { content:""; position:absolute; right:-45px; bottom:-70px; width:190px; height:190px; border-radius:50%; background:rgba(49,130,246,.055); pointer-events:none; }
.preview-title span { display: block; margin-bottom: 5px; color: #8b95a1; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.preview-title strong { font-size: 17px; letter-spacing: -.03em; }
.metric-row { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 21px; }
.metric-row>div { position:relative; padding: 14px; border: 1px solid #edf0f2; border-radius: 13px; background: #fafbfc; }
.metric-row>div:after { content:""; position:absolute; left:13px; right:13px; bottom:-10px; height:1px; background:#dfe5ea; }
.metric-row span,.air-stats span { display: block; color: #8b95a1; font-size: 8px; }
.metric-row strong,.air-stats strong { display: block; margin-top: 6px; font-size: 14px; }
.metric-row .good { color: #16a36a; }
.chart-bars { height: 72px; display: flex; align-items: end; gap: 7px; margin-top: 20px; padding: 0 4px; border-bottom:1px solid #e6eaed; }
.chart-bars i { flex: 1; height: 34%; border-radius: 4px 4px 1px 1px; background: #5ee0b5; }
.chart-bars i:nth-child(2),.chart-bars i:nth-child(8){height:55%}.chart-bars i:nth-child(3),.chart-bars i:nth-child(7){height:70%}.chart-bars i:nth-child(4){height:44%}.chart-bars i:nth-child(5),.chart-bars i:nth-child(9){height:82%}.chart-bars i:nth-child(6){height:62%}.chart-bars i:nth-child(10){height:96%}
.server-list,.secret-list { display: grid; gap: 8px; margin-top: 18px; }
.server-list>div,.secret-list>div { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; min-height: 47px; padding: 8px 11px; border: 1px solid #edf0f2; border-radius: 11px; background:#fff; }
.server-list i { width: 22px; height: 22px; border-radius: 7px; background: linear-gradient(135deg,#7270ff,#aaa9ff); }
.server-list span,.secret-list span { font-size: 9px; font-weight: 700; }
.server-list small { display: block; margin-top: 2px; color: #8b95a1; font-size: 7px; font-weight: 500; }
.server-list b,.secret-list i { color: #169b62; font-size: 8px; font-style: normal; }
.air-score { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-radius: 16px; background: #effaf7; }
.air-score span,.air-score small { display: block; color: #6b7684; font-size: 8px; }
.air-score strong { display: block; margin: 5px 0; color: #168c68; font-size: 23px; }
.air-score>b { color: #168c68; font-size: 33px; }
.air-score>b small { display: inline; margin-left: 3px; }
.air-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 12px; }
.air-stats>div { padding: 12px; border: 1px solid #e5eeeb; border-radius: 11px; }
.secret-list>div { grid-template-columns: 1.1fr 1fr auto; }
.secret-list b { color: #b0b8c1; font-size: 9px; letter-spacing: .12em; }
.secret-list i { padding: 5px 7px; border-radius: 7px; background: #eafaf3; }

/* Let dense sections use the same wide rhythm as the original portfolio. */
.journey .shell,.capabilities .shell { width: 100%; max-width: none; padding-inline: clamp(24px,4vw,96px); }
.journey-intro { grid-template-columns: 1fr; gap: 48px; }
.journey-intro>p { max-width: 780px; }
.timeline { width: 100%; grid-template-columns: repeat(5,minmax(240px,1fr)); }
.timeline-row { min-height: 390px; padding: 30px clamp(22px,2vw,40px); }
.timeline-row:first-child { padding-left: 0; }
.timeline-row:last-child { padding-right: 0; }
.timeline-row h3 { max-width: 280px; font-size: 19px; line-height: 1.45; }
.timeline-row p { max-width: 360px; font-size: 13px; line-height: 1.9; }
.cap-body { grid-template-columns: 1fr; gap: 42px; }
.cap-intro { max-width: 760px; }
.language-icons { max-width: 900px; grid-template-columns: repeat(6,1fr); }
.cap-list { grid-template-columns: repeat(3,1fr); }
.skill-sheet { display:grid; grid-template-columns:minmax(280px,.55fr) minmax(700px,1.45fr); gap:clamp(60px,9vw,160px); padding-block:10px; }
.skill-heading h2 { margin:0; font-size:clamp(38px,4vw,58px); line-height:1.15; letter-spacing:-.055em; }
.skill-heading p { margin:18px 0 0; color:#8b95a1; font-size:14px; }
.skill-icons { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-top:34px; }
.skill-icons>div { min-width:0; height:78px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; border:1px solid #e5e8eb; border-radius:14px; background:#fff; }
.skill-icons img { width:25px; height:25px; object-fit:contain; }
.skill-icons span { max-width:100%; overflow:hidden; text-overflow:ellipsis; color:#4e5968; font-size:9px; font-weight:700; }
.skill-groups { border-top:1px solid #d9dee3; }
.skill-groups>div { display:grid; grid-template-columns:130px minmax(250px,.9fr) minmax(280px,1.1fr); gap:32px; align-items:center; min-height:108px; padding-block:12px; border-bottom:1px solid #d9dee3; }
.skill-groups span { color:#8b95a1; font-size:11px; font-weight:700; }
.skill-groups strong { color:#191f28; font-size:15px; }
.skill-groups p { margin:0; color:#6b7684; font-size:13px; line-height:1.65; }

.capabilities,.collaboration { background: #fff; }
.language { min-height: 92px; border: 0; border-radius: 18px; background: #f7f8fa; transition: transform .2s,background .2s; }
.language:hover { transform: translateY(-3px); background: #eef4ff; }
.cap-row,.collab-row,.direction-item,.faq-item { border-color: var(--line); }
.cap-row { padding: 25px 0; }
.process-section { background: #fff; color: var(--text); }
.process-section:before,.process-section:after { display: none; }
.process-head h2 { color: var(--text); }
.process-head p { color: var(--muted); }
.process-item,.process-item:first-child { border-color: var(--line); border-radius: 22px; background: #f7f8fa; box-shadow: none; backdrop-filter: none; }
.process-item h3 { color: var(--text); }
.process-item p { color: var(--muted); }
.direction { background: #f7f8fa; }
.direction-item:before { color: var(--blue); }
.collab-row { border-radius: 16px; transition: padding .2s,background .2s; }
.collab-row:hover { padding-inline: 18px; background: #f7f8fa; }
.faq-section { background: #f2f4f6; }
.faq { border: 0; padding: 0 32px; border-radius: 28px; background: #fff; }
.faq-item summary { min-height: 80px; }
.contact { min-height: 560px; padding: 110px 0; display: flex; align-items: center; isolation: isolate; overflow: hidden; background: #fff; color: #191f28; }
.contact:before { content:""; display:block; position:absolute; z-index:-2; left:50%; bottom:-440px; width:min(1320px,110vw); height:900px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse at center,#cfeaff 0%,#e8f5ff 38%,rgba(243,249,255,.72) 58%,rgba(255,255,255,0) 76%); filter:blur(12px); pointer-events:none; }
.contact:after { content:""; display:block; position:absolute; z-index:-1; left:50%; bottom:-290px; width:min(880px,82vw); height:540px; transform:translateX(-50%); border-radius:50%; background:rgba(174,218,255,.28); filter:blur(72px); pointer-events:none; }
.contact-inner { max-width: 920px; }
.contact h2 { margin: 0 0 20px; color: #191f28; font-size: clamp(46px,5.2vw,72px); line-height: 1.12; letter-spacing: -.06em; text-shadow: none; }
.contact-copy { color: #6b7684; font-size: 17px; }
.contact-links { margin-top: 36px; }
.contact-links a { min-height: 56px; padding: 0 24px; border: 1px solid #d7e8f7; border-radius: 14px; background: rgba(255,255,255,.9); color: #1b64da; font-weight: 750; box-shadow: 0 14px 35px rgba(70,139,195,.13); }
.contact-links a:hover { background: #eaf5ff; color: #174ea6; transform: translateY(-2px); }
footer { background: #fff; color: #8b95a1; border-color: #e5e8eb; }

:focus-visible { outline: 3px solid rgba(49,130,246,.4); outline-offset: 3px; }

@media (max-width: 1200px) and (min-width: 901px) {
  .timeline { grid-template-columns: repeat(3,1fr); }
  .timeline-row,.timeline-row:first-child,.timeline-row:last-child { min-height: 330px; padding: 30px; }
}

@media (max-width: 900px) {
  .site-header { height: 58px; }
  .now-grid { grid-template-columns: 1fr 1fr; }
  .now-grid>div { grid-column: 1 / -1; }
  .project-list { grid-template-columns: 1fr; }
  .project-content { grid-template-columns:1fr; gap:0; }
  .project-summary,.project-details,.tags,.project-meta,.project h3 { grid-column:1; grid-row:auto; }
  .project-summary { min-height: auto; }
  .timeline { grid-template-columns: 1fr 1fr; }
  .timeline-row,.timeline-row:first-child,.timeline-row:last-child { min-height: 300px; padding: 28px; }
  .cap-list { grid-template-columns: 1fr 1fr; }
  .skill-sheet { grid-template-columns:1fr; gap:40px; }
  .skill-icons { grid-template-columns:repeat(6,1fr); }
  .skill-groups>div { grid-template-columns:110px 1fr; padding:20px 0; }
  .skill-groups p { grid-column:2; }
  .profile-story,.activity-layout { grid-template-columns:1fr; gap:50px; }
  .activity-feed { grid-template-columns:1fr 1fr; }
}

@media (max-width: 600px) {
  .shell { width: calc(100% - 32px); }
  .hero { min-height: 700px; padding: 104px 0 46px; }
  .hero h1 { font-size: clamp(46px,13vw,60px); }
  .hero-role { font-size: 21px; }
  .hero-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .hero-facts { grid-template-columns: repeat(3,1fr); gap: 0; }
  .hero-fact { padding: 15px 10px 0 0; border-bottom: 0; }
  .hero-fact+.hero-fact { padding-left: 12px; border-left: 1px solid var(--line); }
  .hero-fact strong { font-size: 12px; line-height: 1.45; }
  .about { padding: 90px 0; }
  .about-grid { padding: 0 20px; border-radius: 0; }
  .about-lead { position:static; font-size:34px; }
  .profile-story,.activity-layout { padding-inline:20px; }
  .activity-layout { padding-block:50px; border-radius:24px; }
  .activity-feed { grid-template-columns:1fr; }
  .about-lead { font-size: 28px; }
  .about-detail { grid-template-columns: 1fr; }
  .profile-facts { grid-template-columns: 1fr 1fr; }
  .profile-fact:nth-child(3) { border-left: 0; border-top: 1px solid var(--line); }
  .profile-fact:nth-child(4) { border-top: 1px solid var(--line); }
  .now-grid { grid-template-columns: 1fr; }
  .now-grid>div { grid-column: auto; }
  .now-grid>div,.now-grid>article { min-height: 190px; }
  .projects { padding-block: 96px; }
  .project { border-radius: 24px; }
  .project-visual { min-height: 320px; padding: 22px 16px; }
  .product-preview { min-height: 276px; border-radius:18px; }
  .preview-body { padding: 18px; }
  .timeline { grid-template-columns: 1fr; }
  .cap-list { grid-template-columns: 1fr; }
  .language-icons { grid-template-columns: repeat(3,1fr); }
  .skill-groups>div { grid-template-columns:1fr; gap:8px; }
  .skill-groups p { grid-column:1; }
  .skill-icons { grid-template-columns:repeat(4,1fr); }
  .project-content { padding: 30px 24px; }
  .faq { padding-inline: 22px; border-radius: 22px; }
  .contact { min-height: 430px; padding: 84px 0; }
  .contact h2 { font-size: 42px; }
}

/* Some Android webviews report a 600–700px CSS viewport. Apply the compact
   layout there too so the language cards never fall back to a tall single row. */
@media (max-width: 700px) {
  .capabilities .skill-icons { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px; }
  .capabilities .skill-icons > div { height: 82px; padding: 8px 4px; }
  .capabilities .skill-icons span { font-size: 9px; }
}

/* Quiet editorial pass: smaller type, fewer template-like decorations. */
body { background:#fff; }
.hero { min-height:680px; padding:128px 0 82px; text-align:left; background:#fff; }
.hero-content { max-width:760px; margin:0; }
.hero h1 { margin-bottom:22px; font-size:clamp(48px,5vw,68px); line-height:1.08; letter-spacing:-.055em; }
.hero h1 strong { color:inherit; }
.hero-role { margin:0 0 14px; max-width:680px; font-size:clamp(22px,2vw,28px); line-height:1.45; }
.hero-description { margin:0; max-width:650px; font-size:15px; line-height:1.8; }
.hero-actions,.hero-socials { justify-content:flex-start; }
.hero-facts { margin-left:0; margin-right:0; }
.button { min-height:46px; border-radius:10px; font-size:14px; }
section { padding-block:100px; }
.section-title { font-size:clamp(32px,3.2vw,46px); letter-spacing:-.045em; }
.about { padding:108px 0; }
.profile-story { grid-template-columns:minmax(340px,.8fr) minmax(580px,1.2fr); }
.profile-heading>span,.activity-heading>span { margin-bottom:16px; color:#8b95a1; font-size:11px; letter-spacing:0; }
.profile-heading h2,.activity-heading h2 { max-width:580px; font-size:clamp(34px,3.4vw,48px); line-height:1.25; letter-spacing:-.045em; }
.profile-heading p { margin-top:22px; }
.profile-principles article { grid-template-columns:1fr; gap:0; padding:26px 0; }
.profile-principles article>span { display:none; }
.profile-principles h3 { font-size:18px; }
.profile-principles small { display:none; }
.journey { padding-block:108px; }
.journey:before { display:none; }
.timeline-row { min-height:320px; }
.timeline-row h3 { font-size:17px; }
.projects { padding-block:108px; background:#fff; }
.project-content { padding:38px 0; }
.project h3 { font-size:clamp(28px,2.5vw,38px); }
.project-summary { font-size:clamp(17px,1.4vw,21px); }
.project-meta { letter-spacing:.04em; text-transform:none; }
.project-details>summary { font-size:12px; }
.tag { border-radius:6px; }
.capabilities { padding-block:108px; }
.skill-heading h2 { font-size:clamp(32px,3vw,44px); }
.skill-icons>div { height:72px; border-radius:10px; }
.skill-groups>div { min-height:94px; }
.process-section { padding-block:108px; }
.process-head h2 { font-size:clamp(32px,3.2vw,46px); line-height:1.25; }
.process-item,.process-item:first-child { min-height:190px; border-radius:12px; }
.direction,.collaboration,.faq-section { padding-block:108px; }
.direction-item:before { display:none; }
.direction-item { grid-template-columns:1fr; }
.collab-row { border-radius:0; }
.faq { border-radius:14px; }
.contact { min-height:480px; }
.contact h2 { font-size:clamp(38px,4vw,54px); }

@media(max-width:600px){
  .hero{min-height:620px;padding:108px 0 58px}.hero h1{font-size:46px}.hero-role{font-size:21px}.hero-actions{display:flex}.hero-facts{grid-template-columns:1fr}.hero-fact+.hero-fact{padding-left:0;border-left:0}.profile-heading h2{font-size:34px}.project h3{font-size:30px}
}

/* Mobile safety net: keep the editorial desktop layout from forcing a wide canvas. */
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }

@media (max-width: 900px) {
  .about-grid,
  .profile-story,
  .activity-layout,
  .project-content,
  .skill-sheet,
  .skill-groups > div,
  .process-head,
  .process-list,
  .direction-grid,
  .collab-head,
  .collab-list { grid-template-columns: minmax(0, 1fr); }

  .about-grid > *,
  .profile-story > *,
  .activity-layout > *,
  .project-content > *,
  .skill-sheet > *,
  .skill-groups > div > *,
  .process-head > *,
  .process-list > *,
  .direction-grid > *,
  .collab-head > *,
  .collab-list > * { min-width: 0; }

  .timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .timeline-row { min-width: 0; }
}

@media (max-width: 600px) {
  .shell { width: min(calc(100% - 32px), var(--max)); }
  .hero { min-height: auto; padding: 104px 0 56px; }
  .hero h1 { font-size: clamp(40px, 12vw, 52px); overflow-wrap: anywhere; }
  .hero-actions { flex-wrap: wrap; }
  .hero-actions .button { flex: 1 1 140px; justify-content: center; }
  .now-section .shell,
  .projects .shell,
  .journey .shell,
  .capabilities .shell { padding-inline: 16px; }
  .about-grid,
  .profile-story,
  .activity-layout { padding-inline: 16px; }
  .timeline,
  .activity-feed,
  .profile-facts,
  .now-grid,
  .process-list,
  .language-icons,
  .skill-icons { grid-template-columns: minmax(0, 1fr); }
  .timeline-row,
  .activity-feed article,
  .process-item,
  .project-content,
  .cap-row,
  .direction-item,
  .collab-row { min-width: 0; }
  .contact-links { flex-direction: column; }
  .contact-links a { width: 100%; }
}

/* Compact project cards on phones: keep the case-study content readable without
   letting title weight or card padding dominate the screen. */
@media (max-width: 600px) {
  .projects { padding-block: 72px; }
  .projects .section-top { margin-bottom: 28px; }
  .project { border-radius: 18px; }
  .project-content { padding: 22px 18px 24px; }
  .project-meta { margin: 0 0 10px; font-size: 10px; }
  .project h3 { margin-bottom: 10px; font-size: 24px; font-weight: 650; line-height: 1.24; letter-spacing: -.045em; }
  .project-summary { margin-bottom: 18px; font-size: 15px; line-height: 1.65; }
  .project-case { gap: 14px; }
  .project-case div { padding-top: 14px; }
  .project-case dd { font-size: 13px; line-height: 1.7; }
  .tags { margin-top: 16px; }
}

/* The generic mobile safety rule previously turned every skill badge into a
   full-width row. Keep this dense reference section compact on phone screens. */
@media (max-width: 600px) {
  .capabilities { padding-block: 64px; }
  .capabilities .shell { padding-inline: 24px; }
  .skill-sheet { gap: 28px; padding-block: 0; }
  .skill-heading h2 { font-size: 36px; line-height: 1.2; }
  .skill-heading p { margin-top: 12px; font-size: 15px; line-height: 1.65; }
  .capabilities .skill-icons { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; margin-top: 24px; }
  .capabilities .skill-icons > div { height: 76px; min-width: 0; gap: 7px; border-radius: 12px; }
  .capabilities .skill-icons img { width: 25px; height: 25px; }
  .skill-groups > div { min-height: 0; padding: 18px 0; }
}