/* Alicia McKay theme: one stylesheet (Flair base + post system + brand), unused rules removed. */
/* ---- app.css ---- */
/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scroll-snap-strictness:proximity;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-content:""}}}@layer theme{:root{--color-yellow-400:oklch(85.2% .199 91.936);--color-green-500:oklch(72.3% .219 149.579);--color-rose-500:oklch(64.5% .246 16.439);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-xl:36rem;--container-2xl:42rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-6xl:3.75rem;--text-6xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--text-9xl:8rem;--text-9xl--line-height:1;--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--leading-tight:1.25;--radius-xs:.125rem;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--drop-shadow-xl:0 9px 7px #0000001a;--animate-spin:spin 1s linear infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}h1,h2,h3,h4{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:rgba(0,0,0,0);border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:rgba(0,0,0,0);border-radius:0}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}*,:after,:before,::backdrop{border-color:var(--color-border,currentcolor)}::file-selector-button{border-color:var(--color-border,currentcolor)}input:where([type=text]),input:where([type=email]),input:where([type=url]),input:where([type=number]),input:where([type=date]),input:where([type=month]),input:where([type=search]),input:where([type=time]),input:where([type=week]),select:where([multiple]),textarea,select{-webkit-appearance:none;appearance:none;--tw-shadow:0 0 #0000;background-color:#fff;border-width:1px;border-color:#6a7282;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem}input::placeholder,textarea::placeholder{color:#6a7282;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em}::-webkit-date-and-time-value{text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-month-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-day-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-hour-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-minute-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-second-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-millisecond-field{padding-top:0;padding-bottom:0}::-webkit-datetime-edit-meridiem-field{padding-top:0;padding-bottom:0}select{-webkit-print-color-adjust:exact;print-color-adjust:exact;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='oklch(55.1%25 0.027 264.364)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem}select:where([multiple]),select:where([size]:not([size="1"])){background-image:initial;background-position:initial;background-repeat:unset;background-size:initial;-webkit-print-color-adjust:unset;print-color-adjust:unset;padding-right:.75rem}input:where([type=checkbox]),input:where([type=radio]){-webkit-appearance:none;appearance:none;-webkit-print-color-adjust:exact;print-color-adjust:exact;vertical-align:middle;-webkit-user-select:none;user-select:none;color:#155dfc;--tw-shadow:0 0 #0000;background-color:#fff;background-origin:border-box;border-width:1px;border-color:#6a7282;flex-shrink:0;width:1rem;height:1rem;padding:0;display:inline-block}input:where([type=checkbox]){border-radius:0}input:where([type=radio]){border-radius:100%}input:where([type=checkbox]):focus,input:where([type=radio]):focus{outline-offset:2px;--tw-ring-inset:var(--tw-empty, );--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:oklch(54.6% .245 262.881);--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000}input:where([type=checkbox]):checked,input:where([type=radio]):checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:rgba(0,0,0,0)}input:where([type=checkbox]):checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e")}@media (forced-colors:active){input:where([type=checkbox]):checked{-webkit-appearance:auto;appearance:auto}}input:where([type=radio]):checked{background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e")}@media (forced-colors:active){input:where([type=radio]):checked{-webkit-appearance:auto;appearance:auto}}input:where([type=checkbox]):checked:hover,input:where([type=checkbox]):checked:focus,input:where([type=radio]):checked:hover,input:where([type=radio]):checked:focus{background-color:currentColor;border-color:rgba(0,0,0,0)}input:where([type=checkbox]):indeterminate{background-color:currentColor;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:rgba(0,0,0,0)}@media (forced-colors:active){input:where([type=checkbox]):indeterminate{-webkit-appearance:auto;appearance:auto}}input:where([type=checkbox]):indeterminate:hover,input:where([type=checkbox]):indeterminate:focus{background-color:currentColor;border-color:rgba(0,0,0,0)}input:where([type=file]){background:unset;border-color:inherit;font-size:unset;line-height:inherit;border-width:0;border-radius:0;padding:0}input:where([type=file]):focus{outline:1px solid buttontext;outline:1px auto -webkit-focus-ring-color}}@layer components;@layer utilities{.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.start{inset-inline-start:var(--spacing)}.top-0{top:calc(var(--spacing) * 0)}.-bottom-16{bottom:calc(var(--spacing) * -16)}.left-0{left:calc(var(--spacing) * 0)}.-z-1{z-index:-1}.z-1000{z-index:1000}.z-1100{z-index:1100}.col-span-3{grid-column:span 3/span 3}.col-span-full{grid-column:1/-1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.mx-auto{margin-inline:auto}.my-12{margin-block:calc(var(--spacing) * 12)}.prose{color:var(--tw-prose-body);max-width:65ch}.prose{--tw-prose-body:oklch(37.3% .034 259.733);--tw-prose-headings:oklch(21% .034 264.665);--tw-prose-lead:oklch(44.6% .03 256.802);--tw-prose-links:oklch(21% .034 264.665);--tw-prose-bold:oklch(21% .034 264.665);--tw-prose-counters:oklch(55.1% .027 264.364);--tw-prose-bullets:oklch(87.2% .01 258.338);--tw-prose-hr:oklch(92.8% .006 264.531);--tw-prose-quotes:oklch(21% .034 264.665);--tw-prose-quote-borders:oklch(92.8% .006 264.531);--tw-prose-captions:oklch(55.1% .027 264.364);--tw-prose-kbd:oklch(21% .034 264.665);--tw-prose-kbd-shadows:oklab(21% -.00316127 -.0338527/.1);--tw-prose-code:oklch(21% .034 264.665);--tw-prose-pre-code:oklch(92.8% .006 264.531);--tw-prose-pre-bg:oklch(27.8% .033 256.848);--tw-prose-th-borders:oklch(87.2% .01 258.338);--tw-prose-td-borders:oklch(92.8% .006 264.531);--tw-prose-invert-body:oklch(87.2% .01 258.338);--tw-prose-invert-headings:#fff;--tw-prose-invert-lead:oklch(70.7% .022 261.325);--tw-prose-invert-links:#fff;--tw-prose-invert-bold:#fff;--tw-prose-invert-counters:oklch(70.7% .022 261.325);--tw-prose-invert-bullets:oklch(44.6% .03 256.802);--tw-prose-invert-hr:oklch(37.3% .034 259.733);--tw-prose-invert-quotes:oklch(96.7% .003 264.542);--tw-prose-invert-quote-borders:oklch(37.3% .034 259.733);--tw-prose-invert-captions:oklch(70.7% .022 261.325);--tw-prose-invert-kbd:#fff;--tw-prose-invert-kbd-shadows:#ffffff1a;--tw-prose-invert-code:#fff;--tw-prose-invert-pre-code:oklch(87.2% .01 258.338);--tw-prose-invert-pre-bg:#00000080;--tw-prose-invert-th-borders:oklch(44.6% .03 256.802);--tw-prose-invert-td-borders:oklch(37.3% .034 259.733);font-size:1rem;line-height:1.75}.prose-lg{font-size:1.125rem;line-height:1.77778}.-mt-0\.5{margin-top:calc(var(--spacing) * -.5)}.-mt-6{margin-top:calc(var(--spacing) * -6)}.-mt-\[1px\]{margin-top:-1px}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-16{margin-top:calc(var(--spacing) * 16)}.mt-\[1px\]{margin-top:1px}.-mr-1{margin-right:calc(var(--spacing) * -1)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.mb-12{margin-bottom:calc(var(--spacing) * 12)}.mb-24{margin-bottom:calc(var(--spacing) * 24)}.-ml-1{margin-left:calc(var(--spacing) * -1)}.ml-1{margin-left:calc(var(--spacing) * 1)}.ml-2{margin-left:calc(var(--spacing) * 2)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.aspect-1\/1{aspect-ratio:1}.aspect-16\/9{aspect-ratio:16/9}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-\[14px\]{width:14px;height:14px}.h-\(--logo-h-mobile\){height:var(--logo-h-mobile)}.h-\[5px\]{height:5px}.h-auto{height:auto}.h-dvh{height:100dvh}.h-full{height:100%}.w-\(--logo-w-mobile\){width:var(--logo-w-mobile)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-container{max-width:var(--container-width)}.max-w-content{max-width:var(--content-width)}.max-w-md{max-width:var(--container-md)}.min-w-32{min-width:calc(var(--spacing) * 32)}.flex-1{flex:1}.flex-2{flex:2}.-translate-y-4{--tw-translate-y:calc(var(--spacing) * -4);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-1{--tw-translate-y:calc(var(--spacing) * 1);translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-180{rotate:180deg}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.appearance-none{-webkit-appearance:none;appearance:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-\[repeat\(auto-fill\,minmax\(calc\(16rem\+2vw\)\,1fr\)\)\]{grid-template-columns:repeat(auto-fill,minmax(calc(16rem + 2vw),1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-10{gap:calc(var(--spacing) * 10)}.gap-x-8{column-gap:calc(var(--spacing) * 8)}.gap-y-12{row-gap:calc(var(--spacing) * 12)}.self-start{align-self:flex-start}.justify-self-center{justify-self:center}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-x-scroll{overflow-x:scroll}.overflow-y-auto{overflow-y:auto}.scroll-smooth{scroll-behavior:smooth}.rounded-\[6px\]{border-radius:6px}.rounded-\[inherit\]{border-radius:inherit}.rounded-full{border-radius:3.40282e38px}.rounded-theme{border-radius:var(--radius)}.rounded-theme-lg{border-radius:var(--radius-lg)}.rounded-theme-md{border-radius:var(--radius-md)}.rounded-theme-sm{border-radius:var(--radius-sm)}.rounded-theme-xl{border-radius:var(--radius-xl)}.rounded-theme-xs{border-radius:var(--radius-xs)}.rounded-theme-xxs{border-radius:var(--radius-xxs)}.border{border-style:var(--tw-border-style);border-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.border-none{--tw-border-style:none;border-style:none}.border-brd{border-color:var(--color-border)}.border-opac{border-color:rgba(0,0,0,.05)}.border-success\!{border-color:var(--color-success)!important}.border-transparent{border-color:rgba(0,0,0,0)}.bg-accent{background-color:var(--color-accent)}.bg-bgr{background-color:var(--color-background)}.bg-bgr-reverse{background-color:var(--color-background-reverse)}.bg-bgr-tone{background-color:var(--color-background-tone)}.bg-brand{background-color:var(--ghost-accent-color)}.bg-transparent{background-color:rgba(0,0,0,0)}.bg-white{background-color:var(--color-white)}.fill-yellow-400{fill:var(--color-yellow-400)}.stroke-2{stroke-width:2px}.stroke-\[2\.5\]{stroke-width:2.5px}.object-cover{object-fit:cover}.p-1{padding:calc(var(--spacing) * 1)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-2\.5{padding-right:calc(var(--spacing) * 2.5)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-2\.5{padding-bottom:calc(var(--spacing) * 2.5)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.text-center{text-align:center}.text-left{text-align:left}.font-headings{font-family:var(--font-headings)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[0\.8rem\]{font-size:.8rem}.leading-none{--tw-leading:1;line-height:1}.leading-none\!{--tw-leading:1!important;line-height:1!important}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-light{--tw-font-weight:var(--font-weight-light);font-weight:var(--font-weight-light)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.text-nowrap{text-wrap:nowrap}.whitespace-nowrap{white-space:nowrap}.text-accent{color:var(--color-accent)}.text-black{color:var(--color-black)}.text-brand-contrast{color:var(--color-brand-contrast)}.text-error{color:var(--color-error)}.text-green-500{color:var(--color-green-500)}.text-rose-500{color:var(--color-rose-500)}.text-success{color:var(--color-success)}.text-typ{color:var(--color-typography)}.text-typ-reverse{color:var(--color-typography-reverse)}.text-typ-tone{color:var(--color-typography-tone)}.text-yellow-400{color:var(--color-yellow-400)}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.subpixel-antialiased{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.shadow-btn{--tw-shadow:inset 0 0 0 1px var(--tw-shadow-color,#fff3), 0 5px 5px 1px var(--tw-shadow-color,hsla(var(--color-brand-hsl) / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-notification{--tw-shadow:0px 0px 1px 0px var(--tw-shadow-color,#0000004d), 0px 51px 40px 0px var(--tw-shadow-color,#0000000d), 0px 15.375px 12.059px 0px var(--tw-shadow-color,#00000008), 0px 6.386px 5.009px 0px var(--tw-shadow-color,#00000008), 0px 2.31px 1.812px 0px var(--tw-shadow-color,#00000005);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-theme{--tw-shadow:var(--shadow);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.blur-sm{--tw-blur:blur(var(--blur-sm));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\]{transition-property:filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.will-change-\[filter\]{will-change:filter}.prose-theme{--tw-prose-body:var(--color-typography-content);--tw-prose-headings:var(--color-typography);--tw-prose-lead:var(--color-typography-content);--tw-prose-links:var(--ghost-accent-color);--tw-prose-bold:var(--color-typography-content);--tw-prose-counters:var(--color-typography-content);--tw-prose-bullets:var(--color-typography-content);--tw-prose-hr:var(--color-border);--tw-prose-quotes:var(--color-typography-content);--tw-prose-quote-borders:var(--ghost-accent-color);--tw-prose-captions:var(--color-typography-content);--tw-prose-code:var(--color-typography-content);--tw-prose-pre-code:var(--color-typography-reverse);--tw-prose-pre-bg:var(--color-typography);--tw-prose-th-borders:var(--color-border);--tw-prose-td-borders:var(--color-border);--tw-prose-invert-body:var(--color-typography-reverse);--tw-prose-invert-headings:var(--color-typography-reverse);--tw-prose-invert-lead:var(--color-typography-reverse);--tw-prose-invert-links:var(--ghost-accent-color);--tw-prose-invert-bold:var(--color-typography-reverse);--tw-prose-invert-counters:var(--color-typography-reverse);--tw-prose-invert-bullets:var(--color-typography-reverse);--tw-prose-invert-hr:var(--color-border-reverse);--tw-prose-invert-quotes:var(--color-typography-reverse);--tw-prose-invert-quote-borders:var(--color-border-reverse);--tw-prose-invert-captions:var(--color-typography-reverse);--tw-prose-invert-code:var(--color-typography-reverse);--tw-prose-invert-pre-code:var(--color-typography-content);--tw-prose-invert-pre-bg:var(--color-typography-reverse);--tw-prose-invert-th-borders:var(--color-border-reverse);--tw-prose-invert-td-borders:var(--color-border-reverse)}.group-\[\.error\]\:visible:is(:where(.group).error *){visibility:visible}.group-\[\.error\]\:flex:is(:where(.group).error *){display:flex}.group-\[\.error\]\:translate-y-0:is(:where(.group).error *){--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-\[\.error\]\:opacity-100:is(:where(.group).error *){opacity:1}.group-\[\.loading\]\:flex:is(:where(.group).loading *){display:flex}.group-\[\.loading\]\:hidden:is(:where(.group).loading *){display:none}.group-\[\.success\]\:visible:is(:where(.group).success *){visibility:visible}.group-\[\.success\]\:flex:is(:where(.group).success *){display:flex}.group-\[\.success\]\:translate-y-0:is(:where(.group).success *){--tw-translate-y:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-\[\.success\]\:opacity-100:is(:where(.group).success *){opacity:1}.before\:absolute:before{content:var(--tw-content);position:absolute}.before\:-inset-x-4:before{content:var(--tw-content);inset-inline:calc(var(--spacing) * -4)}.before\:top-0:before{content:var(--tw-content);top:calc(var(--spacing) * 0)}.before\:left-0:before{content:var(--tw-content);left:calc(var(--spacing) * 0)}.before\:-z-1:before{content:var(--tw-content);z-index:-1}.before\:h-\[1px\]:before{content:var(--tw-content);height:1px}.before\:h-\[calc\(100\%-8px\)\]:before{content:var(--tw-content);height:calc(100% - 8px)}.before\:h-full:before{content:var(--tw-content);height:100%}.before\:w-\[calc\(50\%-4px\)\]:before{content:var(--tw-content);width:calc(50% - 4px)}.before\:w-\[calc\(100\%\+32px\)\]:before{content:var(--tw-content);width:calc(100% + 32px)}.before\:w-full:before{content:var(--tw-content);width:100%}.before\:rounded-theme:before{content:var(--tw-content);border-radius:var(--radius)}.before\:rounded-theme-xxs:before{content:var(--tw-content);border-radius:var(--radius-xxs)}.before\:border:before{content:var(--tw-content);border-style:var(--tw-border-style);border-width:1px}.before\:border-brd:before{content:var(--tw-content);border-color:var(--color-border)}.before\:bg-bgr-tone:before{content:var(--tw-content);background-color:var(--color-background-tone)}.before\:bg-fading:before{content:var(--tw-content);background-image:linear-gradient(to right,transparent,var(--color-border),transparent)}.before\:transition-transform:before{content:var(--tw-content);transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.before\:content-\[attr\(data-discount\)\]:before{--tw-content:attr(data-discount);content:var(--tw-content)}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:bottom-\[-11px\]:after{content:var(--tw-content);bottom:-11px}.after\:left-\[calc\(50\%-16px\)\]:after{content:var(--tw-content);left:calc(50% - 16px)}.after\:h-0\.5:after{content:var(--tw-content);height:calc(var(--spacing) * .5)}.after\:w-8:after{content:var(--tw-content);width:calc(var(--spacing) * 8)}.after\:rounded-t-sm:after{content:var(--tw-content);border-top-left-radius:var(--radius-sm);border-top-right-radius:var(--radius-sm)}.after\:bg-transparent:after{content:var(--tw-content);background-color:rgba(0,0,0,0)}@media (hover:hover){.hover\:bg-bgr-tone:hover{background-color:var(--color-background-tone)}.hover\:bg-brand:hover{background-color:var(--ghost-accent-color)}.hover\:text-brand:hover{color:var(--ghost-accent-color)}.hover\:text-brand-contrast:hover{color:var(--color-brand-contrast)}.hover\:opacity-50:hover{opacity:.5}.hover\:shadow-btn-hover:hover{--tw-shadow:inset 0 0 0 1px var(--tw-shadow-color,#fff3), 0 5px 15px 1px var(--tw-shadow-color,hsla(var(--color-brand-hsl) / .25));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.hover\:brightness-105:hover{--tw-brightness:brightness(105%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.hover\:brightness-110:hover{--tw-brightness:brightness(110%);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.hover\:before\:bg-bgr-tone:hover:before{content:var(--tw-content);background-color:var(--color-background-tone)}}.focus\:border-brand:focus{border-color:var(--ghost-accent-color)}.focus\:ring-0:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-4:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-brand\/20:focus{--tw-ring-color:var(--ghost-accent-color)}@supports (color:color-mix(in lab,red,red)){.focus\:ring-brand\/20:focus{--tw-ring-color:color-mix(in oklab, var(--ghost-accent-color) 20%, transparent)}}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:items-start{align-items:flex-start}.sm\:gap-6{gap:calc(var(--spacing) * 6)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.sm\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.sm\:font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}}@media (min-width:48rem){.md\:prose-lg{font-size:1.125rem;line-height:1.77778}.md\:h-\(--logo-h-desktop\){height:var(--logo-h-desktop)}.md\:w-\(--logo-w-desktop\){width:var(--logo-w-desktop)}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.md\:border{border-style:var(--tw-border-style);border-width:1px}.md\:border-brd{border-color:var(--color-border)}.md\:px-4{padding-inline:calc(var(--spacing) * 4)}.md\:px-5{padding-inline:calc(var(--spacing) * 5)}.md\:px-6{padding-inline:calc(var(--spacing) * 6)}.md\:py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.md\:py-6{padding-block:calc(var(--spacing) * 6)}.md\:py-24{padding-block:calc(var(--spacing) * 24)}.md\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.md\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.md\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.md\:text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.md\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}}@media (min-width:64rem){.lg\:col-span-1{grid-column:span 1/span 1}.lg\:col-span-5{grid-column:span 5/span 5}.lg\:block{display:block}.lg\:hidden{display:none}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.lg\:grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.lg\:p-5{padding:calc(var(--spacing) * 5)}}.\[\&_svg\]\:animate-spin svg{animation:var(--animate-spin)}}:root{--font-system:system-ui, sans-serif;--font-headings:var(--font-system);--font-body:var(--font-system);--container-width:1200px;--content-width:680px;--content-width-wide:960px;--wide-width:1024px;--radius:20px;--radius-xxs:calc(var(--radius) - 8px);--radius-xs:calc(var(--radius) - 4px);--radius-sm:calc(var(--radius) - 2px);--radius-md:calc(var(--radius) + 2px);--radius-lg:calc(var(--radius) + 4px);--radius-xl:calc(var(--radius) + 8px);--logo-h-mobile:28px;--logo-w-mobile:auto;--logo-h-desktop:32px;--logo-w-desktop:auto;--color-brand:var(--ghost-accent-color,#fd3d00);--color-brand-contrast:#fff;--color-accent:var(--ghost-accent-color);--color-error:#fc365e;--color-success:#48c774;--color-typography:#262626;--color-typography-tone:#666;--color-typography-content:#595959;--color-typography-reverse:#f2f2f2;--color-background:#fff;--color-background-tone:#fafafa;--color-background-opac:#ffffffbf;--color-background-reverse:#1f1f1f;--color-border:#e6e6e6;--color-border-reverse:#333;--shadow:0 5px 25px -5px #0000001a}@media (prefers-color-scheme:dark){[data-color-scheme=system]:root{--color-typography:#e6e6e6;--color-typography-tone:#b3b3b3;--color-typography-content:#b3b3b3;--color-typography-reverse:#262626;--color-background:#1a1a1a;--color-background-tone:#1f1f1f;--color-background-opac:#00000080;--color-background-reverse:#fafafa;--color-border:#2e2e2e;--color-border-reverse:#ebebeb;--shadow:0 0px 3px 0px #ffffff1a}}[data-color-scheme=dark]:root{--color-typography:#e6e6e6;--color-typography-tone:#b3b3b3;--color-typography-content:#b3b3b3;--color-typography-reverse:#262626;--color-background:#1a1a1a;--color-background-tone:#1f1f1f;--color-background-opac:#00000080;--color-background-reverse:#fafafa;--color-border:#2e2e2e;--color-border-reverse:#ebebeb;--shadow:0 0px 3px 0px #ffffff1a}body,article.ghost-content{font-family:var(--font-body)}h1,h2,h3,h4{font-family:var(--font-headings)}.icon svg{width:inherit;height:inherit;stroke-width:inherit}form.error [data-msg=error],form.success [data-msg=success]{display:block}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}.no-scrollbar::-webkit-scrollbar{display:none}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scroll-snap-strictness{syntax:"*";inherits:false;initial-value:proximity}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}.ghost-content{--gap: max(2vmin,20px);--main: min(var(--content-width,720px),100% - var(--gap) * 2);--wide: minmax(0,calc((var(--wide-width, 1200px) - var(--content-width, 720px))/2));--full: minmax(var(--gap),1fr);display:grid;grid-template-columns:[full-start] var(--full) [wide-start] var(--wide) [main-start] var(--main) [main-end] var(--wide) [wide-end] var(--full) [full-end];max-width:none;margin-bottom:4rem;word-break:break-word}.ghost-content>*{grid-column:main-start/main-end}.ghost-content .kg-width-wide{grid-column:wide-start/wide-end}.ghost-content .kg-width-full{grid-column:full-start/full-end}.ghost-content .kg-width-regular{grid-column:main-start/main-end}.ghost-content[data-no-overflow]{max-width:100%}.ghost-content[data-no-overflow] .kg-width-wide,.ghost-content[data-no-overflow] .kg-width-full{grid-column:main-start/main-end}.ghost-content .kg-card *:where(h1,h2,h3,h4) p:not([class]){margin:0}.ghost-content>*:not(h1,h2,h3,h4,h5,h6){margin-bottom:0}.ghost-content blockquote{margin:2rem 0 1rem}.ghost-content hr{margin:4rem 0}.ghost-content p+ul,.ghost-content p+ol{margin-top:.25em}.ghost-content *:is(h1,h2,h3,h4)+div.kg-card,.ghost-content *:is(h1,h2,h3,h4)+figure.kg-card,.ghost-content *:is(h1,h2,h3,h4)+figure.kg-card.kg-bookmark-card{margin-top:0}.ghost-content .kg-card{margin:2rem 0 0}.ghost-content figure.kg-card{margin:3rem 0 1rem}.ghost-content .kg-signup-card,.ghost-content .kg-header-card{margin:3rem 0 0}.ghost-content figure.kg-card.kg-bookmark-card{margin:2rem 0 0}.ghost-content .kg-width-full+.kg-width-full{margin-top:0}.ghost-content a:not([class*=kg-],[class*=btn]){text-decoration-thickness:2px}.ghost-content a:not([class*=kg-],[class*=btn]):hover{color:var(--ghost-accent-color)}.ghost-content iframe{max-width:100%}.kg-card img{margin:0}.kg-image-card,.kg-gallery-image{position:relative}.kg-image-card img{margin:0 auto}.kg-blockquote-alt{border-left:0}.kg-video-card video{margin:0}.kg-embed-card .twitter-tweet{margin:10px auto}.ghost-content .kg-button-card a.kg-btn{border-radius:var(--radius);color:var(--color-brand-contrast);font-family:var(--font-body);font-weight:500}.ghost-content .kg-button-card{margin-bottom:1em}.kg-content-wide .kg-signup-card-content{max-width:var(--wide-width);margin:0 auto;padding:0 2rem}.kg-signup-card picture{margin:0}.ghost-content .kg-signup-card-input,.ghost-content .kg-signup-card-button{height:3rem}.ghost-content .kg-signup-card-disclaimer{margin:.5rem 0 0}.kg-content-wide .kg-header-card-content{max-width:var(--wide-width);margin:0 auto;padding:0 2rem}.kg-header-card picture{margin:0}.ghost-content .kg-header-card.kg-v2 .kg-header-card-button{height:3rem}.ghost-content .kg-product-card .kg-product-card-description ol,.ghost-content .kg-product-card .kg-product-card-description p,.ghost-content .kg-product-card .kg-product-card-description ul{opacity:.85}.ghost-content .kg-product-card-container{background:var(--color-background-tone);color:var(--color-typography);border:1px solid var(--color-border);font-family:var(--font-body);box-shadow:none}.ghost-content .kg-bookmark-icon{margin-right:6px}.ghost-content .kg-bookmark-card a.kg-bookmark-container,.ghost-content .kg-bookmark-card a.kg-bookmark-container:hover{background:var(--color-background-tone);color:var(--color-typography);border:1px solid var(--color-border)}.ghost-content .kg-bookmark-content{font-family:var(--font-body)}.ghost-content .kg-audio-card,.ghost-content .kg-file-card a.kg-file-card-container{background:var(--color-background-tone);color:var(--color-typography);border:1px solid var(--color-border);font-family:var(--font-body)}.ghost-content .gh-post-upgrade-cta{margin-top:2rem}.ghost-content .gh-post-upgrade-cta-content{border-radius:var(--radius);color:var(--color-brand-contrast)}.gh-post-upgrade-cta-content h2,.gh-post-upgrade-cta p a{color:var(--color-brand-contrast)!important}.gh-post-upgrade-cta a.gh-btn{background-color:var(--color-brand-contrast)!important}.ghost-content>.kg-card:first-child{margin-top:0}[data-color-scheme=dark] [data-theme=dark],[data-color-scheme=light] [data-theme=light]{background-color:var(--color-background);border-color:var(--color-border);opacity:1}[data-logo=dark]{display:none}[data-color-scheme=dark] [data-logo=dark]+[data-logo=default]{display:none}[data-color-scheme=dark] [data-logo=dark]{display:block}[data-color-scheme=midnight] [data-logo=dark]+[data-logo=default]{display:none}[data-color-scheme=midnight] [data-logo=dark]{display:block}@media (prefers-color-scheme: dark){[data-color-scheme=system] [data-logo=dark]+[data-logo=default]{display:none}[data-color-scheme=system] [data-logo=dark]{display:block}}[data-nav] .is-mainitem>a{padding-right:0}[data-nav] .is-mainitem{padding-right:.5rem}[data-nav=mobile] .is-mainitem{flex-wrap:wrap}[data-nav=desktop] li.nav-current:not(:has(a[href="#"])){background-color:var(--color-background-tone);border-color:var(--color-border)}[data-nav] .is-subitem{display:none}[data-nav] .is-mainitem .is-subitem{display:block}[data-nav-cta]{overflow:hidden}[data-hero-headline] span{color:var(--color-brand)}@media (min-width: 1024px){[data-header].is-scrolled [data-header-brand],[data-header].is-scrolled [data-header-actions]{opacity:0;visibility:hidden}[data-header].is-scrolled [data-header-brand]{transform:translate(-30px)}[data-header].is-scrolled [data-header-actions]{transform:translate(30px)}[data-header].is-scrolled [data-nav-cta]{opacity:100%;position:relative;transform:translate(-100%);padding:6px 16px;width:auto;margin-left:12px}[data-header] [data-nav-cta] span{width:inherit}[data-header].is-scrolled [data-nav-cta]:before{position:absolute;width:1px;height:60%;top:20%;content:"";background-color:var(--color-border);left:-16px}[data-header].is-scrolled>div:before{opacity:0}[data-header].is-scrolled-onload [data-header-brand],[data-header].is-scrolled-onload [data-header-actions]{display:none}[data-header].is-scrolled-onload [data-nav-cta]{transition:none;opacity:100%;position:relative;transform:translate(-100%);padding:6px 16px;width:auto;margin-left:12px}[data-header].is-scrolled-onload>div:before{opacity:0}}[data-featured-side] [data-post-card-excerpt],[data-featured-bottom] [data-post-card-excerpt],[data-featured-side] [data-post-card-authors],[data-featured-bottom] [data-post-card-authors]{display:none}nav[data-featured-tags] a[data-active]{color:var(--color-typography);border-color:var(--color-border);background-color:var(--color-background-tone)}nav[data-featured-tags] a[data-active]:after{background-color:var(--color-typography)}[data-featured-tag] [data-post-card-info],[data-featured-posts] [data-post-card] [data-post-card-featured],[data-featured-pages] [data-post-card-info],[data-featured-pages] [data-post-card-authors]{display:none}[data-plan=monthly] [data-plan-toggle] [data-plan=monthly]{color:var(--color-typography)}[data-plan=monthly] [data-plan-toggle]:before{transform:translate(0)}[data-plan=yearly] [data-plan-toggle] [data-plan=yearly]{color:var(--color-typography)}[data-plan=yearly] [data-plan-toggle]:before{transform:translate(100%)}[data-price],[data-tier-link]{display:none}[data-plan=monthly] [data-price=monthly],[data-plan=yearly] [data-price=yearly]{display:flex}[data-plan=monthly] [data-tier-link=monthly],[data-plan=yearly] [data-tier-link=yearly]{display:block}[data-progress-bar]::-webkit-progress-bar{background:transparent}[data-progress-bar]::-moz-progress-bar{background:var(--ghost-accent-color)}[data-progress-bar]::-webkit-progress-value{background:var(--ghost-accent-color)}header.sticky~main .ghost-content h2,header.sticky~main .ghost-content h3,header.sticky~main .ghost-content h4{scroll-margin-top:90px}.gh-post-upgrade-cta-content{box-shadow:inset 0 0 0 2px rgba(255,255,255,.2);border:2px solid rgba(0,0,0,.05)}.gh-post-upgrade-cta .gh-post-upgrade-cta-content a.gh-btn{border-radius:var(--radius-lg)}[data-toc-toggle=active] .icon-minus,[data-toc-toggle=inactive] .icon-plus{display:block}.toc-list{padding:0;margin:0;max-height:80vh;overflow-y:scroll;line-height:1.25;display:flex;flex-direction:column;gap:2px;-ms-overflow-style:none;scrollbar-width:none}.toc-list::-webkit-scrollbar{display:none}.toc-list-item{line-height:1.2}.toc-list-item a{display:block;padding:6px 10px;border-radius:8px;position:relative}.toc-list-item a:hover{color:var(--ghost-accent-color)}.is-active-li>a{font-weight:500;color:var(--ghost-accent-color)}.is-active-li>a:before{content:"";position:absolute;width:100%;height:100%;top:0;right:0;bottom:0;left:0;border-radius:8px;background-color:var(--ghost-accent-color);opacity:.05}.toc-list .toc-list{list-style:none;border-left:1px solid var(--color-border);margin:4px 0 4px 10px;padding-left:4px}.toc-list .toc-list .toc-list-item:before{display:none}body.is-win .font-light{font-weight:350}article[data-preview]{position:relative}article[data-preview]:after{z-index:0;content:"";position:absolute;right:0;bottom:0;left:0;height:min(100%,500px);background:linear-gradient(transparent,var(--color-background) 50%)}article[data-preview] aside{z-index:1}

/* ===================================================================
   Hand-authored shared classes (not Tailwind-generated).
   Added to consolidate inline-style duplication found across the pages
   built in this project - see the bloat audit. Flagged for possible
   further consolidation/restyling once the full design system review
   happens; these exist now purely to remove duplication, not to make
   final visual decisions.
   =================================================================== */

/* Quiet filter button - Tools page Type/Topic lists (was a 21x-repeated
   inline style) */
.filter-btn-quiet {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: left;
  border: none;
  background: none;
  color: var(--color-typography-tone);
  font-size: 14px;
  width: 100%;
}
.filter-btn-quiet.active {
  background: var(--color-typography);
  color: var(--color-typography-reverse);
}

/* Hero badge - "Start here" (series), "Newest pick" (featured) */

/* Compact grid badge - "Part N" on series grid cards */

/* Tools content-type badges - genuinely distinct colors per type, not
   duplicated with each other, kept as separate classes per type.
   badge-course is deliberately monochrome rather than pastel - it is the
   highest-value content type on the page and reads as the standout.
   It inverts in dark mode (see override below) because pure black would
   be invisible against the dark background; the pastel badges do not
   need this since they stay legible either way. */
.badge-video { background: #FEF3D6; color: #8a5a00; }
.badge-podcast { background: #E6F1FB; color: #0c447c; }
.badge-webinar { background: #EAF3DE; color: #27500a; }
.badge-resource { background: #FBEAF0; color: #72243e; }
.badge-quiz { background: #EEEDFE; color: #3c3489; }
.badge-guide { background: #E9F7F3; color: #0f5c47; }
.badge-tools { background: #FFEFE3; color: #93400c; }
.badge-course { background: #000; color: #fff; }
/* badge-course inverts in dark mode so it stays visible */
[data-color-scheme="dark"]:root .badge-course {
  background: #fff;
  color: #000;
}
@media (prefers-color-scheme: dark) {
  [data-color-scheme="system"]:root .badge-course {
    background: #fff;
    color: #000;
  }
}

.badge-video, .badge-podcast, .badge-webinar, .badge-resource, .badge-quiz, .badge-guide, .badge-tools, .badge-course {
  padding: 3px 9px;
  border-radius: 8px;
  display: inline-block;
  margin-bottom: 8px;
}

/* Image placeholder background - shows while an image loads or if a
   post has no feature_image, used across card/hero image wrappers */
.aspect-placeholder-16-10 {
  aspect-ratio: 16/10;
  background: var(--color-background-tone);
}

/* Small square icon/thumbnail wrapper - shuffle box, tag sidebar photo */

/* min-width: 0 - the standard fix for flex/grid items whose content
   (e.g. a horizontally-scrolling carousel) would otherwise stretch the
   container wider than intended. Was repeated as inline style 15 times
   across the channel pages and pages built in this project. */
.min-w-0 {
  min-width: 0;
}

/* ---- am-post.css ---- */
/* ==========================================================================
   Alicia McKay — post type system
   Plain CSS, loaded after the theme bundle. Nothing here needs a build step,
   so the theme can be rebuilt from source without losing any of it.

   Uses the theme's own colour variables, so dark mode keeps working.
   ========================================================================== */

:root {
  --am-measure: 748px;
  --am-rail: 232px;
  --am-gap: 56px;
  --am-yellow: #FAC300;
  --am-radius: var(--radius-md, 0.375rem);
  --am-radius-lg: var(--radius-lg, 0.5rem);
}

/* --------------------------------------------------------------- structure */

.am-grid {
  max-width: calc(var(--am-rail) + var(--am-gap) + var(--am-measure));
  margin: 0 auto;
  display: grid;
  grid-template-columns: var(--am-rail) minmax(0, var(--am-measure));
  gap: var(--am-gap);
  /* Rail sits at the top by default. It only stretches when there's a
     contents list, which needs a full-height column to travel down. */
  align-items: start;
  padding-top: 2.75rem;
}

/* No rail (book pages) — collapse to a single centred column */
.am-grid:not(:has(.am-rail)) {
  grid-template-columns: minmax(0, 1fr);
  max-width: var(--am-measure);
}

/* Below the grid breakpoint the rail sits above the text, horizontally. */
@media (max-width: 1080px) {
  .am-grid {
    grid-template-columns: minmax(0, 1fr);
    max-width: var(--am-measure);
    gap: 1.5rem;
  }
}

.am-body { max-width: var(--am-measure); }

/* ------------------------------------------------------------------- marks */

.am-typemark { margin-bottom: 1.35rem; }

.am-mark {
  display: block;
  width: 26px;
  height: 26px;
  color: #FAC300;
  margin-bottom: 0.7rem;
}
.am-mark svg { width: 100%; height: 100%; display: block; }

.am-typemark__label {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.4;
  /* Colour rather than opacity — opacity here washed out the yellow dot,
     because the dot is a child of this element. */
  color: color-mix(in srgb, var(--color-typography) 62%, transparent);
}
.am-typemark--dark .am-typemark__label { color: rgba(255,255,255,0.72); }

.am-dot {
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background: #FAC300;
  display: inline-block;
  flex-shrink: 0;
  opacity: 1;
}

/* ------------------------------------------------------------------- pills */

.am-pills { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.1rem; }

.am-pill {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  padding: 5px 10px;
  background: color-mix(in srgb, var(--color-typography) 6%, transparent);
  color: color-mix(in srgb, var(--color-typography) 70%, transparent);
  text-decoration: none;
}
.am-pill:hover { color: var(--color-typography); }
.am-pill--dark { background: rgba(255,255,255,0.12); color: rgba(255,255,255,0.85); }
.am-pill--dark:hover { color: #fff; }

/* -------------------------------------------------------------------- rail */

.am-rail { font-size: 0.875rem; }

.am-rail-detail { margin-bottom: 1.75rem; }

@media (max-width: 1080px) {
  .am-rail-detail {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem 1.75rem;
    padding: 0;
    margin-bottom: 1.5rem;
  }
  .am-rail-item { margin-bottom: 0; }
  .am-rail-item--credit { flex-basis: 100%; }
}

.am-rail-item { margin-bottom: 0.85rem; }

.am-rail-label {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  opacity: 0.6;
  margin-bottom: 0.3rem;
}

.am-rail-value { font-size: 0.9375rem; font-weight: 600; }
.am-rail-value a { text-decoration: none; color: inherit; }
.am-rail-value a:hover { color: var(--am-yellow); }
.am-rail-credit { font-weight: 400; font-size: 0.8125rem; opacity: 0.75; line-height: 1.5; }

/* The contents list is generated client side — hide the shell when it's empty
   so short pieces don't carry an empty heading. */
aside[data-toc]:has([data-toc-content]:empty) { display: none; }
aside[data-toc]:not(:has([data-toc-content] a)) { display: none; }

/* ------------------------------------------------------------- hero: plate */

.am-hero-plate {
  position: relative;
  min-height: min(620px, 68vh);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: #151311;
}
.am-hero-plate--noimage { background: linear-gradient(165deg, #3E3830, #151311 72%); }

.am-hero-plate__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.am-hero-plate__scrim {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,0.35) 0%, rgba(10,10,10,0.88) 100%);
}
.am-hero-plate__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 4.5rem 1.5rem 4rem;
  color: #fff;
}
.am-hero-plate__title {
  font-size: clamp(2.25rem, 6vw, 4.25rem);
  line-height: 1.03;
  font-weight: 600;
  letter-spacing: -0.028em;
  margin: 0;
  color: #fff;
  max-width: 22ch;
}
.am-hero-plate__standfirst {
  font-size: 1.4375rem;
  line-height: 1.45;
  margin-top: 1rem;
  color: rgba(255,255,255,0.82);
  max-width: 54ch;
}

/* ------------------------------------------------------------ hero: flurry */

.am-hero-flurry { background: #0A0A0A; color: #fff; }
.am-hero-flurry__inner {
  max-width: calc(var(--am-rail) + var(--am-gap) + var(--am-measure));
  margin: 0 auto;
  padding: 3.5rem 1.5rem;
}
.am-hero-flurry__title {
  font-size: clamp(1.875rem, 4.5vw, 2.875rem);
  line-height: 1.03;
  font-weight: 600;
  letter-spacing: -0.028em;
  margin: 0;
  color: #fff;
}
.am-hero-flurry__standfirst {
  font-size: 1.3125rem;
  line-height: 1.45;
  margin-top: 1rem;
  color: rgba(255,255,255,0.78);
  max-width: 48ch;
}

/* ------------------------------------------------------------- hero: cover */

.am-hero-cover {
  max-width: calc(var(--am-rail) + var(--am-gap) + var(--am-measure));
  margin: 0 auto;
  padding: 3.5rem 0 0;
  display: flex;
  gap: 3rem;
  align-items: center;
  flex-wrap: wrap;
}
.am-hero-cover__text { flex: 1 1 340px; min-width: 280px; }
.am-hero-cover__title {
  font-size: clamp(1.75rem, 4vw, 2.625rem);
  line-height: 1.04;
  font-weight: 600;
  letter-spacing: -0.028em;
  margin: 0;
}
.am-hero-cover__standfirst {
  font-size: 1.25rem;
  line-height: 1.45;
  margin-top: 0.9rem;
  opacity: 0.72;
}
/* Cover artwork. These are often promo renders on their own white
   background, so no border and no crop — let the artwork be the shape it is. */
.am-hero-cover__img {
  flex: 0 1 340px;
  width: 100%;
  max-width: 340px;
}
.am-hero-cover__img picture { display: block; width: 100%; }
.am-cover-img {
  width: 100%;
  height: auto;
  max-height: 380px;
  object-fit: contain;
  display: block;
  border: 0;
  border-radius: var(--am-radius-lg);
  background: transparent;
}


/* ----------------------------------------------------------- hero: default */

.am-hero-default {
  max-width: calc(var(--am-rail) + var(--am-gap) + var(--am-measure));
  margin: 0 auto;
  padding: 3.5rem 0 0;
}

/* Two columns when there's an image — title left, picture right. Collapses
   to one column on its own when there isn't. */
@media (min-width: 901px) {
  .am-hero-default:has(.am-hero-default__img) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    gap: 3rem;
    align-items: center;
  }
}

.am-hero-default__img { margin: 0; }
@media (max-width: 900px) {
  .am-hero-default__img { margin-top: 2rem; }
}

/* The image partial wraps every img in a <picture>, which is inline by
   default — so width:100% on the img had nothing to fill and it fell back to
   its intrinsic size. The wrapper has to be a block first. */
.am-hero-default__img picture,
.am-hero-default__img { display: block; width: 100%; }

.am-hero-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  height: auto;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: var(--am-radius-lg);
}

/* On a phone the hero image runs full width, so a shallower crop stops it
   dominating the screen before the reader reaches the essay. */
@media (max-width: 900px) {
  .am-hero-img { aspect-ratio: 16 / 10; }
}
.am-hero-default__title {
  font-size: clamp(1.875rem, 4.5vw, 2.875rem);
  line-height: 1.03;
  font-weight: 600;
  letter-spacing: -0.028em;
  margin: 0;
}
.am-hero-default__standfirst {
  font-size: 1.3125rem;
  line-height: 1.45;
  margin-top: 1rem;
  opacity: 0.72;
  max-width: 48ch;
}


/* --------------------------------------------------- body: quote and rules */

/* Ghost's two quote styles, given two jobs rather than two decorations.
   Ghost's card CSS loads after this file via {{ghost_head}} and Tailwind's
   typography plugin adds its own glyphs — hence the !important flags.

   Quote        → someone else's words, cited inside your argument.
   Quote 2      → your own line, amplified. A pull quote.
*/

/* ---- shared reset for both ---- */
.am-body blockquote,
.am-body .kg-blockquote-alt {
  border: 0 !important;
  border-left: 0 !important;
  border-inline-start-width: 0 !important;
  font-style: normal !important;
  text-align: left !important;
  quotes: none !important;
  color: var(--color-typography) !important;
  position: relative;
}

.am-body blockquote p::before,
.am-body blockquote p::after,
.am-body .kg-blockquote-alt p::before,
.am-body .kg-blockquote-alt p::after {
  content: none !important;
}

.ghost-content.am-body blockquote p,
.am-body blockquote p {
  font-style: normal !important;
  text-align: left !important;
  color: var(--color-typography) !important;
  margin: 0 !important;
}

/* ---- Quote: a cited source ---- */
.am-body blockquote:not(.kg-blockquote-alt) {
  background: color-mix(in srgb, var(--color-typography) 4%, transparent) !important;
  border-radius: var(--am-radius-lg) !important;
  padding: 1.9rem 2rem 1.75rem !important;
  margin: 4rem 0 2.5rem !important;
  line-height: 1.34 !important;
}

.am-body blockquote:not(.kg-blockquote-alt)::before {
  content: "" !important;
  display: block;
  width: 22px;
  height: 22px;
  margin-bottom: 1rem;
  background-color: #FAC300;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 13.2c0-4.2 2.3-7.2 6-8.4v2.5c-2 .9-3.1 2.4-3.3 4.2h2.9V19H3.5v-5.8Zm11 0c0-4.2 2.3-7.2 6-8.4v2.5c-2 .9-3.1 2.4-3.3 4.2h2.9V19h-5.6v-5.8Z'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.5 13.2c0-4.2 2.3-7.2 6-8.4v2.5c-2 .9-3.1 2.4-3.3 4.2h2.9V19H3.5v-5.8Zm11 0c0-4.2 2.3-7.2 6-8.4v2.5c-2 .9-3.1 2.4-3.3 4.2h2.9V19h-5.6v-5.8Z'/%3E%3C/svg%3E");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

.ghost-content.am-body blockquote:not(.kg-blockquote-alt) p,
.am-body blockquote:not(.kg-blockquote-alt) p {
  font-size: 1.1875rem !important;
  line-height: 1.34 !important;
  font-weight: 500 !important;
  letter-spacing: -0.018em;
}

/* ---- Quote 2: your own line, pulled out ---- */
.am-body blockquote.kg-blockquote-alt,
.am-body .kg-blockquote-alt {
  background: transparent !important;
  border-left: 2px solid #FAC300 !important;
  padding: 0.15rem 0 0.15rem 1.25rem !important;
  margin: 2.75rem 0 2.25rem !important;
}

@media (min-width: 768px) {
  .am-body blockquote.kg-blockquote-alt,
  .am-body .kg-blockquote-alt {
    padding-left: 1.75rem !important;
    margin: 3.5rem 0 2.75rem !important;
  }
}

.am-body .kg-blockquote-alt::before { content: none !important; }

.ghost-content.am-body blockquote.kg-blockquote-alt p,
.am-body .kg-blockquote-alt p {
  font-size: 1.375rem !important;
  line-height: 1.26 !important;
  font-weight: 600 !important;
  letter-spacing: -0.028em !important;
  color: #141210 !important;
}

/* ---- attribution, either style ---- */
.am-body blockquote cite,
.am-body blockquote footer {
  display: block;
  margin-top: 1.1rem;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  font-style: normal;
  opacity: 0.6;
}

/* Section divider — the one other place yellow appears. */
.am-body hr {
  border: 0;
  border-top: 1px solid var(--am-yellow);
  margin: 2.875rem 0;
}

/* Lead paragraph. Pure CSS, so there is nothing to remember when writing. */
.am-body > p:first-of-type {
  font-size: 1.375rem;
  line-height: 1.55;
  font-weight: 500;
}

/* Subheads sit lighter than the theme default. */
.am-body h2 {
  font-weight: 600;
  letter-spacing: -0.022em;
}

/* ------------------------------------------------- contents list, in rail */
/* The theme's TOC partial is built for a wider centred sidebar. Inside the
   rail it needs to be left aligned, unboxed and quiet. */

.am-rail [data-toc] {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.am-rail [data-toc] > div {
  border: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

.am-rail [data-toc-toggle] {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  border: 0;
  border-bottom: 1px solid var(--color-typography);
  border-radius: 0;
  padding: 0 0 0.55rem;
  margin: 0 0 0.25rem;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  opacity: 0.6;
}
.am-rail [data-toc-toggle]:hover { background: transparent; }

.am-rail [data-toc-content] { font-size: 0.8125rem; line-height: 1.4; }

.am-rail [data-toc-content] a {
  display: block;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--color-border);
  border-left: 0;
  border-radius: 0;
  background: transparent;
  text-decoration: none;
  opacity: 0.72;
}
.am-rail [data-toc-content] a:hover { opacity: 1; }

/* Contents lists only ever hold top-level headings now, so no nesting */
.am-rail [data-toc-content] ol,
.am-rail [data-toc-content] ul { margin: 0; padding: 0; list-style: none; }

/* Active item: a yellow marker rather than a grey box */
.am-rail [data-toc-content] .is-active-link,
.am-rail [data-toc-content] a.is-active-link {
  background: transparent;
  opacity: 1;
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--am-yellow);
  padding-left: 0.6rem;
}

/* The rail is a full-height column; its contents sit at the top and the
   contents list sticks as you scroll. */
.am-grid:has([data-toc-content] a) { align-items: stretch; }
.am-grid:has([data-toc-content] a) .am-rail > *:last-child { position: sticky; top: 1.5rem; }
.am-rail [data-toc] .sticky { position: sticky; }

@media (max-width: 1080px) {
  .am-rail > *:last-child { position: static; }
}

/* ------------------------------------------------------ video / webinar */
/* A player needs width. The reading measure is set for prose, so posts that
   are built around an embed get a wider text column to sit it in. */


/* Embeds fill the column and keep their shape at any width. */
.am-body iframe,
.am-body .kg-embed-card iframe,
.am-body .kg-video-card video {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  display: block;
  border: 0;
}

/* Ghost's own wide setting, honoured inside the grid. Breaks right, into the
   page margin, so it never collides with the sticky rail on the left. */
.am-body .kg-width-wide {
  width: min(calc(100% + 160px), 92vw);
  max-width: none;
}
.am-body .kg-width-full {
  width: min(calc(100% + 220px), 96vw);
  max-width: none;
}

@media (max-width: 1080px) {
  .am-body .kg-width-wide,
  .am-body .kg-width-full { width: 100%; }
}

/* ------------------------------------------------------------------ event */

.am-event { display: block; margin-bottom: 1.75rem; }

.am-btn {
  display: inline-block;
  border-radius: var(--am-radius);
  margin-top: 0.5rem;
  background: var(--color-typography);
  color: var(--color-background);
  font-size: 0.9375rem;
  font-weight: 600;
  padding: 0.75rem 1.4rem;
  text-decoration: none;
  border-radius: 0;
}
.am-btn:hover { background: #FAC300; color: #0A0A0A; }

/* Secondary button — outlined, for the action beside a primary one. */
.am-btn--quiet {
  background: transparent;
  color: var(--color-typography);
  border: 1px solid var(--color-border);
  font-weight: 500;
}

.am-btn--quiet:hover {
  background: var(--color-background-tone);
  color: var(--color-typography);
  border-color: var(--color-typography);
}

@media (max-width: 1080px) {
  .am-event { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }
}

/* ------------------------------------------------- separation under a hero */
/* The object types (tool, book, reading log, media) have a short hero and no
   feature image below it, so the body used to just drift into view. A hairline
   gives the page a place to start. */

[data-post-hero="cover"] + [data-post-content] .am-grid,
[data-post-hero="default"] + [data-post-content] .am-grid {
  border-top: 1px solid var(--color-border);
  margin-top: 2.75rem;
  padding-top: 2.75rem;
}

/* The plate and the Flurry block already separate themselves — no rule there. */
[data-post-hero="plate"] + [data-post-content] .am-grid,
[data-post-hero="flurry"] + [data-post-content] .am-grid {
  border-top: 0;
  margin-top: 0;
  padding-top: 2.75rem;
}

/* Player pages: wider text column for the embed, narrower rail to balance it.
   Set on the post wrapper so the hero and the body are sized together — set
   on the grid alone, the hero stayed narrow and the two centred differently. */
.am-post--player { --am-rail: 200px; --am-gap: 48px; --am-measure: 880px; }

/* ------------------------------------------------------------------ links */
/* A link in running text needs to be findable, not loud. Same colour and
   weight as the sentence around it, carried by a thin underline set below
   the baseline so it clears descenders. The accent appears on hover, where
   it's information rather than decoration. */

.am-body a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-card a) {
  color: inherit;
  font-weight: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-decoration-color: color-mix(in srgb, var(--color-typography) 32%, transparent);
  transition: text-decoration-color 0.15s ease, text-decoration-thickness 0.15s ease;
}

.am-body a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-card a):hover {
  text-decoration-color: #FAC300;
  text-decoration-thickness: 2px;
}

/* Headings and quotes: no underline, the link is obvious from context */
.am-body h2 a,
.am-body h3 a,
.am-body blockquote a {
  text-decoration-color: color-mix(in srgb, var(--color-typography) 22%, transparent);
}

/* A numbered contents list on book pages — the chapters are a sequence, so
   the numbers carry real information rather than decorating. */

[data-am-type="book"] .am-rail [data-toc-content] { counter-reset: am-chapter; }
[data-am-type="book"] .am-rail [data-toc-content] a::before {
  counter-increment: am-chapter;
  content: counter(am-chapter, decimal-leading-zero);
  display: inline-block;
  width: 1.9em;
  color: #FAC300;
  font-weight: 700;
  font-size: 0.75em;
  letter-spacing: 0.06em;
}

/* -------------------------------------------------------------- body text */
/* Soft ink rather than grey — nearly black with a touch of warmth, so it
   reads as deliberate rather than faded. Antialiased smoothing overrides the
   theme's subpixel setting, which thickens every stroke on macOS and was
   making Inter feel heavier than it is. No effect on Windows. */

.am-body,
.am-smooth,
.am-rail,
.am-hero-cover,
.am-hero-plate__inner,
.am-hero-flurry__inner {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.am-body p,
.am-body li {
  color: #2B2825;
  font-size: 17px;
  line-height: 1.7;
  font-weight: 400;
}

/* Lead paragraph keeps its size and weight, at full ink */
.am-body > p:first-of-type {
  color: #141210;
  font-size: 19px;
  line-height: 1.55;
  font-weight: 500;
}

/* Fixed sizes above override the theme's own responsive step, so the steps
   have to be restated here. 17px on a phone, 19px from tablet up. */
@media (min-width: 768px) {
  .am-body p,
  .am-body li {
    font-size: 19px;
    line-height: 1.72;
  }
  .am-body > p:first-of-type {
    font-size: 22px;
  }
}

/* Quotes and headings set their own colour, so keep them out of it */
.am-body blockquote p,
.am-body .kg-blockquote-alt p { font-size: inherit; }

/* Quotes scale up from tablet too */
@media (min-width: 768px) {
  .ghost-content.am-body blockquote:not(.kg-blockquote-alt) p,
  .am-body blockquote:not(.kg-blockquote-alt) p { font-size: 1.375rem !important; }

  .ghost-content.am-body blockquote.kg-blockquote-alt p,
  .am-body .kg-blockquote-alt p { font-size: 1.875rem !important; }
}

/* Tighter padding on a phone, where a 2rem inset eats the measure */
@media (max-width: 767px) {
  .am-body blockquote:not(.kg-blockquote-alt) { padding: 1.4rem 1.4rem 1.25rem !important; }
}

/* ========================================================================
   Narrow screens
   Everything above is sized for a wide viewport. This block brings the
   same decisions down to a phone rather than letting desktop values leak.
   ======================================================================== */

@media (max-width: 767px) {

  /* Vertical rhythm: desktop spacing is roughly double what a phone needs */
  .am-grid { padding-top: 1.75rem; }

  [data-post-hero="cover"] + [data-post-content] .am-grid,
  [data-post-hero="default"] + [data-post-content] .am-grid {
    margin-top: 1.75rem;
    padding-top: 1.75rem;
  }

  [data-post-hero="plate"] + [data-post-content] .am-grid,
  [data-post-hero="flurry"] + [data-post-content] .am-grid {
    padding-top: 1.75rem;
  }

  /* Heroes */
  .am-hero-default,
  .am-hero-cover { padding-top: 2rem; }

  .am-hero-plate { min-height: 380px; }
  .am-hero-plate__inner { padding: 2.5rem 1.25rem 2.25rem; }
  .am-hero-plate__title { max-width: none; }
  .am-hero-plate__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-flurry__inner { padding: 2.5rem 1.25rem; }
  .am-hero-flurry__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-default__standfirst,
  .am-hero-cover__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-cover { gap: 1.5rem; }


  /* Type mark and pills */
  .am-typemark { margin-bottom: 1rem; }
  .am-mark { width: 22px; height: 22px; }
  .am-pills { margin-top: 0.85rem; }

  /* Rail reads as a row of facts, not a sidebar */
  .am-rail { font-size: 0.8125rem; }
  .am-rail-value { font-size: 0.875rem; }

  /* Contents sits above the text, closed by default on the theme's toggle */
  .am-rail [data-toc] { margin-bottom: 1.25rem; }

  /* Body rhythm */
  .am-body p { margin-bottom: 1.15rem; }
  .am-body h2 { margin: 2rem 0 0.6rem; font-size: 1.3125rem; }

  /* Section rule */
  .am-body hr { margin: 2rem 0; }

  /* Members gate */
  .am-body .am-gate { padding-top: 1.5rem; }

  /* Related posts */
  .am-grid + [class] { margin-top: 2rem; }

  /* Buttons go full width — a 13px tap target inset in a column is mean */
  .am-btn { display: block; text-align: center; }
}

/* Very narrow: stop the cover image dominating */
@media (max-width: 400px) {
  .am-hero-plate { min-height: 320px; }
}

/* ===================================================================== */
/* Hero images on narrow screens                                          */
/* On a phone there is no side column to sit in, so an image that was      */
/* 340px beside the text becomes a small box floating in a wide space.     */
/* Below the breakpoint every hero image simply takes the column, with a   */
/* height cap so a portrait cover can't swallow the screen before you      */
/* reach a word of writing.                                               */
/* ===================================================================== */

@media (max-width: 900px) {
  .am-hero-cover {
    flex-direction: column;
    align-items: stretch;
    gap: 1.75rem;
  }

  .am-hero-cover__text { flex: none; min-width: 0; }

  .am-hero-cover__img {
    flex: none;
    width: 100%;
    max-width: 100%;
  }

  /* Covers only. This was also catching .am-hero-img, which is why a
     Wednesday Wisdom image rendered small, contained and pinned left
     instead of filling the column at its set ratio. */
  .am-cover-img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    object-position: left center;
  }
}

@media (max-width: 480px) {
  .am-cover-img { max-height: 240px; }
}

/* ------------------------------------------------------- hero action slot */

.am-hero-action:empty,
.am-hero-cover__action:empty { display: none; }

.am-hero-action,
.am-hero-cover__action { margin-top: 1.5rem; }
.am-hero-action .kg-button-card,
.am-hero-action .kg-file-card,
.am-hero-cover__action .kg-button-card,
.am-hero-cover__action .kg-file-card {
  margin: 0 !important;
  justify-content: flex-start;
}
.am-hero-action .kg-file-card,
.am-hero-cover__action .kg-file-card { max-width: 100%; }

/* On a phone the cover comes first — you should see the thing before you're
   asked to buy or download it. */
@media (max-width: 900px) {
  .am-hero-cover__img { order: -1; }
}

/* ===================================================================== */
/* Narrow screens: spacing corrections                                    */
/* The quote and rule margins below were set for a wide column and left    */
/* holes on a phone. The desktop values need !important because the rules  */
/* they override do too.                                                  */
/* ===================================================================== */

@media (max-width: 767px) {

  /* Cited quote: 4rem above was leaving a gap the size of a paragraph */
  .am-body blockquote:not(.kg-blockquote-alt) {
    margin: 2rem 0 1.75rem !important;
  }

  /* Pull quote */
  .am-body blockquote.kg-blockquote-alt,
  .am-body .kg-blockquote-alt {
    margin: 2rem 0 1.75rem !important;
  }

  /* Section rule */
  .am-body hr {
    margin: 2rem 0 !important;
  }

  /* A subhead straight after the rule shouldn't add its own margin on top */
  .am-body hr + h2,
  .am-body hr + h3 { margin-top: 0.5rem !important; }

  /* Nor should the first thing after a quote */
  .am-body blockquote + p,
  .am-body blockquote + h2 { margin-top: 0 !important; }
}

/* Bold text inside a paragraph was picking up the plugin's own bold colour,
   which is lighter than the body — so emphasis read as greyed out. */
.am-body strong,
.am-body b {
  color: inherit;
  font-weight: 600;
}

/* Ghost's own button card, when it lands in the hero, matched to the system:
   square, ink, same size as the generated download button. */
.am-hero-action .kg-btn,
.am-hero-action a.kg-btn,
.am-hero-cover__action .kg-btn,
.am-hero-cover__action a.kg-btn {
  background: var(--color-typography) !important;
  color: var(--color-background) !important;
  border-radius: var(--am-radius) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  padding: 0.75rem 1.4rem !important;
  min-width: 0 !important;
  height: auto !important;
}
.am-hero-action .kg-btn:hover,
.am-hero-action a.kg-btn:hover,
.am-hero-cover__action .kg-btn:hover,
.am-hero-cover__action a.kg-btn:hover {
  background: #FAC300 !important;
  color: #0A0A0A !important;
}

/* ==================================================================== */
/* Bookmark cards — "ledger"                                             */
/* A citation block, not a promo. Heavy rule on top, a REFERENCED label,  */
/* the title large, thumbnail held small and subordinate to the right.    */
/* Ghost's card CSS loads after this file, hence the !important flags.    */
/* ==================================================================== */

.am-body .kg-bookmark-card { margin: 2.75rem 0 !important; }

.am-body .kg-bookmark-container,
.am-body a.kg-bookmark-container,
.am-body a.kg-bookmark-container:hover {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-start !important;
  gap: 1.75rem;
  border: 0 !important;
  border-top: 3px solid var(--color-typography) !important;
  border-bottom: 1px solid var(--color-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 1.15rem 0 1.35rem !important;
  min-height: 0 !important;
  color: var(--color-typography) !important;
  text-decoration: none !important;
}

/* No label: the heavy rule and the layout already say "this is a reference",
   and the word was doing the work twice. */

.am-body .kg-bookmark-content {
  flex: 1 1 260px !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column;
  min-width: 0;
}

.am-body .kg-bookmark-title {
  font-size: 1.75rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.16 !important;
  color: var(--color-typography) !important;
  margin: 0 0 0.55rem !important;
}

.am-body .kg-bookmark-description {
  font-size: 1rem !important;
  line-height: 1.55 !important;
  color: var(--color-typography-content) !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Publisher row. Author is hidden — on a self-link Ghost prints the same
   name twice. */
.am-body .kg-bookmark-metadata {
  margin-top: 1rem !important;
  font-size: 0.594rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: color-mix(in srgb, var(--color-typography) 72%, transparent) !important;
  align-items: center !important;
}

.am-body .kg-bookmark-author { display: none !important; }
.am-body .kg-bookmark-author + .kg-bookmark-publisher::before { content: none !important; }

.am-body .kg-bookmark-metadata .kg-bookmark-publisher::after {
  content: " \2197";
  color: #FAC300;
  font-weight: 700;
}

.am-body .kg-bookmark-icon {
  width: 14px !important;
  height: 14px !important;
  margin-right: 0.55rem !important;
}

/* Thumbnail: square, small, clearly subordinate to the title. */
.am-body .kg-bookmark-thumbnail {
  border-radius: var(--am-radius) !important;
  overflow: hidden;
  flex: 0 0 132px !important;
  width: 132px !important;
  height: 132px !important;
  min-height: 0 !important;
  border-radius: 0 !important;
  order: 2;
}

.am-body .kg-bookmark-thumbnail img {
  border-radius: var(--am-radius) !important;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.am-body a.kg-bookmark-container:hover .kg-bookmark-title {
  box-shadow: inset 0 -2px 0 #FAC300;
}

@media (max-width: 640px) {
  .am-body .kg-bookmark-container,
  .am-body a.kg-bookmark-container { gap: 1rem; }

  .am-body .kg-bookmark-title { font-size: 1.5rem !important; }

  .am-body .kg-bookmark-thumbnail {
    order: 3;
    flex: 1 1 100% !important;
    width: 100% !important;
    height: 130px !important;
  }
}

/* ------------------------------------------------------------------ links */
/* A link in running text needs to be findable, not loud. Same colour and
   weight as the sentence around it, carried by a thin underline set below
   the baseline so it clears descenders. The accent appears on hover, where
   it's information rather than decoration. */

.am-body a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-card a) {
  color: inherit;
  font-weight: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-decoration-color: color-mix(in srgb, var(--color-typography) 32%, transparent);
  transition: text-decoration-color 0.15s ease, text-decoration-thickness 0.15s ease;
}

.am-body a:not(.kg-btn):not(.kg-bookmark-container):not(.kg-card a):hover {
  text-decoration-color: #FAC300;
  text-decoration-thickness: 2px;
}

/* Headings and quotes: no underline, the link is obvious from context */
.am-body h2 a,
.am-body h3 a,
.am-body blockquote a {
  text-decoration-color: color-mix(in srgb, var(--color-typography) 22%, transparent);
}

/* A numbered contents list on book pages — the chapters are a sequence, so
   the numbers carry real information rather than decorating. */

[data-am-type="book"] .am-rail [data-toc-content] { counter-reset: am-chapter; }
[data-am-type="book"] .am-rail [data-toc-content] a::before {
  counter-increment: am-chapter;
  content: counter(am-chapter, decimal-leading-zero);
  display: inline-block;
  width: 1.9em;
  color: #FAC300;
  font-weight: 700;
  font-size: 0.75em;
  letter-spacing: 0.06em;
}

/* -------------------------------------------------------------- body text */
/* Soft ink rather than grey — nearly black with a touch of warmth, so it
   reads as deliberate rather than faded. Antialiased smoothing overrides the
   theme's subpixel setting, which thickens every stroke on macOS and was
   making Inter feel heavier than it is. No effect on Windows. */

.am-body,
.am-smooth,
.am-rail,
.am-hero-cover,
.am-hero-plate__inner,
.am-hero-flurry__inner {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.am-body p,
.am-body li {
  color: #2B2825;
  font-size: 17px;
  line-height: 1.7;
  font-weight: 400;
}

/* Lead paragraph keeps its size and weight, at full ink */
.am-body > p:first-of-type {
  color: #141210;
  font-size: 19px;
  line-height: 1.55;
  font-weight: 500;
}

/* Fixed sizes above override the theme's own responsive step, so the steps
   have to be restated here. 17px on a phone, 19px from tablet up. */
@media (min-width: 768px) {
  .am-body p,
  .am-body li {
    font-size: 19px;
    line-height: 1.72;
  }
  .am-body > p:first-of-type {
    font-size: 22px;
  }
}

/* Quotes and headings set their own colour, so keep them out of it */
.am-body blockquote p,
.am-body .kg-blockquote-alt p { font-size: inherit; }

/* Quotes scale up from tablet too */
@media (min-width: 768px) {
  .ghost-content.am-body blockquote:not(.kg-blockquote-alt) p,
  .am-body blockquote:not(.kg-blockquote-alt) p { font-size: 1.375rem !important; }

  .ghost-content.am-body blockquote.kg-blockquote-alt p,
  .am-body .kg-blockquote-alt p { font-size: 1.875rem !important; }
}

/* Tighter padding on a phone, where a 2rem inset eats the measure */
@media (max-width: 767px) {
  .am-body blockquote:not(.kg-blockquote-alt) { padding: 1.4rem 1.4rem 1.25rem !important; }
}

/* ========================================================================
   Narrow screens
   Everything above is sized for a wide viewport. This block brings the
   same decisions down to a phone rather than letting desktop values leak.
   ======================================================================== */

@media (max-width: 767px) {

  /* Vertical rhythm: desktop spacing is roughly double what a phone needs */
  .am-grid { padding-top: 1.75rem; }

  [data-post-hero="cover"] + [data-post-content] .am-grid,
  [data-post-hero="default"] + [data-post-content] .am-grid {
    margin-top: 1.75rem;
    padding-top: 1.75rem;
  }

  [data-post-hero="plate"] + [data-post-content] .am-grid,
  [data-post-hero="flurry"] + [data-post-content] .am-grid {
    padding-top: 1.75rem;
  }

  /* Heroes */
  .am-hero-default,
  .am-hero-cover { padding-top: 2rem; }

  .am-hero-plate { min-height: 380px; }
  .am-hero-plate__inner { padding: 2.5rem 1.25rem 2.25rem; }
  .am-hero-plate__title { max-width: none; }
  .am-hero-plate__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-flurry__inner { padding: 2.5rem 1.25rem; }
  .am-hero-flurry__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-default__standfirst,
  .am-hero-cover__standfirst { font-size: 1.125rem; margin-top: 0.75rem; }

  .am-hero-cover { gap: 1.5rem; }


  /* Type mark and pills */
  .am-typemark { margin-bottom: 1rem; }
  .am-mark { width: 22px; height: 22px; }
  .am-pills { margin-top: 0.85rem; }

  /* Rail reads as a row of facts, not a sidebar */
  .am-rail { font-size: 0.8125rem; }
  .am-rail-value { font-size: 0.875rem; }

  /* Contents sits above the text, closed by default on the theme's toggle */
  .am-rail [data-toc] { margin-bottom: 1.25rem; }

  /* Body rhythm */
  .am-body p { margin-bottom: 1.15rem; }
  .am-body h2 { margin: 2rem 0 0.6rem; font-size: 1.3125rem; }

  /* Section rule */
  .am-body hr { margin: 2rem 0; }

  /* Members gate */
  .am-body .am-gate { padding-top: 1.5rem; }

  /* Related posts */
  .am-grid + [class] { margin-top: 2rem; }

  /* Buttons go full width — a 13px tap target inset in a column is mean */
  .am-btn { display: block; text-align: center; }
}

/* Very narrow: stop the cover image dominating */
@media (max-width: 400px) {
  .am-hero-plate { min-height: 320px; }
}

/* ===================================================================== */
/* Hero images on narrow screens                                          */
/* On a phone there is no side column to sit in, so an image that was      */
/* 340px beside the text becomes a small box floating in a wide space.     */
/* Below the breakpoint every hero image simply takes the column, with a   */
/* height cap so a portrait cover can't swallow the screen before you      */
/* reach a word of writing.                                               */
/* ===================================================================== */

@media (max-width: 900px) {
  .am-hero-cover {
    flex-direction: column;
    align-items: stretch;
    gap: 1.75rem;
  }

  .am-hero-cover__text { flex: none; min-width: 0; }

  .am-hero-cover__img {
    flex: none;
    width: 100%;
    max-width: 100%;
  }

  /* Covers only. This was also catching .am-hero-img, which is why a
     Wednesday Wisdom image rendered small, contained and pinned left
     instead of filling the column at its set ratio. */
  .am-cover-img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
    object-position: left center;
  }
}

@media (max-width: 480px) {
  .am-cover-img { max-height: 240px; }
}

/* ------------------------------------------------------- hero action slot */

.am-hero-action:empty,
.am-hero-cover__action:empty { display: none; }

.am-hero-action,
.am-hero-cover__action { margin-top: 1.5rem; }
.am-hero-action .kg-button-card,
.am-hero-action .kg-file-card,
.am-hero-cover__action .kg-button-card,
.am-hero-cover__action .kg-file-card {
  margin: 0 !important;
  justify-content: flex-start;
}
.am-hero-action .kg-file-card,
.am-hero-cover__action .kg-file-card { max-width: 100%; }

/* On a phone the cover comes first — you should see the thing before you're
   asked to buy or download it. */
@media (max-width: 900px) {
  .am-hero-cover__img { order: -1; }
}

/* ===================================================================== */
/* Narrow screens: spacing corrections                                    */
/* The quote and rule margins below were set for a wide column and left    */
/* holes on a phone. The desktop values need !important because the rules  */
/* they override do too.                                                  */
/* ===================================================================== */

@media (max-width: 767px) {

  /* Cited quote: 4rem above was leaving a gap the size of a paragraph */
  .am-body blockquote:not(.kg-blockquote-alt) {
    margin: 2rem 0 1.75rem !important;
  }

  /* Pull quote */
  .am-body blockquote.kg-blockquote-alt,
  .am-body .kg-blockquote-alt {
    margin: 2rem 0 1.75rem !important;
  }

  /* Section rule */
  .am-body hr {
    margin: 2rem 0 !important;
  }

  /* A subhead straight after the rule shouldn't add its own margin on top */
  .am-body hr + h2,
  .am-body hr + h3 { margin-top: 0.5rem !important; }

  /* Nor should the first thing after a quote */
  .am-body blockquote + p,
  .am-body blockquote + h2 { margin-top: 0 !important; }
}

/* Bold text inside a paragraph was picking up the plugin's own bold colour,
   which is lighter than the body — so emphasis read as greyed out. */
.am-body strong,
.am-body b {
  color: inherit;
  font-weight: 600;
}

/* Ghost's own button card, when it lands in the hero, matched to the system:
   square, ink, same size as the generated download button. */
.am-hero-action .kg-btn,
.am-hero-action a.kg-btn,
.am-hero-cover__action .kg-btn,
.am-hero-cover__action a.kg-btn {
  background: var(--color-typography) !important;
  color: var(--color-background) !important;
  border-radius: var(--am-radius) !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  padding: 0.75rem 1.4rem !important;
  min-width: 0 !important;
  height: auto !important;
}
.am-hero-action .kg-btn:hover,
.am-hero-action a.kg-btn:hover,
.am-hero-cover__action .kg-btn:hover,
.am-hero-cover__action a.kg-btn:hover {
  background: #FAC300 !important;
  color: #0A0A0A !important;
}

/* ==================================================================== */
/* Bookmark cards                                                        */
/* Three treatments, chosen in Ghost under Design > theme settings:       */
/*   hairline  — a quiet reference, no image (default)                    */
/*   reference — bordered row with a small thumbnail                      */
/*   card      — image on top, for a link you want followed               */
/* Ghost's card CSS loads after this file, hence the !important flags.    */
/* ==================================================================== */

.am-body .kg-bookmark-card { margin: 2.25rem 0 !important; }

.am-body .kg-bookmark-container,
.am-body a.kg-bookmark-container,
.am-body a.kg-bookmark-container:hover {
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  text-decoration: none !important;
  min-height: 0 !important;
  color: var(--color-typography) !important;
  transition: border-color 0.15s ease;
}

.am-body .kg-bookmark-title {
  font-weight: 600 !important;
  letter-spacing: -0.018em !important;
  color: var(--color-typography) !important;
  margin: 0 0 0.35rem !important;
  line-height: 1.28 !important;
}

.am-body .kg-bookmark-description {
  line-height: 1.5 !important;
  color: var(--color-typography-content) !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.am-body .kg-bookmark-metadata {
  font-size: 0.594rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: color-mix(in srgb, var(--color-typography) 72%, transparent) !important;
  align-items: center !important;
}

.am-body .kg-bookmark-icon {
  width: 14px !important;
  height: 14px !important;
  margin-right: 0.5rem !important;
}

.am-body .kg-bookmark-author { display: none !important; }
.am-body .kg-bookmark-author + .kg-bookmark-publisher::before { content: none !important; }

.am-body .kg-bookmark-metadata .kg-bookmark-publisher::after {
  content: " \2197";
  color: #FAC300;
  font-weight: 700;
}

.am-body .kg-bookmark-thumbnail img {
  border-radius: var(--am-radius) !important;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* ---- hairline (default): no box, no image ---- */

[data-bookmark-style="hairline"] .kg-bookmark-container,
[data-bookmark-style="hairline"] a.kg-bookmark-container {
  display: block !important;
  border: 0 !important;
  border-top: 1px solid var(--color-typography) !important;
  border-bottom: 1px solid var(--color-border) !important;
  padding: 1.15rem 0 1.25rem !important;
}
[data-bookmark-style="hairline"] .kg-bookmark-thumbnail { display: none !important; }
[data-bookmark-style="hairline"] .kg-bookmark-content { padding: 0 !important; display: block !important; }
[data-bookmark-style="hairline"] .kg-bookmark-title {
  font-size: 1.3125rem !important;
  order: 2;
}
[data-bookmark-style="hairline"] .kg-bookmark-description { font-size: 1rem !important; margin-top: 0.45rem !important; }
[data-bookmark-style="hairline"] .kg-bookmark-metadata { margin: 0 0 0.55rem !important; }
[data-bookmark-style="hairline"] a.kg-bookmark-container:hover .kg-bookmark-title {
  box-shadow: inset 0 -1px 0 #FAC300;
}

/* ---- reference: bordered row, small thumbnail ---- */

[data-bookmark-style="reference"] .kg-bookmark-container,
[data-bookmark-style="reference"] a.kg-bookmark-container {
  display: flex !important;
  align-items: stretch !important;
  border: 1px solid var(--color-border) !important;
}
[data-bookmark-style="reference"] a.kg-bookmark-container:hover {
  border-color: var(--color-typography) !important;
}
[data-bookmark-style="reference"] .kg-bookmark-content {
  order: 1;
  flex: 1 1 auto !important;
  padding: 1.25rem 1.4rem !important;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
[data-bookmark-style="reference"] .kg-bookmark-title { font-size: 1.0625rem !important; }
[data-bookmark-style="reference"] .kg-bookmark-description { font-size: 0.875rem !important; }
[data-bookmark-style="reference"] .kg-bookmark-metadata { margin-top: 0.85rem !important; }
[data-bookmark-style="reference"] .kg-bookmark-thumbnail {
  order: 2;
  flex: 0 0 150px !important;
  min-height: 0 !important;
  border-radius: 0 !important;
}

/* ---- card: image on top ---- */

[data-bookmark-style="card"] .kg-bookmark-container,
[data-bookmark-style="card"] a.kg-bookmark-container {
  display: flex !important;
  flex-direction: column !important;
  border: 1px solid var(--color-border) !important;
}
[data-bookmark-style="card"] a.kg-bookmark-container:hover {
  border-color: var(--color-typography) !important;
}
[data-bookmark-style="card"] .kg-bookmark-thumbnail {
  order: 0;
  width: 100% !important;
  height: 190px !important;
  flex: none !important;
  border-radius: 0 !important;
}
[data-bookmark-style="card"] .kg-bookmark-content {
  order: 1;
  padding: 1.25rem 1.4rem !important;
  display: flex !important;
  flex-direction: column;
  min-width: 0;
}
[data-bookmark-style="card"] .kg-bookmark-title { font-size: 1.1875rem !important; order: 2; }
[data-bookmark-style="card"] .kg-bookmark-description { font-size: 0.875rem !important; order: 3; margin-top: 0.35rem !important; }
[data-bookmark-style="card"] .kg-bookmark-metadata { order: 1; margin: 0 0 0.55rem !important; }

/* ---- narrow screens: reference stacks like the card ---- */

@media (max-width: 640px) {
  [data-bookmark-style="reference"] .kg-bookmark-container,
  [data-bookmark-style="reference"] a.kg-bookmark-container { flex-direction: column !important; }
  [data-bookmark-style="reference"] .kg-bookmark-thumbnail {
    order: 0;
    flex: none !important;
    width: 100% !important;
    height: 150px !important;
  }
  [data-bookmark-style="hairline"] .kg-bookmark-title { font-size: 1.125rem !important; }
  [data-bookmark-style="card"] .kg-bookmark-thumbnail { height: 150px !important; }
}

/* ==================================================================== */
/* HUB PAGES — archive, essay hub, tools                                 */
/* Shared furniture. Everything here reuses the theme's own tokens:      */
/* --color-border, --color-typography, --color-background, --radius.     */
/* ==================================================================== */

.am-go {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--color-typography);
  text-decoration: none;
  border-bottom: 2px solid #FAC300;
  padding-bottom: 2px;
}

.am-go:hover { background: rgba(250, 195, 0, 0.18); }

/* The short yellow bar under a page title */
.am-title-rule {
  width: 48px;
  height: 3px;
  background: #FAC300;
  margin: 0 0 1.15rem;
}

/* ---- rail layout ---------------------------------------------------- */

.am-rail-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 2.75rem;
}

.am-rail__sticky {
  position: sticky;
  top: 1.5rem;
}

.am-rail__list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 380px;
  overflow-y: auto;
}

button.am-rail__item {
  width: 100%;
  border: 0;
  background: transparent;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.am-rail__item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.625rem;
  padding: 0.4rem 0.625rem;
  border-radius: var(--radius-md, 0.375rem);
  font-size: 0.9375rem;
  color: color-mix(in srgb, var(--color-typography) 72%, transparent);
  text-decoration: none;
  line-height: 1.35;
}

.am-rail__item:hover {
  background: var(--color-background-tone, rgba(0, 0, 0, 0.04));
  color: var(--color-typography);
}

.am-rail__item.is-active,
.am-rail__item.active {
  background: var(--color-typography);
  color: var(--color-background);
  font-weight: 600;
}


.am-rail__search {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.55rem 0.75rem;
  margin-bottom: 1.4rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md, 0.375rem);
  background: transparent;
  color: color-mix(in srgb, var(--color-typography) 65%, transparent);
  font-family: inherit;
  font-size: 0.9375rem;
  text-align: left;
  cursor: pointer;
}

.am-rail__search:hover {
  border-color: var(--color-typography);
  color: var(--color-typography);
}

.am-rail__search-icon {
  display: flex;
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}

.am-rail__search-icon svg { width: 100%; height: 100%; }

/* ---- filter buttons -------------------------------------------------- */
/* One definition, replacing the utility strings repeated on every button. */

.filter-btn {
  display: inline-flex;
  align-items: baseline;
  gap: 0.375rem;
  padding: 0.5rem 0.7rem;
  border: 0;
  border-radius: var(--radius-md, 0.375rem);
  background: var(--color-background-tone, rgba(0, 0, 0, 0.05));
  color: color-mix(in srgb, var(--color-typography) 70%, transparent);
  font-family: inherit;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  cursor: pointer;
  line-height: 1.2;
}

.filter-btn:hover {
  color: var(--color-typography);
}

.filter-btn.active,
.filter-btn.is-active {
  background: var(--color-typography);
  color: var(--color-background);
}


/* Access: a three-way segmented control */
.am-segment {
  display: flex;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md, 0.375rem);
  overflow: hidden;
  margin-bottom: 1.4rem;
}

.am-segment .filter-btn {
  flex: 1;
  justify-content: center;
  border-radius: 0;
  background: transparent;
  padding: 0.55rem 0.25rem;
}

.am-segment .filter-btn.active {
  background: var(--color-typography);
  color: var(--color-background);
}

/* ---- grids ----------------------------------------------------------- */

.am-archive-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 1.75rem;
}


/* ---- access badges --------------------------------------------------- */
/* Three states, from Ghost's own visibility field. The middle one is the
   free-signup step and gets the accent, because that's the conversion.   */

.am-badge {
  position: absolute;
  top: 9px;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  padding: 5px 8px;
  border-radius: 4px;
  line-height: 1;
}


.am-badge--access { right: 9px; }
.am-badge--public { background: rgba(0, 0, 0, 0.06); color: color-mix(in srgb, var(--color-typography) 70%, transparent); }
.am-badge--members { background: #FAC300; color: #0A0A0A; }
.am-badge--paid { background: rgba(0, 0, 0, 0.62); color: #FFFFFF; }

/* ---- narrow screens -------------------------------------------------- */

@media (max-width: 900px) {
  .am-rail-layout { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
  .am-rail__sticky { position: static; }
  .am-rail__list { max-height: 240px; }
}

/* ==================================================================== */
/* FEATURED ESSAYS                                                       */
/* One lead at size, then a grid where the paintings are big enough to   */
/* read as paintings. No yellow fills — the lead's scale does the work.  */
/* ==================================================================== */

.am-flead {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 2.5rem;
  align-items: center;
  padding-bottom: 2.25rem;
  margin-bottom: 0.5rem;
  border-bottom: 1px solid var(--color-typography);
  text-decoration: none;
  color: var(--color-typography);
}

.am-flead__meta,
.am-fitem__meta {
  display: block;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 58%, transparent);
}

.am-flead__title {
  font-size: 34px;
  font-weight: 600;
  letter-spacing: -0.032em;
  line-height: 1.12;
  margin: 0.75rem 0;
  max-width: 20ch;
}

.am-flead__excerpt {
  font-size: 18.5px;
  line-height: 1.55;
  margin: 0;
  max-width: 48ch;
  color: color-mix(in srgb, var(--color-typography) 85%, transparent);
}

.am-flead__art {
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-lg, 0.5rem);
  overflow: hidden;
  background: var(--color-background-tone);
}

.am-flead:hover .am-flead__title { color: var(--color-brand); }

.am-fgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 2rem;
  margin-top: 2.5rem;
}

.am-fitem { display: block; text-decoration: none; color: var(--color-typography); }

.am-fitem__art {
  border-radius: var(--radius-md, 0.375rem);
  overflow: hidden;
  margin-bottom: 0.875rem;
  background: var(--color-background-tone);
}

.am-fitem__title {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.024em;
  line-height: 1.22;
  margin: 0.55rem 0 0.4rem;
}

.am-fitem__excerpt {
  font-size: 15.5px;
  line-height: 1.5;
  margin: 0;
  color: var(--color-typography-tone);
}

.am-fitem:hover .am-fitem__title { color: var(--color-brand); }

@media (max-width: 860px) {
  .am-flead { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .am-flead__title { font-size: 27px; }
}

/* Small caps eyebrow above a page title — series pages use it for "Series" */
.am-eyebrow {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 55%, transparent);
  margin: 0 0 0.75rem;
}

/* ==================================================================== */
/* POST LIST ROWS                                                        */
/* Topic · title · date, in a three-column row. Shared by the homepage    */
/* and the Essay Hub — previously duplicated, scoped to #hp on one and    */
/* copied as .am-stack on the other.                                     */
/* ==================================================================== */

.stack { margin: 0; }

.stack a {
  display: grid;
  grid-template-columns: 170px 1fr auto;
  gap: 22px;
  align-items: baseline;
  padding: 20px 4px;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: inherit;
}

.stack a:hover { background: var(--color-background-tone); }
.stack a:hover .v { color: #FAC300; }

.stack .k {
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--color-typography-tone);
}

.stack .v { font-size: 18px; font-weight: 500; line-height: 1.35; }
.stack .m { font-size: 13px; color: var(--color-typography-tone); white-space: nowrap; }

@media (max-width: 760px) {
  .stack a { grid-template-columns: 1fr; gap: 5px; }
}

/* ==================================================================== */
/* MEGA MENU                                                             */
/* A panel under the header for the Essays nav item. Desktop only —      */
/* the mobile menu already lists these pages.                            */
/* ==================================================================== */

.am-mega {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 900;
  background: var(--color-background);
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.35);
}

.am-mega[hidden] { display: none; }

/* Wider than the page container on purpose — this is chrome, and the extra
   width is what lets the artwork be worth showing. Routes stay on the left
   but at 190px rather than 230px. */
.am-mega__inner {
  max-width: 1400px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 2.5rem;
  padding: 1.875rem 1.5rem 2rem;
  white-space: normal;
}

.am-mega__label {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 50%, transparent);
  margin: 0 0 0.875rem;
}

.am-mega__route {
  display: block;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: var(--color-typography);
}

.am-mega__route:last-child { border-bottom: 0; }
.am-mega__route-title { display: block; font-size: 15px; font-weight: 600; }
.am-mega__route-sub { display: block; font-size: 13.5px; color: var(--color-typography-tone); }
.am-mega__route:hover .am-mega__route-title { color: #FAC300; }

.am-mega__channels {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.375rem;
}

.am-mega__channel {
  display: block;
  text-decoration: none;
  color: var(--color-typography);
}

.am-mega__art {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-md, 0.375rem);
  background-size: cover;
  background-position: center;
  background-color: var(--color-background-tone);
  margin-bottom: 0.75rem;
  transition: filter 0.15s ease;
}

.am-mega__channel:hover .am-mega__art { filter: brightness(0.9); }

.am-mega__channel-title {
  display: block;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.018em;
  line-height: 1.25;
}

.am-mega__channel-desc {
  display: block;
  font-size: 13.5px;
  color: var(--color-typography-tone);
  margin-top: 3px;
  line-height: 1.4;
}

.am-mega__count {
  display: block;
  margin-top: 0.45rem;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 50%, transparent);
}

.am-mega__channel:hover .am-mega__channel-title { color: #FAC300; }

/* ---- members panel --------------------------------------------------- */

.am-mega--members .am-mega__inner { max-width: 1200px; grid-template-columns: 260px minmax(0, 1fr); }

.am-mega__member-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.am-mega__mcard {
  display: flex;
  gap: 0.875rem;
  align-items: flex-start;
  padding: 0.875rem 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md, 0.375rem);
  text-decoration: none;
  color: var(--color-typography);
  transition: border-color 0.12s ease, background 0.12s ease;
}

.am-mega__mcard:hover {
  border-color: var(--color-typography);
  background: var(--color-background-tone);
}

.am-mega__mcard-icon { font-size: 20px; line-height: 1; flex-shrink: 0; padding-top: 2px; }
.am-mega__mcard-title { display: block; font-size: 15px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.25; }
.am-mega__mcard-sub { display: block; font-size: 13.5px; color: var(--color-typography-tone); margin-top: 2px; line-height: 1.4; }

.am-mega__aside {
  margin-top: 1.125rem;
  padding: 0.875rem 1rem;
  border-radius: var(--radius-md, 0.375rem);
  background: var(--color-background-tone);
}

.am-mega__aside-title { font-size: 14px; font-weight: 600; margin: 0 0 4px; }
.am-mega__aside-sub { font-size: 13.5px; color: var(--color-typography-tone); margin: 0 0 10px; line-height: 1.45; }
.am-mega__aside-link { font-size: 14px; font-weight: 600; text-decoration: none; color: var(--color-typography); box-shadow: inset 0 -2px 0 #FAC300; }

.am-mega__join { margin-top: 1.125rem; }

/* ==================================================================== */
/* SECTION HEADINGS                                                      */
/* 28px, sentence case, no rule — whatever sits below each section        */
/* already carries its own top border. Shared by the Essay Hub and the    */
/* dashboard; was scoped inside one page, so the other rendered bare.     */
/* ==================================================================== */

.am-sec-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin-bottom: 1.125rem;
}

.am-sec-h {
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.1;
  color: var(--color-typography);
  margin: 0;
}

@media (max-width: 640px) { .am-sec-h { font-size: 24px; } }

/* ==================================================================== */
/* DASHBOARD                                                             */
/* One column. Newest thing, then the four places membership gets you,   */
/* then what's coming, then account and support. No rules on every       */
/* section — the tiles carry the structure.                              */
/* ==================================================================== */

.am-dash-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: 48px 0 8px;
}

.am-dash-tier {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  padding: 6px 10px;
  border-radius: 4px;
  background: var(--color-typography);
  color: var(--color-background);
  white-space: nowrap;
}

/* ---- the newest thing ---- */

/* The essay and the Flurry, side by side. The essay is wider because it has
   artwork; the Flurry is a title and a date. */
.am-dash-new-row {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: 16px;
  margin-top: 36px;
  align-items: stretch;
}

.am-dash-new {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 200px;
  gap: 24px;
  align-items: center;
  background: var(--color-background-tone);
  border-radius: var(--radius-md, 0.375rem);
  padding: 24px 26px;
  text-decoration: none;
  color: var(--color-typography);
}

.am-dash-new--flurry {
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
}

.am-dash-new--flurry .am-dash-new__title { font-size: 21px; }

.am-dash-new__kick {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 55%, transparent);
}

.am-dash-new__title { font-size: 24px; font-weight: 600; letter-spacing: -0.026em; line-height: 1.2; margin: 9px 0 6px; }
.am-dash-new__sub { font-size: 15.5px; color: var(--color-typography-tone); margin: 0; line-height: 1.5; }
.am-dash-new__art { aspect-ratio: 4/3; border-radius: var(--radius-md, 0.375rem); overflow: hidden; background: var(--color-background); }
.am-dash-new:hover .am-dash-new__title { color: var(--color-brand); }

/* ---- tiles ---- */

.am-dash-tiles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.am-dash-tiles--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.am-dash-tile {
  display: block;
  background: var(--color-background-tone);
  border-radius: var(--radius-md, 0.375rem);
  padding: 20px 20px 22px;
  text-decoration: none;
  color: var(--color-typography);
  transition: background 0.12s ease;
}

.am-dash-tile:hover { background: color-mix(in srgb, var(--color-typography) 7%, transparent); }
.am-dash-tile__name { display: block; font-size: 17px; font-weight: 600; letter-spacing: -0.018em; margin-bottom: 6px; }
.am-dash-tile__sub { display: block; font-size: 14px; color: var(--color-typography-tone); line-height: 1.45; margin-bottom: 14px; }
.am-dash-tile__meta {
  display: block;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 45%, transparent);
}
.am-dash-tile.is-locked .am-dash-tile__name { color: var(--color-typography-tone); }

/* ---- coming up ---- */

.am-dash-next { margin-top: 34px; }

.am-dash-lab {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 55%, transparent);
  margin: 0 0 12px;
}

.am-dash-nextlist { border-top: 1px solid var(--color-border); }

.am-dash-nextlist a {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 0;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: var(--color-typography);
  font-size: 16px;
}

.am-dash-nextlist a:hover { color: var(--color-brand); }
.am-dash-next__meta { font-size: 14px; color: var(--color-typography-tone); white-space: nowrap; }

@media (max-width: 640px) {
  .am-dash-nextlist a { flex-direction: column; gap: 4px; }
  .am-dash-next__meta { white-space: normal; }
}

/* ---- account and support ---- */

.am-dash-admin {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: 48px;
  margin-top: 44px;
  padding-top: 26px;
  border-top: 1px solid var(--color-border);
}

.am-dash-note { font-size: 15px; color: var(--color-typography-tone); margin: 0 0 12px; line-height: 1.5; }

/* Account and Member support are sections, not labels. */
.am-dash-admin .am-dash-lab {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: -0.022em;
  text-transform: none;
  color: var(--color-typography);
  margin-bottom: 8px;
}

.am-dash-acctlinks { display: flex; flex-direction: column; gap: 9px; }
.am-dash-acctlinks a { font-size: 15px; color: var(--color-typography); text-decoration: none; }
.am-dash-acctlinks a:hover { color: var(--color-brand); }

@media (max-width: 900px) {
  .am-dash-new-row { grid-template-columns: minmax(0, 1fr); }
  .am-dash-new { grid-template-columns: minmax(0, 1fr); }
  .am-dash-tiles,
  .am-dash-tiles--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .am-dash-admin { grid-template-columns: minmax(0, 1fr); gap: 30px; }
}

@media (max-width: 560px) {
  .am-dash-tiles,
  .am-dash-tiles--three { grid-template-columns: minmax(0, 1fr); }
}

/* ---- footer ---------------------------------------------------------- */

.am-foot__label {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 50%, transparent);
}

