/* Cafe Utopia brand layer for pages on the default Sunrise layout (policies, cart, account, 404, search).
   Loaded after Sunrise's CSS and its font variables, so these win. Tokens: see CLAUDE.md "Design tokens". */
:root{
  --font-body-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body-style:normal;
  --font-body-weight:400;
  --font-body-weight-bold:700;
  --font-heading-family:Oswald,Impact,"Arial Narrow",sans-serif;
  --font-heading-style:normal;
  --font-heading-weight:600;
  --font-pre-heading-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
}
body{background:#FFFFFF;color:#111111;font-family:var(--font-body-family)}
.font-heading{text-transform:uppercase;letter-spacing:.01em;color:#26170F}

/* Header (same as the homepage layout) */
.cu-topbar{background:#1F5A14;color:#FFFFFF;font-size:13px;font-weight:500;text-align:center;padding:10px 16px}
.cu-header-wrap{background:#F6F5F1;border-bottom:1px solid #ECE4D9}
.cu-header{background:#F6F5F1;padding:14px 24px;display:flex;align-items:center;gap:6px}
.cu-header--home{flex-direction:row;justify-content:space-between;max-width:1120px;margin:0 auto;box-sizing:border-box}
.cu-header__logo{display:block;height:56px;width:auto}
.cu-header__nav{display:flex;align-items:center;gap:18px}
.cu-header__link{display:inline-flex;align-items:center;min-height:44px;color:#26170F;font-weight:600;font-size:15px;text-decoration:none}
.cu-header__link:hover{text-decoration:underline;text-underline-offset:3px}
.cu-header__cta{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;border-radius:999px;background:#1F5A14;color:#FFFFFF;font-weight:700;font-size:15px;text-decoration:none}
.cu-header__cta:hover{background:#2A7A1C}
.cu-header__cta:focus-visible,.cu-header__home:focus-visible,.cu-header__link:focus-visible{outline:3px solid #2F7A1F;outline-offset:2px}
@media (max-width:600px){.cu-header__logo{height:44px}.cu-header{padding:12px 16px}}
.cu-header__link,.cu-header__cta{white-space:nowrap}
@media (max-width:480px){.cu-header__cta{padding:0 16px;font-size:14px}.cu-header__nav{gap:12px}.cu-header__link{font-size:14px}}
@media (max-width:400px){.cu-header__logo{height:36px}}

/* Footer: cu-landing.css styles it; outside .cu-page it needs the font */
.cu-footer{font-family:var(--font-body-family)}

/* Policy pages (sections/page.liquid) */
.cu-policy{padding:56px 24px 72px}
.cu-policy__in{max-width:760px;margin:0 auto}
.cu-policy__title{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;color:#26170F;font-size:40px;line-height:1.1;margin:0 0 24px}
.cu-prose{font-size:16px;line-height:1.65;color:#222222}
.cu-prose>*+*{margin-top:16px}
.cu-prose h2{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;color:#8F5A10;font-size:24px;line-height:1.2;margin-top:40px}
.cu-prose h3{font-weight:700;color:#26170F;font-size:18px;margin-top:28px}
.cu-prose ul,.cu-prose ol{padding-left:24px}
.cu-prose ul{list-style:disc}
.cu-prose ol{list-style:decimal}
.cu-prose li+li{margin-top:8px}
.cu-prose a{color:#1F5A14;text-decoration:underline;text-underline-offset:2px}
.cu-prose a:hover{color:#2A7A1C}
.cu-prose strong{font-weight:700;color:#111111}
.cu-prose table{width:100%;border-collapse:collapse;font-size:15px;display:block;overflow-x:auto}
.cu-prose th,.cu-prose td{text-align:left;vertical-align:top;padding:10px 12px;border:1px solid #E3DBCF}
.cu-prose th{background:#FAF5EE;font-weight:700;color:#26170F}
@media (max-width:600px){.cu-policy{padding:36px 16px 56px}.cu-policy__title{font-size:32px}.cu-prose h2{font-size:21px}}

/* 404 (sections/404.liquid) */
.cu-404{padding:96px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.cu-404__title{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;color:#26170F;font-size:44px;line-height:1.1;margin:0}
.cu-404__text{font-size:17px;color:#222222;margin:0 0 8px;max-width:520px}
.cu-404 .cu-btn{align-self:center}
.cu-404__home{color:#1F5A14;font-weight:600;min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:2px}
@media (max-width:600px){.cu-404{padding:64px 16px}.cu-404__title{font-size:34px}}

/* Account and cart headings (Sunrise sections on the default layout) */
#main h1,.cu-cart-title{font-family:var(--font-heading-family);font-weight:600;text-transform:uppercase;letter-spacing:.01em;color:#26170F}
.cu-cart-title{font-size:28px}

/* Sign-in page (sections/login.liquid): chooser (no hash), #recover set password, #login log in */
#login{display:none}
#login:target{display:flex}
#recover:target~#cu-start,#login:target~#cu-start{display:none}
.cu-acct{display:flex;flex-direction:column;gap:16px;width:100%;max-width:420px;margin:0 auto}
#main .cu-acct__title{font-size:32px;line-height:1.1;margin:0}
.cu-acct__text,.cu-acct__help,.cu-acct__sent p{font-size:16px;line-height:1.6;color:#222222;margin:0}
.cu-acct__help{font-size:15px;margin-top:8px}
.cu-acct a:not(.cu-btn){color:#1F5A14;text-decoration:underline;text-underline-offset:2px}
.cu-acct__btn{align-self:stretch;justify-content:center;text-align:center;border:0;cursor:pointer;font-family:inherit;padding:12px 24px;line-height:1.3}
.cu-acct__btn:disabled{opacity:.7;cursor:default}
.cu-btn--ghost{background:#FFFFFF;color:#1F5A14;box-shadow:inset 0 0 0 2px #1F5A14}
.cu-btn--ghost:hover{background:#F2F7EF;color:#1F5A14}
.cu-acct__form{display:flex;flex-direction:column;gap:8px}
.cu-acct__label{font-size:15px;font-weight:600;color:#26170F}
.cu-acct__input{min-height:48px;padding:10px 12px;font-size:16px;border:1px solid #8A857A;border-radius:6px;background:#FFFFFF;color:#111111;margin-bottom:8px}
.cu-acct__input:focus{outline:3px solid #2F7A1F;outline-offset:1px}
.cu-acct__error{color:#B3261E;font-size:15px;margin:0}
.cu-acct__sent{display:flex;flex-direction:column;gap:12px;padding:16px;border:2px solid #1F5A14;border-radius:8px;background:#FAF5EE}
.cu-acct__sent[hidden],.cu-acct__form[hidden],.cu-acct__error[hidden]{display:none}
.cu-acct__link{font-weight:600;min-height:44px;display:inline-flex;align-items:center;align-self:center}
@media (max-width:600px){#main .cu-acct__title{font-size:28px}}