/* ==========================================================================
 * PetroSpect public homepage stylesheet
 * Hand-authored static Tailwind-compatible utilities used by
 * src/pages/PublicHome.tsx. Every rule here exists to resolve a class that
 * appears literally in that source file. No rule is decorative. Generated
 * from the class list extracted from the component source.
 *
 * Scoping: these utilities are written as plain class selectors. They do NOT
 * collide with the ERP's pre-compiled CSS because:
 *   - brand-* colour tokens, arbitrary [..] values, and custom utilities
 *     (bg-grid, glass, text-shadow-premium, shadow-3xl, animate-heartbeat,
 *     animate-pulse-slow) are exclusive to the homepage.
 *   - where a token also exists in the ERP's compiled CSS (e.g. .h-screen),
 *     the cascade resolves by load order; the ERP page does not mount
 *     PublicHome, so no visual conflict occurs on /portal.
 * ==========================================================================
 */

/* Keyframes */
@keyframes ph_heartbeat {
  0%,100% { opacity:0.3; filter:blur(0px); }
  15%     { opacity:1;   filter:blur(2px); }
  30%     { opacity:0.3; filter:blur(0px); }
  45%     { opacity:1;   filter:blur(2px); }
  60%     { opacity:0.3; filter:blur(0px); }
}
@keyframes ph_pulse_slow {
  0%,100% { opacity:0.4; transform:scale(1.1); }
  50%     { opacity:0.7; transform:scale(1); }
}
@keyframes tw_ping {
  75%,100% { transform:scale(2); opacity:0; }
}

/* Homepage baseline — scoped to .homepage-root wrapper on PublicHome.tsx so
   these never affect /portal (which has its own body font via shadcn). */
html { scroll-behavior:smooth; }
.homepage-root { font-family:"Inter",ui-sans-serif,system-ui,sans-serif;
                 background:#fff; color:#0f172a;
                 -webkit-font-smoothing:antialiased;
                 -moz-osx-font-smoothing:grayscale; }

