/* The site forms (brief of 21 Oct 2026): the sheet (trial signup, Help me
   choose, quote, Buy now), the email panel and the call popover. Used on /
   and on /es/ (whose own styles are redesign.css), so it carries its own
   tokens: the Aegean set from DESIGN.md.

   - On a phone the sheet is full height; from 640px it is a centred dialog.
   - Labels sit above their fields (never placeholder-only); every input,
     select and textarea is 16px, so iOS does not zoom in.
   - Back / Next are sticky at the bottom, above the home bar
     (env(safe-area-inset-bottom)), with room under the last field.
   - Every control is at least 44 x 44 on a touch screen (round 6d), and a
     little denser with a mouse.
   - Steps rise 8px and fade in; reduced motion and Motion off: no movement.
   - Contrast: ink #14201F on shell #FBF8F2 15:1; muted #4F5A57 6.6:1;
     white on lagoon #136B80 6.1:1; errors #A93A22 5.9:1. */

.agkf-sheet, .agkf-pop {
  --f-ink: #14201F; --f-muted: #4F5A57; --f-shell: #FBF8F2; --f-sand: #F4EEE3; --f-line: #DCD0BB; --f-lagoon: #136B80; --f-lagoon-hover: #0E5869;
  --f-wash: #EAF3F6; --f-gold: #B8893A; --f-err: #A93A22; --f-ok: #1F6B44;
  --f-sans: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-display: var(--f-sans);
  --f-ease: cubic-bezier(.2, .8, .2, 1);
  --f-hit: 44px;
  color: var(--f-ink); font-family: var(--f-sans); font-size: 16px; line-height: 1.45; -webkit-text-size-adjust: 100%;
}
html.agkf-open { overflow: hidden; }