/* Not An MBA: under the brand line, ruled above and below rather than boxed.
   Separate brand, separate site — so it reads as an aside, not a banner. */
.am-foot__namba {
  display: block;
  width: 100%;
  margin-top: 18px;
  padding: 16px 0 18px;
  border-top: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: var(--color-typography);
}

.am-foot__namba-title {
  display: block;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: -0.015em;
}

.am-foot__namba:hover .am-foot__namba-title { color: #FAC300; }

.am-foot__namba-sub {
  display: block;
  font-size: 13.5px;
  color: var(--color-typography-tone);
  margin-top: 4px;
  line-height: 1.5;
}

/* ==================================================================== */
/* POST CTA                                                              */
/* The ledger grammar in a dark band: yellow rule, small caps label,     */
/* the line at 30px, no box. Yellow rule = something to do; the black    */
/* rule on a bookmark = a reference.                                     */
/* ==================================================================== */

.am-cta {
  background: var(--color-typography);
  color: var(--color-background);
  border-top: 3px solid #FAC300;
  margin-top: 3.5rem;
  padding-inline: 1rem;
}

@media (min-width: 640px) { .am-cta { padding-inline: 1.5rem; } }

.am-cta__in { padding-block: 38px 40px; }

.am-cta__label {
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-background) 45%, transparent);
  margin: 0 0 16px;
}

