/*! 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-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-400:oklch(70.4% .191 22.216);--color-orange-400:oklch(75% .183 55.934);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-900:oklch(41.4% .112 45.904);--color-green-400:oklch(79.2% .209 151.711);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--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:calc(1.5 / 1);--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:calc(2.25 / 1.875);--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;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-wider:.05em;--leading-tight:1.25;--leading-relaxed:1.625;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-navy:#14110d;--color-gold:#f4b942;--color-orange:#f87171}}@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,:host{-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}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{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,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;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:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::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{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-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}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.-top-4{top:calc(var(--spacing) * -4)}.top-0{top:calc(var(--spacing) * 0)}.-left-4{left:calc(var(--spacing) * -4)}.z-50{z-index:50}.mx-2{margin-inline:calc(var(--spacing) * 2)}.mx-auto{margin-inline:auto}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-14{margin-top:calc(var(--spacing) * 14)}.mb-0{margin-bottom:calc(var(--spacing) * 0)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-6{margin-bottom:calc(var(--spacing) * 6)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-8{height:calc(var(--spacing) * 8)}.h-12{height:calc(var(--spacing) * 12)}.h-28{height:calc(var(--spacing) * 28)}.h-44{height:calc(var(--spacing) * 44)}.h-48{height:calc(var(--spacing) * 48)}.max-h-20{max-height:calc(var(--spacing) * 20)}.max-h-36{max-height:calc(var(--spacing) * 36)}.max-h-full{max-height:100%}.w-8{width:calc(var(--spacing) * 8)}.w-12{width:calc(var(--spacing) * 12)}.w-48{width:calc(var(--spacing) * 48)}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-full{max-width:100%}.max-w-xl{max-width:var(--container-xl)}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.grow{flex-grow:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-decimal{list-style-type:decimal}.list-disc{list-style-type:disc}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-5{column-gap:calc(var(--spacing) * 5)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-white\/5>:not(:last-child)){border-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){:where(.divide-white\/5>:not(:last-child)){border-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-y{border-block-style:var(--tw-border-style);border-block-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-amber-600\/20{border-color:#dd740033}@supports (color:color-mix(in lab, red, red)){.border-amber-600\/20{border-color:color-mix(in oklab, var(--color-amber-600) 20%, transparent)}}.border-gold\/30{border-color:#f7c5484d}@supports (color:color-mix(in lab, red, red)){.border-gold\/30{border-color:color-mix(in oklab, var(--color-gold) 30%, transparent)}}.border-white\/5{border-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.border-white\/5{border-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-white\/30{border-color:#ffffff4d}@supports (color:color-mix(in lab, red, red)){.border-white\/30{border-color:color-mix(in oklab, var(--color-white) 30%, transparent)}}.bg-amber-900\/20{background-color:#7b330633}@supports (color:color-mix(in lab, red, red)){.bg-amber-900\/20{background-color:color-mix(in oklab, var(--color-amber-900) 20%, transparent)}}.bg-gold{background-color:var(--color-gold)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-gray-900\/40{background-color:#10182866}@supports (color:color-mix(in lab, red, red)){.bg-gray-900\/40{background-color:color-mix(in oklab, var(--color-gray-900) 40%, transparent)}}.bg-navy\/80{background-color:#0b1220cc}@supports (color:color-mix(in lab, red, red)){.bg-navy\/80{background-color:color-mix(in oklab, var(--color-navy) 80%, transparent)}}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab, red, red)){.bg-white\/5{background-color:color-mix(in oklab, var(--color-white) 5%, transparent)}}.bg-gradient-to-b{--tw-gradient-position:to bottom in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-\[\#111a2b\]{--tw-gradient-from:#111a2b;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.from-gold\/10{--tw-gradient-from:#f7c5481a}@supports (color:color-mix(in lab, red, red)){.from-gold\/10{--tw-gradient-from:color-mix(in oklab, var(--color-gold) 10%, transparent)}}.from-gold\/10{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.from-navy{--tw-gradient-from:var(--color-navy);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-\[\#1f2937\]{--tw-gradient-to:#1f2937;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-gray-900{--tw-gradient-to:var(--color-gray-900);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-orange\/10{--tw-gradient-to:#f973161a}@supports (color:color-mix(in lab, red, red)){.to-orange\/10{--tw-gradient-to:color-mix(in oklab, var(--color-orange) 10%, transparent)}}.to-orange\/10{--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}.object-contain{object-fit:contain}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-7{padding:calc(var(--spacing) * 7)}.p-8{padding:calc(var(--spacing) * 8)}.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-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.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-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-14{padding-block:calc(var(--spacing) * 14)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-20{padding-block:calc(var(--spacing) * 20)}.py-24{padding-block:calc(var(--spacing) * 24)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-8{padding-top:calc(var(--spacing) * 8)}.pt-10{padding-top:calc(var(--spacing) * 10)}.pt-12{padding-top:calc(var(--spacing) * 12)}.pt-14{padding-top:calc(var(--spacing) * 14)}.pt-20{padding-top:calc(var(--spacing) * 20)}.pb-12{padding-bottom:calc(var(--spacing) * 12)}.pb-16{padding-bottom:calc(var(--spacing) * 16)}.pb-24{padding-bottom:calc(var(--spacing) * 24)}.pb-28{padding-bottom:calc(var(--spacing) * 28)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-6{padding-left:calc(var(--spacing) * 6)}.text-center{text-align:center}.text-left{text-align:left}.font-mono{font-family:var(--font-mono)}.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-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--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-\[10px\]{font-size:10px}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-\[1\.05\]{--tw-leading:1.05;line-height:1.05}.leading-\[1\.08\]{--tw-leading:1.08;line-height:1.08}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-tight{--tw-leading:var(--leading-tight);line-height:var(--leading-tight)}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.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)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.text-\[\#d1d5db\]{color:#d1d5db}.text-amber-400{color:var(--color-amber-400)}.text-gold{color:var(--color-gold)}.text-green-400{color:var(--color-green-400)}.text-navy{color:var(--color-navy)}.text-orange{color:var(--color-orange)}.text-orange-400{color:var(--color-orange-400)}.text-red-400{color:var(--color-red-400)}.text-white{color:var(--color-white)}.text-white\/20{color:#fff3}@supports (color:color-mix(in lab, red, red)){.text-white\/20{color:color-mix(in oklab, var(--color-white) 20%, transparent)}}.text-white\/40{color:#fff6}@supports (color:color-mix(in lab, red, red)){.text-white\/40{color:color-mix(in oklab, var(--color-white) 40%, transparent)}}.text-white\/50{color:#ffffff80}@supports (color:color-mix(in lab, red, red)){.text-white\/50{color:color-mix(in oklab, var(--color-white) 50%, transparent)}}.text-white\/60{color:#fff9}@supports (color:color-mix(in lab, red, red)){.text-white\/60{color:color-mix(in oklab, var(--color-white) 60%, transparent)}}.text-white\/70{color:#ffffffb3}@supports (color:color-mix(in lab, red, red)){.text-white\/70{color:color-mix(in oklab, var(--color-white) 70%, transparent)}}.text-white\/80{color:#fffc}@supports (color:color-mix(in lab, red, red)){.text-white\/80{color:color-mix(in oklab, var(--color-white) 80%, transparent)}}.uppercase{text-transform:uppercase}.underline{text-decoration-line:underline}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.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))}@media (hover:hover){.hover\:scale-\[1\.02\]:hover{scale:1.02}.hover\:text-gold:hover{color:var(--color-gold)}.hover\:text-white:hover{color:var(--color-white)}.hover\:underline:hover{text-decoration-line:underline}}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}}@media (min-width:48rem){.md\:mt-14{margin-top:calc(var(--spacing) * 14)}.md\:flex{display:flex}.md\:grid{display:grid}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.md\:gap-5{gap:calc(var(--spacing) * 5)}.md\:p-10{padding:calc(var(--spacing) * 10)}.md\:text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.md\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.md\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.md\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.md\:text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.md\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.md\:text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}}@media (min-width:64rem){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{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}
/* A11y patch 2026-04-22: footer links get underline so they don't rely on color alone (WCAG AA) */
footer a{text-decoration:underline;text-underline-offset:2px;text-decoration-color:rgba(255,255,255,.22)}
footer a:hover{text-decoration-color:var(--color-gold)}

