.medusa-ocm{position:relative;}
.medusa-ocm-trigger-wrap{display:flex;align-items:center;justify-content:flex-end;}
.medusa-ocm-trigger{display:flex;align-items:center;gap:14px;background:transparent;border:0;cursor:pointer;padding:10px 0;}
.medusa-ocm-trigger-label{font-size:11px;font-weight:700;letter-spacing:.35em;text-transform:uppercase;line-height:1;color:#94a3b8;}
.medusa-ocm-burger{display:flex;flex-direction:column;justify-content:space-between;width:22px;height:12px;}
.medusa-ocm-burger span{height:1px;background:#1A365D;display:block;transition:transform .4s ease;}
.medusa-ocm-burger span:nth-child(2){width:70%;}

/* Burger hover micro-interaction (as per your original React code) */
.medusa-ocm-trigger:hover .medusa-ocm-burger span:nth-child(1){transform:translateX(4px);}
.medusa-ocm-trigger:hover .medusa-ocm-burger span:nth-child(2){transform:translateX(8px);}
.medusa-ocm-trigger:hover .medusa-ocm-burger span:nth-child(3){transform:translateX(2px);}

.medusa-ocm-overlay{position:fixed;inset:0;z-index:9999;opacity:0;visibility:hidden;background:rgba(255,255,255,.7);backdrop-filter:blur(24px);display:flex;flex-direction:column;overflow:auto;}
.medusa-ocm-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;max-width:1200px;margin:0 auto;width:100%;padding:0;}
.medusa-ocm-brand{opacity:.9;}
.medusa-ocm-logo-text{font-family:Georgia,serif;font-weight:800;letter-spacing:.08em;font-size:28px;color:#1A365D;}
.medusa-ocm-logo-image{max-height:56px;width:auto;display:block;}
.medusa-ocm-logo-subline{margin-top:6px;font-size:10px;color:#94a3b8;letter-spacing:.25em;text-transform:uppercase;}

.medusa-ocm-close{display:flex;align-items:center;gap:14px;background:transparent;border:0;cursor:pointer;padding:10px 0;}
.medusa-ocm-close-label{font-size:9px;font-weight:800;letter-spacing:.5em;text-transform:uppercase;color:#cbd5e1;display:none;}
@media (min-width:640px){.medusa-ocm-close-label{display:inline;}}
.medusa-ocm-close-icon{position:relative;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;}
.medusa-ocm-close-line{position:absolute;width:22px;height:1px;background:#1A365D;transition:transform .5s ease, background .2s ease;}
.medusa-ocm-close-line:first-child{transform:rotate(45deg);}
.medusa-ocm-close-line:last-child{transform:rotate(-45deg);}

.medusa-ocm-body{max-width:1200px;margin:0 auto;width:100%;padding:60px 0;flex:1;display:flex;align-items:center;}
.medusa-ocm-grid{display:grid;grid-template-columns:1fr;gap:40px;width:100%;align-items:center;}
@media (min-width:1024px){.medusa-ocm-grid{grid-template-columns:7fr 5fr;gap:70px;}}

.medusa-ocm-links{display:flex;flex-direction:column;gap:18px;}
.medusa-ocm-link{display:flex;flex-direction:column;}
.medusa-ocm-link-row{display:flex;align-items:center;gap:18px;}
.medusa-ocm-id{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#cbd5e1;min-width:34px;}

.medusa-ocm-main{position:relative;display:inline-flex;align-items:center;gap:10px;background:transparent;border:0;padding:0;margin:0;cursor:pointer;text-decoration:none;}
.medusa-ocm-main-label{font-size:26px;font-weight:900;letter-spacing:-.02em;text-transform:uppercase;font-style:italic;color:#1A365D;line-height:1.1;}
@media (min-width:768px){.medusa-ocm-main-label{font-size:34px;}}

.medusa-ocm-underline{position:absolute;left:0;bottom:-6px;width:100%;height:2px;background:#A82025;transform:scaleX(0);transform-origin:left;transition:transform .7s ease;}
.medusa-ocm-link:hover .medusa-ocm-underline{transform:scaleX(1);}

.medusa-ocm-chevron{font-size:20px;opacity:.25;transform:translateY(1px);transition:transform .3s ease, opacity .3s ease,color .3s ease;}
.medusa-ocm-link[data-has-sub="1"]:hover .medusa-ocm-chevron{opacity:1;transform:translateY(1px) rotate(90deg);color:#A82025;}

.medusa-ocm-sub{margin-left:52px;max-width:520px;overflow:hidden;height:0;opacity:0;}
.medusa-ocm-sub-inner{display:flex;flex-direction:column;gap:12px;padding:18px 0 6px;}
.medusa-ocm-sub-inner, .medusa-ocm-sub-inner *{list-style:none;}
.medusa-ocm-sub-link{display:flex;align-items:center;gap:14px;text-decoration:none;}
.medusa-ocm-sub-icon{display:inline-flex;align-items:center;justify-content:center;min-width:34px;color:#cbd5e1;font-size:12px;line-height:1;}
.medusa-ocm-sub-icon i{line-height:1;}
.medusa-ocm-sub-icon svg{display:block;width:100%;height:100%;}
.medusa-ocm-sub-icon img{display:block;width:100%;height:100%;object-fit:contain;}
.medusa-ocm-sub-icon--empty{opacity:0;}
.medusa-ocm-sub-label{font-size:14px;font-weight:800;font-style:italic;color:#94a3b8;letter-spacing:-.01em;}
.medusa-ocm-sub-underline{display:none;}
.medusa-ocm-sub-link:hover .medusa-ocm-sub-label{color:#1A365D;}

.medusa-ocm-side{display:none;}
@media (min-width:1024px){.medusa-ocm-side{display:block;}}
.medusa-ocm-side-card{position:relative;aspect-ratio:4/5;max-height:55vh;overflow:hidden;border:1px solid #e2e8f0;background:#f1f5f9;box-shadow:0 30px 80px -20px rgba(2,6,23,.12);filter:grayscale(1);transition:filter .7s ease;}
.medusa-ocm-side-card:hover{filter:grayscale(0);}
.medusa-ocm-side-img{position:absolute;inset:0;width:100%;height:100%;transform:scale(1.02);transition:transform 2s ease;display:block;}
.medusa-ocm-side-card:hover .medusa-ocm-side-img{transform:scale(1.10);}
.medusa-ocm-side-overlay{position:absolute;inset:0;background:rgba(26,54,93,.10);mix-blend-mode:multiply;transition:background .7s ease;}
.medusa-ocm-side-card:hover .medusa-ocm-side-overlay{background:transparent;}
.medusa-ocm-side-top{position:absolute;left:22px;top:22px;display:flex;flex-direction:column;gap:10px;color:#fff;}
.medusa-ocm-side-kicker{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:10px;letter-spacing:.45em;text-transform:uppercase;opacity:.9;text-shadow:0 2px 10px rgba(0,0,0,.2);}
.medusa-ocm-side-status{display:flex;align-items:center;gap:8px;}
.medusa-ocm-side-status .dot{width:8px;height:8px;border-radius:999px;background:#22c55e;box-shadow:0 0 0 6px rgba(34,197,94,.18);animation:medusaPulse 1.4s infinite;}
.medusa-ocm-side-status .txt{font-size:9px;font-weight:900;letter-spacing:.25em;text-transform:uppercase;opacity:.6;}
@keyframes medusaPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.12);}}

.medusa-ocm-side-meta{margin-top:14px;display:flex;justify-content:space-between;align-items:flex-start;gap:20px;}
.medusa-ocm-side-meta-title{font-size:10px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;color:#cbd5e1;font-style:italic;display:block;}
.medusa-ocm-side-meta-text{margin-top:6px;font-size:12px;color:#64748b;line-height:1.2;font-style:italic;}
.medusa-ocm-side-coord{font-size:11px;color:#e2e8f0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;}

.medusa-ocm-footer{max-width:1200px;margin:0 auto;width:100%;padding:0 0 20px;display:flex;flex-direction:column;gap:18px;}
@media (min-width:768px){.medusa-ocm-footer{flex-direction:row;justify-content:space-between;align-items:flex-end;}}

.medusa-ocm-footer-title{font-size:10px;font-weight:900;letter-spacing:.35em;text-transform:uppercase;color:#cbd5e1;margin-bottom:10px;}
.medusa-ocm-social{display:flex;gap:22px;flex-wrap:wrap;}
.medusa-ocm-social-link{display:flex;align-items:center;gap:10px;text-decoration:none;}
.medusa-ocm-social-link .ico{color:#1A365D;opacity:.9;}
.medusa-ocm-social-link .lbl{font-size:10px;font-weight:900;letter-spacing:.25em;text-transform:uppercase;color:#94a3b8;}
.medusa-ocm-social-link:hover .lbl{color:#1A365D;}
.medusa-ocm-social-link:hover .ico{color:#A82025;}

.medusa-ocm-footer-right{opacity:.35;text-align:right;}
.medusa-ocm-footer-right .l1{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:9px;letter-spacing:.35em;text-transform:uppercase;margin-bottom:8px;}
.medusa-ocm-footer-right .l2{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:9px;letter-spacing:.35em;text-transform:uppercase;}

/* Accessibility & state */
.medusa-ocm.is-open .medusa-ocm-overlay{opacity:1;visibility:visible;}

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