.am-cta__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 48px;
  align-items: start;
}

@media (max-width: 900px) {
  .am-cta__grid { grid-template-columns: minmax(0, 1fr); gap: 26px; }
}

.am-cta__line {
  font-size: 30px;
  font-weight: 600;
  letter-spacing: -0.03em;
  line-height: 1.16;
  margin: 0 0 14px;
  max-width: 22ch;
}

@media (max-width: 640px) { .am-cta__line { font-size: 24px; } }

.am-cta__sub {
  font-size: 15.5px;
  line-height: 1.55;
  margin: 0;
  max-width: 48ch;
  color: color-mix(in srgb, var(--color-background) 62%, transparent);
}

/* ---- rotating quote ---- */

.am-cta__quote { margin: 0; }
.am-cta__quote[hidden] { display: none; }

.am-cta__quote p {
  font-size: 16.5px;
  line-height: 1.55;
  margin: 0 0 7px;
  color: color-mix(in srgb, var(--color-background) 80%, transparent);
  max-width: 46ch;
}

.am-cta__quote cite {
  font-style: normal;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-background) 45%, transparent);
}

/* ---- form ---- */

.am-cta__act { padding-top: 4px; }

.am-cta__form { display: flex; gap: 10px; flex-wrap: wrap; max-width: 460px; position: relative; }

