/* André Scavuzzi — caderno de engenharia, atmosfera de jogo. */
@font-face { font-family:'Optimized Garamond'; src:url('../fonts/optimized-garamond2.ttf') format('truetype'); font-display:swap; }
:root {
  color-scheme:dark;
  --dark-primary:#11151c;
  --dark-secondary:#202731;
  --surface:#191f28;
  --accent:#58c7dc;
  --accent-hover:#8ddce9;
  --ember:#e99758;
  --ember-ink:#241a13;
  --violet:#b7a0e3;
  --yellow:#e5d79a;
  --text-primary:#ede8de;
  --text-secondary:#b8bec7;
  --muted:#969eab;
  --card-bg:#191f28;
  --card-border:#343c47;
  --grid:rgba(237,232,222,.035);
  --cyan-wash:rgba(88,199,220,.07);
  --violet-wash:rgba(183,160,227,.09);
  --ember-wash:rgba(233,151,88,.08);
  --shade:rgba(0,0,0,.3);
  --header-bg:rgba(17,21,28,.96);
  --transition:color .2s ease, background .2s ease, border-color .2s ease;
  --font-body:'Manrope',sans-serif;
  --font-display:'Rajdhani',sans-serif;
  --font-mono:'Share Tech Mono',monospace;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-padding-top:110px; }
