
@font-face{font-family:'Libre Franklin';src:url('/assets/fonts/libre-franklin-var.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Bevan';src:url('/assets/fonts/bevan.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'IBM Plex Mono';src:url('/assets/fonts/plex-mono-500.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --kraft:#F4EBDC;--cream:#FBF7EE;--pine:#16402E;--field:#2F7A4D;
  --rust:#C75B2B;--ink:#21302A;--ink-soft:#4A5B52;--stitch:rgba(22,64,46,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{font-family:'Libre Franklin',system-ui,sans-serif;background:var(--kraft);color:var(--ink);line-height:1.65;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:var(--field)}
a:focus-visible,button:focus-visible{outline:3px solid var(--rust);outline-offset:2px}
.wrap{max-width:1120px;margin:0 auto;padding:0 22px}
.mono{font-family:'IBM Plex Mono',monospace;letter-spacing:.14em;text-transform:uppercase;font-size:12px;font-weight:500}
h1,h2,.display{font-family:'Bevan',serif;font-weight:400;line-height:1.12;color:var(--pine);letter-spacing:.005em}
h1{font-size:clamp(34px,5.2vw,58px)}
h2{font-size:clamp(26px,3.4vw,38px);margin-bottom:14px}
h3{font-size:20px;color:var(--pine);margin-bottom:8px;letter-spacing:-.01em}
p{margin-bottom:14px}
.eyebrow{color:var(--rust);display:block;margin-bottom:14px}
.btn{display:inline-block;background:var(--field);color:var(--cream);text-decoration:none;font-weight:700;
  padding:15px 30px;border-radius:8px;letter-spacing:.01em;border:2px solid var(--field);transition:transform .12s ease,background .15s}
.btn:hover{background:var(--pine);border-color:var(--pine);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--pine);border:2px solid var(--pine)}
.btn.ghost:hover{background:var(--pine);color:var(--cream)}
/* header */
header{background:var(--kraft);border-bottom:3px solid var(--pine);position:sticky;top:0;z-index:10}
.nav{display:flex;align-items:center;gap:26px;padding:12px 0;position:relative}
.nav .brand{display:flex;align-items:center;gap:12px;text-decoration:none;margin-right:auto}
.nav .brand img{width:52px;height:52px}
.nav .brand b{font-family:'Libre Franklin';font-weight:800;color:var(--pine);font-size:17px;letter-spacing:.02em;line-height:1.2}
.nav .brand small{display:block;font-weight:600;color:var(--rust);font-size:10.5px;letter-spacing:.12em}
.nav .links{display:flex;align-items:center;gap:26px}
.nav a.link{color:var(--pine);text-decoration:none;font-weight:600;font-size:15px}
.nav a.link:hover{color:var(--rust)}
.nav .btn{padding:11px 20px;font-size:15px}
.hasmenu{position:relative}
.menu-trigger{background:none;border:none;cursor:pointer;font:inherit;color:var(--pine);font-weight:600;font-size:15px;display:flex;align-items:center;gap:5px;padding:0}
.menu-trigger:hover{color:var(--rust)}
.menu-trigger .caret{font-size:10px;transition:transform .15s}
.hasmenu.open .menu-trigger .caret{transform:rotate(180deg)}
.submenu{display:none;position:absolute;top:100%;left:-14px;margin-top:12px;min-width:230px;background:var(--kraft);
  border:2px solid var(--pine);border-radius:12px;padding:8px;box-shadow:0 16px 30px rgba(22,64,46,.18);z-index:20}
/* invisible bridge so the cursor can travel from trigger to menu without losing hover */
.hasmenu::after{content:"";position:absolute;top:100%;left:0;right:0;height:16px}
.hasmenu:hover .submenu,.hasmenu:focus-within .submenu,.hasmenu.open .submenu{display:block}
.submenu a{display:block;padding:11px 14px;border-radius:8px;text-decoration:none;color:var(--pine);font-weight:600;font-size:15px}
.submenu a:hover{background:var(--pine);color:var(--kraft)}
.menu-btn{display:none;background:none;border:2px solid var(--pine);border-radius:9px;width:48px;height:44px;
  cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0}
.menu-btn span{display:block;width:22px;height:3px;background:var(--pine);border-radius:2px;transition:transform .18s,opacity .18s}
.nav.open .menu-btn span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav.open .menu-btn span:nth-child(2){opacity:0}
.nav.open .menu-btn span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
@media(max-width:820px){
  .nav .brand b{font-size:14.5px}
  .nav .brand small{font-size:9.5px}
  .menu-btn{display:flex}
  .nav .links{display:none}
  .nav.open .links{display:flex;flex-direction:column;align-items:stretch;gap:0;
    position:absolute;top:100%;left:-22px;right:-22px;background:var(--kraft);
    border-bottom:3px solid var(--pine);box-shadow:0 18px 30px rgba(22,64,46,.18);padding:6px 22px 18px}
  .nav.open .links a.link{padding:15px 4px;font-size:17px;border-bottom:1.5px dashed var(--stitch)}
  .nav.open .links .btn{margin-top:14px;text-align:center;padding:15px 20px;font-size:16px}
  .nav.open .hasmenu{width:100%}
  .nav.open .menu-trigger{padding:15px 4px;font-size:17px;width:100%;justify-content:space-between;border-bottom:1.5px dashed var(--stitch)}
  .nav.open .submenu{position:static;display:none;border:none;box-shadow:none;background:none;padding:0;min-width:0}
  .nav.open .hasmenu.open .submenu{display:block}
  .nav.open .submenu a{padding:13px 16px;font-size:15.5px;border-bottom:1.5px dashed var(--stitch)}
}
/* hero */
.hero{padding:72px 0 56px;position:relative;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:44px;align-items:center}
.hero .tagline{font-size:21px;font-weight:700;color:var(--field);margin:18px 0 10px}
.hero .tagline em{font-style:normal;color:var(--rust)}
.hero .badge-art{justify-self:center;width:min(330px,80%);transform:rotate(4deg);filter:drop-shadow(0 10px 24px rgba(22,64,46,.18))}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
@media(max-width:860px){.hero .wrap{grid-template-columns:1fr}.hero .badge-art{order:-1;width:200px}}

/* hero photo */
.hero-photo{position:relative;justify-self:center;width:min(640px,100%)}
.photo-frame picture img{border-radius:10px;border:10px solid var(--cream);
  box-shadow:0 16px 34px rgba(22,64,46,.20);width:100%;height:auto}
.photo-frame{position:relative}
.photo-frame::after{content:"";position:absolute;inset:14px;border:1.5px dashed rgba(251,247,238,.85);
  border-radius:6px;pointer-events:none}
.photo-frame .stamp{position:absolute;width:118px;height:118px;bottom:-30px;left:-26px;
  transform:rotate(-8deg);filter:drop-shadow(0 8px 16px rgba(22,64,46,.25));z-index:2}
@media(max-width:860px){.hero-photo{order:-1}.photo-frame .stamp{width:88px;height:88px;bottom:-20px;left:-10px}}
/* heritage strip: signature element */
.heritage{background:var(--pine);color:var(--kraft);padding:13px 0;border-top:2px dashed var(--kraft);border-bottom:2px dashed var(--kraft)}
.heritage .wrap{display:flex;gap:34px;justify-content:center;flex-wrap:wrap;text-align:center}
.heritage span{white-space:nowrap}
.heritage .no{color:#A8D8B9}
/* sections */
section{padding:64px 0}
.alt{background:var(--cream);border-top:2px dashed var(--stitch);border-bottom:2px dashed var(--stitch)}
.lede{max-width:640px;color:var(--ink-soft);font-size:18px}
.grid{display:grid;gap:20px;margin-top:34px}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid.c3,.grid.c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid.c3,.grid.c4{grid-template-columns:1fr}}
.card{background:var(--cream);border:2px dashed var(--stitch);border-radius:14px;padding:26px}
.alt .card{background:var(--kraft)}
.card .mono{color:var(--rust);margin-bottom:10px;display:block}
.steps{counter-reset:step}
.steps .card{position:relative;padding-top:58px}
.steps .card::before{counter-increment:step;content:counter(step,decimal-leading-zero);
  font-family:'Bevan',serif;font-size:30px;color:var(--rust);position:absolute;top:16px;left:24px}
/* artifact quote */
.artifact{background:var(--cream);border:2px solid var(--pine);border-radius:4px;padding:34px 34px 26px;position:relative;
  box-shadow:6px 6px 0 var(--stitch);max-width:720px}
.artifact::after{content:"";position:absolute;inset:8px;border:1.5px dashed var(--stitch);border-radius:2px;pointer-events:none}
.artifact blockquote{font-family:'Bevan',serif;font-size:clamp(19px,2.4vw,25px);line-height:1.4;color:var(--pine)}
.artifact figcaption{margin-top:16px;color:var(--rust)}
/* quick answer (AEO) */
.qa{background:var(--cream);border-left:6px solid var(--field);border-radius:0 12px 12px 0;padding:20px 24px;margin:26px 0;max-width:760px}
.qa .mono{color:var(--field);display:block;margin-bottom:6px}
/* faq */
details{background:var(--cream);border:2px dashed var(--stitch);border-radius:12px;padding:18px 22px;margin-bottom:12px}
details summary{font-weight:700;color:var(--pine);cursor:pointer;font-size:17px}
details[open] summary{margin-bottom:8px}
/* link grids */
.linkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-top:24px}
.linkgrid a{background:var(--cream);border:1.5px dashed var(--stitch);border-radius:9px;padding:11px 14px;
  text-decoration:none;color:var(--pine);font-weight:600;font-size:15px}
.linkgrid a:hover{background:var(--pine);color:var(--kraft)}
/* cta band */
.band{background:var(--pine);color:var(--kraft);text-align:center;padding:70px 0}
.band h2{color:var(--kraft)}
.band p{color:#CFE3D6;max-width:560px;margin:0 auto 26px}
.band .btn{background:var(--rust);border-color:var(--rust)}
.band .btn:hover{background:#A84A20;border-color:#A84A20}
/* hide floating reviews widget on the booking page (all viewports) */
body.book-page [data-workmon-trust],
body.book-page [class*="workmon-trust"],
body.book-page [id*="workmon-trust"],
body.book-page [class*="worktrust"]{display:none!important}
/* lead gate */
.gate-sec .wrap{text-align:center}
.gate-sec .lede{margin-left:auto;margin-right:auto}
.gate-shell{background:var(--cream);border:2px dashed var(--stitch);border-radius:16px;padding:20px;margin:26px auto 0;min-height:340px;max-width:600px;text-align:left}
.alt .gate-shell{background:var(--kraft)}
.gate-shell [data-workmon-gate]{display:block;width:100%;min-height:300px;margin:0 auto}
.gate-shell iframe{display:block;width:100%!important;border:0;min-height:300px;margin:0 auto}
@media(max-width:820px){.gate-shell{padding:14px;min-height:360px;max-width:100%}}
/* booking */
.booking-shell{background:var(--cream);border:2px dashed var(--stitch);border-radius:16px;padding:26px;min-height:740px;margin-top:30px}
.book-hero{padding:48px 0 10px}
.booking-shell [data-workmon-booking]{display:block;width:100%;min-height:700px}
.booking-shell iframe{display:block;width:100%!important;border:0;min-height:700px}
@media(max-width:820px){
  /* Booking on mobile: let the iframe stand at a tall natural height and flow with
     the page. No fixed height, no overflow clipping, no negative margins. This keeps
     the whole booking flow reachable by normal page scroll and prevents the footer
     from bleeding through. */
  body.book-page header{position:static}
  .book-hero{padding:20px 0 4px}
  .book-hero h1{font-size:28px}
  .booking-shell{border:none;border-radius:0;padding:0;background:none;margin:14px 0 0;
    width:100%;min-height:0;overflow:visible}
  .booking-shell [data-workmon-booking]{display:block;width:100%;min-height:1400px}
  .booking-shell iframe{display:block;width:100%!important;border:0;min-height:1400px;height:1400px}
  body.book-page .checks{display:none}
  /* reviews stay hidden on mobile booking to keep the flow clean */
  body.book-page .book-reviews{display:none!important}
}
/* timeline */
.timeline{margin-top:40px;border-left:3px dashed var(--stitch);padding-left:34px;max-width:760px}
.tl{position:relative;padding-bottom:40px}
.tl::before{content:"";position:absolute;left:-44px;top:4px;width:17px;height:17px;border-radius:50%;
  background:var(--kraft);border:4px solid var(--rust)}
.tl .mono{color:var(--rust);display:block;margin-bottom:6px}
/* blog */
.post{max-width:780px}
.post .meta{color:var(--rust);margin:14px 0 30px;display:block}
.post h2{font-family:'Libre Franklin';font-weight:800;font-size:24px;margin:38px 0 12px;letter-spacing:-.01em}
.post p{font-size:17.5px}
.post .postimg{border-radius:10px;border:9px solid var(--cream);box-shadow:0 14px 30px rgba(22,64,46,.16);margin:30px 0}
.post .artifact{margin:34px 0}
/* breadcrumbs */
.crumbs{padding:18px 0 0;font-size:14px}
.crumbs a{color:var(--ink-soft);text-decoration:none}
.crumbs a:hover{color:var(--rust)}
/* footer */
footer{background:var(--pine);color:#CFE3D6;padding:60px 0 30px;border-top:6px solid var(--rust)}
footer .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:36px}
@media(max-width:860px){footer .cols{grid-template-columns:1fr 1fr}}
@media(max-width:540px){footer .cols{grid-template-columns:1fr}}
footer h4{color:var(--kraft);font-size:14px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
footer a{color:#CFE3D6;text-decoration:none;display:block;margin-bottom:8px;font-size:15px}
footer a:hover{color:var(--kraft)}
footer .legal{border-top:1px dashed rgba(244,235,220,.3);margin-top:44px;padding-top:22px;font-size:13.5px;
  display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;color:#A8C5B3}
footer .brandcol img{width:84px;margin-bottom:14px}

/* legal documents */
.legal h2{font-family:'Libre Franklin';font-weight:800;font-size:22px;margin:34px 0 12px;letter-spacing:-.01em}
.legal h3{margin-top:24px}
.legal h4{color:var(--pine);margin:18px 0 6px;font-size:16.5px}
.legal ul,.legal ol{margin:0 0 16px 26px}
.legal li{margin-bottom:8px}
.legal p{font-size:16px}
ul.checks{list-style:none;margin:16px 0}
ul.checks li{padding-left:30px;position:relative;margin-bottom:9px}
ul.checks li::before{content:"";position:absolute;left:0;top:7px;width:14px;height:8px;
  border-left:3px solid var(--field);border-bottom:3px solid var(--field);transform:rotate(-45deg)}
.note{background:var(--cream);border:2px solid var(--rust);border-radius:12px;padding:20px 24px;max-width:760px}
.note b{color:var(--rust)}