/* ============================================================
   MatesWin — Editorial Magazine Theme (2026-04-29)
   Designed for reading psychology + trust + premium feel.
============================================================ */

:root {
  --bg-base: #14110d;
  --bg-surface-1: #1c1812;
  --bg-surface-2: #25201a;
  --bg-elevated: #2f2820;

  --text-primary: #f5efe1;
  --text-body: #ddd2b8;
  --text-muted: #9d8f76;
  --text-faint: #685e4d;

  --accent-amber: #f4b942;
  --accent-amber-soft: rgba(244, 185, 66, 0.15);
  --accent-amber-glow: rgba(244, 185, 66, 0.25);

  --primary-cta: #10b981;
  --primary-cta-hover: #34d399;
  --primary-cta-soft: rgba(16, 185, 129, 0.15);

  --warning-coral: #f87171;

  --divider: rgba(245, 239, 225, 0.08);
  --divider-strong: rgba(245, 239, 225, 0.14);
  --hairline: rgba(244, 185, 66, 0.18);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.20);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.25);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.45), 0 1px 0 rgba(244, 185, 66, 0.1) inset;
}

html, body {
  background: var(--bg-base) !important;
  color: var(--text-body) !important;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  background:
    radial-gradient(ellipse 1200px 800px at 50% 0%, rgba(244, 185, 66, 0.04) 0%, transparent 60%),
    var(--bg-base) !important;
  background-attachment: fixed !important;
  min-height: 100vh;
  position: relative;
}