body {
  color:var(--text-primary); background:var(--dark-primary); font:400 15px/1.8 var(--font-body);
  background-image:radial-gradient(ellipse at 88% 12%,var(--violet-wash),transparent 34%),linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:auto,64px 64px,64px 64px; min-height:100vh;
}
img { max-width:100%; height:auto; display:block; }
a { color:var(--accent); text-underline-offset:5px; }
a:hover { color:var(--accent-hover); }
button,input { font:inherit; }
button,a,input,summary { -webkit-tap-highlight-color:transparent; }
button { color:inherit; cursor:pointer; }
[hidden] { display:none !important; }
:focus-visible { outline:2px solid var(--yellow); outline-offset:5px; }
::selection { background:var(--violet); color:var(--dark-primary); }
h1,h2,h3,h4 { color:var(--text-primary); line-height:1.1; }
h1,h2,h3 { font-family:var(--font-display); font-weight:700; }
h2 { font-size:clamp(2.5rem,5vw,4rem); letter-spacing:-.02em; margin-bottom:1.5rem; }
h3 { font-size:1.75rem; }
h4 { font-size:1rem; line-height:1.5; }
main { max-width:1280px; padding:0 48px; margin:3.5rem auto; min-height:60vh; }
.container { width:100%; min-width:0; }
.eyebrow { font:400 .76rem/1.6 var(--font-mono); letter-spacing:.14em; color:var(--accent); margin-bottom:1rem; }
.name-period { color:var(--ember); }
.text-link { font-weight:600; text-decoration:none; border-bottom:1px solid var(--card-border); padding:8px 0; }
.text-link span { margin-left:.7rem; color:var(--ember); }
.skip-link { position:fixed; top:-100px; left:1rem; z-index:1001; background:var(--yellow); color:var(--dark-primary); padding:.7rem 1rem; }
.skip-link:focus { top:1rem; }
/* A assinatura funciona como carimbo do caderno, sem competir com a navegação. */
header { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:19px max(32px,calc((100vw - 1184px) / 2)); position:sticky; top:0; z-index:100; background:var(--header-bg); border-bottom:1px solid var(--card-border); }
.site-signature { display:flex; gap:14px; align-items:center; text-decoration:none; color:var(--text-primary); flex-shrink:0; }
.site-signature > span:last-child { font:700 .7rem/1.25 var(--font-body); letter-spacing:.12em; }
.signature-symbol { font:700 2.25rem/1 var(--font-display); letter-spacing:-.08em; position:relative; padding-right:17px; }
.signature-symbol span { color:var(--ember); position:absolute; top:-8px; right:0; font-size:1rem; }
nav { display:flex; gap:25px; align-items:center; }
nav a { text-decoration:none; color:var(--text-secondary); font-size:.83rem; padding:.5rem 0; border-bottom:1px solid transparent; white-space:nowrap; }
nav a:hover,nav a[aria-current] { color:var(--text-primary); border-color:var(--ember); }
.nav-index { color:var(--muted); font:400 .65rem var(--font-mono); margin-right:6px; }
nav a[aria-current] .nav-index { color:var(--ember); }
.mobile-menu { display:none; }
/* Abertura editorial: nome, trajetória e retrato em planos diferentes. */
.home-hero { display:grid; grid-template-columns:1.15fr 1fr; gap:5rem; align-items:center; padding:1.2rem 0 3.8rem; }
.home-hero h1 { font-size:clamp(4rem,7.8vw,7.2rem); line-height:.85; letter-spacing:-.045em; margin:1.6rem 0 1.9rem; }
.home-hero h1 > span { color:var(--text-primary); }
.hero-statement { font-family:var(--font-display); font-weight:500; font-size:clamp(1.75rem,3vw,2.5rem); line-height:1.13; margin-bottom:1.25rem; }
.hero-statement em { color:var(--accent); font-style:normal; }
.hero-intro { max-width:490px; color:var(--text-secondary); font-size:.94rem; line-height:1.9; }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1.5rem; margin-top:1.8rem; font-size:.84rem; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:1.5rem; color:var(--ember-ink); background:var(--ember); border:1px solid var(--ember); border-radius:3px; padding:13px 20px; font-weight:800; text-decoration:none; transition:var(--transition); }
.btn:hover { background:var(--yellow); border-color:var(--yellow); color:var(--ember-ink); }
.btn-outline { background:transparent; color:var(--text-primary); border-color:var(--card-border); }
.status-mark { display:inline-block; width:6px; height:6px; background:var(--ember); margin-right:7px; transform:rotate(45deg); vertical-align:middle; }
.hero-visual { position:relative; padding:35px 32px 30px 15px; min-width:0; }
.portrait-frame { position:relative; transform:rotate(3deg); background:var(--dark-secondary); border:1px solid var(--card-border); padding:10px; box-shadow:15px 18px 0 var(--shade); }
.portrait-frame img { width:100%; aspect-ratio:4/4.45; object-fit:cover; object-position:50% 42%; filter:saturate(.7); }
.portrait-frame figcaption { font:400 .64rem var(--font-mono); letter-spacing:.06em; color:var(--text-secondary); display:flex; justify-content:space-between; padding:13px 3px 3px; }
.portrait-frame figcaption span:last-child { color:var(--ember); }
.portrait-coordinate { position:absolute; top:0; left:2rem; color:var(--violet); font:400 .67rem var(--font-mono); letter-spacing:.15em; }
.portrait-orbit { position:absolute; inset:0 -10px 30px -20px; border:1px solid var(--card-border); border-radius:50%; transform:none; }
.portrait-orbit::after { content:''; position:absolute; inset:20px -10px; border:1px dashed var(--card-border); border-radius:50%; }
.portrait-orbit span { position:absolute; top:60px; right:42px; color:var(--accent); font:400 2rem var(--font-mono); }
.portrait-note { position:relative; margin:-8px -20px 0 45px; padding:13px 18px; color:var(--yellow); background:var(--dark-secondary); border-left:3px solid var(--yellow); box-shadow:0 8px 20px var(--shade); transform:rotate(-4deg); font:400 .8rem/1.6 var(--font-mono); }
.portrait-note > span { float:left; margin-right:14px; font-size:1.6rem; }
.visual-side-note { position:absolute; right:-9px; top:70px; writing-mode:vertical-rl; color:var(--muted); font:400 .6rem var(--font-mono); letter-spacing:.13em; }
.field-notes { display:grid; grid-template-columns:1fr 1fr auto; gap:2rem; border-top:1px solid var(--card-border); border-bottom:1px solid var(--card-border); padding:1.5rem 0; }
.note-index { font:400 .66rem var(--font-mono); letter-spacing:.1em; color:var(--yellow); }
.field-notes > div:nth-child(2) .note-index { color:var(--violet); }
.field-notes p { color:var(--text-secondary); font-size:.8rem; margin-top:7px; }
.field-notes strong { color:var(--text-primary); font-weight:600; }
.field-note-link { display:flex; gap:1rem; align-items:center; text-decoration:none; font-size:.8rem; }
.home-selection { margin-top:4.5rem; }
.section-heading { display:flex; justify-content:space-between; gap:1.5rem; align-items:end; margin-bottom:1.8rem; }
.section-heading h2 { margin:0; }
.section-heading > .text-link { font-size:.83rem; }
.selection-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.3rem; }
.selected-project { display:block; min-width:0; text-decoration:none; background:var(--surface); border:1px solid var(--card-border); border-radius:4px; overflow:hidden; transition:var(--transition); color:var(--text-primary); }
.selected-project:hover { border-color:var(--case-accent); color:var(--text-primary); }
.selected-copy { padding:1.4rem; }
.selected-copy h3 { display:flex; justify-content:space-between; gap:1rem; font-size:1.65rem; margin:.7rem 0; }
.selected-copy h3 > span { color:var(--case-accent); font-family:var(--font-mono); font-size:1.25rem; }
.selected-copy > p:last-child { font-size:.8rem; color:var(--text-secondary); }
/* Esquemas autorais ilustram cada domínio; não simulam telas ou resultados. */
[data-tone] { --case-accent:var(--accent); --case-wash:var(--cyan-wash); }
[data-tone="violet"] { --case-accent:var(--violet); --case-wash:var(--violet-wash); }
[data-tone="ember"] { --case-accent:var(--ember); --case-wash:var(--ember-wash); }
.project-art { position:relative; color:var(--case-accent); background-color:var(--case-wash); background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px); background-size:20px 20px; border-bottom:1px solid var(--card-border); padding:15px 18px 5px; }
.project-art svg { width:100%; height:auto; display:block; max-height:180px; }
.project-art svg text { fill:currentColor; font:10px var(--font-mono); letter-spacing:1px; }
.art-caption { display:block; color:var(--text-secondary); font:400 .6rem var(--font-mono); letter-spacing:.12em; }
.art-cross { position:absolute; right:12px; top:8px; font-family:var(--font-mono); }
/* Projetos: duas colunas dão espaço para ler o caso completo. */
.projects-intro { color:var(--text-primary); margin-bottom:.7rem; font-size:1.05rem; }
.projects-context { color:var(--text-secondary); max-width:760px; margin-bottom:2rem; }
.projects-filter { display:grid; grid-template-columns:1fr auto; gap:1rem; padding:1.25rem; border:1px solid var(--card-border); background:var(--surface); }
#proj-search { grid-column:1 / -1; width:100%; min-width:0; background:var(--dark-primary); color:var(--text-primary); border:1px solid var(--card-border); border-radius:2px; padding:.8rem 1rem; }
#proj-search::placeholder { color:var(--muted); }
#proj-search:focus { outline:2px solid var(--accent); outline-offset:2px; }
.filter-tags { display:flex; flex-wrap:wrap; gap:.5rem; }
.filter-btn { color:var(--text-secondary); background:transparent; border:1px solid var(--card-border); border-radius:2px; padding:.4rem .7rem; font:400 .8rem var(--font-mono); transition:var(--transition); }
.filter-btn:hover { border-color:var(--accent); color:var(--text-primary); }
.filter-btn.active { color:var(--ember-ink); background:var(--yellow); border-color:var(--yellow); }
.filter-mode { display:flex; align-items:center; gap:.5rem; justify-self:end; color:var(--text-secondary); font-size:.75rem; }
input[type="checkbox"] { accent-color:var(--ember); }
#proj-status { font:400 .7rem var(--font-mono); color:var(--muted); }
.projects-container { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; margin-top:2rem; }
.project-card { min-width:0; scroll-margin-top:110px; perspective:1200px; }
.card-3d-wrapper { height:100%; border:1px solid var(--card-border); background:var(--surface); border-radius:4px; overflow:hidden; transition:transform .3s ease,border-color .2s ease; }
.card-3d-wrapper:hover { border-color:var(--case-accent); }
.card-content { padding:1.6rem; }
.project-kind { color:var(--case-accent,var(--accent)); font:400 .68rem/1.6 var(--font-mono); }
.project-header { display:flex; gap:1rem; align-items:baseline; margin:.8rem 0 1rem; }
.project-number { color:var(--case-accent); font:400 .85rem var(--font-mono); }
.project-title { font-size:1.9rem; overflow-wrap:anywhere; }
.project-description { color:var(--text-secondary); font-size:.88rem; }
.project-tech-tags { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:1.2rem; }
.tech-tag { font:400 .66rem var(--font-mono); color:var(--text-secondary); border:1px solid var(--card-border); padding:.25rem .5rem; }
.project-case { margin-top:1.3rem; border-top:1px solid var(--card-border); padding-top:1rem; color:var(--text-secondary); font-size:.82rem; }
.project-case summary { color:var(--case-accent); cursor:pointer; padding:.2rem 0; }
.project-case dt { color:var(--text-primary); font-weight:700; margin-top:.8rem; }
.project-case dd { margin-top:.3rem; }
.project-source { display:inline-block; color:var(--case-accent); margin-top:1rem; font-size:.8rem; }
.project-card:target .card-3d-wrapper { border-color:var(--yellow); }
.projects-empty { color:var(--text-secondary); margin:2rem 0; }
/* Habilidades: índice de oficina, com a primeira área aberta. */
.skills-intro { max-width:780px; color:var(--text-secondary); margin-bottom:2.5rem; }
.skills-accordion { margin-top:1rem; }
.accordion-item { border:1px solid var(--card-border); border-radius:3px; margin-bottom:1rem; background:var(--surface); }
.skill-section-heading { margin:0; }
.accordion-header { display:flex; width:100%; padding:1.3rem 1.5rem; background:none; border:0; align-items:center; justify-content:space-between; gap:1rem; text-align:left; }
.accordion-header:hover { background:var(--cyan-wash); }
.accordion-header-content { display:flex; align-items:center; gap:1.2rem; min-width:0; }
.skill-index { color:var(--muted); font:400 .75rem var(--font-mono); }
.accordion-header-content img { width:36px; height:36px; object-fit:contain; flex-shrink:0; }
.skill-section-title { font:700 1.6rem/1.15 var(--font-display); color:var(--text-primary); }
.accordion-icon { color:var(--accent); font-size:.7rem; transition:transform .2s; }
.accordion-item.open { border-left:3px solid var(--accent); }
.accordion-item.open .accordion-icon { transform:rotate(180deg); }
.accordion-item:last-child.open { border-left-color:var(--violet); }
.skill-context { color:var(--text-secondary); padding:0 1.5rem 1.5rem; font-size:.87rem; }
.skills-subgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:1px; margin:0 1.5rem 1.5rem; background:var(--card-border); border:1px solid var(--card-border); }
.skill-item { display:flex; background:var(--dark-primary); padding:1.25rem; align-items:start; gap:1rem; }
.skill-item h4 { margin-bottom:.6rem; color:var(--yellow); }
.skill-item p { color:var(--text-secondary); font-size:.83rem; }
.skill-case-link { display:inline-block; margin-top:1rem; font-size:.8rem; }
.other-skills { margin-top:3rem; border-top:1px solid var(--card-border); padding-top:2rem; }
.other-skills h2 { font-size:2rem; }
.other-skills p { color:var(--text-secondary); max-width:850px; }
/* Biografia e linha do tempo mantêm a leitura longa em superfícies calmas. */
.about-wrapper { display:grid; grid-template-columns:1.5fr 1fr; gap:4rem; align-items:start; }
.about-text { color:var(--text-secondary); font-size:.94rem; }
.about-text > p:first-child { font-size:1.15rem; color:var(--text-primary); }
.about-img { position:sticky; top:120px; padding:12px; border:1px solid var(--card-border); background:var(--surface); transform:rotate(2deg); }
.about-img img { width:100%; filter:saturate(.7); }
.timeline-container { max-width:1000px; margin-top:3rem; }
.timeline { border-left:1px solid var(--card-border); margin-left:9px; }
.timeline-item { position:relative; padding-left:2rem; margin-bottom:2.5rem; display:grid; grid-template-columns:145px 1fr; gap:1.5rem; }
.timeline-item::before { content:''; position:absolute; left:-5px; top:10px; width:9px; height:9px; background:var(--violet); transform:rotate(45deg); }
.timeline-item:first-child::before { background:var(--ember); }
.timeline-date { color:var(--yellow); font:400 .85rem/1.6 var(--font-mono); padding-top:3px; }
.timeline-content { padding:1.5rem 1.7rem; border:1px solid var(--card-border); background:var(--surface); border-radius:3px; }
.timeline-item:first-child .timeline-content { border-top:2px solid var(--ember); }
.timeline-content h3 { font-size:2rem; margin-bottom:.5rem; }
.company { color:var(--accent); margin-bottom:1rem; font-size:.88rem; }
.employment-context { font-size:.82rem; color:var(--text-secondary); border-left:2px solid var(--violet); padding-left:1rem; margin-bottom:1.3rem; }
.experience-list { list-style:none; color:var(--text-secondary); font-size:.85rem; }
.experience-list li { padding-left:1rem; position:relative; margin-top:.7rem; }
.experience-list li::before { content:'↳'; color:var(--ember); position:absolute; left:0; }
/* A fogueira original é o ponto de encontro entre a paleta e a referência pessoal. */
footer { margin-top:5rem; border-top:1px solid var(--card-border); background:var(--header-bg); padding:1.5rem 0; }
.footer-content { max-width:1280px; padding:0 48px; margin:auto; display:grid; grid-template-columns:auto 1fr auto; gap:2rem; align-items:center; }
.footer-left { display:flex; align-items:center; }
.bonfire-button { background:none; border:0; padding:0; }
.footer-bonfire { width:70px; height:70px; object-fit:contain; transition:filter .2s ease; }
.footer-bonfire:hover { filter:drop-shadow(0 0 12px var(--ember)); }
.footer-signoff { color:var(--text-secondary); font:400 .75rem/1.7 var(--font-mono); }
.footer-signoff span { color:var(--ember); padding:0 .5rem; }
.social-links { display:flex; gap:1.3rem; font-size:1.2rem; }
.social-links a { color:var(--text-secondary); }
.social-links a:hover { color:var(--ember); }
.bonfire-lit-overlay { position:fixed; inset:0; z-index:9999; background:var(--shade); display:flex; justify-content:center; align-items:center; opacity:0; pointer-events:none; transition:opacity .5s; }
.bonfire-lit-overlay.active { opacity:1; }
.bonfire-lit-content { position:relative; width:100%; height:300px; }
.flame-icon { position:absolute; top:50%; left:50%; width:250px; height:250px; transform:translate(-50%,-50%); opacity:0; }
.text-and-bar-wrapper { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; display:grid; place-items:center; }
.black-bar { grid-area:1 / 1; width:100%; height:110px; background:var(--dark-primary); opacity:.9; }
.text-and-bar-wrapper h1 { position:relative; grid-area:1 / 1; font:400 clamp(1.8rem,6vw,4.5rem)/1.2 'Optimized Garamond',serif; color:var(--yellow); letter-spacing:.08em; text-transform:uppercase; opacity:0; text-align:center; }
.text-and-bar-wrapper h1::before { content:'FOGUEIRA ACESA'; position:absolute; inset:0; color:var(--yellow); opacity:0; }
.bonfire-lit-overlay.active .flame-icon,.bonfire-lit-overlay.active .text-and-bar-wrapper h1 { animation:simpleFadeIn 1s .4s forwards; }
.bonfire-lit-overlay.active .text-and-bar-wrapper h1::before { animation:ghostExpand 3.5s .8s forwards; }
@keyframes simpleFadeIn { from{opacity:0} to{opacity:1} }
@keyframes ghostExpand { 0%{opacity:.8} 100%{transform:scale(1.3);opacity:0;filter:blur(15px)} }
.animate-fade { opacity:1; transform:none; }
@keyframes portfolio-arrive { from{opacity:.3;transform:translateY(10px)} to{opacity:1;transform:none} }
@media (prefers-reduced-motion:no-preference) { .animate-fade.in-view { animation:portfolio-arrive .5s ease; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } .card-3d-wrapper { transform:none !important; } .bonfire-lit-overlay.active .flame-icon,.bonfire-lit-overlay.active h1 { opacity:1; } }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:1050px) {
  header { padding:17px 28px; } nav { gap:18px; } .nav-index { display:none; }
  main { padding:0 32px; } .home-hero { gap:2rem; } .hero-visual { padding-right:20px; }
  .hero-actions { gap:1rem; } .hero-actions .text-link { font-size:.75rem; }
  .field-notes { grid-template-columns:1fr 1fr; } .field-note-link { grid-column:1 / -1; }
  .about-wrapper { gap:2rem; } .selection-grid { gap:1rem; } .selected-copy { padding:1rem; }
}
@media (max-width:768px) {
  html { scroll-padding-top:90px; }
  header { min-height:76px; padding:15px 22px; }
  .site-signature > span:last-child { font-size:.6rem; } .signature-symbol { font-size:2rem; }
  main { padding:0 22px; margin:2rem auto; }
  .mobile-menu { display:block; z-index:102; margin-left:auto; }
  #menu-toggle { display:block; padding:6px; background:none; border:0; }
  .bar1,.bar2,.bar3 { width:25px; height:2px; background:var(--text-primary); margin:5px 0; transition:transform .2s,opacity .2s; }
  #menu-toggle.change .bar1 { transform:translateY(7px) rotate(45deg); }
  #menu-toggle.change .bar2 { opacity:0; }
  #menu-toggle.change .bar3 { transform:translateY(-7px) rotate(-45deg); }
  nav { position:fixed; top:76px; left:0; width:100%; height:calc(100dvh - 76px); padding:2rem; flex-direction:column; align-items:stretch; justify-content:start; gap:1rem; background:var(--dark-primary); visibility:hidden; transform:translateX(-100%); transition:transform .2s,visibility .2s; overflow-y:auto; }
  nav.active { visibility:visible; transform:translateX(0); }
  nav a { font:700 2rem var(--font-display); padding:1rem 0; border-bottom:1px solid var(--card-border); }
  .nav-index { display:inline; font-size:.8rem; margin-right:1.5rem; }
  .home-hero { grid-template-columns:1fr; gap:2.5rem; padding:0 0 2rem; }
  .home-hero h1 { font-size:clamp(4rem,17vw,7rem); }
  .hero-statement { font-size:2rem; }
  .hero-visual { width:min(100%,400px); margin:auto; padding:30px 24px 25px 12px; }
  .portrait-orbit { inset:0 0 30px 0; }
  .visual-side-note { right:0; }
  .portrait-note { margin-left:20px; margin-right:-8px; font-size:.72rem; }
  .field-notes { grid-template-columns:1fr; gap:1.2rem; padding:1.5rem 0; }
  .field-note-link { grid-column:auto; }
  .home-selection { margin-top:3rem; }
  .section-heading { align-items:start; flex-direction:column; gap:1rem; }
  .selection-grid,.projects-container { grid-template-columns:minmax(0,1fr); }
  .selected-copy { padding:1.3rem; }
  .project-art svg { max-height:170px; }
  .projects-filter { grid-template-columns:minmax(0,1fr); padding:1rem; }
  .filter-mode { justify-self:start; } .card-content { padding:1.3rem; }
  .card-3d-wrapper { transform:none !important; }
  .about-wrapper { grid-template-columns:1fr; }
  .about-img { position:static; max-width:400px; margin:0 auto; }
  .skills-subgrid { grid-template-columns:minmax(0,1fr); margin:0 1rem 1rem; }
  .accordion-header { padding:1.1rem 1rem; } .accordion-header-content { gap:.7rem; }
  .accordion-header-content img { width:28px; height:28px; }
  .skill-section-title { font-size:1.3rem; } .skill-context { padding:0 1rem 1rem; }
  .timeline-item { grid-template-columns:1fr; gap:.7rem; padding-left:1.5rem; }
  .timeline-content { padding:1.2rem; } .timeline-content h3 { font-size:1.6rem; }
  .footer-content { padding:0 22px; grid-template-columns:auto 1fr; gap:1rem; }
  .footer-center { grid-column:2; } .footer-right { grid-column:2; } .footer-left { grid-row:1 / 3; }
  .footer-signoff { font-size:.67rem; } .social-links { gap:1.5rem; }
}
@media (max-width:360px) { main { padding:0 16px; } .hero-actions { align-items:start; flex-direction:column; } .eyebrow { font-size:.65rem; } .skill-index { display:none; } }