:root{
  --ink:#111a28;
  --muted:#3c454f;
  --cream:#fbf8f2;
  --orange:#f2673d;
  --line:#ded9ce;
  --shadow:0 20px 55px rgba(39,32,22,.10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.6 "Segoe UI",Arial,sans-serif;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:5px}

.shell{max-width:1250px;width:min(1250px,calc(100% - 88px));margin:0 auto}
.scribble{font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;font-style:italic}
.eyebrow{font-size:.74rem;font-weight:800;letter-spacing:.23em;text-transform:uppercase}
.skip{position:absolute;transform:translateY(-150%);background:#fff;z-index:20;padding:12px}
.skip:focus{transform:none}
.line{display:block}
.content-copy,.hero-copy,.feature,.mini-cards article,.projects-inner>div{min-width:0}
p{overflow-wrap:anywhere}

.site-header{position:absolute;z-index:10;top:0;left:0;right:0}
.nav-wrap{display:flex;align-items:center;gap:35px;min-height:90px}
.brand{font-size:1.35rem;font-weight:850;white-space:nowrap;letter-spacing:-.055em;text-decoration:none;position:relative}
.brand-stroke{position:absolute;height:2px;background:var(--orange);width:90%;bottom:-10px;left:0;transform:rotate(-5deg)}
nav{display:flex;gap:26px;align-items:center;margin-left:auto}
nav a,.footer a{font-size:.94rem;text-decoration:none}
nav a:hover,.footer a:hover{color:var(--orange)}
.menu-toggle{display:none}

.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:54px;padding:14px 24px;border-radius:16px;font-size:.96rem;font-weight:700;line-height:1.2;text-decoration:none;white-space:nowrap;transition:transform .2s,box-shadow .2s,border-color .2s}
.button:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(17,24,39,.14)}
.button-dark{background:var(--ink);color:#fff;border:1px solid var(--ink)}
.button-outline{border:1.6px solid var(--ink);background:rgba(255,252,245,.75)}

.hero{position:relative;min-height:680px;display:flex;align-items:center;background:linear-gradient(95deg,#fbf8f2 0%,#f7eee3 58%,#e5b898 100%);overflow:hidden}
.hero-photo{position:absolute;right:0;top:0;width:66%;height:100%;background:url('assets/hero-desk.webp') center/cover no-repeat;filter:saturate(1.08)}
.hero-glow{position:absolute;inset:0;background:linear-gradient(90deg,#fbf8f2 0%,#fbf8f2 25%,rgba(251,248,242,.93) 38%,rgba(251,248,242,.35) 58%,rgba(251,248,242,0) 78%),linear-gradient(0deg,rgba(251,248,242,.42),transparent 36%)}
.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(320px,560px) minmax(280px,1fr);align-items:center;column-gap:24px;min-height:680px;padding-top:88px}
.hero-copy{max-width:560px;padding:24px 0 34px}
.hero-copy .eyebrow{display:none}
.hero h1{margin:0 0 22px;font-size:clamp(3rem,5.9vw,6rem);line-height:1.02;letter-spacing:-.065em;font-weight:850;max-width:8ch}
.hero h1 em,.story h2 em,.projects h2 em,.contact h2 em{display:block;font-family:"Segoe Print","Bradley Hand","Comic Sans MS",cursive;font-weight:500;color:var(--orange);letter-spacing:-.05em;white-space:nowrap}
.hero-copy>p:not(.eyebrow){margin:0;max-width:520px;font-size:1.1rem;line-height:1.62}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:30px}
.hero-wave{position:absolute;bottom:-1px;width:100%;height:65px}

.section{padding:75px 0}
.section-intro{margin-bottom:34px;max-width:760px}
.section-intro h2{font-size:clamp(2rem,3vw,2.8rem);line-height:1.18;letter-spacing:-.04em;margin:10px 0 0}

.features{padding:28px 0 90px}
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:42px;align-items:start}
.feature{display:grid;align-content:start;text-align:left}
.feature-icon{width:95px;height:95px;border-radius:50%;display:grid;place-items:center;margin:0 0 25px}
.feature-icon svg{width:45px;height:45px;fill:none;stroke:#101820;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.bulb{background:#fff0cc}.rocket{background:#dbe9db}.people{background:#e5f0f4}.heart{background:#fae2dc}
.feature h2{font-size:1.2rem;letter-spacing:-.035em;line-height:1.2;margin:0 0 10px}
.feature p{margin:0;color:var(--muted);font-size:.98rem}

.story{padding-top:35px;padding-bottom:95px}
.story-grid{display:grid;grid-template-columns:minmax(300px,520px) minmax(320px,1fr);gap:72px;align-items:center}
.photo-stage{position:relative;padding:35px 20px}
.polaroid{position:relative;padding:15px 15px 22px;background:#fff;transform:rotate(-4deg);box-shadow:var(--shadow)}
.polaroid img{width:100%;height:390px;object-fit:cover;filter:saturate(.85)}
.tape{position:absolute;background:rgba(227,205,167,.67);width:90px;height:35px;z-index:2}
.tape-top{top:15px;left:37%;transform:rotate(-7deg)}
.tape-side{right:-2px;bottom:78px;transform:rotate(5deg)}
.tree-doodle{position:absolute;bottom:-18px;left:0;font-size:3rem;color:#293a32}
.doodle-hatch{position:absolute;top:65px;left:-28px;font-size:4rem;transform:rotate(-45deg)}
.story-copy{max-width:650px}
.story-copy h2,.projects h2,.contact h2{font-size:clamp(2.2rem,3.5vw,3.45rem);line-height:1.16;letter-spacing:-.05em;margin:0 0 25px}
.story-copy p:not(.eyebrow):not(.story-signature){color:var(--muted);font-size:1rem}
.story-signature{font-size:1.7rem;line-height:1.35;text-align:center;transform:rotate(-8deg);margin-top:35px}

.fire{position:relative;min-height:335px;color:#fff;background:#111722;overflow:hidden}
.fire-photo{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,17,28,.67) 0%,rgba(9,17,28,.20) 52%,rgba(9,17,28,.60) 100%),url('assets/campfire.webp') center 55%/cover no-repeat}
.fire-content{position:relative;display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:335px}
.fire-quote{max-width:360px;font-size:1.55rem;line-height:1.3;transform:rotate(-8deg);text-shadow:0 2px 10px rgba(0,0,0,.8)}
.fire-labels{display:flex;flex-direction:column;align-items:flex-start;gap:8px;transform:rotate(-7deg)}
.fire-labels span{border:1.4px solid #fff;border-radius:5px;padding:2px 11px;background:rgba(16,23,34,.61);font-size:.75rem;letter-spacing:.08em}

.projects{background:#fffdf9}
.projects-inner{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);gap:60px;align-items:center}
.projects-inner>div>p:not(.eyebrow){max-width:370px;color:var(--muted)}
.mini-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.mini-cards article{border:1px solid #e6ded4;border-radius:18px;padding:24px 18px;background:#fbf8f2;transition:transform .2s}
.mini-cards article:hover{transform:translateY(-5px)}
.mini-cards span{font-size:.67rem;letter-spacing:.12em;color:#966e49;font-weight:700}
.mini-cards h3{font-size:1.1rem;line-height:1.2;margin:10px 0 8px}
.mini-cards p{font-size:.9rem;color:var(--muted);margin:0}

.contact{position:relative;min-height:360px;padding:85px 0 70px;overflow:hidden}
.contact-inner{position:relative;display:flex;justify-content:space-between;align-items:flex-start;gap:40px}
.contact-inner .content-copy{max-width:650px}
.contact h2{margin-bottom:16px}
.contact-inner p:not(.eyebrow):not(.contact-note){max-width:480px}
.contact-note{font-size:1.45rem;transform:rotate(-10deg);margin-right:40px;line-height:1.4}
.mountains{position:absolute;inset:0;pointer-events:none}
.mountains svg{position:absolute;width:100%;height:100%;bottom:0}

.footer{background:var(--cream);padding:25px 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.footer-inner .scribble{font-size:.9rem}
.footer-inner>div{display:flex;gap:24px;flex-wrap:wrap}

.legal-page .site-header{position:relative;background:var(--cream)}
.legal{max-width:920px;margin:0 auto;min-height:75vh;padding:70px 32px}
.legal h1{font-size:2.8rem;line-height:1.15;margin-bottom:18px}
.legal h2{font-size:1.35rem;margin-top:34px}
.legal p,.legal li{color:var(--muted)}
.legal a{color:#a84d30}
.legal .back-link{display:inline-flex;margin-top:35px;font-weight:700;text-decoration:none}

@media (max-width:1180px){
  .nav-wrap{gap:22px}
  nav{gap:16px}
  .hero-inner{grid-template-columns:minmax(300px,500px) minmax(0,1fr)}
  .story-grid{grid-template-columns:minmax(280px,460px) minmax(300px,1fr);gap:48px}
}

@media (max-width:980px){
  .nav-cta{display:none}
  .story-grid,.projects-inner{grid-template-columns:1fr}
  .contact-inner{flex-direction:column}
  .story-copy,.contact-inner .content-copy{max-width:none}
  .mini-cards{grid-template-columns:1fr}
  .photo-stage{max-width:560px;margin:0 auto}
}

@media (max-width:760px){
  .shell{width:calc(100% - 40px)}
  .nav-wrap{min-height:72px}
  .menu-toggle{display:flex;margin-left:auto;width:42px;height:42px;background:rgba(255,252,242,.92);border:1px solid #d5cfc4;border-radius:10px;align-items:center;justify-content:center;flex-direction:column;gap:5px;cursor:pointer}
  .menu-toggle span{height:2px;width:19px;background:var(--ink)}
  nav{display:none;position:absolute;top:64px;left:20px;right:20px;flex-direction:column;align-items:stretch;gap:0;border-radius:15px;background:#fffdf9;padding:12px;box-shadow:var(--shadow)}
  nav.open{display:flex}
  nav a{padding:12px}

  .hero{min-height:820px;align-items:flex-start}
  .hero-photo{width:100%;height:56%;top:auto;bottom:0;background-position:55% center}
  .hero-glow{background:linear-gradient(180deg,#fbf8f2 0%,#fbf8f2 36%,rgba(251,248,242,.93) 48%,rgba(251,248,242,.18) 65%,transparent 95%)}
  .hero-inner{display:block;min-height:820px;padding-top:148px}
  .hero-copy{max-width:100%}
  .hero h1{font-size:clamp(2.8rem,11vw,4.8rem);line-height:1.02;max-width:8ch}
  .hero-copy>p:not(.eyebrow){font-size:1rem;max-width:480px}
  .actions{align-items:stretch}
  .hero-wave{height:45px}

  .section{padding:60px 0}
  .section-intro h2{font-size:clamp(1.8rem,8vw,2.4rem)}
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 22px}
  .feature-icon{width:72px;height:72px;margin:0 0 16px}
  .feature-icon svg{width:36px;height:36px}
  .feature h2{font-size:1.05rem}
  .feature p{font-size:.9rem}

  .story-grid{gap:35px}
  .polaroid img{height:340px}
  .story-copy h2,.projects h2,.contact h2{font-size:clamp(2.05rem,7vw,3rem)}

  .fire,.fire-content{min-height:300px}
  .fire-content{align-items:flex-end;padding:42px 0}
  .fire-quote{font-size:1.2rem}

  .contact{padding-bottom:110px}
  .contact-note{display:none}
  .footer-inner .scribble{order:3;width:100%}
}

@media (max-width:440px){
  .hero h1{font-size:2.65rem}
  .button{width:100%}
  .feature-grid{grid-template-columns:1fr;gap:28px}
  .feature p{font-size:.88rem}
  .feature h2{font-size:1rem}
  .polaroid img{height:270px}
  .fire-labels span{font-size:.65rem}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}