h1, h2, h3, h4 {
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  color: var(--text-primary) !important;
  letter-spacing: -0.02em;
  font-variation-settings: "opsz" 96, "SOFT" 50;
}
h1 { font-weight: 800 !important; line-height: 1.05 !important; letter-spacing: -0.035em; }
h2 { font-weight: 700 !important; line-height: 1.18 !important; }
h3 { font-weight: 600 !important; line-height: 1.3 !important; }

.text-5xl, .text-6xl, .text-7xl,
.md\:text-5xl, .md\:text-6xl, .md\:text-7xl {
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  font-variation-settings: "opsz" 144, "SOFT" 30;
  letter-spacing: -0.04em;
}

header.sticky {
  background: rgba(20, 17, 13, 0.85) !important;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--divider) !important;
  box-shadow: 0 1px 0 var(--hairline);
}

header .text-gold { color: var(--accent-amber) !important; }
header .text-white { color: #ffffff !important; }
header nav a {
  color: var(--text-body) !important;
  font-weight: 500;
  letter-spacing: -0.005em;
}
header nav a:hover { color: var(--accent-amber) !important; }

.btn-primary,
a.btn-primary,
.bg-gold {
  background: var(--primary-cta) !important;
  color: #052e23 !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.20) inset, 0 4px 14px rgba(16, 185, 129, 0.28) !important;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-primary:hover, a.btn-primary:hover, a.bg-gold:hover {
  background: var(--primary-cta-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.30) inset, 0 8px 24px rgba(16, 185, 129, 0.42) !important;
  color: #052e23 !important;
}

.btn-ghost {
  background: transparent !important;
  border: 1px solid var(--divider-strong) !important;
  color: var(--text-primary) !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
}
.btn-ghost:hover {
  border-color: var(--accent-amber) !important;
  color: var(--accent-amber) !important;
  background: var(--accent-amber-soft) !important;
}

.grad-hero {
  background:
    radial-gradient(ellipse 600px 400px at 50% 8%, rgba(244, 185, 66, 0.08), transparent 60%),
    linear-gradient(180deg, var(--bg-base) 0%, var(--bg-surface-1) 100%) !important;
  position: relative;
}
.grad-hero::after {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 10%, var(--hairline) 50%, transparent 90%);
  pointer-events: none;
}

.grad-bonza, .grad-crikey, .grad-dinkum, .grad-purple {
  background:
    radial-gradient(ellipse 700px 500px at 18% 0%, rgba(244, 185, 66, 0.07), transparent 60%),
    linear-gradient(180deg, var(--bg-base) 0%, var(--bg-surface-1) 100%) !important;
}

.text-gold { color: var(--accent-amber) !important; }
.text-orange { color: var(--accent-amber) !important; }

.text-5xl.text-gold,
.text-6xl.text-gold,
.text-7xl.text-gold {
  color: var(--accent-amber) !important;
  font-weight: 800 !important;
  font-variation-settings: "opsz" 144;
}

.uppercase.tracking-wider,
.text-xs.uppercase {
  font-family: "Inter", sans-serif !important;
  letter-spacing: 0.14em !important;
  font-weight: 600 !important;
  color: var(--text-muted) !important;
  font-size: 11px !important;
}

