:root { --bg:#080b10; --surface:#10151d; --text:#f0f3f8; --muted:#aab5c5; --line:#303947; --red:#ff493b; --red-hover:#ff7167; --gold:#bdc7d5; --ease-out:cubic-bezier(.23,1,.32,1); --ease-in-out:cubic-bezier(.77,0,.175,1); }
body { background:var(--bg); }
body::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none; background:radial-gradient(ellipse at 80% 15%,#18283d55,transparent 50%),linear-gradient(90deg,transparent 49.9%,#ffffff04 50%,transparent 50.1%); }
header { position:sticky; top:0; background:#080b10dd; backdrop-filter:blur(18px); border-color:#ffffff16; }
.reading-progress { position:fixed; inset:0 0 auto; height:2px; background:var(--red); transform:scaleX(0); transform-origin:left; z-index:30; pointer-events:none; }
.ambient-light { position:fixed; top:0; left:0; width:650px; height:650px; background:radial-gradient(circle,#37527719,transparent 68%); z-index:-1; pointer-events:none; opacity:0; }
nav a { position:relative; font-size:.78rem; min-height:44px; display:flex; align-items:center; }
nav a::after { content:""; position:absolute; bottom:4px; left:0; right:0; height:1px; background:var(--red); transform:scaleX(0); transform-origin:left; transition:transform 200ms var(--ease-out); }
nav a[aria-current="location"] { color:var(--text); }
nav a[aria-current="location"]::after { transform:scaleX(1); }
.hero { min-height:850px; padding-bottom:6rem; perspective:1400px; }
.hero-topline,.section-label,.hero-copy strong,.profile-details dt,.contact-item span { font-size:.78rem; }
.hero h1 { margin-top:8rem; text-shadow:0 6px 45px #0008; }
.hero h1 .second { color:#ecf1f8; background:linear-gradient(120deg,#fff 15%,#a8b9ce 42%,#fff 61%,#afbdd0 89%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hero h1 .period { -webkit-text-fill-color:var(--red); }
.hero-media { top:14%; right:0; width:43%; height:70%; background:none; border:0; perspective:1100px; }
.hero-media::after { display:none; }
.scene-tilt { position:absolute; inset:0; transform-style:preserve-3d; transform:rotateY(-11deg) rotateX(5deg); }
.scene-art { position:absolute; inset:4% 4% 6% 4%; background:linear-gradient(135deg,#08101a00,#03050844),url("assets/editorial-glass.webp") center/cover; border:1px solid #a8bad35c; box-shadow:0 40px 90px #0009,inset 0 0 50px #0006; transform:translateZ(0); }
.scene-backplate { position:absolute; inset:0; border:1px solid #536c8c60; background:linear-gradient(145deg,#18283a70,#080b10); transform:translateZ(-55px) translateX(20px) rotate(5deg); }
.scene-outline { position:absolute; inset:12% -4% 1% 13%; border:1px solid #dbe7ff50; transform:translateZ(50px); pointer-events:none; }
.scene-glare { position:absolute; inset:4% 4% 6% 4%; background:linear-gradient(115deg,transparent 15%,#d7e9ff30 44%,transparent 65%); transform:translateZ(2px); opacity:.65; pointer-events:none; }
.scene-monogram { position:absolute; top:12%; right:11%; font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(4rem,7vw,7rem); line-height:.8; letter-spacing:-.09em; transform:translateZ(80px); color:#f4f6fb; text-shadow:0 6px 30px #000b; }
.scene-monogram span { display:block; margin-top:1rem; font-family:"DM Sans",sans-serif; font-size:.75rem; letter-spacing:.25em; }
.scene-tag { position:absolute; bottom:12%; left:-6%; display:grid; gap:.35rem; padding:1.2rem 1.5rem; background:#090e17e8; border:1px solid #6c819c8c; box-shadow:0 20px 40px #0008; transform:translateZ(95px); font-size:.75rem; letter-spacing:.15em; }
.scene-tag b { color:var(--red); margin-top:.8rem; font-weight:500; }
.hero-media-label { right:7%; bottom:12%; transform:translateZ(18px); font-size:.75rem; }
.hero-lower { margin-top:5rem; }
.hero-copy { max-width:480px; text-shadow:0 3px 20px #000; }
.button { position:relative; overflow:hidden; font-size:.875rem; background:#f1f4f9; color:#080b10; border:1px solid #fff8; box-shadow:0 0 0 5px #ffffff06; transition:background 180ms ease,color 180ms ease,transform 160ms var(--ease-out); }
.button::before { content:""; position:absolute; inset:-60% -20%; background:linear-gradient(110deg,transparent 35%,#ff493b66 50%,transparent 65%); transform:translateX(-110%); transition:transform 500ms var(--ease-out); pointer-events:none; }
.button:hover { background:#fff; transform:none; }
.button:active { transform:scale(.97); }
.discipline-band { display:flex; justify-content:space-evenly; gap:2rem; padding:1.4rem 2rem; border-bottom:1px solid var(--line); color:#8e9bae; font-size:.75rem; letter-spacing:.2em; }
.discipline-band i { color:var(--red); font-style:normal; }
.section { position:relative; scroll-margin-top:100px; }
.section-title { overflow-wrap:normal; }
.section-title em { color:#e4ecf7; }
.profile-details div { border-top-color:#65748a; }
.profile-details dt { color:#b8c5d7; }
.approach { background:linear-gradient(145deg,#0d131d,#080b10 70%); }
.approach-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:3.5rem; perspective:1000px; }
.approach-card { position:relative; padding:1.8rem 1.4rem 2.5rem; background:linear-gradient(140deg,#1a2534aa,#0c121c); border:1px solid #5c6f8944; transform-style:preserve-3d; transition:transform 200ms var(--ease-out); }
.card-number { display:block; font-family:"Cormorant Garamond",Georgia,serif; color:#8295af; font-size:3rem; line-height:1; }
.approach-card h3 { margin:2rem 0 .75rem; font-size:1.05rem; font-weight:500; }
.approach-card p { margin:0; color:var(--muted); font-size:1rem; line-height:1.65; }
.card-rule { position:absolute; bottom:1.3rem; left:1.4rem; width:30px; height:2px; background:var(--red); transform-origin:left; transition:transform 200ms var(--ease-out); }
.projects { background:radial-gradient(ellipse at 90% 90%,#782d3315,transparent 60%),#0b1017; }
.empty-state { position:relative; padding:2rem; border:1px solid #56657b77; background:linear-gradient(125deg,#15203399,#0b1017); }
.empty-state::before { content:""; position:absolute; top:-1px; left:0; width:25%; height:1px; background:linear-gradient(90deg,transparent,#bdcbe0,transparent); }
.empty-state .mark { color:#bdc7d5; }
.contact { background:radial-gradient(ellipse at 10% 100%,#ff493b12,transparent 55%),#080c12; }
.contact-list { gap:1rem; }
.contact-item { padding:1.5rem 1rem; border:1px solid #52658166; background:#141d293b; transition:background 200ms ease; }
.contact-item span { color:#aab8cb; }
.contact-item a { font-size:1rem; }
footer { align-items:center; font-size:.75rem; }
.motion-toggle { background:transparent; border:1px solid #53647c; color:#d2dbe8; padding:.75rem 1rem; font:inherit; min-height:44px; cursor:pointer; }
.motion-toggle:focus-visible { outline:2px solid var(--red); outline-offset:4px; }
.back-top { padding:.75rem 0; }
.motion-ready .reveal { opacity:0; transform:translateY(24px); transition:opacity 600ms var(--ease-out),transform 600ms var(--ease-out); }
.motion-ready .reveal.is-visible { opacity:1; transform:translateY(0); }
.motion-off .reveal { opacity:1; transform:none; }
.motion-off .scene-tilt { transform:none !important; }
.motion-off .ambient-light { opacity:0 !important; }
.motion-off { scroll-behavior:auto; }
.motion-off .button::before { display:none; }
.motion-ready .hero h1 > span { animation:hero-enter 900ms var(--ease-out) both; }
.motion-ready .hero h1 > span:nth-child(2) { animation-delay:60ms; }
@keyframes hero-enter { from { opacity:0; transform:translateY(35px); } to { opacity:1; transform:translateY(0); } }
@media (hover:hover) and (pointer:fine) {
  .button:hover::before { transform:translateX(110%); }
  .approach-card:hover .card-rule { transform:scaleX(2); }
  .contact-item:hover { background:#26364e66; }
  nav a:hover::after { transform:scaleX(1); }
}
@media (max-width:1100px) { .nav-approach { display:none; } .approach-grid { gap:.7rem; } .approach-card { padding:1.5rem 1rem 2.5rem; } }
@media (max-width:900px) {
  .hero { min-height:0; }
  .hero h1 { margin-top:5rem; }
  .hero-media { position:relative; inset:auto; width:90%; height:460px; margin:3.5rem auto 0; }
  .hero-lower { margin-top:3rem; }
  .scene-monogram { font-size:6rem; }
  .discipline-band { flex-wrap:wrap; gap:1rem; }
  .section-title em { font-size:1.1em; }
}
@media (max-width:600px) {
  .nav { flex-wrap:wrap; padding-block:.7rem; gap:.4rem; }
  .brand { width:100%; }
  nav { width:100%; justify-content:space-between; }
  nav a:first-child { display:flex; }
  .section { scroll-margin-top:145px; }
  .hero-media { height:400px; }
  .scene-monogram { font-size:5rem; }
  .scene-tag { left:-3%; padding:1rem; font-size:.75rem; }
  .hero h1 { font-size:clamp(2.7rem,12vw,5rem); }
  .hero-lower { margin-top:2rem; }
  .approach-grid { grid-template-columns:1fr; gap:1rem; }
  .approach-card { padding:1.6rem 1.5rem 2.5rem; }
  .approach-card h3 { margin-top:1rem; }
  .discipline-band { font-size:.75rem; padding-inline:1rem; }
  .discipline-band i { display:none; }
  .section-title { font-size:clamp(2.3rem,10.5vw,4rem); }
  .section-title em { font-size:1.05em; }
  .empty-state { padding:1.5rem 1rem; }
  .empty-state h3 { font-size:1rem; }
  nav a { font-size:.75rem; }
  .brand { font-size:.7rem; gap:.5rem; }
  footer { align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .scene-tilt,.hero-media,.hero h1 { transform:none !important; }
  .reveal { opacity:1 !important; transform:none !important; }
  .button::before { display:none; }
}
.profile-followup { margin-top:1.25rem; }
.services { background:#090d13; }
.service-list { margin-top:3.5rem; border-top:1px solid var(--line); }
.service-row { display:grid; grid-template-columns:2.5rem 1fr 2rem; gap:1.4rem; position:relative; padding:2.3rem 0; border-bottom:1px solid var(--line); }
.service-index { padding-top:.5rem; font-size:.75rem; color:var(--red); letter-spacing:.08em; }
.service-row h3 { margin:0 0 1rem; font-size:clamp(1.45rem,2.5vw,2.2rem); line-height:1.15; font-weight:500; letter-spacing:-.04em; }
.service-row p { max-width:610px; margin:0; color:var(--muted); font-size:1rem; line-height:1.75; }
.service-detail { display:block; margin-top:1.2rem; font-size:.7rem; color:#c5d0df; letter-spacing:.08em; text-transform:uppercase; line-height:1.9; }
.service-arrow { color:var(--red); font-size:1.8rem; transition:transform 200ms var(--ease-out); }
.service-row::before { content:""; position:absolute; inset:0 -1rem; z-index:0; pointer-events:none; background:#b4cfff05; opacity:0; transition:opacity 200ms ease; }
.text-link { display:inline-flex; gap:2rem; align-items:center; padding:1rem 0; margin-top:1.5rem; border-bottom:1px solid var(--red); font-size:.9rem; }
.text-link span { color:var(--red); }
.soft-skills { margin-top:4rem; padding-top:2.5rem; border-top:1px solid var(--line); }
.soft-skills h3 { max-width:600px; font-family:"Cormorant Garamond",Georgia,serif; font-size:clamp(2rem,4vw,3rem); font-weight:500; line-height:1.1; margin:0 0 1.5rem; }
.soft-skills p { max-width:650px; color:var(--muted); font-size:1rem; line-height:1.8; }
.soft-skills ul { display:flex; flex-wrap:wrap; gap:.7rem 1.8rem; padding:0; margin:2rem 0 0; list-style:none; }
.soft-skills li { font-size:.8rem; padding:.5rem 0; border-bottom:1px solid #65748a80; }
.contact-intents { display:flex; flex-wrap:wrap; gap:1rem 2rem; margin-top:2rem; }
.contact-intents a { display:flex; align-items:center; gap:1rem; min-height:48px; border-bottom:1px solid #65748a; font-size:.88rem; }
.contact-intents span { color:var(--red); }
@media (hover:hover) and (pointer:fine) {
  .service-row:hover::before { opacity:1; }
  .service-row:hover .service-arrow { transform:translate(4px,-4px); }
  .text-link:hover,.contact-intents a:hover { color:var(--red-hover); }
}
@media (max-width:600px) {
  nav { gap:.5rem; }
  nav a { font-size:.68rem; letter-spacing:.04em; }
  .service-row { grid-template-columns:1.5rem 1fr; gap:.75rem; padding:2rem 0; }
  .service-arrow { display:none; }
  .service-detail { font-size:.65rem; }
  .soft-skills { margin-top:3rem; }
  .hero-copy strong { line-height:1.7; }
}
@media (prefers-reduced-transparency:reduce) { header { background:#080b10; backdrop-filter:none; } }
