*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#f1eee8;font-family:Arial,Helvetica,sans-serif;background:#050505 url("assets/wallpaper.jpg") center top/760px auto repeat;background-attachment:fixed}body:before{content:"";position:fixed;z-index:-1;inset:0;background:rgba(0,0,0,.60)}a{color:inherit;text-decoration:none}
.nav{position:absolute;z-index:20;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:25px 4%;letter-spacing:.15em}.brand{font-family:Georgia,serif;font-size:20px}.nav nav{display:flex;gap:23px;align-items:center;font-size:9px}.subscribe,.button{border:1px solid #aaa;border-radius:30px;padding:12px 20px}
.hero{height:100svh;min-height:680px;position:relative;overflow:hidden;background:#000}.hero>img{width:100%;height:100%;object-fit:cover;object-position:center 35%;filter:grayscale(1);opacity:.82}.shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.18) 60%,rgba(0,0,0,.5))}.hero-copy{position:absolute;left:5%;top:28%;max-width:440px}.eyebrow{font-size:10px;letter-spacing:.35em;color:#c9c3ba}.hero h1,.about h2,.feature h2,.collab h2,.of h2{font-family:Georgia,serif;font-weight:400}.hero h1{font-size:clamp(58px,8vw,120px);line-height:.84;letter-spacing:.03em;margin:20px 0 30px}.origin{font-size:12px;line-height:2;letter-spacing:.25em;text-transform:uppercase}.scroll{display:inline-block;margin-top:50px;font-size:10px;letter-spacing:.25em}
.pattern{height:360px;background:linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.62)),url("assets/wallpaper.jpg") center/700px auto;display:grid;place-items:center;text-align:center;font-family:Georgia,serif;font-size:31px;letter-spacing:.16em}
.chapter-wrap{padding:150px 5%}.chapter-label{max-width:1320px;margin:0 auto 35px;font-size:9px;letter-spacing:.38em;color:#aaa}.panel{max-width:1320px;margin:auto;background:rgba(3,3,3,.94);box-shadow:0 24px 80px rgba(0,0,0,.42)}
.about{display:grid;grid-template-columns:.9fr 1.1fr;min-height:720px}.about .copy{padding:13% 11%;align-self:center}.about h2{font-size:clamp(38px,4.6vw,68px);line-height:1.02;margin:22px 0 42px}.short-about{color:#bbb;line-height:1.8;font-size:15px;margin:0 0 24px;max-width:430px}.about img{width:100%;height:100%;min-height:720px;object-fit:cover}
.feature{display:block;height:78vh;min-height:620px;position:relative;overflow:hidden}.feature img{width:100%;height:100%;object-fit:cover;filter:brightness(.55);transition:.5s}.feature:hover img{transform:scale(1.015);filter:brightness(.7)}.feature-copy{position:absolute;left:7%;bottom:9%}.feature small,.feature span{letter-spacing:.28em;font-size:9px}.feature h2{font-size:clamp(45px,6vw,82px);margin:12px 0 24px}
.collab-wrap{padding-top:160px;padding-bottom:160px}.collab{padding:100px 8%;background:linear-gradient(90deg,rgba(2,2,2,.98),rgba(2,2,2,.83)),url("assets/wallpaper.jpg") right center/600px auto}.collab h2{font-size:clamp(42px,5vw,72px);line-height:1.02;margin:20px 0 30px}.collab p:not(.eyebrow){color:#aaa;letter-spacing:.08em}.collab .button{display:inline-block;margin-top:28px;font-size:9px;letter-spacing:.2em}
.statement{height:440px;display:grid;place-items:center;text-align:center;background:rgba(0,0,0,.45)}.statement p{font-size:20px;letter-spacing:.35em;line-height:1.9}
.socials{margin:150px 5%;padding:90px 6%;background:rgba(3,3,3,.94);box-shadow:0 24px 80px rgba(0,0,0,.42)}.social-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:40px}.social-grid a{border-top:1px solid #555;padding-top:22px;font-family:Georgia,serif;font-size:18px}.social-grid span{display:block;font-family:Arial,sans-serif;color:#999;font-size:10px;margin-top:12px}
.of{min-height:650px;margin-top:150px;display:flex;align-items:center;padding:8%;background:linear-gradient(90deg,#050505 5%,rgba(5,5,5,.86) 43%,rgba(5,5,5,.18)),url("assets/hero.jpg") 75% 30%/cover no-repeat}.of h2{font-size:58px;margin:15px 0}.of p{color:#aaa;letter-spacing:.15em}.button{display:inline-block;margin-top:25px;font-size:10px;letter-spacing:.2em}
footer{padding:50px 5%;background:#030303;border-top:1px solid #222;display:flex;justify-content:space-between;font-family:Georgia,serif;letter-spacing:.15em}footer small{font-family:Arial,sans-serif;font-size:8px}
@media(max-width:800px){
 body{background-size:480px auto;background-attachment:scroll}.nav{padding:20px 6%}.nav nav a:not(.subscribe){display:none}.brand{font-size:16px}.subscribe{padding:10px 14px}
 .hero-copy{top:auto;bottom:8%;left:7%;right:7%}.hero h1{font-size:58px}.hero>img{object-position:58% center}.shade{background:linear-gradient(0deg,#050505 0%,rgba(0,0,0,.1) 70%)}.origin{font-size:9px}.eyebrow{font-size:9px}.pattern{height:300px;font-size:24px;background-size:480px auto}
 .chapter-wrap{padding:110px 6%}.chapter-label{margin-bottom:24px}.about{grid-template-columns:1fr;min-height:0}.about .copy{padding:70px 8%}.about h2{font-size:40px;margin-bottom:34px}.short-about{font-size:15px;line-height:1.75}.about img{min-height:0;height:58vh}
 .feature{height:72vh;min-height:560px}.feature-copy{left:8%;right:8%;bottom:8%}.feature h2{font-size:44px}.collab{padding:75px 8%;background:rgba(3,3,3,.94)}.collab h2{font-size:39px}
 .statement{height:360px;padding:30px}.statement p{font-size:13px;letter-spacing:.28em}.socials{margin:110px 6%;padding:65px 8%}.social-grid{grid-template-columns:1fr 1fr;gap:38px 22px}.social-grid a{font-size:16px}
 .of{min-height:650px;margin-top:110px;background-position:62% center}.of h2{font-size:42px}footer{gap:20px;flex-direction:column}
}

/* V3 refinements */
.age-mark{
  font-family:Arial,Helvetica,sans-serif;
  font-size:5px;
  letter-spacing:.08em;
  color:#8d8d8d;
  vertical-align:super;
  margin-left:5px;
  font-weight:400;
}
@media(max-width:800px){
  .socials{padding-top:58px;padding-bottom:48px}
  .social-grid{margin-bottom:0}
  .age-mark{font-size:5px;margin-left:4px}
}

/* V4 header CTA */
@media(max-width:800px){
  .nav .subscribe{font-size:8px;letter-spacing:.18em;padding:10px 13px;white-space:nowrap}
}

/* V5 — dedicated Collabs page */
.inner-page{min-height:100vh}
.inner-nav{position:absolute}
.collabs-hero{
  min-height:88vh;
  display:flex;
  align-items:flex-end;
  padding:150px 6% 9%;
  position:relative;
  background:
    linear-gradient(0deg,rgba(2,2,2,.94) 0%,rgba(2,2,2,.32) 58%,rgba(2,2,2,.6) 100%),
    url("assets/wallpaper.jpg") center/760px auto;
}
.collabs-hero-inner{max-width:1100px}
.collabs-hero h1{
  font-family:Georgia,serif;
  font-size:clamp(54px,8vw,116px);
  font-weight:400;
  line-height:.9;
  letter-spacing:.01em;
  margin:25px 0 35px;
}
.collabs-intro{max-width:550px;color:#bbb;line-height:1.8;letter-spacing:.06em}
.coming-wrap{padding:170px 6%}
.coming-panel{
  max-width:1320px;
  min-height:620px;
  margin:auto;
  padding:9%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:rgba(3,3,3,.95);
  box-shadow:0 24px 80px rgba(0,0,0,.45);
}
.coming-panel h2,.work-panel h2{
  font-family:Georgia,serif;
  font-weight:400;
  font-size:clamp(48px,7vw,94px);
  line-height:.92;
  margin:25px 0 35px;
}
.coming-panel>p:not(.chapter-label){max-width:500px;color:#aaa;line-height:1.8}
.coming-line{
  margin-top:80px;
  padding-top:18px;
  border-top:1px solid #555;
  display:flex;
  justify-content:space-between;
  font-size:9px;
  letter-spacing:.3em;
  color:#aaa;
}
.work-with-david{
  padding:0 6% 170px;
}
.work-panel{
  max-width:1320px;
  margin:auto;
  padding:10% 9%;
  background:
    linear-gradient(90deg,rgba(2,2,2,.98),rgba(2,2,2,.74)),
    url("assets/wallpaper.jpg") right center/650px auto;
}
.work-panel p:not(.eyebrow){color:#aaa;letter-spacing:.08em}
.work-panel .button{margin-top:30px}
@media(max-width:800px){
  .inner-nav nav a:not(.subscribe){display:none}
  .collabs-hero{min-height:82svh;padding:130px 7% 14%;background-size:480px auto}
  .collabs-hero h1{font-size:52px}
  .collabs-intro{font-size:14px}
  .coming-wrap{padding:110px 6%}
  .coming-panel{min-height:540px;padding:70px 8%}
  .coming-panel h2,.work-panel h2{font-size:46px}
  .coming-line{margin-top:65px}
  .work-with-david{padding:0 6% 110px}
  .work-panel{padding:75px 8%;background:rgba(3,3,3,.95)}
}

/* V6 — deeper site structure */
.menu-button{display:none;background:transparent;border:1px solid #aaa;border-radius:30px;color:#f2efe9;padding:10px 15px;font-size:8px;letter-spacing:.18em}
.menu-overlay{position:fixed;z-index:1000;inset:0;background:linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.9)),url("assets/wallpaper.jpg") center/620px auto;opacity:0;visibility:hidden;transition:.35s;display:flex;align-items:center;padding:8%}
.menu-overlay.open{opacity:1;visibility:visible}.menu-close{position:absolute;right:6%;top:24px;background:none;border:0;color:#ddd;font-size:9px;letter-spacing:.22em}
.menu-links{display:flex;flex-direction:column;width:100%}.menu-links a{font-family:Georgia,serif;font-size:clamp(36px,9vw,72px);padding:15px 0;border-bottom:1px solid rgba(255,255,255,.18)}.menu-links small{font-family:Arial,sans-serif;font-size:8px;color:#888;letter-spacing:.2em;margin-right:15px}.menu-links sup{font:7px Arial;color:#888}
.page-hero{min-height:82svh;padding:150px 7% 9%;display:flex;align-items:flex-end;background:#050505;position:relative}.page-hero>div{max-width:900px}.page-hero h1,.notfound h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(58px,9vw,120px);line-height:.86;margin:20px 0 30px}.page-hero>div>p:last-child{color:#aaa;letter-spacing:.08em}
.journal-hero{background:linear-gradient(0deg,#050505 0%,rgba(0,0,0,.25) 65%),url("assets/journal.jpg") center/cover}
.about-hero{background:linear-gradient(0deg,#050505 0%,rgba(0,0,0,.22) 65%),url("assets/about.jpg") center 38%/cover}
.under-hero{background:linear-gradient(0deg,#050505 0%,rgba(0,0,0,.25) 65%),url("assets/under-sheets.jpg") center/cover}
.archive-wrap{padding:150px 6%}.archive-intro,.origin-strip{display:flex;justify-content:space-between;max-width:1320px;margin:0 auto 35px;font-size:8px;letter-spacing:.28em;color:#999}.story-placeholder{max-width:1320px;margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;background:#030303;min-height:650px}.story-placeholder>div{padding:12%;align-self:center}.story-placeholder h2,.about-story h2,.private-panel h2{font-family:Georgia,serif;font-weight:400;font-size:clamp(44px,6vw,80px);line-height:.94;margin:20px 0 30px}.story-placeholder p{color:#aaa}.story-placeholder img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.75)}.ghost-link{display:inline-block;margin-top:30px;font-size:9px;letter-spacing:.22em;color:#888}.archive-note{max-width:1320px;margin:35px auto 0;color:#777;font-size:11px;letter-spacing:.08em}
.about-story{max-width:1320px;margin:160px auto;display:grid;grid-template-columns:.9fr 1.1fr;background:#030303}.about-story-copy{padding:12%;align-self:center}.about-story-copy>p:not(.eyebrow){color:#aaa;line-height:1.8}.about-story img{width:100%;height:100%;min-height:700px;object-fit:cover}.origin-strip{margin-bottom:160px;padding:30px 0;border-top:1px solid #555;border-bottom:1px solid #555}
.private-wrap{max-width:1320px;margin:160px auto;display:grid;grid-template-columns:.85fr 1.15fr;background:#030303}.private-panel{padding:13%;align-self:center}.private-panel>p:not(.eyebrow){color:#aaa;line-height:1.8}.private-wrap>img{width:100%;height:100%;min-height:650px;object-fit:cover;filter:brightness(.75)}
.notfound{min-height:100svh;display:flex;align-items:center;padding:10%;background:linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.85)),url("assets/wallpaper.jpg") center/700px auto}.notfound p{color:#aaa}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.revealed{opacity:1;transform:none}
@media(max-width:800px){
 .desktop-nav{display:none!important}.menu-button{display:block}.inner-nav .menu-button{display:block}
 .page-hero{min-height:76svh;padding:120px 7% 13%}.page-hero h1{font-size:54px}
 .journal-hero{background-position:58% center}.about-hero{background-position:58% center}.under-hero{background-position:center}
 .archive-wrap{padding:110px 6%}.story-placeholder{grid-template-columns:1fr;min-height:0}.story-placeholder>div{padding:70px 8%}.story-placeholder img{height:58vh}.story-placeholder h2{font-size:45px}
 .about-story{margin:110px 6%;grid-template-columns:1fr}.about-story-copy{padding:70px 8%}.about-story h2{font-size:42px}.about-story img{min-height:0;height:58vh}.origin-strip{margin:0 6% 110px;gap:18px;flex-direction:column}
 .private-wrap{margin:110px 6%;grid-template-columns:1fr}.private-panel{padding:75px 8%}.private-panel h2{font-size:45px}.private-wrap>img{min-height:0;height:60vh}
}

/* V6.1 — polish */
.desktop-nav a[aria-current="page"]{border-bottom:1px solid currentColor;padding-bottom:5px}
a:focus-visible,button:focus-visible{outline:1px solid #f2efe9;outline-offset:5px}
.menu-button,.menu-close{cursor:pointer;min-height:42px}
.contact-hero{min-height:82svh;padding:150px 7% 9%;display:flex;align-items:flex-end;background:linear-gradient(0deg,#050505 0%,rgba(0,0,0,.38) 60%),url("assets/wallpaper.jpg") center/720px auto}
.contact-hero h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(58px,9vw,118px);line-height:.85;margin:22px 0 30px}.contact-hero p:last-child{color:#aaa;letter-spacing:.08em}
.contact-options{max-width:1320px;margin:150px auto;display:grid;grid-template-columns:1fr 1fr;gap:2px}.contact-card{background:#030303;padding:12%;min-height:600px;display:flex;flex-direction:column;justify-content:center}.contact-card>span{font-size:8px;letter-spacing:.25em;color:#888}.contact-card h2{font:400 clamp(44px,5vw,72px)/.94 Georgia,serif;margin:25px 0}.contact-card p{color:#aaa;line-height:1.8;max-width:430px}.contact-socials{display:flex;flex-direction:column;margin-top:30px}.contact-socials a{padding:15px 0;border-top:1px solid #444;font-size:9px;letter-spacing:.2em}
@media(max-width:800px){.contact-hero{min-height:76svh;padding:120px 7% 13%;background-size:480px auto}.contact-hero h1{font-size:54px}.contact-options{margin:110px 6%;grid-template-columns:1fr}.contact-card{min-height:500px;padding:70px 8%}.contact-card h2{font-size:44px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1!important;transform:none!important}}


/* V6.5 — ONLY desktop navigation visibility changes.
   All hero/photo/layout/reveal styling remains exactly as in V6.3. */
@media (min-width:801px){
  .desktop-nav{display:none!important}
  .menu-button{display:block!important}
}


/* V6.6 — desktop full-screen menu sizing ONLY */
@media (min-width:801px){
  .menu-panel a,
  .menu-overlay a,
  .mobile-menu a {
    font-size: clamp(1.55rem, 2.7vw, 2.65rem) !important;
    line-height: 1.05 !important;
  }
  .menu-panel,
  .menu-overlay,
  .mobile-menu {
    padding-top: clamp(4.5rem, 8vh, 7rem) !important;
  }
  .menu-close,
  .close-menu {
    font-size: .72rem !important;
    letter-spacing: .16em !important;
    opacity: .82 !important;
  }
}


/* V6.7 — two final refinements only */

/* Journal interview card: correct portrait crop without changing the image. */
.story-placeholder img{
  object-position:center 18% !important;
}

/* Opening DAVID DE VIL signature animation. */
.site-intro{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  background:#050505;
  pointer-events:none;
  animation:intro-away 2.45s cubic-bezier(.7,0,.2,1) forwards;
}
.site-intro span{
  font-family:Georgia,serif;
  font-weight:400;
  font-size:clamp(2.1rem,7vw,6.8rem);
  letter-spacing:.12em;
  white-space:nowrap;
  opacity:0;
  transform:scale(.82);
  animation:intro-name 2.05s cubic-bezier(.2,.7,.2,1) forwards;
}
@keyframes intro-name{
  0%{opacity:0;transform:scale(.82)}
  22%{opacity:1}
  72%{opacity:1}
  100%{opacity:0;transform:scale(1.18)}
}
@keyframes intro-away{
  0%,78%{opacity:1;visibility:visible}
  100%{opacity:0;visibility:hidden}
}
@media(max-width:800px){
  .story-placeholder img{object-position:center 14% !important}
  .site-intro span{font-size:clamp(1.75rem,9vw,3.2rem);letter-spacing:.09em}
}
@media(prefers-reduced-motion:reduce){
  .site-intro{display:none!important}
}


/* V6.8 — opening signature now uses David's existing wallpaper */
.site-intro{
  background:
    linear-gradient(rgba(0,0,0,.58),rgba(0,0,0,.58)),
    url("assets/wallpaper.jpg") center/cover no-repeat !important;
}


/* V6.9 — definitive Journal portrait framing.
   Anchor the portrait to the TOP so David's head/face cannot be cropped off. */
.story-placeholder img{
  object-position:center top !important;
}
@media(max-width:800px){
  .story-placeholder img{
    object-position:center top !important;
  }
}


/* V7.0 — Journal image: show the complete photograph, no crop. */
.story-placeholder{
  overflow:hidden;
}
.story-placeholder img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#030303;
}
@media(max-width:800px){
  .story-placeholder img{
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
  }
}

/* V7.1 — prepared Journal card asset: browser performs no portrait crop. */
.story-placeholder img{
  width:100% !important;
  height:100% !important;
  object-fit:fill !important;
  object-position:center !important;
}
@media(max-width:800px){
  .story-placeholder img{
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
  }
}

/* V7.2 — homepage JOURNAL desktop visual only: face/eyes-focused crop. */
@media (min-width:801px){
  .feature-journal img,
  a[href="journal.html"] img[src*="journal-home-desktop"]{
    object-position:center top !important;
  }
}


/* V7.3 — final Journal story-card framing.
   Fill the right panel, preserve proportions, and keep David's full head/face in frame. */
@media (min-width:801px){
  .story-placeholder img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center 8% !important;
  }
}
@media (max-width:800px){
  .story-placeholder img{
    width:100% !important;
    height:58vh !important;
    object-fit:cover !important;
    object-position:center 8% !important;
  }
}


/* V7.5 — mobile JOURNAL image centering ONLY */
@media (max-width:800px){
  .feature-journal img,
  a[href="journal.html"] img[src*="journal"]{
    object-position:center center !important;
  }
}


/* V7.6 — actual mobile Journal fix:
   desktop keeps its dedicated crop; mobile uses the ORIGINAL portrait. */
.journal-picture{
  display:block;
  width:100%;
  height:100%;
}
.journal-picture img{
  width:100%;
  height:100%;
  object-fit:cover;
}
@media(max-width:800px){
  .journal-picture img{
    object-position:center 22% !important;
  }
}