p, .text-base, .text-lg {
  color: var(--text-body) !important;
  line-height: 1.72 !important;
}
p strong, strong { color: var(--text-primary) !important; font-weight: 600; }
.text-white\/70, .text-white\/80, .text-white\/60, .text-\[\#d1d5db\] {
  color: var(--text-body) !important;
}
.text-white\/50, .text-white\/40, .text-white\/20 {
  color: var(--text-muted) !important;
}

.card,
.brand-card,
.bg-white\/5,
.bg-gray-900\/40,
.bg-gradient-to-br,
.bg-gradient-to-b {
  background: var(--bg-surface-1) !important;
  border: 1px solid var(--divider) !important;
  border-radius: 14px !important;
  box-shadow: var(--shadow-sm) !important;
  backdrop-filter: none;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}
.card:hover, .brand-card:hover {
  background: var(--bg-surface-2) !important;
  border-color: var(--hairline) !important;
  box-shadow: var(--shadow-md) !important;
  transform: translateY(-2px);
}

.bg-amber-900\/20 {
  background: var(--accent-amber-soft) !important;
  border: 1px solid var(--hairline) !important;
  color: var(--accent-amber) !important;
}

.tldr {
  background: linear-gradient(135deg, var(--bg-surface-1) 0%, rgba(244, 185, 66, 0.04) 100%) !important;
  border: 1px solid var(--divider) !important;
  border-left: 3px solid var(--accent-amber) !important;
  border-radius: 10px !important;
  padding: 1.4rem 1.6rem !important;
  color: var(--text-body) !important;
}
.tldr strong { color: var(--text-primary) !important; }

.prose h2, article h2, section h2 {
  color: var(--text-primary) !important;
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
  margin-top: 2.6rem !important;
}
.prose h3, article h3 {
  color: var(--accent-amber) !important;
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  font-weight: 600 !important;
}

table, .prose table, table.cmp, table.facts {
  background: var(--bg-surface-1) !important;
  border-radius: 10px !important;
  overflow: hidden;
  border: 1px solid var(--divider) !important;
  box-shadow: var(--shadow-sm) !important;
  font-size: 0.95rem;
}
table th, table.cmp th, table.facts th, .prose table th {
  background: var(--bg-surface-2) !important;
  color: var(--accent-amber) !important;
  font-family: "Inter", sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-size: 0.78rem !important;
  padding: 0.85rem 1rem !important;
  border-bottom: 1px solid var(--divider-strong) !important;
}
table td, .prose table td, table.cmp td, table.facts td {
  border-bottom: 1px solid var(--divider) !important;
  color: var(--text-body) !important;
  padding: 0.85rem 1rem !important;
}
table tr:last-child td { border-bottom: none !important; }

.prose a, article.prose a, p a {
  color: var(--accent-amber) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(244, 185, 66, 0.35) !important;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
  font-weight: 500;
}
.prose a:hover, article.prose a:hover, p a:hover {
  text-decoration-color: var(--accent-amber) !important;
}

.pulse-dot {
  background: var(--primary-cta) !important;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
}

.pros-card { border-left: 3px solid var(--primary-cta) !important; }
.cons-card { border-left: 3px solid var(--warning-coral) !important; }
.pros-cons { background: var(--bg-surface-1) !important; }
.pros-cons .pro::before { color: var(--primary-cta) !important; font-weight: 700; }
.pros-cons .con::before { color: var(--warning-coral) !important; font-weight: 700; }

.score-bar {
  background: rgba(245, 239, 225, 0.06) !important;
  height: 6px !important;
  border-radius: 999px !important;
}
.score-fill {
  background: linear-gradient(90deg, var(--accent-amber), var(--primary-cta)) !important;
  border-radius: 999px !important;
}

footer {
  background: linear-gradient(180deg, var(--bg-surface-1) 0%, #0e0c08 100%) !important;
  border-top: 1px solid var(--divider) !important;
}
footer a {
  color: var(--text-muted) !important;
  text-decoration-color: rgba(244, 185, 66, 0.18) !important;
}
footer a:hover {
  color: var(--accent-amber) !important;
  text-decoration-color: var(--accent-amber) !important;
}

ol li::marker {
  color: var(--accent-amber) !important;
  font-weight: 700;
  font-family: Inter, system-ui, -apple-system, sans-serif;
}
ul li::marker { color: var(--accent-amber) !important; }

.inline-flex.items-center.justify-center.rounded-full {
  background: var(--accent-amber) !important;
  color: var(--bg-base) !important;
  font-weight: 700 !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(244, 185, 66, 0.30);
}

::selection { background: var(--accent-amber); color: var(--bg-base); }

html { scroll-behavior: smooth; }

.bg-navy\/80 { background-color: rgba(20, 17, 13, 0.82) !important; }
.bg-gray-900, .bg-gray-900\/40 { background-color: var(--bg-surface-1) !important; }

article p, .prose p { max-width: 70ch; }

/* ============================================================
   Editorial Magazine v2 — Style flourishes (2026-04-29)
============================================================ */

header a.flex.items-center {
  position: relative;
  padding-right: 1.3rem;
}
header a.flex.items-center::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  background: var(--accent-amber);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--accent-amber);
}

