:root{
  --bg:#0d0d0c;
  --surface:#151514;
  --surface-2:#1a1918;
  --surface-3:#211f1d;
  --line:#2b2926;
  --line-strong:#403d38;
  --text:#f1efe9;
  --muted:#aaa69d;
  --muted-2:#7b776f;
  --accent:#7d8fb7;
  --accent-hover:#8d9dc1;
  --bio:#7fa67f;
  --mat:#7e8fb8;
  --fis:#75a0b5;
  --his:#b8a168;
  --fil:#a9809a;
  --font:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --shadow:0 18px 46px rgba(0,0,0,.34);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-behavior:smooth}
body{
  min-height:100vh;color:var(--text);font-family:var(--font);line-height:1.5;-webkit-font-smoothing:antialiased;
  background-color:var(--bg);
  background-image:radial-gradient(circle at 1px 1px,#171614 1px,transparent 1px);
  background-size:6px 6px;
}
a{color:inherit}
.header{position:sticky;top:0;z-index:100;background:#10100f;border-bottom:1px solid var(--line);padding:0 24px}
.header-inner{max-width:1120px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.header-title{display:flex;align-items:center;gap:12px}
.header-title--link{color:inherit;text-decoration:none}
.header-logo{width:40px;height:40px;border-radius:9px;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--line)}
.header-logo img{width:100%;height:100%;object-fit:cover;display:block}
h1{font-size:1rem;font-weight:700;color:var(--text);line-height:1.2;letter-spacing:-.015em}
.header-sub{font-size:.7rem;color:var(--muted);font-weight:500;margin-top:2px}
.btn-action{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:8px 13px;font-size:.78rem;font-weight:650;cursor:pointer;text-decoration:none;transition:.16s ease;white-space:nowrap}
.btn-action:hover{background:var(--surface-2);color:var(--text);border-color:var(--line-strong)}

.about-main{max-width:780px;margin:0 auto;padding:52px 24px 78px}
.about-hero{padding-bottom:38px;margin-bottom:46px;border-bottom:1px solid var(--line)}
.about-eyebrow{display:inline-block;font-size:.67rem;font-weight:750;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:14px}
.about-hero-title{font-size:2.15rem;font-weight:750;line-height:1.12;color:var(--text);margin-bottom:14px;max-width:22ch;letter-spacing:-.035em}
.about-hero-lead{font-size:.96rem;line-height:1.7;color:var(--muted);max-width:60ch}

.about-section{margin-bottom:52px}
.about-section-head{margin-bottom:18px}
.about-tag{display:block;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2);margin-bottom:5px}
.about-section-head h3{font-size:1.22rem;font-weight:700;color:var(--text);letter-spacing:-.02em}

.about-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.about-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:17px 17px 18px;transition:.16s ease}
.about-card:hover{border-color:var(--line-strong);background:var(--surface-2)}
.about-card-icon{--icon-color:var(--accent);display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:8px;color:var(--icon-color);background:var(--surface-3);margin-bottom:11px}
.about-card h4{font-size:.9rem;font-weight:700;color:var(--text);margin-bottom:5px}
.about-card p{font-size:.82rem;line-height:1.58;color:var(--muted)}

.creator-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:21px;display:flex;gap:18px;align-items:flex-start}
.creator-avatar--photo{width:126px;height:158px;flex-shrink:0;border-radius:10px;object-fit:cover;object-position:center 27%;display:block;background:#111;border:1px solid var(--line)}
.creator-text{min-width:0;flex:1}
.creator-text p{font-size:.86rem;line-height:1.68;color:var(--muted)}
.creator-text p+p{margin-top:10px}
.creator-name{font-size:.98rem!important;font-weight:700;color:var(--text)!important;margin-bottom:9px}
.portfolio-link{margin-top:16px;display:flex;align-items:center;gap:11px;width:min(100%,390px);padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2);color:var(--text);text-decoration:none;transition:.16s ease}
.portfolio-link:hover{border-color:var(--line-strong);background:var(--surface-3)}
.portfolio-link-icon{width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;border-radius:8px;color:#111;background:var(--accent)}
.portfolio-link-text{min-width:0;flex:1;display:flex;flex-direction:column;gap:1px}
.portfolio-link-label{font-size:.8rem;font-weight:700}
.portfolio-link-url{color:var(--muted);font-size:.73rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.portfolio-link-arrow{color:var(--muted-2);font-size:1rem}

.contact-card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:21px}
.contact-lead{font-size:.88rem;line-height:1.65;color:var(--muted);margin-bottom:17px;max-width:54ch}
.contact-email{display:flex;align-items:center;gap:13px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);text-decoration:none;border-radius:9px;padding:13px 14px;margin-bottom:21px;transition:.16s}
.contact-email:hover{border-color:var(--line-strong);background:var(--surface-3)}
.contact-email-icon{flex-shrink:0;width:42px;height:42px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#111;background:var(--accent)}
.contact-email-text{display:flex;flex-direction:column;gap:2px}
.contact-email-label{font-size:.9rem;font-weight:700}
.contact-email-value{font-size:.8rem;color:var(--muted)}
.contact-divider{height:1px;background:var(--line);margin:21px 0 18px}
.contact-note-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-2);margin-bottom:11px}
.contact-checklist{display:flex;flex-direction:column;gap:10px;list-style:none}
.contact-checklist li{display:flex;align-items:flex-start;gap:9px;font-size:.82rem;line-height:1.58;color:var(--muted)}
.check-icon{flex-shrink:0;width:18px;height:18px;border-radius:50%;background:#273148;color:#c3cce0;font-size:.66rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px}

.links-grid{display:grid;grid-template-columns:1fr;gap:8px}
.portfolio-card,.instagram-card,.whatsapp-card{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:15px 16px;text-decoration:none;transition:.16s ease}
.portfolio-card:hover,.instagram-card:hover,.whatsapp-card:hover{border-color:var(--line-strong);background:var(--surface-2)}
.portfolio-card-icon,.instagram-icon,.whatsapp-icon{flex-shrink:0;width:42px;height:42px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#111}
.portfolio-card-icon{background:#7d8fb7}
.instagram-icon{background:#a9809a}
.whatsapp-icon{background:#7d9d7c}
.instagram-text{display:flex;flex-direction:column;gap:2px;flex:1}
.instagram-label{font-size:.9rem;font-weight:700;color:var(--text)}
.instagram-handle{font-size:.8rem;color:var(--muted)}
.instagram-arrow{flex-shrink:0;color:var(--muted-2);transition:.16s ease}
.portfolio-card:hover .instagram-arrow,.instagram-card:hover .instagram-arrow,.whatsapp-card:hover .instagram-arrow{color:var(--text);transform:translate(2px,-2px)}

.about-footer{max-width:780px;margin:0 auto;padding:21px 24px 42px;border-top:1px solid var(--line)}
.about-footer p{font-size:.75rem;color:var(--muted-2)}

@media(max-width:720px){
  .about-hero-title{font-size:1.75rem}
  .about-grid{grid-template-columns:1fr}
  .creator-card{flex-direction:column}
  .creator-avatar--photo{width:112px;height:140px}
}
@media(max-width:480px){
  .header{padding:0 14px}
  .about-main{padding:38px 16px 58px}
  .btn-action{font-size:.7rem;padding:8px 10px}
  .creator-card{gap:15px;padding:15px}
  .creator-avatar--photo{width:100%;height:min(440px,120vw);max-height:440px;border-radius:10px;object-position:center 24%}
  .contact-email{align-items:flex-start}
  .contact-email-value{word-break:break-word}
  .portfolio-card,.instagram-card,.whatsapp-card{padding:13px 14px;gap:11px}
  .portfolio-card-icon,.instagram-icon,.whatsapp-icon{width:38px;height:38px}
}