/* /resources: Win Without Breaking, the library (Jose, 2026-11-03; docs/rebrand/v2/resources/package, Proposal A).
   Layout and component styles are inline in the page, as designed (src/rebrand/v2/resources). This file holds the
   package's page basics (its styles.css), scoped to the page, the fonts, the tabs' two states and the sign-up's
   answer. The site chrome keeps its own stylesheet (site-chrome.css, loaded last). */
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(/v2/assets/fonts/inter-tight-400.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:swap;src:url(/v2/assets/fonts/inter-tight-500.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600;font-display:swap;src:url(/v2/blog/fonts/inter-tight-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:700;font-display:swap;src:url(/v2/assets/fonts/inter-tight-700.woff2) format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url(/v2/assets/fonts/fraunces-var.woff2) format('woff2')}

body.res-page{margin:0;background:#f4f4f2;-webkit-font-smoothing:antialiased}
.res,.res *,.res *::before,.res *::after{box-sizing:border-box}
.res a{color:#080a09}
.res a:hover{color:#c51d43}
.res img{max-width:100%}
.res button,.res input{font:inherit}
.res :focus-visible{outline:3px solid #c51d43;outline-offset:2px}
.res [role="tablist"]{scrollbar-width:none}
.res [role="tablist"]::-webkit-scrollbar{display:none}

/* The tabs: the package's selected and unselected looks. */
.res .res-tab{background:transparent;color:#080a09}
.res .res-tab .res-tab-ic{background:#e8e9e4}
.res .res-tab[aria-selected="true"]{background:#080a09;color:#f4f4f2}
.res .res-tab[aria-selected="true"] .res-tab-ic{background:#e3fe52}
/* Without scripts every panel shows; with them (html.res-js, set in the head) only the one marked is-on. */
.res-js .res .res-panel{display:none}
.res-js .res .res-panel.is-on{display:block}
.res .res-panel:focus{outline:none}
.res .res-panel:focus-visible{outline:3px solid #c51d43;outline-offset:6px;border-radius:24px}

/* The retreat's booking button: the chrome's cta-call owns its colors and radius; the design's button shape here. */
.res a.cta-call{display:inline-flex;align-items:center;height:44px;padding:0 20px;font-size:16px;font-weight:700;text-decoration:none}

/* The sign-up's answer (Kit's), under the form, on the black hero and the black close. */
.res .res-sub-msg,.res .res-copy-msg{margin:10px 0 0;min-height:22px;font-size:15px;line-height:22px;color:#f4f4f2}
.res .res-sub-msg.is-error{color:#ffb4c4}
.res .res-sub button[disabled]{opacity:.7;cursor:wait}
.res .res-copy-msg{margin:0;min-height:0}

@media (prefers-reduced-motion: reduce){.res *{transition:none !important;animation:none !important}}