/** Shopify CDN: Minification failed

Line 8:11 Expected identifier but found "#12804b"
Line 10:42 Expected identifier but found "."
Line 12:59 Unexpected "("

**/
   --green:#12804b
     .hero{background:linear-gradient(...);padding:72px 0 84px;overflow:hidden}
     .hero h1{font-family:Sora,sans-serif;...}
     .announcement{background:var(--deep);display:flex;gap:18px;min-height:36px}
     .button{border-radius:12px;background:var(--green)}   (already overridden below)
   Those rules declared properties this stylesheet did not, so the values fell
   through. Pin them to the vision-board palette here. No green is used anywhere in
   this file: the vision board contains only #352B2E, #746365, #6A2238, #FDFBF7,
   #F9EEE6, #EFDED9, #ECD4B0, #D4A0AE, #D2BFE7.
   ============================================================================ */
.oc-root h1,.oc-root h2,.oc-root h3,.oc-root h4,.oc-root p,.oc-root b,.oc-root strong,
.oc-root summary,.oc-root li,.oc-root dt,.oc-root dd{color:var(--ink)}
.oc-root{color:var(--ink)}
.oc-root .hero h1,.oc-root .herocopy h1{font-family:Georgia,'Times New Roman',serif}
.oc-root .hero{padding:0;overflow:visible;background-clip:border-box}
.oc-root .announcement{display:block;min-height:0;gap:0}
.oc-root .announcement a{color:var(--softwhite);font-size:inherit;text-decoration:underline}
.oc-root .label{color:var(--muted)}
.oc-root .category{color:var(--ink)}
.oc-root .contentslist b,.oc-root .contentslist span,.oc-root .faqs summary{color:var(--ink)}
.oc-root .contentslist span{color:var(--muted)}
.oc-root .faqs summary:after{color:var(--wine)}
.oc-root .textlink{color:var(--ink)}
.oc-root .theme span{color:var(--ink)}
.oc-root .productbottom span:first-child{color:var(--ink)}
.oc-root .productbottom span:last-child{color:var(--wine)}
.oc-root .smallnote{color:var(--muted)}