/* --- Utilities ------------------------------------------------------------ */
.-bottom-1 {bottom:-0.25rem;}
.-left-32 {left:-8.0rem;}
.-right-32 {right:-8.0rem;}
.-rotate-90 {transform:rotate(90deg);}
.-skew-x-12 {transform:skewX(12deg);}
.-translate-y-1\/2 {transform:translateY(50%);}
.absolute {position:absolute;}
.active\:translate-y-0:active {transform:translateY(0);}
.animate-heartbeat {animation:ph_heartbeat 2.5s ease-in-out infinite;}
.animate-ping {animation:tw_ping 1s cubic-bezier(0,0,0.2,1) infinite;}
.animate-pulse-slow {animation:ph_pulse_slow 12s cubic-bezier(0.4,0,0.6,1) infinite;}
.aspect-\[4\/3\] {aspect-ratio:4/3;}
.aspect-\[4\/5\] {aspect-ratio:4/5;}
.aspect-video {aspect-ratio:16/9;}
.backdrop-blur-sm {backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
.backdrop-blur-xl {backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);}
.bg-brand-navy {background-color:#0B0E2A;}
.bg-brand-navy\/30 {background-color:rgba(11,14,42,0.3);}
.bg-brand-navy\/40 {background-color:rgba(11,14,42,0.4);}
.bg-brand-navy\/60 {background-color:rgba(11,14,42,0.6);}
.bg-brand-navy\/95 {background-color:rgba(11,14,42,0.95);}
.bg-brand-orange {background-color:#6B74B5;}
.bg-brand-orange\/10 {background-color:rgba(107,116,181,0.1);}
.bg-brand-yellow {background-color:#FEF200;}
.bg-center {background-position:center;}
.bg-cover {background-size:cover;}
.bg-gradient-to-b {background-image:linear-gradient(to bottom,var(--tw-gradient-stops));}
.bg-gradient-to-r {background-image:linear-gradient(to right,var(--tw-gradient-stops));}
.bg-gradient-to-t {background-image:linear-gradient(to top,var(--tw-gradient-stops));}
.bg-grid {background-image:linear-gradient(rgba(255,255,255,0.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.05) 1px,transparent 1px);background-size:50px 50px;}
.bg-slate-100 {background-color:#f1f5f9;}
.bg-slate-200 {background-color:#e2e8f0;}
.bg-surface-gray {background-color:#F8FAFC;}
.bg-surface-gray\/50 {background-color:rgba(248,250,252,0.5);}
.bg-transparent {background-color:transparent;}
.bg-white {background-color:#ffffff;}
.bg-white\/10 {background-color:rgba(255,255,255,0.1);}
.bg-white\/20 {background-color:rgba(255,255,255,0.2);}
.bg-white\/5 {background-color:rgba(255,255,255,0.05);}
.bg-white\/\[0\.02\] {background-color:rgba(255,255,255,0.02);}
.block {display:block;}
.blur-md {filter:blur(12px);}
.blur-sm {filter:blur(4px);}
.border-b {border-bottom-width:1px;}
.border-brand-orange {border-color:#6B74B5;}
.border-brand-orange\/20 {border-color:rgba(107,116,181,0.2);}
.border-l-4 {border-left-width:4px;}
.border-none {border-style:none;}
.border-slate-100 {border-color:#f1f5f9;}
.border-t {border-top-width:1px;}
.border-white\/10 {border-color:rgba(255,255,255,0.1);}
.border-white\/5 {border-color:rgba(255,255,255,0.05);}
.border-y {border-top-width:1px;border-bottom-width:1px;}
.bottom-0 {bottom:0.0rem;}
.bottom-12 {bottom:3.0rem;}
.contrast-125 {filter:contrast(1.25);}
.cursor-pointer {cursor:pointer;}
.drop-shadow-\[0_0_15px_rgba\(254\,242\,0\,0\.8\)\] {filter:drop-shadow(0 0 15px rgba(254,242,0,0.8));}
.fixed {position:fixed;}
.flex {display:flex;}
.flex-1 {flex:1 1 0%;}
.flex-col {flex-direction:column;}
.flex-row-reverse {flex-direction:row-reverse;}
.flex-wrap {flex-wrap:wrap;}
.focus\:ring-4:focus {box-shadow:0 0 0 4px var(--tw-ring-color,rgba(0,0,0,0.5));}
.focus\:ring-brand-yellow\/30:focus {--tw-ring-color:rgba(254,242,0,0.3);}
.font-black {font-weight:900;}
.font-bold {font-weight:700;}
.font-medium {font-weight:500;}
.from-brand-navy {--tw-gradient-from:#0B0E2A;--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(0,0,0,0));}
.from-brand-navy\/40 {--tw-gradient-from:rgba(11,14,42,0.4);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(0,0,0,0));}
.gap-12 {gap:3.0rem;}
.gap-16 {gap:4.0rem;}
.gap-20 {gap:5.0rem;}
.gap-4 {gap:1.0rem;}
.gap-6 {gap:1.5rem;}
.gap-8 {gap:2.0rem;}
.glass {background:rgba(255,255,255,0.05);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,0.1);}
.grid {display:grid;}
.grid-cols-2 {grid-template-columns:repeat(2,minmax(0,1fr));}
.grid-cols-3 {grid-template-columns:repeat(3,minmax(0,1fr));}
.group {}
.group:hover .group-hover\:-translate-x-1 {transform:translateX(0.25rem);}
.group:hover .group-hover\:-translate-x-2 {transform:translateX(0.5rem);}
.group:hover .group-hover\:bg-brand-orange {background-color:#6B74B5;}
.group:hover .group-hover\:bg-brand-yellow {background-color:#FEF200;}
.group:hover .group-hover\:opacity-100 {opacity:1.0;}
.group:hover .group-hover\:rotate-0 {transform:rotate(0);}
.group:hover .group-hover\:scale-110 {transform:scale(1.1);}
.group:hover .group-hover\:text-brand-navy {color:#0B0E2A;}
.group:hover .group-hover\:text-brand-orange {color:#6B74B5;}
.group:hover .group-hover\:text-brand-yellow {color:#FEF200;}
.group:hover .group-hover\:translate-x-1 {transform:translateX(0.25rem);}
.group:hover .group-hover\:translate-x-2 {transform:translateX(0.5rem);}
.group:hover .group-hover\:translate-y-0 {transform:translateY(0);}
.group:hover .group-hover\:w-full {width:100%;}
.h-0\.5 {height:0.125rem;}
.h-1\.5 {height:0.375rem;}
.h-12 {height:3.0rem;}
.h-14 {height:3.5rem;}
.h-16 {height:4.0rem;}
.h-2 {height:0.5rem;}
.h-3 {height:0.75rem;}
.h-3\.5 {height:0.875rem;}
.h-4 {height:1.0rem;}
.h-5 {height:1.25rem;}
.h-6 {height:1.5rem;}
.h-64 {height:16.0rem;}
.h-8 {height:2.0rem;}
.h-\[1px\] {height:1px;}
.h-full {height:100%;}
.h-px {height:1px;}
.h-screen {height:100vh;}
.hidden {display:none;}
.hover\:bg-brand-orange:hover {background-color:#6B74B5;}
.hover\:bg-brand-yellow:hover {background-color:#FEF200;}
.hover\:bg-white:hover {background-color:#ffffff;}
.hover\:bg-white\/20:hover {background-color:rgba(255,255,255,0.2);}
.hover\:bg-white\/\[0\.07\]:hover {background-color:rgba(255,255,255,0.07);}
.hover\:border-brand-yellow:hover {border-color:#FEF200;}
.hover\:border-brand-yellow\/50:hover {border-color:rgba(254,242,0,0.5);}
.hover\:grayscale-0:hover {filter:grayscale(0);}
.hover\:text-brand-navy:hover {color:#0B0E2A;}
.hover\:text-brand-yellow:hover {color:#FEF200;}
.hover\:text-white:hover {color:#ffffff;}
.hover\:translate-y-\[-2px\]:hover {transform:translateY(-2px);}
.inline-block {display:inline-block;}
.inline-flex {display:inline-flex;}
.inset-0 {inset:0;}
.inset-x-0 {left:0;right:0;}
.italic {font-style:italic;}
.items-center {align-items:center;}
.items-start {align-items:flex-start;}
.items-stretch {align-items:stretch;}
.justify-between {justify-content:space-between;}
.justify-center {justify-content:center;}
.leading-\[0\.8\] {line-height:0.8;}
.leading-relaxed {line-height:1.625;}
.leading-tight {line-height:1.25;}
.left-0 {left:0.0rem;}
.left-12 {left:3.0rem;}
@media (min-width:1024px) {.lg\:block {display:block;}}
@media (min-width:1024px) {.lg\:col-span-5 {grid-column:span 5 / span 5;}}
@media (min-width:1024px) {.lg\:col-span-7 {grid-column:span 7 / span 7;}}
@media (min-width:1024px) {.lg\:flex {display:flex;}}
@media (min-width:1024px) {.lg\:flex-row {flex-direction:row;}}
@media (min-width:1024px) {.lg\:flex-row-reverse {flex-direction:row-reverse;}}
@media (min-width:1024px) {.lg\:gap-8 {gap:2.0rem;}}
@media (min-width:1024px) {.lg\:grid-cols-12 {grid-template-columns:repeat(12,minmax(0,1fr));}}
@media (min-width:1024px) {.lg\:grid-cols-3 {grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (min-width:1024px) {.lg\:grid-cols-4 {grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:1024px) {.lg\:grid-cols-5 {grid-template-columns:repeat(5,minmax(0,1fr));}}
@media (min-width:1024px) {.lg\:hidden {display:none;}}
@media (min-width:1024px) {.lg\:items-end {align-items:flex-end;}}
@media (min-width:1024px) {.lg\:justify-between {justify-content:space-between;}}
@media (min-width:1024px) {.lg\:p-14 {padding:3.5rem;}}
@media (min-width:1024px) {.lg\:p-16 {padding:4.0rem;}}
@media (min-width:1024px) {.lg\:px-8 {padding-left:2.0rem;padding-right:2.0rem;}}
@media (min-width:1024px) {.lg\:text-3xl {font-size:1.875rem;line-height:2.25rem;}}
@media (min-width:1024px) {.lg\:text-4xl {font-size:2.25rem;line-height:2.5rem;}}
@media (min-width:1024px) {.lg\:text-5xl {font-size:3rem;line-height:1;}}
@media (min-width:1024px) {.lg\:text-9xl {font-size:8rem;line-height:1;}}
@media (min-width:1024px) {.lg\:text-\[10rem\] {font-size:10rem;}}
@media (min-width:1024px) {.lg\:text-xl {font-size:1.25rem;line-height:1.75rem;}}
.max-w-2xl {max-width:42rem;}
.max-w-4xl {max-width:56rem;}
.max-w-7xl {max-width:80rem;}
.max-w-md {max-width:28rem;}
.max-w-sm {max-width:24rem;}
.mb-10 {margin-bottom:2.5rem;}
.mb-12 {margin-bottom:3.0rem;}
.mb-16 {margin-bottom:4.0rem;}
.mb-2 {margin-bottom:0.5rem;}
.mb-24 {margin-bottom:6.0rem;}
.mb-4 {margin-bottom:1.0rem;}
.mb-6 {margin-bottom:1.5rem;}
.mb-8 {margin-bottom:2.0rem;}
@media (min-width:768px) {.md\:flex-row {flex-direction:row;}}
@media (min-width:768px) {.md\:grid-cols-2 {grid-template-columns:repeat(2,minmax(0,1fr));}}
.min-h-screen {min-height:100vh;}
.ml-3 {margin-left:0.75rem;}
.mr-3 {margin-right:0.75rem;}
.mt-10 {margin-top:2.5rem;}
.mt-12 {margin-top:3.0rem;}
.mt-16 {margin-top:4.0rem;}
.mt-20 {margin-top:5.0rem;}
.mt-6 {margin-top:1.5rem;}
.mt-auto {margin-top:auto;}
.mx-auto {margin-left:auto;margin-right:auto;}
.not-italic {font-style:normal;}
.object-cover {object-fit:cover;}
.opacity-0 {opacity:0.0;}
.opacity-10 {opacity:0.1;}
.opacity-20 {opacity:0.2;}
.opacity-50 {opacity:0.5;}
.origin-center {transform-origin:center;}
.outline-none {outline:2px solid transparent;outline-offset:2px;}
.overflow-hidden {overflow:hidden;}
.overflow-visible {overflow:visible;}
.p-1 {padding:0.25rem;}
.p-10 {padding:2.5rem;}
.p-2 {padding:0.5rem;}
.p-3 {padding:0.75rem;}
.p-4 {padding:1.0rem;}
.p-5 {padding:1.25rem;}
.p-6 {padding:1.5rem;}
.p-8 {padding:2.0rem;}
.pb-12 {padding-bottom:3.0rem;}
.pb-16 {padding-bottom:4.0rem;}
.pl-8 {padding-left:2.0rem;}
.pointer-events-none {pointer-events:none;}
.pt-10 {padding-top:2.5rem;}
.pt-12 {padding-top:3.0rem;}
.pt-20 {padding-top:5.0rem;}
.pt-32 {padding-top:8.0rem;}
.pt-4 {padding-top:1.0rem;}
.px-1 {padding-left:0.25rem;padding-right:0.25rem;}
.px-12 {padding-left:3.0rem;padding-right:3.0rem;}
.px-3 {padding-left:0.75rem;padding-right:0.75rem;}
.px-4 {padding-left:1.0rem;padding-right:1.0rem;}
.px-6 {padding-left:1.5rem;padding-right:1.5rem;}
.px-8 {padding-left:2.0rem;padding-right:2.0rem;}
.py-1\.5 {padding-top:0.375rem;padding-bottom:0.375rem;}
.py-12 {padding-top:3.0rem;padding-bottom:3.0rem;}
.py-2 {padding-top:0.5rem;padding-bottom:0.5rem;}
.py-2\.5 {padding-top:0.625rem;padding-bottom:0.625rem;}
.py-24 {padding-top:6.0rem;padding-bottom:6.0rem;}
.py-3 {padding-top:0.75rem;padding-bottom:0.75rem;}
.py-32 {padding-top:8.0rem;padding-bottom:8.0rem;}
.py-4 {padding-top:1.0rem;padding-bottom:1.0rem;}
.py-5 {padding-top:1.25rem;padding-bottom:1.25rem;}
.py-6 {padding-top:1.5rem;padding-bottom:1.5rem;}
.relative {position:relative;}
.right-0 {right:0.0rem;}
.right-12 {right:3.0rem;}
.right-auto {right:auto;}
.rotate-180 {transform:rotate(180deg);}
.rotate-90 {transform:rotate(90deg);}
.rotate-\[-90deg\] {transform:rotate(-90deg);}
.rotate-\[90deg\] {transform:rotate(90deg);}
.rounded-2xl {border-radius:1rem;}
.rounded-3xl {border-radius:1.5rem;}
.rounded-\[3rem\] {border-radius:3rem;}
.rounded-\[4rem\] {border-radius:4rem;}
.rounded-full {border-radius:9999px;}
.rounded-lg {border-radius:0.5rem;}
.rounded-xl {border-radius:0.75rem;}
[dir=rtl] .rtl\:bg-gradient-to-l {background-image:linear-gradient(to left,var(--tw-gradient-stops));}
[dir=rtl] .rtl\:border-l-0 {border-left-width:0;}
[dir=rtl] .rtl\:border-r-4 {border-right-width:4px;}
[dir=rtl] .rtl\:pl-0 {padding-left:0.0rem;}
[dir=rtl] .rtl\:pr-8 {padding-right:2.0rem;}
.rtl\:space-x-reverse > :not([hidden]) ~ :not([hidden]) {--tw-space-x-reverse:1;}
.select-none {user-select:none;}
.shadow-2xl {box-shadow:0 25px 50px -12px rgba(0,0,0,0.25);}
.shadow-3xl {box-shadow:0 50px 100px -20px rgba(15,23,42,0.25),0 30px 60px -30px rgba(0,0,0,0.3);}
.shadow-brand-navy\/20 {box-shadow:0 10px 15px -3px rgba(11,14,42,0.2),0 4px 6px -4px rgba(11,14,42,0.2);}
.shadow-lg {box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -4px rgba(0,0,0,0.1);}
.shadow-xl {box-shadow:0 20px 25px -5px rgba(0,0,0,0.1),0 8px 10px -6px rgba(0,0,0,0.1);}
@media (min-width:640px) {.sm\:flex-row {flex-direction:row;}}
@media (min-width:640px) {.sm\:grid-cols-2 {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (min-width:640px) {.sm\:grid-cols-4 {grid-template-columns:repeat(4,minmax(0,1fr));}}
@media (min-width:640px) {.sm\:px-6 {padding-left:1.5rem;padding-right:1.5rem;}}
@media (min-width:640px) {.sm\:w-auto {width:auto;}}
.space-x-10 > :not([hidden]) ~ :not([hidden]) {margin-left:2.5rem;}
.space-x-12 > :not([hidden]) ~ :not([hidden]) {margin-left:3.0rem;}
.space-x-2 > :not([hidden]) ~ :not([hidden]) {margin-left:0.5rem;}
.space-x-3 > :not([hidden]) ~ :not([hidden]) {margin-left:0.75rem;}
.space-x-4 > :not([hidden]) ~ :not([hidden]) {margin-left:1.0rem;}
.space-x-6 > :not([hidden]) ~ :not([hidden]) {margin-left:1.5rem;}
.space-x-8 > :not([hidden]) ~ :not([hidden]) {margin-left:2.0rem;}
.space-x-reverse > :not([hidden]) ~ :not([hidden]) {--tw-space-x-reverse:1;}
.space-y-10 > :not([hidden]) ~ :not([hidden]) {margin-top:2.5rem;}
.space-y-32 > :not([hidden]) ~ :not([hidden]) {margin-top:8.0rem;}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {margin-top:1.5rem;}
.space-y-8 > :not([hidden]) ~ :not([hidden]) {margin-top:2.0rem;}
.sticky {position:sticky;}
.text-2xl {font-size:1.5rem;line-height:2rem;}
.text-3xl {font-size:1.875rem;line-height:2.25rem;}
.text-4xl {font-size:2.25rem;line-height:2.5rem;}
.text-6xl {font-size:3.75rem;line-height:1;}
.text-\[10px\] {font-size:10px;}
.text-\[11px\] {font-size:11px;}
.text-\[15rem\] {font-size:15rem;}
.text-brand-navy {color:#0B0E2A;}
.text-brand-orange {color:#6B74B5;}
.text-brand-yellow {color:#FEF200;}
.text-center {text-align:center;}
.text-lg {font-size:1.125rem;line-height:1.75rem;}
.text-right {text-align:right;}
.text-shadow-premium {text-shadow:0 20px 40px rgba(0,0,0,1);}
.text-slate-300 {color:#cbd5e1;}
.text-slate-400 {color:#94a3b8;}
.text-slate-500 {color:#64748b;}
.text-sm {font-size:0.875rem;line-height:1.25rem;}
.text-white {color:#ffffff;}
.text-white\/20 {color:rgba(255,255,255,0.2);}
.text-white\/40 {color:rgba(255,255,255,0.4);}
.text-white\/5 {color:rgba(255,255,255,0.05);}
.text-white\/60 {color:rgba(255,255,255,0.6);}
.text-white\/70 {color:rgba(255,255,255,0.7);}
.text-xl {font-size:1.25rem;line-height:1.75rem;}
.text-xs {font-size:0.75rem;line-height:1rem;}
.to-brand-navy {--tw-gradient-to:#0B0E2A;}
.to-transparent {--tw-gradient-to:transparent;}
.top-0 {top:0.0rem;}
.top-1\/2 {top:50%;}
.top-32 {top:8.0rem;}
.tracking-\[0\.2em\] {letter-spacing:0.2em;}
.tracking-\[0\.3em\] {letter-spacing:0.3em;}
.tracking-\[0\.4em\] {letter-spacing:0.4em;}
.tracking-tight {letter-spacing:-0.025em;}
.tracking-tighter {letter-spacing:-0.05em;}
.tracking-widest {letter-spacing:0.1em;}
.transition-all {transition-property:all;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.transition-colors {transition-property:color,background-color,border-color,fill,stroke;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.transition-opacity {transition-property:opacity;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.transition-transform {transition-property:transform;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms;}
.translate-x-1\/2 {transform:translateX(50%);}
.translate-y-2 {transform:translateY(0.5rem);}
.uppercase {text-transform:uppercase;}
.via-brand-navy\/40 {--tw-gradient-stops:var(--tw-gradient-from),rgba(11,14,42,0.4),var(--tw-gradient-to,rgba(0,0,0,0));}
.via-brand-navy\/60 {--tw-gradient-stops:var(--tw-gradient-from),rgba(11,14,42,0.6),var(--tw-gradient-to,rgba(0,0,0,0));}
.via-transparent {--tw-gradient-stops:var(--tw-gradient-from),transparent,var(--tw-gradient-to,rgba(0,0,0,0));}
.w-0 {width:0.0rem;}
.w-1\/2 {width:50.0%;}
.w-1\/3 {width:33.33333333333333%;}
.w-12 {width:3.0rem;}
.w-14 {width:3.5rem;}
.w-16 {width:4.0rem;}
.w-2 {width:0.5rem;}
.w-3 {width:0.75rem;}
.w-3\.5 {width:0.875rem;}
.w-4 {width:1.0rem;}
.w-5 {width:1.25rem;}
.w-6 {width:1.5rem;}
.w-8 {width:2.0rem;}
.w-full {width:100%;}
.w-px {width:1px;}
@media (min-width:1280px) {.xl\:block {display:block;}}
.z-0 {z-index:0;}
.z-10 {z-index:10;}
.z-20 {z-index:20;}
.z-50 {z-index:50;}
.focus\:ring-brand-yellow\/30:focus {box-shadow:0 0 0 4px rgba(254,242,0,0.3);}
.duration-1000 {transition-duration:1000ms;}
.duration-300 {transition-duration:300ms;}
.duration-500 {transition-duration:500ms;}
.duration-700 {transition-duration:700ms;}