@layer reset, styles, prewind;

@import url("theme.css");
@import url("typography.css");
@import url("forms.css");
@import url("ui.css");
@import url("navigation.css");
@import url("https://unpkg.com/prewindcss@1.3.1");

@layer styles {
  /* Shared proportions for the small, single-purpose owner screens. */
  .admin-access { max-width:29rem; margin:clamp(0rem,4vh,3rem) auto; padding:var(--space-lg); border:1px solid var(--light); border-radius:var(--rounded-lg); background:var(--white); box-shadow:0 8px 32px rgb(0 0 0 / .035); }
  .admin-access > h1 { letter-spacing:-.035em; }
  .admin-access > p { font-size:var(--text-base); }
  .admin-access > p:last-child { font-size:max(.875rem,var(--text-sm)); }
  .container { min-width:0; max-width:100%; }
  .admin-access form { margin-block:var(--space-lg); }
  .admin-access .form-field { margin-bottom:var(--space-md); font-size:var(--text-sm); }
  .admin-access input { font-size:max(1rem,var(--text-base)); }
  .admin-access .code-input { max-width:none; }
  .admin-access [role="alert"],.admin-access [role="status"] { padding:var(--space-sm); border:1px solid var(--light); border-radius:var(--rounded-lg); background:var(--lighter); }
  main > .container > h1 { max-width:20ch; }
  main > .container > h1:first-child { margin-top:0; }
  .desktop-navigation { display:flex; gap:var(--space-md); }
  .mobile-menu-toggle { display:none; align-items:center; justify-content:center; width:48px; height:48px; padding:8px; border:0; background:transparent; color:var(--black); }
  .mobile-menu-toggle:hover { background:transparent; }
  .mobile-menu-toggle span { display:block; width:30px; height:22px; background:linear-gradient(currentColor,currentColor) top/100% 2px no-repeat,linear-gradient(currentColor,currentColor) center/100% 2px no-repeat,linear-gradient(currentColor,currentColor) bottom/100% 2px no-repeat; }
  #mobile-navigation { margin:0 0 0 auto; inset:var(--flea-toolbar-height,0px) 0 0; width:min(22rem,100%); height:calc(100dvh - var(--flea-toolbar-height,0px)); overflow:auto; padding:var(--space-md); border:0; background:var(--white); color:var(--black); opacity:0; transform:translateX(24px); }
  #mobile-navigation:popover-open { opacity:1; transform:translateX(0); }
  #mobile-navigation::backdrop { inset:var(--flea-toolbar-height,0px) 0 0; background:#0005; opacity:0; }
  #mobile-navigation:popover-open::backdrop { opacity:1; }
  @media (prefers-reduced-motion:no-preference) {
    #mobile-navigation { transition:opacity 180ms ease,transform 180ms ease,display 180ms allow-discrete,overlay 180ms allow-discrete; }
    #mobile-navigation::backdrop { transition:opacity 180ms ease,display 180ms allow-discrete,overlay 180ms allow-discrete; }
    @starting-style {
      #mobile-navigation:popover-open { opacity:0; transform:translateX(24px); }
      #mobile-navigation:popover-open::backdrop { opacity:0; }
    }
  }
  #mobile-navigation nav { display:flex; flex-direction:column; gap:var(--space-md); }
  #mobile-navigation button[popovertargetaction="hide"] { position:relative; width:44px; height:44px; padding:0; border:0; background:transparent; color:inherit; font-size:0; }
  #mobile-navigation button[popovertargetaction="hide"]::before,
  #mobile-navigation button[popovertargetaction="hide"]::after { content:""; position:absolute; top:50%; left:50%; width:24px; height:2px; background:currentColor; transform:translate(-50%,-50%) rotate(45deg); }
  #mobile-navigation button[popovertargetaction="hide"]::after { transform:translate(-50%,-50%) rotate(-45deg); }
  @media (max-width: 767px) {
    .desktop-navigation,header > nav > a[href="/admin"] { display:none; }
    .mobile-menu-toggle { display:inline-flex; margin-left:auto; }
  }
  .contact-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; gap:var(--space-xl); }
  @media (max-width: 760px) { .contact-layout { grid-template-columns:minmax(0,1fr); } }
  .team-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-md); }
  .team-grid article > :last-child > p:last-child { margin-bottom:0; }
  @media (max-width: 900px) { .team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
  @media (max-width: 560px) { .team-grid { grid-template-columns:minmax(0,1fr); } }
  /* Global styles go here */
  nav > a,.desktop-navigation > a {
    text-decoration: none;
    color: var(--darker);
  }

  /* Full-height shell with independently scrolling navigation and editing. */
  .admin-shell {
    height: 100dvh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
  }
  .admin-main { min-height: 0; overflow: auto; }
  .admin-workspace {
    height: 100%;
    display: grid;
    grid-template-columns: 15rem minmax(0, 1fr);
  }
  .admin-sidebar {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .admin-page-list {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
  }
  .admin-page-list a:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: -2px;
  }
  .admin-page-list a[aria-current="page"] {
    background: var(--white);
    color: var(--black);
    font-weight: var(--font-semibold);
  }
  .admin-content { min-width: 0; overflow-y: auto; }
  .admin-panel { max-width: 56rem; }
  @media (max-width: 640px) {
    .admin-workspace { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 30dvh) minmax(0, 1fr); }
  }
  /* Quiet green composition, media crops, and interactive states. */
  html { scroll-behavior:smooth; scroll-padding-top:100px; }
  body { font-family:var(--font-body); color:var(--black); background:var(--white); font-size:16px; line-height:1.6; }
  ::selection { background:var(--highlight); color:var(--black); }
  a { color:inherit; text-decoration:none; }
  button { cursor:pointer; }
  button,a { touch-action:manipulation; }
  button:focus-visible,a:focus-visible,summary:focus-visible { outline:3px solid var(--focus); outline-offset:5px; }
  p { color:var(--dark); max-width:65ch; }
  h1,h2,h3 { font-family:var(--font-heading); font-weight:var(--font-heading-weight); line-height:1.04; letter-spacing:-.04em; text-wrap:balance; }
  h2 { font-size:clamp(36px,5.5vw,66px); }
  h3 { font-size:26px; letter-spacing:-.025em; }
  small { font-size:12px; }
  .opening { position:relative; text-align:center; padding:72px 32px 64px; margin:8px 28px 0; padding-top:82px; padding-bottom:65px; }
  .opening:before,.opening:after { content:''; position:absolute; width:13px; height:13px; border:3px solid var(--black); display:none; }
  .opening:before { top:0; left:0; border-right:0; border-bottom:0; border-radius:10px 0 0; }
  .opening:after { bottom:0; right:0; border-left:0; border-top:0; border-radius:0 0 10px; }
  .opening h1 { font-size:clamp(44px,5.7vw,72px); line-height:1.13; letter-spacing:-.035em; max-width:1140px; margin:0 auto 34px; text-transform:none; margin-bottom:32px; }
  .opening h1>span { display:block; }
  .opening mark { position:relative; isolation:isolate; background:transparent; color:inherit; white-space:nowrap; }
  .opening mark:before { content:''; position:absolute; inset:9px -5px 1px; background:var(--highlight); z-index:-1; animation:emphasis 1.1s cubic-bezier(.16,1,.3,1) both; transform-origin:left; }
  .opening p { font-size:18px; line-height:1.65; max-width:620px; margin:0 auto 27px; }
  .opening .terms { font-size:12px; margin-top:18px; margin-bottom:0; color:var(--black); line-height:1.5; }
  .opening .terms strong { font-weight:700; }
  .offer-link { display:block; margin-top:18px; font-size:12px; text-decoration:underline; text-underline-offset:4px; }
  .promise-strip { margin:55px auto 0; padding:21px 0; border-top:1px solid var(--light); border-bottom:1px solid var(--light); font-size:12px; font-weight:600; }
  .promise-strip svg { width:18px; height:18px; flex-shrink:0; }
  .chapter>h2,.chapter>.container>h2 { max-width:900px; }
  .chapter-intro { max-width:570px; font-size:18px; margin:24px auto 50px; }
  .workbench { display:grid; grid-template-columns:1.2fr 1fr; gap:60px; margin-top:60px; }
  .stage { position:relative; min-height:470px; background:var(--stage); border-radius:26px; padding:45px; overflow:hidden; }
  .stage:before { content:''; position:absolute; inset:24px; border:1px solid var(--stage-border); border-radius:15px; }
  .stage-art { width:100%; position:relative; }
  .searchbar { gap:13px; background:#fff; border-radius:12px; padding:18px 20px; font-size:14px; }
  .searchbar svg { width:20px; height:20px; }
  .result { background:#f9f9f6; border-radius:14px; padding:28px; margin-top:12px; box-shadow:0 12px 28px rgb(45 38 92/.08); }
  .business-symbol { width:44px; height:44px; background:var(--black); color:var(--highlight); border-radius:10px; display:grid; place-items:center; margin-bottom:18px; }
  .business-symbol svg { width:26px; height:26px; }
  .result h3 { font-size:28px; }
  .result p { font-size:13px; margin:12px 0 20px; }
  .result .ui-button { padding:12px 18px; font-size:12px; }
  .result-meta { font-size:11px; font-weight:600; color:var(--dark); margin:10px 0; }
  .example-note { font-size:10px; position:absolute; bottom:12px; left:0; right:0; text-align:center; color:var(--dark); }
  .steps { border-top:1px solid var(--light); }
  .steps button { width:100%; text-align:left; border:0; border-bottom:1px solid var(--light); padding:25px 0; background:transparent; color:var(--black); display:block; min-height:0; border-radius:0; font:inherit; }
  .step-heading { gap:20px; font-size:23px; line-height:1.2; font-weight:800; letter-spacing:-.025em; }
  .step-heading svg { width:28px; height:28px; padding:5px; flex-shrink:0; border-radius:7px; background:#e3e4dc; transition:transform .25s; }
  .steps button[aria-expanded=true] .step-heading svg { background:var(--black); color:white; transform:rotate(45deg); }
  .step-copy { display:block; font-size:14px; line-height:1.6; color:var(--dark); max-width:400px; margin-top:18px; }
  .steps button[aria-expanded=false] .step-copy { display:none; }
  .steps button[aria-expanded=false]:hover .step-heading { color:var(--focus); }
  .website-preview .browserline { height:22px; border-bottom:1px solid #deded8; background:#efefea; border-radius:12px 12px 0 0; padding-left:14px; font-size:11px; color:#74776d; }
  .website-preview { background:white; border-radius:12px; box-shadow:0 12px 28px rgb(45 38 92/.08); }
  .website-preview .web-content { padding:32px; }
  .website-preview h3 { font-size:35px; max-width:290px; }
  .website-preview p { font-size:13px; margin:18px 0; }
  .social-sheet { background:#fff; padding:28px; border-radius:14px; }
  .social-title { gap:12px; font-size:12px; font-weight:700; }
  .social-title .business-symbol { width:32px; height:32px; margin:0; }
  .social-sheet h3 { font-size:32px; margin:30px 0 22px; }
  .social-sheet .social-poster { background:var(--guide); padding:28px 23px; border-radius:10px; }
  .social-poster p { font-size:12px; margin:16px 0 0; }
  .social-channels { font-size:10px; margin-top:20px; letter-spacing:.015em; }
  .guide { background:var(--guide); border-radius:24px; display:grid; grid-template-columns:1fr .8fr; gap:60px; padding:65px; }
  .guide h2 { font-size:clamp(36px,4.1vw,51px); }
  .guide p { font-size:16px; margin:24px 0; }
  .guide img { width:100%; height:350px; object-fit:cover; object-position:center 30%; border-radius:16px; filter:saturate(.7); }
  .signature { display:block; margin-top:20px; font-weight:800; font-size:14px; }
  .guide small { color:var(--dark); }
  .routine { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
  .routine p { margin:25px 0; }
  .conversation { background:#fff; padding:38px; border-radius:20px; position:relative; }
  .conversation blockquote { font-size:28px; font-weight:700; line-height:1.35; letter-spacing:-.025em; padding:0; border:0; margin:22px 0; }
  .conversation .wave { gap:4px; height:44px; margin:25px 0; }
  .wave i { display:block; flex:1; border-radius:2px; background:#a39acb; height:var(--h); }
  .conversation span { font-size:12px; color:var(--dark); }
  .conversation small { display:block; margin-top:18px; color:var(--dark); }
  .conversation .play { display:inline-grid; place-items:center; width:42px; height:42px; background:var(--black); border:0; border-radius:50%; color:white; min-height:0; }
  .play svg { width:16px; height:16px; }
  .conversation .control-row { gap:12px; }
  .conversation .wave.active i { animation:wave .9s ease-in-out 2 alternate; animation-delay:var(--d); }
  .inclusions { display:grid; grid-template-columns:1fr 1fr; gap:60px; margin-top:40px; }
  .inclusions dl { margin:0; }
  .inclusions dl>div { border-top:1px solid var(--light); padding:22px 0; }
  .inclusions dt { font-size:19px; font-weight:800; margin-bottom:8px; letter-spacing:-.02em; }
  .inclusions dd { margin:0; color:var(--dark); font-size:14px; }
  .scope-note { font-size:12px; margin-top:30px; max-width:700px; }
  .testimonial { border-top:1px solid var(--light); }
  .testimonial blockquote { font-size:clamp(29px,4vw,46px); line-height:1.25; letter-spacing:-.025em; font-weight:600; max-width:900px; }
  .testimonial p { font-size:13px; margin-top:26px; }
  .testimonial small { display:block; margin-top:8px; }
  .offer { background:var(--highlight); padding:85px 0; }
  .offer .container { display:grid; grid-template-columns:1.3fr 1fr; gap:90px; align-items:center; }
  .offer h2 { font-size:clamp(42px,5.1vw,64px); }
  .offer p { color:var(--black); font-size:15px; margin-top:25px; max-width:500px; }
  .price { font-size:76px; letter-spacing:-.04em; font-weight:800; line-height:1; }
  .price span { font-size:16px; font-weight:500; letter-spacing:0; }
  .offer .ui-button { margin:26px 0 0; }
  .offer .terms { margin-top:16px; font-size:12px; }
  .faq { max-width:850px; }
  .faq h2 { margin-bottom:35px; }
  .faq details { border-top:1px solid var(--light); padding:22px 0; }
  .faq summary { cursor:pointer; list-style:none; font-weight:700; display:flex; justify-content:space-between; gap:30px; }
  .faq summary:after { content:''; width:16px; height:16px; flex-shrink:0; background:linear-gradient(currentColor,currentColor) center/14px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 14px no-repeat; }
  .faq details[open] summary:after { background-size:14px 1.5px,1.5px 0; }
  .faq details p { font-size:14px; margin-top:18px; }
  .closing { background:var(--black); color:#fff; padding:75px 0 30px; }
  .closing h2 { font-size:clamp(40px,6vw,76px); max-width:850px; text-transform:none; }
  .closing p { color:#bfc2b6; margin-top:24px; max-width:500px; }
  .closing .ui-button { margin-top:30px; }
  @keyframes emphasis {
  from { clip-path:inset(0 100% 0 0); }
}
  @keyframes emphasis {
  to { clip-path:inset(0); }
}
  @keyframes wave {
  to { height:calc(var(--h)*.35); }
}
  @media(max-width:800px) {
  .opening { margin:6px 15px 0; padding:52px 10px 48px; }
}
  @media(max-width:800px) {
  .opening h1 { font-size:clamp(37px,9.7vw,62px); margin-bottom:28px; line-height:1.12; max-width:580px; letter-spacing:-.035em; }
}
  @media(max-width:800px) {
  .opening p { font-size:15px; max-width:370px; line-height:1.65; }
}
  @media(max-width:800px) {
  .opening mark:before { inset:6px -3px 0; }
}
  @media(max-width:800px) {
  .opening .terms { font-size:11px; }
}
  @media(max-width:800px) {
  .promise-strip { margin-top:35px; gap:15px; font-size:11px; justify-content:center; }
}
  @media(max-width:800px) {
  .chapter-intro { font-size:16px; margin:22px auto 32px; }
}
  @media(max-width:800px) {
  .workbench { grid-template-columns:1fr; gap:22px; margin-top:35px; }
}
  @media(max-width:800px) {
  .stage { min-height:390px; padding:40px; }
}
  @media(max-width:800px) {
  .steps button { padding:21px 0; }
}
  @media(max-width:800px) {
  .step-heading { font-size:21px; }
}
  @media(max-width:800px) {
  .guide { grid-template-columns:1fr; gap:20px; padding:30px; }
}
  @media(max-width:800px) {
  .guide img { height:280px; max-width:350px; order:-1; }
}
  @media(max-width:800px) {
  .guide p { font-size:14px; }
}
  @media(max-width:800px) {
  .routine { grid-template-columns:1fr; gap:25px; }
}
  @media(max-width:800px) {
  .conversation { padding:25px; }
}
  @media(max-width:800px) {
  .conversation blockquote { font-size:25px; }
}
  @media(max-width:800px) {
  .inclusions { grid-template-columns:1fr; gap:0; margin-top:30px; }
}
  @media(max-width:800px) {
  .offer { padding:60px 0; }
}
  @media(max-width:800px) {
  .offer .container { grid-template-columns:1fr; gap:35px; }
}
  @media(max-width:800px) {
  .offer p { font-size:14px; }
}
  @media(max-width:800px) {
  .price { font-size:65px; }
}
  @media(max-width:800px) {
  .faq summary { font-size:14px; }
}
  @media(max-width:800px) {
  .closing { padding:60px 0 90px; }
}
  @media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
}
  @media(prefers-reduced-motion:reduce) {
  *,*:before,*:after { animation:none!important; transition:none!important; }
}
  .opening .offer-link { font-size:12px; }
  .conversation .wave i { background:var(--focus); }
  @media(max-width:800px) {
  .opening h1>span+span { margin-top:10px; }
}
  .steps button:hover { filter:none; }
  /* Shared site shell, preserving native navigation and authenticated editing. */
  .skip { position:fixed; top:-80px; left:20px; z-index:100; padding:12px 20px; background:var(--black); color:var(--white); }
  .skip:focus { top:12px; }
  body > header { z-index:20; }
  body > header > nav { min-height:88px; }
  body > header img { width:194px; height:auto; }
  .desktop-navigation > a { font-size:13px; font-weight:700; }
  .desktop-navigation > a:hover { text-decoration:underline; text-underline-offset:5px; }
  .desktop-navigation > .ui-button { min-height:0; padding:10px 18px; color:#fff; }
  body > footer { background:var(--black); color:#d2ddd4; }
  body > footer img { filter:brightness(0) invert(1); }
  body > footer a { color:inherit; }
  body > footer .container { border-top:1px solid #526b5b; }
  .stage .ui-button { color:#fff; }
  @media (max-width:800px) { body > header > nav { min-height:76px; } body > header img { width:165px; } }

}