:root{--wine:#6a2238;--ink:#352b2e;--sand:#ecd4b0;--blush:#efded9;--muted:#746365;--cream:#f9eee6;--softwhite:#fdfbf7;--peach:#e8c5bb;--border:#d8c0b9}
.oc-root,.oc-root *{box-sizing:border-box}
html:has(.oc-root){scroll-behavior:smooth;scroll-padding-top:30px}
body:has(.oc-root){margin:0;color:var(--ink);background:#fff;font:16px/1.65 Arial,Helvetica,sans-serif}
.oc-root button,.oc-root a{-webkit-tap-highlight-color:transparent}
.oc-root button{font:inherit;cursor:pointer}
.oc-root a{color:inherit;text-decoration:none}
.oc-root button:focus-visible,.oc-root a:focus-visible{outline:2px solid var(--wine);outline-offset:5px}
.oc-root img{display:block;max-width:100%}
.oc-root h1,.oc-root h2,.oc-root h3,.oc-root p{margin:0}
.oc-root h1,.oc-root h2,.oc-root h3{font-family:Georgia,serif;font-weight:400;letter-spacing:-.025em}
.oc-root h1{font-size:clamp(48px,4.7vw,68px);line-height:1.08}
.oc-root h2{font-size:40px;line-height:1.18}
.oc-root h3{font-size:26px;line-height:1.25}
.oc-root .wrap{width:min(1280px,calc(100% - 96px));margin:auto}
.oc-root .announcement{background:var(--sand);text-align:center;padding:9px 20px;font-size:12px;letter-spacing:.035em}
.oc-root .announcement span{margin:0 13px}
.oc-root header{height:104px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.oc-root .logo{width:175px}
.oc-root .nav{display:flex;gap:32px;align-items:center;font-size:14px}
.oc-root .nav a:hover{text-decoration:underline;text-underline-offset:5px}
.oc-root .navend{font-size:13px;display:flex;gap:16px;align-items:center}
.oc-root .tinyflower{color:#6a2238;font-size:25px}
.oc-root .menubtn{display:none;border:0;background:none;padding:8px}
.oc-root .hero{display:grid;grid-template-columns:45% 55%;background:#fdfbf7;border-radius:12px;overflow:hidden}
.oc-root .herocopy{padding:60px 40px 55px 48px;align-self:center}
.oc-root .herocopy h1{margin:24px 0}
.oc-root .herocopy h1 em{color:var(--wine);font-style:normal}
.oc-root .herocopy p{max-width:340px;color:var(--muted);margin-bottom:28px}
.oc-root .button{border:0;border-radius:999px;background:var(--wine);color:white;display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:48px;padding:14px 24px;font-size:15px;font-weight:700}
.oc-root .button:hover{background:#52192b}
.oc-root .heroimage{min-height:565px;position:relative}
.oc-root .heroimage img{height:100%;width:100%;position:absolute;object-fit:cover;object-position:55% 50%}
.oc-root .section{padding:80px 0}
.oc-root .sectionhead{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:32px}
.oc-root .sectionhead h2{margin-top:0}
.oc-root .textlink{font-size:14px;border-bottom:1px solid currentColor;padding-bottom:3px;white-space:nowrap}
.oc-root .products{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.oc-root .product{background:none;border:0;padding:0;text-align:left;color:inherit;width:100%}
.oc-root .productphoto{aspect-ratio:1;position:relative;border-radius:12px;background:#fdfbf7;padding:30px;overflow:hidden}
.oc-root .productphoto img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .2s}
.oc-root .product:hover img{transform:scale(1.035)}
.oc-root .badge{z-index:1;position:absolute;top:16px;left:16px;font-size:11px;background:var(--sand);padding:4px 10px;border-radius:5px}
.oc-root .product .category{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:19px 0 7px}
.oc-root .product h3{font-family:Arial,sans-serif;font-size:18px;letter-spacing:0;font-weight:700}
.oc-root .productbottom{display:flex;justify-content:space-between;margin-top:8px;font-size:15px}
.oc-root .productbottom span:last-child{color:var(--wine)}
.oc-root .editorial{display:grid;grid-template-columns:1fr 1fr;gap:75px;align-items:center}
.oc-root .editorialart{background:#fdfbf7;border-radius:12px;padding:45px;position:relative}
.oc-root .editorialart img{max-height:360px;object-fit:contain;width:100%;mix-blend-mode:multiply}
.oc-root .editorialart .label{position:absolute;bottom:20px;right:20px;background:var(--sand);padding:7px 15px;font-size:13px;transform:rotate(-4deg)}
.oc-root .editorial h2{margin:18px 0 24px}
.oc-root .editorial p{color:var(--muted);margin-bottom:24px;max-width:410px}
.oc-root .closing{text-align:center;background:#fdfbf7;padding:64px 24px;border-radius:12px}
.oc-root .closing h2{font-size:48px}
.oc-root .closing p{margin:18px auto 25px;max-width:430px;color:var(--muted)}
.oc-root footer{padding:60px 0 24px}
.oc-root .footertop{display:flex;justify-content:space-between;gap:40px;align-items:center;padding-bottom:36px}
.oc-root .footerlogo{width:280px}
.oc-root .footerlinks{display:flex;gap:30px;font-size:14px}
.oc-root .mobilemenu{display:none}@media(min-width:1500px){
  .oc-root .heroimage{min-height:610px}
  .oc-root .herocopy{padding-left:60px}}@media(max-width:1023px){
  .oc-root .wrap{width:calc(100% - 64px)}
  .oc-root .nav{gap:20px}
  .oc-root .navend{display:none}
  .oc-root .herocopy{padding:36px 28px}
  .oc-root .heroimage{min-height:520px}
  .oc-root .editorial{gap:40px}
  .oc-root .productphoto{padding:20px}}@media(max-width:767px){
  .oc-root .wrap{width:calc(100% - 40px)}
  .oc-root header{height:82px}
  .oc-root .logo{width:145px}
  .oc-root .nav{display:none}
  .oc-root .menubtn{display:block}
  .oc-root .mobilemenu.open{display:flex;padding:0 20px 22px;gap:20px;flex-wrap:wrap;font-size:14px}
  .oc-root .announcement{font-size:11px}
  .oc-root .announcement span{margin:0 6px}
  .oc-root .hero{grid-template-columns:1fr}
  .oc-root .herocopy{padding:36px 24px}
  .oc-root .herocopy h1{font-size:40px;line-height:1.12;margin:20px 0}
  .oc-root .herocopy p{font-size:16px}
  .oc-root .heroimage{min-height:340px}
  .oc-root .section{padding:48px 0}
  .oc-root .sectionhead{display:block;margin-bottom:24px}
  .oc-root h2{font-size:30px}
  .oc-root .sectionhead .textlink{display:inline-block;margin-top:20px}
  .oc-root .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
  .oc-root .productphoto{padding:15px;border-radius:10px}
  .oc-root .product h3{font-size:17px}
  .oc-root .badge{font-size:9px;top:8px;left:8px}
  .oc-root .product .category{font-size:9px;margin-top:14px}
  .oc-root .productbottom{font-size:14px}
  .oc-root .editorial{grid-template-columns:1fr;gap:32px}
  .oc-root .editorialart{padding:35px}
  .oc-root .closing{padding:40px 24px}
  .oc-root .closing h2{font-size:34px}
  .oc-root .footertop{display:block}
  .oc-root .footerlogo{width:280px;max-width:100%}
  .oc-root .footerlinks{margin-top:28px;flex-wrap:wrap;gap:20px}}@media(max-width:359px){
  .oc-root .products{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){
  html:has(.oc-root){scroll-behavior:auto}
  .oc-root,.oc-root *{transition:none!important}}
.oc-root header{height:96px}
.oc-root .logo{width:190px}
.oc-root .hero{border-radius:0;grid-template-columns:43% 57%;background:#efded9}
.oc-root .hero>.herocopy{padding:58px 45px 58px 60px}
.oc-root .hero h1{font-size:clamp(50px,5.4vw,80px);line-height:1.02}
.oc-root .hero h1 em{font-style:italic}
.oc-root .herocopy p{font-size:18px;line-height:1.6}
.oc-root .heroimage{background:#e8c5bb;min-height:615px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 35px}
.oc-root .heroimage img{position:static;width:auto;height:370px;max-width:85%;object-fit:contain;box-shadow:8px 12px 22px #6a223822;transform:rotate(4deg)}
.oc-root .herotitle{font-family:Georgia,serif;font-style:italic;font-size:64px;line-height:1;color:#6a2238;margin-bottom:26px}
.oc-root .herocaption{margin-top:30px;font-size:11px;letter-spacing:.12em;text-align:center}
.oc-root .herocaption span{display:block;font-family:Georgia,serif;font-size:20px;letter-spacing:0;margin-top:5px}
.oc-root main>.wrap:first-child{width:100%;max-width:none}
.oc-root #projects{width:min(1280px,calc(100% - 96px));margin:auto;padding-top:56px}
.oc-root .roundreasons{display:flex;justify-content:center;gap:72px;padding:32px 24px;background:white;border-bottom:1px solid #e4d1c7}
.oc-root .roundreasons>div{text-align:center;display:flex;align-items:center;gap:13px}
.oc-root .roundreasons span{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#efded9;color:#6a2238;font-size:29px}
.oc-root .roundreasons>div:nth-child(2) span,.oc-root .roundreasons>div:nth-child(4) span{background:#ecd4b0}
.oc-root .roundreasons b{font-size:13px;font-weight:400}
.oc-root .filters{display:flex;gap:10px;margin:0 0 26px}
.oc-root .filters button{border:1px solid #d8c0b9;background:white;border-radius:999px;padding:8px 18px;font-size:13px;color:var(--ink)}
.oc-root .filters button.active{background:var(--ink);color:white;border-color:var(--ink)}
.oc-root .product[hidden]{display:none}
.oc-root .productphoto{padding:20px;border-radius:3px}
.oc-root .badge{border-radius:0}
.oc-root .themes{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.oc-root .theme{display:grid;grid-template-columns:48% 52%;background:#efded9;align-items:center;overflow:hidden}
.oc-root .theme:nth-child(2){background:#ebd7cc}
.oc-root .theme img{width:100%;height:310px;object-fit:cover}
.oc-root .theme>div{padding:24px}
.oc-root .theme h3{font-size:32px;margin-bottom:14px}
.oc-root .theme span{font-size:13px}
.oc-root .theme:hover h3{text-decoration:underline;text-underline-offset:5px}
.oc-root .editorialart{padding:0;border-radius:0;overflow:hidden}
.oc-root .editorialart img{max-height:none;height:510px;object-fit:cover;mix-blend-mode:normal}
.oc-root .editorialart .label{background:white;transform:none}
.oc-root .closing{background:#efded9;border-radius:0}
.oc-root .closing h2{font-size:54px}
.oc-root .footertop{padding-top:0}
.oc-root .button{border-radius:6px}@media(max-width:1023px){
  .oc-root .roundreasons{gap:24px}
  .oc-root .roundreasons>div{display:block}
  .oc-root .roundreasons span{margin:0 auto 8px}
  .oc-root .theme{grid-template-columns:1fr}
  .oc-root .theme img{height:320px}
  .oc-root .hero>.herocopy{padding:40px 28px}
  .oc-root .heroimage{min-height:570px}
  .oc-root .herotitle{font-size:52px}
  .oc-root .heroimage img{height:320px}
  .oc-root .hero h1{font-size:58px}}@media(max-width:767px){
  .oc-root header{height:82px}
  .oc-root .logo{width:155px}
  .oc-root .hero{grid-template-columns:1fr}
  .oc-root .hero>.herocopy{text-align:center;padding:36px 24px 30px}
  .oc-root .hero h1{font-size:46px;line-height:1.08;margin:16px 0}
  .oc-root .herocopy p{font-size:16px;margin-left:auto;margin-right:auto}
  .oc-root .heroimage{min-height:430px;padding:26px 24px}
  .oc-root .heroimage img{height:270px;max-width:80%}
  .oc-root .herotitle{font-size:46px;margin-bottom:22px}
  .oc-root .herocaption{margin-top:23px}
  .oc-root .herocaption span{font-size:18px}
  .oc-root .roundreasons{display:grid;grid-template-columns:repeat(4,1fr);padding:22px 15px;gap:10px}
  .oc-root .roundreasons span{height:45px;width:45px;font-size:24px}
  .oc-root .roundreasons b{font-size:11px;line-height:1.35;display:block}
  .oc-root #projects{width:calc(100% - 40px);padding-top:40px}
  .oc-root .filters{gap:6px;flex-wrap:wrap}
  .oc-root .filters button{padding:7px 12px;font-size:12px}
  .oc-root .products{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:15px;gap:16px}
  .oc-root .product{flex:0 0 76%;scroll-snap-align:start}
  .oc-root .productphoto{padding:18px}
  .oc-root .themes{gap:16px}
  .oc-root .theme img{height:195px}
  .oc-root .theme>div{padding:20px 14px}
  .oc-root .theme h3{font-size:24px}
  .oc-root .theme span{font-size:12px}
  .oc-root .editorialart img{height:380px}
  .oc-root .closing h2{font-size:38px}}
body:has(.oc-root){background:#f9eee6;color:#352b2e}
.oc-root .announcement{background:#6a2238;color:#fdfbf7}
.oc-root header{background:#fdfbf7;width:100%!important;padding-left:max(32px,calc((100% - 1280px)/2));padding-right:max(32px,calc((100% - 1280px)/2))}
.oc-root .hero{background:#f3e3d9}
.oc-root .heroimage{background:#e8c5bb}
.oc-root .herotitle{color:#6a2238}
.oc-root .roundreasons{background:#fdfbf7}
.oc-root .roundreasons span{background:#efded9;color:#6a2238}
.oc-root .roundreasons>div:nth-child(2) span,.oc-root .roundreasons>div:nth-child(4) span{background:#ecd4b0}
.oc-root .productphoto{background:#fdfbf7}
.oc-root .badge{background:#ead7bd;color:#503339}
.oc-root .filters button{background:transparent}
.oc-root .filters button.active{background:#6a2238;border-color:#6a2238}
.oc-root .theme{background:#efded9}
.oc-root .theme:nth-child(2){background:#ebd7cc}
.oc-root .closing{background:#efded9}
.oc-root .editorialart .label{background:#fdfbf7}
.oc-root footer.wrap{width:100%;max-width:none;background:#d2bfe7;padding:45px max(32px,calc((100% - 1280px)/2)) 24px;margin-top:60px}
.oc-root .theme:hover h3{color:#6a2238}
.oc-root .category{font-size:12px!important}
.oc-root .badge{font-size:12px!important}
.oc-root .roundreasons b{font-size:14px}
.oc-root .textlink,.oc-root .theme span{font-size:14px}
.oc-root .filters button{font-size:14px}
.oc-root .tinyflower{color:#6a2238}@media(max-width:767px){
  .oc-root header{padding:0 20px}
  .oc-root .roundreasons b{font-size:12px}
  .oc-root .filters button{font-size:13px}
  .oc-root .badge{font-size:12px}
  .oc-root .herocaption{font-size:12px}
  .oc-root .theme span{font-size:14px}
  .oc-root footer.wrap{padding:40px 20px 24px;margin-top:40px}}
.oc-root .watch{background:#efded9}
.oc-root .sectionintro{color:#746365;max-width:300px}
.oc-root .videos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.oc-root .videos figure{margin:0}
.oc-root .videos video{display:block;width:100%;aspect-ratio:9/16;object-fit:contain;background:#352b2e;border-radius:8px}
.oc-root .videos h3{font-size:25px;margin:18px 0 8px}
.oc-root .videos figcaption p{font-size:15px;color:#746365}
.oc-root .unpacked{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.oc-root .kitphoto{position:relative;background:#fdfbf7;padding:18px}
.oc-root .kitphoto img{width:100%;height:auto}
.oc-root .kitphoto>span{display:block;font-size:13px;margin-top:14px;color:#746365}
.oc-root .unpacked h2{margin:16px 0 20px}
.oc-root .unpacked p{color:#746365}
.oc-root .contentslist{list-style:none;margin:24px 0;padding:0}
.oc-root .contentslist li{padding:14px 0;border-top:1px solid #d8c0b9}
.oc-root .contentslist b,.oc-root .contentslist span{display:block}
.oc-root .contentslist b{font-size:16px;font-weight:700}
.oc-root .contentslist span{font-size:15px;color:#746365;margin-top:3px}
.oc-root .smallnote{font-size:13px;line-height:1.6;margin-bottom:20px}
.oc-root .questions{display:grid;grid-template-columns:1fr 1.3fr;gap:75px;border-top:1px solid #d8c0b9}
.oc-root .questions h2{margin:16px 0 20px}
.oc-root .questions>div>p{color:#746365}
.oc-root .faqs details{border-bottom:1px solid #d8c0b9}
.oc-root .faqs summary{font-size:16px;font-weight:700;cursor:pointer;padding:20px 30px 20px 0;position:relative;list-style:none}
.oc-root .faqs summary::-webkit-details-marker{display:none}
.oc-root .faqs summary:after{content:'+';position:absolute;right:4px;font-size:22px;top:15px;color:#6a2238}
.oc-root .faqs details[open] summary:after{content:'−'}
.oc-root .faqs details p{font-size:16px;line-height:1.65;padding:0 16px 22px 0;color:#746365}
.oc-root .faqs summary:focus-visible{outline:2px solid #6a2238;outline-offset:3px}
.oc-root #themes{padding-top:0}
.oc-root .editorial{border-top:1px solid #d8c0b9}
.oc-root .closing{padding:45px 24px}@media(max-width:767px){
  .oc-root .sectionintro{margin-top:16px}
  .oc-root .videos{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding-bottom:15px}
  .oc-root .videos figure{flex:0 0 83%;scroll-snap-align:start}
  .oc-root .videos h3{font-size:24px}
  .oc-root .videos video{aspect-ratio:9/16}
  .oc-root .unpacked,.oc-root .questions{grid-template-columns:1fr;gap:28px}
  .oc-root .kitphoto{padding:10px}
  .oc-root .questions{padding-top:40px}
  .oc-root .smallnote{font-size:14px}
  .oc-root .contentslist span{font-size:16px}
  .oc-root .questions h2{font-size:30px}
  .oc-root .closing h2{font-size:36px}}

/* ---- additions for the production build (not in the reference HTML) ---- */
/* Editor-only hint when a block has no product/image/video chosen yet. MD 3:
   没有绑定商品的 block 在消费者页面不显示，编辑器显示待选商品提示。 */
.oc-root .oc-placeholder{border:1px dashed var(--border);border-radius:12px;background:var(--softwhite);
  color:var(--muted);font-size:14px;line-height:1.5;padding:32px 20px;text-align:center}
/* Empty filter state. MD 3: 无匹配显示 No designs in this selection. 并提供 All designs */
.oc-root .oc-products-empty{font-size:16px;line-height:1.65;color:var(--muted);padding:28px 0}
.oc-root .oc-products-empty[hidden]{display:none}
.oc-root .oc-products-empty .textlink{font:inherit;background:none;border:0;padding:0;cursor:pointer}
/* Rich text from section settings keeps the reference paragraph styling. */
.oc-root .oc-richtext p{color:var(--muted);margin-bottom:20px;max-width:430px}
.oc-root .oc-richtext p:last-child{margin-bottom:0}
.oc-root .faqs .oc-richtext{padding:0 16px 22px 0}
.oc-root .faqs .oc-richtext p{font-size:16px;line-height:1.65;color:var(--muted);max-width:none;margin:0}
/* Video that fails to load: understandable message, never a fake play button. MD 3/05 */
.oc-root figure.oc-video-failed video{display:none}
.oc-root figure.oc-video-failed::before{content:'This video could not be loaded.';display:grid;place-items:center;
  aspect-ratio:9/16;background:#352b2e;color:#fdfbf7;border-radius:8px;font-size:14px;text-align:center;padding:16px}
/* No small all-caps label line above any section heading, anywhere, ever.
   A section heading now starts its own block, so the reference's 12px heading top
   margin is dropped and the hero H1 starts the hero. */
.oc-root .sectionhead h2{margin-top:0}
.oc-root .herocopy h1{margin-top:0}

/* Bag entry in the craft header. The v8 homepage reference had none; the PDP needs a real cart
   link, so oc-header renders this when its "Show bag link" setting is on. */
.oc-root .bag{display:inline-flex;align-items:center;gap:8px;color:inherit;text-decoration:none;
  font:400 15px/1.2 Arial,Helvetica,sans-serif;min-height:44px;padding:8px 0}
.oc-root .bag:hover{text-decoration:underline;text-underline-offset:5px}
.oc-root .bag span{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 7px;
  border-radius:999px;background:var(--wine);color:var(--softwhite);font:700 12px/1 Arial,Helvetica,sans-serif}

/* Footer legal line. The class name comes from the reference; the rule was dropped during the
   earlier cleanup, so it is restored here scoped to .oc-root. */
.oc-root .previewnote{font-size:12px;line-height:1.6;color:var(--secondary);border-top:1px solid var(--border);
  padding-top:20px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
@media (max-width:767px){.oc-root .previewnote{display:block}.oc-root .previewnote>div+div{margin-top:10px}}

/* ---------------------------------------------------------------------------
   Nav dropdown groups. oc-header renders each panel as .oc-nav-children.
   On desktop the parent is a plain element, NOT <details>: a closed <details> hides its content with
   content-visibility in current Chrome, which no child display rule can override — that is why hovering
   did nothing and only clicking the caret worked. Hover / focus drives it instead.
   In the mobile drawer it stays a <details>, where click-to-expand is the right behaviour.
   --------------------------------------------------------------------------- */
.oc-root .nav .oc-nav-group{position:relative;display:flex;align-items:center}
.oc-root .nav .oc-nav-group>a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.oc-root .nav .oc-nav-group>a::after{content:'';width:6px;height:6px;flex:none;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform .18s ease}
.oc-root .nav .oc-nav-group:hover>a::after,
.oc-root .nav .oc-nav-group:focus-within>a::after{transform:rotate(-135deg) translateY(-1px)}
/* margin-top MUST stay 0: any gap between the link and the panel is a strip that belongs to neither,
   hover drops while crossing it, and because the panel is display:none by then it can never be reached. */
.oc-root .nav .oc-nav-children{position:absolute;left:-16px;top:100%;z-index:40;min-width:220px;margin-top:0;
  padding:10px;background:var(--softwhite);border:1px solid var(--border);border-radius:10px;
  box-shadow:0 14px 34px rgba(53,43,46,.12);display:none;flex-direction:column;gap:2px}
/* invisible strip that keeps the pointer inside the group on the way down, in case anything ever
   offsets the panel again */
.oc-root .nav .oc-nav-group::after{content:'';position:absolute;left:-20px;top:100%;width:245px;height:14px}
.oc-root .nav .oc-nav-children a{padding:9px 12px;border-radius:6px;white-space:nowrap}
.oc-root .nav .oc-nav-children a:hover{background:var(--cream);text-decoration:none}
.oc-root .nav .oc-nav-group:focus-within>.oc-nav-children{display:flex}
@media (hover:hover){.oc-root .nav .oc-nav-group:hover>.oc-nav-children{display:flex}}
/* mobile drawer: a <details> that expands in place */
.oc-root .mobilemenu .oc-nav-group{display:block}
.oc-root .mobilemenu .oc-nav-group>summary{display:flex;align-items:center;justify-content:space-between;list-style:none}
.oc-root .mobilemenu .oc-nav-group>summary::-webkit-details-marker{display:none}
.oc-root .mobilemenu .oc-nav-group>summary::after{content:'';width:6px;height:6px;flex:none;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.oc-root .mobilemenu .oc-nav-group[open]>summary::after{transform:rotate(-135deg)}
.oc-root .mobilemenu .oc-nav-children{display:grid;padding:0 0 10px 12px}