/* ---- the sheet */
.agkf-sheet { padding: 0; border: 0; margin: 0; width: 100%; max-width: 100%; height: 100%; max-height: 100%; background: transparent; overflow: visible; }
.agkf-sheet::backdrop { background: rgba(10, 51, 70, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.agkf-sheet[open] { display: flex; align-items: stretch; justify-content: center; }
.agkf-panel { position: relative; display: flex; flex-direction: column; width: 100%; height: 100%; background: var(--f-shell); padding-top: env(safe-area-inset-top, 0px); }
@media (min-width: 640px) {
  .agkf-sheet[open] { align-items: center; }
  .agkf-panel { width: min(600px, calc(100% - 48px)); height: auto; max-height: min(860px, calc(100% - 48px)); border-radius: 22px; box-shadow: 0 40px 90px -30px rgba(10, 51, 70, .6), 0 0 0 1px rgba(20, 32, 31, .08); overflow: hidden; padding-top: 0; }
}
.agkf-preview { margin: 0; padding: 8px 16px; background: var(--f-gold); color: #14201F; font: 600 .875rem/1.3 var(--f-sans); text-align: center; letter-spacing: .01em; }
.agkf-head { display: flex; align-items: flex-start; gap: 12px; padding: 16px 16px 10px 20px; }
.agkf-titles { flex: 1; min-width: 0; }
.agkf-step { margin: 0 0 2px; font-size: .8125rem; font-weight: 600; color: var(--f-muted); letter-spacing: .04em; text-transform: uppercase; }
.agkf-title { margin: 0; font: 600 1.5rem/1.15 var(--f-display); letter-spacing: -.025em; color: var(--f-ink); }
.agkf-x { flex: none; display: grid; place-items: center; width: var(--f-hit); height: var(--f-hit); margin: -6px -6px 0 0; border: 0; border-radius: 999px; background: transparent; color: var(--f-ink); cursor: pointer; }
.agkf-x svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.agkf-x:hover { background: rgba(20, 32, 31, .06); }
.agkf-bar { height: 4px; margin: 0 20px 4px; border-radius: 4px; background: rgba(20, 32, 31, .1); overflow: hidden; }
.agkf-bar[hidden] { display: none; }
.agkf-bar span { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--f-lagoon); transition: width .4s var(--f-ease); }
.agkf-body { flex: 1; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 12px 20px 32px; scroll-padding-bottom: 24px; }
.agkf-view { transition: opacity .32s var(--f-ease), transform .32s var(--f-ease); }
.agkf-view.agkf-in { opacity: 0; transform: translateY(8px); }
@media (prefers-reduced-motion: reduce) { .agkf-view, .agkf-bar span { transition: none; } }
html.motion-off .agkf-view, html.motion-off .agkf-bar span { transition: none; }
.agkf-h { margin: 4px 0 6px; font: 600 1.25rem/1.25 var(--f-sans); color: var(--f-ink); }
.agkf-sheet .agkf-h:focus, .agkf-sheet .agkf-title:focus, .agkf-pop .agkf-pop-title:focus { outline: none; box-shadow: none; }
.agkf-sub { margin: 0 0 16px; color: var(--f-muted); }
.agkf-foot { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--f-shell); border-top: 1px solid var(--f-line); }
.agkf-foot[hidden] { display: none; }
.agkf-foot .agkf-btn { flex: 1 1 auto; }
@media (min-width: 640px) { .agkf-foot .agkf-btn { flex: 0 0 auto; } }
.agkf-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
.agkf-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---- buttons and links */
.agkf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px; border: 1px solid transparent; font: 600 1rem/1.1 var(--f-sans); text-decoration: none; cursor: pointer; transition: background-color .2s var(--f-ease), transform .16s var(--f-ease); -webkit-tap-highlight-color: transparent; }
.agkf-btn:active { transform: scale(.98); }
.agkf-btn[disabled] { opacity: .6; cursor: progress; }
.agkf-primary { background: var(--f-lagoon); color: #fff; }
.agkf-primary:hover { background: var(--f-lagoon-hover); }
.agkf-ghost { background: transparent; color: var(--f-ink); border-color: rgba(20, 32, 31, .35); }
.agkf-ghost:hover { border-color: var(--f-ink); background: rgba(20, 32, 31, .04); }
.agkf-done { background: var(--f-ok); }
.agkf-link { display: inline-flex; align-items: center; min-height: var(--f-hit); padding: 0; border: 0; background: none; color: var(--f-lagoon); font: 600 1rem/1.3 var(--f-sans); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.agkf-sheet a, .agkf-pop a:not(.agkf-btn) { color: var(--f-lagoon); }
/* the page's own ring follows the page colour (aegean.css); here, on shell, it is ink */
.agkf-sheet :focus-visible, .agkf-pop :focus-visible { outline: 2px solid var(--f-gold); outline-offset: 3px; box-shadow: 0 0 0 4px transparent, 0 0 0 6px var(--f-ink); }
.agkf-aside { margin: 8px 0 0; }
.agkf-btns { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---- fields */
.agkf-field { margin: 0 0 18px; border: 0; padding: 0; min-width: 0; }
.agkf-label { display: block; margin: 0 0 6px; padding: 0; font-weight: 600; font-size: .9375rem; color: var(--f-ink); }
.agkf-opt { font-weight: 400; color: var(--f-muted); }
.agkf-hint { display: block; margin: -2px 0 6px; font-size: .875rem; color: var(--f-muted); }
.agkf-field input:not([type="checkbox"]):not([type="radio"]), .agkf-field select, .agkf-field textarea {
  display: block; width: 100%; box-sizing: border-box; min-height: 48px; padding: 10px 14px; border: 1px solid rgba(20, 32, 31, .32); border-radius: 12px; background: #fff; color: var(--f-ink);
  font: 400 16px/1.4 var(--f-sans); -webkit-appearance: none; appearance: none;
}
.agkf-field select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2314201F' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 18px; }
.agkf-field textarea { min-height: 96px; resize: vertical; }
.agkf-field input:focus, .agkf-field select:focus, .agkf-field textarea:focus { border-color: var(--f-lagoon); box-shadow: 0 0 0 3px rgba(19, 107, 128, .2); outline: none; }
.agkf-bad input:not([type="checkbox"]):not([type="radio"]), .agkf-bad select, .agkf-bad textarea { border-color: var(--f-err); }
.agkf-err { margin: 6px 0 0; color: var(--f-err); font-size: .9375rem; font-weight: 500; }
.agkf-err:empty { display: none; }
.agkf-row { display: grid; gap: 0 14px; }
@media (min-width: 520px) { .agkf-row { grid-template-columns: 1fr 1fr; } }
.agkf-choices { display: grid; gap: 8px; }
.agkf-choices legend { margin-bottom: 8px; }
.agkf-choice, .agkf-check { position: relative; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 10px 14px; border: 1px solid rgba(20, 32, 31, .22); border-radius: 12px; background: #fff; cursor: pointer; }
.agkf-choice input, .agkf-check input, .agkf-time input { flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--f-lagoon); }
.agkf-choice:has(input:checked) { border-color: var(--f-lagoon); background: var(--f-wash); box-shadow: inset 0 0 0 1px var(--f-lagoon); }
.agkf-choice-text { display: grid; gap: 2px; }
.agkf-meta { font-size: .875rem; color: var(--f-muted); }
.agkf-cards .agkf-choice { padding: 14px 16px; }
.agkf-cards .agkf-choice-text > span:first-child { font-weight: 600; font-size: 1.0625rem; }
.agkf-check { border: 0; padding: 4px 0; background: none; align-items: flex-start; }
.agkf-check input { margin-top: 2px; }
.agkf-note { margin: -6px 0 18px; padding: 12px 14px; border-radius: 12px; background: #FBEFE7; border: 1px solid #E9C9B4; }
.agkf-note p { margin: 0 0 10px; }
.agkf-note[hidden], [data-show][hidden], .agkf-callme[hidden], .agkf-slots[hidden], .agkf-held[hidden] { display: none; }
.agkf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- the setup call */
.agkf-wait { color: var(--f-muted); }
.agkf-slot-list fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.agkf-day { margin: 0 0 14px; }
.agkf-dayname { margin: 0 0 8px; font-weight: 600; }
.agkf-times { display: flex; flex-wrap: wrap; gap: 8px; }
.agkf-time { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px; border: 1px solid rgba(20, 32, 31, .24); border-radius: 999px; background: #fff; cursor: pointer; font-variant-numeric: tabular-nums; }
.agkf-time:has(input:checked) { border-color: var(--f-lagoon); background: var(--f-wash); box-shadow: inset 0 0 0 1px var(--f-lagoon); }
.agkf-time-wide { width: 100%; border-radius: 12px; }

/* ---- review and thanks */
.agkf-review { margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--f-line); border-radius: 14px; background: #fff; }
.agkf-review-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.agkf-review h4, .agkf-next h4, .agkf-booked h4, .agkf-fwd h4 { margin: 0; font-size: 1rem; }
.agkf-review dl { margin: 4px 0 0; display: grid; gap: 6px; }
.agkf-review dl div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 10px; }
.agkf-review dt { color: var(--f-muted); }
.agkf-review dd { margin: 0; overflow-wrap: anywhere; }
.agkf-terms { margin: 4px 0 16px; padding-left: 20px; color: var(--f-ink); }
.agkf-terms li { margin: 0 0 6px; }
.agkf-held { margin: 12px 0; padding: 14px; border-radius: 14px; background: var(--f-wash); }
.agkf-held p { margin: 0 0 10px; }
.agkf-next, .agkf-booked, .agkf-fwd { margin: 0 0 18px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid var(--f-line); }
.agkf-next ul, .agkf-fwd ol { margin: 8px 0 0; padding-left: 20px; }
.agkf-next li, .agkf-fwd li { margin: 0 0 6px; }
.agkf-when { margin: 6px 0 10px; font-weight: 600; font-size: 1.0625rem; }
.agkf-cal { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.agkf-chip { display: inline-flex; align-items: center; min-height: var(--f-hit); padding: 0 16px; border-radius: 999px; border: 1px solid rgba(20, 32, 31, .3); color: var(--f-ink) !important; text-decoration: none; font-weight: 600; }
.agkf-chip:hover { border-color: var(--f-ink); }
.agkf-unverified { margin: 8px 0 0; font-size: .875rem; color: var(--f-muted); }
/* the forwarding steps (forwarding.js, from the forwarding guide) */
.agkf-fwd ul { margin: 6px 0 0; padding-left: 20px; }
.agkf-fwd p { margin: 8px 0 0; }
.agkf-fwd-rule { font-weight: 600; }
.agkf-fwd-sec { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--f-line); }
.agkf-fwd-sec h5 { margin: 0; font-size: .9375rem; font-weight: 600; }
.agkf-fwd-h { margin: 10px 0 0 !important; font-size: .875rem; font-weight: 600; color: var(--f-muted); text-transform: uppercase; letter-spacing: .04em; }
.agkf-fwd code { font: 600 .9375rem/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 1px 5px; border-radius: 6px; background: var(--f-wash); color: var(--f-ink); overflow-wrap: anywhere; }
.agkf-unverified-lines li { color: var(--f-ink); }
.agkf-unverified-lines { border-left: 3px solid var(--f-gold); padding-left: 14px !important; list-style: none; }
.agkf-fine { margin: 0 0 12px; font-size: .9375rem; color: var(--f-muted); }

/* ---- Help me choose: the result */
.agkf-result { padding: 18px; border-radius: 16px; background: #fff; border: 1px solid var(--f-line); }
.agkf-result p { margin: 0 0 10px; }
.agkf-eyebrow { font-size: .8125rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--f-muted); }
.agkf-plan { font: 600 1.625rem/1.1 var(--f-display); letter-spacing: -.03em; }
.agkf-price { font-weight: 600; color: var(--f-lagoon); }
.agkf-minutes, .agkf-lister { padding-top: 10px; border-top: 1px solid var(--f-line); color: var(--f-ink); }
.agkf-mock { padding: 18px; border-radius: 16px; border: 1px dashed var(--f-lagoon); background: #fff; }

/* ---- the email panel and the call popover */
.agkf-pop { position: fixed; z-index: 2147483600; box-sizing: border-box; padding: 18px 18px 16px; border-radius: 18px; background: var(--f-shell); box-shadow: 0 30px 70px -24px rgba(10, 51, 70, .55), 0 0 0 1px rgba(20, 32, 31, .1); }
.agkf-pop p { margin: 0 0 12px; }
.agkf-pop .agkf-preview { margin: -18px -18px 14px; border-radius: 18px 18px 0 0; }
.agkf-pop-title { margin: 0 44px 8px 0; font: 600 1.125rem/1.3 var(--f-sans); outline: none; }
.agkf-pop-x { position: absolute; top: 8px; right: 8px; margin: 0; }
.agkf-addr { font-size: 1.125rem; font-weight: 600; user-select: all; -webkit-user-select: all; overflow-wrap: anywhere; }
.agkf-num { font-variant-numeric: tabular-nums; font-size: 1.375rem; }
.agkf-more { display: grid; justify-items: start; margin: 4px 0 0 !important; }
.agkf-pop-sheet { left: 12px !important; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); top: auto !important; width: auto !important; }

/* ---- with a mouse: a little denser (round 6d keeps 44 on touch) */
@media (pointer: fine) {
  .agkf-btn { min-height: 44px; }
  .agkf-field input:not([type="checkbox"]):not([type="radio"]), .agkf-field select, .agkf-choice, .agkf-time { min-height: 44px; }
  .agkf-link, .agkf-chip { min-height: 36px; }
  .agkf-x { width: 40px; height: 40px; }
}
@media (pointer: coarse) {
  .agkf-link, .agkf-chip, .agkf-x { min-height: 44px; min-width: 44px; }
}

/* ---- the page's own new buttons (pricing cards, Help me choose) */
.plan-actions { display: grid; gap: 10px; margin-top: auto; }
.plan-actions .pill { width: 100%; }
.plan .plan-call { justify-content: center; margin-top: 2px; }
.plans-help { margin: 20px 0 0; text-align: center; }
.plan-featured .pill-ghost { color: #EAF3F6; border-color: rgba(226, 240, 246, .5); }
.plan-featured .pill-ghost:hover { border-color: #EAF3F6; background: rgba(226, 240, 246, .08); }
.faq .faq-choose { margin-top: 8px; }
.plans-help[hidden], [data-buy-now][hidden], [data-forms-only][hidden] { display: none !important; }