.grad-hero {
  position: relative;
  overflow: hidden;
}
.grad-hero::before {
  content: "";
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 36px;
  background: linear-gradient(180deg, transparent, var(--accent-amber), transparent);
  opacity: 0.4;
}

.grad-hero h1 {
  font-size: clamp(2.6rem, 6.5vw, 5.5rem) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.045em !important;
  font-weight: 700 !important;
  font-variation-settings: "opsz" 144 !important;
}

.grad-hero h1 .text-gold,
.grad-hero h1 .text-orange {
  font-style: italic !important;
  font-weight: 800 !important;
  font-variation-settings: "opsz" 144, "SOFT" 100 !important;
  background: linear-gradient(180deg, var(--accent-amber) 0%, #d99a30 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent !important;
}

.grad-hero .text-lg, .grad-hero .text-xl,
section .max-w-2xl.mx-auto.text-lg {
  font-size: 1.15rem !important;
  line-height: 1.65 !important;
  color: var(--text-body) !important;
  max-width: 58ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.grid.md\:grid-cols-4 .text-5xl,
.grid.md\:grid-cols-4 .text-6xl,
.grid.md\:grid-cols-4 .text-7xl {
  font-size: 3.4rem !important;
  letter-spacing: -0.05em !important;
  font-weight: 800 !important;
  font-variation-settings: "opsz" 144;
  display: block;
  margin-bottom: 0.4rem !important;
}

.bg-amber-900\/20.text-amber-400,
.inline-flex.items-center.gap-2.px-3.py-1.rounded-full.bg-white\/5 {
  background: rgba(244, 185, 66, 0.06) !important;
  border: 1px solid rgba(244, 185, 66, 0.20) !important;
  color: var(--accent-amber) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  padding: 0.45rem 0.95rem !important;
}

section > .container > h2,
section > div > div > h2,
.max-w-6xl > h2 {
  position: relative;
  text-align: center;
  font-size: clamp(1.8rem, 3.6vw, 2.7rem) !important;
  font-weight: 700 !important;
  margin-bottom: 1.2rem !important;
  letter-spacing: -0.025em;
}
section h2 + p,
section h2 + div + p {
  text-align: center;
  max-width: 56ch;
  margin: 0 auto 2.5rem !important;
  color: var(--text-muted) !important;
}

.max-w-4xl.mx-auto h2::before,
.max-w-5xl.mx-auto h2::before,
.max-w-6xl.mx-auto h2::before {
  content: "";
  display: block;
  width: 56px;
  height: 1px;
  background: var(--accent-amber);
  margin: 0 auto 1.4rem;
  opacity: 0.7;
}

.card {
  position: relative;
  overflow: hidden;
  padding: 1.75rem !important;
  border-radius: 12px !important;
}
.card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--hairline), transparent);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.card:hover::before { opacity: 1; }

.card .text-xs.uppercase,
.card span[class*="amber"] {
  color: var(--accent-amber) !important;
  letter-spacing: 0.12em;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
}

.card h3, .brand-card h3 {
  font-size: 1.3rem !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 0.5rem !important;
}

.btn-primary {
  padding: 0.85rem 1.6rem !important;
  font-size: 0.95rem !important;
  letter-spacing: -0.005em;
  position: relative;
  overflow: hidden;
}
.btn-primary::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.6s ease;
}
.btn-primary:hover::after { left: 150%; }

section.py-16, section.py-20, section.py-24 {
  padding-top: 5.5rem !important;
  padding-bottom: 5.5rem !important;
}

section#about h2 + p:first-of-type,
section#about > div > p:first-of-type {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-style: italic;
  font-size: 1.25rem;
  line-height: 1.6;
  color: var(--text-primary) !important;
  font-variation-settings: "opsz" 96;
  border-left: 2px solid var(--accent-amber);
  padding-left: 1.4rem;
  margin: 2rem 0 !important;
  max-width: 60ch;
}