.am-cta__input {
  flex: 1;
  min-width: 200px;
  padding: 14px 16px;
  border-radius: var(--radius-md, 0.375rem);
  font-size: 15px;
  font-family: inherit;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: var(--color-background);
}

.am-cta__input::placeholder { color: rgba(255, 255, 255, 0.5); }

.am-cta__btn {
  display: inline-block;
  padding: 14px 26px;
  border: 0;
  border-radius: var(--radius-md, 0.375rem);
  font-size: 15px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  background: #FAC300;
  color: #0A0A0A;
  text-decoration: none;
  white-space: nowrap;
}

.am-cta__btn:hover { filter: brightness(1.06); }

.am-cta__note {
  font-size: 13.5px;
  margin: 12px 0 0;
  line-height: 1.5;
  color: color-mix(in srgb, var(--color-background) 45%, transparent);
}

@media (max-width: 640px) {
  .am-cta__form { flex-direction: column; }
  .am-cta__btn { width: 100%; text-align: center; }
}

/* Footer: the logo is an image, so it needs its own space below rather than
   relying on a utility gap that the description then closes up. */
.am-foot__logo { display: block; margin-bottom: 14px; }

/* An outbound arrow at 45 degrees sat oddly against the type; a plain arrow
   matches every other link on the site, and the separate site is obvious
   from the destination. */
.am-foot__namba-arrow { color: #FAC300; font-weight: 700; }

/* Tag chips under a post. The theme radius is 20px, which turns a short word
   into a lozenge — these read better as chips with a small corner. */
.am-tagchip {
  display: block;
  padding: 7px 13px;
  border-radius: 4px;
  border: 1px solid var(--color-border);
  background: var(--color-background-tone);
  font-size: 14.5px;
  font-weight: 500;
  color: var(--color-typography);
  text-decoration: none;
  line-height: 1.3;
}

.am-tagchip:hover {
  border-color: var(--color-typography);
  background: var(--color-background);
}

/* The footer logo is smaller than the header's by default; on a phone the
   footer is where the mark has room, so give it back. */
@media (max-width: 640px) {
  [data-footer] [data-brand] img,
  [data-footer] [data-brand] svg { height: 34px !important; width: auto !important; }
}

/* The front door of each mega menu — Essay Hub, and Dashboard for members.
   Weighted by type rather than a box: a rule bending round a rounded corner
   read as a mistake, and a bordered card in a column of plain links looks
   like a stray button. */

.am-mega__primary {
  display: block;
  padding: 0 0 14px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--color-border);
  text-decoration: none;
  color: var(--color-typography);
}

.am-mega__primary-title {
  display: inline-block;
  font-size: 19px;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.2;
  box-shadow: inset 0 -3px 0 #FAC300;
}

.am-mega__primary:hover .am-mega__primary-title { background: rgba(250, 195, 0, 0.18); }

.am-mega__primary-sub {
  display: block;
  font-size: 13.5px;
  color: var(--color-typography-tone);
  margin-top: 6px;
}


/* ---- channel switcher ------------------------------------------------ */
/* Stacked pills in the channel hero, under the deck. Active is solid ink —
   the same state the rails use — so the selected one reads as selected. */

.am-tabs {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.375rem;
  margin-top: 1.625rem;
}

.am-tab {
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--color-typography-tone);
  text-decoration: none;
  padding: 0.55rem 1.05rem;
  border-radius: 999px;
  background: var(--color-background-tone);
  white-space: nowrap;
  transition: background 0.12s ease, color 0.12s ease;
}

.am-tab:hover {
  background: color-mix(in srgb, var(--color-typography) 10%, transparent);
  color: var(--color-typography);
}

.am-tab.is-active {
  font-weight: 600;
  background: var(--color-typography);
  color: var(--color-background);
}

.am-tab.is-active:hover { background: var(--color-typography); color: var(--color-background); }

@media (max-width: 640px) {
  .am-tab { font-size: 13.5px; padding: 0.5rem 0.9rem; }
}


/* ---- series overview ------------------------------------------------- */
/* Two columns of cards, generated from the Ghost tags. */

.am-series-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.am-series-card {
  display: block;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md, 0.375rem);
  padding: 20px 22px;
  text-decoration: none;
  color: var(--color-typography);
  transition: border-color 0.12s ease, background 0.12s ease;
}

.am-series-card:hover {
  border-color: var(--color-typography);
  background: var(--color-background-tone);
}

.am-series-card__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.am-series-card__title { font-size: 19px; font-weight: 600; letter-spacing: -0.022em; line-height: 1.2; }

.am-series-card__count {
  flex-shrink: 0;
  font-size: 0.594rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--color-typography) 45%, transparent);
}

.am-series-card__desc {
  display: block;
  font-size: 15px;
  color: var(--color-typography-tone);
  margin-top: 8px;
  line-height: 1.5;
}

@media (max-width: 820px) {
  .am-series-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Featured on the Essay Hub: three across, smaller than the Featured page,
   so it points rather than competing with the channels above it. */
.am-fgrid--tight {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.5rem;
}

.am-fgrid--tight .am-fitem__title {
  font-size: 16px;
  margin: 0.45rem 0 0;
  letter-spacing: -0.016em;
  line-height: 1.25;
}

.am-fgrid--tight .am-fitem__art { margin-bottom: 0.625rem; }

@media (max-width: 900px) {
  .am-fgrid--tight { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Default Ghost page hero — same rhythm as the built pages. */
.am-page-hero__text { gap: 0; }
.am-page-hero__text h1 { margin: 0 0 0.875rem; }
.am-page-hero__text .am-title-rule { margin-bottom: 1rem; }
.am-page-hero__text p { margin: 0; max-width: 42rem; }

/* =====================================================================
   PAYWALL  (partials/content-cta.hbs)

   Replaces Ghost's gh-post-upgrade-cta, which paints itself with the site
   accent colour — black here, so it landed as a dark slab mid-article.

   Loaded after built/app.css, so these win without !important.
   No Tailwind classes: this build is purged and most utilities are absent.

   The fade above the block is already handled by article[data-preview]:after
   in the compiled stylesheet. Nothing here touches it.

   Square corners are deliberate. The block should read as a rule drawn
   across the page, not as another rounded card.
   ===================================================================== */

.ghost-content .am-gate,
.am-gate {
  position: relative;
  z-index: 2;                       /* above the data-preview fade */
  max-width: 56ch;
  margin: 2.5rem 0 0;
  padding: 28px 30px;
  background: var(--color-background-tone);
  border: 1px solid var(--color-border);
  border-left: 4px solid #fac300;
}

.am-gate__line {
  margin: 0 0 9px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.32;
  color: var(--color-typography);
}

.am-gate__sub {
  margin: 0 0 18px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--color-typography-content);
}

.am-gate__act {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.ghost-content .am-gate a.am-gate__btn,
.am-gate__btn {
  display: inline-block;
  padding: 11px 22px;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  color: var(--color-background);
  background: var(--color-typography);
  border: 1px solid var(--color-typography);
  border-radius: 2px;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.ghost-content .am-gate a.am-gate__btn:hover,
.am-gate__btn:hover {
  background: #fac300;
  border-color: #fac300;
  color: #111;
}

.ghost-content .am-gate a.am-gate__btn--sec,
.am-gate__btn--sec {
  background: transparent;
  color: var(--color-typography);
}

.am-gate__note {
  margin: 14px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--color-typography-tone);
}

/* Stack rather than squash. */
@media (max-width: 520px) {
  .am-gate { padding: 24px 20px; }
  .am-gate__act { display: block; }
  .ghost-content .am-gate a.am-gate__btn,
  .am-gate__btn { display: block; text-align: center; margin-bottom: 8px; }
}
/* ---- brand.css ---- */
/* ==========================================================================
   Alicia McKay brand layer (October 2026)
   Loaded last. Three parts:
   1. Fonts and site-wide tokens (also restyle the Flair pages that keep
      their own markup: tag pages, essays hub, tools, dashboard).
   2. The design system from the approved mockup, scoped to .amb, which
      every new template (header, footer, home, landing, posts) wraps in.
   3. Ghost editor cards mapped onto that design system.
   ========================================================================== */

@font-face { font-family: "Alt Gothic"; src: url("../fonts/AlternateGothicATF-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Alt Gothic Comp"; src: url("../fonts/AlternateGothicCondATF-Heavy.woff") format("woff"); font-weight: 900; font-style: normal; font-display: swap; }

/* ---- 1. Tokens: Flair's own variables, set to the brand. Light only. ---- */
:root, [data-color-scheme=dark]:root, [data-color-scheme=system]:root {
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-headings: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --radius: 0px;
  --color-brand: #FAC300; --color-brand-contrast: #0b0b0c; --color-accent: #FAC300;
  --color-typography: #0b0b0c; --color-typography-tone: #66666b; --color-typography-content: #2b2825;
  --color-typography-reverse: #ffffff;
  --color-background: #ffffff; --color-background-tone: #f4f4f4; --color-background-opac: #ffffffe6;
  --color-background-reverse: #0b0b0c; --color-border: #e6e6e6; --color-border-reverse: #2c2c2e;
  --shadow: none;
  --am-yellow: #FAC300; --am-radius: 0px; --am-radius-lg: 0px;
  color-scheme: light;
}
html, body { background: #fff; }
body { font-family: var(--font-body); }
/* Flair pages: square corners, heading font in capitals for page titles only. */
.rounded-theme, .rounded-theme-xxs, .rounded-theme-xs, .rounded-theme-sm, .rounded-theme-md, .rounded-theme-lg, .rounded-theme-xl, [class*="rounded-theme"] { border-radius: 0 !important; }
.shadow-btn { box-shadow: none !important; filter: none !important; }
.main h1:not(.amb h1) { font-family: "Alt Gothic Comp", "Alt Gothic", "Arial Narrow", sans-serif; font-weight: 900; text-transform: uppercase; letter-spacing: .005em; line-height: .96; }
.bg-brand { background-color: #FAC300 !important; color: #0b0b0c !important; }
.text-brand { color: #0b0b0c !important; }
a.text-brand:hover, .hover\:text-brand:hover { color: #0b0b0c !important; text-decoration: underline; text-decoration-color: #FAC300; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.am-pill { border-radius: 0 !important; }
.am-pill:hover { background: #FAC300 !important; color: #0b0b0c !important; }
/* Old theme dark-mode switch: the brand is light only. */
[data-toggle-color-scheme] { display: none !important; }

/* The new wrapper: full width, never wider than the screen. */
.amb { display: block; overflow-x: clip; }
.amb img { max-width: 100%; }

/* Layout: Not An MBA's bones (black hero, two columns with a grey panel, square buttons, thin yellow rule)
   in Alicia's own brand: Inter only, yellow only as an accent, classic paintings as the imagery,
   and her voice set big. Single light look with black bands, by choice. */
.amb {
  --ink: #0b0b0c; --ink2: #2b2825; --grey: #66666b; --panel: #f4f4f4; --line: #e6e6e6;
  --paper: #ffffff; --yellow: #fac300;
  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  color-scheme: light;
}
.amb, .amb * { box-sizing: border-box; }
.amb, .amb { background: var(--paper); color: var(--ink); }
.amb { font-family: var(--font); font-size: 19px; line-height: 1.6; -webkit-font-smoothing: antialiased; margin: 0; }
.amb main { overflow-x: clip; }
.amb h1, .amb h2, .amb h3, .amb p { margin: 0; }
.amb h1, .amb h2, .amb h3 { font-weight: 800; letter-spacing: -0.01em; line-height: 1.12; text-wrap: balance; }
.amb a { color: inherit; }
.amb .in { max-width: 1180px; margin: 0 auto; padding-left: max(24px, env(safe-area-inset-left, 0px)); padding-right: max(24px, env(safe-area-inset-right, 0px)); }
.amb .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 30px; background: var(--yellow); color: var(--ink); font-weight: 700; font-size: 17px; text-decoration: none; border: 2px solid var(--yellow); border-radius: 0; cursor: pointer; font-family: inherit; }
.amb .btn:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.amb .dark .btn:hover { background: #fff; color: var(--ink); border-color: #fff; }
.amb .btn.out { background: transparent; color: #fff; border-color: #fff; }
.amb .btn.out:hover { background: #fff; color: var(--ink); }
.amb .btn.ink { background: transparent; color: var(--ink); border-color: var(--ink); }
.amb .btn.ink:hover { background: var(--ink); color: #fff; }
.amb a:focus-visible, .amb button:focus-visible, .amb .btn:focus-visible, .amb input:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
.amb .rule { display: block; width: 120px; height: 3px; background: var(--yellow); margin: 30px 0; }
.amb .rule.s { width: 64px; margin: 0 0 22px; }
.amb .quote .rule.s { background: var(--ink); }
.amb .dark .quote .rule.s { background: #fff; }
.amb .art { background: linear-gradient(160deg, #3b3127 0%, #6b5a45 38%, #2a2622 100%); color: #d8cdbd; display: flex; align-items: flex-end; padding: 18px 20px; font-size: 13px; }
.amb .art.light { background: linear-gradient(170deg, #ccc4b8, #a69c8f); color: #3b3631; }

/* Header */
.amb .dark { background: var(--ink); color: #fff; }
.amb .top { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; min-height: 92px; flex-wrap: wrap; }
.amb .logo { font-weight: 900; font-size: 26px; letter-spacing: -0.01em; text-decoration: none; }
.amb .logo img { display: block; height: 30px; width: auto; }
.amb .flogo { display: block; height: 34px; width: auto; max-width: 100%; }
@media (max-width: 900px) { .amb .logo img { height: 24px; } }
.amb .top .nav { font-size: 17px; font-weight: 500; }

/* Hero: words left, a picture right, edge to edge */
.amb .hero { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); min-height: 600px; }
.amb .hero .words { padding: 88px max(24px, calc((100vw - 1180px) / 2 + 24px)) 96px; padding-right: 56px; display: flex; flex-direction: column; justify-content: center; }
.amb .hero h1 { font-size: clamp(48px, 6vw, 88px); font-weight: 900; letter-spacing: -0.015em; line-height: 1.06; }
.amb .hero h1.md { font-size: clamp(44px, 5.4vw, 80px); }
.amb .hero h1 span { color: var(--yellow); }
.amb .hero .kick { font-size: 17px; font-weight: 700; color: var(--yellow); margin-bottom: 18px; }
.amb .hero p { font-size: 21px; color: #e4e4e4; max-width: 720px; }
.amb .hero p + p { margin-top: 14px; }
.amb .hero .btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 40px; }
.amb .hero .art { min-height: 100%; font-size: 14px; }

/* Proof strip */
.amb .ticker { overflow: hidden; background: var(--ink); color: #fff; border-top: 1px solid #222; }
.amb .ticker .tr { display: flex; gap: 44px; white-space: nowrap; padding-block: 20px; font-weight: 700; font-size: 17px; width: max-content; animation: tick 70s linear infinite; }
.amb .ticker .tr span::after { content: "\00B7"; margin-left: 44px; color: var(--yellow); }
@keyframes tick { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .amb .ticker .tr { animation: none; flex-wrap: wrap; white-space: normal; width: auto; padding-inline: 24px; gap: 8px 28px; } }

/* Sections */
.amb .sec { padding-block: 104px; }
.amb .sec.grey { background: var(--panel); }
.amb .sec h2 { font-size: clamp(40px, 5vw, 68px); margin-bottom: 52px; }
.amb .sec h2.sm { font-size: clamp(32px, 3.6vw, 48px); margin-bottom: 28px; }
.amb .cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: start; }
.amb .cols p + p, .amb .cols p + ul, .amb .cols ul + p, .amb .stack > * + * { margin-top: 18px; }
.amb .cols ul, .amb .stack ul { padding-left: 22px; margin: 18px 0 0; display: flex; flex-direction: column; gap: 10px; }
.amb .stack { max-width: 780px; }
.amb .panel { background: var(--panel); padding: 40px 34px; }
.amb .panel h3 { font-size: 22px; letter-spacing: 0; line-height: 1.25; }
.amb .quote { margin-top: 56px; }
.amb .quote p { font-weight: 800; font-size: 26px; line-height: 1.32; letter-spacing: -0.005em; }
.amb .quote cite { display: block; margin-top: 14px; font-style: normal; font-size: 16px; color: var(--grey); }
.amb .quote cite b { color: var(--ink); }
.amb .dark .quote cite { color: #bdbdbd; } .amb .dark .quote cite b { color: #fff; }
.amb .quotes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 64px; }
.amb .quotes .quote { margin-top: 0; padding: 28px 0 44px; border-top: 2px solid var(--ink); }
.amb .quotes .quote .rule { display: none; }
.amb .actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 40px; }
.amb .b { font-weight: 700; }
.amb .three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 48px; }
@media (max-width: 900px) { .amb .three { grid-template-columns: 1fr; } }

/* Essay: the painting carries it */
.amb .essay { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.amb .essay .art { aspect-ratio: 4 / 3; }
.amb .essay .date { font-size: 16px; color: var(--grey); }
.amb .essay h3 { font-size: clamp(34px, 3.8vw, 52px); margin-top: 10px; }
.amb .essay h3 a { text-decoration: none; }
.amb .essay h3 a:hover { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 4px; text-underline-offset: 8px; }
.amb .essay .first { font-size: 24px; font-weight: 700; margin-top: 20px; }
.amb .sub { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; margin-top: 64px; padding: 34px; background: var(--panel); }
.amb .sub h3 { font-size: 24px; grid-column: 1 / -1; }
.amb .sub p { grid-column: 1 / -1; color: var(--ink2); font-size: 17px; margin-top: -2px; }
.amb .sub form { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px; }
.amb .sub input { flex: 1 1 260px; min-height: 54px; border: 2px solid var(--ink); border-radius: 0; padding: 0 16px; font: inherit; font-size: 17px; background: #fff; }
.amb .vh { position: absolute; left: -9999px; }

/* Statement */
.amb .state { padding-block: 120px; border-block: 1px solid var(--line); }
.amb .state p { font-size: clamp(56px, 10vw, 150px); font-weight: 900; letter-spacing: -0.02em; line-height: 1.02; }
.amb .state p span { display: block; }
.amb .yband2 { background: var(--ink); color: #fff; border: 0; }
.amb .yband2 .small { color: #d4d4d4 !important; }
.amb .yband2 .motto { color: var(--yellow); }
.amb .yband2 .sub { background: #fff; color: var(--ink); }
.amb .state .sub p { font-size: 17px; font-weight: 400; letter-spacing: 0; line-height: 1.5; }
.amb .state .sub p.b { font-weight: 700; }
.amb .state .sub { margin-top: 56px; }
.amb .state .motto { font-size: 20px; font-weight: 700; letter-spacing: 0; line-height: 1.4; margin-bottom: 14px; }
.amb .state .small { font-size: 20px; font-weight: 500; letter-spacing: 0; line-height: 1.5; color: var(--ink2); max-width: 640px; margin-top: 32px; }
.amb .state.sm p:not(.small) { font-size: clamp(44px, 7vw, 104px); }

.amb .wheel { width: 100%; max-width: 440px; height: auto; display: block; margin: 0 auto; }
.amb .talks { list-style: none; padding: 0 !important; margin: 22px 0 0; gap: 0 !important; }
.amb .talks li { padding: 14px 0; border-bottom: 1px solid var(--line); }
.amb .talks li:first-child { border-top: 2px solid var(--ink); }
.amb .talks b { font-size: 21px; letter-spacing: 0; display: block; }
.amb .talks span { display: block; font-size: 15px; color: var(--grey); }

.amb .me { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
.amb .me .art { aspect-ratio: 4 / 5; }

.amb .dark .talks li { border-color: #2c2c2e; }
.amb .dark .talks li:first-child { border-top-color: #fff; }


.amb .pic { display: block; width: 100%; height: 100%; object-fit: cover; }
.amb .hero .pic { min-height: 100%; }
/* Essay page */
.amb .ptop { padding-block: 72px 56px; }
.amb .ptop .tags { font-size: 15px; font-weight: 700; color: var(--yellow); }
.amb .ptop .tags a { text-decoration: none; } .amb .ptop .tags a + a::before { content: " · "; color: #777; }
.amb .ptop h1 { font-size: clamp(46px, 6vw, 88px); font-weight: 900; line-height: 1.04; margin-top: 18px; max-width: 1000px; }
.amb .ptop .dek { font-size: clamp(19px, 1.95vw, 24px); font-weight: 500; color: #e4e4e4; margin-top: 20px; }
.amb .ptop .by { font-size: 15px; color: #bdbdbd; margin-top: 26px; }
.amb .ptop .by b { color: #fff; }
.amb .prose { max-width: 700px; margin: 0 auto; padding-block: 56px 40px; font-size: 20px; line-height: 1.7; }
.amb .prose p + p { margin-top: 24px; }
.amb .prose p.first::first-line { font-weight: 700; }
.amb .prose .lines span { display: block; height: 14px; background: #ececec; margin-top: 16px; }
.amb .prose .lines span:nth-child(3n) { width: 82%; } .amb .prose .lines span:nth-child(4n) { width: 64%; }
.amb .prose blockquote { margin: 48px 0; padding: 0; }
.amb .prose blockquote p { font-size: 30px; font-weight: 800; line-height: 1.25; }
.amb .prose blockquote::before { content: ""; display: block; width: 64px; height: 3px; background: var(--yellow); margin-bottom: 20px; }
.amb .prose .sub { margin-top: 48px; }
.amb .share { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 15px; font-weight: 700; padding-top: 28px; border-top: 1px solid var(--line); margin-top: 48px; }
.amb .share a { border: 2px solid var(--ink); padding: 8px 14px; text-decoration: none; }
.amb .more { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.amb .more a { text-decoration: none; display: flex; flex-direction: column; gap: 12px; }
.amb .more .art { aspect-ratio: 4 / 3; }
.amb .more b { font-size: 24px; line-height: 1.15; font-weight: 800; }
.amb .more span { font-size: 15px; color: var(--grey); }
html.ag .amb .ptop h1 { font-size: clamp(60px, 8vw, 120px); line-height: 0.96; }
html.ag .amb .more b { font-family: "Alt Gothic", sans-serif; font-weight: 700; font-size: 32px; line-height: 1; }
@media (max-width: 900px) {  .amb .more { grid-template-columns: 1fr; } .amb .prose { font-size: 18px; } .amb .prose blockquote p { font-size: 24px; } }

/* Hub and member pages */
.amb .ptop .tags span { color: var(--yellow); }
.amb .evl { border-top: 2px solid var(--ink); }
.amb .ev { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.amb .ev .d { font-size: 14px; font-weight: 700; color: var(--grey); line-height: 1.2; }
.amb .ev .d b { display: block; font-size: 40px; color: var(--ink); line-height: 1; font-weight: 900; }
.amb .ev .t b { display: block; font-size: 22px; line-height: 1.25; }
.amb .ev .t > span { display: block; font-size: 15px; color: var(--grey); margin-top: 4px; }
.amb .ev .btn { min-height: 44px; padding: 0 20px; font-size: 15px; }
.amb .ev .go { font-size: 15px; font-weight: 700; text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.amb .ev:hover .t b { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.amb .evl.past .d b { color: var(--grey); }
.amb .lock { background: var(--ink); color: #fff; padding: 36px; margin-top: 0; }
.amb .lock b { font-size: 24px; } .amb .lock p { color: #d4d4d4; margin-top: 8px; }
.amb .tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 64px; }
.amb .tiles a { border-top: 4px solid var(--ink); background: var(--panel); padding: 22px 22px 26px; text-decoration: none; display: flex; flex-direction: column; gap: 6px; }
.amb .tiles b { font-size: 22px; } .amb .tiles span { font-size: 15px; color: var(--ink2); } .amb .tiles em { font-style: normal; font-size: 13px; font-weight: 800; margin-top: auto; padding-top: 10px; }
.amb .tiles a:hover { border-top-color: var(--yellow); }
.amb .links { list-style: none; padding: 0 !important; margin: 0; border-top: 2px solid var(--ink); display: block !important; }
.amb .links li { border-bottom: 1px solid var(--line); }
.amb .links a { display: block; padding: 14px 0; font-weight: 700; text-decoration: none; }
.amb .links a span { display: block; font-weight: 400; font-size: 15px; color: var(--grey); }
.amb .links a:hover { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.amb .tagl { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 56px; align-items: start; }
.amb .tagl aside { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 2px; }
.amb .tagl aside .h { font-size: 13px; font-weight: 800; color: var(--grey); margin-bottom: 8px; }
.amb .tagl aside a { font-weight: 700; padding: 6px 0; text-decoration: none; }
.amb .tagl aside a:hover { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; }
.amb .rows .row { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 28px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--line); text-decoration: none; }
.amb .rows .row:first-child { border-top: 2px solid var(--ink); }
.amb .rows .row .pic, .amb .rows .row .art { aspect-ratio: 3 / 2; height: auto; }
.amb .rows .row b { display: block; font-size: 28px; line-height: 1.12; font-weight: 800; margin-top: 6px; }
.amb .rows .row .date { font-size: 14px; color: var(--grey); } .amb .rows .row span > span:last-child { color: var(--ink2); font-size: 17px; display: block; margin-top: 6px; }
.amb .chan { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.amb .chan a { text-decoration: none; display: flex; flex-direction: column; gap: 6px; }
.amb .chan .art { aspect-ratio: 4 / 5; margin-bottom: 10px; }
.amb .chan b { font-size: 26px; line-height: 1.05; } .amb .chan span { color: #bdbdbd; font-size: 15px; } .amb .chan em { font-style: normal; font-weight: 700; font-size: 14px; color: var(--yellow); }
.amb .flist { list-style: none; padding: 0 !important; margin: 0; border-top: 2px solid var(--ink); display: block !important; counter-reset: f; }
.amb .flist li { border-bottom: 1px solid var(--line); counter-increment: f; }
.amb .flist a { display: grid; grid-template-columns: 44px 1fr; padding: 16px 0; font-size: 21px; font-weight: 800; text-decoration: none; line-height: 1.25; }
.amb .flist a::before { content: counter(f, decimal-leading-zero); color: var(--grey); font-size: 15px; padding-top: 4px; }
.amb .series { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 32px; border-top: 2px solid var(--ink); }
.amb .series a { padding: 18px 0; border-bottom: 1px solid #ddd; text-decoration: none; display: flex; justify-content: space-between; gap: 12px; }
.amb .series b { font-size: 19px; } .amb .series span { color: var(--grey); font-size: 15px; white-space: nowrap; }
.amb .bk { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 56px; align-items: start; padding: 48px 0; border-top: 1px solid var(--line); }
.amb .bk:first-child { border-top: 0; padding-top: 0; }
.amb .bk .art { aspect-ratio: 2 / 3; }
.amb .bk h2.sm { margin-bottom: 6px !important; } .amb .bk .sub2 { font-size: 20px; font-weight: 700; color: var(--ink2); margin-bottom: 18px; } .amb .bk p + p { margin-top: 14px; }
.amb .svc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.amb .svc a { text-decoration: none; display: flex; flex-direction: column; gap: 12px; border-top: 4px solid var(--ink); padding-top: 20px; }
.amb .svc .art { aspect-ratio: 4 / 3; } .amb .svc h3 { font-size: 34px; } .amb .svc p { font-size: 17px; color: var(--ink2); } .amb .svc em { font-style: normal; font-weight: 800; font-size: 15px; margin-top: auto; }
.amb .svc .nmb { background: var(--ink); align-items: center; justify-content: center; padding: 0; } .amb .svc .nmb img { width: 72%; height: auto; }
.amb .svc a:hover { border-top-color: var(--yellow); }
html.ag .amb .ev .d b, html.ag .amb .chan b, html.ag .amb .svc h3, html.ag .amb .rows .row b, html.ag .amb .tiles b { font-family: var(--hf, "Alt Gothic"), sans-serif; font-weight: 700; }
html.ag.caps .amb .ev .d b, html.ag.caps .amb .chan b, html.ag.caps .amb .svc h3, html.ag.caps .amb .tiles b { text-transform: uppercase; }
html.cb .amb .ev .d b { font-size: 48px; } html.cb .amb .chan b { font-size: 34px; } html.cb .amb .svc h3 { font-size: 42px; } html.cb .amb .rows .row b { font-size: 34px; } html.cb .amb .tiles b { font-size: 28px; }
@media (max-width: 980px) { .amb .tiles, .amb .chan { grid-template-columns: repeat(2, minmax(0, 1fr)); }  .amb .series, .amb .svc { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .amb .ev { grid-template-columns: 76px minmax(0, 1fr); } .amb .ev .btn, .amb .ev .go { grid-column: 2; justify-self: start; }
  .amb .tagl, .amb .bk, .amb .rows .row { grid-template-columns: 1fr; gap: 20px; } .amb .tagl aside { position: static; flex-direction: row; flex-wrap: wrap; gap: 4px 16px; }
  .amb .tiles, .amb .chan, .amb .series, .amb .svc { grid-template-columns: 1fr; } .amb .bk .art { max-width: 200px; }
}
/* Keynote cards, books, formats, steps, questions */
.amb .kn { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); }
.amb .kn > div { padding: 30px 28px 34px 0; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px; }
.amb .kn > div:not(:nth-child(3n+1)) { padding-left: 28px; border-left: 1px solid var(--line); }
.amb .kn .lab { font-size: 14px; font-weight: 800; }
.amb .kn h3 { font-size: 27px; }
.amb .kn p { font-size: 17px; color: var(--ink2); }
.amb .kn .given { font-size: 14.5px; color: var(--grey); margin-top: auto; padding-top: 6px; }
.amb .kn .given b { color: var(--ink); }
.amb .books { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin-top: 36px; }
.amb .books .art { aspect-ratio: 2 / 3; }
.amb .books b { display: block; margin-top: 16px; font-size: 20px; line-height: 1.25; }
.amb .books span { display: block; font-size: 16px; color: var(--grey); margin-top: 4px; }
.amb .steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; counter-reset: s; }
.amb .steps li { counter-increment: s; font-size: 16px; color: var(--ink2); }
.amb .steps li::before { content: counter(s); display: block; font-size: 56px; font-weight: 900; color: var(--yellow); line-height: 1; margin-bottom: 12px; }
.amb .steps b { display: block; color: var(--ink); font-size: 20px; margin-bottom: 4px; }
.amb .faq { max-width: 860px; border-top: 2px solid var(--ink); }
.amb .faq div { padding: 22px 0; border-bottom: 1px solid var(--line); }
.amb .faq b { display: block; font-size: 20px; }
.amb .faq p { margin-top: 6px; color: var(--ink2); font-size: 17px; }
.amb .names p { font-size: 18px; } .amb .names p + p { margin-top: 14px; }
.amb .media { font-size: clamp(20px, 2.2vw, 28px); font-weight: 800; line-height: 1.5; }
.amb .media span { white-space: nowrap; } .amb .media span::after { content: " / "; color: var(--yellow); font-weight: 400; } .amb .media span:last-child::after { content: ""; }

.amb footer { background: var(--ink); color: #fff; padding-block: 72px 56px; }
.amb .fgrid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 32px; font-size: 16px; }
.amb .fgrid ul { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-direction: column; gap: 8px; color: #cfcfcf; }
.amb .fgrid a { text-decoration: none; }
.amb .fgrid a:hover { color: #fff; text-decoration: underline; text-decoration-color: var(--yellow); }
.amb .fnote { margin-top: 48px; font-size: 14px; color: #9a9a9a; }

@media (max-width: 980px) {
  .amb .kn { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .amb .kn > div:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .amb .kn > div:nth-child(2n) { padding-left: 24px; border-left: 1px solid var(--line); }
   .amb .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .amb .hero, .amb .cols, .amb .essay, .amb .me, .amb .fgrid, .amb .quotes, .amb .books { grid-template-columns: 1fr; gap: 36px; }
  .amb .quotes { gap: 0; }
  .amb .hero .words { padding: 56px 24px 64px; }
  .amb .hero .art { min-height: 300px; }
  .amb .sec { padding-block: 64px; }
  .amb .state { padding-block: 72px; }
  .amb .sec h2 { margin-bottom: 32px; }
  .amb .me .art { max-width: 300px; }
  .amb .books .art { max-width: 220px; }
  .amb .btn { width: 100%; }
  .amb .top { min-height: 76px; }
}
@media (max-width: 640px) {
  .amb .kn, .amb .steps { grid-template-columns: 1fr; }
  .amb .kn > div:nth-child(2n) { padding-left: 0; border-left: 0; }
}


/* Shared menu: About · Books · Essays ▾ · Services ▾ · Members ▾ · Contact · Not An MBA button */
.amb .hdr { position: relative; z-index: 30; }
.amb .nav { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 26px; }
.amb .nav a, .amb .nav button { font: inherit; color: inherit; background: none; border: 0; padding: 6px 0; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.amb .nav a:not(.btn):hover, .amb .nav button:hover, .amb .nav [aria-current="page"], .amb .nav [aria-expanded="true"] { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 2px; text-underline-offset: 7px; }
.amb .nav .car { font-size: .7em; opacity: .7; }
.amb .nav a.btn { background: var(--yellow); color: var(--ink); border: 2px solid var(--yellow); }
.amb .nav a.btn:hover { background: #fff; color: var(--ink); border-color: #fff; text-decoration: none; }
.amb .nav .btn { padding: 0 18px; min-height: 44px; font-size: 15px; text-decoration: none; }
.amb .menu-t { display: none; font: inherit; font-weight: 700; font-size: 16px; color: inherit; background: none; border: 2px solid currentColor; border-radius: 0; min-height: 44px; padding: 0 16px; cursor: pointer; }
.amb .dd { position: absolute; left: 0; right: 0; top: 100%; background: #fff; color: var(--ink); border-top: 1px solid var(--line); border-bottom: 2px solid var(--ink); box-shadow: 0 24px 40px rgba(0,0,0,.12); padding-block: 36px 40px; font-size: 16px; line-height: 1.45; }
.amb .dd[hidden] { display: none; }
.amb .dd .g { display: grid; grid-template-columns: 230px repeat(var(--n, 4), minmax(0, 1fr)); gap: 28px; align-items: start; }
.amb .dd .side { display: flex; flex-direction: column; gap: 4px; border-right: 1px solid var(--line); padding-right: 24px; }
.amb .dd .side .h { font-size: 13px; font-weight: 800; margin-bottom: 6px; }
.amb .dd a { text-decoration: none; color: var(--ink); }
.amb .dd .side a { padding: 8px 0; }
.amb .dd b { display: block; font-weight: 800; font-size: 17px; letter-spacing: -0.01em; }
.amb .dd span { display: block; color: var(--grey); font-size: 14.5px; }
.amb .dd em { display: block; font-style: normal; font-weight: 700; font-size: 13.5px; margin-top: 6px; }
.amb .dd .c { display: flex; flex-direction: column; gap: 4px; }
.amb .dd .c .pic { aspect-ratio: 16 / 10; background: linear-gradient(160deg, #3b3127, #6b5a45 45%, #2a2622); color: #d8cdbd; font-size: 12px; display: flex; align-items: flex-end; padding: 10px; margin-bottom: 10px; }
.amb .dd a:hover b { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 5px; }
.amb .dd .list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 28px; max-width: 760px; }
.amb .dd .list a { padding: 10px 0; border-bottom: 1px solid var(--line); font-weight: 700; }
@media (max-width: 900px) {
  .amb .menu-t { display: inline-flex; align-items: center; }
  .amb .nav { display: none; width: 100%; flex-direction: column; align-items: stretch; gap: 0; padding-bottom: 14px; }
  .amb .hdr.open .nav { display: flex; }
  .amb .nav a, .amb .nav button { padding: 13px 0; border-bottom: 1px solid rgba(128,128,128,.3); justify-content: space-between; width: 100%; text-align: left; }
  .amb .nav .btn { margin-top: 14px; justify-content: center; border-bottom: 0; }
  .amb .dd { position: static; box-shadow: none; padding-block: 14px 18px; border-bottom: 1px solid var(--line); margin: 0 calc(-1 * max(24px, env(safe-area-inset-left, 0px))); }
  .amb .nav .dd .in { padding-left: 20px; padding-right: 20px; }
  .amb .nav .dd a { border-bottom: 0; padding: 10px 0; width: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 2px; }
  .amb .dd .g { display: flex; flex-direction: column; gap: 6px; }
  .amb .dd .g > .c { order: 1; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .amb .dd .g > .side { order: 2; padding-top: 6px; }
  .amb .dd .side a b { font-size: 15.5px; }
  .amb .dd .side a span { font-size: 14px; }
  .amb .dd .c .nl { height: 26px; width: auto; margin-bottom: 4px; }
  .amb .nav .dd .list a { border-bottom: 1px solid var(--line); }
  .amb .dd .g, .amb .dd .list { grid-template-columns: 1fr; gap: 12px; }
  .amb .dd .side { border-right: 0; padding-right: 0; }
  .amb .dd .c .pic { display: none; }
  .amb .hdr:not(.open) .dd { display: none; }
  .amb .dd .c { align-items: flex-start; text-align: left; }
}


/* ===== Review round 1 ===== */
.amb .contents ol { counter-reset: none; } .amb .contents li::before { content: none !important; } .amb .contents li { padding: 5px 0; }
/* Subheadings: plain Inter */
html.ag .amb .gc h2, .amb .gc h2 { font-family: var(--font) !important; font-size: 27px !important; font-weight: 700 !important; letter-spacing: -0.01em !important; text-transform: none !important; line-height: 1.25 !important; margin-top: 52px; }
html.ag .amb .gc h3, .amb .gc h3 { font-family: var(--font) !important; font-size: 21px !important; font-weight: 700 !important; text-transform: none !important; }
/* Quote first style = 2B, no Alternate Gothic anywhere in quotes */
.amb .gc blockquote:not(.alt), .amb .ds blockquote:not(.alt):not(.q1):not(.q3):not(.q4) { border: 0 !important; position: relative; padding: 0 0 0 54px !important; }
.amb .gc blockquote:not(.alt)::before, .amb .ds blockquote:not(.alt):not(.q1):not(.q3):not(.q4)::before { content: "“"; position: absolute; left: 0; top: -18px; font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 56px; line-height: 1; color: var(--ink); }
.amb .gc blockquote:not(.alt) p, .amb .ds blockquote:not(.alt):not(.q1):not(.q3):not(.q4) p { font-size: 21px !important; font-weight: 700 !important; line-height: 1.45 !important; }
/* Pull quote: Inter, big, between two rules */
.amb .gc blockquote.alt, .amb .ds blockquote.alt { border-top: 2px solid var(--ink) !important; border-bottom: 2px solid var(--ink) !important; padding: 22px 0 !important; }
.amb .gc blockquote.alt::before, .amb .ds blockquote.alt::before { content: none !important; display: none !important; }
.amb .gc blockquote.alt p, .amb .ds blockquote.alt p, html.ag .amb .gc blockquote.alt p, html.ag .amb .ds blockquote.alt p, html.calm .amb .gc blockquote.alt p, html.calm .amb .ds blockquote.alt p { font-family: var(--font) !important; text-transform: none !important; font-weight: 800 !important; font-size: clamp(26px, 2.8vw, 34px) !important; line-height: 1.22 !important; letter-spacing: -0.015em !important; }
/* Header tags change on hover */
.amb .pills a { transition: background .15s, color .15s, border-color .15s; }
.amb .pills a:hover, .amb .pills a:focus-visible { background: var(--yellow); color: var(--ink) !important; border-color: var(--yellow); }
/* Side rail 3A for long essays */
.amb .pbody.rail3 { grid-template-columns: 190px minmax(0, 700px); gap: 56px; }
.amb .rail3 .ra { position: sticky; top: 24px; align-self: start; }
@media (max-width: 900px) { .amb .pbody.rail3 { grid-template-columns: 1fr; } .amb .rail3 .ra { position: static; } }
/* Event hero with a picture */
.amb .h-ev { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.amb .h-ev .pic, .amb .h-ev .art { aspect-ratio: 4 / 3; border-radius: 4px; }
@media (max-width: 900px) { .amb .h-ev { grid-template-columns: 1fr; } }
/* Bookmark options round 2: like 4E, no arrows, no web address */
/* Phones: pictures come first, so they aren't buried under the text */
@media (max-width: 900px) {
  .amb .hero > .art, .amb .hero > .pic, .amb .hero > img { order: -1; min-height: 0 !important; height: 340px; }
  .amb .hero > img.pic { object-position: 58% 18% !important; }
  .amb .hero .words { padding-top: 36px; }
  .amb .cols > .art, .amb .cols > div > .art:only-child { order: -1; aspect-ratio: 16 / 10 !important; }
  .amb .me > .art { order: -1; }
}
@media (max-width: 640px) {
  .amb .evbox { grid-template-columns: 1fr 1fr; gap: 16px; } .amb .evbox .btn { grid-column: 1 / -1; } .amb .evbox > div:nth-child(3) { grid-column: 1 / -1; }
}


html.caps .amb .sub h3, html.caps .amb .panel h3, html.caps .amb .more b, html.caps .amb .ev .d b, html.caps .amb .chan b, html.caps .amb .rows .row b, html.caps .amb .tiles b, html.caps .amb .svc h3, html.caps .amb .kn h3, html.caps .amb .signup h3, html.caps .amb .pcta h3, html.caps .amb .essay h3 { text-transform: uppercase; }
/* Post subheadings go back to Inter so they never compete with the pull quote */
html.ag .amb .gc h2, html.ag .amb .gc h3 { font-family: var(--font) !important; text-transform: none !important; font-weight: 800 !important; letter-spacing: -0.01em !important; line-height: 1.15 !important; }
html.ag .amb .gc h2 { font-size: 32px !important; } html.ag .amb .gc h3 { font-size: 23px !important; }


/* Heading font test: Alternate Gothic ATF Bold (mockup only; the live site needs a web licence) */
html.ag .amb h1, html.ag .amb h2, html.ag .amb h3, html.ag .amb .logo, html.ag .amb .state > .in > p:not(.small):not(.motto), html.ag .amb .steps li::before, html.ag .amb footer .fgrid > div:first-child > b {
  font-family: var(--hf, "Alt Gothic"), "Arial Narrow", sans-serif; font-weight: 700; letter-spacing: 0.004em; line-height: 0.98; }
html.ag .amb .hero h1 { font-size: clamp(64px, 8vw, 124px); }
html.ag .amb .hero h1.md { font-size: clamp(60px, 7vw, 108px); }
html.ag .amb .sec h2 { font-size: clamp(52px, 6.4vw, 92px); }
html.ag .amb .sec h2.sm { font-size: clamp(42px, 4.6vw, 64px); }
html.ag .amb .state > .in > p:not(.small):not(.motto) { font-size: clamp(76px, 13vw, 200px); line-height: 0.92; }
html.ag .amb .state.sm > .in > p:not(.small):not(.motto) { font-size: clamp(60px, 9vw, 140px); }
html.ag .amb .essay h3 { font-size: clamp(44px, 4.8vw, 68px); }
html.ag .amb .kn h3 { font-size: 34px; }
html.ag .amb .panel h3, html.ag .amb .sub h3 { font-size: 30px; letter-spacing: 0.01em; }
html.ag .amb .logo { font-size: 34px; }
html.ag.caps .amb h1, html.ag.caps .amb h2, html.ag.caps .amb h3, html.ag.caps .amb .state > .in > p:not(.small):not(.motto), html.ag.caps .amb .logo { text-transform: uppercase; letter-spacing: 0.012em; }
/* Condensed Heavy: narrower than Bold, so everything goes up a size */
html.cb .amb { --hf: "Alt Gothic Comp"; } /* now Condensed Heavy */
html.cb .amb h1, html.cb .amb h2, html.cb .amb h3, html.cb .amb .logo, html.cb .amb .state > .in > p:not(.small):not(.motto), html.cb .amb .steps li::before { font-weight: 900; letter-spacing: 0.01em; line-height: 0.92; }
html.cb .amb .hero h1 { font-size: clamp(70px, 9vw, 140px); }
html.cb .amb .hero h1.md { font-size: clamp(66px, 7.8vw, 122px); }
html.cb .amb .sec h2 { font-size: clamp(56px, 7.2vw, 104px); }
html.cb .amb .sec h2.sm { font-size: clamp(46px, 5vw, 72px); }
html.cb .amb .state > .in > p:not(.small):not(.motto) { font-size: clamp(84px, 14.5vw, 224px); line-height: 0.88; }
html.cb .amb .state.sm > .in > p:not(.small):not(.motto) { font-size: clamp(66px, 10vw, 152px); }
html.cb .amb .essay h3 { font-size: clamp(50px, 5.4vw, 76px); }
html.cb .amb .kn h3 { font-size: 38px; }
html.cb .amb .panel h3, html.cb .amb .sub h3 { font-family: "Alt Gothic", sans-serif; font-weight: 700; font-size: 30px; letter-spacing: 0.01em; }
html.cb:not(.caps) .amb h1, html.cb:not(.caps) .amb h2, html.cb:not(.caps) .amb .state > .in > p:not(.small):not(.motto) { letter-spacing: 0.018em; }
html.cb .amb .state .motto { margin-bottom: 22px; }
html.cb.caps .amb .state > .in > p:not(.small):not(.motto) { font-size: clamp(64px, 11.6vw, 180px); }
html.cb.caps .amb .state.sm > .in > p:not(.small):not(.motto) { font-size: clamp(56px, 8.6vw, 132px); }
html.cb .amb .ptop h1 { font-size: clamp(66px, 9vw, 134px); line-height: 0.92; }
html.cb .amb .more b { font-family: "Alt Gothic Comp", sans-serif; font-weight: 900; font-size: 36px; }
/* Not An MBA appears as its own logo, never retyped */
.amb .nlogo { margin-bottom: 44px; line-height: 0; }
.amb .nlogo img { display: block; height: clamp(48px, 6vw, 76px); width: auto; max-width: 100%; }
.amb .nlogo.sm { margin-bottom: 4px; } .amb .nlogo.sm img { height: 40px; }
.amb .dd .nl { display: block; height: 26px; width: auto !important; max-width: 100%; align-self: flex-start; object-fit: contain; margin: 4px 0 8px; }

/* Calmer: same system, turned down about a fifth */
html.calm.cb .amb .hero h1 { font-size: clamp(60px, 7.6vw, 118px); }
html.calm.cb .amb .hero h1.md { font-size: clamp(56px, 6.8vw, 104px); }
html.calm.cb .amb .sec h2 { font-size: clamp(48px, 5.9vw, 84px); }
html.calm.cb .amb .sec h2.sm { font-size: clamp(40px, 4.2vw, 60px); }
html.calm.cb.caps .amb .state > .in > p:not(.small):not(.motto) { font-size: clamp(52px, 8.4vw, 128px); }
html.calm.cb.caps .amb .state.sm > .in > p:not(.small):not(.motto) { font-size: clamp(46px, 6.6vw, 100px); }
html.calm.cb .amb .ptop h1 { font-size: clamp(56px, 7.2vw, 108px); }
html.calm.ag .amb .h-split h1, html.calm.ag .amb .h-cover h1, html.calm.ag .amb .h-plain h1 { font-size: clamp(50px, 5.9vw, 88px); }
html.calm.ag .amb .h-plate h1 { font-size: clamp(58px, 7.6vw, 122px); }
html.calm.cb .amb .essay h3 { font-size: clamp(40px, 4.4vw, 60px); }
html.calm.cb .amb .kn h3 { font-size: 32px; } html.calm.cb .amb .svc h3 { font-size: 34px; } html.calm.cb .amb .chan b { font-size: 28px; }
html.calm .amb .ptop { padding-block: 60px 44px; }
html.calm .amb .sec { padding-block: 88px; }
html.calm .amb .mark { font-size: 16px; padding: 5px 8px 3px; }
html.calm .amb .gc blockquote.alt p, html.calm .amb .ds blockquote.alt p { font-size: clamp(30px, 3.4vw, 44px); }
@media (max-width: 640px) { }


/* ============ Post types + Ghost content (the design system in use) ============ */
.amb .mark { display: inline-flex; align-items: center; gap: 6px; background: var(--yellow); color: var(--ink); font-family: "Alt Gothic", "Arial Narrow", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 19px; letter-spacing: .02em; line-height: 1; padding: 6px 10px 4px; }
html:not(.ag) .amb .mark { font-family: var(--font); font-weight: 800; font-size: 13px; letter-spacing: .03em; padding: 6px 10px; }
.amb .mark svg { display: none; } .amb .mark.ff svg { display: block; width: 16px; height: 16px; margin-top: -2px; }
.amb .mark .dot { display: none; }
.amb .mdate { display: inline-block; margin-left: 12px; font-size: 15px; font-weight: 600; color: var(--grey); vertical-align: middle; }
.amb .dark .mdate { color: #bdbdbd; }
.amb .pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.amb .pills a { font-size: 14px; font-weight: 700; border: 2px solid currentColor; padding: 4px 10px; text-decoration: none; }
.amb .dark .pills a { color: #fff; }
/* Heroes */
.amb .h-split { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 56px; align-items: center; padding-block: 64px; }
.amb .h-split h1, .amb .h-cover h1, .amb .h-plain h1 { font-size: clamp(44px, 5.4vw, 80px); font-weight: 900; line-height: 1.02; margin-top: 18px; }
.amb .h-split .dek, .amb .h-cover .dek, .amb .h-plain .dek { font-size: clamp(20px, 2vw, 26px); font-weight: 700; margin-top: 18px; }
.amb .dark .dek { color: #e4e4e4; }
.amb .h-split .pic { aspect-ratio: 4 / 3; border-radius: 4px; }
.amb .h-split .meta, .amb .h-plain .meta { font-size: 15px; color: #bdbdbd; margin-top: 22px; }
.amb .h-plate { position: relative; min-height: 640px; display: flex; align-items: flex-end; color: #fff; background: var(--ink); }
.amb .h-plate img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.amb .h-plate::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.82) 100%); }
.amb .h-plate .in { position: relative; z-index: 1; padding-bottom: 56px; width: 100%; }
.amb .h-plate h1 { font-size: clamp(56px, 7.4vw, 120px); font-weight: 900; line-height: .98; margin-top: 16px; max-width: 1050px; }
.amb .h-plate .dek { font-size: clamp(20px, 2vw, 26px); font-weight: 700; margin-top: 16px; color: #eee; max-width: 760px; }
.amb .credit { font-size: 13px; color: var(--grey); padding-top: 10px; }
.amb .h-cover { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 56px; align-items: center; padding-block: 64px; }
.amb .h-cover .cov { aspect-ratio: 3 / 4; max-width: 360px; justify-self: end; width: 100%; border-radius: 4px; }
.amb .h-cover .actions { margin-top: 28px; }
.amb .h-plain { padding-block: 64px 56px; }
.amb .evbox { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; gap: 24px; align-items: center; background: var(--panel); padding: 26px 30px; margin-top: 36px; color: var(--ink); }
.amb .evbox div { font-size: 15px; color: var(--grey); } .amb .evbox b { display: block; font-size: 20px; color: var(--ink); }
/* Body: rail + article */
.amb .pbody { display: grid; grid-template-columns: minmax(0, 700px); justify-content: center; padding-block: 56px 24px; }
.amb .contents { background: var(--panel); padding: 22px 26px; }
.amb .contents b { font-size: 17px; } .amb .contents ol { margin: 10px 0 0; padding-left: 0; list-style: none; counter-reset: c; }
.amb .contents li { counter-increment: c; padding: 6px 0; font-size: 17px; } .amb .contents li::before { content: counter(c) "  "; font-weight: 800; }
.amb .contents a { text-decoration: none !important; font-weight: 600; } .amb .contents a:hover { text-decoration: underline !important; text-decoration-color: var(--yellow) !important; }
.amb .h-meta { font-size: 15px; color: #bdbdbd; margin-top: 22px; } .amb .h-meta b { color: #fff; }
.amb .rail { position: sticky; top: 24px; align-self: start; font-size: 15px; }
.amb .toc { margin-top: 28px; }
.amb .toc p { font-size: 12px; font-weight: 800; color: var(--grey); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.amb .toc a { display: block; padding: 7px 0 7px 14px; border-left: 2px solid var(--line); text-decoration: none; color: var(--ink2); line-height: 1.35; }
.amb .toc a.on { border-left: 4px solid var(--ink); padding-left: 12px; color: var(--ink); font-weight: 700; }
/* Ghost content */
.amb .gc { font-size: 20px; line-height: 1.7; }
.amb .gc > * + * { margin-top: 26px; }
.amb .gc h2 { font-size: 34px; line-height: 1.12; margin-top: 56px; }
.amb .gc h3 { font-size: 24px; margin-top: 40px; }
.amb .gc ul, .amb .gc ol { padding-left: 26px; } .amb .gc li + li { margin-top: 8px; }
.amb .gc ul { list-style: disc; } .amb .gc ul li::marker { content: normal; font-size: 1em; }
.amb .gc a:not(.btn):not(.kg) { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 4px; font-weight: 600; }
.amb .gc hr { border: 0; height: 2px; background: var(--ink); width: 64px; margin: 56px 0; }
.amb .gc figure { margin: 36px 0 0; } .amb .gc figure img, .amb .gc figure .art { width: 100%; border-radius: 4px; display: block; }
.amb .gc .wide { margin-inline: -120px; }
.amb .gc th { text-align: left; border-bottom: 2px solid var(--ink); padding: 10px 12px 10px 0; font-size: 14px; }
/* Quotes: no yellow lines */
.amb .gc blockquote, .amb .ds blockquote { margin: 40px 0 0; padding: 4px 0 4px 26px; border-left: 6px solid var(--ink); }
.amb .gc blockquote p, .amb .ds blockquote p { font-size: 23px; font-weight: 700; line-height: 1.45; }
.amb .gc blockquote.alt, .amb .ds blockquote.alt { border: 0; padding: 0; text-align: left; position: relative; }
.amb .gc blockquote.alt::before, .amb .ds blockquote.alt::before { content: "“"; display: block; font-family: "Alt Gothic Comp", "Alt Gothic", Georgia, serif; font-weight: 900; font-size: 140px; line-height: .7; height: 62px; color: var(--ink); }
.amb .gc blockquote.alt p, .amb .ds blockquote.alt p { font-family: var(--hf, "Alt Gothic"), "Arial Narrow", sans-serif; font-weight: 900; font-size: clamp(36px, 4.2vw, 54px); line-height: 1.02; text-transform: uppercase; letter-spacing: .01em; }
html:not(.ag) .amb .gc blockquote.alt p, html:not(.ag) .amb .ds blockquote.alt p { font-family: var(--font); text-transform: none; font-size: 34px; line-height: 1.2; }
/* Cards */
.amb .toggle { border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); margin-top: 36px; }
.amb .toggle + .toggle { margin-top: 0; border-top: 0; }
.amb .toggle summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; padding: 18px 0; font-weight: 800; font-size: 20px; }
.amb .toggle summary::-webkit-details-marker { display: none; }
.amb .toggle summary::after { content: "+"; font-size: 28px; line-height: .8; font-weight: 400; } .amb .toggle[open] summary::after { content: "−"; }
.amb .toggle .tb { padding: 0 0 20px; font-size: 18px; color: var(--ink2); }
.amb .file { display: grid; grid-template-columns: 60px minmax(0, 1fr) auto; gap: 18px; align-items: center; border: 2px solid var(--ink); padding: 16px 20px; margin-top: 36px; }
.amb .file b { display: block; font-size: 18px; } .amb .file span { font-size: 14px; color: var(--grey); }
.amb .signup { background: var(--panel); padding: 30px; margin-top: 44px; }
.amb .signup h3 { font-size: 26px; margin: 0; } .amb .signup p { font-size: 16px; color: var(--ink2); margin-top: 6px; }
.amb .signup form { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.amb .signup input { flex: 1 1 240px; min-height: 54px; border: 2px solid var(--ink); padding: 0 16px; font: inherit; font-size: 17px; }
.amb .pcta { background: var(--ink); color: #fff; }
.amb .pcta .in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; padding-block: 64px; }
.amb .pcta h3 { font-size: 34px; } .amb .pcta p { color: #cfcfcf; margin-top: 10px; }
.amb .pcta form { display: flex; gap: 10px; flex-wrap: wrap; } .amb .pcta input { flex: 1 1 220px; min-height: 54px; border: 2px solid #fff; padding: 0 16px; font: inherit; font-size: 17px; }
.amb .pfoot { padding-block: 40px 72px; }
.amb .pfoot .share { margin-top: 24px; }
html.ag .amb .gc h2, html.ag .amb .gc h3, html.ag .amb .signup h3, html.ag .amb .pcta h3 { font-family: var(--hf, "Alt Gothic"), sans-serif; font-weight: 700; line-height: 1; }
html.ag.caps .amb .gc h2, html.ag.caps .amb .pcta h3 { text-transform: uppercase; }
html.ag .amb .gc h2 { font-size: 42px; } html.ag .amb .gc h3 { font-size: 30px; } html.ag .amb .pcta h3 { font-size: 44px; }
html.ag .amb .h-split h1, html.ag .amb .h-cover h1, html.ag .amb .h-plain h1 { font-size: clamp(56px, 6.8vw, 104px); line-height: .96; }
html.ag .amb .h-plate h1 { font-size: clamp(64px, 9vw, 150px); line-height: .92; }
/* Design system page */
.amb .ds h2.sm { margin-bottom: 8px !important; } .amb .ds .note { color: var(--grey); font-size: 16px; margin-bottom: 32px; max-width: 760px; }
.amb .ds section + section { margin-top: 0; }
.amb .marks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.amb .marks div { border-top: 1px solid var(--line); padding-top: 12px; }
@media (max-width: 1100px) { .amb .gc .wide { margin-inline: 0; } }
@media (max-width: 900px) {
  .amb .h-split, .amb .h-cover, .amb .pbody, .amb .pcta .in { grid-template-columns: 1fr; gap: 28px; }
  .amb .rail { position: static; } .amb .h-cover .cov { justify-self: start; max-width: 240px; }
  .amb .evbox { grid-template-columns: 1fr 1fr; } .amb .marks { grid-template-columns: repeat(2, minmax(0, 1fr)); } .amb .h-plate { min-height: 480px; }
}

/* ==========================================================================
   3. Ghost editor cards, mapped onto the design system (.gc = post or page body)
   ========================================================================== */
.amb .gc { color: var(--ink); }
.amb .gc > p:first-child { font-size: 1.08em; }
.amb .gc p, .amb .gc ul, .amb .gc ol { margin-bottom: 0; }
.amb .gc img { height: auto; }

/* Quote 1 (Ghost's first quote style): hanging mark, bold Inter. Style 2B. */
.amb .gc blockquote:not(.kg-blockquote-alt) { border: 0 !important; position: relative; padding: 0 0 0 54px !important; margin: 40px 0 0; font-size: 21px; font-weight: 700; line-height: 1.45; font-style: normal; }
.amb .gc blockquote:not(.kg-blockquote-alt)::before { content: "\201C"; position: absolute; left: 0; top: -18px; font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 56px; line-height: 1; color: var(--ink); }
.amb .gc blockquote strong, .amb .gc blockquote b { display: inline; }
/* Quote 2 (Ghost's alternative style): the pull quote, Inter between two rules. */
.amb .gc blockquote.kg-blockquote-alt { border: 0 !important; border-top: 2px solid var(--ink) !important; border-bottom: 2px solid var(--ink) !important; padding: 22px 0 !important; margin: 48px 0 0; text-align: left; font-family: var(--font); font-style: normal; font-weight: 800; font-size: clamp(26px, 3vw, 34px); line-height: 1.22; letter-spacing: -0.01em; text-transform: none; color: var(--ink); }
.amb .gc blockquote.kg-blockquote-alt::before { content: none; }
.amb .dark blockquote::before { color: #fff; }

/* Divider */
.amb .gc hr { border: 0; height: 2px; background: var(--ink); width: 64px; margin: 56px 0; }

/* Callouts: grey panel by default; white = outlined; accent = yellow; dark colours = black. */
.amb .kg-callout-card { display: flex; gap: 16px; padding: 24px 26px !important; border-radius: 0 !important; background: var(--panel) !important; color: var(--ink) !important; font-size: 18px; line-height: 1.6; margin-top: 36px; }
.amb .kg-callout-card-white { background: #fff !important; border: 2px solid var(--ink); }
.amb .kg-callout-card-accent, .amb .kg-callout-card-yellow { background: var(--yellow) !important; }
.amb .kg-callout-card-blue, .amb .kg-callout-card-green, .amb .kg-callout-card-purple, .amb .kg-callout-card-pink, .amb .kg-callout-card-red { background: var(--ink) !important; color: #fff !important; }
.amb .kg-callout-emoji { font-size: 24px; line-height: 1.2; padding: 0 !important; }
.amb .kg-callout-text { font-size: inherit !important; }
.amb .kg-callout-text a { color: inherit; }

/* Bookmarks: style 4H, a thin ink bar on a grey panel. */
.amb .kg-bookmark-card { margin-top: 36px; width: 100%; }
.amb .kg-bookmark-card a.kg-bookmark-container { display: grid !important; grid-template-columns: 3px minmax(0, 1fr) 104px; gap: 18px; align-items: stretch; min-height: 0; background: var(--panel); border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: var(--ink); text-decoration: none !important; padding: 14px 14px 14px 0; font-weight: 400 !important; }
.amb .kg-bookmark-card a.kg-bookmark-container::before { content: ""; background: var(--ink); margin: -14px 0; }
.amb .kg-bookmark-card .kg-bookmark-container:not(:has(.kg-bookmark-thumbnail)) { grid-template-columns: 3px minmax(0, 1fr); }
.amb .kg-bookmark-content { padding: 4px 0 !important; display: flex; flex-direction: column; order: 0; }
.amb .kg-bookmark-title { font-size: 18px !important; line-height: 1.3 !important; font-weight: 700 !important; color: var(--ink) !important; }
.amb .kg-bookmark-container:hover .kg-bookmark-title { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.amb .kg-bookmark-description { font-size: 14px !important; line-height: 1.5 !important; color: var(--ink2) !important; margin-top: 6px !important; -webkit-line-clamp: 2; max-height: none !important; }
.amb .kg-bookmark-metadata { order: -1; margin: 0 0 6px !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: .04em; text-transform: uppercase; color: var(--grey) !important; display: flex; gap: 8px; flex-wrap: wrap; }
.amb .kg-bookmark-icon { display: none !important; }
.amb .kg-bookmark-author::after { content: none !important; }
.amb .kg-bookmark-publisher { display: none; }
.amb .kg-bookmark-thumbnail { position: relative; min-width: 0 !important; max-height: none !important; margin: 0 !important; }
.amb .kg-bookmark-thumbnail img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; }
@media (max-width: 640px) { .amb .kg-bookmark-card a.kg-bookmark-container { grid-template-columns: 3px minmax(0, 1fr) 72px; gap: 14px; } .amb .kg-bookmark-title { font-size: 16px !important; } }

/* Buttons: accent = solid yellow, the rest = ink outline. Square. */
.amb .kg-button-card { margin-top: 36px; }
.amb .kg-button-card + .kg-button-card { margin-top: 12px; }
.amb .kg-btn { display: inline-flex !important; align-items: center; justify-content: center; min-height: 54px; height: auto !important; padding: 0 30px !important; border-radius: 0 !important; font-family: var(--font) !important; font-weight: 700 !important; font-size: 17px !important; text-decoration: none !important; background: transparent !important; color: var(--ink) !important; border: 2px solid var(--ink) !important; }
.amb .kg-btn:hover { background: var(--ink) !important; color: #fff !important; opacity: 1 !important; }
.amb .kg-btn.kg-btn-accent, .amb .kg-btn-accent { background: var(--yellow) !important; color: var(--ink) !important; border-color: var(--yellow) !important; }
.amb .kg-btn.kg-btn-accent:hover { background: var(--ink) !important; color: #fff !important; border-color: var(--ink) !important; }
.amb .dark .kg-btn { color: #fff !important; border-color: #fff !important; }
.amb .dark .kg-btn:hover { background: #fff !important; color: var(--ink) !important; }
.amb .dark .kg-btn.kg-btn-accent { color: var(--ink) !important; border-color: var(--yellow) !important; }
.amb .dark .kg-btn.kg-btn-accent:hover { background: #fff !important; border-color: #fff !important; }
/* A run of button cards sits in a row. */
.amb .btnrow { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.amb .btnrow > .kg-button-card { margin: 0 !important; }

/* Toggles: FAQ rows. */
.amb .kg-toggle-card { border: 0 !important; border-top: 2px solid var(--ink) !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; padding: 0 !important; margin-top: 36px; background: transparent !important; box-shadow: none !important; }
.amb .kg-toggle-card + .kg-toggle-card { margin-top: 0; border-top: 0 !important; }
.amb .kg-toggle-heading { padding: 18px 0 !important; cursor: pointer; }
.amb .kg-toggle-heading-text, .amb .kg-toggle-heading h4 { font-size: 20px !important; font-weight: 800 !important; font-family: var(--font) !important; text-transform: none !important; }
.amb .kg-toggle-content { padding: 0 0 20px !important; font-size: 18px; color: var(--ink2); }
.amb .kg-toggle-card-icon svg { color: var(--ink); }

/* File download */
.amb .kg-file-card { margin-top: 36px; }
.amb .kg-file-card-container { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; border: 2px solid var(--ink) !important; border-radius: 0 !important; padding: 16px 20px !important; background: #fff !important; color: var(--ink) !important; text-decoration: none !important; }
.amb .kg-file-card-title { font-size: 18px !important; font-weight: 800 !important; }
.amb .kg-file-card-caption, .amb .kg-file-card-metadata { font-size: 14px !important; color: var(--grey) !important; }
.amb .kg-file-card-icon { width: 60px !important; height: 60px !important; background: var(--ink); color: var(--yellow); display: flex; align-items: center; justify-content: center; }
.amb .kg-file-card-icon svg { color: var(--yellow) !important; }

/* Product (buy) card */
.amb .kg-product-card-container { border: 2px solid var(--ink) !important; border-radius: 0 !important; box-shadow: none !important; padding: 22px !important; max-width: 420px; background: #fff !important; }
.amb .kg-product-card-image { border-radius: 0 !important; }
.amb .kg-product-card-title { font-size: 22px !important; font-weight: 800 !important; }
.amb .kg-product-card-button { border-radius: 0 !important; background: var(--yellow) !important; color: var(--ink) !important; font-weight: 700 !important; }

/* Header card: a full-width band (black, grey or white) inside a page. */
.amb .kg-header-card { border-radius: 0 !important; margin-top: 64px !important; }
.amb .kg-header-card.kg-v2 { padding: 0 !important; }
.amb .kg-header-card h2, .amb .kg-header-card .kg-header-card-heading, .amb .kg-header-card .kg-header-card-header { font-family: "Alt Gothic Comp", "Alt Gothic", "Arial Narrow", sans-serif !important; font-weight: 900 !important; text-transform: uppercase !important; font-size: clamp(48px, 7vw, 96px) !important; line-height: .96 !important; letter-spacing: .005em !important; }
.amb .kg-header-card .kg-header-card-subheading, .amb .kg-header-card .kg-header-card-subheader { font-family: var(--font) !important; font-size: 20px !important; font-weight: 500 !important; text-transform: none !important; }
.amb .kg-header-card .kg-header-card-button { border-radius: 0 !important; font-weight: 700 !important; }

/* Images and embeds */
.amb .kg-image-card img, .amb .kg-gallery-image img { border-radius: 0; }
.amb .kg-width-wide { margin-inline: -120px; }
.amb .kg-width-full { margin-inline: calc(50% - 50vw); }
.amb .kg-width-full img { width: 100%; }
@media (max-width: 1100px) { .amb .kg-width-wide { margin-inline: 0; } }
.amb .kg-embed-card iframe, .amb .kg-video-card { width: 100%; }

/* Testimonial.to embeds: a frame, not a design. */
.amb .gc iframe[src*="testimonial.to"] { width: 100% !important; border: 0; }

/* Members-only cut-off: Ghost's own CTA, in the brand. */
.amb .gh-post-upgrade-cta { background: var(--ink) !important; color: #fff; border-radius: 0 !important; padding: 36px !important; text-align: left !important; }
.amb .gh-post-upgrade-cta-content { align-items: flex-start !important; text-align: left !important; }
.amb .gh-post-upgrade-cta h2 { font-family: "Alt Gothic Comp", "Alt Gothic", sans-serif !important; font-weight: 900 !important; text-transform: uppercase; font-size: 40px !important; color: #fff !important; }
.amb .gh-post-upgrade-cta a.gh-btn { background: var(--yellow) !important; color: var(--ink) !important; border-radius: 0 !important; font-weight: 700; }

/* ==========================================================================
   4. Theme-only additions (things the mockup faked)
   ========================================================================== */
.amb .nav .srch { padding: 6px 0; }
@media (max-width: 900px) { .amb .nav .srch { justify-content: flex-start; gap: 10px; } }
.amb .dd .c img.pic { aspect-ratio: 16 / 10; height: auto; object-fit: cover; margin-bottom: 10px; }
.amb .fgrid > div:has(> ul:empty) { display: none; }
.amb .fnote a { color: inherit; }
/* Ghost's Portal and search sit above everything */
#ghost-portal-root { position: relative; z-index: 1000; }


/* ===== Live-theme additions (things the mockup faked) ===== */
.amb { font-family: var(--font); color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased; }
.amb-hdr, .amb-ftr { background: var(--ink); }
.amb-hdr { position: relative; z-index: 60; }
.amb .dd .c img.pic { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; margin-bottom: 10px; padding: 0; background: #ddd; }
.amb .nav .srch { font-size: 0; width: 34px; height: 34px; padding: 0; justify-content: center; }
.amb .nav .srch::before { content: ""; width: 17px; height: 17px; border: 2px solid currentColor; border-radius: 50%; box-sizing: border-box; transform: translate(-2px, -2px); }
.amb .nav .srch::after { content: ""; width: 7px; height: 2px; background: currentColor; transform: translate(-4px, 6px) rotate(45deg); position: absolute; }
.amb .nav .srch { position: relative; }
@media (max-width: 900px) { .amb .nav .srch { font-size: inherit; width: 100%; height: auto; justify-content: space-between; } .amb .nav .srch::before, .amb .nav .srch::after { display: none; } }
.amb form .fm { display: none; margin: 12px 0 0; font-weight: 700; width: 100%; }
.amb form.success .fm.ok, .amb form.error .fm.err { display: block; }
.amb form.success input, .amb form.success button { display: none; }
.amb form.loading button { opacity: .6; }
.amb .books a { display: block; }
.amb .books img.cover { display: block; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; margin-bottom: 14px; background: var(--panel); }
.amb .hero img.pic { object-fit: cover; }
.amb .hsform input, .amb .hsform select, .amb .hsform textarea { border-radius: 0 !important; font-family: var(--font) !important; }
.amb .hsform .hs-button { border-radius: 0 !important; background: var(--yellow) !important; color: var(--ink) !important; border: 0 !important; font-weight: 800 !important; }
/* Side contents rail (3A): a bare list, an arrow marks where you are */
.amb .ra { font-size: 14px; } .amb .ra p { font-weight: 800; margin: 0 0 8px; } .amb .ra a { display: block; padding: 5px 0; color: var(--ink2); text-decoration: none; line-height: 1.35; } .amb .ra a.on { color: var(--ink); font-weight: 700; } .amb .ra a.on::before { content: "→ "; }
.amb .ra .m { margin-top: 18px; font-size: 13px; color: var(--grey); font-weight: 400; }
.amb .essay .lede { margin-top: 14px; color: var(--ink2); }
@media (max-width: 900px) { .amb .dd .c img.pic { display: none; } }

/* Book images are product shots (wide, often transparent), not flat covers: show them whole */
.amb .books img.cover { aspect-ratio: 3 / 2; object-fit: contain; padding: 12px; background: var(--panel); }
.amb .h-cover .cov { aspect-ratio: auto; height: auto; max-height: 440px; object-fit: contain; border-radius: 0; }
.amb .h-cover .cov { max-width: 520px; }

/* End-of-post ask: quote line, upgrade box, note */
.amb .pcta .pq { margin: 10px 0 0; color: #d6d6d6; font-size: 15px; } .amb .pcta .pq b { color: #fff; font-weight: 700; margin-left: 4px; }
.amb .pcta .pnote { width: 100%; margin: 8px 0 0; font-size: 13px; color: #bdbdbd; }
.amb .pcta .pact { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.amb .pcta form .ok, .amb .pcta form .err { display: none; width: 100%; margin: 10px 0 0; font-weight: 700; }
.amb .pcta form.success .ok, .amb .pcta form.error .err { display: block; } .amb .pcta form.success input, .amb .pcta form.success button { display: none; }

/* Review round 2 */
.amb .gc blockquote:not(.alt) { padding-left: 40px !important; }
.amb .gc blockquote:not(.alt)::before { top: -10px !important; }
.amb .h-plate .mdate { color: #fff; }
.amb .am-gate__btn, .amb .gc a.am-gate__btn { background: var(--yellow) !important; color: var(--ink) !important; text-decoration: none !important; border: 2px solid var(--yellow) !important; border-radius: 0 !important; font-weight: 800 !important; }
.amb .gc a.am-gate__btn--sec { background: transparent !important; border-color: var(--ink) !important; }
.amb .am-gate { border-radius: 0 !important; }
.amb .pcta-act .actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-start; }

/* ===== Sections filled from hidden Ghost pages ===== */
.amb .fbody > * + * { margin-top: 18px; }
.amb .fbody p { font-size: 18px; line-height: 1.6; max-width: 68ch; }
.amb .hero .fbody p { color: #e4e4e4; font-size: 19px; }
.amb .fbody a:not(.btn) { color: inherit; text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 4px; font-weight: 600; }
.amb .fbody ul, .amb .fbody ol { padding-left: 1.2em; } .amb .fbody li + li { margin-top: 8px; } .amb .fbody li { font-size: 17px; }
.amb .fbody h3 { font-size: 24px; margin-top: 32px; }
.amb .fbody .actions, .amb .fbody .btns { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 12px; }
.amb .fbody .three { margin-top: 40px; }
.amb .fbody figure { margin: 28px 0 0; } .amb .fbody figure img { width: 100%; height: auto; display: block; }
.amb .fbody img.pic { width: 100%; height: auto; display: block; object-fit: cover; }
.amb .fbody img.pic.wide { margin-top: 36px; }
.amb .fbody .cols { margin-top: 0; }
.amb .fbody .cols > div > *:first-child { margin-top: 0; }
.amb .fbody .cols > div > * + * { margin-top: 18px; }
.amb .fbody .cols > div > img.pic { aspect-ratio: 4 / 5; }
.amb .fbody .cols.me > div:first-child > img.pic { aspect-ratio: 4 / 5; }
.amb .fbody .cols h3 + ul { list-style: none; padding: 0; }
/* a Heading 3 followed by a list reads as a panel */
.amb .fbody .cols h3:has(+ ul) { background: var(--panel); padding: 28px 28px 0; margin-top: 0; font-size: 26px; }
.amb .fbody .cols h3 + ul { background: var(--panel); padding: 14px 28px 28px; margin-top: 0 !important; }
.amb .dark .fbody .cols h3:has(+ ul), .amb .dark .fbody .cols h3 + ul { background: #1a1a1c; color: #e4e4e4; }
.amb .grey .fbody .cols h3:has(+ ul), .amb .grey .fbody .cols h3 + ul { background: #fff; }
.amb .fbody .quote { margin-top: 40px; }
.amb .fbody .quote.pull p { font-size: clamp(26px, 3vw, 38px); max-width: 34ch; }
.amb .fbody .quotes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; }
.amb .fbody .quotes .quote { margin-top: 0; border-top: 2px solid var(--ink); padding-top: 22px; } .amb .fbody .quotes .rule { display: none; }
.amb .fbody .quotes .quote p { font-size: 20px; }
.amb .fcards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 48px; margin-top: 36px; }
.amb .fcards .fcard { border-top: 2px solid var(--ink); padding-top: 20px; }
.amb .dark .fgrid .fcard, .amb .dark .fbody .quotes .quote { border-top-color: #fff; }
.amb .fcards .fcard > h3:first-child { margin-top: 0; font-size: 28px; }
.amb .fcards .fcard > * + * { margin-top: 14px; }
.amb .fcards .fcard p { font-size: 17px; }
.amb .fcards .fcard .quote { margin-top: 22px; } .amb .fcards .fcard .quote p { font-size: 18px; }
.amb .faq details { border-top: 1px solid var(--line); padding: 18px 0; }
.amb .faq details:last-child { border-bottom: 1px solid var(--line); }
.amb .faq summary { cursor: pointer; font-weight: 700; font-size: 20px; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.amb .faq summary::-webkit-details-marker { display: none; }
.amb .faq summary::after { content: "+"; font-weight: 800; } .amb .faq details[open] summary::after { content: "–"; }
.amb .faq .ans { margin-top: 12px; } .amb .faq .ans p { font-size: 17px; }
.amb .fbody .kg-callout-card { background: var(--panel) !important; border-radius: 0 !important; padding: 20px 24px !important; display: block; max-width: 900px; }
.amb .fbody .kg-callout-emoji { display: none; }
.amb .fbody .kg-callout-text { font-size: 17px; }
.amb .state .fbody p { font-size: 20px; font-weight: 500; letter-spacing: 0; line-height: 1.5; text-transform: none; font-family: var(--font); }
.amb .state.dark .fbody p { color: #d4d4d4; }
.amb .state .fbody .actions { margin-top: 32px; }
html.ag .amb .state .fbody p { font-family: var(--font) !important; font-size: 20px !important; line-height: 1.5 !important; text-transform: none !important; }
.amb .cases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; margin-top: 36px; }
.amb .cases .case { color: inherit; text-decoration: none; display: flex; flex-direction: column; gap: 6px; }
.amb .cases .case img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: 8px; }
.amb .cases .ce { font-size: 14px; color: var(--grey); } .amb .cases b { font-size: 20px; line-height: 1.25; } .amb .cases span:not(.ce) { color: var(--ink2); font-size: 16px; }
.amb .cases .case:hover b { text-decoration: underline; text-decoration-color: var(--yellow); text-decoration-thickness: 3px; text-underline-offset: 4px; }
.amb .kn .given p { font-size: 14.5px; color: var(--grey); }
.amb .stack { font-size: 19px; color: var(--ink2); max-width: 64ch; margin-top: 14px; }
.amb .dark .stack { color: #d4d4d4; }
.amb .frag h2.sm span { display: block; }
.amb .hero h1[data-split] span:first-child { color: inherit; }
.amb .pcta .pqs { margin-top: 10px; }
@media (max-width: 900px) { .amb .fbody .quotes, .amb .fcards, .amb .cases { grid-template-columns: 1fr; } }

.amb .state.sm p.motto { font-size: 20px !important; font-family: var(--font) !important; text-transform: none !important; line-height: 1.4 !important; font-weight: 700 !important; color: var(--yellow); }
.amb .state .sub p { font-size: 17px !important; font-family: var(--font) !important; text-transform: none !important; line-height: 1.5 !important; font-weight: 400 !important; letter-spacing: 0 !important; }
.amb .state .sub h3 { font-size: 30px; }
.amb .state.dark .sub { background: #fff; color: var(--ink); padding: 28px; }
.amb .chan img.pic { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; margin-bottom: 10px; display: block; }

/* Review round 3 */
.amb .tagl > aside[hidden] + .rows, .amb .tagl > aside[hidden] ~ .rows { grid-column: 1 / -1; }
.amb .tagl:has(> aside[hidden]) { grid-template-columns: minmax(0, 1fr); }
.amb .dash-cols:has([data-next-events][hidden]) { grid-template-columns: minmax(0, 1fr); }
.amb .dash-cols:has([data-next-events][hidden]) > div:first-child { max-width: 760px; }
.amb .essay.noimg { grid-template-columns: minmax(0, 1fr); }
/* Work with me hub */
.amb .svc img.pic { width: 100%; height: auto; flex: none; aspect-ratio: 4 / 3; object-fit: cover; padding: 0; display: block; }
.amb .svc .nmb { display: flex; aspect-ratio: 4 / 3; }
.amb .vids { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.amb .vids a { text-decoration: none; display: flex; flex-direction: column; gap: 4px; }
.amb .vids .art { aspect-ratio: 3 / 4; width: 100%; object-fit: cover; justify-content: center; align-items: center; font-size: 28px; color: #fff; padding: 0; margin-bottom: 8px; }
.amb .vids span:not(.art) { color: var(--ink2); font-size: 14px; }
@media (max-width: 760px) { .amb .vids { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* ---- Live-site fixes, 20 Oct ---- */
/* Strips: keep the scroll smooth on iPhones */
.amb .ticker .tr { will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translate3d(0,0,0); }
@keyframes tick { from { transform: translate3d(0,0,0); } to { transform: translate3d(-50%,0,0); } }
/* Speaking: tighter run from the intro into the talks */
.amb #speaking-intro { padding-block: 88px 64px; }
.amb #speaking-intro + #speaking-topics { padding-top: 64px; }
.amb .fbody .kn h3, .amb .kn h3 { margin: 0; }
.amb .kn > div > p { margin: 0; }
.amb .kn .lab { margin-bottom: 2px; }
.amb #speaking-other { padding-top: 16px; }
/* Home: the Not An MBA wheel sits inside its column */
.amb #home-namba .pic { height: auto; max-width: 440px; object-fit: contain; margin-inline: auto; }
/* Testimonials: give the Testimonial.to wall the full width */
.testimonial-to-embed { width: 100%; max-width: none; }
.testimonial-to-embed iframe { width: 100% !important; }
/* Essays: the sidebar holds topics, the painting and the contents */
.amb .rail3 .ra .rb + .rb, .amb .rail3 .ra .rb + .m { margin-top: 28px; }
.amb .ra .rtags a { display: inline-block; margin: 0 6px 6px 0; padding: 3px 8px; border: 1px solid var(--ink); font-weight: 700; font-size: 12.5px; color: var(--ink); }
.amb .ra .rtags a:hover { background: var(--yellow); border-color: var(--yellow); }
.amb .ra .rcap .credit { font-size: 13px; line-height: 1.45; color: var(--ink2); margin: 0; }
.amb .ra .rcap .credit a { display: inline; padding: 0; text-decoration: underline; }
/* Wednesday Wisdom and Friday Flurry: a bigger, bolder first paragraph */
.tag-wednesday-wisdom .amb .gc > p:first-of-type, .tag-friday-flurry .amb .gc > p:first-of-type, .tag-hash-flurry .amb .gc > p:first-of-type { font-size: 1.25em; font-weight: 600; line-height: 1.5; }
/* Sign in and sign up: a bigger box */
.am-authbox { max-width: 560px; }
@media (min-width: 768px) { .am-authbox { padding: 56px 56px 48px; } }
/* Phones: smaller body text, and related topics as small pills */
@media (max-width: 640px) {
  .amb .gc { font-size: 17px; line-height: 1.65; }
  .tag-wednesday-wisdom .amb .gc > p:first-of-type, .tag-friday-flurry .amb .gc > p:first-of-type, .tag-hash-flurry .amb .gc > p:first-of-type { font-size: 19px; }
  .amb .tagl aside { gap: 8px; }
  .amb .tagl aside .h { flex-basis: 100%; margin-bottom: 0; }
  .amb .tagl aside a { font-size: 13px; padding: 4px 10px; border: 1px solid var(--ink); }
}
/* #banner: the section picture runs full width above the columns */
.amb .f-banner .pic.banner { width: 100%; height: auto; aspect-ratio: 21 / 8; object-fit: cover; margin-bottom: 44px; display: block; }
@media (max-width: 640px) { .amb .f-banner .pic.banner { aspect-ratio: 4 / 3; margin-bottom: 28px; } }
/* About, "I teach people to be strategists": the three programme buttons on one line */
@media (min-width: 900px) {
  .amb #about-now .actions { flex-wrap: nowrap; gap: 10px; }
  .amb #about-now .actions .btn { padding: 12px 16px; font-size: 14.5px; white-space: nowrap; }
}
/* Section headings a size up, site-wide */
html.calm.cb .amb .sec h2.sm, html.cb .amb .sec h2.sm { font-size: clamp(44px, 4.95vw, 64px); }
/* Essays: body lines up with the header; the sidebar moves to the right */
.amb .pbody.rail3 { grid-template-columns: minmax(0, 720px) 220px; gap: 72px; justify-content: start; }
.amb .pbody.rail3 > .ra { order: 2; }
@media (max-width: 900px) { .amb .pbody.rail3 { grid-template-columns: 1fr; gap: 32px; } .amb .pbody.rail3 > .ra { order: 0; } }
/* Speaking, Other topics: full width */
.amb #speaking-other .fbody, .amb #speaking-other .fbody > p, .amb #speaking-other .kg-callout-card { max-width: none; }
/* #gallery: a row of photos */
.amb .f-gallery .fbody { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; max-width: none; }
.amb .f-gallery .fbody figure { margin: 0 !important; }
.amb .f-gallery .fbody img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.amb .f-gallery .fbody > :not(figure) { grid-column: 1 / -1; }
@media (max-width: 760px) { .amb .f-gallery .fbody { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Events: a thumbnail between the date and the title */
.amb .ev.has-thumb { grid-template-columns: 120px 150px minmax(0, 1fr) auto; }
.amb .ev .thumb { width: 150px; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; display: block; }
@media (max-width: 760px) { .amb .ev.has-thumb { grid-template-columns: 76px minmax(0, 1fr); } .amb .ev .thumb { display: none; } }

/* ---- Round 2 fixes ---- */
/* Posts without the sidebar (events, books, tools, courses): text lines up with the header, a little wider */
.amb .pbody:not(.rail3) { justify-content: start; grid-template-columns: minmax(0, 760px); }
/* Event header picture: shown whole, not cropped */
.amb .h-ev .pic { aspect-ratio: auto; height: auto; max-height: 440px; object-fit: contain; background: transparent; }
/* Event list thumbnails: the usual 16:9 thumbnail shape */
.amb .ev .thumb { aspect-ratio: 16 / 9; object-fit: cover; }
/* Grid cards: an image card under a heading sits above it */
.amb .fcards .fcard { display: flex; flex-direction: column; }
.amb .fcards .fcard > figure { order: -1; margin: 0 0 6px !important; }
.amb .fcards .fcard > figure img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.amb .fcards .fcard > h3:first-child { margin-top: 0; }
.amb .fcards .fcard > figure + h3 { margin-top: 16px; }
/* Work with me videos: two by two */
.amb .vids { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; max-width: none; align-items: start; }
.amb .vids img.pic, .amb .vids .art { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; margin-bottom: 10px; }
.amb .vids b { font-size: 17px; line-height: 1.3; }
.amb .vids a > span:not(.art) { font-size: 14px; line-height: 1.45; color: var(--ink2); }
/* Essay sidebar topics: bigger */
.amb .ra .rtags a { font-size: 14px; padding: 5px 10px; margin: 0 6px 8px 0; }
.amb .ra p { font-size: 14px; }
/* Post type labels: a touch bigger */
html.calm .amb .mark { font-size: 18px; padding: 6px 10px 4px; }
/* Essay hub sign-up band */
.amb #essays-signup .sub { margin-top: 28px; }
.amb #essays-signup { padding-block: 88px; }

/* Lists in sections show their bullets and numbers */
.amb .fbody ul { list-style: disc; }
.amb .fbody ol:not(.steps) { list-style: decimal; }
.amb .fbody li::marker { color: var(--yellow); }
/* Books page on phones: smaller covers, tidier spacing */
@media (max-width: 760px) {
  .amb .bk { padding: 32px 0; gap: 16px; }
  .amb .bk > a img.pic, .amb .bk > .art { max-width: 220px; }
  .amb .bk .actions { flex-direction: column; align-items: stretch; }
}
/* Speaking intro: the text runs wider under the statement */
.amb #speaking-intro .small, .amb #speaking-intro .fbody p { max-width: 980px; }
.amb #speaking-intro .fbody p { font-size: 20px; }
.amb #speaking-intro + #speaking-topics { padding-top: 24px; }
.amb .ticker + #speaking-topics { padding-top: 88px; }
/* Questions on a black band */
.amb .dark .faq { border-top-color: #fff; }
.amb .dark .faq details, .amb .dark .faq details:last-child { border-color: #333; }
.amb .dark .faq summary { color: #fff; }
.amb .dark .faq p, .amb .dark .faq .ans { color: #d4d4d4; }
.amb .dark .faq a { color: #fff; }
/* Speaking enquiry form: full width, fields in two columns */
#speaking-form { max-width: 1000px; }
#speaking-form form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
#speaking-form fieldset .hs-form-field { width: 100% !important; margin-right: 0 !important; }
#speaking-form .hs-input { width: 100% !important; max-width: none !important; box-sizing: border-box; }
 #speaking-form .hs_submit, #speaking-form .hs-richtext, #speaking-form .legal-consent-container, #speaking-form .hs_error_rollup { grid-column: 1 / -1; }
#speaking-form textarea.hs-input { min-height: 160px; }
@media (max-width: 760px) { #speaking-form form { grid-template-columns: 1fr; } }
/* Home, Not An MBA on phones: the wheel sits above the buttons */
@media (max-width: 900px) {
  .amb #home-namba .cols { display: flex; flex-direction: column; }
  .amb #home-namba .cols > div { display: contents; }
  .amb #home-namba .cols > div > * { order: 1; }
  .amb #home-namba .cols .pic { order: 2; margin: 8px auto 4px; }
  .amb #home-namba .cols .actions, .amb #home-namba .cols .kg-button-card, .amb #home-namba .cols .btnrow { order: 3; }
  .amb #home-namba .cols .quote { order: 4; }
}
/* Home motto: closer in size to the section headings */
html .amb #home-motto > .in > p[data-split] { font-size: clamp(40px, 5.4vw, 76px) !important; line-height: .95; }
/* About, In the media: a quiet date, not a big number */
html .amb .mlist .ev .d b { font-size: 28px !important; margin-bottom: 2px; }
.amb .mlist .ev { grid-template-columns: 96px minmax(0, 1fr) auto; padding: 18px 0; }
.amb .mlist .ev .d { font-size: 13px; }

/* ---- am-global.css ---- */
/* =====================================================================
   Alicia McKay brand: the site-wide layer.
   Loaded last. Restyles the Flair pages that weren't rebuilt (essays,
   tag pages, archive, events, tools, dashboard, sign-in) so the whole
   site shares one look: Inter for reading, Alternate Gothic capitals for
   big headings only, square corners, black and white with yellow accents.
   ===================================================================== */

@font-face { font-family: "Alt Gothic"; src: url("../fonts/AlternateGothicATF-Bold.woff") format("woff"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Alt Gothic Comp"; src: url("../fonts/AlternateGothicCondATF-Heavy.woff") format("woff"); font-weight: 900; font-display: swap; }

:root, [data-color-scheme] {
  --am-ink: #0b0b0c; --am-ink2: #2b2825; --am-grey: #66666b; --am-panel: #f4f4f4; --am-line: #e6e6e6; --am-yellow: #fac300;
  --am-head: "Alt Gothic Comp", "Alt Gothic", "Arial Narrow", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-headings: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --radius: 0px; --radius-xxs: 0px; --radius-xs: 0px; --radius-sm: 0px; --radius-md: 0px; --radius-lg: 0px; --radius-xl: 0px;
  --color-typography: var(--am-ink);
}
body { font-family: var(--font-body); }

/* Big page and post titles: Alternate Gothic, always in capitals. */
.main h1:not(.amb *),
.am-hero-plate__title, .am-hero-default__title, .am-hero-flurry__title, .am-hero-cover__title {
  font-family: var(--am-head) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  letter-spacing: 0.004em !important;
  line-height: 0.95 !important;
}
.main h1:not([class*="am-hero"]):not(.amb *) { font-size: clamp(44px, 6vw, 84px) !important; margin-bottom: 18px; }
.am-hero-plate__title, .am-hero-default__title, .am-hero-flurry__title, .am-hero-cover__title { font-size: clamp(46px, 6.2vw, 92px) !important; }

/* Everything below a title stays in Inter: no Alternate Gothic in subheads or quotes. */
.ghost-content h2, .ghost-content h3, .ghost-content h4 {
  font-family: var(--font-body) !important; text-transform: none !important; letter-spacing: -0.01em; font-weight: 700 !important;
}
.ghost-content h2 { font-size: 27px !important; line-height: 1.25 !important; margin-top: 52px !important; }
.ghost-content h3 { font-size: 21px !important; line-height: 1.3 !important; }

/* Links in essays: yellow underline */
.ghost-content a:not([class*="kg-"]):not(.am-btn) {
  text-decoration: underline; text-decoration-color: var(--am-yellow); text-decoration-thickness: 3px; text-underline-offset: 4px;
}

/* Quote: hanging Georgia mark, bold Inter */
.ghost-content blockquote:not(.kg-blockquote-alt) {
  border: 0 !important; position: relative; padding: 0 0 0 40px !important; margin: 40px 0 !important; background: none !important;
}
.ghost-content blockquote:not(.kg-blockquote-alt)::before {
  content: "\201C" !important; display: block !important; position: absolute; left: 0; top: -18px;
  font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 56px; line-height: 1; color: var(--am-ink);
  background: none !important; width: auto !important; height: auto !important;
}
.ghost-content blockquote:not(.kg-blockquote-alt) p {
  font-family: var(--font-body) !important; font-style: normal !important; font-size: 21px !important; font-weight: 700 !important; line-height: 1.45 !important; color: var(--am-ink) !important;
}
/* Pull quote: Inter between two rules */
.ghost-content .kg-blockquote-alt {
  border: 0 !important; border-top: 2px solid var(--am-ink) !important; border-bottom: 2px solid var(--am-ink) !important;
  padding: 22px 0 !important; margin: 48px 0 !important; text-align: left !important; background: none !important;
}
.ghost-content .kg-blockquote-alt::before { content: none !important; }
.ghost-content .kg-blockquote-alt, .ghost-content .kg-blockquote-alt p {
  font-family: var(--font-body) !important; font-style: normal !important; text-transform: none !important;
  font-weight: 800 !important; font-size: clamp(26px, 2.8vw, 34px) !important; line-height: 1.22 !important; color: var(--am-ink) !important;
}
.ghost-content blockquote p::before, .ghost-content blockquote p::after { content: none !important; }

/* Bookmark card: grey panel, thin ink bar */
.ghost-content .kg-bookmark-card { margin: 36px 0 !important; }
.ghost-content .kg-bookmark-container {
  display: flex !important; align-items: stretch; background: var(--am-panel) !important; border: 0 !important; border-left: 3px solid var(--am-ink) !important;
  border-radius: 0 !important; box-shadow: none !important; text-decoration: none !important; color: var(--am-ink) !important; min-height: 0 !important;
}
.ghost-content .kg-bookmark-content { padding: 16px 18px !important; display: flex; flex-direction: column; }
.ghost-content .kg-bookmark-title { font-family: var(--font-body) !important; font-size: 18px !important; font-weight: 700 !important; line-height: 1.3 !important; color: var(--am-ink) !important; order: 2; }
.ghost-content .kg-bookmark-description { font-size: 14px !important; color: var(--am-ink2) !important; margin-top: 6px !important; line-height: 1.5 !important; order: 3; -webkit-line-clamp: 2; }
.ghost-content .kg-bookmark-metadata { order: 1; margin: 0 0 6px !important; font-size: 13px !important; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--am-grey) !important; }
.ghost-content .kg-bookmark-icon { display: none !important; }
.ghost-content .kg-bookmark-metadata > span::after, .ghost-content .kg-bookmark-author::after { color: var(--am-grey); }
.ghost-content .kg-bookmark-thumbnail { flex: 0 0 104px !important; min-width: 104px !important; max-height: none !important; }
.ghost-content .kg-bookmark-thumbnail img { border-radius: 0 !important; height: 100%; object-fit: cover; }
.ghost-content .kg-bookmark-container:hover .kg-bookmark-title { text-decoration: underline; text-decoration-color: var(--am-yellow); text-decoration-thickness: 3px; text-underline-offset: 4px; }
@media (max-width: 600px) { .ghost-content .kg-bookmark-thumbnail { flex-basis: 72px !important; min-width: 72px !important; } .ghost-content .kg-bookmark-title { font-size: 16px !important; } }

/* Callouts and buttons: square, ink and yellow */
.ghost-content .kg-callout-card { border-radius: 0 !important; }
.ghost-content .kg-btn, .ghost-content .kg-button-card a, .am-btn, .kg-product-card-button {
  border-radius: 0 !important; font-weight: 800 !important; background: var(--am-yellow) !important; color: var(--am-ink) !important; box-shadow: none !important;
}
.ghost-content .kg-btn:hover, .ghost-content .kg-button-card a:hover, .am-btn:hover { background: var(--am-ink) !important; color: #fff !important; }
.ghost-content hr { border: 0 !important; height: 2px !important; background: var(--am-ink) !important; width: 64px !important; margin: 56px 0 !important; }
.ghost-content ul li::marker { color: var(--am-ink); }

/* Tag pills in post headers: square, yellow on hover */
.am-pill { border-radius: 0 !important; }
a.am-pill:hover { background: var(--am-yellow) !important; color: var(--am-ink) !important; }

/* Flair buttons and cards lose their rounding and shadows */
.bg-brand { color: var(--am-ink) !important; }
.shadow-btn, .shadow-btn-hover, .hover\:shadow-btn-hover:hover { box-shadow: none !important; }

/* Ghost Portal trigger and search look */
[data-ghost-search] { cursor: pointer; }

/* Inter everywhere, whatever the old Flair font settings say */
html body { --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; --font-headings: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; --gh-font-body: "Inter", system-ui, sans-serif; --gh-font-heading: "Inter", system-ui, sans-serif; font-family: var(--font-body); }

/* Channel pills in the design system: square, ink outline, yellow on hover */
.am-tabs { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 24px; }
.am-tab { border: 2px solid var(--am-ink) !important; border-radius: 0 !important; background: #fff !important; color: var(--am-ink) !important; font-weight: 700 !important; font-size: 14px !important; padding: 6px 12px !important; text-decoration: none !important; box-shadow: none !important; }
.am-tab:hover { background: var(--am-yellow) !important; border-color: var(--am-yellow) !important; }
.am-tab.is-active { background: var(--am-yellow) !important; border-color: var(--am-yellow) !important; color: var(--am-ink) !important; }
[hidden] { display: none !important; }

/* Plain pages: room between the black header and the words */
[data-page-body] { margin-top: 64px !important; }
.amb + [data-page-body], .amb ~ article[data-page-body] { margin-top: 64px !important; }
.amb:has(> .ptop) + section, .amb:has(> .ptop) + div > section:first-child { padding-top: 48px !important; }