@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); }
  }
  /* Composition, media crops and native states beyond the utility vocabulary. */
  html { scroll-behavior:smooth; scroll-padding-top:100px; }
  section { scroll-margin-top:90px; }
  body > header { z-index:20; border-bottom:1px solid var(--light); }
  body > header > nav { min-height:85px; }
  body > header img { width:172px; }
  .desktop-navigation > a { font-size:.8rem; font-weight:600; }
  .desktop-navigation > a:hover { text-decoration:underline; }
  .opening { padding-block:45px 38px; }
  main > .opening h1 { max-width:1000px; }
  .opening .lead { font-size:clamp(1.125rem,2vw,1.375rem); line-height:1.5; max-width:660px; }
  .amount { font-size:1.25rem; font-weight:800; line-height:1.3; }
  .amount small { font-size:.75rem; font-weight:500; }
  .offer-note { font-size:.875rem; max-width:690px; }
  .service-illustration { background:var(--illustration-background); }
  .service-illustration > img { height:clamp(280px,42vw,500px); object-fit:cover; object-position:center 44%; }
  figcaption { font-size:.7rem; color:var(--dark); padding-block:9px; }
  .responsibility-switch button { background:transparent; border-color:var(--dark); font-size:.8125rem; }
  .responsibility-switch button[aria-pressed=true] { background:var(--black); color:var(--white); border-color:var(--black); }
  .responsibilities > div { display:grid; grid-template-columns:170px minmax(0,1fr); gap:24px; padding-block:15px; border-top:1px solid var(--light); align-items:baseline; }
  .responsibilities > div:last-child { border-bottom:1px solid var(--light); }
  .responsibilities dt { font-size:1.25rem; font-weight:800; letter-spacing:-.02em; }
  .founder-proof { padding-block:26px; }
  .founder-proof img { width:64px; height:78px; flex:none; object-fit:cover; object-position:center 28%; }
  .founder-proof p { font-size:.875rem; }
  .closing { border-top:1px solid var(--light); }
  details { border-top:1px solid var(--light); padding-block:var(--space-md); }
  details:last-child { border-bottom:1px solid var(--light); }
  summary { font-weight:700; cursor:pointer; }
  details p { color:var(--dark); font-size:.9375rem; }
  footer { border-top:1px solid var(--light); padding-block:var(--space-lg); font-size:.75rem; color:var(--dark); }
  footer img { width:150px; margin-bottom:var(--space-md); }
  .skip { position:absolute; left:-9999px; }
  .skip:focus { left:20px; top:20px; z-index:50; background:var(--white); padding:10px; }
  @media(max-width:767px) {
    body > header > nav { min-height:72px; }
    body > header img { width:145px; }
    .opening { padding-block:34px 31px; }
    h1 { font-size:clamp(2.45rem,10vw,4.125rem); }
    .service-illustration > img { height:270px; object-position:center; }
    .responsibilities > div { grid-template-columns:minmax(0,1fr); gap:4px; }
  }
  @media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
}