footer {
  text-align: center;
  padding: 4rem 1rem 2rem !important;
}
footer h4 {
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  font-size: 1.4rem !important;
  letter-spacing: -0.02em;
  color: var(--accent-amber) !important;
}

.brand-card {
  position: relative;
  padding: 2rem 1.5rem !important;
  text-align: center;
}
.brand-card::after {
  content: "";
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent-amber);
  opacity: 0.4;
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.brand-card:hover::after {
  opacity: 1;
  transform: scale(1.4);
  box-shadow: 0 0 12px var(--accent-amber);
}

header nav a {
  position: relative;
  padding: 0.4rem 0;
}
header nav a::after {
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--accent-amber);
  transition: width 0.3s ease;
}
header nav a:hover::after { width: 100%; }

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.card, .brand-card {
  animation: fadeUp 0.6s cubic-bezier(0.4, 0, 0.2, 1) backwards;
}
.grid > *:nth-child(1) { animation-delay: 0.05s; }
.grid > *:nth-child(2) { animation-delay: 0.10s; }
.grid > *:nth-child(3) { animation-delay: 0.15s; }
.grid > *:nth-child(4) { animation-delay: 0.20s; }
.grid > *:nth-child(5) { animation-delay: 0.25s; }
.grid > *:nth-child(6) { animation-delay: 0.30s; }

section blockquote, .quote-block {
  position: relative;
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.5;
  color: var(--text-primary);
  padding: 2rem 0 2rem 4rem;
  max-width: 56ch;
  margin: 0 auto;
}
section blockquote::before, .quote-block::before {
  content: "\201C";
  position: absolute;
  left: 0;
  top: -0.5rem;
  font-size: 6rem;
  line-height: 1;
  color: var(--accent-amber);
  opacity: 0.7;
  font-family: Inter, system-ui, -apple-system, sans-serif;
}

details {
  border: 1px solid var(--divider) !important;
  border-radius: 10px !important;
  background: var(--bg-surface-1) !important;
  margin-bottom: 0.6rem;
  padding: 1.1rem 1.4rem !important;
  transition: all 0.2s ease;
}
details[open] {
  background: var(--bg-surface-2) !important;
  border-color: var(--hairline) !important;
}
details summary {
  font-weight: 600 !important;
  color: var(--text-primary) !important;
  font-size: 1rem !important;
  cursor: pointer;
}
details[open] summary {
  color: var(--accent-amber) !important;
  margin-bottom: 0.6rem;
}

body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg,
    transparent 0%,
    var(--accent-amber) 30%,
    var(--primary-cta) 50%,
    var(--accent-amber) 70%,
    transparent 100%);
  z-index: 100;
  opacity: 0.6;
  pointer-events: none;
}

ol > li::marker {
  font-family: Inter, system-ui, -apple-system, sans-serif !important;
  font-weight: 800;
  font-size: 1.1em;
  font-variation-settings: "opsz" 96;
}

/* Hero image overlay (2026-04-29) */
.grad-hero {
  background:
    linear-gradient(180deg, rgba(20, 17, 13, 0.78) 0%, rgba(28, 24, 18, 0.95) 70%, var(--bg-base) 100%),
    url("/assets/hero/hero-main.jpg") center/cover no-repeat,
    var(--bg-base) !important;
  background-attachment: fixed !important;
}

/* Article byline — E-E-A-T visible signal */
.article-byline {
  margin: 12px 0 0;
  padding: 8px 14px;
  background: rgba(255, 215, 0, 0.06);
  border-left: 3px solid #FFD700;
  border-radius: 4px;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.7);
  display: inline-block;
}
.article-byline a strong { color: #FFD700; }
.article-byline a:hover strong { text-decoration: underline; }
.article-byline .byline-role { font-style: italic; color: rgba(255,255,255,0.5); }
.article-byline time { font-weight: 600; color: rgba(255,255,255,0.85); }


/* Related Sections — pillar cross-link */
.related-sections {
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.related-sections li a {
  display: block;
  padding: 10px 14px;
  background: rgba(255, 215, 0, 0.08);
  border: 1px solid rgba(255, 215, 0, 0.25);
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  color: #FFD700;
  transition: all 0.15s;
}
.related-sections li a:hover {
  background: rgba(255, 215, 0, 0.15);
  transform: translateY(-1px);
}
