@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Oswald:wght@500;600;700&display=swap');

:root { --ink:#080806; --paper:#f2efe8; --muted:#a4a099; --gold:#d7a82f; --line:#2a2925; --max:1320px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:"DM Sans",sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }
.skip-link { position:fixed; z-index:100; left:1rem; top:1rem; padding:.75rem 1rem; background:var(--paper); color:var(--ink); transform:translateY(-200%); }
.skip-link:focus { transform:none; }
.site-header { width:min(100% - 3rem,var(--max)); margin:auto; min-height:92px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; align-items:center; gap:.75rem; width:max-content; text-decoration:none; font-family:"Oswald",sans-serif; text-transform:uppercase; letter-spacing:.15em; font-weight:600; }
.brand-mark { width:44px; aspect-ratio:1; display:grid; place-items:center; color:var(--ink); background:var(--gold); border-radius:50%; letter-spacing:0; }
nav { display:flex; gap:2.2rem; }
nav a { color:var(--muted); text-decoration:none; font-size:.82rem; letter-spacing:.13em; text-transform:uppercase; }
nav a:hover { color:var(--paper); }
.button { min-height:48px; display:inline-flex; align-items:center; justify-content:center; gap:1rem; padding:.75rem 1.3rem; border:1px solid transparent; text-decoration:none; text-transform:uppercase; letter-spacing:.1em; font-weight:600; font-size:.78rem; }
.button--gold { background:var(--gold); color:var(--ink); }
.button--gold:hover { background:#edc24e; }
.button--ghost { border-color:#57534b; }
.button--ghost:hover { border-color:var(--paper); }
.header-cta { justify-self:end; }
.menu-button,.mobile-menu { display:none; }
.hero { width:min(100% - 3rem,var(--max)); min-height:690px; margin:auto; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(300px,.7fr); align-items:center; gap:7vw; position:relative; overflow:hidden; }
.hero::before { content:""; position:absolute; width:55vw; height:55vw; min-width:620px; min-height:620px; right:-25vw; top:-10vw; border:1px solid rgba(215,168,47,.16); border-radius:50%; box-shadow:0 0 100px rgba(215,168,47,.08) inset; pointer-events:none; }
.eyebrow { color:var(--gold); text-transform:uppercase; letter-spacing:.2em; font-size:.76rem; font-weight:600; }
h1,h2,h3 { font-family:"Oswald",sans-serif; line-height:1; margin-top:0; text-transform:uppercase; }
h1 { font-size:clamp(4.5rem,9.8vw,9rem); letter-spacing:-.045em; margin:.65rem 0 1.5rem; max-width:900px; }
h1 em { color:var(--gold); font-style:normal; }
.hero-lede { color:#c1bdb5; font-size:1.12rem; max-width:620px; }
.hero-actions { display:flex; gap:.9rem; margin-top:2.2rem; flex-wrap:wrap; }
.hero-panel { border-left:1px solid rgba(215,168,47,.42); padding:1rem 0 1rem 2.5rem; position:relative; z-index:1; }
.hero-panel>p { color:var(--muted); text-transform:uppercase; letter-spacing:.15em; font-size:.8rem; margin:0 0 3rem; }
.hero-panel ol { list-style:none; padding:0; margin:0; }
.hero-panel li { border-top:1px solid var(--line); padding:1.2rem 0; text-transform:uppercase; font-family:"Oswald",sans-serif; font-size:1.15rem; }
.hero-panel li span { color:var(--gold); font:500 .75rem "DM Sans",sans-serif; margin-right:1rem; }
.section { width:min(100% - 3rem,var(--max)); margin:auto; padding:8rem 0; border-top:1px solid var(--line); }
.section-heading { display:grid; grid-template-columns:.45fr 1fr; gap:2rem; align-items:start; margin-bottom:4rem; }
.section-heading .eyebrow { margin-top:.7rem; }
h2 { font-size:clamp(2.8rem,5.6vw,5.5rem); letter-spacing:-.025em; margin:0; max-width:900px; }
.service-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.service-grid article { padding:2.5rem 2.2rem 2.5rem 0; border-right:1px solid var(--line); }
.service-grid article+article { padding-left:2.2rem; }
.service-grid article:last-child { border-right:0; }
.service-grid article>span { color:var(--gold); font-size:.75rem; }
.service-grid h3 { font-size:1.85rem; margin:2.4rem 0 1rem; }
.service-grid p { color:var(--muted); min-height:7.8rem; }
.service-grid a { display:inline-flex; gap:.6rem; text-underline-offset:.3rem; font-weight:600; }
.portfolio-preview { padding-bottom:10rem; }
.pending-card { margin-left:calc(45% + 1rem); padding:3rem; border:1px solid #403d35; background:linear-gradient(135deg,rgba(215,168,47,.08),transparent 55%); }
.status { color:var(--gold); text-transform:uppercase; letter-spacing:.16em; font-size:.72rem; }
.pending-card h3 { font-size:clamp(2rem,3.5vw,3.6rem); margin:1.5rem 0; max-width:750px; }
.pending-card p { color:var(--muted); max-width:660px; }
.portfolio-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
.project-card { display:grid; grid-template-columns:.85fr 1fr; border:1px solid var(--line); }
.project-card img,.project-cover { width:100%; height:100%; min-height:320px; object-fit:cover; background:#171612; display:grid; place-items:center; color:var(--gold); font:600 5rem "Oswald",sans-serif; }
.project-meta { padding:2rem; }
.project-meta>p { color:var(--muted); }
.project-meta h3 { font-size:2rem; margin:1.5rem 0 .5rem; }
.project-meta ul { display:flex; flex-wrap:wrap; gap:.5rem; list-style:none; padding:0; }
.project-meta li { border:1px solid var(--line); padding:.35rem .65rem; font-size:.75rem; text-transform:uppercase; }
.project-card audio { width:100%; margin-top:1rem; }
.project-link { display:inline-block; margin-top:1rem; text-underline-offset:.3rem; }
.course-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:8vw; }
.course-intro { max-width:560px; }
.large-copy { font-size:clamp(1.5rem,2.7vw,2.3rem); line-height:1.25; color:var(--paper); }
.course-intro>p:not(.large-copy) { color:var(--muted); margin-bottom:2rem; }
.course-topics { border-top:1px solid var(--line); }
.course-topics article { display:grid; grid-template-columns:50px 1fr; gap:1rem; padding:1.8rem 0; border-bottom:1px solid var(--line); }
.course-topics article>span { color:var(--gold); font-size:.75rem; }
.course-topics h3 { font-size:1.6rem; margin:0 0 .65rem; }
.course-topics p { color:var(--muted); margin:0; }
.contact { background:var(--gold); color:var(--ink); }
.contact-inner { width:min(100% - 3rem,var(--max)); margin:auto; padding:8rem 0; display:grid; grid-template-columns:1fr .85fr; gap:8vw; }
.contact .eyebrow { color:#624a0e; }
.contact h2 { max-width:700px; }
.contact-copy { font-size:1.08rem; max-width:610px; }
form { display:grid; grid-template-columns:1fr; align-content:start; }
label { font-weight:600; margin:.8rem 0 .35rem; }
input,select,textarea { width:100%; border:1px solid rgba(8,8,6,.45); border-radius:0; background:rgba(255,255,255,.15); color:var(--ink); font:inherit; padding:.9rem 1rem; }
input,select { min-height:50px; }
textarea { resize:vertical; }
input::placeholder,textarea::placeholder { color:#5a4616; }
form .button { margin-top:1.3rem; background:var(--ink); color:var(--paper); border:0; cursor:pointer; }
form .button:hover { background:#262319; }
.form-status { min-height:1.5rem; font-weight:600; }
footer { width:min(100% - 3rem,var(--max)); margin:auto; padding:3rem 0; display:grid; grid-template-columns:1fr auto; gap:1.5rem 3rem; align-items:center; }
footer>p { color:var(--muted); margin:0; }
footer nav { justify-self:end; }
.copyright { grid-column:1/-1; padding-top:1.5rem; border-top:1px solid var(--line); font-size:.85rem; }
@media (max-width:900px) {
  .site-header { grid-template-columns:1fr auto; width:min(100% - 2rem,var(--max)); }
  nav,.header-cta { display:none; }
  .menu-button { display:grid; gap:7px; width:48px; height:48px; place-content:center; background:none; border:1px solid var(--line); }
  .menu-button span { display:block; width:20px; height:1px; background:var(--paper); }
  .mobile-menu { position:fixed; z-index:50; inset:92px 0 auto; padding:1.5rem; background:#11110e; border-bottom:1px solid var(--line); }
  .mobile-menu:not([hidden]) { display:grid; }
  .mobile-menu a { padding:1rem 0; text-decoration:none; text-transform:uppercase; border-bottom:1px solid var(--line); }
  .hero { width:min(100% - 2rem,var(--max)); min-height:auto; grid-template-columns:1fr; gap:4rem; padding:6rem 0; }
  h1 { font-size:clamp(4rem,18vw,6.5rem); }
  .hero-panel { padding-left:1.5rem; }
  .section { width:min(100% - 2rem,var(--max)); padding:6rem 0; }
  .section-heading { grid-template-columns:1fr; gap:.5rem; }
  .service-grid { grid-template-columns:1fr; }
  .service-grid article,.service-grid article+article { padding:2.5rem 0; border-right:0; border-bottom:1px solid var(--line); }
  .service-grid p { min-height:0; }
  .pending-card { margin-left:0; padding:2rem; }
  .portfolio-grid,.project-card,.course-layout,.contact-inner { grid-template-columns:1fr; }
  .contact-inner { width:min(100% - 2rem,var(--max)); padding:6rem 0; }
  footer { width:min(100% - 2rem,var(--max)); grid-template-columns:1fr; }
  footer nav { justify-self:start; flex-wrap:wrap; gap:1rem; }
}
.editor-preview [data-content] { cursor:pointer; outline:1px dashed rgba(215,168,47,.5); outline-offset:4px; transition:outline-color 160ms ease,background 160ms ease; }
.editor-preview [data-content]:hover { background:rgba(215,168,47,.12); outline:2px solid #d7a82f; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }